npm - @amsterdam/design-system-react - Versions diffs - 0.11.0 → 0.12.0 - Mend

@amsterdam/design-system-react 0.11.0 → 0.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.cjs.js CHANGED Viewed

@@ -1,60 +1,166 @@
 'use strict';
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
 var clsx = require('clsx');
-var designSystemReactIcons = require('@amsterdam/design-system-react-icons');
+var react = require('react');
 var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var designSystemReactIcons = require('@amsterdam/design-system-react-icons');
-function getHeadingTag(level) {
-  switch (level) {
-    case 2:
-      return 'h2';
-    case 3:
-      return 'h3';
-    case 4:
-      return 'h4';
-    default:
-      return 'h1';
+var _excluded$1u = ["children", "className"];
+function ownKeys$1A(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1A(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1A(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1A(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ActionGroup = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$1u);
+  return jsxRuntime.jsx("div", _objectSpread$1A(_objectSpread$1A({}, restProps), {}, {
+    ref: ref,
+    className: clsx('ams-action-group', className),
+    role: "group",
+    children: children
+  }));
+});
+ActionGroup.displayName = 'ActionGroup';
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+var addGridClass = function addGridClass(prefix, value) {
+  if (value === 'all' || typeof value === 'number') {
+    return ["".concat(prefix).concat(value)];
+  } else if (value) {
+    var narrow = value.narrow,
+      medium = value.medium,
+      wide = value.wide;
+    return ["".concat(prefix).concat(narrow), "".concat(prefix).concat(medium, "-medium"), "".concat(prefix).concat(wide, "-wide")];
   }
-}
+  return [];
+};
+var gridCellClasses = function gridCellClasses(colSpan, colStart) {
+  return [].concat(_toConsumableArray(addGridClass('ams-grid__cell--span-', colSpan)), _toConsumableArray(addGridClass('ams-grid__cell--start-', colStart)));
+};
-var _excluded$1k = ["children", "className", "inverseColor", "level", "size"];
-function ownKeys$1q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1q(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Heading = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+var breakoutCellClasses = function breakoutCellClasses(colSpan, colStart, rowSpan, rowStart) {
+  return [].concat(_toConsumableArray(addGridClass('ams-breakout__cell--col-span-', colSpan)), _toConsumableArray(addGridClass('ams-breakout__cell--col-start-', colStart)), _toConsumableArray(addGridClass('ams-breakout__cell--row-span-', rowSpan)), _toConsumableArray(addGridClass('ams-breakout__cell--row-start-', rowStart)));
+};
+var _excluded$1t = ["as", "children", "className", "colSpan", "colStart", "has", "rowSpan", "rowStart"];
+function ownKeys$1z(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1z(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1z(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1z(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var BreakoutCell = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var _ref$as = _ref.as,
+    Tag = _ref$as === void 0 ? 'div' : _ref$as,
+    children = _ref.children,
+    className = _ref.className,
+    colSpan = _ref.colSpan,
+    colStart = _ref.colStart,
+    has = _ref.has,
+    rowSpan = _ref.rowSpan,
+    rowStart = _ref.rowStart,
+    restProps = _objectWithoutProperties(_ref, _excluded$1t);
+  return jsxRuntime.jsx(Tag, _objectSpread$1z(_objectSpread$1z({}, restProps), {}, {
+    ref: ref,
+    className: clsx('ams-breakout__cell', breakoutCellClasses(colSpan, colStart, rowSpan, rowStart), has && "ams-breakout__cell--has-".concat(has), className),
+    children: children
+  }));
+});
+BreakoutCell.displayName = 'Breakout.Cell';
+var paddingClasses = function paddingClasses(componentName, paddingBottom, paddingTop, paddingVertical) {
+  var classes = [];
+  if (paddingVertical) {
+    return ["ams-".concat(componentName, "--padding-vertical--").concat(paddingVertical)];
+  }
+  if (paddingBottom) {
+    classes.push("ams-".concat(componentName, "--padding-bottom--").concat(paddingBottom));
+  }
+  if (paddingTop) {
+    classes.push("ams-".concat(componentName, "--padding-top--").concat(paddingTop));
+  }
+  return classes;
+};
+var _excluded$1s = ["children", "className", "gapVertical", "paddingBottom", "paddingTop", "paddingVertical"];
+function ownKeys$1y(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1y(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1y(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1y(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var BreakoutRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    inverseColor = _ref.inverseColor,
-    _ref$level = _ref.level,
-    level = _ref$level === void 0 ? 1 : _ref$level,
-    size = _ref.size,
-    restProps = _objectWithoutProperties(_ref, _excluded$1k);
-  var Tag = getHeadingTag(level);
-  var sizeOrLevel = size !== null && size !== void 0 ? size : "level-".concat(level);
-  return jsxRuntime.jsx(Tag, _objectSpread$1q(_objectSpread$1q({
+    gapVertical = _ref.gapVertical,
+    paddingBottom = _ref.paddingBottom,
+    paddingTop = _ref.paddingTop,
+    paddingVertical = _ref.paddingVertical,
+    restProps = _objectWithoutProperties(_ref, _excluded$1s);
+  return jsxRuntime.jsx("div", _objectSpread$1y(_objectSpread$1y({}, restProps), {}, {
     ref: ref,
-    className: clsx('ams-heading', "ams-heading--".concat(sizeOrLevel), inverseColor && 'ams-heading--inverse-color', className)
-  }, restProps), {}, {
+    className: clsx('ams-breakout', gapVertical && "ams-breakout--gap-vertical--".concat(gapVertical), paddingClasses('breakout', paddingBottom, paddingTop, paddingVertical), className),
     children: children
   }));
 });
-Heading.displayName = 'Heading';
+BreakoutRoot.displayName = 'Breakout';
+var Breakout = Object.assign(BreakoutRoot, {
+  Cell: BreakoutCell
+});
-var _excluded$1j = ["className", "size", "square", "svg"];
-function ownKeys$1p(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1p(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1p(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1r = ["className", "hint", "optional"];
+function ownKeys$1x(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1x(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1x(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1x(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var getHintText = function getHintText(_ref) {
+  var hint = _ref.hint,
+    optional = _ref.optional;
+  if (hint) {
+    return hint;
+  } else if (optional) {
+    return 'niet verplicht';
+  }
+  return null;
+};
+var Hint = /*#__PURE__*/react.forwardRef(function (_ref2, ref) {
+  var className = _ref2.className,
+    hint = _ref2.hint,
+    optional = _ref2.optional,
+    restProps = _objectWithoutProperties(_ref2, _excluded$1r);
+  var hintText = getHintText({
+    hint: hint,
+    optional: optional
+  });
+  return hintText && jsxRuntime.jsxs("span", _objectSpread$1x(_objectSpread$1x({}, restProps), {}, {
+    ref: ref,
+    className: clsx('ams-hint', className),
+    children: ["(", hintText, ")"]
+  }));
+});
+Hint.displayName = 'Hint';
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+var defaultValues$2 = {
+  currentSlideId: 0,
+  isAtStart: true,
+  isAtEnd: false,
+  goToNextSlide: function goToNextSlide() {},
+  goToPreviousSlide: function goToPreviousSlide() {},
+  goToSlideId: function goToSlideId() {}
+};
+var ImageSliderContext = /*#__PURE__*/react.createContext(defaultValues$2);
+var _excluded$1q = ["className", "size", "square", "svg"];
+function ownKeys$1w(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1w(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1w(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1w(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Icon = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'level-3' : _ref$size,
     square = _ref.square,
     svg = _ref.svg,
-    restProps = _objectWithoutProperties(_ref, _excluded$1j);
-  return jsxRuntime.jsx("span", _objectSpread$1p(_objectSpread$1p({
+    restProps = _objectWithoutProperties(_ref, _excluded$1q);
+  return jsxRuntime.jsx("span", _objectSpread$1w(_objectSpread$1w({
     ref: ref,
     className: clsx('ams-icon', size === 'level-3' && 'ams-icon--size-3', size === 'level-4' && 'ams-icon--size-4', size === 'level-5' && 'ams-icon--size-5', size === 'level-6' && 'ams-icon--size-6', square && 'ams-icon--square', className)
   }, restProps), {}, {
@@ -63,21 +169,22 @@ var Icon = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 Icon.displayName = 'Icon';
-var _excluded$1i = ["className", "label", "onBackground", "size", "svg"];
-function ownKeys$1o(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1o(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1o(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1p = ["className", "label", "contrastColor", "inverseColor", "size", "svg"];
+function ownKeys$1v(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1v(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1v(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1v(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var IconButton = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     label = _ref.label,
-    onBackground = _ref.onBackground,
+    contrastColor = _ref.contrastColor,
+    inverseColor = _ref.inverseColor,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'level-5' : _ref$size,
     _ref$svg = _ref.svg,
     svg = _ref$svg === void 0 ? designSystemReactIcons.CloseIcon : _ref$svg,
-    restProps = _objectWithoutProperties(_ref, _excluded$1i);
-  return jsxRuntime.jsxs("button", _objectSpread$1o(_objectSpread$1o({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$1p);
+  return jsxRuntime.jsxs("button", _objectSpread$1v(_objectSpread$1v({}, restProps), {}, {
     ref: ref,
-    className: clsx('ams-icon-button', onBackground === 'light' && 'ams-icon-button--on-background-light', onBackground === 'dark' && 'ams-icon-button--on-background-dark', className),
+    className: clsx('ams-icon-button', contrastColor && 'ams-icon-button--contrast-color', inverseColor && 'ams-icon-button--inverse-color', className),
     children: [jsxRuntime.jsx("span", {
       className: "ams-visually-hidden",
       children: label
@@ -90,9 +197,388 @@ var IconButton = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 IconButton.displayName = 'IconButton';
-var _excluded$1h = ["children", "className", "closeable", "closeButtonLabel", "heading", "headingLevel", "onClose", "severity"];
+var _excluded$1o = ["className", "nextLabel", "previousLabel"];
+function ownKeys$1u(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1u(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1u(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1u(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ImageSliderControls = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    nextLabel = _ref.nextLabel,
+    previousLabel = _ref.previousLabel,
+    restProps = _objectWithoutProperties(_ref, _excluded$1o);
+  var _useContext = react.useContext(ImageSliderContext),
+    isAtStart = _useContext.isAtStart,
+    isAtEnd = _useContext.isAtEnd,
+    goToNextSlide = _useContext.goToNextSlide,
+    goToPreviousSlide = _useContext.goToPreviousSlide;
+  var handleClickPrevious = react.useCallback(function () {
+    return goToPreviousSlide();
+  }, [goToPreviousSlide]);
+  var handleClickNext = react.useCallback(function () {
+    return goToNextSlide();
+  }, [goToNextSlide]);
+  return jsxRuntime.jsxs("div", _objectSpread$1u(_objectSpread$1u({}, restProps), {}, {
+    className: clsx('ams-image-slider__controls', className),
+    ref: ref,
+    children: [jsxRuntime.jsx(IconButton, {
+      className: "ams-image-slider__control ams-image-slider__control--previous",
+      disabled: isAtStart,
+      inverseColor: true,
+      label: previousLabel,
+      onClick: handleClickPrevious,
+      svg: designSystemReactIcons.ChevronLeftIcon
+    }), jsxRuntime.jsx(IconButton, {
+      className: "ams-image-slider__control ams-image-slider__control--next",
+      disabled: isAtEnd,
+      inverseColor: true,
+      label: nextLabel,
+      onClick: handleClickNext,
+      svg: designSystemReactIcons.ChevronRightIcon
+    })]
+  }));
+});
+ImageSliderControls.displayName = 'ImageSliderControls';
+var _excluded$1n = ["children", "slideId", "className"];
+function ownKeys$1t(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1t(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1t(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1t(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ImageSliderItem = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    slideId = _ref.slideId,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$1n);
+  var _useContext = react.useContext(ImageSliderContext),
+    currentSlideId = _useContext.currentSlideId;
+  var isInView = react.useMemo(function () {
+    return currentSlideId === slideId;
+  }, [currentSlideId, slideId]);
+  var itemClassName = react.useMemo(function () {
+    return clsx('ams-image-slider__item', isInView && 'ams-image-slider__item--in-view', className);
+  }, [isInView, className]);
+  return jsxRuntime.jsx("div", _objectSpread$1t(_objectSpread$1t(_objectSpread$1t({}, restProps), {}, {
+    className: itemClassName,
+    ref: ref
+  }, !isInView && {
+    inert: ''
+  }), {}, {
+    children: children
+  }));
+});
+ImageSliderItem.displayName = 'ImageSlider.Item';
+var _excluded$1m = ["children", "className"];
+function ownKeys$1s(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1s(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1s(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1s(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ImageSliderScroller = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    restProps = _objectWithoutProperties(_ref, _excluded$1m);
+  return jsxRuntime.jsx("div", _objectSpread$1s(_objectSpread$1s({}, restProps), {}, {
+    className: clsx('ams-image-slider__scroller', className),
+    ref: ref,
+    children: children
+  }));
+});
+ImageSliderScroller.displayName = 'ImageSlider.Scroller';
+var _excluded$1l = ["className", "imageLabel", "thumbnails"];
+function ownKeys$1r(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1r(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1r(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ImageSliderThumbnails = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    imageLabel = _ref.imageLabel,
+    thumbnails = _ref.thumbnails,
+    restProps = _objectWithoutProperties(_ref, _excluded$1l);
+  var _useContext = react.useContext(ImageSliderContext),
+    currentSlideId = _useContext.currentSlideId,
+    goToNextSlide = _useContext.goToNextSlide,
+    goToPreviousSlide = _useContext.goToPreviousSlide,
+    goToSlideId = _useContext.goToSlideId;
+  var handleKeyDown = react.useCallback(function (event) {
+    var element = event.currentTarget.children[currentSlideId];
+    if (event.key === 'ArrowRight') {
+      var nextElement = element === null || element === void 0 ? void 0 : element.nextElementSibling;
+      if (nextElement) {
+        nextElement.focus();
+        goToNextSlide();
+      }
+    }
+    if (event.key === 'ArrowLeft') {
+      var previousElement = element === null || element === void 0 ? void 0 : element.previousElementSibling;
+      if (previousElement) {
+        previousElement.focus();
+        goToPreviousSlide();
+      }
+    }
+  }, [currentSlideId, goToNextSlide, goToPreviousSlide]);
+  var renderThumbnails = react.useMemo(function () {
+    return thumbnails.map(function (_ref2, index) {
+      var alt = _ref2.alt,
+        aspectRatio = _ref2.aspectRatio,
+        src = _ref2.src;
+      return jsxRuntime.jsx("button", {
+        "aria-label": "".concat(imageLabel, " ").concat(index + 1, ": ").concat(alt),
+        "aria-posinset": index + 1,
+        "aria-selected": currentSlideId === index ? 'true' : 'false',
+        "aria-setsize": thumbnails.length,
+        className: clsx('ams-image-slider__thumbnail', currentSlideId === index && 'ams-image-slider__thumbnail--in-view', aspectRatio && "ams-aspect-ratio--".concat(aspectRatio)),
+        onClick: function onClick() {
+          return goToSlideId(index);
+        },
+        role: "tab",
+        style: {
+          backgroundImage: "url(".concat(src, ")")
+        },
+        tabIndex: currentSlideId === index ? 0 : -1
+      }, index);
+    });
+  }, [currentSlideId, goToSlideId, imageLabel, thumbnails]);
+  return jsxRuntime.jsx("nav", _objectSpread$1r(_objectSpread$1r({}, restProps), {}, {
+    className: clsx('ams-image-slider__thumbnails', className),
+    onKeyDown: handleKeyDown,
+    ref: ref,
+    role: "tablist",
+    children: renderThumbnails
+  }));
+});
+ImageSliderThumbnails.displayName = 'ImageSlider.Thumbnails';
+var _excluded$1k = ["className", "cover"];
+function ownKeys$1q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1q(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Image = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    _ref$cover = _ref.cover,
+    cover = _ref$cover === void 0 ? false : _ref$cover,
+    restProps = _objectWithoutProperties(_ref, _excluded$1k);
+  return jsxRuntime.jsx("img", _objectSpread$1q(_objectSpread$1q({}, restProps), {}, {
+    ref: ref,
+    className: clsx('ams-image', cover && 'ams-image--cover', className)
+  }));
+});
+Image.displayName = 'Image';
+var _excluded$1j = ["className", "controls", "imageLabel", "images", "nextLabel", "previousLabel"];
+function ownKeys$1p(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1p(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1p(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ImageSliderRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    controls = _ref.controls,
+    _ref$imageLabel = _ref.imageLabel,
+    imageLabel = _ref$imageLabel === void 0 ? 'Afbeelding' : _ref$imageLabel,
+    images = _ref.images,
+    _ref$nextLabel = _ref.nextLabel,
+    nextLabel = _ref$nextLabel === void 0 ? 'Volgende' : _ref$nextLabel,
+    _ref$previousLabel = _ref.previousLabel,
+    previousLabel = _ref$previousLabel === void 0 ? 'Vorige' : _ref$previousLabel,
+    restProps = _objectWithoutProperties(_ref, _excluded$1j);
+  var _useState = react.useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentSlideId = _useState2[0],
+    setCurrentSlideId = _useState2[1];
+  var _useState3 = react.useState(true),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isAtStart = _useState4[0],
+    setIsAtStart = _useState4[1];
+  var _useState5 = react.useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isAtEnd = _useState6[0],
+    setIsAtEnd = _useState6[1];
+  var targetRef = react.useRef(null);
+  var observerRef = react.useRef(null);
+  var inView = react.useCallback(function (observations) {
+    var _targetRef$current;
+    var images = Array.from(((_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.children) || []);
+    observations.forEach(function (observation) {
+      if (observation.isIntersecting) {
+        setCurrentSlideId(images.indexOf(observation.target));
+      }
+    });
+  }, []);
+  var observerOptions = react.useMemo(function () {
+    return {
+      root: targetRef.current,
+      threshold: 0.6
+    };
+  }, []);
+  var updateControls = react.useCallback(function () {
+    var sliderScrollerElement = targetRef.current;
+    if (!sliderScrollerElement) return;
+    var lastElement = sliderScrollerElement.lastElementChild,
+      firstElement = sliderScrollerElement.firstElementChild;
+    setIsAtStart(firstElement === (sliderScrollerElement === null || sliderScrollerElement === void 0 ? void 0 : sliderScrollerElement.children[currentSlideId]));
+    setIsAtEnd(lastElement === (sliderScrollerElement === null || sliderScrollerElement === void 0 ? void 0 : sliderScrollerElement.children[currentSlideId]));
+  }, [currentSlideId]);
+  react.useEffect(function () {
+    if (targetRef.current) {
+      observerRef.current = new IntersectionObserver(inView, observerOptions);
+      var observer = observerRef.current;
+      var slides = Array.from(targetRef.current.children);
+      slides.forEach(function (slide) {
+        return observer.observe(slide);
+      });
+      targetRef.current.addEventListener('scrollend', synchronise);
+      updateControls();
+      return function () {
+        var _targetRef$current2;
+        slides.forEach(function (slide) {
+          return observer.unobserve(slide);
+        });
+        (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 || _targetRef$current2.removeEventListener('scrollend', synchronise);
+      };
+    }
+    return undefined;
+  }, [inView, observerOptions, updateControls]);
+  var synchronise = react.useCallback(function () {
+    return updateControls();
+  }, [updateControls]);
+  var goToSlide = react.useCallback(function (element) {
+    var sliderScrollerElement = targetRef.current;
+    if (!sliderScrollerElement || !element) return;
+    sliderScrollerElement.scrollTo({
+      left: sliderScrollerElement.scrollLeft + element.offsetLeft - sliderScrollerElement.scrollLeft
+    });
+  }, []);
+  var goToSlideId = react.useCallback(function (id) {
+    var _targetRef$current3;
+    var element = (_targetRef$current3 = targetRef.current) === null || _targetRef$current3 === void 0 ? void 0 : _targetRef$current3.children[id];
+    if (element) goToSlide(element);
+  }, [goToSlide]);
+  var goToNextSlide = react.useCallback(function () {
+    var _targetRef$current4;
+    var element = (_targetRef$current4 = targetRef.current) === null || _targetRef$current4 === void 0 ? void 0 : _targetRef$current4.children[currentSlideId];
+    var nextElement = element === null || element === void 0 ? void 0 : element.nextElementSibling;
+    if (nextElement) goToSlide(nextElement);
+  }, [currentSlideId, goToSlide]);
+  var goToPreviousSlide = react.useCallback(function () {
+    var _targetRef$current5;
+    var element = (_targetRef$current5 = targetRef.current) === null || _targetRef$current5 === void 0 ? void 0 : _targetRef$current5.children[currentSlideId];
+    var previousElement = element === null || element === void 0 ? void 0 : element.previousElementSibling;
+    if (previousElement) goToSlide(previousElement);
+  }, [currentSlideId, goToSlide]);
+  react.useEffect(function () {
+    var handleResize = function handleResize() {
+      var _targetRef$current6;
+      var sliderScrollerElement = targetRef.current;
+      var currentSlideElement = (_targetRef$current6 = targetRef.current) === null || _targetRef$current6 === void 0 ? void 0 : _targetRef$current6.children[currentSlideId];
+      if (!sliderScrollerElement || !currentSlideElement) return;
+      var expectedScrollLeft = currentSlideElement.offsetLeft;
+      if (Math.abs(sliderScrollerElement.scrollLeft - expectedScrollLeft) < 1) return;
+      goToSlide(currentSlideElement);
+    };
+    window.addEventListener('resize', handleResize);
+    return function () {
+      return window.removeEventListener('resize', handleResize);
+    };
+  }, [currentSlideId, goToSlide]);
+  return jsxRuntime.jsx(ImageSliderContext.Provider, {
+    value: {
+      isAtStart: isAtStart,
+      isAtEnd: isAtEnd,
+      currentSlideId: currentSlideId,
+      goToNextSlide: goToNextSlide,
+      goToPreviousSlide: goToPreviousSlide,
+      goToSlideId: goToSlideId
+    },
+    children: jsxRuntime.jsxs("div", _objectSpread$1p(_objectSpread$1p({}, restProps), {}, {
+      "aria-roledescription": "carousel",
+      className: clsx('ams-image-slider', controls && 'ams-image-slider--controls', className),
+      tabIndex: -1,
+      ref: ref,
+      children: [controls && jsxRuntime.jsx(ImageSliderControls, {
+        nextLabel: nextLabel,
+        previousLabel: previousLabel
+      }), jsxRuntime.jsx(ImageSliderScroller, {
+        "aria-live": "polite",
+        ref: targetRef,
+        role: "group",
+        tabIndex: 0,
+        children: images.map(function (_ref2, index) {
+          var alt = _ref2.alt,
+            aspectRatio = _ref2.aspectRatio,
+            sizes = _ref2.sizes,
+            src = _ref2.src,
+            srcSet = _ref2.srcSet;
+          return jsxRuntime.jsx(ImageSliderItem, {
+            slideId: index,
+            children: jsxRuntime.jsx(Image, {
+              alt: alt,
+              className: "ams-aspect-ratio--".concat(aspectRatio),
+              sizes: sizes,
+              src: src,
+              srcSet: srcSet
+            })
+          }, index);
+        })
+      }), jsxRuntime.jsx(ImageSliderThumbnails, {
+        imageLabel: imageLabel,
+        thumbnails: images
+      })]
+    }))
+  });
+});
+ImageSliderRoot.displayName = 'ImageSlider';
+var ImageSlider = Object.assign(ImageSliderRoot, {
+  Item: ImageSliderItem
+});
+var _excluded$1i = ["className", "dir", "invalid"];
+function ownKeys$1o(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1o(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1o(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var PasswordInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+    dir = _ref.dir,
+    invalid = _ref.invalid,
+    restProps = _objectWithoutProperties(_ref, _excluded$1i);
+  return jsxRuntime.jsx("input", _objectSpread$1o(_objectSpread$1o({}, restProps), {}, {
+    "aria-invalid": invalid || undefined,
+    autoCorrect: "off",
+    className: clsx('ams-password-input', className),
+    dir: dir !== null && dir !== void 0 ? dir : 'auto',
+    ref: ref,
+    spellCheck: "false",
+    type: "password"
+  }));
+});
+PasswordInput.displayName = 'PasswordInput';
+function getHeadingTag(level) {
+  switch (level) {
+    case 2:
+      return 'h2';
+    case 3:
+      return 'h3';
+    case 4:
+      return 'h4';
+    default:
+      return 'h1';
+  }
+}
+var _excluded$1h = ["children", "className", "inverseColor", "level", "size"];
 function ownKeys$1n(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$1n(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1n(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1n(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Heading = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    inverseColor = _ref.inverseColor,
+    _ref$level = _ref.level,
+    level = _ref$level === void 0 ? 1 : _ref$level,
+    size = _ref.size,
+    restProps = _objectWithoutProperties(_ref, _excluded$1h);
+  var Tag = getHeadingTag(level);
+  var sizeOrLevel = size !== null && size !== void 0 ? size : "level-".concat(level);
+  return jsxRuntime.jsx(Tag, _objectSpread$1n(_objectSpread$1n({
+    ref: ref,
+    className: clsx('ams-heading', "ams-heading--".concat(sizeOrLevel), inverseColor && 'ams-heading--inverse-color', className)
+  }, restProps), {}, {
+    children: children
+  }));
+});
+Heading.displayName = 'Heading';
+var _excluded$1g = ["children", "className", "closeable", "closeButtonLabel", "heading", "headingLevel", "onClose", "severity"];
+function ownKeys$1m(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1m(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1m(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1m(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var iconSvgBySeverity = {
   error: designSystemReactIcons.AlertIcon,
   info: designSystemReactIcons.InfoIcon,
@@ -111,10 +597,10 @@ var Alert = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
     onClose = _ref.onClose,
     _ref$severity = _ref.severity,
     severity = _ref$severity === void 0 ? 'warning' : _ref$severity,
-    restProps = _objectWithoutProperties(_ref, _excluded$1h);
+    restProps = _objectWithoutProperties(_ref, _excluded$1g);
   var alertSize = heading ? 'level-4' : 'level-5';
   var Tag = heading ? 'section' : 'div';
-  return jsxRuntime.jsxs(Tag, _objectSpread$1n(_objectSpread$1n({}, restProps), {}, {
+  return jsxRuntime.jsxs(Tag, _objectSpread$1m(_objectSpread$1m({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-alert', severity && "ams-alert--".concat(severity), className),
     children: [jsxRuntime.jsx("div", {
@@ -139,9 +625,9 @@ var Alert = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 Alert.displayName = 'Alert';
-var _excluded$1g = ["children", "className", "icon", "onBackground", "size"];
-function ownKeys$1m(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1m(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1m(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1m(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1f = ["children", "className", "icon", "contrastColor", "inverseColor", "size"];
+function ownKeys$1l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1l(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var iconSizeMap = {
   small: 'level-6',
   medium: 'level-5',
@@ -152,12 +638,13 @@ var LinkListLink = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     icon = _ref.icon,
-    onBackground = _ref.onBackground,
+    contrastColor = _ref.contrastColor,
+    inverseColor = _ref.inverseColor,
     size = _ref.size,
-    restProps = _objectWithoutProperties(_ref, _excluded$1g);
+    restProps = _objectWithoutProperties(_ref, _excluded$1f);
   return jsxRuntime.jsx("li", {
-    children: jsxRuntime.jsxs("a", _objectSpread$1m(_objectSpread$1m({
-      className: clsx('ams-link-list__link', onBackground && "ams-link-list__link--on-background-".concat(onBackground), size && "ams-link-list__link--".concat(size), className),
+    children: jsxRuntime.jsxs("a", _objectSpread$1l(_objectSpread$1l({
+      className: clsx('ams-link-list__link', contrastColor && 'ams-link-list__link--contrast-color', inverseColor && 'ams-link-list__link--inverse-color', size && "ams-link-list__link--".concat(size), className),
       ref: ref
     }, restProps), {}, {
       children: [jsxRuntime.jsx(Icon, {
@@ -169,15 +656,15 @@ var LinkListLink = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 LinkListLink.displayName = 'LinkList.Link';
-var _excluded$1f = ["children", "className"];
-function ownKeys$1l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1l(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1l(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1e = ["children", "className"];
+function ownKeys$1k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1k(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /** A collection of related links. */
 var LinkListRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$1f);
-  return jsxRuntime.jsx("ul", _objectSpread$1l(_objectSpread$1l({
+    restProps = _objectWithoutProperties(_ref, _excluded$1e);
+  return jsxRuntime.jsx("ul", _objectSpread$1k(_objectSpread$1k({
     ref: ref,
     className: clsx('ams-link-list', className)
   }, restProps), {}, {
@@ -189,9 +676,9 @@ var LinkList = Object.assign(LinkListRoot, {
   Link: LinkListLink
 });
-var _excluded$1e = ["className", "errors", "focusOnRender", "hasFocusedOnce", "heading", "headingLevel", "setHasFocusedOnce"];
-function ownKeys$1k(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1k(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1d = ["className", "errors", "focusOnRender", "hasFocusedOnce", "heading", "headingLevel", "setHasFocusedOnce"];
+function ownKeys$1j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1j(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FormErrorListWithErrors = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     errors = _ref.errors,
@@ -203,7 +690,7 @@ var FormErrorListWithErrors = /*#__PURE__*/react.forwardRef(function (_ref, ref)
     _ref$headingLevel = _ref.headingLevel,
     headingLevel = _ref$headingLevel === void 0 ? 2 : _ref$headingLevel,
     setHasFocusedOnce = _ref.setHasFocusedOnce,
-    restProps = _objectWithoutProperties(_ref, _excluded$1e);
+    restProps = _objectWithoutProperties(_ref, _excluded$1d);
   var innerRef = react.useRef(null);
   // use a passed ref if it's there, otherwise use innerRef
   react.useImperativeHandle(ref, function () {
@@ -215,7 +702,7 @@ var FormErrorListWithErrors = /*#__PURE__*/react.forwardRef(function (_ref, ref)
       setHasFocusedOnce(true);
     }
   }, [innerRef]);
-  return jsxRuntime.jsx(Alert, _objectSpread$1k(_objectSpread$1k({}, restProps), {}, {
+  return jsxRuntime.jsx(Alert, _objectSpread$1j(_objectSpread$1j({}, restProps), {}, {
     className: clsx('ams-form-error-list', className),
     heading: heading,
     headingLevel: headingLevel,
@@ -236,7 +723,7 @@ var FormErrorListWithErrors = /*#__PURE__*/react.forwardRef(function (_ref, ref)
 });
 FormErrorListWithErrors.displayName = 'FormErrorListWithErrors';
-var useAddErrorCountToDocumentTitle = function useAddErrorCountToDocumentTitle( /** The list of error messages used to calculate the error count. */
+var useAddErrorCountToDocumentTitle = function useAddErrorCountToDocumentTitle(/** The list of error messages used to calculate the error count. */
 errors) {
   var label = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
     plural: 'invoerfouten',
@@ -260,13 +747,13 @@ errors) {
   return null;
 };
-var _excluded$1d = ["errors", "errorCountLabel"];
-function ownKeys$1j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1j(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1c = ["errors", "errorCountLabel"];
+function ownKeys$1i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1i(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FormErrorList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var errors = _ref.errors,
     errorCountLabel = _ref.errorCountLabel,
-    restProps = _objectWithoutProperties(_ref, _excluded$1d);
+    restProps = _objectWithoutProperties(_ref, _excluded$1c);
   // A Form Error List without errors only resets the document title.
   // With errors, it renders the FormErrorListWithErrors component.
   useAddErrorCountToDocumentTitle(errors, errorCountLabel);
@@ -277,7 +764,7 @@ var FormErrorList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
     hasFocusedOnce = _useState2[0],
     setHasFocusedOnce = _useState2[1];
   if (errors.length === 0) return undefined;
-  return jsxRuntime.jsx(FormErrorListWithErrors, _objectSpread$1j(_objectSpread$1j({}, restProps), {}, {
+  return jsxRuntime.jsx(FormErrorListWithErrors, _objectSpread$1i(_objectSpread$1i({}, restProps), {}, {
     errors: errors,
     hasFocusedOnce: hasFocusedOnce,
     ref: ref,
@@ -286,17 +773,17 @@ var FormErrorList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 FormErrorList.displayName = 'FormErrorList';
-var _excluded$1c = ["children", "className", "label"];
-function ownKeys$1i(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1i(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1b = ["children", "className", "label"];
+function ownKeys$1h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1h(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TableOfContentsLink = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     label = _ref.label,
-    restProps = _objectWithoutProperties(_ref, _excluded$1c);
+    restProps = _objectWithoutProperties(_ref, _excluded$1b);
   return jsxRuntime.jsxs("li", {
     className: "ams-table-of-contents__item",
-    children: [jsxRuntime.jsx("a", _objectSpread$1i(_objectSpread$1i({}, restProps), {}, {
+    children: [jsxRuntime.jsx("a", _objectSpread$1h(_objectSpread$1h({}, restProps), {}, {
       className: clsx.clsx('ams-table-of-contents__link', className),
       ref: ref,
       children: label
@@ -305,14 +792,14 @@ var TableOfContentsLink = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 TableOfContentsLink.displayName = 'TableOfContents.Link';
-var _excluded$1b = ["children", "className"];
-function ownKeys$1h(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1h(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1a = ["children", "className"];
+function ownKeys$1g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1g(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TableOfContentsList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$1b);
-  return jsxRuntime.jsx("ul", _objectSpread$1h(_objectSpread$1h({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$1a);
+  return jsxRuntime.jsx("ul", _objectSpread$1g(_objectSpread$1g({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-table-of-contents__list', className),
     children: children
@@ -320,17 +807,17 @@ var TableOfContentsList = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 TableOfContentsList.displayName = 'TableOfContents.List';
-var _excluded$1a = ["children", "className", "heading", "headingLevel"];
-function ownKeys$1g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1g(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$19 = ["children", "className", "heading", "headingLevel"];
+function ownKeys$1f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1f(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TableOfContentsRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     heading = _ref.heading,
     _ref$headingLevel = _ref.headingLevel,
     headingLevel = _ref$headingLevel === void 0 ? 2 : _ref$headingLevel,
-    restProps = _objectWithoutProperties(_ref, _excluded$1a);
-  return jsxRuntime.jsxs("nav", _objectSpread$1g(_objectSpread$1g({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$19);
+  return jsxRuntime.jsxs("nav", _objectSpread$1f(_objectSpread$1f({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-table-of-contents', className),
     children: [heading && jsxRuntime.jsx(Heading, {
@@ -347,16 +834,16 @@ var TableOfContents = Object.assign(TableOfContentsRoot, {
   List: TableOfContentsList
 });
-var _excluded$19 = ["children", "className", "prefix"];
-function ownKeys$1f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1f(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$18 = ["children", "className", "prefix"];
+function ownKeys$1e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1e(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ErrorMessage = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     _ref$prefix = _ref.prefix,
     prefix = _ref$prefix === void 0 ? 'Invoerfout' : _ref$prefix,
-    restProps = _objectWithoutProperties(_ref, _excluded$19);
-  return jsxRuntime.jsxs("p", _objectSpread$1f(_objectSpread$1f({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$18);
+  return jsxRuntime.jsxs("p", _objectSpread$1e(_objectSpread$1e({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-error-message', className),
     children: [jsxRuntime.jsxs("span", {
@@ -367,13 +854,13 @@ var ErrorMessage = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 ErrorMessage.displayName = 'ErrorMessage';
-var _excluded$18 = ["className"];
-function ownKeys$1e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1e(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$17 = ["className"];
+function ownKeys$1d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1d(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FileInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$18);
-  return jsxRuntime.jsx("input", _objectSpread$1e(_objectSpread$1e({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$17);
+  return jsxRuntime.jsx("input", _objectSpread$1d(_objectSpread$1d({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-file-input', className),
     type: "file"
@@ -381,15 +868,15 @@ var FileInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 FileInput.displayName = 'FileInput';
-var _excluded$17 = ["children", "className", "invalid"];
-function ownKeys$1d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1d(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$16 = ["children", "className", "invalid"];
+function ownKeys$1c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Field = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     invalid = _ref.invalid,
-    restProps = _objectWithoutProperties(_ref, _excluded$17);
-  return jsxRuntime.jsx("div", _objectSpread$1d(_objectSpread$1d({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$16);
+  return jsxRuntime.jsx("div", _objectSpread$1c(_objectSpread$1c({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-field', invalid && 'ams-field--invalid', className),
     children: children
@@ -397,14 +884,14 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 Field.displayName = 'Field';
-var _excluded$16 = ["children", "className"];
-function ownKeys$1c(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$15 = ["children", "className"];
+function ownKeys$1b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SelectOption = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$16);
-  return jsxRuntime.jsx("option", _objectSpread$1c(_objectSpread$1c({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$15);
+  return jsxRuntime.jsx("option", _objectSpread$1b(_objectSpread$1b({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-select__option', className),
     children: children
@@ -412,14 +899,14 @@ var SelectOption = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 SelectOption.displayName = 'Select.Option';
-var _excluded$15 = ["children", "className"];
-function ownKeys$1b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$14 = ["children", "className"];
+function ownKeys$1a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SelectOptionGroup = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    restProps = _objectWithoutProperties(_ref, _excluded$15);
-  return jsxRuntime.jsx("optgroup", _objectSpread$1b(_objectSpread$1b({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$14);
+  return jsxRuntime.jsx("optgroup", _objectSpread$1a(_objectSpread$1a({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-select__group', className),
     children: children
@@ -427,15 +914,15 @@ var SelectOptionGroup = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 SelectOptionGroup.displayName = 'Select.Group';
-var _excluded$14 = ["children", "className", "invalid"];
-function ownKeys$1a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$13 = ["children", "className", "invalid"];
+function ownKeys$19(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$19(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$19(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$19(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var SelectRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     invalid = _ref.invalid,
-    restProps = _objectWithoutProperties(_ref, _excluded$14);
-  return jsxRuntime.jsx("select", _objectSpread$1a(_objectSpread$1a({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$13);
+  return jsxRuntime.jsx("select", _objectSpread$19(_objectSpread$19({}, restProps), {}, {
     "aria-invalid": invalid || undefined,
     className: clsx('ams-select', className),
     ref: ref,
@@ -448,14 +935,14 @@ var Select = Object.assign(SelectRoot, {
   Group: SelectOptionGroup
 });
-var _excluded$13 = ["className", "invalid"];
-function ownKeys$19(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$19(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$19(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$19(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$12 = ["className", "invalid"];
+function ownKeys$18(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$18(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$18(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$18(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var TimeInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     invalid = _ref.invalid,
-    restProps = _objectWithoutProperties(_ref, _excluded$13);
-  return jsxRuntime.jsx("input", _objectSpread$19(_objectSpread$19({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$12);
+  return jsxRuntime.jsx("input", _objectSpread$18(_objectSpread$18({}, restProps), {}, {
     "aria-invalid": invalid || undefined,
     className: clsx('ams-time-input', className),
     ref: ref,
@@ -464,16 +951,16 @@ var TimeInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 TimeInput.displayName = 'TimeInput';
-var _excluded$12 = ["className", "invalid", "type"];
-function ownKeys$18(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$18(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$18(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$18(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$11 = ["className", "invalid", "type"];
+function ownKeys$17(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$17(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$17(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$17(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DateInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     invalid = _ref.invalid,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'date' : _ref$type,
-    restProps = _objectWithoutProperties(_ref, _excluded$12);
-  return jsxRuntime.jsx("input", _objectSpread$18(_objectSpread$18({}, restProps), {}, {
+    restProps = _objectWithoutProperties(_ref, _excluded$11);
+  return jsxRuntime.jsx("input", _objectSpread$17(_objectSpread$17({}, restProps), {}, {
     "aria-invalid": invalid || undefined,
     className: clsx('ams-date-input', className),
     ref: ref,
@@ -482,21 +969,6 @@ var DateInput = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 DateInput.displayName = 'DateInput';
-var _excluded$11 = ["className", "cover"];
-function ownKeys$17(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$17(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$17(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$17(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Image = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    _ref$cover = _ref.cover,
-    cover = _ref$cover === void 0 ? false : _ref$cover,
-    restProps = _objectWithoutProperties(_ref, _excluded$11);
-  return jsxRuntime.jsx("img", _objectSpread$17(_objectSpread$17({}, restProps), {}, {
-    ref: ref,
-    className: clsx('ams-image', cover && 'ams-image--cover', className)
-  }));
-});
-Image.displayName = 'Image';
 var _excluded$10 = ["label", "imageSrc", "className", "color"];
 function ownKeys$16(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$16(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$16(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$16(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -590,17 +1062,18 @@ var DescriptionListTerm = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 DescriptionListTerm.displayName = 'DescriptionList.Term';
-var _excluded$Y = ["children", "className", "inverseColor"];
+var _excluded$Y = ["children", "className", "inverseColor", "termsWidth"];
 function ownKeys$12(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$12(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$12(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$12(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DescriptionListRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     inverseColor = _ref.inverseColor,
+    termsWidth = _ref.termsWidth,
     restProps = _objectWithoutProperties(_ref, _excluded$Y);
   return jsxRuntime.jsx("dl", _objectSpread$12(_objectSpread$12({}, restProps), {}, {
     ref: ref,
-    className: clsx('ams-description-list', inverseColor && 'ams-description-list--inverse-color', className),
+    className: clsx('ams-description-list', "ams-description-list--terms-width-".concat(termsWidth), inverseColor && 'ams-description-list--inverse-color', className),
     children: children
   }));
 });
@@ -631,12 +1104,13 @@ var Row = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 Row.displayName = 'Row';
-var _excluded$W = ["children", "className", "invalid"];
+var _excluded$W = ["children", "className", "icon", "invalid"];
 function ownKeys$10(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$10(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$10(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$10(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Radio = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
+    icon = _ref.icon,
     invalid = _ref.invalid,
     restProps = _objectWithoutProperties(_ref, _excluded$W);
   var id = react.useId();
@@ -655,7 +1129,8 @@ var Radio = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
         className: "ams-radio__label",
         htmlFor: id,
         children: [jsxRuntime.jsx("span", {
-          className: "ams-radio__circle"
+          className: "ams-radio__icon-container",
+          children: icon !== null && icon !== void 0 ? icon : jsxRuntime.jsx(designSystemReactIcons.RadioIcon, {})
         }), children]
       })]
     })
@@ -927,21 +1402,26 @@ var Column = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
 });
 Column.displayName = 'Column';
-var _excluded$P = ["children", "className", "invalid", "legend"];
+var _excluded$P = ["children", "className", "hint", "invalid", "legend", "optional"];
 function ownKeys$V(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$V(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$V(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$V(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FieldSet = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
+    hint = _ref.hint,
     invalid = _ref.invalid,
     legend = _ref.legend,
+    optional = _ref.optional,
     restProps = _objectWithoutProperties(_ref, _excluded$P);
   return jsxRuntime.jsxs("fieldset", _objectSpread$V(_objectSpread$V({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-field-set', invalid && 'ams-field-set--invalid', className),
-    children: [jsxRuntime.jsx("legend", {
+    children: [jsxRuntime.jsxs("legend", {
       className: "ams-field-set__legend",
-      children: legend
+      children: [legend, " ", jsxRuntime.jsx(Hint, {
+        hint: hint,
+        optional: optional
+      })]
     }), children]
   }));
 });
@@ -1516,46 +1996,55 @@ var SearchField = Object.assign(SearchFieldRoot, {
   Input: SearchFieldInput
 });
-var _excluded$u = ["actions", "children", "className", "closeButtonLabel", "heading"];
+var _excluded$u = ["children", "className", "closeButtonLabel", "footer", "heading"];
 function ownKeys$u(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$u(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$u(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$u(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Dialog = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
-  var actions = _ref.actions,
-    children = _ref.children,
+var closeDialog = function closeDialog(event) {
+  var _event$currentTarget$;
+  return (_event$currentTarget$ = event.currentTarget.closest('dialog')) === null || _event$currentTarget$ === void 0 ? void 0 : _event$currentTarget$.close();
+};
+var openDialog = function openDialog(id) {
+  var _document$querySelect;
+  return (_document$querySelect = document.querySelector(id)) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.showModal();
+};
+var DialogRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
     className = _ref.className,
     _ref$closeButtonLabel = _ref.closeButtonLabel,
     closeButtonLabel = _ref$closeButtonLabel === void 0 ? 'Sluiten' : _ref$closeButtonLabel,
+    footer = _ref.footer,
     heading = _ref.heading,
     restProps = _objectWithoutProperties(_ref, _excluded$u);
-  return jsxRuntime.jsx("dialog", _objectSpread$u(_objectSpread$u({}, restProps), {}, {
+  return jsxRuntime.jsxs("dialog", _objectSpread$u(_objectSpread$u({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-dialog', className),
-    children: jsxRuntime.jsxs("form", {
-      method: "dialog",
-      className: "ams-dialog__form",
-      children: [jsxRuntime.jsxs("header", {
-        className: "ams-dialog__header",
-        children: [jsxRuntime.jsx(Heading, {
-          size: "level-4",
-          children: heading
-        }), jsxRuntime.jsx(IconButton, {
-          formNoValidate: true,
-          label: closeButtonLabel,
-          size: "level-4"
-        })]
-      }), jsxRuntime.jsx("article", {
-        className: "ams-dialog__article",
-        children: children
-      }), actions && jsxRuntime.jsx("footer", {
-        className: "ams-dialog__footer",
-        children: actions
+    children: [jsxRuntime.jsxs("header", {
+      className: "ams-dialog__header",
+      children: [jsxRuntime.jsx(Heading, {
+        size: "level-4",
+        children: heading
+      }), jsxRuntime.jsx(IconButton, {
+        label: closeButtonLabel,
+        onClick: closeDialog,
+        size: "level-4",
+        type: "button"
       })]
-    })
+    }), jsxRuntime.jsx("div", {
+      className: "ams-dialog__body",
+      children: children
+    }), footer && jsxRuntime.jsx("footer", {
+      className: "ams-dialog__footer",
+      children: footer
+    })]
   }));
 });
-Dialog.displayName = 'Dialog';
+DialogRoot.displayName = 'Dialog';
+var Dialog = Object.assign(DialogRoot, {
+  close: closeDialog,
+  open: openDialog
+});
-var _excluded$t = ["className", "maxVisiblePages", "nextAriaLabel", "nextLabel", "onPageChange", "page", "previousAriaLabel", "previousLabel", "totalPages"];
+var _excluded$t = ["className", "maxVisiblePages", "nextLabel", "nextVisuallyHiddenLabel", "onPageChange", "page", "previousLabel", "previousVisuallyHiddenLabel", "totalPages", "visuallyHiddenLabel"];
 function ownKeys$t(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$t(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$t(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$t(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /**
@@ -1607,18 +2096,20 @@ var Pagination = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var className = _ref.className,
     _ref$maxVisiblePages = _ref.maxVisiblePages,
     maxVisiblePages = _ref$maxVisiblePages === void 0 ? 7 : _ref$maxVisiblePages,
-    _ref$nextAriaLabel = _ref.nextAriaLabel,
-    nextAriaLabel = _ref$nextAriaLabel === void 0 ? 'Volgende pagina' : _ref$nextAriaLabel,
     _ref$nextLabel = _ref.nextLabel,
     nextLabel = _ref$nextLabel === void 0 ? 'volgende' : _ref$nextLabel,
+    _ref$nextVisuallyHidd = _ref.nextVisuallyHiddenLabel,
+    nextVisuallyHiddenLabel = _ref$nextVisuallyHidd === void 0 ? 'Volgende pagina' : _ref$nextVisuallyHidd,
     onPageChange = _ref.onPageChange,
     _ref$page = _ref.page,
     page = _ref$page === void 0 ? 1 : _ref$page,
-    _ref$previousAriaLabe = _ref.previousAriaLabel,
-    previousAriaLabel = _ref$previousAriaLabe === void 0 ? 'Vorige pagina' : _ref$previousAriaLabe,
     _ref$previousLabel = _ref.previousLabel,
     previousLabel = _ref$previousLabel === void 0 ? 'vorige' : _ref$previousLabel,
+    _ref$previousVisually = _ref.previousVisuallyHiddenLabel,
+    previousVisuallyHiddenLabel = _ref$previousVisually === void 0 ? 'Vorige pagina' : _ref$previousVisually,
     totalPages = _ref.totalPages,
+    _ref$visuallyHiddenLa = _ref.visuallyHiddenLabel,
+    visuallyHiddenLabel = _ref$visuallyHiddenLa === void 0 ? 'Paginering' : _ref$visuallyHiddenLa,
     restProps = _objectWithoutProperties(_ref, _excluded$t);
   var _useState = react.useState(page),
     _useState2 = _slicedToArray(_useState, 2),
@@ -1640,19 +2131,23 @@ var Pagination = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var onNext = function onNext() {
     onChangePage(currentPage + 1);
   };
+  var navLabelId = react.useId();
   // Don't show pagination if you only have one page
   if (totalPages <= 1) {
     return null;
   }
-  return jsxRuntime.jsx("nav", _objectSpread$t(_objectSpread$t({}, restProps), {}, {
+  return jsxRuntime.jsxs("nav", _objectSpread$t(_objectSpread$t({}, restProps), {}, {
+    "aria-labelledby": navLabelId,
     className: clsx('ams-pagination', className),
     ref: ref,
-    "aria-label": "Paginering",
-    children: jsxRuntime.jsxs("ol", {
+    children: [jsxRuntime.jsx("span", {
+      id: navLabelId,
+      className: "ams-visually-hidden",
+      children: visuallyHiddenLabel
+    }), jsxRuntime.jsxs("ol", {
       className: "ams-pagination__list",
       children: [jsxRuntime.jsx("li", {
         children: jsxRuntime.jsxs("button", {
-          "aria-label": previousAriaLabel,
           className: "ams-pagination__button",
           disabled: currentPage === 1,
           onClick: onPrevious,
@@ -1660,20 +2155,31 @@ var Pagination = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
           children: [jsxRuntime.jsx(Icon, {
             svg: designSystemReactIcons.ChevronLeftIcon,
             size: "level-5"
-          }), previousLabel]
+          }), jsxRuntime.jsx("span", {
+            className: "ams-visually-hidden",
+            children: previousVisuallyHiddenLabel
+          }), jsxRuntime.jsx("span", {
+            "aria-hidden": true,
+            children: previousLabel
+          })]
         })
       }), range.map(function (pageNumberOrSpacer) {
         return typeof pageNumberOrSpacer === 'number' ? jsxRuntime.jsx("li", {
-          children: jsxRuntime.jsx("button", {
+          children: jsxRuntime.jsxs("button", {
             "aria-current": pageNumberOrSpacer === currentPage ? true : undefined,
-            "aria-label": pageNumberOrSpacer === currentPage ? "Pagina ".concat(pageNumberOrSpacer) : "Ga naar pagina ".concat(pageNumberOrSpacer),
             className: clsx('ams-pagination__button', pageNumberOrSpacer === currentPage && 'ams-pagination__button--current'),
             onClick: function onClick() {
               return pageNumberOrSpacer !== currentPage && onChangePage(pageNumberOrSpacer);
             },
             tabIndex: pageNumberOrSpacer === currentPage ? -1 : 0,
             type: "button",
-            children: pageNumberOrSpacer
+            children: [jsxRuntime.jsx("span", {
+              className: "ams-visually-hidden",
+              children: pageNumberOrSpacer === currentPage ? "Pagina ".concat(pageNumberOrSpacer) : "Ga naar pagina ".concat(pageNumberOrSpacer)
+            }), jsxRuntime.jsx("span", {
+              "aria-hidden": true,
+              children: pageNumberOrSpacer
+            })]
           })
         }, pageNumberOrSpacer) : jsxRuntime.jsx("li", {
           "aria-hidden": true,
@@ -1682,18 +2188,23 @@ var Pagination = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
         }, pageNumberOrSpacer);
       }), jsxRuntime.jsx("li", {
         children: jsxRuntime.jsxs("button", {
-          "aria-label": nextAriaLabel,
           className: "ams-pagination__button",
           disabled: currentPage === totalPages,
           onClick: onNext,
           type: "button",
-          children: [nextLabel, jsxRuntime.jsx(Icon, {
+          children: [jsxRuntime.jsx("span", {
+            className: "ams-visually-hidden",
+            children: nextVisuallyHiddenLabel
+          }), jsxRuntime.jsx("span", {
+            "aria-hidden": true,
+            children: nextLabel
+          }), jsxRuntime.jsx(Icon, {
             svg: designSystemReactIcons.ChevronRightIcon,
             size: "level-5"
           })]
         })
       })]
-    })
+    })]
   }));
 });
 Pagination.displayName = 'Pagination';
@@ -2118,61 +2629,90 @@ var Breadcrumb = Object.assign(BreadcrumbRoot, {
   Link: BreadcrumbLink
 });
-var _excluded$7 = ["children", "variant", "onBackground", "className"];
+var _excluded$7 = ["children", "className", "contrastColor", "inverseColor", "variant"];
 function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Link = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
+    className = _ref.className,
+    contrastColor = _ref.contrastColor,
+    inverseColor = _ref.inverseColor,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'standalone' : _ref$variant,
-    onBackground = _ref.onBackground,
-    className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded$7);
   return jsxRuntime.jsx("a", _objectSpread$7(_objectSpread$7({}, restProps), {}, {
     ref: ref,
-    className: clsx('ams-link', {
-      'ams-link--standalone': variant === 'standalone',
-      'ams-link--inline': variant === 'inline',
-      'ams-link--on-background-light': onBackground === 'light',
-      'ams-link--on-background-dark': onBackground === 'dark'
-    }, className),
+    className: clsx('ams-link', contrastColor && 'ams-link--contrast-color', inverseColor && 'ams-link--inverse-color', variant === 'inline' && 'ams-link--inline', variant === 'standalone' && 'ams-link--standalone', className),
     children: children
   }));
 });
 Link.displayName = 'Link';
-var _excluded$6 = ["children", "className", "type", "disabled", "variant"];
+var _excluded$6 = ["children", "className", "disabled", "icon", "iconBefore", "iconOnly", "type", "variant"];
 function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Button = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
-    type = _ref.type,
     disabled = _ref.disabled,
+    icon = _ref.icon,
+    iconBefore = _ref.iconBefore,
+    iconOnly = _ref.iconOnly,
+    type = _ref.type,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
     restProps = _objectWithoutProperties(_ref, _excluded$6);
+  var content = function content() {
+    switch (true) {
+      case !icon:
+        return children;
+      case iconBefore:
+        return [jsxRuntime.jsx(Icon, {
+          svg: icon,
+          size: "level-5"
+        }), children];
+      case iconOnly:
+        return [jsxRuntime.jsx(Icon, {
+          svg: icon,
+          size: "level-5",
+          square: true
+        }, 1), jsxRuntime.jsx("span", {
+          className: "ams-visually-hidden",
+          children: children
+        }, 2)];
+      default:
+        return [children, jsxRuntime.jsx(Icon, {
+          svg: icon,
+          size: "level-5"
+        })];
+    }
+  };
   return jsxRuntime.jsx("button", _objectSpread$6(_objectSpread$6({}, restProps), {}, {
-    ref: ref,
+    className: clsx('ams-button', "ams-button--".concat(variant), icon && iconOnly && !iconBefore && "ams-button--icon-only", className),
     disabled: disabled,
-    className: clsx('ams-button', "ams-button--".concat(variant), className),
+    ref: ref,
     type: type || 'button',
-    children: children
+    children: content()
   }));
 });
 Button.displayName = 'Button';
-var _excluded$5 = ["children", "className"];
+var _excluded$5 = ["children", "className", "hint", "optional"];
 function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Label = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
+    hint = _ref.hint,
+    optional = _ref.optional,
     restProps = _objectWithoutProperties(_ref, _excluded$5);
-  return jsxRuntime.jsx("label", _objectSpread$5(_objectSpread$5({}, restProps), {}, {
+  return jsxRuntime.jsxs("label", _objectSpread$5(_objectSpread$5({}, restProps), {}, {
     ref: ref,
     className: clsx('ams-label', className),
-    children: children
+    children: [children, " ", jsxRuntime.jsx(Hint, {
+      hint: hint,
+      optional: optional
+    })]
   }));
 });
 Label.displayName = 'Label';
@@ -2314,34 +2854,6 @@ var Accordion = Object.assign(AccordionRoot, {
   Section: AccordionSection
 });
-/**
- * @license EUPL-1.2+
- * Copyright Gemeente Amsterdam
- */
-var gridCellClasses = function gridCellClasses(span, start) {
-  if (!span && !start) {
-    return [];
-  }
-  var classes = [];
-  if (span === 'all' || typeof span === 'number') {
-    classes.push("ams-grid__cell--span-".concat(span));
-  } else if (span) {
-    var narrow = span.narrow,
-      medium = span.medium,
-      wide = span.wide;
-    classes.push("ams-grid__cell--span-".concat(narrow), "ams-grid__cell--span-".concat(medium, "-medium"), "ams-grid__cell--span-".concat(wide, "-wide"));
-  }
-  if (typeof start === 'number') {
-    classes.push("ams-grid__cell--start-".concat(start));
-  } else if (start) {
-    var _narrow = start.narrow,
-      _medium = start.medium,
-      _wide = start.wide;
-    classes.push("ams-grid__cell--start-".concat(_narrow), "ams-grid__cell--start-".concat(_medium, "-medium"), "ams-grid__cell--start-".concat(_wide, "-wide"));
-  }
-  return classes;
-};
 var _excluded$1 = ["as", "children", "className", "span", "start"];
 function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -2364,19 +2876,6 @@ GridCell.displayName = 'Grid.Cell';
 var _excluded = ["children", "className", "gapVertical", "paddingBottom", "paddingTop", "paddingVertical"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var paddingClasses = function paddingClasses(paddingBottom, paddingTop, paddingVertical) {
-  var classes = [];
-  if (paddingVertical) {
-    return ["ams-grid--padding-vertical--".concat(paddingVertical)];
-  }
-  if (paddingBottom) {
-    classes.push("ams-grid--padding-bottom--".concat(paddingBottom));
-  }
-  if (paddingTop) {
-    classes.push("ams-grid--padding-top--".concat(paddingTop));
-  }
-  return classes;
-};
 var GridRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
@@ -2387,7 +2886,7 @@ var GridRoot = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
     restProps = _objectWithoutProperties(_ref, _excluded);
   return jsxRuntime.jsx("div", _objectSpread(_objectSpread({}, restProps), {}, {
     ref: ref,
-    className: clsx('ams-grid', gapVertical && "ams-grid--gap-vertical--".concat(gapVertical), paddingClasses(paddingBottom, paddingTop, paddingVertical), className),
+    className: clsx('ams-grid', gapVertical && "ams-grid--gap-vertical--".concat(gapVertical), paddingClasses('grid', paddingBottom, paddingTop, paddingVertical), className),
     children: children
   }));
 });
@@ -2397,12 +2896,14 @@ var Grid = Object.assign(GridRoot, {
 });
 exports.Accordion = Accordion;
+exports.ActionGroup = ActionGroup;
 exports.Alert = Alert;
 exports.AspectRatio = AspectRatio;
 exports.Avatar = Avatar;
 exports.Badge = Badge;
 exports.Blockquote = Blockquote;
 exports.Breadcrumb = Breadcrumb;
+exports.Breakout = Breakout;
 exports.Button = Button;
 exports.Card = Card;
 exports.CharacterCount = CharacterCount;
@@ -2420,9 +2921,11 @@ exports.FormErrorList = FormErrorList;
 exports.Grid = Grid;
 exports.Header = Header;
 exports.Heading = Heading;
+exports.Hint = Hint;
 exports.Icon = Icon;
 exports.IconButton = IconButton;
 exports.Image = Image;
+exports.ImageSlider = ImageSlider;
 exports.Label = Label;
 exports.Link = Link;
 exports.LinkList = LinkList;
@@ -2435,6 +2938,7 @@ exports.PageHeading = PageHeading;
 exports.PageMenu = PageMenu;
 exports.Pagination = Pagination;
 exports.Paragraph = Paragraph;
+exports.PasswordInput = PasswordInput;
 exports.Radio = Radio;
 exports.Row = Row;
 exports.Screen = Screen;