@dso-toolkit/core 101.2.0 → 103.0.0

package/dist/types/components/shopping-cart/shopping-cart.d.ts

@@ -1,25 +1,18 @@
-import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
-import { ShoppingCartMode, ShoppingCartToggleEvent } from "./shopping-cart.interfaces";
+import { ComponentInterface } from "../../stencil-public-runtime";
+import { ShoppingCartMode } from "./shopping-cart.interfaces";
 /**
  * @slot - The slot to place the `dso-shopping-cart-item` elements in.
  * @slot heading - The title of the Shopping Cart, as a heading element (e.g. `<h3 slot="heading">`) matching the
  * heading hierarchy of the page.
+ * @slot button - An optional slot to place a button in the header of the Shopping Cart, e.g. a "Sluiten" button
+ * (main), an "Openen" Icon Button (side) or a tertiary "Alles verwijderen" button.
+ * @slot warning - An optional explanation of the warning icon of the Shopping Cart Items, e.g. a `<p>` starting with
+ * "Let op:". Shown below the items on a white background spanning the full width of the Shopping Cart.
  */
 export declare class ShoppingCart implements ComponentInterface {
     /**
      * The mode of the Shopping Cart.
      */
     mode: ShoppingCartMode;
-    /**
-     * When set, a toggle button is rendered. In the `side` mode this is a button to expand the Shopping Cart, in the
-     * `main` mode this is a button to collapse the Shopping Cart.
-     */
-    toggleable: boolean;
-    /**
-     * Emitted when the user clicks the toggle button (the button in the `side` mode or the "Sluiten" button in the
-     * `main` mode).
-     */
-    dsoToggle: EventEmitter<ShoppingCartToggleEvent>;
-    private renderToggle;
     render(): any;
 }

package/dist/types/components/shopping-cart/shopping-cart.interfaces.d.ts

@@ -1,4 +1 @@
 export type ShoppingCartMode = "side" | "main";
-export interface ShoppingCartToggleEvent {
-    originalEvent: MouseEvent;
-}

package/dist/types/components.d.ts

@@ -52,7 +52,7 @@ import { ResponsiveElementSize } from "./components/responsive-element/responsiv
 import { DsoScrollEndEvent } from "./components/scrollable/scrollable.interfaces";
 import { SegmentedButtonChangeEvent, SegmentedButtonOption } from "./components/segmented-button/segmented-button.interfaces";
 import { SelectableChangeEvent } from "./components/selectable/selectable.interfaces";
-import { ShoppingCartMode, ShoppingCartToggleEvent } from "./components/shopping-cart/shopping-cart.interfaces";
+import { ShoppingCartMode } from "./components/shopping-cart/shopping-cart.interfaces";
 import { ShoppingCartItemCloseEvent, ShoppingCartItemDeleteEvent, ShoppingCartItemEditEvent, ShoppingCartItemMode } from "./components/shopping-cart/shopping-cart-item/shopping-cart-item.interfaces";
 import { SkiplinkClickEvent } from "./components/skiplink/skiplink.interfaces";
 import { SlideToggleActiveEvent } from "./components/slide-toggle/slide-toggle.interfaces";
@@ -108,7 +108,7 @@ export { ResponsiveElementSize } from "./components/responsive-element/responsiv
 export { DsoScrollEndEvent } from "./components/scrollable/scrollable.interfaces";
 export { SegmentedButtonChangeEvent, SegmentedButtonOption } from "./components/segmented-button/segmented-button.interfaces";
 export { SelectableChangeEvent } from "./components/selectable/selectable.interfaces";
-export { ShoppingCartMode, ShoppingCartToggleEvent } from "./components/shopping-cart/shopping-cart.interfaces";
+export { ShoppingCartMode } from "./components/shopping-cart/shopping-cart.interfaces";
 export { ShoppingCartItemCloseEvent, ShoppingCartItemDeleteEvent, ShoppingCartItemEditEvent, ShoppingCartItemMode } from "./components/shopping-cart/shopping-cart-item/shopping-cart-item.interfaces";
 export { SkiplinkClickEvent } from "./components/skiplink/skiplink.interfaces";
 export { SlideToggleActiveEvent } from "./components/slide-toggle/slide-toggle.interfaces";
