@amsterdam/design-system-react 0.15.0 → 1.0.0

package/dist/Pagination/Pagination.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 { Pagination } from './Pagination';
@@ -16,7 +20,7 @@ describe('Pagination', () => {
         const component = screen.getByRole('navigation', { name: 'Paginering' });
         expect(component).toHaveClass('ams-pagination');
     });
-    it('can have a additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(Pagination, { className: "extra", linkTemplate: linkTemplate, totalPages: 10 }));
         const component = screen.getByRole('navigation', { name: 'Paginering' });
         expect(component).toHaveClass('ams-pagination extra');

package/dist/Pagination/Spacer.d.ts

@@ -1 +1,5 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export declare const Spacer: () => import("react/jsx-runtime").JSX.Element;

package/dist/Pagination/Spacer.js

@@ -1,2 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export const Spacer = () => _jsx("li", { "aria-hidden": true, children: '\u2026' });

package/dist/Pagination/getRange.d.ts

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 /**
  * This returns an array of the range, including spacers
  *

package/dist/Pagination/getRange.js

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 /**
  * This returns an array of the range, including spacers
  *

package/dist/Pagination/index.d.ts

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

package/dist/Pagination/index.js

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

package/dist/Paragraph/Paragraph.d.ts

@@ -1,6 +1,5 @@
 /**
  * @license EUPL-1.2+
- * Copyright (c) 2021 Robbert Broersma
  * Copyright Gemeente Amsterdam
  */
 import type { HTMLAttributes, PropsWithChildren } from 'react';
@@ -10,6 +9,9 @@ export type ParagraphProps = {
     /** The size of the text. */
     size?: 'small' | 'large';
 } & PropsWithChildren<HTMLAttributes<HTMLParagraphElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-text-paragraph--docs Paragraph docs at Amsterdam Design System}
+ */
 export declare const Paragraph: import("react").ForwardRefExoticComponent<{
     /** Changes the text colour for readability on a dark background. */
     color?: "inverse";

package/dist/Paragraph/Paragraph.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
@@ -6,5 +10,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-text-paragraph--docs Paragraph docs at Amsterdam Design System}
+ */
 export const Paragraph = forwardRef(({ children, className, color, size, ...restProps }, ref) => (_jsx("p", { className: clsx('ams-paragraph', color && `ams-paragraph--${color}`, size && `ams-paragraph--${size}`, className), ref: ref, ...restProps, children: children })));
 Paragraph.displayName = 'Paragraph';

package/dist/Paragraph/Paragraph.test.d.ts

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

