@dso-toolkit/react 83.1.0 → 84.1.0

package/dist/components/autosuggest/autosuggest.react-template.js

@@ -3,7 +3,7 @@ import { DsoAutosuggest } from "../../components";
 export const reactAutosuggest = {
     component: "autosuggest",
     implementation: "react",
-    template: () => function autosuggestTemplate({ children, dsoChange, dsoSearch, dsoSelect, loading, suggestOnFocus, suggestions, loadingDelayed, loadingLabel, notFoundLabel, mark, }) {
-        return (React.createElement(DsoAutosuggest, { suggestions: suggestions, onDsoSelect: dsoSelect, onDsoChange: dsoChange, onDsoSearch: dsoSearch, suggestOnFocus: suggestOnFocus, loading: loading, loadingLabel: loadingLabel, loadingDelayed: loadingDelayed, notFoundLabel: notFoundLabel, mark: mark }, children));
+    template: () => function autosuggestTemplate({ children, dsoChange, dsoSearch, dsoSelect, loading, suggestions, loadingDelayed, loadingLabel, notFoundLabel, mark, }) {
+        return (React.createElement(DsoAutosuggest, { suggestions: suggestions, onDsoSelect: dsoSelect, onDsoChange: dsoChange, onDsoSearch: dsoSearch, loading: loading, loadingLabel: loadingLabel, loadingDelayed: loadingDelayed, notFoundLabel: notFoundLabel, mark: mark }, children));
     },
 };

package/dist/components/autosuggest/autosuggest.stories.js

@@ -32,7 +32,6 @@ const { Example, Minimal3Characters, InSearchbar, WithProvidedMarkFunction, Sugg
                                 suggestions: this.props.fetchSuggestions(e.detail),
                             }));
                         },
-                        suggestOnFocus: this.props.suggestOnFocus,
                         loading: this.props.loading,
                         loadingLabel: this.props.loadingLabel,
                         loadingDelayed: this.props.loadingDelayed,
@@ -43,7 +42,7 @@ const { Example, Minimal3Characters, InSearchbar, WithProvidedMarkFunction, Sugg
             }
         }
         return {
-            autosuggestDemoTemplate: (fetchSuggestions, dsoSelect, dsoChange, dsoSearch, suggestOnFocus, loading, loadingLabel, loadingDelay, notFoundLabel) => (React.createElement(AutosuggestDemoTemplate, { fetchSuggestions: fetchSuggestions, dsoChange: dsoChange, dsoSelect: dsoSelect, dsoSearch: dsoSearch, suggestOnFocus: suggestOnFocus, loading: loading, loadingLabel: loadingLabel, loadingDelayed: loadingDelay, notFoundLabel: notFoundLabel })),
+            autosuggestDemoTemplate: (fetchSuggestions, dsoSelect, dsoChange, dsoSearch, loading, loadingLabel, loadingDelay, notFoundLabel) => (React.createElement(AutosuggestDemoTemplate, { fetchSuggestions: fetchSuggestions, dsoChange: dsoChange, dsoSelect: dsoSelect, dsoSearch: dsoSearch, loading: loading, loadingLabel: loadingLabel, loadingDelayed: loadingDelay, notFoundLabel: notFoundLabel })),
             autosuggestInSearchBarTemplate: () => React.createElement("p", null, "Zie Web Component in Core."),
         };
     },

package/dist/components.js

@@ -34,10 +34,13 @@ import { DsoInfo as DsoInfoElement, defineCustomElement as defineDsoInfo } from
 import { DsoInputRange as DsoInputRangeElement, defineCustomElement as defineDsoInputRange } from "@dso-toolkit/core/dist/components/dso-input-range.js";
 import { DsoLabel as DsoLabelElement, defineCustomElement as defineDsoLabel } from "@dso-toolkit/core/dist/components/dso-label.js";
 import { DsoLegendItem as DsoLegendItemElement, defineCustomElement as defineDsoLegendItem } from "@dso-toolkit/core/dist/components/dso-legend-item.js";
+import { DsoLegend as DsoLegendElement, defineCustomElement as defineDsoLegend } from "@dso-toolkit/core/dist/components/dso-legend.js";
 import { DsoListButton as DsoListButtonElement, defineCustomElement as defineDsoListButton } from "@dso-toolkit/core/dist/components/dso-list-button.js";
 import { DsoLogo as DsoLogoElement, defineCustomElement as defineDsoLogo } from "@dso-toolkit/core/dist/components/dso-logo.js";
 import { DsoMapBaseLayers as DsoMapBaseLayersElement, defineCustomElement as defineDsoMapBaseLayers } from "@dso-toolkit/core/dist/components/dso-map-base-layers.js";
 import { DsoMapControls as DsoMapControlsElement, defineCustomElement as defineDsoMapControls } from "@dso-toolkit/core/dist/components/dso-map-controls.js";
