@pantheon-systems/pds-toolkit-react 1.0.0-dev.16 → 1.0.0-dev.160

package/_dist/components/Icon/iconList.d.ts

@@ -0,0 +1 @@
+export const iconList: string[];

package/_dist/components/Modal/Modal.d.ts

@@ -0,0 +1,40 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './modal.css';
+export interface ModalProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Aria label that describes the modal. Will default to the title if not provided.
+     */
+    ariaLabel?: string;
+    /**
+     * Main content for modal.
+     */
+    children?: ReactNode;
+    /**
+     * Indicates if the built-in close button will be shown.
+     */
+    hasCloseButton?: boolean;
+    /**
+     * Is the modal open?
+     */
+    modalIsOpen?: boolean;
+    /**
+     * Function to set the modal open state.
+     */
+    setModalIsOpen?: (isOpen: boolean) => void;
+    /**
+     * The width of the modal.
+     */
+    size?: 'sm' | 'md' | 'lg';
+    /**
+     * Text for modal title
+     */
+    title: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Modal UI component
+ */
+export declare const Modal: ({ ariaLabel, children, hasCloseButton, modalIsOpen, setModalIsOpen, size, title, className, ...props }: ModalProps) => React.JSX.Element;

package/_dist/components/Pager/AdvancedPagination.d.ts

@@ -0,0 +1,4 @@
+export function AdvancedPagination({ ...props }: {
+    [x: string]: any;
+}): React.JSX.Element;
+import React from 'react';

package/_dist/components/Pager/BasicPagination.d.ts

@@ -0,0 +1,4 @@
+export function BasicPagination({ ...props }: {
+    [x: string]: any;
+}): React.JSX.Element;
+import React from 'react';

package/_dist/components/Pager/MiniPagination.d.ts

@@ -0,0 +1,4 @@
+export function MiniPagination({ ...props }: {
+    [x: string]: any;
+}): React.JSX.Element;
+import React from 'react';

package/_dist/components/Pager/NavigationButton.d.ts

