@cooperco/cooper-component-library 0.1.60 → 0.1.62

package/dist/cms/0047-create-body-copy.cjs

@@ -0,0 +1,51 @@
+const addEntryNameField = require('../helpers/addEntryNameField.cjs')
+
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: async function (migration) {
+		const bodyCopy = migration.createContentType('bodyCopy', {
+			name: 'Body Copy',
+			displayField: 'entryName',
+			description: 'Manage the body copy module',
+		})
+
+		// Add required assetName field
+		addEntryNameField(bodyCopy)
+
+		// Add bodyCopy field
+		bodyCopy
+			.createField('bodyCopy')
+			.name('Body Copy')
+			.type('RichText')
+			.required(true)
+    .validations([
+      {
+        enabledMarks: ['bold', 'italic', 'underline'],
+        message: 'Only bold, italic, and underline marks are allowed',
+      },
+      {
+        enabledNodeTypes: [
+          'ordered-list',
+          'unordered-list',
+          'hr',
+          'hyperlink',
+          'embedded-entry-inline',
+        ],
+      },
+      {
+        nodes: {
+          'embedded-entry-inline': [
+            {
+              linkContentType: ['highlightedText'],
+              message: 'You can only embedd Higlighted Text.',
+            },
+          ],
+        },
+      },
+    ])
+	},
+	down: async function (migration) {
+		await migration.deleteContentType('bodyCopy')
+	},
+}

package/dist/cms/0048-create-tab-module.cjs

@@ -0,0 +1,51 @@
+const addEntryNameField = require('../helpers/addEntryNameField.cjs')
+
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: async function (migration) {
+		const tabModule = migration.createContentType('tabModule', {
+			name: 'Tab Module',
+			displayField: 'entryName',
+			description: 'Manage the tab module',
+		})
+
+		// Add required assetName field
+		addEntryNameField(tabModule)
+    
+    // Add title field
+    tabModule
+      .createField('title')
+      .name('Title')
+      .type('Symbol')
+      .required(true)
+
+      // Add header title field
+      tabModule
+        .createField('headerTitle')
+        .name('Header Title')
+        .type('Symbol')
+        .required(true) 
+
+     // Body Copy reference
+     tabModule.createField('bodyCopy', {
+      name: 'Body Copy',
+      type: 'Link',
+      linkType: 'Entry',
+      validations: [{ linkContentType: ['bodyCopy'] }],
+    })
+
+    // CTA Reference
+    tabModule.createField('cta', {
+      name: 'CTA',
+      type: 'Link',
+      linkType: 'Entry',
+      validations: [{ linkContentType: ['cta'] }],
+    })
+        
+        
+	},
+	down: async function (migration) {
+		await migration.deleteContentType('tabModule')
+	},
+}

package/dist/cms/0049-create-product-module.cjs

@@ -0,0 +1,68 @@
+const addEntryNameField = require('../helpers/addEntryNameField.cjs')
+
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: async function (migration) {
+		const productModule = migration.createContentType('productModule', {
+			name: 'Product Module',
+			displayField: 'entryName',
+			description: 'Manage the product module',
+		})
+
+		// Add required assetName field
+		addEntryNameField(productModule)
+    
+    // Add header logo reference
+    productModule.createField('headerLogo', {
+      name: 'Header Logo',
+      type: 'Link',
+      linkType: 'Entry',
+      validations: [{ linkContentType: ['image'] }],
+    })
+
+    // Add header title field
+    productModule.createField('headerTitle', {
+      name: 'Header Title',
+      type: 'Symbol',
+      required: true,
+    })
+
+    // Add subtitle field
+    productModule.createField('subtitle', {
+      name: 'Subtitle',
+      type: 'Symbol',
+      required: true,
+    })
+
+    // Add tabs array reference
+    productModule
+			.createField('tabs')
+			.name('Tabs')
+			.required(true)
+			.type('Array')
+			.items({
+				type: 'Link',
+				linkType: 'Entry',
+				validations: [
+					{
+						linkContentType: ['tabModule'],
+					},
+				],
+			})
+
+      // Add logo collection reference
+      productModule.createField('logoCollection', {
+        name: 'Logo Collection',
+        type: 'Link',
+        linkType: 'Entry',
+        validations: [{ linkContentType: ['logoCollectionModule'] }],
+      })
+
+        
+        
+	},
+	down: async function (migration) {
+		await migration.deleteContentType('productModule')
+	},
+}

package/dist/cms/0050-update-container.cjs

