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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,7 @@ interface TypeLabels {
5
5
  notIncluded: string;
6
6
  addon: string;
7
7
  }
8
- interface ListItems {
8
+ export interface ListItems {
9
9
  text: string;
10
10
  type: 'included' | 'notIncluded' | 'addon';
11
11
  }
@@ -1,6 +1,6 @@
1
1
  import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  import './pantheon-logo.css';
3
- export type PantheonLogoDisplayType = 'full' | 'icon' | 'wordmark' | 'sub-brand';
3
+ export type PantheonLogoDisplayType = 'full' | 'icon' | 'wordmark' | 'sub-brand' | 'sub-brand-small';
4
4
  /**
5
5
  * Prop types for PantheonLogo
6
6
  */
@@ -23,7 +23,7 @@ export interface StatusBadgeProps extends ComponentPropsWithoutRef<'div'> {
23
23
  /**
24
24
  * Status type for badge. Only renders if `hasStatusIndicator` is true.
25
25
  */
26
- statusType: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
26
+ statusType?: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
27
27
  /**
28
28
  * Additional class names
29
29
  */
@@ -38,6 +38,10 @@ interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
38
38
  * Horizontal position of the menu relative to the button. Applies to breakpoints `md` and up.
39
39
  */
40
40
  menuPosition?: 'start' | 'end';
41
+ /**
42
+ * Optional callback function for when the button is clicked or activated by the keyboard.
43
+ */
44
+ onClick?: () => void;
41
45
  /**
42
46
  * Which size of button to render.
43
47
  */
@@ -66,5 +70,5 @@ interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
66
70
  /**
67
71
  * MenuButton UI component
68
72
  */
69
- export declare const MenuButton: ({ disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: MenuButtonProps) => React.JSX.Element;
73
+ export declare const MenuButton: ({ disabled, displayType, iconName, id, isSplitButton, label, menuItems, menuPosition, onClick, size, testId, undefinedLabel, variant, withinNavbar, className, ...props }: MenuButtonProps) => React.JSX.Element;
70
74
  export {};
@@ -1,65 +1,90 @@
1
- export function PricingCard({ actionPrimary, actionSecondary, hasComparisonList, onTierChange, planDescription, planName, planPricingData, statusBadgeLabels, selectLabel, statusBadgeType, className, ...props }: {
2
- [x: string]: any;
3
- actionPrimary: any;
4
- actionSecondary: any;
1
+ import React, { ComponentPropsWithoutRef } from 'react';
2
+ import { ListItems } from '@components/ComparisonList/ComparisonList';
3
+ import './pricing-card.css';
4
+ interface PrimaryCallToAction {
5
+ type?: 'button' | 'link';
6
+ variant?: 'primary' | 'secondary';
7
+ label?: string;
8
+ buttonAction?: () => void;
9
+ linkUrl?: string;
10
+ linkTarget?: string;
11
+ disabled?: boolean;
12
+ }
13
+ interface SecondaryCallToAction {
14
+ type?: 'button' | 'link';
15
+ label?: string;
16
+ buttonAction?: () => void;
17
+ linkUrl?: string;
18
+ linkTarget?: string;
19
+ }
20
+ interface PlanPricingData {
21
+ customActionLabel?: string;
22
+ label?: string;
23
+ pricePrefix?: string;
24
+ price?: string;
25
+ priceDetails?: string;
26
+ savingsBadgeLabel?: string;
27
+ savingsDetails?: string;
28
+ listLabel?: string;
29
+ listItems?: ListItems[];
30
+ }
31
+ interface StatusBadgeLabels {
32
+ currentPlan?: string;
33
+ mostPopular?: string;
34
+ }
35
+ interface PricingCardProps extends ComponentPropsWithoutRef<'div'> {
36
+ /**
37
+ * The primary call to action.
38
+ */
39
+ actionPrimary?: PrimaryCallToAction;
40
+ /**
41
+ * An optional secondary call to action.
42
+ */
43
+ actionSecondary?: SecondaryCallToAction;
44
+ /**
45
+ * Has comparison list. Will be rendered below the card if true.
46
+ * Add corresponding `comparisonListId` to each planPricingData object.
47
+ */
5
48
  hasComparisonList?: boolean;
6
- onTierChange: any;
7
- planDescription: any;
8
- planName: any;
9
- planPricingData: any;
10
- statusBadgeLabels?: {
11
- currentPlan: string;
12
- mostPopular: string;
13
- };
49
+ /**
50
+ * Optional function to handle the change event of the select input. Only valid when multiple tiers of planPricingData are present.
51
+ */
52
+ onTierChange?: (value: any) => void;
53
+ /**
54
+ * A brief description of the plan.
55
+ */
56
+ planDescription?: string;
57
+ /**
58
+ * The name of the plan.
59
+ */
60
+ planName?: string;
61
+ /**
62
+ * Plan pricing data. An array of objects.
63
+ */
64
+ planPricingData: PlanPricingData[];
65
+ /**
66
+ * Label for the plan size select dropdown. Available to screen readers only. Provide translation string if needed.
67
+ */
14
68
  selectLabel?: string;
15
- statusBadgeType: any;
16
- className: any;
17
- }): React.JSX.Element;
18
- export namespace PricingCard {
19
- namespace propTypes {
20
- let actionPrimary: PropTypes.Requireable<PropTypes.InferProps<{
21
- type: PropTypes.Requireable<string>;
22
- variant: PropTypes.Requireable<string>;
23
- label: PropTypes.Requireable<string>;
24
- buttonAction: PropTypes.Requireable<(...args: any[]) => any>;
25
- linkUrl: PropTypes.Requireable<string>;
26
- linkTarget: PropTypes.Requireable<string>;
27
- disabled: PropTypes.Requireable<boolean>;
28
- }>>;
29
- let actionSecondary: PropTypes.Requireable<PropTypes.InferProps<{
30
- type: PropTypes.Requireable<string>;
31
- label: PropTypes.Requireable<string>;
32
- buttonAction: PropTypes.Requireable<(...args: any[]) => any>;
33
- linkUrl: PropTypes.Requireable<string>;
34
- linkTarget: PropTypes.Requireable<string>;
35
- }>>;
36
- let hasComparisonList: PropTypes.Requireable<boolean>;
37
- let onTierChange: PropTypes.Requireable<(...args: any[]) => any>;
38
- let planDescription: PropTypes.Requireable<string>;
39
- let planName: PropTypes.Requireable<string>;
40
- let planPricingData: PropTypes.Requireable<PropTypes.InferProps<{
41
- customActionLabel: PropTypes.Requireable<string>;
42
- label: PropTypes.Requireable<string>;
43
- pricePrefix: PropTypes.Requireable<string>;
44
- price: PropTypes.Requireable<string>;
45
- priceDetails: PropTypes.Requireable<string>;
46
- savingsBadgeLabel: PropTypes.Requireable<string>;
47
- savingsDetails: PropTypes.Requireable<string>;
48
- listLabel: PropTypes.Requireable<string>;
49
- listItems: PropTypes.Requireable<PropTypes.InferProps<{
50
- text: PropTypes.Requireable<string>;
51
- type: PropTypes.Requireable<string>;
52
- }>[]>;
53
- }>[]>;
54
- let selectLabel: PropTypes.Requireable<string>;
55
- let statusBadgeLabels: PropTypes.Requireable<PropTypes.InferProps<{
56
- currentPlan: PropTypes.Requireable<string>;
57
- mostPopular: PropTypes.Requireable<string>;
58
- }>>;
59
- let statusBadgeType: PropTypes.Requireable<string>;
60
- let className: PropTypes.Requireable<string>;
61
- let containerClassName: PropTypes.Requireable<string>;
62
- }
69
+ /**
70
+ * Status badge labels. Provide translation strings if needed.
71
+ */
72
+ statusBadgeLabels: StatusBadgeLabels;
73
+ /**
74
+ * Status badge type. Leave empty for no badge. Only one badge of each type should be used in a group of Pricing Cards.
75
+ */
76
+ statusBadgeType?: 'currentPlan' | 'mostPopular';
77
+ /**
78
+ * Additional class names for the card item.
79
+ */
80
+ className?: string;
81
+ /**
82
+ * Additional class names for the card container.
83
+ */
84
+ containerClassName?: string;
63
85
  }
64
- import React from 'react';
65
- import PropTypes from 'prop-types';
86
+ /**
87
+ * PricingCard UI component
88
+ */
89
+ export declare const PricingCard: ({ actionPrimary, actionSecondary, hasComparisonList, onTierChange, planDescription, planName, planPricingData, statusBadgeLabels, selectLabel, statusBadgeType, className, ...props }: PricingCardProps) => React.JSX.Element;
90
+ export {};
@@ -1,15 +1,22 @@
1
- export function FooterHeading({ headingLevel, headingText, className, ...props }: {
2
- [x: string]: any;
3
- headingLevel?: string;
4
- headingText: any;
5
- className: any;
6
- }): React.JSX.Element;
7
- export namespace FooterHeading {
8
- namespace propTypes {
9
- let headingLevel: PropTypes.Requireable<string>;
10
- let headingText: PropTypes.Validator<string>;
11
- let className: PropTypes.Requireable<string>;
12
- }
1
+ import React, { ComponentPropsWithoutRef } from 'react';
2
+ import './footer-heading.css';
3
+ import type { HeadingLevel } from '@libs/types/custom-types';
4
+ interface FooterHeadingProps {
5
+ /**
6
+ * Heading level
7
+ */
8
+ headingLevel?: HeadingLevel;
9
+ /**
10
+ * Heading text
11
+ */
12
+ headingText: string;
13
+ /**
14
+ * Additional class names
15
+ */
16
+ className?: string;
13
17
  }
14
- import React from 'react';
15
- import PropTypes from 'prop-types';
18
+ /**
19
+ * Footer Heading UI component
20
+ */
21
+ export declare const FooterHeading: ({ headingLevel, headingText, className, ...props }: FooterHeadingProps & ComponentPropsWithoutRef<HeadingLevel>) => React.JSX.Element;
22
+ export {};
@@ -1,17 +1,26 @@
1
- export function FooterLinks({ headingLevel, headingText, linkItems, className, ...props }: {
2
- [x: string]: any;
3
- headingLevel: any;
4
- headingText: any;
5
- linkItems: any;
6
- className: any;
7
- }): React.JSX.Element;
8
- export namespace FooterLinks {
9
- namespace propTypes {
10
- let headingLevel: PropTypes.Requireable<string>;
11
- let headingText: PropTypes.Validator<string>;
12
- let linkItems: PropTypes.Requireable<PropTypes.ReactNodeLike[]>;
13
- let className: PropTypes.Requireable<string>;
14
- }
1
+ import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
2
+ import './footer-links.css';
3
+ import type { HeadingLevel } from '@libs/types/custom-types';
4
+ interface FooterLinksProps extends ComponentPropsWithoutRef<'div'> {
5
+ /**
6
+ * Heading level
7
+ */
8
+ headingLevel?: HeadingLevel;
9
+ /**
10
+ * Heading text
11
+ */
12
+ headingText: string;
13
+ /**
14
+ * Array of links
15
+ */
16
+ linkItems?: ReactNode[];
17
+ /**
18
+ * Additional class names
19
+ */
20
+ className?: string;
15
21
  }
16
- import React from 'react';
17
- import PropTypes from 'prop-types';
22
+ /**
23
+ * Footer Links UI component
24
+ */
25
+ export declare const FooterLinks: ({ headingLevel, headingText, linkItems, className, ...props }: FooterLinksProps) => React.JSX.Element;
26
+ export {};