oc-template-preact-compiler 0.3.0 → 0.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/compile.d.ts +1 -3
- package/dist/lib/compile.js +4 -25
- package/package.json +5 -13
- package/dist/lib/htmlTemplate.d.ts +0 -6
- package/dist/lib/htmlTemplate.js +0 -33
- package/dist/scaffold/src/src/App.d.ts +0 -2
- package/dist/scaffold/src/src/App.js +0 -30
- package/dist/scaffold/src/src/App.test.d.ts +0 -1
- package/dist/scaffold/src/src/App.test.js +0 -25
- package/dist/scaffold/src/src/server.d.ts +0 -3
- package/dist/scaffold/src/src/server.js +0 -28
- package/dist/scaffold/src/src/types.d.ts +0 -13
- package/dist/scaffold/src/src/types.js +0 -2
- package/dist/scaffold/src/vite.config.d.ts +0 -2
- package/dist/scaffold/src/vite.config.js +0 -12
package/dist/lib/compile.d.ts
CHANGED
|
@@ -1,3 +1 @@
|
|
|
1
|
-
|
|
2
|
-
export type CompilerOptions = ReturnType<typeof createCompile>;
|
|
3
|
-
export declare const compile: CompilerOptions;
|
|
1
|
+
export declare const compile: (options: import("oc-generic-template-compiler").CompilerOptions, callback: (err: Error | null, data: unknown) => void) => void;
|
package/dist/lib/compile.js
CHANGED
|
@@ -4,33 +4,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.compile = void 0;
|
|
7
|
-
const oc_generic_template_compiler_1 = require("oc-generic-template-compiler");
|
|
8
|
-
const oc_statics_compiler_1 = __importDefault(require("oc-statics-compiler"));
|
|
9
7
|
const oc_template_preact_1 = require("oc-template-preact");
|
|
10
|
-
const oc_vite_compiler_1 = require("oc-vite-compiler");
|
|
11
8
|
const preset_vite_1 = require("@preact/preset-vite");
|
|
9
|
+
const oc_vite_compiler_1 = require("oc-vite-compiler");
|
|
12
10
|
const preactOCProviderTemplate_1 = __importDefault(require("./preactOCProviderTemplate"));
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
...options,
|
|
17
|
-
plugins: [(0, preset_vite_1.preact)()],
|
|
18
|
-
viewWrapper: ({ viewPath }) => (0, preactOCProviderTemplate_1.default)({ viewPath }),
|
|
19
|
-
htmlTemplate: htmlTemplate_1.default,
|
|
20
|
-
externals: (0, oc_template_preact_1.getInfo)().externals
|
|
21
|
-
}, cb),
|
|
22
|
-
compileServer: oc_vite_compiler_1.viteServer,
|
|
23
|
-
compileStatics: oc_statics_compiler_1.default,
|
|
11
|
+
exports.compile = (0, oc_vite_compiler_1.createCompile)({
|
|
12
|
+
plugins: [(0, preset_vite_1.preact)()],
|
|
13
|
+
viewWrapper: preactOCProviderTemplate_1.default,
|
|
24
14
|
getInfo: oc_template_preact_1.getInfo
|
|
25
15
|
});
|
|
26
|
-
// OPTIONS
|
|
27
|
-
// =======
|
|
28
|
-
// componentPath
|
|
29
|
-
// componentPackage,
|
|
30
|
-
// logger,
|
|
31
|
-
// minify
|
|
32
|
-
// ocPackage
|
|
33
|
-
// publishPath
|
|
34
|
-
// verbose,
|
|
35
|
-
// watch,
|
|
36
|
-
// production
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "oc-template-preact-compiler",
|
|
3
|
-
"version": "0.3.
|
|
4
|
-
"description": "",
|
|
3
|
+
"version": "0.3.2",
|
|
4
|
+
"description": "Compiler for the Preact OC template",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"scripts": {
|
|
@@ -30,15 +30,9 @@
|
|
|
30
30
|
"license": "MIT",
|
|
31
31
|
"dependencies": {
|
|
32
32
|
"@preact/preset-vite": "^2.5.0",
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"oc-generic-template-compiler": "2.1.0",
|
|
37
|
-
"oc-statics-compiler": "2.1.1",
|
|
38
|
-
"oc-template-preact": "0.1.0",
|
|
39
|
-
"oc-vite-compiler": "3.0.0",
|
|
40
|
-
"preact": "^10",
|
|
41
|
-
"resolve": "^1.20.0"
|
|
33
|
+
"oc-template-preact": "^0.1.0",
|
|
34
|
+
"oc-vite-compiler": "^3.2.0",
|
|
35
|
+
"preact": "^10"
|
|
42
36
|
},
|
|
43
37
|
"peerDependencies": {
|
|
44
38
|
"preact": "^10"
|
|
@@ -48,8 +42,6 @@
|
|
|
48
42
|
"scaffold"
|
|
49
43
|
],
|
|
50
44
|
"devDependencies": {
|
|
51
|
-
"@types/cssesc": "^3.0.2",
|
|
52
|
-
"lodash": "^4.17.4",
|
|
53
45
|
"prettier": "^2.3.2",
|
|
54
46
|
"prettier-config-guestline": "2.0.0"
|
|
55
47
|
}
|
package/dist/lib/htmlTemplate.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const cssesc_1 = __importDefault(require("cssesc"));
|
|
7
|
-
function viewTemplate({ templateId, css, bundle, hash }) {
|
|
8
|
-
return `function(model){
|
|
9
|
-
var modelHTML = model.__html ? model.__html : '';
|
|
10
|
-
var staticPath = model.component.props._staticPath;
|
|
11
|
-
var props = JSON.stringify(model.component.props);
|
|
12
|
-
window.oc = window.oc || {};
|
|
13
|
-
window.oc.__typescriptReactTemplate = window.oc.__typescriptReactTemplate || { count: 0 };
|
|
14
|
-
oc.preactComponents = oc.preactComponents || {};
|
|
15
|
-
oc.preactComponents['${hash}'] = oc.preactComponents['${hash}'] || (${bundle});
|
|
16
|
-
var count = window.oc.__typescriptReactTemplate.count;
|
|
17
|
-
var templateId = "${templateId}-" + count;
|
|
18
|
-
window.oc.__typescriptReactTemplate.count++;
|
|
19
|
-
return '<div id="' + templateId + '" class="${templateId}">' + modelHTML + '</div>' +
|
|
20
|
-
'${css ? '<style>' + (0, cssesc_1.default)(css) + '</style>' : ''}' +
|
|
21
|
-
'<script>' +
|
|
22
|
-
'window.oc = window.oc || {};' +
|
|
23
|
-
'oc.cmd = oc.cmd || [];' +
|
|
24
|
-
'oc.cmd.push(function(oc){' +
|
|
25
|
-
'${css ? "oc.events.fire(\\'oc:cssDidMount\\', \\'" + css + "\\');" : ''}' +
|
|
26
|
-
'var targetNode = document.getElementById("' + templateId + '");' +
|
|
27
|
-
'targetNode.setAttribute("id","");' +
|
|
28
|
-
'oc.preactComponents["${hash}"](' + props + ', targetNode);' +
|
|
29
|
-
'});' +
|
|
30
|
-
'</script>'
|
|
31
|
-
}`;
|
|
32
|
-
}
|
|
33
|
-
exports.default = viewTemplate;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
7
|
-
const hooks_1 = require("preact/hooks");
|
|
8
|
-
const useData_1 = require("oc-template-preact-compiler/utils/useData");
|
|
9
|
-
const styles_css_1 = __importDefault(require("./styles.css"));
|
|
10
|
-
const App = () => {
|
|
11
|
-
const { firstName, lastName, userId, getData, getSetting } = (0, useData_1.useData)();
|
|
12
|
-
const staticPath = getSetting('staticPath');
|
|
13
|
-
const [additionalData, setAdditionalData] = (0, hooks_1.useState)(null);
|
|
14
|
-
const [error, setError] = (0, hooks_1.useState)('');
|
|
15
|
-
const fetchMoreData = async () => {
|
|
16
|
-
setError('');
|
|
17
|
-
try {
|
|
18
|
-
const data = await getData({ userId, getMoreData: true });
|
|
19
|
-
setAdditionalData(data);
|
|
20
|
-
}
|
|
21
|
-
catch (err) {
|
|
22
|
-
setError(String(err));
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
if (error) {
|
|
26
|
-
return (0, jsx_runtime_1.jsx)("div", { children: "Something wrong happened!" });
|
|
27
|
-
}
|
|
28
|
-
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" })] }));
|
|
29
|
-
};
|
|
30
|
-
exports.default = App;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
7
|
-
const vitest_1 = require("vitest");
|
|
8
|
-
const react_1 = require("@testing-library/react");
|
|
9
|
-
const useData_1 = require("oc-template-preact-compiler/utils/useData");
|
|
10
|
-
const App_1 = __importDefault(require("./App"));
|
|
11
|
-
const getData = vitest_1.vi.fn();
|
|
12
|
-
(0, vitest_1.describe)('App - Page', () => {
|
|
13
|
-
(0, vitest_1.beforeEach)(() => {
|
|
14
|
-
window.oc = { events: { on: vitest_1.vi.fn(), fire: vitest_1.vi.fn() } };
|
|
15
|
-
});
|
|
16
|
-
(0, vitest_1.afterEach)(() => {
|
|
17
|
-
vitest_1.vi.restoreAllMocks();
|
|
18
|
-
});
|
|
19
|
-
(0, vitest_1.it)('Gets more data when clicking the button', () => {
|
|
20
|
-
getData.mockImplementationOnce(() => Promise.resolve({}));
|
|
21
|
-
(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 }) }));
|
|
22
|
-
const extraInfoButton = react_1.screen.getByText(/Get extra information/i);
|
|
23
|
-
(0, vitest_1.expect)(extraInfoButton).toBeTruthy();
|
|
24
|
-
});
|
|
25
|
-
});
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.data = void 0;
|
|
4
|
-
const database = [
|
|
5
|
-
{ name: 'John Doe', age: 34, hobbies: ['Swimming', 'Basketball'] },
|
|
6
|
-
{ name: 'Jane Doe', age: 35, hobbies: ['Running', 'Rugby'] }
|
|
7
|
-
];
|
|
8
|
-
async function getUser(userId) {
|
|
9
|
-
return database[userId];
|
|
10
|
-
}
|
|
11
|
-
async function data(context, callback) {
|
|
12
|
-
const { userId } = context.params;
|
|
13
|
-
const user = await getUser(userId);
|
|
14
|
-
const shouldGetMoreData = context.params.getMoreData;
|
|
15
|
-
const [firstName, lastName] = user.name.split(/\s+/);
|
|
16
|
-
if (shouldGetMoreData) {
|
|
17
|
-
return callback(null, {
|
|
18
|
-
age: user.age,
|
|
19
|
-
hobbies: user.hobbies
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
return callback(null, {
|
|
23
|
-
userId,
|
|
24
|
-
firstName,
|
|
25
|
-
lastName
|
|
26
|
-
});
|
|
27
|
-
}
|
|
28
|
-
exports.data = data;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
export interface OcParameters {
|
|
2
|
-
userId: number;
|
|
3
|
-
getMoreData?: boolean;
|
|
4
|
-
}
|
|
5
|
-
export interface AdditionalData {
|
|
6
|
-
hobbies: string[];
|
|
7
|
-
age: number;
|
|
8
|
-
}
|
|
9
|
-
export interface ClientProps extends Partial<AdditionalData> {
|
|
10
|
-
userId: number;
|
|
11
|
-
firstName: string;
|
|
12
|
-
lastName: string;
|
|
13
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const vite_1 = require("vite");
|
|
4
|
-
// https://vitejs.dev/config/
|
|
5
|
-
exports.default = (0, vite_1.defineConfig)({
|
|
6
|
-
// Add your own plugins here for thinkgs like eslint or typecheckers
|
|
7
|
-
plugins: [],
|
|
8
|
-
// @ts-ignore Missing test property
|
|
9
|
-
test: {
|
|
10
|
-
environment: 'jsdom'
|
|
11
|
-
}
|
|
12
|
-
});
|