@@ -0,0 +1,29 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const containerModule = migration.editContentType('containerModule')
+		containerModule.createField('testimonialTile', {
+			name: 'Testimonial Tile',
+			type: 'Link',
+			linkType: 'Entry',
+			validations: [
+				{
+					linkContentType: ['testimonialModule'],
+				},
+			],
+			
+		})
+		containerModule.changeFieldControl('testimonialTile', 'builtin', 'entryLinkEditor', {
+			helpText:
+				'Select a testimonial tile to display in the container that will overlay the image',
+		})
+	},
+
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const containerModule = migration.editContentType('containerModule')
+		containerModule.deleteField('testimonialTile')
+	},
+}

package/dist/cms/0051-update-accordion.cjs

@@ -0,0 +1,22 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const accordion = migration.editContentType('accordion')
+		// Add headline field
+		accordion
+			.createField('headline')
+			.name('Headline')
+			.type('Symbol')
+			.required(false)
+
+		accordion.moveField('headline').beforeField('accordionItem')
+	},
+
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const accordion = migration.editContentType('accordion')
+		accordion.deleteField('headline')
+	},
+}

package/dist/cms/0052-update-tile-content.cjs

@@ -0,0 +1,41 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const tileCollectionModule = migration.editContentType('tileCollectionModule')
+
+		tileCollectionModule.moveField('variant').beforeField('headline')
+		const tileCollectionModuleVariant = tileCollectionModule.editField("variant");
+		tileCollectionModuleVariant
+			.validations([{ "in": ["Icon", "Image", "Video", "Text", "Image Stacked Animated", "Multiple"] }])
+		tileCollectionModule.changeFieldControl("variant", "builtin", "dropdown", { "helpText": `If "Multiple" selected, the rest of the fields will be ignored` })
+		
+		const tileContent = migration.editContentType('tileContent')
+		const tileContentVariant = tileContent.createField("variant");
+		tileContentVariant
+			.name("Variant")
+			.type("Symbol")
+			.localized(false)
+			.required(false)
+			.validations([{ "in": ["Full Image"] }])
+			.disabled(false)
+			.omitted(false)
+		tileContent.changeFieldControl("variant", "builtin", "dropdown", { "helpText": "If Full Image is selected, all other fields will be ignored" })
+	},
+
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const tileCollectionModule = migration.editContentType('tileCollectionModule')
+		tileCollectionModule.deleteField('variant')
+
+		const tileCollectionModuleVariant = tileCollectionModule.editField("variant");
+		tileCollectionModuleVariant
+			.validations([{ "in": ["Icon", "Image", "Video", "Text", "Image Stacked Animated"] }])
+		tileCollectionModule.changeFieldControl("variant", "builtin", "dropdown", { "helpText": "" })
+		
+
+		const tileContent = migration.editContentType('tileContent')
+		tileContent.deleteField('variant')
+	},
+
+}

package/dist/cms/0053-add-fields-to-tab-module.cjs

@@ -0,0 +1,44 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const tabModule = migration.editContentType('tabModule')
+
+		// Add productId field
+		const productIdField = tabModule.createField("productId");
+		productIdField
+			.name("Product ID")
+			.type("Symbol")
+			.localized(false)
+			.required(false)
+			.disabled(false)
+			.omitted(false)
+
+		tabModule.changeFieldControl("productId", "builtin", "singleLine", { 
+			"helpText": "A product Id to sync tabs across Product Modules. Will probably need to get from a developer." 
+		})
+
+		// Add placeholderContent field
+		const placeholderContentField = tabModule.createField("placeholderContent");
+		placeholderContentField
+			.name("Placeholder Content")
+			.type("Symbol")
+			.localized(false)
+			.required(false)
+			.disabled(false)
+			.omitted(false)
+		tabModule.changeFieldControl("placeholderContent", "builtin", "singleLine", { 
+			"helpText": "If this field is filled it will ignore other fields" 
+		})
+
+		// Position placeholderContent field above title field
+		tabModule.moveField('placeholderContent').beforeField('title')
+	},
+
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const tabModule = migration.editContentType('tabModule')
+		tabModule.deleteField('productId')
+		tabModule.deleteField('placeholderContent')
+	},
+} 

package/dist/cms/0054-update-product-module-logo-collection.cjs