package/dist/Paragraph/Paragraph.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Paragraph } from './Paragraph';
@@ -43,7 +47,7 @@ describe('Paragraph', () => {
         const paragraph = screen.getByText('Paragraph');
         expect(paragraph).toHaveClass('ams-paragraph--inverse');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         const { container } = render(_jsx(Paragraph, { className: "intro" }));
         const paragraph = container.querySelector(':only-child');
         expect(paragraph).toHaveClass('intro');

package/dist/Paragraph/index.d.ts

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

package/dist/Paragraph/index.js

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

package/dist/PasswordInput/PasswordInput.d.ts

@@ -7,6 +7,9 @@ export type PasswordInputProps = {
     /** Whether the value fails a validation rule. */
     invalid?: boolean;
 } & Omit<InputHTMLAttributes<HTMLInputElement>, 'aria-invalid' | 'autoCapitalize' | 'autoCorrect' | 'spellCheck' | 'type'>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-password-input--docs Password Input docs at Amsterdam Design System}
+ */
 export declare const PasswordInput: import("react").ForwardRefExoticComponent<{
     /** Whether the value fails a validation rule. */
     invalid?: boolean;

package/dist/PasswordInput/PasswordInput.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-password-input--docs Password Input docs at Amsterdam Design System}
+ */
 export const PasswordInput = forwardRef(({ className, dir, invalid, ...restProps }, ref) => (_jsx("input", { ...restProps, "aria-invalid": invalid || undefined, autoCorrect: "off", className: clsx('ams-password-input', className), dir: dir ?? 'auto', ref: ref, spellCheck: "false", type: "password" })));
 PasswordInput.displayName = 'PasswordInput';

package/dist/PasswordInput/PasswordInput.test.d.ts

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

package/dist/PasswordInput/PasswordInput.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 userEvent from '@testing-library/user-event';
 import { createRef, useState } from 'react';
@@ -17,7 +21,7 @@ describe('Password input', () => {
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass('ams-password-input');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         const { container } = render(_jsx(PasswordInput, { className: "extra" }));
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass('ams-password-input extra');

package/dist/PasswordInput/index.d.ts

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

package/dist/PasswordInput/index.js

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

package/dist/Radio/Radio.d.ts

@@ -9,6 +9,9 @@ export type RadioProps = {
     /** Whether the value fails a validation rule. */
     invalid?: boolean;
 } & PropsWithChildren<Omit<InputHTMLAttributes<HTMLInputElement>, 'aria-invalid' | 'type'>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-radio--docs Radio docs at Amsterdam Design System}
+ */
 export declare const Radio: import("react").ForwardRefExoticComponent<{
     /** An icon to display instead of the default icon. */
     icon?: ReactNode;

package/dist/Radio/Radio.js

@@ -6,6 +6,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
 import { forwardRef, useId } from 'react';
 import RadioIcon from './RadioIcon';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-radio--docs Radio docs at Amsterdam Design System}
+ */
 export const Radio = forwardRef(({ children, className, icon, invalid, ...restProps }, ref) => {
     const id = useId();
     return (

package/dist/Radio/Radio.test.d.ts

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

package/dist/Radio/Radio.test.js

@@ -1,5 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { FavouriteIcon } from '@amsterdam/design-system-react-icons';
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+import { StarIcon } from '@amsterdam/design-system-react-icons';
 import { render, screen } from '@testing-library/react';
 import { createRef } from 'react';
 import { Radio } from './Radio';
@@ -30,7 +34,7 @@ describe('Radio', () => {
         expect(circle).toBeInTheDocument();
         expect(indicator).toBeInTheDocument();
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         const { container } = render(_jsx(Radio, { className: "extra" }));
         const wrapper = container.querySelector(':only-child');
         expect(wrapper).toHaveClass('ams-radio extra');
@@ -108,7 +112,7 @@ describe('Radio', () => {
         expect(handleChange).toHaveBeenCalled();
     });
     it('shows a custom icon', () => {
-        const { container } = render(_jsx(Radio, { icon: _jsx(FavouriteIcon, { className: "test-class" }) }));
+        const { container } = render(_jsx(Radio, { icon: _jsx(StarIcon, { className: "test-class" }) }));
         const icon = container.querySelector('svg');
         expect(icon).toHaveClass('test-class');
     });

package/dist/Radio/RadioIcon.d.ts

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 import type { SVGProps } from 'react';
 declare const SvgRadio: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
 export default SvgRadio;

package/dist/Radio/RadioIcon.js

@@ -1,3 +1,3 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const SvgRadio = (props) => (_jsxs("svg", { "aria-hidden": "true", focusable: "false", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props, children: [_jsx("circle", { className: "ams-radio__circle", cx: 12, cy: 12, r: 10 }), _jsx("circle", { className: "ams-radio__hover-indicator", cx: 12, cy: 12, r: 9.5 }), _jsx("circle", { className: "ams-radio__checked-indicator", cx: 12, cy: 12, r: 6 })] }));
+const SvgRadio = (props) => (_jsxs("svg", { "aria-hidden": "true", focusable: "false", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props, children: [_jsx("circle", { className: "ams-radio__circle", cx: 12, cy: 12, fill: "none", r: 10, stroke: "black", strokeWidth: "2px" }), _jsx("circle", { className: "ams-radio__hover-indicator", cx: 12, cy: 12, fill: "none", r: 9.5, stroke: "black", strokeWidth: "3px" }), _jsx("circle", { className: "ams-radio__checked-indicator", cx: 12, cy: 12, r: 6 })] }));
 export default SvgRadio;

package/dist/Radio/index.d.ts

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

package/dist/Radio/index.js

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

package/dist/Row/Row.d.ts

@@ -4,9 +4,10 @@
  */
 import type { HTMLAttributes, PropsWithChildren } from 'react';
 import type { CrossAlign, MainAlign } from '../common/types';
-export declare const rowGaps: readonly ["none", "x-small", "small", "large", "x-large"];
-type RowGap = (typeof rowGaps)[number];
-type RowTag = 'article' | 'div' | 'section';
+export declare const rowTags: readonly ["article", "div", "section"];
+type RowTag = (typeof rowTags)[number];
+export declare const rowGapSizes: readonly ["none", "x-small", "small", "large", "x-large"];
+type RowGap = (typeof rowGapSizes)[number];
 export type RowProps = {
     /**
      * The horizontal alignment of the items in the row.
@@ -34,6 +35,9 @@ export type RowProps = {
      */
     wrap?: boolean;
 } & PropsWithChildren<HTMLAttributes<HTMLElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-layout-row--docs Row docs at Amsterdam Design System}
+ */
 export declare const Row: import("react").ForwardRefExoticComponent<{
     /**
      * The horizontal alignment of the items in the row.

package/dist/Row/Row.js

@@ -5,6 +5,10 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import clsx from 'clsx';
 import { forwardRef } from 'react';
-export const rowGaps = ['none', 'x-small', 'small', 'large', 'x-large'];
+export const rowTags = ['article', 'div', 'section'];
+export const rowGapSizes = ['none', 'x-small', 'small', 'large', 'x-large'];
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-layout-row--docs Row docs at Amsterdam Design System}
+ */
 export const Row = forwardRef(({ align, alignVertical, as: Tag = 'div', children, className, gap, wrap, ...restProps }, ref) => (_jsx(Tag, { ...restProps, className: clsx('ams-row', align && `ams-row--align-${align}`, alignVertical && `ams-row--align-vertical-${alignVertical}`, gap && `ams-row--gap-${gap}`, wrap && 'ams-row--wrap', className), ref: ref, children: children })));
 Row.displayName = 'Row';

package/dist/Row/Row.test.d.ts

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

package/dist/Row/Row.test.js

@@ -1,7 +1,12 @@
 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 { Row, rowGaps } from './Row';
+import { Row, rowGapSizes, rowTags } from './Row';
+import { ariaRoleForTag } from '../common/accessibility';
 import { crossAlignOptions, mainAlignOptions } from '../common/types';
 import '@testing-library/jest-dom';
 describe('Row', () => {
@@ -16,12 +21,12 @@ describe('Row', () => {
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass('ams-row');
     });
-    rowGaps.map((gap) => it(`renders with ‘${gap}’ gap`, () => {
+    rowGapSizes.map((gap) => it(`renders with ‘${gap}’ gap`, () => {
         const { container } = render(_jsx(Row, { gap: gap }));
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass(`ams-row--gap-${gap}`);
     }));
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         const { container } = render(_jsx(Row, { className: "extra" }));
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass('ams-row extra');
@@ -31,15 +36,12 @@ describe('Row', () => {
         const component = container.querySelector(':only-child');
         expect(component).toHaveClass('ams-row--wrap');
     });
-    it('renders with an article tag', () => {
-        render(_jsx(Row, { as: "article" }));
-        const component = screen.getByRole('article');
-        expect(component).toBeInTheDocument();
-    });
-    it('renders with a section tag', () => {
-        const { container } = render(_jsx(Row, { as: "section" }));
-        const component = container.querySelector('section');
-        expect(component).toBeInTheDocument();
+    rowTags.forEach((tag) => {
+        it(`renders with a custom ${tag} tag`, () => {
+            const { container } = render(_jsx(Row, { "aria-label": tag === 'section' ? 'Accessible name' : undefined, as: tag }));
+            const component = tag === 'div' ? container.querySelector(tag) : screen.getByRole(ariaRoleForTag[tag]);
+            expect(component).toBeInTheDocument();
+        });
     });
     it('supports ForwardRef in React', () => {
         const ref = createRef();

package/dist/Row/index.d.ts

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

package/dist/Row/index.js

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

package/dist/SearchField/SearchField.d.ts

@@ -4,6 +4,9 @@
  */
 import type { HTMLAttributes, PropsWithChildren } from 'react';
 export type SearchFieldProps = PropsWithChildren<HTMLAttributes<HTMLFormElement>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-search-field--docs Search Field docs at Amsterdam Design System}
+ */
 export declare const SearchField: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLFormElement> & {
     children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLFormElement>> & {
@@ -58,6 +61,8 @@ export declare const SearchField: import("react").ForwardRefExoticComponent<HTML
         unselectable?: "on" | "off" | undefined | undefined;
         inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
         is?: string | undefined | undefined;
+        exportparts?: string | undefined | undefined;
+        part?: string | undefined | undefined;
         "aria-activedescendant"?: string | undefined | undefined;
         "aria-atomic"?: (boolean | "true" | "false") | undefined;
         "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;

package/dist/SearchField/SearchField.js

@@ -11,4 +11,7 @@ const SearchFieldRoot = forwardRef(({ children, className, ...restProps }, ref)
     return (_jsx("form", { role: "search", ...restProps, className: clsx('ams-search-field', className), ref: ref, children: children }));
 });
 SearchFieldRoot.displayName = 'SearchField';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-search-field--docs Search Field docs at Amsterdam Design System}
+ */
 export const SearchField = Object.assign(SearchFieldRoot, { Button: SearchFieldButton, Input: SearchFieldInput });

package/dist/SearchField/SearchField.test.d.ts

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

package/dist/SearchField/SearchField.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 { SearchField } from './SearchField';
@@ -32,11 +36,10 @@ describe('Search field', () => {
         const component = screen.getByRole('search');
         expect(component).toHaveClass('ams-search-field');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(SearchField, { className: "extra" }));
         const component = screen.getByRole('search');
-        expect(component).toHaveClass('extra');
-        expect(component).toHaveClass('ams-search-field');
+        expect(component).toHaveClass('ams-search-field extra');
     });
     it('supports ForwardRef in React', () => {
         const ref = createRef();

package/dist/SearchField/SearchFieldInput.test.d.ts

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

package/dist/SearchField/SearchFieldInput.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 userEvent from '@testing-library/user-event';
 import { createRef, useState } from 'react';
@@ -16,11 +20,10 @@ describe('Search field input', () => {
         const component = screen.getByRole('searchbox', { name: 'Zoeken' });
         expect(component).toHaveClass('ams-search-field__input');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(SearchFieldInput, { className: "extra" }));
         const component = screen.getByRole('searchbox', { name: 'Zoeken' });
-        expect(component).toHaveClass('extra');
-        expect(component).toHaveClass('ams-search-field__input');
+        expect(component).toHaveClass('ams-search-field__input extra');
     });
     it('supports a custom label', () => {
         render(_jsx(SearchFieldInput, { label: "Test label" }));

package/dist/SearchField/index.d.ts

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

package/dist/SearchField/index.js

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

package/dist/Select/Select.d.ts

@@ -7,6 +7,9 @@ export type SelectProps = {
     /** Whether the value fails a validation rule. */
     invalid?: boolean;
 } & PropsWithChildren<Omit<SelectHTMLAttributes<HTMLSelectElement>, 'aria-invalid'>>;
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-select--docs Select docs at Amsterdam Design System}
+ */
 export declare const Select: import("react").ForwardRefExoticComponent<{
     /** Whether the value fails a validation rule. */
     invalid?: boolean;

package/dist/Select/Select.js

@@ -9,4 +9,7 @@ import { SelectOption } from './SelectOption';
 import { SelectOptionGroup } from './SelectOptionGroup';
 const SelectRoot = forwardRef(({ children, className, invalid, ...restProps }, ref) => (_jsx("select", { ...restProps, "aria-invalid": invalid || undefined, className: clsx('ams-select', className), ref: ref, children: children })));
 SelectRoot.displayName = 'Select';
+/**
+ * @see {@link https://designsystem.amsterdam/?path=/docs/components-forms-select--docs Select docs at Amsterdam Design System}
+ */
 export const Select = Object.assign(SelectRoot, { Group: SelectOptionGroup, Option: SelectOption });

package/dist/Select/Select.test.d.ts

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

package/dist/Select/Select.test.js

@@ -1,4 +1,8 @@
 import { jsx as _jsx, 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 { Select } from './Select';
@@ -15,7 +19,7 @@ describe('Select', () => {
         const component = screen.getByRole('combobox');
         expect(component).toHaveClass('ams-select');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(Select, { className: "extra" }));
         const component = screen.getByRole('combobox');
         expect(component).toHaveClass('ams-select extra');

package/dist/Select/SelectOption.test.d.ts

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

package/dist/Select/SelectOption.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 { Select } from './Select';
@@ -22,7 +26,7 @@ describe('Select option', () => {
         const component = screen.getByRole('option');
         expect(component).toHaveClass('ams-select__option');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(Select.Option, { className: "extra" }));
         const component = screen.getByRole('option');
         expect(component).toHaveClass('ams-select__option extra');

package/dist/Select/SelectOptionGroup.test.d.ts

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

package/dist/Select/SelectOptionGroup.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 { Select } from './Select';
@@ -22,7 +26,7 @@ describe('Select option group', () => {
         const component = screen.getByRole('group');
         expect(component).toHaveClass('ams-select__group');
     });
-    it('renders an additional class name', () => {
+    it('renders an extra class name', () => {
         render(_jsx(Select.Group, { className: "extra" }));
         const component = screen.getByRole('group');
         expect(component).toHaveClass('ams-select__group extra');

package/dist/Select/index.d.ts

@@ -1,3 +1,7 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
 export { Select } from './Select';
 export type { SelectProps } from './Select';
 export type { SelectOptionProps } from './SelectOption';

package/dist/Select/index.js

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