@ossy/connected-components 0.11.2 → 0.13.0

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 (2) hide show
  1. package/build/index.js +74 -3
  2. package/package.json +2 -2
package/build/index.js CHANGED
@@ -29,7 +29,18 @@ function defaultAppSettings() {
29
29
  router: 'browser',
30
30
  gaId: undefined,
31
31
  apiUrl: undefined,
32
- devMode: false
32
+ devMode: false,
33
+ /** When true (default), `App` renders `<html>` / `<head>` / `<body>` for SSR + hydrateRoot(document). Set false if the app entry already provides the document. */
34
+ includeDocumentShell: true,
35
+ /** Page `<title>`; `title` is accepted as an alias. */
36
+ documentTitle: undefined,
37
+ title: undefined,
38
+ metaDescription: undefined,
39
+ themeColor: undefined,
40
+ /** `<html lang>`; falls back to `defaultLanguage` then `en`. */
41
+ htmlLang: undefined,
42
+ /** Favicon URL; default `/favicon.ico`. Use `null` or `false` to omit. */
43
+ faviconHref: undefined
33
44
  };
34
45
  }
35
46
 
@@ -165,6 +176,60 @@ const ThemeEditor = () => {
165
176
  }));
166
177
  };
167
178
 
179
+ const documentBaseStyle = {
180
+ margin: 0,
181
+ padding: 0
182
+ };
183
+
184
+ /**
185
+ * Full HTML document wrapper for SSR / hydrateRoot(document, …).
186
+ *
187
+ * @param {{
188
+ * appSettings: Record<string, unknown>,
189
+ * children: import('react').ReactNode,
190
+ * }} props
191
+ */
192
+ function AppDocumentShell({
193
+ appSettings,
194
+ children
195
+ }) {
196
+ const title = appSettings.documentTitle ?? appSettings.title ?? 'App';
197
+ const lang = typeof appSettings.htmlLang === 'string' ? appSettings.htmlLang : typeof appSettings.defaultLanguage === 'string' ? appSettings.defaultLanguage : 'en';
198
+ const themeColor = typeof appSettings.themeColor === 'string' ? appSettings.themeColor : '#000000';
199
+ const description = typeof appSettings.metaDescription === 'string' ? appSettings.metaDescription : undefined;
200
+ let faviconHref = '/favicon.ico';
201
+ if (appSettings.faviconHref === null || appSettings.faviconHref === false) {
202
+ faviconHref = null;
203
+ } else if (typeof appSettings.faviconHref === 'string') {
204
+ faviconHref = appSettings.faviconHref || null;
205
+ }
206
+ typeof appSettings.gaId === 'string' ? appSettings.gaId : undefined;
207
+ return /*#__PURE__*/React$1.createElement("html", {
208
+ lang: lang,
209
+ style: documentBaseStyle
210
+ }, /*#__PURE__*/React$1.createElement("head", null, /*#__PURE__*/React$1.createElement("meta", {
211
+ charSet: "utf-8"
212
+ }), /*#__PURE__*/React$1.createElement("meta", {
213
+ name: "viewport",
214
+ content: "width=device-width, initial-scale=1"
215
+ }), /*#__PURE__*/React$1.createElement("meta", {
216
+ name: "theme-color",
217
+ content: themeColor
218
+ }), description ? /*#__PURE__*/React$1.createElement("meta", {
219
+ name: "description",
220
+ content: description
221
+ }) : null, /*#__PURE__*/React$1.createElement("title", null, title), faviconHref ? /*#__PURE__*/React$1.createElement("link", {
222
+ rel: "icon",
223
+ href: faviconHref
224
+ }) : null, /*#__PURE__*/React$1.createElement("style", null, `
225
+ *, *::before, *::after {
226
+ box-sizing: border-box;
227
+ }
228
+ `)), /*#__PURE__*/React$1.createElement("body", {
229
+ style: documentBaseStyle
230
+ }, children));
231
+ }
232
+
168
233
  function routesToPages(routes) {
169
234
  if (!routes?.length) return [];
170
235
  return routes.map((route, i) => {
@@ -188,7 +253,7 @@ const App = _appSettings => {
188
253
  apiUrl: appSettings.apiUrl,
189
254
  workspaceId: appSettings.workspaceId
190
255
  });
191
- return /*#__PURE__*/React$1.createElement(AppContext.Provider, {
256
+ const tree = /*#__PURE__*/React$1.createElement(AppContext.Provider, {
192
257
  value: appSettings
193
258
  }, /*#__PURE__*/React$1.createElement(Theme, {
194
259
  theme: appSettings.theme,
@@ -198,6 +263,12 @@ const App = _appSettings => {
198
263
  }, /*#__PURE__*/React$1.createElement(Router, _extends({}, appSettings, {
199
264
  pages: pages
200
265
  })), appSettings.devMode && /*#__PURE__*/React$1.createElement(ThemeEditor, null))));
266
+ if (appSettings.includeDocumentShell === false) {
267
+ return tree;
268
+ }
269
+ return /*#__PURE__*/React$1.createElement(AppDocumentShell, {
270
+ appSettings: appSettings
271
+ }, tree);
201
272
  };
202
273
 
203
274
  const Layout = ({
@@ -615,4 +686,4 @@ const ThemeProvider = props => {
615
686
  }, props)) : /*#__PURE__*/React$1.createElement(React$1.Fragment, null);
616
687
  };
617
688
 
618
- export { App, Layout, Ossybot, Page, PageDataLoader, PagesModule, Resume, ResumeTemplates, ThemeEditor, ThemeProvider, defaultAppSettings, location, useApp, useMergeAsyncStatus, useResume };
689
+ export { App, AppDocumentShell, Layout, Ossybot, Page, PageDataLoader, PagesModule, Resume, ResumeTemplates, ThemeEditor, ThemeProvider, defaultAppSettings, location, useApp, useMergeAsyncStatus, useResume };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ossy/connected-components",
3
- "version": "0.11.2",
3
+ "version": "0.13.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/ossy-se/packages.git"
@@ -56,5 +56,5 @@
56
56
  "/build",
57
57
  "README.md"
58
58
  ],
59
- "gitHead": "77d8a2c75c8bbeff5ef0093f062e06f42badd9ef"
59
+ "gitHead": "986dc44507c6825de15a4b68606493a7b9442c35"
60
60
  }