npm - @dso-toolkit/core - Versions diffs - 79.0.0-pre.3 → 79.0.0 - Mend

@dso-toolkit/core 79.0.0-pre.3 → 79.0.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 (770) hide show

package/dist/collection/components/highlight-box/highlight-box.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 *,
 *::after,
 *::before {

package/dist/collection/components/icon/icon.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: inline-block;
   block-size: 24px;

package/dist/collection/components/image-overlay/image-overlay.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: inline-block;
   position: relative;
@@ -380,7 +365,7 @@ ins.editaction-add a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins.editaction-add {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 ins.editaction-add .wrapper {
   outline: none;
@@ -407,7 +392,7 @@ ins.editaction-add .wrapper a:not(.dso-primary, .dso-secondary, .dso-tertiary):i
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins.editaction-add .wrapper {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 ins.editaction-add .wrapper .editaction-label {
   line-height: 1.5;

package/dist/collection/components/info/info.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
   padding-block: 16px;

package/dist/collection/components/info-button/info-button.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: inline-block;
 }

package/dist/collection/components/input-range/input-range.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: flex;
   align-items: center;

package/dist/collection/components/label/label.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: inline-block;
   max-inline-size: 100%;
@@ -116,7 +101,58 @@
   color: #191919;
 }
 .dso-label.dso-label-filter {
-  border-inline-start: 5px solid #2b5780;
+  border-inline-start: 5px solid #6ca4d9;
+}
+.dso-label.dso-label-toegevoegd {
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+  background-color: #e4f1d4;
+  border-color: #e4f1d4;
+  color: #191919;
+}
+.dso-label.dso-label-toegevoegd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-label.dso-label-toegevoegd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-label.dso-label-toegevoegd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-label.dso-label-toegevoegd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
+}
+.dso-label.dso-label-toegevoegd {
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
+}
+.dso-label.dso-label-verwijderd {
+  --link-color: currentColor;
+  --link-hover-color: currentColor;
+  --link-visited-color: currentColor;
+  background-color: #f5d8dc;
+  border-color: #f5d8dc;
+  color: #191919;
+}
+.dso-label.dso-label-verwijderd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#download-zwart"));
+}
+.dso-label.dso-label-verwijderd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#external-link-zwart"));
+}
+.dso-label.dso-label-verwijderd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="tel:"], [href^="tel:"]:hover, [href^="tel:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#call-zwart"));
+}
+.dso-label.dso-label-verwijderd a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [href^="mailto:"]:hover, [href^="mailto:"]:focus-visible) {
+  background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
+}
+.dso-label.dso-label-verwijderd {
+  text-decoration: line-through;
+}
+@media screen and (min--moz-device-pixel-ratio: 0) {
+  .dso-label.dso-label-verwijderd {
+    font-family: sans-serif;
+  }
 }
 .dso-label.dso-compact {
   padding-block: 0;

package/dist/collection/components/label/label.interfaces.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"label.interfaces.js","sourceRoot":"","sources":["../../../../src/components/label/label.interfaces.ts"],"names":[],"mappings":"","sourcesContent":["export type LabelStatus = \"primary\" \| \"success\" \| \"info\" \| \"warning\" \| \"error\" \| \"bright\" \| \"attention\" \| \"filter\";\r\n"]}
1	+ {"version":3,"file":"label.interfaces.js","sourceRoot":"","sources":["../../../../src/components/label/label.interfaces.ts"],"names":[],"mappings":"","sourcesContent":["export type LabelStatus =\r\n \| \"primary\"\r\n \| \"success\"\r\n \| \"info\"\r\n \| \"warning\"\r\n \| \"error\"\r\n \| \"bright\"\r\n \| \"attention\"\r\n \| \"filter\"\r\n \| \"toegevoegd\"\r\n \| \"verwijderd\";\r\n"]}

package/dist/collection/components/label/label.js CHANGED Viewed

