@pantheon-systems/pds-toolkit-react 1.0.0-dev.200 → 1.0.0-dev.202

package/_dist/components/ComparisonList/ComparisonList.d.ts

@@ -5,7 +5,7 @@ interface TypeLabels {
     notIncluded: string;
     addon: string;
 }
-interface ListItems {
+export interface ListItems {
     text: string;
     type: 'included' | 'notIncluded' | 'addon';
 }

package/_dist/components/PantheonLogo/PantheonLogo.d.ts

@@ -1,6 +1,6 @@
 import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import './pantheon-logo.css';
-export type PantheonLogoDisplayType = 'full' | 'icon' | 'wordmark' | 'sub-brand';
+export type PantheonLogoDisplayType = 'full' | 'icon' | 'wordmark' | 'sub-brand' | 'sub-brand-small';
 /**
  * Prop types for PantheonLogo
  */

package/_dist/components/badges/StatusBadge/StatusBadge.d.ts

@@ -23,7 +23,7 @@ export interface StatusBadgeProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Status type for badge. Only renders if `hasStatusIndicator` is true.
      */
-    statusType: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
+    statusType?: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
     /**
      * Additional class names
      */

package/_dist/components/buttons/MenuButton/MenuButton.d.ts

@@ -38,6 +38,10 @@ interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
      * Horizontal position of the menu relative to the button. Applies to breakpoints `md` and up.
      */
     menuPosition?: 'start' | 'end';
+    /**
+     * Optional callback function for when the button is clicked or activated by the keyboard.
+     */
+    onClick?: () => void;
     /**
      * Which size of button to render.
      */
@@ -66,5 +70,5 @@ interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
 /**
  * MenuButton UI component
  */
-export declare const MenuButton: ({ disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: MenuButtonProps) => React.JSX.Element;
+export declare const MenuButton: ({ disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, onClick, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: MenuButtonProps) => React.JSX.Element;
 export {};

package/_dist/components/cards/PricingCard/PricingCard.d.ts

@@ -1,65 +1,90 @@
-export function PricingCard({ actionPrimary, actionSecondary, hasComparisonList, onTierChange, planDescription, planName, planPricingData, statusBadgeLabels, selectLabel, statusBadgeType, className, ...props }: {
-    [x: string]: any;
-    actionPrimary: any;
-    actionSecondary: any;
+import React, { ComponentPropsWithoutRef } from 'react';
+import { ListItems } from '@components/ComparisonList/ComparisonList';
+import './pricing-card.css';
+interface PrimaryCallToAction {
+    type?: 'button' | 'link';
+    variant?: 'primary' | 'secondary';
+    label?: string;
+    buttonAction?: () => void;
+    linkUrl?: string;
+    linkTarget?: string;
+    disabled?: boolean;
+}
+interface SecondaryCallToAction {
+    type?: 'button' | 'link';
+    label?: string;
+    buttonAction?: () => void;
+    linkUrl?: string;
+    linkTarget?: string;
+}
+interface PlanPricingData {
+    customActionLabel?: string;
+    label?: string;
+    pricePrefix?: string;
+    price?: string;
+    priceDetails?: string;
+    savingsBadgeLabel?: string;
+    savingsDetails?: string;
+    listLabel?: string;
+    listItems?: ListItems[];
+}
+interface StatusBadgeLabels {
+    currentPlan?: string;
+    mostPopular?: string;
+}
+interface PricingCardProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * The primary call to action.
+     */
+    actionPrimary?: PrimaryCallToAction;
+    /**
+     * An optional secondary call to action.
+     */
+    actionSecondary?: SecondaryCallToAction;
+    /**
+     * Has comparison list. Will be rendered below the card if true.
+     * Add corresponding `comparisonListId` to each planPricingData object.
+     */
     hasComparisonList?: boolean;
-    onTierChange: any;
-    planDescription: any;
-    planName: any;
-    planPricingData: any;
-    statusBadgeLabels?: {
-        currentPlan: string;
-        mostPopular: string;
-    };
+    /**
+     * Optional function to handle the change event of the select input. Only valid when multiple tiers of planPricingData are present.
+     */
+    onTierChange?: (value: any) => void;
+    /**
+     * A brief description of the plan.
+     */
+    planDescription?: string;
+    /**
+     * The name of the plan.
+     */
+    planName?: string;
+    /**
+     * Plan pricing data. An array of objects.
+     */
+    planPricingData: PlanPricingData[];
+    /**
+     * Label for the plan size select dropdown. Available to screen readers only. Provide translation string if needed.
+     */
     selectLabel?: string;
-    statusBadgeType: any;
-    className: any;
-}): React.JSX.Element;
-export namespace PricingCard {
-    namespace propTypes {
-        let actionPrimary: PropTypes.Requireable<PropTypes.InferProps<{
-            type: PropTypes.Requireable<string>;
-            variant: PropTypes.Requireable<string>;
-            label: PropTypes.Requireable<string>;
-            buttonAction: PropTypes.Requireable<(...args: any[]) => any>;
-            linkUrl: PropTypes.Requireable<string>;
-            linkTarget: PropTypes.Requireable<string>;
-            disabled: PropTypes.Requireable<boolean>;
-        }>>;
-        let actionSecondary: PropTypes.Requireable<PropTypes.InferProps<{
-            type: PropTypes.Requireable<string>;
-            label: PropTypes.Requireable<string>;
-            buttonAction: PropTypes.Requireable<(...args: any[]) => any>;
-            linkUrl: PropTypes.Requireable<string>;
-            linkTarget: PropTypes.Requireable<string>;
-        }>>;
-        let hasComparisonList: PropTypes.Requireable<boolean>;
-        let onTierChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let planDescription: PropTypes.Requireable<string>;
-        let planName: PropTypes.Requireable<string>;
-        let planPricingData: PropTypes.Requireable<PropTypes.InferProps<{
-            customActionLabel: PropTypes.Requireable<string>;
-            label: PropTypes.Requireable<string>;
-            pricePrefix: PropTypes.Requireable<string>;
-            price: PropTypes.Requireable<string>;
-            priceDetails: PropTypes.Requireable<string>;
-            savingsBadgeLabel: PropTypes.Requireable<string>;
-            savingsDetails: PropTypes.Requireable<string>;
-            listLabel: PropTypes.Requireable<string>;
-            listItems: PropTypes.Requireable<PropTypes.InferProps<{
-                text: PropTypes.Requireable<string>;
-                type: PropTypes.Requireable<string>;
-            }>[]>;
-        }>[]>;
-        let selectLabel: PropTypes.Requireable<string>;
-        let statusBadgeLabels: PropTypes.Requireable<PropTypes.InferProps<{
-            currentPlan: PropTypes.Requireable<string>;
-            mostPopular: PropTypes.Requireable<string>;
-        }>>;
-        let statusBadgeType: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-        let containerClassName: PropTypes.Requireable<string>;
-    }
+    /**
+     * Status badge labels. Provide translation strings if needed.
+     */
+    statusBadgeLabels: StatusBadgeLabels;
+    /**
+     * Status badge type. Leave empty for no badge. Only one badge of each type should be used in a group of Pricing Cards.
+     */
+    statusBadgeType?: 'currentPlan' | 'mostPopular';
+    /**
+     * Additional class names for the card item.
+     */
+    className?: string;
+    /**
+     * Additional class names for the card container.
+     */
+    containerClassName?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * PricingCard UI component
+ */
+export declare const PricingCard: ({ actionPrimary, actionSecondary, hasComparisonList, onTierChange, planDescription, planName, planPricingData, statusBadgeLabels, selectLabel, statusBadgeType, className, ...props }: PricingCardProps) => React.JSX.Element;
+export {};

package/_dist/components/footer/FooterHeading/FooterHeading.d.ts

@@ -1,15 +1,22 @@
-export function FooterHeading({ headingLevel, headingText, className, ...props }: {
-    [x: string]: any;
-    headingLevel?: string;
-    headingText: any;
-    className: any;
-}): React.JSX.Element;
-export namespace FooterHeading {
-    namespace propTypes {
-        let headingLevel: PropTypes.Requireable<string>;
-        let headingText: PropTypes.Validator<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+import React, { ComponentPropsWithoutRef } from 'react';
+import './footer-heading.css';
+import type { HeadingLevel } from '@libs/types/custom-types';
+interface FooterHeadingProps {
+    /**
+     *  Heading level
+     */
+    headingLevel?: HeadingLevel;
+    /**
+     * Heading text
+     */
+    headingText: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Footer Heading UI component
+ */
+export declare const FooterHeading: ({ headingLevel, headingText, className, ...props }: FooterHeadingProps & ComponentPropsWithoutRef<HeadingLevel>) => React.JSX.Element;
+export {};

package/_dist/components/footer/FooterLinks/FooterLinks.d.ts

@@ -1,17 +1,26 @@
-export function FooterLinks({ headingLevel, headingText, linkItems, className, ...props }: {
-    [x: string]: any;
-    headingLevel: any;
-    headingText: any;
-    linkItems: any;
-    className: any;
-}): React.JSX.Element;
-export namespace FooterLinks {
-    namespace propTypes {
-        let headingLevel: PropTypes.Requireable<string>;
-        let headingText: PropTypes.Validator<string>;
-        let linkItems: PropTypes.Requireable<PropTypes.ReactNodeLike[]>;
-        let className: PropTypes.Requireable<string>;
-    }
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './footer-links.css';
+import type { HeadingLevel } from '@libs/types/custom-types';
+interface FooterLinksProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     *  Heading level
+     */
+    headingLevel?: HeadingLevel;
+    /**
+     * Heading text
+     */
+    headingText: string;
+    /**
+     * Array of links
+     */
+    linkItems?: ReactNode[];
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Footer Links UI component
+ */
+export declare const FooterLinks: ({ headingLevel, headingText, linkItems, className, ...props }: FooterLinksProps) => React.JSX.Element;
+export {};

package/_dist/css/component-css/pds-dashboard-search.css

@@ -1 +1 @@
-.pds-dashboard-search{--dashboard-search-height:var(--pds-spacing-input-height);height:var(--dashboard-search-height);margin-inline-end:-.64rem;position:absolute;transition:width .375s ease;z-index:400}.pds-dashboard-search--inner{align-content:stretch;display:flex}.pds-dashboard-search__combobox{left:0;position:absolute;right:0}.pds-dashboard-search__search-toggle{align-items:center;background-color:transparent;border:.0625rem solid transparent;border-radius:.1875rem;color:var(--pds-color-text-default);cursor:pointer;display:flex;height:var(--dashboard-search-height);padding-inline:.64rem}.pds-dashboard-search__search-toggle:hover{color:var(--pds-color-interactive-link-hover)}.pds-dashboard-search__search-toggle:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);transition:outline .2s ease-in-out 0s}.pds-dashboard-search__search-toggle-icon{pointer-events:none}.pds-dashboard-search__option-display{justify-content:space-between;width:100%}.pds-dashboard-search__option-display,.pds-dashboard-search__option-inner{align-items:center;column-gap:.8rem;display:flex}.pds-dashboard-search__option-icon{align-items:center;color:var(--pds-color-text-default-secondary);display:flex}.pds-dashboard-search__option-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-dashboard-search--isMobile{border-bottom:.0625rem solid var(--pds-color-border-default);left:50%;margin-inline-start:-50vw;min-height:3.815rem;position:relative;width:100vw}.pds-dashboard-search--isMobile .pds-dashboard-search__combobox{margin-inline:auto;width:calc(100% - 2.5rem)}.pds-dashboard-search--mobile-inner{padding-block:.64rem}
+.pds-dashboard-search{--dashboard-search-height:var(--pds-spacing-input-height);height:var(--dashboard-search-height);margin-inline-end:-.64rem;position:absolute;transition:width .375s ease;z-index:400}.pds-dashboard-search__combobox{left:0;position:absolute;right:0}.pds-dashboard-search__search-toggle{align-items:center;background-color:transparent;border:.0625rem solid transparent;border-radius:.1875rem;color:var(--pds-color-text-default);cursor:pointer;display:flex;height:var(--dashboard-search-height)}.pds-dashboard-search__search-toggle:hover{color:var(--pds-color-interactive-link-hover)}.pds-dashboard-search__search-toggle:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);transition:outline .2s ease-in-out 0s}.pds-dashboard-search__search-toggle-icon{margin-block-start:.41rem;pointer-events:none}.pds-dashboard-search__option-display{justify-content:space-between;width:100%}.pds-dashboard-search__option-display,.pds-dashboard-search__option-inner{align-items:center;column-gap:.8rem;display:flex}.pds-dashboard-search__option-icon{align-items:center;color:var(--pds-color-text-default-secondary);display:flex}.pds-dashboard-search__option-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pds-dashboard-search--isMobile{border-bottom:.0625rem solid var(--pds-color-border-default);left:50%;margin-inline-start:-50vw;min-height:3.815rem;position:relative;width:100vw}.pds-dashboard-search--isMobile .pds-dashboard-search__combobox{margin-inline:auto;width:calc(100% - 2.5rem)}.pds-dashboard-search--mobile-inner{padding-block:.64rem}