@aurora-ds/components 1.6.0 → 1.7.1

package/dist/index.d.ts

@@ -400,9 +400,13 @@ type LinkColor = 'default' | 'secondary';
 
 /** SVG icon component, e.g. imported via `?react` or taken from the `IconRegistry`. */
 type LinkIcon = ComponentType<SVGProps<SVGSVGElement>>;
-type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
+type LinkProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {
     /** React 19 ref prop. */
     ref?: Ref<HTMLAnchorElement>;
+    /** Visible link text — rendered inside a `<Text>` element. */
+    label: string;
+    /** Font size token applied to the label text. @default 'md' */
+    fontSize?: keyof Theme['fontSize'];
     /** Controls when the underline is visible. @default 'hover' */
     underline?: LinkUnderline;
     /**
@@ -428,10 +432,10 @@ type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
      *
      * @example
      * // Standard href
-     * <Link href="/about">About</Link>
+     * <Link href="/about" label="About" />
      *
      * // React Router (no href)
-     * <Link onClick={() => navigate('/about')}>About</Link>
+     * <Link onClick={() => navigate('/about')} label="About" />
      */
     href?: string;
     /** SVG icon rendered before the text. */
@@ -447,11 +451,11 @@ type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
  * In that case the component stays accessible: it gets `role="link"`,
  * `tabIndex={0}` and keyboard Enter support automatically.
  *
- * @example <Link href='/about'>About</Link>
- * @example <Link href='https://example.com' external>External site</Link>
- * @example <Link href='/profile' underline='always' startIcon={UserIcon}>Profile</Link>
- * @example <Link href='/terms' underline='none'>Terms</Link>
- * @example <Link onClick={() => navigate('/about')}>About (SPA)</Link>
+ * @example <Link href='/about' label='About' />
+ * @example <Link href='https://example.com' label='External site' external />
+ * @example <Link href='/profile' underline='always' startIcon={UserIcon} label='Profile' />
+ * @example <Link href='/terms' underline='none' label='Terms' />
+ * @example <Link onClick={() => navigate('/about')} label='About (SPA)' />
  */
 declare const Link: FC<LinkProps>;
 
@@ -2649,6 +2653,11 @@ type AlertTitleProps = {
      * (e.g. `<Icon icon={MyIcon} strokeColor="primaryMain" />`) for full customisation.
      */
     icon?: ComponentType<SVGProps<SVGSVGElement>> | ReactNode;
+    /**
+     * Callback fired when the user clicks the dismiss (×) button.
+     * When provided, a close `IconButton` is rendered on the right side of the title row.
+     */
+    onDismiss?: () => void;
 };
 
 type AlertBodyProps = {
@@ -2656,10 +2665,25 @@ type AlertBodyProps = {
     children: ReactNode;
 };
 
+type AlertActionsProps = {
+    /**
+     * Action elements to render inside the actions row.
+     * Typically one or more `<Button>` or `<Link>` components.
+     *
+     * @example
+     * <Alert.Actions>
+     *   <Button size="sm" variant="outlined">Retry</Button>
+     *   <Button size="sm" variant="text">Dismiss</Button>
+     * </Alert.Actions>
+     */
+    children: ReactNode;
+};
+
 type AlertVariant = 'default' | 'success' | 'error' | 'warning' | 'info';
 type AlertComponent = FC<AlertProps> & {
     Title: FC<AlertTitleProps>;
     Body: FC<AlertBodyProps>;
+    Actions: FC<AlertActionsProps>;
 };
 
 declare const Alert: AlertComponent;
@@ -2701,7 +2725,7 @@ type DialogProps = {
     minWidth?: number | string;
     /** Minimum height of the dialog panel. Accepts numbers (px) or any CSS height value. */
     minHeight?: number | string;
-    /** Whether the dialog takes the full viewport height on mobile (bottom-sheet variant). @default false */
+    /** Whether the dialog takes the full viewport on all screen sizes. @default false */
     fullscreen?: boolean;
     /**
      * Accessible label — use when Dialog.Header is not present.
@@ -2960,6 +2984,49 @@ type UseKeyPressOptions = {
  */
 declare const useKeyPress: (keyMap: KeyPressMap, { target, enabled }?: UseKeyPressOptions) => void;
 
+/**
+ * Responsive breakpoints (min-width, mobile-first).
+ * Keep in sync with themeBreakpoints.
+ */
+declare const BREAKPOINTS: {
+    readonly xs: 480;
+    readonly sm: 640;
+    readonly md: 768;
+    readonly lg: 1024;
+    readonly xl: 1280;
+    readonly '2xl': 1536;
+};
+
+type Breakpoint = keyof typeof BREAKPOINTS;
+/**
+ * Listens to a CSS media query string and returns whether it currently matches.
+ *
+ * @param query - A valid CSS media query string, e.g. `'(max-width: 639px)'`.
+ * @returns `true` when the media query matches, `false` otherwise.
+ *
+ * @example
+ * const isMobile = useMediaQuery('(max-width: 639px)')
+ */
+declare const useMediaQuery: (query: string) => boolean;
+/**
+ * Returns `true` when the viewport width is **below** the given breakpoint (mobile-first max).
+ *
+ * @param breakpoint - One of the Aurora breakpoints: `xs` | `sm` | `md` | `lg` | `xl` | `2xl`.
+ *
+ * @example
+ * const isMobile = useBreakpointMax('sm') // true when width < 640px
+ */
+declare const useBreakpointMax: (breakpoint: Breakpoint) => boolean;
+/**
+ * Returns `true` when the viewport width is **at or above** the given breakpoint.
+ *
+ * @param breakpoint - One of the Aurora breakpoints: `xs` | `sm` | `md` | `lg` | `xl` | `2xl`.
+ *
+ * @example
+ * const isDesktop = useBreakpointMin('md') // true when width >= 768px
+ */
+declare const useBreakpointMin: (breakpoint: Breakpoint) => boolean;
+
 /**
  * Merges several refs (callback or object) into a single stable callback ref.
  *
@@ -3096,5 +3163,5 @@ declare const lightTheme: Theme;
 
 declare const darkTheme: Theme;
 
-export { Accordion, Alert, Article, Aside, Avatar, AvatarGroup, Backdrop, Badge, Box, Breadcrumb, Button, Card, Checkbox, DatePicker, DefaultErrorFallback, Dialog, Drawer, ErrorBoundary, Fab, Footer, Form, Grid, Header, Icon, IconButton, Image, InfoBubble, Link, LoaderScreen, Main, Menu, Nav, Pagination, RadioButton, RadioGroup, Section, Select, Separator, Skeleton, Stack, SvgImage, Switch, Table, Tabs, Text, TextField, ToggleButton, ToggleGroup, ToggleIconButton, Tooltip, darkTheme, lightTheme, useBodyScrollLock, useControllableState, useDrawerContext, useFocusTrap, useKeyPress, useListKeyNav, useMenuPosition, useMergedRefs, useTooltipPosition, useTransitionRender };
-export type { AccordionBodyProps, AccordionProps, AccordionTitleProps, AlertBodyProps, AlertProps, AlertTitleProps, AlertVariant, ArticleProps, AsideProps, AvatarColor, AvatarGroupOverlap, AvatarGroupProps, AvatarProps, AvatarShape, AvatarSize, BackdropProps, BadgeColor, BadgeIcon, BadgeProps, BadgeSize, BadgeVariant, BoxProps, BreadcrumbItemProps, BreadcrumbProps, BreadcrumbSeparator, ButtonColor, ButtonIcon, ButtonProps, ButtonSize, ButtonVariant, CardBodyProps, CardHeaderProps, CardProps, CardVariant, CheckboxProps, DatePickerProps, DatePickerSize, DatePickerStatus, DefaultErrorFallbackProps, DialogBodyProps, DialogHeaderProps, DialogProps, DrawerBodyProps, DrawerFooterProps, DrawerHeaderProps, DrawerItemIcon, DrawerItemProps, DrawerProps, DrawerVariant, ErrorBoundaryFallbackRenderProps, ErrorBoundaryProps, FabColor, FabIcon, FabPlacement, FabProps, FabSize, FooterProps, FormProps, GridProps, GridStyleProps, HeaderProps, IconButtonProps, IconProps, IconStyleParams, ImageProps, InfoBubbleProps, KeyPressHandler, KeyPressMap, LinkColor, LinkIcon, LinkProps, LinkUnderline, LoaderScreenProps, MainProps, MenuGroupProps, MenuItemProps, MenuItemRole, MenuPlacement, MenuProps, NavProps, PaginationProps, PaginationShape, PaginationSize, Palette, RadioButtonProps, RadioGroupProps, SectionProps, SelectOption, SelectProps, SeparatorOrientation, SeparatorProps, SeparatorStyleParams, SeparatorThickness, SkeletonAnimation, SkeletonProps, SkeletonVariant, StackProps, SvgImageProps, SwitchColor, SwitchProps, SwitchSize, TabItemProps, TableAlign, TableBodyProps, TableCellProps, TableColumn, TableFootProps, TableHeadProps, TableHeaderCellProps, TableLayout, TableProps, TableRowProps, TabsListProps, TabsPanelProps, TabsProps, TextFieldProps, TextFieldSize, TextFieldStatus, TextProps, TextStyleParams, TextVariantStyle, TextVariants, Theme, ToggleButtonProps, ToggleButtonVariant, ToggleGroupProps, ToggleIconButtonProps, TooltipPlacement, TooltipPosition, TooltipProps, UseControllableStateOptions, UseControllableStateResult, UseKeyPressOptions, UseListKeyNavOptions, UseListKeyNavResult, UseMenuPositionOptions, UseMenuPositionResult, UseTooltipPositionOptions, UseTooltipPositionResult, UseTransitionRenderReturnType, WeekStart };
+export { Accordion, Alert, Article, Aside, Avatar, AvatarGroup, Backdrop, Badge, Box, Breadcrumb, Button, Card, Checkbox, DatePicker, DefaultErrorFallback, Dialog, Drawer, ErrorBoundary, Fab, Footer, Form, Grid, Header, Icon, IconButton, Image, InfoBubble, Link, LoaderScreen, Main, Menu, Nav, Pagination, RadioButton, RadioGroup, Section, Select, Separator, Skeleton, Stack, SvgImage, Switch, Table, Tabs, Text, TextField, ToggleButton, ToggleGroup, ToggleIconButton, Tooltip, darkTheme, lightTheme, useBodyScrollLock, useBreakpointMax, useBreakpointMin, useControllableState, useDrawerContext, useFocusTrap, useKeyPress, useListKeyNav, useMediaQuery, useMenuPosition, useMergedRefs, useTooltipPosition, useTransitionRender };
+export type { AccordionBodyProps, AccordionProps, AccordionTitleProps, AlertActionsProps, AlertBodyProps, AlertProps, AlertTitleProps, AlertVariant, ArticleProps, AsideProps, AvatarColor, AvatarGroupOverlap, AvatarGroupProps, AvatarProps, AvatarShape, AvatarSize, BackdropProps, BadgeColor, BadgeIcon, BadgeProps, BadgeSize, BadgeVariant, BoxProps, BreadcrumbItemProps, BreadcrumbProps, BreadcrumbSeparator, ButtonColor, ButtonIcon, ButtonProps, ButtonSize, ButtonVariant, CardBodyProps, CardHeaderProps, CardProps, CardVariant, CheckboxProps, DatePickerProps, DatePickerSize, DatePickerStatus, DefaultErrorFallbackProps, DialogBodyProps, DialogHeaderProps, DialogProps, DrawerBodyProps, DrawerFooterProps, DrawerHeaderProps, DrawerItemIcon, DrawerItemProps, DrawerProps, DrawerVariant, ErrorBoundaryFallbackRenderProps, ErrorBoundaryProps, FabColor, FabIcon, FabPlacement, FabProps, FabSize, FooterProps, FormProps, GridProps, GridStyleProps, HeaderProps, IconButtonProps, IconProps, IconStyleParams, ImageProps, InfoBubbleProps, KeyPressHandler, KeyPressMap, LinkColor, LinkIcon, LinkProps, LinkUnderline, LoaderScreenProps, MainProps, MenuGroupProps, MenuItemProps, MenuItemRole, MenuPlacement, MenuProps, NavProps, PaginationProps, PaginationShape, PaginationSize, Palette, RadioButtonProps, RadioGroupProps, SectionProps, SelectOption, SelectProps, SeparatorOrientation, SeparatorProps, SeparatorStyleParams, SeparatorThickness, SkeletonAnimation, SkeletonProps, SkeletonVariant, StackProps, SvgImageProps, SwitchColor, SwitchProps, SwitchSize, TabItemProps, TableAlign, TableBodyProps, TableCellProps, TableColumn, TableFootProps, TableHeadProps, TableHeaderCellProps, TableLayout, TableProps, TableRowProps, TabsListProps, TabsPanelProps, TabsProps, TextFieldProps, TextFieldSize, TextFieldStatus, TextProps, TextStyleParams, TextVariantStyle, TextVariants, Theme, ToggleButtonProps, ToggleButtonVariant, ToggleGroupProps, ToggleIconButtonProps, TooltipPlacement, TooltipPosition, TooltipProps, UseControllableStateOptions, UseControllableStateResult, UseKeyPressOptions, UseListKeyNavOptions, UseListKeyNavResult, UseMenuPositionOptions, UseMenuPositionResult, UseTooltipPositionOptions, UseTooltipPositionResult, UseTransitionRenderReturnType, WeekStart };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurora-ds/components",
-  "version": "1.6.0",
+  "version": "1.7.1",
   "type": "module",
   "description": "Aurora DS - React Components Library",
   "main": "dist/cjs/index.js",