@cooperco/cooper-component-library 0.1.60 → 0.1.62

package/dist/cms/contentful/queries/testimonial.query.js

@@ -0,0 +1,23 @@
+import { gql } from 'graphql-tag';
+import { imageFragment, videoFragment } from './fragments.js';
+export const getTestimonialModule = gql `
+	${imageFragment}
+	${videoFragment}
+	query TestimonialModuleQuery($id: String!, $preview: Boolean = false) {
+		testimonialModule(id: $id, preview: $preview) {
+			entryName
+			headline
+			quote
+			author
+			details
+			media {
+				... on Image {
+					...imageFragment
+				}
+				... on Video {
+					...videoFragment
+				}
+			}
+		}
+	}
+`;

package/dist/cms/contentful/queries/testimonial.query.ts

@@ -0,0 +1,25 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { imageFragment, videoFragment } from './fragments.js'
+
+export const getTestimonialModule: DocumentNode = gql`
+	${imageFragment}
+	${videoFragment}
+	query TestimonialModuleQuery($id: String!, $preview: Boolean = false) {
+		testimonialModule(id: $id, preview: $preview) {
+			entryName
+			headline
+			quote
+			author
+			details
+			media {
+				... on Image {
+					...imageFragment
+				}
+				... on Video {
+					...videoFragment
+				}
+			}
+		}
+	}
+`

package/dist/cms/contentful/queries/tileCollection.query.d.ts

@@ -0,0 +1,4 @@
+import type { DocumentNode } from 'graphql';
+export declare const getTileContent: DocumentNode;
+export declare const getTileLabel: DocumentNode;
+export declare const getTileCollection: DocumentNode;

package/dist/cms/contentful/queries/tileCollection.query.js

@@ -0,0 +1,35 @@
+import { gql } from 'graphql-tag';
+import { tileContentFragment, tileLabelFragment } from './fragments.js';
+export const getTileContent = gql `
+	${tileContentFragment}
+	query tileContentQuery($id: String!, $preview: Boolean = false) {
+		tileContent(id: $id, preview: $preview) {
+			...tileContentFragment
+		}
+	}
+`;
+export const getTileLabel = gql `
+	${tileLabelFragment}
+	query TileLabelQuery($id: String!, $preview: Boolean = false) {
+		tileLabel(id: $id, preview: $preview) {
+			...tileLabelFragment
+		}
+	}
+`;
+export const getTileCollection = gql `
+	${tileContentFragment}
+	query tileCollectionQuery($id: String!, $preview: Boolean = false) {
+		tileCollectionModule(id: $id, preview: $preview) {
+			headline
+			tilesCollection(limit: 6) {
+				items {
+					...tileContentFragment
+				}
+			}
+			backgroundColor
+			variant
+			tileLabelType
+			includeDecoration
+		}
+	}
+`;

package/dist/cms/contentful/queries/tileCollection.query.ts

@@ -0,0 +1,39 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { tileContentFragment, tileLabelFragment } from './fragments.js'
+
+export const getTileContent: DocumentNode = gql`
+	${tileContentFragment}
+	query tileContentQuery($id: String!, $preview: Boolean = false) {
+		tileContent(id: $id, preview: $preview) {
+			...tileContentFragment
+		}
+	}
+`
+
+export const getTileLabel: DocumentNode = gql`
+	${tileLabelFragment}
+	query TileLabelQuery($id: String!, $preview: Boolean = false) {
+		tileLabel(id: $id, preview: $preview) {
+			...tileLabelFragment
+		}
+	}
+`
+
+export const getTileCollection: DocumentNode = gql`
+	${tileContentFragment}
+	query tileCollectionQuery($id: String!, $preview: Boolean = false) {
+		tileCollectionModule(id: $id, preview: $preview) {
+			headline
+			tilesCollection(limit: 6) {
+				items {
+					...tileContentFragment
+				}
+			}
+			backgroundColor
+			variant
+			tileLabelType
+			includeDecoration
+		}
+	}
+`

package/dist/cms/contentful/queries/video.query.d.ts

@@ -0,0 +1,2 @@
+import type { DocumentNode } from 'graphql';
+export declare const getVideo: DocumentNode;

package/dist/cms/contentful/queries/video.query.js

