@saasquatch/mint-components 1.15.0-2 → 1.15.0-20

package/dist/mint-components/{p-380bfde1.entry.js → p-fd0a013f.entry.js}

@@ -1 +1 @@
-import{r as s,h as t}from"./p-f708da7b.js";import{n as r}from"./p-cd651f81.js";import"./p-cef45012.js";import{T as e}from"./p-c9f1dde7.js";const o=class{constructor(t){s(this,t),this.ignored=!0,this.locale="en",r(this)}disconnectedCallback(){}render(){return t(e,{type:"p"},this.note)}};export{o as sqm_rewards_table_customer_note_cell}
+import{r as s,h as t}from"./p-f708da7b.js";import{n as r}from"./p-cd651f81.js";import"./p-cef45012.js";import{T as e}from"./p-eab1c9f3.js";const o=class{constructor(t){s(this,t),this.ignored=!0,this.locale="en",r(this)}disconnectedCallback(){}render(){return t(e,{type:"p"},this.note)}};export{o as sqm_rewards_table_customer_note_cell}

package/dist/mint-components/p-fdaa4dbb.system.entry.js

@@ -0,0 +1 @@
+System.register(["./p-f26aedcd.system.js","./p-48135f99.system.js","./p-6cd4f2b1.system.js","./p-6333265f.system.js","./p-5488fdd9.system.js","./p-6b7a595f.system.js"],(function(t){"use strict";var e,n,r,a,s,o,i,l,u,c;return{setters:[function(t){e=t.h;n=t.c;r=t.r},function(t){a=t.u;s=t.f;o=t.n},function(t){i=t._},function(t){l=t.g},function(t){u=t.u},function(t){c=t.u}],execute:function(){var p=function(t){var r=t.content,a=t.placement,s=t.textColor,o=s===void 0?"var(--sqm-text)":s;var i=!a||a==="top"||a==="bottom"?"var(--sl-spacing-x-large) 0;":"0 var(--sl-spacing-xx-large);";var l="\n    sl-tab-panel::part(base) {\n      padding: "+i+";\n    }\n\n    sl-tab::part(base) {\n      color: "+o+";\n    }\n  ";console.log("text color is ",o);return e(n,null,e("style",{type:"text/css"},l),e("sl-tab-group",{placement:a},r.tabs.map((function(t){var n=t.getAttribute("slot");if(t.tagName==="RAISINS-PLOP-TARGET"){return e("sl-tab",{slot:"nav"},e("div",{style:{marginTop:"10px"}},e("slot",{name:n})))}return[e("sl-tab",{slot:"nav",panel:n,part:"tab",id:t.getAttribute("id")||n},t.getAttribute("header")),e("sl-tab-panel",{name:n},e("slot",{name:n}))]}))),e("div",{style:{display:"none"}},e("slot",null)))};var v="sq:reveal";function f(){var t=c();var e=i();var n=u();var r=a((function(){return t.filter((function(t){return t.tagName==="SQM-TAB"||t.tagName==="RAISINS-PLOP-TARGET"})).map((function(t,e){if(t.tagName==="RAISINS-PLOP-TARGET"){var n=t;n.style.position="absolute";n.style.left="6px";var r=t.firstElementChild.childNodes[1];r.innerHTML="＋";r.style.lineHeight="20px"}t.setAttribute("slot","tab-"+e);t.setAttribute("id","tab-"+e);return t}))}),[t,n]);s((function(){var t=function(t){var n;var r=t.target;t.stopPropagation();if(!r)return;var a=r.closest("sqm-tabs");if(!e.contains(r)||!a)return;var s=r.closest("sqm-tab");var o=a.shadowRoot.querySelector("sl-tab-group");(n=o)===null||n===void 0?void 0:n.show(s.id)};e.addEventListener(v,t);return function(){e.removeEventListener(v,t)}}),[]);return{content:{tabs:r}}}var m=t("sqm_tabs",function(){function t(t){r(this,t);o(this)}t.prototype.disconnectedCallback=function(){};t.prototype.render=function(){var t=f().content;var n=l(this),r=n.placement,a=n.textColor;return e(p,{placement:r,content:t,textColor:a},e("slot",null))};return t}())}}}));

