@prismicio/vue 4.1.0 → 4.2.0

package/dist/components/PrismicRichText.d.ts

@@ -1,159 +1,159 @@
-import { HTMLFunctionSerializer, HTMLMapSerializer, LinkResolverFunction, RichTextField } from "@prismicio/client";
-import { AllowedComponentProps, ComponentCustomProps, ComputedRef, ConcreteComponent, DefineComponent, PropType, Raw, VNodeProps } from "vue";
-import { VueUseOptions } from "../types";
-/**
- * Props for `<PrismicRichText />`.
- */
-export type PrismicRichTextProps = {
-    /**
-     * The Prismic rich text or title field to render.
-     */
-    field: RichTextField | null | undefined;
-    /**
-     * A link resolver function used to resolve link when not using the route
-     * resolver parameter with `@prismicio/client`.
-     *
-     * @defaultValue The link resolver provided to `@prismicio/vue` plugin if configured.
-     *
-     * @see Link resolver documentation {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver#link-resolver}
-     */
-    linkResolver?: LinkResolverFunction;
-    /**
-     * An HTML serializer to customize the way rich text fields are rendered.
-     *
-     * @defaultValue The HTML serializer provided to `@prismicio/vue` plugin if configured.
-     *
-     * @see HTML serializer documentation {@link https://prismic.io/docs/core-concepts/html-serializer}
-     */
-    serializer?: HTMLFunctionSerializer | HTMLMapSerializer;
-    /**
-     * An HTML serializer to customize the way rich text fields are rendered.
-     *
-     * @deprecated Use `serializer` instead.
-     *
-     * @defaultValue The HTML serializer provided to `@prismicio/vue` plugin if configured.
-     *
-     * @see HTML serializer documentation {@link https://prismic.io/docs/core-concepts/html-serializer}
-     */
-    htmlSerializer?: HTMLFunctionSerializer | HTMLMapSerializer;
-    /**
-     * An HTML tag name, a component, or a functional component used to wrap the
-     * output.
-     *
-     * @defaultValue `"div"`
-     */
-    wrapper?: string | ConcreteComponent | Raw<DefineComponent>;
-    /**
-     * The HTML value to be rendered when the field is empty. If a fallback is not
-     * given, `""` (nothing) will be rendered.
-     */
-    fallback?: string;
-};
-/**
- * Options for {@link usePrismicRichText}.
- */
-export type UsePrismicRichTextOptions = VueUseOptions<Omit<PrismicRichTextProps, "wrapper">>;
-/**
- * Return type of {@link usePrismicRichText}.
- */
-export type UsePrismicRichTextReturnType = {
-    /**
-     * Serialized rich text field as HTML.
-     */
-    html: ComputedRef<string>;
-};
-/**
- * A low level composable that returns a serialized rich text field as HTML.
- *
- * @param props - {@link UsePrismicRichTextOptions}
- *
- * @returns - Serialized rich text field as HTML
- *   {@link UsePrismicRichTextReturnType}
- */
-export declare const usePrismicRichText: (props: UsePrismicRichTextOptions) => UsePrismicRichTextReturnType;
-/**
- * `<PrismicRichText />` implementation.
- *
- * @internal
- */
-export declare const PrismicRichTextImpl: DefineComponent<{
-    field: {
-        type: PropType<RichTextField | null | undefined>;
-        default: undefined;
-        required: false;
-    };
-    linkResolver: {
-        type: PropType<LinkResolverFunction>;
-        default: undefined;
-        required: false;
-    };
-    serializer: {
-        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
-        default: undefined;
-        required: false;
-    };
-    htmlSerializer: {
-        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
-        default: undefined;
-        required: false;
-    };
-    wrapper: {
-        type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
-        default: undefined;
-        required: false;
-    };
-    fallback: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    field: {
-        type: PropType<RichTextField | null | undefined>;
-        default: undefined;
-        required: false;
-    };
-    linkResolver: {
-        type: PropType<LinkResolverFunction>;
-        default: undefined;
-        required: false;
-    };
-    serializer: {
-        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
-        default: undefined;
-        required: false;
-    };
-    htmlSerializer: {
-        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
-        default: undefined;
-        required: false;
-    };
-    wrapper: {
-        type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
-        default: undefined;
-        required: false;
-    };
-    fallback: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-}>>, {
-    wrapper: string | ConcreteComponent | Raw<DefineComponent>;
-    field: RichTextField | null | undefined;
-    linkResolver: LinkResolverFunction;
-    fallback: string;
-    serializer: import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer;
-    htmlSerializer: import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer;
-}, {}>;
-/**
- * Component to render a Prismic rich text field as HTML.
- *
- * @see Component props {@link PrismicRichTextProps}
- * @see Templating rich text and title fields {@link https://prismic.io/docs/technologies/vue-template-content#rich-text-and-titles}
- */
-export declare const PrismicRichText: new () => {
-    $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & PrismicRichTextProps;
-};
+import { HTMLFunctionSerializer, HTMLMapSerializer, LinkResolverFunction, RichTextField } from "@prismicio/client";
+import { AllowedComponentProps, ComponentCustomProps, ComputedRef, ConcreteComponent, DefineComponent, PropType, Raw, VNodeProps } from "vue";
+import { VueUseOptions } from "../types";
+/**
+ * Props for `<PrismicRichText />`.
+ */
+export declare type PrismicRichTextProps = {
+    /**
+     * The Prismic rich text or title field to render.
+     */
+    field: RichTextField | null | undefined;
+    /**
+     * A link resolver function used to resolve link when not using the route
+     * resolver parameter with `@prismicio/client`.
+     *
+     * @defaultValue The link resolver provided to `@prismicio/vue` plugin if configured.
+     *
+     * @see Link resolver documentation {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver#link-resolver}
+     */
+    linkResolver?: LinkResolverFunction;
+    /**
+     * An HTML serializer to customize the way rich text fields are rendered.
+     *
+     * @defaultValue The HTML serializer provided to `@prismicio/vue` plugin if configured.
+     *
+     * @see HTML serializer documentation {@link https://prismic.io/docs/core-concepts/html-serializer}
+     */
+    serializer?: HTMLFunctionSerializer | HTMLMapSerializer;
+    /**
+     * An HTML serializer to customize the way rich text fields are rendered.
+     *
+     * @deprecated Use `serializer` instead.
+     *
+     * @defaultValue The HTML serializer provided to `@prismicio/vue` plugin if configured.
+     *
+     * @see HTML serializer documentation {@link https://prismic.io/docs/core-concepts/html-serializer}
+     */
+    htmlSerializer?: HTMLFunctionSerializer | HTMLMapSerializer;
+    /**
+     * An HTML tag name, a component, or a functional component used to wrap the
+     * output.
+     *
+     * @defaultValue `"div"`
+     */
+    wrapper?: string | ConcreteComponent | Raw<DefineComponent>;
+    /**
+     * The HTML value to be rendered when the field is empty. If a fallback is not
+     * given, `""` (nothing) will be rendered.
+     */
+    fallback?: string;
+};
+/**
+ * Options for {@link usePrismicRichText}.
+ */
+export declare type UsePrismicRichTextOptions = VueUseOptions<Omit<PrismicRichTextProps, "wrapper">>;
+/**
+ * Return type of {@link usePrismicRichText}.
+ */
+export declare type UsePrismicRichTextReturnType = {
+    /**
+     * Serialized rich text field as HTML.
+     */
+    html: ComputedRef<string>;
+};
+/**
+ * A low level composable that returns a serialized rich text field as HTML.
+ *
+ * @param props - {@link UsePrismicRichTextOptions}
+ *
+ * @returns - Serialized rich text field as HTML
+ *   {@link UsePrismicRichTextReturnType}
+ */
+export declare const usePrismicRichText: (props: UsePrismicRichTextOptions) => UsePrismicRichTextReturnType;
+/**
+ * `<PrismicRichText />` implementation.
+ *
+ * @internal
+ */
+export declare const PrismicRichTextImpl: DefineComponent<{
+    field: {
+        type: PropType<[] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined>;
+        default: undefined;
+        required: false;
+    };
+    linkResolver: {
+        type: PropType<LinkResolverFunction<string | null | undefined>>;
+        default: undefined;
+        required: false;
+    };
+    serializer: {
+        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
+        default: undefined;
+        required: false;
+    };
+    htmlSerializer: {
+        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
+        default: undefined;
+        required: false;
+    };
+    wrapper: {
+        type: PropType<string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>>;
+        default: undefined;
+        required: false;
+    };
+    fallback: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    field: {
+        type: PropType<[] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined>;
+        default: undefined;
+        required: false;
+    };
+    linkResolver: {
+        type: PropType<LinkResolverFunction<string | null | undefined>>;
+        default: undefined;
+        required: false;
+    };
+    serializer: {
+        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
+        default: undefined;
+        required: false;
+    };
+    htmlSerializer: {
+        type: PropType<import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer>;
+        default: undefined;
+        required: false;
+    };
+    wrapper: {
+        type: PropType<string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>>;
+        default: undefined;
+        required: false;
+    };
+    fallback: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+}>>, {
+    wrapper: string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>;
+    field: [] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined;
+    linkResolver: LinkResolverFunction<string | null | undefined>;
+    fallback: string;
+    serializer: import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer;
+    htmlSerializer: import("@prismicio/client").HTMLRichTextFunctionSerializer | import("@prismicio/client").HTMLRichTextMapSerializer;
+}, {}>;
+/**
+ * Component to render a Prismic rich text field as HTML.
+ *
+ * @see Component props {@link PrismicRichTextProps}
+ * @see Templating rich text and title fields {@link https://prismic.io/docs/technologies/vue-template-content#rich-text-and-titles}
+ */
+export declare const PrismicRichText: new () => {
+    $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & PrismicRichTextProps;
+};

