@amsterdam/design-system-react 0.16.0 → 1.0.0

package/dist/FieldSet/FieldSet.d.ts

@@ -10,6 +10,9 @@ export type FieldSetProps = PropsWithChildren<HTMLAttributes<HTMLFieldSetElement
     /** The text for the caption. */
     legend: string;
 } & HintProps;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-field-set--docs Field Set docs at Amsterdam Design System}
+ */
 export declare const FieldSet: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLFieldSetElement> & {
     children?: import("react").ReactNode | undefined;
 } & {

package/dist/FieldSet/FieldSet.js

@@ -6,6 +6,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { Hint } from '../Hint';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-field-set--docs Field Set docs at Amsterdam Design System}
+ */
 export const FieldSet = forwardRef(({ children, className, hint, invalid, legend, optional, ...restProps }, ref) => {
     return (_jsxs("fieldset", { ...restProps, className: clsx('ams-field-set', invalid && 'ams-field-set--invalid', className), ref: ref, children: [_jsxs("legend", { className: "ams-field-set__legend", children: [legend, " ", _jsx(Hint, { hint: hint, optional: optional })] }), children] }));
 });

package/dist/FieldSet/FieldSet.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/FieldSet/FieldSet.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { FieldSet } from './FieldSet';

package/dist/FieldSet/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FieldSet } from './FieldSet';
 export type { FieldSetProps } from './FieldSet';

package/dist/FieldSet/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FieldSet } from './FieldSet';

package/dist/Figure/Figure.d.ts

@@ -4,6 +4,9 @@
  */
 import type { HTMLAttributes, PropsWithChildren } from 'react';
 export type FigureProps = PropsWithChildren<HTMLAttributes<HTMLElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-media-figure--docs Figure docs at Amsterdam Design System}
+ */
 export declare const Figure: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
     children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>> & {

package/dist/Figure/Figure.js

@@ -8,4 +8,7 @@ import { forwardRef } from 'react';
 import { FigureCaption } from './FigureCaption';
 const FigureRoot = forwardRef(({ children, className, ...restProps }, ref) => (_jsx("figure", { ...restProps, className: clsx('ams-figure', className), ref: ref, children: children })));
 FigureRoot.displayName = 'Figure';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-media-figure--docs Figure docs at Amsterdam Design System}
+ */
 export const Figure = Object.assign(FigureRoot, { Caption: FigureCaption });

package/dist/Figure/Figure.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Figure/Figure.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Figure } from './Figure';

package/dist/Figure/FigureCaption.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Figure/FigureCaption.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render } from '@testing-library/react';
 import { createRef } from 'react';
 import { FigureCaption } from './FigureCaption';

package/dist/Figure/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Figure } from './Figure';
 export type { FigureProps } from './Figure';

package/dist/Figure/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Figure } from './Figure';

package/dist/FileInput/FileInput.d.ts

@@ -4,4 +4,7 @@
  */
 import type { InputHTMLAttributes } from 'react';
 export type FileInputProps = InputHTMLAttributes<HTMLInputElement>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-file-input--docs File Input docs at Amsterdam Design System}
+ */
 export declare const FileInput: import("react").ForwardRefExoticComponent<FileInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/FileInput/FileInput.js

@@ -5,5 +5,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import clsx from 'clsx';
 import { forwardRef } from 'react';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-file-input--docs File Input docs at Amsterdam Design System}
+ */
 export const FileInput = forwardRef(({ className, ...restProps }, ref) => (_jsx("input", { ...restProps, className: clsx('ams-file-input', className), ref: ref, type: "file" })));
 FileInput.displayName = 'FileInput';

package/dist/FileInput/FileInput.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/FileInput/FileInput.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render } from '@testing-library/react';
 import { createRef } from 'react';
 import { FileInput } from './FileInput';

package/dist/FileInput/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FileInput } from './FileInput';
 export type { FileInputProps } from './FileInput';

package/dist/FileInput/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FileInput } from './FileInput';

package/dist/FileList/FileList.d.ts

@@ -7,6 +7,9 @@ export type FileListProps = {} & PropsWithChildren<HTMLAttributes<HTMLUListEleme
 export declare const FileListRoot: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLUListElement> & {
     children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLOListElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-file-list--docs File List docs at Amsterdam Design System}
