@alto-avios/alto-ui 2.4.0 → 3.0.0

package/dist/components/FieldError/FieldError.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { FieldError as FieldError$1 } from "react-aria-components";
 import { Icon } from "../Icon/Icon.js";
 import '../../assets/FieldError.css';const fieldError = "_fieldError_1tsix_1";
@@ -9,13 +9,16 @@ const FieldError = ({
   children,
   ...props
 }) => {
-  if (!children) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs(FieldError$1, { className: styles.fieldError, ...props, children: [
-    /* @__PURE__ */ jsx(Icon, { iconName: "triangle-exclamation", "aria-label": "error-icon" }),
-    children
-  ] });
+  return /* @__PURE__ */ jsx(FieldError$1, { className: styles.fieldError, ...props, children: ({
+    validationErrors
+  }) => {
+    const errorMessage = children || (validationErrors == null ? void 0 : validationErrors[0]);
+    if (!errorMessage) return null;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Icon, { iconName: "triangle-exclamation", "aria-label": "error-icon" }),
+      errorMessage
+    ] });
+  } });
 };
 export {
   FieldError,

package/dist/components/FieldError/FieldError.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldError.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"FieldError.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -1 +1,2 @@
 export { default } from './FieldHeader';
+export type { FieldHeaderProps } from './FieldHeader';

package/dist/components/Fieldset/Fieldset.d.ts

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { FieldsetHeaderProps } from '../FieldsetHeader/FieldsetHeader';
+export interface FieldsetProps {
+    children?: React.ReactNode;
+}
+declare const Fieldset: {
+    ({ children }: FieldsetProps): import("react/jsx-runtime").JSX.Element;
+    Content: {
+        ({ children }: FieldsetContentProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Header: ({ children, description, }: FieldsetHeaderProps) => import("react/jsx-runtime").JSX.Element;
+};
+export interface FieldsetContentProps {
+    children?: React.ReactNode;
+}
+export type { FieldsetHeaderProps };
+export default Fieldset;

package/dist/components/Fieldset/Fieldset.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import { FieldsetHeader } from "../FieldsetHeader/FieldsetHeader.js";
+import { Box } from "../Box/Box.js";
+import '../../assets/Fieldset.css';const fieldset = "_fieldset_11lio_1";
+const styles = {
+  fieldset
+};
+const Fieldset = ({
+  children
+}) => {
+  return /* @__PURE__ */ jsx("fieldset", { className: styles.fieldset, children });
+};
+const Content = ({
+  children
+}) => {
+  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", gap: "sm", width: "100%", children });
+};
+Content.displayName = "Fieldset.Content";
+Fieldset.Content = Content;
+Fieldset.Header = FieldsetHeader;
+export {
+  Fieldset as default
+};
+//# sourceMappingURL=Fieldset.js.map

package/dist/components/Fieldset/Fieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}

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

@@ -0,0 +1,2 @@
+export { default } from './Fieldset';
+export type { FieldsetProps, FieldsetHeaderProps, FieldsetContentProps, } from './Fieldset';

package/dist/components/Fieldset/index.js

@@ -0,0 +1,5 @@
+import { default as default2 } from "./Fieldset.js";
+export {
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Fieldset/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/FieldsetHeader/FieldsetHeader.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+export interface FieldsetHeaderProps {
+    children?: React.ReactNode;
+    description?: React.ReactNode;
+}
+export declare const FieldsetHeader: ({ children, description, }: FieldsetHeaderProps) => import("react/jsx-runtime").JSX.Element;
+export default FieldsetHeader;

package/dist/components/FieldsetHeader/FieldsetHeader.js

@@ -0,0 +1,21 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Heading } from "../Heading/Heading.js";
+import '../../assets/FieldsetHeader.css';const fieldsetHeader = "_fieldsetHeader_abhm4_1";
+const styles = {
+  fieldsetHeader,
+  "fieldsetHeader-description": "_fieldsetHeader-description_abhm4_12"
+};
+const FieldsetHeader = ({
+  children,
+  description
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: styles["fieldsetHeader"], children: [
+    /* @__PURE__ */ jsx(Heading, { as: "legend", size: "sm", fgColor: "accentSecondary", children }),
+    description && /* @__PURE__ */ jsx("span", { className: styles["fieldsetHeader-description"], children: description })
+  ] });
+};
+export {
+  FieldsetHeader,
+  FieldsetHeader as default
+};
+//# sourceMappingURL=FieldsetHeader.js.map

package/dist/components/FieldsetHeader/FieldsetHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldsetHeader.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}

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