package/dist/components/PrismicText.d.ts

@@ -1,117 +1,117 @@
-import { RichTextField } from "@prismicio/client";
-import { AllowedComponentProps, ComponentCustomProps, ComputedRef, ConcreteComponent, DefineComponent, PropType, Raw, VNode, VNodeProps } from "vue";
-import { VueUseOptions } from "../types";
-/**
- * Props for `<PrismicText />`.
- */
-export type PrismicTextProps = {
-    /**
-     * The Prismic rich text or title field to render.
-     */
-    field: RichTextField | null | undefined;
-    /**
-     * Separator used to join each element.
-     *
-     * @defaultValue `" "` (a space)
-     */
-    separator?: string;
-    /**
-     * An HTML tag name, a component, or a functional component used to wrap the
-     * output.
-     *
-     * @defaultValue `"div"`
-     */
-    wrapper?: string | ConcreteComponent | Raw<DefineComponent>;
-    /**
-     * The string value to be rendered when the field is empty. If a fallback is
-     * not given, `""` (nothing) will be rendered.
-     */
-    fallback?: string;
-};
-/**
- * Options for {@link usePrismicText}.
- */
-export type UsePrismicTextOptions = VueUseOptions<Omit<PrismicTextProps, "wrapper">>;
-/**
- * Return type of {@link usePrismicText}.
- */
-export type UsePrismicTextReturnType = {
-    /**
-     * Serialized rich text field as plain text.
-     */
-    text: ComputedRef<string>;
-};
-/**
- * A low level composable that returns a serialized rich text field as plain
- * text.
- *
- * @param props - {@link UsePrismicTextOptions}
- *
- * @returns - Serialized rich text field as plain text
- *   {@link UsePrismicTextReturnType}
- */
-export declare const usePrismicText: (props: UsePrismicTextOptions) => UsePrismicTextReturnType;
-/**
- * `<PrismicText />` implementation.
- *
- * @internal
- */
-export declare const PrismicTextImpl: DefineComponent<{
-    field: {
-        type: PropType<RichTextField | null | undefined>;
-        default: undefined;
-        required: false;
-    };
-    separator: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-    wrapper: {
-        type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
-        default: undefined;
-        required: false;
-    };
-    fallback: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    field: {
-        type: PropType<RichTextField | null | undefined>;
-        default: undefined;
-        required: false;
-    };
-    separator: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-    wrapper: {
-        type: PropType<string | ConcreteComponent | Raw<DefineComponent>>;
-        default: undefined;
-        required: false;
-    };
-    fallback: {
-        type: PropType<string>;
-        default: undefined;
-        required: false;
-    };
-}>>, {
-    wrapper: string | ConcreteComponent | Raw<DefineComponent>;
-    field: RichTextField | null | undefined;
-    separator: string;
-    fallback: string;
-}, {}>;
-/**
- * Component to render a Prismic rich text field as plain text.
- *
- * @see Component props {@link PrismicTextProps}
- * @see Templating rich text and title fields {@link https://prismic.io/docs/technologies/vue-template-content#rich-text-and-titles}
- */
-export declare const PrismicText: new () => {
-    $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & PrismicTextProps;
-};
+import { RichTextField } from "@prismicio/client";
+import { AllowedComponentProps, ComponentCustomProps, ComputedRef, ConcreteComponent, DefineComponent, PropType, Raw, VNode, VNodeProps } from "vue";
+import { VueUseOptions } from "../types";
+/**
+ * Props for `<PrismicText />`.
+ */
+export declare type PrismicTextProps = {
+    /**
+     * The Prismic rich text or title field to render.
+     */
+    field: RichTextField | null | undefined;
+    /**
+     * Separator used to join each element.
+     *
+     * @defaultValue `" "` (a space)
+     */
+    separator?: string;
+    /**
+     * An HTML tag name, a component, or a functional component used to wrap the
+     * output.
+     *
+     * @defaultValue `"div"`
+     */
+    wrapper?: string | ConcreteComponent | Raw<DefineComponent>;
+    /**
+     * The string value to be rendered when the field is empty. If a fallback is
+     * not given, `""` (nothing) will be rendered.
+     */
+    fallback?: string;
+};
+/**
+ * Options for {@link usePrismicText}.
+ */
+export declare type UsePrismicTextOptions = VueUseOptions<Omit<PrismicTextProps, "wrapper">>;
+/**
+ * Return type of {@link usePrismicText}.
+ */
+export declare type UsePrismicTextReturnType = {
+    /**
+     * Serialized rich text field as plain text.
+     */
+    text: ComputedRef<string>;
+};
+/**
+ * A low level composable that returns a serialized rich text field as plain
+ * text.
+ *
+ * @param props - {@link UsePrismicTextOptions}
+ *
+ * @returns - Serialized rich text field as plain text
+ *   {@link UsePrismicTextReturnType}
+ */
+export declare const usePrismicText: (props: UsePrismicTextOptions) => UsePrismicTextReturnType;
+/**
+ * `<PrismicText />` implementation.
+ *
+ * @internal
+ */
+export declare const PrismicTextImpl: DefineComponent<{
+    field: {
+        type: PropType<[] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined>;
+        default: undefined;
+        required: false;
+    };
+    separator: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+    wrapper: {
+        type: PropType<string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>>;
+        default: undefined;
+        required: false;
+    };
+    fallback: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    field: {
+        type: PropType<[] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined>;
+        default: undefined;
+        required: false;
+    };
+    separator: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+    wrapper: {
+        type: PropType<string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>>;
+        default: undefined;
+        required: false;
+    };
+    fallback: {
+        type: PropType<string>;
+        default: undefined;
+        required: false;
+    };
+}>>, {
+    wrapper: string | ConcreteComponent<{}, any, any, import("vue").ComputedOptions, import("vue").MethodOptions, {}, any> | Raw<DefineComponent<{}, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>>;
+    field: [] | [import("@prismicio/client").RTNode, ...import("@prismicio/client").RTNode[]] | null | undefined;
+    separator: string;
+    fallback: string;
+}, {}>;
+/**
+ * Component to render a Prismic rich text field as plain text.
+ *
+ * @see Component props {@link PrismicTextProps}
+ * @see Templating rich text and title fields {@link https://prismic.io/docs/technologies/vue-template-content#rich-text-and-titles}
+ */
+export declare const PrismicText: new () => {
+    $props: AllowedComponentProps & ComponentCustomProps & VNodeProps & PrismicTextProps;
+};