@@ -0,0 +1,11 @@
+import { gql } from 'graphql-tag';
+import { videoFragment, imageFragment } from './fragments.js';
+export const getVideo = gql `
+	${imageFragment}
+	${videoFragment}
+	query videoQuery($id: String!, $preview: Boolean = false) {
+		video(id: $id, preview: $preview) {
+			...videoFragment
+		}
+	}
+`;

package/dist/cms/contentful/queries/video.query.ts

@@ -0,0 +1,13 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { videoFragment, imageFragment } from './fragments.js'
+
+export const getVideo: DocumentNode = gql`
+	${imageFragment}
+	${videoFragment}
+	query videoQuery($id: String!, $preview: Boolean = false) {
+		video(id: $id, preview: $preview) {
+			...videoFragment
+		}
+	}
+`

package/dist/cms/cta.query.ts

@@ -0,0 +1,12 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { ctaFragment } from './fragments.js'
+
+export const getCTA: DocumentNode = gql`
+	${ctaFragment}
+	query ctaQuery($id: String!, $preview: Boolean = false) {
+		cta(id: $id, preview: $preview) {
+			...ctaFragment
+		}
+	}
+`

package/dist/cms/footer.query.ts

@@ -0,0 +1,50 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import {
+	socialMediaFragment,
+	imageFragment,
+	linkFragment,
+} from './fragments.js'
+
+export const getFooter: DocumentNode = gql`
+	${socialMediaFragment}
+	${imageFragment}
+	${linkFragment}
+	query footerQuery($id: String!, $preview: Boolean = false) {
+		footer(id: $id, preview: $preview) {
+			backgroundColor
+			logo {
+				...imageFragment
+			}
+			socialMediaCollection(limit: 10) {
+				items {
+					...socialMediaFragment
+				}
+			}
+			navigationElementsCollection(limit: 10) {
+				items {
+					sys {
+						id
+					}
+				}
+			}
+			copyright
+			copyrightLinksCollection {
+				items {
+					sys {
+						id
+					}
+					link {
+						...linkFragment
+					}
+				}
+			}
+			copyrightLogosCollection {
+				items {
+					...imageFragment
+				}
+			}
+			legalText
+		}
+	}
+`

package/dist/cms/fragments.ts

@@ -0,0 +1,183 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+
+export const imageFragment: DocumentNode = gql`
+	fragment imageFragment on Image {
+		__typename
+		entryName
+		altTag
+		media {
+			url
+			title
+			description
+		}
+		mobileMedia {
+			url
+			title
+			description
+		}
+	}
+`
+
+export const videoFragment: DocumentNode = gql`
+	fragment videoFragment on Video {
+		__typename
+		entryName
+		url
+		thumbnail {
+			...imageFragment
+		}
+	}
+`
+
+export const metaDataFragment: DocumentNode = gql`
+	${imageFragment}
+	fragment metaDataFragment on PageMetadata {
+		entryName
+		title
+		description
+		keywords
+		socialImage {
+			...imageFragment
+		}
+	}
+`
+
+export const accordionItemFragment: DocumentNode = gql`
+	${imageFragment}
+	fragment accordionItemFragment on AccordionItem {
+		headline
+		bodyCopy {
+			json
+			links {
+				entries {
+					inline {
+						sys {
+							id
+						}
+					}
+				}
+			}
+		}
+		icon {
+			...imageFragment
+		}
+		color
+	}
+`
+
+export const linkFragment: DocumentNode = gql`
+	fragment linkFragment on Link {
+		ariaDescription
+		page {
+			sys {
+				id
+			}
+			slug
+		}
+		anchor
+		externalUrl
+		target
+		ariaLabel
+	}
+`
+
+export const ctaFragment: DocumentNode = gql`
+	${linkFragment}
+	${imageFragment}
+	fragment ctaFragment on Cta {
+		title
+		link {
+			...linkFragment
+		}
+		type
+		logo {
+			...imageFragment
+		}
+		ariaLabel
+		ariaDescription
+		target
+		anchor
+		size
+	}
+`
+
+export const tileLabelFragment: DocumentNode = gql`
+	fragment tileLabelFragment on TileLabel {
+		entryName
+		copy
+		color
+	}
+`
+
+export const tileContentFragment: DocumentNode = gql`
+	${imageFragment}
+	${ctaFragment}
+	${tileLabelFragment}
+	fragment tileContentFragment on TileContent {
+		subheadline
+		headline
+		bodyCopy {
+			json
+			links {
+				entries {
+					inline {
+						sys {
+							id
+						}
+						... on HighlightedText {
+							text
+						}
+					}
+				}
+			}
+		}
+		image {
+			...imageFragment
+		}
+		backgroundColor
+		ctasCollection(limit: 6) {
+			items {
+				...ctaFragment
+			}
+		}
+		tileLabel {
+			...tileLabelFragment
+		}
+		alignment
+		variant
+	}
+`
+
+export const socialMediaFragment: DocumentNode = gql`
+	${imageFragment}
+	${linkFragment}
+	fragment socialMediaFragment on SocialMedia {
+		link {
+			...linkFragment
+		}
+		icon {
+			...imageFragment
+		}
+	}
+`
+
+export const navigationElementFragment: DocumentNode = gql`
+	${linkFragment}
+	fragment navigationElementFragment on NavigationElement {
+		title
+		link {
+			...linkFragment
+		}
+		subNavigationElementsCollection(limit: 10) {
+			items {
+				... on NavigationElement {
+					title
+					link {
+						...linkFragment
+					}
+				}
+			}
+		}
+	}
+`