+ */
 export declare const FileList: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLUListElement> & {
     children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLOListElement>> & {

package/dist/FileList/FileList.js

@@ -8,6 +8,9 @@ import { forwardRef } from 'react';
 import { FileListItem } from './FileListItem';
 export const FileListRoot = forwardRef(({ children, className, ...restProps }, ref) => (_jsx("ul", { ...restProps, className: clsx('ams-file-list', className), ref: ref, children: children })));
 FileListRoot.displayName = 'FileList';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-file-list--docs File List docs at Amsterdam Design System}
+ */
 export const FileList = Object.assign(FileListRoot, {
     Item: FileListItem,
 });

package/dist/FileList/FileList.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/FileList/FileList.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { FileList } from './FileList';

package/dist/FileList/FileListItem.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/FileList/FileListItem.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { fireEvent, render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import '@testing-library/jest-dom';

package/dist/FileList/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FileList } from './FileList';
 export type { FileListProps } from './FileList';

package/dist/FileList/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { FileList } from './FileList';

package/dist/Grid/Grid.d.ts

@@ -34,6 +34,9 @@ export type GridProps = {
     /** The amount of space between rows. */
     gapVertical?: GridGap;
 } & (GridPaddingVerticalProp | GridPaddingTopAndBottomProps) & PropsWithChildren<HTMLAttributes<HTMLDivElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-layout-grid--docs Grid docs at Amsterdam Design System}
+ */
 export declare const Grid: import("react").ForwardRefExoticComponent<GridProps & import("react").RefAttributes<any>> & {
     Cell: import("react").ForwardRefExoticComponent<import("./GridCell").GridCellProps & import("react").RefAttributes<unknown>>;
 };

package/dist/Grid/Grid.js

@@ -12,4 +12,7 @@ export const gridPaddings = ['large', 'x-large', '2x-large'];
 export const gridTags = ['article', 'aside', 'div', 'footer', 'header', 'main', 'nav', 'section'];
 const GridRoot = forwardRef(({ as: Tag = 'div', children, className, gapVertical, paddingBottom, paddingTop, paddingVertical, ...restProps }, ref) => (_jsx(Tag, { ...restProps, className: clsx('ams-grid', gapVertical && `ams-grid--gap-vertical--${gapVertical}`, paddingClasses('grid', paddingBottom, paddingTop, paddingVertical), className), ref: ref, children: children })));
 GridRoot.displayName = 'Grid';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-layout-grid--docs Grid docs at Amsterdam Design System}
+ */
 export const Grid = Object.assign(GridRoot, { Cell: GridCell });

package/dist/Grid/Grid.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Grid/Grid.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Grid, gridGaps, gridPaddings, gridTags } from './Grid';

package/dist/Grid/GridCell.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Grid/GridCell.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Grid } from './Grid';

package/dist/Grid/index.d.ts

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Grid } from './Grid';
 export type { GridColumnNumber, GridColumnNumbers, GridProps } from './Grid';
 export type { GridCellProps } from './GridCell';

package/dist/Grid/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Grid } from './Grid';

package/dist/Grid/paddingClasses.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import type { GridPadding } from './Grid';
 export declare const paddingClasses: (componentName: string, paddingBottom?: GridPadding, paddingTop?: GridPadding, paddingVertical?: GridPadding) => string[];