package/dist/types/components/sqm-big-stat/BigStat.stories.d.ts

@@ -13,4 +13,6 @@ export declare const FlexReverseRight: () => any;
 export declare const FlexReverseLeft: () => any;
 export declare const NoStatValue: () => any;
 export declare const InvalidStatValue: () => any;
+export declare const CustomStyles: () => any;
 export declare const MultipleStats: () => any;
+export declare const MultipleStatsWithCustomBranding: () => any;

package/dist/types/components/sqm-big-stat/sqm-big-stat-view.d.ts

@@ -6,5 +6,10 @@ export interface BigStatViewProps {
   flexReverse?: boolean;
   alignment?: "left" | "right" | "center";
   labelSlot?: VNode;
+  statTextColor?: string;
+  statFontSize?: number;
+  descriptionTextColor?: string;
+  descriptionFontSize?: number;
+  statFontWeight?: number;
 }
 export declare function BigStatView(props: BigStatViewProps): any;

package/dist/types/components/sqm-big-stat/sqm-big-stat.d.ts

@@ -27,6 +27,7 @@ export declare class BigStat {
    *
    * @uiName Flex reverse
    * @default
+   * @uiGroup Style
    */
   flexReverse?: boolean;
   /**
@@ -36,6 +37,7 @@ export declare class BigStat {
    * @uiType string
    * @uiEnum ["left", "right", "center"]
    * @uiEnumNames ["Left", "Right", "Center"]
+   * @uiGroup Style
    */
   alignment?: "left" | "right" | "center";
   /**
@@ -45,6 +47,45 @@ export declare class BigStat {
    * @uiWidget programSelector
    */
   programId?: string;
+  /**
+   * Color of the stat text
+   * @uiName Stat text color
+   * @uiWidget color
+   * @uiType string
+   * @format color
+   * @uiGroup Style
+   */
+  statTextColor?: string;
+  /**
+   * Font size of the stat text in pixels
+   * @uiName Stat font size
+   * @uiType string
+   * @uiGroup Style
+   */
+  statFontSize?: number;
+  /**
+   * Font weight of the stat text
+   * @uiName Stat font weight
+   * @uiGroup Style
+   * @uiEnum [100, 200, 300, 400, 500, 600, 700, 800, 900]
+   * @uiEnumNames ["Thin", "Extra Light", "Light", "Normal", "Medium", "Semi Bold", "Bold", "Extra Bold", "Heavy"]
+   */
+  statFontWeight?: number;
+  /**
+   * Color of the description text
+   * @uiName Description text color
+   * @uiWidget color
+   * @uiType string
+   * @format color
+   * @uiGroup Style
+   */
+  descriptionTextColor?: string;
+  /**
+   * Font size of the description text in pixels
+   * @uiName Description font size
+   * @uiGroup Style
+   */
+  descriptionFontSize?: number;
   /**
    * @undocumented
    * @uiType object

package/dist/types/components/sqm-card-feed/sqm-card-feed.d.ts

@@ -1,7 +1,7 @@
 /**
  * @uiName Card Feed
  * @slots [{"name":"","title":"Cards"}]
- * @validParents ["sqm-brand","sqm-portal-container", "sqm-popup-container-sqm-hero", "sqm-titled-section", "div", "sqm-divided-layout", "template", "sqb-program-section", "sqb-conditional-section"]
+ * @validParents ["sqm-brand","sqm-portal-container", "sqm-popup-container", "sqm-titled-section", "div", "sqm-divided-layout", "template", "sqb-program-section", "sqb-conditional-section"]
  * @validChildren ["sqm-task-card"]
  * @exampleGroup Rewards
  * @example Task Card Feed - <sqm-card-feed gap="24" width="347"> <sqm-task-card reward-amount="20" goal="1" card-title="Complete a Survey" description="Fill out our NPS survey and get 20 points for giving us honest feedback." button-text="Take survey" reward-unit="Points" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 250 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on X" description="Earn 50 points when you Follow Us on X!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Receive one free month for being a committed customer when you upgrade your plan." button-text="Upgrade" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" open-new-tab="false" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> </sqm-card-feed>

package/dist/types/components/sqm-coupon-code/sqm-coupon-code-view.d.ts

@@ -2,5 +2,6 @@ import { CopyTextViewProps } from "../views/copy-text-view";
 export interface CouponCodeViewProps extends CopyTextViewProps {
   errorType?: "error" | "warning" | "info" | "success";
   couponCodeLabel?: string;
+  textColor?: string;
 }
 export declare function CouponCodeView(props: CouponCodeViewProps): any;

package/dist/types/components/sqm-coupon-code/sqm-coupon-code.d.ts

@@ -2,6 +2,7 @@ import { DemoData } from "../../global/demo";
 import { CouponCodeViewProps } from "./sqm-coupon-code-view";
 /**
  * @uiName Coupon Code
+ * @validParents ["sqm-brand","sqm-portal-container","div","sqm-popup-container","sqm-hero","sqm-referral-card","sqm-titled-section", "sqb-program-section", "sqb-conditional-section"]
  * @compatibility Built for instant access
  * @exampleGroup Instant Access
  * @example Coupon Code - <sqm-coupon-code tooltip-text="Copied to Clipboard" tooltip-lifespan="1000"></sqm-coupon-code>
@@ -31,6 +32,7 @@ export declare class CouponCode {
    * @uiType string
    * @uiEnum ["left", "center", "right"]
    * @uiEnumNames ["Left", "Center", "Right"]
+   * @uiGroup Style
    */
   textAlign?: "left" | "center" | "right";
   /**
@@ -44,6 +46,7 @@ export declare class CouponCode {
    * @uiType string
    * @uiEnum ["icon", "button-outside", "button-below"]
    * @uiEnumNames ["Icon", "Button outside", "Button below"]
+   * @uiGroup Style
    */
   buttonStyle?: "icon" | "button-outside" | "button-below";
   /**
@@ -105,6 +108,46 @@ export declare class CouponCode {
    * @uiGroup Coupon code error
    */
   couponCodePlaceholder: string;
+  /**
+   * Border color of share link container (default is set to 1px solid transparent)
+   * @uiName Border color
+   * @uiWidget color
+   * @format color
+   * @uiGroup Style
+   */
+  borderColor?: string;
+  /**
+   * Color of the text and copy icon
+   * @uiName Text color
+   * @uiWidget color
+   * @format color
+   * @uiGroup Style
+   */
+  textColor?: string;
+  /**
+   * The border radius on the share link container (in pixels)
+   * @uiName Border Radius
+   * @uiType number
+   * @uiGroup Style
+   */
+  borderRadius?: string;
+  /**
+   * The type of the button (primary or secondary) that will be used to copy the link.
+   * @uiName Button Type
+   * @uiType string
+   * @uiEnum ["primary", "secondary"]
+   * @uiEnumNames ["Primary", "Secondary"]
+   * @uiGroup Style
+   */
+  buttonType?: "primary" | "secondary";
+  /**
+   * Background color of share link container
+   * @uiName Background color
+   * @uiWidget color
+   * @format color
+   * @uiGroup Style
+   */
+  backgroundColor?: string;
   /**
    * @undocumented
    * @uiType object

package/dist/types/components/sqm-divided-layout/sqm-divided-layout-view.d.ts

@@ -3,6 +3,8 @@ interface DividedLayoutViewProps {
   direction: "row" | "column";
   contentAreaWidth?: string | null;
   dividerStyle: string;
+  backgroundColor?: string;
+  borderless?: boolean;
 }
 export declare function DividedLayoutView(props: DividedLayoutViewProps, children: VNode): any;
 export {};

package/dist/types/components/sqm-divided-layout/sqm-divided-layout.d.ts

@@ -3,6 +3,8 @@
  * Spacing is left up to the child
  *
  * @uiName Divided Layout
+ * @validParents ["sqm-brand","sqm-portal-container","div","sqm-popup-container","sqm-hero","sqm-referral-card","sqm-titled-section","sqb-program-section","sqb-conditional-section"]
+ * @exampleGroup Layout
  * @slots [{"name":"", "title":"Layout Content"}]
  */
 export declare class DividedLayout {
@@ -24,6 +26,12 @@ export declare class DividedLayout {
    * @uiName Border style
    */
   dividerStyle: string;
+  /**
+   * Background color of the divider
+   * @uiName Divider Background Color
+   * @uiWidget color
+   */
+  backgroundColor?: string;
   constructor();
   disconnectedCallback(): void;
   render(): any;

package/dist/types/components/sqm-header-logo/sqm-header-logo.d.ts

@@ -1,5 +1,6 @@
 /**
  * @uiName Header Logo
+ * @validParents ["sqm-portal-frame","div","sqm-brand"]
  */
 export declare class HeroImage {
   /**

package/dist/types/components/sqm-hero/sqm-hero.d.ts

@@ -1,5 +1,6 @@
 /**
  * @uiName Hero Layout
+ * @validParents ["sqm-portal-container","sqm-brand","div"]
  * @slots [{"name":"","title":"Primary Column Content"},{"name":"secondary-column","title":"Secondary Column Content"}]
  * @example Two Column Hero Layout - <sqm-hero background="https://images.unsplash.com/photo-1599676821464-3555954838dc?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1939&amp;q=80" min-height="0" columns="2" padding-size="large" wrap-direction="wrap" secondary-background="lightgrey"><h1>Primary Column Content</h1><h1 slot="secondary-column">Secondary Column Content</h1></sqm-hero>
  * @exampleGroup Layout

package/dist/types/components/sqm-hero-image/sqm-hero-image-view.d.ts

@@ -17,5 +17,6 @@ export interface HeroImageViewProps {
   paddingImage?: Spacing;
   imagePos: "left" | "center" | "right";
   imageMobilePos: "top" | "bottom";
+  buttonType?: "primary" | "secondary";
 }
 export declare function HeroImageView(props: HeroImageViewProps, children: VNode): any;

package/dist/types/components/sqm-hero-image/sqm-hero-image.d.ts

@@ -1,6 +1,7 @@
 import { Spacing } from "../../global/mixins";
 /**
  * @uiName Hero Image
+ * @validParents ["sqm-portal-container","sqm-brand", "div"]
  * @exampleGroup Common Components
  * @example Two Column Hero Image - <sqm-hero-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png" header="MyCompany Rewards" description="Refer a friend and earn up to $1200 in rewards" layout="columns" image-pos="right" background-color="#F9F9F9"></sqm-hero-image>
  * @example Overlay Hero Image - <sqm-hero-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png" header="MyCompany Rewards" description="Refer a friend and earn up to $1200 in rewards" layout="overlay" image-pos="center" background-color="#F9F9F9" button-link="https://www.example.com" button-new-tab button-text="Earn!" image-percentage="45" overlay-opacity=".5" padding-image="small" padding-text="xxxx-large"></sqm-hero-image>
@@ -16,22 +17,26 @@ export declare class HeroImage {
    * @uiName Overlay color
    * @uiWidget color
    * @format color
+   * @uiGroup Style
    */
   overlayColor?: string;
   /**
    * @uiName Overlay opacity
+   * @uiGroup Style
    */
   overlayOpacity: string;
   /**
    * @uiName Text color
    * @uiWidget color
    * @format color
+   * @uiGroup Style
    */
   textColor?: string;
   /**
    * @uiName Background color
    * @uiWidget color
    * @format color
+   * @uiGroup Style
    */
   backgroundColor?: string;
   /**
@@ -39,11 +44,13 @@ export declare class HeroImage {
    * @uiType string
    * @uiEnum ["overlay", "columns"]
    * @uiEnumNames ["Overlay", "Two-column"]
+   * @uiGroup Style
    */
   layout: "overlay" | "columns";
   /**
    * @uiName Image percentage
    * @uiType number
+   * @uiGroup Style
    */
   imagePercentage: number;
   /**
@@ -51,6 +58,7 @@ export declare class HeroImage {
    * @uiType string
    * @uiEnum ["left", "center", "right"]
    * @uiEnumNames ["Left", "Center", "Right"]
+   * @uiGroup Style
    */
   imagePos: "left" | "center" | "right";
   /**
@@ -58,6 +66,7 @@ export declare class HeroImage {
    * @uiType string
    * @uiEnum ["top", "bottom"]
    * @uiEnumNames ["Top", "Bottom"]
+   * @uiGroup Style
    */
   imageMobilePos: "top" | "bottom";
   /**
@@ -87,6 +96,7 @@ export declare class HeroImage {
    * @uiType string
    * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
    * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+   * @uiGroup Style
    */
   paddingText: Spacing;
   /**
@@ -94,8 +104,18 @@ export declare class HeroImage {
    * @uiType string
    * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
    * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+   * @uiGroup Style
    */
   paddingImage: Spacing;
+  /**
+   * The type of the button (primary or secondary) that will be used to copy the link.
+   * @uiName Button Type
+   * @uiType string
+   * @uiEnum ["primary", "secondary"]
+   * @uiEnumNames ["Primary", "Secondary"]
+   * @uiGroup Style
+   */
+  buttonType?: "primary" | "secondary";
   constructor();
   disconnectedCallback(): void;
   render(): any;

package/dist/types/components/sqm-image/sqm-image.d.ts

@@ -1,5 +1,6 @@
 /**
  * @uiName Image
+ * @validParents ["sqm-brand","div","sqm-portal-container","sqm-divided-layout","sqm-titled-section", "sqb-program-section", "sqb-conditional-section"]
  * @exampleGroup Common Components
  * @example Image - <sqm-image image-url="https://res.cloudinary.com/saasquatch/image/upload/v1644000259/squatch-assets/tn47wOj.png" alignment="center"></sqm-image>
  */

package/dist/types/components/sqm-instant-access-registration/sqm-instant-access-registration.d.ts

@@ -2,6 +2,7 @@ import { DemoData } from "../../global/demo";
 import { EmailRegistrationViewProps } from "../views/email-registration-view";
 /**
  * @uiName Instant Access Registration
+ * @validParents ["sqm-portal-container","div","sqm-hero","template", "sqb-program-section", "sqb-conditional-section"]
  * @compatibility Built for instant access
  * @exampleGroup Instant Access
  * @example Instant Access Registration - <sqm-instant-access-registration></sqm-instant-access-registration>

package/dist/types/components/sqm-leaderboard/Leaderboard.stories.d.ts

@@ -11,6 +11,7 @@ export declare const Essentials: () => any;
 export declare const One: () => any;
 export declare const Five: () => any;
 export declare const ReferralLeaderboard: () => any;
+export declare const ReferralLeaderboardWithCustomStyles: () => any;
 export declare const ReferralLeaderboardWithMaxWidth: () => any;
 export declare const PointsLeaderboard: () => any;
 export declare const TenWithRank: () => any;

package/dist/types/components/sqm-leaderboard/sqm-leaderboard-view.d.ts

@@ -11,10 +11,16 @@ export interface LeaderboardViewProps {
       showRank?: boolean;
       hideViewer?: boolean;
       viewingUserText?: string;
+      viewingUserHighlightColor?: string;
+      viewingUserHighlightTextColor?: string;
       hideNames?: boolean;
       anonymousUser?: string;
       rankSuffix?: string;
       width?: string;
+      background?: string;
+      borderColor?: string;
+      textColor?: string;
+      borderRadius?: number;
     };
   };
   data: {

package/dist/types/components/sqm-leaderboard/sqm-leaderboard.d.ts

@@ -2,6 +2,7 @@ import { DemoData } from "../../global/demo";
 import { LeaderboardViewProps } from "./sqm-leaderboard-view";
 /**
  * @uiName Leaderboard
+ * @validParents ["sqm-portal-container","div","sqm-hero","sqm-instant-access-registration","sqm-brand","sqb-program-section","sqb-conditional-section"]
  * @slots [{"name":"empty", "title":"Empty State"}]
  * @requiredFeatures ["LEADERBOARDS"]
  * @exampleGroup Leaderboard
@@ -48,13 +49,6 @@ export declare class Leaderboard {
    * @uiName Rank Suffix
    */
   rankSuffix: string;
-  /**
-   * Hide the viewer's leaderboard row if not in the top results.
-   *
-   * @uiName Hide viewing user
-   * @default
-   */
-  hideViewer: boolean;
   /**
    * @uiName Viewing user text
    */
@@ -98,6 +92,54 @@ export declare class Leaderboard {
    * @uiName Maximum rows number
    */
   maxRows: number;
+  /**
+   * Hide the viewer's leaderboard row if not in the top results.
+   *
+   * @uiName Hide viewing user
+   * @default
+   */
+  hideViewer: boolean;
+  /**
+   * Changes the background color of the viewing user row in the leaderboard.
+   * @uiName Viewing User Highlight Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  viewingUserHighlightColor?: string;
+  /**
+   * Changes the text color of the viewing user row in the leaderboard.
+   * @uiName Viewing User Text Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  viewingUserHighlightTextColor?: string;
+  /**
+   * Changes the background color of the leaderboard.
+   * @uiName Background Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  background?: string;
+  /**
+   * Changes the border color of the table rows.
+   * @uiName Border Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  borderColor?: string;
+  /**
+   * Text color of the leaderboard.
+   * @uiName Text Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  textColor?: string;
+  /**
+   * Leaderboard border radius in pixels.
+   * @uiName Border Radius
+   * @uiGroup Style
+   */
+  borderRadius?: number;
   /**
    * @undocumented
    * @uiType object

package/dist/types/components/sqm-leaderboard/useLeaderboard.d.ts

@@ -16,6 +16,12 @@ export interface LeaderboardProps {
   maxRows: number;
   programId?: string;
   interval: string;
+  viewingUserHighlightColor?: string;
+  viewingUserHighlightTextColor?: string;
+  background?: string;
+  borderColor?: string;
+  textColor?: string;
+  borderRadius?: number;
   empty: VNode;
   demoProps?: LeaderboardViewProps;
 }

package/dist/types/components/sqm-navigation-menu/sqm-navigation-menu.d.ts

@@ -2,6 +2,7 @@ import { NavigationMenuViewProps } from "./sqm-navigation-menu-view";
 import { DemoData } from "../../global/demo";
 /**
  * @uiName Navigation Menu
+ * @validParents ["sqm-portal-container","div","sqm-brand","sqm-divided-layout"]
  */
 export declare class NavigationMenu {
   ignored: boolean;

package/dist/types/components/sqm-navigation-sidebar/sqm-navigation-sidebar-view.d.ts

@@ -2,5 +2,6 @@ import { VNode } from "../../stencil-public-runtime";
 export interface NavigationSidebarViewProps {
   checked?: boolean;
   onClick?: (e: MouseEvent) => void;
+  mobileMenuColor?: string;
 }
 export declare function NavigationSidebarView(props: NavigationSidebarViewProps, children: VNode): any;

package/dist/types/components/sqm-navigation-sidebar/sqm-navigation-sidebar.d.ts

@@ -1,9 +1,25 @@
+import { NavigationSidebarViewProps } from "./sqm-navigation-sidebar-view";
+import { DemoData } from "../../global/demo";
 /**
  * @uiName Microsite Sidebar
+ * @validParents ["div","sqm-divided-layout","template","sqm-portal-container","sqm-brand"]
+ * @validChildren ["sqm-navigation-sidebar-item"]
  * @slots [{"name":"", "title":"Sidebar Content"}]
  */
 export declare class NavigationSidebar {
   ignored: boolean;
+  /**
+   * @uiName Text color
+   * @uiWidget color
+   * @format color
+   * @uiGroup Style
+   */
+  mobileMenuColor?: string;
+  /**
+   * @undocumented
+   * @uiType object
+   */
+  demoData?: DemoData<NavigationSidebarViewProps>;
   constructor();
   disconnectedCallback(): void;
   render(): any;

package/dist/types/components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item-view.d.ts

@@ -7,5 +7,13 @@ export interface NavigationSidebarItemViewProps {
     icon: string;
     path: string;
   };
+  backgroundColor?: string;
+  backgroundHoverColor?: string;
+  textColor?: string;
+  textHoverColor?: string;
+  borderRadius?: number;
+  backgroundFocusedColor?: string;
+  textFocusedColor?: string;
+  padding?: string;
 }
 export declare function NavigationSidebarItemView(props: NavigationSidebarItemViewProps): any;

package/dist/types/components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item.d.ts

@@ -1,5 +1,6 @@
 import { DemoData } from "../../global/demo";
 import { NavigationSidebarItemViewProps } from "./sqm-navigation-sidebar-item-view";
+import { Spacing } from "../../global/mixins";
 /**
  * @uiName Microsite Sidebar Item
  * @validParents ["sqm-navigation-sidebar"]
@@ -16,12 +17,68 @@ export declare class NavigationSidebarItem {
    * Options available at https://shoelace.style/components/icon
    *
    * @uiName Icon
+   * @uiGroup Style
    */
   icon: string;
   /**
    * @uiName Label
    */
   label: string;
+  /**
+   * Background color of the nav item
+   * @uiName Background Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  backgroundColor?: string;
+  /**
+   * Background color of the nav item when hovered
+   * @uiName Background Hover Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  backgroundHoverColor?: string;
+  /**
+   * Background color of the nav item when focused
+   * @uiName Background Focused Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  backgroundFocusedColor?: string;
+  /**
+   * Text color of the nav item
+   * @uiName Text Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  textColor?: string;
+  /**
+   * Text color of the nav item when hovered
+   * @uiName Text Hover Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  textHoverColor?: string;
+  /**
+   * Text color of the nav item when items is focused
+   * @uiName Text Focused Color
+   * @uiWidget color
+   * @uiGroup Style
+   */
+  textFocusedColor?: string;
+  /**
+   * Border radius (in number of pixels)
+   * @uiName Border Radius
+   * @uiGroup Style
+   */
+  borderRadius?: number;
+  /**
+   * @uiName Padding
+   * @uiType string
+   * @uiEnum ["none", "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "xxxx-large"]
+   * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
+   */
+  padding?: Spacing;
   /**
    * @undocumented
    * @uiType object

package/dist/types/components/sqm-pagination/sqm-pagination-view.d.ts

@@ -11,5 +11,6 @@ export interface PaginationViewProps {
     onNext: (e: Event) => void;
     onPrev: (e: Event) => void;
   };
+  buttonType?: "primary" | "secondary";
 }
 export declare function PaginationView(props: PaginationViewProps): any;

package/dist/types/components/sqm-pagination/sqm-pagination.d.ts

@@ -11,6 +11,15 @@ export declare class Pagination {
    * @uiName Pagination text
    */
   paginationText: string;
+  /**
+   * The type of the button (primary or secondary) that will be used to copy the link.
+   * @uiName Button Type
+   * @uiType string
+   * @uiEnum ["primary", "secondary"]
+   * @uiEnumNames ["Primary", "Secondary"]
+   * @uiGroup Style
+   */
+  buttonType?: "primary" | "secondary";
   /**
    * @undocumented
    * @uiType object

package/dist/types/components/sqm-portal-change-password/sqm-portal-change-password.d.ts

@@ -2,6 +2,7 @@ import { PortalChangePasswordViewProps } from "./sqm-portal-change-password-view
 import { DemoData } from "../../global/demo";
 /**
  * @uiName Microsite Password Change
+ * @validParents ["sqm-portal-container","div","sqm-divided-layout","sqm-brand"]
  */
 export declare class PortalChangePassword {
   ignored: boolean;

package/dist/types/components/sqm-portal-footer/sqm-portal-footer.d.ts

@@ -1,5 +1,6 @@
 /**
  * @uiName Footer
+ * @validParents ["div","sqm-brand","sqm-portal-container"]
  */
 export declare class PortalFooter {
   ignored: boolean;

package/dist/types/components/sqm-portal-frame/sqm-portal-frame-view.d.ts

@@ -8,5 +8,6 @@ export interface PortalFrameViewProps {
     rerender: Function;
   };
   notFullScreen?: boolean;
+  backgroundColor?: string;
 }
 export declare function PortalFrameView(props: PortalFrameViewProps, children: VNode): any;