create-sitecore-jss 20.0.0-canary.78

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/graphql/GraphQL-IntegratedDemo.sitecore.graphql

@@ -0,0 +1,71 @@
+# This file contains a GraphQL query that will be executed and the result provided to
+# your JSS component. You can run this query in GraphiQL ($endpoint/ui) for a nice editing experience.
+
+# Note that we're executing _two queries_ (datasource and contextItem)
+# within the context of the IntegratedDemoQuery _operation_. This makes it
+# very efficient at gathering data from multiple sources.
+
+query IntegratedDemoQuery($datasource: String!, $contextItem: String!, $language: String!) {
+  # Datasource query
+  # $datasource will always be set to the ID of the rendering's datasource item
+  # (as long as the GraphQLData helper is used)
+  datasource: item(path: $datasource, language: $language) {
+    id
+    name
+    # Strongly-typed querying on known templates is possible!
+    ...on <%- appPrefix ? `${helper.getPascalCaseName(appName)}` : "" %>GraphQLIntegratedDemo {
+      # Single-line text field
+      sample1 {
+        # the 'jsonValue' field is a JSON blob that represents the object that
+        # should be passed to JSS field rendering helpers (i.e. text, image, link)
+        jsonValue
+        value
+      }
+      # General Link field
+      sample2 {
+        jsonValue
+        # Structured querying of the field's values is possible
+        text
+        target
+        url
+        # Access to the template definition is possible
+        definition {
+          type
+          shared
+        }
+      }
+    }
+  }
+
+  # Context/route item query
+  # $contextItem will always be set to the ID of the current context item (the route item)
+  # (as long as the GraphQLData helper is used)
+  contextItem: item(path: $contextItem, language: $language) {
+    id
+    # Get the page title from the app route template
+    ...on <%- appPrefix ? `${helper.getPascalCaseName(appName)}` : "" %>AppRoute {
+      pageTitle {
+        value
+      }
+    }
+
+    # List the children of the current route
+    children(hasLayout: true) {
+      results {
+        id
+        # typing fragments can be used anywhere!
+        # so in this case, we're grabbing the 'pageTitle'
+        # field on all child route items.
+        ...on <%- appPrefix ? `${helper.getPascalCaseName(appName)}` : "" %>AppRoute {
+          pageTitle {
+            jsonValue
+            value
+          }
+        }
+        url{
+          path
+        }
+      }
+    }
+  }
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/graphql/GraphQL-IntegratedDemo.sitecore.ts

@@ -0,0 +1,25 @@
+import { CommonFieldTypes, SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+import fs from 'fs';
+
+const query = fs.readFileSync(
+  'sitecore/definitions/components/graphql/GraphQL-IntegratedDemo.sitecore.graphql',
+  'utf8'
+);
+
+/**
+ * Adds the GraphQL-IntegratedDemo component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function GraphQLIntegratedDemo(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'GraphQL-IntegratedDemo',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>GraphQL-IntegratedDemo',
+    icon: SitecoreIcon.GraphConnection_directed,
+    graphQLQuery: query,
+    fields: [
+      { name: 'sample1', type: CommonFieldTypes.SingleLineText },
+      { name: 'sample2', type: CommonFieldTypes.GeneralLink },
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/graphql/GraphQL-Layout.sitecore.ts

@@ -0,0 +1,15 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the GraphQL-Layout component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function GraphQLLayout(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'GraphQL-Layout',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>GraphQL-Layout',
+    icon: SitecoreIcon.Layout,
+    placeholders: ['<%- helper.getAppPrefix(appPrefix, appName) %>jss-graphql-layout'],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-ComponentParams.sitecore.ts

@@ -0,0 +1,20 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-ComponentParams component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideComponentParams(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-ComponentParams',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-ComponentParams',
+    icon: SitecoreIcon.WindowDialog,
+    params: ['cssClass', 'columns', 'useCallToAction'],
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-CustomRouteType.sitecore.ts

@@ -0,0 +1,31 @@
+import { CommonFieldTypes, SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-CustomRouteType component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideCustomRouteType(manifest: Manifest): void {
+  // This registers the custom route type with the manifest.
+  // Like a component, a route type contains data fields -
+  // but unlike a component, the fields are shared at the route level,
+  // instead of at the component level. This is good for scenarios such as
+  // article sections, where you may wish to use route-level fields for
+  // _sorting and filtering_ (it's difficult to query on component-level field data).
+  manifest.addRouteType({
+    name: '<%- helper.getAppPrefix(appPrefix, appName) %>ExampleCustomRouteType',
+    fields: [
+      { name: 'headline', type: CommonFieldTypes.SingleLineText },
+      { name: 'author', type: CommonFieldTypes.SingleLineText },
+      { name: 'content', type: CommonFieldTypes.RichText },
+    ],
+  });
+
+  // We're also adding a component, that we can put on our sample custom route type route.
+  // This component will display the route level fields on the custom route type.
+  manifest.addComponent({
+    name: 'Styleguide-CustomRouteType',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-CustomRouteType',
+    icon: SitecoreIcon.DocumentTag,
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Layout-Reuse.sitecore.ts

@@ -0,0 +1,20 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Layout-Reuse component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideLayoutReuse(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Layout-Reuse',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Layout-Reuse',
+    icon: SitecoreIcon.DocumentsExchange,
+    placeholders: ['<%- helper.getAppPrefix(appPrefix, appName) %>jss-reuse-example'],
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Layout-Tabs-Tab.sitecore.ts

@@ -0,0 +1,23 @@
+import { CommonFieldTypes, SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Layout-Tabs-Tab component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideLayoutTabsTab(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Layout-Tabs-Tab',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Layout-Tabs-Tab',
+    icon: SitecoreIcon.TabPane,
+    fields: [
+      { name: 'title', type: CommonFieldTypes.SingleLineText },
+      { name: 'content', type: CommonFieldTypes.RichText },
+    ],
+    /*
+    If the component implementation uses <Placeholder> or withPlaceholder to expose a placeholder,
+    register it here, or components added to that placeholder will not be returned by Sitecore:
+    placeholders: ['exposed-placeholder-name']
+    */
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Layout-Tabs.sitecore.ts

@@ -0,0 +1,20 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Layout-Tabs component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideLayoutTabs(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Layout-Tabs',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Layout-Tabs',
+    icon: SitecoreIcon.DocumentTag,
+    placeholders: ['<%- helper.getAppPrefix(appPrefix, appName) %>jss-tabs'],
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Layout.sitecore.ts

@@ -0,0 +1,15 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Layout component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideLayout(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Layout',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Layout',
+    icon: SitecoreIcon.Layout,
+    placeholders: ['<%- helper.getAppPrefix(appPrefix, appName) %>jss-styleguide-layout'],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Multilingual.sitecore.ts

@@ -0,0 +1,26 @@
+import { CommonFieldTypes, SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Multilingual component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideMultilingual(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Multilingual',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Multilingual',
+    icon: SitecoreIcon.FlagGeneric,
+    fields: [
+      {
+        name: 'sample',
+        type: CommonFieldTypes.SingleLineText,
+        displayName: 'This field has a translated value',
+      },
+    ],
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-RouteFields.sitecore.ts

@@ -0,0 +1,22 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-RouteFields component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideRouteFields(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-RouteFields',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-RouteFields',
+    icon: SitecoreIcon.TextField,
+    // this component gets all of its fields from the _route_,
+    // so it does not need any local fields defined.
+
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Section.sitecore.ts

@@ -0,0 +1,16 @@
+import { CommonFieldTypes, SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Section component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideSection(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Section',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Section',
+    icon: SitecoreIcon.DocumentTag,
+    fields: [{ name: 'heading', type: CommonFieldTypes.SingleLineText }],
+    placeholders: ['<%- helper.getAppPrefix(appPrefix, appName) %>jss-styleguide-section'],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-SitecoreContext.sitecore.ts

@@ -0,0 +1,19 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-SitecoreContext component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideSitecoreContext(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-SitecoreContext',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-SitecoreContext',
+    icon: SitecoreIcon.ControlPanel,
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/components/styleguide/Styleguide-Tracking.sitecore.ts

@@ -0,0 +1,19 @@
+import { SitecoreIcon, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adds the Styleguide-Tracking component to the disconnected manifest.
+ * This function is invoked by convention (*.sitecore.js) when 'jss manifest' is run.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideTracking(manifest: Manifest): void {
+  manifest.addComponent({
+    name: 'Styleguide-Tracking',
+    templateName: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-Tracking',
+    icon: SitecoreIcon.Compass,
+    // inherit fields from another template (../templates/Styleguide-Explanatory-Component)
+    // inheritance adds fields defined on the base template(s) implicitly to this component
+    inherits: [
+      '<%- helper.getAppPrefix(appPrefix, appName) %>styleguide-explanatory-component-template',
+    ],
+  });
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/config.js

@@ -0,0 +1,5 @@
+// this file is imported by default prior to executing the jss manifest command
+// use this to enable transpilation or any other pre-manifest configurations that are needed.
+console.log('Enabling TypeScript transpilation for the manifest...');
+// eslint-disable-next-line
+require('ts-node').register({ project: 'tsconfig.scripts.json' });

package/dist/templates/nextjs-styleguide/sitecore/definitions/content.sitecore.ts

@@ -0,0 +1,117 @@
+import {
+  mergeFs,
+  MergeFsResult,
+  Manifest,
+  ItemDefinition,
+} from '@sitecore-jss/sitecore-jss-dev-tools';
+import path from 'path';
+import fs from 'fs';
+
+/**
+ * Adds non-route content items to the disconnected manifest.
+ * Content items are conventionally defined in /data/content, similar to route items.
+ * This function is invoked by convention (*.sitecore.js) when `jss manifest` is run.
+ * @param {Manifest} manifest
+ * @returns {Promise}
+ */
+export default function addContentToManifest(manifest: Manifest): Promise<void> {
+  const rootItemName = 'Content';
+  const startPath = './data/content'; // relative to process invocation (i.e. where package.json lives)
+
+  if (!fs.existsSync(startPath)) return Promise.resolve();
+
+  return mergeFs(startPath)
+    .then((result) => {
+      const items = convertToItems(
+        result,
+        path.resolve(startPath),
+        rootItemName,
+        manifest.language
+      );
+      return items;
+    })
+    .then((contentData) => {
+      if (contentData) {
+        manifest.addContent(contentData);
+      }
+    });
+}
+
+/**
+ * Maps filesystem content data into manifest content item data.
+ * @param {MergeFsResult} data Filesystem data (files and folders under current path)
+ * @param {string} basePath The base physical path to calculate relative item paths from
+ * @param {string} rootItemName Name of the root item to place non-content items under in Sitecore. Normally $siteRoot/Content.
+ * @param {string} language Language the manifest is being created in. Conventionally affects the expected filename.
+ * @returns {ItemDefinition}
+ */
+function convertToItems(
+  data: MergeFsResult,
+  basePath: string,
+  rootItemName: string,
+  language: string
+): ItemDefinition {
+  const itemPath = convertPhsyicalPathToItemRelativePath(data.path, basePath);
+  const name = itemPath.substr(itemPath.lastIndexOf('/') + 1);
+
+  let result;
+
+  const contentItemPattern = new RegExp(`^${language}\\.(yaml|yml|json)$`, 'i');
+
+  const contentFileData = data.files.find((f) => contentItemPattern.test(f.filename));
+
+  if (contentFileData && contentFileData.contents) {
+    // the path has a valid content item definition
+    result = contentFileData.contents;
+
+    // Set the path to the item when imported in Sitecore.
+    // NOTE: Importing to any Sitecore path the import user has rights to is allowed; '$site/Content' is a convention only.
+    result.path = itemPath;
+
+    // content item name defaults to parent folder name if not explicit
+    if (!result.name) {
+      result.name = name;
+    }
+  } else if (data.folders.length > 0) {
+    // The path does not have a content item definition (i.e. en.yml),
+    // but it does have child folders (which may contain valid content items)
+    // it will be defined as a Folder item in Sitecore.
+    result = {
+      path: itemPath,
+      name: name || rootItemName,
+      displayName: name || rootItemName,
+      template: 'Folder',
+      children: [],
+    };
+  }
+
+  // recursively process child paths
+  if (data.folders.length > 0) {
+    result.children = data.folders
+      .map((folder) => convertToItems(folder, basePath, rootItemName, language))
+      .filter((item) => item); // remove null results
+  }
+
+  return result;
+}
+
+/**
+ * Converts a physical filesystem path into a relative Sitecore item path.
+ * i.e. if physicalPath = /var/log and basePath = /var, this returns /log.
+ * @param {string} physicalPath
+ * @param {string} basePath
+ */
+function convertPhsyicalPathToItemRelativePath(physicalPath: string, basePath: string) {
+  const targetPathSeparator = '/';
+
+  // normalize path separators to /
+  const normalizedPath = physicalPath.replace(basePath, '').replace(/\\/g, targetPathSeparator);
+
+  if (!normalizedPath) {
+    return targetPathSeparator;
+  }
+
+  return normalizedPath.indexOf(targetPathSeparator) > 0
+    ? `${targetPathSeparator}${normalizedPath}`
+    : normalizedPath;
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/dictionary.sitecore.ts

@@ -0,0 +1,52 @@
+import { Manifest, mergeFs, MergeFsResult } from '@sitecore-jss/sitecore-jss-dev-tools';
+import fs from 'fs';
+
+/**
+ * Reads dictionary definition file in /data/dictionary,
+ * then emits the dictionary into the disconnected manifest.
+ * Invoked by convention (*.sitecore.js) when `jss manifest` is run.
+ * @param {Manifest} manifest
+ * @returns {Promise}
+ */
+export default function addDictionaryToManifest(
+  manifest: Manifest
+): Promise<void> | void | undefined {
+  const startPath = './data/dictionary'; // relative to process invocation (i.e. where package.json lives)
+
+  if (!fs.existsSync(startPath)) return;
+
+  return mergeFs(startPath)
+    .then((result) => mergeDictionaryFiles(result, manifest.language))
+    .then((mergedDictionary) => convertToManifestDictionary(mergedDictionary))
+    .then((dictionary) => manifest.addDictionary(...dictionary));
+}
+
+function convertToManifestDictionary(mergedDictionary: { [key: string]: string }) {
+  return Object.keys(mergedDictionary).map((key) => ({
+    key,
+    value: mergedDictionary[key],
+    // optional: if you wished to specify the exact ID of a dictionary item when imported,
+    // you could pass an 'id' property here that was a GUID or unique (app-wide) string
+  }));
+}
+
+/**
+ * Maps a filesystem dictionary file into an object that represents the dictionary.
+ * @param {MergeFsResult} data Filesystem data (files and folders under current path)
+ * @param {string} language Language the manifest is being created in. Conventionally affects the expected filename.
+ * @returns {object} Key-value mappings for the dictionary
+ */
+function mergeDictionaryFiles(data: MergeFsResult, language: string) {
+  let dictionaryResult = {};
+
+  // regex that matches the expected dictionary file name
+  const dictionaryFilePattern = new RegExp(`^${language}\\.(yaml|yml|json)$`, 'i');
+  const dictionaryFileData = data.files.find((f) => dictionaryFilePattern.test(f.filename));
+
+  if (dictionaryFileData && dictionaryFileData.contents) {
+    // customize here to modify the dictionary or apply conventions
+    dictionaryResult = dictionaryFileData.contents;
+  }
+
+  return dictionaryResult;
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/placeholders.sitecore.ts

@@ -0,0 +1,21 @@
+import { Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Adding placeholders is optional but allows setting a user-friendly display name. Placeholder Settings
+ * items will be created for any placeholders explicitly added, or discovered in your routes and component definitions.
+ * Invoked by convention (*.sitecore.js) when `jss manifest` is run.
+ * @param {Manifest} manifest
+ */
+export default function addPlaceholdersToManifest(manifest: Manifest): void {
+  manifest.addPlaceholder(
+    { name: '<%- helper.getAppPrefix(appPrefix, appName) %>jss-main', displayName: 'Main' },
+    // you can optionally pass a GUID or unique (app-wide) string as an ID
+    // this will inform the ID that is set when imported into Sitecore.
+    // If the ID is not set, an ID is created based on the placeholder name.
+    {
+      name: '<%- helper.getAppPrefix(appPrefix, appName) %>jss-tabs',
+      displayName: 'Tabs',
+      id: 'tabs-placeholder',
+    }
+  );
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/routes.sitecore.ts

@@ -0,0 +1,88 @@
+import path from 'path';
+import {
+  Manifest,
+  RouteDefinition,
+  CommonFieldTypes,
+  mergeFs,
+  MergeFsResult,
+} from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * Collects the disconnected routes defined in data/routes into the manifest.
+ * Invoked by convention (*.sitecore.js) when `jss manifest` is run.
+ * Alter this method if you wish to store disconnected route data in some way other than the default,
+ * or to preprocess the route data before it is sent to Sitecore to be ingested - for example to add fields to the route type.
+ * @param {Manifest} manifest The manifest instance to add routes to
+ * @returns {Promise}
+ */
+export default function addRoutesToManifest(manifest: Manifest): Promise<void> {
+  // Configure the default route type for the app
+  // this lets us enable route-level data fields,
+  // which most apps will want for metadata like page titles, SEO metas, or OpenGraph.
+  // You can add additional non-default route types using `manifest.addRouteType()`,
+  // which routes can use by setting `template: YourCustomRouteTypeName` in their definition.
+  const appTemplateSection = 'Page Metadata';
+
+  manifest.setDefaultRouteType({
+    name: '<%- helper.getAppPrefix(appPrefix, appName) %>App Route',
+    displayName: 'App Route',
+    fields: [
+      {
+        name: 'pageTitle',
+        displayName: 'Page Title',
+        section: appTemplateSection,
+        type: CommonFieldTypes.SingleLineText,
+      },
+    ],
+    insertOptions: ['<%- helper.getAppPrefix(appPrefix, appName) %>App Route'],
+  });
+
+  return mergeFs('./data/routes') // relative to process invocation (i.e. your package.json)
+    .then((result) => convertToRoutes(result, manifest.language))
+    .then((routeData) => {
+      manifest.addRoute(routeData);
+    });
+}
+
+/**
+ * Maps filesystem data into manifest route data.
+ * This is where custom conventions regarding route data would go.
+ * @param {MergeFsResult} data Filesystem data (files and folders under current path)
+ * @param {string} language Language the manifest is being created in. Conventionally affects the expected filename.
+ * @returns {RouteDefinition}
+ */
+function convertToRoutes(data: MergeFsResult, language: string): RouteDefinition {
+  let routeData;
+
+  // regex that matches the expected route file name
+  const routeFilePattern = new RegExp(`^${language}\\.(yaml|yml|json)$`, 'i');
+
+  // find the expected file in the list of files in the current folder
+  const routeFileData = data.files.find((f) => routeFilePattern.test(f.filename));
+
+  // parse the route data file contents
+  if (routeFileData && routeFileData.contents) {
+    routeData = routeFileData.contents;
+
+    if (!routeData.name) {
+      // no name = imply one from parent folder name
+      routeData.name = path.basename(path.dirname(routeFileData.path));
+      // special case for the home route item as its parent folder is 'routes'
+      if (routeData.name === 'routes') routeData.name = 'home';
+    }
+  } else {
+    console.warn(
+      `Route data file not found: ${data.path}\\${language}.(yaml|yml|json).
+The route will not be added to the manifest. Empty folders can cause this warning.`
+    );
+  }
+
+  // recursively crawl child routes (folders)
+  if (routeData && data.folders.length > 0) {
+    routeData.children = data.folders
+      .map((folder) => convertToRoutes(folder, language))
+      .filter((route) => route); // remove null results
+  }
+
+  return routeData;
+}

package/dist/templates/nextjs-styleguide/sitecore/definitions/templates/Styleguide-ContentList-Template.sitecore.ts

@@ -0,0 +1,12 @@
+import { CommonFieldTypes, Manifest } from '@sitecore-jss/sitecore-jss-dev-tools';
+
+/**
+ * This is the data template for an individual _item_ in the Styleguide's Content List field demo.
+ * @param {Manifest} manifest Manifest instance to add components to
+ */
+export default function StyleguideContentListItemTemplate(manifest: Manifest): void {
+  manifest.addTemplate({
+    name: '<%- helper.getAppPrefix(appPrefix, appName) %>Styleguide-ContentList-Item-Template',
+    fields: [{ name: 'textField', type: CommonFieldTypes.SingleLineText }],
+  });
+}