@@ -0,0 +1,70 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const productModule = migration.editContentType('productModule')
+
+		// Create the new field with the desired ID and name
+		productModule.createField('footerContent', {
+			name: 'Footer Content',
+			type: 'Link',
+			linkType: 'Entry',
+			validations: [{ 
+				linkContentType: ['logoCollectionModule', 'containerModule'] 
+			}],
+		})
+
+		// Transform existing entries to migrate data from old field to new field
+		migration.transformEntries({
+			contentType: 'productModule',
+			from: ['logoCollection'],
+			to: ['footerContent'],
+			transformEntryForLocale: async (fromFields, currentLocale) => {
+				if (!fromFields.logoCollection || !fromFields.logoCollection[currentLocale]) {
+					return
+				} else {
+					return {
+						footerContent: fromFields.logoCollection[currentLocale],
+					}
+				}
+			},
+		})
+
+		// Delete the old field after data migration
+		productModule.deleteField('logoCollection')
+	},
+
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const productModule = migration.editContentType('productModule')
+		
+		// Recreate the old field
+		productModule.createField('logoCollection', {
+			name: 'Logo Collection',
+			type: 'Link',
+			linkType: 'Entry',
+			validations: [{ 
+				linkContentType: ['logoCollectionModule'] 
+			}],
+		})
+
+		// Transform entries back from new field to old field
+		migration.transformEntries({
+			contentType: 'productModule',
+			from: ['footerContent'],
+			to: ['logoCollection'],
+			transformEntryForLocale: async (fromFields, currentLocale) => {
+				if (!fromFields.footerContent || !fromFields.footerContent[currentLocale]) {
+					return
+				} else {
+					return {
+						logoCollection: fromFields.footerContent[currentLocale],
+					}
+				}
+			},
+		})
+
+		// Delete the new field
+		productModule.deleteField('footerContent')
+	},
+} 

package/dist/cms/0055-create-cta-action.cjs

@@ -0,0 +1,50 @@
+const addEntryNameField = require('../helpers/addEntryNameField.cjs')
+
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const ctaAction = migration.createContentType('ctaAction', {
+			name: 'CTA Action',
+			description: 'Used to control CTA actions other than navigation.',
+			displayField: 'entryName',
+		})
+
+		addEntryNameField(ctaAction)
+
+		// Title
+		ctaAction.createField('title', {
+			name: 'Title',
+			type: 'Symbol',
+			required: true,
+		})
+
+		// Aria Description
+		ctaAction.createField('ariaDescription', {
+			name: 'Aria Description',
+			type: 'Symbol',
+			required: true,
+		})
+		ctaAction.changeFieldControl('ariaDescription', 'builtin', 'singleLine', {
+			helpText: 'Aria description for CTA Action',
+		})
+
+		// Cta Type
+		ctaAction.createField('triggerMappingValue', {
+			name: 'Trigger Mapping Value',
+			type: 'Symbol',
+			required: true,
+			validations: [
+				{
+					in: ['Sign-in modal'],
+				},
+			],
+		})
+		ctaAction.changeFieldControl('triggerMappingValue', 'builtin', 'dropdown', {
+			helpText: 'A trigger that will determine the action of the CTA',
+		})
+	},
+	down: function (migration) {
+		migration.deleteContentType('ctaAction')
+	},
+}

package/dist/cms/0056-update-cta.cjs

@@ -0,0 +1,25 @@
+module.exports = {
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const cta = migration.editContentType('cta')
+
+		cta.createField('ctaAction', {
+			name: 'CTA Action',
+			type: 'Link',
+			linkType: 'Entry',
+			validations: [
+				{
+					linkContentType: ['ctaAction'],
+				},
+			],
+		})
+		cta.moveField('ctaAction').beforeField('link')
+		cta.changeFieldControl('ctaAction', 'builtin', 'entry-link-list', {
+			helpText: 'If CTA Action is used, the Link will be ignored.',
+		})
+	},
+	down: function (migration) {
+		const cta = migration.editContentType('cta')
+		cta.deleteField('ctaAction')
+	},
+}

package/dist/cms/0057-add-show-cart-to-page.cjs

@@ -0,0 +1,26 @@
+module.exports = {
+	// @ts-check
+	/** @type { import('contentful-migration').MigrationFunction } */
+	up: function (migration) {
+		const page = migration.editContentType('page')
+
+		// Add showCart field
+		const showCartField = page.createField("showCart");
+		showCartField
+			.name("Show Cart")
+			.type("Boolean")
+			.localized(false)
+			.required(false)
+			.disabled(false)
+			.omitted(false)
+		page.changeFieldControl("showCart", "builtin", "boolean", { 
+			"helpText": "Toggle to show/hide the cart functionality on this page" 
+		})
+	},
+
+	/** @type { import('contentful-migration').MigrationFunction } */
+	down: async function (migration) {
+		const page = migration.editContentType('page')
+		page.deleteField('showCart')
+	},
+} 

package/dist/cms/README.md

