@pantheon-systems/pds-toolkit-react 2.0.0-alpha.2 → 2.0.0-alpha.20

package/tailwind/v3/preset.cjs

@@ -0,0 +1,258 @@
+/**
+ * PDS Tailwind v3 Preset
+ *
+ * Maps Pantheon Design System tokens to Tailwind CSS v3 utilities.
+ * Use as a preset in tailwind.config.js — replaces Tailwind's default
+ * color, spacing, and typography scales with PDS values.
+ *
+ * Requirements:
+ * - pds-core.css must be loaded globally (provides --pds-* CSS variables)
+ * - Tailwind v3.x
+ *
+ * Usage:
+ *   // tailwind.config.js
+ *   module.exports = {
+ *     presets: [require('@pantheon-systems/pds-toolkit-react/tailwind/v3/preset')],
+ *     content: ['./src/**\/*.{js,ts,jsx,tsx}'],
+ *   };
+ */
+
+const plugin = require('tailwindcss/plugin');
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+	corePlugins: {
+		// Disable Tailwind's CSS reset — PDS provides its own base styles.
+		// Enabling preflight alongside PDS will cause style conflicts.
+		preflight: false,
+	},
+	plugins: [
+		// Reset border-style to none so borders are fully opt-in.
+		// Without this, any element that picks up a non-zero border-width
+		// (from PDS components, inheritance, or browser defaults) gets a
+		// visible border even without explicit border classes.
+		// Always include border-solid (or border-dashed, etc.) when adding borders.
+		plugin(function ({ addBase }) {
+			addBase({
+				'*, ::before, ::after': {
+					borderWidth: '0',
+					borderStyle: 'none',
+					borderColor: 'var(--pds-color-border-default)',
+				},
+			});
+		}),
+	],
+	theme: {
+		// ─── Colors ──────────────────────────────────────────────────────────────
+		// All values reference PDS CSS custom properties so dark mode and token
+		// updates are reflected automatically. Requires pds-core.css to be loaded.
+		//
+		// Note: opacity modifiers (e.g. bg-bg-default/50) are not supported with
+		// CSS variable color references.
+		colors: {
+			// Backgrounds — use as bg-bg-default, bg-bg-secondary, bg-bg-reverse
+			bg: {
+				default: 'var(--pds-color-bg-default)',
+				secondary: 'var(--pds-color-bg-default-secondary)',
+				reverse: 'var(--pds-color-bg-reverse)',
+			},
+			// General foregrounds (icons, decorative elements)
+			fg: {
+				default: 'var(--pds-color-fg-default)',
+				secondary: 'var(--pds-color-fg-default-secondary)',
+				reverse: 'var(--pds-color-fg-reverse)',
+			},
+			// Borders — use as border-border-default, border-border-input, etc.
+			border: {
+				default: 'var(--pds-color-border-default)',
+				input: 'var(--pds-color-border-input)',
+				separator: 'var(--pds-color-border-separator)',
+				brand: 'var(--pds-color-border-brand)',
+			},
+			// Interactive elements (links, focus rings)
+			interactive: {
+				focus: 'var(--pds-color-interactive-focus)',
+				'bg-hover': 'var(--pds-color-interactive-background-hover)',
+				'bg-active': 'var(--pds-color-interactive-background-active)',
+				link: 'var(--pds-color-interactive-link-default)',
+				'link-hover': 'var(--pds-color-interactive-link-hover)',
+				'link-active': 'var(--pds-color-interactive-link-active)',
+				'link-visited': 'var(--pds-color-interactive-link-visited)',
+				'reverse-focus': 'var(--pds-color-interactive-reverse-focus)',
+				'reverse-link': 'var(--pds-color-interactive-reverse-link-default)',
+				'reverse-link-hover': 'var(--pds-color-interactive-reverse-link-hover)',
+				'reverse-link-active':
+					'var(--pds-color-interactive-reverse-link-active)',
+				'reverse-link-visited':
+					'var(--pds-color-interactive-reverse-link-visited)',
+			},
+			// Status colors — background/foreground/border/dot per status type
+			status: {
+				info: {
+					background: 'var(--pds-color-status-info-background)',
+					foreground: 'var(--pds-color-status-info-foreground)',
+					border: 'var(--pds-color-status-info-border)',
+					dot: 'var(--pds-color-status-info-dot)',
+				},
+				success: {
+					background: 'var(--pds-color-status-success-background)',
+					foreground: 'var(--pds-color-status-success-foreground)',
+					border: 'var(--pds-color-status-success-border)',
+					dot: 'var(--pds-color-status-success-dot)',
+				},
+				warning: {
+					background: 'var(--pds-color-status-warning-background)',
+					foreground: 'var(--pds-color-status-warning-foreground)',
+					border: 'var(--pds-color-status-warning-border)',
+					dot: 'var(--pds-color-status-warning-dot)',
+				},
+				critical: {
+					background: 'var(--pds-color-status-critical-background)',
+					foreground: 'var(--pds-color-status-critical-foreground)',
+					border: 'var(--pds-color-status-critical-border)',
+					dot: 'var(--pds-color-status-critical-dot)',
+				},
+				discovery: {
+					background: 'var(--pds-color-status-discovery-background)',
+					foreground: 'var(--pds-color-status-discovery-foreground)',
+					border: 'var(--pds-color-status-discovery-border)',
+					dot: 'var(--pds-color-status-discovery-dot)',
+				},
+			},
+			// Overlay (e.g. modal backdrops)
+			overlay: 'var(--pds-color-overlay)',
+			// Data visualization palette
+			datavis: {
+				1: 'var(--pds-color-datavis-1)',
+				2: 'var(--pds-color-datavis-2)',
+				3: 'var(--pds-color-datavis-3)',
+				4: 'var(--pds-color-datavis-4)',
+				5: 'var(--pds-color-datavis-5)',
+			},
+		},
+
+		// ─── Spacing ─────────────────────────────────────────────────────────────
+		// Primary scale uses PDS named keys: p-xs, m-xl, gap-m, etc.
+		// Numeric aliases map common Tailwind values to the nearest PDS token so
+		// that p-4 / p-6 / etc. still work and stay in sync if tokens change.
+		spacing: {
+			0: '0px',
+			// PDS named scale
+			'5xs': 'var(--pds-spacing-5xs)',
+			'4xs': 'var(--pds-spacing-4xs)',
+			'3xs': 'var(--pds-spacing-3xs)',
+			'2xs': 'var(--pds-spacing-2xs)',
+			xs: 'var(--pds-spacing-xs)',
+			s: 'var(--pds-spacing-s)',
+			m: 'var(--pds-spacing-m)',
+			l: 'var(--pds-spacing-l)',
+			xl: 'var(--pds-spacing-xl)',
+			'2xl': 'var(--pds-spacing-2xl)',
+			'3xl': 'var(--pds-spacing-3xl)',
+			'4xl': 'var(--pds-spacing-4xl)',
+			'5xl': 'var(--pds-spacing-5xl)',
+			'6xl': 'var(--pds-spacing-6xl)',
+			'7xl': 'var(--pds-spacing-7xl)',
+			'8xl': 'var(--pds-spacing-8xl)',
+			'9xl': 'var(--pds-spacing-9xl)',
+			// Numeric aliases → PDS tokens (p-4 = p-m, p-6 = p-xl, etc.)
+			// Values reference CSS variables so they stay in sync if tokens change.
+			0.5: 'var(--pds-spacing-5xs)', // 0.125rem
+			1: 'var(--pds-spacing-4xs)', // 0.25rem
+			1.5: 'var(--pds-spacing-3xs)', // 0.375rem
+			2: 'var(--pds-spacing-2xs)', // 0.5rem
+			2.5: 'var(--pds-spacing-xs)', // 0.625rem
+			3: 'var(--pds-spacing-s)', // 0.75rem
+			4: 'var(--pds-spacing-m)', // 1rem
+			5: 'var(--pds-spacing-l)', // 1.25rem
+			6: 'var(--pds-spacing-xl)', // 1.5rem
+			8: 'var(--pds-spacing-2xl)', // 2rem
+			10: 'var(--pds-spacing-3xl)', // 2.5rem
+			12: 'var(--pds-spacing-4xl)', // 3rem
+			16: 'var(--pds-spacing-5xl)', // 4rem
+			20: 'var(--pds-spacing-6xl)', // 5rem
+			24: 'var(--pds-spacing-7xl)', // 6rem
+			32: 'var(--pds-spacing-8xl)', // 8rem
+			40: 'var(--pds-spacing-9xl)', // 10rem
+		},
+
+		// ─── Typography ──────────────────────────────────────────────────────────
+		// Font families are intentionally excluded. PDS applies font families
+		// automatically via pds-core.css (body, headings, code blocks, etc.).
+		// Teams should not override font families via Tailwind utilities.
+		fontSize: {
+			xs: 'var(--pds-typography-size-xs)',
+			s: 'var(--pds-typography-size-s)',
+			m: 'var(--pds-typography-size-m)',
+			l: 'var(--pds-typography-size-l)',
+			xl: 'var(--pds-typography-size-xl)',
+			'2xl': 'var(--pds-typography-size-2xl)',
+			'3xl': 'var(--pds-typography-size-3xl)',
+			'4xl': 'var(--pds-typography-size-4xl)',
+			'5xl': 'var(--pds-typography-size-5xl)',
+			'6xl': 'var(--pds-typography-size-6xl)',
+			'7xl': 'var(--pds-typography-size-7xl)',
+			'8xl': 'var(--pds-typography-size-8xl)',
+			'9xl': 'var(--pds-typography-size-9xl)',
+		},
+		fontWeight: {
+			light: 'var(--pds-typography-fw-light)',
+			normal: 'var(--pds-typography-fw-regular)',
+			medium: 'var(--pds-typography-fw-medium)',
+			semibold: 'var(--pds-typography-fw-semibold)',
+			bold: 'var(--pds-typography-fw-bold)',
+		},
+		lineHeight: {
+			s: 'var(--pds-typography-lh-s)',
+			m: 'var(--pds-typography-lh-m)',
+			l: 'var(--pds-typography-lh-l)',
+			xl: 'var(--pds-typography-lh-xl)',
+		},
+		letterSpacing: {
+			s: 'var(--pds-typography-ls-s)',
+			m: 'var(--pds-typography-ls-m)',
+			l: 'var(--pds-typography-ls-l)',
+			xl: 'var(--pds-typography-ls-xl)',
+		},
+
+		// ─── Border ──────────────────────────────────────────────────────────────
+		borderRadius: {
+			none: '0px',
+			DEFAULT: 'var(--pds-border-radius-default)',
+			button: 'var(--pds-border-radius-button)',
+			input: 'var(--pds-border-radius-input)',
+			container: 'var(--pds-border-radius-container)',
+			bar: 'var(--pds-border-radius-bar)',
+			full: '9999px',
+		},
+		borderWidth: {
+			0: '0px',
+			DEFAULT: 'var(--pds-border-width-default)',
+			thicker: 'var(--pds-border-width-thicker)',
+		},
+
+		// ─── Z-index ─────────────────────────────────────────────────────────────
+		zIndex: {
+			0: '0',
+			navigation: 'var(--pds-z-index-navigation)',
+			dropdown: 'var(--pds-z-index-dropdown)',
+			notifications: 'var(--pds-z-index-notifications)',
+			overlay: 'var(--pds-z-index-overlay)',
+			modal: 'var(--pds-z-index-modal)',
+			max: 'var(--pds-z-index-max)',
+		},
+
+		// ─── Max Width ───────────────────────────────────────────────────────────
+		// PDS standard container widths — use to match PDS layout components.
+		maxWidth: {
+			none: 'none',
+			full: '100%',
+			narrow: 'var(--pds-container-max-width-narrow)',
+			standard: 'var(--pds-container-max-width-standard)',
+			wide: 'var(--pds-container-max-width-wide)',
+			'x-wide': 'var(--pds-container-max-width-x-wide)',
+		},
+
+		extend: {},
+	},
+};

