@pantheon-systems/pds-toolkit-react 1.0.0-dev.18 → 1.0.0-dev.180

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,32 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import './pantheon-logo.css';
+export type PantheonLogoDisplayType = 'full' | 'icon' | 'wordmark' | 'sub-brand';
+/**
+ * Prop types for PantheonLogo
+ */
+export interface PantheonLogoProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Color type. Use 'default' unless the logo is used on an approved dark background.
+     */
+    colorType?: 'default' | 'reverse';
+    /**
+     * Display type
+     */
+    displayType?: PantheonLogoDisplayType;
+    /**
+     * A fully-formed link element using the router of your choice. The link text will be used as the aria-label. If the logo should not be a link, set to `null`.
+     */
+    linkContent?: ReactNode;
+    /**
+     * Accepts a fully-formed link or a string (if a static site name is desired). Will only render if the `display-type` is set to 'sub-brand'.
+     */
+    subBrand?: ReactNode | string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * PantheonLogo UI component
+ */
+export declare const PantheonLogo: ({ colorType, displayType, linkContent, subBrand, className, ...props }: PantheonLogoProps) => React.JSX.Element;

package/_dist/components/PantheonLogo/pantheon-logo-data.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const logoFull: React.JSX.Element;
+export declare const logoIcon: React.JSX.Element;
+export declare const logoWordmark: React.JSX.Element;

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,23 @@
+import React, { ComponentPropsWithoutRef } from 'react';
+import { PDSIcon } from '@components/Icon/Icon';
+import './social-links.css';
+interface SocialLinksProps extends ComponentPropsWithoutRef<'ul'> {
+    /**
+     * Array of social media links
+     */
+    linkItems?: (keyof typeof socialData)[];
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+declare const socialData: Record<string, {
+    icon: PDSIcon;
+    url: string;
+    label: string;
+}>;
+/**
+ * SocialLinks UI component
+ */
+export declare const SocialLinks: ({ linkItems, className, ...props }: SocialLinksProps) => React.JSX.Element;
+export {};

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,51 @@
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { Placement } from '@floating-ui/react';
+import { FuiOffset } from '@libs/types/custom-types';
+import './tooltip.css';
+interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Text to display in tooltip container.
+     */
+    content: string;
+    /**
+     * String or HTML content to use as the trigger instead of an icon. Leave null to use the icon.
+     */
+    customTrigger?: ReactNode;
+    /**
+     * The spacing between the trigger and the tooltip in pixels. Use the default value (in most cases) when using an icon trigger.
+     */
+    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';
+    /**
+     * Color of the trigger icon. Uses PDS default text color options.
+     */
+    triggerIconColor?: 'default' | 'default-secondary' | 'critical';
+    /**
+     * Size of the trigger icon. Uses PDS Icon sizing.
+     */
+    triggerIconSize?: 'sm' | 'md' | 'lg';
+    /**
+     * Z-index value for the tooltip container. In most cases, the default value should be retained.
+     */
+    zIndex?: number;
+    /**
+     * Additional class names
+     */
+    className?: string;
+}
+/**
+ * Tooltip UI component
+ */
+export declare const Tooltip: ({ content, customTrigger, offsetValue, preferredPlacement, triggerAccessibleText, triggerIcon, triggerIconColor, triggerIconSize, zIndex, 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;