uikit-react-public 0.11.24 → 0.17.4

package/README.md

@@ -1,3 +1,5 @@
-# UIKit - React - Public
+# UIKit-React public
 
-React component library.
+```bash
+npm install uikit-react-public
+```

package/dist/components/Accordion/Accordion.Heading.d.ts

@@ -1,7 +1,7 @@
-import { default as React, HTMLAttributes, JSX } from 'react';
-export declare const NAME = "ucl-accordion__heading";
-interface AccordionHeadingProps extends HTMLAttributes<HTMLElement> {
-    as?: keyof JSX.IntrinsicElements;
+import { default as React, HTMLAttributes } from 'react';
+export declare const NAME = "ucl-uikit-accordion__heading";
+export interface AccordionHeadingProps extends HTMLAttributes<HTMLElement> {
+    as?: keyof HTMLElementTagNameMap;
     testId?: string;
 }
 declare const AccordionHeading: React.FC<AccordionHeadingProps>;

package/dist/components/Accordion/Accordion.Panel.d.ts

@@ -1,6 +1,6 @@
 import { default as React, HTMLAttributes } from 'react';
-export declare const NAME = "ucl-accordion__panel";
-interface AccordionPanelProps extends HTMLAttributes<HTMLDivElement> {
+export declare const NAME = "ucl-uikit-accordion__panel";
+export interface AccordionPanelProps extends HTMLAttributes<HTMLDivElement> {
     testId?: string;
 }
 declare const AccordionPanel: React.FC<AccordionPanelProps>;

package/dist/components/Accordion/Accordion.d.ts

@@ -1,7 +1,7 @@
 import { default as React, HTMLAttributes } from 'react';
 import { default as AccordionHeading } from './Accordion.Heading';
 import { default as AccordionPanel } from './Accordion.Panel';
-export declare const NAME = "ucl-accordion";
+export declare const NAME = "ucl-uikit-accordion";
 interface AccordionContextProps {
     isOpen: boolean;
     toggleAccordion: () => void;

package/dist/components/Accordion/Accordion.stories.d.ts

@@ -0,0 +1,57 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: import('react').FC<import('./Accordion').AccordionProps> & {
+        Heading: import('react').FC<import('./Accordion.Heading').AccordionHeadingProps>;
+        Panel: import('react').FC<import('./Accordion.Panel').AccordionPanelProps>;
+    };
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        size: {
+            options: string[];
+            control: {
+                type: "select";
+            };
+            type: "string";
+        };
+        disabled: {
+            control: {
+                type: "boolean";
+            };
+            type: "boolean";
+        };
+        isOpen: {
+            control: {
+                type: "boolean";
+            };
+            type: "boolean";
+        };
+        testId: {
+            control: {
+                type: "text";
+            };
+            type: "string";
+        };
+        className: {
+            control: {
+                type: "text";
+            };
+            type: "string";
+        };
+    };
+    args: {
+        isOpen: false;
+        disabled: false;
+        size: "medium";
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Disabled: Story;
+export declare const SmallSize: Story;
+export declare const CustomHeadingElement: Story;
+export declare const MultipleAccordions: Story;

package/dist/components/Accordion/index.d.ts

@@ -1,2 +1,4 @@
 export { default } from './Accordion';
 export type { AccordionProps } from './Accordion';
+export type { AccordionHeadingProps } from './Accordion.Heading';
+export type { AccordionPanelProps } from './Accordion.Panel';

package/dist/components/Avatar/Avatar.stories.d.ts

@@ -1,7 +1,110 @@
 import { StoryObj } from '@storybook/react';
+import { AvatarProps } from './Avatar';
+type AvatarSize = NonNullable<AvatarProps['size']>;
 declare const meta: {
     title: string;
-    component: import('react').NamedExoticComponent<import('./Avatar').AvatarProps & import('react').RefAttributes<HTMLButtonElement>>;
+    component: import('react').NamedExoticComponent<AvatarProps & import('react').RefAttributes<HTMLButtonElement>>;
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        variant: {
+            description: string;
+            options: string[];
+            control: {
+                type: "select";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        imageUrl: {
+            description: string;
+            control: {
+                type: "text";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        name: {
+            description: string;
+            control: {
+                type: "text";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        size: {
+            description: string;
+            options: AvatarSize[];
+            control: {
+                type: "inline-radio";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        disabled: {
+            description: string;
+            control: {
+                type: "boolean";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        testId: {
+            description: string;
+            control: {
+                type: "text";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        className: {
+            description: string;
+            control: {
+                type: "text";
+            };
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        onClick: {
+            description: string;
+            action: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    args: {
+        variant: "image";
+        imageUrl: string;
+        name: string;
+        size: 56;
+        disabled: false;
+    };
+    tags: string[];
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
@@ -9,3 +112,6 @@ export declare const Default: Story;
 export declare const Image: Story;
 export declare const Initials: Story;
 export declare const Icon: Story;
+export declare const Sizes: Story;
+export declare const Disabled: Story;
+export declare const BrokenImageFallback: Story;

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,6 @@
+export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {
+    testId?: string;
+    className?: string;
+}
+declare const Badge: ({ testId, className, children, ...props }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+export default Badge;

package/dist/components/Badge/Badge.stories.d.ts

@@ -0,0 +1,15 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ testId, className, children, ...props }: import('./Badge').BadgeProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    args: {
+        children: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/components/Badge/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Badge';
+export type { BadgeProps } from './Badge';

package/dist/components/Button/Button.d.ts

@@ -1,4 +1,5 @@
 import { ReactElement, ElementType, ComponentPropsWithRef } from 'react';
+import { MarginProps } from '../common/marginsStyle';
 export declare const NAME = "ucl-uikit-button";
 type PolymorphicRef<C extends ElementType> = ComponentPropsWithRef<C>['ref'];
 export interface ButtonBaseProps {
@@ -16,7 +17,8 @@ export interface ButtonBaseProps {
 export type ButtonProps<C extends ElementType = 'button'> = {
     as?: C;
     ref?: PolymorphicRef<C>;
-} & ButtonBaseProps & Omit<ComponentPropsWithRef<C>, keyof ButtonBaseProps | 'as'>;
+    className?: string;
+} & ButtonBaseProps & MarginProps & Omit<ComponentPropsWithRef<C>, keyof ButtonBaseProps | 'as'>;
 declare const Button: <C extends ElementType = "button">({ as, variant, destructive, size, disabled, icon, iconPosition, tooltip, loading, fullWidth, testId, ref, children, className, ...props }: ButtonProps<C>) => import("react/jsx-runtime").JSX.Element;
 declare const MemoizedButton: typeof Button;
 export default MemoizedButton;

package/dist/components/Calendar/index.d.ts

@@ -1,2 +1,2 @@
 export { default } from './Calendar';
-export type { CalendarProps, CalendarEvent, AcademicWeek, } from './Calendar.types';
+export type { CalendarProps, CalendarEvent, AcademicWeek } from './Calendar.types';

package/dist/components/CookieNotice/CookieNotice.d.ts

@@ -0,0 +1,16 @@
+import { HTMLAttributes } from 'react';
+import { MarginProps } from '../common/marginsStyle';
+export declare const NAME = "ucl-uikit-cookie-notice";
+export declare const DEFAULT_POLICY_HREF = "https://www.ucl.ac.uk/legal-services/privacy/cookie-policy";
+export declare const DEFAULT_TEXT = "We use necessary cookies to manage your session and essential site functions. We also use Google Analytics cookies to understand how our site is used. You can accept or reject non-essential cookies.";
+export interface CookieNoticeBaseProps extends HTMLAttributes<HTMLDivElement> {
+    policyHref?: string;
+    text?: string;
+    onAccept?: () => void;
+    onReject?: () => void;
+    trapFocus?: boolean;
+    testId?: string;
+}
+export type CookieNoticeProps = CookieNoticeBaseProps & MarginProps;
+declare const CookieNotice: ({ policyHref, text, onAccept, onReject, trapFocus, testId, className, ...props }: CookieNoticeProps) => import("react/jsx-runtime").JSX.Element;
+export default CookieNotice;

package/dist/components/CookieNotice/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './CookieNotice';
+export type { CookieNoticeProps } from './CookieNotice';

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

@@ -1,3 +1,3 @@
 import { DatepickerProps } from './Datepicker.types';
-declare const Datepicker: ({ value, onValueChange, minDate, maxDate, disabled, className, native, nativeRef, nativeHTMLAttributes, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
+declare const Datepicker: ({ value, onValueChange, minDate, maxDate, disabled, className, clearable, ...props }: DatepickerProps) => import("react/jsx-runtime").JSX.Element;
 export default Datepicker;

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

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ value, onValueChange, minDate, maxDate, disabled, className, native, nativeRef, nativeHTMLAttributes, ...props }: import('./Datepicker.types').DatepickerProps) => import("react/jsx-runtime").JSX.Element;
+    component: ({ value, onValueChange, minDate, maxDate, disabled, className, clearable, ...props }: import('./Datepicker.types').DatepickerProps) => import("react/jsx-runtime").JSX.Element;
     parameters: {
         layout: string;
     };
@@ -26,7 +26,7 @@ declare const meta: {
                 type: "boolean";
             };
         };
-        native: {
+        clearable: {
             control: {
                 type: "boolean";
             };
@@ -42,7 +42,8 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
+export declare const InAField: Story;
 export declare const WithEvents: Story;
 export declare const WithAcademicWeeks: Story;
 export declare const MinMaxDates: Story;
-export declare const Native: Story;
+export declare const Clearable: Story;

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

@@ -1,5 +1,6 @@
-import { InputHTMLAttributes, HTMLAttributes, RefObject } from 'react';
+import { HTMLAttributes, RefObject } from 'react';
 import { CalendarEvent, AcademicWeek } from '../Calendar';
+import { InputProps } from './subcomponents/DatepickerInput';
 export type DatepickerValue = Date | null;
 interface BaseDatepickerProps {
     value?: DatepickerValue;
@@ -11,13 +12,11 @@ interface BaseDatepickerProps {
     academicWeeks?: AcademicWeek[];
     testId?: string;
     disabled?: boolean;
+    clearable?: boolean;
     ref?: RefObject<HTMLDivElement>;
     inputRef?: RefObject<HTMLInputElement>;
+    inputProps?: InputProps;
 }
-type NativeDatepickerAttributeProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'min' | 'max' | 'className' | 'disabled'>;
 export interface DatepickerProps extends BaseDatepickerProps, HTMLAttributes<HTMLDivElement> {
-    native?: boolean;
-    nativeHTMLAttributes?: NativeDatepickerAttributeProps;
-    nativeRef?: RefObject<HTMLInputElement>;
 }
 export {};

package/dist/components/Datepicker/subcomponents/CustomDatepicker.d.ts

@@ -1,17 +1,20 @@
 import { DatepickerValue } from '../Datepicker.types';
 import { CalendarEvent, AcademicWeek } from '../../Calendar';
+import { InputProps } from './DatepickerInput';
 interface CustomDatepickerProps extends React.HTMLAttributes<HTMLDivElement> {
     value?: DatepickerValue;
     onValueChange?: (value: DatepickerValue, event?: React.SyntheticEvent) => void;
     minDate?: string | null;
     maxDate?: string | null;
     disabled?: boolean;
+    clearable?: boolean;
     events?: CalendarEvent[];
     showAcademicWeeks?: boolean;
     academicWeeks?: AcademicWeek[];
     testId?: string;
     ref?: React.RefObject<HTMLDivElement>;
     inputRef?: React.RefObject<HTMLInputElement>;
+    inputProps?: InputProps;
 }
-declare const CustomDatepicker: ({ value, onValueChange, minDate, maxDate, disabled, events, showAcademicWeeks, academicWeeks, testId, className, ref, inputRef, ...props }: CustomDatepickerProps) => import("react/jsx-runtime").JSX.Element;
+declare const CustomDatepicker: ({ value, onValueChange, minDate, maxDate, disabled, clearable, events, showAcademicWeeks, academicWeeks, testId, className, ref, inputRef, inputProps, ...props }: CustomDatepickerProps) => import("react/jsx-runtime").JSX.Element;
 export default CustomDatepicker;

package/dist/components/Datepicker/subcomponents/DatepickerInput.d.ts

@@ -1,4 +1,17 @@
-interface DatepickerInputProps {
+/**
+ * HTML attributes that consumers can pass to the underlying `<input>` via the
+ * `inputProps` prop on `<Datepicker>`.
+ *
+ * Controlled and internally-managed attributes are omitted to prevent conflicts.
+ */
+export type InputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'onKeyDown' | 'onFocus' | 'disabled' | 'type'> & {
+    testId?: string;
+};
+/**
+ * Internal props for `<DatepickerInput>`, combining consumer-facing
+ *  input attributes with controlled props managed by `<VisibleField>`.
+ */
+interface DatepickerInputProps extends InputProps {
     value: string;
     onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
@@ -6,5 +19,5 @@ interface DatepickerInputProps {
     disabled: boolean;
     ref: React.RefObject<HTMLInputElement | null>;
 }
-declare const DatepickerInput: ({ value, onChange, onKeyDown, onFocus, disabled, ref, }: DatepickerInputProps) => import("react/jsx-runtime").JSX.Element;
+declare const DatepickerInput: ({ disabled, placeholder, inputMode, testId, className, ...props }: DatepickerInputProps) => import("react/jsx-runtime").JSX.Element;
 export default DatepickerInput;

package/dist/components/Datepicker/subcomponents/Panel.d.ts

@@ -2,5 +2,5 @@ interface PanelProps {
     zIndex?: number;
     children: React.ReactNode;
 }
-declare const Panel: ({ zIndex, children }: PanelProps) => import("react/jsx-runtime").JSX.Element;
+declare const Panel: ({ zIndex, children, }: PanelProps) => import("react/jsx-runtime").JSX.Element;
 export default Panel;

package/dist/components/Datepicker/subcomponents/VisibleField.d.ts

@@ -1,12 +1,17 @@
 import { default as React } from 'react';
+import { InputProps } from './DatepickerInput';
 interface VisibleFieldProps {
     inputValue: string;
     onInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;
     onInputFocus: () => void;
     onButtonClick: () => void;
+    onClear: (event: React.SyntheticEvent) => void;
     disabled: boolean;
+    clearable?: boolean;
+    hasValue?: boolean;
     inputRef: React.RefObject<HTMLInputElement | null>;
+    inputProps: InputProps;
 }
-declare const VisibleField: ({ inputValue, onInputChange, onInputKeyDown, onInputFocus, onButtonClick, disabled, inputRef, }: VisibleFieldProps) => import("react/jsx-runtime").JSX.Element;
+declare const VisibleField: ({ inputValue, onInputChange, onInputKeyDown, onInputFocus, onButtonClick, onClear, disabled, clearable, hasValue, inputRef, inputProps, }: VisibleFieldProps) => import("react/jsx-runtime").JSX.Element;
 export default VisibleField;

package/dist/components/Datepicker/subcomponents/index.d.ts

@@ -1,5 +1,4 @@
 export { default as CustomDatepicker } from './CustomDatepicker';
-export { default as NativeDatepicker } from './NativeDatepicker';
 export { default as VisibleField } from './VisibleField';
 export { default as DatepickerInput } from './DatepickerInput';
 export { default as Panel } from './Panel';

package/dist/components/Datepicker/utils/index.d.ts

@@ -1,2 +1 @@
-export { default as dateToLocaleISOString } from './dateToLocaleISOString/dateToLocaleISOString';
 export { default as parseInputValue } from './parseInputValue/parseInputValue';

package/dist/components/Dialog/BaseDialog.d.ts

@@ -9,8 +9,14 @@ export interface BaseDialogProps extends HTMLAttributes<HTMLDialogElement> {
     modal?: boolean;
     closeOnClickOutside?: boolean;
     closeOnClickOutsideStopPropagation?: boolean;
-    onClose?: (ev: React.MouseEvent) => void;
+    nonModalCloseOnEscape?: boolean;
+    onClose?: (ev: React.MouseEvent | KeyboardEvent) => void;
+    initialFocusRef?: React.RefObject<HTMLElement>;
+    finalFocusRef?: React.RefObject<HTMLElement>;
+    disableFocusTrap?: boolean;
+    restoreFocus?: boolean;
+    skipCloseOnInitialFocus?: boolean;
     testId?: string;
 }
-declare const _default: React.MemoExoticComponent<({ open, size, modal, closeOnClickOutside, closeOnClickOutsideStopPropagation, onClose, testId, className, children, ...props }: BaseDialogProps) => import("react/jsx-runtime").JSX.Element | null>;
+declare const _default: React.MemoExoticComponent<({ open, size, modal, closeOnClickOutside, closeOnClickOutsideStopPropagation, nonModalCloseOnEscape, onClose, className, children, initialFocusRef, finalFocusRef, disableFocusTrap, restoreFocus, skipCloseOnInitialFocus, testId, ...props }: BaseDialogProps) => import("react/jsx-runtime").JSX.Element | null>;
 export default _default;

package/dist/components/Dialog/Dialog.d.ts

@@ -4,6 +4,8 @@ import { default as DialogBody } from './DialogBody';
 import { default as DialogFooter } from './DialogFooter';
 export declare const NAME = "ucl-uikit-dialog";
 interface DialogContextValue {
+    dialogHeaderId?: string;
+    dialogBodyId?: string;
     onClose?: (ev: React.MouseEvent) => void;
     onSecondaryAction?: () => void;
     onAction?: () => void;

package/dist/components/FileInput/FileInput.d.ts

@@ -0,0 +1,8 @@
+import { InputHTMLAttributes } from 'react';
+export declare const NAME = "ucl-uikit-fileinput";
+export interface FileInputProps extends InputHTMLAttributes<HTMLInputElement> {
+    testId?: string;
+    labelId?: string;
+}
+declare const FileInput: ({ testId, children, labelId, ...props }: FileInputProps) => import("react/jsx-runtime").JSX.Element;
+export default FileInput;

package/dist/components/FileInput/FileInput.stories.d.ts

@@ -0,0 +1,16 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ testId, children, labelId, ...props }: import('./FileInput').FileInputProps) => import("react/jsx-runtime").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithCustomClass: Story;
+export declare const MultipleFiles: Story;
+export declare const NoChildren: Story;
+export declare const WithDecorator: Story;

package/dist/components/FileInput/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './FileInput';
+export type { FileInputProps } from './FileInput';

package/dist/components/Header/Header.d.ts

@@ -7,9 +7,15 @@ export declare const DEFAULT_Z_INDEX = 3;
 export interface HeaderProps extends HTMLAttributes<HTMLElement> {
     title?: string;
     fixed?: boolean;
+    titleAs?: React.ElementType<React.HTMLAttributes<HTMLElement>>;
+    titleClassName?: string;
+    titleProps?: Record<string, unknown>;
+    homeLinkHref?: string;
+    homeLinkProps?: Record<string, unknown>;
+    homeLinkAriaLabel?: string;
     testId?: string;
 }
-declare const MemoAppHeader: import('react').MemoExoticComponent<({ title, fixed, testId, className, children, ...props }: HeaderProps) => import("react/jsx-runtime").JSX.Element>;
+declare const MemoAppHeader: import('react').MemoExoticComponent<({ title, fixed, titleAs, titleClassName, titleProps, homeLinkHref, homeLinkProps, homeLinkAriaLabel, testId, className, children, ...props }: HeaderProps) => import("react/jsx-runtime").JSX.Element>;
 export interface IHeaderSubComponents {
     Menu: typeof HeaderMenu;
 }

package/dist/components/Header/Header.stories.d.ts

@@ -0,0 +1,40 @@
+import { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: import('react').NamedExoticComponent<import('./Header').HeaderProps> & {
+        readonly type: ({ title, fixed, titleAs, titleClassName, titleProps, homeLinkHref, homeLinkProps, homeLinkAriaLabel, testId, className, children, ...props }: import('./Header').HeaderProps) => import("react/jsx-runtime").JSX.Element;
+    } & import('./Header').IHeaderSubComponents;
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        title: {
+            control: "text";
+        };
+        fixed: {
+            control: "boolean";
+        };
+        homeLinkHref: {
+            control: "text";
+        };
+        homeLinkAriaLabel: {
+            control: "text";
+        };
+        className: {
+            control: "text";
+        };
+        children: {
+            control: false;
+        };
+    };
+    args: {
+        title: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Fixed: Story;
+export declare const WithHomeLink: Story;
+export declare const WithMenu: Story;

package/dist/components/Heading/Heading.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import { MarginProps } from '../common/marginsStyle';
-export declare const NAME = "ucl-heading";
+export declare const NAME = "ucl-uikit-heading";
 export interface HeadingBaseProps extends HTMLAttributes<HTMLHeadingElement> {
     level?: 1 | 2 | 3 | 4;
     margins?: boolean;

package/dist/components/Link/BaseLink.d.ts

@@ -0,0 +1,10 @@
+import { default as React, AnchorHTMLAttributes, ElementType } from 'react';
+export interface BaseLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    component?: ElementType;
+    size?: 'small' | 'default';
+    noVisited?: boolean;
+    disabled?: boolean;
+    testId?: string;
+}
+declare const BaseLink: React.ForwardRefExoticComponent<BaseLinkProps & React.RefAttributes<HTMLAnchorElement>>;
+export default BaseLink;

package/dist/components/Link/Link.d.ts

@@ -1,11 +1,6 @@
-import { AnchorHTMLAttributes, ElementType, ComponentPropsWithRef } from 'react';
-export declare const NAME = "ucl-link";
-export interface LinkBaseProps {
-    noVisited?: boolean;
-    testId?: string;
-    component?: ElementType;
+import { BaseLinkProps } from './BaseLink';
+export interface LinkProps extends BaseLinkProps {
+    variant?: 'primary' | 'secondary';
 }
-export type LinkProps<C extends ElementType = 'a'> = LinkBaseProps & (C extends 'a' ? AnchorHTMLAttributes<HTMLAnchorElement> : Omit<ComponentPropsWithRef<C>, keyof LinkBaseProps>);
-export type Ref = HTMLAnchorElement;
-declare const _default: import('react').NamedExoticComponent<LinkBaseProps & AnchorHTMLAttributes<HTMLAnchorElement> & import('react').RefAttributes<HTMLAnchorElement>>;
-export default _default;
+declare const Link: import('react').ForwardRefExoticComponent<LinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
+export default Link;

package/dist/components/Link/Link.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: import('react').NamedExoticComponent<import('./Link').LinkBaseProps & import('react').AnchorHTMLAttributes<HTMLAnchorElement> & import('react').RefAttributes<HTMLAnchorElement>>;
+    component: import('react').ForwardRefExoticComponent<import('./Link').LinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
     args: {
         children: string;
         href: string;

package/dist/components/Link/index.d.ts

@@ -1,2 +1,2 @@
 export { default } from './Link';
-export type { LinkProps, LinkBaseProps } from './Link';
+export type { LinkProps } from './Link';

package/dist/components/Main/Main.d.ts

@@ -0,0 +1,21 @@
+export interface MainProps extends React.HTMLAttributes<HTMLElement> {
+    /**
+     * Determines whether to wrap children in a `<Layout>` component,
+     * to apply the grid layout from the UCL Design System.
+     */
+    layout?: boolean;
+    /**
+     * ID for testing purposes.
+     * Added to the `data-testid` attribute of top-level `<main>` element.
+     * Default is `'ucl-uikit-main'`.
+     */
+    testId?: string;
+}
+export declare const NAME = "ucl-uikit-main";
+/**
+ * Semantic wrapper around HTML `<main>` element
+ *
+ * Optionally wraps children in the UCL Design System `Layout` grid when `layout` is true
+ */
+declare const Main: ({ layout, testId, className, children, ...props }: MainProps) => import("react/jsx-runtime").JSX.Element;
+export default Main;