@ptcwebops/ptcw-design 6.3.65-beta → 6.3.68-beta

package/dist/types/components.d.ts

@@ -43,7 +43,12 @@ export namespace Components {
     interface EmbeddedForm {
     }
     interface EventJumbotronExample {
-        "cards": { title: string; description: string; panelContent: string; cardBg: string }[];
+        "cards": {
+		title: string;
+		description: string;
+		panelContent: string;
+		cardBg: string;
+	}[];
         "modalBtnCloseText": string;
     }
     interface EventPodcastSliderExample {
@@ -94,7 +99,14 @@ export namespace Components {
         /**
           * Icon Color
          */
-        "color": 'black' | 'white' | 'ptc-green' | 'gray' | 'light-gray' | 'primary-gray' | 'default' | 'inherit';
+        "color": | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "light-gray"
+		| "primary-gray"
+		| "default"
+		| "inherit";
         "focusOn"?: boolean;
         /**
           * (optional) Injected CSS Styles
@@ -111,20 +123,30 @@ export namespace Components {
         /**
           * Icon Pulse Animation (not valid for ptc type)
          */
-        "pulse": 'fa-pulse' | '';
+        "pulse": "fa-pulse" | "";
         /**
           * Icon Size
          */
-        "size": 'micro' | 'xxx-small' |'xx-small' |'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large';
+        "size": | "micro"
+		| "xxx-small"
+		| "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large";
         /**
           * Icon Spin Animation (not valid for ptc type)
          */
-        "spin": 'fa-spin' | '';
+        "spin": "fa-spin" | "";
         "trackerId"?: string;
         /**
           * Icon Type
          */
-        "type": 'solid' | 'brands' | 'ptc' | 'regular';
+        "type": "solid" | "brands" | "ptc" | "regular";
     }
     interface InnovatorToggleContainer {
         /**
@@ -150,12 +172,16 @@ export namespace Components {
         /**
           * Theme color
          */
-        "color"?: 'white' | 'primary-gray' | 'light-gray';
+        "color"?: "white" | "primary-gray" | "light-gray";
         "flushBefore": boolean;
         "hasBeforeHomeIcon": boolean;
         "linkHref"?: string;
         "linkTarget": string | undefined;
-        "listType": 'list-primary' | 'list-footer' | 'breadcrumb' | 'list-green' | 'list-underline';
+        "listType": | "list-primary"
+		| "list-footer"
+		| "breadcrumb"
+		| "list-green"
+		| "list-underline";
         /**
           * (optional) Injected CSS styles
          */
@@ -164,7 +190,7 @@ export namespace Components {
     }
     interface MaxWidthContainer {
         "breakpoint": number;
-        "contentAlign": 'left' | 'center' | 'right';
+        "contentAlign": "left" | "center" | "right";
         "maxWidth": number;
         "maxWidthP"?: number;
         /**
@@ -295,7 +321,11 @@ export namespace Components {
         /**
           * Pause Button Location
          */
-        "buttonLocation"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'allbp-bottom-right';
+        "buttonLocation"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right"
+		| "allbp-bottom-right";
         /**
           * Play/Pause Index
          */
@@ -315,7 +345,7 @@ export namespace Components {
         /**
           * Overlay Type standard is gray gradient. dark is dark gradient
          */
-        "overlayType": 'standard' | 'dark';
+        "overlayType": "standard" | "dark";
         /**
           * Pause Button Title
          */
@@ -337,7 +367,7 @@ export namespace Components {
         /**
           * Video implementation type:  default: Content need to add in tag      Ex: <ptc-background-video>Content  </ptc-background-video>  legacy: Add the blank tag in any other setcon having relative parent.      Ex: <div class="section" style="position: relative;">             <ptc-background-video></ptc-background-video>             Content          </div>
          */
-        "type": 'default' | 'legacy';
+        "type": "default" | "legacy";
         /**
           * Video url
          */
@@ -346,7 +376,7 @@ export namespace Components {
     interface PtcBadge {
         "number": number;
         "svgCode": string;
-        "type": 'svg' | 'number';
+        "type": "svg" | "number";
     }
     interface PtcBioCard {
         /**
@@ -375,7 +405,14 @@ export namespace Components {
         /**
           * Theme Color
          */
-        "color": 'black' | 'white' | 'ptc-green' | 'gray' | 'light-gray' | 'primary-gray' | 'default' | 'inherit';
+        "color": | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "light-gray"
+		| "primary-gray"
+		| "default"
+		| "inherit";
         /**
           * Dark Mode for Tab Index
          */
@@ -383,7 +420,7 @@ export namespace Components {
         /**
           * breadcrumb position
          */
-        "position"?: 'left' | 'center' | 'right';
+        "position"?: "left" | "center" | "right";
         /**
           * remove topMargin
          */
@@ -406,8 +443,21 @@ export namespace Components {
         /**
           * Button theme color
          */
-        "color": 'offwhite' | 'blackgrey' | 'turtlegreen' | 'nav' | 'legacy-green' | 'ptc-primary' | 'ptc-secondary' | 'ptc-tertiary' | 'ptc-quaternary' | 'icon-toggle' | 'clear-search' | 'primary-cta' | 'secondary-cta-dark' | 'secondary-cta-light';
-        "ctaWidth": 'full-width' | 'default';
+        "color": | "offwhite"
+		| "blackgrey"
+		| "turtlegreen"
+		| "nav"
+		| "legacy-green"
+		| "ptc-primary"
+		| "ptc-secondary"
+		| "ptc-tertiary"
+		| "ptc-quaternary"
+		| "icon-toggle"
+		| "clear-search"
+		| "primary-cta"
+		| "secondary-cta-dark"
+		| "secondary-cta-light";
+        "ctaWidth": "full-width" | "default";
         /**
           * Add dark-focus-state property where button is present on dark backgrounds
          */
@@ -423,11 +473,14 @@ export namespace Components {
         /**
           * Icon Animation
          */
-        "iconAnimation": 'animation-right' | 'animation-down' | 'reveal-down' | '';
+        "iconAnimation": | "animation-right"
+		| "animation-down"
+		| "reveal-down"
+		| "";
         /**
           * Icon Position
          */
-        "iconPosition": 'icon-left' | 'icon-right' | 'none';
+        "iconPosition": "icon-left" | "icon-right" | "none";
         /**
           * Link URL
          */
@@ -451,7 +504,7 @@ export namespace Components {
         /**
           * Button theme color
          */
-        "size": 'small' | 'medium' | 'large';
+        "size": "small" | "medium" | "large";
         /**
           * (optional) Injected CSS Styles
          */
@@ -467,12 +520,12 @@ export namespace Components {
         /**
           * Text Align
          */
-        "textAlign"?: 'left' | 'right' | 'center';
+        "textAlign"?: "left" | "right" | "center";
         "trackerId"?: string;
         /**
           * Button type
          */
-        "type": 'button' | 'reset' | 'submit' | 'link';
+        "type": "button" | "reset" | "submit" | "link";
     }
     interface PtcCard {
         /**
@@ -490,24 +543,28 @@ export namespace Components {
         /**
           * Card overflow
          */
-        "cardOverflow"?: 'auto' | 'hidden' | 'visible' | 'inherit' | 'initial';
+        "cardOverflow"?: | "auto"
+		| "hidden"
+		| "visible"
+		| "inherit"
+		| "initial";
         "cardTitle": string;
         /**
           * Card Type Specify Card Type, default to simple card
          */
-        "cardType": | 'simple-card'
-    | 'lottie-card'
-    | 'custom-card'
-    | 'clip-edge-card'
-    | 'hightlight-card'
-    | 'listing-card'
-    | 'horizontal-card'
-    | 'listing-card-horizontal'
-    | 'resource-center-card'
-    | 'case-studies-card'
-    | 'featured-horizontal-card'
-    | 'related-card'
-    | 'events-card';
+        "cardType": | "simple-card"
+		| "lottie-card"
+		| "custom-card"
+		| "clip-edge-card"
+		| "hightlight-card"
+		| "listing-card"
+		| "horizontal-card"
+		| "listing-card-horizontal"
+		| "resource-center-card"
+		| "case-studies-card"
+		| "featured-horizontal-card"
+		| "related-card"
+		| "events-card";
         /**
           * Card Date
          */
@@ -536,7 +593,10 @@ export namespace Components {
         /**
           * Card heading text transform
          */
-        "headingTransform": 'uppercase' | 'lowercase' | 'capitalize' | 'none';
+        "headingTransform": | "uppercase"
+		| "lowercase"
+		| "capitalize"
+		| "none";
         "isCreoCard"?: boolean;
         "isTabHidden": boolean;
         "language": string;
@@ -572,7 +632,15 @@ export namespace Components {
     }
     interface PtcCardBottom {
         "addClassOnDefaultSlot": () => Promise<void>;
-        "cardType": 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist' | 'extra-tall' | 'color-outlined'| 'most-popular'| 'event-podcast';
+        "cardType": | "card-video"
+		| "card-tall"
+		| "card-2up"
+		| "card-wide"
+		| "card-playlist"
+		| "extra-tall"
+		| "color-outlined"
+		| "most-popular"
+		| "event-podcast";
         "removeClassOnDefaultSlot": () => Promise<void>;
         /**
           * (optional) Injected CSS styles
@@ -580,21 +648,25 @@ export namespace Components {
         "styles"?: string;
     }
     interface PtcCardContent {
-        "cardType"?: | 'card-video'
-    | 'card-tall'
-    | 'card-2up'
-    | 'card-wide'
-    | 'speed-bump'
-    | 'card-playlist'
-    | 'card-video-intro'
-    | 'card-dynamic'
-    | 'extra-tall'
-    | 'color-outlined'
-    | 'thumbnail-video-preview'
-    | 'event-jumbotron-sub-card'
-    | 'event-podcast';
+        "cardType"?: | "card-video"
+		| "card-tall"
+		| "card-2up"
+		| "card-wide"
+		| "speed-bump"
+		| "card-playlist"
+		| "card-video-intro"
+		| "card-dynamic"
+		| "extra-tall"
+		| "color-outlined"
+		| "thumbnail-video-preview"
+		| "event-jumbotron-sub-card"
+		| "event-podcast";
         "isLoading"?: boolean;
-        "outlineColor"?: 'o-red' | 'o-orange' | 'o-blue' | 'o-slate-grey' | 'o-green';
+        "outlineColor"?: | "o-red"
+		| "o-orange"
+		| "o-blue"
+		| "o-slate-grey"
+		| "o-green";
         "removeInlineHeight": () => Promise<void>;
         "setHeight": (height: number) => Promise<void>;
         /**
@@ -610,19 +682,19 @@ export namespace Components {
         /**
           * Card Type
          */
-        "cardType": | 'card-video'
-    | 'card-tall'
-    | 'card-wide'
-    | 'speed-bump'
-    | 'card-playlist'
-    | 'card-video-intro'
-    | 'card-2up'
-    | 'extra-tall'
-    | 'color-outlined'
-    | 'result-box'
-    | 'most-popular'
-    | 'simple-card'
-    | 'event-podcast';
+        "cardType": | "card-video"
+		| "card-tall"
+		| "card-wide"
+		| "speed-bump"
+		| "card-playlist"
+		| "card-video-intro"
+		| "card-2up"
+		| "extra-tall"
+		| "color-outlined"
+		| "result-box"
+		| "most-popular"
+		| "simple-card"
+		| "event-podcast";
         /**
           * darkFocusState for dark background
          */
@@ -659,7 +731,7 @@ export namespace Components {
     interface PtcCaseStudiesSlider {
     }
     interface PtcCheckbox {
-        "checked": 'checked' | 'unchecked';
+        "checked": "checked" | "unchecked";
         "disabled": boolean;
         "inputName": string;
         "offsetFocusOutline": boolean;
@@ -668,7 +740,7 @@ export namespace Components {
     }
     interface PtcCheckboxGroup {
         "groupName": string;
-        "type": 'single' | 'card';
+        "type": "single" | "card";
     }
     interface PtcCloseIcon {
     }
@@ -687,10 +759,17 @@ export namespace Components {
         /**
           * Theme
          */
-        "backgroundColor": 'white' | 'gray';
-        "containerType": 'large' | 'none' | '';
-        "elevation": 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
-        "spacing": 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large';
+        "backgroundColor": "white" | "gray";
+        "containerType": "large" | "none" | "";
+        "elevation": "x-small" | "small" | "medium" | "large" | "x-large";
+        "spacing": | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large";
         "styles"?: string;
     }
     interface PtcCountdown {
@@ -731,11 +810,11 @@ export namespace Components {
         /**
           * Date Font Size
          */
-        "dataSize": 'medium' | 'small';
+        "dataSize": "medium" | "small";
         /**
           * Date Color
          */
-        "dateColor": 'white' | 'primary-grey';
+        "dateColor": "white" | "primary-grey";
         /**
           * Date examples: 2000-1-1 or 2000/01/01
          */
@@ -767,7 +846,7 @@ export namespace Components {
         /**
           * Theme
          */
-        "theme": 'sort' | 'support';
+        "theme": "sort" | "support";
         "trackerId": string;
     }
     interface PtcDynamicCard {
@@ -782,7 +861,7 @@ export namespace Components {
         /**
           * Card varients
          */
-        "cardScreen": 'mobile' | 'desktop';
+        "cardScreen": "mobile" | "desktop";
         /**
           * Card Title
          */
@@ -790,7 +869,7 @@ export namespace Components {
         /**
           * Dynamic Card Type
          */
-        "cardType": 'sequential';
+        "cardType": "sequential";
         /**
           * Focus the card-wrapper element
          */
@@ -828,7 +907,7 @@ export namespace Components {
          */
         "cardIndex": number;
         "disablePriceLabel": boolean;
-        "theme": 'standard' | 'alternate';
+        "theme": "standard" | "alternate";
     }
     interface PtcFeaturedList {
     }
@@ -848,7 +927,7 @@ export namespace Components {
           * (optional) Injected CSS Styles
          */
         "styles"?: string;
-        "theme": 'bubble' | 'link' | 'link-lg' | 'button' | 'standard';
+        "theme": "bubble" | "link" | "link-lg" | "button" | "standard";
         "trackerID": string;
     }
     interface PtcFooter {
@@ -885,11 +964,11 @@ export namespace Components {
         /**
           * Content Alignment
          */
-        "contentAlignment"?: 'left' | 'right' | 'center';
+        "contentAlignment"?: "left" | "right" | "center";
         /**
           * Hero Type
          */
-        "heroType": 'jumbotron' | 'footer-cta' | 'simple';
+        "heroType": "jumbotron" | "footer-cta" | "simple";
     }
     interface PtcHeroFooterCta {
         "backgroundImage": string;
@@ -902,7 +981,10 @@ export namespace Components {
         /**
           * Pause Button Location
          */
-        "buttonLocation"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+        "buttonLocation"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right";
         /**
           * delay loading of video to improve perfomance
          */
@@ -954,7 +1036,10 @@ export namespace Components {
         /**
           * List item type
          */
-        "listType": 'simple-icon-list' | 'stat-icon-list' | 'icon-top-align-list' | 'feature-callout-list';
+        "listType": | "simple-icon-list"
+		| "stat-icon-list"
+		| "icon-top-align-list"
+		| "feature-callout-list";
         "noBottomSpace"?: boolean;
         "styles"?: string;
         /**
@@ -989,7 +1074,11 @@ export namespace Components {
         /**
           * Image border shape
          */
-        "borderRadius": 'radius-standard' | 'radius-large' | 'radius-large-top' | 'radius-standard-top' | '';
+        "borderRadius": | "radius-standard"
+		| "radius-large"
+		| "radius-large-top"
+		| "radius-standard-top"
+		| "";
         /**
           * (optional) setTimeout delay fro Lazy loading
          */
@@ -1001,7 +1090,7 @@ export namespace Components {
         /**
           * Image type
          */
-        "imageType": 'smart-bg' | 'smart-img';
+        "imageType": "smart-bg" | "smart-img";
         /**
           * Image Src
          */
@@ -1009,7 +1098,7 @@ export namespace Components {
         /**
           * Lazy loading option
          */
-        "loadMode": 'lazy-bg' | 'eager-bg';
+        "loadMode": "lazy-bg" | "eager-bg";
         /**
           * Image solution for large screen >=1200px
          */
@@ -1040,7 +1129,7 @@ export namespace Components {
         "styles"?: string;
         "target": string;
         "trackerId"?: string;
-        "variant": 'image' | 'text';
+        "variant": "image" | "text";
     }
     interface PtcInlineCta {
         "containerIsShadow": boolean;
@@ -1050,7 +1139,7 @@ export namespace Components {
         /**
           * PROPS
          */
-        "type": 'small' | 'big' | 'bottom';
+        "type": "small" | "big" | "bottom";
     }
     interface PtcJumbotron {
         "bgSrc"?: string;
@@ -1107,11 +1196,17 @@ export namespace Components {
         /**
           * Font Size
          */
-        "fontSize": 'small' | 'medium' | 'large' | 'medium-large';
+        "fontSize": "small" | "medium" | "large" | "medium-large";
         /**
           * Font Weight
          */
-        "fontWeight"?: 'w-thin' | 'w-regular' | 'w-medium' | 'w-semibold' | 'w-bold' | 'w-extrabold' | 'w-black';
+        "fontWeight"?: | "w-thin"
+		| "w-regular"
+		| "w-medium"
+		| "w-semibold"
+		| "w-bold"
+		| "w-extrabold"
+		| "w-black";
         /**
           * href
          */
@@ -1119,7 +1214,7 @@ export namespace Components {
         /**
           * Optional Link Area
          */
-        "linkArea"?: 'link-area-cover-parent';
+        "linkArea"?: "link-area-cover-parent";
         /**
           * Title
          */
@@ -1143,21 +1238,21 @@ export namespace Components {
         /**
           * Theme
          */
-        "theme": | 'simple'
-    | 'underline'
-    | 'nav-title'
-    | 'primary-nav-link'
-    | 'nav-title-link'
-    | 'nav-card-link'
-    | 'secondary-nav-link'
-    | 'footer-nav-link'
-    | 'copyright-link'
-    | 'product-link'
-    | 'd-green-underline'
-    | 'd-white-underline'
-    | 'global'
-    | 'utility-nav-link'
-    | 'standard-link';
+        "theme": | "simple"
+		| "underline"
+		| "nav-title"
+		| "primary-nav-link"
+		| "nav-title-link"
+		| "nav-card-link"
+		| "secondary-nav-link"
+		| "footer-nav-link"
+		| "copyright-link"
+		| "product-link"
+		| "d-green-underline"
+		| "d-white-underline"
+		| "global"
+		| "utility-nav-link"
+		| "standard-link";
         /**
           * trackerId added for Mouseflow id
          */
@@ -1165,7 +1260,7 @@ export namespace Components {
     }
     interface PtcList {
         "listItems"?: string[];
-        "listType": 'list-primary';
+        "listType": "list-primary";
     }
     interface PtcMediaCard {
         /**
@@ -1184,7 +1279,7 @@ export namespace Components {
         /**
           * Card Type Specify Card Type, default to media card
          */
-        "cardType"?: 'media-card' | 'bureau-card' | 'case-study-icon';
+        "cardType"?: "media-card" | "bureau-card" | "case-study-icon";
         /**
           * Card category
          */
@@ -1196,7 +1291,10 @@ export namespace Components {
         /**
           * Card heading text transform
          */
-        "headingTransform"?: 'uppercase' | 'lowercase' | 'capitalize' | 'none';
+        "headingTransform"?: | "uppercase"
+		| "lowercase"
+		| "capitalize"
+		| "none";
         /**
           * Background Hover Image
          */
@@ -1264,7 +1362,10 @@ export namespace Components {
         /**
           * Add the border radius  Options: standard | large | pill | circle
          */
-        "borderRadius"?: 'standard' | 'large' | 'pill' | 'circle';
+        "borderRadius"?: | "standard"
+		| "large"
+		| "pill"
+		| "circle";
         "bottomCloseBtn"?: string;
         /**
           * Sets if popup should close if click on outside
@@ -1273,7 +1374,7 @@ export namespace Components {
         /**
           * This is to add css class to Modal Form with Content
          */
-        "customClass"?: '';
+        "customClass"?: "";
         /**
           * Sets if popup should overlay
          */
@@ -1299,7 +1400,10 @@ export namespace Components {
           * Sets if popup should overlay
          */
         "keepInViewport"?: boolean;
-        "modalType": 'video-modal' | 'default-modal' | 'event-listing' | 'thank-you';
+        "modalType": | "video-modal"
+		| "default-modal"
+		| "event-listing"
+		| "thank-you";
         /**
           * Sets if popup should overlay
          */
@@ -1321,7 +1425,13 @@ export namespace Components {
         /**
           * Sets if popup should close if click on outside
          */
-        "size"?: 'sm' | 'md' | 'lg' | 'xl' | 'fit-content' | 'max' | 'sm-modal';
+        "size"?: | "sm"
+		| "md"
+		| "lg"
+		| "xl"
+		| "fit-content"
+		| "max"
+		| "sm-modal";
         /**
           * (optional) Injected CSS Styles
          */
@@ -1345,7 +1455,12 @@ export namespace Components {
         "focusToggleButton": () => Promise<void>;
         "helpertext": string;
         "isRequired": boolean;
-        "items": Array<{ text: string; selected: boolean; ptcDataEloquaName: string; ptcDataTargetEloquaName: string }>;
+        "items": Array<{
+		text: string;
+		selected: boolean;
+		ptcDataEloquaName: string;
+		ptcDataTargetEloquaName: string;
+	}>;
         "label": string;
         "placeholderText": string;
         "selectAllText": string;
@@ -1362,7 +1477,7 @@ export namespace Components {
         /**
           * Card Type Specify Card Type
          */
-        "cardType": 'media-card' | 'links-card' | 'cta-card';
+        "cardType": "media-card" | "links-card" | "cta-card";
         /**
           * Card description
          */
@@ -1454,7 +1569,7 @@ export namespace Components {
         "labelTrackerId"?: string;
     }
     interface PtcNavTile {
-        "navLinks": { title: string; url: string} [];
+        "navLinks": { title: string; url: string }[];
     }
     interface PtcNews {
         /**
@@ -1496,38 +1611,45 @@ export namespace Components {
         /**
           * Overlay border shape
          */
-        "borderRadius": 'radius-standard' | 'radius-large'| 'radius-pill' | 'radius-circle';
+        "borderRadius": | "radius-standard"
+		| "radius-large"
+		| "radius-pill"
+		| "radius-circle";
         /**
           * Filter Color
          */
-        "filterColor": | 'blue'
-    | 'red'
-    | 'orange'
-    | 'green'
-    | 'black-1'
-    | 'black-2'
-    | 'black-3'
-    | 'black-4'
-    | 'black-5'
-    | 'slate-grey'
-    | 'bright-blue'
-    | 'bright-red'
-    | 'bright-orange'
-    | 'bright-green'
-    | 'bright-slate-grey'
-    | 'solid-black-1'
-    | 'solid-black-2'
-    | 'hp-blue'
-    | 'hp-green'
-    | 'hp-red'
-    | 'hp-gray'
-    | 'hp-orange'
-    | 'transparent'
-    | string;
+        "filterColor": | "blue"
+		| "red"
+		| "orange"
+		| "green"
+		| "black-1"
+		| "black-2"
+		| "black-3"
+		| "black-4"
+		| "black-5"
+		| "slate-grey"
+		| "bright-blue"
+		| "bright-red"
+		| "bright-orange"
+		| "bright-green"
+		| "bright-slate-grey"
+		| "solid-black-1"
+		| "solid-black-2"
+		| "hp-blue"
+		| "hp-green"
+		| "hp-red"
+		| "hp-gray"
+		| "hp-orange"
+		| "transparent"
+		| string;
         /**
           * Overlay z-index
          */
-        "overlayZIndex": 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2';
+        "overlayZIndex": | "z-index-auto"
+		| "z-index-n-2"
+		| "z-index-n-1"
+		| "z-index-p-1"
+		| "z-index-p-2";
         "setOverlay": (overlayName: string) => Promise<void>;
         /**
           * Injected Styles
@@ -1548,7 +1670,7 @@ export namespace Components {
           * (optional) Injected CSS styles
          */
         "styles"?: string;
-        "theme": 'events' | 'standard';
+        "theme": "events" | "standard";
         "totalCount"?: number;
     }
     interface PtcPara {
@@ -1560,11 +1682,21 @@ export namespace Components {
         /**
           * Paragraph font size
          */
-        "fontSize": 'xxx-small' | 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large' | 'htmlquote-para';
+        "fontSize": | "xxx-small"
+		| "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "htmlquote-para";
         /**
           * Paragraph font weight
          */
-        "fontWeight": 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "fontWeight": "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         "hideTooltipOnMobile": boolean;
         "maxChars": number;
         "maxLines": number;
@@ -1575,45 +1707,63 @@ export namespace Components {
         /**
           * Para text Alignment
          */
-        "paraAlign"?: 'left' | 'center' | 'right' | 'justify' | 'right-768above';
+        "paraAlign"?: | "left"
+		| "center"
+		| "right"
+		| "justify"
+		| "right-768above";
         /**
           * Paragraph Color
          */
-        "paraColor": 'primary-grey' | 'primary-green' | 'white' | 'gray-darker';
+        "paraColor": | "primary-grey"
+		| "primary-green"
+		| "white"
+		| "gray-darker";
         /**
           * line height
          */
-        "paraLineH": 'line-height-densest' | 'line-height-denser' | 'line-height-dense' | 'line-height-normal' | 'line-height-loose' | 'line-height-looser' | 'line-height-p';
+        "paraLineH": | "line-height-densest"
+		| "line-height-denser"
+		| "line-height-dense"
+		| "line-height-normal"
+		| "line-height-loose"
+		| "line-height-looser"
+		| "line-height-p";
         /**
           * Paragraph Margin
          */
-        "paraMargin"?: | 'margin-flush'
-    | 'maring-top-1'
-    | 'margin-top-2'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-1'
-    | 'margin-bottom-2'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-1'
-    | 'margin-2'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6';
+        "paraMargin"?: | "margin-flush"
+		| "maring-top-1"
+		| "margin-top-2"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-1"
+		| "margin-bottom-2"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-1"
+		| "margin-2"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6";
         /**
           * Paragraph Style
          */
-        "paraStyle": 'default' | 'intro' | 'small' | 'announcement' | 'flush-style' | 'main';
+        "paraStyle": | "default"
+		| "intro"
+		| "small"
+		| "announcement"
+		| "flush-style"
+		| "main";
         /**
           * sep z-index
          */
-        "paraZIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-99' | 'z-999';
+        "paraZIndex"?: "z-auto" | "z-1" | "z-2" | "z-3" | "z-99" | "z-999";
         /**
           * (optional) enable support for seo tools that can only view source
          */
@@ -1625,15 +1775,19 @@ export namespace Components {
         /**
           * Tooltip position
          */
-        "tooltipPosition": 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "tooltipPosition": | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top";
         /**
           * (optional) Injected CSS Styles
          */
-        "tooltipTheme": 'standard' | 'danger';
+        "tooltipTheme": "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "tooltipWidth"?: 'full-width' | 'default';
+        "tooltipWidth"?: "full-width" | "default";
         /**
           * index of hover tooltip element
          */
@@ -1647,7 +1801,10 @@ export namespace Components {
         /**
           * Image border shape
          */
-        "borderRadius": 'radius-standard' | 'radius-large' | 'radius-pill' | 'radius-circle';
+        "borderRadius": | "radius-standard"
+		| "radius-large"
+		| "radius-pill"
+		| "radius-circle";
         /**
           * Disable Image resizing solution
          */
@@ -1655,7 +1812,7 @@ export namespace Components {
         /**
           * Display image: inline, inline-block, block
          */
-        "displayImage"?: 'inline' | 'inline-block' | 'block';
+        "displayImage"?: "inline" | "inline-block" | "block";
         /**
           * Set height Value unit: pixles Just put numbers without unit
          */
@@ -1663,11 +1820,11 @@ export namespace Components {
         /**
           * (optional) Image alignment
          */
-        "imageAlignment"?: 'left' | 'right' | 'center';
+        "imageAlignment"?: "left" | "right" | "center";
         /**
           * Image Position
          */
-        "imagePosition": 'relative' | 'absolute' | 'static';
+        "imagePosition": "relative" | "absolute" | "static";
         /**
           * Stretch height to 100%?
          */
@@ -1683,7 +1840,13 @@ export namespace Components {
         /**
           * Object Fit Default: cover
          */
-        "objectFit": 'cover' | 'fill' | 'contain' | 'scale-down' | 'none' | 'initial' | 'inherit';
+        "objectFit": | "cover"
+		| "fill"
+		| "contain"
+		| "scale-down"
+		| "none"
+		| "initial"
+		| "inherit";
         /**
           * Image solution for large screen >=1200px
          */
@@ -1729,6 +1892,10 @@ export namespace Components {
     }
     interface PtcPreferanceCenterForm {
     }
+    interface PtcPreloader {
+        "type": string | "caption" | "text-body" | "button" | "title" | "divider" | "line" | "multi-line" | "small-para";
+        "width"?: string;
+    }
     interface PtcPreloaderSection {
         "autoShow": boolean;
         "numberOfCards": number;
@@ -1743,7 +1910,7 @@ export namespace Components {
          */
         "styles"?: string;
         "text": string | undefined;
-        "theme": 'standard' | 'light';
+        "theme": "standard" | "light";
     }
     interface PtcPricingAddOnCard {
         /**
@@ -1924,7 +2091,7 @@ export namespace Components {
         "filterText": string;
         "jumpToProduct": string;
         "selectTechnology": string;
-        "suggestionList": { categoryName: string, products: string[] }[];
+        "suggestionList": { categoryName: string; products: string[] }[];
         "technologyText": string;
     }
     interface PtcProgressBar {
@@ -1962,7 +2129,9 @@ export namespace Components {
         /**
           * Quote Type
          */
-        "quoteType": "image-quote" | "plain-quote" | 'value-led-quote';
+        "quoteType": | "image-quote"
+		| "plain-quote"
+		| "value-led-quote";
     }
     interface PtcReadmore {
         /**
@@ -1972,11 +2141,11 @@ export namespace Components {
         /**
           * color: Read more text color. Options: default is blue.  'blue' | 'gray' | 'green' | 'initial'
          */
-        "color": 'blue' | 'gray' | 'green' | 'initial';
+        "color": "blue" | "gray" | "green" | "initial";
         /**
           * @returns string
          */
-        "display": 'inline' | 'block';
+        "display": "inline" | "block";
         /**
           * isContentSlotted: if the readmore content is from slot,
          */
@@ -1996,16 +2165,21 @@ export namespace Components {
         /**
           * Read more text position: left or right
          */
-        "readMorePosition": 'left' | 'right' | 'center';
+        "readMorePosition": "left" | "right" | "center";
         /**
           * Size: Font size of the read more text. Options small=16px | medium=18px | large=24px
          */
-        "size": 'small' | 'medium' | 'large';
+        "size": "small" | "medium" | "large";
         "updateReadmoreStatus": () => Promise<void>;
         /**
           * visible lines
          */
-        "visibleLines": 'line1' | 'line2' | 'line3' | 'line4' | 'line5'  | 'line10';
+        "visibleLines": | "line1"
+		| "line2"
+		| "line3"
+		| "line4"
+		| "line5"
+		| "line10";
         /**
           * visible lines custom numebr
          */
@@ -2013,7 +2187,7 @@ export namespace Components {
         /**
           * index of hover lable
          */
-        "zIndex": 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-999';
+        "zIndex": "z-auto" | "z-1" | "z-2" | "z-3" | "z-999";
     }
     interface PtcReadmoreChar {
         /**
@@ -2076,10 +2250,10 @@ export namespace Components {
     interface PtcResponsiveWrapper {
     }
     interface PtcScrollButton {
-        "direction": 'left' | 'right' | 'up' | 'down';
+        "direction": "left" | "right" | "up" | "down";
         "initVisibility": () => Promise<void>;
         "isDragging": boolean;
-        "orientation": 'horizontal' | 'vertical';
+        "orientation": "horizontal" | "vertical";
         "scrollAmount": number;
         "scrollContainerClass": string;
         "styles"?: string;
@@ -2088,7 +2262,7 @@ export namespace Components {
     interface PtcSearchField {
         "clearSearchValue": () => Promise<void>;
         "darkTheme": boolean;
-        "elevation": 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
+        "elevation": "x-small" | "small" | "medium" | "large" | "x-large";
         "enableClear": boolean;
         "isNews": boolean;
         "placeholderLabel": string;
@@ -2127,73 +2301,79 @@ export namespace Components {
         /**
           * Text Align
          */
-        "textAlign": 'left' | 'center' | 'right' | 'inherit';
+        "textAlign": "left" | "center" | "right" | "inherit";
         /**
           * Title color
          */
-        "titleColor": 'black' | 'white' | 'gray' | 'gray-darker' | 'gray-1';
+        "titleColor": "black" | "white" | "gray" | "gray-darker" | "gray-1";
         /**
           * Title heading display : To show line above heading full width or title width
          */
-        "titleDisplay": 'block' | 'inline-block';
+        "titleDisplay": "block" | "inline-block";
         /**
           * Title line height
          */
-        "titleHeight": 'densest' | 'denser' | 'dense' | 'normal' | 'loose' | 'looser' | 'paragraph';
+        "titleHeight": | "densest"
+		| "denser"
+		| "dense"
+		| "normal"
+		| "loose"
+		| "looser"
+		| "paragraph";
         /**
           * Title Margin
          */
-        "titleMargin"?: | 'margin-flush'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6'
-    | 'margin-9';
+        "titleMargin"?: | "margin-flush"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6"
+		| "margin-9";
         /**
           * Title Shadow
          */
-        "titleShadow": 'blue' | 'red' | 'green' | 'orange' | 'slate-grey';
+        "titleShadow": "blue" | "red" | "green" | "orange" | "slate-grey";
         /**
           * Title size
          */
-        "titleSize": | 'xx-small'
-    | 'x-small'
-    | 'small'
-    | 'medium'
-    | 'large'
-    | 'x-large'
-    | 'xx-large'
-    | 'xxx-large'
-    | 'xxxx-large'
-    | 'xxxx-large-allbp'
-    | 'xx-large-allbp'
-    | 'xxxx-large-desktop'
-    | 'xxxx-large-store';
+        "titleSize": | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "xxxx-large-allbp"
+		| "xx-large-allbp"
+		| "xxxx-large-desktop"
+		| "xxxx-large-store";
         /**
           * Title weight
          */
-        "titleWeight": 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "titleWeight": "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Title Tag Type
          */
-        "type": 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+        "type": "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
         /**
           * Upperline Style
          */
-        "upperline": 'dotted' | 'solid' | 'no-upperline';
+        "upperline": "dotted" | "solid" | "no-upperline";
     }
     interface PtcShoppingCart {
         "cartCount"?: string;
         "cartText": string;
-        "color": 'black' | 'white';
+        "color": "black" | "white";
     }
     interface PtcShowcaseCard {
         "headingIconAltText": string;
@@ -2286,25 +2466,50 @@ export namespace Components {
           * darkFocusState for dark background
          */
         "darkFocusState": boolean;
-        "display"?: 'inline-block' | 'block' | 'inline' | 'flex';
+        "display"?: "inline-block" | "block" | "inline" | "flex";
         /**
           * Icon asset color
          */
-        "iconColor"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit';
+        "iconColor"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "primary-gray"
+		| "inherit";
         /**
           * Icon asset hover color
          */
-        "iconHoverColor"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit';
+        "iconHoverColor"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "primary-gray"
+		| "inherit";
         /**
           * Icon Size
          */
-        "iconSize"?: 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large';
+        "iconSize"?: | "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large";
         /**
           * Email recipient. If you want to use mail share, you need to use this property
          */
         "recipient"?: string;
         "shareTitle": string;
-        "shareType"?: 'mail' | 'twitter' | 'linkedin' | 'facebook' | 'share-api' | 'download' | 'blog-mail' | 'blog-twitter' | 'blog-linkedin' | 'blog-facebook';
+        "shareType"?: | "mail"
+		| "twitter"
+		| "linkedin"
+		| "facebook"
+		| "share-api"
+		| "download"
+		| "blog-mail"
+		| "blog-twitter"
+		| "blog-linkedin"
+		| "blog-facebook";
         /**
           * Optional - source for linkedin
          */
@@ -2317,29 +2522,53 @@ export namespace Components {
         /**
           * Breakpoint
          */
-        "breakpoint": '' | 'medium' | 'small' | 'large' | 'x-large' | 'xx-large' | 'x-small' | 'xx-small' | 'xxx-large';
+        "breakpoint": | ""
+		| "medium"
+		| "small"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "x-small"
+		| "xx-small"
+		| "xxx-large";
         /**
           * Direction
          */
-        "direction": 'vertical' | 'horizontal';
+        "direction": "vertical" | "horizontal";
         /**
           * Spacing Size
          */
-        "size": 'large' | 'medium' | 'small' | 'x-large' | 'x-small' | 'xx-large' | 'xx-small' | 'xxx-large' | 'xxxx-large' | 'space-144' | 'space-120' | 'space-128';
+        "size": | "large"
+		| "medium"
+		| "small"
+		| "x-large"
+		| "x-small"
+		| "xx-large"
+		| "xx-small"
+		| "xxx-large"
+		| "xxxx-large"
+		| "space-144"
+		| "space-120"
+		| "space-128";
     }
     interface PtcSpan {
         /**
           * Display
          */
-        "display": 'block' | 'inline-block' | 'inline';
+        "display": "block" | "inline-block" | "inline";
         /**
           * Span weight
          */
-        "fontWeight": 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "fontWeight": "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Span Style
          */
-        "spanStyle": 'link-style' | 'tag-style' | 'nav-style' | 'plm-hub-style' | 'plm-hub-style-smaller' | 'blog-tag';
+        "spanStyle": | "link-style"
+		| "tag-style"
+		| "nav-style"
+		| "plm-hub-style"
+		| "plm-hub-style-smaller"
+		| "blog-tag";
         /**
           * Injected Styles
          */
@@ -2349,7 +2578,7 @@ export namespace Components {
         /**
           * Arrow Direction
          */
-        "arrowDirection"?: 'up' | 'down';
+        "arrowDirection"?: "up" | "down";
         /**
           * Number after the icon
          */
@@ -2404,7 +2633,7 @@ export namespace Components {
         /**
           * Display
          */
-        "display": 'block' | 'inline' | 'inline-block' | 'flex';
+        "display": "block" | "inline" | "inline-block" | "flex";
         /**
           * Injected Styles
          */
@@ -2430,7 +2659,7 @@ export namespace Components {
         /**
           * Tab Type
          */
-        "type"?: 'default' | 'tab-with-banner';
+        "type"?: "default" | "tab-with-banner";
     }
     interface PtcTabs {
         "openTab": (index: number) => Promise<void>;
@@ -2459,7 +2688,10 @@ export namespace Components {
         /**
           * (optional) topSlitPosition: It will decide the position of .
          */
-        "slitPosition"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+        "slitPosition"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right";
         /**
           * (optional) Injected CSS Styles
          */
@@ -2471,7 +2703,10 @@ export namespace Components {
         /**
           * Type Specify  Type, default is text-copy-with-background
          */
-        "type": 'text-copy-with-background' | 'hero-footer-cta' | 'tab-cta-with-background' | 'case-studies';
+        "type": | "text-copy-with-background"
+		| "hero-footer-cta"
+		| "tab-cta-with-background"
+		| "case-studies";
     }
     interface PtcTextfield {
         /**
@@ -2485,7 +2720,9 @@ export namespace Components {
         /**
           * Custom Validation - String
          */
-        "customValidation": (input: HTMLInputElement | HTMLTextAreaElement) => string;
+        "customValidation": (
+		input: HTMLInputElement | HTMLTextAreaElement
+	) => string;
         /**
           * Disable the field
          */
@@ -2544,7 +2781,7 @@ export namespace Components {
         /**
           * Text Field Form
          */
-        "textfieldForm": 'default' | 'email-signup';
+        "textfieldForm": "default" | "email-signup";
         /**
           * text, button, email, file and etc. This value triggers different validation
          */
@@ -2555,7 +2792,7 @@ export namespace Components {
         "cardDescription"?: string;
         "cardNumber"?: number;
         "cardTitle"?: string;
-        "modalType"?: 'only-video' | 'video-with-description';
+        "modalType"?: "only-video" | "video-with-description";
         "thumbImg"?: string;
         "videoId"?: number;
         "vtagName"?: string;
@@ -2587,72 +2824,82 @@ export namespace Components {
         /**
           * Text Align
          */
-        "textAlign": 'left' | 'center' | 'right' | 'inherit';
+        "textAlign": "left" | "center" | "right" | "inherit";
         /**
           * Title color
          */
-        "titleColor": 'black' | 'white' | 'gray' | 'gray-darker' | 'gray-1';
+        "titleColor": "black" | "white" | "gray" | "gray-darker" | "gray-1";
         /**
           * Title heading display : To show line above heading full width or title width
          */
-        "titleDisplay": 'block' | 'inline-block';
+        "titleDisplay": "block" | "inline-block";
         /**
           * Title line height
          */
-        "titleHeight": 'densest' | 'denser' | 'dense' | 'normal' | 'loose' | 'looser' | 'paragraph';
+        "titleHeight": | "densest"
+		| "denser"
+		| "dense"
+		| "normal"
+		| "loose"
+		| "looser"
+		| "paragraph";
         /**
           * Title Margin
          */
-        "titleMargin"?: | 'margin-flush'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6'
-    | 'margin-9';
+        "titleMargin"?: | "margin-flush"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6"
+		| "margin-9";
         /**
           * Title Shadow
          */
-        "titleShadow": 'blue' | 'red' | 'green' | 'orange' | 'slate-grey';
+        "titleShadow": "blue" | "red" | "green" | "orange" | "slate-grey";
         /**
           * Title size
          */
-        "titleSize": | 'xx-small'
-    | 'x-small'
-    | 'small'
-    | 'medium'
-    | 'large'
-    | 'x-large'
-    | 'xx-large'
-    | 'xxx-large'
-    | 'xxxx-large'
-    | 'xxxx-large-allbp'
-    | 'xx-large-allbp'
-    | 'xxxx-large-desktop'
-    | 'xxxx-large-store';
+        "titleSize": | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "xxxx-large-allbp"
+		| "xx-large-allbp"
+		| "xxxx-large-desktop"
+		| "xxxx-large-store";
         /**
           * Title weight
          */
-        "titleWeight": 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "titleWeight": "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Tooltip position
          */
-        "tooltipPosition": 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "tooltipPosition": | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top";
         /**
           * (optional) Injected CSS Styles
          */
-        "tooltipTheme": 'standard' | 'danger';
+        "tooltipTheme": "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "tooltipWidth"?: 'full-width' | 'default';
+        "tooltipWidth"?: "full-width" | "default";
         /**
           * index of hover tooltip element
          */
@@ -2660,11 +2907,11 @@ export namespace Components {
         /**
           * Title Tag Type
          */
-        "type": 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+        "type": "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
         /**
           * Upperline Style
          */
-        "upperline": 'dotted' | 'solid' | 'no-upperline';
+        "upperline": "dotted" | "solid" | "no-upperline";
     }
     interface PtcTooltip {
         /**
@@ -2683,7 +2930,7 @@ export namespace Components {
         /**
           * If tool tip is only for text use 'text-only' otherwise it will wrap content instead of replacing
          */
-        "mode": 'wrapper' | 'text-only';
+        "mode": "wrapper" | "text-only";
         /**
           * If tooltip noOverflow = "true" then the tooltip will not be visible just ellipses will be visible
          */
@@ -2691,7 +2938,12 @@ export namespace Components {
         /**
           * Tooltip position
          */
-        "position": 'left' | 'right' | 'bottom' | 'bottom-right' | 'top' | 'side-left';
+        "position": | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top"
+		| "side-left";
         /**
           * (optional) Injected CSS Styles
          */
@@ -2699,7 +2951,7 @@ export namespace Components {
         /**
           * Component Display please don't set it to be inline-block
          */
-        "textDisplay": 'inline' | 'block';
+        "textDisplay": "inline" | "block";
         /**
           * Ellipsis apply to X lines
           * @returns string
@@ -2708,27 +2960,27 @@ export namespace Components {
         /**
           * If tool tip is only for text use 'text-only' otherwise it will wrap content instead of replacing
          */
-        "theme": 'standard' | 'danger';
+        "theme": "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "width"?: 'full-width' | 'default';
+        "width"?: "full-width" | "default";
         /**
           * index of hover element
          */
-        "zIndex": 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-999';
+        "zIndex": "z-auto" | "z-1" | "z-2" | "z-3" | "z-999";
     }
     interface PtcTooltipV2 {
-        "elementDisplay": 'block' | 'inline-block' | 'inline';
+        "elementDisplay": "block" | "inline-block" | "inline";
         "hideOnMobile": boolean;
         "maxLength": number;
         "maxLines": number;
-        "position": 'top' | 'bottom' | 'left' | 'right';
+        "position": "top" | "bottom" | "left" | "right";
         /**
           * (optional) Injected CSS Styles
          */
         "styles"?: string;
-        "width": 'full-width' | 'default';
+        "width": "full-width" | "default";
         "zIndex": number;
     }
     interface PtcTooltipV3 {
@@ -2739,16 +2991,16 @@ export namespace Components {
         /**
           * Tooltip position
          */
-        "position": 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "position": "left" | "right" | "bottom" | "bottom-right" | "top";
         "styles"?: string;
         /**
           * (optional) Injected CSS Styles
          */
-        "theme": 'standard' | 'danger';
+        "theme": "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "width"?: 'full-width' | 'default';
+        "width"?: "full-width" | "default";
         /**
           * index of hover element
          */
@@ -2758,7 +3010,9 @@ export namespace Components {
         /**
           * Card Type Specify Card Type,
          */
-        "componentType": 'two-column-media' | 'two-column-media-icon-list' | 'two-column-text';
+        "componentType": | "two-column-media"
+		| "two-column-media-icon-list"
+		| "two-column-text";
     }
     interface PtcValueLedCard {
         "cardImage"?: string;
@@ -2805,7 +3059,7 @@ export namespace Components {
     }
     interface PtcVideoEmbed {
         "src": string;
-        "type": 'Brightcove' | 'Youtube' | 'HTML';
+        "type": "Brightcove" | "Youtube" | "HTML";
         "width"?: number;
     }
     interface PtcWhitePaper {
@@ -3674,6 +3928,12 @@ declare global {
         prototype: HTMLPtcPreferanceCenterFormElement;
         new (): HTMLPtcPreferanceCenterFormElement;
     };
+    interface HTMLPtcPreloaderElement extends Components.PtcPreloader, HTMLStencilElement {
+    }
+    var HTMLPtcPreloaderElement: {
+        prototype: HTMLPtcPreloaderElement;
+        new (): HTMLPtcPreloaderElement;
+    };
     interface HTMLPtcPreloaderSectionElement extends Components.PtcPreloaderSection, HTMLStencilElement {
     }
     var HTMLPtcPreloaderSectionElement: {
@@ -4207,6 +4467,7 @@ declare global {
         "ptc-picture": HTMLPtcPictureElement;
         "ptc-podcast-card": HTMLPtcPodcastCardElement;
         "ptc-preferance-center-form": HTMLPtcPreferanceCenterFormElement;
+        "ptc-preloader": HTMLPtcPreloaderElement;
         "ptc-preloader-section": HTMLPtcPreloaderSectionElement;
         "ptc-previous-url": HTMLPtcPreviousUrlElement;
         "ptc-pricing-add-on-card": HTMLPtcPricingAddOnCardElement;
@@ -4317,7 +4578,12 @@ declare namespace LocalJSX {
     interface EmbeddedForm {
     }
     interface EventJumbotronExample {
-        "cards"?: { title: string; description: string; panelContent: string; cardBg: string }[];
+        "cards"?: {
+		title: string;
+		description: string;
+		panelContent: string;
+		cardBg: string;
+	}[];
         "modalBtnCloseText"?: string;
     }
     interface EventPodcastSliderExample {
@@ -4372,7 +4638,14 @@ declare namespace LocalJSX {
         /**
           * Icon Color
          */
-        "color"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'light-gray' | 'primary-gray' | 'default' | 'inherit';
+        "color"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "light-gray"
+		| "primary-gray"
+		| "default"
+		| "inherit";
         "focusOn"?: boolean;
         /**
           * (optional) Injected CSS Styles
@@ -4390,20 +4663,30 @@ declare namespace LocalJSX {
         /**
           * Icon Pulse Animation (not valid for ptc type)
          */
-        "pulse"?: 'fa-pulse' | '';
+        "pulse"?: "fa-pulse" | "";
         /**
           * Icon Size
          */
-        "size"?: 'micro' | 'xxx-small' |'xx-small' |'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large';
+        "size"?: | "micro"
+		| "xxx-small"
+		| "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large";
         /**
           * Icon Spin Animation (not valid for ptc type)
          */
-        "spin"?: 'fa-spin' | '';
+        "spin"?: "fa-spin" | "";
         "trackerId"?: string;
         /**
           * Icon Type
          */
-        "type"?: 'solid' | 'brands' | 'ptc' | 'regular';
+        "type"?: "solid" | "brands" | "ptc" | "regular";
     }
     interface InnovatorToggleContainer {
         /**
@@ -4430,12 +4713,16 @@ declare namespace LocalJSX {
         /**
           * Theme color
          */
-        "color"?: 'white' | 'primary-gray' | 'light-gray';
+        "color"?: "white" | "primary-gray" | "light-gray";
         "flushBefore"?: boolean;
         "hasBeforeHomeIcon"?: boolean;
         "linkHref"?: string;
         "linkTarget"?: string | undefined;
-        "listType"?: 'list-primary' | 'list-footer' | 'breadcrumb' | 'list-green' | 'list-underline';
+        "listType"?: | "list-primary"
+		| "list-footer"
+		| "breadcrumb"
+		| "list-green"
+		| "list-underline";
         /**
           * (optional) Injected CSS styles
          */
@@ -4444,7 +4731,7 @@ declare namespace LocalJSX {
     }
     interface MaxWidthContainer {
         "breakpoint"?: number;
-        "contentAlign"?: 'left' | 'center' | 'right';
+        "contentAlign"?: "left" | "center" | "right";
         "maxWidth"?: number;
         "maxWidthP"?: number;
         /**
@@ -4583,7 +4870,11 @@ declare namespace LocalJSX {
         /**
           * Pause Button Location
          */
-        "buttonLocation"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'allbp-bottom-right';
+        "buttonLocation"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right"
+		| "allbp-bottom-right";
         /**
           * Play/Pause Index
          */
@@ -4603,7 +4894,7 @@ declare namespace LocalJSX {
         /**
           * Overlay Type standard is gray gradient. dark is dark gradient
          */
-        "overlayType"?: 'standard' | 'dark';
+        "overlayType"?: "standard" | "dark";
         /**
           * Pause Button Title
          */
@@ -4623,7 +4914,7 @@ declare namespace LocalJSX {
         /**
           * Video implementation type:  default: Content need to add in tag      Ex: <ptc-background-video>Content  </ptc-background-video>  legacy: Add the blank tag in any other setcon having relative parent.      Ex: <div class="section" style="position: relative;">             <ptc-background-video></ptc-background-video>             Content          </div>
          */
-        "type"?: 'default' | 'legacy';
+        "type"?: "default" | "legacy";
         /**
           * Video url
          */
@@ -4632,7 +4923,7 @@ declare namespace LocalJSX {
     interface PtcBadge {
         "number"?: number;
         "svgCode"?: string;
-        "type"?: 'svg' | 'number';
+        "type"?: "svg" | "number";
     }
     interface PtcBioCard {
         /**
@@ -4661,7 +4952,14 @@ declare namespace LocalJSX {
         /**
           * Theme Color
          */
-        "color"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'light-gray' | 'primary-gray' | 'default' | 'inherit';
+        "color"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "light-gray"
+		| "primary-gray"
+		| "default"
+		| "inherit";
         /**
           * Dark Mode for Tab Index
          */
@@ -4669,7 +4967,7 @@ declare namespace LocalJSX {
         /**
           * breadcrumb position
          */
-        "position"?: 'left' | 'center' | 'right';
+        "position"?: "left" | "center" | "right";
         /**
           * remove topMargin
          */
@@ -4692,8 +4990,21 @@ declare namespace LocalJSX {
         /**
           * Button theme color
          */
-        "color"?: 'offwhite' | 'blackgrey' | 'turtlegreen' | 'nav' | 'legacy-green' | 'ptc-primary' | 'ptc-secondary' | 'ptc-tertiary' | 'ptc-quaternary' | 'icon-toggle' | 'clear-search' | 'primary-cta' | 'secondary-cta-dark' | 'secondary-cta-light';
-        "ctaWidth"?: 'full-width' | 'default';
+        "color"?: | "offwhite"
+		| "blackgrey"
+		| "turtlegreen"
+		| "nav"
+		| "legacy-green"
+		| "ptc-primary"
+		| "ptc-secondary"
+		| "ptc-tertiary"
+		| "ptc-quaternary"
+		| "icon-toggle"
+		| "clear-search"
+		| "primary-cta"
+		| "secondary-cta-dark"
+		| "secondary-cta-light";
+        "ctaWidth"?: "full-width" | "default";
         /**
           * Add dark-focus-state property where button is present on dark backgrounds
          */
@@ -4709,11 +5020,14 @@ declare namespace LocalJSX {
         /**
           * Icon Animation
          */
-        "iconAnimation"?: 'animation-right' | 'animation-down' | 'reveal-down' | '';
+        "iconAnimation"?: | "animation-right"
+		| "animation-down"
+		| "reveal-down"
+		| "";
         /**
           * Icon Position
          */
-        "iconPosition"?: 'icon-left' | 'icon-right' | 'none';
+        "iconPosition"?: "icon-left" | "icon-right" | "none";
         /**
           * Link URL
          */
@@ -4741,7 +5055,7 @@ declare namespace LocalJSX {
         /**
           * Button theme color
          */
-        "size"?: 'small' | 'medium' | 'large';
+        "size"?: "small" | "medium" | "large";
         /**
           * (optional) Injected CSS Styles
          */
@@ -4757,12 +5071,12 @@ declare namespace LocalJSX {
         /**
           * Text Align
          */
-        "textAlign"?: 'left' | 'right' | 'center';
+        "textAlign"?: "left" | "right" | "center";
         "trackerId"?: string;
         /**
           * Button type
          */
-        "type"?: 'button' | 'reset' | 'submit' | 'link';
+        "type"?: "button" | "reset" | "submit" | "link";
     }
     interface PtcCard {
         /**
@@ -4780,24 +5094,28 @@ declare namespace LocalJSX {
         /**
           * Card overflow
          */
-        "cardOverflow"?: 'auto' | 'hidden' | 'visible' | 'inherit' | 'initial';
+        "cardOverflow"?: | "auto"
+		| "hidden"
+		| "visible"
+		| "inherit"
+		| "initial";
         "cardTitle"?: string;
         /**
           * Card Type Specify Card Type, default to simple card
          */
-        "cardType"?: | 'simple-card'
-    | 'lottie-card'
-    | 'custom-card'
-    | 'clip-edge-card'
-    | 'hightlight-card'
-    | 'listing-card'
-    | 'horizontal-card'
-    | 'listing-card-horizontal'
-    | 'resource-center-card'
-    | 'case-studies-card'
-    | 'featured-horizontal-card'
-    | 'related-card'
-    | 'events-card';
+        "cardType"?: | "simple-card"
+		| "lottie-card"
+		| "custom-card"
+		| "clip-edge-card"
+		| "hightlight-card"
+		| "listing-card"
+		| "horizontal-card"
+		| "listing-card-horizontal"
+		| "resource-center-card"
+		| "case-studies-card"
+		| "featured-horizontal-card"
+		| "related-card"
+		| "events-card";
         /**
           * Card Date
          */
@@ -4825,7 +5143,10 @@ declare namespace LocalJSX {
         /**
           * Card heading text transform
          */
-        "headingTransform"?: 'uppercase' | 'lowercase' | 'capitalize' | 'none';
+        "headingTransform"?: | "uppercase"
+		| "lowercase"
+		| "capitalize"
+		| "none";
         "isCreoCard"?: boolean;
         "isTabHidden"?: boolean;
         "language"?: string;
@@ -4860,7 +5181,15 @@ declare namespace LocalJSX {
         "trackerId"?: string;
     }
     interface PtcCardBottom {
-        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist' | 'extra-tall' | 'color-outlined'| 'most-popular'| 'event-podcast';
+        "cardType"?: | "card-video"
+		| "card-tall"
+		| "card-2up"
+		| "card-wide"
+		| "card-playlist"
+		| "extra-tall"
+		| "color-outlined"
+		| "most-popular"
+		| "event-podcast";
         "onHoverEvent"?: (event: PtcCardBottomCustomEvent<void>) => void;
         "onLeaveEvent"?: (event: PtcCardBottomCustomEvent<void>) => void;
         /**
@@ -4869,23 +5198,27 @@ declare namespace LocalJSX {
         "styles"?: string;
     }
     interface PtcCardContent {
-        "cardType"?: | 'card-video'
-    | 'card-tall'
-    | 'card-2up'
-    | 'card-wide'
-    | 'speed-bump'
-    | 'card-playlist'
-    | 'card-video-intro'
-    | 'card-dynamic'
-    | 'extra-tall'
-    | 'color-outlined'
-    | 'thumbnail-video-preview'
-    | 'event-jumbotron-sub-card'
-    | 'event-podcast';
+        "cardType"?: | "card-video"
+		| "card-tall"
+		| "card-2up"
+		| "card-wide"
+		| "speed-bump"
+		| "card-playlist"
+		| "card-video-intro"
+		| "card-dynamic"
+		| "extra-tall"
+		| "color-outlined"
+		| "thumbnail-video-preview"
+		| "event-jumbotron-sub-card"
+		| "event-podcast";
         "isLoading"?: boolean;
         "onHoverEvent"?: (event: PtcCardContentCustomEvent<void>) => void;
         "onLeaveEvent"?: (event: PtcCardContentCustomEvent<void>) => void;
-        "outlineColor"?: 'o-red' | 'o-orange' | 'o-blue' | 'o-slate-grey' | 'o-green';
+        "outlineColor"?: | "o-red"
+		| "o-orange"
+		| "o-blue"
+		| "o-slate-grey"
+		| "o-green";
         /**
           * (optional) Injected CSS styles
          */
@@ -4899,19 +5232,19 @@ declare namespace LocalJSX {
         /**
           * Card Type
          */
-        "cardType"?: | 'card-video'
-    | 'card-tall'
-    | 'card-wide'
-    | 'speed-bump'
-    | 'card-playlist'
-    | 'card-video-intro'
-    | 'card-2up'
-    | 'extra-tall'
-    | 'color-outlined'
-    | 'result-box'
-    | 'most-popular'
-    | 'simple-card'
-    | 'event-podcast';
+        "cardType"?: | "card-video"
+		| "card-tall"
+		| "card-wide"
+		| "speed-bump"
+		| "card-playlist"
+		| "card-video-intro"
+		| "card-2up"
+		| "extra-tall"
+		| "color-outlined"
+		| "result-box"
+		| "most-popular"
+		| "simple-card"
+		| "event-podcast";
         /**
           * darkFocusState for dark background
          */
@@ -4951,7 +5284,7 @@ declare namespace LocalJSX {
     interface PtcCaseStudiesSlider {
     }
     interface PtcCheckbox {
-        "checked"?: 'checked' | 'unchecked';
+        "checked"?: "checked" | "unchecked";
         "disabled"?: boolean;
         "inputName"?: string;
         "offsetFocusOutline"?: boolean;
@@ -4961,7 +5294,7 @@ declare namespace LocalJSX {
     }
     interface PtcCheckboxGroup {
         "groupName"?: string;
-        "type"?: 'single' | 'card';
+        "type"?: "single" | "card";
     }
     interface PtcCloseIcon {
     }
@@ -4985,10 +5318,17 @@ declare namespace LocalJSX {
         /**
           * Theme
          */
-        "backgroundColor"?: 'white' | 'gray';
-        "containerType"?: 'large' | 'none' | '';
-        "elevation"?: 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
-        "spacing"?: 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large';
+        "backgroundColor"?: "white" | "gray";
+        "containerType"?: "large" | "none" | "";
+        "elevation"?: "x-small" | "small" | "medium" | "large" | "x-large";
+        "spacing"?: | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large";
         "styles"?: string;
     }
     interface PtcCountdown {
@@ -5027,11 +5367,11 @@ declare namespace LocalJSX {
         /**
           * Date Font Size
          */
-        "dataSize"?: 'medium' | 'small';
+        "dataSize"?: "medium" | "small";
         /**
           * Date Color
          */
-        "dateColor"?: 'white' | 'primary-grey';
+        "dateColor"?: "white" | "primary-grey";
         /**
           * Date examples: 2000-1-1 or 2000/01/01
          */
@@ -5064,7 +5404,7 @@ declare namespace LocalJSX {
         /**
           * Theme
          */
-        "theme"?: 'sort' | 'support';
+        "theme"?: "sort" | "support";
         "trackerId"?: string;
     }
     interface PtcDynamicCard {
@@ -5079,7 +5419,7 @@ declare namespace LocalJSX {
         /**
           * Card varients
          */
-        "cardScreen"?: 'mobile' | 'desktop';
+        "cardScreen"?: "mobile" | "desktop";
         /**
           * Card Title
          */
@@ -5087,7 +5427,7 @@ declare namespace LocalJSX {
         /**
           * Dynamic Card Type
          */
-        "cardType"?: 'sequential';
+        "cardType"?: "sequential";
         /**
           * is card expanded?
          */
@@ -5131,7 +5471,7 @@ declare namespace LocalJSX {
           * EVENTS
          */
         "onCtaFocussed"?: (event: PtcEnhancedProductListingCardCustomEvent<any>) => void;
-        "theme"?: 'standard' | 'alternate';
+        "theme"?: "standard" | "alternate";
     }
     interface PtcFeaturedList {
     }
@@ -5152,7 +5492,7 @@ declare namespace LocalJSX {
           * (optional) Injected CSS Styles
          */
         "styles"?: string;
-        "theme"?: 'bubble' | 'link' | 'link-lg' | 'button' | 'standard';
+        "theme"?: "bubble" | "link" | "link-lg" | "button" | "standard";
         "trackerID"?: string;
     }
     interface PtcFooter {
@@ -5191,11 +5531,11 @@ declare namespace LocalJSX {
         /**
           * Content Alignment
          */
-        "contentAlignment"?: 'left' | 'right' | 'center';
+        "contentAlignment"?: "left" | "right" | "center";
         /**
           * Hero Type
          */
-        "heroType"?: 'jumbotron' | 'footer-cta' | 'simple';
+        "heroType"?: "jumbotron" | "footer-cta" | "simple";
     }
     interface PtcHeroFooterCta {
         "backgroundImage"?: string;
@@ -5208,7 +5548,10 @@ declare namespace LocalJSX {
         /**
           * Pause Button Location
          */
-        "buttonLocation"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+        "buttonLocation"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right";
         /**
           * delay loading of video to improve perfomance
          */
@@ -5260,7 +5603,10 @@ declare namespace LocalJSX {
         /**
           * List item type
          */
-        "listType"?: 'simple-icon-list' | 'stat-icon-list' | 'icon-top-align-list' | 'feature-callout-list';
+        "listType"?: | "simple-icon-list"
+		| "stat-icon-list"
+		| "icon-top-align-list"
+		| "feature-callout-list";
         "noBottomSpace"?: boolean;
         "styles"?: string;
         /**
@@ -5294,7 +5640,11 @@ declare namespace LocalJSX {
         /**
           * Image border shape
          */
-        "borderRadius"?: 'radius-standard' | 'radius-large' | 'radius-large-top' | 'radius-standard-top' | '';
+        "borderRadius"?: | "radius-standard"
+		| "radius-large"
+		| "radius-large-top"
+		| "radius-standard-top"
+		| "";
         /**
           * (optional) setTimeout delay fro Lazy loading
          */
@@ -5306,7 +5656,7 @@ declare namespace LocalJSX {
         /**
           * Image type
          */
-        "imageType"?: 'smart-bg' | 'smart-img';
+        "imageType"?: "smart-bg" | "smart-img";
         /**
           * Image Src
          */
@@ -5314,7 +5664,7 @@ declare namespace LocalJSX {
         /**
           * Lazy loading option
          */
-        "loadMode"?: 'lazy-bg' | 'eager-bg';
+        "loadMode"?: "lazy-bg" | "eager-bg";
         /**
           * Image solution for large screen >=1200px
          */
@@ -5346,7 +5696,7 @@ declare namespace LocalJSX {
         "styles"?: string;
         "target"?: string;
         "trackerId"?: string;
-        "variant"?: 'image' | 'text';
+        "variant"?: "image" | "text";
     }
     interface PtcInlineCta {
         "containerIsShadow"?: boolean;
@@ -5356,7 +5706,7 @@ declare namespace LocalJSX {
         /**
           * PROPS
          */
-        "type"?: 'small' | 'big' | 'bottom';
+        "type"?: "small" | "big" | "bottom";
     }
     interface PtcJumbotron {
         "bgSrc"?: string;
@@ -5413,11 +5763,17 @@ declare namespace LocalJSX {
         /**
           * Font Size
          */
-        "fontSize"?: 'small' | 'medium' | 'large' | 'medium-large';
+        "fontSize"?: "small" | "medium" | "large" | "medium-large";
         /**
           * Font Weight
          */
-        "fontWeight"?: 'w-thin' | 'w-regular' | 'w-medium' | 'w-semibold' | 'w-bold' | 'w-extrabold' | 'w-black';
+        "fontWeight"?: | "w-thin"
+		| "w-regular"
+		| "w-medium"
+		| "w-semibold"
+		| "w-bold"
+		| "w-extrabold"
+		| "w-black";
         /**
           * href
          */
@@ -5425,7 +5781,7 @@ declare namespace LocalJSX {
         /**
           * Optional Link Area
          */
-        "linkArea"?: 'link-area-cover-parent';
+        "linkArea"?: "link-area-cover-parent";
         /**
           * Title
          */
@@ -5449,21 +5805,21 @@ declare namespace LocalJSX {
         /**
           * Theme
          */
-        "theme"?: | 'simple'
-    | 'underline'
-    | 'nav-title'
-    | 'primary-nav-link'
-    | 'nav-title-link'
-    | 'nav-card-link'
-    | 'secondary-nav-link'
-    | 'footer-nav-link'
-    | 'copyright-link'
-    | 'product-link'
-    | 'd-green-underline'
-    | 'd-white-underline'
-    | 'global'
-    | 'utility-nav-link'
-    | 'standard-link';
+        "theme"?: | "simple"
+		| "underline"
+		| "nav-title"
+		| "primary-nav-link"
+		| "nav-title-link"
+		| "nav-card-link"
+		| "secondary-nav-link"
+		| "footer-nav-link"
+		| "copyright-link"
+		| "product-link"
+		| "d-green-underline"
+		| "d-white-underline"
+		| "global"
+		| "utility-nav-link"
+		| "standard-link";
         /**
           * trackerId added for Mouseflow id
          */
@@ -5471,7 +5827,7 @@ declare namespace LocalJSX {
     }
     interface PtcList {
         "listItems"?: string[];
-        "listType"?: 'list-primary';
+        "listType"?: "list-primary";
     }
     interface PtcMediaCard {
         /**
@@ -5490,7 +5846,7 @@ declare namespace LocalJSX {
         /**
           * Card Type Specify Card Type, default to media card
          */
-        "cardType"?: 'media-card' | 'bureau-card' | 'case-study-icon';
+        "cardType"?: "media-card" | "bureau-card" | "case-study-icon";
         /**
           * Card category
          */
@@ -5502,7 +5858,10 @@ declare namespace LocalJSX {
         /**
           * Card heading text transform
          */
-        "headingTransform"?: 'uppercase' | 'lowercase' | 'capitalize' | 'none';
+        "headingTransform"?: | "uppercase"
+		| "lowercase"
+		| "capitalize"
+		| "none";
         /**
           * Background Hover Image
          */
@@ -5571,7 +5930,10 @@ declare namespace LocalJSX {
         /**
           * Add the border radius  Options: standard | large | pill | circle
          */
-        "borderRadius"?: 'standard' | 'large' | 'pill' | 'circle';
+        "borderRadius"?: | "standard"
+		| "large"
+		| "pill"
+		| "circle";
         "bottomCloseBtn"?: string;
         /**
           * Sets if popup should close if click on outside
@@ -5580,7 +5942,7 @@ declare namespace LocalJSX {
         /**
           * This is to add css class to Modal Form with Content
          */
-        "customClass"?: '';
+        "customClass"?: "";
         /**
           * Sets if popup should overlay
          */
@@ -5605,7 +5967,10 @@ declare namespace LocalJSX {
           * Sets if popup should overlay
          */
         "keepInViewport"?: boolean;
-        "modalType"?: 'video-modal' | 'default-modal' | 'event-listing' | 'thank-you';
+        "modalType"?: | "video-modal"
+		| "default-modal"
+		| "event-listing"
+		| "thank-you";
         /**
           * Event for modal popup closed
          */
@@ -5633,7 +5998,13 @@ declare namespace LocalJSX {
         /**
           * Sets if popup should close if click on outside
          */
-        "size"?: 'sm' | 'md' | 'lg' | 'xl' | 'fit-content' | 'max' | 'sm-modal';
+        "size"?: | "sm"
+		| "md"
+		| "lg"
+		| "xl"
+		| "fit-content"
+		| "max"
+		| "sm-modal";
         /**
           * (optional) Injected CSS Styles
          */
@@ -5655,7 +6026,12 @@ declare namespace LocalJSX {
         "clearAllText"?: string;
         "helpertext"?: string;
         "isRequired"?: boolean;
-        "items"?: Array<{ text: string; selected: boolean; ptcDataEloquaName: string; ptcDataTargetEloquaName: string }>;
+        "items"?: Array<{
+		text: string;
+		selected: boolean;
+		ptcDataEloquaName: string;
+		ptcDataTargetEloquaName: string;
+	}>;
         "label"?: string;
         "onPtcMultiSelectLoaded"?: (event: PtcMultiSelectCustomEvent<void>) => void;
         "placeholderText"?: string;
@@ -5673,7 +6049,7 @@ declare namespace LocalJSX {
         /**
           * Card Type Specify Card Type
          */
-        "cardType"?: 'media-card' | 'links-card' | 'cta-card';
+        "cardType"?: "media-card" | "links-card" | "cta-card";
         /**
           * Card description
          */
@@ -5773,7 +6149,7 @@ declare namespace LocalJSX {
         "onDropdownClickEvent"?: (event: PtcNavSubmenuCustomEvent<any>) => void;
     }
     interface PtcNavTile {
-        "navLinks"?: { title: string; url: string} [];
+        "navLinks"?: { title: string; url: string }[];
     }
     interface PtcNews {
         /**
@@ -5816,38 +6192,45 @@ declare namespace LocalJSX {
         /**
           * Overlay border shape
          */
-        "borderRadius"?: 'radius-standard' | 'radius-large'| 'radius-pill' | 'radius-circle';
+        "borderRadius"?: | "radius-standard"
+		| "radius-large"
+		| "radius-pill"
+		| "radius-circle";
         /**
           * Filter Color
          */
-        "filterColor"?: | 'blue'
-    | 'red'
-    | 'orange'
-    | 'green'
-    | 'black-1'
-    | 'black-2'
-    | 'black-3'
-    | 'black-4'
-    | 'black-5'
-    | 'slate-grey'
-    | 'bright-blue'
-    | 'bright-red'
-    | 'bright-orange'
-    | 'bright-green'
-    | 'bright-slate-grey'
-    | 'solid-black-1'
-    | 'solid-black-2'
-    | 'hp-blue'
-    | 'hp-green'
-    | 'hp-red'
-    | 'hp-gray'
-    | 'hp-orange'
-    | 'transparent'
-    | string;
+        "filterColor"?: | "blue"
+		| "red"
+		| "orange"
+		| "green"
+		| "black-1"
+		| "black-2"
+		| "black-3"
+		| "black-4"
+		| "black-5"
+		| "slate-grey"
+		| "bright-blue"
+		| "bright-red"
+		| "bright-orange"
+		| "bright-green"
+		| "bright-slate-grey"
+		| "solid-black-1"
+		| "solid-black-2"
+		| "hp-blue"
+		| "hp-green"
+		| "hp-red"
+		| "hp-gray"
+		| "hp-orange"
+		| "transparent"
+		| string;
         /**
           * Overlay z-index
          */
-        "overlayZIndex"?: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2';
+        "overlayZIndex"?: | "z-index-auto"
+		| "z-index-n-2"
+		| "z-index-n-1"
+		| "z-index-p-1"
+		| "z-index-p-2";
         /**
           * Injected Styles
          */
@@ -5869,7 +6252,7 @@ declare namespace LocalJSX {
           * (optional) Injected CSS styles
          */
         "styles"?: string;
-        "theme"?: 'events' | 'standard';
+        "theme"?: "events" | "standard";
         "totalCount"?: number;
     }
     interface PtcPara {
@@ -5881,11 +6264,21 @@ declare namespace LocalJSX {
         /**
           * Paragraph font size
          */
-        "fontSize"?: 'xxx-small' | 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large' | 'htmlquote-para';
+        "fontSize"?: | "xxx-small"
+		| "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "htmlquote-para";
         /**
           * Paragraph font weight
          */
-        "fontWeight"?: 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "fontWeight"?: "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         "hideTooltipOnMobile"?: boolean;
         "maxChars"?: number;
         "maxLines"?: number;
@@ -5896,45 +6289,63 @@ declare namespace LocalJSX {
         /**
           * Para text Alignment
          */
-        "paraAlign"?: 'left' | 'center' | 'right' | 'justify' | 'right-768above';
+        "paraAlign"?: | "left"
+		| "center"
+		| "right"
+		| "justify"
+		| "right-768above";
         /**
           * Paragraph Color
          */
-        "paraColor"?: 'primary-grey' | 'primary-green' | 'white' | 'gray-darker';
+        "paraColor"?: | "primary-grey"
+		| "primary-green"
+		| "white"
+		| "gray-darker";
         /**
           * line height
          */
-        "paraLineH"?: 'line-height-densest' | 'line-height-denser' | 'line-height-dense' | 'line-height-normal' | 'line-height-loose' | 'line-height-looser' | 'line-height-p';
+        "paraLineH"?: | "line-height-densest"
+		| "line-height-denser"
+		| "line-height-dense"
+		| "line-height-normal"
+		| "line-height-loose"
+		| "line-height-looser"
+		| "line-height-p";
         /**
           * Paragraph Margin
          */
-        "paraMargin"?: | 'margin-flush'
-    | 'maring-top-1'
-    | 'margin-top-2'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-1'
-    | 'margin-bottom-2'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-1'
-    | 'margin-2'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6';
+        "paraMargin"?: | "margin-flush"
+		| "maring-top-1"
+		| "margin-top-2"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-1"
+		| "margin-bottom-2"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-1"
+		| "margin-2"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6";
         /**
           * Paragraph Style
          */
-        "paraStyle"?: 'default' | 'intro' | 'small' | 'announcement' | 'flush-style' | 'main';
+        "paraStyle"?: | "default"
+		| "intro"
+		| "small"
+		| "announcement"
+		| "flush-style"
+		| "main";
         /**
           * sep z-index
          */
-        "paraZIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-99' | 'z-999';
+        "paraZIndex"?: "z-auto" | "z-1" | "z-2" | "z-3" | "z-99" | "z-999";
         /**
           * (optional) enable support for seo tools that can only view source
          */
@@ -5946,15 +6357,19 @@ declare namespace LocalJSX {
         /**
           * Tooltip position
          */
-        "tooltipPosition"?: 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "tooltipPosition"?: | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top";
         /**
           * (optional) Injected CSS Styles
          */
-        "tooltipTheme"?: 'standard' | 'danger';
+        "tooltipTheme"?: "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "tooltipWidth"?: 'full-width' | 'default';
+        "tooltipWidth"?: "full-width" | "default";
         /**
           * index of hover tooltip element
          */
@@ -5968,7 +6383,10 @@ declare namespace LocalJSX {
         /**
           * Image border shape
          */
-        "borderRadius"?: 'radius-standard' | 'radius-large' | 'radius-pill' | 'radius-circle';
+        "borderRadius"?: | "radius-standard"
+		| "radius-large"
+		| "radius-pill"
+		| "radius-circle";
         /**
           * Disable Image resizing solution
          */
@@ -5976,7 +6394,7 @@ declare namespace LocalJSX {
         /**
           * Display image: inline, inline-block, block
          */
-        "displayImage"?: 'inline' | 'inline-block' | 'block';
+        "displayImage"?: "inline" | "inline-block" | "block";
         /**
           * Set height Value unit: pixles Just put numbers without unit
          */
@@ -5984,11 +6402,11 @@ declare namespace LocalJSX {
         /**
           * (optional) Image alignment
          */
-        "imageAlignment"?: 'left' | 'right' | 'center';
+        "imageAlignment"?: "left" | "right" | "center";
         /**
           * Image Position
          */
-        "imagePosition"?: 'relative' | 'absolute' | 'static';
+        "imagePosition"?: "relative" | "absolute" | "static";
         /**
           * Stretch height to 100%?
          */
@@ -6004,7 +6422,13 @@ declare namespace LocalJSX {
         /**
           * Object Fit Default: cover
          */
-        "objectFit"?: 'cover' | 'fill' | 'contain' | 'scale-down' | 'none' | 'initial' | 'inherit';
+        "objectFit"?: | "cover"
+		| "fill"
+		| "contain"
+		| "scale-down"
+		| "none"
+		| "initial"
+		| "inherit";
         /**
           * Image solution for large screen >=1200px
          */
@@ -6050,6 +6474,10 @@ declare namespace LocalJSX {
     }
     interface PtcPreferanceCenterForm {
     }
+    interface PtcPreloader {
+        "type"?: string | "caption" | "text-body" | "button" | "title" | "divider" | "line" | "multi-line" | "small-para";
+        "width"?: string;
+    }
     interface PtcPreloaderSection {
         "autoShow"?: boolean;
         "numberOfCards"?: number;
@@ -6062,7 +6490,7 @@ declare namespace LocalJSX {
          */
         "styles"?: string;
         "text"?: string | undefined;
-        "theme"?: 'standard' | 'light';
+        "theme"?: "standard" | "light";
     }
     interface PtcPricingAddOnCard {
         /**
@@ -6252,7 +6680,7 @@ declare namespace LocalJSX {
         "onInputChanged"?: (event: PtcProductSidebarCustomEvent<any>) => void;
         "onSelectedResult"?: (event: PtcProductSidebarCustomEvent<any>) => void;
         "selectTechnology"?: string;
-        "suggestionList"?: { categoryName: string, products: string[] }[];
+        "suggestionList"?: { categoryName: string; products: string[] }[];
         "technologyText"?: string;
     }
     interface PtcProgressBar {
@@ -6291,7 +6719,9 @@ declare namespace LocalJSX {
         /**
           * Quote Type
          */
-        "quoteType"?: "image-quote" | "plain-quote" | 'value-led-quote';
+        "quoteType"?: | "image-quote"
+		| "plain-quote"
+		| "value-led-quote";
     }
     interface PtcReadmore {
         /**
@@ -6301,11 +6731,11 @@ declare namespace LocalJSX {
         /**
           * color: Read more text color. Options: default is blue.  'blue' | 'gray' | 'green' | 'initial'
          */
-        "color"?: 'blue' | 'gray' | 'green' | 'initial';
+        "color"?: "blue" | "gray" | "green" | "initial";
         /**
           * @returns string
          */
-        "display"?: 'inline' | 'block';
+        "display"?: "inline" | "block";
         /**
           * isContentSlotted: if the readmore content is from slot,
          */
@@ -6329,15 +6759,20 @@ declare namespace LocalJSX {
         /**
           * Read more text position: left or right
          */
-        "readMorePosition"?: 'left' | 'right' | 'center';
+        "readMorePosition"?: "left" | "right" | "center";
         /**
           * Size: Font size of the read more text. Options small=16px | medium=18px | large=24px
          */
-        "size"?: 'small' | 'medium' | 'large';
+        "size"?: "small" | "medium" | "large";
         /**
           * visible lines
          */
-        "visibleLines"?: 'line1' | 'line2' | 'line3' | 'line4' | 'line5'  | 'line10';
+        "visibleLines"?: | "line1"
+		| "line2"
+		| "line3"
+		| "line4"
+		| "line5"
+		| "line10";
         /**
           * visible lines custom numebr
          */
@@ -6345,7 +6780,7 @@ declare namespace LocalJSX {
         /**
           * index of hover lable
          */
-        "zIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-999';
+        "zIndex"?: "z-auto" | "z-1" | "z-2" | "z-3" | "z-999";
     }
     interface PtcReadmoreChar {
         /**
@@ -6416,9 +6851,9 @@ declare namespace LocalJSX {
     interface PtcResponsiveWrapper {
     }
     interface PtcScrollButton {
-        "direction"?: 'left' | 'right' | 'up' | 'down';
+        "direction"?: "left" | "right" | "up" | "down";
         "isDragging"?: boolean;
-        "orientation"?: 'horizontal' | 'vertical';
+        "orientation"?: "horizontal" | "vertical";
         "scrollAmount"?: number;
         "scrollContainerClass"?: string;
         "styles"?: string;
@@ -6426,7 +6861,7 @@ declare namespace LocalJSX {
     }
     interface PtcSearchField {
         "darkTheme"?: boolean;
-        "elevation"?: 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
+        "elevation"?: "x-small" | "small" | "medium" | "large" | "x-large";
         "enableClear"?: boolean;
         "isNews"?: boolean;
         "onClicked"?: (event: PtcSearchFieldCustomEvent<any>) => void;
@@ -6468,73 +6903,79 @@ declare namespace LocalJSX {
         /**
           * Text Align
          */
-        "textAlign"?: 'left' | 'center' | 'right' | 'inherit';
+        "textAlign"?: "left" | "center" | "right" | "inherit";
         /**
           * Title color
          */
-        "titleColor"?: 'black' | 'white' | 'gray' | 'gray-darker' | 'gray-1';
+        "titleColor"?: "black" | "white" | "gray" | "gray-darker" | "gray-1";
         /**
           * Title heading display : To show line above heading full width or title width
          */
-        "titleDisplay"?: 'block' | 'inline-block';
+        "titleDisplay"?: "block" | "inline-block";
         /**
           * Title line height
          */
-        "titleHeight"?: 'densest' | 'denser' | 'dense' | 'normal' | 'loose' | 'looser' | 'paragraph';
+        "titleHeight"?: | "densest"
+		| "denser"
+		| "dense"
+		| "normal"
+		| "loose"
+		| "looser"
+		| "paragraph";
         /**
           * Title Margin
          */
-        "titleMargin"?: | 'margin-flush'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6'
-    | 'margin-9';
+        "titleMargin"?: | "margin-flush"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6"
+		| "margin-9";
         /**
           * Title Shadow
          */
-        "titleShadow"?: 'blue' | 'red' | 'green' | 'orange' | 'slate-grey';
+        "titleShadow"?: "blue" | "red" | "green" | "orange" | "slate-grey";
         /**
           * Title size
          */
-        "titleSize"?: | 'xx-small'
-    | 'x-small'
-    | 'small'
-    | 'medium'
-    | 'large'
-    | 'x-large'
-    | 'xx-large'
-    | 'xxx-large'
-    | 'xxxx-large'
-    | 'xxxx-large-allbp'
-    | 'xx-large-allbp'
-    | 'xxxx-large-desktop'
-    | 'xxxx-large-store';
+        "titleSize"?: | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "xxxx-large-allbp"
+		| "xx-large-allbp"
+		| "xxxx-large-desktop"
+		| "xxxx-large-store";
         /**
           * Title weight
          */
-        "titleWeight"?: 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "titleWeight"?: "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Title Tag Type
          */
-        "type"?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+        "type"?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
         /**
           * Upperline Style
          */
-        "upperline"?: 'dotted' | 'solid' | 'no-upperline';
+        "upperline"?: "dotted" | "solid" | "no-upperline";
     }
     interface PtcShoppingCart {
         "cartCount"?: string;
         "cartText"?: string;
-        "color"?: 'black' | 'white';
+        "color"?: "black" | "white";
     }
     interface PtcShowcaseCard {
         "headingIconAltText"?: string;
@@ -6627,25 +7068,50 @@ declare namespace LocalJSX {
           * darkFocusState for dark background
          */
         "darkFocusState"?: boolean;
-        "display"?: 'inline-block' | 'block' | 'inline' | 'flex';
+        "display"?: "inline-block" | "block" | "inline" | "flex";
         /**
           * Icon asset color
          */
-        "iconColor"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit';
+        "iconColor"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "primary-gray"
+		| "inherit";
         /**
           * Icon asset hover color
          */
-        "iconHoverColor"?: 'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit';
+        "iconHoverColor"?: | "black"
+		| "white"
+		| "ptc-green"
+		| "gray"
+		| "primary-gray"
+		| "inherit";
         /**
           * Icon Size
          */
-        "iconSize"?: 'small' | 'medium' | 'large' | 'x-large' | 'xx-large' | 'xxx-large' | 'xxxx-large';
+        "iconSize"?: | "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large";
         /**
           * Email recipient. If you want to use mail share, you need to use this property
          */
         "recipient"?: string;
         "shareTitle"?: string;
-        "shareType"?: 'mail' | 'twitter' | 'linkedin' | 'facebook' | 'share-api' | 'download' | 'blog-mail' | 'blog-twitter' | 'blog-linkedin' | 'blog-facebook';
+        "shareType"?: | "mail"
+		| "twitter"
+		| "linkedin"
+		| "facebook"
+		| "share-api"
+		| "download"
+		| "blog-mail"
+		| "blog-twitter"
+		| "blog-linkedin"
+		| "blog-facebook";
         /**
           * Optional - source for linkedin
          */
@@ -6658,29 +7124,53 @@ declare namespace LocalJSX {
         /**
           * Breakpoint
          */
-        "breakpoint"?: '' | 'medium' | 'small' | 'large' | 'x-large' | 'xx-large' | 'x-small' | 'xx-small' | 'xxx-large';
+        "breakpoint"?: | ""
+		| "medium"
+		| "small"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "x-small"
+		| "xx-small"
+		| "xxx-large";
         /**
           * Direction
          */
-        "direction"?: 'vertical' | 'horizontal';
+        "direction"?: "vertical" | "horizontal";
         /**
           * Spacing Size
          */
-        "size"?: 'large' | 'medium' | 'small' | 'x-large' | 'x-small' | 'xx-large' | 'xx-small' | 'xxx-large' | 'xxxx-large' | 'space-144' | 'space-120' | 'space-128';
+        "size"?: | "large"
+		| "medium"
+		| "small"
+		| "x-large"
+		| "x-small"
+		| "xx-large"
+		| "xx-small"
+		| "xxx-large"
+		| "xxxx-large"
+		| "space-144"
+		| "space-120"
+		| "space-128";
     }
     interface PtcSpan {
         /**
           * Display
          */
-        "display"?: 'block' | 'inline-block' | 'inline';
+        "display"?: "block" | "inline-block" | "inline";
         /**
           * Span weight
          */
-        "fontWeight"?: 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "fontWeight"?: "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Span Style
          */
-        "spanStyle"?: 'link-style' | 'tag-style' | 'nav-style' | 'plm-hub-style' | 'plm-hub-style-smaller' | 'blog-tag';
+        "spanStyle"?: | "link-style"
+		| "tag-style"
+		| "nav-style"
+		| "plm-hub-style"
+		| "plm-hub-style-smaller"
+		| "blog-tag";
         /**
           * Injected Styles
          */
@@ -6690,7 +7180,7 @@ declare namespace LocalJSX {
         /**
           * Arrow Direction
          */
-        "arrowDirection"?: 'up' | 'down';
+        "arrowDirection"?: "up" | "down";
         /**
           * Number after the icon
          */
@@ -6745,7 +7235,7 @@ declare namespace LocalJSX {
         /**
           * Display
          */
-        "display"?: 'block' | 'inline' | 'inline-block' | 'flex';
+        "display"?: "block" | "inline" | "inline-block" | "flex";
         /**
           * Injected Styles
          */
@@ -6772,7 +7262,7 @@ declare namespace LocalJSX {
         /**
           * Tab Type
          */
-        "type"?: 'default' | 'tab-with-banner';
+        "type"?: "default" | "tab-with-banner";
     }
     interface PtcTabs {
         "onTabChange"?: (event: PtcTabsCustomEvent<any>) => void;
@@ -6801,7 +7291,10 @@ declare namespace LocalJSX {
         /**
           * (optional) topSlitPosition: It will decide the position of .
          */
-        "slitPosition"?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+        "slitPosition"?: | "top-left"
+		| "top-right"
+		| "bottom-left"
+		| "bottom-right";
         /**
           * (optional) Injected CSS Styles
          */
@@ -6813,7 +7306,10 @@ declare namespace LocalJSX {
         /**
           * Type Specify  Type, default is text-copy-with-background
          */
-        "type"?: 'text-copy-with-background' | 'hero-footer-cta' | 'tab-cta-with-background' | 'case-studies';
+        "type"?: | "text-copy-with-background"
+		| "hero-footer-cta"
+		| "tab-cta-with-background"
+		| "case-studies";
     }
     interface PtcTextfield {
         /**
@@ -6827,7 +7323,9 @@ declare namespace LocalJSX {
         /**
           * Custom Validation - String
          */
-        "customValidation"?: (input: HTMLInputElement | HTMLTextAreaElement) => string;
+        "customValidation"?: (
+		input: HTMLInputElement | HTMLTextAreaElement
+	) => string;
         /**
           * Disable the field
          */
@@ -6884,7 +7382,7 @@ declare namespace LocalJSX {
         /**
           * Text Field Form
          */
-        "textfieldForm"?: 'default' | 'email-signup';
+        "textfieldForm"?: "default" | "email-signup";
         /**
           * text, button, email, file and etc. This value triggers different validation
          */
@@ -6894,7 +7392,7 @@ declare namespace LocalJSX {
         "cardDescription"?: string;
         "cardNumber"?: number;
         "cardTitle"?: string;
-        "modalType"?: 'only-video' | 'video-with-description';
+        "modalType"?: "only-video" | "video-with-description";
         "onVCardClicked"?: (event: PtcTheaterVideoCustomEvent<any>) => void;
         "thumbImg"?: string;
         "videoId"?: number;
@@ -6927,72 +7425,82 @@ declare namespace LocalJSX {
         /**
           * Text Align
          */
-        "textAlign"?: 'left' | 'center' | 'right' | 'inherit';
+        "textAlign"?: "left" | "center" | "right" | "inherit";
         /**
           * Title color
          */
-        "titleColor"?: 'black' | 'white' | 'gray' | 'gray-darker' | 'gray-1';
+        "titleColor"?: "black" | "white" | "gray" | "gray-darker" | "gray-1";
         /**
           * Title heading display : To show line above heading full width or title width
          */
-        "titleDisplay"?: 'block' | 'inline-block';
+        "titleDisplay"?: "block" | "inline-block";
         /**
           * Title line height
          */
-        "titleHeight"?: 'densest' | 'denser' | 'dense' | 'normal' | 'loose' | 'looser' | 'paragraph';
+        "titleHeight"?: | "densest"
+		| "denser"
+		| "dense"
+		| "normal"
+		| "loose"
+		| "looser"
+		| "paragraph";
         /**
           * Title Margin
          */
-        "titleMargin"?: | 'margin-flush'
-    | 'margin-top-3'
-    | 'margin-top-4'
-    | 'margin-top-5'
-    | 'margin-top-6'
-    | 'margin-bottom-3'
-    | 'margin-bottom-4'
-    | 'margin-bottom-5'
-    | 'margin-bottom-6'
-    | 'margin-3'
-    | 'margin-4'
-    | 'margin-5'
-    | 'margin-6'
-    | 'margin-9';
+        "titleMargin"?: | "margin-flush"
+		| "margin-top-3"
+		| "margin-top-4"
+		| "margin-top-5"
+		| "margin-top-6"
+		| "margin-bottom-3"
+		| "margin-bottom-4"
+		| "margin-bottom-5"
+		| "margin-bottom-6"
+		| "margin-3"
+		| "margin-4"
+		| "margin-5"
+		| "margin-6"
+		| "margin-9";
         /**
           * Title Shadow
          */
-        "titleShadow"?: 'blue' | 'red' | 'green' | 'orange' | 'slate-grey';
+        "titleShadow"?: "blue" | "red" | "green" | "orange" | "slate-grey";
         /**
           * Title size
          */
-        "titleSize"?: | 'xx-small'
-    | 'x-small'
-    | 'small'
-    | 'medium'
-    | 'large'
-    | 'x-large'
-    | 'xx-large'
-    | 'xxx-large'
-    | 'xxxx-large'
-    | 'xxxx-large-allbp'
-    | 'xx-large-allbp'
-    | 'xxxx-large-desktop'
-    | 'xxxx-large-store';
+        "titleSize"?: | "xx-small"
+		| "x-small"
+		| "small"
+		| "medium"
+		| "large"
+		| "x-large"
+		| "xx-large"
+		| "xxx-large"
+		| "xxxx-large"
+		| "xxxx-large-allbp"
+		| "xx-large-allbp"
+		| "xxxx-large-desktop"
+		| "xxxx-large-store";
         /**
           * Title weight
          */
-        "titleWeight"?: 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        "titleWeight"?: "w-3" | "w-4" | "w-5" | "w-6" | "w-7" | "w-8" | "w-9";
         /**
           * Tooltip position
          */
-        "tooltipPosition"?: 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "tooltipPosition"?: | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top";
         /**
           * (optional) Injected CSS Styles
          */
-        "tooltipTheme"?: 'standard' | 'danger';
+        "tooltipTheme"?: "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "tooltipWidth"?: 'full-width' | 'default';
+        "tooltipWidth"?: "full-width" | "default";
         /**
           * index of hover tooltip element
          */
@@ -7000,11 +7508,11 @@ declare namespace LocalJSX {
         /**
           * Title Tag Type
          */
-        "type"?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+        "type"?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
         /**
           * Upperline Style
          */
-        "upperline"?: 'dotted' | 'solid' | 'no-upperline';
+        "upperline"?: "dotted" | "solid" | "no-upperline";
     }
     interface PtcTooltip {
         /**
@@ -7023,7 +7531,7 @@ declare namespace LocalJSX {
         /**
           * If tool tip is only for text use 'text-only' otherwise it will wrap content instead of replacing
          */
-        "mode"?: 'wrapper' | 'text-only';
+        "mode"?: "wrapper" | "text-only";
         /**
           * If tooltip noOverflow = "true" then the tooltip will not be visible just ellipses will be visible
          */
@@ -7031,7 +7539,12 @@ declare namespace LocalJSX {
         /**
           * Tooltip position
          */
-        "position"?: 'left' | 'right' | 'bottom' | 'bottom-right' | 'top' | 'side-left';
+        "position"?: | "left"
+		| "right"
+		| "bottom"
+		| "bottom-right"
+		| "top"
+		| "side-left";
         /**
           * (optional) Injected CSS Styles
          */
@@ -7039,7 +7552,7 @@ declare namespace LocalJSX {
         /**
           * Component Display please don't set it to be inline-block
          */
-        "textDisplay"?: 'inline' | 'block';
+        "textDisplay"?: "inline" | "block";
         /**
           * Ellipsis apply to X lines
           * @returns string
@@ -7048,27 +7561,27 @@ declare namespace LocalJSX {
         /**
           * If tool tip is only for text use 'text-only' otherwise it will wrap content instead of replacing
          */
-        "theme"?: 'standard' | 'danger';
+        "theme"?: "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "width"?: 'full-width' | 'default';
+        "width"?: "full-width" | "default";
         /**
           * index of hover element
          */
-        "zIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-999';
+        "zIndex"?: "z-auto" | "z-1" | "z-2" | "z-3" | "z-999";
     }
     interface PtcTooltipV2 {
-        "elementDisplay"?: 'block' | 'inline-block' | 'inline';
+        "elementDisplay"?: "block" | "inline-block" | "inline";
         "hideOnMobile"?: boolean;
         "maxLength"?: number;
         "maxLines"?: number;
-        "position"?: 'top' | 'bottom' | 'left' | 'right';
+        "position"?: "top" | "bottom" | "left" | "right";
         /**
           * (optional) Injected CSS Styles
          */
         "styles"?: string;
-        "width"?: 'full-width' | 'default';
+        "width"?: "full-width" | "default";
         "zIndex"?: number;
     }
     interface PtcTooltipV3 {
@@ -7079,16 +7592,16 @@ declare namespace LocalJSX {
         /**
           * Tooltip position
          */
-        "position"?: 'left' | 'right' | 'bottom' | 'bottom-right' | 'top';
+        "position"?: "left" | "right" | "bottom" | "bottom-right" | "top";
         "styles"?: string;
         /**
           * (optional) Injected CSS Styles
          */
-        "theme"?: 'standard' | 'danger';
+        "theme"?: "standard" | "danger";
         /**
           * This will make the width 100% respective to its parent
          */
-        "width"?: 'full-width' | 'default';
+        "width"?: "full-width" | "default";
         /**
           * index of hover element
          */
@@ -7098,7 +7611,9 @@ declare namespace LocalJSX {
         /**
           * Card Type Specify Card Type,
          */
-        "componentType"?: 'two-column-media' | 'two-column-media-icon-list' | 'two-column-text';
+        "componentType"?: | "two-column-media"
+		| "two-column-media-icon-list"
+		| "two-column-text";
     }
     interface PtcValueLedCard {
         "cardImage"?: string;
@@ -7145,7 +7660,7 @@ declare namespace LocalJSX {
     }
     interface PtcVideoEmbed {
         "src"?: string;
-        "type"?: 'Brightcove' | 'Youtube' | 'HTML';
+        "type"?: "Brightcove" | "Youtube" | "HTML";
         "width"?: number;
     }
     interface PtcWhitePaper {
@@ -7283,6 +7798,7 @@ declare namespace LocalJSX {
         "ptc-picture": PtcPicture;
         "ptc-podcast-card": PtcPodcastCard;
         "ptc-preferance-center-form": PtcPreferanceCenterForm;
+        "ptc-preloader": PtcPreloader;
         "ptc-preloader-section": PtcPreloaderSection;
         "ptc-previous-url": PtcPreviousUrl;
         "ptc-pricing-add-on-card": PtcPricingAddOnCard;
@@ -7466,6 +7982,7 @@ declare module "@stencil/core" {
             "ptc-picture": LocalJSX.PtcPicture & JSXBase.HTMLAttributes<HTMLPtcPictureElement>;
             "ptc-podcast-card": LocalJSX.PtcPodcastCard & JSXBase.HTMLAttributes<HTMLPtcPodcastCardElement>;
             "ptc-preferance-center-form": LocalJSX.PtcPreferanceCenterForm & JSXBase.HTMLAttributes<HTMLPtcPreferanceCenterFormElement>;
+            "ptc-preloader": LocalJSX.PtcPreloader & JSXBase.HTMLAttributes<HTMLPtcPreloaderElement>;
             "ptc-preloader-section": LocalJSX.PtcPreloaderSection & JSXBase.HTMLAttributes<HTMLPtcPreloaderSectionElement>;
             "ptc-previous-url": LocalJSX.PtcPreviousUrl & JSXBase.HTMLAttributes<HTMLPtcPreviousUrlElement>;
             "ptc-pricing-add-on-card": LocalJSX.PtcPricingAddOnCard & JSXBase.HTMLAttributes<HTMLPtcPricingAddOnCardElement>;