@pantheon-systems/pds-toolkit-react 1.0.0-dev.147 → 1.0.0-dev.148

package/_dist/components/CTALink/CTALink.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, ComponentPropsWithoutRef } from 'react';
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import './cta-link.css';
 export interface CTALinkProps extends ComponentPropsWithoutRef<'div'> {
     /**

package/_dist/components/Callout/Callout.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import React, { ComponentPropsWithoutRef } from 'react';
 import './callout.css';
-interface CalloutProps {
+export interface CalloutProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Callout main content.
      */
@@ -22,4 +22,3 @@ interface CalloutProps {
  * Callout UI component
  */
 export declare const Callout: ({ children, title, type, className, ...props }: CalloutProps) => React.JSX.Element;
-export {};

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

@@ -1,4 +1,4 @@
-import React, { ReactNode, ComponentPropsWithoutRef } from 'react';
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import './comparison-list.css';
 interface TypeLabels {
     included: string;
@@ -33,7 +33,7 @@ export interface ComparisonListProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Additional class names
      */
-    className: string;
+    className?: string;
 }
 /**
  * ComparisonList UI component

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

@@ -1,25 +1,40 @@
-export function Modal({ ariaLabel, children, hasCloseButton, modalIsOpen, setModalIsOpen, size, title, className, ...props }: {
-    [x: string]: any;
-    ariaLabel: any;
-    children: any;
+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;
-    setModalIsOpen?: () => void;
-    size?: string;
-    title: any;
-    className: any;
-}): React.JSX.Element;
-export namespace Modal {
-    namespace propTypes {
-        let ariaLabel: PropTypes.Requireable<string>;
-        let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let hasCloseButton: PropTypes.Requireable<boolean>;
-        let modalIsOpen: PropTypes.Requireable<boolean>;
-        let setModalIsOpen: PropTypes.Requireable<(...args: any[]) => any>;
-        let size: PropTypes.Requireable<string>;
-        let title: PropTypes.Validator<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * 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;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Modal UI component
+ */
+export declare const Modal: ({ ariaLabel, children, hasCloseButton, modalIsOpen, setModalIsOpen, size, title, className, ...props }: ModalProps) => React.JSX.Element;

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

@@ -1,15 +1,30 @@
-export function Panel({ children, variant, className, ...props }: {
-    [x: string]: any;
-    children: any;
-    variant?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace Panel {
-    namespace propTypes {
-        let children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-        let variant: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+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;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Panel UI component
+ */
+export declare const Panel: ({ children, hasStatusIndicator, statusType, variant, className, ...props }: PanelProps) => React.JSX.Element;
+export {};

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

@@ -1,33 +1,57 @@
-export function Popover({ content, customTrigger, hasCloseButton, offsetValue, onClose, placement, title, triggerIcon, triggerAccessibleText, popoverIsOpen, setPopoverIsOpen, className, ...props }: {
-    [x: string]: any;
-    content: any;
-    customTrigger?: boolean;
+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;
-    placement?: string;
-    title: any;
-    triggerIcon?: string;
+    /**
+     * 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;
-    setPopoverIsOpen?: () => void;
-    className: any;
-}): React.JSX.Element;
-export namespace Popover {
-    namespace propTypes {
-        let content: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let customTrigger: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let hasCloseButton: PropTypes.Requireable<boolean>;
-        let offsetValue: PropTypes.Requireable<number>;
-        let onClose: PropTypes.Requireable<(...args: any[]) => any>;
-        let placement: PropTypes.Requireable<string>;
-        let title: PropTypes.Requireable<string>;
-        let triggerAccessibleText: PropTypes.Requireable<string>;
-        let triggerIcon: PropTypes.Requireable<string>;
-        let popoverIsOpen: PropTypes.Requireable<boolean>;
-        let setPopoverIsOpen: PropTypes.Requireable<(...args: any[]) => any>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Function to set Popover open state
+     */
+    setPopoverIsOpen?: (isOpen: boolean) => void;
+    /**
+     * Additional class names.
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * 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/Skiplink/Skiplink.d.ts

@@ -1,15 +1,21 @@
-export function Skiplink({ destination, text, className, ...props }: {
-    [x: string]: any;
-    destination?: string;
-    text?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace Skiplink {
-    namespace propTypes {
-        let destination: PropTypes.Requireable<string>;
-        let text: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+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;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Skiplink UI component
+ */
+export declare const Skiplink: ({ destination, text, className, ...props }: SkiplinkProps) => React.JSX.Element;
+export {};

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

@@ -1,23 +1,39 @@
-export function Tag({ linkContent, isRemovable, onRemove, removeLabel, tagColor, tagLabel, className, ...props }: {
-    [x: string]: any;
-    linkContent: any;
-    isRemovable: any;
-    onRemove: any;
+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;
-    tagColor: any;
-    tagLabel: any;
-    className: any;
-}): React.JSX.Element;
-export namespace Tag {
-    namespace propTypes {
-        let linkContent: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let isRemovable: PropTypes.Requireable<boolean>;
-        let onRemove: PropTypes.Requireable<(...args: any[]) => any>;
-        let removeLabel: PropTypes.Requireable<string>;
-        let tagColor: PropTypes.Requireable<string>;
-        let tagLabel: PropTypes.Validator<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Tag color. Will use random color if not selected.
+     */
+    tagColor?: TagColor;
+    /**
+     * Tag text
+     */
+    tagLabel: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Tag UI component
+ */
+export declare const Tag: ({ linkContent, isRemovable, onRemove, removeLabel, tagColor, tagLabel, className, ...props }: TagProps) => React.JSX.Element;
+export {};

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

@@ -1,9 +1,9 @@
-import React from 'react';
+import React, { ComponentPropsWithoutRef } from 'react';
 import './indicator-badge.css';
 /**
  * IndicatorBadge component props
  */
-interface IndicatorBadgeProps {
+export interface IndicatorBadgeProps extends ComponentPropsWithoutRef<'span'> {
     /**
      * Badge color
      */
@@ -25,4 +25,3 @@ interface IndicatorBadgeProps {
  * IndicatorBadge UI component
  */
 export declare const IndicatorBadge: ({ label, size, color, className, ...props }: IndicatorBadgeProps) => React.JSX.Element;
-export {};

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

@@ -1,9 +1,9 @@
-import React from 'react';
+import React, { ComponentPropsWithoutRef } from 'react';
 import './status-badge.css';
 /**
  * StatusBadge component props
  */
-interface StatusBadgeProps {
+export interface StatusBadgeProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Background color for badge
      */
@@ -33,4 +33,3 @@ interface StatusBadgeProps {
  * StatusBadge UI component
  */
 export declare const StatusBadge: ({ color, hasStatusIndicator, label, statusIndicatorText, statusType, className, ...props }: StatusBadgeProps) => React.JSX.Element;
-export {};

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentPropsWithoutRef } from 'react';
 import './tally.css';
 interface TypeLabels {
     info?: string;
@@ -10,7 +10,7 @@ interface TypeLabels {
 /**
  * Prop types for Tally
  */
-interface TallyProps {
+export interface TallyProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Label text
      */
@@ -25,7 +25,7 @@ interface TallyProps {
     typeLabels?: TypeLabels;
     /**
      * Additional class names
-    */
+     */
     className?: string;
 }
 /**

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

@@ -4,7 +4,7 @@ import './segmented-button.css';
 /**
  * Prop types for SegmentedButton
  */
-interface SegmentedButtonProps {
+export interface SegmentedButtonProps {
     /**
      * Is the ToggleButton disabled?
      */
@@ -43,4 +43,3 @@ interface SegmentedButtonProps {
  * SegmentedButton UI component
  */
 export declare const SegmentedButton: ({ disabled, id, initialSelection, label, onChange, options, className, ...props }: SegmentedButtonProps) => React.JSX.Element;
-export {};

package/_dist/components/notifications/InlineMessage/InlineMessage.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, ComponentPropsWithoutRef } from 'react';
+import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import './inline-message.css';
 /**
  * The type of message to display.

package/_dist/components/notifications/SectionMessage/SectionMessage.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode, MouseEvent, ComponentPropsWithoutRef } from 'react';
+import React, { ComponentPropsWithoutRef, MouseEvent, ReactNode } from 'react';
 import './section-message.css';
 type MessageType = 'info' | 'success' | 'warning' | 'critical' | 'discovery';
 type TypeLabels = Record<MessageType, string>;
@@ -38,7 +38,7 @@ export interface SectionMessageProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Additional class names.
      */
-    className: string;
+    className?: string;
 }
 /**
  * SectionMessage UI component

package/_dist/components/progress-indicators/Spinner/Spinner.d.ts

@@ -1,21 +1,33 @@
-export function Spinner({ colorType, isInline, label, showLabel, size, className, ...props }: {
-    [x: string]: any;
-    colorType?: string;
+import React, { ComponentPropsWithoutRef } from 'react';
+import './spinner.css';
+interface SpinnerProps extends ComponentPropsWithoutRef<'span'> {
+    /**
+     * Spinner color
+     */
+    colorType?: 'full-color' | 'monochromatic' | 'monochromatic-reverse';
+    /**
+     * Should the spinner be an inline element? If true, it will be displayed inline-block without a visible label.
+     */
     isInline?: boolean;
+    /**
+     * Spinner label. Will be displayed below the Spinner if `showLabel` is true.
+     */
     label?: string;
+    /**
+     * Should the label be visible? If false, it will render for screen readers only.
+     */
     showLabel?: boolean;
-    size?: string;
+    /**
+     * Spinner size
+     */
+    size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
+    /**
+     * Additional class names
+     */
     className?: string;
-}): React.JSX.Element;
-export namespace Spinner {
-    namespace propTypes {
-        let colorType: PropTypes.Requireable<string>;
-        let isInline: PropTypes.Requireable<boolean>;
-        let label: PropTypes.Validator<string>;
-        let showLabel: PropTypes.Requireable<boolean>;
-        let size: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Spinner UI component
+ */
+export declare const Spinner: ({ colorType, isInline, label, showLabel, size, className, ...props }: SpinnerProps) => React.JSX.Element;
+export {};

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

@@ -1,2 +1,2 @@
-.pds-dashboard-nav{--pds-dashboard-nav-icon-width:1.563rem;--pds-dashboard-nav-space-after-icon:0.64rem;color:var(--pds-color-text-default);font-family:Poppins,sans-serif}.pds-dashboard-nav a{color:var(--pds-color-text-default);text-decoration:none}.pds-dashboard-nav .pds-icon{pointer-events:none}.pds-dashboard-nav__logo{margin-block-end:1.563rem;padding-inline:calc(var(--pds-spacing-dashboard-nav-item-padding) + .1875rem)}.pds-dashboard-nav__menu{list-style-type:none;margin:0;padding:0}.pds-dashboard-nav__item{list-style-type:none}.pds-dashboard-nav__menu--top-level{display:flex;flex-direction:column;row-gap:1rem}.pds-dashboard-nav__link-icon{align-items:center;display:flex;flex-grow:0;flex-shrink:0;justify-content:center;margin-block-start:-.0625rem;margin-inline-end:var(--pds-dashboard-nav-space-after-icon);width:var(--pds-dashboard-nav-icon-width)}.pds-dashboard-nav__link-icon .pds-icon--house,.pds-dashboard-nav__link-icon .pds-icon--robot{margin-block-start:-.125rem}.pds-dashboard-nav__item--top-level:not(.pds-dashboard-nav__item--has-children) a{align-items:center;border-radius:.375rem;box-sizing:border-box;color:var(--pds-color-dashboard-nav-item-foreground-default);display:flex;height:var(--pds-spacing-dashboard-nav-item-height);padding-inline:var(--pds-spacing-dashboard-nav-item-padding)}.pds-dashboard-nav__item--top-level:not(.pds-dashboard-nav__item--has-children) a:hover{background-color:var(--pds-color-dashboard-nav-item-background-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner{align-items:center;border-radius:.375rem;display:flex;height:var(--pds-spacing-dashboard-nav-item-height)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover{background-color:var(--pds-color-dashboard-nav-item-background-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover .pds-icon,.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover a{color:var(--pds-color-dashboard-nav-item-foreground-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__link{align-items:center;display:flex;height:var(--pds-spacing-dashboard-nav-item-height);padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav__link:focus-visible{border-radius:.375rem;outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:-1px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link{background-color:var(--pds-color-dashboard-nav-item-background-active);color:var(--pds-color-dashboard-nav-item-foreground-active)}.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link .pds-icon,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link a,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link .pds-icon,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link a{color:var(--pds-color-dashboard-nav-item-foreground-active)}.pds-dashboard-nav__item--active
-	.pds-dashboard-nav__toggle--expanded:focus-visible,.pds-dashboard-nav__item--active a:focus-visible{outline-color:var(--pds-color-brand-primary-default)}.pds-dashboard-nav__menu--second-level{color:var(--pds-color-dashboard-nav-item-foreground-default);display:none;font-size:.833rem;margin-block-start:.8rem;padding-inline-start:calc(var(--pds-spacing-dashboard-nav-item-padding) + var(--pds-dashboard-nav-icon-width) + var(--pds-dashboard-nav-space-after-icon))}.pds-dashboard-nav__menu--second-level.pds-dashboard-nav__menu--expanded{display:flex;flex-direction:column;row-gap:.64rem}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a{display:inline-block;height:unset}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:hover,.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level.pds-dashboard-nav__item--active a{color:var(--pds-color-link-hover)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:focus-visible{border-radius:.1875rem;outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:4px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__toggle{align-items:center;background-color:transparent;border:none;border-radius:.375rem;cursor:pointer;display:flex;height:var(--pds-spacing-dashboard-nav-item-height);justify-content:flex-end;padding-inline:var(--pds-spacing-dashboard-nav-item-padding)}.pds-dashboard-nav__toggle .pds-icon{margin-block-start:.0625rem;padding-inline:.125rem;transform:rotate(0deg);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__toggle--expanded .pds-icon{margin-block-start:.0625rem;transform:rotate(180deg);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__toggle:hover{background-color:var(--pds-dashboard-active-background-color)}.pds-dashboard-nav__toggle:hover,.pds-dashboard-nav__toggle:hover .pds-icon{color:var(--pds-dashboard-active-foreground-color)}.pds-dashboard-nav__toggle:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:-1px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__link-label{opacity:1;transition:opacity .1s ease-in-out}.pds-dashboard-nav--collapsed .pds-dashboard-nav__link-label{opacity:0;transition:opacity .1s ease-in-out}.pds-dashboard-nav--collapsed .pds-dashboard-nav__menu--second-level.pds-dashboard-nav__menu--expanded{display:none}.pds-dashboard-nav .pds-dropdown-menu__item--second-level a{color:var(--pds-color-text-default-secondary);padding-inline-start:3.25rem}
+.pds-dashboard-nav{--pds-dashboard-nav-icon-width:1.563rem;--pds-dashboard-nav-space-after-icon:0.64rem;color:var(--pds-color-text-default);font-family:Poppins,sans-serif}.pds-dashboard-nav a{color:var(--pds-color-text-default);text-decoration:none}.pds-dashboard-nav .pds-icon{pointer-events:none}.pds-dashboard-nav__logo{box-sizing:content-box;margin-block-end:1.563rem;padding-inline:calc(var(--pds-spacing-dashboard-nav-item-padding) + .1875rem)}.pds-dashboard-nav__menu{list-style-type:none;margin:0;padding:0}.pds-dashboard-nav__item{list-style-type:none}.pds-dashboard-nav__menu--top-level{display:flex;flex-direction:column;row-gap:1rem}.pds-dashboard-nav__link-icon{align-items:center;display:flex;flex-grow:0;flex-shrink:0;justify-content:center;margin-block-start:-.0625rem;margin-inline-end:var(--pds-dashboard-nav-space-after-icon);width:var(--pds-dashboard-nav-icon-width)}.pds-dashboard-nav__link-icon .pds-icon--house,.pds-dashboard-nav__link-icon .pds-icon--robot{margin-block-start:-.125rem}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__link,.pds-dashboard-nav__item--top-level a{box-shadow:none;outline:none}.pds-dashboard-nav__item--top-level:not(.pds-dashboard-nav__item--has-children) a{align-items:center;border-radius:.375rem;box-sizing:border-box;color:var(--pds-color-dashboard-nav-item-foreground-default);display:flex;height:var(--pds-spacing-dashboard-nav-item-height);padding-inline:var(--pds-spacing-dashboard-nav-item-padding)}.pds-dashboard-nav__item--top-level:not(.pds-dashboard-nav__item--has-children) a:hover{background-color:var(--pds-color-dashboard-nav-item-background-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner{align-items:center;border-radius:.375rem;display:flex;height:var(--pds-spacing-dashboard-nav-item-height)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover{background-color:var(--pds-color-dashboard-nav-item-background-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover .pds-icon,.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__item-inner:hover a{color:var(--pds-color-dashboard-nav-item-foreground-hover)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--has-children .pds-dashboard-nav__link{align-items:center;display:flex;height:var(--pds-spacing-dashboard-nav-item-height);padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav__link:focus-visible{border-radius:.375rem;outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:-1px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link{background-color:var(--pds-color-dashboard-nav-item-background-active);color:var(--pds-color-dashboard-nav-item-foreground-active)}.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active.pds-dashboard-nav__item--has-children:hover>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active:hover>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link .pds-icon,.pds-dashboard-nav__item--active:hover>a.pds-dashboard-nav__link a,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner .pds-icon,.pds-dashboard-nav__item--active>.pds-dashboard-nav__item-inner a,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link .pds-icon,.pds-dashboard-nav__item--active>a.pds-dashboard-nav__link a{color:var(--pds-color-dashboard-nav-item-foreground-active)}.pds-dashboard-nav__item--active
+	.pds-dashboard-nav__toggle--expanded:focus-visible,.pds-dashboard-nav__item--active a:focus-visible{outline-color:var(--pds-color-brand-primary-default)}.pds-dashboard-nav__menu--second-level{color:var(--pds-color-dashboard-nav-item-foreground-default);display:none;font-size:.833rem;margin-block-start:.8rem;padding-inline-start:calc(var(--pds-spacing-dashboard-nav-item-padding) + var(--pds-dashboard-nav-icon-width) + var(--pds-dashboard-nav-space-after-icon))}.pds-dashboard-nav__menu--second-level.pds-dashboard-nav__menu--expanded{display:flex;flex-direction:column;row-gap:.64rem}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a{box-shadow:none;display:inline-block;height:unset;outline:none}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:hover,.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level.pds-dashboard-nav__item--active a{color:var(--pds-color-link-hover)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:focus-visible{border-radius:.1875rem;outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:4px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__toggle{align-items:center;background-color:transparent;border:none;border-radius:.375rem;cursor:pointer;display:flex;height:var(--pds-spacing-dashboard-nav-item-height);justify-content:flex-end;padding-inline:var(--pds-spacing-dashboard-nav-item-padding)}.pds-dashboard-nav__toggle .pds-icon{margin-block-start:.0625rem;padding-inline:.125rem;transform:rotate(0deg);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__toggle--expanded .pds-icon{margin-block-start:.0625rem;transform:rotate(180deg);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__toggle:hover{background-color:var(--pds-dashboard-active-background-color)}.pds-dashboard-nav__toggle:hover,.pds-dashboard-nav__toggle:hover .pds-icon{color:var(--pds-dashboard-active-foreground-color)}.pds-dashboard-nav__toggle:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:-1px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav__link-label{opacity:1;transition:opacity .1s ease-in-out}.pds-dashboard-nav--collapsed .pds-dashboard-nav__link-label{opacity:0;transition:opacity .1s ease-in-out}.pds-dashboard-nav--collapsed .pds-dashboard-nav__menu--second-level.pds-dashboard-nav__menu--expanded{display:none}.pds-dashboard-nav .pds-dropdown-menu__item--second-level a{color:var(--pds-color-text-default-secondary);padding-inline-start:3.25rem}