@@ -266,10 +266,6 @@ export namespace Components {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De noemer van de locatie.
          */
@@ -296,10 +292,6 @@ export namespace Components {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De naam van de gebiedsaanwijzing.
          */
@@ -328,10 +320,6 @@ export namespace Components {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De noemer van de locatie.
          */
@@ -350,10 +338,6 @@ export namespace Components {
           * De eenheid van de omgevingsnorm of omgevingswaarde.
          */
         "eenheid"?: RenvooiValue | string;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De naam van de omgevingsnorm of omgevingswaarde.
          */
@@ -561,6 +545,11 @@ export namespace Components {
           * Marks Document Component as reserved.
          */
         "gereserveerd": DocumentComponentInputType | undefined;
+        /**
+          * Returns the rendered element of the STOP element with the given `eId` in the Kop or Inhoud of this Document Component, or `undefined` when it is not rendered (e.g. when the Document Component is closed). Nested Document Components are not searched.
+          * @param eId The `eId` attribute value of the STOP element, e.g. `chp_1__art_1.1__list_o_1__item_1`.
+         */
+        "getElementByEId": (eId: string) => Promise<HTMLElement | undefined>;
         /**
           * The heading level to use (only in mode="document"). When the level is 6 or lower a native heading element (`<h2>` … `<h6>`) is rendered; deeper levels are rendered as `<div role="heading" aria-level="*">` because HTML has no native heading elements beyond `<h6>`. In mode="table-of-contents" the nested lists carry the structure and no heading is rendered.
           * @default 2
@@ -798,6 +787,14 @@ export namespace Components {
         "icon"?: IconAlias;
     }
     interface DsoIconButton {
+        /**
+          * The element controlled by the button. Sets `ariaControlsElements` on the native button when supported. Intended for a wrapping component passing an element across a shadow boundary.
+         */
+        "controlsElement"?: HTMLElement;
+        /**
+          * The element describing the button. Sets `ariaDescribedByElements` on the native button when supported. Intended for a wrapping component passing an element across a shadow boundary.
+         */
+        "describedByElement"?: HTMLElement;
         /**
           * To disable the Icon Button
           * @default false
@@ -856,6 +853,10 @@ export namespace Components {
           * @default false
          */
         "active": boolean;
+        /**
+          * The id of the element (e.g. `<dso-info>`) that is expanded or collapsed by this Info Button. The element must be in the same document or shadow root as the Info Button. When a toggletip is present, this property is ignored. Without a toggletip, `aria-expanded` is only set when `controls` is provided.
+         */
+        "controls"?: string;
         /**
           * The label.
           * @default "Toelichting bij optie"
@@ -1153,6 +1154,11 @@ export namespace Components {
           * The XML to be rendered.
          */
         "content"?: OzonContentInputType;
+        /**
+          * Returns the rendered element of the STOP element with the given `eId`, or `undefined` when it is not rendered.
+          * @param eId The `eId` attribute value of the STOP element, e.g. `chp_1__art_1.1__list_o_1__item_1`.
+         */
+        "getElementByEId": (eId: string) => Promise<HTMLElement | undefined>;
         /**
           * Setting this property creates dso-ozon-content as inline element instead of a block element.
           * @default false
@@ -1357,11 +1363,6 @@ export namespace Components {
           * @default "side"
          */
         "mode": ShoppingCartMode;
-        /**
-          * When set, a toggle button is rendered. In the `side` mode this is a button to expand the Shopping Cart, in the `main` mode this is a button to collapse the Shopping Cart.
-          * @default false
-         */
-        "toggleable": boolean;
     }
     interface DsoShoppingCartItem {
         /**
@@ -1380,10 +1381,9 @@ export namespace Components {
          */
         "removable": boolean;
         /**
-          * When set a warning icon is rendered before the name.
-          * @default false
+          * The warning text. When set, a warning icon is rendered before the name and the text is available to assistive technology. Explain the meaning of the icon visually in the `warning` slot of `dso-shopping-cart`.
          */
-        "warning": boolean;
+        "warning"?: string;
     }
     interface DsoSkiplink {
         /**
@@ -1729,10 +1729,6 @@ export interface DsoSelectableCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDsoSelectableElement;
 }
-export interface DsoShoppingCartCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLDsoShoppingCartElement;
-}
 export interface DsoShoppingCartItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDsoShoppingCartItemElement;
@@ -2690,18 +2686,7 @@ declare global {
         prototype: HTMLDsoSelectableElement;
         new (): HTMLDsoSelectableElement;
     };
-    interface HTMLDsoShoppingCartElementEventMap {
-        "dsoToggle": ShoppingCartToggleEvent;
-    }
     interface HTMLDsoShoppingCartElement extends Components.DsoShoppingCart, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLDsoShoppingCartElementEventMap>(type: K, listener: (this: HTMLDsoShoppingCartElement, ev: DsoShoppingCartCustomEvent<HTMLDsoShoppingCartElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLDsoShoppingCartElementEventMap>(type: K, listener: (this: HTMLDsoShoppingCartElement, ev: DsoShoppingCartCustomEvent<HTMLDsoShoppingCartElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
     var HTMLDsoShoppingCartElement: {
         prototype: HTMLDsoShoppingCartElement;
@@ -3135,10 +3120,6 @@ declare namespace LocalJSX {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De noemer van de locatie.
          */
@@ -3169,10 +3150,6 @@ declare namespace LocalJSX {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De naam van de gebiedsaanwijzing.
          */
@@ -3209,10 +3186,6 @@ declare namespace LocalJSX {
           * Een optionele boolean die aangeeft of de annotatie actief is.
          */
         "active"?: boolean;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De noemer van de locatie.
          */
@@ -3235,10 +3208,6 @@ declare namespace LocalJSX {
           * De eenheid van de omgevingsnorm of omgevingswaarde.
          */
         "eenheid"?: RenvooiValue | string;
-        /**
-          * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.
-         */
-        "gewijzigdeLocatie"?: boolean;
         /**
           * De naam van de omgevingsnorm of omgevingswaarde.
          */
@@ -3773,6 +3742,14 @@ declare namespace LocalJSX {
         "icon"?: IconAlias;
     }
     interface DsoIconButton {
+        /**
+          * The element controlled by the button. Sets `ariaControlsElements` on the native button when supported. Intended for a wrapping component passing an element across a shadow boundary.
+         */
+        "controlsElement"?: HTMLElement;
+        /**
+          * The element describing the button. Sets `ariaDescribedByElements` on the native button when supported. Intended for a wrapping component passing an element across a shadow boundary.
+         */
+        "describedByElement"?: HTMLElement;
         /**
           * To disable the Icon Button
           * @default false
@@ -3835,6 +3812,10 @@ declare namespace LocalJSX {
           * @default false
          */
         "active"?: boolean;
+        /**
+          * The id of the element (e.g. `<dso-info>`) that is expanded or collapsed by this Info Button. The element must be in the same document or shadow root as the Info Button. When a toggletip is present, this property is ignored. Without a toggletip, `aria-expanded` is only set when `controls` is provided.
+         */
+        "controls"?: string;
         /**
           * The label.
           * @default "Toelichting bij optie"
@@ -4461,15 +4442,6 @@ declare namespace LocalJSX {
           * @default "side"
          */
         "mode"?: ShoppingCartMode;
-        /**
-          * Emitted when the user clicks the toggle button (the button in the `side` mode or the "Sluiten" button in the `main` mode).
-         */
-        "onDsoToggle"?: (event: DsoShoppingCartCustomEvent<ShoppingCartToggleEvent>) => void;
-        /**
-          * When set, a toggle button is rendered. In the `side` mode this is a button to expand the Shopping Cart, in the `main` mode this is a button to collapse the Shopping Cart.
-          * @default false
-         */
-        "toggleable"?: boolean;
     }
     interface DsoShoppingCartItem {
         /**
@@ -4500,10 +4472,9 @@ declare namespace LocalJSX {
          */
         "removable"?: boolean;
         /**
-          * When set a warning icon is rendered before the name.
-          * @default false
+          * The warning text. When set, a warning icon is rendered before the name and the text is available to assistive technology. Explain the meaning of the icon visually in the `warning` slot of `dso-shopping-cart`.
          */
-        "warning"?: boolean;
+        "warning"?: string;
     }
     interface DsoSkiplink {
         /**
@@ -4771,7 +4742,6 @@ declare namespace LocalJSX {
     interface DsoAnnotationActiviteitAttributes {
         "wijzigactie": AnnotationWijzigactie;
         "active": boolean;
-        "gewijzigdeLocatie": boolean;
         "naam": RenvooiValue | string;
         "regelKwalificatie": RenvooiValue | string;
         "regelKwalificatieVoorzetsel": string;
@@ -4779,7 +4749,6 @@ declare namespace LocalJSX {
     interface DsoAnnotationGebiedsaanwijzingAttributes {
         "wijzigactie": AnnotationWijzigactie;
         "active": boolean;
-        "gewijzigdeLocatie": boolean;
         "naam": RenvooiValue | string;
     }
     interface DsoAnnotationKaartAttributes {
@@ -4790,13 +4759,11 @@ declare namespace LocalJSX {
     interface DsoAnnotationLocatieAttributes {
         "wijzigactie": AnnotationWijzigactie;
         "active": boolean;
-        "gewijzigdeLocatie": boolean;
         "locatieNoemer": RenvooiValue | string;
     }
     interface DsoAnnotationOmgevingsnormwaardeAttributes {
         "wijzigactie": AnnotationWijzigactie;
         "active": boolean;
-        "gewijzigdeLocatie": boolean;
         "naam": RenvooiValue | string;
         "toelichting": string;
         "eenheid": RenvooiValue | string;
@@ -4941,6 +4908,7 @@ declare namespace LocalJSX {
         "active": boolean;
         "label": string;
         "toggletipPlacement": TooltipPlacement;
+        "controls": string;
     }
     interface DsoInputRangeAttributes {
         "min": number;
@@ -5082,11 +5050,10 @@ declare namespace LocalJSX {
     }
     interface DsoShoppingCartAttributes {
         "mode": ShoppingCartMode;
-        "toggleable": boolean;
     }
     interface DsoShoppingCartItemAttributes {
         "mode": ShoppingCartItemMode;
-        "warning": boolean;
+        "warning": string;
         "editable": boolean;
         "removable": boolean;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dso-toolkit/core",
-  "version": "101.2.0",
+  "version": "103.0.0",
   "description": "DSO Toolkit Web Components",
   "main": "dist/index.cjs.js",
   "module": "dist/components/index.js",
@@ -17,41 +17,41 @@
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
     "@stencil/core": "4.45.2",
-    "@stencil/store": "^2.2.4",
+    "@stencil/store": "^2.2.5",
     "clsx": "^2.1.1",
-    "dso-toolkit": "101.2.0",
+    "dso-toolkit": "103.0.0",
     "escape-string-regexp": "^5.0.0",
-    "focus-trap": "^8.2.2",
-    "i18next": "^26.4.2",
+    "focus-trap": "^8.2.3",
+    "i18next": "^26.5.2",
     "tabbable": "^6.5.0",
-    "uuid": "^14.0.2"
+    "uuid": "^14.0.3"
   },
   "devDependencies": {
-    "@stencil/angular-output-target": "^1.4.1",
-    "@stencil/react-output-target": "^1.6.2",
+    "@stencil/angular-output-target": "^1.5.2",
+    "@stencil/react-output-target": "^1.6.5",
     "@stencil/sass": "^3.3.3",
     "@types/debounce": "^1.2.4",
     "@types/lodash.kebabcase": "^4.1.9",
     "@types/lodash.random": "^3.2.9",
     "@types/lodash.samplesize": "^4.2.9",
-    "@types/node": "^24.13.3",
-    "@types/react": "^19.2.18",
-    "@types/react-dom": "^19.2.7",
-    "concurrently": "^10.0.5",
+    "@types/node": "^24.19.2",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "concurrently": "^10.0.6",
     "debounce": "^3.0.0",
     "lodash.kebabcase": "^4.1.1",
     "lodash.random": "^3.2.0",
     "lodash.samplesize": "^4.2.0",
-    "prettier": "^3.9.6",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
+    "prettier": "^3.9.10",
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
     "rimraf": "^6.1.3",
     "stencil-inline-svg": "^1.1.0",
-    "tsx": "^4.23.13",
+    "tsx": "^4.23.15",
     "typescript": "~5.9.3"
   },
   "peerDependencies": {
-    "dso-toolkit": "101.2.0"
+    "dso-toolkit": "103.0.0"
   },
   "nx": {
     "includedScripts": []