package/tailwind/v4/theme.css

@@ -0,0 +1,230 @@
+/**
+ * PDS Tailwind v4 Theme
+ *
+ * Maps Pantheon Design System tokens to Tailwind CSS v4 utilities via @theme.
+ * Replaces Tailwind's default color, spacing, and typography scales with PDS values.
+ *
+ * Requirements:
+ * - pds-core.css must be imported before this file (provides --pds-* CSS variables)
+ * - Tailwind v4.x
+ *
+ * Usage in your global CSS entry point:
+ *
+ *   @import 'tailwindcss/theme' layer(theme);
+ *   @import 'tailwindcss/utilities' layer(utilities);
+ *   @import '@pantheon-systems/pds-toolkit-react/tailwind/v4/theme.css';
+ *
+ * And in your root layout (JS import, before globals.css):
+ *   import '@pantheon-systems/pds-toolkit-react/css/pds-core.css';
+ */
+
+/*
+ * Reset border-style to none so borders are fully opt-in.
+ * Without this, any element that picks up a non-zero border-width
+ * (from PDS components, inheritance, or browser defaults) gets a
+ * visible border even without explicit border classes.
+ * Always include border-solid (or border-dashed, etc.) when adding borders.
+ */
+@layer base {
+	*,
+	::before,
+	::after {
+		border-color: var(--pds-color-border-default);
+		border-style: none;
+		border-width: 0;
+	}
+}
+
+@theme {
+	/* ── Reset Tailwind defaults we are replacing ──────────────────────────── */
+	--color-*: initial;
+	--spacing-*: initial;
+	--font-*: initial;
+	--text-*: initial;
+	--font-weight-*: initial;
+	--leading-*: initial;
+	--tracking-*: initial;
+	--radius-*: initial;
+	--border-*: initial;
+	--z-*: initial;
+	--max-w-*: initial;
+
+	/* ── Colors ────────────────────────────────────────────────────────────── */
+
+	/* Backgrounds — use as bg-bg-default, bg-bg-secondary, bg-bg-reverse */
+	--color-bg-default: var(--pds-color-bg-default);
+	--color-bg-secondary: var(--pds-color-bg-default-secondary);
+	--color-bg-reverse: var(--pds-color-bg-reverse);
+
+	/* Foregrounds */
+	--color-fg-default: var(--pds-color-fg-default);
+	--color-fg-secondary: var(--pds-color-fg-default-secondary);
+	--color-fg-reverse: var(--pds-color-fg-reverse);
+
+	/* Borders — use as border-border-default, border-border-input, etc. */
+	--color-border-default: var(--pds-color-border-default);
+	--color-border-input: var(--pds-color-border-input);
+	--color-border-separator: var(--pds-color-border-separator);
+	--color-border-brand: var(--pds-color-border-brand);
+
+	/* Interactive */
+	--color-interactive-focus: var(--pds-color-interactive-focus);
+	--color-interactive-bg-hover: var(--pds-color-interactive-background-hover);
+	--color-interactive-bg-active: var(--pds-color-interactive-background-active);
+	--color-interactive-link: var(--pds-color-interactive-link-default);
+	--color-interactive-link-hover: var(--pds-color-interactive-link-hover);
+	--color-interactive-link-active: var(--pds-color-interactive-link-active);
+	--color-interactive-link-visited: var(--pds-color-interactive-link-visited);
+	--color-interactive-reverse-focus: var(--pds-color-interactive-reverse-focus);
+	--color-interactive-reverse-link: var(
+		--pds-color-interactive-reverse-link-default
+	);
+	--color-interactive-reverse-link-hover: var(
+		--pds-color-interactive-reverse-link-hover
+	);
+	--color-interactive-reverse-link-active: var(
+		--pds-color-interactive-reverse-link-active
+	);
+	--color-interactive-reverse-link-visited: var(
+		--pds-color-interactive-reverse-link-visited
+	);
+
+	/* Status */
+	--color-status-info-background: var(--pds-color-status-info-background);
+	--color-status-info-foreground: var(--pds-color-status-info-foreground);
+	--color-status-info-border: var(--pds-color-status-info-border);
+	--color-status-info-dot: var(--pds-color-status-info-dot);
+	--color-status-success-background: var(--pds-color-status-success-background);
+	--color-status-success-foreground: var(--pds-color-status-success-foreground);
+	--color-status-success-border: var(--pds-color-status-success-border);
+	--color-status-success-dot: var(--pds-color-status-success-dot);
+	--color-status-warning-background: var(--pds-color-status-warning-background);
+	--color-status-warning-foreground: var(--pds-color-status-warning-foreground);
+	--color-status-warning-border: var(--pds-color-status-warning-border);
+	--color-status-warning-dot: var(--pds-color-status-warning-dot);
+	--color-status-critical-background: var(
+		--pds-color-status-critical-background
+	);
+	--color-status-critical-foreground: var(
+		--pds-color-status-critical-foreground
+	);
+	--color-status-critical-border: var(--pds-color-status-critical-border);
+	--color-status-critical-dot: var(--pds-color-status-critical-dot);
+	--color-status-discovery-background: var(
+		--pds-color-status-discovery-background
+	);
+	--color-status-discovery-foreground: var(
+		--pds-color-status-discovery-foreground
+	);
+	--color-status-discovery-border: var(--pds-color-status-discovery-border);
+	--color-status-discovery-dot: var(--pds-color-status-discovery-dot);
+
+	/* Overlay */
+	--color-overlay: var(--pds-color-overlay);
+
+	/* Data visualization */
+	--color-datavis-1: var(--pds-color-datavis-1);
+	--color-datavis-2: var(--pds-color-datavis-2);
+	--color-datavis-3: var(--pds-color-datavis-3);
+	--color-datavis-4: var(--pds-color-datavis-4);
+	--color-datavis-5: var(--pds-color-datavis-5);
+
+	/* ── Spacing ───────────────────────────────────────────────────────────── */
+	/* PDS named scale */
+	--spacing-5xs: var(--pds-spacing-5xs);
+	--spacing-4xs: var(--pds-spacing-4xs);
+	--spacing-3xs: var(--pds-spacing-3xs);
+	--spacing-2xs: var(--pds-spacing-2xs);
+	--spacing-xs: var(--pds-spacing-xs);
+	--spacing-s: var(--pds-spacing-s);
+	--spacing-m: var(--pds-spacing-m);
+	--spacing-l: var(--pds-spacing-l);
+	--spacing-xl: var(--pds-spacing-xl);
+	--spacing-2xl: var(--pds-spacing-2xl);
+	--spacing-3xl: var(--pds-spacing-3xl);
+	--spacing-4xl: var(--pds-spacing-4xl);
+	--spacing-5xl: var(--pds-spacing-5xl);
+	--spacing-6xl: var(--pds-spacing-6xl);
+	--spacing-7xl: var(--pds-spacing-7xl);
+	--spacing-8xl: var(--pds-spacing-8xl);
+	--spacing-9xl: var(--pds-spacing-9xl);
+	/* Numeric aliases → PDS tokens (p-4 = p-m, p-6 = p-xl, etc.) */
+	--spacing-0\.5: var(--pds-spacing-5xs);
+	--spacing-1: var(--pds-spacing-4xs);
+	--spacing-1\.5: var(--pds-spacing-3xs);
+	--spacing-2: var(--pds-spacing-2xs);
+	--spacing-2\.5: var(--pds-spacing-xs);
+	--spacing-3: var(--pds-spacing-s);
+	--spacing-4: var(--pds-spacing-m);
+	--spacing-5: var(--pds-spacing-l);
+	--spacing-6: var(--pds-spacing-xl);
+	--spacing-8: var(--pds-spacing-2xl);
+	--spacing-10: var(--pds-spacing-3xl);
+	--spacing-12: var(--pds-spacing-4xl);
+	--spacing-16: var(--pds-spacing-5xl);
+	--spacing-20: var(--pds-spacing-6xl);
+	--spacing-24: var(--pds-spacing-7xl);
+	--spacing-32: var(--pds-spacing-8xl);
+	--spacing-40: var(--pds-spacing-9xl);
+
+	/* ── Typography ────────────────────────────────────────────────────────── */
+	/* Font families are intentionally excluded. PDS applies font families
+	   automatically via pds-core.css (body, headings, code blocks, etc.).
+	   Teams should not override font families via Tailwind utilities. */
+
+	--text-xs: var(--pds-typography-size-xs);
+	--text-s: var(--pds-typography-size-s);
+	--text-m: var(--pds-typography-size-m);
+	--text-l: var(--pds-typography-size-l);
+	--text-xl: var(--pds-typography-size-xl);
+	--text-2xl: var(--pds-typography-size-2xl);
+	--text-3xl: var(--pds-typography-size-3xl);
+	--text-4xl: var(--pds-typography-size-4xl);
+	--text-5xl: var(--pds-typography-size-5xl);
+	--text-6xl: var(--pds-typography-size-6xl);
+	--text-7xl: var(--pds-typography-size-7xl);
+	--text-8xl: var(--pds-typography-size-8xl);
+	--text-9xl: var(--pds-typography-size-9xl);
+
+	--font-weight-light: var(--pds-typography-fw-light);
+	--font-weight-normal: var(--pds-typography-fw-regular);
+	--font-weight-medium: var(--pds-typography-fw-medium);
+	--font-weight-semibold: var(--pds-typography-fw-semibold);
+	--font-weight-bold: var(--pds-typography-fw-bold);
+
+	--leading-s: var(--pds-typography-lh-s);
+	--leading-m: var(--pds-typography-lh-m);
+	--leading-l: var(--pds-typography-lh-l);
+	--leading-xl: var(--pds-typography-lh-xl);
+
+	--tracking-s: var(--pds-typography-ls-s);
+	--tracking-m: var(--pds-typography-ls-m);
+	--tracking-l: var(--pds-typography-ls-l);
+	--tracking-xl: var(--pds-typography-ls-xl);
+
+	/* ── Border ────────────────────────────────────────────────────────────── */
+	--radius-none: 0px;
+	--radius-DEFAULT: var(--pds-border-radius-default);
+	--radius-button: var(--pds-border-radius-button);
+	--radius-input: var(--pds-border-radius-input);
+	--radius-container: var(--pds-border-radius-container);
+	--radius-bar: var(--pds-border-radius-bar);
+	--radius-full: 9999px;
+
+	--border-DEFAULT: var(--pds-border-width-default);
+	--border-thicker: var(--pds-border-width-thicker);
+
+	/* ── Z-index ───────────────────────────────────────────────────────────── */
+	--z-navigation: var(--pds-z-index-navigation);
+	--z-dropdown: var(--pds-z-index-dropdown);
+	--z-notifications: var(--pds-z-index-notifications);
+	--z-overlay: var(--pds-z-index-overlay);
+	--z-modal: var(--pds-z-index-modal);
+	--z-max: var(--pds-z-index-max);
+
+	/* ── Max Width ─────────────────────────────────────────────────────────── */
+	--max-w-narrow: var(--pds-container-max-width-narrow);
+	--max-w-standard: var(--pds-container-max-width-standard);
+	--max-w-wide: var(--pds-container-max-width-wide);
+	--max-w-x-wide: var(--pds-container-max-width-x-wide);
+}

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

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

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