package/dist/cms/header.query.ts

@@ -0,0 +1,41 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { ctaFragment, imageFragment, linkFragment } from './fragments.js'
+
+export const getHeader: DocumentNode = gql`
+	${imageFragment}
+	${ctaFragment}
+	${linkFragment}
+	query headerQuery($id: String!, $preview: Boolean = false) {
+		primaryNavigation(id: $id, preview: $preview) {
+			logo {
+				...imageFragment
+			}
+			navigationElementsCollection {
+				items {
+					title
+					dividerLine
+					link {
+						...linkFragment
+					}
+					subNavigationElementsCollection(limit: 10) {
+						items {
+							title
+							link {
+								...linkFragment
+							}
+						}
+					}
+				}
+			}
+			ctasCollection {
+				items {
+					...ctaFragment
+					logo {
+						...imageFragment
+					}
+				}
+			}
+		}
+	}
+`

package/dist/cms/helpers/addEntryNameField.cjs

@@ -0,0 +1,9 @@
+const addEntryNameField = (contentType) => {
+	contentType.createField('entryName', {
+		type: 'Symbol',
+		name: 'Entry Name',
+		required: true,
+	})
+}
+
+module.exports = addEntryNameField

package/dist/cms/image.query.ts

@@ -0,0 +1,12 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { imageFragment } from './fragments.js'
+
+export const getImage: DocumentNode = gql`
+	${imageFragment}
+	query imageQuery($id: String!, $preview: Boolean = false) {
+		image(id: $id, preview: $preview) {
+			...imageFragment
+		}
+	}
+`

package/dist/cms/index.ts

@@ -0,0 +1,18 @@
+export * from './fragments.js'
+export * from './accordion.query.js'
+export * from './carousel.query.js'
+export * from './containerModule.query.js'
+export * from './contentModule.query.js'
+export * from './cta.query.js'
+export * from './footer.query.js'
+export * from './header.query.js'
+export * from './image.query.js'
+export * from './link.query.js'
+export * from './logoCollection.query.js'
+export * from './navigation.query.js'
+export * from './page.query.js'
+export * from './pageMetadata.query.js'
+export * from './productModule.query.js'
+export * from './testimonial.query.js'
+export * from './tileCollection.query.js'
+export * from './video.query.js'

package/dist/cms/link.query.ts

@@ -0,0 +1,12 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { linkFragment } from './fragments.js'
+
+export const getLink: DocumentNode = gql`
+	${linkFragment}
+	query linkQuery($id: String!, $preview: Boolean = false) {
+		link(id: $id, preview: $preview) {
+			...linkFragment
+		}
+	}
+`

package/dist/cms/logoCollection.query.ts

@@ -0,0 +1,18 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { imageFragment } from './fragments.js'
+
+export const getLogoCollection: DocumentNode = gql`
+	${imageFragment}
+	query logoCollectionQuery($id: String!, $preview: Boolean = false) {
+		logoCollectionModule(id: $id, preview: $preview) {
+			headline
+			backgroundColor
+			logosCollection {
+				items {
+					...imageFragment
+				}
+			}
+		}
+	}
+`

