diff --git a/examples/custom-slicezone-props/index.tsx b/examples/custom-slicezone-props/index.tsx index a7cc27e..363ab32 100644 --- a/examples/custom-slicezone-props/index.tsx +++ b/examples/custom-slicezone-props/index.tsx @@ -5,10 +5,10 @@ import * as React from "react"; import { SliceZone, SliceComponentProps, - SliceZoneComponents, + SliceComponentType, } from "@prismicio/react"; -import { Slices, HeroSlice, ExampleSliceZone } from "./types"; +import { HeroSlice, ExampleSliceZone } from "./types"; // This is the contents of a Slice Zone field. // Normally, this would be accessed at `document.data.body`, where `document` @@ -71,7 +71,7 @@ const CallToActionSlice = ({ // It is important to define this object *outside* the React component that // uses ``. This ensures the React app will not re-render // unnecessarily. -const components: SliceZoneComponents = { +const components: Record = { // Since HeroSlice accepts a `slice` prop, we can pass the component directly. hero: HeroSlice, diff --git a/examples/custom-slicezone-props/package.json b/examples/custom-slicezone-props/package.json index 08521d4..6dd2d0a 100644 --- a/examples/custom-slicezone-props/package.json +++ b/examples/custom-slicezone-props/package.json @@ -1,9 +1,9 @@ { "type": "module", "dependencies": { - "@prismicio/react": "alpha" + "@prismicio/react": "../../src" }, "devDependencies": { - "@prismicio/types": "^0.1.4" + "@prismicio/client": "^7.1.0" } } diff --git a/examples/custom-slicezone-props/types.ts b/examples/custom-slicezone-props/types.ts index ae41190..4dbdb68 100644 --- a/examples/custom-slicezone-props/types.ts +++ b/examples/custom-slicezone-props/types.ts @@ -1,20 +1,20 @@ -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; -export type HeroSlice = prismicT.Slice< +export type HeroSlice = prismic.Slice< "hero", { - heading: prismicT.KeyTextField; - buttonText: prismicT.KeyTextField; + heading: prismic.KeyTextField; + buttonText: prismic.KeyTextField; } >; -export type CallToActionSlice = prismicT.Slice< +export type CallToActionSlice = prismic.Slice< "call_to_action", { - text: prismicT.KeyTextField; + text: prismic.KeyTextField; } >; export type Slices = HeroSlice | CallToActionSlice; -export type ExampleSliceZone = prismicT.SliceZone; +export type ExampleSliceZone = prismic.SliceZone; diff --git a/examples/router-link/index.tsx b/examples/router-link/index.tsx index 73814f9..3dc08ba 100644 --- a/examples/router-link/index.tsx +++ b/examples/router-link/index.tsx @@ -1,11 +1,11 @@ import * as React from "react"; -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; import { PrismicLink, LinkProps } from "@prismicio/react"; import { Link } from "react-router-dom"; // This is an example Link field value. It contains a URL internal to the app. -const field: prismicT.LinkField = { - link_type: prismicT.LinkType.Web, +const field: prismic.LinkField = { + link_type: prismic.LinkType.Web, url: "/internal-url", }; diff --git a/examples/router-link/package.json b/examples/router-link/package.json index 0075029..2e43249 100644 --- a/examples/router-link/package.json +++ b/examples/router-link/package.json @@ -1,11 +1,11 @@ { "type": "module", "dependencies": { - "@prismicio/react": "alpha", + "@prismicio/react": "../../src", "react-router-dom": "^5.2.0" }, "devDependencies": { - "@prismicio/types": "^0.1.4", + "@prismicio/client": "^7.1.0", "@types/react-router-dom": "^5.1.8" } } diff --git a/examples/router-link/types.ts b/examples/router-link/types.ts index ae41190..4dbdb68 100644 --- a/examples/router-link/types.ts +++ b/examples/router-link/types.ts @@ -1,20 +1,20 @@ -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; -export type HeroSlice = prismicT.Slice< +export type HeroSlice = prismic.Slice< "hero", { - heading: prismicT.KeyTextField; - buttonText: prismicT.KeyTextField; + heading: prismic.KeyTextField; + buttonText: prismic.KeyTextField; } >; -export type CallToActionSlice = prismicT.Slice< +export type CallToActionSlice = prismic.Slice< "call_to_action", { - text: prismicT.KeyTextField; + text: prismic.KeyTextField; } >; export type Slices = HeroSlice | CallToActionSlice; -export type ExampleSliceZone = prismicT.SliceZone; +export type ExampleSliceZone = prismic.SliceZone; diff --git a/examples/with-global-configuration/index.tsx b/examples/with-global-configuration/index.tsx index 9f47262..cdde9c3 100644 --- a/examples/with-global-configuration/index.tsx +++ b/examples/with-global-configuration/index.tsx @@ -2,7 +2,7 @@ /* eslint-disable react/display-name */ import * as React from "react"; -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; import { PrismicProvider, PrismicLink, @@ -13,15 +13,15 @@ import { import { Link } from "react-router-dom"; // This is an example Link field value. It contains a URL internal to the app. -const linkField: prismicT.LinkField = { - link_type: prismicT.LinkType.Web, +const linkField: prismic.LinkField = { + link_type: prismic.LinkType.Web, url: "/internal-url", }; // This is an example Rich Text field value. It contains a "Heading 1" block. -const richTextField: prismicT.RichTextField = [ +const richTextField: prismic.RichTextField = [ { - type: prismicT.RichTextNodeType.heading1, + type: prismic.RichTextNodeType.heading1, text: "Lorem ipsum", spans: [], }, diff --git a/examples/with-global-configuration/package.json b/examples/with-global-configuration/package.json index 0075029..2e43249 100644 --- a/examples/with-global-configuration/package.json +++ b/examples/with-global-configuration/package.json @@ -1,11 +1,11 @@ { "type": "module", "dependencies": { - "@prismicio/react": "alpha", + "@prismicio/react": "../../src", "react-router-dom": "^5.2.0" }, "devDependencies": { - "@prismicio/types": "^0.1.4", + "@prismicio/client": "^7.1.0", "@types/react-router-dom": "^5.1.8" } } diff --git a/examples/with-global-configuration/types.ts b/examples/with-global-configuration/types.ts index ae41190..4dbdb68 100644 --- a/examples/with-global-configuration/types.ts +++ b/examples/with-global-configuration/types.ts @@ -1,20 +1,20 @@ -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; -export type HeroSlice = prismicT.Slice< +export type HeroSlice = prismic.Slice< "hero", { - heading: prismicT.KeyTextField; - buttonText: prismicT.KeyTextField; + heading: prismic.KeyTextField; + buttonText: prismic.KeyTextField; } >; -export type CallToActionSlice = prismicT.Slice< +export type CallToActionSlice = prismic.Slice< "call_to_action", { - text: prismicT.KeyTextField; + text: prismic.KeyTextField; } >; export type Slices = HeroSlice | CallToActionSlice; -export type ExampleSliceZone = prismicT.SliceZone; +export type ExampleSliceZone = prismic.SliceZone; diff --git a/examples/with-typescript/README.md b/examples/with-typescript/README.md index c73a37c..faa9d96 100644 --- a/examples/with-typescript/README.md +++ b/examples/with-typescript/README.md @@ -1,5 +1,5 @@ # With TypeScript -This example shows how `@prismicio/react` is used in TypeScript projects. `@prismicio/react` is written in TypeScript using types from [`@prismicio/types`](https://github.com/prismicio/prismic-types). +This example shows how `@prismicio/react` is used in TypeScript projects. `@prismicio/react` is written in TypeScript using types from [`@prismicio/client`](https://github.com/prismicio/prismic-client). You can write types for your documents using `PrismicDocument`. Components from `@prismicio/react` will type check against your document and its fields. diff --git a/examples/with-typescript/index.tsx b/examples/with-typescript/index.tsx index 3460d8f..cfdb9ea 100644 --- a/examples/with-typescript/index.tsx +++ b/examples/with-typescript/index.tsx @@ -1,43 +1,43 @@ import * as React from "react"; -import * as prismicH from "@prismicio/helpers"; -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; import { SliceZone, PrismicRichText, PrismicLink } from "@prismicio/react"; -// Documents can be typed using `@prismicio/types` -type PageDocument = prismicT.PrismicDocumentWithUID<{ - title: prismicT.TitleField; - meta_description: prismicT.RichTextField; - related_links: prismicT.GroupField<{ - link: prismicT.LinkField; +// Documents can be typed using `@prismicio/client` +type PageDocument = prismic.PrismicDocumentWithUID<{ + title: prismic.TitleField; + meta_description: prismic.RichTextField; + related_links: prismic.GroupField<{ + label: prismic.KeyTextField; + link: prismic.LinkField; }>; - // Each Slice in a Slice Zone can be typed using `prismicT.Slice` - slices: prismicT.SliceZone< - | prismicT.Slice< + // Each Slice in a Slice Zone can be typed using `prismic.Slice` + slices: prismic.SliceZone< + | prismic.Slice< // Slice type "hero", // Primary/non-repeatable fields { - heading: prismicT.TitleField; - body: prismicT.RichTextField; + heading: prismic.TitleField; + body: prismic.RichTextField; }, // Item/repeatable fields { - buttonText: prismicT.KeyTextField; - buttonLink: prismicT.LinkField; + buttonText: prismic.KeyTextField; + buttonLink: prismic.LinkField; } > - | prismicT.Slice< + | prismic.Slice< // Slice type "call_to_action", // Primary/non-repeatable fields { - text: prismicT.RichTextField; + text: prismic.RichTextField; }, // Item/repeatable fields { - buttonText: prismicT.KeyTextField; - buttonLink: prismicT.LinkField; + buttonText: prismic.KeyTextField; + buttonLink: prismic.LinkField; } > >; @@ -70,18 +70,18 @@ export const WithDocumentLink = (): JSX.Element => { export const WithGroupFieldLink = (): JSX.Element => { return (
    - {prismicH.isFilled.group(page.data.related_links) && + {prismic.isFilled.group(page.data.related_links) && page.data.related_links.map( (item) => - prismicH.isFilled.link(item.link) && ( + prismic.isFilled.link(item.link) && (
  • - {item} + {item.label}
    • ), )} diff --git a/examples/with-typescript/package.json b/examples/with-typescript/package.json index 3d54c7a..6dd2d0a 100644 --- a/examples/with-typescript/package.json +++ b/examples/with-typescript/package.json @@ -1,9 +1,9 @@ { "type": "module", "dependencies": { - "@prismicio/react": "latest" + "@prismicio/react": "../../src" }, "devDependencies": { - "@prismicio/types": "^0.1.25" + "@prismicio/client": "^7.1.0" } } diff --git a/src/clientHooks.ts b/src/clientHooks.ts index 1cdf982..770bd0c 100644 --- a/src/clientHooks.ts +++ b/src/clientHooks.ts @@ -1,4 +1,4 @@ -import type * as prismicT from "@prismicio/types"; +import type * as prismic from "@prismicio/client"; import { ClientHookReturnType, @@ -21,9 +21,9 @@ import { * * @see Underlying `@prismicio/client` method {@link proto.get} */ -export const usePrismicDocuments = ( +export const usePrismicDocuments = ( ...args: [params?: ClientMethodParameters<"get">[0] & HookOnlyParameters] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("get", args); /** @@ -42,7 +42,7 @@ export const usePrismicDocuments = ( * @see Underlying `@prismicio/client` method {@link proto.getFirst} */ export const useFirstPrismicDocument = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [params?: ClientMethodParameters<"getFirst">[0] & HookOnlyParameters] ): ClientHookReturnType => @@ -65,7 +65,7 @@ export const useFirstPrismicDocument = < * @see Underlying `@prismicio/client` method {@link proto.getAll} */ export const useAllPrismicDocumentsDangerously = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ params?: ClientMethodParameters<"dangerouslyGetAll">[0] & @@ -91,7 +91,7 @@ export const useAllPrismicDocumentsDangerously = < * @see Underlying `@prismicio/client` method {@link proto.getByID} */ export const usePrismicDocumentByID = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ id: ClientMethodParameters<"getByID">[0], @@ -116,13 +116,13 @@ export const usePrismicDocumentByID = < * @see Underlying `@prismicio/client` method {@link proto.getByIDs} */ export const usePrismicDocumentsByIDs = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ id: ClientMethodParameters<"getByIDs">[0], params?: ClientMethodParameters<"getByIDs">[1] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getByIDs", args); /** @@ -142,7 +142,7 @@ export const usePrismicDocumentsByIDs = < * @see Underlying `@prismicio/client` method {@link proto.getAllByIDs} */ export const useAllPrismicDocumentsByIDs = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ id: ClientMethodParameters<"getAllByIDs">[0], @@ -169,7 +169,7 @@ export const useAllPrismicDocumentsByIDs = < * @see Underlying `@prismicio/client` method {@link proto.getByUID} */ export const usePrismicDocumentByUID = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getByUID">[0], @@ -197,14 +197,14 @@ export const usePrismicDocumentByUID = < * @see Underlying `@prismicio/client` method {@link proto.getByUID} */ export const usePrismicDocumentsByUIDs = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getByUIDs">[0], uids: ClientMethodParameters<"getByUIDs">[1], params?: ClientMethodParameters<"getByUIDs">[2] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getByUIDs", args); /** @@ -225,7 +225,7 @@ export const usePrismicDocumentsByUIDs = < * @see Underlying `@prismicio/client` method {@link proto.getByUID} */ export const useAllPrismicDocumentsByUIDs = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getByUIDs">[0], @@ -252,7 +252,7 @@ export const useAllPrismicDocumentsByUIDs = < * @see Underlying `@prismicio/client` method {@link proto.getSingle} */ export const useSinglePrismicDocument = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getSingle">[0], @@ -278,13 +278,13 @@ export const useSinglePrismicDocument = < * @see Underlying `@prismicio/client` method {@link proto.getByType} */ export const usePrismicDocumentsByType = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getByType">[0], params?: ClientMethodParameters<"getByType">[1] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getByType", args); /** @@ -304,7 +304,7 @@ export const usePrismicDocumentsByType = < * @see Underlying `@prismicio/client` method {@link proto.getAllByType} */ export const useAllPrismicDocumentsByType = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ documentType: ClientMethodParameters<"getAllByType">[0], @@ -330,13 +330,13 @@ export const useAllPrismicDocumentsByType = < * @see Underlying `@prismicio/client` method {@link proto.getByTag} */ export const usePrismicDocumentsByTag = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getByTag">[0], params?: ClientMethodParameters<"getByTag">[1] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getByTag", args); /** @@ -356,7 +356,7 @@ export const usePrismicDocumentsByTag = < * @see Underlying `@prismicio/client` method {@link proto.getAllByTag} */ export const useAllPrismicDocumentsByTag = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getAllByTag">[0], @@ -383,13 +383,13 @@ export const useAllPrismicDocumentsByTag = < * @see Underlying `@prismicio/client` method {@link proto.getByTags} */ export const usePrismicDocumentsBySomeTags = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getBySomeTags">[0], params?: ClientMethodParameters<"getBySomeTags">[1] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getBySomeTags", args); /** @@ -410,7 +410,7 @@ export const usePrismicDocumentsBySomeTags = < * @see Underlying `@prismicio/client` method {@link proto.getAllByTags} */ export const useAllPrismicDocumentsBySomeTags = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getAllBySomeTags">[0], @@ -436,13 +436,13 @@ export const useAllPrismicDocumentsBySomeTags = < * @see Underlying `@prismicio/client` method {@link proto.getByTags} */ export const usePrismicDocumentsByEveryTag = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getByEveryTag">[0], params?: ClientMethodParameters<"getByEveryTag">[1] & HookOnlyParameters, ] -): ClientHookReturnType> => +): ClientHookReturnType> => useStatefulPrismicClientMethod("getByEveryTag", args); /** @@ -462,7 +462,7 @@ export const usePrismicDocumentsByEveryTag = < * @see Underlying `@prismicio/client` method {@link proto.getAllByTags} */ export const useAllPrismicDocumentsByEveryTag = < - TDocument extends prismicT.PrismicDocument, + TDocument extends prismic.PrismicDocument, >( ...args: [ tag: ClientMethodParameters<"getAllByEveryTag">[0], diff --git a/test/PrismicRichText.test.tsx b/test/PrismicRichText.test.tsx index ccc5efa..e41139f 100644 --- a/test/PrismicRichText.test.tsx +++ b/test/PrismicRichText.test.tsx @@ -1,14 +1,14 @@ import { it, expect } from "vitest"; -import * as prismicT from "@prismicio/types"; +import * as prismic from "@prismicio/client"; import { renderJSON } from "./__testutils__/renderJSON"; import { PrismicRichText, PrismicProvider } from "../src"; it("renders components given to PrismicProvider", async () => { - const field: prismicT.RichTextField = [ + const field: prismic.RichTextField = [ { - type: prismicT.RichTextNodeType.paragraph, + type: prismic.RichTextNodeType.paragraph, text: "paragraph", spans: [], }, @@ -29,14 +29,14 @@ it("renders components given to PrismicProvider", async () => { }); it("components given to components prop overrides components given to PrismicProvider", async () => { - const field: prismicT.RichTextField = [ + const field: prismic.RichTextField = [ { - type: prismicT.RichTextNodeType.heading1, + type: prismic.RichTextNodeType.heading1, text: "heading", spans: [], }, { - type: prismicT.RichTextNodeType.paragraph, + type: prismic.RichTextNodeType.paragraph, text: "paragraph", spans: [], }, diff --git a/test/__testutils__/mockPrismicRestAPIV2.ts b/test/__testutils__/mockPrismicRestAPIV2.ts index 339f18d..09ff401 100644 --- a/test/__testutils__/mockPrismicRestAPIV2.ts +++ b/test/__testutils__/mockPrismicRestAPIV2.ts @@ -5,13 +5,12 @@ import { rest } from "msw"; import { createRepositoryName } from "./createRepositoryName"; import * as prismic from "@prismicio/client"; -import * as prismicT from "@prismicio/types"; type MockPrismicRestAPIV2Args = { ctx: TestContext; accessToken?: string; - repositoryResponse?: prismicT.Repository; - queryResponse?: prismicT.Query | prismicT.Query[]; + repositoryResponse?: prismic.Repository; + queryResponse?: prismic.Query | prismic.Query[]; queryRequiredParams?: Record; queryDelay?: number; }; diff --git a/test/usePrismicDocumentByUID.test.tsx b/test/usePrismicDocumentByUID.test.tsx index 60e883a..1a23ae5 100644 --- a/test/usePrismicDocumentByUID.test.tsx +++ b/test/usePrismicDocumentByUID.test.tsx @@ -3,7 +3,6 @@ import { it, expect, afterEach } from "vitest"; import * as React from "react"; import * as prismic from "@prismicio/client"; -import * as prismicT from "@prismicio/types"; import { renderHook, cleanup, waitFor } from "@testing-library/react"; import * as assert from "node:assert"; @@ -30,7 +29,7 @@ it("returns document with matching UID", async (ctx) => { uid: ctx.mock.model.uid(), }, }), - }) as prismicT.PrismicDocumentWithUID; + }) as prismic.PrismicDocumentWithUID; mockPrismicRestAPIV2({ ctx, @@ -66,7 +65,7 @@ it("supports params", async (ctx) => { uid: ctx.mock.model.uid(), }, }), - }) as prismicT.PrismicDocumentWithUID; + }) as prismic.PrismicDocumentWithUID; const params = { pageSize: 2, @@ -107,7 +106,7 @@ it("supports explicit client", async (ctx) => { uid: ctx.mock.model.uid(), }, }), - }) as prismicT.PrismicDocumentWithUID; + }) as prismic.PrismicDocumentWithUID; mockPrismicRestAPIV2({ ctx,