@croct/plug-react 0.14.0 → 0.16.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.
- package/CroctProvider.d.cts +2 -2
- package/CroctProvider.d.ts +2 -2
- package/CroctProvider.js +1 -7
- package/README.md +0 -2
- package/components/Slot/index.d.cts +10 -8
- package/components/Slot/index.d.ts +10 -8
- package/components/index.d.cts +2 -0
- package/components/index.d.ts +2 -0
- package/hooks/index.d.cts +3 -1
- package/hooks/index.d.ts +3 -1
- package/hooks/useContent.cjs +12 -5
- package/hooks/useContent.d.cts +9 -6
- package/hooks/useContent.d.ts +9 -6
- package/hooks/useContent.js +12 -5
- package/hooks/useLoader.cjs +1 -1
- package/hooks/useLoader.js +1 -1
- package/index.d.cts +3 -1
- package/index.d.ts +3 -1
- package/package.json +7 -7
- package/ssr-polyfills.cjs +2 -2
- package/ssr-polyfills.js +2 -2
package/CroctProvider.d.cts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { FunctionComponent, PropsWithChildren } from 'react';
|
|
3
|
+
import { Plug, Configuration } from '@croct/plug';
|
|
4
4
|
|
|
5
5
|
type CroctProviderProps = PropsWithChildren<Configuration & Required<Pick<Configuration, 'appId'>>>;
|
|
6
6
|
declare const CroctContext: react.Context<{
|
package/CroctProvider.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { FunctionComponent, PropsWithChildren } from 'react';
|
|
3
|
+
import { Plug, Configuration } from '@croct/plug';
|
|
4
4
|
|
|
5
5
|
type CroctProviderProps = PropsWithChildren<Configuration & Required<Pick<Configuration, 'appId'>>>;
|
|
6
6
|
declare const CroctContext: react.Context<{
|
package/CroctProvider.js
CHANGED
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
4
|
-
createContext,
|
|
5
|
-
useContext,
|
|
6
|
-
useEffect,
|
|
7
|
-
useMemo,
|
|
8
|
-
useRef
|
|
9
|
-
} from "react";
|
|
3
|
+
import { createContext, useContext, useEffect, useMemo, useRef } from "react";
|
|
10
4
|
import { croct } from "./ssr-polyfills.js";
|
|
11
5
|
const CroctContext = createContext(null);
|
|
12
6
|
CroctContext.displayName = "CroctContext";
|
package/README.md
CHANGED
|
@@ -18,8 +18,6 @@
|
|
|
18
18
|
<br/>
|
|
19
19
|
<p align="center">
|
|
20
20
|
<a href="https://www.npmjs.com/package/@croct/plug-react"><img alt="Version" src="https://img.shields.io/npm/v/@croct/plug-react"/></a>
|
|
21
|
-
<a href="https://qlty.sh/gh/croct-tech/projects/plug-react"><img src="https://qlty.sh/badges/bc10f271-37b3-45e8-9e10-e7148e83cea7/coverage.svg" alt="Code Coverage" /></a>
|
|
22
|
-
<a href="https://qlty.sh/gh/croct-tech/projects/plug-react"><img src="https://qlty.sh/badges/bc10f271-37b3-45e8-9e10-e7148e83cea7/maintainability.svg" alt="Maintainability" /></a>
|
|
23
21
|
</p>
|
|
24
22
|
|
|
25
23
|
## Introduction
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
import { ReactNode, ReactElement } from 'react';
|
|
2
2
|
import { VersionedSlotId, VersionedSlotMap, SlotContent } from '@croct/plug/slot';
|
|
3
3
|
import { JsonObject } from '@croct/plug/sdk/json';
|
|
4
|
-
import {
|
|
4
|
+
import { FetchResponseOptions } from '@croct/sdk/contentFetcher';
|
|
5
|
+
import { UseContentOptions, FetchResponse } from '../../hooks/useContent.cjs';
|
|
5
6
|
import '@croct/plug/plug';
|
|
7
|
+
import '@croct/sdk/utilityTypes';
|
|
6
8
|
|
|
7
9
|
type Renderer<P> = (props: P) => ReactNode;
|
|
8
|
-
type SlotProps<P, I = P, F = P, S extends VersionedSlotId = VersionedSlotId> = UseContentOptions<I, F> & {
|
|
10
|
+
type SlotProps<P, I = P, F = P, S extends VersionedSlotId = VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions> = O & UseContentOptions<I, F> & {
|
|
9
11
|
id: S;
|
|
10
|
-
children: Renderer<P | I | F
|
|
12
|
+
children: Renderer<FetchResponse<P | I | F, O>>;
|
|
11
13
|
};
|
|
12
14
|
type SlotComponent = {
|
|
13
|
-
<P, I, F>(props: Extract<P | I | F, JsonObject> extends never ? SlotProps<JsonObject, never, never, keyof VersionedSlotMap extends never ? string : never> : SlotProps<P, I, F, keyof VersionedSlotMap extends never ? string : never>): ReactElement;
|
|
14
|
-
<S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, never, never, S>): ReactElement;
|
|
15
|
-
<I, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, I, never, S>): ReactElement;
|
|
16
|
-
<F, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, never, F, S>): ReactElement;
|
|
17
|
-
<I, F, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, I, F, S>): ReactElement;
|
|
15
|
+
<P, I, F, O extends FetchResponseOptions>(props: Extract<P | I | F, JsonObject> extends never ? SlotProps<JsonObject, never, never, keyof VersionedSlotMap extends never ? string : never, O> : SlotProps<P, I, F, keyof VersionedSlotMap extends never ? string : never, O>): ReactElement;
|
|
16
|
+
<S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, never, never, S, O>): ReactElement;
|
|
17
|
+
<I, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, I, never, S, O>): ReactElement;
|
|
18
|
+
<F, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, never, F, S, O>): ReactElement;
|
|
19
|
+
<I, F, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, I, F, S, O>): ReactElement;
|
|
18
20
|
(props: SlotProps<void, void, void>): ReactElement;
|
|
19
21
|
};
|
|
20
22
|
declare const Slot: SlotComponent;
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
import { ReactNode, ReactElement } from 'react';
|
|
2
2
|
import { VersionedSlotId, VersionedSlotMap, SlotContent } from '@croct/plug/slot';
|
|
3
3
|
import { JsonObject } from '@croct/plug/sdk/json';
|
|
4
|
-
import {
|
|
4
|
+
import { FetchResponseOptions } from '@croct/sdk/contentFetcher';
|
|
5
|
+
import { UseContentOptions, FetchResponse } from '../../hooks/useContent.js';
|
|
5
6
|
import '@croct/plug/plug';
|
|
7
|
+
import '@croct/sdk/utilityTypes';
|
|
6
8
|
|
|
7
9
|
type Renderer<P> = (props: P) => ReactNode;
|
|
8
|
-
type SlotProps<P, I = P, F = P, S extends VersionedSlotId = VersionedSlotId> = UseContentOptions<I, F> & {
|
|
10
|
+
type SlotProps<P, I = P, F = P, S extends VersionedSlotId = VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions> = O & UseContentOptions<I, F> & {
|
|
9
11
|
id: S;
|
|
10
|
-
children: Renderer<P | I | F
|
|
12
|
+
children: Renderer<FetchResponse<P | I | F, O>>;
|
|
11
13
|
};
|
|
12
14
|
type SlotComponent = {
|
|
13
|
-
<P, I, F>(props: Extract<P | I | F, JsonObject> extends never ? SlotProps<JsonObject, never, never, keyof VersionedSlotMap extends never ? string : never> : SlotProps<P, I, F, keyof VersionedSlotMap extends never ? string : never>): ReactElement;
|
|
14
|
-
<S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, never, never, S>): ReactElement;
|
|
15
|
-
<I, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, I, never, S>): ReactElement;
|
|
16
|
-
<F, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, never, F, S>): ReactElement;
|
|
17
|
-
<I, F, S extends VersionedSlotId>(props: SlotProps<SlotContent<S>, I, F, S>): ReactElement;
|
|
15
|
+
<P, I, F, O extends FetchResponseOptions>(props: Extract<P | I | F, JsonObject> extends never ? SlotProps<JsonObject, never, never, keyof VersionedSlotMap extends never ? string : never, O> : SlotProps<P, I, F, keyof VersionedSlotMap extends never ? string : never, O>): ReactElement;
|
|
16
|
+
<S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, never, never, S, O>): ReactElement;
|
|
17
|
+
<I, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, I, never, S, O>): ReactElement;
|
|
18
|
+
<F, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, never, F, S, O>): ReactElement;
|
|
19
|
+
<I, F, S extends VersionedSlotId, O extends FetchResponseOptions>(props: SlotProps<SlotContent<S>, I, F, S, O>): ReactElement;
|
|
18
20
|
(props: SlotProps<void, void, void>): ReactElement;
|
|
19
21
|
};
|
|
20
22
|
declare const Slot: SlotComponent;
|
package/components/index.d.cts
CHANGED
|
@@ -5,5 +5,7 @@ import '@croct/plug/sdk/json';
|
|
|
5
5
|
import '../hooks/useEvaluation.cjs';
|
|
6
6
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
7
7
|
import '@croct/plug/slot';
|
|
8
|
+
import '@croct/sdk/contentFetcher';
|
|
8
9
|
import '../hooks/useContent.cjs';
|
|
9
10
|
import '@croct/plug/plug';
|
|
11
|
+
import '@croct/sdk/utilityTypes';
|
package/components/index.d.ts
CHANGED
|
@@ -5,5 +5,7 @@ import '@croct/plug/sdk/json';
|
|
|
5
5
|
import '../hooks/useEvaluation.js';
|
|
6
6
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
7
7
|
import '@croct/plug/slot';
|
|
8
|
+
import '@croct/sdk/contentFetcher';
|
|
8
9
|
import '../hooks/useContent.js';
|
|
9
10
|
import '@croct/plug/plug';
|
|
11
|
+
import '@croct/sdk/utilityTypes';
|
package/hooks/index.d.cts
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
export { UseEvaluationOptions, useEvaluation } from './useEvaluation.cjs';
|
|
2
|
-
export { UseContentOptions, useContent } from './useContent.cjs';
|
|
2
|
+
export { FetchResponse, UseContentOptions, useContent } from './useContent.cjs';
|
|
3
3
|
export { useCroct } from './useCroct.cjs';
|
|
4
4
|
import '@croct/plug/sdk/json';
|
|
5
5
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
6
6
|
import '@croct/plug/slot';
|
|
7
7
|
import '@croct/plug/plug';
|
|
8
|
+
import '@croct/sdk/contentFetcher';
|
|
9
|
+
import '@croct/sdk/utilityTypes';
|
|
8
10
|
import '@croct/plug';
|
package/hooks/index.d.ts
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
export { UseEvaluationOptions, useEvaluation } from './useEvaluation.js';
|
|
2
|
-
export { UseContentOptions, useContent } from './useContent.js';
|
|
2
|
+
export { FetchResponse, UseContentOptions, useContent } from './useContent.js';
|
|
3
3
|
export { useCroct } from './useCroct.js';
|
|
4
4
|
import '@croct/plug/sdk/json';
|
|
5
5
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
6
6
|
import '@croct/plug/slot';
|
|
7
7
|
import '@croct/plug/plug';
|
|
8
|
+
import '@croct/sdk/contentFetcher';
|
|
9
|
+
import '@croct/sdk/utilityTypes';
|
|
8
10
|
import '@croct/plug';
|
package/hooks/useContent.cjs
CHANGED
|
@@ -45,18 +45,24 @@ function useCsrContent(id, options = {}) {
|
|
|
45
45
|
);
|
|
46
46
|
const fallback = fallbackContent === void 0 ? defaultContent : fallbackContent;
|
|
47
47
|
const [initial, setInitial] = (0, import_react.useState)(
|
|
48
|
-
() =>
|
|
48
|
+
() => {
|
|
49
|
+
const content = initialContent === void 0 ? defaultContent : initialContent;
|
|
50
|
+
if (content === void 0) {
|
|
51
|
+
return void 0;
|
|
52
|
+
}
|
|
53
|
+
return { content };
|
|
54
|
+
}
|
|
49
55
|
);
|
|
50
56
|
const croct = (0, import_useCroct.useCroct)();
|
|
51
57
|
const result = (0, import_useLoader.useLoader)({
|
|
52
58
|
cacheKey: (0, import_hash.hash)(
|
|
53
|
-
`useContent:${cacheKey ?? ""}:${id}:${normalizedLocale ?? ""}:${JSON.stringify(fetchOptions
|
|
59
|
+
`useContent:${cacheKey ?? ""}:${id}:${normalizedLocale ?? ""}:${JSON.stringify(fetchOptions?.attributes ?? {})}`
|
|
54
60
|
),
|
|
55
61
|
loader: () => croct.fetch(id, {
|
|
56
62
|
...fetchOptions,
|
|
57
63
|
...normalizedLocale !== void 0 ? { preferredLocale: normalizedLocale } : {},
|
|
58
64
|
...fallback !== void 0 ? { fallback } : {}
|
|
59
|
-
})
|
|
65
|
+
}),
|
|
60
66
|
initial,
|
|
61
67
|
expiration
|
|
62
68
|
});
|
|
@@ -75,14 +81,15 @@ function useCsrContent(id, options = {}) {
|
|
|
75
81
|
);
|
|
76
82
|
return result;
|
|
77
83
|
}
|
|
78
|
-
function useSsrContent(slotId,
|
|
84
|
+
function useSsrContent(slotId, options = {}) {
|
|
85
|
+
const { initial, preferredLocale } = options;
|
|
79
86
|
const resolvedInitialContent = initial === void 0 ? (0, import_content.getSlotContent)(slotId, normalizePreferredLocale(preferredLocale)) ?? void 0 : initial;
|
|
80
87
|
if (resolvedInitialContent === void 0) {
|
|
81
88
|
throw new Error(
|
|
82
89
|
"The initial content is required for server-side rendering (SSR). For help, see https://croct.help/sdk/react/missing-slot-content"
|
|
83
90
|
);
|
|
84
91
|
}
|
|
85
|
-
return resolvedInitialContent;
|
|
92
|
+
return { content: resolvedInitialContent };
|
|
86
93
|
}
|
|
87
94
|
function normalizePreferredLocale(preferredLocale) {
|
|
88
95
|
return preferredLocale !== void 0 && preferredLocale !== "" ? preferredLocale : void 0;
|
package/hooks/useContent.d.cts
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import { VersionedSlotMap, VersionedSlotId, SlotContent } from '@croct/plug/slot';
|
|
2
2
|
import { JsonObject } from '@croct/plug/sdk/json';
|
|
3
3
|
import { FetchOptions } from '@croct/plug/plug';
|
|
4
|
+
import { FetchResponseOptions, FetchResponse as FetchResponse$1 } from '@croct/sdk/contentFetcher';
|
|
5
|
+
import { Optional } from '@croct/sdk/utilityTypes';
|
|
4
6
|
|
|
7
|
+
type FetchResponse<P = JsonObject, O = FetchResponseOptions> = Optional<FetchResponse$1<P, O>, 'metadata'>;
|
|
5
8
|
type UseContentOptions<I, F> = FetchOptions<F> & {
|
|
6
9
|
initial?: I;
|
|
7
10
|
cacheKey?: string;
|
|
@@ -9,12 +12,12 @@ type UseContentOptions<I, F> = FetchOptions<F> & {
|
|
|
9
12
|
staleWhileLoading?: boolean;
|
|
10
13
|
};
|
|
11
14
|
type UseContentHook = {
|
|
12
|
-
<P extends JsonObject, I = P, F = P>(id: keyof VersionedSlotMap extends never ? string : never, options?: UseContentOptions<I, F>): P | I | F
|
|
13
|
-
<S extends VersionedSlotId>(id: S, options?: UseContentOptions<never, never>): SlotContent<S>;
|
|
14
|
-
<I, S extends VersionedSlotId>(id: S, options?: UseContentOptions<I, never>): SlotContent<S> | I
|
|
15
|
-
<F, S extends VersionedSlotId>(id: S, options?: UseContentOptions<never, F>): SlotContent<S> | F
|
|
16
|
-
<I, F, S extends VersionedSlotId>(id: S, options?: UseContentOptions<I, F>): SlotContent<S> | I | F
|
|
15
|
+
<P extends JsonObject, I = P, F = P, O extends FetchResponseOptions = FetchResponseOptions>(id: keyof VersionedSlotMap extends never ? string : never, options?: O & UseContentOptions<I, F>): FetchResponse<P | I | F, O>;
|
|
16
|
+
<S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<never, never>): FetchResponse<SlotContent<S>, O>;
|
|
17
|
+
<I, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<I, never>): FetchResponse<SlotContent<S> | I, O>;
|
|
18
|
+
<F, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<never, F>): FetchResponse<SlotContent<S> | F, O>;
|
|
19
|
+
<I, F, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<I, F>): FetchResponse<SlotContent<S> | I | F, O>;
|
|
17
20
|
};
|
|
18
21
|
declare const useContent: UseContentHook;
|
|
19
22
|
|
|
20
|
-
export { type UseContentOptions, useContent };
|
|
23
|
+
export { type FetchResponse, type UseContentOptions, useContent };
|
package/hooks/useContent.d.ts
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import { VersionedSlotMap, VersionedSlotId, SlotContent } from '@croct/plug/slot';
|
|
2
2
|
import { JsonObject } from '@croct/plug/sdk/json';
|
|
3
3
|
import { FetchOptions } from '@croct/plug/plug';
|
|
4
|
+
import { FetchResponseOptions, FetchResponse as FetchResponse$1 } from '@croct/sdk/contentFetcher';
|
|
5
|
+
import { Optional } from '@croct/sdk/utilityTypes';
|
|
4
6
|
|
|
7
|
+
type FetchResponse<P = JsonObject, O = FetchResponseOptions> = Optional<FetchResponse$1<P, O>, 'metadata'>;
|
|
5
8
|
type UseContentOptions<I, F> = FetchOptions<F> & {
|
|
6
9
|
initial?: I;
|
|
7
10
|
cacheKey?: string;
|
|
@@ -9,12 +12,12 @@ type UseContentOptions<I, F> = FetchOptions<F> & {
|
|
|
9
12
|
staleWhileLoading?: boolean;
|
|
10
13
|
};
|
|
11
14
|
type UseContentHook = {
|
|
12
|
-
<P extends JsonObject, I = P, F = P>(id: keyof VersionedSlotMap extends never ? string : never, options?: UseContentOptions<I, F>): P | I | F
|
|
13
|
-
<S extends VersionedSlotId>(id: S, options?: UseContentOptions<never, never>): SlotContent<S>;
|
|
14
|
-
<I, S extends VersionedSlotId>(id: S, options?: UseContentOptions<I, never>): SlotContent<S> | I
|
|
15
|
-
<F, S extends VersionedSlotId>(id: S, options?: UseContentOptions<never, F>): SlotContent<S> | F
|
|
16
|
-
<I, F, S extends VersionedSlotId>(id: S, options?: UseContentOptions<I, F>): SlotContent<S> | I | F
|
|
15
|
+
<P extends JsonObject, I = P, F = P, O extends FetchResponseOptions = FetchResponseOptions>(id: keyof VersionedSlotMap extends never ? string : never, options?: O & UseContentOptions<I, F>): FetchResponse<P | I | F, O>;
|
|
16
|
+
<S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<never, never>): FetchResponse<SlotContent<S>, O>;
|
|
17
|
+
<I, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<I, never>): FetchResponse<SlotContent<S> | I, O>;
|
|
18
|
+
<F, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<never, F>): FetchResponse<SlotContent<S> | F, O>;
|
|
19
|
+
<I, F, S extends VersionedSlotId, O extends FetchResponseOptions = FetchResponseOptions>(id: S, options?: O & UseContentOptions<I, F>): FetchResponse<SlotContent<S> | I | F, O>;
|
|
17
20
|
};
|
|
18
21
|
declare const useContent: UseContentHook;
|
|
19
22
|
|
|
20
|
-
export { type UseContentOptions, useContent };
|
|
23
|
+
export { type FetchResponse, type UseContentOptions, useContent };
|
package/hooks/useContent.js
CHANGED
|
@@ -22,18 +22,24 @@ function useCsrContent(id, options = {}) {
|
|
|
22
22
|
);
|
|
23
23
|
const fallback = fallbackContent === void 0 ? defaultContent : fallbackContent;
|
|
24
24
|
const [initial, setInitial] = useState(
|
|
25
|
-
() =>
|
|
25
|
+
() => {
|
|
26
|
+
const content = initialContent === void 0 ? defaultContent : initialContent;
|
|
27
|
+
if (content === void 0) {
|
|
28
|
+
return void 0;
|
|
29
|
+
}
|
|
30
|
+
return { content };
|
|
31
|
+
}
|
|
26
32
|
);
|
|
27
33
|
const croct = useCroct();
|
|
28
34
|
const result = useLoader({
|
|
29
35
|
cacheKey: hash(
|
|
30
|
-
`useContent:${cacheKey ?? ""}:${id}:${normalizedLocale ?? ""}:${JSON.stringify(fetchOptions
|
|
36
|
+
`useContent:${cacheKey ?? ""}:${id}:${normalizedLocale ?? ""}:${JSON.stringify(fetchOptions?.attributes ?? {})}`
|
|
31
37
|
),
|
|
32
38
|
loader: () => croct.fetch(id, {
|
|
33
39
|
...fetchOptions,
|
|
34
40
|
...normalizedLocale !== void 0 ? { preferredLocale: normalizedLocale } : {},
|
|
35
41
|
...fallback !== void 0 ? { fallback } : {}
|
|
36
|
-
})
|
|
42
|
+
}),
|
|
37
43
|
initial,
|
|
38
44
|
expiration
|
|
39
45
|
});
|
|
@@ -52,14 +58,15 @@ function useCsrContent(id, options = {}) {
|
|
|
52
58
|
);
|
|
53
59
|
return result;
|
|
54
60
|
}
|
|
55
|
-
function useSsrContent(slotId,
|
|
61
|
+
function useSsrContent(slotId, options = {}) {
|
|
62
|
+
const { initial, preferredLocale } = options;
|
|
56
63
|
const resolvedInitialContent = initial === void 0 ? getSlotContent(slotId, normalizePreferredLocale(preferredLocale)) ?? void 0 : initial;
|
|
57
64
|
if (resolvedInitialContent === void 0) {
|
|
58
65
|
throw new Error(
|
|
59
66
|
"The initial content is required for server-side rendering (SSR). For help, see https://croct.help/sdk/react/missing-slot-content"
|
|
60
67
|
);
|
|
61
68
|
}
|
|
62
|
-
return resolvedInitialContent;
|
|
69
|
+
return { content: resolvedInitialContent };
|
|
63
70
|
}
|
|
64
71
|
function normalizePreferredLocale(preferredLocale) {
|
|
65
72
|
return preferredLocale !== void 0 && preferredLocale !== "" ? preferredLocale : void 0;
|
package/hooks/useLoader.cjs
CHANGED
|
@@ -34,7 +34,7 @@ function useLoader({ initial, ...currentOptions }) {
|
|
|
34
34
|
setValue(cache.load(options));
|
|
35
35
|
} catch (result) {
|
|
36
36
|
if (result instanceof Promise) {
|
|
37
|
-
result.then((resolvedValue) => {
|
|
37
|
+
void result.then((resolvedValue) => {
|
|
38
38
|
if (mountedRef.current) {
|
|
39
39
|
setValue(resolvedValue);
|
|
40
40
|
}
|
package/hooks/useLoader.js
CHANGED
|
@@ -11,7 +11,7 @@ function useLoader({ initial, ...currentOptions }) {
|
|
|
11
11
|
setValue(cache.load(options));
|
|
12
12
|
} catch (result) {
|
|
13
13
|
if (result instanceof Promise) {
|
|
14
|
-
result.then((resolvedValue) => {
|
|
14
|
+
void result.then((resolvedValue) => {
|
|
15
15
|
if (mountedRef.current) {
|
|
16
16
|
setValue(resolvedValue);
|
|
17
17
|
}
|
package/index.d.cts
CHANGED
|
@@ -3,7 +3,7 @@ export * from '@croct/plug/slot';
|
|
|
3
3
|
export * from '@croct/plug/component';
|
|
4
4
|
export { CroctContext, CroctProvider, CroctProviderProps } from './CroctProvider.cjs';
|
|
5
5
|
export { UseEvaluationOptions, useEvaluation } from './hooks/useEvaluation.cjs';
|
|
6
|
-
export { UseContentOptions, useContent } from './hooks/useContent.cjs';
|
|
6
|
+
export { FetchResponse, UseContentOptions, useContent } from './hooks/useContent.cjs';
|
|
7
7
|
export { useCroct } from './hooks/useCroct.cjs';
|
|
8
8
|
export { Personalization, PersonalizationProps } from './components/Personalization/index.cjs';
|
|
9
9
|
export { Slot, SlotProps } from './components/Slot/index.cjs';
|
|
@@ -11,3 +11,5 @@ import 'react';
|
|
|
11
11
|
import '@croct/plug';
|
|
12
12
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
13
13
|
import '@croct/plug/plug';
|
|
14
|
+
import '@croct/sdk/contentFetcher';
|
|
15
|
+
import '@croct/sdk/utilityTypes';
|
package/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ export * from '@croct/plug/slot';
|
|
|
3
3
|
export * from '@croct/plug/component';
|
|
4
4
|
export { CroctContext, CroctProvider, CroctProviderProps } from './CroctProvider.js';
|
|
5
5
|
export { UseEvaluationOptions, useEvaluation } from './hooks/useEvaluation.js';
|
|
6
|
-
export { UseContentOptions, useContent } from './hooks/useContent.js';
|
|
6
|
+
export { FetchResponse, UseContentOptions, useContent } from './hooks/useContent.js';
|
|
7
7
|
export { useCroct } from './hooks/useCroct.js';
|
|
8
8
|
export { Personalization, PersonalizationProps } from './components/Personalization/index.js';
|
|
9
9
|
export { Slot, SlotProps } from './components/Slot/index.js';
|
|
@@ -11,3 +11,5 @@ import 'react';
|
|
|
11
11
|
import '@croct/plug';
|
|
12
12
|
import '@croct/sdk/facade/evaluatorFacade';
|
|
13
13
|
import '@croct/plug/plug';
|
|
14
|
+
import '@croct/sdk/contentFetcher';
|
|
15
|
+
import '@croct/sdk/utilityTypes';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@croct/plug-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.16.0",
|
|
4
4
|
"description": "React components and hooks to plug your React applications into Croct.",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "Croct",
|
|
@@ -62,24 +62,24 @@
|
|
|
62
62
|
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
63
63
|
},
|
|
64
64
|
"dependencies": {
|
|
65
|
-
"@croct/plug": "^0.
|
|
66
|
-
"@croct/sdk": "^0.
|
|
65
|
+
"@croct/plug": "^0.22.0",
|
|
66
|
+
"@croct/sdk": "^0.21.0"
|
|
67
67
|
},
|
|
68
68
|
"devDependencies": {
|
|
69
69
|
"@babel/core": "^7.25.2",
|
|
70
70
|
"@babel/preset-react": "^7.24.7",
|
|
71
71
|
"@babel/preset-typescript": "^7.24.7",
|
|
72
|
-
"@croct/eslint-plugin": "^0.
|
|
72
|
+
"@croct/eslint-plugin": "^0.8.3",
|
|
73
73
|
"@testing-library/jest-dom": "^6.6.3",
|
|
74
74
|
"@testing-library/react": "^16.1.0",
|
|
75
75
|
"@types/jest": "^30.0.0",
|
|
76
76
|
"@types/node": "^24.0.0",
|
|
77
77
|
"@types/react": "^19.0.0",
|
|
78
78
|
"@types/react-dom": "^19.0.0",
|
|
79
|
-
"@typescript-eslint/eslint-plugin": "^
|
|
80
|
-
"@typescript-eslint/parser": "^
|
|
79
|
+
"@typescript-eslint/eslint-plugin": "^8.54.0",
|
|
80
|
+
"@typescript-eslint/parser": "^8.54.0",
|
|
81
81
|
"esbuild-fix-imports-plugin": "^1.0.19",
|
|
82
|
-
"eslint": "^
|
|
82
|
+
"eslint": "^9.39.2",
|
|
83
83
|
"jest": "^30.0.0",
|
|
84
84
|
"jest-environment-jsdom": "^30.0.0",
|
|
85
85
|
"jest-environment-node": "^30.0.0",
|
package/ssr-polyfills.cjs
CHANGED
|
@@ -26,7 +26,7 @@ var import_plug = require("@croct/plug/plug");
|
|
|
26
26
|
function isSsr() {
|
|
27
27
|
return globalThis.window?.document?.createElement === void 0;
|
|
28
28
|
}
|
|
29
|
-
const croct = !isSsr() ? function factory() {
|
|
29
|
+
const croct = !isSsr() ? (function factory() {
|
|
30
30
|
let timeoutId = null;
|
|
31
31
|
let resolveCallback;
|
|
32
32
|
let rejectCallback;
|
|
@@ -52,7 +52,7 @@ const croct = !isSsr() ? function factory() {
|
|
|
52
52
|
return target[property];
|
|
53
53
|
}
|
|
54
54
|
});
|
|
55
|
-
}() : new Proxy(import_plug.GlobalPlug.GLOBAL, {
|
|
55
|
+
})() : new Proxy(import_plug.GlobalPlug.GLOBAL, {
|
|
56
56
|
get: function getProperty(_, property) {
|
|
57
57
|
switch (property) {
|
|
58
58
|
case "initialized":
|
package/ssr-polyfills.js
CHANGED
|
@@ -2,7 +2,7 @@ import { GlobalPlug } from "@croct/plug/plug";
|
|
|
2
2
|
function isSsr() {
|
|
3
3
|
return globalThis.window?.document?.createElement === void 0;
|
|
4
4
|
}
|
|
5
|
-
const croct = !isSsr() ? function factory() {
|
|
5
|
+
const croct = !isSsr() ? (function factory() {
|
|
6
6
|
let timeoutId = null;
|
|
7
7
|
let resolveCallback;
|
|
8
8
|
let rejectCallback;
|
|
@@ -28,7 +28,7 @@ const croct = !isSsr() ? function factory() {
|
|
|
28
28
|
return target[property];
|
|
29
29
|
}
|
|
30
30
|
});
|
|
31
|
-
}() : new Proxy(GlobalPlug.GLOBAL, {
|
|
31
|
+
})() : new Proxy(GlobalPlug.GLOBAL, {
|
|
32
32
|
get: function getProperty(_, property) {
|
|
33
33
|
switch (property) {
|
|
34
34
|
case "initialized":
|