package/dist/cms/migrations/README.md

@@ -0,0 +1,42 @@
+# Migrations
+
+## Prerequisites
+
+- Run `pnpm install`
+- Obtain a Contentful CMA token
+- Confirm and double check what space and environment you should be running these in
+- Run `pnpm exec contentful-cli-migrations --environment-id <your-env-name> --space-id <space-id> --management-token <CMA-TOKEN> --initialise` on environment if not already and update `.env`
+
+
+## Helpful Docs
+
+- [Contentful Migration](https://github.com/contentful/contentful-migration)
+- [Contentful Migration Reference Docs](https://github.com/contentful/contentful-migration/blob/main/README.md#reference-documentation)
+- [Contentful Data Model](https://www.contentful.com/developers/docs/concepts/data-model/)
+
+### Instructions
+
+- Create your migration file in the scripts folder with the following format: `0002-description.cjs`
+- Write your migrations
+  - This should be with an up and a down function
+  - The up function updates the model
+  - The down function reversts your changes
+- Run your migration on a test environment with the following command: `pnpm exec contentful-cli-migrations --environment-id <your-env-name> --space-id <space-id> --management-token <CMA-TOKEN>`
+  - Optional Flags:
+    - `--rollback`: Rolls back one migration.
+
+### Gotchas
+
+- Currently the rollback may change the version counter even if the migration doesnt run.
+  - for this just update the counter to the correct counter in contentful and rerun.
+- The migration may run and create a content type even if the whole migration doesnt run correctly.
+  - To fix you will need to delete the content type and re-run
+
+### TODO
+
+- Fix rollback versioning
+  - This flag should cause a rollback to that specific version, in this case 0001 `--version 0001`
+  - It should be used with `--rollback`
+  - It should update dthe versionTracker entry on successful rollback
+- Run migration error handling
+  - runMigration is currently not working as expected and bumping the counter when the migration was aborted

package/dist/cms/migrations/helpers/addEntryNameField.cjs

@@ -0,0 +1,9 @@
+const addEntryNameField = (contentType) => {
+	contentType.createField('entryName', {
+		type: 'Symbol',
+		name: 'Entry Name',
+		required: true,
+	})
+}
+
+module.exports = addEntryNameField

package/dist/cms/migrations/scripts/0001-init.cjs

@@ -0,0 +1,41 @@
+module.exports = {
+	up: async function (migration) {
+		const versionTrackingContentType = migration.createContentType(
+			'migrationVersionTracker',
+			{
+				name: 'Migration Version Tracker',
+				displayField: 'entryName',
+			}
+		)
+
+		versionTrackingContentType
+			.createField('entryName')
+			.name('Entry Name')
+			.type('Symbol')
+			.localized(false)
+			.required(true)
+			.validations([
+				{
+					unique: true,
+				},
+			])
+			.disabled(false)
+			.omitted(false)
+
+		versionTrackingContentType
+			.createField('version')
+			.name('Version')
+			.type('Integer')
+			.required(true)
+			.validations([])
+			.disabled(true)
+			.omitted(false)
+
+		versionTrackingContentType.changeFieldControl(
+			'version',
+			'builtin',
+			'numberEditor',
+			{}
+		)
+	},
+}

package/dist/cms/migrations/scripts/0002-create-image.cjs

@@ -0,0 +1,34 @@
+const addEntryNameField = require('../helpers/addEntryNameField.cjs')
+
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: async function (migration) {
+		const image = migration.createContentType('image', {
+			name: 'Image',
+			displayField: 'entryName',
+			description: 'Manage an image asset',
+		})
+
+		// Add required entryName field
+		addEntryNameField(image)
+
+		// Add required image asset field
+		image
+			.createField('media')
+			.name('Media')
+			.type('Link')
+			.linkType('Asset')
+			.required(true)
+			.validations([
+				{
+					linkMimetypeGroup: ['image'],
+				},
+			])
+
+		image.createField('altTag').name('Alt Tag').type('Symbol').required(false)
+	},
+	down: async function (migration) {
+		await migration.deleteContentType('image')
+	},
+}