package/dist/Grid/paddingClasses.js

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export const paddingClasses = (componentName, paddingBottom, paddingTop, paddingVertical) => {
     const classes = [];
     if (paddingVertical) {

package/dist/Heading/Heading.d.ts

@@ -1,6 +1,5 @@
 /**
  * @license EUPL-1.2+
- * Copyright (c) 2021 Robbert Broersma
  * Copyright Gemeente Amsterdam
  */
 import type { HTMLAttributes, PropsWithChildren } from 'react';
@@ -12,6 +11,9 @@ export type HeadingProps = {
     /** Uses larger or smaller text without changing its position in the heading hierarchy. */
     size?: 'level-1' | 'level-2' | 'level-3' | 'level-4' | 'level-5' | 'level-6';
 } & PropsWithChildren<HTMLAttributes<HTMLHeadingElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-text-heading--docs Heading docs at Amsterdam Design System}
+ */
 export declare const Heading: import("react").ForwardRefExoticComponent<{
     /** Changes the text colour for readability on a dark background. */
     color?: "inverse";

package/dist/Heading/Heading.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 /**
  * @license EUPL-1.2+
  * Copyright (c) 2021 Robbert Broersma
@@ -7,6 +11,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { getHeadingTag } from './getHeadingTag';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-text-heading--docs Heading docs at Amsterdam Design System}
+ */
 export const Heading = forwardRef(({ children, className, color, level, size, ...restProps }, ref) => {
     const Tag = getHeadingTag(level);
     const visualLevel = size ? size.slice(-1) : level;

package/dist/Heading/Heading.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Heading/Heading.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Heading } from './Heading';

package/dist/Heading/getHeadingTag.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import type { HeadingProps } from './Heading';
 export declare function getHeadingTag(level: HeadingProps['level'] | null): "h2" | "h3" | "h4" | "h1";

package/dist/Heading/getHeadingTag.js

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export function getHeadingTag(level) {
     switch (level) {
         case 2:

package/dist/Heading/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Heading } from './Heading';
 export type { HeadingProps } from './Heading';

package/dist/Heading/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Heading } from './Heading';

package/dist/Hint/Hint.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Hint/Hint.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render } from '@testing-library/react';
 import { createRef } from 'react';
 import { Hint } from '.';

package/dist/Hint/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Hint } from './Hint';
 export type { HintProps } from './Hint';

package/dist/Hint/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Hint } from './Hint';

package/dist/Icon/Icon.d.ts

@@ -1,7 +1,5 @@
 /**
  * @license EUPL-1.2+
- * Copyright (c) 2021 Gemeente Utrecht
- * Copyright (c) 2021 Robbert Broersma
  * Copyright Gemeente Amsterdam
  */
 import type { HTMLAttributes, ReactNode } from 'react';
@@ -17,6 +15,10 @@ export type IconProps = {
     /** The component rendering the icon’s markup. */
     svg: Function | ReactNode;
 } & HTMLAttributes<HTMLSpanElement>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-media-icon--docs Icon docs at Amsterdam Design System}
