3.1.0

.husky/commit-msg

@@ -0,0 +1,8 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx --no-install commitlint --edit "$1"
+npm run build
+npx tsx mustache.ts
+git add README.md
+npx lint-staged

README.md

@@ -16,7 +16,7 @@ Alternatively, if you want to include the package directly in your website HTML
 
 ```html
 <script type='module'  integrity='sha384-9M4o9H23Ax5ZTzsMRLgdlFBYk2hy+ub6XDiZhHWJjfebQ+MZ9iZw+GNep9ac0uFV' crossorigin="anonymous">
-     import ContentstackLivePreview from 'https://esm.sh/@contentstack/live-preview-utils@3.0.1';
+     import ContentstackLivePreview from 'https://esm.sh/@contentstack/live-preview-utils@3.1.0';
 
      ContentstackLivePreview.init({
         stackDetails: {

changelog-template.hbs

@@ -0,0 +1,197 @@
+# Changelog
+
+{{!--
+Introduction
+• This template tries to follow conventional commits format https://www.conventionalcommits.org/en/v1.0.0/
+• The template uses regex to filter commit types into their own headings (this is more than just fixes and features headings)
+• It also uses the replaceText function in package.json to remove the commit type text from the message, because the headers are shown instead.
+• The text 'Breaking:' or 'Breaking changes:' can be located anywhere in the commit.
+• The types feat:, fix:, chore:, docs:, refactor:, test:, style:, perf: must be at the beginning of the commit subject with an : on end.
+   • They can optionally have a scope set to outline the module or component that is affected eg feat(bldAssess):
+• There is a short hash on the end of every commit that is currently commented out so that change log did not grow too long (due to some system's file size limitations).  You can uncomment if you wish [`{{shorthash}}`]({{href}})
+
+Example Definitions
+• feat: A new feature
+• fix: A bug fix
+• perf: A code change that improves performance
+• refactor: A code change that neither fixes a bug nor adds a feature
+• style: Changes that do not affect the meaning of the code (white-space, formatting, spelling mistakes, missing semi-colons, etc)
+• test: Adding missing tests or correcting existing tests
+• docs: Adding/updating documentation
+• chore: Something like updating a library version, or moving files to be in a better location and updating all file refs
+--}}
+
+
+{{!-- In package.json need to add this to remove label text from the change log output (because the markdown headers are now used to group them).
+   NOTES • Individual brackets have been escaped twice to be Json compliant.
+         • For items that define a scope eg feat(bldAssess): We remove the 1st bracket and then re-add it so we can select the right piece of text
+{
+  "name": "my-awesome-package",
+  "auto-changelog": {
+    "replaceText": {
+      "([bB]reaking:)": "",
+      "([bB]reaking change:)": "",
+      "(^[bB]uild:)": "",
+      "(^[bB]uild\\()": "\\(",
+      "(^[dD]eprecate:)": "",
+      "(^[dD]eprecate\\()": "\\(",
+      "(^[fF]eat:)": "",
+      "(^[fF]eat\\()": "\\(",
+      "(^[fF]ix:)": "",
+      "(^[fF]ix\\()": "\\(",
+      "(^[cC]hore:)": "",
+      "(^[cC]hore\\()": "\\(",
+      "(^[dD]ocs:)": "",
+      "(^[dD]ocs\\()": "\\(",
+      "(^[rR]efactor:)": "",
+      "(^[rR]efactor\\()": "\\(",
+      "(^[tT]est:)": "",
+      "(^[tT]est\\()": "\\(",
+      "(^[sS]tyle:)": "",
+      "(^[sS]tyle\\()": "\\(",
+      "(^[pP]erf:)": "",
+      "(^[pP]erf\\()": "\\("
+    }
+  }
+}
+ --}}
+
+ {{!--
+ Regex reminders
+ ^ = starts with
+ \( = ( character (otherwise it is interpreted as a regex lookup group)
+ * = zero or more of the previous character
+ \s = whitespace
+ . = any character except newline
+ | = or
+ [aA] = character a or character A
+ --}}
+
+
+{{#each releases}}
+  {{#if href}}
+    ## [{{title}}]({{href}})
+  {{else}}
+    ## {{title}}
+  {{/if}}
+
+  > {{niceDate}}
+
+  {{#if summary}}
+    {{summary}}
+  {{/if}}
+
+  {{! List commits that fix a given issues}}
+  {{#each fixes}}
+    - {{#if commit.breaking}}**Breaking change:** {{/if}}{{commit.subject}}{{#each fixes}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}}){{/each}}
+  {{/each}}
+
+  {{! List merge commits with 'breaking:' or 'Breaking change:' anywhere in the message under a heading}}
+  {{#commit-list merges heading='### Breaking Changes :warning:' message='[bB]reaking [cC]hange:|[bB]reaking:' exclude='\[skip-changelog\]'}}
+    - {{message}} @{{author}}  <!--[`#{{id}}`]({{href}}) -->
+  {{/commit-list}}
+
+  {{! List commits organised under a heading, but not those already listed in the breaking section }}
+      {{#commit-list merges heading='### Build' message='^[bB]uild:|^[bB]uild\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Deprecated Features' message='^[dD]eprecate:|^[dD]eprecate\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### New Features' message='^[fF]eat:|^[fF]eat\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Fixes' message='^[fF]ix:|^[fF]ix\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Chores And Housekeeping' message='^[cC]hore:|^[cC]hore\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Documentation Changes' message='^[dD]ocs:|^[dD]ocs\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Refactoring and Updates' message='^[rR]efactor:|^[rR]efactor\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Changes to Test Assests' message='^[tT]est:|^[tT]est\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Tidying of Code eg Whitespace' message='^[sS]tyle:|^[sS]tyle\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### Performance Improvements' message='^[pP]erf:|^[pP]erf\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### CI Improvements' message='^[cC][iI]:|^[cC][iI]\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list merges heading='### General Changes' exclude='[bB]reaking [cC]hange:|[bB]reaking:|^[bB]uild:|^[bB]uild ?\(|^[dD]eprecate:|^[dD]eprecate ?\(|^[fF]eat:|^[fF]eat ?\(|^[fF]ix:|^[fF]ix ?\(|^[cC]hore:|^[cC]hore ?\(|^[cC][iI]:|^[cC][iI] ?\(|^[dD]ocs:|^[dD]ocs ?\(|^[rR]efactor:|^[rR]efactor ?\(|^[tT]est:|^[tT]est ?\(|^[sS]tyle:|^[sS]tyle ?\(|^[pP]erf:|^[pP]erf ?\(|\[skip-changelog\]'}}
+        - {{message}} ({{author}}{{#if href}} - [#{{id}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+  {{! List commits with 'breaking:' or 'Breaking change:' anywhere in the message under a heading}}
+  {{#commit-list commits heading='### Breaking Changes :warning:' message='[bB]reaking [cC]hange:|[bB]reaking:' exclude='\[skip-changelog\]'}}
+    - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+  {{/commit-list}}
+
+  {{! List commits organised under a heading, but not those already listed in the breaking section }}
+      {{#commit-list commits heading='### Build' message='^[bB]uild:|^[bB]uild\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Deprecated Features' message='^[dD]eprecate:|^[dD]eprecate\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### New Features' message='^[fF]eat:|^[fF]eat\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Fixes' message='^[fF]ix:|^[fF]ix\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Chores And Housekeeping' message='^[cC]hore:|^[cC]hore\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Documentation Changes' message='^[dD]ocs:|^[dD]ocs\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Refactoring and Updates' message='^[rR]efactor:|^[rR]efactor\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Changes to Test Assests' message='^[tT]est:|^[tT]est\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Tidying of Code eg Whitespace' message='^[sS]tyle:|^[sS]tyle\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### Performance Improvements' message='^[pP]erf:|^[pP]erf\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### CI Improvements' message='^[cC][iI]:|^[cC][iI]\(' exclude='[bB]reaking [cC]hange:|[bB]reaking:|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+      {{#commit-list commits heading='### General Changes' exclude='[bB]reaking [cC]hange:|[bB]reaking:|^[bB]uild:|^[bB]uild ?\(|^[dD]eprecate:|^[dD]eprecate ?\(|^[fF]eat:|^[fF]eat ?\(|^[fF]ix:|^[fF]ix ?\(|^[cC]hore:|^[cC]hore ?\(|^[cC][iI]:|^[cC][iI] ?\(|^[dD]ocs:|^[dD]ocs ?\(|^[rR]efactor:|^[rR]efactor ?\(|^[tT]est:|^[tT]est ?\(|^[sS]tyle:|^[sS]tyle ?\(|^[pP]erf:|^[pP]erf ?\(|\[skip-changelog\]'}}
+        - {{subject}} ({{author}}{{#if href}} - [{{shorthash}}]({{href}}){{/if}})
+      {{/commit-list}}
+
+{{/each}}

commitlint.config.js

@@ -0,0 +1,5 @@
+import configConventional from '@commitlint/config-conventional';
+
+export default {
+    extends: [configConventional],
+};

docs/live-preview-configs.md

@@ -6,6 +6,7 @@ The init data has following structure
     -   [`init(config: IConfig)`](#initconfig-iconfig)
         -   [`enable`](#enable)
         -   [`ssr`](#ssr)
+        -   [`mode`](#mode)
         -   [`editButton`](#editbutton)
         -   [`cleanCslpOnProduction`](#cleancslponproduction)
         -   [`stackDetails`](#stackdetails)
@@ -50,6 +51,18 @@ When you set the property to `false`, then app is rendered from the client side
 
 > **Note:** For CSR mode, [stackSDK](#stacksdk) is required. Hence, we automatically switch mode to CSR when you pass this object. This config is provided to override the default behavior.
 
+### `mode`
+
+| type    |  default  | optional |
+| ------- | --------- | -------- |
+| string  | `preview` | Yes      |
+
+The `mode` property specifies whether the site is editable in the Live Preview or Visual Builder environment.
+
+If set to `preview`, clicking the hovered edit button navigates to the Contentstack Live Preview panel.
+
+If set to `builder`, clicking the Start Editing button navigates to the Contentstack Visual Builder. Note that the site will still function in the Live Preview panel even when set to 'builder'.
+
 ### `editButton`
 The editButton object allows you to manage the "Edit" button both within and outside the Live Preview portal. It offers the following features:
 - Enable/disable the "Edit" button
@@ -274,55 +287,29 @@ The `hash` property returns the live preview hash of the entry. It returns an em
 console.log(ContentstackLivePreview.hash); // "hash"
 ```
 
-## setConfigFromParams(config: ConstructorParameters<typeof URLSearchParams>[0])
-
-The `setConfigFromParams` method allows you to set the configuration from the URL parameters. It accepts the URLSearchParams object as a parameter. This method is used in the SSR mode to set the live preview hash received from the URL.
-
-**For example:**
-
-```js
-console.log(ContentstackLivePreview.hash); // ""
-ContentstackLivePreview.setConfigFromParams(window.location.search); // https://example.com?live_preview=hash
-console.log(ContentstackLivePreview.hash); // "hash"
-```
-
-## `getGatsbyDataFormat(sdkQuery: IStackSdk, prefix: string)`
-
-Gatsby primarily fetches data using the [`gatsby-source-contentstack` plugin](https://www.gatsbyjs.com/plugins/gatsby-source-contentstack/). But, Live Preview currently works only on the [contentstack SDK](https://www.npmjs.com/package/contentstack).
+## config
 
-Hence, for Gatsby, we fetch the data from the contentstack SDK and store it in React state. Post that, we re-render the page using the `onEntryChange()` method. As the data format is different for the gatsby-source-contentstack plugin, it returns a prefix and the entry name in Camel case. Hence, we use `getGatsbyDataFormat()` to change the entry's name.
-​
-The `getGatsbyDataFormat()` method accepts the Contentstack `Stack` object as the first parameter and the prefix as the second. The prefix is set inside the `gatsby-config.js` file. The default value set for the prefix is `contentstack`.
+The `config` property returns the following properties and their values:
 
-**For example:**
+1. [`ssr`](#ssr)
+2. [`enable`](#enable)
+3. [`cleanCslpOnProduction`](#cleancslponproduction)
+4. `stackDetails`
+The stackDetails object provides information relevant to the live preview context, including:
 
-```js
-const query = Stack.ContentType("your-contentype").Entry("entry-uid");
-
-const formattedData = ContentstackLivePreview.getGatsbyDataFormat(
-    query,
-    "contentstack"
-);
-
-setData(formattedData);
-```
-
-**Difference in data:**
-
-```js
-// not passed to function
-{
-  "footer_lib": {
-    "title": "footer",
-    ...
-  }
-}
-
-// passed to function with prefix as 'contentstack'
-{
-  "contentstackFooterLib": {
-    "title": "footer",
-    ...
-  }
+```ts
+stackDetails {
+    apiKey: string;          // API key of the stack
+    environment: string;     // Environment in which the preview is running
+    contentTypeUid: string;  // UID of the content type
+    entryUid: string;        // UID of the specific entry
 }
 ```
+5. [`clientUrlParams`](#clienturlparams)
+6. `windowType`: The windowType property determines the context of the parent window. It can have one of the following values:
+    - `preview`: The site is loaded as an iframe within a Live Preview or Timeline preview environment.
+    - `builder`: The site is loaded as an iframe within the Visual Builder environment.
+    - `independent`: The site is loaded directly outside the Contentstack platform.
+7. [`hash`](#hash)
+8. [`editButton`](#editbutton)
+9. [`mode`](#mode)