@slicemachine/adapter-next 0.3.14-dev-next-release.4 → 0.3.14-dev-slice-tenplate-feature-2.0

package/dist/sliceTemplates/CallToAction/index.js

@@ -0,0 +1,489 @@
+import { pascalCase } from "../../lib/pascalCase.js";
+import { stripIndent } from "common-tags";
+const mocks = [
+  {
+    __TYPE__: "SharedSliceContent",
+    variation: "default",
+    primary: {
+      title: {
+        __TYPE__: "StructuredTextContent",
+        value: [
+          {
+            type: "heading1",
+            content: {
+              text: "Collector Slices kit",
+              spans: []
+            },
+            direction: "ltr"
+          }
+        ]
+      },
+      paragraph: {
+        __TYPE__: "StructuredTextContent",
+        value: [
+          {
+            type: "paragraph",
+            content: {
+              text: "It’s very easy to create stylish and beautiful prototypes for your future projects, both graphical and dynamic.",
+              spans: []
+            },
+            direction: "ltr"
+          }
+        ]
+      },
+      buttonlink: {
+        __TYPE__: "LinkContent",
+        value: {
+          __TYPE__: "ExternalLink",
+          url: "https://twitter.com/prismicio"
+        }
+      },
+      buttonlabel: {
+        __TYPE__: "FieldContent",
+        type: "Text",
+        value: "Click here"
+      },
+      image: {
+        origin: {
+          id: "9aOswReDKPo",
+          url: "https://images.unsplash.com/photo-1523049673857-eb18f1d7b578?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwxOXx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85",
+          width: 8040,
+          height: 6024
+        },
+        url: "https://images.unsplash.com/photo-1523049673857-eb18f1d7b578?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwxOXx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85",
+        width: 8040,
+        height: 6024,
+        edit: {
+          background: "transparent",
+          zoom: 1,
+          crop: {
+            x: 0,
+            y: 0
+          }
+        },
+        credits: null,
+        alt: null,
+        __TYPE__: "ImageContent",
+        thumbnails: {}
+      },
+      buttonLabel: {
+        __TYPE__: "FieldContent",
+        type: "Text",
+        value: "Learn more"
+      }
+    },
+    items: []
+  },
+  {
+    __TYPE__: "SharedSliceContent",
+    variation: "alignLeft",
+    primary: {
+      image: {
+        origin: {
+          id: "euqiHwS38Rw",
+          url: "https://images.unsplash.com/photo-1595475207225-428b62bda831?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwyMHx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85",
+          width: 2500,
+          height: 2500
+        },
+        url: "https://images.unsplash.com/photo-1595475207225-428b62bda831?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwyMHx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85",
+        width: 2500,
+        height: 2500,
+        edit: {
+          background: "transparent",
+          zoom: 1,
+          crop: {
+            x: 0,
+            y: 0
+          }
+        },
+        credits: null,
+        alt: null,
+        __TYPE__: "ImageContent",
+        thumbnails: {}
+      },
+      title: {
+        __TYPE__: "StructuredTextContent",
+        value: [
+          {
+            type: "heading1",
+            content: {
+              text: "Collector Slices kit",
+              spans: []
+            },
+            direction: "ltr"
+          }
+        ]
+      },
+      paragraph: {
+        __TYPE__: "StructuredTextContent",
+        value: [
+          {
+            type: "paragraph",
+            content: {
+              text: "It’s very easy to create stylish and beautiful prototypes for your future projects, both graphical and dynamic.",
+              spans: []
+            },
+            direction: "ltr"
+          }
+        ]
+      },
+      buttonlink: {
+        __TYPE__: "LinkContent",
+        value: {
+          __TYPE__: "ExternalLink",
+          url: "https://prismic.io"
+        }
+      },
+      buttonLabel: {
+        __TYPE__: "FieldContent",
+        type: "Text",
+        value: "Learn more!"
+      }
+    },
+    items: [
+      {
+        __TYPE__: "GroupItemContent",
+        value: []
+      }
+    ]
+  }
+];
+const createComponentContents = (model2, isTypeScriptProject) => {
+  const pascalName = pascalCase(model2.name);
+  if (isTypeScriptProject) {
+    return stripIndent`
+			import { Content, isFilled, asText } from "@prismicio/client";
+			import { SliceComponentProps, PrismicRichText } from "@prismicio/react";
+			
+			/**
+			 * Props for \`${pascalName}\`.
+			 */
+			export type ${pascalName}Props = SliceComponentProps<Content.${pascalName}Slice>;
+			
+			/**
+			 * Component for "${model2.name}" Slices.
+			 */
+			const ${pascalName} = ({ slice }: ${pascalName}Props): JSX.Element => {
+				const alignment = slice.variation === "alignLeft" ? "left" : "center";
+			
+				return (
+					<section
+						data-slice-type={slice.slice_type}
+						data-slice-variation={slice.variation}
+						className="es-bounded es-call-to-action"
+					>
+						<div className="es-bounded__content es-call-to-action__content">
+							{slice.primary.image?.url && (
+								<img
+									height={600}
+									width={800}
+									src={slice.primary.image.url}
+									alt={slice.primary.image.alt ?? undefined}
+									className="es-call-to-action__image"
+								/>
+							)}
+							<div className="es-call-to-action__content">
+								{isFilled.richText(slice.primary.title) && (
+									<h2 className="es-call-to-action__content__heading">
+										{asText(slice.primary.title)}
+									</h2>
+								)}
+								{isFilled.richText(slice.primary.paragraph) && (
+									<div className="es-call-to-action__content__paragraph">
+										<PrismicRichText field={slice.primary.paragraph} />
+									</div>
+								)}
+							</div>
+							<button
+								field={slice.primary.buttonLink}
+								className="es-call-to-action__button"
+							>
+								{slice.primary.buttonLabel || "Learn more…"}
+							</button>
+						</div>
+						<style>
+							{\`
+						.es-call-to-action {
+							background-color: #fff;
+							color: #333;
+							padding: 8vw 2rem;
+						}
+						
+						.es-call-to-action__content {
+							display: grid;
+							gap: 2rem;
+						}
+					
+						.es-call-to-action__image {
+							max-width: 14rem;
+							justify-self: \${alignment};
+						}
+						
+						.es-call-to-action__content {
+							display: grid;
+							gap: 1rem;
+							justify-items: \${alignment};
+						}
+						
+						.es-call-to-action__content__heading {
+							font-size: 2rem;
+							font-weight: 700;
+							text-align: \${alignment};
+						}
+						
+						.es-call-to-action__content__paragraph {
+							font-size: 1.15rem;
+							max-width: 38rem;
+							text-align: \${alignment};
+						}
+						
+						.es-call-to-action__button {
+							justify-self: \${alignment};
+							border-radius: 0.25rem;
+							display: inline-block;
+							font-size: 0.875rem;
+							line-height: 1.3;
+							padding: 1rem 2.625rem;
+							text-align: \${alignment};
+							transition: background-color 100ms linear;
+							background-color: #16745f;
+							color: #fff;
+						}
+	
+						.es-call-to-action__button:hover {
+							background-color: #0d5e4c;
+						}
+					\`}
+						</style>
+					</section>
+				);
+			};
+			
+			export default ${pascalName};
+		`;
+  }
+  return stripIndent`
+			import { PrismicRichText } from "@prismicio/react";
+			import { isFilled, asText } from "@prismicio/client";
+			
+			/**
+			 * @typedef {import("@prismicio/client").Content.${pascalName}Slice} ${pascalName}Slice
+			 * @typedef {import("@prismicio/react").SliceComponentProps<${pascalName}Slice>} ${pascalName}Props
+			 * @param {${pascalName}Props}
+			 */
+			const ${pascalName} = ({ slice }) => {
+				const alignment = slice.variation === "alignLeft" ? "left" : "center";
+			
+				return (
+					<section
+						data-slice-type={slice.slice_type}
+						data-slice-variation={slice.variation}
+						className="es-bounded es-call-to-action"
+					>
+						<div className="es-bounded__content es-call-to-action__content">
+							{slice.primary.image?.url && (
+								<img
+									height={600}
+									width={800}
+									src={slice.primary.image.url}
+									alt={slice.primary.image.alt ?? undefined}
+									className="es-call-to-action__image"
+								/>
+							)}
+							<div className="es-call-to-action__content">
+								{isFilled.richText(slice.primary.title) && (
+									<h2 className="es-call-to-action__content__heading">
+										{asText(slice.primary.title)}
+									</h2>
+								)}
+								{isFilled.richText(slice.primary.paragraph) && (
+									<div className="es-call-to-action__content__paragraph">
+										<PrismicRichText field={slice.primary.paragraph} />
+									</div>
+								)}
+							</div>
+							<button
+								field={slice.primary.buttonLink}
+								className="es-call-to-action__button"
+							>
+								{slice.primary.buttonLabel || "Learn more…"}
+							</button>
+						</div>
+						<style>
+							{\`
+						.es-call-to-action {
+							background-color: #fff;
+							color: #333;
+							padding: 8vw 2rem;
+						}
+						
+						.es-call-to-action__content {
+							display: grid;
+							gap: 2rem;
+						}
+						
+						.es-call-to-action__image {
+							max-width: 14rem;
+							justify-self: \${alignment};
+						}
+						
+						.es-call-to-action__content {
+							display: grid;
+							gap: 1rem;
+							justify-items: \${alignment};
+						}
+						
+						.es-call-to-action__content__heading {
+							font-size: 2rem;
+							font-weight: 700;
+							text-align: \${alignment};
+						}
+						
+						.es-call-to-action__content__paragraph {
+							font-size: 1.15rem;
+							max-width: 38rem;
+							text-align: \${alignment};
+						}
+						
+						.es-call-to-action__button {
+							justify-self: \${alignment};
+							border-radius: 0.25rem;
+							display: inline-block;
+							font-size: 0.875rem;
+							line-height: 1.3;
+							padding: 1rem 2.625rem;
+							text-align: \${alignment};
+							transition: background-color 100ms linear;
+							background-color: #16745f;
+							color: #fff;
+						}
+			
+						.es-call-to-action__button:hover {
+							background-color: #0d5e4c;
+						}
+					\`}
+						</style>
+					</section>
+				);
+			};
+			
+			export default ${pascalName};
+		`;
+};
+const model = {
+  id: "call_to_action",
+  type: "SharedSlice",
+  name: "CallToAction",
+  description: "CallToAction",
+  variations: [
+    {
+      id: "default",
+      name: "Default",
+      docURL: "...",
+      version: "initial",
+      description: "Default",
+      imageUrl: "",
+      primary: {
+        image: {
+          type: "Image",
+          config: { label: "Image", constraint: {}, thumbnails: [] }
+        },
+        title: {
+          type: "StructuredText",
+          config: {
+            label: "title",
+            placeholder: "",
+            allowTargetBlank: true,
+            single: "heading1,heading2,heading3,heading4,heading5,heading6"
+          }
+        },
+        paragraph: {
+          type: "StructuredText",
+          config: {
+            label: "paragraph",
+            placeholder: "",
+            allowTargetBlank: true,
+            single: "paragraph,preformatted,strong,em,hyperlink,image,embed,list-item,o-list-item,rtl"
+          }
+        },
+        buttonlink: {
+          type: "Link",
+          config: {
+            label: "buttonLink",
+            placeholder: "Redirect URL for CTA button",
+            allowTargetBlank: true,
+            select: null
+          }
+        },
+        buttonLabel: {
+          type: "Text",
+          config: {
+            label: "buttonLabel",
+            placeholder: "Label for CTA button"
+          }
+        }
+      },
+      items: {}
+    },
+    {
+      id: "alignLeft",
+      name: "AlignLeft",
+      docURL: "...",
+      version: "initial",
+      description: "Default",
+      imageUrl: "",
+      primary: {
+        image: {
+          type: "Image",
+          config: { label: "Image", constraint: {}, thumbnails: [] }
+        },
+        title: {
+          type: "StructuredText",
+          config: {
+            label: "title",
+            placeholder: "",
+            allowTargetBlank: true,
+            single: "heading1,heading2,heading3,heading4,heading5,heading6"
+          }
+        },
+        paragraph: {
+          type: "StructuredText",
+          config: {
+            label: "paragraph",
+            placeholder: "",
+            allowTargetBlank: true,
+            single: "paragraph,preformatted,strong,em,hyperlink,image,embed,list-item,o-list-item,rtl"
+          }
+        },
+        buttonlink: {
+          type: "Link",
+          config: {
+            label: "buttonLink",
+            placeholder: "Redirect URL for CTA button",
+            allowTargetBlank: true,
+            select: null
+          }
+        },
+        buttonLabel: {
+          type: "Text",
+          config: {
+            label: "buttonLabel",
+            placeholder: "Label for CTA button"
+          }
+        }
+      },
+      items: {}
+    }
+  ]
+};
+const screenshotPaths = {
+  default: "CallToAction/screenshot-default.png",
+  alignLeft: "CallToAction/screenshot-alignLeft.png"
+};
+export {
+  createComponentContents,
+  mocks,
+  model,
+  screenshotPaths
+};
+//# sourceMappingURL=index.js.map