+ * @see {@link https://designsystem.amsterdam/?path=/docs/brand-assets-icons--docs Icons overview at Amsterdam Design System}
+ */
 export declare const Icon: import("react").ForwardRefExoticComponent<{
     /** Changes the icon colour for readability on a dark background. */
     color?: "inverse";

package/dist/Icon/Icon.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 /**
  * @license EUPL-1.2+
  * Copyright (c) 2021 Gemeente Utrecht
@@ -8,5 +12,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 export const iconSizes = ['small', 'large', 'heading-3', 'heading-4', 'heading-5', 'heading-6'];
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-media-icon--docs Icon docs at Amsterdam Design System}
+ * @see {@link https://designsystem.amsterdam/?path=/docs/brand-assets-icons--docs Icons overview at Amsterdam Design System}
+ */
 export const Icon = forwardRef(({ className, color, size, square, svg, ...restProps }, ref) => (_jsx("span", { className: clsx('ams-icon', color && `ams-icon--${color}`, size && `ams-icon--${size}`, square && 'ams-icon--square', className), ref: ref, ...restProps, children: typeof svg === 'function' ? svg() : svg })));
 Icon.displayName = 'Icon';

package/dist/Icon/Icon.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/Icon/Icon.test.js

@@ -1,50 +1,54 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { AlertIcon } from '@amsterdam/design-system-react-icons';
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+import { WarningIcon } from '@amsterdam/design-system-react-icons';
 import { render } from '@testing-library/react';
 import { createRef } from 'react';
 import { Icon, iconSizes } from './Icon';
 import '@testing-library/jest-dom';
 describe('Icon', () => {
     it('renders a span element', () => {
-        const { container } = render(_jsx(Icon, { svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { svg: WarningIcon }));
         const icon = container.querySelector('span:only-child');
         expect(icon).toBeInTheDocument();
     });
     it('renders a design system BEM class name', () => {
-        const { container } = render(_jsx(Icon, { svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { svg: WarningIcon }));
         const icon = container.querySelector(':only-child');
         expect(icon).toHaveClass('ams-icon');
     });
     it('renders an svg child', () => {
-        const { container } = render(_jsx(Icon, { svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { svg: WarningIcon }));
         const svg = container.querySelector(':only-child svg');
         expect(svg).toBeInTheDocument();
     });
     iconSizes.forEach((size) => {
         it(`renders the correct class name for a ‘${size}’ icon`, () => {
-            const { container } = render(_jsx(Icon, { size: size, svg: AlertIcon }));
+            const { container } = render(_jsx(Icon, { size: size, svg: WarningIcon }));
             const icon = container.querySelector(':only-child');
             expect(icon).toHaveClass(`ams-icon--${size}`);
         });
     });
     it('renders the right square class', () => {
-        const { container } = render(_jsx(Icon, { square: true, svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { square: true, svg: WarningIcon }));
         const icon = container.querySelector('span:only-child');
         expect(icon).toHaveClass('ams-icon--square');
     });
     it('renders the class name for inverse color', () => {
-        const { container } = render(_jsx(Icon, { color: "inverse", svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { color: "inverse", svg: WarningIcon }));
         const icon = container.querySelector('span:only-child');
         expect(icon).toHaveClass('ams-icon--inverse');
     });
     it('renders an extra class name', () => {
-        const { container } = render(_jsx(Icon, { className: "extra", svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { className: "extra", svg: WarningIcon }));
         const icon = container.querySelector(':only-child');
         expect(icon).toHaveClass('ams-icon extra');
     });
     it('supports ForwardRef in React', () => {
         const ref = createRef();
-        const { container } = render(_jsx(Icon, { ref: ref, svg: AlertIcon }));
+        const { container } = render(_jsx(Icon, { ref: ref, svg: WarningIcon }));
         const icon = container.querySelector(':only-child');
         expect(ref.current).toBe(icon);
     });

package/dist/Icon/index.d.ts

@@ -1,2 +1,6 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Icon } from './Icon';
 export type { IconProps } from './Icon';

package/dist/Icon/index.js

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Icon } from './Icon';

package/dist/IconButton/IconButton.d.ts

@@ -9,17 +9,20 @@ export type IconButtonProps = {
     color?: 'contrast' | 'inverse';
     /** The accessible text for the button. Will be announced by screen readers. Should describe the button’s action. */
     label: string;
-    /** The size of the icon. */
+    /** The size of the icon. Match it to the text that the Icon Buttons aligns with. */
     size?: IconProps['size'];
     /** The component rendering the icon’s markup. */
     svg?: IconProps['svg'];
 } & ButtonHTMLAttributes<HTMLButtonElement>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-buttons-icon-button--docs Icon Button docs at Amsterdam Design System}
+ */
 export declare const IconButton: import("react").ForwardRefExoticComponent<{
     /** Changes the text colour for readability on a light or dark background. */
     color?: "contrast" | "inverse";
     /** The accessible text for the button. Will be announced by screen readers. Should describe the button’s action. */
     label: string;
-    /** The size of the icon. */
+    /** The size of the icon. Match it to the text that the Icon Buttons aligns with. */
     size?: IconProps["size"];
     /** The component rendering the icon’s markup. */
     svg?: IconProps["svg"];

package/dist/IconButton/IconButton.js

@@ -7,5 +7,8 @@ import { CloseIcon } from '@amsterdam/design-system-react-icons';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
 import { Icon } from '../Icon';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-buttons-icon-button--docs Icon Button docs at Amsterdam Design System}
+ */
 export const IconButton = forwardRef(({ className, color, label, size, svg = CloseIcon, type, ...restProps }, ref) => (_jsxs("button", { ...restProps, className: clsx('ams-icon-button', color && `ams-icon-button--${color}`, className), ref: ref, type: type || 'button', children: [_jsx("span", { className: "ams-visually-hidden", children: label }), _jsx(Icon, { size: size, square: true, svg: svg })] })));
 IconButton.displayName = 'IconButton';

package/dist/IconButton/IconButton.test.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import '@testing-library/jest-dom';

package/dist/IconButton/IconButton.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { IconButton } from './IconButton';