buner 1.0.0 → 1.0.1

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.
Files changed (7) hide show
  1. package/bin/buner.js +3 -3
  2. package/cli/helpers/format-files.ts +2 -2
  3. package/index.html +1 -1
  4. package/package.json +1 -1
  5. package/xpack/filename.ts +1 -1
  6. package/xpack/react-loader-init.tsx +4 -0
  7. package/xpack/react-loader.tsx +54 -0
package/bin/buner.js CHANGED
@@ -13,7 +13,7 @@ import { globby } from "globby";
13
13
  import { exec } from "node:child_process";
14
14
  import validateProjectName from "validate-npm-package-name";
15
15
  const name = "buner";
16
- const version = "1.0.0";
16
+ const version = "1.0.1";
17
17
  const description = "Frontend build toolkit for Vite + React SSR projects — SCSS pipeline, prerender, SSR dev server, and backend integration.";
18
18
  const type = "module";
19
19
  const license = "MIT";
@@ -214,8 +214,8 @@ const formatFiles = async (root) => {
214
214
  filePath = path.join(root, "src/react-loader.tsx");
215
215
  data = await fs$1.readFile(filePath, "utf8");
216
216
  data = data.replace(
217
- /const blocks((?!};).)*};/s,
218
- "const blocks: { [name: string]: any } = {\n root: lazy(() => import('./organisms/root/Root')),\n};"
217
+ /export const blocks((?!};).)*};/s,
218
+ "export const blocks: { [name: string]: any } = {\n root: lazy(() => import('./organisms/root/Root')),\n};"
219
219
  );
220
220
  await fs$1.writeFile(filePath, data);
221
221
  filePath = path.join(root, "src/_types/atoms.d.ts");
package/cli/helpers/format-files.ts CHANGED
@@ -30,8 +30,8 @@ const formatFiles = async (root: string) => {
30
30
  filePath = path.join(root, 'src/react-loader.tsx');
31
31
  data = await fs.readFile(filePath, 'utf8');
32
32
  data = data.replace(
33
- /const blocks((?!};).)*};/s,
34
- "const blocks: { [name: string]: any } = {\n\troot: lazy(() => import('./organisms/root/Root')),\n};"
33
+ /export const blocks((?!};).)*};/s,
34
+ "export const blocks: { [name: string]: any } = {\n\troot: lazy(() => import('./organisms/root/Root')),\n};"
35
35
  );
36
36
 
37
37
  await fs.writeFile(filePath, data);
package/index.html CHANGED
@@ -38,7 +38,7 @@
38
38
 
39
39
  <body>
40
40
  <!--app-html-->
41
- <script type="module" src="/src/react-loader.tsx"></script>
41
+ <script type="module" src="/xpack/react-loader-init.tsx"></script>
42
42
  <script type="module" defer src="#__BASE_URL__/assets/js/pl-states.js"></script>
43
43
  </body>
44
44
  </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "buner",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "Frontend build toolkit for Vite + React SSR projects — SCSS pipeline, prerender, SSR dev server, and backend integration.",
5
5
  "type": "module",
6
6
  "license": "MIT",
package/xpack/filename.ts CHANGED
@@ -30,7 +30,7 @@ export const getEntryFileName = (chunkInfo: PreRenderedChunk): string => {
30
30
  return chunkInfo.name + '.js';
31
31
  }
32
32
 
33
- if (chunkInfo.name === 'index') {
33
+ if (chunkInfo.name === 'index' || chunkInfo.name === 'react-loader-init') {
34
34
  return 'assets/js/react-loader.0x[hash].js';
35
35
  }
36
36
 
package/xpack/react-loader-init.tsx ADDED
@@ -0,0 +1,4 @@
1
+ import { blocks } from '../src/react-loader';
2
+ import { initReactLoader } from './react-loader';
3
+
4
+ initReactLoader(blocks);
package/xpack/react-loader.tsx ADDED
@@ -0,0 +1,54 @@
1
+ import ReactDOM from 'react-dom/client';
2
+
3
+ type Blocks = { [name: string]: React.LazyExoticComponent<any> };
4
+
5
+ const renderComponent = (blocks: Blocks, scriptSection: HTMLScriptElement) => {
6
+ const blockType = scriptSection.getAttribute('data-rct');
7
+ const data = scriptSection.textContent ? scriptSection.textContent : '{}';
8
+
9
+ if (!blockType || !data) {
10
+ return;
11
+ }
12
+
13
+ const Component = blocks[blockType];
14
+
15
+ if (Component) {
16
+ scriptSection.textContent = null;
17
+ const section = document.createElement(scriptSection.getAttribute('data-tag') ?? 'section');
18
+
19
+ section.className = scriptSection.getAttribute('data-class') ?? '';
20
+ scriptSection.replaceWith(section);
21
+
22
+ const props = JSON.parse(data);
23
+
24
+ ReactDOM.createRoot(section).render(<Component {...props} />);
25
+ } else {
26
+ return <></>;
27
+ }
28
+ };
29
+
30
+ export const initReactLoader = (blocks: Blocks) => {
31
+ const renderComponents = () => {
32
+ // rct stands for 'react component type'
33
+ const scriptSections = document.querySelectorAll('script[data-rct]');
34
+
35
+ [].forEach.call(scriptSections, (s: HTMLScriptElement) => renderComponent(blocks, s));
36
+ };
37
+
38
+ window.renderComponents = renderComponents;
39
+ renderComponents();
40
+ window.addEventListener('load', () => renderComponents());
41
+
42
+ // Post a custom event to notify that the renderComponents function is ready to be used
43
+ // Usage:
44
+ // if (window.renderComponents) {
45
+ // window.renderComponents();
46
+ // } else {
47
+ // window.addEventListener('react-loaded', () => {
48
+ // window.renderComponents();
49
+ // });
50
+ // }
51
+ const event = new CustomEvent('react-loaded');
52
+
53
+ window.dispatchEvent(event);
54
+ };