@@ -0,0 +1,13 @@
+export function NavigationButton({ arrowText, direction, ...props }: {
+    [x: string]: any;
+    arrowText?: any;
+    direction: any;
+}): React.JSX.Element;
+export namespace NavigationButton {
+    namespace propTypes {
+        let arrowText: PropTypes.Requireable<string>;
+        let direction: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Pager/Pager.d.ts

@@ -0,0 +1,24 @@
+export function Pager({ buttonCallback, headingId, pages, paginationItemClickHandler, render, type, ...props }: {
+    [x: string]: any;
+    buttonCallback?: any;
+    headingId?: string;
+    pages: any;
+    paginationItemClickHandler?: any;
+    render?: any;
+    type?: string;
+}): React.JSX.Element;
+export namespace Pager {
+    namespace propTypes {
+        let buttonCallback: PropTypes.Requireable<(...args: any[]) => any>;
+        let headingId: PropTypes.Requireable<string>;
+        let pages: PropTypes.Validator<PropTypes.InferProps<{
+            href: PropTypes.Requireable<string>;
+        }>[]>;
+        let paginationItemClickHandler: PropTypes.Requireable<(...args: any[]) => any>;
+        let render: PropTypes.Requireable<(...args: any[]) => any>;
+        let type: PropTypes.Requireable<string>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Pager/PagerContext.d.ts

@@ -0,0 +1,23 @@
+export const PagerContext: React.Context<{}>;
+export function ContextProvider({ pages, render, paginationItemClickHandler, headingId, buttonCallback, children, }: {
+    pages: any;
+    render?: any;
+    paginationItemClickHandler?: any;
+    headingId?: string;
+    buttonCallback?: any;
+    children: any;
+}): React.JSX.Element;
+export namespace ContextProvider {
+    namespace propTypes {
+        let children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
+        let render: PropTypes.Requireable<(...args: any[]) => any>;
+        let paginationItemClickHandler: PropTypes.Requireable<(...args: any[]) => any>;
+        let buttonCallback: PropTypes.Requireable<(...args: any[]) => any>;
+        let pages: PropTypes.Validator<PropTypes.InferProps<{
+            link: PropTypes.Requireable<string>;
+        }>[]>;
+        let headingId: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Pager/PagerItem.d.ts

@@ -0,0 +1,14 @@
+export function PagerItem({ index, page, ...props }: {
+    [x: string]: any;
+    index: any;
+    page: any;
+}): React.JSX.Element;
+export namespace PagerItem {
+    namespace propTypes {
+        let index: PropTypes.Validator<number>;
+        let page: PropTypes.Validator<NonNullable<NonNullable<string | object>>>;
+        let render: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Pager/usePaginationUI.d.ts

@@ -0,0 +1 @@
+export default function usePaginationUI(pages: any, currentPages: any, setCurrentPages: any, currentKey: any, itemLength: any, pageDirection: any): void;

package/_dist/components/Panel/Panel.d.ts

@@ -0,0 +1,30 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './panel.css';
+type StatusType = 'info' | 'success' | 'warning' | 'critical';
+export interface PanelProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Panel content.
+     */
+    children: ReactNode;
+    /**
+     * Should the panel show a status indicator.
+     */
+    hasStatusIndicator?: boolean;
+    /**
+     * Status type for panel. Only renders if `hasStatusIndicator` is true.
+     */
+    statusType: StatusType;
+    /**
+     * Which variant of panel to render
+     */
+    variant?: 'default' | 'sunken' | 'raised' | 'overlay' | 'critical';
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Panel UI component
+ */
+export declare const Panel: ({ children, hasStatusIndicator, statusType, variant, className, ...props }: PanelProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,25 @@
+export function PantheonLogo({ colorType, displayType, isLink, subBrand, className, ...props }: {
+    [x: string]: any;
+    colorType?: string;
+    displayType?: string;
+    isLink: any;
+    subBrand: any;
+    className: any;
+}): React.JSX.Element;
+export namespace PantheonLogo {
+    namespace propTypes {
+        let colorType: PropTypes.Requireable<string>;
+        let displayType: PropTypes.Requireable<string>;
+        let isLink: PropTypes.Requireable<PropTypes.InferProps<{
+            ariaLabel: PropTypes.Requireable<string>;
+            link: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        }>>;
+        let subBrand: PropTypes.Requireable<PropTypes.InferProps<{
+            link: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+            text: PropTypes.Requireable<string>;
+        }>>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/PlatformIcon/PlatformIcon.d.ts

@@ -0,0 +1,13 @@
+export function PlatformIcon({ platformType, className, ...props }: {
+    [x: string]: any;
+    platformType: any;
+    className: any;
+}): React.JSX.Element;
+export namespace PlatformIcon {
+    namespace propTypes {
+        let platformType: PropTypes.Requireable<string>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Popover/Popover.d.ts

@@ -0,0 +1,57 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './popover.css';
+interface PopoverProps extends Omit<ComponentPropsWithoutRef<'div'>, 'content'> {
+    /**
+     * Content to display in the popover.
+     */
+    content?: ReactNode;
+    /**
+     * Text or HTML content to use as the trigger instead of an icon. Leave null to use the icon. This allows passing HTML content to customize the trigger appearance or functionality.
+     */
+    customTrigger?: ReactNode;
+    /**
+     * Indicates if close button will be shown.
+     */
+    hasCloseButton?: boolean;
+    /**
+     * Additional spacing between the trigger and the popover. Only applies to popovers with a custom trigger. Icon triggers have a fixed spacing.
+     */
+    offsetValue?: number;
+    /**
+     * Callback function that triggers when closing Popover.
+     */
+    onClose?: () => void;
+    /**
+     * Preferred placement of the popover in relation to the trigger. Will be modified if there is not enough space.
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
+    /**
+     * Text for popover title
+     */
+    title?: string;
+    /**
+     * The accessible text for the trigger. Only necessary when the trigger is an icon.
+     */
+    triggerAccessibleText?: string;
+    /**
+     * Icon to trigger Popover.
+     */
+    triggerIcon?: 'circleInfo' | 'circleQuestion';
+    /**
+     * Is the Popover open?
+     */
+    popoverIsOpen?: boolean;
+    /**
+     * Function to set Popover open state
+     */
+    setPopoverIsOpen?: (isOpen: boolean) => void;
+    /**
+     * Additional class names.
+     */
+    className?: string;
+}
+/**
+ * Popover UI component
+ */
+export declare const Popover: ({ content, customTrigger, hasCloseButton, offsetValue, onClose, placement, title, triggerIcon, triggerAccessibleText, popoverIsOpen, setPopoverIsOpen, className, ...props }: PopoverProps) => React.JSX.Element;
+export {};

package/_dist/components/PullQuote/PullQuote.d.ts

@@ -0,0 +1,34 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './pull-quote.css';
+interface Attribution {
+    name: string;
+    title: string;
+    org: string;
+}
+interface PullQuoteProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Attribution for the quote
+     */
+    attribution?: Attribution;
+    /**
+     * Image src. For stand-alone layout only, will not render for inline layout.
+     */
+    image?: string;
+    /**
+     * The layout type for the pull quote
+     */
+    layoutType?: 'stand-alone' | 'inline';
+    /**
+     * The quote text
+     */
+    quote: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * PullQuote UI component
+ */
+export declare const PullQuote: ({ attribution, image, layoutType, quote, className, ...props }: PullQuoteProps) => React.JSX.Element;
+export {};

package/_dist/components/Skiplink/Skiplink.d.ts

@@ -0,0 +1,21 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './skiplink.css';
+interface SkiplinkProps extends ComponentPropsWithoutRef<'a'> {
+    /**
+     * The ID of the element to skip to.
+     */
+    destination: string;
+    /**
+     * The text of the skip link.
+     */
+    text: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Skiplink UI component
+ */
+export declare const Skiplink: ({ destination, text, className, ...props }: SkiplinkProps) => React.JSX.Element;
+export {};

package/_dist/components/SocialLinks/SocialLinks.d.ts

@@ -0,0 +1,13 @@
+export function SocialLinks({ linkItems, className, ...props }: {
+    [x: string]: any;
+    linkItems?: string[];
+    className: any;
+}): React.JSX.Element;
+export namespace SocialLinks {
+    namespace propTypes {
+        let linkItems: PropTypes.Requireable<any[]>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/StatusIndicator/StatusIndicator.d.ts

@@ -0,0 +1,20 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './status-indicator.css';
+export interface StatusIndicatorProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     *  Status label text
+     */
+    label: string;
+    /**
+     * Sets status type
+     */
+    type: 'critical' | 'info' | 'neutral' | 'new' | 'success' | 'warning' | 'working';
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * StatusIndicator UI component
+ */
+export declare const StatusIndicator: ({ label, type, className, ...props }: StatusIndicatorProps) => React.JSX.Element;

package/_dist/components/Stepper/Stepper.d.ts

@@ -0,0 +1,46 @@
+export function Stepper({ steps, translatableLabels, className, ...props }: {
+    [x: string]: any;
+    steps: any;
+    translatableLabels?: {
+        step: string;
+        completed: string;
+        hasError: string;
+        next: string;
+    };
+    className: any;
+}): React.JSX.Element;
+export namespace Stepper {
+    namespace propTypes {
+        let steps: PropTypes.Requireable<PropTypes.InferProps<{
+            /**
+             * Callback function to return to a previously completed step.
+             */
+            callback: PropTypes.Requireable<(...args: any[]) => any>;
+            /**
+             * If the step has an error.
+             */
+            hasError: PropTypes.Requireable<boolean>;
+            /**
+             * Id for the step.
+             */
+            id: PropTypes.Requireable<string>;
+            /**
+             * If the step is the current active step.
+             */
+            isCurrent: PropTypes.Requireable<boolean>;
+            /**
+             * The label for the step.
+             */
+            label: PropTypes.Validator<string>;
+        }>[]>;
+        let translatableLabels: PropTypes.Requireable<PropTypes.InferProps<{
+            step: PropTypes.Requireable<string>;
+            completed: PropTypes.Requireable<string>;
+            hasError: PropTypes.Requireable<string>;
+            next: PropTypes.Requireable<string>;
+        }>>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Table/Table.d.ts

@@ -0,0 +1,15 @@
+export function Table({ headers, rowData, className, ...props }: {
+    [x: string]: any;
+    headers: any;
+    rowData: any;
+    className: any;
+}): React.JSX.Element;
+export namespace Table {
+    namespace propTypes {
+        let headers: PropTypes.Requireable<object[]>;
+        let rowData: PropTypes.Requireable<PropTypes.ReactNodeLike[]>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/TableOfContents/TableOfContents.d.ts

@@ -0,0 +1,25 @@
+export function TableOfContents({ appendIds, ariaLabel, headingLevel, headingText, ignoreClass, showHeading, sourceID, className, ...props }: {
+    [x: string]: any;
+    appendIds?: boolean;
+    ariaLabel?: string;
+    headingLevel?: string;
+    headingText?: string;
+    ignoreClass?: string;
+    showHeading?: boolean;
+    sourceID?: string;
+    className: any;
+}): React.JSX.Element;
+export namespace TableOfContents {
+    namespace propTypes {
+        let appendIds: PropTypes.Requireable<boolean>;
+        let ariaLabel: PropTypes.Requireable<string>;
+        let showHeading: PropTypes.Requireable<boolean>;
+        let headingLevel: PropTypes.Requireable<string>;
+        let headingText: PropTypes.Requireable<string>;
+        let ignoreClass: PropTypes.Requireable<string>;
+        let sourceID: PropTypes.Requireable<string>;
+        let className: PropTypes.Requireable<string>;
+    }
+}
+import React from 'react';
+import PropTypes from 'prop-types';

package/_dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,60 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { PDSIcon } from '@components/Icon/Icon';
+import './tabs.css';
+interface Tabs {
+    /**
+     * Sets if tab disabled (optional)
+     */
+    disabled?: boolean;
+    /**
+     * Adds tab icon (optional)
+     */
+    icon?: PDSIcon;
+    /**
+     * Sets tab label
+     */
+    tabLabel: string;
+    /**
+     * Sets id for tab (optional)
+     */
+    tabId?: string;
+    /**
+     * Sets content inside tab
+     */
+    panelContent: ReactNode;
+}
+interface TabsProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Function to call when the active tab changes
+     */
+    onActiveTabChange?: (activeTabIndex: number) => void;
+    /**
+     * Sets tabset aria label
+     */
+    ariaLabel: string;
+    /**
+     * Sets default selected tab using a zero-based index, defaults to 0
+     */
+    defaultSelected?: number;
+    /**
+     * Sets currently selected tab using a zero-based index
+     */
+    selectedTab?: number;
+    /**
+     * Sets size of tab
+     */
+    size?: 'sm' | 'md';
+    /**
+     * Array of objects for tab data
+     */
+    tabs: Tabs[];
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Tabs UI component
+ */
+export declare const Tabs: ({ onActiveTabChange, ariaLabel, defaultSelected, selectedTab, size, tabs, className, ...props }: TabsProps) => React.JSX.Element;
+export {};

package/_dist/components/Tag/Tag.d.ts

@@ -0,0 +1,39 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './tag.css';
+export declare let tagColors: string[];
+type TagColor = (typeof tagColors)[number];
+interface TagProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Should the tag be a link? If yes, provide a link element.
+     */
+    linkContent?: ReactNode;
+    /**
+     * Should the tag be removable?
+     */
+    isRemovable?: boolean;
+    /**
+     * Function to execute when the tag is removed.
+     */
+    onRemove?: () => void;
+    /**
+     * Label for the remove button. Tag text will be appended to this label.
+     */
+    removeLabel?: string;
+    /**
+     * Tag color. Will use random color if not selected.
+     */
+    tagColor?: TagColor;
+    /**
+     * Tag text
+     */
+    tagLabel: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Tag UI component
+ */
+export declare const Tag: ({ linkContent, isRemovable, onRemove, removeLabel, tagColor, tagLabel, className, ...props }: TagProps) => React.JSX.Element;
+export {};

package/_dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,43 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { Placement } from '@floating-ui/react';
+import { FuiOffset } from '@libs/components/custom-types';
+import './tooltip.css';
+interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Text to display in tooltip
+     */
+    content: string;
+    /**
+     * Text or HTML content to use as the trigger instead of an icon. Leave null to use the icon. This allows passing HTML content to customize the trigger appearance or functionality.
+     */
+    customTrigger?: ReactNode;
+    /**
+     * Number to provide custom z-index value for the tooltip container
+     */
+    customZIndex?: number;
+    /**
+     * The spacing between the trigger and the tooltip in pixels. Only applies to tooltips with a custom trigger. Icon triggers have a fixed spacing.
+     */
+    offsetValue?: FuiOffset;
+    /**
+     * The preferred placement of the tooltip relative to the trigger.
+     */
+    preferredPlacement?: Placement;
+    /**
+     * The accessible text for the trigger. Only necessary when the trigger is an icon.
+     */
+    triggerAccessibleText?: string;
+    /**
+     * Icon to trigger tooltip
+     */
+    triggerIcon?: 'circleInfo' | 'circleQuestion' | 'circleExclamation';
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Tooltip UI component
+ */
+export declare const Tooltip: ({ content, customTrigger, customZIndex, offsetValue, preferredPlacement, triggerAccessibleText, triggerIcon, className, ...props }: TooltipProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,27 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './indicator-badge.css';
+/**
+ * IndicatorBadge component props
+ */
+export interface IndicatorBadgeProps extends ComponentPropsWithoutRef<'span'> {
+    /**
+     * Badge color
+     */
+    color: 'critical' | 'info' | 'success' | 'neutral' | 'warning' | 'silver' | 'gold' | 'platinum' | 'diamond';
+    /**
+     * Badge text.
+     */
+    label: string;
+    /**
+     * Badge size
+     */
+    size: 'sm' | 'md';
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * IndicatorBadge UI component
+ */
+export declare const IndicatorBadge: ({ label, size, color, className, ...props }: IndicatorBadgeProps) => React.JSX.Element;

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

@@ -0,0 +1,35 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import './status-badge.css';
+/**
+ * StatusBadge component props
+ */
+export interface StatusBadgeProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Background color for badge
+     */
+    color?: 'transparent' | 'neutral' | 'reverse';
+    /**
+     * Should the badge show a status indicator.
+     */
+    hasStatusIndicator?: boolean;
+    /**
+     * Text for badge.
+     */
+    label: string;
+    /**
+     * Translatable text for status indicator — for screen readers.
+     */
+    statusIndicatorText?: string;
+    /**
+     * Status type for badge. Only renders if `hasStatusIndicator` is true.
+     */
+    statusType: 'success' | 'info' | 'frozen' | 'critical' | 'warning' | 'discovery' | 'disabled';
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * StatusBadge UI component
+ */
+export declare const StatusBadge: ({ color, hasStatusIndicator, label, statusIndicatorText, statusType, className, ...props }: StatusBadgeProps) => React.JSX.Element;