@pantheon-systems/pds-toolkit-react 1.0.0-beta.0 → 1.0.0-beta.10

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.
Files changed (102) hide show
  1. package/README.md +1 -1
  2. package/_dist/components/CTASlice/CTASlice.d.ts +1 -1
  3. package/_dist/components/Callout/Callout.d.ts +2 -1
  4. package/_dist/components/DashboardStat/DashboardStat.d.ts +2 -2
  5. package/_dist/components/Pagination/Pagination.d.ts +1 -1
  6. package/_dist/components/Popover/Popover.d.ts +2 -3
  7. package/_dist/components/SiteDashboardHeading/SiteDashboardHeading.d.ts +5 -4
  8. package/_dist/components/SocialLinks/SocialLinks.d.ts +1 -1
  9. package/_dist/components/StatusIndicator/StatusIndicator.d.ts +2 -1
  10. package/_dist/components/TableOfContents/TableOfContents.d.ts +1 -1
  11. package/_dist/components/Tabs/Tabs.d.ts +1 -1
  12. package/_dist/components/Tooltip/Tooltip.d.ts +1 -1
  13. package/_dist/components/badges/StatusBadge/StatusBadge.d.ts +2 -1
  14. package/_dist/components/buttons/Button/Button.d.ts +6 -5
  15. package/_dist/components/buttons/ButtonLink/ButtonLink.d.ts +2 -2
  16. package/_dist/components/buttons/IconButton/IconButton.d.ts +4 -3
  17. package/_dist/components/buttons/MenuButton/MenuButton.d.ts +4 -4
  18. package/_dist/components/buttons/SegmentedButton/SegmentedButton.d.ts +1 -1
  19. package/_dist/components/buttons/SplitButton/SplitButton.d.ts +3 -3
  20. package/_dist/components/buttons/UtilityButton/UtilityButton.d.ts +1 -1
  21. package/_dist/components/cards/Card/Card.d.ts +1 -1
  22. package/_dist/components/cards/CardHeading/CardHeading.d.ts +1 -1
  23. package/_dist/components/cards/EmptyStateCard/EmptyStateCard.d.ts +1 -1
  24. package/_dist/components/cards/LinksCard/LinksCard.d.ts +1 -1
  25. package/_dist/components/cards/NewSiteCard/NewSiteCard.d.ts +1 -1
  26. package/_dist/components/cards/PricingCard/PricingCard.d.ts +1 -1
  27. package/_dist/components/cards/SiteCard/SiteCard.d.ts +1 -1
  28. package/_dist/components/empty-states/CompactEmptyState/CompactEmptyState.d.ts +3 -3
  29. package/_dist/components/empty-states/HorizontalEmptyState/HorizontalEmptyState.d.ts +2 -2
  30. package/_dist/components/empty-states/VerticalEmptyState/VerticalEmptyState.d.ts +1 -1
  31. package/_dist/components/footer/FooterHeading/FooterHeading.d.ts +1 -1
  32. package/_dist/components/footer/FooterLinks/FooterLinks.d.ts +1 -1
  33. package/_dist/components/footer/SiteFooter/SiteFooter.d.ts +1 -1
  34. package/_dist/components/icons/Icon/Icon.d.ts +1 -1
  35. package/_dist/components/inputs/Checkbox/Checkbox.d.ts +1 -1
  36. package/_dist/components/inputs/CheckboxFieldset/CheckboxFieldset.d.ts +1 -1
  37. package/_dist/components/inputs/CheckboxGroup/CheckboxGroup.d.ts +1 -1
  38. package/_dist/components/inputs/Combobox/Combobox.d.ts +1 -1
  39. package/_dist/components/inputs/FileUpload/FileUpload.d.ts +1 -1
  40. package/_dist/components/inputs/RadioGroup/RadioGroup.d.ts +1 -1
  41. package/_dist/components/inputs/Select/Select.d.ts +11 -2
  42. package/_dist/components/inputs/Select/select-sample-data.d.ts +6 -0
  43. package/_dist/components/inputs/TextInput/TextInput.d.ts +3 -3
  44. package/_dist/components/inputs/Textarea/Textarea.d.ts +4 -3
  45. package/_dist/components/loading-indicators/Skeleton/Skeleton.d.ts +1 -1
  46. package/_dist/components/navigation/ButtonNav/ButtonNav.d.ts +1 -1
  47. package/_dist/components/navigation/DashboardNav/DashboardNavItem.d.ts +4 -4
  48. package/_dist/components/navigation/DashboardSearch/SiteOptionDisplay.d.ts +1 -1
  49. package/_dist/components/navigation/DropdownMenu/DropdownMenu.d.ts +1 -1
  50. package/_dist/components/navigation/NavMenu/NavMenu.d.ts +2 -2
  51. package/_dist/components/navigation/NavMenu/NavMenuDropdown.d.ts +2 -2
  52. package/_dist/components/navigation/Navbar/Navbar.d.ts +2 -2
  53. package/_dist/components/navigation/SideNav/SideNav.d.ts +1 -1
  54. package/_dist/components/navigation/SideNavCompact/SideNavCompact.d.ts +1 -1
  55. package/_dist/components/navigation/SideNavGlobal/SideNavGlobalItem.d.ts +4 -4
  56. package/_dist/components/navigation/TabMenu/TabMenu.d.ts +4 -4
  57. package/_dist/components/navigation/TabMenu/TabMenuDropdown.d.ts +3 -3
  58. package/_dist/components/navigation/UserMenu/UserMenu.d.ts +1 -1
  59. package/_dist/components/navigation/WorkspaceSelector/WorkspaceSelector.d.ts +14 -0
  60. package/_dist/components/navigation/navigation-utilities.d.ts +2 -2
  61. package/_dist/components/notifications/Banner/Banner.d.ts +3 -1
  62. package/_dist/components/notifications/InlineMessage/InlineMessage.d.ts +2 -1
  63. package/_dist/components/notifications/SectionMessage/SectionMessage.d.ts +3 -2
  64. package/_dist/components/panels/Panel/Panel.d.ts +11 -4
  65. package/_dist/components/panels/PanelList/PanelList.d.ts +5 -1
  66. package/_dist/components/progress-indicators/ProgressBar/ProgressBar.d.ts +2 -1
  67. package/_dist/components/steppers/VerticalStepper/VerticalStep.d.ts +1 -1
  68. package/_dist/components/tiles/Tile/Tile.d.ts +1 -1
  69. package/_dist/components/tiles/TileGrid/TileGrid.d.ts +2 -2
  70. package/_dist/css/component-css/pds-code-block.css +1 -1
  71. package/_dist/css/component-css/pds-combobox-multiselect.css +1 -1
  72. package/_dist/css/component-css/pds-combobox.css +1 -1
  73. package/_dist/css/component-css/pds-dashboard-nav.css +1 -1
  74. package/_dist/css/component-css/pds-index.css +8 -8
  75. package/_dist/css/component-css/pds-menu-button.css +1 -1
  76. package/_dist/css/component-css/pds-navbar.css +1 -1
  77. package/_dist/css/component-css/pds-panel-list.css +1 -1
  78. package/_dist/css/component-css/pds-select.css +1 -1
  79. package/_dist/css/component-css/pds-side-nav-global.css +1 -1
  80. package/_dist/css/component-css/pds-switch.css +1 -1
  81. package/_dist/css/component-css/pds-workspace-selector.css +1 -1
  82. package/_dist/css/pds-components.css +8 -8
  83. package/_dist/index.css +1 -1
  84. package/_dist/index.d.ts +3 -1
  85. package/_dist/index.js +5079 -4858
  86. package/_dist/index.js.map +1 -1
  87. package/_dist/layouts/AppLayout/AppLayout.d.ts +1 -1
  88. package/_dist/layouts/Container/Container.d.ts +1 -1
  89. package/_dist/layouts/DashboardInner/DashboardInner.d.ts +2 -1
  90. package/_dist/layouts/FlexContainer/FlexContainer.d.ts +1 -1
  91. package/_dist/layouts/SidebarLayout/SidebarLayout.d.ts +3 -2
  92. package/_dist/layouts/ThreeItemLayout/ThreeItemLayout.d.ts +1 -1
  93. package/_dist/layouts/TwoItemLayout/TwoItemLayout.d.ts +1 -1
  94. package/_dist/libs/components/utility-components.d.ts +1 -1
  95. package/_dist/libs/types/custom-types.d.ts +39 -3
  96. package/_dist/{components/navigation → libs/types}/navigation-types.d.ts +7 -7
  97. package/_dist/mocks/data/navigation-items.d.ts +8 -96
  98. package/_dist/utilities/context-providers/OverlayContext/OverlayContext.d.ts +12 -0
  99. package/_dist/vars/animation.d.ts +2 -2
  100. package/package.json +34 -31
  101. /package/_dist/{components/inputs → libs/types}/input-types.d.ts +0 -0
  102. /package/_dist/{layouts → libs/types}/layout-types.d.ts +0 -0