@@ -1,35 +0,0 @@
-import { ComponentPropsWithoutRef } from 'react';
-import { DashboardNavItemProps } from './DashboardNavItem';
-import './dashboard-nav.css';
-/**
- * Prop types for DashboardNav
- */
-export interface DashboardNavProps extends ComponentPropsWithoutRef<'nav'> {
-    /**
-     * Aria label for the navigation.
-     */
-    ariaLabel: string;
-    /**
-     * Additional class names
-     */
-    className?: string;
-    /**
-     * Labels for translatable strings.
-     */
-    labels?: {
-        submenu: string;
-        toggle: string;
-    };
-    /**
-     * Menu items to render.
-     */
-    menuItems: DashboardNavItemProps[];
-    /**
-     * Text to display in the mobile menu trigger button when no active link is found.
-     */
-    mobileMenuSelectTextFallback?: string;
-}
-/**
- * DashboardNav UI component
- */
-export declare const DashboardNav: ({ ariaLabel, className, labels, menuItems, mobileMenuSelectTextFallback, ...props }: DashboardNavProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/DashboardNav/DashboardNavItem.d.ts

@@ -1,24 +0,0 @@
-import { NavigationItem } from '../../../libs/types/navigation-types';
-import { PDSIcon } from '../../icons/Icon/Icon';
-import './dashboard-nav.css';
-export interface DashboardNavItemProps extends NavigationItem {
-    /**
-     * Icon to display next to the link content.
-     */
-    icon?: PDSIcon;
-    /**
-     * Flag indicating whether the sidebar is expanded.
-     */
-    isSidebarExpanded?: boolean;
-    /**
-     * Labels for translatable strings.
-     */
-    labels?: {
-        submenu: string;
-        toggle: string;
-    };
-}
-/**
- * DashboardNavItem UI component
- */
-export declare const DashboardNavItem: ({ icon, isActive, isSidebarExpanded, labels, linkContent, links, }: DashboardNavItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/navigation/NavMenu/NavMenuDropdown.d.ts

@@ -1,24 +0,0 @@
-import { ComponentPropsWithoutRef } from 'react';
-import { NavMenuItem } from '../../../libs/types/navigation-types';
-/**
- * Prop types for NavMenuDropdown
- */
-interface NavMenuDropdownProps extends ComponentPropsWithoutRef<'button'> {
-    /**
-     * Dropdown items.
-     */
-    items?: NavMenuItem[];
-    /**
-     * Dropdown label.
-     */
-    label?: string;
-    /**
-     * Mobile menu will be enabled when viewport is at or below this number in pixels.
-     */
-    mobileMenuMaxWidth?: number;
-}
-/**
- * NavMenuDropdown UI component
- */
-export declare const NavMenuDropdown: ({ items, label, mobileMenuMaxWidth, }: NavMenuDropdownProps) => import("react/jsx-runtime").JSX.Element;
-export {};

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

@@ -1,5 +0,0 @@
-.pds-dashboard-nav{--dashboard-nav-icon-width:var(--pds-spacing-xl);--dashboard-nav-space-after-icon:var(--pds-spacing-s);--dashboard-nav-foreground-color:var(
-		--pds-color-dashboard-nav-item-foreground-default
-	);--dashboard-nav-outline-color:var(--pds-color-interactive-focus);font-family:var(--pds-typography-ff-sans)}.pds-dashboard-nav,.pds-dashboard-nav a{color:var(--dashboard-nav-foreground-color)}.pds-dashboard-nav a{text-decoration:none}.pds-dashboard-nav a:focus{box-shadow:none;outline:none}.pds-dashboard-nav a:hover{color:var(--dashboard-nav-foreground-color)}.pds-dashboard-nav a:focus-visible,.pds-dashboard-nav button:focus-visible{border-radius:var(--pds-border-radius-container);outline:var(--pds-border-width-outline) solid var(--dashboard-nav-outline-color);outline-offset:-1px}.pds-dashboard-nav .pds-icon{pointer-events:none}.pds-dashboard-nav__logo{box-sizing:content-box;margin-block-end:var(--pds-spacing-xl);margin-block-start:var(--pds-spacing-4xs);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:var(--pds-spacing-s)}.pds-dashboard-nav__menu.pds-dashboard-nav__menu--top-level{row-gap:var(--pds-spacing-m)}.pds-dashboard-nav__item{list-style-type:none;margin-bottom:0}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--active .pds-dashboard-nav__item-wrapper{--dashboard-nav-foreground-color:var(
-			--pds-color-dashboard-nav-item-foreground-active
-		);--dashboard-nav-outline-color:var(--pds-color-brand-primary-default);background-color:var(--pds-color-dashboard-nav-item-background-active)}.pds-dashboard-nav__item--top-level.pds-dashboard-nav__item--active .pds-dashboard-nav__item-wrapper:hover{background-color:var(--pds-color-dashboard-nav-item-background-active)}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-wrapper{align-items:center;border-radius:var(--pds-border-radius-container);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:var(--pds-animation-transition-button)}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-wrapper a{border-radius:var(--pds-border-radius-container);padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav__item--top-level .pds-dashboard-nav__item-inner,.pds-dashboard-nav__link-icon{align-items:center;display:flex}.pds-dashboard-nav__link-icon{flex-grow:0;flex-shrink:0;height:var(--pds-spacing-dashboard-nav-item-height);justify-content:center;margin-inline-end:var(--dashboard-nav-space-after-icon);width:var(--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:var(--pds-spacing-s);padding-inline-start:calc(var(--pds-spacing-dashboard-nav-item-padding) + var(--dashboard-nav-icon-width) + var(--dashboard-nav-space-after-icon))}.pds-dashboard-nav__menu--second-level.pds-dashboard-nav__menu--expanded{display:flex;row-gap:var(--pds-spacing-s)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level{font-size:var(--pds-typography-size-s)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level.pds-dashboard-nav__item--active a{color:var(--pds-color-nav-item-default-foreground-hover);font-weight:var(--pds-typography-fw-semibold)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:hover{color:var(--pds-color-nav-item-default-foreground-hover)}.pds-dashboard-nav__item.pds-dashboard-nav__item--second-level a:focus-visible{border-radius:1px;outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:4px;transition:var(--pds-animation-transition-focus)}.pds-dashboard-nav__toggle{align-items:center;background-color:transparent;border:none;border-radius:var(--pds-border-radius-container);color:var(--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:var(--pds-animation-transition-rotation)}.pds-dashboard-nav__toggle--expanded .pds-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-dashboard-nav__link-label{opacity:1;transition:opacity .1s ease-in-out}.pds-dashboard-nav--collapsed .pds-dashboard-nav__logo svg{width:1.25rem}.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-dropdown-background);border-radius:var(--pds-border-radius-container);box-shadow:var(--pds-elevation-overlay);max-width:30rem;padding:var(--pds-spacing-s);width:max-content;z-index:var(--pds-z-index-dropdown)}.pds-dashboard-nav__flyout-heading{color:var(--pds-color-dropdown-heading);font-family:var(--pds-typography-ff-sans);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular);line-height:var(--pds-typography-lh-s);padding:var(--pds-spacing-s) var(--pds-spacing-s)}.pds-dashboard-nav__menu--second-level-flyout{row-gap:0}.pds-dashboard-nav__item--second-level-flyout{background-color:var(--pds-color-dropdown-background);color:var(--pds-color-dropdown-foreground);font-size:var(--pds-typography-size-m);line-height:var(--pds-typography-lh-s);margin:0}.pds-dashboard-nav__item--second-level-flyout a{border-radius:var(--pds-border-radius-container);cursor:pointer;display:block;padding:var(--pds-spacing-s) var(--pds-spacing-s)}.pds-dashboard-nav__item--second-level-flyout a:hover{background-color:var(--pds-color-dropdown-item-background-hover)}.pds-dashboard-nav__item--second-level-flyout.pds-dashboard-nav__item--active a{color:var(--pds-color-nav-item-default-foreground-active);font-weight:var(--pds-typography-fw-semibold)}.pds-dashboard-nav__item--second-level-flyout a:focus-visible{border-radius:1px;outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:4px;transition:var(--pds-animation-transition-focus)}.pds-dashboard-nav .pds-tooltip__container{padding:var(--pds-spacing-3xs) var(--pds-spacing-xs)}.pds-dashboard-nav .pds-dropdown-menu .pds-dashboard-nav__item-inner{align-items:center;display:flex}.pds-dashboard-nav .pds-dropdown-menu__trigger{padding-inline:calc(var(--pds-spacing-dashboard-nav-item-padding) - .25rem)}.pds-dashboard-nav .pds-dropdown-menu__item a{padding-block:var(--pds-spacing-2xs);padding-inline:var(--pds-spacing-dashboard-nav-item-padding);width:100%}.pds-dashboard-nav .pds-dropdown-menu__item--second-level{padding-block:var(--pds-spacing-3xs);padding-inline-start:calc(var(--dashboard-nav-icon-width) + var(--dashboard-nav-space-after-icon) + .0625rem)}

package/dist/css/component-css/pds-indicator-badge.css

@@ -1,25 +0,0 @@
-.pds-indicator-badge{--indicator-badge-background:var(
-		--pds-color-badge-indicator-default-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-default-foreground);align-items:center;background-color:var(--indicator-badge-background);border:var(--pds-border-width-default) solid var(--indicator-badge-background);border-radius:var(--pds-border-radius-default);color:var(--indicator-badge-text);display:inline-block;font-weight:var(--pds-typography-fw-semibold);letter-spacing:var(--pds-typography-ls-s);line-height:var(--pds-typography-lh-m);text-transform:uppercase;white-space:nowrap}.pds-indicator-badge__label{display:inline-block}.pds-indicator-badge--md{font-size:var(--pds-typography-size-xs);padding:var(--pds-spacing-4xs) var(--pds-spacing-2xs)}.pds-indicator-badge--md .pds-indicator-badge__label{padding-block-start:.0625rem}.pds-indicator-badge--sm{font-size:.625rem;padding:var(--pds-spacing-4xs) var(--pds-spacing-2xs)}.pds-indicator-badge--neutral{--indicator-badge-background:var(
-		--pds-color-badge-indicator-neutral-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-neutral-foreground)}.pds-indicator-badge--default{--indicator-badge-background:var(
-		--pds-color-badge-indicator-default-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-default-foreground)}.pds-indicator-badge--brand{--indicator-badge-background:var(
-		--pds-color-badge-indicator-brand-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-brand-foreground)}.pds-indicator-badge--critical{--indicator-badge-background:var(
-		--pds-color-badge-indicator-critical-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-critical-foreground)}.pds-indicator-badge--info{--indicator-badge-background:var(
-		--pds-color-badge-indicator-info-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-info-foreground)}.pds-indicator-badge--success{--indicator-badge-background:var(
-		--pds-color-badge-indicator-success-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-success-foreground)}.pds-indicator-badge--warning{--indicator-badge-background:var(
-		--pds-color-badge-indicator-warning-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-warning-foreground)}.pds-indicator-badge--silver{--indicator-badge-background:var(
-		--pds-color-badge-indicator-silver-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-silver-foreground)}.pds-indicator-badge--gold{--indicator-badge-background:var(
-		--pds-color-badge-indicator-gold-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-gold-foreground)}.pds-indicator-badge--platinum{--indicator-badge-background:var(
-		--pds-color-badge-indicator-platinum-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-platinum-foreground)}.pds-indicator-badge--diamond{--indicator-badge-background:var(
-		--pds-color-badge-indicator-diamond-background
-	);--indicator-badge-text:var(--pds-color-badge-indicator-diamond-foreground)}

package/dist/css/component-css/pds-refresh-checker.css

@@ -1 +0,0 @@
-.pds-refresh-checker{display:flex}.pds-refresh-checker__button{align-items:center;background-color:transparent;border:0;color:var(--pds-color-fg-default-secondary);cursor:pointer;display:flex;font-family:var(--pds-typography-ff-sans);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular);gap:var(--pds-spacing-xs);height:var(--pds-spacing-button-height-m)}.pds-refresh-checker__button:hover .pds-refresh-checker__icon,.pds-refresh-checker__button:hover .pds-refresh-checker__label{color:var(--pds-color-interactive-link-hover)}.pds-refresh-checker__button .pds-refresh-checker__icon{color:var(--pds-color-fg-default)}.pds-refresh-checker__button .pds-tooltip .pds-refresh-checker__tooltip-icon{align-items:center;display:flex}.pds-refresh-checker__button--spinning{cursor:not-allowed}.pds-refresh-checker__icon--spinning{animation:pds-refresh-checker__icon--spin 1s linear infinite}@keyframes pds-refresh-checker__icon--spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.pds-refresh-checker--left{justify-content:flex-start}.pds-refresh-checker--left .pds-tooltip{padding-inline-end:var(--pds-spacing-4xs)}.pds-refresh-checker--right{justify-content:flex-end}.pds-refresh-checker--right .pds-tooltip{padding-inline-start:var(--pds-spacing-4xs)}