+import { DsoMapLayerObject as DsoMapLayerObjectElement, defineCustomElement as defineDsoMapLayerObject } from "@dso-toolkit/core/dist/components/dso-map-layer-object.js";
+import { DsoMapLayer as DsoMapLayerElement, defineCustomElement as defineDsoMapLayer } from "@dso-toolkit/core/dist/components/dso-map-layer.js";
 import { DsoMapOverlays as DsoMapOverlaysElement, defineCustomElement as defineDsoMapOverlays } from "@dso-toolkit/core/dist/components/dso-map-overlays.js";
 import { DsoMarkBar as DsoMarkBarElement, defineCustomElement as defineDsoMarkBar } from "@dso-toolkit/core/dist/components/dso-mark-bar.js";
 import { DsoModal as DsoModalElement, defineCustomElement as defineDsoModal } from "@dso-toolkit/core/dist/components/dso-modal.js";
@@ -367,6 +370,17 @@ export const DsoLabel = /*@__PURE__*/ createComponent({
     events: { onDsoRemoveClick: 'dsoRemoveClick' },
     defineCustomElement: defineDsoLabel
 });
+export const DsoLegend = /*@__PURE__*/ createComponent({
+    tagName: 'dso-legend',
+    elementClass: DsoLegendElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsoContentSwitch: 'dsoContentSwitch',
+        onDsoClose: 'dsoClose'
+    },
+    defineCustomElement: defineDsoLegend
+});
 export const DsoLegendItem = /*@__PURE__*/ createComponent({
     tagName: 'dso-legend-item',
     elementClass: DsoLegendItemElement,
@@ -421,6 +435,26 @@ export const DsoMapControls = /*@__PURE__*/ createComponent({
     },
     defineCustomElement: defineDsoMapControls
 });
+export const DsoMapLayer = /*@__PURE__*/ createComponent({
+    tagName: 'dso-map-layer',
+    elementClass: DsoMapLayerElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: { onDsoActiveChange: 'dsoActiveChange' },
+    defineCustomElement: defineDsoMapLayer
+});
+export const DsoMapLayerObject = /*@__PURE__*/ createComponent({
+    tagName: 'dso-map-layer-object',
+    elementClass: DsoMapLayerObjectElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onDsoActiveChange: 'dsoActiveChange',
+        onDsoMouseEnter: 'dsoMouseEnter',
+        onDsoMouseLeave: 'dsoMouseLeave'
+    },
+    defineCustomElement: defineDsoMapLayerObject
+});
 export const DsoMapOverlays = /*@__PURE__*/ createComponent({
     tagName: 'dso-map-overlays',
     elementClass: DsoMapOverlaysElement,

package/dist/types/components.d.ts

@@ -2,7 +2,7 @@
  * This file was automatically generated by the Stencil React Output Target.
  * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
  */
-import { type AccordionSectionActiveChangeEvent, type AccordionSectionAnimationEndEvent, type AccordionSectionAnimationStartEvent, type AccordionSectionToggleClickEvent, type AdvancedSelectChangeEvent, type AdvancedSelectRedirectEvent, type AlertCloseEvent, type AnnotationActiveChangeEvent, type AnnotationKaartClickEvent, type BaseLayerChangeEvent, type CardClickEvent, type DatePickerBlurEvent, type DatePickerChangeEvent, type DatePickerFocusEvent, type DatePickerKeyboardEvent, type DocumentCardClickEvent, type DocumentComponentMarkItemHighlightEvent, type DocumentComponentOpenToggleEvent, type DocumentComponentOzonContentClickEvent, type DocumentComponentRecursiveToggleEvent, type DocumentComponentTableOfContentsClickEvent, type DocumentComponentToggleAnnotationEvent, type DsoAccordionSectionCustomEvent, type DsoAdvancedSelectCustomEvent, type DsoAlertCustomEvent, type DsoAnnotationActiviteitCustomEvent, type DsoAnnotationGebiedsaanwijzingCustomEvent, type DsoAnnotationKaartCustomEvent, type DsoAnnotationLocatieCustomEvent, type DsoAnnotationOmgevingsnormwaardeCustomEvent, type DsoAutosuggestCustomEvent, type DsoCardCustomEvent, type DsoDatePickerCustomEvent, type DsoDocumentCardCustomEvent, type DsoDocumentComponentCustomEvent, type DsoExpandableCustomEvent, type DsoHeaderCustomEvent, type DsoHistoryItemCustomEvent, type DsoIconButtonCustomEvent, type DsoInfoButtonCustomEvent, type DsoInfoCustomEvent, type DsoInputRangeCustomEvent, type DsoLabelCustomEvent, type DsoLegendItemCustomEvent, type DsoListButtonCustomEvent, type DsoLogoCustomEvent, type DsoMapBaseLayersCustomEvent, type DsoMapControlsCustomEvent, type DsoMapOverlaysCustomEvent, type DsoMarkBarCustomEvent, type DsoModalCustomEvent, type DsoOnboardingTipCustomEvent, type DsoOzonContentCustomEvent, type DsoPaginationCustomEvent, type DsoPanelCustomEvent, type DsoPlekinfoCardCustomEvent, type DsoRenvooiCustomEvent, type DsoResponsiveElementCustomEvent, type DsoScrollEndEvent, type DsoScrollableCustomEvent, type DsoSelectableCustomEvent, type DsoSkiplinkCustomEvent, type DsoSlideToggleCustomEvent, type DsoSurveyRatingCustomEvent, type DsoTabCustomEvent, type DsoTreeViewCustomEvent, type DsoViewerGridCustomEvent, type DsotDocumentComponentDemoCustomEvent, type ExpandableAnimationEndEvent, type ExpandableAnimationStartEvent, type HeaderEvent, type HistoryItemClickEvent, type IconButtonClickEvent, type InfoButtonToggleEvent, type InputRangeChangeEvent, type LegendItemActiveChangeEvent, type ListButtonChangeEvent, type ListButtonSelectedEvent, type LogoClickEvent, type LogoLabelClickEvent, type MapControlsToggleEvent, type MarkBarClearEvent, type MarkBarInputEvent, type MarkBarPaginationEvent, type ModalCloseEvent, type OnboardingTipCloseEvent, type OverlayChangeEvent, type OzonContentClickEvent, type OzonContentMarkItemHighlightEvent, type PaginationSelectPageEvent, type PanelCloseEvent, type PlekinfoCardClickEvent, type RenvooiMarkItemHighlightEvent, type ResponsiveElementSize, type SelectableChangeEvent, type SkiplinkClickEvent, type SlideToggleActiveEvent, type Suggestion, type SurveyRatingCloseEvent, type SurveyRatingSubmitEvent, type TabsSwitchEvent, type TreeViewItem, type TreeViewPointerEvent, type ViewerGridActiveTabSwitchEvent, type ViewerGridChangeSizeAnimationEndEvent, type ViewerGridChangeSizeEvent, type ViewerGridCloseFilterPanelEvent, type ViewerGridCloseOverlayEvent, type ViewerGridMainToggleEvent } from "@dso-toolkit/core";
+import { type AccordionSectionActiveChangeEvent, type AccordionSectionAnimationEndEvent, type AccordionSectionAnimationStartEvent, type AccordionSectionToggleClickEvent, type AdvancedSelectChangeEvent, type AdvancedSelectRedirectEvent, type AlertCloseEvent, type AnnotationActiveChangeEvent, type AnnotationKaartClickEvent, type BaseLayerChangeEvent, type CardClickEvent, type DatePickerBlurEvent, type DatePickerChangeEvent, type DatePickerFocusEvent, type DatePickerKeyboardEvent, type DocumentCardClickEvent, type DocumentComponentMarkItemHighlightEvent, type DocumentComponentOpenToggleEvent, type DocumentComponentOzonContentClickEvent, type DocumentComponentRecursiveToggleEvent, type DocumentComponentTableOfContentsClickEvent, type DocumentComponentToggleAnnotationEvent, type DsoAccordionSectionCustomEvent, type DsoAdvancedSelectCustomEvent, type DsoAlertCustomEvent, type DsoAnnotationActiviteitCustomEvent, type DsoAnnotationGebiedsaanwijzingCustomEvent, type DsoAnnotationKaartCustomEvent, type DsoAnnotationLocatieCustomEvent, type DsoAnnotationOmgevingsnormwaardeCustomEvent, type DsoAutosuggestCustomEvent, type DsoCardCustomEvent, type DsoDatePickerCustomEvent, type DsoDocumentCardCustomEvent, type DsoDocumentComponentCustomEvent, type DsoExpandableCustomEvent, type DsoHeaderCustomEvent, type DsoHistoryItemCustomEvent, type DsoIconButtonCustomEvent, type DsoInfoButtonCustomEvent, type DsoInfoCustomEvent, type DsoInputRangeCustomEvent, type DsoLabelCustomEvent, type DsoLegendCustomEvent, type DsoLegendItemCustomEvent, type DsoListButtonCustomEvent, type DsoLogoCustomEvent, type DsoMapBaseLayersCustomEvent, type DsoMapControlsCustomEvent, type DsoMapLayerCustomEvent, type DsoMapLayerObjectCustomEvent, type DsoMapOverlaysCustomEvent, type DsoMarkBarCustomEvent, type DsoModalCustomEvent, type DsoOnboardingTipCustomEvent, type DsoOzonContentCustomEvent, type DsoPaginationCustomEvent, type DsoPanelCustomEvent, type DsoPlekinfoCardCustomEvent, type DsoRenvooiCustomEvent, type DsoResponsiveElementCustomEvent, type DsoScrollEndEvent, type DsoScrollableCustomEvent, type DsoSelectableCustomEvent, type DsoSkiplinkCustomEvent, type DsoSlideToggleCustomEvent, type DsoSurveyRatingCustomEvent, type DsoTabCustomEvent, type DsoTreeViewCustomEvent, type DsoViewerGridCustomEvent, type DsotDocumentComponentDemoCustomEvent, type ExpandableAnimationEndEvent, type ExpandableAnimationStartEvent, type HeaderEvent, type HistoryItemClickEvent, type IconButtonClickEvent, type InfoButtonToggleEvent, type InputRangeChangeEvent, type LegendCloseEvent, type LegendContentSwitchEvent, type LegendItemActiveChangeEvent, type ListButtonChangeEvent, type ListButtonSelectedEvent, type LogoClickEvent, type LogoLabelClickEvent, type MapControlsToggleEvent, type MapLayerActiveChangeEvent, type MapLayerObjectActiveChangeEvent, type MarkBarClearEvent, type MarkBarInputEvent, type MarkBarPaginationEvent, type ModalCloseEvent, type OnboardingTipCloseEvent, type OverlayChangeEvent, type OzonContentClickEvent, type OzonContentMarkItemHighlightEvent, type PaginationSelectPageEvent, type PanelCloseEvent, type PlekinfoCardClickEvent, type RenvooiMarkItemHighlightEvent, type ResponsiveElementSize, type SelectableChangeEvent, type SkiplinkClickEvent, type SlideToggleActiveEvent, type Suggestion, type SurveyRatingCloseEvent, type SurveyRatingSubmitEvent, type TabsSwitchEvent, type TreeViewItem, type TreeViewPointerEvent, type ViewerGridActiveTabSwitchEvent, type ViewerGridChangeSizeAnimationEndEvent, type ViewerGridChangeSizeEvent, type ViewerGridCloseFilterPanelEvent, type ViewerGridCloseOverlayEvent, type ViewerGridMainToggleEvent } from "@dso-toolkit/core";
 import { DsoAccordionSection as DsoAccordionSectionElement } from "@dso-toolkit/core/dist/components/dso-accordion-section.js";
 import { DsoAccordion as DsoAccordionElement } from "@dso-toolkit/core/dist/components/dso-accordion.js";
 import { DsoActionListItem as DsoActionListItemElement } from "@dso-toolkit/core/dist/components/dso-action-list-item.js";
@@ -38,10 +38,13 @@ import { DsoInfo as DsoInfoElement } from "@dso-toolkit/core/dist/components/dso
 import { DsoInputRange as DsoInputRangeElement } from "@dso-toolkit/core/dist/components/dso-input-range.js";
 import { DsoLabel as DsoLabelElement } from "@dso-toolkit/core/dist/components/dso-label.js";
 import { DsoLegendItem as DsoLegendItemElement } from "@dso-toolkit/core/dist/components/dso-legend-item.js";
+import { DsoLegend as DsoLegendElement } from "@dso-toolkit/core/dist/components/dso-legend.js";
 import { DsoListButton as DsoListButtonElement } from "@dso-toolkit/core/dist/components/dso-list-button.js";
 import { DsoLogo as DsoLogoElement } from "@dso-toolkit/core/dist/components/dso-logo.js";
 import { DsoMapBaseLayers as DsoMapBaseLayersElement } from "@dso-toolkit/core/dist/components/dso-map-base-layers.js";
 import { DsoMapControls as DsoMapControlsElement } from "@dso-toolkit/core/dist/components/dso-map-controls.js";
+import { DsoMapLayerObject as DsoMapLayerObjectElement } from "@dso-toolkit/core/dist/components/dso-map-layer-object.js";
+import { DsoMapLayer as DsoMapLayerElement } from "@dso-toolkit/core/dist/components/dso-map-layer.js";
 import { DsoMapOverlays as DsoMapOverlaysElement } from "@dso-toolkit/core/dist/components/dso-map-overlays.js";
 import { DsoMarkBar as DsoMarkBarElement } from "@dso-toolkit/core/dist/components/dso-mark-bar.js";
 import { DsoModal as DsoModalElement } from "@dso-toolkit/core/dist/components/dso-modal.js";
@@ -196,6 +199,11 @@ export type DsoLabelEvents = {
     onDsoRemoveClick: EventName<DsoLabelCustomEvent<MouseEvent>>;
 };
 export declare const DsoLabel: StencilReactComponent<DsoLabelElement, DsoLabelEvents>;
+export type DsoLegendEvents = {
+    onDsoContentSwitch: EventName<DsoLegendCustomEvent<LegendContentSwitchEvent>>;
+    onDsoClose: EventName<DsoLegendCustomEvent<LegendCloseEvent>>;
+};
+export declare const DsoLegend: StencilReactComponent<DsoLegendElement, DsoLegendEvents>;
 export type DsoLegendItemEvents = {
     onDsoActiveChange: EventName<DsoLegendItemCustomEvent<LegendItemActiveChangeEvent>>;
     onDsoMouseEnter: EventName<CustomEvent<any>>;
@@ -222,6 +230,16 @@ export type DsoMapControlsEvents = {
     onDsoToggle: EventName<DsoMapControlsCustomEvent<MapControlsToggleEvent>>;
 };
 export declare const DsoMapControls: StencilReactComponent<DsoMapControlsElement, DsoMapControlsEvents>;
+export type DsoMapLayerEvents = {
+    onDsoActiveChange: EventName<DsoMapLayerCustomEvent<MapLayerActiveChangeEvent>>;
+};
+export declare const DsoMapLayer: StencilReactComponent<DsoMapLayerElement, DsoMapLayerEvents>;
+export type DsoMapLayerObjectEvents = {
+    onDsoActiveChange: EventName<DsoMapLayerObjectCustomEvent<MapLayerObjectActiveChangeEvent>>;
+    onDsoMouseEnter: EventName<CustomEvent<any>>;
+    onDsoMouseLeave: EventName<CustomEvent<any>>;
+};
+export declare const DsoMapLayerObject: StencilReactComponent<DsoMapLayerObjectElement, DsoMapLayerObjectEvents>;
 export type DsoMapOverlaysEvents = {
     onDsoToggleOverlay: EventName<DsoMapOverlaysCustomEvent<OverlayChangeEvent>>;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dso-toolkit/react",
   "type": "module",
-  "version": "83.1.0",
+  "version": "84.1.0",
   "description": "React specific wrapper for @dso-toolkit/core web components",
   "homepage": "https://www.dso-toolkit.nl/",
   "repository": {
@@ -22,7 +22,7 @@
   },
   "devDependencies": {
     "@iframe-resizer/child": "^5.5.7",
-    "@stencil/core": "4.36.1",
+    "@stencil/core": "4.39.0",
     "@storybook/addon-a11y": "10.0.8",
     "@storybook/addon-docs": "10.0.8",
     "@storybook/builder-vite": "10.0.8",
@@ -30,7 +30,7 @@
     "@types/lodash.startcase": "^4.4.9",
     "@types/react": "^19.2.6",
     "@types/react-dom": "^19.2.3",
-    "dso-toolkit": "^83.1.0",
+    "dso-toolkit": "^84.1.0",
     "eslint": "^9.39.1",
     "eslint-plugin-storybook": "10.0.8",
     "http-proxy-middleware": "^3.0.5",
@@ -45,7 +45,7 @@
     "wait-on": "^9.0.3"
   },
   "peerDependencies": {
-    "@dso-toolkit/core": "83.1.0",
+    "@dso-toolkit/core": "84.1.0",
     "react": "^18.3.0 || ^19.0.0",
     "react-dom": "^18.3.0 || ^19.0.0"
   },