package/README.md CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
  This toolkit provides assets for use within a React project and a Storybook instance to preview the components.
6
6
 
7
- [Published Storybook](https://live-pds-toolkit-react.appa.pantheon.site/)
7
+ [Published Storybook](https://pds-react.pantheon.io/)
8
8
 
9
9
  ## Toolkit philosophy and scope
10
10
 
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ContainerWidth, HeadingLevel } from '@libs/types/custom-types';
2
+ import { ContainerWidth, HeadingLevel } from '../../libs/types/custom-types';
3
3
  import './../buttons/Button/button.css';
4
4
  import './cta-slice.css';
5
5
  interface CTASliceProps extends ComponentPropsWithoutRef<'div'> {
@@ -1,6 +1,7 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
+ import { StatusType } from '../../libs/types/custom-types';
2
3
  import './callout.css';
3
- type CalloutType = 'info' | 'success' | 'warning' | 'critical' | 'discovery' | 'code' | 'earlyAccess';
4
+ type CalloutType = StatusType | 'code' | 'earlyAccess';
4
5
  type TypeLabels = Record<CalloutType, string>;
5
6
  export interface CalloutProps extends ComponentPropsWithoutRef<'div'> {
6
7
  /**
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
2
  import './dashboard-stat.css';
3
- export type DashBoardStatStatus = 'success' | 'warning' | 'launch' | 'error' | 'ready' | 'notReady';
3
+ export type DashboardStatStatus = 'success' | 'warning' | 'launch' | 'error' | 'ready' | 'notReady';
4
4
  /**
5
5
  * Prop types for DashboardStat
6
6
  */
@@ -16,7 +16,7 @@ export interface DashboardStatProps extends ComponentPropsWithoutRef<'div'> {
16
16
  /**
17
17
  * Status of the stat, which determines the icon and icon color.
18
18
  */
19
- status?: DashBoardStatStatus;
19
+ status?: DashboardStatStatus;
20
20
  /**
21
21
  * Title of the stat, displayed as the main heading of the component.
22
22
  */
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import { HeadingLevelCommon } from '../../libs/types/custom-types';
3
3
  import './pagination.css';
4
4
  /**
5
5
  * Prop types for Pagination
@@ -1,7 +1,7 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { FuiPlacement } from '@libs/types/custom-types';
2
+ import { FuiPlacement } from '../../libs/types/custom-types';
3
3
  import './popover.css';
4
- interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'> {
4
+ export interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'> {
5
5
  /**
6
6
  * Additional class names.
7
7
  */
@@ -63,4 +63,3 @@ interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'>
63
63
  * Popover UI component
64
64
  */
65
65
  export declare const Popover: ({ className, classNameContainer, closeButtonLabel, content, customTrigger, hasCloseButton, offsetValue, onClose, placement, popoverIsOpen, setPopoverIsOpen, title, triggerAccessibleText, triggerIcon, ...props }: PopoverProps) => import("react/jsx-runtime").JSX.Element;
66
- export {};
@@ -1,6 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { SitePlanLevel, SiteType } from '@libs/types/custom-types';
3
- import { Popover } from '@components/Popover/Popover';
2
+ import { SitePlanLevel, SiteType } from '../../libs/types/custom-types';
4
3
  import './site-dashboard-heading.css';
5
4
  /**
6
5
  * Prop types for SiteDashboardHeading
@@ -43,9 +42,11 @@ export interface SiteDashboardHeadingProps extends ComponentPropsWithoutRef<'div
43
42
  */
44
43
  siteType?: SiteType;
45
44
  /**
46
- * Additional props to pass to the trigger component.
45
+ * Additional props to pass to the trigger component. Accepts any HTML div attributes.
47
46
  */
48
- triggerProps?: Omit<ComponentPropsWithoutRef<typeof Popover>, 'content' | 'title' | 'placement' | 'triggerIcon'>;
47
+ triggerProps?: ComponentPropsWithoutRef<'div'> & {
48
+ [key: `data-${string}`]: string | undefined;
49
+ };
49
50
  /**
50
51
  * Label for the upgrade button.
51
52
  */
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { PDSIcon } from '../icons/Icon/Icon';
3
3
  import './social-links.css';
4
4
  interface SocialLinksProps extends ComponentPropsWithoutRef<'ul'> {
5
5
  /**
@@ -1,4 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
+ import { StatusType } from '../../libs/types/custom-types';
2
3
  import './status-indicator.css';
3
4
  export interface StatusIndicatorProps extends ComponentPropsWithoutRef<'div'> {
4
5
  /**
@@ -16,7 +17,7 @@ export interface StatusIndicatorProps extends ComponentPropsWithoutRef<'div'> {
16
17
  /**
17
18
  * Sets status type
18
19
  */
19
- type: 'critical' | 'info' | 'neutral' | 'new' | 'success' | 'warning' | 'working';
20
+ type: Exclude<StatusType, 'discovery'> | 'neutral' | 'new' | 'working';
20
21
  }
21
22
  /**
22
23
  * StatusIndicator UI component
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import { HeadingLevelCommon } from '../../libs/types/custom-types';
3
3
  import './table-of-contents.css';
4
4
  /**
5
5
  * Prop types for TableOfContents
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { PDSIcon } from '../icons/Icon/Icon';
3
3
  import './tabs.css';
4
4
  interface Tabs {
5
5
  /**
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
2
  import { Placement } from '@floating-ui/react';
3
- import { FuiOffset } from '@libs/types/custom-types';
3
+ import { FuiOffset } from '../../libs/types/custom-types';
4
4
  import './tooltip.css';
5
5
  interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
6
6
  /**
@@ -1,4 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
+ import { StatusType } from '../../../libs/types/custom-types';
2
3
  import './status-badge.css';
3
4
  /**
4
5
  * StatusBadge component props
@@ -27,7 +28,7 @@ export interface StatusBadgeProps extends ComponentPropsWithoutRef<'div'> {
27
28
  /**
28
29
  * Status type for badge. Only renders if `hasStatusIndicator` is true.
29
30
  */
30
- statusType?: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
31
+ statusType?: StatusType | 'frozen' | 'disabled';
31
32
  }
32
33
  /**
33
34
  * StatusBadge UI component
@@ -1,5 +1,6 @@
1
1
  import React, { ComponentPropsWithoutRef, MouseEvent, ReactNode } from 'react';
2
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { ButtonDisplayType, ButtonSize, ButtonType, ButtonVariant } from '../../../libs/types/custom-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
3
4
  import './button.css';
4
5
  interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
5
6
  /**
@@ -9,7 +10,7 @@ interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
9
10
  /**
10
11
  * Type of button
11
12
  */
12
- buttonType?: 'button' | 'submit' | 'reset';
13
+ buttonType?: ButtonType;
13
14
  /**
14
15
  * Additional class names
15
16
  */
@@ -21,7 +22,7 @@ interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
21
22
  /**
22
23
  * How the button is displayed.
23
24
  */
24
- displayType?: 'label-only' | 'icon-start' | 'icon-end';
25
+ displayType?: ButtonDisplayType;
25
26
  /**
26
27
  * Which icon to render
27
28
  */
@@ -49,7 +50,7 @@ interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
49
50
  /**
50
51
  * Which size of button to render
51
52
  */
52
- size?: 'sm' | 'md' | 'lg';
53
+ size?: ButtonSize;
53
54
  /**
54
55
  * Text for an optional tooltip to be displayed when the button is `disabled` or `isLoading`.
55
56
  */
@@ -57,7 +58,7 @@ interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
57
58
  /**
58
59
  * Which variant of button to render
59
60
  */
60
- variant?: 'primary' | 'secondary' | 'subtle' | 'brand' | 'brand-secondary' | 'critical' | 'critical-secondary' | 'navbar' | 'inline';
61
+ variant?: ButtonVariant;
61
62
  }
62
63
  /**
63
64
  * A Component used to render a Button
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ButtonDisplayType, ButtonSize, ButtonVariant } from '@libs/types/custom-types';
3
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { ButtonDisplayType, ButtonSize, ButtonVariant } from '../../../libs/types/custom-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
4
4
  import '../Button/button.css';
5
5
  import './button-link.css';
6
6
  type ButtonLinkVariant = Exclude<ButtonVariant, 'navbar' | 'inline'>;
@@ -1,5 +1,6 @@
1
1
  import React, { ComponentPropsWithoutRef, MouseEvent } from 'react';
2
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { ButtonSize, ButtonType } from '../../../libs/types/custom-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
3
4
  import './icon-button.css';
4
5
  interface IconButtonProps extends ComponentPropsWithoutRef<'button'> {
5
6
  /**
@@ -9,7 +10,7 @@ interface IconButtonProps extends ComponentPropsWithoutRef<'button'> {
9
10
  /**
10
11
  * Type of button
11
12
  */
12
- buttonType?: 'button' | 'submit' | 'reset';
13
+ buttonType?: ButtonType;
13
14
  /**
14
15
  * Additional class names.
15
16
  */
@@ -37,7 +38,7 @@ interface IconButtonProps extends ComponentPropsWithoutRef<'button'> {
37
38
  /**
38
39
  * Which size of button to render.
39
40
  */
40
- size?: 'sm' | 'md' | 'lg';
41
+ size?: ButtonSize;
41
42
  /**
42
43
  * Which variant of button to render.
43
44
  */
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithRef, ReactNode } from 'react';
2
- import { HeadingItemType, LinkItemType, MenuItemType, NodeItemType, SeparatorItemType } from '@libs/types/custom-types';
3
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { ButtonSize, ButtonVariant, HeadingItemType, LinkItemType, MenuItemType, NodeItemType, SeparatorItemType } from '../../../libs/types/custom-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
4
4
  import './menu-button.css';
5
5
  /**
6
6
  * Prop types for MenuButton
@@ -49,7 +49,7 @@ export interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
49
49
  /**
50
50
  * Which size of button to render.
51
51
  */
52
- size?: 'sm' | 'md';
52
+ size?: Exclude<ButtonSize, 'lg'>;
53
53
  /**
54
54
  * Optional `data-testid` value for this component.
55
55
  */
@@ -61,7 +61,7 @@ export interface MenuButtonProps extends ComponentPropsWithRef<'span'> {
61
61
  /**
62
62
  * Which variant of button to render — only valid for icon-end (default) display type.
63
63
  */
64
- variant?: 'primary' | 'secondary' | 'navbar';
64
+ variant?: Extract<ButtonVariant, 'primary' | 'secondary' | 'navbar'>;
65
65
  /**
66
66
  * Is this button located with the Navbar component?
67
67
  * This will adjust the styling and position of the dropdown.
@@ -1,4 +1,4 @@
1
- import { PDSIcon } from '@components/icons/Icon/Icon';
1
+ import { PDSIcon } from '../../icons/Icon/Icon';
2
2
  import './segmented-button.css';
3
3
  /**
4
4
  * Structure for each option in the SegmentedButton component.
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { LinkItemType, MenuItemType } from '@libs/types/custom-types';
2
+ import { ButtonSize, ButtonVariant, LinkItemType, MenuItemType } from '../../../libs/types/custom-types';
3
3
  import './split-button.css';
4
4
  /**
5
5
  * Prop types for SplitButton
@@ -28,11 +28,11 @@ interface SplitButtonProps extends ComponentPropsWithoutRef<'span'> {
28
28
  /**
29
29
  * Which size of button to render
30
30
  */
31
- size?: 'sm' | 'md';
31
+ size?: Exclude<ButtonSize, 'lg'>;
32
32
  /**
33
33
  * Which variant of button to render
34
34
  */
35
- variant?: 'primary' | 'secondary';
35
+ variant?: Extract<ButtonVariant, 'primary' | 'secondary'>;
36
36
  }
37
37
  /**
38
38
  * A component used to render a button with a primary action and a menu of additional options
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { PDSIcon } from '../../icons/Icon/Icon';
3
3
  import './utility-button.css';
4
4
  /**
5
5
  * Prop types for UtilityButton
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { GridGapOptions } from '@layouts/layout-types';
2
+ import { GridGapOptions } from '../../../libs/types/layout-types';
3
3
  import './card.css';
4
4
  export type CardBackground = 'default' | 'mint-gradient' | 'sundown-gradient' | 'yellow-gradient' | 'transparent';
5
5
  /**
@@ -1,4 +1,4 @@
1
- import { HeadingLevelCommon } from '@libs/types/custom-types';
1
+ import { HeadingLevelCommon } from '../../../libs/types/custom-types';
2
2
  import './card-heading.css';
3
3
  /**
4
4
  * Prop types for CardHeading
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
3
  import './empty-state-card.css';
4
4
  /**
5
5
  * Prop types for EmptyStateCard
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
3
  import './links-card.css';
4
4
  /**
5
5
  * Prop types for LinksCard
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactElement } from 'react';
2
- import { BadgeColor } from '@libs/types/custom-types';
2
+ import { BadgeColor } from '../../../libs/types/custom-types';
3
3
  import './new-site-card.css';
4
4
  interface BadgeValueType {
5
5
  color: BadgeColor;
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { ListItems } from '@components/ComparisonList/ComparisonList';
2
+ import { ListItems } from '../../ComparisonList/ComparisonList';
3
3
  import './pricing-card.css';
4
4
  interface PrimaryCallToAction {
5
5
  buttonAction?: () => void;
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevelCommon, SiteStatus } from '@libs/types/custom-types';
2
+ import { HeadingLevelCommon, SiteStatus } from '../../../libs/types/custom-types';
3
3
  import './site-card.css';
4
4
  /**
5
5
  * Prop types for SiteCard
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevelCommon } from '@libs/types/custom-types';
3
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
+ import { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
4
4
  import './compact-empty-state.css';
5
5
  /**
6
6
  * Prop types for CompactEmptyState
@@ -21,7 +21,7 @@ export interface CompactEmptyStateProps extends ComponentPropsWithoutRef<'div'>
21
21
  /**
22
22
  * Icon to display above the heading.
23
23
  */
24
- iconName: PDSIcon;
24
+ iconName?: PDSIcon;
25
25
  /**
26
26
  * A link element using the router of your choice. Leave empty for no link.
27
27
  */
@@ -1,6 +1,6 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevel } from '@libs/types/custom-types';
3
- import { VideoEmbedProps } from '@components/VideoEmbed/VideoEmbed';
2
+ import { HeadingLevel } from '../../../libs/types/custom-types';
3
+ import { VideoEmbedProps } from '../../VideoEmbed/VideoEmbed';
4
4
  import './horizontal-empty-state.css';
5
5
  /**
6
6
  * Prop types for HorizontalEmptyState
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { HeadingLevel } from '@libs/types/custom-types';
2
+ import { HeadingLevel } from '../../../libs/types/custom-types';
3
3
  import './vertical-empty-state.css';
4
4
  /**
5
5
  * Prop types for VerticalEmptyState
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import type { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import type { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
3
  import './footer-heading.css';
4
4
  interface FooterHeadingProps {
5
5
  /**
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import type { HeadingLevelCommon } from '@libs/types/custom-types';
2
+ import type { HeadingLevelCommon } from '../../../libs/types/custom-types';
3
3
  import './footer-links.css';
4
4
  interface FooterLinksProps extends ComponentPropsWithoutRef<'div'> {
5
5
  /**
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ContainerWidth } from '@libs/types/custom-types';
2
+ import { ContainerWidth } from '../../../libs/types/custom-types';
3
3
  import './site-footer.css';
4
4
  interface SiteFooterProps extends ComponentPropsWithoutRef<'footer'> {
5
5
  /**
@@ -1,4 +1,4 @@
1
- import { Display } from '@libs/types/custom-types';
1
+ import { Display } from '../../../libs/types/custom-types';
2
2
  /**
3
3
  * PDS Icon type.
4
4
  */
@@ -1,5 +1,5 @@
1
1
  import React, { ChangeEvent, ComponentPropsWithoutRef, FocusEvent, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './checkbox.css';
4
4
  /**
5
5
  * Prop types for Checkbox
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import '../CheckboxGroup/checkbox-group.css';
4
4
  /**
5
5
  * Prop types for CheckboxFieldset
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './checkbox-group.css';
4
4
  export type CheckboxOption = {
5
5
  checked?: boolean;
@@ -1,5 +1,5 @@
1
1
  import React, { ChangeEvent, ComponentPropsWithoutRef, FocusEvent, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './combobox.css';
4
4
  type LabelStrings = {
5
5
  clearButton?: string;
@@ -1,5 +1,5 @@
1
1
  import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './file-upload.css';
4
4
  type LabelStrings = {
5
5
  chooseFile: string;
@@ -1,5 +1,5 @@
1
1
  import { ChangeEvent, ComponentPropsWithoutRef, FocusEvent, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './radio-group.css';
4
4
  export interface RadioOption {
5
5
  /**
@@ -1,5 +1,6 @@
1
1
  import { ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
+ import { PDSIcon } from '../../icons/Icon/Icon';
3
4
  import './select.css';
4
5
  type LabelStrings = {
5
6
  selectOptionText: string;
@@ -10,6 +11,10 @@ export type SelectOptionType = {
10
11
  * Option disabled.
11
12
  */
12
13
  disabled?: boolean;
14
+ /**
15
+ * Optional icon to display before the option label.
16
+ */
17
+ icon?: PDSIcon;
13
18
  /**
14
19
  * Option label.
15
20
  */
@@ -50,6 +55,10 @@ export interface SelectProps {
50
55
  * Is the field disabled?
51
56
  */
52
57
  disabled?: boolean;
58
+ /**
59
+ * Optional icon to display before the placeholder text (selectOptionText). Only shows when no value is selected.
60
+ */
61
+ icon?: PDSIcon;
53
62
  /**
54
63
  * Input ID.
55
64
  */
@@ -118,5 +127,5 @@ export declare const SelectOptionGroup: ({ children, label, }: SelectOptionGroup
118
127
  /**
119
128
  * Select UI component
120
129
  */
121
- export declare const Select: ({ className, defaultValue, disabled, id, inputWidth, label, labelStrings, message, onBlur, onFocus, onOptionSelect, options, required, showLabel, tooltipText, validationMessage, validationStatus, value, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
130
+ export declare const Select: ({ className, defaultValue, disabled, icon, id, inputWidth, label, labelStrings, message, onBlur, onFocus, onOptionSelect, options, required, showLabel, tooltipText, validationMessage, validationStatus, value, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
122
131
  export {};
@@ -0,0 +1,6 @@
1
+ import { SelectOptionsType, SelectOptionType } from './Select';
2
+ export declare const githubAccountOptions: SelectOptionType[];
3
+ export declare const userRoleOptions: SelectOptionType[];
4
+ export declare const validationExampleOptions: SelectOptionType[];
5
+ export declare const sampleSelectOptionsWithGroups: SelectOptionsType;
6
+ export declare const sampleSelectOptions: SelectOptionType[];
@@ -1,7 +1,7 @@
1
1
  import React, { ChangeEvent, ComponentPropsWithoutRef, FocusEvent, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './text-input.css';
4
- type TranslationStringProps = {
4
+ type LabelStrings = {
5
5
  clearButton: string;
6
6
  counterOverLimit?: string;
7
7
  searchShortcut: string;
@@ -114,7 +114,7 @@ export interface TextInputProps extends ComponentPropsWithoutRef<'div'> {
114
114
  /**
115
115
  * Translation strings for various labels or other visually-hidden text.
116
116
  */
117
- translationStrings?: TranslationStringProps;
117
+ translationStrings?: LabelStrings;
118
118
  /**
119
119
  * Type of input field to use.
120
120
  */
@@ -1,7 +1,7 @@
1
1
  import React, { ChangeEvent, ComponentPropsWithoutRef, FocusEvent, ReactNode } from 'react';
2
- import { ValidationStatus } from '../input-types';
2
+ import { ValidationStatus } from '../../../libs/types/input-types';
3
3
  import './textarea.css';
4
- export type TranslationStringProps = {
4
+ type LabelStrings = {
5
5
  clearButton: string;
6
6
  counterOverLimit?: string;
7
7
  searchShortcut: string;
@@ -90,7 +90,7 @@ export interface TextareaProps {
90
90
  /**
91
91
  * Translation strings for various labels or other visually-hidden text.
92
92
  */
93
- translationStrings?: TranslationStringProps;
93
+ translationStrings?: LabelStrings;
94
94
  /**
95
95
  * Validation message for the textarea field based on the validation status.
96
96
  */
@@ -108,3 +108,4 @@ export interface TextareaProps {
108
108
  * Textarea UI component
109
109
  */
110
110
  export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
111
+ export {};
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { SpacingScaleOptions, TypeScaleOptions } from '@libs/types/custom-types';
2
+ import { SpacingScaleOptions, TypeScaleOptions } from '../../../libs/types/custom-types';
3
3
  import './skeleton.css';
4
4
  /**
5
5
  * Prop types for Skeleton
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithRef } from 'react';
2
- import { NavigationItem } from '@components/navigation/navigation-types';
2
+ import { NavigationItem } from '../../../libs/types/navigation-types';
3
3
  import './button-nav.css';
4
4
  export type ButtonNavItem = Omit<NavigationItem, 'links'>;
5
5
  /**
@@ -1,7 +1,7 @@
1
- import { PDSIcon } from '@components/icons/Icon/Icon';
2
- import { NavigationItem } from '@components/navigation/navigation-types';
1
+ import { PDSIcon } from '../../icons/Icon/Icon';
2
+ import { NavigationItem } from '../../../libs/types/navigation-types';
3
3
  import './dashboard-nav.css';
4
- export type DashboardNavItemProps = NavigationItem & {
4
+ export interface DashboardNavItemProps extends NavigationItem {
5
5
  /**
6
6
  * Icon to display next to the link content.
7
7
  */
@@ -17,7 +17,7 @@ export type DashboardNavItemProps = NavigationItem & {
17
17
  submenu: string;
18
18
  toggle: string;
19
19
  };
20
- };
20
+ }
21
21
  /**
22
22
  * DashboardNavItem UI component
23
23
  */
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef } from 'react';
2
- import { SiteStatus, SiteType } from '@libs/types/custom-types';
2
+ import { SiteStatus, SiteType } from '../../../libs/types/custom-types';
3
3
  export type SiteOption = {
4
4
  /**
5
5
  * ID of the site.
@@ -1,5 +1,5 @@
1
1
  import { ComponentPropsWithoutRef, ReactElement } from 'react';
2
- import { NavigationItem } from '@components/navigation/navigation-types';
2
+ import { NavigationItem } from '../../../libs/types/navigation-types';
3
3
  import './dropdown-menu.css';
4
4
  /**
5
5
  * Prop types for DropdownMenu