package/dist/sliceTemplates/CallToAction/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/sliceTemplates/CallToAction/index.ts"],"sourcesContent":["import type { SharedSlice } from \"@prismicio/types-internal/lib/customtypes\";\nimport { SharedSliceContent } from \"@prismicio/types-internal/lib/content\";\n\nimport { pascalCase } from \"../../lib/pascalCase\";\n\nimport { stripIndent } from \"common-tags\";\n\nexport const mocks: SharedSliceContent[] = [\n\t{\n\t\t__TYPE__: \"SharedSliceContent\",\n\t\tvariation: \"default\",\n\t\tprimary: {\n\t\t\ttitle: {\n\t\t\t\t__TYPE__: \"StructuredTextContent\",\n\t\t\t\tvalue: [\n\t\t\t\t\t{\n\t\t\t\t\t\ttype: \"heading1\",\n\t\t\t\t\t\tcontent: {\n\t\t\t\t\t\t\ttext: \"Collector Slices kit\",\n\t\t\t\t\t\t\tspans: [],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdirection: \"ltr\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\tparagraph: {\n\t\t\t\t__TYPE__: \"StructuredTextContent\",\n\t\t\t\tvalue: [\n\t\t\t\t\t{\n\t\t\t\t\t\ttype: \"paragraph\",\n\t\t\t\t\t\tcontent: {\n\t\t\t\t\t\t\ttext: \"It’s very easy to create stylish and beautiful prototypes for your future projects, both graphical and dynamic.\",\n\t\t\t\t\t\t\tspans: [],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdirection: \"ltr\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\tbuttonlink: {\n\t\t\t\t__TYPE__: \"LinkContent\",\n\t\t\t\tvalue: {\n\t\t\t\t\t__TYPE__: \"ExternalLink\",\n\t\t\t\t\turl: \"https://twitter.com/prismicio\",\n\t\t\t\t},\n\t\t\t},\n\t\t\tbuttonlabel: {\n\t\t\t\t__TYPE__: \"FieldContent\",\n\t\t\t\ttype: \"Text\",\n\t\t\t\tvalue: \"Click here\",\n\t\t\t},\n\t\t\timage: {\n\t\t\t\torigin: {\n\t\t\t\t\tid: \"9aOswReDKPo\",\n\t\t\t\t\turl: \"https://images.unsplash.com/photo-1523049673857-eb18f1d7b578?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwxOXx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85\",\n\t\t\t\t\twidth: 8040,\n\t\t\t\t\theight: 6024,\n\t\t\t\t},\n\t\t\t\turl: \"https://images.unsplash.com/photo-1523049673857-eb18f1d7b578?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwxOXx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85\",\n\t\t\t\twidth: 8040,\n\t\t\t\theight: 6024,\n\t\t\t\tedit: {\n\t\t\t\t\tbackground: \"transparent\",\n\t\t\t\t\tzoom: 1,\n\t\t\t\t\tcrop: {\n\t\t\t\t\t\tx: 0,\n\t\t\t\t\t\ty: 0,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tcredits: null,\n\t\t\t\talt: null,\n\t\t\t\t__TYPE__: \"ImageContent\",\n\t\t\t\tthumbnails: {},\n\t\t\t},\n\t\t\tbuttonLabel: {\n\t\t\t\t__TYPE__: \"FieldContent\",\n\t\t\t\ttype: \"Text\",\n\t\t\t\tvalue: \"Learn more\",\n\t\t\t},\n\t\t},\n\t\titems: [],\n\t},\n\t{\n\t\t__TYPE__: \"SharedSliceContent\",\n\t\tvariation: \"alignLeft\",\n\t\tprimary: {\n\t\t\timage: {\n\t\t\t\torigin: {\n\t\t\t\t\tid: \"euqiHwS38Rw\",\n\t\t\t\t\turl: \"https://images.unsplash.com/photo-1595475207225-428b62bda831?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwyMHx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85\",\n\t\t\t\t\twidth: 2500,\n\t\t\t\t\theight: 2500,\n\t\t\t\t},\n\t\t\t\turl: \"https://images.unsplash.com/photo-1595475207225-428b62bda831?crop=entropy&cs=srgb&fm=jpg&ixid=M3wzMzc0NjN8MHwxfHNlYXJjaHwyMHx8ZnJ1aXR8ZW58MHx8fHwxNjkzMjUxNTMxfDA&ixlib=rb-4.0.3&q=85\",\n\t\t\t\twidth: 2500,\n\t\t\t\theight: 2500,\n\t\t\t\tedit: {\n\t\t\t\t\tbackground: \"transparent\",\n\t\t\t\t\tzoom: 1,\n\t\t\t\t\tcrop: {\n\t\t\t\t\t\tx: 0,\n\t\t\t\t\t\ty: 0,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tcredits: null,\n\t\t\t\talt: null,\n\t\t\t\t__TYPE__: \"ImageContent\",\n\t\t\t\tthumbnails: {},\n\t\t\t},\n\t\t\ttitle: {\n\t\t\t\t__TYPE__: \"StructuredTextContent\",\n\t\t\t\tvalue: [\n\t\t\t\t\t{\n\t\t\t\t\t\ttype: \"heading1\",\n\t\t\t\t\t\tcontent: {\n\t\t\t\t\t\t\ttext: \"Collector Slices kit\",\n\t\t\t\t\t\t\tspans: [],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdirection: \"ltr\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\tparagraph: {\n\t\t\t\t__TYPE__: \"StructuredTextContent\",\n\t\t\t\tvalue: [\n\t\t\t\t\t{\n\t\t\t\t\t\ttype: \"paragraph\",\n\t\t\t\t\t\tcontent: {\n\t\t\t\t\t\t\ttext: \"It’s very easy to create stylish and beautiful prototypes for your future projects, both graphical and dynamic.\",\n\t\t\t\t\t\t\tspans: [],\n\t\t\t\t\t\t},\n\t\t\t\t\t\tdirection: \"ltr\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\tbuttonlink: {\n\t\t\t\t__TYPE__: \"LinkContent\",\n\t\t\t\tvalue: {\n\t\t\t\t\t__TYPE__: \"ExternalLink\",\n\t\t\t\t\turl: \"https://prismic.io\",\n\t\t\t\t},\n\t\t\t},\n\t\t\tbuttonLabel: {\n\t\t\t\t__TYPE__: \"FieldContent\",\n\t\t\t\ttype: \"Text\",\n\t\t\t\tvalue: \"Learn more!\",\n\t\t\t},\n\t\t},\n\t\titems: [\n\t\t\t{\n\t\t\t\t__TYPE__: \"GroupItemContent\",\n\t\t\t\tvalue: [],\n\t\t\t},\n\t\t],\n\t},\n];\n\nexport const createComponentContents = (\n\tmodel: SharedSlice,\n\tisTypeScriptProject: boolean,\n): string => {\n\tconst pascalName = pascalCase(model.name);\n\n\tif (isTypeScriptProject) {\n\t\treturn stripIndent`\n\t\t\timport { Content, isFilled, asText } from \"@prismicio/client\";\n\t\t\timport { SliceComponentProps, PrismicRichText } from \"@prismicio/react\";\n\t\t\t\n\t\t\t/**\n\t\t\t * Props for \\`${pascalName}\\`.\n\t\t\t */\n\t\t\texport type ${pascalName}Props = SliceComponentProps<Content.${pascalName}Slice>;\n\t\t\t\n\t\t\t/**\n\t\t\t * Component for \"${model.name}\" Slices.\n\t\t\t */\n\t\t\tconst ${pascalName} = ({ slice }: ${pascalName}Props): JSX.Element => {\n\t\t\t\tconst alignment = slice.variation === \"alignLeft\" ? \"left\" : \"center\";\n\t\t\t\n\t\t\t\treturn (\n\t\t\t\t\t<section\n\t\t\t\t\t\tdata-slice-type={slice.slice_type}\n\t\t\t\t\t\tdata-slice-variation={slice.variation}\n\t\t\t\t\t\tclassName=\"es-bounded es-call-to-action\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"es-bounded__content es-call-to-action__content\">\n\t\t\t\t\t\t\t{slice.primary.image?.url && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\theight={600}\n\t\t\t\t\t\t\t\t\twidth={800}\n\t\t\t\t\t\t\t\t\tsrc={slice.primary.image.url}\n\t\t\t\t\t\t\t\t\talt={slice.primary.image.alt ?? undefined}\n\t\t\t\t\t\t\t\t\tclassName=\"es-call-to-action__image\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<div className=\"es-call-to-action__content\">\n\t\t\t\t\t\t\t\t{isFilled.richText(slice.primary.title) && (\n\t\t\t\t\t\t\t\t\t<h2 className=\"es-call-to-action__content__heading\">\n\t\t\t\t\t\t\t\t\t\t{asText(slice.primary.title)}\n\t\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{isFilled.richText(slice.primary.paragraph) && (\n\t\t\t\t\t\t\t\t\t<div className=\"es-call-to-action__content__paragraph\">\n\t\t\t\t\t\t\t\t\t\t<PrismicRichText field={slice.primary.paragraph} />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tfield={slice.primary.buttonLink}\n\t\t\t\t\t\t\t\tclassName=\"es-call-to-action__button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{slice.primary.buttonLabel || \"Learn more…\"}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<style>\n\t\t\t\t\t\t\t{\\`\n\t\t\t\t\t\t.es-call-to-action {\n\t\t\t\t\t\t\tbackground-color: #fff;\n\t\t\t\t\t\t\tcolor: #333;\n\t\t\t\t\t\t\tpadding: 8vw 2rem;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content {\n\t\t\t\t\t\t\tdisplay: grid;\n\t\t\t\t\t\t\tgap: 2rem;\n\t\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__image {\n\t\t\t\t\t\t\tmax-width: 14rem;\n\t\t\t\t\t\t\tjustify-self: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content {\n\t\t\t\t\t\t\tdisplay: grid;\n\t\t\t\t\t\t\tgap: 1rem;\n\t\t\t\t\t\t\tjustify-items: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content__heading {\n\t\t\t\t\t\t\tfont-size: 2rem;\n\t\t\t\t\t\t\tfont-weight: 700;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content__paragraph {\n\t\t\t\t\t\t\tfont-size: 1.15rem;\n\t\t\t\t\t\t\tmax-width: 38rem;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__button {\n\t\t\t\t\t\t\tjustify-self: \\${alignment};\n\t\t\t\t\t\t\tborder-radius: 0.25rem;\n\t\t\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\t\t\tfont-size: 0.875rem;\n\t\t\t\t\t\t\tline-height: 1.3;\n\t\t\t\t\t\t\tpadding: 1rem 2.625rem;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t\ttransition: background-color 100ms linear;\n\t\t\t\t\t\t\tbackground-color: #16745f;\n\t\t\t\t\t\t\tcolor: #fff;\n\t\t\t\t\t\t}\n\t\n\t\t\t\t\t\t.es-call-to-action__button:hover {\n\t\t\t\t\t\t\tbackground-color: #0d5e4c;\n\t\t\t\t\t\t}\n\t\t\t\t\t\\`}\n\t\t\t\t\t\t</style>\n\t\t\t\t\t</section>\n\t\t\t\t);\n\t\t\t};\n\t\t\t\n\t\t\texport default ${pascalName};\n\t\t`;\n\t}\n\n\treturn stripIndent`\n\t\t\timport { PrismicRichText } from \"@prismicio/react\";\n\t\t\timport { isFilled, asText } from \"@prismicio/client\";\n\t\t\t\n\t\t\t/**\n\t\t\t * @typedef {import(\"@prismicio/client\").Content.${pascalName}Slice} ${pascalName}Slice\n\t\t\t * @typedef {import(\"@prismicio/react\").SliceComponentProps<${pascalName}Slice>} ${pascalName}Props\n\t\t\t * @param {${pascalName}Props}\n\t\t\t */\n\t\t\tconst ${pascalName} = ({ slice }) => {\n\t\t\t\tconst alignment = slice.variation === \"alignLeft\" ? \"left\" : \"center\";\n\t\t\t\n\t\t\t\treturn (\n\t\t\t\t\t<section\n\t\t\t\t\t\tdata-slice-type={slice.slice_type}\n\t\t\t\t\t\tdata-slice-variation={slice.variation}\n\t\t\t\t\t\tclassName=\"es-bounded es-call-to-action\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"es-bounded__content es-call-to-action__content\">\n\t\t\t\t\t\t\t{slice.primary.image?.url && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\theight={600}\n\t\t\t\t\t\t\t\t\twidth={800}\n\t\t\t\t\t\t\t\t\tsrc={slice.primary.image.url}\n\t\t\t\t\t\t\t\t\talt={slice.primary.image.alt ?? undefined}\n\t\t\t\t\t\t\t\t\tclassName=\"es-call-to-action__image\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<div className=\"es-call-to-action__content\">\n\t\t\t\t\t\t\t\t{isFilled.richText(slice.primary.title) && (\n\t\t\t\t\t\t\t\t\t<h2 className=\"es-call-to-action__content__heading\">\n\t\t\t\t\t\t\t\t\t\t{asText(slice.primary.title)}\n\t\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{isFilled.richText(slice.primary.paragraph) && (\n\t\t\t\t\t\t\t\t\t<div className=\"es-call-to-action__content__paragraph\">\n\t\t\t\t\t\t\t\t\t\t<PrismicRichText field={slice.primary.paragraph} />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tfield={slice.primary.buttonLink}\n\t\t\t\t\t\t\t\tclassName=\"es-call-to-action__button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{slice.primary.buttonLabel || \"Learn more…\"}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<style>\n\t\t\t\t\t\t\t{\\`\n\t\t\t\t\t\t.es-call-to-action {\n\t\t\t\t\t\t\tbackground-color: #fff;\n\t\t\t\t\t\t\tcolor: #333;\n\t\t\t\t\t\t\tpadding: 8vw 2rem;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content {\n\t\t\t\t\t\t\tdisplay: grid;\n\t\t\t\t\t\t\tgap: 2rem;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__image {\n\t\t\t\t\t\t\tmax-width: 14rem;\n\t\t\t\t\t\t\tjustify-self: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content {\n\t\t\t\t\t\t\tdisplay: grid;\n\t\t\t\t\t\t\tgap: 1rem;\n\t\t\t\t\t\t\tjustify-items: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content__heading {\n\t\t\t\t\t\t\tfont-size: 2rem;\n\t\t\t\t\t\t\tfont-weight: 700;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__content__paragraph {\n\t\t\t\t\t\t\tfont-size: 1.15rem;\n\t\t\t\t\t\t\tmax-width: 38rem;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t\t.es-call-to-action__button {\n\t\t\t\t\t\t\tjustify-self: \\${alignment};\n\t\t\t\t\t\t\tborder-radius: 0.25rem;\n\t\t\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\t\t\tfont-size: 0.875rem;\n\t\t\t\t\t\t\tline-height: 1.3;\n\t\t\t\t\t\t\tpadding: 1rem 2.625rem;\n\t\t\t\t\t\t\ttext-align: \\${alignment};\n\t\t\t\t\t\t\ttransition: background-color 100ms linear;\n\t\t\t\t\t\t\tbackground-color: #16745f;\n\t\t\t\t\t\t\tcolor: #fff;\n\t\t\t\t\t\t}\n\t\t\t\n\t\t\t\t\t\t.es-call-to-action__button:hover {\n\t\t\t\t\t\t\tbackground-color: #0d5e4c;\n\t\t\t\t\t\t}\n\t\t\t\t\t\\`}\n\t\t\t\t\t\t</style>\n\t\t\t\t\t</section>\n\t\t\t\t);\n\t\t\t};\n\t\t\t\n\t\t\texport default ${pascalName};\n\t\t`;\n};\n\nexport const model: SharedSlice = {\n\tid: \"call_to_action\",\n\ttype: \"SharedSlice\",\n\tname: \"CallToAction\",\n\tdescription: \"CallToAction\",\n\tvariations: [\n\t\t{\n\t\t\tid: \"default\",\n\t\t\tname: \"Default\",\n\t\t\tdocURL: \"...\",\n\t\t\tversion: \"initial\",\n\t\t\tdescription: \"Default\",\n\t\t\timageUrl: \"\",\n\t\t\tprimary: {\n\t\t\t\timage: {\n\t\t\t\t\ttype: \"Image\",\n\t\t\t\t\tconfig: { label: \"Image\", constraint: {}, thumbnails: [] },\n\t\t\t\t},\n\t\t\t\ttitle: {\n\t\t\t\t\ttype: \"StructuredText\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"title\",\n\t\t\t\t\t\tplaceholder: \"\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tsingle: \"heading1,heading2,heading3,heading4,heading5,heading6\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tparagraph: {\n\t\t\t\t\ttype: \"StructuredText\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"paragraph\",\n\t\t\t\t\t\tplaceholder: \"\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tsingle:\n\t\t\t\t\t\t\t\"paragraph,preformatted,strong,em,hyperlink,image,embed,list-item,o-list-item,rtl\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tbuttonlink: {\n\t\t\t\t\ttype: \"Link\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"buttonLink\",\n\t\t\t\t\t\tplaceholder: \"Redirect URL for CTA button\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tselect: null,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tbuttonLabel: {\n\t\t\t\t\ttype: \"Text\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"buttonLabel\",\n\t\t\t\t\t\tplaceholder: \"Label for CTA button\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t\titems: {},\n\t\t},\n\t\t{\n\t\t\tid: \"alignLeft\",\n\t\t\tname: \"AlignLeft\",\n\t\t\tdocURL: \"...\",\n\t\t\tversion: \"initial\",\n\t\t\tdescription: \"Default\",\n\t\t\timageUrl: \"\",\n\t\t\tprimary: {\n\t\t\t\timage: {\n\t\t\t\t\ttype: \"Image\",\n\t\t\t\t\tconfig: { label: \"Image\", constraint: {}, thumbnails: [] },\n\t\t\t\t},\n\t\t\t\ttitle: {\n\t\t\t\t\ttype: \"StructuredText\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"title\",\n\t\t\t\t\t\tplaceholder: \"\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tsingle: \"heading1,heading2,heading3,heading4,heading5,heading6\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tparagraph: {\n\t\t\t\t\ttype: \"StructuredText\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"paragraph\",\n\t\t\t\t\t\tplaceholder: \"\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tsingle:\n\t\t\t\t\t\t\t\"paragraph,preformatted,strong,em,hyperlink,image,embed,list-item,o-list-item,rtl\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tbuttonlink: {\n\t\t\t\t\ttype: \"Link\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"buttonLink\",\n\t\t\t\t\t\tplaceholder: \"Redirect URL for CTA button\",\n\t\t\t\t\t\tallowTargetBlank: true,\n\t\t\t\t\t\tselect: null,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tbuttonLabel: {\n\t\t\t\t\ttype: \"Text\",\n\t\t\t\t\tconfig: {\n\t\t\t\t\t\tlabel: \"buttonLabel\",\n\t\t\t\t\t\tplaceholder: \"Label for CTA button\",\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t},\n\t\t\titems: {},\n\t\t},\n\t],\n};\n\nexport const screenshotPaths = {\n\tdefault: \"CallToAction/screenshot-default.png\",\n\talignLeft: \"CallToAction/screenshot-alignLeft.png\",\n};\n"],"names":["model"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@slicemachine/adapter-next",
-	"version": "0.3.14-dev-next-release.4",
+	"version": "0.3.14-dev-slice-tenplate-feature-2.0",
 	"description": "Slice Machine adapter for Next.js.",
 	"keywords": [
 		"typescript",
@@ -61,7 +61,7 @@
 	"dependencies": {
 		"@prismicio/simulator": "^0.1.4",
 		"@prismicio/types-internal": "^2.0.0",
-		"@slicemachine/plugin-kit": "^0.4.14-dev-next-release.4",
+		"@slicemachine/plugin-kit": "^0.4.14-dev-slice-tenplate-feature-2.0",
 		"common-tags": "^1.8.2",
 		"fp-ts": "^2.13.1",
 		"io-ts": "^2.2.20",
@@ -104,5 +104,5 @@
 	"engines": {
 		"node": ">=14.15.0"
 	},
-	"gitHead": "3d3654dd6a15d9b16e65dc662550ba3bee9b095a"
+	"gitHead": "46a6fdd567ff49c7f2671fa042a473c32c3b939a"
 }

package/src/hooks/slice-create.ts

@@ -39,7 +39,9 @@ const createComponentFile = async ({
 		options,
 	});
 
-	if (isTypeScriptProject) {
+	if (data.componentContents) {
+		contents = data.componentContents;
+	} else if (isTypeScriptProject) {
 		contents = stripIndent`
 			import { Content } from "@prismicio/client";
 			import { SliceComponentProps } from "@prismicio/react";

package/src/hooks/sliceTemplateLibrary-read.ts

@@ -0,0 +1,55 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+import { SharedSlice } from "@prismicio/types-internal/lib/customtypes";
+import type { SliceTemplateLibraryReadHook } from "@slicemachine/plugin-kit";
+
+import { checkIsTypeScriptProject } from "../lib/checkIsTypeScriptProject";
+
+import * as CallToAction from "../sliceTemplates/CallToAction";
+import type { PluginOptions } from "../types";
+
+const initialTemplates = [CallToAction];
+
+export const sliceTemplateLibraryRead: SliceTemplateLibraryReadHook<
+	PluginOptions
+> = async ({ templateIDs }, { helpers, options }) => {
+	const isTypeScriptProject = await checkIsTypeScriptProject({
+		helpers,
+		options,
+	});
+	const templates =
+		templateIDs && templateIDs.length
+			? initialTemplates.filter((t) => templateIDs?.includes(t.model.id))
+			: initialTemplates;
+
+	const templatesPromises = templates.map(async (t) => {
+		const { mocks, model, createComponentContents, screenshotPaths } = t;
+
+		const screenshotEntries = Object.entries(screenshotPaths);
+		const screenshotPromises = screenshotEntries.map(([key, filePath]) => {
+			return fs
+				.readFile(
+					fileURLToPath(new URL(path.join("..", filePath), import.meta.url)),
+				)
+				.then((data) => [key, data]);
+		});
+		const readScreenshots = await Promise.all(screenshotPromises);
+		const screenshots = Object.fromEntries(readScreenshots);
+
+		return {
+			mocks,
+			model,
+			createComponentContents: (model: SharedSlice) =>
+				createComponentContents(model, isTypeScriptProject),
+			screenshots,
+		};
+	});
+
+	const resolvedTemplates = await Promise.all(templatesPromises);
+
+	return {
+		templates: resolvedTemplates,
+	};
+};

package/src/plugin.ts

@@ -29,6 +29,7 @@ import { documentationRead } from "./hooks/documentation-read";
 import { projectInit } from "./hooks/project-init";
 import { sliceCreate } from "./hooks/slice-create";
 import { sliceSimulatorSetupRead } from "./hooks/sliceSimulator-setup-read";
+import { sliceTemplateLibraryRead } from "./hooks/sliceTemplateLibrary-read";
 import { snippetRead } from "./hooks/snippet-read";
 
 export const plugin = defineSliceMachinePlugin<PluginOptions>({
@@ -155,6 +156,12 @@ export const plugin = defineSliceMachinePlugin<PluginOptions>({
 			});
 		});
 
+		////////////////////////////////////////////////////////////////
+		// slice-template-library:*
+		////////////////////////////////////////////////////////////////
+
+		hook("slice-template-library:read", sliceTemplateLibraryRead);
+
 		////////////////////////////////////////////////////////////////
 		// custom-type:*
 		////////////////////////////////////////////////////////////////