@prismicio/vue 4.0.1 → 4.0.2

package/dist/components/SliceZone.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SliceZone.cjs","sources":["../../../src/components/SliceZone.ts"],"sourcesContent":["import { Slice } from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tConcreteComponent,\n\tDefineComponent,\n\tFunctionalComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tmarkRaw,\n\twatchEffect,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * Returns the type of a `SliceLike` type.\n *\n * @typeParam TSlice - The Slice from which the type will be extracted.\n */\ntype ExtractSliceType<TSlice extends SliceLike> = TSlice extends SliceLikeRestV2\n\t? TSlice[\"slice_type\"]\n\t: TSlice extends SliceLikeGraphQL\n\t? TSlice[\"type\"]\n\t: never;\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * Rest API V2 for the `<SliceZone>` component.\n *\n * If using Prismic's Rest API V2, use the `Slice` export from\n * `@prismicio/client` for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeRestV2<TSliceType extends string = string> = {\n\tslice_type: Slice<TSliceType>[\"slice_type\"];\n\tid?: string;\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * GraphQL API for the `<SliceZone>` component.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeGraphQL<TSliceType extends string = string> = {\n\ttype: Slice<TSliceType>[\"slice_type\"];\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice for the\n * `<SliceZone />` component.\n *\n * If using Prismic's REST API, use the `Slice` export from `@prismicio/client`\n * for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice\n */\nexport type SliceLike<TSliceType extends string = string> =\n\t| SliceLikeRestV2<TSliceType>\n\t| SliceLikeGraphQL<TSliceType>;\n\n/**\n * A looser version of the `SliceZone` type from `@prismicio/client` using\n * `SliceLike`.\n *\n * If using Prismic's REST API, use the `SliceZone` export from\n * `@prismicio/client` for the full type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n */\nexport type SliceZoneLike<TSlice extends SliceLike = SliceLike> =\n\treadonly TSlice[];\n\n/**\n * Vue props for a component rendering content from a Prismic Slice using the\n * `<SliceZone />` component.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type SliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\t/**\n\t * Slice data for this component.\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\tindex: number;\n\n\t/**\n\t * All Slices from the Slice Zone to which the Slice belongs.\n\t */\n\t// TODO: We have to keep this list of Slices general due to circular\n\t// reference limtiations. If we had another generic to determine the full\n\t// union of Slice types, it would include TSlice. This causes TypeScript to\n\t// throw a compilation error.\n\tslices: SliceZoneLike<SliceLike>;\n\n\t/**\n\t * Arbitrary data passed to `<SliceZone />` and made available to all Slice\n\t * components.\n\t */\n\tcontext: TContext;\n};\n\n/**\n * Native Vue props for a component rendering content from a Prismic Slice using\n * the `<SliceZone />` component.\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type DefineComponentSliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\tslice: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>;\n\t\trequired: true;\n\t};\n\tindex: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>;\n\t\trequired: true;\n\t};\n\tslices: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>;\n\t\trequired: true;\n\t};\n\tcontext: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"context\"]>;\n\t\trequired: true;\n\t};\n};\n\n/**\n * Gets native Vue props for a component rendering content from a Prismic Slice\n * using the `<SliceZone />` component.\n *\n * Props are: `[\"slice\", \"index\", \"slices\", \"context\"]`\n *\n * @example Defining a new slice component:\n *\n * ```javascript\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps(),\n * };\n * ```\n *\n * @example Defining a new slice component with visual hint:\n *\n * ```javascript\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps([\"slice\", \"index\", \"slices\", \"context\"]),\n * };\n * ```\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n * @param propsHint - An optional array of prop names used for the sole purpose\n *   of having a visual hint of which props are made available to the slice,\n *   this parameters doesn't have any effect\n *\n * @returns Props object to use with {@link defineComponent}\n */\nexport const getSliceComponentProps = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\tpropsHint?: [\"slice\", \"index\", \"slices\", \"context\"],\n): DefineComponentSliceComponentProps<TSlice, TContext> => ({\n\tslice: {\n\t\ttype: Object as PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>,\n\t\trequired: true,\n\t},\n\tindex: {\n\t\ttype: Number as PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>,\n\t\trequired: true,\n\t},\n\tslices: {\n\t\ttype: Array as PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>,\n\t\trequired: true,\n\t},\n\tcontext: {\n\t\ttype: null as unknown as PropType<\n\t\t\tSliceComponentProps<TSlice, TContext>[\"context\"]\n\t\t>,\n\t\trequired: true,\n\t},\n});\n\n/**\n * A Vue component to be rendered for each instance of its Slice.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceComponentType<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> =\n\t// For reference within TypeScript files when `*.vue` type cannot be inferred\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types\n\t| DefineComponent<{}, {}, any>\n\t| DefineComponent<SliceComponentProps<TSlice, TContext>>\n\t| FunctionalComponent<SliceComponentProps<TSlice, TContext>>;\n\n/**\n * This Slice component can be used as a reminder to provide a proper\n * implementation.\n *\n * This is also the default Vue component rendered when a component mapping\n * cannot be found in `<SliceZone />`.\n */\nexport const TODOSliceComponent = __PRODUCTION__\n\t? ((() => null) as FunctionalComponent<SliceComponentProps>)\n\t: /*#__PURE__*/ (defineComponent({\n\t\t\tname: \"TODOSliceComponent\",\n\t\t\tprops: getSliceComponentProps(),\n\t\t\tsetup(props) {\n\t\t\t\tconst type = computed(() =>\n\t\t\t\t\t\"slice_type\" in props.slice\n\t\t\t\t\t\t? props.slice.slice_type\n\t\t\t\t\t\t: props.slice.type,\n\t\t\t\t);\n\n\t\t\t\twatchEffect(() => {\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`[SliceZone] Could not find a component for Slice type \"${type.value}\"`,\n\t\t\t\t\t\tprops.slice,\n\t\t\t\t\t);\n\t\t\t\t});\n\n\t\t\t\treturn () => {\n\t\t\t\t\treturn h(\n\t\t\t\t\t\t\"section\",\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"data-slice-zone-todo-component\": \"\",\n\t\t\t\t\t\t\t\"data-slice-type\": type.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t[`Could not find a component for Slice type \"${type.value}\"`],\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t  }) as SliceComponentType);\n\n/**\n * A record of Slice types mapped to Vue components. Each components will be\n * rendered for each instance of their Slice type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneComponents<\n\tTSlice extends SliceLike = SliceLike,\n\tTContext = unknown,\n> =\n\t// This is purposely not wrapped in Partial to ensure a component is provided\n\t// for all Slice types. <SliceZone /> will render a default component if one is\n\t// not provided, but it *should* be a type error if an explicit component is\n\t// missing.\n\t//\n\t// If a developer purposely does not want to provide a component, they can\n\t// assign it to the TODOSliceComponent exported from this package. This\n\t// signals to future developers that it is a placeholder and should be\n\t// implemented.\n\t{\n\t\t[SliceType in ExtractSliceType<TSlice>]:\n\t\t\t| SliceComponentType<Extract<TSlice, SliceLike<SliceType>>, TContext>\n\t\t\t| string;\n\t};\n\n/**\n * Gets an optimized record of Slice types mapped to Vue components. Each\n * components will be rendered for each instance of their Slice type.\n *\n * @remarks\n * This is essentially an helper function to ensure {@link markRaw} is correctly\n * applied on each components, improving performances.\n * @example Defining a slice components:\n *\n * ```javascript\n * import { defineSliceZoneComponents } from \"@prismicio/vue\";\n *\n * export default {\n *   data() {\n *     components: defineSliceZoneComponents({\n *       foo: Foo,\n *       bar: defineAsyncComponent(\n *         () => new Promise((res) => res(Bar)),\n *       ),\n *       baz: \"Baz\",\n *     }),\n *   }\n * };\n * ```\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n *\n * @param components - {@link SliceZoneComponents}\n *\n * @returns A new optimized record of {@link SliceZoneComponents}\n */\nexport const defineSliceZoneComponents = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\tcomponents: SliceZoneComponents<TSlice, TContext>,\n): SliceZoneComponents<TSlice, TContext> => {\n\tconst result = {} as SliceZoneComponents<TSlice, TContext>;\n\n\tlet type: keyof typeof components;\n\tfor (type in components) {\n\t\tconst component = components[type];\n\t\tresult[type] =\n\t\t\ttypeof component === \"string\"\n\t\t\t\t? component\n\t\t\t\t: markRaw(\n\t\t\t\t\t\tcomponent as SliceComponentType<\n\t\t\t\t\t\t\tExtract<TSlice, SliceLike<typeof type>>,\n\t\t\t\t\t\t\tTContext\n\t\t\t\t\t\t>,\n\t\t\t\t  );\n\t}\n\n\treturn result;\n};\n\n/**\n * Arguments for a `<SliceZone>` `resolver` function.\n */\nexport type SliceZoneResolverArgs<TSlice extends SliceLike = SliceLike> = {\n\t/**\n\t * The Slice to resolve to a Vue component..\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The name of the Slice.\n\t */\n\tsliceName: ExtractSliceType<TSlice>;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\ti: number;\n};\n\n/**\n * A function that determines the rendered Vue component for each Slice in the\n * Slice Zone. If a nullish value is returned, the component will fallback to\n * the `components` or `defaultComponent` props to determine the rendered\n * component.\n *\n * @deprecated Use the `components` prop instead.\n *\n * @param args - Arguments for the resolver function.\n *\n * @returns The Vue component to render for a Slice.\n */\nexport type SliceZoneResolver<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = (\n\targs: SliceZoneResolverArgs<TSlice>,\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n) => SliceComponentType<any, TContext> | string | undefined | null;\n\n/**\n * Props for `<SliceZone />`.\n *\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneProps<TContext = unknown> = {\n\t/**\n\t * List of Slice data from the Slice Zone.\n\t */\n\tslices: SliceZoneLike;\n\n\t/**\n\t * A record mapping Slice types to Vue components.\n\t */\n\tcomponents?: SliceZoneComponents;\n\n\t/**\n\t * A function that determines the rendered Vue component for each Slice in the\n\t * Slice Zone.\n\t *\n\t * @deprecated Use the `components` prop instead.\n\t *\n\t * @param args - Arguments for the resolver function.\n\t *\n\t * @returns The Vue component to render for a Slice.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tresolver?: SliceZoneResolver<any, TContext>;\n\n\t/**\n\t * Arbitrary data made available to all Slice components.\n\t */\n\tcontext?: TContext;\n\n\t/**\n\t * A component or a functional component rendered if a component mapping from\n\t * the `components` prop cannot be found.\n\t *\n\t * @remarks\n\t * Components will be rendered using the {@link SliceComponentProps} interface.\n\t *\n\t * @defaultValue The Slice Zone default component provided to `@prismicio/vue` plugin if configured, otherwise `null` when `process.env.NODE_ENV === \"production\"` else {@link TODOSliceComponent}.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tdefaultComponent?: SliceComponentType<any, TContext>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to wrap the\n\t * output. The Slice Zone is not wrapped by default.\n\t */\n\twrapper?: string | ConcreteComponent | Raw<DefineComponent>;\n};\n\n/**\n * `<SliceZone />` implementation.\n *\n * @internal\n */\nexport const SliceZoneImpl = /*#__PURE__*/ defineComponent({\n\tname: \"SliceZone\",\n\tprops: {\n\t\tslices: {\n\t\t\ttype: Array as PropType<SliceZoneLike>,\n\t\t\trequired: true,\n\t\t},\n\t\tcomponents: {\n\t\t\ttype: Object as PropType<SliceZoneComponents>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tresolver: {\n\t\t\ttype: Function as PropType<SliceZoneResolver>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tcontext: {\n\t\t\ttype: null,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tdefaultComponent: {\n\t\t\ttype: Object as PropType<SliceComponentType>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twrapper: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.slices) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst renderedSlices = computed(() => {\n\t\t\treturn props.slices.map((slice, index) => {\n\t\t\t\tconst type = \"slice_type\" in slice ? slice.slice_type : slice.type;\n\n\t\t\t\tlet component =\n\t\t\t\t\tprops.components && type in props.components\n\t\t\t\t\t\t? props.components[type]\n\t\t\t\t\t\t: props.defaultComponent ||\n\t\t\t\t\t\t  options.components?.sliceZoneDefaultComponent ||\n\t\t\t\t\t\t  TODOSliceComponent;\n\n\t\t\t\t// TODO: Remove `resolver` in v3 in favor of `components`.\n\t\t\t\tif (props.resolver) {\n\t\t\t\t\tconst resolvedComponent = props.resolver({\n\t\t\t\t\t\tslice,\n\t\t\t\t\t\tsliceName: type,\n\t\t\t\t\t\ti: index,\n\t\t\t\t\t});\n\n\t\t\t\t\tif (resolvedComponent) {\n\t\t\t\t\t\tcomponent = resolvedComponent;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst key =\n\t\t\t\t\t\"id\" in slice && slice.id\n\t\t\t\t\t\t? slice.id\n\t\t\t\t\t\t: `${index}-${JSON.stringify(slice)}`;\n\n\t\t\t\tconst p = {\n\t\t\t\t\tkey,\n\t\t\t\t\tslice,\n\t\t\t\t\tindex,\n\t\t\t\t\tcontext: props.context,\n\t\t\t\t\tslices: props.slices,\n\t\t\t\t};\n\n\t\t\t\treturn h(simplyResolveComponent(component as ConcreteComponent), p);\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (props.wrapper) {\n\t\t\t\tconst parent = simplyResolveComponent(props.wrapper);\n\n\t\t\t\tif (typeof parent === \"string\") {\n\t\t\t\t\treturn h(parent, null, renderedSlices.value);\n\t\t\t\t} else {\n\t\t\t\t\treturn h(parent, null, { default: () => renderedSlices.value });\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn renderedSlices.value;\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic Slice Zone.\n *\n * @see Component props {@link SliceZoneProps}\n * @see Templating Slice Zones {@link https://prismic.io/docs/technologies/vue-template-content#slices-and-groups}\n */\nexport const SliceZone = SliceZoneImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tSliceZoneProps;\n\t};\n};\n"],"names":["__PRODUCTION__","defineComponent","computed","watchEffect","h","markRaw","usePrismic","simplyResolveComponent"],"mappings":";;;;;;AA2La,MAAA,yBAAyB,CAMrC,eAC2D;AAAA,EAC3D,OAAO;AAAA,IACN,MAAM;AAAA,IACN,UAAU;AAAA,EACV;AAAA,EACD,OAAO;AAAA,IACN,MAAM;AAAA,IACN,UAAU;AAAA,EACV;AAAA,EACD,QAAQ;AAAA,IACP,MAAM;AAAA,IACN,UAAU;AAAA,EACV;AAAA,EACD,SAAS;AAAA,IACR,MAAM;AAAA,IAGN,UAAU;AAAA,EACV;AACD;AA0BM,MAAM,qBAAqBA,eAAA,iBAC7B,MAAM,OACuBC,oCAAA;AAAA,EAC/B,MAAM;AAAA,EACN,OAAO,uBAAwB;AAAA,EAC/B,MAAM,OAAK;AACJ,UAAA,OAAOC,IAAS,SAAA,MACrB,gBAAgB,MAAM,QACnB,MAAM,MAAM,aACZ,MAAM,MAAM,IAAI;AAGpBC,QAAAA,YAAY,MAAK;AAChB,cAAQ,KACP,0DAA0D,KAAK,UAC/D,MAAM,KAAK;AAAA,IAAA,CAEZ;AAED,WAAO,MAAK;AACX,aAAOC,IAAAA,EACN,WACA;AAAA,QACC,kCAAkC;AAAA,QAClC,mBAAmB,KAAK;AAAA,MAAA,GAEzB,CAAC,8CAA8C,KAAK,QAAQ,CAAC;AAAA,IAAA;AAAA,EAGhE;AACC,CAAA;AA4DS,MAAA,4BAA4B,CAKxC,eAC0C;AAC1C,QAAM,SAAS,CAAA;AAEX,MAAA;AACJ,OAAK,QAAQ,YAAY;AAClB,UAAA,YAAY,WAAW,IAAI;AACjC,WAAO,IAAI,IACV,OAAO,cAAc,WAClB,YACAC,IAAAA,QACA,SAGC;AAAA,EAEL;AAEM,SAAA;AACR;AAqGO,MAAM,gBAA8CJ,oBAAAA,gBAAA;AAAA,EAC1D,MAAM;AAAA,EACN,OAAO;AAAA,IACN,QAAQ;AAAA,MACP,MAAM;AAAA,MACN,UAAU;AAAA,IACV;AAAA,IACD,YAAY;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,IACV;AAAA,IACD,UAAU;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,IACV;AAAA,IACD,SAAS;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,IACV;AAAA,IACD,kBAAkB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,IACV;AAAA,IACD,SAAS;AAAA,MACR,MAAM,CAAC,QAAQ,QAAQ,QAAQ;AAAA,MAG/B,SAAS;AAAA,MACT,UAAU;AAAA,IACV;AAAA,EACD;AAAA,EACD,MAAM,OAAK;AAEN,QAAA,CAAC,MAAM,QAAQ;AAClB,aAAO,MAAM;AAAA,IACb;AAEK,UAAA,EAAE,YAAYK,WAAAA;AAEd,UAAA,iBAAiBJ,IAAAA,SAAS,MAAK;AACpC,aAAO,MAAM,OAAO,IAAI,CAAC,OAAO,UAAS;;AACxC,cAAM,OAAO,gBAAgB,QAAQ,MAAM,aAAa,MAAM;AAE9D,YAAI,YACH,MAAM,cAAc,QAAQ,MAAM,aAC/B,MAAM,WAAW,IAAI,IACrB,MAAM,sBACN,aAAQ,eAAR,mBAAoB,8BACpB;AAGJ,YAAI,MAAM,UAAU;AACb,gBAAA,oBAAoB,MAAM,SAAS;AAAA,YACxC;AAAA,YACA,WAAW;AAAA,YACX,GAAG;AAAA,UAAA,CACH;AAED,cAAI,mBAAmB;AACV,wBAAA;AAAA,UACZ;AAAA,QACD;AAEK,cAAA,MACL,QAAQ,SAAS,MAAM,KACpB,MAAM,KACN,GAAG,SAAS,KAAK,UAAU,KAAK;AAEpC,cAAM,IAAI;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS,MAAM;AAAA,UACf,QAAQ,MAAM;AAAA,QAAA;AAGf,eAAOE,IAAE,EAAAG,uBAAA,uBAAuB,SAA8B,GAAG,CAAC;AAAA,MAAA,CAClE;AAAA,IAAA,CACD;AAED,WAAO,MAAK;AACX,UAAI,MAAM,SAAS;AACZ,cAAA,SAASA,uBAAAA,uBAAuB,MAAM,OAAO;AAE/C,YAAA,OAAO,WAAW,UAAU;AAC/B,iBAAOH,IAAE,EAAA,QAAQ,MAAM,eAAe,KAAK;AAAA,QAAA,OACrC;AACC,iBAAAA,IAAA,EAAE,QAAQ,MAAM,EAAE,SAAS,MAAM,eAAe,OAAO;AAAA,QAC9D;AAAA,MAAA,OACK;AACN,eAAO,eAAe;AAAA,MACtB;AAAA,IAAA;AAAA,EAEH;AACA,CAAA;AAUM,MAAM,YAAY;;;;;;"}
+{"version":3,"file":"SliceZone.cjs","sources":["../../../src/components/SliceZone.ts"],"sourcesContent":["import { Slice } from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tConcreteComponent,\n\tDefineComponent,\n\tFunctionalComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tmarkRaw,\n\twatchEffect,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * Returns the type of a `SliceLike` type.\n *\n * @typeParam TSlice - The Slice from which the type will be extracted.\n */\ntype ExtractSliceType<TSlice extends SliceLike> = TSlice extends SliceLikeRestV2\n\t? TSlice[\"slice_type\"]\n\t: TSlice extends SliceLikeGraphQL\n\t? TSlice[\"type\"]\n\t: never;\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * Rest API V2 for the `<SliceZone>` component.\n *\n * If using Prismic's Rest API V2, use the `Slice` export from\n * `@prismicio/client` for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeRestV2<TSliceType extends string = string> = {\n\tslice_type: Slice<TSliceType>[\"slice_type\"];\n\tid?: string;\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * GraphQL API for the `<SliceZone>` component.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeGraphQL<TSliceType extends string = string> = {\n\ttype: Slice<TSliceType>[\"slice_type\"];\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice for the\n * `<SliceZone />` component.\n *\n * If using Prismic's REST API, use the `Slice` export from `@prismicio/client`\n * for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice\n */\nexport type SliceLike<TSliceType extends string = string> =\n\t| SliceLikeRestV2<TSliceType>\n\t| SliceLikeGraphQL<TSliceType>;\n\n/**\n * A looser version of the `SliceZone` type from `@prismicio/client` using\n * `SliceLike`.\n *\n * If using Prismic's REST API, use the `SliceZone` export from\n * `@prismicio/client` for the full type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n */\nexport type SliceZoneLike<TSlice extends SliceLike = SliceLike> =\n\treadonly TSlice[];\n\n/**\n * Vue props for a component rendering content from a Prismic Slice using the\n * `<SliceZone />` component.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type SliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\t/**\n\t * Slice data for this component.\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\tindex: number;\n\n\t/**\n\t * All Slices from the Slice Zone to which the Slice belongs.\n\t */\n\t// TODO: We have to keep this list of Slices general due to circular\n\t// reference limtiations. If we had another generic to determine the full\n\t// union of Slice types, it would include TSlice. This causes TypeScript to\n\t// throw a compilation error.\n\tslices: SliceZoneLike<SliceLike>;\n\n\t/**\n\t * Arbitrary data passed to `<SliceZone />` and made available to all Slice\n\t * components.\n\t */\n\tcontext: TContext;\n};\n\n/**\n * Native Vue props for a component rendering content from a Prismic Slice using\n * the `<SliceZone />` component.\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type DefineComponentSliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\tslice: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>;\n\t\trequired: true;\n\t};\n\tindex: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>;\n\t\trequired: true;\n\t};\n\tslices: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>;\n\t\trequired: true;\n\t};\n\tcontext: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"context\"]>;\n\t\trequired: true;\n\t};\n};\n\n/**\n * Gets native Vue props for a component rendering content from a Prismic Slice\n * using the `<SliceZone />` component.\n *\n * Props are: `[\"slice\", \"index\", \"slices\", \"context\"]`\n *\n * @example\n *\n * ```javascript\n * // Defining a new slice component\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps(),\n * };\n * ```\n *\n * @example\n *\n * ```javascript\n * // Defining a new slice component with visual hint\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps([\"slice\", \"index\", \"slices\", \"context\"]),\n * };\n * ```\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n * @param propsHint - An optional array of prop names used for the sole purpose\n *   of having a visual hint of which props are made available to the slice,\n *   this parameters doesn't have any effect\n *\n * @returns Props object to use with {@link defineComponent}\n */\nexport const getSliceComponentProps = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\tpropsHint?: [\"slice\", \"index\", \"slices\", \"context\"],\n): DefineComponentSliceComponentProps<TSlice, TContext> => ({\n\tslice: {\n\t\ttype: Object as PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>,\n\t\trequired: true,\n\t},\n\tindex: {\n\t\ttype: Number as PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>,\n\t\trequired: true,\n\t},\n\tslices: {\n\t\ttype: Array as PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>,\n\t\trequired: true,\n\t},\n\tcontext: {\n\t\ttype: null as unknown as PropType<\n\t\t\tSliceComponentProps<TSlice, TContext>[\"context\"]\n\t\t>,\n\t\trequired: true,\n\t},\n});\n\n/**\n * A Vue component to be rendered for each instance of its Slice.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceComponentType<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> =\n\t// For reference within TypeScript files when `*.vue` type cannot be inferred\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types\n\t| DefineComponent<{}, {}, any>\n\t| DefineComponent<SliceComponentProps<TSlice, TContext>>\n\t| FunctionalComponent<SliceComponentProps<TSlice, TContext>>;\n\n/**\n * This Slice component can be used as a reminder to provide a proper\n * implementation.\n *\n * This is also the default Vue component rendered when a component mapping\n * cannot be found in `<SliceZone />`.\n */\nexport const TODOSliceComponent = __PRODUCTION__\n\t? ((() => null) as FunctionalComponent<SliceComponentProps>)\n\t: /*#__PURE__*/ (defineComponent({\n\t\t\tname: \"TODOSliceComponent\",\n\t\t\tprops: getSliceComponentProps(),\n\t\t\tsetup(props) {\n\t\t\t\tconst type = computed(() =>\n\t\t\t\t\t\"slice_type\" in props.slice\n\t\t\t\t\t\t? props.slice.slice_type\n\t\t\t\t\t\t: props.slice.type,\n\t\t\t\t);\n\n\t\t\t\twatchEffect(() => {\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`[SliceZone] Could not find a component for Slice type \"${type.value}\"`,\n\t\t\t\t\t\tprops.slice,\n\t\t\t\t\t);\n\t\t\t\t});\n\n\t\t\t\treturn () => {\n\t\t\t\t\treturn h(\n\t\t\t\t\t\t\"section\",\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"data-slice-zone-todo-component\": \"\",\n\t\t\t\t\t\t\t\"data-slice-type\": type.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t[`Could not find a component for Slice type \"${type.value}\"`],\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t  }) as SliceComponentType);\n\n/**\n * A record of Slice types mapped to Vue components. Each components will be\n * rendered for each instance of their Slice type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneComponents<\n\tTSlice extends SliceLike = SliceLike,\n\tTContext = unknown,\n> =\n\t// This is purposely not wrapped in Partial to ensure a component is provided\n\t// for all Slice types. <SliceZone /> will render a default component if one is\n\t// not provided, but it *should* be a type error if an explicit component is\n\t// missing.\n\t//\n\t// If a developer purposely does not want to provide a component, they can\n\t// assign it to the TODOSliceComponent exported from this package. This\n\t// signals to future developers that it is a placeholder and should be\n\t// implemented.\n\t{\n\t\t[SliceType in ExtractSliceType<TSlice>]:\n\t\t\t| SliceComponentType<Extract<TSlice, SliceLike<SliceType>>, TContext>\n\t\t\t| string;\n\t};\n\n/**\n * Gets an optimized record of Slice types mapped to Vue components. Each\n * components will be rendered for each instance of their Slice type.\n *\n * @remarks\n * This is essentially an helper function to ensure {@link markRaw} is correctly\n * applied on each components, improving performances.\n * @example\n *\n * ```javascript\n * // Defining a slice components\n * import { defineSliceZoneComponents } from \"@prismicio/vue\";\n *\n * export default {\n *   data() {\n *     components: defineSliceZoneComponents({\n *       foo: Foo,\n *       bar: defineAsyncComponent(\n *         () => new Promise((res) => res(Bar)),\n *       ),\n *       baz: \"Baz\",\n *     }),\n *   }\n * };\n * ```\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n *\n * @param components - {@link SliceZoneComponents}\n *\n * @returns A new optimized record of {@link SliceZoneComponents}\n */\nexport const defineSliceZoneComponents = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\tcomponents: SliceZoneComponents<TSlice, TContext>,\n): SliceZoneComponents<TSlice, TContext> => {\n\tconst result = {} as SliceZoneComponents<TSlice, TContext>;\n\n\tlet type: keyof typeof components;\n\tfor (type in components) {\n\t\tconst component = components[type];\n\t\tresult[type] =\n\t\t\ttypeof component === \"string\"\n\t\t\t\t? component\n\t\t\t\t: markRaw(\n\t\t\t\t\t\tcomponent as SliceComponentType<\n\t\t\t\t\t\t\tExtract<TSlice, SliceLike<typeof type>>,\n\t\t\t\t\t\t\tTContext\n\t\t\t\t\t\t>,\n\t\t\t\t  );\n\t}\n\n\treturn result;\n};\n\n/**\n * Arguments for a `<SliceZone>` `resolver` function.\n */\nexport type SliceZoneResolverArgs<TSlice extends SliceLike = SliceLike> = {\n\t/**\n\t * The Slice to resolve to a Vue component..\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The name of the Slice.\n\t */\n\tsliceName: ExtractSliceType<TSlice>;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\ti: number;\n};\n\n/**\n * A function that determines the rendered Vue component for each Slice in the\n * Slice Zone. If a nullish value is returned, the component will fallback to\n * the `components` or `defaultComponent` props to determine the rendered\n * component.\n *\n * @deprecated Use the `components` prop instead.\n *\n * @param args - Arguments for the resolver function.\n *\n * @returns The Vue component to render for a Slice.\n */\nexport type SliceZoneResolver<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = (\n\targs: SliceZoneResolverArgs<TSlice>,\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n) => SliceComponentType<any, TContext> | string | undefined | null;\n\n/**\n * Props for `<SliceZone />`.\n *\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneProps<TContext = unknown> = {\n\t/**\n\t * List of Slice data from the Slice Zone.\n\t */\n\tslices: SliceZoneLike;\n\n\t/**\n\t * A record mapping Slice types to Vue components.\n\t */\n\tcomponents?: SliceZoneComponents;\n\n\t/**\n\t * A function that determines the rendered Vue component for each Slice in the\n\t * Slice Zone.\n\t *\n\t * @deprecated Use the `components` prop instead.\n\t *\n\t * @param args - Arguments for the resolver function.\n\t *\n\t * @returns The Vue component to render for a Slice.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tresolver?: SliceZoneResolver<any, TContext>;\n\n\t/**\n\t * Arbitrary data made available to all Slice components.\n\t */\n\tcontext?: TContext;\n\n\t/**\n\t * A component or a functional component rendered if a component mapping from\n\t * the `components` prop cannot be found.\n\t *\n\t * @remarks\n\t * Components will be rendered using the {@link SliceComponentProps} interface.\n\t *\n\t * @defaultValue The Slice Zone default component provided to `@prismicio/vue` plugin if configured, otherwise `null` when `process.env.NODE_ENV === \"production\"` else {@link TODOSliceComponent}.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tdefaultComponent?: SliceComponentType<any, TContext>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to wrap the\n\t * output. The Slice Zone is not wrapped by default.\n\t */\n\twrapper?: string | ConcreteComponent | Raw<DefineComponent>;\n};\n\n/**\n * `<SliceZone />` implementation.\n *\n * @internal\n */\nexport const SliceZoneImpl = /*#__PURE__*/ defineComponent({\n\tname: \"SliceZone\",\n\tprops: {\n\t\tslices: {\n\t\t\ttype: Array as PropType<SliceZoneLike>,\n\t\t\trequired: true,\n\t\t},\n\t\tcomponents: {\n\t\t\ttype: Object as PropType<SliceZoneComponents>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tresolver: {\n\t\t\ttype: Function as PropType<SliceZoneResolver>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tcontext: {\n\t\t\ttype: null,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tdefaultComponent: {\n\t\t\ttype: Object as PropType<SliceComponentType>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twrapper: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.slices) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst renderedSlices = computed(() => {\n\t\t\treturn props.slices.map((slice, index) => {\n\t\t\t\tconst type = \"slice_type\" in slice ? slice.slice_type : slice.type;\n\n\t\t\t\tlet component =\n\t\t\t\t\tprops.components && type in props.components\n\t\t\t\t\t\t? props.components[type]\n\t\t\t\t\t\t: props.defaultComponent ||\n\t\t\t\t\t\t  options.components?.sliceZoneDefaultComponent ||\n\t\t\t\t\t\t  TODOSliceComponent;\n\n\t\t\t\t// TODO: Remove `resolver` in v3 in favor of `components`.\n\t\t\t\tif (props.resolver) {\n\t\t\t\t\tconst resolvedComponent = props.resolver({\n\t\t\t\t\t\tslice,\n\t\t\t\t\t\tsliceName: type,\n\t\t\t\t\t\ti: index,\n\t\t\t\t\t});\n\n\t\t\t\t\tif (resolvedComponent) {\n\t\t\t\t\t\tcomponent = resolvedComponent;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst key =\n\t\t\t\t\t\"id\" in slice && slice.id\n\t\t\t\t\t\t? slice.id\n\t\t\t\t\t\t: `${index}-${JSON.stringify(slice)}`;\n\n\t\t\t\tconst p = {\n\t\t\t\t\tkey,\n\t\t\t\t\tslice,\n\t\t\t\t\tindex,\n\t\t\t\t\tcontext: props.context,\n\t\t\t\t\tslices: props.slices,\n\t\t\t\t};\n\n\t\t\t\treturn h(simplyResolveComponent(component as ConcreteComponent), p);\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (props.wrapper) {\n\t\t\t\tconst parent = simplyResolveComponent(props.wrapper);\n\n\t\t\t\tif (typeof parent === \"string\") {\n\t\t\t\t\treturn h(parent, null, renderedSlices.value);\n\t\t\t\t} else {\n\t\t\t\t\treturn h(parent, null, { default: () => renderedSlices.value });\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn renderedSlices.value;\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic Slice Zone.\n *\n * @see Component props {@link SliceZoneProps}\n * @see Templating Slice Zones {@link https://prismic.io/docs/technologies/vue-template-content#slices-and-groups}\n */\nexport const SliceZone = SliceZoneImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tSliceZoneProps;\n\t};\n};\n"],"names":["__PRODUCTION__","defineComponent","computed","watchEffect","h","markRaw","usePrismic","simplyResolveComponent"],"mappings":"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"}