package/dist/components/SliceZone.cjs

@@ -24,17 +24,20 @@ const getSliceComponentProps = (propsHint) => ({
 });
 const TODOSliceComponent = __PRODUCTION__.__PRODUCTION__ ? () => null : /* @__PURE__ */ vue.defineComponent({
   name: "TODOSliceComponent",
-  props: getSliceComponentProps(),
-  setup(props) {
-    const type = vue.computed(() => "slice_type" in props.slice ? props.slice.slice_type : props.slice.type);
+  props: [],
+  inheritAttrs: false,
+  setup(_props, { attrs }) {
+    const type = vue.computed(() => attrs.slice && typeof attrs.slice === "object" ? "slice_type" in attrs.slice ? attrs.slice.slice_type : "type" in attrs.slice ? attrs.slice.type : null : null);
     vue.watchEffect(() => {
-      console.warn(`[SliceZone] Could not find a component for Slice type "${type.value}"`, props.slice);
+      type.value ? console.warn(`[SliceZone] Could not find a component for Slice type "${type.value}"`, attrs.slice) : console.warn("[SliceZone] Could not find a component for mapped Slice", attrs);
     });
     return () => {
       return vue.h("section", {
         "data-slice-zone-todo-component": "",
-        "data-slice-type": type.value
-      }, [`Could not find a component for Slice type "${type.value}"`]);
+        "data-slice-type": type.value ? type.value : null
+      }, [
+        type.value ? `Could not find a component for Slice type "${type.value}"` : "Could not find a component for mapped Slice"
+      ]);
     };
   }
 });
