@ptcwebops/ptcw-design 0.8.0 → 0.8.1

package/dist/types/components.d.ts

@@ -198,7 +198,16 @@ export namespace Components {
         /**
           * 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';
+        "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';
         /**
           * Event Type
          */
@@ -241,24 +250,37 @@ export namespace Components {
         "target"?: string;
     }
     interface PtcCardBottom {
-        "cardType": 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist';
+        "cardType": 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist' | 'extra-tall' | 'color-outlined';
         /**
           * (optional) Injected CSS styles
          */
         "styles"?: string;
     }
     interface PtcCardContent {
-        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro' | 'card-dynamic';
+        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro' | 'card-dynamic' | 'extra-tall' | 'color-outlined';
+        "outlineColor"?: 'o-red' | 'o-orange' | 'o-blue' | 'o-slate-grey' | 'o-green';
         /**
           * (optional) Injected CSS styles
          */
         "styles"?: string;
     }
-    interface PtcCardPlm {
+    interface PtcCardWrapper {
+        /**
+          * Card link
+         */
         "cardLink": string;
-        "cardType": 'card-video'| 'card-tall' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro'| 'card-2up';
-        "linkTarget": string;
-        "linkTitle": string;
+        /**
+          * Card Type
+         */
+        "cardType": 'card-video' | 'card-tall' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro' | 'card-2up' | 'extra-tall' | 'color-outlined';
+        /**
+          * link Target
+         */
+        "linkTarget"?: string;
+        /**
+          * link Title
+         */
+        "linkTitle"?: string;
     }
     interface PtcCheckbox {
         "checked": 'checked' | 'unchecked';
@@ -358,10 +380,14 @@ export namespace Components {
           * Hero Background Image URL
          */
         "bgUrl": string;
+        /**
+          * Content Alignment
+         */
+        "contentAlignment"?: 'left' | 'right' | 'center';
         /**
           * Hero Type
          */
-        "heroType": 'jumbotron' | 'footer-cta';
+        "heroType": 'jumbotron' | 'footer-cta' | 'simple';
     }
     interface PtcHeroFooterCta {
         "backgroundImage": string;
@@ -442,6 +468,10 @@ export namespace Components {
           * href
          */
         "href": string | undefined;
+        /**
+          * Optional Link Area
+         */
+        "linkArea"?: 'link-area-cover-parent';
         /**
           * Title
          */
@@ -453,7 +483,7 @@ export namespace Components {
         /**
           * Theme
          */
-        "theme": 'simple' | 'underline' | 'arrow' | 'nav-title'| 'primary-nav-link' | 'nav-title-link' | 'secondary-nav-link' | 'footer-nav-link' | 'copyright-link' | 'arrow-plm' | 'product-link';
+        "theme": 'simple' | 'underline' | 'arrow' | 'nav-title'| 'primary-nav-link' | 'nav-title-link' | 'secondary-nav-link' | 'footer-nav-link' | 'copyright-link' | 'arrow-plm' | 'product-link' | 'd-green-underline' | 'd-white-underline';
         /**
           * Uppercase
          */
@@ -489,10 +519,6 @@ export namespace Components {
           * Confirm Text - translation goes here
          */
         "ensureBtnText": string;
-        /**
-          * link url
-         */
-        "linkUrl": string;
         /**
           * Mobile select list title (Optional)
          */
@@ -591,6 +617,10 @@ export namespace Components {
           * Paragraph font weight
          */
         "fontWeight": 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        /**
+          * Para text Alignment
+         */
+        "paraAlign"?: 'left' | 'center' | 'right' | 'justify';
         /**
           * Paragraph Color
          */
@@ -598,15 +628,37 @@ export namespace Components {
         /**
           * 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';
+        /**
+          * sep z-index
+         */
+        "paraZIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-99' | 'z-999';
     }
     interface PtcPicture {
         /**
@@ -843,18 +895,18 @@ export namespace Components {
         /**
           * 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'
+        "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';
         /**
           * Title Shadow
@@ -939,6 +991,10 @@ export interface PtcCardContentCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPtcCardContentElement;
 }
+export interface PtcCardWrapperCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPtcCardWrapperElement;
+}
 export interface PtcCheckboxCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPtcCheckboxElement;
@@ -1044,11 +1100,11 @@ declare global {
         prototype: HTMLPtcCardContentElement;
         new (): HTMLPtcCardContentElement;
     };
-    interface HTMLPtcCardPlmElement extends Components.PtcCardPlm, HTMLStencilElement {
+    interface HTMLPtcCardWrapperElement extends Components.PtcCardWrapper, HTMLStencilElement {
     }
-    var HTMLPtcCardPlmElement: {
-        prototype: HTMLPtcCardPlmElement;
-        new (): HTMLPtcCardPlmElement;
+    var HTMLPtcCardWrapperElement: {
+        prototype: HTMLPtcCardWrapperElement;
+        new (): HTMLPtcCardWrapperElement;
     };
     interface HTMLPtcCheckboxElement extends Components.PtcCheckbox, HTMLStencilElement {
     }
@@ -1315,7 +1371,7 @@ declare global {
         "ptc-card": HTMLPtcCardElement;
         "ptc-card-bottom": HTMLPtcCardBottomElement;
         "ptc-card-content": HTMLPtcCardContentElement;
-        "ptc-card-plm": HTMLPtcCardPlmElement;
+        "ptc-card-wrapper": HTMLPtcCardWrapperElement;
         "ptc-checkbox": HTMLPtcCheckboxElement;
         "ptc-collapse-list": HTMLPtcCollapseListElement;
         "ptc-container": HTMLPtcContainerElement;
@@ -1565,7 +1621,16 @@ declare namespace LocalJSX {
         /**
           * 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';
+        "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';
         /**
           * Event Type
          */
@@ -1608,7 +1673,7 @@ declare namespace LocalJSX {
         "target"?: string;
     }
     interface PtcCardBottom {
-        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist';
+        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'card-playlist' | 'extra-tall' | 'color-outlined';
         "onHoverEvent"?: (event: PtcCardBottomCustomEvent<void>) => void;
         "onLeaveEvent"?: (event: PtcCardBottomCustomEvent<void>) => void;
         /**
@@ -1617,19 +1682,34 @@ 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';
+        "cardType"?: 'card-video' | 'card-tall' | 'card-2up' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro' | 'card-dynamic' | 'extra-tall' | 'color-outlined';
         "onHoverEvent"?: (event: PtcCardContentCustomEvent<void>) => void;
         "onLeaveEvent"?: (event: PtcCardContentCustomEvent<void>) => void;
+        "outlineColor"?: 'o-red' | 'o-orange' | 'o-blue' | 'o-slate-grey' | 'o-green';
         /**
           * (optional) Injected CSS styles
          */
         "styles"?: string;
     }
-    interface PtcCardPlm {
+    interface PtcCardWrapper {
+        /**
+          * Card link
+         */
         "cardLink"?: string;
-        "cardType"?: 'card-video'| 'card-tall' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro'| 'card-2up';
+        /**
+          * Card Type
+         */
+        "cardType"?: 'card-video' | 'card-tall' | 'card-wide' | 'speed-bump' | 'card-playlist' | 'card-video-intro' | 'card-2up' | 'extra-tall' | 'color-outlined';
+        /**
+          * link Target
+         */
         "linkTarget"?: string;
+        /**
+          * link Title
+         */
         "linkTitle"?: string;
+        "onHoverEvent"?: (event: PtcCardWrapperCustomEvent<void>) => void;
+        "onLeaveEvent"?: (event: PtcCardWrapperCustomEvent<void>) => void;
     }
     interface PtcCheckbox {
         "checked"?: 'checked' | 'unchecked';
@@ -1737,10 +1817,14 @@ declare namespace LocalJSX {
           * Hero Background Image URL
          */
         "bgUrl"?: string;
+        /**
+          * Content Alignment
+         */
+        "contentAlignment"?: 'left' | 'right' | 'center';
         /**
           * Hero Type
          */
-        "heroType"?: 'jumbotron' | 'footer-cta';
+        "heroType"?: 'jumbotron' | 'footer-cta' | 'simple';
     }
     interface PtcHeroFooterCta {
         "backgroundImage"?: string;
@@ -1821,6 +1905,10 @@ declare namespace LocalJSX {
           * href
          */
         "href"?: string | undefined;
+        /**
+          * Optional Link Area
+         */
+        "linkArea"?: 'link-area-cover-parent';
         /**
           * Title
          */
@@ -1832,7 +1920,7 @@ declare namespace LocalJSX {
         /**
           * Theme
          */
-        "theme"?: 'simple' | 'underline' | 'arrow' | 'nav-title'| 'primary-nav-link' | 'nav-title-link' | 'secondary-nav-link' | 'footer-nav-link' | 'copyright-link' | 'arrow-plm' | 'product-link';
+        "theme"?: 'simple' | 'underline' | 'arrow' | 'nav-title'| 'primary-nav-link' | 'nav-title-link' | 'secondary-nav-link' | 'footer-nav-link' | 'copyright-link' | 'arrow-plm' | 'product-link' | 'd-green-underline' | 'd-white-underline';
         /**
           * Uppercase
          */
@@ -1868,10 +1956,6 @@ declare namespace LocalJSX {
           * Confirm Text - translation goes here
          */
         "ensureBtnText"?: string;
-        /**
-          * link url
-         */
-        "linkUrl"?: string;
         /**
           * Mobile select list title (Optional)
          */
@@ -1979,6 +2063,10 @@ declare namespace LocalJSX {
           * Paragraph font weight
          */
         "fontWeight"?: 'w-3' | 'w-4' | 'w-5' | 'w-6' | 'w-7' | 'w-8' | 'w-9';
+        /**
+          * Para text Alignment
+         */
+        "paraAlign"?: 'left' | 'center' | 'right' | 'justify';
         /**
           * Paragraph Color
          */
@@ -1986,15 +2074,37 @@ declare namespace LocalJSX {
         /**
           * 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';
+        /**
+          * sep z-index
+         */
+        "paraZIndex"?: 'z-auto' | 'z-1' | 'z-2' | 'z-3' | 'z-99' | 'z-999';
     }
     interface PtcPicture {
         /**
@@ -2231,18 +2341,18 @@ declare namespace LocalJSX {
         /**
           * 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'
+        "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';
         /**
           * Title Shadow
@@ -2318,7 +2428,7 @@ declare namespace LocalJSX {
         "ptc-card": PtcCard;
         "ptc-card-bottom": PtcCardBottom;
         "ptc-card-content": PtcCardContent;
-        "ptc-card-plm": PtcCardPlm;
+        "ptc-card-wrapper": PtcCardWrapper;
         "ptc-checkbox": PtcCheckbox;
         "ptc-collapse-list": PtcCollapseList;
         "ptc-container": PtcContainer;
@@ -2379,7 +2489,7 @@ declare module "@stencil/core" {
             "ptc-card": LocalJSX.PtcCard & JSXBase.HTMLAttributes<HTMLPtcCardElement>;
             "ptc-card-bottom": LocalJSX.PtcCardBottom & JSXBase.HTMLAttributes<HTMLPtcCardBottomElement>;
             "ptc-card-content": LocalJSX.PtcCardContent & JSXBase.HTMLAttributes<HTMLPtcCardContentElement>;
-            "ptc-card-plm": LocalJSX.PtcCardPlm & JSXBase.HTMLAttributes<HTMLPtcCardPlmElement>;
+            "ptc-card-wrapper": LocalJSX.PtcCardWrapper & JSXBase.HTMLAttributes<HTMLPtcCardWrapperElement>;
             "ptc-checkbox": LocalJSX.PtcCheckbox & JSXBase.HTMLAttributes<HTMLPtcCheckboxElement>;
             "ptc-collapse-list": LocalJSX.PtcCollapseList & JSXBase.HTMLAttributes<HTMLPtcCollapseListElement>;
             "ptc-container": LocalJSX.PtcContainer & JSXBase.HTMLAttributes<HTMLPtcContainerElement>;