package/dist/components/SliceZone.d.ts

@@ -107,9 +107,10 @@ export type DefineComponentSliceComponentProps<TSlice extends SliceLike = any, T
  *
  * Props are: `["slice", "index", "slices", "context"]`
  *
- * @example Defining a new slice component:
+ * @example
  *
  * ```javascript
+ * // Defining a new slice component
  * import { getSliceComponentProps } from "@prismicio/vue";
  *
  * export default {
@@ -117,9 +118,10 @@ export type DefineComponentSliceComponentProps<TSlice extends SliceLike = any, T
  * };
  * ```
  *
- * @example Defining a new slice component with visual hint:
+ * @example
  *
  * ```javascript
+ * // Defining a new slice component with visual hint
  * import { getSliceComponentProps } from "@prismicio/vue";
  *
  * export default {
@@ -169,9 +171,10 @@ export type SliceZoneComponents<TSlice extends SliceLike = SliceLike, TContext =
  * @remarks
  * This is essentially an helper function to ensure {@link markRaw} is correctly
  * applied on each components, improving performances.
- * @example Defining a slice components:
+ * @example
  *
  * ```javascript
+ * // Defining a slice components
  * import { defineSliceZoneComponents } from "@prismicio/vue";
  *
  * export default {

package/dist/components/SliceZone.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliceZone.js","sources":["../../../src/components/SliceZone.ts"],"sourcesContent":["import { Slice } from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tConcreteComponent,\n\tDefineComponent,\n\tFunctionalComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tmarkRaw,\n\twatchEffect,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * Returns the type of a `SliceLike` type.\n *\n * @typeParam TSlice - The Slice from which the type will be extracted.\n */\ntype ExtractSliceType<TSlice extends SliceLike> = TSlice extends SliceLikeRestV2\n\t? TSlice[\"slice_type\"]\n\t: TSlice extends SliceLikeGraphQL\n\t? TSlice[\"type\"]\n\t: never;\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * Rest API V2 for the `<SliceZone>` component.\n *\n * If using Prismic's Rest API V2, use the `Slice` export from\n * `@prismicio/client` for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeRestV2<TSliceType extends string = string> = {\n\tslice_type: Slice<TSliceType>[\"slice_type\"];\n\tid?: string;\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * GraphQL API for the `<SliceZone>` component.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeGraphQL<TSliceType extends string = string> = {\n\ttype: Slice<TSliceType>[\"slice_type\"];\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice for the\n * `<SliceZone />` component.\n *\n * If using Prismic's REST API, use the `Slice` export from `@prismicio/client`\n * for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice\n */\nexport type SliceLike<TSliceType extends string = string> =\n\t| SliceLikeRestV2<TSliceType>\n\t| SliceLikeGraphQL<TSliceType>;\n\n/**\n * A looser version of the `SliceZone` type from `@prismicio/client` using\n * `SliceLike`.\n *\n * If using Prismic's REST API, use the `SliceZone` export from\n * `@prismicio/client` for the full type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n */\nexport type SliceZoneLike<TSlice extends SliceLike = SliceLike> =\n\treadonly TSlice[];\n\n/**\n * Vue props for a component rendering content from a Prismic Slice using the\n * `<SliceZone />` component.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type SliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\t/**\n\t * Slice data for this component.\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\tindex: number;\n\n\t/**\n\t * All Slices from the Slice Zone to which the Slice belongs.\n\t */\n\t// TODO: We have to keep this list of Slices general due to circular\n\t// reference limtiations. If we had another generic to determine the full\n\t// union of Slice types, it would include TSlice. This causes TypeScript to\n\t// throw a compilation error.\n\tslices: SliceZoneLike<SliceLike>;\n\n\t/**\n\t * Arbitrary data passed to `<SliceZone />` and made available to all Slice\n\t * components.\n\t */\n\tcontext: TContext;\n};\n\n/**\n * Native Vue props for a component rendering content from a Prismic Slice using\n * the `<SliceZone />` component.\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type DefineComponentSliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\tslice: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>;\n\t\trequired: true;\n\t};\n\tindex: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>;\n\t\trequired: true;\n\t};\n\tslices: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>;\n\t\trequired: true;\n\t};\n\tcontext: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"context\"]>;\n\t\trequired: true;\n\t};\n};\n\n/**\n * Gets native Vue props for a component rendering content from a Prismic Slice\n * using the `<SliceZone />` component.\n *\n * Props are: `[\"slice\", \"index\", \"slices\", \"context\"]`\n *\n * @example Defining a new slice component:\n *\n * ```javascript\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps(),\n * };\n * ```\n *\n * @example Defining a new slice component with visual hint:\n *\n * ```javascript\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps([\"slice\", \"index\", \"slices\", \"context\"]),\n * };\n * ```\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n * @param propsHint - An optional array of prop names used for the sole purpose\n *   of having a visual hint of which props are made available to the slice,\n *   this parameters doesn't have any effect\n *\n * @returns Props object to use with {@link defineComponent}\n */\nexport const getSliceComponentProps = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\tpropsHint?: [\"slice\", \"index\", \"slices\", \"context\"],\n): DefineComponentSliceComponentProps<TSlice, TContext> => ({\n\tslice: {\n\t\ttype: Object as PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>,\n\t\trequired: true,\n\t},\n\tindex: {\n\t\ttype: Number as PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>,\n\t\trequired: true,\n\t},\n\tslices: {\n\t\ttype: Array as PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>,\n\t\trequired: true,\n\t},\n\tcontext: {\n\t\ttype: null as unknown as PropType<\n\t\t\tSliceComponentProps<TSlice, TContext>[\"context\"]\n\t\t>,\n\t\trequired: true,\n\t},\n});\n\n/**\n * A Vue component to be rendered for each instance of its Slice.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceComponentType<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> =\n\t// For reference within TypeScript files when `*.vue` type cannot be inferred\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types\n\t| DefineComponent<{}, {}, any>\n\t| DefineComponent<SliceComponentProps<TSlice, TContext>>\n\t| FunctionalComponent<SliceComponentProps<TSlice, TContext>>;\n\n/**\n * This Slice component can be used as a reminder to provide a proper\n * implementation.\n *\n * This is also the default Vue component rendered when a component mapping\n * cannot be found in `<SliceZone />`.\n */\nexport const TODOSliceComponent = __PRODUCTION__\n\t? ((() => null) as FunctionalComponent<SliceComponentProps>)\n\t: /*#__PURE__*/ (defineComponent({\n\t\t\tname: \"TODOSliceComponent\",\n\t\t\tprops: getSliceComponentProps(),\n\t\t\tsetup(props) {\n\t\t\t\tconst type = computed(() =>\n\t\t\t\t\t\"slice_type\" in props.slice\n\t\t\t\t\t\t? props.slice.slice_type\n\t\t\t\t\t\t: props.slice.type,\n\t\t\t\t);\n\n\t\t\t\twatchEffect(() => {\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`[SliceZone] Could not find a component for Slice type \"${type.value}\"`,\n\t\t\t\t\t\tprops.slice,\n\t\t\t\t\t);\n\t\t\t\t});\n\n\t\t\t\treturn () => {\n\t\t\t\t\treturn h(\n\t\t\t\t\t\t\"section\",\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"data-slice-zone-todo-component\": \"\",\n\t\t\t\t\t\t\t\"data-slice-type\": type.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t[`Could not find a component for Slice type \"${type.value}\"`],\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t  }) as SliceComponentType);\n\n/**\n * A record of Slice types mapped to Vue components. Each components will be\n * rendered for each instance of their Slice type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneComponents<\n\tTSlice extends SliceLike = SliceLike,\n\tTContext = unknown,\n> =\n\t// This is purposely not wrapped in Partial to ensure a component is provided\n\t// for all Slice types. <SliceZone /> will render a default component if one is\n\t// not provided, but it *should* be a type error if an explicit component is\n\t// missing.\n\t//\n\t// If a developer purposely does not want to provide a component, they can\n\t// assign it to the TODOSliceComponent exported from this package. This\n\t// signals to future developers that it is a placeholder and should be\n\t// implemented.\n\t{\n\t\t[SliceType in ExtractSliceType<TSlice>]:\n\t\t\t| SliceComponentType<Extract<TSlice, SliceLike<SliceType>>, TContext>\n\t\t\t| string;\n\t};\n\n/**\n * Gets an optimized record of Slice types mapped to Vue components. Each\n * components will be rendered for each instance of their Slice type.\n *\n * @remarks\n * This is essentially an helper function to ensure {@link markRaw} is correctly\n * applied on each components, improving performances.\n * @example Defining a slice components:\n *\n * ```javascript\n * import { defineSliceZoneComponents } from \"@prismicio/vue\";\n *\n * export default {\n *   data() {\n *     components: defineSliceZoneComponents({\n *       foo: Foo,\n *       bar: defineAsyncComponent(\n *         () => new Promise((res) => res(Bar)),\n *       ),\n *       baz: \"Baz\",\n *     }),\n *   }\n * };\n * ```\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n *\n * @param components - {@link SliceZoneComponents}\n *\n * @returns A new optimized record of {@link SliceZoneComponents}\n */\nexport const defineSliceZoneComponents = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\tcomponents: SliceZoneComponents<TSlice, TContext>,\n): SliceZoneComponents<TSlice, TContext> => {\n\tconst result = {} as SliceZoneComponents<TSlice, TContext>;\n\n\tlet type: keyof typeof components;\n\tfor (type in components) {\n\t\tconst component = components[type];\n\t\tresult[type] =\n\t\t\ttypeof component === \"string\"\n\t\t\t\t? component\n\t\t\t\t: markRaw(\n\t\t\t\t\t\tcomponent as SliceComponentType<\n\t\t\t\t\t\t\tExtract<TSlice, SliceLike<typeof type>>,\n\t\t\t\t\t\t\tTContext\n\t\t\t\t\t\t>,\n\t\t\t\t  );\n\t}\n\n\treturn result;\n};\n\n/**\n * Arguments for a `<SliceZone>` `resolver` function.\n */\nexport type SliceZoneResolverArgs<TSlice extends SliceLike = SliceLike> = {\n\t/**\n\t * The Slice to resolve to a Vue component..\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The name of the Slice.\n\t */\n\tsliceName: ExtractSliceType<TSlice>;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\ti: number;\n};\n\n/**\n * A function that determines the rendered Vue component for each Slice in the\n * Slice Zone. If a nullish value is returned, the component will fallback to\n * the `components` or `defaultComponent` props to determine the rendered\n * component.\n *\n * @deprecated Use the `components` prop instead.\n *\n * @param args - Arguments for the resolver function.\n *\n * @returns The Vue component to render for a Slice.\n */\nexport type SliceZoneResolver<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = (\n\targs: SliceZoneResolverArgs<TSlice>,\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n) => SliceComponentType<any, TContext> | string | undefined | null;\n\n/**\n * Props for `<SliceZone />`.\n *\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneProps<TContext = unknown> = {\n\t/**\n\t * List of Slice data from the Slice Zone.\n\t */\n\tslices: SliceZoneLike;\n\n\t/**\n\t * A record mapping Slice types to Vue components.\n\t */\n\tcomponents?: SliceZoneComponents;\n\n\t/**\n\t * A function that determines the rendered Vue component for each Slice in the\n\t * Slice Zone.\n\t *\n\t * @deprecated Use the `components` prop instead.\n\t *\n\t * @param args - Arguments for the resolver function.\n\t *\n\t * @returns The Vue component to render for a Slice.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tresolver?: SliceZoneResolver<any, TContext>;\n\n\t/**\n\t * Arbitrary data made available to all Slice components.\n\t */\n\tcontext?: TContext;\n\n\t/**\n\t * A component or a functional component rendered if a component mapping from\n\t * the `components` prop cannot be found.\n\t *\n\t * @remarks\n\t * Components will be rendered using the {@link SliceComponentProps} interface.\n\t *\n\t * @defaultValue The Slice Zone default component provided to `@prismicio/vue` plugin if configured, otherwise `null` when `process.env.NODE_ENV === \"production\"` else {@link TODOSliceComponent}.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tdefaultComponent?: SliceComponentType<any, TContext>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to wrap the\n\t * output. The Slice Zone is not wrapped by default.\n\t */\n\twrapper?: string | ConcreteComponent | Raw<DefineComponent>;\n};\n\n/**\n * `<SliceZone />` implementation.\n *\n * @internal\n */\nexport const SliceZoneImpl = /*#__PURE__*/ defineComponent({\n\tname: \"SliceZone\",\n\tprops: {\n\t\tslices: {\n\t\t\ttype: Array as PropType<SliceZoneLike>,\n\t\t\trequired: true,\n\t\t},\n\t\tcomponents: {\n\t\t\ttype: Object as PropType<SliceZoneComponents>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tresolver: {\n\t\t\ttype: Function as PropType<SliceZoneResolver>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tcontext: {\n\t\t\ttype: null,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tdefaultComponent: {\n\t\t\ttype: Object as PropType<SliceComponentType>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twrapper: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.slices) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst renderedSlices = computed(() => {\n\t\t\treturn props.slices.map((slice, index) => {\n\t\t\t\tconst type = \"slice_type\" in slice ? slice.slice_type : slice.type;\n\n\t\t\t\tlet component =\n\t\t\t\t\tprops.components && type in props.components\n\t\t\t\t\t\t? props.components[type]\n\t\t\t\t\t\t: props.defaultComponent ||\n\t\t\t\t\t\t  options.components?.sliceZoneDefaultComponent ||\n\t\t\t\t\t\t  TODOSliceComponent;\n\n\t\t\t\t// TODO: Remove `resolver` in v3 in favor of `components`.\n\t\t\t\tif (props.resolver) {\n\t\t\t\t\tconst resolvedComponent = props.resolver({\n\t\t\t\t\t\tslice,\n\t\t\t\t\t\tsliceName: type,\n\t\t\t\t\t\ti: index,\n\t\t\t\t\t});\n\n\t\t\t\t\tif (resolvedComponent) {\n\t\t\t\t\t\tcomponent = resolvedComponent;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst key =\n\t\t\t\t\t\"id\" in slice && slice.id\n\t\t\t\t\t\t? slice.id\n\t\t\t\t\t\t: `${index}-${JSON.stringify(slice)}`;\n\n\t\t\t\tconst p = {\n\t\t\t\t\tkey,\n\t\t\t\t\tslice,\n\t\t\t\t\tindex,\n\t\t\t\t\tcontext: props.context,\n\t\t\t\t\tslices: props.slices,\n\t\t\t\t};\n\n\t\t\t\treturn h(simplyResolveComponent(component as ConcreteComponent), p);\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (props.wrapper) {\n\t\t\t\tconst parent = simplyResolveComponent(props.wrapper);\n\n\t\t\t\tif (typeof parent === \"string\") {\n\t\t\t\t\treturn h(parent, null, renderedSlices.value);\n\t\t\t\t} else {\n\t\t\t\t\treturn h(parent, null, { default: () => renderedSlices.value });\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn renderedSlices.value;\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic Slice Zone.\n *\n * @see Component props {@link SliceZoneProps}\n * @see Templating Slice Zones {@link https://prismic.io/docs/technologies/vue-template-content#slices-and-groups}\n */\nexport const SliceZone = SliceZoneImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tSliceZoneProps;\n\t};\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SliceZone.js","sources":["../../../src/components/SliceZone.ts"],"sourcesContent":["import { Slice } from \"@prismicio/client\";\nimport {\n\tAllowedComponentProps,\n\tComponentCustomProps,\n\tConcreteComponent,\n\tDefineComponent,\n\tFunctionalComponent,\n\tPropType,\n\tRaw,\n\tVNodeProps,\n\tcomputed,\n\tdefineComponent,\n\th,\n\tmarkRaw,\n\twatchEffect,\n} from \"vue\";\n\nimport { __PRODUCTION__ } from \"../lib/__PRODUCTION__\";\nimport { simplyResolveComponent } from \"../lib/simplyResolveComponent\";\n\nimport { usePrismic } from \"../usePrismic\";\n\n/**\n * Returns the type of a `SliceLike` type.\n *\n * @typeParam TSlice - The Slice from which the type will be extracted.\n */\ntype ExtractSliceType<TSlice extends SliceLike> = TSlice extends SliceLikeRestV2\n\t? TSlice[\"slice_type\"]\n\t: TSlice extends SliceLikeGraphQL\n\t? TSlice[\"type\"]\n\t: never;\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * Rest API V2 for the `<SliceZone>` component.\n *\n * If using Prismic's Rest API V2, use the `Slice` export from\n * `@prismicio/client` for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeRestV2<TSliceType extends string = string> = {\n\tslice_type: Slice<TSliceType>[\"slice_type\"];\n\tid?: string;\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice from the Prismic\n * GraphQL API for the `<SliceZone>` component.\n *\n * @typeParam TSliceType - Type name of the Slice.\n */\nexport type SliceLikeGraphQL<TSliceType extends string = string> = {\n\ttype: Slice<TSliceType>[\"slice_type\"];\n};\n\n/**\n * The minimum required properties to represent a Prismic Slice for the\n * `<SliceZone />` component.\n *\n * If using Prismic's REST API, use the `Slice` export from `@prismicio/client`\n * for a full interface.\n *\n * @typeParam TSliceType - Type name of the Slice\n */\nexport type SliceLike<TSliceType extends string = string> =\n\t| SliceLikeRestV2<TSliceType>\n\t| SliceLikeGraphQL<TSliceType>;\n\n/**\n * A looser version of the `SliceZone` type from `@prismicio/client` using\n * `SliceLike`.\n *\n * If using Prismic's REST API, use the `SliceZone` export from\n * `@prismicio/client` for the full type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n */\nexport type SliceZoneLike<TSlice extends SliceLike = SliceLike> =\n\treadonly TSlice[];\n\n/**\n * Vue props for a component rendering content from a Prismic Slice using the\n * `<SliceZone />` component.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type SliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\t/**\n\t * Slice data for this component.\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\tindex: number;\n\n\t/**\n\t * All Slices from the Slice Zone to which the Slice belongs.\n\t */\n\t// TODO: We have to keep this list of Slices general due to circular\n\t// reference limtiations. If we had another generic to determine the full\n\t// union of Slice types, it would include TSlice. This causes TypeScript to\n\t// throw a compilation error.\n\tslices: SliceZoneLike<SliceLike>;\n\n\t/**\n\t * Arbitrary data passed to `<SliceZone />` and made available to all Slice\n\t * components.\n\t */\n\tcontext: TContext;\n};\n\n/**\n * Native Vue props for a component rendering content from a Prismic Slice using\n * the `<SliceZone />` component.\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n */\nexport type DefineComponentSliceComponentProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = {\n\tslice: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>;\n\t\trequired: true;\n\t};\n\tindex: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>;\n\t\trequired: true;\n\t};\n\tslices: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>;\n\t\trequired: true;\n\t};\n\tcontext: {\n\t\ttype: PropType<SliceComponentProps<TSlice, TContext>[\"context\"]>;\n\t\trequired: true;\n\t};\n};\n\n/**\n * Gets native Vue props for a component rendering content from a Prismic Slice\n * using the `<SliceZone />` component.\n *\n * Props are: `[\"slice\", \"index\", \"slices\", \"context\"]`\n *\n * @example\n *\n * ```javascript\n * // Defining a new slice component\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps(),\n * };\n * ```\n *\n * @example\n *\n * ```javascript\n * // Defining a new slice component with visual hint\n * import { getSliceComponentProps } from \"@prismicio/vue\";\n *\n * export default {\n * \tprops: getSliceComponentProps([\"slice\", \"index\", \"slices\", \"context\"]),\n * };\n * ```\n *\n * @typeParam TSlice - The Slice type\n * @typeParam TContext - Arbitrary data passed to `<SliceZone />` and made\n *   available to all Slice components\n * @param propsHint - An optional array of prop names used for the sole purpose\n *   of having a visual hint of which props are made available to the slice,\n *   this parameters doesn't have any effect\n *\n * @returns Props object to use with {@link defineComponent}\n */\nexport const getSliceComponentProps = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\tpropsHint?: [\"slice\", \"index\", \"slices\", \"context\"],\n): DefineComponentSliceComponentProps<TSlice, TContext> => ({\n\tslice: {\n\t\ttype: Object as PropType<SliceComponentProps<TSlice, TContext>[\"slice\"]>,\n\t\trequired: true,\n\t},\n\tindex: {\n\t\ttype: Number as PropType<SliceComponentProps<TSlice, TContext>[\"index\"]>,\n\t\trequired: true,\n\t},\n\tslices: {\n\t\ttype: Array as PropType<SliceComponentProps<TSlice, TContext>[\"slices\"]>,\n\t\trequired: true,\n\t},\n\tcontext: {\n\t\ttype: null as unknown as PropType<\n\t\t\tSliceComponentProps<TSlice, TContext>[\"context\"]\n\t\t>,\n\t\trequired: true,\n\t},\n});\n\n/**\n * A Vue component to be rendered for each instance of its Slice.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceComponentType<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> =\n\t// For reference within TypeScript files when `*.vue` type cannot be inferred\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types\n\t| DefineComponent<{}, {}, any>\n\t| DefineComponent<SliceComponentProps<TSlice, TContext>>\n\t| FunctionalComponent<SliceComponentProps<TSlice, TContext>>;\n\n/**\n * This Slice component can be used as a reminder to provide a proper\n * implementation.\n *\n * This is also the default Vue component rendered when a component mapping\n * cannot be found in `<SliceZone />`.\n */\nexport const TODOSliceComponent = __PRODUCTION__\n\t? ((() => null) as FunctionalComponent<SliceComponentProps>)\n\t: /*#__PURE__*/ (defineComponent({\n\t\t\tname: \"TODOSliceComponent\",\n\t\t\tprops: getSliceComponentProps(),\n\t\t\tsetup(props) {\n\t\t\t\tconst type = computed(() =>\n\t\t\t\t\t\"slice_type\" in props.slice\n\t\t\t\t\t\t? props.slice.slice_type\n\t\t\t\t\t\t: props.slice.type,\n\t\t\t\t);\n\n\t\t\t\twatchEffect(() => {\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`[SliceZone] Could not find a component for Slice type \"${type.value}\"`,\n\t\t\t\t\t\tprops.slice,\n\t\t\t\t\t);\n\t\t\t\t});\n\n\t\t\t\treturn () => {\n\t\t\t\t\treturn h(\n\t\t\t\t\t\t\"section\",\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"data-slice-zone-todo-component\": \"\",\n\t\t\t\t\t\t\t\"data-slice-type\": type.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t[`Could not find a component for Slice type \"${type.value}\"`],\n\t\t\t\t\t);\n\t\t\t\t};\n\t\t\t},\n\t  }) as SliceComponentType);\n\n/**\n * A record of Slice types mapped to Vue components. Each components will be\n * rendered for each instance of their Slice type.\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneComponents<\n\tTSlice extends SliceLike = SliceLike,\n\tTContext = unknown,\n> =\n\t// This is purposely not wrapped in Partial to ensure a component is provided\n\t// for all Slice types. <SliceZone /> will render a default component if one is\n\t// not provided, but it *should* be a type error if an explicit component is\n\t// missing.\n\t//\n\t// If a developer purposely does not want to provide a component, they can\n\t// assign it to the TODOSliceComponent exported from this package. This\n\t// signals to future developers that it is a placeholder and should be\n\t// implemented.\n\t{\n\t\t[SliceType in ExtractSliceType<TSlice>]:\n\t\t\t| SliceComponentType<Extract<TSlice, SliceLike<SliceType>>, TContext>\n\t\t\t| string;\n\t};\n\n/**\n * Gets an optimized record of Slice types mapped to Vue components. Each\n * components will be rendered for each instance of their Slice type.\n *\n * @remarks\n * This is essentially an helper function to ensure {@link markRaw} is correctly\n * applied on each components, improving performances.\n * @example\n *\n * ```javascript\n * // Defining a slice components\n * import { defineSliceZoneComponents } from \"@prismicio/vue\";\n *\n * export default {\n *   data() {\n *     components: defineSliceZoneComponents({\n *       foo: Foo,\n *       bar: defineAsyncComponent(\n *         () => new Promise((res) => res(Bar)),\n *       ),\n *       baz: \"Baz\",\n *     }),\n *   }\n * };\n * ```\n *\n * @typeParam TSlice - The type(s) of slices in the Slice Zone\n * @typeParam TContext - Arbitrary data made available to all Slice components\n *\n * @param components - {@link SliceZoneComponents}\n *\n * @returns A new optimized record of {@link SliceZoneComponents}\n */\nexport const defineSliceZoneComponents = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n>(\n\tcomponents: SliceZoneComponents<TSlice, TContext>,\n): SliceZoneComponents<TSlice, TContext> => {\n\tconst result = {} as SliceZoneComponents<TSlice, TContext>;\n\n\tlet type: keyof typeof components;\n\tfor (type in components) {\n\t\tconst component = components[type];\n\t\tresult[type] =\n\t\t\ttypeof component === \"string\"\n\t\t\t\t? component\n\t\t\t\t: markRaw(\n\t\t\t\t\t\tcomponent as SliceComponentType<\n\t\t\t\t\t\t\tExtract<TSlice, SliceLike<typeof type>>,\n\t\t\t\t\t\t\tTContext\n\t\t\t\t\t\t>,\n\t\t\t\t  );\n\t}\n\n\treturn result;\n};\n\n/**\n * Arguments for a `<SliceZone>` `resolver` function.\n */\nexport type SliceZoneResolverArgs<TSlice extends SliceLike = SliceLike> = {\n\t/**\n\t * The Slice to resolve to a Vue component..\n\t */\n\tslice: TSlice;\n\n\t/**\n\t * The name of the Slice.\n\t */\n\tsliceName: ExtractSliceType<TSlice>;\n\n\t/**\n\t * The index of the Slice in the Slice Zone.\n\t */\n\ti: number;\n};\n\n/**\n * A function that determines the rendered Vue component for each Slice in the\n * Slice Zone. If a nullish value is returned, the component will fallback to\n * the `components` or `defaultComponent` props to determine the rendered\n * component.\n *\n * @deprecated Use the `components` prop instead.\n *\n * @param args - Arguments for the resolver function.\n *\n * @returns The Vue component to render for a Slice.\n */\nexport type SliceZoneResolver<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tTSlice extends SliceLike = any,\n\tTContext = unknown,\n> = (\n\targs: SliceZoneResolverArgs<TSlice>,\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n) => SliceComponentType<any, TContext> | string | undefined | null;\n\n/**\n * Props for `<SliceZone />`.\n *\n * @typeParam TContext - Arbitrary data made available to all Slice components\n */\nexport type SliceZoneProps<TContext = unknown> = {\n\t/**\n\t * List of Slice data from the Slice Zone.\n\t */\n\tslices: SliceZoneLike;\n\n\t/**\n\t * A record mapping Slice types to Vue components.\n\t */\n\tcomponents?: SliceZoneComponents;\n\n\t/**\n\t * A function that determines the rendered Vue component for each Slice in the\n\t * Slice Zone.\n\t *\n\t * @deprecated Use the `components` prop instead.\n\t *\n\t * @param args - Arguments for the resolver function.\n\t *\n\t * @returns The Vue component to render for a Slice.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tresolver?: SliceZoneResolver<any, TContext>;\n\n\t/**\n\t * Arbitrary data made available to all Slice components.\n\t */\n\tcontext?: TContext;\n\n\t/**\n\t * A component or a functional component rendered if a component mapping from\n\t * the `components` prop cannot be found.\n\t *\n\t * @remarks\n\t * Components will be rendered using the {@link SliceComponentProps} interface.\n\t *\n\t * @defaultValue The Slice Zone default component provided to `@prismicio/vue` plugin if configured, otherwise `null` when `process.env.NODE_ENV === \"production\"` else {@link TODOSliceComponent}.\n\t */\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tdefaultComponent?: SliceComponentType<any, TContext>;\n\n\t/**\n\t * An HTML tag name, a component, or a functional component used to wrap the\n\t * output. The Slice Zone is not wrapped by default.\n\t */\n\twrapper?: string | ConcreteComponent | Raw<DefineComponent>;\n};\n\n/**\n * `<SliceZone />` implementation.\n *\n * @internal\n */\nexport const SliceZoneImpl = /*#__PURE__*/ defineComponent({\n\tname: \"SliceZone\",\n\tprops: {\n\t\tslices: {\n\t\t\ttype: Array as PropType<SliceZoneLike>,\n\t\t\trequired: true,\n\t\t},\n\t\tcomponents: {\n\t\t\ttype: Object as PropType<SliceZoneComponents>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tresolver: {\n\t\t\ttype: Function as PropType<SliceZoneResolver>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tcontext: {\n\t\t\ttype: null,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\tdefaultComponent: {\n\t\t\ttype: Object as PropType<SliceComponentType>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t\twrapper: {\n\t\t\ttype: [String, Object, Function] as PropType<\n\t\t\t\tstring | ConcreteComponent | Raw<DefineComponent>\n\t\t\t>,\n\t\t\tdefault: undefined,\n\t\t\trequired: false,\n\t\t},\n\t},\n\tsetup(props) {\n\t\t// Prevent fatal if user didn't check for field, throws `Invalid prop` warn\n\t\tif (!props.slices) {\n\t\t\treturn () => null;\n\t\t}\n\n\t\tconst { options } = usePrismic();\n\n\t\tconst renderedSlices = computed(() => {\n\t\t\treturn props.slices.map((slice, index) => {\n\t\t\t\tconst type = \"slice_type\" in slice ? slice.slice_type : slice.type;\n\n\t\t\t\tlet component =\n\t\t\t\t\tprops.components && type in props.components\n\t\t\t\t\t\t? props.components[type]\n\t\t\t\t\t\t: props.defaultComponent ||\n\t\t\t\t\t\t  options.components?.sliceZoneDefaultComponent ||\n\t\t\t\t\t\t  TODOSliceComponent;\n\n\t\t\t\t// TODO: Remove `resolver` in v3 in favor of `components`.\n\t\t\t\tif (props.resolver) {\n\t\t\t\t\tconst resolvedComponent = props.resolver({\n\t\t\t\t\t\tslice,\n\t\t\t\t\t\tsliceName: type,\n\t\t\t\t\t\ti: index,\n\t\t\t\t\t});\n\n\t\t\t\t\tif (resolvedComponent) {\n\t\t\t\t\t\tcomponent = resolvedComponent;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst key =\n\t\t\t\t\t\"id\" in slice && slice.id\n\t\t\t\t\t\t? slice.id\n\t\t\t\t\t\t: `${index}-${JSON.stringify(slice)}`;\n\n\t\t\t\tconst p = {\n\t\t\t\t\tkey,\n\t\t\t\t\tslice,\n\t\t\t\t\tindex,\n\t\t\t\t\tcontext: props.context,\n\t\t\t\t\tslices: props.slices,\n\t\t\t\t};\n\n\t\t\t\treturn h(simplyResolveComponent(component as ConcreteComponent), p);\n\t\t\t});\n\t\t});\n\n\t\treturn () => {\n\t\t\tif (props.wrapper) {\n\t\t\t\tconst parent = simplyResolveComponent(props.wrapper);\n\n\t\t\t\tif (typeof parent === \"string\") {\n\t\t\t\t\treturn h(parent, null, renderedSlices.value);\n\t\t\t\t} else {\n\t\t\t\t\treturn h(parent, null, { default: () => renderedSlices.value });\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\treturn renderedSlices.value;\n\t\t\t}\n\t\t};\n\t},\n});\n\n// export the public type for h/tsx inference\n// also to avoid inline import() in generated d.ts files\n/**\n * Component to render a Prismic Slice Zone.\n *\n * @see Component props {@link SliceZoneProps}\n * @see Templating Slice Zones {@link https://prismic.io/docs/technologies/vue-template-content#slices-and-groups}\n */\nexport const SliceZone = SliceZoneImpl as unknown as {\n\tnew (): {\n\t\t$props: AllowedComponentProps &\n\t\t\tComponentCustomProps &\n\t\t\tVNodeProps &\n\t\t\tSliceZoneProps;\n\t};\n};\n"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -162,13 +162,15 @@ type PrismicPluginOptionsWithEndpoint = PrismicPluginOptionsBase & {
      * Said client will be used by `@prismicio/vue` composables, such as
      * {@link usePrismicDocuments} and exposed through `this.$prismic.client` and
      * `usePrismic().client`.
-     * @example A repository ID:
+     * @example
      *
-     *     "my-repo";
-     *
-     * @example A full repository endpoint:
+     * ```javascript
+     * // A repository ID
+     * "my-repo";
      *
-     *     "https://my-repo.cdn.prismic.io/api/v2";
+     * //A full repository endpoint
+     * "https://my-repo.cdn.prismic.io/api/v2";
+     * ```
      *
      * @see Prismic client documentation {@link https://prismic.io/docs/technologies/javascript}
      */
@@ -176,17 +178,19 @@ type PrismicPluginOptionsWithEndpoint = PrismicPluginOptionsBase & {
     /**
      * An optional object to configure `@prismicio/client` instance further.
      *
-     * @example Accessing a private private repository:
+     * @example
      *
      * ```javascript
+     * // Accessing a private private repository
      * {
      * 	"accessToken": "abc"
      * }
      * ```
      *
-     * @example Using a route resolver:
+     * @example
      *
      * ```javascript
+     * // Using a route resolver
      * {
      * 	"defaultParams": {
      * 		"routes": [

package/dist/usePrismic.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"usePrismic.cjs","sources":["../../src/usePrismic.ts"],"sourcesContent":["import { inject } from \"vue\";\n\nimport { PrismicPlugin } from \"./types\";\n\nimport { prismicKey } from \"./injectionSymbols\";\n\n/**\n * Accesses `@prismicio/vue` plugin interface.\n *\n * @example With the composition API:\n *\n * ```javascript\n * import { usePrismic } from \"@prismicio/vue\";\n *\n * export default {\n * \tsetup() {\n * \t\tconst prismic = usePrismic();\n *\n * \t\treturn {};\n * \t},\n * };\n * ```\n *\n * @returns The interface {@link PrismicPlugin}\n */\nexport const usePrismic = (): PrismicPlugin => {\n\treturn inject(prismicKey, { options: { endpoint: \"\" } } as PrismicPlugin);\n};\n"],"names":["inject","prismicKey"],"mappings":";;;;AAyBO,MAAM,aAAa,MAAoB;AACtC,SAAAA,IAAAA,OAAOC,iBAAAA,YAAY,EAAE,SAAS,EAAE,UAAU,MAAuB;AACzE;;"}
+{"version":3,"file":"usePrismic.cjs","sources":["../../src/usePrismic.ts"],"sourcesContent":["import { inject } from \"vue\";\n\nimport { PrismicPlugin } from \"./types\";\n\nimport { prismicKey } from \"./injectionSymbols\";\n\n/**\n * Accesses `@prismicio/vue` plugin interface.\n *\n * @example\n *\n * ```javascript\n * // With the composition API\n * import { usePrismic } from \"@prismicio/vue\";\n *\n * export default {\n * \tsetup() {\n * \t\tconst prismic = usePrismic();\n *\n * \t\treturn {};\n * \t},\n * };\n * ```\n *\n * @returns The interface {@link PrismicPlugin}\n */\nexport const usePrismic = (): PrismicPlugin => {\n\treturn inject(prismicKey, { options: { endpoint: \"\" } } as PrismicPlugin);\n};\n"],"names":["inject","prismicKey"],"mappings":";;;;AA0BO,MAAM,aAAa,MAAoB;AACtC,SAAAA,IAAAA,OAAOC,iBAAAA,YAAY,EAAE,SAAS,EAAE,UAAU,MAAuB;AACzE;;"}

package/dist/usePrismic.d.ts

@@ -2,9 +2,10 @@ import { PrismicPlugin } from "./types";
 /**
  * Accesses `@prismicio/vue` plugin interface.
  *
- * @example With the composition API:
+ * @example
  *
  * ```javascript
+ * // With the composition API
  * import { usePrismic } from "@prismicio/vue";
  *
  * export default {

package/dist/usePrismic.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePrismic.js","sources":["../../src/usePrismic.ts"],"sourcesContent":["import { inject } from \"vue\";\n\nimport { PrismicPlugin } from \"./types\";\n\nimport { prismicKey } from \"./injectionSymbols\";\n\n/**\n * Accesses `@prismicio/vue` plugin interface.\n *\n * @example With the composition API:\n *\n * ```javascript\n * import { usePrismic } from \"@prismicio/vue\";\n *\n * export default {\n * \tsetup() {\n * \t\tconst prismic = usePrismic();\n *\n * \t\treturn {};\n * \t},\n * };\n * ```\n *\n * @returns The interface {@link PrismicPlugin}\n */\nexport const usePrismic = (): PrismicPlugin => {\n\treturn inject(prismicKey, { options: { endpoint: \"\" } } as PrismicPlugin);\n};\n"],"names":[],"mappings":";;AAyBO,MAAM,aAAa,MAAoB;AACtC,SAAA,OAAO,YAAY,EAAE,SAAS,EAAE,UAAU,MAAuB;AACzE;"}
+{"version":3,"file":"usePrismic.js","sources":["../../src/usePrismic.ts"],"sourcesContent":["import { inject } from \"vue\";\n\nimport { PrismicPlugin } from \"./types\";\n\nimport { prismicKey } from \"./injectionSymbols\";\n\n/**\n * Accesses `@prismicio/vue` plugin interface.\n *\n * @example\n *\n * ```javascript\n * // With the composition API\n * import { usePrismic } from \"@prismicio/vue\";\n *\n * export default {\n * \tsetup() {\n * \t\tconst prismic = usePrismic();\n *\n * \t\treturn {};\n * \t},\n * };\n * ```\n *\n * @returns The interface {@link PrismicPlugin}\n */\nexport const usePrismic = (): PrismicPlugin => {\n\treturn inject(prismicKey, { options: { endpoint: \"\" } } as PrismicPlugin);\n};\n"],"names":[],"mappings":";;AA0BO,MAAM,aAAa,MAAoB;AACtC,SAAA,OAAO,YAAY,EAAE,SAAS,EAAE,UAAU,MAAuB;AACzE;"}

package/dist/useStatefulPrismicClientMethod.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useStatefulPrismicClientMethod.cjs","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\";\nimport { Ref, isRef, ref, shallowRef, unref, watch } from \"vue\";\n\nimport { PrismicClientComposableState, VueUseParameters } from \"./types\";\n\nimport { usePrismic } from \"./usePrismic\";\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any;\ntype ClientMethods = typeof Client.prototype;\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError;\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client;\n};\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n *   object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>;\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>;\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>;\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>;\n};\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n *   otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value);\n};\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic();\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t);\n\tconst data = shallowRef<TClientMethodReturnType | null>(null);\n\tconst error = ref<ClientError | Error | null>(null);\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1]);\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters);\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;\n\n\t\tstate.value = PrismicClientComposableState.Pending;\n\t\tdata.value = null;\n\t\terror.value = null;\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t);\n\t\t\tstate.value = PrismicClientComposableState.Success;\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error;\n\t\t\terror.value = err as ClientError | Error;\n\t\t}\n\t};\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg));\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true });\n\t}\n\n\t// Fetch once\n\trefresh();\n\n\treturn { state, data, error, refresh };\n};\n"],"names":["usePrismic","ref","shallowRef","unref","isRef","watch"],"mappings":";;;;AAiFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,WAAWA,WAAAA;AAEnB,QAAM,QAAQC,IAAA;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAOC,eAA2C,IAAI;AACtD,QAAA,QAAQD,QAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAUE,IAAAA,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,OAAA,IAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACXA,IAAAA,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgCA,IAAAA,MAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH;AACR,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IACd;AAAA,EAAA;AAIF,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQC,IAAA,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnBC,QAAA,MAAM,SAAS,SAAS,EAAE,MAAM,KAAM,CAAA;AAAA,EACtC;;AAKD,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;;"}
+{"version":3,"file":"useStatefulPrismicClientMethod.cjs","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\";\nimport { Ref, isRef, ref, shallowRef, unref, watch } from \"vue\";\n\nimport { PrismicClientComposableState, VueUseParameters } from \"./types\";\n\nimport { usePrismic } from \"./usePrismic\";\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any;\ntype ClientMethods = typeof Client.prototype;\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError;\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client;\n};\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n *   object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>;\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>;\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>;\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>;\n};\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n *   otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value);\n};\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic();\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t);\n\tconst data = shallowRef<TClientMethodReturnType | null>(null);\n\tconst error = ref<ClientError | Error | null>(null);\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1]);\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters);\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;\n\n\t\tstate.value = PrismicClientComposableState.Pending;\n\t\tdata.value = null;\n\t\terror.value = null;\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t);\n\t\t\tstate.value = PrismicClientComposableState.Success;\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error;\n\t\t\terror.value = err as ClientError | Error;\n\t\t}\n\t};\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg));\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true });\n\t}\n\n\t// Fetch once\n\trefresh();\n\n\treturn { state, data, error, refresh };\n};\n"],"names":["usePrismic","ref","shallowRef","unref","isRef","watch"],"mappings":";;;;AAiFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,WAAWA,WAAAA;AAEnB,QAAM,QAAQC,IAAA;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAOC,eAA2C,IAAI;AACtD,QAAA,QAAQD,QAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAUE,IAAAA,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,OAAA,IAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACXA,IAAAA,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgCA,IAAAA,MAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH,KAAK;AACb,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IACd;AAAA,EAAA;AAIF,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQC,IAAA,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnBC,QAAA,MAAM,SAAS,SAAS,EAAE,MAAM,KAAM,CAAA;AAAA,EACtC;;AAKD,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;;"}

package/dist/useStatefulPrismicClientMethod.js.map

@@ -1 +1 @@
-{"version":3,"file":"useStatefulPrismicClientMethod.js","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\";\nimport { Ref, isRef, ref, shallowRef, unref, watch } from \"vue\";\n\nimport { PrismicClientComposableState, VueUseParameters } from \"./types\";\n\nimport { usePrismic } from \"./usePrismic\";\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any;\ntype ClientMethods = typeof Client.prototype;\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError;\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client;\n};\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n *   object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>;\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>;\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>;\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>;\n};\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n *   otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value);\n};\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic();\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t);\n\tconst data = shallowRef<TClientMethodReturnType | null>(null);\n\tconst error = ref<ClientError | Error | null>(null);\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1]);\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters);\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;\n\n\t\tstate.value = PrismicClientComposableState.Pending;\n\t\tdata.value = null;\n\t\terror.value = null;\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t);\n\t\t\tstate.value = PrismicClientComposableState.Success;\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error;\n\t\t\terror.value = err as ClientError | Error;\n\t\t}\n\t};\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg));\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true });\n\t}\n\n\t// Fetch once\n\trefresh();\n\n\treturn { state, data, error, refresh };\n};\n"],"names":[],"mappings":";;AAiFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,WAAW;AAEnB,QAAM,QAAQ;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAO,WAA2C,IAAI;AACtD,QAAA,QAAQ,IAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAU,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,OAAA,IAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACX,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgC,MAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH;AACR,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IACd;AAAA,EAAA;AAIF,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQ,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnB,UAAM,SAAS,SAAS,EAAE,MAAM,KAAM,CAAA;AAAA,EACtC;;AAKD,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;"}
+{"version":3,"file":"useStatefulPrismicClientMethod.js","sources":["../../src/useStatefulPrismicClientMethod.ts"],"sourcesContent":["import {\n\tClient,\n\tForbiddenError,\n\tParsingError,\n\tPrismicError,\n} from \"@prismicio/client\";\nimport { Ref, isRef, ref, shallowRef, unref, watch } from \"vue\";\n\nimport { PrismicClientComposableState, VueUseParameters } from \"./types\";\n\nimport { usePrismic } from \"./usePrismic\";\n\n// Helpers\ntype UnwrapPromise<T> = T extends Promise<infer U> ? U : T;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype ClientMethodLike = (...args: any[]) => Promise<any> | any;\ntype ClientMethods = typeof Client.prototype;\ntype ClientError = PrismicError<unknown> | ParsingError | ForbiddenError;\n\n// Interfaces\n\n/**\n * @internal\n */\nexport type ClientMethodParameters<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? VueUseParameters<Parameters<ClientMethods[TMethodName]>>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ClientMethodReturnType<TMethodName extends keyof ClientMethods> =\n\tClientMethods[TMethodName] extends ClientMethodLike\n\t\t? ReturnType<ClientMethods[TMethodName]>\n\t\t: never;\n\n/**\n * @internal\n */\nexport type ComposableOnlyParameters = {\n\tclient?: Ref<Client> | Client;\n};\n\n/**\n * The return type of a `@prismicio/client` Vue composable.\n *\n * @typeParam TData - The expected format of the `data` property of the returned\n *   object\n */\nexport type ClientComposableReturnType<TData = unknown> = {\n\t/**\n\t * The current state of the composable's client method call.\n\t */\n\tstate: Ref<PrismicClientComposableState>;\n\n\t/**\n\t * Data returned by the client.\n\t */\n\tdata: Ref<TData | null>;\n\n\t/**\n\t * Error returned by the composable's client method call if in an errror\n\t * state.\n\t */\n\terror: Ref<ClientError | Error | null>;\n\n\t/**\n\t * Perform the composable's client method call again.\n\t */\n\trefresh: () => Promise<void>;\n};\n\n/**\n * Determines if a value is a `@prismicio/client` params object.\n *\n * @param value - The value to check\n *\n * @returns `true` if `value` is a `@prismicio/client` params object, `false`\n *   otherwise\n */\nconst isParams = (\n\tvalue: unknown,\n): value is ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters => {\n\t// This is a *very* naive check.\n\treturn typeof value === \"object\" && value !== null && !Array.isArray(value);\n};\n\n/**\n * A low level Vue composable that uses provided method name on plugin or\n * provided client with given arguments. The composable has its own internal\n * state manager to report async status, such as pending or error statuses.\n *\n * @typeParam TClientMethodName - A method name from `@prismicio/client`\n * @typeParam TClientMethodArguments - The method expected arguments\n * @typeParam TClientMethodReturnType - The method expected return type\n *\n * @param method - The `@prismicio/client` method name to use\n * @param args - The arguments to use with requested method\n *\n * @returns The composable payload {@link ClientComposableReturnType}\n *\n * @internal\n */\nexport const useStatefulPrismicClientMethod = <\n\tTClientMethodName extends keyof ClientMethods,\n\tTClientMethodArguments extends ClientMethodParameters<TClientMethodName>,\n\tTClientMethodReturnType extends UnwrapPromise<\n\t\tClientMethodReturnType<TClientMethodName>\n\t>,\n>(\n\tmethodName: TClientMethodName,\n\targs: TClientMethodArguments,\n): ClientComposableReturnType<TClientMethodReturnType> => {\n\tconst { client } = usePrismic();\n\n\tconst state = ref<PrismicClientComposableState>(\n\t\tPrismicClientComposableState.Idle,\n\t);\n\tconst data = shallowRef<TClientMethodReturnType | null>(null);\n\tconst error = ref<ClientError | Error | null>(null);\n\tconst refresh = async (): Promise<void> => {\n\t\tconst lastArg = unref(args[args.length - 1]);\n\t\tconst { client: explicitClient, ...params } = isParams(lastArg)\n\t\t\t? (lastArg as ClientMethodParameters<\"get\">[0] & ComposableOnlyParameters)\n\t\t\t: ({} as ComposableOnlyParameters);\n\t\tconst argsWithoutParams = isParams(lastArg) ? args.slice(0, -1) : args;\n\n\t\tstate.value = PrismicClientComposableState.Pending;\n\t\tdata.value = null;\n\t\terror.value = null;\n\t\ttry {\n\t\t\tdata.value = await (\n\t\t\t\t(unref(explicitClient) || client)[methodName] as ClientMethodLike\n\t\t\t)(\n\t\t\t\t...argsWithoutParams.map((arg: Ref<unknown> | unknown) => unref(arg)),\n\t\t\t\tparams,\n\t\t\t);\n\t\t\tstate.value = PrismicClientComposableState.Success;\n\t\t} catch (err) {\n\t\t\tstate.value = PrismicClientComposableState.Error;\n\t\t\terror.value = err as ClientError | Error;\n\t\t}\n\t};\n\n\t// Watch reactive args\n\tconst refArgs = args.filter((arg) => isRef(arg));\n\tif (refArgs.length) {\n\t\twatch(refArgs, refresh, { deep: true });\n\t}\n\n\t// Fetch once\n\trefresh();\n\n\treturn { state, data, error, refresh };\n};\n"],"names":[],"mappings":";;AAiFA,MAAM,WAAW,CAChB,UACyE;AAElE,SAAA,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;AAC3E;AAkBa,MAAA,iCAAiC,CAO7C,YACA,SACwD;AAClD,QAAA,EAAE,WAAW;AAEnB,QAAM,QAAQ;AAAA,IAAG;AAAA;AAAA,EAAA;AAGX,QAAA,OAAO,WAA2C,IAAI;AACtD,QAAA,QAAQ,IAAgC,IAAI;AAClD,QAAM,UAAU,YAA0B;AACzC,UAAM,UAAU,MAAM,KAAK,KAAK,SAAS,CAAC,CAAC;AACrC,UAAA,EAAE,QAAQ,gBAAgB,GAAG,OAAA,IAAW,SAAS,OAAO,IAC1D,UACA;AACE,UAAA,oBAAoB,SAAS,OAAO,IAAI,KAAK,MAAM,GAAG,EAAE,IAAI;AAElE,UAAM,QAAK;AACX,SAAK,QAAQ;AACb,UAAM,QAAQ;AACV,QAAA;AACH,WAAK,QAAQ,OACX,MAAM,cAAc,KAAK,QAAQ,UAAU,EAE5C,GAAG,kBAAkB,IAAI,CAAC,QAAgC,MAAM,GAAG,CAAC,GACpE,MAAM;AAEP,YAAM,QAAK;AAAA,aACH,KAAK;AACb,YAAM,QAAK;AACX,YAAM,QAAQ;AAAA,IACd;AAAA,EAAA;AAIF,QAAM,UAAU,KAAK,OAAO,CAAC,QAAQ,MAAM,GAAG,CAAC;AAC/C,MAAI,QAAQ,QAAQ;AACnB,UAAM,SAAS,SAAS,EAAE,MAAM,KAAM,CAAA;AAAA,EACtC;;AAKD,SAAO,EAAE,OAAO,MAAM,OAAO,QAAO;AACrC;"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@prismicio/vue",
-	"version": "4.0.1",
+	"version": "4.0.2",
 	"description": "Vue plugin, components, and composables to fetch and present Prismic content",
 	"keywords": [
 		"typescript",
@@ -57,37 +57,37 @@
 		"test": "npm run lint && npm run types && npm run unit && npm run build && npm run size"
 	},
 	"dependencies": {
-		"@prismicio/client": "^7.0.1",
+		"@prismicio/client": "^7.1.0",
 		"isomorphic-unfetch": "^3.1.0",
-		"vue-router": "^4.2.1"
+		"vue-router": "^4.2.3"
 	},
 	"devDependencies": {
-		"@prismicio/mock": "^0.2.0",
-		"@size-limit/preset-small-lib": "^8.2.4",
+		"@prismicio/mock": "^0.3.1",
+		"@size-limit/preset-small-lib": "^8.2.6",
 		"@trivago/prettier-plugin-sort-imports": "^4.1.1",
 		"@types/jsdom-global": "^3.0.4",
-		"@typescript-eslint/eslint-plugin": "^5.59.7",
-		"@typescript-eslint/parser": "^5.59.7",
+		"@typescript-eslint/eslint-plugin": "^5.61.0",
+		"@typescript-eslint/parser": "^5.61.0",
 		"@vitejs/plugin-vue": "^4.2.3",
-		"@vitest/coverage-c8": "^0.31.1",
+		"@vitest/coverage-v8": "^0.32.4",
 		"@vue/compiler-sfc": "^3.3.4",
 		"@vue/eslint-config-typescript": "^11.0.3",
-		"@vue/test-utils": "^2.3.2",
-		"eslint": "^8.41.0",
+		"@vue/test-utils": "^2.4.0",
+		"eslint": "^8.44.0",
 		"eslint-config-prettier": "^8.8.0",
 		"eslint-plugin-prettier": "^4.2.1",
 		"eslint-plugin-tsdoc": "^0.2.17",
-		"eslint-plugin-vue": "^9.14.0",
-		"jsdom": "^22.0.0",
+		"eslint-plugin-vue": "^9.15.1",
+		"jsdom": "^22.1.0",
 		"jsdom-global": "^3.0.2",
 		"prettier": "^2.8.8",
 		"prettier-plugin-jsdoc": "^0.4.2",
-		"size-limit": "^8.2.4",
+		"size-limit": "^8.2.6",
 		"standard-version": "^9.5.0",
-		"typescript": "^5.0.4",
-		"vite": "^4.3.8",
+		"typescript": "^5.1.6",
+		"vite": "^4.4.0",
 		"vite-plugin-sdk": "^0.1.1",
-		"vitest": "^0.31.1",
+		"vitest": "^0.32.4",
 		"vue": "^3.3.4"
 	},
 	"peerDependencies": {

package/src/components/SliceZone.ts

@@ -156,9 +156,10 @@ export type DefineComponentSliceComponentProps<
  *
  * Props are: `["slice", "index", "slices", "context"]`
  *
- * @example Defining a new slice component:
+ * @example
  *
  * ```javascript
+ * // Defining a new slice component
  * import { getSliceComponentProps } from "@prismicio/vue";
  *
  * export default {
@@ -166,9 +167,10 @@ export type DefineComponentSliceComponentProps<
  * };
  * ```
  *
- * @example Defining a new slice component with visual hint:
+ * @example
  *
  * ```javascript
+ * // Defining a new slice component with visual hint
  * import { getSliceComponentProps } from "@prismicio/vue";
  *
  * export default {
@@ -302,9 +304,10 @@ export type SliceZoneComponents<
  * @remarks
  * This is essentially an helper function to ensure {@link markRaw} is correctly
  * applied on each components, improving performances.
- * @example Defining a slice components:
+ * @example
  *
  * ```javascript
+ * // Defining a slice components
  * import { defineSliceZoneComponents } from "@prismicio/vue";
  *
  * export default {

package/src/types.ts

@@ -211,13 +211,15 @@ type PrismicPluginOptionsWithEndpoint = PrismicPluginOptionsBase & {
 	 * Said client will be used by `@prismicio/vue` composables, such as
 	 * {@link usePrismicDocuments} and exposed through `this.$prismic.client` and
 	 * `usePrismic().client`.
-	 * @example A repository ID:
+	 * @example
 	 *
-	 *     "my-repo";
-	 *
-	 * @example A full repository endpoint:
+	 * ```javascript
+	 * // A repository ID
+	 * "my-repo";
 	 *
-	 *     "https://my-repo.cdn.prismic.io/api/v2";
+	 * //A full repository endpoint
+	 * "https://my-repo.cdn.prismic.io/api/v2";
+	 * ```
 	 *
 	 * @see Prismic client documentation {@link https://prismic.io/docs/technologies/javascript}
 	 */
@@ -226,17 +228,19 @@ type PrismicPluginOptionsWithEndpoint = PrismicPluginOptionsBase & {
 	/**
 	 * An optional object to configure `@prismicio/client` instance further.
 	 *
-	 * @example Accessing a private private repository:
+	 * @example
 	 *
 	 * ```javascript
+	 * // Accessing a private private repository
 	 * {
 	 * 	"accessToken": "abc"
 	 * }
 	 * ```
 	 *
-	 * @example Using a route resolver:
+	 * @example
 	 *
 	 * ```javascript
+	 * // Using a route resolver
 	 * {
 	 * 	"defaultParams": {
 	 * 		"routes": [

package/src/usePrismic.ts

@@ -7,9 +7,10 @@ import { prismicKey } from "./injectionSymbols";
 /**
  * Accesses `@prismicio/vue` plugin interface.
  *
- * @example With the composition API:
+ * @example
  *
  * ```javascript
+ * // With the composition API
  * import { usePrismic } from "@prismicio/vue";
  *
  * export default {