@@ -84,6 +87,11 @@ const SliceZoneImpl = /* @__PURE__ */ vue.defineComponent({
     if (!props.slices) {
       return () => null;
     }
+    if (!__PRODUCTION__.__PRODUCTION__) {
+      if (props.resolver) {
+        console.warn("The `resolver` prop is deprecated. Please replace it with a components map using the `components` prop.");
+      }
+    }
     const { options } = usePrismic.usePrismic();
     const renderedSlices = vue.computed(() => {
       return props.slices.map((slice, index) => {
@@ -100,14 +108,20 @@ const SliceZoneImpl = /* @__PURE__ */ vue.defineComponent({
             component = resolvedComponent;
           }
         }
-        const key = "id" in slice && slice.id ? slice.id : `${index}-${JSON.stringify(slice)}`;
-        const p = {
-          key,
-          slice,
-          index,
-          context: props.context,
-          slices: props.slices
-        };
+        const key = "id" in slice && typeof slice.id === "string" ? slice.id : `${index}-${JSON.stringify(slice)}`;
+        let p;
+        if (slice.__mapped) {
+          const { __mapped, ...mappedProps } = slice;
+          p = { key, ...mappedProps };
+        } else {
+          p = {
+            key,
+            slice,
+            index,
+            context: props.context,
+            slices: props.slices
+          };
+        }
         return vue.h(simplyResolveComponent.simplyResolveComponent(component), p);
       });
     });