@@ -0,0 +1 @@
+export { default } from './FieldsetHeader';

package/dist/components/FieldsetHeader/index.js

@@ -0,0 +1,5 @@
+import { FieldsetHeader } from "./FieldsetHeader.js";
+export {
+  FieldsetHeader as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/FieldsetHeader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/Form/Form.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { FormProps as FormAriaProps } from 'react-aria-components';
+export interface FormProps extends FormAriaProps {
+    children?: React.ReactNode;
+}
+export declare const Form: ({ children, ...props }: FormProps) => import("react/jsx-runtime").JSX.Element;
+export default Form;

package/dist/components/Form/Form.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { Form as Form$1 } from "react-aria-components";
+import '../../assets/Form.css';const form = "_form_11vpr_1";
+const styles = {
+  form
+};
+const Form = ({
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(Form$1, { className: styles["form"], ...props, children });
+};
+export {
+  Form,
+  Form as default
+};
+//# sourceMappingURL=Form.js.map

package/dist/components/Form/Form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

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

@@ -0,0 +1 @@
+export { default } from './Form';

package/dist/components/Form/index.js

@@ -0,0 +1,5 @@
+import { Form } from "./Form.js";
+export {
+  Form as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Form/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -3,11 +3,11 @@ import { VariantProps } from 'class-variance-authority';
 import { fgColorVariants } from '../../utils/fgColour/fgColor';
 declare const heading: (props?: ({
     size?: "lg" | "sm" | "xs" | "md" | "xl" | "xxs" | null | undefined;
-    textAlign?: "start" | "center" | "end" | null | undefined;
+    textAlign?: "end" | "start" | "center" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type HeadingVariants = VariantProps<typeof heading>;
 type FgColorVariants = VariantProps<typeof fgColorVariants>;
-type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';
+type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'legend';
 type HeadingSize = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export interface HeadingProps extends HeadingVariants {
     children: React.ReactNode;

package/dist/components/Heading/Heading.js

@@ -51,8 +51,10 @@ const DEFAULT_HEADING_SIZE_MAP = {
   h4: "sm",
   h5: "xs",
   h6: "xxs",
-  span: "md"
+  span: "md",
   // Default for span elements
+  legend: "sm"
+  // Default for legend elements
 };
 const Heading = ({
   children,

package/dist/components/Heading/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Heading.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/IconButton/IconButton.d.ts

@@ -1,7 +1,8 @@
 import { PressEvent } from 'react-aria-components';
 import { ButtonProps } from '../Button/Button';
 import { IconProps } from '../Icon/Icon';
-export interface IconButtonProps extends ButtonProps {
+import { FormProps } from '../../utils/forms/formProps';
+export interface IconButtonProps extends Omit<ButtonProps<'button'>, 'onClick'>, FormProps {
     /**
      * What icon from fontAwesome to use with all options
      */
@@ -11,13 +12,21 @@ export interface IconButtonProps extends ButtonProps {
      */
     isLoading?: boolean;
     /**
-     * 	Handler to be called when the button is clicked.
+     * Handler to be called when the button is clicked.
      */
     onClick?: (e: PressEvent) => void;
     /**
-     *  The Slot of the button
+     * The Slot of the button
      */
     slot?: string;
+    /**
+     * Tooltip text to display on hover and focus
+     */
+    tooltipLabel?: string;
+    /**
+     * Tooltip placement relative to the button
+     */
+    tooltipPlacement?: 'top' | 'bottom' | 'left' | 'right';
 }
-export declare const IconButton: ({ styleType, emphasis, size, isLoading, iconProps, onClick, form, formAction, formEncType, formMethod, formNoValidate, formTarget, name, value, isDisabled, autoFocus, type, focusStyle, slot, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const IconButton: ({ styleType, styleVariant, emphasis, size, isLoading, iconProps, onClick, form, formAction, formEncType, formMethod, formNoValidate, formTarget, name, value, isDisabled, autoFocus, type, focusStyle, slot, tooltipLabel, tooltipPlacement, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default IconButton;

package/dist/components/IconButton/IconButton.js

@@ -5,6 +5,7 @@ import { Button } from "react-aria-components";
 import { focusStyleVariants } from "../../utils/focus/focusStyles.js";
 import { Icon } from "../Icon/Icon.js";
 import LoadingSpinner from "../LoadingSpinner/LoadingSpinner.js";
+import { Tooltip } from "../Tooltip/Tooltip.js";
 import '../../assets/IconButton.css';const iconButton$1 = "_iconButton_by3pb_1";
 const sm = "_sm_by3pb_24";
 const md = "_md_by3pb_30";
@@ -87,7 +88,8 @@ const iconButton = cva(styles.iconButton, {
 });
 const IconButton = ({
   //Button Props
-  styleType = "accent",
+  styleType,
+  styleVariant,
   emphasis = "primary",
   size = "md",
   isLoading = false,
@@ -108,6 +110,8 @@ const IconButton = ({
   type,
   focusStyle = "default",
   slot,
+  tooltipLabel = "",
+  tooltipPlacement = "top",
   ...props
 }) => {
   const buttonRef = useRef(null);
@@ -117,17 +121,22 @@ const IconButton = ({
       setButtonWidth(buttonRef.current.offsetWidth);
     }
   }, [isLoading, size]);
-  return /* @__PURE__ */ jsxs(Button, { className: `${iconButton({
+  const resolvedStyleVariant = styleVariant ?? styleType ?? "accent";
+  const buttonContent = /* @__PURE__ */ jsxs(Button, { className: `${iconButton({
     size,
-    [styleType]: emphasis
+    [resolvedStyleVariant]: emphasis
   })} ${focusStyleVariants({
     focusStyle
-  })}`, ref: buttonRef, onPress: onClick, form, formAction, formEncType, formMethod, formNoValidate, formTarget, name, value, isDisabled, autoFocus, type, "aria-label": isLoading ? "Loading Spinner" : "Icon", style: {
+  })}`, ref: buttonRef, onPress: onClick, form, formAction, formEncType, formMethod, formNoValidate, formTarget, name, value, isDisabled, autoFocus, type, "aria-label": tooltipLabel ? void 0 : isLoading ? "Loading Spinner" : "Icon", style: {
     width: isLoading && buttonWidth ? `${buttonWidth}px` : void 0
   }, slot, ...props, children: [
     isLoading && /* @__PURE__ */ jsx(LoadingSpinner, { size: "1x" }),
     !isLoading && /* @__PURE__ */ jsx(Icon, { ...iconProps })
   ] });
+  if (tooltipLabel) {
+    return /* @__PURE__ */ jsx(Tooltip, { label: tooltipLabel, placement: tooltipPlacement, isDisabled, children: buttonContent });
+  }
+  return buttonContent;
 };
 export {
   IconButton,

package/dist/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"IconButton.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Image/Image.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { BorderVariants } from '../../utils/border/border';
+import { BackgroundVariants } from '../../utils/backgroundColour/backgroundColour';
+declare const imageVariants: (props?: ({
+    fit?: "fill" | "none" | "contain" | "cover" | "scale-down" | "scaleDown" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface ImageProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, 'className' | 'style'>, Pick<BorderVariants, 'borderRadius'>, BackgroundVariants, VariantProps<typeof imageVariants> {
+    /** Image url that will be used as a fallback in case `src` prop is not set or image cannot be loaded */
+    fallbackSrc?: string;
+    /** Called when image fails to load */
+    onError?: (event: React.SyntheticEvent<HTMLImageElement, Event>) => void;
+    /** Called when image is loaded */
+    onLoad?: React.ReactEventHandler<HTMLImageElement>;
+    /** Polymorphism with children, the component will render the children instead of the image */
+    asChild?: boolean;
+    /** To support polymorphism with children */
+    children?: React.ReactNode;
+    /** Aspect ratio of the image */
+    aspectRatio?: number;
+}
+export declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
+export default Image;

package/dist/components/Image/Image.js

@@ -0,0 +1,130 @@
+import { jsx } from "react/jsx-runtime";
+import React, { useState, useRef, useEffect } from "react";
+import { c as cva } from "../../index-Bi3v_EjJ.js";
+import { borderVariants } from "../../utils/border/border.js";
+import { backgroundColorVariants } from "../../utils/backgroundColour/backgroundColour.js";
+import '../../assets/Image.css';const image = "_image_z82es_1";
+const fill = "_fill_z82es_10";
+const contain = "_contain_z82es_14";
+const cover = "_cover_z82es_18";
+const none = "_none_z82es_22";
+const scaleDown = "_scaleDown_z82es_26";
+const styles = {
+  image,
+  fill,
+  contain,
+  cover,
+  none,
+  scaleDown
+};
+const imageVariants = cva(styles.image, {
+  variants: {
+    fit: {
+      contain: styles.contain,
+      cover: styles.cover,
+      fill: styles.fill,
+      none: styles.none,
+      scaleDown: styles.scaleDown,
+      "scale-down": styles.scaleDown
+    }
+  }
+});
+const useImageLoaded = (onLoadProp) => {
+  const [loaded, setLoaded] = useState(false);
+  const ref = useRef(null);
+  const handleLoad = React.useCallback((event) => {
+    if (typeof onLoadProp === "function") {
+      onLoadProp(event);
+    }
+    setLoaded(true);
+  }, [onLoadProp]);
+  useEffect(() => {
+    if (ref.current && ref.current.complete) {
+      setLoaded(true);
+    }
+  });
+  return {
+    ref,
+    loaded,
+    handleLoad
+  };
+};
+const useMergedRef = (internalRef, forwardedRef) => {
+  return React.useMemo(() => {
+    if (!forwardedRef) return internalRef;
+    return (node) => {
+      if (typeof forwardedRef === "function") {
+        forwardedRef(node);
+      } else if (forwardedRef && "current" in forwardedRef) {
+        forwardedRef.current = node;
+      }
+      internalRef.current = node;
+    };
+  }, [internalRef, forwardedRef]);
+};
+const Image = React.forwardRef(({
+  src,
+  fallbackSrc,
+  onError: onErrorProp,
+  onLoad: onLoadProp,
+  asChild,
+  children,
+  borderRadius,
+  backgroundColour,
+  fit,
+  aspectRatio,
+  ...props
+}, forwardedRef) => {
+  const {
+    ref: internalRef,
+    loaded,
+    handleLoad
+  } = useImageLoaded(onLoadProp);
+  const ref = useMergedRef(internalRef, forwardedRef);
+  const [isError, setError] = useState(!src);
+  if (asChild && !children) {
+    console.error("Image component: Children required when asChild is true");
+  }
+  const handleError = React.useCallback((e) => {
+    if (fallbackSrc) {
+      setError(true);
+    }
+    if (typeof onErrorProp === "function") {
+      onErrorProp(e);
+    }
+  }, [fallbackSrc, onErrorProp]);
+  const imgProps = {
+    src: isError ? fallbackSrc : src,
+    className: `
+    ${borderVariants({
+      borderRadius
+    })}
+    ${backgroundColorVariants({
+      backgroundColour
+    })}
+    ${imageVariants({
+      fit
+    })}`,
+    onError: handleError,
+    onLoad: handleLoad,
+    ref,
+    "data-loaded": loaded,
+    style: {
+      aspectRatio
+    },
+    ...props
+  };
+  if (asChild && React.isValidElement(children)) {
+    return React.cloneElement(children, {
+      ...imgProps,
+      ...children.props
+    });
+  }
+  return /* @__PURE__ */ jsx("img", { ...imgProps });
+});
+Image.displayName = "Image";
+export {
+  Image,
+  Image as default
+};
+//# sourceMappingURL=Image.js.map

package/dist/components/Image/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -0,0 +1 @@
+export { default } from './Image';

package/dist/components/Image/index.js

@@ -0,0 +1,5 @@
+import { Image } from "./Image.js";
+export {
+  Image as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Image/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -1,69 +1,67 @@
 import { LinkProps as AriaLinkProps } from 'react-aria-components';
 import { IconProps } from '../Icon/Icon';
 export interface LinkProps extends AriaLinkProps {
+    /**
+     * The children of the component. A function may be provided to alter the children based on component state.
+     */
+    children?: React.ReactNode | string;
     /**
      * What the size of the Link is
      * @default 'md'
      */
     size?: 'xs' | 'sm' | 'md' | 'lg';
-    /**
-     * Whether the icon should be at the end of the Link
-     * @default true
-     */
-    iconEnd?: boolean;
-    /**
-     * The text to display in the Link
-     */
-    linkText?: string;
     /**
      * Whether the Link should be underlined
      * @default false
      */
     underline?: boolean;
     /**
-     * The URL the Link will navigate to
+     * Whether the link is disabled.
+     * @default false
      */
-    href?: string;
+    isDisabled?: boolean;
     /**
-     * The target attribute for the Link
-     * @default '_self'
+     * Whether an icon should display at the end of Link and icon properties
+     * @default { iconName: 'arrow-right' }
      */
-    target?: string;
+    iconEndProps?: IconProps | false;
     /**
-     * The relationship between the linked resource and the current page. See MDN.
+     * Whether an icon should display at the start of the Link and icon properties
      */
-    rel?: string;
+    iconStartProps?: IconProps;
     /**
-     * Causes the browser to download the linked URL. A string may be provided to suggest a file name. See MDN.
-     * @default false
+     * The URL the Link will navigate to
      */
-    download?: boolean | string;
+    href?: string;
     /**
-     * Whether the link is disabled.
-     * @default false
+     * The target attribute for the Link
+     * @default '_self'
      */
-    isDisabled?: boolean;
+    target?: string;
     /**
-     * Whether the element should receive focus on render.
-     * @default false
+     * The label for the external link
+     * @default "open in new tab"
      */
-    autoFocus?: boolean;
+    labelExternal?: string;
     /**
-     * A space-separated list of URLs to ping when the link is followed. See MDN.
+     * 	The focus style of the button
      */
-    ping?: string;
+    focusStyle?: 'default' | 'white';
     /**
-     * The children of the component. A function may be provided to alter the children based on component state.
+     * Whether an icon should display at the End of the Link
+     * @deprecated Use iconEndProps instead
      */
-    children?: React.ReactNode;
+    iconEnd?: boolean;
     /**
-     * 	The focus style of the button
+     * Whether an icon should display at the End of the Link
+     * @deprecated Use iconEndProps instead
      */
-    focusStyle?: 'default' | 'white';
+    iconProps?: IconProps;
     /**
-     * Whether an icon should display at the start of the TextField
+     * The text to display in the Link
+     * @deprecated Use children instead
      */
-    iconProps?: IconProps;
+    linkText?: string;
 }
-declare const Link: ({ size, iconEnd, underline, iconProps, linkText, href, target, rel, download, isDisabled, autoFocus, ping, focusStyle, ...props }: LinkProps) => import("react/jsx-runtime").JSX.Element;
+declare const Link: ({ size, underline, iconStartProps, iconEndProps, iconProps, linkText, href, target, focusStyle, children, labelExternal, ...props }: LinkProps) => import("react/jsx-runtime").JSX.Element;
 export default Link;