@pantheon-systems/pds-toolkit-react 2.0.0-alpha.5 → 2.0.0-alpha.50

package/dist/components/inputs/ComboboxMultiselect/ComboboxMultiselect.d.ts

@@ -1,5 +1,6 @@
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
 import './combobox-multiselect.css';
+export type ComboboxMultiselectSize = 's' | 'm';
 type LabelStrings = {
     aiBadgeLabel?: string;
     aiPanelButton?: string;
@@ -16,7 +17,7 @@ export interface OptionProps {
     id: string;
     label: string;
 }
-interface AuxiliaryPanel {
+interface AiSuggestionsPanel {
     content?: ReactNode;
     disableRefresh?: boolean;
     isFetching?: boolean;
@@ -30,9 +31,9 @@ type DivProps = Omit<ComponentPropsWithoutRef<'div'>, 'onChange'>;
  */
 export interface ComboboxMultiselectProps extends DivProps {
     /**
-     * Optional auxiliary panel configuration (e.g., for AI suggestions)
+     * AI suggestions panel configuration. When provided, shows a sparkle button that opens a floating suggestions panel.
      */
-    auxiliaryPanel?: AuxiliaryPanel;
+    aiSuggestions?: AiSuggestionsPanel;
     /**
      * Additional class names
      */
@@ -50,7 +51,7 @@ export interface ComboboxMultiselectProps extends DivProps {
      */
     initialSelectedItems?: OptionProps[];
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -97,9 +98,13 @@ export interface ComboboxMultiselectProps extends DivProps {
      * Should the label be visible? If false, it will render for screen readers only.
      */
     showLabel?: boolean;
+    /**
+     * Size of the combobox multiselect field.
+     */
+    size?: ComboboxMultiselectSize;
 }
 /**
  * ComboboxMultiselect UI component
  */
-export declare const ComboboxMultiselect: ({ auxiliaryPanel, className, disabled, id, initialSelectedItems, inputWidth, isLoading, label, labelStrings, loadingText, noResultsText, onChange, options, placeholder, required, showAllTags, showLabel, ...props }: ComboboxMultiselectProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ComboboxMultiselect: ({ aiSuggestions, className, disabled, id, initialSelectedItems, inputWidth, isLoading, label, labelStrings, loadingText, noResultsText, onChange, options, placeholder, required, showAllTags, showLabel, size, ...props }: ComboboxMultiselectProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/Datepicker/Datepicker.d.ts

@@ -1,15 +1,21 @@
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
 import { Locale } from 'date-fns';
 import { DateRange } from 'react-day-picker';
+import { ValidationStatus } from '../../../libs/types/input-types';
 import 'react-day-picker/dist/style.css';
 import './datepicker.css';
-type PresetType = 'today' | 'current-week' | 'current-month' | 'last-week' | 'last-month';
+export type PresetType = 'today' | 'current-week' | 'current-month' | 'last-week' | 'last-month';
 export interface CustomPresetConfig {
     custom?: () => DateRange;
     days?: number;
     label: string;
     type?: PresetType;
 }
+/**
+ * Converts a preset config to a DateRange. Use this alongside an external
+ * SegmentedButton, Select, or other control to compose preset date pickers.
+ */
+export declare const getPresetDateRange: (preset: CustomPresetConfig) => DateRange;
 export interface DatepickerTranslationStrings {
     clearButton?: string;
     doneButton?: string;
@@ -20,6 +26,7 @@ export interface DatepickerTranslationStrings {
     selectedDateRange?: string;
     selectedStartDate?: string;
     to?: string;
+    todayButton?: string;
 }
 /**
  * Prop types for Datepicker.
@@ -43,7 +50,7 @@ export interface DatepickerProps extends DatepickerHTMLProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      * Numbers below 160 will display at 160px.
      * Leave blank for width: 100%.
      */
@@ -56,6 +63,18 @@ export interface DatepickerProps extends DatepickerHTMLProps {
      * Locale from date-fns for internationalization.
      */
     locale?: Locale;
+    /**
+     * Maximum selectable date.
+     */
+    maxDate?: Date;
+    /**
+     * Helper text displayed below the input.
+     */
+    message?: string | ReactNode;
+    /**
+     * Minimum selectable date.
+     */
+    minDate?: Date;
     /**
      * onChange handler
      */
@@ -64,10 +83,6 @@ export interface DatepickerProps extends DatepickerHTMLProps {
      * Placeholder text for the trigger button.
      */
     placeholder?: string;
-    /**
-     * Optional preset date ranges (only available when hasDateRange is true).
-     */
-    presets?: CustomPresetConfig[];
     /**
      * Is this field required?
      */
@@ -84,6 +99,14 @@ export interface DatepickerProps extends DatepickerHTMLProps {
      * Translation strings for labels.
      */
     translationStrings?: DatepickerTranslationStrings;
+    /**
+     * Validation message that takes priority over `message` when set.
+     */
+    validationMessage?: string;
+    /**
+     * Validation status. Controls error/success styling and message display.
+     */
+    validationStatus?: ValidationStatus;
     /**
      * Selected date or date range.
      */
@@ -92,5 +115,5 @@ export interface DatepickerProps extends DatepickerHTMLProps {
 /**
  * Datepicker UI component.
  */
-export declare const Datepicker: ({ className, disabled, hasDateRange, id, inputWidth, label, locale, onChange, placeholder, presets, required, showLabel, tooltipText, translationStrings, value, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Datepicker: ({ className, disabled, hasDateRange, id, inputWidth, label, locale, maxDate, message, minDate, onChange, placeholder, required, showLabel, tooltipText, translationStrings: translationStringsProp, validationMessage, validationStatus, value, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/FileUpload/FileUpload.d.ts

@@ -1,6 +1,7 @@
 import React, { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { ValidationStatus } from '../../../libs/types/input-types';
 import './file-upload.css';
+export type FileUploadSize = 's' | 'm';
 type LabelStrings = {
     chooseFile: string;
     clearButton: string;
@@ -38,7 +39,7 @@ export interface FileUploadProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -73,6 +74,10 @@ export interface FileUploadProps extends ComponentPropsWithoutRef<'div'> {
      * Should the label be visible? If false, it will render for screen readers only.
      */
     showLabel?: boolean;
+    /**
+     * Size of the input field.
+     */
+    size?: FileUploadSize;
     /**
      * Optional tooltip text to display additional information.
      */

package/dist/components/inputs/RadioGroup/RadioGroup.d.ts

@@ -44,7 +44,7 @@ export interface RadioGroupProps extends ComponentPropsWithoutRef<'div'> {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**

package/dist/components/inputs/Select/Select.d.ts

@@ -3,6 +3,7 @@ import { ValidationStatus } from '../../../libs/types/input-types';
 import { PDSIcon } from '../../icons/Icon/Icon';
 import './select.css';
 export type SelectIconType = PDSIcon | 'google' | 'microsoft';
+export type SelectSize = 's' | 'm';
 type LabelStrings = {
     selectOptionText: string;
     triggerButton: string;
@@ -69,7 +70,7 @@ export interface SelectProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -108,6 +109,10 @@ export interface SelectProps {
      * Should the label be visible? If false, it will render for screen readers only.
      */
     showLabel?: boolean;
+    /**
+     * Size of the select field.
+     */
+    size?: SelectSize;
     /**
      * Optional tooltip text to display additional information.
      */
@@ -132,5 +137,5 @@ export declare const SelectOptionGroup: ({ children, label, }: SelectOptionGroup
 /**
  * Select UI component
  */
-export declare const Select: ({ autoWidth, className, defaultValue, disabled, icon, id, inputWidth, label, labelStrings, message, onBlur, onFocus, onOptionSelect, options, required, showLabel, tooltipText, validationMessage, validationStatus, value, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Select: ({ autoWidth, className, defaultValue, disabled, icon, id, inputWidth, label, labelStrings, message, onBlur, onFocus, onOptionSelect, options, required, showLabel, size, tooltipText, validationMessage, validationStatus, value, ...props }: SelectProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/Switch/Switch.d.ts

@@ -29,7 +29,7 @@ export interface SwitchProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -41,7 +41,7 @@ export interface SwitchProps extends ComponentPropsWithoutRef<'div'> {
      */
     message?: string | ReactNode;
     /**
-     * Status text for when switch is off.
+     * Status text for when the switch is off. Visual only (not announced to screen readers, which rely on `role="switch"`).
      */
     offLabel?: string;
     /**
@@ -49,7 +49,7 @@ export interface SwitchProps extends ComponentPropsWithoutRef<'div'> {
      */
     onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
     /**
-     * Status text for when switch is on.
+     * Status text for when the switch is on. Visual only (not announced to screen readers, which rely on `role="switch"`).
      */
     onLabel?: string;
     /**
@@ -61,11 +61,11 @@ export interface SwitchProps extends ComponentPropsWithoutRef<'div'> {
      */
     showLabel?: boolean;
     /**
-     * Show toggle status label next to switch. If false, icons will render and the text will still be available to screen readers.
+     * Show the on/off status label next to the switch. Visual only; state is always available to screen readers via `role="switch"`.
      */
     showStatusLabel?: boolean;
     /**
-     * Determines the placement of the toggle status label. Default set to `right`.
+     * Determines the placement of the status label relative to the switch. Default set to `right`.
      */
     statusLabelPlacement?: 'right' | 'left';
     /**

package/dist/components/inputs/TagsInput/TagsInput.d.ts

@@ -15,6 +15,7 @@ export type TagType = {
     id: string;
     value: string;
 };
+export type TagsInputSize = 's' | 'm';
 type DivProps = Omit<ComponentPropsWithoutRef<'div'>, 'onChange'>;
 /**
  * Prop types for TagsInput
@@ -41,7 +42,7 @@ export interface TagsInputProps extends DivProps {
      */
     inputMinHeight?: number;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -72,6 +73,10 @@ export interface TagsInputProps extends DivProps {
      * Should the label be visible? If false, it will render for screen readers only.
      */
     showLabel?: boolean;
+    /**
+     * Size of the input.
+     */
+    size?: TagsInputSize;
     /**
      * Tags array. The component is controlled and requires managing state externally.
      */

package/dist/components/inputs/TextInput/TextInput.d.ts

@@ -56,7 +56,7 @@ export interface TextInputProps extends ComponentPropsWithoutRef<'div'> {
      */
     inputProps?: ComponentPropsWithoutRef<'input'>;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -110,7 +110,7 @@ export interface TextInputProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Input size.
      */
-    size?: 's' | 'm' | 'l';
+    size?: 's' | 'm';
     /**
      * Optional tooltip text to display additional information.
      */

package/dist/components/inputs/Textarea/Textarea.d.ts

@@ -31,7 +31,7 @@ export interface TextareaProps {
      */
     id: string;
     /**
-     * Max-width of the input field. Accepts a number in pixels. Leave blank for width: 100%.
+     * Width of the input field in pixels. When omitted, the input fills its container.
      */
     inputWidth?: number;
     /**
@@ -82,7 +82,7 @@ export interface TextareaProps {
     /**
      * Input size.
      */
-    size?: 's' | 'm' | 'l';
+    size?: 's' | 'm';
     /**
      * Additional props for the `<textarea>` element.
      */

package/dist/components/inputs/input-utilities.d.ts

@@ -1,5 +1,6 @@
 import React, { ComponentPropsWithoutRef, MouseEventHandler, ReactNode } from 'react';
 import { SelectOptionGroupType, SelectOptionType } from './Select/Select';
+import '@components/Dropdown/dropdown.css';
 import './input-utilities.css';
 export declare const inputCommonClasses: {
     base: string;
@@ -10,7 +11,7 @@ export declare const inputCommonClasses: {
     readonly: string;
 };
 export declare const getInputWidthStyle: (inputWidth: number) => {
-    maxWidth: string;
+    width: string;
 };
 export declare const stripUrlProtocol: (value: string) => string;
 export declare const RequiredIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/{CTALink → links/CTALink}/CTALink.d.ts

@@ -12,7 +12,7 @@ export interface CTALinkProps extends ComponentPropsWithoutRef<'div'> {
     /**
      * Size of link
      */
-    size?: 'sm' | 'md';
+    size?: 'xs' | 's' | 'm';
 }
 /**
  * CTA Link UI component

package/dist/components/{LinkNewWindow → links/LinkNewWindow}/LinkNewWindow.d.ts

@@ -15,7 +15,7 @@ export interface LinkNewWindowProps extends ComponentPropsWithoutRef<'a'> {
     /**
      * Optional font size for the LinkNewWindow. If not provided, the font size will be inherited from the parent element.
      */
-    fontSize?: 'sm' | 'md' | 'lg';
+    fontSize?: 's' | 'm' | 'l';
     /**
      * Is the link in the process of loading?
      */

package/dist/components/loading-indicators/Spinner/Spinner.d.ts

@@ -1,6 +1,5 @@
 import { ComponentPropsWithoutRef } from 'react';
 export type SpinnerSize = 's' | 'm' | 'l' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
-export type SpinnerColorType = 'full-color' | 'monochromatic' | 'monochromatic-reverse';
 import './spinner.css';
 export interface SpinnerProps extends ComponentPropsWithoutRef<'span'> {
     /**
@@ -8,9 +7,11 @@ export interface SpinnerProps extends ComponentPropsWithoutRef<'span'> {
      */
     className?: string;
     /**
-     * Spinner color
+     * Arc color. Accepts any CSS color value or `var(--token)` reference.
+     * The track ring renders at the same color with reduced opacity.
+     * Defaults to the interactive blue token.
      */
-    colorType?: SpinnerColorType;
+    color?: string;
     /**
      * Should the spinner be an inline element? If true, it will be displayed inline-block without a visible label.
      */
@@ -31,4 +32,4 @@ export interface SpinnerProps extends ComponentPropsWithoutRef<'span'> {
 /**
  * Spinner UI component
  */
-export declare const Spinner: ({ className, colorType, isInline, label, showLabel, size, ...props }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Spinner: ({ className, color, isInline, label, showLabel, size, ...props }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/ButtonNav/ButtonNav.d.ts

@@ -10,6 +10,10 @@ export interface ButtonNavProps extends ComponentPropsWithRef<'nav'> {
      * Aria label for the navigation.
      */
     ariaLabel: string;
+    /**
+     * Renders a border around the track. Off by default.
+     */
+    border?: boolean;
     /**
      * Additional class names
      */
@@ -18,12 +22,8 @@ export interface ButtonNavProps extends ComponentPropsWithRef<'nav'> {
      * Menu items to render.
      */
     menuItems?: ButtonNavItem[];
-    /**
-     * Size of the Buttons.
-     */
-    size?: 's' | 'm';
 }
 /**
  * ButtonNav UI component
  */
-export declare const ButtonNav: ({ ariaLabel, className, menuItems, size, ...props }: ButtonNavProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ButtonNav: ({ ariaLabel, border, className, menuItems, ...props }: ButtonNavProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,5 +1,6 @@
 import { ComponentPropsWithoutRef, ReactElement } from 'react';
 import { NavigationItem } from '../../../libs/types/navigation-types';
+import '@components/Dropdown/dropdown.css';
 import './dropdown-menu.css';
 /**
  * Prop types for DropdownMenu

package/dist/components/navigation/Navbar/Navbar.d.ts

@@ -1,13 +1,12 @@
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { ContainerWidth } from '../../../libs/types/custom-types';
-import { PantheonLogoDisplayType } from '../../PantheonLogo/PantheonLogo';
 import './navbar.css';
 /**
  * Prop types for Navbar
  */
 export interface NavbarProps extends ComponentPropsWithoutRef<'header'> {
     /**
-     * Navbar content.
+     * Navbar content. Use the `logo`, `items-left`, `items-center`, and `items-right` slots.
      */
     children?: ReactNode;
     /**
@@ -27,25 +26,14 @@ export interface NavbarProps extends ComponentPropsWithoutRef<'header'> {
      */
     hideBorder?: boolean;
     /**
-     * Hide the logo if it will be provided elsewhere in the layout. The logo will still be rendered in the mobile view.
+     * Overrides the horizontal (inline) padding of the desktop navbar bar.
+     * Accepts any CSS length (e.g. '1rem', '26px', or a token such as
+     * 'var(--pds-spacing-m)'). Applied symmetrically. Defaults to the
+     * Container's standard gutter. Useful for aligning navbar content with an
+     * adjacent app shell (e.g. the AppLayout sidebar) when placed in a `header`
+     * slot.
      */
-    hideLogo?: boolean;
-    /**
-     * How should the Pantheon logo be displayed.
-     */
-    logoDisplayType?: PantheonLogoDisplayType;
-    /**
-     * Where should the logo link to? A fully-formed link element.
-     */
-    logoLinkContent?: ReactNode;
-    /**
-     * Logo image source. If provided, the Pantheon logo will not be rendered.
-     */
-    logoSrc?: string;
-    /**
-     * Accepts a fully-formed link or a string (if a static site name is desired). Only necessary if logoDisplayType is `sub-brand`.
-     */
-    logoSubBrand?: ReactNode | string;
+    inlinePadding?: string;
     /**
      * Translation strings for accessibility.
      */
@@ -57,4 +45,4 @@ export interface NavbarProps extends ComponentPropsWithoutRef<'header'> {
 /**
  * Navbar UI component
  */
-export declare const Navbar: ({ children, className, colorType, containerWidth, hideBorder, hideLogo, logoDisplayType, logoLinkContent, logoSrc, logoSubBrand, translationStrings, ...props }: NavbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Navbar: ({ children, className, colorType, containerWidth, hideBorder, inlinePadding, translationStrings, ...props }: NavbarProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -13,6 +13,12 @@ export interface SideNavProps extends ComponentPropsWithoutRef<'nav'> {
      * Additional class names
      */
     className?: string;
+    /**
+     * When true, renders a dropdown menu in place of the standard navigation at mobile viewports.
+     * The mobile breakpoint is controlled by the `mobileBreakpoint` prop on `GlobalWrapper`.
+     * Defaults to `false` — the standard navigation is shown at all breakpoints.
+     */
+    hasMobileDropdown?: boolean;
     /**
      * Heading text. If a link is passed, it will be rendered as a link.
      */
@@ -36,4 +42,4 @@ export interface SideNavProps extends ComponentPropsWithoutRef<'nav'> {
 /**
  * SideNav UI component
  */
-export declare const SideNav: ({ ariaLabel, className, headingText, labels, menuItems, mobileMenuSelectTextFallback, ...props }: SideNavProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SideNav: ({ ariaLabel, className, hasMobileDropdown, headingText, labels, menuItems, mobileMenuSelectTextFallback, ...props }: SideNavProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/SideNavGlobal/SideNavGlobal.d.ts

@@ -1,4 +1,4 @@
-import { ComponentPropsWithoutRef, ReactNode } from 'react';
+import { ComponentPropsWithoutRef } from 'react';
 import { SideNavGlobalItemProps } from './SideNavGlobalItem';
 import './side-nav-global.css';
 /**
@@ -13,11 +13,6 @@ export interface SideNavGlobalProps extends ComponentPropsWithoutRef<'div'> {
      * Additional class names
      */
     className?: string;
-    /**
-     * Should the Pantheon logo be displayed above the menu items?
-     * It will not be displayed in the mobile view regardless of this value.
-     */
-    hasLogo?: boolean;
     /**
      * Is the sidebar collapsed?
      */
@@ -29,22 +24,17 @@ export interface SideNavGlobalProps extends ComponentPropsWithoutRef<'div'> {
         submenu: string;
         toggle: string;
     };
-    /**
-     * Where should the logo link to? A fully-formed link element.
-     * Only necessary if `hasLogo` is true.
-     * If the logo should not be a link, leave blank.
-     */
-    logoLinkContent?: ReactNode;
     /**
      * Menu items to render.
      */
     menuItems?: SideNavGlobalItemProps[];
     /**
-     * Text to display in the mobile menu trigger button when no active link is found.
+     * Callback to expand the sidebar. When provided and the sidebar is collapsed,
+     * tapping a nav item with children will expand the sidebar instead of showing a flyout.
      */
-    mobileMenuSelectTextFallback?: string;
+    onExpandSidebar?: () => void;
 }
 /**
  * SideNavGlobal UI component
  */
-export declare const SideNavGlobal: ({ ariaLabel, className, hasLogo, isSidebarCollapsed, labels, logoLinkContent, menuItems, mobileMenuSelectTextFallback, ...props }: SideNavGlobalProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SideNavGlobal: ({ ariaLabel, className, isSidebarCollapsed, labels, menuItems, onExpandSidebar, ...props }: SideNavGlobalProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/SideNavGlobal/SideNavGlobalItem.d.ts

@@ -6,6 +6,12 @@ export interface SideNavGlobalItemProps extends NavigationItem {
      * Icon to display next to the link content.
      */
     icon?: PDSIcon;
+    /**
+     * Whether the item's submenu is expanded. Controlled by the parent
+     * `SideNavGlobal` so expansion state stays in React rather than being
+     * mutated on the DOM.
+     */
+    isExpanded?: boolean;
     /**
      * Flag indicating whether the sidebar is collapsed.
      */
@@ -17,8 +23,16 @@ export interface SideNavGlobalItemProps extends NavigationItem {
         submenu: string;
         toggle: string;
     };
+    /**
+     * Callback to expand the sidebar on touch devices when collapsed.
+     */
+    onExpandSidebar?: () => void;
+    /**
+     * Callback to toggle the item's submenu expansion.
+     */
+    onToggleExpand?: () => void;
 }
 /**
  * SideNavGlobalItem UI component
  */
-export declare const SideNavGlobalItem: ({ icon, isActive, isSidebarCollapsed, labels, linkContent, links, }: SideNavGlobalItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SideNavGlobalItem: ({ icon, isActive, isExpanded, isSidebarCollapsed, labels, linkContent, links, onExpandSidebar, onToggleExpand, }: SideNavGlobalItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/SiteMenu/SiteMenu.d.ts

@@ -0,0 +1,26 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { NavMenuItem } from '../../../libs/types/navigation-types';
+import '@components/Dropdown/dropdown.css';
+import './nav-menu.css';
+/**
+ * Prop types for SiteMenu
+ */
+interface SiteMenuProps extends ComponentPropsWithoutRef<'nav'> {
+    /**
+     * Aria label for `nav` element.
+     */
+    ariaLabel: string;
+    /**
+     * Additional class names
+     */
+    className?: string;
+    /**
+     * Menu Items.
+     */
+    menuItems?: NavMenuItem[];
+}
+/**
+ * SiteMenu UI component
+ */
+export declare const SiteMenu: ({ ariaLabel, className, menuItems, ...props }: SiteMenuProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/navigation/SiteMenu/SiteMenuDropdown.d.ts

@@ -0,0 +1,23 @@
+import { ComponentPropsWithoutRef } from 'react';
+import { NavMenuItem } from '../../../libs/types/navigation-types';
+/**
+ * Prop types for SiteMenuDropdown
+ */
+interface SiteMenuDropdownProps extends ComponentPropsWithoutRef<'button'> {
+    /**
+     * Menu items. If omitted or empty, renders as a plain top-level link.
+     */
+    items?: NavMenuItem[];
+    /**
+     * Menu label shown on the trigger button.
+     */
+    label?: string;
+}
+/**
+ * SiteMenuDropdown — a sub-menu for SiteMenu items that have child links.
+ * Desktop: Floating UI dropdown (opens on hover or click).
+ * Mobile: NavAccordion inline expansion.
+ * Both are always in the DOM; CSS driven by [data-pds-mobile] shows the right one.
+ */
+export declare const SiteMenuDropdown: ({ items, label }: SiteMenuDropdownProps) => import("react/jsx-runtime").JSX.Element;
+export {};