@@ -0,0 +1,112 @@
+# GraphQL Queries
+
+This directory contains GraphQL queries for fetching content from Contentful CMS.
+
+## Directory Structure
+
+```
+cms/contentful/queries/
+├── index.ts                    # Barrel export file (manual updates required)
+├── fragments.ts                # Shared GraphQL fragments
+├── *.query.ts                  # Individual component queries
+└── README.md                   # This file
+```
+
+## How Queries Are Exported
+
+The query export system in this project is **semi-automatic**:
+
+### The Process
+
+1. **Individual Query Files** - Queries are defined in individual files with the pattern `*.query.ts`
+   - Example: `accordion.query.ts`, `carousel.query.ts`
+
+2. **Manual Barrel Export** - Queries are re-exported through `index.ts`
+   - Uses wildcard exports: `export * from './accordion.query.js'`
+   - **Note:** Exports use `.js` extensions even though source files are `.ts` (ESM compatibility)
+
+3. **Package-Level Export** - The barrel export is exposed via `package.json`:
+   ```json
+   "./cms/contentful/graphql": {
+     "import": "./dist/cms/contentful/queries/index.js",
+     "types": "./dist/cms/contentful/queries/index.d.ts"
+   }
+   ```
+
+## Creating a New Query
+
+### Steps Required
+
+1. **Create Query File** - Add your query file: `yourComponent.query.ts`
+
+2. **Define Query** - Follow the established pattern:
+   ```typescript
+   import { gql } from 'graphql-tag'
+   import type { DocumentNode } from 'graphql'
+   import { someFragment } from './fragments.js' // If needed
+
+   export const getYourComponent: DocumentNode = gql`
+     ${someFragment}  // Include fragments if needed
+     query yourComponentQuery($id: String!, $preview: Boolean = false) {
+       yourComponent(id: $id, preview: $preview) {
+         __typename
+         # Add your fields here
+       }
+     }
+   `
+   ```
+
+3. **Update Barrel Export** - **MANUALLY ADD** export to `index.ts`:
+   ```typescript
+   export * from './yourComponent.query.js'
+   ```
+   - Maintain alphabetical order for consistency
+   - Use `.js` extension (not `.ts`)
+
+### Query Naming Conventions
+
+- **File Name:** `componentName.query.ts` (camelCase)
+- **Export Name:** `getComponentName` (camelCase with `get` prefix)
+- **Query Name:** `componentNameQuery` (camelCase with `Query` suffix)
+
+### Example
+
+```typescript
+// accordion.query.ts
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { accordionItemFragment } from './fragments.js'
+
+export const getAccordion: DocumentNode = gql`
+  ${accordionItemFragment}
+  query accordionQuery($id: String!, $preview: Boolean = false) {
+    accordion(id: $id, preview: $preview) {
+      __typename
+      headline
+      accordionType
+      loadMoreButtonTitle
+      startOpen
+      accordionItemCollection {
+        items {
+          ...accordionItemFragment
+        }
+      }
+    }
+  }
+`
+```
+
+## Using Queries in Consumer Projects
+
+Queries are consumed via the package export:
+
+```typescript
+import { getAccordion, getCarousel } from '@cooperco/cooper-component-library/cms/contentful/graphql'
+```
+
+## Important Notes
+
+- **Manual Export Required:** The system is NOT fully automatic - you MUST manually update `index.ts` when adding new queries
+- **ESM Extensions:** Always use `.js` extensions in exports (even for `.ts` source files)
+- **Preview Mode:** All queries support a `preview` parameter for Contentful preview API
+- **Fragments:** Shared fragments are defined in `fragments.ts` and can be reused across queries

package/dist/cms/accordion.query.ts

@@ -0,0 +1,21 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+import { accordionItemFragment } from './fragments.js'
+
+export const getAccordion: DocumentNode = gql`
+	${accordionItemFragment}
+	query accordionQuery($id: String!, $preview: Boolean = false) {
+		accordion(id: $id, preview: $preview) {
+			__typename
+			headline
+			accordionType
+			loadMoreButtonTitle
+			startOpen
+			accordionItemCollection {
+				items {
+					...accordionItemFragment
+				}
+			}
+		}
+	}
+`

package/dist/cms/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/carousel.query.ts

@@ -0,0 +1,34 @@
+import { gql } from 'graphql-tag'
+import type { DocumentNode } from 'graphql'
+
+export const getCarousel: DocumentNode = gql`
+	query carouselQuery($id: String!, $preview: Boolean = false) {
+		carouselModule(id: $id, preview: $preview) {
+			headline
+			backgroundColor
+			variant
+			carouselItemsCollection {
+				items {
+					... on TestimonialModule {
+						sys {
+							id
+						}
+						__typename
+					}
+					... on TileContent {
+						sys {
+							id
+						}
+						__typename
+					}
+					... on ContainerModule {
+						sys {
+							id
+						}
+						__typename
+					}
+				}
+			}
+		}
+	}
+`