vike-react 0.6.26 → 0.6.27

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/config.d.ts CHANGED
@@ -145,6 +145,13 @@ declare const config: {
145
145
  global: true;
146
146
  cumulative: true;
147
147
  };
148
+ rootAttributes: {
149
+ env: {
150
+ server: true;
151
+ };
152
+ global: true;
153
+ cumulative: true;
154
+ };
148
155
  ssr: {
149
156
  env: {
150
157
  config: true;
package/dist/config.js CHANGED
@@ -116,6 +116,11 @@ const config = {
116
116
  global: true,
117
117
  cumulative: true, // for Vike extensions
118
118
  },
119
+ rootAttributes: {
120
+ env: { server: true },
121
+ global: true,
122
+ cumulative: true, // for Vike extensions
123
+ },
119
124
  ssr: {
120
125
  env: { config: true },
121
126
  effect: ssrEffect,
@@ -1,2 +1,2 @@
1
- export declare const configsCumulative: readonly ["Head", "bodyAttributes", "htmlAttributes"];
1
+ export declare const configsCumulative: readonly ["Head", "bodyAttributes", "htmlAttributes", "rootAttributes"];
2
2
  export type ConfigsCumulative = (typeof configsCumulative)[number];
@@ -1 +1 @@
1
- export const configsCumulative = ['Head', 'bodyAttributes', 'htmlAttributes'];
1
+ export const configsCumulative = ['Head', 'bodyAttributes', 'htmlAttributes', 'rootAttributes'];
@@ -15,9 +15,13 @@ function getHeadSetting(configName, pageContext) {
15
15
  return getCallable(valFromConfig);
16
16
  }
17
17
  else {
18
+ // Sorted by increasing precedence: the values set by Vike extensions come first, then the app's values (the most
19
+ // specific one last), then the values set by useConfig(). Merging the list in order (e.g. with Object.assign())
20
+ // thus yields the value with the highest precedence.
18
21
  return [
19
- //
20
- ...(valFromConfig ?? []).map(getCallable),
22
+ // pageContext.config[configName] is sorted by decreasing precedence (the most specific value first, the values set
23
+ // by Vike extensions last) => we reverse it. (We copy the list first: pageContext.config is shared.)
24
+ ...[...(valFromConfig ?? [])].reverse().map(getCallable),
21
25
  ...(valFromHook ?? []),
22
26
  ];
23
27
  }
@@ -23,7 +23,7 @@ async function onRenderHtml(pageContext) {
23
23
  await renderPageToHtml(pageContext);
24
24
  const headHtml = getHeadHtml(pageContext);
25
25
  const { headHtmlBegin, headHtmlEnd, bodyHtmlBegin, bodyHtmlEnd } = await getHtmlInjections(pageContext);
26
- const { htmlAttributesString, bodyAttributesString } = getTagAttributes(pageContext);
26
+ const { htmlAttributesString, bodyAttributesString, rootAttributesString } = getTagAttributes(pageContext);
27
27
  // Keep only what the client-side applies upon navigation, and remove the rest (HTML-only and/or
28
28
  // non-serializable values such as <Head> components). https://github.com/vikejs/vike-vue/issues/233
29
29
  removeServerOnlyConfigViaHook(pageContext);
@@ -49,7 +49,7 @@ async function onRenderHtml(pageContext) {
49
49
  </head>
50
50
  <body${dangerouslySkipEscape(bodyAttributesString)}>
51
51
  ${bodyHtmlBegin}
52
- <div id="root">${pageHtmlStringOrStream}</div>
52
+ <div${dangerouslySkipEscape(rootAttributesString)}>${pageHtmlStringOrStream}</div>
53
53
  ${bodyHtmlEnd}
54
54
  </body>
55
55
  </html>`;
@@ -141,9 +141,12 @@ function getTagAttributes(pageContext) {
141
141
  lang = 'en';
142
142
  const bodyAttributes = mergeTagAttributesList(getHeadSetting('bodyAttributes', pageContext));
143
143
  const htmlAttributes = mergeTagAttributesList(getHeadSetting('htmlAttributes', pageContext));
144
+ const rootAttributes = mergeTagAttributesList(getHeadSetting('rootAttributes', pageContext));
144
145
  const bodyAttributesString = getTagAttributesString(bodyAttributes);
145
146
  const htmlAttributesString = getTagAttributesString({ ...htmlAttributes, lang: lang ?? htmlAttributes.lang });
146
- return { htmlAttributesString, bodyAttributesString };
147
+ // The root element's `id` is used by onRenderClient(): it's the user's responsibility not to override it.
148
+ const rootAttributesString = getTagAttributesString({ id: 'root', ...rootAttributes });
149
+ return { htmlAttributesString, bodyAttributesString, rootAttributesString };
147
150
  }
148
151
  function mergeTagAttributesList(tagAttributesList = []) {
149
152
  const tagAttributes = {};
@@ -142,6 +142,12 @@ declare global {
142
142
  * https://vike.dev/bodyAttributes
143
143
  */
144
144
  bodyAttributes?: TagAttributes | ((pageContext: PageContextServer) => TagAttributes | undefined);
145
+ /**
146
+ * Add tag attributes to the root element such as `<div id="root" role="none">`.
147
+ *
148
+ * https://vike.dev/rootAttributes
149
+ */
150
+ rootAttributes?: TagAttributes | ((pageContext: PageContextServer) => TagAttributes | undefined);
145
151
  /**
146
152
  * If `true`, the page is rendered twice: on the server-side (to HTML) and on the client-side (hydration).
147
153
  *
@@ -238,6 +244,7 @@ declare global {
238
244
  headHtmlEnd?: HtmlInjection[];
239
245
  bodyAttributes?: TagAttributes[];
240
246
  htmlAttributes?: TagAttributes[];
247
+ rootAttributes?: TagAttributes[];
241
248
  onBeforeRenderHtml?: Function[];
242
249
  onAfterRenderHtml?: Function[];
243
250
  onBeforeRenderClient?: Function[];
@@ -260,7 +267,7 @@ type Loading = {
260
267
  type PickWithoutGetter<T, K extends keyof T> = {
261
268
  [P in K]: Exclude<T[P], Function>;
262
269
  };
263
- export type ConfigViaHook = PickWithoutGetter<Vike.Config, 'Head' | 'title' | 'description' | 'image' | 'favicon' | 'lang' | 'viewport' | 'bodyAttributes' | 'htmlAttributes'>;
270
+ export type ConfigViaHook = PickWithoutGetter<Vike.Config, 'Head' | 'title' | 'description' | 'image' | 'favicon' | 'lang' | 'viewport' | 'bodyAttributes' | 'htmlAttributes' | 'rootAttributes'>;
264
271
  export type ConfigViaHookResolved = Omit<ConfigViaHook, ConfigsCumulative> & Pick<Vike.ConfigResolved, ConfigsCumulative>;
265
272
  export type ReactOptions = {
266
273
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vike-react",
3
- "version": "0.6.26",
3
+ "version": "0.6.27",
4
4
  "repository": "https://github.com/vikejs/vike-react",
5
5
  "type": "module",
6
6
  "exports": {