@amsterdam/design-system-react 2.1.0 → 2.2.0

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.1.0",
+  "version": "2.2.0",
   "author": "Design System Team, City of Amsterdam <designsystem@amsterdam.nl>",
   "description": "All React components from the Amsterdam Design System. Use it to compose pages in your website or application.",
   "homepage": "https://designsystem.amsterdam",
@@ -57,20 +57,20 @@
     "postcss": "8.5.6",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "rollup": "4.52.5",
+    "rollup": "4.53.2",
     "rollup-plugin-dts": "6.2.3",
     "rollup-plugin-filesize": "10.0.0",
-    "rollup-plugin-node-externals": "8.1.1",
+    "rollup-plugin-node-externals": "8.1.2",
     "rollup-plugin-node-polyfills": "0.2.1",
     "rollup-plugin-peer-deps-external": "2.2.4",
     "rollup-plugin-typescript2": "0.36.0",
-    "sass": "1.93.2",
+    "sass": "1.94.0",
     "tslib": "2.8.1"
   },
   "peerDependencies": {
     "react": "16 - 19",
     "react-dom": "16 - 19",
-    "@amsterdam/design-system-css": "2.1.0"
+    "@amsterdam/design-system-css": "2.2.0"
   },
   "scripts": {
     "build": "tsc --project ./tsconfig.build.json && rollup -c",

package/dist/Accordion/Accordion.test.d.ts

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

package/dist/Accordion/Accordion.test.js

@@ -1,44 +0,0 @@
-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 userEvent from '@testing-library/user-event';
-import { createRef } from 'react';
-import { Accordion } from './Accordion';
-import '@testing-library/jest-dom';
-describe('Accordion', () => {
-    it('renders an accordion', () => {
-        const { container } = render(_jsx(Accordion, { headingLevel: 2 }));
-        const accordion = container.querySelector('.ams-accordion');
-        expect(accordion).toBeInTheDocument();
-        expect(accordion).toBeVisible();
-    });
-    it('renders an extra class name', () => {
-        const { container } = render(_jsx(Accordion, { className: "test", headingLevel: 2 }));
-        const accordion = container.querySelector('.ams-accordion');
-        expect(accordion).toHaveClass('test');
-    });
-    it('sets focus on Accordion buttons when using arrow keys', async () => {
-        const user = userEvent.setup();
-        render(_jsxs(Accordion, { headingLevel: 2, children: [_jsx(Accordion.Section, { label: "one" }), _jsx(Accordion.Section, { label: "two" }), _jsx(Accordion.Section, { label: "three" })] }));
-        const firstButton = screen.getByRole('button', { name: 'one' });
-        const thirdButton = screen.getByRole('button', { name: 'three' });
-        await user.click(firstButton);
-        expect(firstButton).toHaveFocus();
-        // Click the down arrow key twice
-        await user.keyboard('{ArrowDown}');
-        await user.keyboard('{ArrowDown}');
-        expect(thirdButton).toHaveFocus();
-        expect(firstButton).not.toHaveFocus();
-        await user.keyboard('{ArrowDown}');
-        expect(firstButton).toHaveFocus();
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        const { container } = render(_jsx(Accordion, { headingLevel: 2, ref: ref }));
-        const accordion = container.querySelector('.ams-accordion');
-        expect(ref.current).toBe(accordion);
-    });
-});

package/dist/Accordion/AccordionSection.test.d.ts

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

package/dist/Accordion/AccordionSection.test.js

@@ -1,100 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import { fireEvent, render, screen } from '@testing-library/react';
-import { createRef } from 'react';
-import { Accordion } from './Accordion';
-import '@testing-library/jest-dom';
-describe('Accordion section', () => {
-    const testLabel = 'Test title';
-    const testContent = 'Test content';
-    it('renders an accordion section', () => {
-        const { container } = render(_jsx(Accordion.Section, { label: testLabel, children: testContent }));
-        const accordionSection = container.querySelector('.ams-accordion__section');
-        expect(accordionSection).toBeInTheDocument();
-        expect(accordionSection).toBeVisible();
-    });
-    it('renders the accordion section BEM class names', () => {
-        const { container } = render(_jsx(Accordion.Section, { label: testLabel, children: testContent }));
-        const heading = screen.getByRole('heading', {
-            name: testLabel,
-        });
-        const button = screen.getByRole('button', {
-            name: testLabel,
-        });
-        const section = container.querySelector('.ams-accordion__panel');
-        expect(heading).toHaveClass('ams-heading ams-accordion__header');
-        expect(button).toHaveClass('ams-accordion__button');
-        expect(section).toBeInTheDocument();
-    });
-    it('adds and removes --expanded class when the button is clicked', () => {
-        const { getByText } = render(_jsx(Accordion.Section, { label: testLabel, children: testContent }));
-        const button = screen.getByRole('button', {
-            name: testLabel,
-        });
-        const sectionContent = getByText(testContent);
-        expect(sectionContent).not.toHaveClass('ams-accordion__panel--expanded');
-        fireEvent.click(button);
-        expect(sectionContent).toHaveClass('ams-accordion__panel--expanded');
-        fireEvent.click(button);
-        expect(sectionContent).not.toHaveClass('ams-accordion__panel--expanded');
-    });
-    it('adds --expanded class when expanded prop is true', () => {
-        const { getByText } = render(_jsx(Accordion.Section, { expanded: true, label: testLabel, children: testContent }));
-        const sectionContent = getByText(testContent);
-        expect(sectionContent).toHaveClass('ams-accordion__panel--expanded');
-    });
-    it('renders a section HTML tag by default', () => {
-        render(_jsx(Accordion, { headingLevel: 2, children: _jsx(Accordion.Section, { label: testLabel, children: testContent }) }));
-        const sectionQuery = screen.queryByRole('region');
-        expect(sectionQuery).toBeInTheDocument();
-    });
-    it('does not render a section HTML tag when the sectionAs is "div"', () => {
-        render(_jsx(Accordion, { headingLevel: 2, sectionAs: "div", children: _jsx(Accordion.Section, { label: testLabel, children: testContent }) }));
-        const sectionQuery = screen.queryByRole('region');
-        expect(sectionQuery).not.toBeInTheDocument();
-    });
-    it('renders an accessible heading', () => {
-        render(_jsx(Accordion, { headingLevel: 3, children: _jsx(Accordion.Section, { label: testLabel, children: testContent }) }));
-        const heading = screen.getByRole('heading', {
-            level: 3,
-            name: testLabel,
-        });
-        expect(heading).toBeInTheDocument();
-        expect(heading).toBeVisible();
-    });
-    it('renders the allowed levels correctly', () => {
-        render(_jsxs(_Fragment, { children: [_jsx(Accordion, { headingLevel: 2, children: _jsx(Accordion.Section, { label: "Level 2", children: testContent }) }), _jsx(Accordion, { headingLevel: 4, children: _jsx(Accordion.Section, { label: "Level 4", children: testContent }) })] }));
-        const headingLevel2 = screen.getByRole('heading', {
-            level: 2,
-            name: 'Level 2',
-        });
-        const headingLevel4 = screen.getByRole('heading', {
-            level: 4,
-            name: 'Level 4',
-        });
-        expect(headingLevel2).toBeInTheDocument();
-        expect(headingLevel4).toBeInTheDocument();
-    });
-    it('renders an icon', () => {
-        render(_jsx(Accordion.Section, { label: testLabel, children: testContent }));
-        const button = screen.getByRole('button', {
-            name: testLabel,
-        });
-        const icon = button ? button.querySelector('svg:only-child') : null;
-        expect(icon).toBeInTheDocument();
-    });
-    it('renders an extra class name', () => {
-        const { container } = render(_jsx(Accordion.Section, { className: "test", label: testLabel, children: testContent }));
-        const accordionSection = container.querySelector('.ams-accordion__section');
-        expect(accordionSection).toHaveClass('test');
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        const { container } = render(_jsx(Accordion.Section, { label: testLabel, ref: ref, children: testContent }));
-        const accordionSection = container.querySelector('.ams-accordion__section');
-        expect(ref.current).toBe(accordionSection);
-    });
-});

package/dist/ActionGroup/ActionGroup.test.d.ts

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

package/dist/ActionGroup/ActionGroup.test.js

@@ -1,33 +0,0 @@
-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 { ActionGroup } from './ActionGroup';
-import '@testing-library/jest-dom';
-describe('Action Group', () => {
-    it('renders', () => {
-        render(_jsx(ActionGroup, {}));
-        const component = screen.getByRole('group');
-        expect(component).toBeInTheDocument();
-        expect(component).toBeVisible();
-    });
-    it('renders a design system BEM class name', () => {
-        render(_jsx(ActionGroup, {}));
-        const component = screen.getByRole('group');
-        expect(component).toHaveClass('ams-action-group');
-    });
-    it('renders an extra class name', () => {
-        render(_jsx(ActionGroup, { className: "extra" }));
-        const component = screen.getByRole('group');
-        expect(component).toHaveClass('ams-action-group extra');
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        render(_jsx(ActionGroup, { ref: ref }));
-        const component = screen.getByRole('group');
-        expect(ref.current).toBe(component);
-    });
-});

package/dist/Alert/Alert.test.d.ts

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

package/dist/Alert/Alert.test.js

@@ -1,74 +0,0 @@
-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 { Alert } from './Alert';
-import '@testing-library/jest-dom';
-describe('Alert', () => {
-    it('renders', () => {
-        render(_jsx(Alert, { heading: "Let op!", headingLevel: 2 }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        const icon = component?.querySelector('.ams-alert__severity-indicator > .ams-icon');
-        expect(component).toBeInTheDocument();
-        expect(component).toBeVisible();
-        expect(icon).toBeInTheDocument();
-        expect(icon).not.toBeVisible(); // The icon is hidden by default, and only shown when the CSS loads.
-    });
-    it('renders a design system BEM class name', () => {
-        render(_jsx(Alert, { heading: "Let op!", headingLevel: 2 }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        expect(component).toHaveClass('ams-alert');
-    });
-    it('renders an extra class name', () => {
-        render(_jsx(Alert, { className: "extra", heading: "Let op!", headingLevel: 2 }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        expect(component).toHaveClass('ams-alert extra');
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        render(_jsx(Alert, { heading: "Let op!", headingLevel: 2, ref: ref }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        expect(ref.current).toBe(component);
-    });
-    it('renders a heading', () => {
-        render(_jsx(Alert, { heading: "Test heading", headingLevel: 2 }));
-        const heading = screen.getByRole('heading', {
-            name: 'Test heading',
-        });
-        expect(heading).toBeInTheDocument();
-    });
-    it('renders the close button', () => {
-        render(_jsx(Alert, { closeable: true, heading: "Let op!", headingLevel: 2 }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        const closeButton = component?.querySelector('.ams-icon-button');
-        expect(closeButton).toBeInTheDocument();
-        expect(closeButton).toBeVisible();
-    });
-    it('renders the close button with a label', () => {
-        render(_jsx(Alert, { closeable: true, closeButtonLabel: "Close", heading: "Let op!", headingLevel: 2 }));
-        const closeButton = screen.getByRole('button', { name: 'Close' });
-        expect(closeButton).toBeInTheDocument();
-    });
-    it('fires the onClose event when the close button is clicked', () => {
-        const onClose = jest.fn();
-        render(_jsx(Alert, { closeable: true, heading: "Let op!", headingLevel: 2, onClose: onClose }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        const closeButton = component?.querySelector('.ams-icon-button');
-        fireEvent.click(closeButton);
-        expect(onClose).toHaveBeenCalled();
-    });
-    it('uses a custom headingId to label the Alert', () => {
-        render(_jsx(Alert, { heading: "Let op!", headingId: "custom-heading-id", headingLevel: 2 }));
-        const component = screen.getByRole('region', { name: 'Let op!' });
-        expect(component).toBeInTheDocument();
-        expect(component).toHaveAttribute('aria-labelledby', 'custom-heading-id');
-    });
-    it('does not label the Alert when headingId is set to null', () => {
-        const { container } = render(_jsx(Alert, { heading: "Let op!", headingId: null, headingLevel: 2 }));
-        const component = container.querySelector(':only-child');
-        expect(component).not.toHaveAttribute('aria-labelledby');
-    });
-});

package/dist/App/App.d.ts

@@ -1,12 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import type { HTMLAttributes, PropsWithChildren } from 'react';
-export type AppProps = PropsWithChildren<HTMLAttributes<HTMLDivElement>>;
-/**
- * @see {@link https://designsystem.amsterdam/?path=/docs/components-TODO-ADD-GROUP-app--docs App docs at Amsterdam Design System}
- */
-export declare const App: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/App/App.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-/**
- * @see {@link https://designsystem.amsterdam/?path=/docs/components-TODO-ADD-GROUP-app--docs App docs at Amsterdam Design System}
- */
-export const App = forwardRef(({ children, className, ...restProps }, ref) => (_jsx("div", { ...restProps, className: clsx('ams-app', className), ref: ref, children: children })));
-App.displayName = 'App';

package/dist/App/App.test.d.ts

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

package/dist/App/App.test.js

@@ -1,33 +0,0 @@
-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 { App } from './App';
-import '@testing-library/jest-dom';
-describe('App', () => {
-    it('renders', () => {
-        const { container } = render(_jsx(App, {}));
-        const component = container.querySelector(':only-child');
-        expect(component).toBeInTheDocument();
-        expect(component).toBeVisible();
-    });
-    it('renders a design system BEM class name', () => {
-        const { container } = render(_jsx(App, {}));
-        const component = container.querySelector(':only-child');
-        expect(component).toHaveClass('ams-app');
-    });
-    it('renders an extra class name', () => {
-        const { container } = render(_jsx(App, { className: "extra" }));
-        const component = container.querySelector(':only-child');
-        expect(component).toHaveClass('ams-app extra');
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        const { container } = render(_jsx(App, { ref: ref }));
-        const component = container.querySelector(':only-child');
-        expect(ref.current).toBe(component);
-    });
-});

package/dist/App/index.d.ts

@@ -1,6 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-export { App } from './App';
-export type { AppProps } from './App';

package/dist/App/index.js

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

package/dist/AppNavigation/AppNavigation.d.ts

@@ -1,45 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import type { HTMLAttributes, PropsWithChildren } from 'react';
-export type AppNavigationProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {
-    expandable?: boolean;
-    expanded?: boolean;
-    onToggle?: () => void;
-};
-/**
- * @see {@link https://designsystem.amsterdam/?path=/docs/components-TODO-ADD-GROUP-app-navigation--docs AppNavigation docs at Amsterdam Design System}
- */
-export declare const AppNavigationRoot: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
-    children?: import("react").ReactNode | undefined;
-} & {
-    expandable?: boolean;
-    expanded?: boolean;
-    onToggle?: () => void;
-} & import("react").RefAttributes<HTMLElement>>;
-export declare const AppNavigation: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
-    children?: import("react").ReactNode | undefined;
-} & {
-    expandable?: boolean;
-    expanded?: boolean;
-    onToggle?: () => void;
-} & import("react").RefAttributes<HTMLElement>> & {
-    Button: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLButtonElement> & {
-        children?: import("react").ReactNode | undefined;
-    } & {
-        active?: boolean;
-        icon?: import("..").IconProps["svg"];
-        label: string;
-    } & import("react").RefAttributes<HTMLButtonElement>>;
-    Link: import("react").ForwardRefExoticComponent<import("react").AnchorHTMLAttributes<HTMLAnchorElement> & {
-        children?: import("react").ReactNode | undefined;
-    } & {
-        active?: boolean;
-        icon?: import("..").IconProps["svg"];
-        label: string;
-    } & import("react").RefAttributes<HTMLAnchorElement>>;
-    Menu: import("react").ForwardRefExoticComponent<import("react").OlHTMLAttributes<HTMLOListElement> & {
-        children?: import("react").ReactNode | undefined;
-    } & import("react").RefAttributes<HTMLOListElement>>;
-};

package/dist/AppNavigation/AppNavigation.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronForwardIcon } from '@amsterdam/design-system-react-icons';
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-import { IconButton } from '../IconButton';
-import { AppNavigationMenuButton } from './AppNavigationButton';
-import { AppNavigationMenuLink } from './AppNavigationLink';
-import { AppNavigationMenu } from './AppNavigationMenu';
-/**
- * @see {@link https://designsystem.amsterdam/?path=/docs/components-TODO-ADD-GROUP-app-navigation--docs AppNavigation docs at Amsterdam Design System}
- */
-export const AppNavigationRoot = forwardRef(({ children, className, expandable, expanded, onToggle, ...restProps }, ref) => (_jsxs("nav", { ...restProps, className: clsx('ams-app-navigation', expanded && 'ams-app-navigation--expanded', className), ref: ref, children: [expandable && (_jsx(IconButton, { className: "ams-app-navigation__toggle", color: "inverse", label: "Toggle navigation", onClick: onToggle, size: "large", svg: ChevronForwardIcon })), _jsx("ol", { className: "ams-app-navigation__menu", children: children })] })));
-AppNavigationRoot.displayName = 'AppNavigation';
-export const AppNavigation = Object.assign(AppNavigationRoot, {
-    Button: AppNavigationMenuButton,
-    Link: AppNavigationMenuLink,
-    Menu: AppNavigationMenu,
-});

package/dist/AppNavigation/AppNavigation.test.d.ts

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

package/dist/AppNavigation/AppNavigation.test.js

@@ -1,33 +0,0 @@
-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 { AppNavigation } from './AppNavigation';
-import '@testing-library/jest-dom';
-describe('AppNavigation', () => {
-    it('renders', () => {
-        const { container } = render(_jsx(AppNavigation, {}));
-        const component = container.querySelector(':only-child');
-        expect(component).toBeInTheDocument();
-        expect(component).toBeVisible();
-    });
-    it('renders a design system BEM class name', () => {
-        const { container } = render(_jsx(AppNavigation, {}));
-        const component = container.querySelector(':only-child');
-        expect(component).toHaveClass('ams-app-navigation');
-    });
-    it('renders an extra class name', () => {
-        const { container } = render(_jsx(AppNavigation, { className: "extra" }));
-        const component = container.querySelector(':only-child');
-        expect(component).toHaveClass('ams-app-navigation extra');
-    });
-    it('supports ForwardRef in React', () => {
-        const ref = createRef();
-        const { container } = render(_jsx(AppNavigation, { ref: ref }));
-        const component = container.querySelector(':only-child');
-        expect(ref.current).toBe(component);
-    });
-});

package/dist/AppNavigation/AppNavigationButton.d.ts

@@ -1,18 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import type { HTMLAttributes, PropsWithChildren } from 'react';
-import type { IconProps } from '../Icon';
-export type AppNavigationMenuButtonProps = PropsWithChildren<HTMLAttributes<HTMLButtonElement>> & {
-    active?: boolean;
-    icon?: IconProps['svg'];
-    label: string;
-};
-export declare const AppNavigationMenuButton: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLButtonElement> & {
-    children?: import("react").ReactNode | undefined;
-} & {
-    active?: boolean;
-    icon?: IconProps["svg"];
-    label: string;
-} & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/AppNavigation/AppNavigationButton.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronDownIcon } from '@amsterdam/design-system-react-icons';
-import { clsx } from 'clsx';
-import { Children, isValidElement } from 'react';
-import { forwardRef } from 'react';
-import { Icon } from '../Icon';
-export const AppNavigationMenuButton = forwardRef(({ active, children, className, icon, label, ...restProps }, ref) => {
-    // const [submenuOpen, setSubmenuOpen] = useState(false)
-    // Check if children contain an element with type 'AppNavigation.Menu'
-    const hasSubMenu = Children.toArray(children).some((child) => isValidElement(child) && child.type?.displayName === 'AppNavigation.Menu');
-    return (_jsxs("li", { className: clsx('ams-app-navigation__menu-item'), children: [_jsxs("button", { ...restProps, 
-                //   aria-expanded={hasSubMenu ? submenuOpen : undefined}
-                className: clsx('ams-app-navigation__menu-link', active && 'ams-app-navigation__menu-link--active', className), 
-                //   onClick={handleClick}
-                ref: ref, children: [icon && _jsx(Icon, { size: "large", svg: icon }), _jsx("span", { className: "ams-app-navigation__menu-link-label", children: label }), hasSubMenu && _jsx(Icon, { className: "ams-app-navigation__menu-link-chevron", size: "small", svg: ChevronDownIcon })] }), children] }));
-});
-AppNavigationMenuButton.displayName = 'AppNavigation.MenuButton';

package/dist/AppNavigation/AppNavigationLink.d.ts

@@ -1,19 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import type { AnchorHTMLAttributes, PropsWithChildren } from 'react';
-import React from 'react';
-import type { IconProps } from '../Icon';
-export type AppNavigationMenuLinkProps = PropsWithChildren<AnchorHTMLAttributes<HTMLAnchorElement>> & {
-    active?: boolean;
-    icon?: IconProps['svg'];
-    label: string;
-};
-export declare const AppNavigationMenuLink: React.ForwardRefExoticComponent<AnchorHTMLAttributes<HTMLAnchorElement> & {
-    children?: React.ReactNode | undefined;
-} & {
-    active?: boolean;
-    icon?: IconProps["svg"];
-    label: string;
-} & React.RefAttributes<HTMLAnchorElement>>;

package/dist/AppNavigation/AppNavigationLink.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronDownIcon } from '@amsterdam/design-system-react-icons';
-import { clsx } from 'clsx';
-import { Children, isValidElement, useState } from 'react';
-import { forwardRef } from 'react';
-import { Icon } from '../Icon';
-export const AppNavigationMenuLink = forwardRef(({ active, children, className, icon, label, ...restProps }, ref) => {
-    const [submenuOpen, setSubmenuOpen] = useState(false);
-    // Check if children contain an element with type 'AppNavigation.Menu'
-    const hasSubMenu = Children.toArray(children).some((child) => isValidElement(child) && child.type?.displayName === 'AppNavigation.Menu');
-    const handleClick = (e) => {
-        if (hasSubMenu) {
-            e.preventDefault();
-            setSubmenuOpen((open) => !open);
-        }
-    };
-    return (_jsxs("li", { className: clsx('ams-app-navigation__menu-item', submenuOpen && 'ams-app-navigation__menu-item--open'), children: [_jsxs("a", { ...restProps, "aria-expanded": hasSubMenu ? submenuOpen : undefined, className: clsx('ams-app-navigation__menu-link', active && 'ams-app-navigation__menu-link--active', className), onClick: handleClick, ref: ref, children: [icon && _jsx(Icon, { size: "large", svg: icon }), _jsx("span", { className: "ams-app-navigation__menu-link-label", children: label }), hasSubMenu && _jsx(Icon, { className: "ams-app-navigation__menu-link-chevron", size: "small", svg: ChevronDownIcon })] }), children] }));
-});
-AppNavigationMenuLink.displayName = 'AppNavigation.MenuLink';

package/dist/AppNavigation/AppNavigationMenu.d.ts

@@ -1,9 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-import type { OlHTMLAttributes, PropsWithChildren } from 'react';
-export type AppNavigationMenuProps = PropsWithChildren<OlHTMLAttributes<HTMLOListElement>>;
-export declare const AppNavigationMenu: import("react").ForwardRefExoticComponent<OlHTMLAttributes<HTMLOListElement> & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLOListElement>>;

package/dist/AppNavigation/AppNavigationMenu.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { clsx } from 'clsx';
-import { forwardRef } from 'react';
-export const AppNavigationMenu = forwardRef(({ children, className, ...restProps }, ref) => (_jsx("ol", { className: clsx('ams-app-navigation__menu', className), ref: ref, ...restProps, children: children })));
-AppNavigationMenu.displayName = 'AppNavigation.Menu';

package/dist/AppNavigation/index.d.ts

@@ -1,6 +0,0 @@
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-export { AppNavigation } from './AppNavigation';
-export type { AppNavigationProps } from './AppNavigation';

package/dist/AppNavigation/index.js

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

package/dist/Avatar/Avatar.test.d.ts

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