@@ -160,7 +160,7 @@ export class Label {
                 "mutable": false,
                 "complexType": {
                     "original": "LabelStatus",
-                    "resolved": "\"attention\" | \"bright\" | \"error\" | \"filter\" | \"info\" | \"primary\" | \"success\" | \"warning\" | undefined",
+                    "resolved": "\"attention\" | \"bright\" | \"error\" | \"filter\" | \"info\" | \"primary\" | \"success\" | \"toegevoegd\" | \"verwijderd\" | \"warning\" | undefined",
                     "references": {
                         "LabelStatus": {
                             "location": "import",

package/dist/collection/components/legend-item/legend-item.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
   padding-block: 4px;

package/dist/collection/components/list-button/list-button.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 *,
 *::after,
 *::before {

package/dist/collection/components/map-base-layers/map-base-layers.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
 }

package/dist/collection/components/map-controls/map-controls.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 button {
   -webkit-appearance: button;
   color: inherit;

package/dist/collection/components/map-overlays/map-overlays.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
 }

package/dist/collection/components/mark-bar/mark-bar.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 *,
 *::after,
 *::before {

package/dist/collection/components/modal/modal.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 @keyframes ModalFadeIn {
   0% {
     opacity: 0;

package/dist/collection/components/onboarding-tip/onboarding-tip.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 *,
 *::after,
 *::before {

package/dist/collection/components/ozon-content/nodes/figuur.node.js CHANGED Viewed

@@ -1,7 +1,9 @@
 import { Fragment, h } from "@stencil/core";
 import { getNodeName } from "../get-node-name.function";
 const Bijschrift = ({ bijschrift, bron, mapNodeToJsx }) => {
-    return (h("span", { class: "figuur-bijschrift" }, bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud), bron && (h(Fragment, null, `${bijschrift ? " " : ""}(bron: `, mapNodeToJsx(bron), ")"))));
+    var _a;
+    const bronText = bron && ((_a = bron.textContent) === null || _a === void 0 ? void 0 : _a.trim());
+    return (h("span", { class: "figuur-bijschrift" }, bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud), bronText && (h(Fragment, null, `${bijschrift ? " " : ""}(bron: `, mapNodeToJsx(bron), ")"))));
 };
 export class OzonContentFiguurNode {
     constructor() {

package/dist/collection/components/ozon-content/nodes/figuur.node.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"figuur.node.js","sourceRoot":"","sources":["../../../../../src/components/ozon-content/nodes/figuur.node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA4B,CAAC,EAAE,MAAM,eAAe,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAwBxD,MAAM,UAAU,GAAyC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE;IAC9F,OAAO,CACL,YAAM,KAAK,EAAC,mBAAmB;QAC5B,UAAU,IAAI,UAAU,CAAC,MAAM,IAAI,YAAY,CAAC,UAAU,CAAC,MAAM,CAAC;QAClE,~~IAAI~~,IAAI,~~CACP~~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","sourcesContent":["import { Fragment, FunctionalComponent, JSX, h } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\ntype BijschriftProps = {\r\n bijschrift?: IBijschrift;\r\n bron?: ChildNode;\r\n mapNodeToJsx: (node: Node \| NodeList \| Node[]) => JSX.Element;\r\n};\r\n\r\ninterface IBijschrift {\r\n inhoud: NodeListOf<ChildNode>;\r\n locatie: string;\r\n}\r\n\r\ninterface Illustratie {\r\n naam: string;\r\n breedte: number;\r\n hoogte: number;\r\n dpi: number;\r\n uitlijning: \"start\" \| \"center\" \| \"end\";\r\n alt: string \| undefined;\r\n}\r\n\r\nconst Bijschrift: FunctionalComponent<BijschriftProps> = ({ bijschrift, bron, mapNodeToJsx }) => {\r\n return (\r\n <span class=\"figuur-bijschrift\">\r\n {bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud)}\r\n {~~bron~~ && (\r\n <Fragment>\r\n {`${bijschrift ? \" \" : \"\"}(bron: `}\r\n {mapNodeToJsx(bron)})\r\n </Fragment>\r\n )}\r\n </span>\r\n );\r\n};\r\n\r\nexport class OzonContentFiguurNode implements OzonContentNode {\r\n name = [\"Figuur\"];\r\n\r\n private getStyle(illustratie: Illustratie) {\r\n const widthPixels = Number(illustratie.breedte);\r\n const heightPixels = Number(illustratie.hoogte);\r\n\r\n const style = {\r\n \"--_dso-ozon-content-illustratie-uitlijning\": illustratie.uitlijning,\r\n };\r\n\r\n if (widthPixels && heightPixels) {\r\n // This is the STOP formula to calculate the width in percentage\r\n // see: https://koop.gitlab.io/stop/standaard/1.4.0-ic/regeltekst_afbeelding.html\r\n // We maximise it to 100% in the case of missing dpi or a calculated percentage greater than 100%\r\n const widthPercentage = Math.min(illustratie.dpi ? (16.4 * widthPixels) / Number(illustratie.dpi) : 100, 100);\r\n\r\n Object.assign(style, {\r\n \"--_dso-ozon-content-illustratie-aspect-ratio\": (widthPixels / heightPixels).toString(),\r\n \"--_dso-ozon-content-illustratie-width\": `${widthPercentage}%`,\r\n });\r\n }\r\n\r\n return style;\r\n }\r\n\r\n private mapIllustratieNode(node: Element): Illustratie {\r\n return {\r\n naam: node.getAttribute(\"naam\") ?? \"\",\r\n breedte: Number(node.getAttribute(\"breedte\")),\r\n hoogte: Number(node.getAttribute(\"hoogte\")),\r\n dpi: Number(node.getAttribute(\"dpi\")),\r\n uitlijning:\r\n [\"start\", \"center\", \"end\"].find((u): u is Illustratie[\"uitlijning\"] => node.getAttribute(\"uitlijning\") === u) ??\r\n \"start\",\r\n alt: node.getAttribute(\"alt\") ?? undefined,\r\n };\r\n }\r\n\r\n render(node: Element, { mapNodeToJsx, urlResolver }: OzonContentNodeContext) {\r\n const childNodes = Array.from(node.childNodes);\r\n const titel = childNodes.find((n) => getNodeName(n) === \"Titel\")?.textContent;\r\n const bron = childNodes.find((n) => getNodeName(n) === \"Bron\");\r\n\r\n const illustratieNode = childNodes.find((n) => getNodeName(n) === \"Illustratie\");\r\n const bijschriftNode = childNodes.find((n) => getNodeName(n) === \"Bijschrift\");\r\n\r\n const wijzigactie = node.getAttribute(\"wijzigactie\") \|\| undefined;\r\n\r\n if (illustratieNode instanceof Element) {\r\n const illustratie = this.mapIllustratieNode(illustratieNode);\r\n\r\n const bijschrift =\r\n bijschriftNode instanceof Element\r\n ? {\r\n inhoud: bijschriftNode.childNodes,\r\n locatie: bijschriftNode.getAttribute(\"locatie\") ?? \"onder\",\r\n }\r\n : undefined;\r\n\r\n const src = urlResolver ? urlResolver(\"Illustratie\", \"naam\", illustratie.naam, node) : illustratie.naam;\r\n\r\n return (\r\n <div\r\n class={`dso-ozon-figuur ${bijschrift ? `bijschrift-${bijschrift.locatie}` : \"onder\"}`}\r\n style={this.getStyle(illustratie)}\r\n >\r\n {titel && <span class=\"figuur-titel\">{titel}</span>}\r\n {bijschrift?.locatie === \"boven\" && (\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n )}\r\n <dso-image-overlay wijzigactie={wijzigactie}>\r\n {titel && (\r\n <div slot=\"titel\">\r\n <span>{titel}</span>\r\n </div>\r\n )}\r\n <img src={src ?? undefined} alt={illustratie.alt ?? titel ?? illustratie.naam ?? undefined} />\r\n {(bijschrift \|\| bron) && (\r\n <div slot=\"bijschrift\">\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n </div>\r\n )}\r\n </dso-image-overlay>\r\n {(bijschrift?.locatie === \"onder\" \|\| (!bijschrift && bron)) && (\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n )}\r\n </div>\r\n );\r\n }\r\n }\r\n}\r\n"]}
1	+ {"version":3,"file":"figuur.node.js","sourceRoot":"","sources":["../../../../../src/components/ozon-content/nodes/figuur.node.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Fragment, FunctionalComponent, JSX, h } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"../get-node-name.function\";\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\ntype BijschriftProps = {\r\n bijschrift?: IBijschrift;\r\n bron?: ChildNode;\r\n mapNodeToJsx: (node: Node \| NodeList \| Node[]) => JSX.Element;\r\n};\r\n\r\ninterface IBijschrift {\r\n inhoud: NodeListOf<ChildNode>;\r\n locatie: string;\r\n}\r\n\r\ninterface Illustratie {\r\n naam: string;\r\n breedte: number;\r\n hoogte: number;\r\n dpi: number;\r\n uitlijning: \"start\" \| \"center\" \| \"end\";\r\n alt: string \| undefined;\r\n}\r\n\r\nconst Bijschrift: FunctionalComponent<BijschriftProps> = ({ bijschrift, bron, mapNodeToJsx }) => {\r\n const bronText = bron && bron.textContent?.trim();\r\n\r\n return (\r\n <span class=\"figuur-bijschrift\">\r\n {bijschrift && bijschrift.inhoud && mapNodeToJsx(bijschrift.inhoud)}\r\n {bronText && (\r\n <Fragment>\r\n {`${bijschrift ? \" \" : \"\"}(bron: `}\r\n {mapNodeToJsx(bron)})\r\n </Fragment>\r\n )}\r\n </span>\r\n );\r\n};\r\n\r\nexport class OzonContentFiguurNode implements OzonContentNode {\r\n name = [\"Figuur\"];\r\n\r\n private getStyle(illustratie: Illustratie) {\r\n const widthPixels = Number(illustratie.breedte);\r\n const heightPixels = Number(illustratie.hoogte);\r\n\r\n const style = {\r\n \"--_dso-ozon-content-illustratie-uitlijning\": illustratie.uitlijning,\r\n };\r\n\r\n if (widthPixels && heightPixels) {\r\n // This is the STOP formula to calculate the width in percentage\r\n // see: https://koop.gitlab.io/stop/standaard/1.4.0-ic/regeltekst_afbeelding.html\r\n // We maximise it to 100% in the case of missing dpi or a calculated percentage greater than 100%\r\n const widthPercentage = Math.min(illustratie.dpi ? (16.4 * widthPixels) / Number(illustratie.dpi) : 100, 100);\r\n\r\n Object.assign(style, {\r\n \"--_dso-ozon-content-illustratie-aspect-ratio\": (widthPixels / heightPixels).toString(),\r\n \"--_dso-ozon-content-illustratie-width\": `${widthPercentage}%`,\r\n });\r\n }\r\n\r\n return style;\r\n }\r\n\r\n private mapIllustratieNode(node: Element): Illustratie {\r\n return {\r\n naam: node.getAttribute(\"naam\") ?? \"\",\r\n breedte: Number(node.getAttribute(\"breedte\")),\r\n hoogte: Number(node.getAttribute(\"hoogte\")),\r\n dpi: Number(node.getAttribute(\"dpi\")),\r\n uitlijning:\r\n [\"start\", \"center\", \"end\"].find((u): u is Illustratie[\"uitlijning\"] => node.getAttribute(\"uitlijning\") === u) ??\r\n \"start\",\r\n alt: node.getAttribute(\"alt\") ?? undefined,\r\n };\r\n }\r\n\r\n render(node: Element, { mapNodeToJsx, urlResolver }: OzonContentNodeContext) {\r\n const childNodes = Array.from(node.childNodes);\r\n const titel = childNodes.find((n) => getNodeName(n) === \"Titel\")?.textContent;\r\n const bron = childNodes.find((n) => getNodeName(n) === \"Bron\");\r\n\r\n const illustratieNode = childNodes.find((n) => getNodeName(n) === \"Illustratie\");\r\n const bijschriftNode = childNodes.find((n) => getNodeName(n) === \"Bijschrift\");\r\n\r\n const wijzigactie = node.getAttribute(\"wijzigactie\") \|\| undefined;\r\n\r\n if (illustratieNode instanceof Element) {\r\n const illustratie = this.mapIllustratieNode(illustratieNode);\r\n\r\n const bijschrift =\r\n bijschriftNode instanceof Element\r\n ? {\r\n inhoud: bijschriftNode.childNodes,\r\n locatie: bijschriftNode.getAttribute(\"locatie\") ?? \"onder\",\r\n }\r\n : undefined;\r\n\r\n const src = urlResolver ? urlResolver(\"Illustratie\", \"naam\", illustratie.naam, node) : illustratie.naam;\r\n\r\n return (\r\n <div\r\n class={`dso-ozon-figuur ${bijschrift ? `bijschrift-${bijschrift.locatie}` : \"onder\"}`}\r\n style={this.getStyle(illustratie)}\r\n >\r\n {titel && <span class=\"figuur-titel\">{titel}</span>}\r\n {bijschrift?.locatie === \"boven\" && (\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n )}\r\n <dso-image-overlay wijzigactie={wijzigactie}>\r\n {titel && (\r\n <div slot=\"titel\">\r\n <span>{titel}</span>\r\n </div>\r\n )}\r\n <img src={src ?? undefined} alt={illustratie.alt ?? titel ?? illustratie.naam ?? undefined} />\r\n {(bijschrift \|\| bron) && (\r\n <div slot=\"bijschrift\">\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n </div>\r\n )}\r\n </dso-image-overlay>\r\n {(bijschrift?.locatie === \"onder\" \|\| (!bijschrift && bron)) && (\r\n <Bijschrift bijschrift={bijschrift} bron={bron} mapNodeToJsx={mapNodeToJsx} />\r\n )}\r\n </div>\r\n );\r\n }\r\n }\r\n}\r\n"]}

package/dist/collection/components/ozon-content/ozon-content.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 button {
   -webkit-appearance: button;
   color: inherit;
@@ -1709,7 +1694,7 @@ span[role=paragraph].editaction-add,
 .dso-ozon-lijst.editaction-add,
 .dso-ozon-lijst > ul > li.editaction-add,
 table.editaction-add {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 p.editaction-remove,
 span[role=paragraph].editaction-remove,
@@ -1792,7 +1777,7 @@ ins.new-text a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailt
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins.new-text {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 ins.editaction-add {
   display: inline-block;
@@ -1820,7 +1805,7 @@ ins.editaction-add a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins.editaction-add {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 ins.editaction-add p:last-child {
   margin: 0;
@@ -2002,7 +1987,7 @@ del.editaction-remove p:last-child {
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 .subtitel:has(ins:not(.new-text)) {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 .subtitel ins,
 .subtitel del {

package/dist/collection/components/pagination/pagination.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
 }

package/dist/collection/components/panel/panel.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
   border: 1px solid #b2b2b2;

package/dist/collection/components/plekinfo-card/plekinfo-card.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 ins {
   text-decoration: none;
 }
@@ -37,7 +22,7 @@ ins a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [hr
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 del {

package/dist/collection/components/progress-bar/progress-bar.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
 }

package/dist/collection/components/progress-indicator/progress-indicator.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 *,
 *::after,
 *::before {

package/dist/collection/components/project-item/project-item.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 :host {
   display: block;
   padding: 16px;

package/dist/collection/components/renvooi/renvooi.css CHANGED Viewed

@@ -1,18 +1,3 @@
-@charset "UTF-8";
-/* Genereert een `transition` met vaste easing en optionele duur en delay per property.
-**
-** @param {ArgList} $transitions...
-**   - "property": gebruikt standaard duur (260ms) en delay (0ms)
-**   - ("property", duur): eigen duur, geen delay
-**   - ("property", duur, delay): eigen duur én delay
-**
-** @example
-**   @include transition(opacity, ("transform", 300ms), ("color", 500ms, 200ms));
-**
-** @output
-**   transition: [property] [duration] cubic-bezier(0.4, 0, 0.2, 1) [delay];
-**
-*/
 ins {
   text-decoration: none;
 }
@@ -37,7 +22,7 @@ ins a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^="mailto:"], [hr
   background-image: var(--_dso-di-background-image, url("./di.svg#email-zwart"));
 }
 ins {
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.5);
 }
 del {