Missing Typescript declarations for next-slicezone

[maurocolella]

Version

v3.8.4

Reproduction

• install next-slicezone in a Typescript project.
• import hooks.

What is expected?

• A TypeScript definition is found for all importable modules.

What is actually happening?

• The TypeScript compilator complains (and refuses to compile).

Any additional information

Auto-generated declarations should probably cover most needs. https://www.typescriptlang.org/docs/handbook/declaration-files/dts-from-js.html

[lihbr]

Hey @maurocolella, thanks for the report!

We'll have a look at that, indeed we know proper TypeScript support is becoming more and more of an issue with our multiple dev kits and are definitely looking forward to improving that this year 🙌

In the meantime, if you find a workaround feel free to share it here for other TypeScript users~ 🙂

[maurocolella]

Hey @lihbr thanks for your reply! For me, the workaround so far has been to simply implement custom slice parsing logic, which enables me to make use of next/dynamic, lazy loading and code splitting.

Yet another thing I'd like to suggest for this use case.

While on the topic, another feature that's pretty critical for my team, and that would be a game changer, would be some way to supply custom field types. Not content types but field types with their own input widgets.

I like the concept of slice, the integration with Storybook, the laser-focus on content features, there is a lot that we like so far about working with prismic, but we really need to be able to think (and work) outside the box.

[hypervillain]

@maurocolella any chance I could have a look at your custom parser?

[maurocolella]

Hey @hypervillain . Unfortunately, we have discontinued the Prismic part of the project, and I don't remember all the specifics.

We did continue with another CMS, and while we don't have a slice generator per se, we have a dynamic, effective component template, with live preview during editing, lazy loading, etc.

I will gladly answer questions to the best of my ability.

[asotog]

Same here would be great the typescript support, I created a NextJS project with typescript but is complaining in

import { useGetStaticPaths, useGetStaticProps } from "next-slicezone/hooks";

I added

declare module "next-slicezone/hooks";

to next-env.d.ts file and works fine

[jamsch]

Yep, you'd want to do something like the following for the time being

declare module "next-slicezone";
declare module "next-slicezone/hooks";
declare module "next-slicezone/resolver";

Also, to avoid the eslint error react-hooks/rules-of-hooks you'd want to alias the "useXXX" exports

// pages/[uid].tsx

import {
  useGetStaticProps as createGetStaticProps,
  useGetStaticPaths as createGetStaticPaths,
} from "next-slicezone/hooks";
// ...
export const getStaticProps = createGetStaticProps({ ... });
export const getStaticPaths = createGetStaticPaths({ ... });

[beqramo]

any fix? that library needs type declaration file

[lihbr]

Hey there, sorry for the delay

next-slicezone is not anymore the package of choice to manage your Slice Zone with Next.js.

The Slice Zone from @prismicio/react now is. It comes with comprehensive TypeScript types, solving this issue: https://prismic.io/docs/technical-reference/prismicio-react#slicezone