@pantheon-systems/pds-toolkit-react 1.0.0-dev.157 → 1.0.0-dev.159

package/_dist/components/Avatar/Avatar.d.ts

@@ -1,19 +1,29 @@
-export function Avatar({ size, imageSrc, linkContent, uniqueId, className, ...props }: {
-    [x: string]: any;
-    size?: string;
-    imageSrc: any;
-    linkContent: any;
-    uniqueId: any;
-    className: any;
-}): React.JSX.Element;
-export namespace Avatar {
-    namespace propTypes {
-        let size: PropTypes.Requireable<string>;
-        let imageSrc: PropTypes.Requireable<string>;
-        let linkContent: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        let uniqueId: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+import React, { ReactNode, ComponentPropsWithoutRef } from 'react';
+import './avatar.css';
+interface AvatarProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Avatar size.
+     */
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    /**
+     * Avatar image.
+     */
+    imageSrc?: string;
+    /**
+     * A link element using the router of your choice. Leave empty for no link.
+     */
+    linkContent?: ReactNode;
+    /**
+     * Unique ID associated with the avatar. Can be workspace ID, user ID, email, etc.
+     */
+    uniqueId?: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * Avatar UI component
+ */
+export declare const Avatar: ({ size, imageSrc, linkContent, uniqueId, className, ...props }: AvatarProps) => React.JSX.Element;
+export {};

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

@@ -620,5 +620,5 @@ declare const svgData: {
         readonly width: "576";
     };
 };
-export declare const iconList: ("angleDown" | "angleLeft" | "angleRight" | "angleUp" | "arrowDownToLine" | "arrowLeft" | "arrowRight" | "asterisk" | "banBug" | "bars" | "barsFilter" | "billboard" | "bitbucket" | "bolt" | "book" | "books" | "bracketRight" | "broomWide" | "building" | "buildings" | "calendarDays" | "ccAmex" | "ccDiscover" | "ccGeneric" | "ccMC" | "ccVisa" | "chartSimple" | "cloud" | "cloudArrowUp" | "code" | "codeBranch" | "codeMerge" | "caretDown" | "caretLeft" | "caretRight" | "caretUp" | "chartLine" | "chartNetwork" | "check" | "circle" | "circleExclamation" | "circleCheck" | "circleInfo" | "circleMinus" | "circleMinusOutline" | "circleNotch" | "circlePlus" | "circlePlusOutline" | "circleQuestion" | "circleXmark" | "command" | "comment" | "copy" | "diamondExclamation" | "discourse" | "download" | "drupal" | "ellipsis" | "ellipsisVertical" | "emptySet" | "exclamation" | "externalLink" | "eye" | "eyeSlash" | "facebook" | "file" | "fileContract" | "fileCSV" | "fileExport" | "fileImport" | "filePDF" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "magnifyingGlass" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "robot" | "rotate" | "rotateClock" | "rss" | "save" | "server" | "shield" | "shovel" | "siren" | "sitemap" | "slack" | "slashForward" | "slidersSimple" | "snowflake" | "sparkles" | "squareCheck" | "squareCode" | "squareMinus" | "squarePen" | "squareQuestion" | "squareTerminal" | "star" | "sun" | "table" | "terminal" | "threads" | "trash" | "triangleExclamation" | "twitter" | "upload" | "user" | "userGear" | "userPlus" | "users" | "video" | "wavePulse" | "windowRestore" | "wordpress" | "wrench" | "xmark" | "xmarkLarge" | "xTwitter" | "youtube")[];
+export declare const iconList: ("code" | "table" | "video" | "circle" | "angleDown" | "angleLeft" | "angleRight" | "angleUp" | "arrowDownToLine" | "arrowLeft" | "arrowRight" | "asterisk" | "banBug" | "bars" | "barsFilter" | "billboard" | "bitbucket" | "bolt" | "book" | "books" | "bracketRight" | "broomWide" | "building" | "buildings" | "calendarDays" | "ccAmex" | "ccDiscover" | "ccGeneric" | "ccMC" | "ccVisa" | "chartSimple" | "cloud" | "cloudArrowUp" | "codeBranch" | "codeMerge" | "caretDown" | "caretLeft" | "caretRight" | "caretUp" | "chartLine" | "chartNetwork" | "check" | "circleExclamation" | "circleCheck" | "circleInfo" | "circleMinus" | "circleMinusOutline" | "circleNotch" | "circlePlus" | "circlePlusOutline" | "circleQuestion" | "circleXmark" | "command" | "comment" | "copy" | "diamondExclamation" | "discourse" | "download" | "drupal" | "ellipsis" | "ellipsisVertical" | "emptySet" | "exclamation" | "externalLink" | "eye" | "eyeSlash" | "facebook" | "file" | "fileContract" | "fileCSV" | "fileExport" | "fileImport" | "filePDF" | "folder" | "gear" | "github" | "gitlab" | "globe" | "globeLine" | "graduationCap" | "grid" | "gripDots" | "gripDotsVertical" | "heart" | "house" | "idCard" | "instagram" | "keySkeleton" | "laptopCode" | "leaf" | "lifeRing" | "linkedin" | "linkSimple" | "linkSimpleSlash" | "magnifyingGlass" | "messages" | "minus" | "moon" | "paperclip" | "paperPlane" | "pen" | "phone" | "play" | "plus" | "quotesLeft" | "quotesRight" | "rectangleList" | "robot" | "rotate" | "rotateClock" | "rss" | "save" | "server" | "shield" | "shovel" | "siren" | "sitemap" | "slack" | "slashForward" | "slidersSimple" | "snowflake" | "sparkles" | "squareCheck" | "squareCode" | "squareMinus" | "squarePen" | "squareQuestion" | "squareTerminal" | "star" | "sun" | "terminal" | "threads" | "trash" | "triangleExclamation" | "twitter" | "upload" | "user" | "userGear" | "userPlus" | "users" | "wavePulse" | "windowRestore" | "wordpress" | "wrench" | "xmark" | "xmarkLarge" | "xTwitter" | "youtube")[];
 export {};

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

@@ -1,4 +1,6 @@
 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'> {
     /**
@@ -16,7 +18,11 @@ interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * 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?: number;
+    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.
      */
@@ -33,5 +39,5 @@ interface TooltipProps extends ComponentPropsWithoutRef<'div'> {
 /**
  * Tooltip UI component
  */
-export declare const Tooltip: ({ content, customTrigger, customZIndex, offsetValue, triggerAccessibleText, triggerIcon, className, ...props }: TooltipProps) => React.JSX.Element;
+export declare const Tooltip: ({ content, customTrigger, customZIndex, offsetValue, preferredPlacement, triggerAccessibleText, triggerIcon, className, ...props }: TooltipProps) => React.JSX.Element;
 export {};

package/_dist/components/inputs/Checkbox/Checkbox.d.ts

@@ -65,6 +65,10 @@ export interface CheckboxProps extends ComponentPropsWithoutRef<'div'> {
      * Is the field required?
      */
     required?: boolean;
+    /**
+     * Should the label be visible? If false, it will render for screen readers only.
+     */
+    showLabel?: boolean;
     /**
      * Validation message for the input field based on the validation status.
      */

package/_dist/components/navigation/DashboardNav/DashboardNav.d.ts

@@ -1,25 +1,43 @@
-export function DashboardNav({ ariaLabel, labels, menuItems, mobileMenuSelectTextFallback, className, ...props }: {
-    [x: string]: any;
-    ariaLabel?: string;
+import React, { ComponentPropsWithoutRef } from 'react';
+import { NavigationItem } from '@components/navigation/navigation-types';
+import { PDSIcon } from '@components/Icon/Icon';
+import './dashboard-nav.css';
+type DashboardNavItem = NavigationItem & {
+    /**
+     * Icon to display next to the link content.
+     */
+    icon?: PDSIcon;
+};
+/**
+ * Prop types for DashboardNav
+ */
+export interface DashboardNavProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for the navigation.
+     */
+    ariaLabel: string;
+    /**
+     * Labels for translatable strings.
+     */
     labels?: {
         submenu: string;
         toggle: string;
     };
-    menuItems: any;
+    /**
+     * Menu items to render.
+     */
+    menuItems: DashboardNavItem[];
+    /**
+     * Text to display in the mobile menu trigger button when no active link is found.
+     */
     mobileMenuSelectTextFallback?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace DashboardNav {
-    namespace propTypes {
-        let ariaLabel: PropTypes.Requireable<string>;
-        let labels: PropTypes.Requireable<PropTypes.InferProps<{
-            submenu: PropTypes.Requireable<string>;
-            toggle: PropTypes.Requireable<string>;
-        }>>;
-        let menuItems: PropTypes.Validator<any[]>;
-        let mobileMenuSelectTextFallback: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * DashboardNav UI component
+ */
+export declare const DashboardNav: ({ ariaLabel, labels, menuItems, mobileMenuSelectTextFallback, className, ...props }: DashboardNavProps) => React.JSX.Element;
+export {};

package/_dist/components/navigation/DropdownMenu/DropdownMenu.d.ts

@@ -1,17 +1,28 @@
-export function DropdownMenu({ headingText, menuItems, selectTextFallback, className, ...props }: {
-    [x: string]: any;
-    headingText: any;
-    menuItems: any;
-    selectTextFallback?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace DropdownMenu {
-    namespace propTypes {
-        let headingText: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        let menuItems: PropTypes.Validator<any[]>;
-        let selectTextFallback: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+import React, { ComponentPropsWithoutRef } from 'react';
+import { NavigationItem } from '@components/navigation/navigation-types';
+import './dropdown-menu.css';
+/**
+ * Prop types for DropdownMenu
+ */
+export interface DropdownMenuProps extends ComponentPropsWithoutRef<'div'> {
+    /**
+     * Heading text. If a string is passed, it will be rendered as a heading. If a link is passed, it will be rendered as a link.
+     */
+    headingText?: string | JSX.Element;
+    /**
+     * Menu items to render.
+     */
+    menuItems: NavigationItem[];
+    /**
+     * Text to display in the mobile menu trigger button when no active link is found.
+     */
+    selectTextFallback: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * DropdownMenu UI component
+ */
+export declare const DropdownMenu: ({ headingText, menuItems, selectTextFallback, className, ...props }: DropdownMenuProps) => React.JSX.Element;

package/_dist/components/navigation/SideNav/SideNav.d.ts

@@ -1,29 +1,47 @@
-export function SideNav({ ariaLabel, headingText, labels, menuItems, mobileMenuMaxWidth, mobileMenuSelectTextFallback, className, ...props }: {
-    [x: string]: any;
-    ariaLabel?: string;
-    headingText: any;
+import React, { ComponentPropsWithoutRef } from 'react';
+import { NavigationItem } from '@components/navigation/navigation-types';
+import './side-nav.css';
+/**
+ * Prop types for SideNav
+ */
+export interface SideNavProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for the navigation.
+     */
+    ariaLabel: string;
+    /**
+     * Whether the menu should be rendered as a mobile menu when the viewport is at or below the mobileMenuMaxWidth.
+     */
+    hasMobileMenu?: boolean;
+    /**
+     * Heading text. If a link is passed, it will be rendered as a link.
+     */
+    headingText?: string | JSX.Element;
+    /**
+     * Labels for translatable strings.
+     */
     labels?: {
         submenu: string;
         toggle: string;
     };
-    menuItems: any;
+    /**
+     * Menu items to render.
+     */
+    menuItems: NavigationItem[];
+    /**
+     *  Mobile menu will be enabled when viewport is at or below this number in pixels.
+     */
     mobileMenuMaxWidth?: number;
+    /**
+     * Text to display in the mobile menu trigger button when no active link is found.
+     */
     mobileMenuSelectTextFallback?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace SideNav {
-    namespace propTypes {
-        let ariaLabel: PropTypes.Requireable<string>;
-        let headingText: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        let labels: PropTypes.Requireable<PropTypes.InferProps<{
-            submenu: PropTypes.Requireable<string>;
-            toggle: PropTypes.Requireable<string>;
-        }>>;
-        let menuItems: PropTypes.Validator<any[]>;
-        let mobileMenuMaxWidth: PropTypes.Requireable<number>;
-        let mobileMenuSelectTextFallback: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * SideNav UI component
+ */
+export declare const SideNav: ({ ariaLabel, hasMobileMenu, headingText, labels, menuItems, mobileMenuMaxWidth, mobileMenuSelectTextFallback, className, ...props }: SideNavProps) => React.JSX.Element;

package/_dist/components/navigation/SideNavCompact/SideNavCompact.d.ts

@@ -1,29 +1,47 @@
-export function SideNavCompact({ ariaLabel, headingText, labels, menuItems, mobileMenuMaxWidth, mobileMenuSelectTextFallback, className, ...props }: {
-    [x: string]: any;
-    ariaLabel?: string;
-    headingText: any;
+import React, { ComponentPropsWithoutRef } from 'react';
+import { NavigationItem } from '@components/navigation/navigation-types';
+import './side-nav-compact.css';
+/**
+ * Prop types for SideNavCompact
+ */
+export interface SideNavCompactProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for the navigation.
+     */
+    ariaLabel: string;
+    /**
+     * Whether the menu should be rendered as a mobile menu when the viewport is at or below the mobileMenuMaxWidth.
+     */
+    hasMobileMenu?: boolean;
+    /**
+     * Heading text. If a link is passed, it will be rendered as a link.
+     */
+    headingText?: string | JSX.Element;
+    /**
+     * Labels for translatable strings.
+     */
     labels?: {
         submenu: string;
         toggle: string;
     };
-    menuItems: any;
+    /**
+     * Menu items to render.
+     */
+    menuItems: NavigationItem[];
+    /**
+     *  Mobile menu will be enabled when viewport is at or below this number in pixels.
+     */
     mobileMenuMaxWidth?: number;
+    /**
+     * Text to display in the mobile menu trigger button when no active link is found.
+     */
     mobileMenuSelectTextFallback?: string;
-    className: any;
-}): React.JSX.Element;
-export namespace SideNavCompact {
-    namespace propTypes {
-        let ariaLabel: PropTypes.Requireable<string>;
-        let headingText: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        let labels: PropTypes.Requireable<PropTypes.InferProps<{
-            submenu: PropTypes.Requireable<string>;
-            toggle: PropTypes.Requireable<string>;
-        }>>;
-        let menuItems: PropTypes.Validator<any[]>;
-        let mobileMenuMaxWidth: PropTypes.Requireable<number>;
-        let mobileMenuSelectTextFallback: PropTypes.Requireable<string>;
-        let className: PropTypes.Requireable<string>;
-    }
+    /**
+     * Additional class names
+     */
+    className?: string;
 }
-import React from 'react';
-import PropTypes from 'prop-types';
+/**
+ * SideNavCompact UI component
+ */
+export declare const SideNavCompact: ({ ariaLabel, hasMobileMenu, headingText, labels, menuItems, mobileMenuMaxWidth, mobileMenuSelectTextFallback, className, ...props }: SideNavCompactProps) => React.JSX.Element;

package/_dist/components/navigation/navigation-types.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+export type NavigationItem = {
+    /**
+     * A boolean indicating whether the item is the active item.
+     */
+    isActive?: boolean;
+    /**
+     * Link content — a fully-formed link element using the router of your choice. If a string is provided instead, the item will be rendered as a link that navigates to the first child item.
+     */
+    linkContent: JSX.Element | string;
+    /**
+     * Submenu items.
+     */
+    links?: NavigationItem[];
+};
+export type SingleLevelNavigationItem = {
+    /**
+     * A boolean indicating whether the item is the active item.
+     */
+    isActive?: boolean;
+    /**
+     * Link content — a fully-formed link element using the router of your choice.
+     */
+    linkContent: JSX.Element;
+};
+export type FlattenedNavigationItem = {
+    /**
+     * A boolean indicating whether the item is the active item.
+     */
+    isActive?: boolean;
+    /**
+     * Link content — a fully-formed link element using the router of your choice.
+     */
+    linkContent: JSX.Element;
+    /**
+     * Nesting level of the item.
+     */
+    level: 'top-level' | 'second-level' | 'third-level';
+};

package/_dist/components/navigation/navigation-utilities.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { NavigationItem } from '@components/navigation/navigation-types';
+export declare const isActiveItem: (item: NavigationItem) => boolean;
+export declare const isActiveTrail: (item: NavigationItem) => boolean;
+export declare const getActiveLink: (items: NavigationItem[]) => JSX.Element | null;
+export declare const getLinkContentString: (linkContent: JSX.Element | string) => string;
+export declare const processNavLinkContent: (linkContent: JSX.Element | string, links?: NavigationItem[]) => JSX.Element | string;

package/_dist/css/component-css/pds-avatar.css

@@ -1 +1 @@
-.pds-avatar{--pds-avatar-size:1.953rem;align-items:center;background-color:var(--pds-color-background-default);border:.0625rem solid transparent;border-radius:100%;display:inline-flex;height:var(--pds-avatar-size);justify-content:center;width:var(--pds-avatar-size)}.pds-avatar--image{border-color:var(--pds-color-border-default)}.pds-avatar--xs{--pds-avatar-size:1rem}.pds-avatar--sm{--pds-avatar-size:1.563rem}.pds-avatar--md{--pds-avatar-size:1.953rem}.pds-avatar--lg{--pds-avatar-size:2.441rem}a.pds-avatar:hover{outline:1px solid var(--pds-color-interactive-link-hover);outline-offset:.03125rem}a.pds-avatar:focus-visible{outline-width:2px}.pds-avatar img{border-radius:100%;height:100%;width:auto}.pds-avatar__user-fallback{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Ccircle cx='12.5' cy='12.5' r='12.5' fill='%23CFCFD3'/%3E%3Cpath fill='%2323232D' d='M12.5 11.75A3.48 3.48 0 0 1 9.465 10a3.48 3.48 0 0 1 0-3.5A3.54 3.54 0 0 1 12.5 4.75c1.23 0 2.379.684 3.008 1.75a3.48 3.48 0 0 1 0 3.5 3.47 3.47 0 0 1-3.008 1.75m-1.258 1.313h2.488a4.89 4.89 0 0 1 4.895 4.894c0 .438-.383.793-.82.793H7.168a.794.794 0 0 1-.793-.793c0-2.707 2.16-4.895 4.867-4.895'/%3E%3C/svg%3E")}
+.pds-avatar{display:inline-block}.pds-avatar,.pds-avatar__inner{--pds-avatar-size:1.953rem;border:.0625rem solid transparent;height:var(--pds-avatar-size);justify-content:center;width:var(--pds-avatar-size)}.pds-avatar__inner{align-items:center;background-color:var(--pds-color-background-default);border-radius:100%;display:inline-flex}.pds-avatar--image{border-color:var(--pds-color-border-default)}.pds-avatar--xs,.pds-avatar__inner--xs .pds-avatar__inner{--pds-avatar-size:1rem}.pds-avatar--sm,.pds-avatar__inner--sm .pds-avatar__inner{--pds-avatar-size:1.563rem}.pds-avatar--md,.pds-avatar__inner--md .pds-avatar__inner{--pds-avatar-size:1.953rem}.pds-avatar--lg,.pds-avatar__inner--lg .pds-avatar__inner{--pds-avatar-size:2.441rem}a.pds-avatar__inner{outline:1px solid transparent;outline-offset:.03125rem;transition:all 0s ease-out}a.pds-avatar__inner:hover{outline:1px solid var(--pds-color-interactive-link-hover)}a.pds-avatar__inner:focus-visible{outline-width:2px}.pds-avatar__inner img{border-radius:100%;height:100%;width:auto}.pds-avatar__user-fallback{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Ccircle cx='12.5' cy='12.5' r='12.5' fill='%23CFCFD3'/%3E%3Cpath fill='%2323232D' d='M12.5 11.75A3.48 3.48 0 0 1 9.465 10a3.48 3.48 0 0 1 0-3.5A3.54 3.54 0 0 1 12.5 4.75c1.23 0 2.379.684 3.008 1.75a3.48 3.48 0 0 1 0 3.5 3.47 3.47 0 0 1-3.008 1.75m-1.258 1.313h2.488a4.89 4.89 0 0 1 4.895 4.894c0 .438-.383.793-.82.793H7.168a.794.794 0 0 1-.793-.793c0-2.707 2.16-4.895 4.867-4.895'/%3E%3C/svg%3E")}

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

@@ -1,2 +1,5 @@
-.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-interactive-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;--pds-dashboard-nav-foreground-color:var(
+		--pds-color-dashboard-nav-item-foreground-default
+	);--pds-dashboard-nav-outline-color:var(--pds-color-interactive-focus);font-family:Poppins,sans-serif}.pds-dashboard-nav,.pds-dashboard-nav a{color:var(--pds-dashboard-nav-foreground-color)}.pds-dashboard-nav a{text-decoration:none}.pds-dashboard-nav a:focus-visible,.pds-dashboard-nav button:focus-visible{border-radius:.375rem;outline:.0625rem solid var(--pds-dashboard-nav-outline-color);outline-offset:-.125rem}.pds-dashboard-nav .pds-icon{pointer-events:none}.pds-dashboard-nav__logo{box-sizing:content-box;margin-block-end:1.563rem;margin-block-start:.125rem;padding-inline:calc(var(--pds-spacing-dashboard-nav-item-padding) + .1875rem)}.pds-dashboard-nav__menu{display:flex;flex-direction:column;list-style-type:none;margin:0;padding:0;row-gap:1rem}.pds-dashboard-nav__item{list-style-type:none}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-wrapper{align-items:center;border-radius:.375rem;display:flex;height:var(--pds-spacing-dashboard-nav-item-height);justify-content:space-between;width:100%}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-wrapper:hover{background-color:var(--pds-color-dashboard-nav-item-background-hover);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-wrapper a{border-radius:.375rem;box-sizing:border-box;padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-inner{align-items:center;display:flex}.pds-dashboard-nav__item--top-level a{box-shadow:none;outline:none}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--active .pds-dashboard-nav__item-wrapper{--pds-dashboard-nav-foreground-color:var(
+			--pds-color-dashboard-nav-item-foreground-active
+		);--pds-dashboard-nav-outline-color:var(--pds-color-brand-primary-default);background-color:var(--pds-color-dashboard-nav-item-background-active)}.pds-dashboard-nav__link-icon{align-items:center;display:flex;flex-grow:0;flex-shrink:0;height:var(--pds-spacing-dashboard-nav-item-height);justify-content:center;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__menu--second-level{color:var(--pds-color-dashboard-nav-item-foreground-default);display:none;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;row-gap:.64rem}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:hover{color:var(--pds-color-interactive-link-hover)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level.pds-dashboard-nav__item--active a{color:var(--pds-color-interactive-link-hover);font-weight:600}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:focus-visible{border-radius:1px;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;color:var(--pds-dashboard-nav-foreground-color);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{padding-inline:.125rem;transform:rotate(0deg);transition:all .2s ease-in-out 0s}.pds-dashboard-nav__toggle--expanded .pds-icon{transform:rotate(180deg);transition:all .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__item--top-level.pds-dashboard-nav__item--collapsed .pds-dashboard-nav__item-wrapper a{width:2.875rem}.pds-dashboard-nav__flyout{background-color:var(--pds-color-menu-background);border-radius:.375rem;box-shadow:var(--pds-elevation-overlay);max-width:30rem;padding:.64rem;width:max-content;z-index:200}.pds-dashboard-nav__flyout-heading{color:var(--pds-color-menu-item-heading-text);font-family:Poppins,sans-serif;font-size:.833rem;font-weight:400;line-height:120%;padding:.64rem .8rem}.pds-dashboard-nav__menu--flyout{row-gap:0}.pds-dashboard-nav__item--second-level-flyout{background-color:var(--pds-color-menu-item-background-default);color:var(--pds-color-menu-item-foreground);cursor:pointer;font-size:1rem;line-height:120%;margin:0;padding:.64rem .8rem}.pds-dashboard-nav__item--second-level-flyout:hover{background-color:var(--pds-color-menu-item-background-hover);border-radius:.375rem}.pds-dashboard-nav__item--second-level-flyout.pds-dashboard-nav__item--active a{color:var(--pds-color-interactive-link-hover);font-weight:600}.pds-dashboard-nav__item--second-level-flyout a:focus-visible{border-radius:1px;outline:.0625rem solid var(--pds-color-interactive-focus);outline-offset:4px;transition:outline .2s ease-in-out 0s}.pds-dashboard-nav .pds-tooltip__container{padding:.25rem .512rem}.pds-dashboard-nav .pds-dropdown-menu__item a{padding-block:.41rem;padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav .pds-dropdown-menu__item .pds-dashboard-nav__item-inner{align-items:center;display:flex}.pds-dashboard-nav .pds-dropdown-menu__item--second-level{padding-block:.25rem;padding-inline-start:calc(var(--pds-dashboard-nav-icon-width) + var(--pds-dashboard-nav-space-after-icon) + .0625rem)}

package/_dist/css/component-css/pds-dropdown-menu.css

@@ -1,2 +1,2 @@
 .pds-dropdown-menu{position:relative}.pds-dropdown-menu__heading{font-size:1rem;font-weight:600;margin-block-end:.64rem}.pds-dropdown-menu__heading a{color:var(--pds-color-text-default);text-decoration:none}.pds-dropdown-menu__heading a:hover{color:var(--pds-color-interactive-link-hover)}.pds-dropdown-menu__trigger{align-items:center;background-color:var(--pds-color-input-background-default);border:.0625rem solid var(--pds-color-input-border-default);border-radius:.1875rem;color:var(--pds-color-input-foreground-default);cursor:pointer;display:flex;height:2.441rem;justify-content:space-between;padding:0 .64rem;text-align:left;width:100%}.pds-dropdown-menu__trigger:focus-visible{outline:.0625rem solid var(--pds-color-interactive-focus)}.pds-dropdown-menu__trigger-icon{transition:transform .2s ease-in-out 0s}.pds-dropdown-menu__trigger[aria-expanded=true]
-	.pds-dropdown-menu__trigger-icon{transform:rotate(180deg);transition:transform .2s ease-in-out 0s}.pds-dropdown-menu__dropdown{background-color:var(--pds-color-menu-background);border-radius:.1875rem;box-shadow:var(--pds-elevation-active);list-style-type:none;margin-block-start:.64rem;max-height:30rem;overflow-y:scroll;padding:0;position:absolute;width:100%;z-index:200}.pds-dropdown-menu__dropdown a{color:var(--pds-color-menu-item-foreground);display:flex;padding:.64rem 1rem;text-decoration:none}.pds-dropdown-menu__dropdown:focus{outline:none}.pds-dropdown-menu__item:focus{background-color:var(--pds-color-menu-item-background-hover);outline:none}.pds-dropdown-menu__item--second-level a{padding-inline-start:1.953rem}.pds-dropdown-menu__item--third-level a{padding-inline-start:2.953rem}.pds-dropdown-menu__active-label{display:flex;padding-inline-start:.25rem}.pds-dropdown-menu__item--active{align-items:center;background-color:var(--pds-color-side-nav-background-hover);color:var(--pds-color-interactive-link-hover);display:flex;justify-content:space-between}.pds-dropdown-menu__active-icon{flex-shrink:0;margin-inline:1rem}
+	.pds-dropdown-menu__trigger-icon{transform:rotate(180deg);transition:transform .2s ease-in-out 0s}.pds-dropdown-menu__dropdown{background-color:var(--pds-color-menu-background);border-radius:.1875rem;box-shadow:var(--pds-elevation-active);list-style-type:none;margin-block-start:.64rem;max-height:30rem;overflow-y:scroll;padding:0;position:absolute;width:100%;z-index:200}.pds-dropdown-menu__dropdown a{color:var(--pds-color-menu-item-foreground);display:flex;padding:.64rem 1rem;text-decoration:none}.pds-dropdown-menu__dropdown:focus{outline:none}.pds-dropdown-menu__item:focus,.pds-dropdown-menu__item:hover{background-color:var(--pds-color-menu-item-background-hover);outline:none}.pds-dropdown-menu__item--second-level a{padding-inline-start:2.441rem}.pds-dropdown-menu__item--third-level a{padding-inline-start:4.004rem}.pds-dropdown-menu__active-label{display:flex;padding-inline-start:.25rem}.pds-dropdown-menu__item--active{align-items:center;background-color:var(--pds-color-menu-item-background-active);color:var(--pds-color-foreground-default);display:flex;justify-content:space-between}.pds-dropdown-menu__active-icon{flex-shrink:0;margin-inline:1rem}