@dso-toolkit/core 54.3.0 → 56.0.0

package/dist/dso-toolkit/p-01d41a89.entry.js

@@ -1,2 +0,0 @@
-import{r as o,c as n,h as t}from"./p-53c8538c.js";import{A as e}from"./p-5e18dd5d.js";import"./p-6e38820b.js";const s="*,*::after,*::before{box-sizing:border-box}dso-annotation-output{display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-annotation-header{align-items:center;background-color:#f2f2f2;clear:both;display:flex;margin-bottom:2px;margin-top:8px;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-header>*[slot=title]{color:#000;font-size:1.25rem;margin-bottom:0;margin-top:0}.dso-annotation-header>*:nth-child(2){margin-left:auto}dso-responsive-element[small] .dso-annotation-header,dso-responsive-element[medium] .dso-annotation-header{display:grid;row-gap:8px}dso-responsive-element[small] .dso-annotation-header *[slot=title],dso-responsive-element[medium] .dso-annotation-header *[slot=title]{grid-row:1;grid-column:1}dso-responsive-element[small] .dso-annotation-header *[slot=addons],dso-responsive-element[medium] .dso-annotation-header *[slot=addons]{grid-row:2;grid-column:1;margin-left:initial}dso-responsive-element[small] .dso-annotation-header .dso-annotation-close-button,dso-responsive-element[medium] .dso-annotation-header .dso-annotation-close-button{grid-row:1;grid-column:2;margin-left:8px;text-align:end}.dso-annotation-content{background-color:#f2f2f2;padding-left:16px;padding-right:8px;padding-top:8px;padding-bottom:8px}.dso-annotation-close-button{margin-left:32px}.dso-annotation-prefix{font-style:italic}";const i=class{constructor(t){o(this,t);this.dsoToggle=n(this,"dsoToggle",3);this.identifier=undefined;this.annotationPrefix=undefined}async _toggleAnnotation(o,n){e.toggle(n);const t=e.state[this.identifier];if(t===undefined){throw new Error(`No state found for ${this.identifier}`)}this.dsoToggle.emit({originalEvent:o,open:t})}toggleHandler(o){this._toggleAnnotation(o,this.identifier)}render(){const o=e.state[this.identifier]?{open:true}:{};return t("dso-responsive-element",null,t("dso-expandable",Object.assign({id:this.identifier},o),t("div",{slot:"expandable-content"},this.annotationPrefix&&t("span",{class:"dso-annotation-prefix"},this.annotationPrefix),t("div",{class:"dso-annotation-header"},t("slot",{name:"title"}),t("slot",{name:"addons"}),t("button",{type:"button",class:"dso-tertiary dso-annotation-close-button",onClick:o=>this.toggleHandler(o)},t("dso-icon",{icon:"times"}),t("span",{class:"sr-only"},"Toelichting sluiten"))),t("div",{class:"dso-annotation-content"},t("slot",null)))))}};i.style=s;export{i as dso_annotation_output};
-//# sourceMappingURL=p-01d41a89.entry.js.map

package/dist/dso-toolkit/p-01d41a89.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["annotationOutputCss","AnnotationOutput","async","e","identifier","AnnotationService","toggle","open","state","this","undefined","Error","dsoToggle","emit","originalEvent","toggleHandler","_toggleAnnotation","render","expandableProperties","h","Object","assign","id","slot","annotationPrefix","class","name","type","onClick","icon"],"sources":["./src/components/annotation-output/annotation-output.scss?tag=dso-annotation-output","./src/components/annotation-output/annotation-output.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n\r\n@include utilities.box-sizing();\r\n\r\ndso-annotation-output {\r\n  display: block;\r\n}\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-annotation-header {\r\n  align-items: center;\r\n  background-color: colors.$grijs-5;\r\n  clear: both;\r\n  display: flex;\r\n  margin-bottom: 2px;\r\n  margin-top: units.$u1;\r\n  padding-left: units.$u2;\r\n  padding-right: units.$u1;\r\n  padding-top: units.$u1;\r\n  padding-bottom: units.$u1;\r\n\r\n  > *[slot=\"title\"] {\r\n    color: colors.$zwart;\r\n    font-size: 1.25rem;\r\n    margin-bottom: 0;\r\n    margin-top: 0;\r\n  }\r\n\r\n  > *:nth-child(2) {\r\n    margin-left: auto;\r\n  }\r\n}\r\n\r\ndso-responsive-element[small],\r\ndso-responsive-element[medium] {\r\n  .dso-annotation-header {\r\n    display: grid;\r\n    row-gap: units.$u1;\r\n\r\n    *[slot=\"title\"] {\r\n      grid-row: 1;\r\n      grid-column: 1;\r\n    }\r\n\r\n    *[slot=\"addons\"] {\r\n      grid-row: 2;\r\n      grid-column: 1;\r\n      margin-left: initial;\r\n    }\r\n\r\n    .dso-annotation-close-button {\r\n      grid-row: 1;\r\n      grid-column: 2;\r\n      margin-left: units.$u1;\r\n      text-align: end;\r\n    }\r\n  }\r\n}\r\n\r\n.dso-annotation-content {\r\n  background-color: colors.$grijs-5;\r\n  padding-left: units.$u2;\r\n  padding-right: units.$u1;\r\n  padding-top: units.$u1;\r\n  padding-bottom: units.$u1;\r\n}\r\n\r\n.dso-annotation-close-button {\r\n  margin-left: units.$u4;\r\n}\r\n\r\n.dso-annotation-prefix {\r\n  font-style: italic;\r\n}\r\n","import { Component, ComponentInterface, Event, EventEmitter, h, Method, Prop } from \"@stencil/core\";\r\n\r\nimport { AnnotationService } from \"../../services/annotation.service\";\r\nimport { AnnotationToggleEvent } from \"./annotation-output.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-annotation-output\",\r\n  styleUrl: \"annotation-output.scss\",\r\n  // We disable shadowdom for a11y reasons (aria-controls being set inside another component)\r\n  shadow: false,\r\n})\r\nexport class AnnotationOutput implements ComponentInterface {\r\n  /**\r\n   * The annotation-button that toggles this component should have the same identifier.\r\n   */\r\n  @Prop()\r\n  identifier!: string;\r\n\r\n  /**\r\n   * This text will be displayed above the annotation-output when opened\r\n   */\r\n  @Prop()\r\n  annotationPrefix?: string;\r\n\r\n  /**\r\n   * This event is emitted when the user activates the Annotation Button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoToggle!: EventEmitter<AnnotationToggleEvent>;\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _toggleAnnotation(e: MouseEvent | KeyboardEvent, identifier: string) {\r\n    AnnotationService.toggle(identifier);\r\n\r\n    const open = AnnotationService.state[this.identifier];\r\n    if (open === undefined) {\r\n      throw new Error(`No state found for ${this.identifier}`);\r\n    }\r\n\r\n    this.dsoToggle.emit({\r\n      originalEvent: e,\r\n      open,\r\n    });\r\n  }\r\n\r\n  private toggleHandler(e: MouseEvent | KeyboardEvent) {\r\n    this._toggleAnnotation(e, this.identifier);\r\n  }\r\n\r\n  render() {\r\n    const expandableProperties = AnnotationService.state[this.identifier] ? { open: true } : {};\r\n\r\n    return (\r\n      <dso-responsive-element>\r\n        <dso-expandable id={this.identifier} {...expandableProperties}>\r\n          <div slot=\"expandable-content\">\r\n            {this.annotationPrefix && <span class=\"dso-annotation-prefix\">{this.annotationPrefix}</span>}\r\n            <div class=\"dso-annotation-header\">\r\n              <slot name=\"title\" />\r\n              <slot name=\"addons\" />\r\n              <button\r\n                type=\"button\"\r\n                class=\"dso-tertiary dso-annotation-close-button\"\r\n                onClick={(e) => this.toggleHandler(e)}\r\n              >\r\n                <dso-icon icon=\"times\"></dso-icon>\r\n                <span class=\"sr-only\">Toelichting sluiten</span>\r\n              </button>\r\n            </div>\r\n            <div class=\"dso-annotation-content\">\r\n              <slot />\r\n            </div>\r\n          </div>\r\n        </dso-expandable>\r\n      </dso-responsive-element>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"8GAAA,MAAMA,EAAsB,s6C,MCWfC,EAAgB,M,wHAuB3BC,wBAAwBC,EAA+BC,GACrDC,EAAkBC,OAAOF,GAEzB,MAAMG,EAAOF,EAAkBG,MAAMC,KAAKL,YAC1C,GAAIG,IAASG,UAAW,CACtB,MAAM,IAAIC,MAAM,sBAAsBF,KAAKL,a,CAG7CK,KAAKG,UAAUC,KAAK,CAClBC,cAAeX,EACfI,Q,CAIIQ,cAAcZ,GACpBM,KAAKO,kBAAkBb,EAAGM,KAAKL,W,CAGjCa,SACE,MAAMC,EAAuBb,EAAkBG,MAAMC,KAAKL,YAAc,CAAEG,KAAM,MAAS,GAEzF,OACEY,EAAA,8BACEA,EAAA,iBAAAC,OAAAC,OAAA,CAAgBC,GAAIb,KAAKL,YAAgBc,GACvCC,EAAA,OAAKI,KAAK,sBACPd,KAAKe,kBAAoBL,EAAA,QAAMM,MAAM,yBAAyBhB,KAAKe,kBACpEL,EAAA,OAAKM,MAAM,yBACTN,EAAA,QAAMO,KAAK,UACXP,EAAA,QAAMO,KAAK,WACXP,EAAA,UACEQ,KAAK,SACLF,MAAM,2CACNG,QAAUzB,GAAMM,KAAKM,cAAcZ,IAEnCgB,EAAA,YAAUU,KAAK,UACfV,EAAA,QAAMM,MAAM,WAAS,yBAGzBN,EAAA,OAAKM,MAAM,0BACTN,EAAA,gB"}

package/dist/dso-toolkit/p-106b3e01.entry.js

@@ -1,2 +0,0 @@
-import{r as o,h as t,H as s,g as n}from"./p-53c8538c.js";import{d}from"./p-1805f5b0.js";import{c as e}from"./p-91963e3d.js";import{v as r}from"./p-5d7f4ff2.js";import"./p-5950644a.js";const a="@keyframes slideInFromTop {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n:host {\n  display: block;\n  margin-bottom: 24px;\n}\n\n.dso-header {\n  min-height: 32px;\n}\n.dso-header h2 {\n  color: #275937;\n  font-size: 1.5rem;\n  font-weight: 700;\n}\n.dso-header .dso-close {\n  color: #275937;\n}\n\n:host .dso-modal {\n  bottom: 0;\n  height: 100%;\n  left: 0;\n  position: fixed;\n  right: 0;\n  top: 0;\n  z-index: 530;\n  inset: 0px;\n  height: 100%;\n  position: fixed;\n  z-index: 530;\n}\n:host .dso-modal .dso-dialog {\n  animation: 1s ease-out 0s 1 slideInFromTop;\n  margin-top: 15vh;\n  margin-left: auto;\n  margin-right: auto;\n  max-width: 640px;\n  opacity: 1;\n  background-color: #fff;\n  box-shadow: 0 8px 24px 0 rgba(25, 25, 25, 0.4);\n}\n:host .dso-modal .dso-header {\n  border-bottom: 1px solid #ccc;\n  padding: 16px;\n  position: relative;\n}\n:host .dso-modal .dso-header h2 {\n  color: #275937;\n  margin: 0;\n  max-width: calc(100% - 24px);\n}\n:host .dso-modal .dso-header .dso-close {\n  background-color: transparent;\n  border: 0;\n  height: 32px;\n  padding: 0;\n  position: absolute;\n  right: 13px;\n  text-align: center;\n  top: 16px;\n  width: 32px;\n}\n:host .dso-modal .dso-body {\n  height: calc(100% - 96px - 1.5rem);\n  max-height: calc(70vh - 144px - 1.5em);\n  min-height: 1.5rem;\n  overflow-x: auto;\n  padding: 32px;\n}\n:host .dso-modal .dso-body p {\n  margin: 0 0 16px;\n}\n:host .dso-modal .dso-body ul,\n:host .dso-modal .dso-body ol {\n  margin-bottom: 16px;\n}\n:host .dso-modal .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),\n:host .dso-modal .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list) {\n  padding-inline-start: 24px;\n}\n:host .dso-modal .dso-body pre {\n  margin: 0 0 16px;\n}\n:host .dso-modal .dso-body blockquote {\n  padding: 16px 24px;\n}\n:host .dso-modal .dso-body dso-highlight-box,\n:host .dso-modal .dso-body .dso-highlight-box {\n  margin-bottom: 24px;\n}\n:host .dso-modal .dso-body img {\n  height: auto;\n  max-width: 100%;\n}\n:host .dso-modal .dso-footer {\n  min-height: 80px;\n  padding: 0 32px 32px;\n  text-align: right;\n}\n@media screen and (max-width: 767px) {\n  :host .dso-modal .dso-footer .btn + .btn, :host .dso-modal .dso-footer .btn + .dso-primary, :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn, :host .dso-modal .dso-footer .dso-primary + .dso-primary, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn, :host .dso-modal .dso-footer .dso-secondary + .dso-primary, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn, :host .dso-modal .dso-footer .dso-tertiary + .dso-primary, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary {\n    margin-left: 0;\n  }\n  :host .dso-modal .dso-footer button {\n    text-align: center;\n    width: 100%;\n  }\n  :host .dso-modal .dso-footer button + button {\n    margin-top: 8px;\n  }\n  :host .dso-modal .dso-footer button.dso-tertiary,\n  :host .dso-modal .dso-footer button.dso-tertiary span, :host .dso-modal .dso-footer button.btn-link,\n  :host .dso-modal .dso-footer button.btn-link span {\n    float: none;\n  }\n}\n@media screen and (min-width: 768px) {\n  :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .btn-default, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .btn-default, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .btn-default, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .btn-default {\n    margin-left: 16px;\n  }\n  :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .btn + .btn-link, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn-link, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn-link, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn-link {\n    margin-left: 0;\n  }\n}\n@media screen and (max-width: 767px) {\n  :host .dso-modal .dso-dialog {\n    max-width: 100%;\n    margin-top: 0;\n  }\n  :host .dso-modal .dso-footer .btn + .btn, :host .dso-modal .dso-footer .btn + .dso-primary, :host .dso-modal .dso-footer .btn + .dso-secondary, :host .dso-modal .dso-footer .btn + .dso-tertiary, :host .dso-modal .dso-footer .dso-primary + .btn, :host .dso-modal .dso-footer .dso-primary + .dso-primary, :host .dso-modal .dso-footer .dso-primary + .dso-secondary, :host .dso-modal .dso-footer .dso-primary + .dso-tertiary, :host .dso-modal .dso-footer .dso-secondary + .btn, :host .dso-modal .dso-footer .dso-secondary + .dso-primary, :host .dso-modal .dso-footer .dso-secondary + .dso-secondary, :host .dso-modal .dso-footer .dso-secondary + .dso-tertiary, :host .dso-modal .dso-footer .dso-tertiary + .btn, :host .dso-modal .dso-footer .dso-tertiary + .dso-primary, :host .dso-modal .dso-footer .dso-tertiary + .dso-secondary, :host .dso-modal .dso-footer .dso-tertiary + .dso-tertiary {\n    margin-left: 0;\n  }\n  :host .dso-modal .dso-footer button {\n    text-align: center;\n    width: 100%;\n  }\n  :host .dso-modal .dso-footer button + button {\n    margin-top: 8px;\n  }\n  :host .dso-modal .dso-footer button.dso-tertiary,\n  :host .dso-modal .dso-footer button.dso-tertiary span, :host .dso-modal .dso-footer button.btn-link,\n  :host .dso-modal .dso-footer button.btn-link span {\n    float: none;\n  }\n}\n\n.dso-modal .dso-dialog.dso-table-dialog {\n  margin-top: 1rem;\n  max-width: calc(100% - 2rem);\n}\n.dso-modal .dso-dialog.dso-table-dialog .dso-body {\n  max-height: calc(100vh - 112px - 1.5em - 2rem);\n}\n@media screen and (max-width: 767px) {\n  .dso-modal .dso-dialog.dso-table-dialog {\n    max-width: 100%;\n  }\n}\n\n:host([is-responsive]) .dso-table-body {\n  border: 1px solid #ccc;\n  margin-bottom: 0;\n  overflow-y: hidden;\n  width: 100%;\n}\n:host([is-responsive]) .dso-table-body.dso-body {\n  width: calc(100% - 64px);\n}\n\n.dso-table-utilities {\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 8px;\n}\n.dso-table-utilities .dso-responsive-message {\n  margin-bottom: 0;\n}\n.dso-table-utilities .dso-responsive-message:only-child {\n  width: 100%;\n}\n.dso-table-utilities .open-modal-button:only-child {\n  margin-left: auto;\n}\n\n.dso-responsive-message {\n  font-size: 0.8em;\n  margin-bottom: 8px;\n  position: relative;\n  text-align: center;\n}\n\n.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-bottom: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: left;\n  user-select: none;\n  vertical-align: middle;\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n  cursor: pointer;\n}\n.dso-tertiary:focus, .dso-tertiary:focus-visible {\n  outline-offset: 2px;\n}\n.dso-tertiary:active {\n  outline: 0;\n}\n.dso-tertiary[disabled] {\n  color: #afcf9d;\n}\n.dso-tertiary[disabled].dso-spinner-left, .dso-tertiary[disabled].dso-spinner-right {\n  color: #39870c;\n}\n.dso-tertiary:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\n.dso-tertiary:not([disabled]):active {\n  color: #173521;\n}\n.dso-tertiary.btn-align {\n  line-height: calc(1.5em - 1px);\n  padding: 11px 0;\n  position: relative;\n}\n.dso-tertiary.dso-spinner-left::before {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  height: 24px;\n  vertical-align: middle;\n  width: 24px;\n  margin-right: 8px;\n}\n.dso-tertiary.dso-spinner-right::after {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  height: 24px;\n  vertical-align: middle;\n  width: 24px;\n  margin-left: 8px;\n}\n.dso-tertiary dso-icon + span:not(.sr-only),\n.dso-tertiary svg.di + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + dso-icon,\n.dso-tertiary span:not(.sr-only) + svg.di {\n  margin-left: 8px;\n}\n.dso-tertiary svg.di.di-chevron-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-chevron-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-chevron-up {\n  margin-left: 4px;\n}\n.dso-tertiary dso-icon[icon=chevron-left] + span:not(.sr-only),\n.dso-tertiary dso-icon[icon=chevron-right] + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-down + span:not(.sr-only),\n.dso-tertiary svg.di.di-angle-up + span:not(.sr-only),\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-down,\n.dso-tertiary span:not(.sr-only) + svg.di.di-angle-up,\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-left],\n.dso-tertiary span:not(.sr-only) + dso-icon[icon=chevron-right] {\n  margin-left: 0;\n}\n.dso-tertiary dso-icon,\n.dso-tertiary svg.di,\n.dso-tertiary span {\n  vertical-align: middle;\n}\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n}\n\n.dso-modal-overlay {\n  background-color: rgba(255, 255, 255, 0.8);\n  bottom: 0;\n  display: block;\n  left: 0;\n  position: fixed;\n  right: 0;\n  top: 0;\n  z-index: 529;\n}\n\n.dso-table-placeholder {\n  box-shadow: inset 0 0 0 1px #ccc;\n  display: grid;\n  place-content: center;\n}";const i=class{constructor(t){o(this,t);this.labelledbyId=r();this.noModal=false;this.isResponsive=false;this.modalActive=false;this.placeholderHeight=undefined}startResponsiveBehavior(){var o;(o=this.resizeObserver)===null||o===void 0?void 0:o.observe(this.host)}componentWillLoad(){this.resizeObserver=new ResizeObserver(d((o=>this.setResponsiveTable(o)),200))}componentDidLoad(){this.startResponsiveBehavior()}componentDidRender(){this.setFocusTrap()}disconnectedCallback(){var o;(o=this.resizeObserver)===null||o===void 0?void 0:o.disconnect()}render(){var o,n;const d=(n=(o=this.host.querySelector(":scope > table > caption"))===null||o===void 0?void 0:o.textContent)===null||n===void 0?void 0:n.trim();return t(s,null,this.modalActive&&this.placeholderHeight&&t("div",{class:"dso-table-placeholder",style:{height:`${this.placeholderHeight}px`}}),this.modalActive&&t("div",{class:"dso-modal-overlay"}),t("div",{class:{"dso-modal":this.modalActive}},t("div",Object.assign({class:{"dso-dialog":this.modalActive,"dso-table-dialog":true},ref:o=>this.focusTrapElement=o},this.modalActive?{["aria-labelledby"]:this.labelledbyId,role:"dialog"}:{}),(this.isResponsive||!this.noModal)&&t("div",{class:"dso-table-utilities",style:this.modalActive?{display:"none"}:undefined},this.isResponsive&&t("div",{class:"dso-responsive-message"},t("span",null,"beweeg de tabel van links naar rechts")),!this.noModal&&t("button",{type:"button",class:"dso-tertiary open-modal-button",ref:o=>this.buttonElement=o,onClick:()=>this.openModal()},t("span",{class:"sr-only"},"tabel ",d!==null&&d!==void 0?d:""," "),t("span",null,"vergroten"),t("dso-icon",{icon:"external-link"}))),this.modalActive&&t("div",{class:"dso-header"},t("h2",{id:this.labelledbyId,class:{"sr-only":!d}},d||"Uitvergrote tabel dialoog"),t("button",{type:"button",class:"dso-close",onClick:()=>this.closeModal()},t("dso-icon",{icon:"times"}),t("span",{class:"sr-only"},"Sluiten"))),t("div",{class:{"dso-body":this.modalActive,"dso-table-body":true}},t("slot",null)))))}openModal(){this.placeholderHeight=this.host.clientHeight;this.modalActive=true}closeModal(){this.placeholderHeight=undefined;this.modalActive=false}setFocusTrap(){var o,t;if(this.modalActive&&this.focusTrapElement&&!this.trap){this.trap=e([this.host,this.focusTrapElement],{escapeDeactivates:true,clickOutsideDeactivates:o=>{if(o instanceof MouseEvent&&o.composedPath()[0]===this.focusTrapElement){this.closeModal();return false}return true},setReturnFocus:(o=this.buttonElement)!==null&&o!==void 0?o:false,onDeactivate:()=>this.closeModal(),tabbableOptions:{getShadowRoot:true}}).activate()}else if(!this.modalActive&&this.trap){(t=this.trap)===null||t===void 0?void 0:t.deactivate();delete this.trap}}setResponsiveTable([o]){if(!o){throw new Error("No dsoTable found")}const t=o.target.querySelector("table");if(o&&t instanceof HTMLTableElement){this.isResponsive=Math.floor(t.getBoundingClientRect().width)>Math.floor(o.contentRect.width)}}get host(){return n(this)}};i.style=a;export{i as dso_table};
-//# sourceMappingURL=p-106b3e01.entry.js.map

package/dist/dso-toolkit/p-180255f9.entry.js

@@ -1,2 +0,0 @@
-import{h as n,F as o,r as t,c as e,H as s,g as c}from"./p-53c8538c.js";import{i as r}from"./p-5950644a.js";import{c as i}from"./p-6a1980b4.js";import{v as d}from"./p-5d7f4ff2.js";function l(n){if(n instanceof Element){return n.localName}if(n.nodeName.includes(":")){return n.nodeName.substring(n.nodeName.indexOf(":")+1)}return n.nodeName}class a{constructor(){this.name="Al"}render(o,{mapNodeToJsx:t,path:e}){const s=e.some((n=>{const o=l(n);return o==="Al"||o==="Opschrift"}));const c=t(o.childNodes);return s?n("span",{role:"paragraph"},c):n("p",null,c)}}class u{constructor(){this.name="Bron"}render(o,{mapNodeToJsx:t}){return n("span",{class:"dso-ozon-bron"},t(o.childNodes))}}class h{constructor(){this.name="#document"}render(t,{mapNodeToJsx:e}){return n(o,null,e(t.childNodes))}}class f{constructor(){this.name=["ExtRef","ExtIoRef"]}render(o,{mapNodeToJsx:t}){const e=o.tagName==="ExtIoRef"?o.getAttribute("href"):o.getAttribute("ref");return n("a",{target:"_blank",rel:"noopener noreferrer",href:e!==null&&e!==void 0?e:undefined},n("span",{class:"sr-only"},"opent in nieuw venster "),t(o.childNodes))}}class p{constructor(){this.name=["<fallback>"]}render(o,{mapNodeToJsx:t}){return n("span",{class:`fallback od-${l(o)}`},t(o.childNodes))}}const g=({bijschrift:t,bron:e,mapNodeToJsx:s})=>n("span",{class:"figuur-bijschrift"},t&&t.inhoud&&s(t.inhoud),e&&n(o,null,`${t?" ":""}(bron: `,s(e),")"));class m{constructor(){this.name=["Figuur"]}setImageDimensions(n,o){const{naturalHeight:t,naturalWidth:e}=n;n.height=t*(o/100);n.width=e*(o/100)}onImageLoad(n,o){if(n.target instanceof HTMLImageElement&&o){this.setImageDimensions(n.target,o)}}render(o,{mapNodeToJsx:t}){var e,s,c,r,i,d;const a=Array.from(o.childNodes);const u=(e=a.find((n=>l(n)==="Titel")))===null||e===void 0?void 0:e.textContent;const h=a.find((n=>l(n)==="Bron"));const f=a.find((n=>l(n)==="Illustratie"));const p=a.find((n=>l(n)==="Bijschrift"));if(f instanceof Element){const o={naam:f.getAttribute("naam"),breedte:f.getAttribute("breedte"),hoogte:f.getAttribute("hoogte"),uitlijning:f.getAttribute("uitlijning"),alt:f.getAttribute("alt"),schaal:f.getAttribute("schaal")};const e=p instanceof Element?{inhoud:p.childNodes,locatie:(s=p.getAttribute("locatie"))!==null&&s!==void 0?s:"onder"}:undefined;return n("div",{class:`dso-ozon-figuur ${e?`bijschrift-${e.locatie}`:"onder"}`},u&&n("span",{class:"figuur-titel"},u),(e===null||e===void 0?void 0:e.locatie)==="boven"&&n(g,{bijschrift:e,bron:h,mapNodeToJsx:t}),n("dso-image-overlay",null,u&&n("div",{slot:"titel"},n("span",null,u)),n("img",{src:(c=o.naam)!==null&&c!==void 0?c:undefined,alt:(d=(i=(r=o.alt)!==null&&r!==void 0?r:u)!==null&&i!==void 0?i:o.naam)!==null&&d!==void 0?d:undefined,onLoad:n=>this.onImageLoad(n,Number(o.schaal))}),(e||h)&&n("div",{slot:"bijschrift"},n(g,{bijschrift:e,bron:h,mapNodeToJsx:t}))),((e===null||e===void 0?void 0:e.locatie)==="onder"||!e&&h)&&n(g,{bijschrift:e,bron:h,mapNodeToJsx:t}))}}}class z{constructor(){this.name=["Inhoud","ContainerBlocksType","BlockMixedcontentMetMaximaleInlinesMarkersPopupsType"]}render(o,{mapNodeToJsx:t}){return n("div",{class:"dso-rich-content"},t(o.childNodes))}}class b{constructor(){this.name=["InlineTekstAfbeelding","Illustratie"]}render(o){var t,e,s,c;return n("img",{src:(t=o.getAttribute("naam"))!==null&&t!==void 0?t:undefined,alt:(e=o.getAttribute("naam"))!==null&&e!==void 0?e:undefined,height:(s=o.getAttribute("hoogte"))!==null&&s!==void 0?s:undefined,width:(c=o.getAttribute("breedte"))!==null&&c!==void 0?c:undefined})}}class v{constructor(){this.name=["sub","sup","strong","b","u","i","br"]}render(o,{mapNodeToJsx:t}){if(o.localName==="br"){return n("br",null)}const e=o.localName;return n(e,null,t(o.childNodes))}}class x{constructor(){this.name="IntIoRef"}render(o,{mapNodeToJsx:t,emitAnchorClick:e}){const s=o.getAttribute("ref");if(!s){return t(o.childNodes)}const c=n=>{n.preventDefault();const o=n.currentTarget;if(!(o instanceof HTMLAnchorElement)){return}const{href:t}=o;e({node:this.name,href:t,documentComponent:s,originalEvent:n})};return n("a",{href:`#${s}`,onClick:c},t(o.childNodes))}}class w{constructor(){this.name="IntRef"}render(o,{mapNodeToJsx:t,emitAnchorClick:e}){const s=o.getAttribute("ref");if(!s){return t(o.childNodes)}const c=n=>{n.preventDefault();const o=n.currentTarget;if(!(o instanceof HTMLAnchorElement)){return}const{href:t}=o;e({node:this.name,href:t,documentComponent:s,originalEvent:n})};return n("a",{href:`#${s}`,onClick:c},t(o.childNodes))}}class y{constructor(){this.name="Lijst"}render(o,{mapNodeToJsx:t}){var e;const s=Array.from(o.childNodes);const c=s.find((n=>l(n)==="Lijstaanhef"));const r=s.find((n=>l(n)==="Lijstsluiting"));const i=s.filter((n=>l(n)==="Li"));return n("div",{class:"dso-ozon-lijst od-Lijst"},c&&t(c),n("ul",{class:(e=o.getAttribute("type"))!==null&&e!==void 0?e:""},i.map((o=>{var e;const s=Array.from(o.childNodes);const c=(e=s.find((n=>l(n)==="LiNummer")))===null||e===void 0?void 0:e.childNodes;return n("li",{class:"od-Li"},c&&n("span",{class:"od-LiNummer"},t(c)),t(s.filter((n=>l(n)!=="LiNummer"))))}))),r&&t(r))}}class k{constructor(){this.name="NieuweTekst"}render(o,{mapNodeToJsx:t}){return n("ins",null,t(o.childNodes))}}class j{constructor(){this.name="Noot";this.handles=["NootNummer"]}identify(){return"Noot"}render(t,{mapNodeToJsx:e,state:s,setState:c}){var r,i;const d=t.getAttribute("id");if(!d){console.error("Noot node without id",t);return n(o,null)}const a=`dso-ozon-note-${d}`;const u=Array.from(t.childNodes);const h=(i=(r=u.find((n=>l(n)==="NootNummer")))===null||r===void 0?void 0:r.textContent)!==null&&i!==void 0?i:d;return n(o,null,n("sup",null,n("button",{type:"button",class:"toggle-note","aria-describedby":a,onClick:()=>c===null||c===void 0?void 0:c(s===d?undefined:d),onBlur:()=>c===null||c===void 0?void 0:c(undefined),"aria-expanded":s===d?"true":"false"},h)),n("dso-tooltip",{active:s===d,id:a,stateless:true,descriptive:true},n("span",{role:"section"},e(Array.from(t.querySelectorAll(":scope > Al"))))))}}class N{constructor(){this.name="Opschrift"}render(t,{mapNodeToJsx:e}){return n(o,null,e(t.childNodes))}}function T(n,o){const t=Array.from(o);const e=B(t);return{totalWidth:e,count:n,columns:t.map(((n,o)=>{var t;const s=n.getAttribute("colnum");return{name:(t=n.getAttribute("colname"))!==null&&t!==void 0?t:"",number:s?parseInt(s,10):o+1,width:E(e,n)}}))}}function B(n){return n.reduce(((n,o)=>{var t,e;const s=(e=(t=o.getAttribute("colwidth"))===null||t===void 0?void 0:t.replace(/[^0-9]/,""))!==null&&e!==void 0?e:"";const c=parseInt(s,10);return n+(isNaN(c)?0:c)}),0)}function E(n,o){const t=o.getAttribute("colwidth");if(!t){return undefined}if(t==="*"){return"100%"}if(t.includes("*")||t.match(/^[\d+]$/)){const o=parseInt(t.replace(/[^0-9]/,""),10);return`${Math.round(o/n*100)}%`}return t}const A=({colspecs:t})=>t.columns.length>0?n("colgroup",null,t.columns.map((o=>n("col",{style:{width:o.width}})))):n(o,null);function C(n){return{moreRows:n.getAttribute("morerows"),nameStart:n.getAttribute("namest"),nameEnd:n.getAttribute("nameend")}}function I({columns:n},o,t){const e=n.find((n=>n.name===o));const s=n.find((n=>n.name===t));if(!e||!s){return undefined}const c=s.number-e.number+1;return c===1?undefined:c}const L=({context:{mapNodeToJsx:o},colspecs:t,cell:e})=>{const{moreRows:s,nameStart:c,nameEnd:r}=C(e);const i={rowSpan:s?parseInt(s,10)+1:undefined,colSpan:t&&c&&r?I(t,c,r):undefined};return n("td",Object.assign({},i),o(e.childNodes))};const J=({context:t,colspecs:e,rows:s})=>n(o,null,s.map((o=>n("tr",null,Array.from(o.children).map((o=>n(L,{cell:o,colspecs:e,context:t})))))));function D(n){var o,t,e;const s=n.querySelector(":scope > tgroup");const c=(o=s===null||s===void 0?void 0:s.getAttribute("cols"))!==null&&o!==void 0?o:undefined;const r=c?parseInt(c,10):undefined;return{caption:(e=(t=n.querySelector(":scope > title"))===null||t===void 0?void 0:t.textContent)!==null&&e!==void 0?e:undefined,colspecs:s&&r?T(r,s.querySelectorAll(":scope > colspec")):undefined,headRows:Array.from(n.querySelectorAll(":scope > tgroup > thead > row")),bodyRows:Array.from(n.querySelectorAll(":scope > tgroup > tbody > row")),editAction:n.getAttribute("wijzigactie")}}class R{constructor(){this.name="table";this.handles=["title","tgroup","colspec","thead","tbody","row","cell"];this.id=d()}render(o,t){const{caption:e,colspecs:s,headRows:c,bodyRows:r,editAction:d}=D(o);const a=Array.from(o.childNodes).find((n=>l(n)==="Bron"));return n("dso-table",null,n("table",Object.assign({class:i("table dso-table-vertical-lines",{"dso-del":d==="verwijder","dso-ins":d==="voegtoe"})},a?{"aria-describedby":this.id}:{}),e&&n("caption",null,e),s&&n(A,{colspecs:s}),c.length>0&&n("thead",null,n(J,{rows:c,colspecs:s,context:t})),r.length>0&&n("tbody",null,n(J,{rows:r,colspecs:s,context:t}))),a&&n("div",{id:this.id},t.mapNodeToJsx(a)))}}class M{constructor(){this.name="#text"}render(t){return n(o,null,t.textContent)}}class O{constructor(){this.name="VerwijderdeTekst"}render(o,{mapNodeToJsx:t}){return n("del",null,t(o.childNodes))}}class ${constructor(){this.mappers=[new M,new h,new z,new N,new w,new f,new a,new v,new b,new j,new R,new x,new m,new y,new u,new k,new O];this.skip=this.mappers.reduce(((n,o)=>{if(o.handles){n.push(...o.handles)}return n}),[]);this.fallbackNode=new p;this.domParser=new DOMParser}findMapper(n){var o;if(this.skip.includes(n)){return undefined}return(o=this.mappers.find((o=>{if(Array.isArray(o.name)){return o.name.includes(n)}return o.name===n})))!==null&&o!==void 0?o:this.fallbackNode}mapNodeToJsx(t,e,s){var c;if(t instanceof NodeList){return n(o,null,Array.from(t).map((n=>this.mapNodeToJsx(n,e,s))))}if(Array.isArray(t)){return n(o,null,t.map((n=>this.mapNodeToJsx(n,e,s))))}const r=l(t);const i=this.findMapper(r);if(!i){return n(o,null)}const d=(c=i.identify)===null||c===void 0?void 0:c.call(i,t);const a=d?e.state[d]:undefined;const u=d?n=>e.setState(Object.assign(Object.assign({},e.state),{[d]:n})):undefined;return i.render(t,{mapNodeToJsx:n=>this.mapNodeToJsx(n,e,[...s,t]),emitAnchorClick:e.emitAnchorClick,setState:u,state:a,path:s})}transform(n,o){if(!this.cache||this.cache.xml!==n){this.cache={xml:n,document:this.domParser.parseFromString(n,"text/xml")}}const t=this.cache.document;return this.mapNodeToJsx(t.getRootNode(),o,[])}}const H="ins.sc-dso-ozon-content {\n  background-color: #e4f1d4;\n  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);\n  color: #000;\n  text-decoration: none;\n}\n\n.sc-dso-ozon-content-h:not([inline]) {\n  display: block;\n}\n\n[inline].sc-dso-ozon-content-h {\n  display: inline;\n}\n\n[deleted].sc-dso-ozon-content-h *.sc-dso-ozon-content {\n  text-decoration: line-through !important;\n}\n\n[interactive].sc-dso-ozon-content-h {\n  background-color: transparent;\n  color: #39870c;\n  text-decoration: underline;\n  cursor: pointer;\n  color: #275937;\n  font-weight: 600;\n  text-decoration: none;\n}\n[interactive].sc-dso-ozon-content-h:hover, [interactive].sc-dso-ozon-content-h:focus {\n  color: #676cb0;\n  text-decoration: underline;\n}\n[interactive].sc-dso-ozon-content-h:active {\n  text-decoration: none;\n}\n\n[interactive=sub].sc-dso-ozon-content-h {\n  color: #191919;\n}\n\n.deleted-start.sc-dso-ozon-content, .deleted-end.sc-dso-ozon-content {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  border: 0;\n}\n\nbutton.toggle-note.sc-dso-ozon-content {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-bottom: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: left;\n  user-select: none;\n  vertical-align: middle;\n  border: 0;\n  color: #39870c;\n  line-height: 1;\n  padding: 0;\n  background-color: transparent;\n}\nbutton.toggle-note.sc-dso-ozon-content:focus, button.toggle-note.sc-dso-ozon-content:focus-visible {\n  outline-offset: 2px;\n}\nbutton.toggle-note.sc-dso-ozon-content:active {\n  outline: 0;\n}\nbutton.toggle-note[disabled].sc-dso-ozon-content {\n  color: #afcf9d;\n}\nbutton.toggle-note[disabled].dso-spinner-left.sc-dso-ozon-content, button.toggle-note[disabled].dso-spinner-right.sc-dso-ozon-content {\n  color: #39870c;\n}\nbutton.toggle-note.sc-dso-ozon-content:not([disabled]):hover {\n  color: #275937;\n  text-decoration: underline;\n  text-underline-position: under;\n}\nbutton.toggle-note.sc-dso-ozon-content:not([disabled]):active {\n  color: #173521;\n}\nbutton.toggle-note.btn-align.sc-dso-ozon-content {\n  line-height: calc(1.5em - 1px);\n  padding: 11px 0;\n  position: relative;\n}\nbutton.toggle-note.dso-spinner-left.sc-dso-ozon-content::before {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  height: 24px;\n  vertical-align: middle;\n  width: 24px;\n  margin-right: 8px;\n}\nbutton.toggle-note.dso-spinner-right.sc-dso-ozon-content::after {\n  background-image: url(\"data:image/svg+xml,%3Csvg class='spinner' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E .spinner %7B animation: rotator 8s linear infinite; transform-origin: center; %7D @keyframes rotator %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D .path %7B stroke-dasharray: 265; stroke-dashoffset: 0; transform-origin: center; stroke: %2339870c; animation: dash 2s ease-in-out infinite; %7D @keyframes dash %7B 0%25 %7B stroke-dashoffset: 265; %7D 50%25 %7B stroke-dashoffset: 65; transform:rotate(90deg); %7D 100%25 %7B stroke-dashoffset: 265; transform:rotate(360deg); %7D %3C/style%3E%3Ccircle class='path' fill='none' stroke-width='10' stroke-linecap='butt' cx='50' cy='50' r='45'%3E%3C/circle%3E%3C/svg%3E\");\n  background-repeat: no-repeat;\n  content: \"\";\n  display: inline-block;\n  height: 24px;\n  vertical-align: middle;\n  width: 24px;\n  margin-left: 8px;\n}\nbutton.toggle-note.sc-dso-ozon-content dso-icon.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content svg.di.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + dso-icon.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + svg.di.sc-dso-ozon-content {\n  margin-left: 8px;\n}\nbutton.toggle-note.sc-dso-ozon-content svg.di.di-chevron-down.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content svg.di.di-chevron-up.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + svg.di.di-chevron-down.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + svg.di.di-chevron-up.sc-dso-ozon-content {\n  margin-left: 4px;\n}\nbutton.toggle-note.sc-dso-ozon-content dso-icon[icon=chevron-left].sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content dso-icon[icon=chevron-right].sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content svg.di.di-angle-down.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content svg.di.di-angle-up.sc-dso-ozon-content + span.sc-dso-ozon-content:not(.sr-only), button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + svg.di.di-angle-down.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + svg.di.di-angle-up.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + dso-icon[icon=chevron-left].sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content:not(.sr-only) + dso-icon[icon=chevron-right].sc-dso-ozon-content {\n  margin-left: 0;\n}\nbutton.toggle-note.sc-dso-ozon-content dso-icon.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content svg.di.sc-dso-ozon-content, button.toggle-note.sc-dso-ozon-content span.sc-dso-ozon-content {\n  vertical-align: middle;\n}\n\nspan[role=section].sc-dso-ozon-content, span[role=paragraph].sc-dso-ozon-content {\n  display: block;\n}\n\n.fallback.sc-dso-ozon-content {\n  display: block;\n}\n\n.od-Term.sc-dso-ozon-content {\n  font-weight: 700;\n}\n\n.od-Definitie.sc-dso-ozon-content, .od-Tussenkop.sc-dso-ozon-content {\n  font-style: italic;\n}\n\n.od-Inhoud.sc-dso-ozon-content, .od-Inhoud.sc-dso-ozon-content > .od-Lijst.sc-dso-ozon-content, .od-IntIoRef.sc-dso-ozon-content, .od-Lidnr.sc-dso-ozon-content, .od-LiNr.sc-dso-ozon-content, .od-Opschrift.sc-dso-ozon-content, .od-Tussenkop.sc-dso-ozon-content {\n  display: inline;\n}\n\n.od-Al.sc-dso-ozon-content {\n  margin-bottom: 0.75em;\n}\n\n.od-IntIoRef.sc-dso-ozon-content {\n  border-bottom: 1px dotted;\n}\n\n.dso-ozon-bron.sc-dso-ozon-content {\n  font-style: italic;\n  font-size: 0.75rem;\n}\n\n.dso-ozon-figuur.sc-dso-ozon-content {\n  margin-bottom: 16px;\n}\n.dso-ozon-figuur.sc-dso-ozon-content .figuur-bijschrift.sc-dso-ozon-content {\n  display: block;\n  font-size: 0.75rem;\n  font-style: italic;\n}\n.dso-ozon-figuur.bijschrift-boven.sc-dso-ozon-content .figuur-bijschrift.sc-dso-ozon-content {\n  padding-bottom: 0.25rem;\n}\n.dso-ozon-figuur.bijschrift-onder.sc-dso-ozon-content .figuur-bijschrift.sc-dso-ozon-content {\n  padding-top: 0.25rem;\n}\n.dso-ozon-figuur.sc-dso-ozon-content .figuur-titel.sc-dso-ozon-content {\n  color: #8b4a6a;\n  display: block;\n  font-weight: 500;\n  padding-bottom: 0.5rem;\n}\n\n.dso-ozon-lijst.sc-dso-ozon-content span.od-Lijstaanhef.sc-dso-ozon-content, .dso-ozon-lijst.sc-dso-ozon-content span.od-Lijstsluiting.sc-dso-ozon-content {\n  margin-bottom: 1rem;\n}\n.dso-ozon-lijst.sc-dso-ozon-content ul.expliciet.sc-dso-ozon-content {\n  list-style: none;\n}\n.dso-ozon-lijst.sc-dso-ozon-content ul.expliciet.sc-dso-ozon-content > .od-Li.sc-dso-ozon-content {\n  position: relative;\n}\n.dso-ozon-lijst.sc-dso-ozon-content ul.expliciet.sc-dso-ozon-content > .od-Li.sc-dso-ozon-content > span.od-LiNummer.sc-dso-ozon-content {\n  position: absolute;\n  left: -44px;\n  text-align: right;\n  width: 40px;\n}\n\n.od-Tabel.sc-dso-ozon-content thead.sc-dso-ozon-content {\n  font-weight: 600;\n}\n\n.od-Kadertekst.sc-dso-ozon-content {\n  border: 1px solid #e5e5e5;\n  margin-bottom: 1rem;\n  padding: 1rem;\n}\n\n.dso-del.sc-dso-ozon-content {\n  background-color: #f5d8dc;\n  color: #000;\n  text-decoration: line-through;\n}\n.dso-del.sc-dso-ozon-content a.sc-dso-ozon-content {\n  color: #000;\n}\n\n.dso-ins.sc-dso-ozon-content {\n  background-color: #e4f1d4;\n  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.25);\n  color: #000;\n}\n.dso-ins.sc-dso-ozon-content a.sc-dso-ozon-content {\n  color: #000;\n}";const S=class{constructor(n){t(this,n);this.dsoAnchorClick=e(this,"dsoAnchorClick",7);this.dsoClick=e(this,"dsoClick",7);this.mapper=new $;this.content=undefined;this.inline=false;this.deleted=false;this.interactive=false;this.state={}}handleHostOnClick(n){if(this.interactive!==""&&!this.interactive){return}const o=n.composedPath().find((n=>n===this.host||n instanceof HTMLElement&&r(n)))===this.host;if(o){this.dsoClick.emit({originalEvent:n})}}render(){var o;const t={state:this.state,setState:n=>this.state=n,emitAnchorClick:this.dsoAnchorClick.emit};const e=this.mapper.transform((o=this.content)!==null&&o!==void 0?o:"",t);if(this.deleted){return n("section",null,n("slot",{name:"prefix"}),n("span",{class:"deleted-start"},"Begin verwijderd element"),e,n("span",{class:"deleted-end"},"Einde verwijderd element"),n("slot",{name:"suffix"}))}return n(s,{onClick:n=>this.handleHostOnClick(n)},n("slot",{name:"prefix"}),e,n("slot",{name:"suffix"}))}get host(){return c(this)}};S.style=H;export{S as dso_ozon_content};
-//# sourceMappingURL=p-180255f9.entry.js.map

package/dist/dso-toolkit/p-180255f9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["getNodeName","node","Element","localName","nodeName","includes","substring","indexOf","OzonContentAlNode","constructor","this","name","render","mapNodeToJsx","path","nestedAl","some","n","content","childNodes","h","role","OzonContentBronNode","class","OzonContentDocumentNode","Fragment","OzonContentExtRefNode","href","tagName","getAttribute","target","rel","undefined","OzonContentFallbackNode","Bijschrift","bijschrift","bron","inhoud","OzonContentFiguurNode","setImageDimensions","imageElement","schaal","naturalHeight","naturalWidth","height","width","onImageLoad","event","HTMLImageElement","Array","from","titel","_a","find","textContent","illustratieNode","bijschriftNode","illustratie","naam","breedte","hoogte","uitlijning","alt","locatie","_b","slot","src","_c","_f","_e","_d","onLoad","Number","OzonContentInhoudNode","OzonContentInlineTekstAfbeeldingNode","OzonContentInlineNodes","Tag","OzonContentIntIoRefNode","emitAnchorClick","ref","intRefOnClick","preventDefault","currentTarget","HTMLAnchorElement","documentComponent","originalEvent","onClick","OzonContentIntRefNode","OzonContentLijstNode","aanhef","sluiting","listItems","filter","map","item","itemNodes","liNummer","OzonContentNieuweTekstNode","OzonContentNootNode","handles","identify","state","openNoteId","setState","noteId","console","error","noteControlsId","nootNummer","type","onBlur","active","id","stateless","descriptive","querySelectorAll","OzonContentOpschriftNode","mapColspecs","count","nodeList","elements","totalWidth","getTotalWidth","columns","element","index","colNumber","number","parseInt","getWidth","reduce","replace","colWidth","isNaN","match","Math","round","Colgroup","colspecs","length","colspec","style","getData","cell","moreRows","nameStart","nameEnd","getColspan","colspecStart","c","colspecEnd","colspan","Cell","context","td","rowSpan","colSpan","Object","assign","Rows","rows","row","children","mapData","tgroup","querySelector","colAttribute","columnCount","caption","headRows","bodyRows","editAction","OzonContentTableNode","uuidv4","clsx","OzonContentTextNode","OzonContentVerwijderdeTekstNode","Mapper","mappers","skip","t","m","push","fallbackNode","domParser","DOMParser","findMapper","isArray","NodeList","mapper","identity","call","s","transform","xml","cache","document","parseFromString","xmlDocument","getRootNode","ozonContentCss","OzonContent","handleHostOnClick","e","interactive","doIt","composedPath","eventTarget","host","HTMLElement","isTabbable","dsoClick","emit","dsoAnchorClick","transformed","deleted","Host"],"sources":["./src/components/ozon-content/get-node-name.function.ts","./src/components/ozon-content/nodes/al.node.tsx","./src/components/ozon-content/nodes/bron.node.tsx","./src/components/ozon-content/nodes/document.node.tsx","./src/components/ozon-content/nodes/ext-ref.node.tsx","./src/components/ozon-content/nodes/fallback.node.tsx","./src/components/ozon-content/nodes/figuur.node.tsx","./src/components/ozon-content/nodes/inhoud.node.tsx","./src/components/ozon-content/nodes/inline-tekst-afbeelding.node.tsx","./src/components/ozon-content/nodes/inline.nodes.tsx","./src/components/ozon-content/nodes/int-io-ref.node.tsx","./src/components/ozon-content/nodes/int-ref.node.tsx","./src/components/ozon-content/nodes/lijst.node.tsx","./src/components/ozon-content/nodes/nieuwe-tekst.node.tsx","./src/components/ozon-content/nodes/noot.node.tsx","./src/components/ozon-content/nodes/opschrift.node.tsx","./src/components/ozon-content/nodes/table.node/colspec/colspec-mapper.ts","./src/components/ozon-content/nodes/table.node/table-colgroup.tsx","./src/components/ozon-content/nodes/table.node/table-cell.tsx","./src/components/ozon-content/nodes/table.node/table-rows.tsx","./src/components/ozon-content/nodes/table.node/table.node.tsx","./src/components/ozon-content/nodes/text.node.tsx","./src/components/ozon-content/nodes/verwijderde-tekst.node.tsx","./src/components/ozon-content/ozon-content-mapper.tsx","./src/components/ozon-content/ozon-content.scss?tag=dso-ozon-content&encapsulation=scoped","./src/components/ozon-content/ozon-content.tsx"],"sourcesContent":["export function getNodeName(node: Node): string {\r\n  if (node instanceof Element) {\r\n    return node.localName;\r\n  }\r\n\r\n  if (node.nodeName.includes(\":\")) {\r\n    return node.nodeName.substring(node.nodeName.indexOf(\":\") + 1);\r\n  }\r\n\r\n  return node.nodeName;\r\n}\r\n","import { 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\nexport class OzonContentAlNode implements OzonContentNode {\r\n  name = \"Al\";\r\n\r\n  render(node: Element, { mapNodeToJsx, path }: OzonContentNodeContext) {\r\n    const nestedAl = path.some((n) => {\r\n      const nodeName = getNodeName(n);\r\n\r\n      return nodeName === \"Al\" || nodeName === \"Opschrift\";\r\n    });\r\n\r\n    const content = mapNodeToJsx(node.childNodes);\r\n\r\n    return nestedAl ? <span role=\"paragraph\">{content}</span> : <p>{content}</p>;\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentBronNode implements OzonContentNode {\r\n  name = \"Bron\";\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <span class=\"dso-ozon-bron\">{mapNodeToJsx(node.childNodes)}</span>;\r\n  }\r\n}\r\n","import { Fragment, h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentDocumentNode implements OzonContentNode {\r\n  name = \"#document\";\r\n\r\n  render(node: Node, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <Fragment>{mapNodeToJsx(node.childNodes)}</Fragment>;\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentExtRefNode implements OzonContentNode {\r\n  name = [\"ExtRef\", \"ExtIoRef\"];\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    const href = node.tagName === \"ExtIoRef\" ? node.getAttribute(\"href\") : node.getAttribute(\"ref\");\r\n\r\n    return (\r\n      <a target=\"_blank\" rel=\"noopener noreferrer\" href={href ?? undefined}>\r\n        <span class=\"sr-only\">opent in nieuw venster </span>\r\n        {mapNodeToJsx(node.childNodes)}\r\n      </a>\r\n    );\r\n  }\r\n}\r\n","import { 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\nexport class OzonContentFallbackNode implements OzonContentNode {\r\n  // This name does not match any elements\r\n  name = [\"<fallback>\"];\r\n\r\n  render(node: Node, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <span class={`fallback od-${getNodeName(node)}`}>{mapNodeToJsx(node.childNodes)}</span>;\r\n  }\r\n}\r\n","import { Fragment, h, JSX } 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\nconst Bijschrift = ({ bijschrift, bron, mapNodeToJsx }: BijschriftProps): HTMLSpanElement => {\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  setImageDimensions(imageElement: HTMLImageElement, schaal: number) {\r\n    const { naturalHeight, naturalWidth } = imageElement;\r\n\r\n    imageElement.height = naturalHeight * (schaal / 100);\r\n    imageElement.width = naturalWidth * (schaal / 100);\r\n  }\r\n\r\n  onImageLoad(event: Event, schaal?: number) {\r\n    if (event.target instanceof HTMLImageElement && schaal) {\r\n      this.setImageDimensions(event.target, schaal);\r\n    }\r\n  }\r\n\r\n  render(node: Element, { mapNodeToJsx }: 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    if (illustratieNode instanceof Element) {\r\n      const illustratie = {\r\n        naam: illustratieNode.getAttribute(\"naam\"),\r\n        breedte: illustratieNode.getAttribute(\"breedte\"),\r\n        hoogte: illustratieNode.getAttribute(\"hoogte\"),\r\n        uitlijning: illustratieNode.getAttribute(\"uitlijning\"),\r\n        alt: illustratieNode.getAttribute(\"alt\"),\r\n        schaal: illustratieNode.getAttribute(\"schaal\"),\r\n      };\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      return (\r\n        <div class={`dso-ozon-figuur ${bijschrift ? `bijschrift-${bijschrift.locatie}` : \"onder\"}`}>\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>\r\n            {titel && (\r\n              <div slot=\"titel\">\r\n                <span>{titel}</span>\r\n              </div>\r\n            )}\r\n            <img\r\n              src={illustratie.naam ?? undefined}\r\n              alt={illustratie.alt ?? titel ?? illustratie.naam ?? undefined}\r\n              onLoad={(event: Event) => this.onImageLoad(event, Number(illustratie.schaal))}\r\n            />\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","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentInhoudNode implements OzonContentNode {\r\n  name = [\"Inhoud\", \"ContainerBlocksType\", \"BlockMixedcontentMetMaximaleInlinesMarkersPopupsType\"];\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <div class=\"dso-rich-content\">{mapNodeToJsx(node.childNodes)}</div>;\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentInlineTekstAfbeeldingNode implements OzonContentNode {\r\n  name = [\"InlineTekstAfbeelding\", \"Illustratie\"];\r\n\r\n  render(node: Element) {\r\n    return (\r\n      <img\r\n        src={node.getAttribute(\"naam\") ?? undefined}\r\n        alt={node.getAttribute(\"naam\") ?? undefined}\r\n        height={node.getAttribute(\"hoogte\") ?? undefined}\r\n        width={node.getAttribute(\"breedte\") ?? undefined}\r\n      />\r\n    );\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentInlineNodes implements OzonContentNode {\r\n  name = [\"sub\", \"sup\", \"strong\", \"b\", \"u\", \"i\", \"br\"];\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    if (node.localName === \"br\") {\r\n      return <br />;\r\n    }\r\n\r\n    const Tag = node.localName;\r\n\r\n    return <Tag>{mapNodeToJsx(node.childNodes)}</Tag>;\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentIntIoRefNode implements OzonContentNode {\r\n  name = \"IntIoRef\";\r\n\r\n  render(node: Element, { mapNodeToJsx, emitAnchorClick }: OzonContentNodeContext) {\r\n    const ref = node.getAttribute(\"ref\");\r\n    if (!ref) {\r\n      return mapNodeToJsx(node.childNodes);\r\n    }\r\n\r\n    const intRefOnClick = (event: MouseEvent) => {\r\n      event.preventDefault();\r\n\r\n      const target = event.currentTarget;\r\n      if (!(target instanceof HTMLAnchorElement)) {\r\n        return;\r\n      }\r\n\r\n      const { href } = target;\r\n\r\n      emitAnchorClick({\r\n        node: this.name,\r\n        href,\r\n        documentComponent: ref,\r\n        originalEvent: event,\r\n      });\r\n    };\r\n\r\n    return (\r\n      <a href={`#${ref}`} onClick={intRefOnClick}>\r\n        {mapNodeToJsx(node.childNodes)}\r\n      </a>\r\n    );\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentIntRefNode implements OzonContentNode {\r\n  name = \"IntRef\";\r\n\r\n  render(node: Element, { mapNodeToJsx, emitAnchorClick }: OzonContentNodeContext) {\r\n    const ref = node.getAttribute(\"ref\");\r\n    if (!ref) {\r\n      return mapNodeToJsx(node.childNodes);\r\n    }\r\n\r\n    const intRefOnClick = (event: MouseEvent) => {\r\n      event.preventDefault();\r\n\r\n      const target = event.currentTarget;\r\n      if (!(target instanceof HTMLAnchorElement)) {\r\n        return;\r\n      }\r\n\r\n      const { href } = target;\r\n\r\n      emitAnchorClick({\r\n        node: this.name,\r\n        href,\r\n        documentComponent: ref,\r\n        originalEvent: event,\r\n      });\r\n    };\r\n\r\n    return (\r\n      <a href={`#${ref}`} onClick={intRefOnClick}>\r\n        {mapNodeToJsx(node.childNodes)}\r\n      </a>\r\n    );\r\n  }\r\n}\r\n","import { 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\nexport class OzonContentLijstNode implements OzonContentNode {\r\n  name = \"Lijst\";\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    const childNodes = Array.from(node.childNodes);\r\n    const aanhef = childNodes.find((n) => getNodeName(n) === \"Lijstaanhef\");\r\n    const sluiting = childNodes.find((n) => getNodeName(n) === \"Lijstsluiting\");\r\n    const listItems = childNodes.filter((n) => getNodeName(n) === \"Li\");\r\n\r\n    return (\r\n      <div class=\"dso-ozon-lijst od-Lijst\">\r\n        {aanhef && mapNodeToJsx(aanhef)}\r\n        <ul class={node.getAttribute(\"type\") ?? \"\"}>\r\n          {listItems.map((item) => {\r\n            const itemNodes = Array.from(item.childNodes);\r\n            const liNummer = itemNodes.find((n) => getNodeName(n) === \"LiNummer\")?.childNodes;\r\n\r\n            return (\r\n              <li class=\"od-Li\">\r\n                {liNummer && <span class=\"od-LiNummer\">{mapNodeToJsx(liNummer)}</span>}\r\n                {mapNodeToJsx(itemNodes.filter((n) => getNodeName(n) !== \"LiNummer\"))}\r\n              </li>\r\n            );\r\n          })}\r\n        </ul>\r\n        {sluiting && mapNodeToJsx(sluiting)}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentNieuweTekstNode implements OzonContentNode {\r\n  name = \"NieuweTekst\";\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <ins>{mapNodeToJsx(node.childNodes)}</ins>;\r\n  }\r\n}\r\n","import { h, Fragment } 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\nexport class OzonContentNootNode implements OzonContentNode {\r\n  name = \"Noot\";\r\n\r\n  handles = [\"NootNummer\"];\r\n\r\n  identify(): string | undefined {\r\n    return \"Noot\";\r\n  }\r\n\r\n  render(node: Element, { mapNodeToJsx, state: openNoteId, setState }: OzonContentNodeContext<string | undefined>) {\r\n    const noteId = node.getAttribute(\"id\");\r\n    if (!noteId) {\r\n      console.error(\"Noot node without id\", node);\r\n\r\n      return <Fragment />;\r\n    }\r\n\r\n    const noteControlsId = `dso-ozon-note-${noteId}`;\r\n\r\n    const childNodes = Array.from(node.childNodes);\r\n    const nootNummer = childNodes.find((n) => getNodeName(n) === \"NootNummer\")?.textContent ?? noteId;\r\n\r\n    return (\r\n      <>\r\n        <sup>\r\n          <button\r\n            type=\"button\"\r\n            class=\"toggle-note\"\r\n            aria-describedby={noteControlsId}\r\n            onClick={() => setState?.(openNoteId === noteId ? undefined : noteId)}\r\n            onBlur={() => setState?.(undefined)}\r\n            aria-expanded={openNoteId === noteId ? \"true\" : \"false\"}\r\n          >\r\n            {nootNummer}\r\n          </button>\r\n        </sup>\r\n        <dso-tooltip active={openNoteId === noteId} id={noteControlsId} stateless descriptive>\r\n          <span role=\"section\">{mapNodeToJsx(Array.from(node.querySelectorAll(\":scope > Al\")))}</span>\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n","import { h, Fragment } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentOpschriftNode implements OzonContentNode {\r\n  name = \"Opschrift\";\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <Fragment>{mapNodeToJsx(node.childNodes)}</Fragment>;\r\n  }\r\n}\r\n","import { Colspecs } from \"./colspec.interface\";\r\n\r\nexport function mapColspecs(count: number, nodeList: NodeListOf<Element>): Colspecs {\r\n  const elements = Array.from(nodeList);\r\n  const totalWidth = getTotalWidth(elements);\r\n\r\n  return {\r\n    totalWidth,\r\n    count,\r\n    columns: elements.map((element, index) => {\r\n      const colNumber = element.getAttribute(\"colnum\");\r\n\r\n      return {\r\n        name: element.getAttribute(\"colname\") ?? \"\",\r\n        number: colNumber ? parseInt(colNumber, 10) : index + 1,\r\n        width: getWidth(totalWidth, element),\r\n      };\r\n    }),\r\n  };\r\n}\r\n\r\nfunction getTotalWidth(elements: Element[]): number {\r\n  return elements.reduce((totalWidth, element) => {\r\n    const width = element.getAttribute(\"colwidth\")?.replace(/[^0-9]/, \"\") ?? \"\";\r\n    const colWidth = parseInt(width, 10);\r\n\r\n    return totalWidth + (isNaN(colWidth) ? 0 : colWidth);\r\n  }, 0);\r\n}\r\n\r\nfunction getWidth(totalWidth: number, element: Element): string | undefined {\r\n  const width = element.getAttribute(\"colwidth\");\r\n\r\n  if (!width) {\r\n    return undefined;\r\n  }\r\n\r\n  if (width === \"*\") {\r\n    return \"100%\";\r\n  }\r\n\r\n  if (width.includes(\"*\") || width.match(/^[\\d+]$/)) {\r\n    const colWidth = parseInt(width.replace(/[^0-9]/, \"\"), 10);\r\n\r\n    return `${Math.round((colWidth / totalWidth) * 100)}%`;\r\n  }\r\n\r\n  return width;\r\n}\r\n","import { Fragment, FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { Colspecs } from \"./colspec/colspec.interface\";\r\n\r\nexport const Colgroup: FunctionalComponent<{ colspecs: Colspecs }> = ({ colspecs }) =>\r\n  colspecs.columns.length > 0 ? (\r\n    <colgroup>\r\n      {colspecs.columns.map((colspec) => (\r\n        <col style={{ width: colspec.width }} />\r\n      ))}\r\n    </colgroup>\r\n  ) : (\r\n    <Fragment />\r\n  );\r\n","import { FunctionalComponent } from \"@stencil/core\";\r\nimport { h, JSXBase } from \"@stencil/core/internal\";\r\n\r\nimport { OzonContentNodeContext } from \"../../ozon-content-node-context.interface\";\r\nimport { Colspecs } from \"./colspec/colspec.interface\";\r\n\r\nfunction getData(cell: Element) {\r\n  return {\r\n    moreRows: cell.getAttribute(\"morerows\"),\r\n    nameStart: cell.getAttribute(\"namest\"),\r\n    nameEnd: cell.getAttribute(\"nameend\"),\r\n  };\r\n}\r\n\r\nfunction getColspan({ columns }: Colspecs, nameStart: string, nameEnd: string): number | undefined {\r\n  const colspecStart = columns.find((c) => c.name === nameStart);\r\n  const colspecEnd = columns.find((c) => c.name === nameEnd);\r\n  if (!colspecStart || !colspecEnd) {\r\n    return undefined;\r\n  }\r\n\r\n  const colspan = colspecEnd.number - colspecStart.number + 1;\r\n\r\n  return colspan === 1 ? undefined : colspan;\r\n}\r\n\r\nexport const Cell: FunctionalComponent<{\r\n  context: OzonContentNodeContext;\r\n  colspecs: Colspecs | undefined;\r\n  cell: Element;\r\n}> = ({ context: { mapNodeToJsx }, colspecs, cell }) => {\r\n  const { moreRows, nameStart, nameEnd } = getData(cell);\r\n\r\n  const td: JSXBase.TdHTMLAttributes<HTMLTableCellElement> = {\r\n    rowSpan: moreRows ? parseInt(moreRows, 10) + 1 : undefined,\r\n    colSpan: colspecs && nameStart && nameEnd ? getColspan(colspecs, nameStart, nameEnd) : undefined,\r\n  };\r\n\r\n  return <td {...td}>{mapNodeToJsx(cell.childNodes)}</td>;\r\n};\r\n","import { Fragment, FunctionalComponent, h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../../ozon-content-node-context.interface\";\r\n\r\nimport { Colspecs } from \"./colspec/colspec.interface\";\r\nimport { Cell } from \"./table-cell\";\r\n\r\nexport const Rows: FunctionalComponent<{\r\n  context: OzonContentNodeContext;\r\n  colspecs: Colspecs | undefined;\r\n  rows: Element[];\r\n}> = ({ context, colspecs, rows }) => {\r\n  return (\r\n    <>\r\n      {rows.map((row) => (\r\n        <tr>\r\n          {Array.from(row.children).map((cell) => (\r\n            <Cell cell={cell} colspecs={colspecs} context={context} />\r\n          ))}\r\n        </tr>\r\n      ))}\r\n    </>\r\n  );\r\n};\r\n","import { h } from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport { v4 as uuidv4 } from \"uuid\";\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\nimport { mapColspecs } from \"./colspec/colspec-mapper\";\r\nimport { Colgroup } from \"./table-colgroup\";\r\nimport { Rows } from \"./table-rows\";\r\n\r\nfunction mapData(node: Element) {\r\n  const tgroup = node.querySelector(\":scope > tgroup\");\r\n  const colAttribute = tgroup?.getAttribute(\"cols\") ?? undefined;\r\n  const columnCount = colAttribute ? parseInt(colAttribute, 10) : undefined;\r\n\r\n  return {\r\n    caption: node.querySelector(\":scope > title\")?.textContent ?? undefined,\r\n    colspecs: tgroup && columnCount ? mapColspecs(columnCount, tgroup.querySelectorAll(\":scope > colspec\")) : undefined,\r\n    headRows: Array.from(node.querySelectorAll(\":scope > tgroup > thead > row\")),\r\n    bodyRows: Array.from(node.querySelectorAll(\":scope > tgroup > tbody > row\")),\r\n    editAction: node.getAttribute(\"wijzigactie\"),\r\n  };\r\n}\r\n\r\nexport class OzonContentTableNode implements OzonContentNode {\r\n  name = \"table\";\r\n\r\n  handles = [\"title\", \"tgroup\", \"colspec\", \"thead\", \"tbody\", \"row\", \"cell\"];\r\n\r\n  id = uuidv4();\r\n\r\n  render(node: Element, context: OzonContentNodeContext) {\r\n    const { caption, colspecs, headRows, bodyRows, editAction } = mapData(node);\r\n\r\n    const bron = Array.from(node.childNodes).find((n) => getNodeName(n) === \"Bron\");\r\n\r\n    return (\r\n      <dso-table>\r\n        <table\r\n          class={clsx(\"table dso-table-vertical-lines\", {\r\n            \"dso-del\": editAction === \"verwijder\",\r\n            \"dso-ins\": editAction === \"voegtoe\",\r\n          })}\r\n          {...(bron ? { \"aria-describedby\": this.id } : {})}\r\n        >\r\n          {caption && <caption>{caption}</caption>}\r\n          {colspecs && <Colgroup colspecs={colspecs} />}\r\n          {headRows.length > 0 && (\r\n            <thead>\r\n              <Rows rows={headRows} colspecs={colspecs} context={context}></Rows>\r\n            </thead>\r\n          )}\r\n          {bodyRows.length > 0 && (\r\n            <tbody>\r\n              <Rows rows={bodyRows} colspecs={colspecs} context={context}></Rows>\r\n            </tbody>\r\n          )}\r\n        </table>\r\n        {bron && <div id={this.id}>{context.mapNodeToJsx(bron)}</div>}\r\n      </dso-table>\r\n    );\r\n  }\r\n}\r\n","import { Fragment, h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentTextNode implements OzonContentNode {\r\n  name = \"#text\";\r\n\r\n  render(node: Node) {\r\n    return <Fragment>{node.textContent}</Fragment>;\r\n  }\r\n}\r\n","import { h } from \"@stencil/core\";\r\n\r\nimport { OzonContentNodeContext } from \"../ozon-content-node-context.interface\";\r\nimport { OzonContentNode } from \"../ozon-content-node.interface\";\r\n\r\nexport class OzonContentVerwijderdeTekstNode implements OzonContentNode {\r\n  name = \"VerwijderdeTekst\";\r\n\r\n  render(node: Element, { mapNodeToJsx }: OzonContentNodeContext) {\r\n    return <del>{mapNodeToJsx(node.childNodes)}</del>;\r\n  }\r\n}\r\n","import { Fragment, h, JSX } from \"@stencil/core\";\r\n\r\nimport { getNodeName } from \"./get-node-name.function\";\r\nimport { OzonContentAlNode } from \"./nodes/al.node\";\r\nimport { OzonContentBronNode } from \"./nodes/bron.node\";\r\nimport { OzonContentDocumentNode } from \"./nodes/document.node\";\r\nimport { OzonContentExtRefNode } from \"./nodes/ext-ref.node\";\r\nimport { OzonContentFallbackNode } from \"./nodes/fallback.node\";\r\nimport { OzonContentFiguurNode } from \"./nodes/figuur.node\";\r\nimport { OzonContentInhoudNode } from \"./nodes/inhoud.node\";\r\nimport { OzonContentInlineTekstAfbeeldingNode } from \"./nodes/inline-tekst-afbeelding.node\";\r\nimport { OzonContentInlineNodes } from \"./nodes/inline.nodes\";\r\nimport { OzonContentIntIoRefNode } from \"./nodes/int-io-ref.node\";\r\nimport { OzonContentIntRefNode } from \"./nodes/int-ref.node\";\r\nimport { OzonContentLijstNode } from \"./nodes/lijst.node\";\r\nimport { OzonContentNieuweTekstNode } from \"./nodes/nieuwe-tekst.node\";\r\nimport { OzonContentNootNode } from \"./nodes/noot.node\";\r\nimport { OzonContentOpschriftNode } from \"./nodes/opschrift.node\";\r\nimport { OzonContentTableNode } from \"./nodes/table.node\";\r\nimport { OzonContentTextNode } from \"./nodes/text.node\";\r\nimport { OzonContentVerwijderdeTekstNode } from \"./nodes/verwijderde-tekst.node\";\r\nimport { OzonContentContext } from \"./ozon-content-context.interface\";\r\nimport { OzonContentNode } from \"./ozon-content-node.interface\";\r\n\r\nexport class Mapper {\r\n  private cache: { xml: string; document: Document } | undefined;\r\n\r\n  private mappers: OzonContentNode[] = [\r\n    new OzonContentTextNode(),\r\n    new OzonContentDocumentNode(),\r\n    new OzonContentInhoudNode(),\r\n    new OzonContentOpschriftNode(),\r\n    new OzonContentIntRefNode(),\r\n    new OzonContentExtRefNode(),\r\n    new OzonContentAlNode(),\r\n    new OzonContentInlineNodes(),\r\n    new OzonContentInlineTekstAfbeeldingNode(),\r\n    new OzonContentNootNode(),\r\n    new OzonContentTableNode(),\r\n    new OzonContentIntIoRefNode(),\r\n    new OzonContentFiguurNode(),\r\n    new OzonContentLijstNode(),\r\n    new OzonContentBronNode(),\r\n    new OzonContentNieuweTekstNode(),\r\n    new OzonContentVerwijderdeTekstNode(),\r\n  ];\r\n\r\n  private skip = this.mappers.reduce<string[]>((t, m) => {\r\n    if (m.handles) {\r\n      t.push(...m.handles);\r\n    }\r\n\r\n    return t;\r\n  }, []);\r\n\r\n  private fallbackNode = new OzonContentFallbackNode();\r\n\r\n  private domParser = new DOMParser();\r\n\r\n  private findMapper(name: string): OzonContentNode | undefined {\r\n    if (this.skip.includes(name)) {\r\n      return undefined;\r\n    }\r\n\r\n    return (\r\n      this.mappers.find((m) => {\r\n        if (Array.isArray(m.name)) {\r\n          return m.name.includes(name);\r\n        }\r\n\r\n        return m.name === name;\r\n      }) ?? this.fallbackNode\r\n    );\r\n  }\r\n\r\n  mapNodeToJsx(node: Node | Node[] | NodeList, context: OzonContentContext, path: Node[]): JSX.Element {\r\n    if (node instanceof NodeList) {\r\n      return <Fragment>{Array.from(node).map((n) => this.mapNodeToJsx(n, context, path))}</Fragment>;\r\n    }\r\n\r\n    if (Array.isArray(node)) {\r\n      return <Fragment>{node.map((n) => this.mapNodeToJsx(n, context, path))}</Fragment>;\r\n    }\r\n\r\n    const nodeName = getNodeName(node);\r\n    const mapper = this.findMapper(nodeName);\r\n    if (!mapper) {\r\n      return <Fragment />;\r\n    }\r\n\r\n    const identity = mapper.identify?.(node);\r\n\r\n    const state = identity ? context.state[identity] : undefined;\r\n    const setState = identity ? (s: unknown) => context.setState({ ...context.state, [identity]: s }) : undefined;\r\n\r\n    return mapper.render(node, {\r\n      mapNodeToJsx: (n) => this.mapNodeToJsx(n, context, [...path, node]),\r\n      emitAnchorClick: context.emitAnchorClick,\r\n      setState,\r\n      state,\r\n      path,\r\n    });\r\n  }\r\n\r\n  transform(xml: string, context: OzonContentContext): JSX.Element {\r\n    if (!this.cache || this.cache.xml !== xml) {\r\n      this.cache = { xml, document: this.domParser.parseFromString(xml, \"text/xml\") };\r\n    }\r\n\r\n    const xmlDocument = this.cache.document;\r\n\r\n    return this.mapNodeToJsx(xmlDocument.getRootNode(), context, []);\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/components/anchor\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n\r\n:host(:not([inline])) {\r\n  display: block;\r\n}\r\n\r\n:host([inline]) {\r\n  display: inline;\r\n}\r\n\r\n:host([deleted]) {\r\n  * {\r\n    text-decoration: line-through !important;\r\n  }\r\n}\r\n\r\n:host([interactive]) {\r\n  @include anchor.root($is-html-a-element: false);\r\n\r\n  color: colors.$bosgroen;\r\n  font-weight: 600;\r\n  text-decoration: none;\r\n}\r\n\r\n:host([interactive=\"sub\"]) {\r\n  color: colors.$grijs-90;\r\n}\r\n\r\n.deleted-start,\r\n.deleted-end {\r\n  @include utilities.sr-only();\r\n}\r\n\r\nbutton.toggle-note {\r\n  @include button.tertiary($modifiers: false);\r\n}\r\n\r\nspan[role=\"section\"],\r\nspan[role=\"paragraph\"] {\r\n  display: block;\r\n}\r\n\r\n.fallback {\r\n  display: block;\r\n}\r\n\r\n// Styling below copied from DSO Viewer 20211011\r\n\r\n.od-Term {\r\n  font-weight: 700;\r\n}\r\n\r\n.od-Definitie,\r\n.od-Tussenkop {\r\n  font-style: italic;\r\n}\r\n\r\n.od-Inhoud,\r\n.od-Inhoud > .od-Lijst,\r\n.od-IntIoRef,\r\n.od-Lidnr,\r\n.od-LiNr,\r\n.od-Opschrift,\r\n.od-Tussenkop {\r\n  display: inline;\r\n}\r\n\r\n.od-Al {\r\n  margin-bottom: 0.75em;\r\n}\r\n\r\n.od-IntIoRef {\r\n  border-bottom: 1px dotted;\r\n}\r\n\r\n.dso-ozon-bron {\r\n  font-style: italic;\r\n  font-size: 0.75rem;\r\n}\r\n\r\n.dso-ozon-figuur {\r\n  margin-bottom: units.$u2;\r\n\r\n  .figuur-bijschrift {\r\n    display: block;\r\n    font-size: 0.75rem;\r\n    font-style: italic;\r\n  }\r\n\r\n  &.bijschrift-boven {\r\n    .figuur-bijschrift {\r\n      padding-bottom: 0.25rem;\r\n    }\r\n  }\r\n\r\n  &.bijschrift-onder {\r\n    .figuur-bijschrift {\r\n      padding-top: 0.25rem;\r\n    }\r\n  }\r\n\r\n  .figuur-titel {\r\n    color: colors.$mauve;\r\n    display: block;\r\n    font-weight: 500;\r\n    padding-bottom: 0.5rem;\r\n  }\r\n}\r\n\r\n.dso-ozon-lijst {\r\n  span.od-Lijstaanhef,\r\n  span.od-Lijstsluiting {\r\n    margin-bottom: units.$ru2;\r\n  }\r\n\r\n  ul {\r\n    &.expliciet {\r\n      list-style: none;\r\n\r\n      > .od-Li {\r\n        position: relative;\r\n\r\n        > span.od-LiNummer {\r\n          position: absolute;\r\n          left: units.$u6 * -1 + 4;\r\n          text-align: right;\r\n          width: units.$u5;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n.od-Tabel thead {\r\n  font-weight: 600;\r\n}\r\n\r\n.od-Kadertekst {\r\n  border: 1px solid #e5e5e5;\r\n  margin-bottom: 1rem;\r\n  padding: 1rem;\r\n}\r\n\r\n.dso-del {\r\n  background-color: colors.$danger-bg-color;\r\n  color: colors.$zwart;\r\n  text-decoration: line-through;\r\n\r\n  a {\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n\r\n.dso-ins {\r\n  background-color: colors.$success-bg-color;\r\n  box-shadow: insert.$insert-box-shadow;\r\n  color: colors.$zwart;\r\n\r\n  a {\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n","import { h, Component, ComponentInterface, Element, Event, EventEmitter, Prop, State, Host, JSX } from \"@stencil/core\";\r\nimport { isTabbable } from \"tabbable\";\r\n\r\nimport { Mapper } from \"./ozon-content-mapper\";\r\nimport { OzonContentContext } from \"./ozon-content-context.interface\";\r\nimport { OzonContentAnchorClick, OzonContentClick } from \"./ozon-content.interfaces\";\r\nimport { OzonContentNodeState } from \"./ozon-content-node-state.interface\";\r\n\r\n@Component({\r\n  tag: \"dso-ozon-content\",\r\n  styleUrl: \"ozon-content.scss\",\r\n  scoped: true,\r\n})\r\nexport class OzonContent implements ComponentInterface {\r\n  /**\r\n   * The XML to be rendered.\r\n   */\r\n  @Prop()\r\n  content: string | undefined;\r\n\r\n  /**\r\n   * Setting this property creates dso-ozon-content as inline element instead of a block element.\r\n   */\r\n  @Prop({ reflect: true })\r\n  inline = false;\r\n\r\n  /**\r\n   * Marks content as deleted using visual and accessible clues.\r\n   */\r\n  @Prop({ reflect: true })\r\n  deleted = false;\r\n\r\n  /**\r\n   * Visualize the component as interactive. This means that the component will emit `dsoClick` events when the user clicks non-interactive elements.\r\n   *\r\n   * **Do not** use this without an accessible companion element! `interactive` is only\r\n   * meant to ease the use of the companion element for mouse/touch users.\r\n   *\r\n   * * `true`: Interactive anchor-look-alike\r\n   * * `\"sub\"`: Interactive anchor-look-alike for sub navigation\r\n   * * `false | undefined`: Disabled\r\n   */\r\n  @Prop({ reflect: true })\r\n  interactive: \"sub\" | \"\" | boolean = false;\r\n\r\n  @State()\r\n  state: OzonContentNodeState = {};\r\n\r\n  /**\r\n   * Emitted when `<a>` is clicked.\r\n   */\r\n  @Event()\r\n  dsoAnchorClick!: EventEmitter<OzonContentAnchorClick>;\r\n\r\n  /**\r\n   * These events are only emitted when the component is `interactive`.\r\n   */\r\n  @Event()\r\n  dsoClick!: EventEmitter<OzonContentClick>;\r\n\r\n  @Element()\r\n  host!: HTMLDsoOzonContentElement;\r\n\r\n  private mapper = new Mapper();\r\n\r\n  private handleHostOnClick(e: UIEvent) {\r\n    // '' is `true`: <dso-ozon-content interactive>\r\n    if (this.interactive !== \"\" && !this.interactive) {\r\n      return;\r\n    }\r\n\r\n    const doIt =\r\n      e\r\n        .composedPath()\r\n        .find(\r\n          (eventTarget) => eventTarget === this.host || (eventTarget instanceof HTMLElement && isTabbable(eventTarget))\r\n        ) === this.host;\r\n\r\n    if (doIt) {\r\n      this.dsoClick.emit({ originalEvent: e });\r\n    }\r\n  }\r\n\r\n  render(): JSX.Element {\r\n    const context: OzonContentContext = {\r\n      state: this.state,\r\n      setState: (state) => (this.state = state),\r\n      emitAnchorClick: this.dsoAnchorClick.emit,\r\n    };\r\n\r\n    const transformed = this.mapper.transform(this.content ?? \"\", context);\r\n\r\n    if (this.deleted) {\r\n      return (\r\n        <section>\r\n          <slot name=\"prefix\" />\r\n          <span class=\"deleted-start\">Begin verwijderd element</span>\r\n          {transformed}\r\n          <span class=\"deleted-end\">Einde verwijderd element</span>\r\n          <slot name=\"suffix\" />\r\n        </section>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <Host onClick={(e: UIEvent) => this.handleHostOnClick(e)}>\r\n        <slot name=\"prefix\" />\r\n        {transformed}\r\n        <slot name=\"suffix\" />\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/dso-toolkit/p-18c1d44d.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as e,H as i,g as n}from"./p-53c8538c.js";import{c as o}from"./p-6e38820b.js";const a=":host{display:block}*,*::after,*::before{box-sizing:border-box}";const r=class{updateVariant(t="default"){this.accordionState.variant=t||"default"}updateReverseAlign(t){this.accordionState.reverseAlign=t}updateAllowMultipleOpen(t){this.accordionState.allowMultipleOpen=t;if(!t){const t=Array.from(this.host.querySelectorAll(":scope > dso-accordion-section[open]"));t.shift();t.forEach((t=>this.controlOpenAttribute(t,false)))}}async _getState(){return this.accordionState}async toggleSection(t,s){const e=Array.from(this.host.querySelectorAll(":scope > dso-accordion-section"));if(typeof t==="number"){const s=e[t];if(s instanceof HTMLElement){t=s}}if(!(t instanceof HTMLElement)||!e.includes(t)){return}const i=this.isSectionOpen(t);if(this.allowMultipleOpen){this.controlOpenAttribute(t,!i);this.emitToggleEvent(t,e,s);return!i}if(i){this.controlOpenAttribute(t,false);this.emitToggleEvent(t,e,s);return false}await this.closeOpenSections();this.controlOpenAttribute(t,true);this.emitToggleEvent(t,e,s);return true}async animationEnd(t){this.dsoToggleSectionAnimationEnd.emit({section:{element:t,open:this.isSectionOpen(t)}})}async closeOpenSections(){const t=Array.from(this.host.querySelectorAll(":scope > dso-accordion-section"));const s=t.filter((t=>this.isSectionOpen(t)));s.forEach((t=>this.controlOpenAttribute(t,false)))}componentWillLoad(){if(this.accordionState.variant!==this.variant){this.accordionState.variant=this.variant||"default"}if(this.accordionState.reverseAlign!==this.reverseAlign){this.accordionState.reverseAlign=this.reverseAlign}if(this.accordionState.allowMultipleOpen!==this.allowMultipleOpen){this.accordionState.allowMultipleOpen=this.allowMultipleOpen}}constructor(e){t(this,e);this.dsoToggleSection=s(this,"dsoToggleSection",7);this.dsoToggleSectionAnimationEnd=s(this,"dsoToggleSectionAnimationEnd",7);this.variant="default";this.reverseAlign=false;this.allowMultipleOpen=false;const{state:i}=o({variant:this.variant||"default",reverseAlign:this.reverseAlign,allowMultipleOpen:this.allowMultipleOpen});this.accordionState=i}render(){return e(i,{class:{"dso-accordion":true}},e("slot",null))}emitToggleEvent(t,s,e){this.dsoToggleSection.emit({originalEvent:e,section:{element:t,open:this.isSectionOpen(t)},sections:s})}isSectionOpen(t){return typeof t.getAttribute("open")==="string"}controlOpenAttribute(t,s){if(s){t.setAttribute("open","")}else{t.removeAttribute("open")}}get host(){return n(this)}static get watchers(){return{variant:["updateVariant"],reverseAlign:["updateReverseAlign"],allowMultipleOpen:["updateAllowMultipleOpen"]}}};r.style=a;export{r as dso_accordion};
-//# sourceMappingURL=p-18c1d44d.entry.js.map

package/dist/dso-toolkit/p-18c1d44d.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["accordionCss","Accordion","updateVariant","variant","this","accordionState","updateReverseAlign","reverseAlign","updateAllowMultipleOpen","allowMultipleOpen","openSections","Array","from","host","querySelectorAll","shift","forEach","section","controlOpenAttribute","async","sectionElement","event","sections","HTMLElement","includes","sectionIsOpen","isSectionOpen","emitToggleEvent","closeOpenSections","dsoToggleSectionAnimationEnd","emit","element","open","filter","s","componentWillLoad","constructor","hostRef","state","createStore","render","h","Host","class","e","dsoToggleSection","originalEvent","getAttribute","setAttribute","removeAttribute"],"sources":["./src/components/accordion/accordion.scss?tag=dso-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import {\r\n  h,\r\n  Component,\r\n  ComponentInterface,\r\n  Prop,\r\n  Host,\r\n  Method,\r\n  Watch,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n} from \"@stencil/core\";\r\n\r\nimport {\r\n  AccordionInternalState,\r\n  AccordionSectionToggleAnimationEndEvent,\r\n  AccordionSectionToggleEvent,\r\n  AccordionVariant,\r\n} from \"./accordion.interfaces\";\r\n\r\nimport { createStore } from \"@stencil/store\";\r\n\r\n@Component({\r\n  tag: \"dso-accordion\",\r\n  styleUrl: \"accordion.scss\",\r\n  shadow: true,\r\n})\r\nexport class Accordion implements ComponentInterface {\r\n  private accordionState: AccordionInternalState;\r\n\r\n  @Element()\r\n  host!: HTMLDsoAccordionElement;\r\n\r\n  /**\r\n   * The variant of the Accordion.\r\n   */\r\n  @Prop({ reflect: true })\r\n  variant?: AccordionVariant = \"default\";\r\n\r\n  /**\r\n   * Places the chevron at the opposite side. Note: this mode does not display `state`, `attachmentCount` or `status` props on child `<dso-accordion-section>` elements\r\n   */\r\n  @Prop({ reflect: true })\r\n  reverseAlign = false;\r\n\r\n  /**\r\n   * Allows multiple sections to be open at the same time.\r\n   */\r\n  @Prop({ reflect: true })\r\n  allowMultipleOpen = false;\r\n\r\n  /**\r\n   * Emitted when a section is toggled.\r\n   *\r\n   * `event.detail.originalEvent` contains the original `MouseEvent` when the section is toggled by clicking on the header\r\n   * `event.detail.section` contains the toggled section and its new opened value.\\\r\n   * `event.detail.sections` contains all `<dso-accordion-section>` elements belonging to this accordion.\r\n   */\r\n  @Event()\r\n  dsoToggleSection!: EventEmitter<AccordionSectionToggleEvent>;\r\n\r\n  /**\r\n   * Event emitted when the accordion section completes its toggle animation.\r\n   */\r\n  @Event()\r\n  dsoToggleSectionAnimationEnd!: EventEmitter<AccordionSectionToggleAnimationEndEvent>;\r\n\r\n  @Watch(\"variant\")\r\n  updateVariant(variant: AccordionVariant = \"default\") {\r\n    this.accordionState.variant = variant || \"default\";\r\n  }\r\n\r\n  @Watch(\"reverseAlign\")\r\n  updateReverseAlign(reverseAlign: boolean) {\r\n    this.accordionState.reverseAlign = reverseAlign;\r\n  }\r\n\r\n  @Watch(\"allowMultipleOpen\")\r\n  updateAllowMultipleOpen(allowMultipleOpen: boolean) {\r\n    this.accordionState.allowMultipleOpen = allowMultipleOpen;\r\n\r\n    if (!allowMultipleOpen) {\r\n      const openSections = Array.from(this.host.querySelectorAll<HTMLElement>(\":scope > dso-accordion-section[open]\"));\r\n\r\n      // By removing the first section, it is kept open;\r\n      openSections.shift();\r\n\r\n      openSections.forEach((section) => this.controlOpenAttribute(section, false));\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _getState(): Promise<AccordionInternalState> {\r\n    return this.accordionState;\r\n  }\r\n\r\n  /**\r\n   * Toggle a section. Pass the `<dso-accordion-section>` element or the index of the section.\r\n   * @param sectionElement The section element that needs to toggle\r\n   * @param event The event that the user triggered\r\n   * @returns The state of the section\r\n   */\r\n  @Method()\r\n  async toggleSection(sectionElement: HTMLElement | number, event?: MouseEvent): Promise<undefined | boolean> {\r\n    const sections = Array.from(this.host.querySelectorAll<HTMLElement>(\":scope > dso-accordion-section\"));\r\n\r\n    if (typeof sectionElement === \"number\") {\r\n      const section = sections[sectionElement];\r\n      if (section instanceof HTMLElement) {\r\n        sectionElement = section;\r\n      }\r\n    }\r\n\r\n    if (!(sectionElement instanceof HTMLElement) || !sections.includes(sectionElement)) {\r\n      return;\r\n    }\r\n\r\n    const sectionIsOpen = this.isSectionOpen(sectionElement);\r\n\r\n    if (this.allowMultipleOpen) {\r\n      this.controlOpenAttribute(sectionElement, !sectionIsOpen);\r\n      this.emitToggleEvent(sectionElement, sections, event);\r\n      return !sectionIsOpen;\r\n    }\r\n\r\n    if (sectionIsOpen) {\r\n      this.controlOpenAttribute(sectionElement, false);\r\n      this.emitToggleEvent(sectionElement, sections, event);\r\n\r\n      return false;\r\n    }\r\n\r\n    await this.closeOpenSections();\r\n\r\n    this.controlOpenAttribute(sectionElement, true);\r\n    this.emitToggleEvent(sectionElement, sections, event);\r\n\r\n    return true;\r\n  }\r\n\r\n  /**\r\n   * Emitted when the animation of opening or closing ends.\r\n   */\r\n  @Method()\r\n  async animationEnd(sectionElement: HTMLElement): Promise<void> {\r\n    this.dsoToggleSectionAnimationEnd.emit({\r\n      section: {\r\n        element: sectionElement,\r\n        open: this.isSectionOpen(sectionElement),\r\n      },\r\n    });\r\n  }\r\n\r\n  /**\r\n   * Closes all sections belonging to this accordion.\r\n   */\r\n  @Method()\r\n  async closeOpenSections(): Promise<void> {\r\n    const sections = Array.from(this.host.querySelectorAll<HTMLElement>(\":scope > dso-accordion-section\"));\r\n\r\n    const openSections = sections.filter((s) => this.isSectionOpen(s));\r\n    openSections.forEach((section) => this.controlOpenAttribute(section, false));\r\n  }\r\n\r\n  // These checks are needed for a React timing issue.\r\n  componentWillLoad() {\r\n    if (this.accordionState.variant !== this.variant) {\r\n      this.accordionState.variant = this.variant || \"default\";\r\n    }\r\n\r\n    if (this.accordionState.reverseAlign !== this.reverseAlign) {\r\n      this.accordionState.reverseAlign = this.reverseAlign;\r\n    }\r\n\r\n    if (this.accordionState.allowMultipleOpen !== this.allowMultipleOpen) {\r\n      this.accordionState.allowMultipleOpen = this.allowMultipleOpen;\r\n    }\r\n  }\r\n\r\n  constructor() {\r\n    const { state } = createStore<AccordionInternalState>({\r\n      variant: this.variant || \"default\",\r\n      reverseAlign: this.reverseAlign,\r\n      allowMultipleOpen: this.allowMultipleOpen,\r\n    });\r\n\r\n    this.accordionState = state;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        class={{\r\n          \"dso-accordion\": true,\r\n        }}\r\n      >\r\n        <slot></slot>\r\n      </Host>\r\n    );\r\n  }\r\n\r\n  private emitToggleEvent(sectionElement: HTMLElement, sections: HTMLElement[], e?: MouseEvent): void {\r\n    this.dsoToggleSection.emit({\r\n      originalEvent: e,\r\n      section: {\r\n        element: sectionElement,\r\n        open: this.isSectionOpen(sectionElement),\r\n      },\r\n      sections,\r\n    });\r\n  }\r\n\r\n  private isSectionOpen(sectionElement: HTMLElement): boolean {\r\n    return typeof sectionElement.getAttribute(\"open\") === \"string\";\r\n  }\r\n\r\n  private controlOpenAttribute(sectionElement: HTMLElement, setAttribute: boolean): void {\r\n    if (setAttribute) {\r\n      sectionElement.setAttribute(\"open\", \"\");\r\n    } else {\r\n      sectionElement.removeAttribute(\"open\");\r\n    }\r\n  }\r\n}\r\n"],"mappings":"oGAAA,MAAMA,EAAe,kE,MC2BRC,EAAS,MAyCpBC,cAAcC,EAA4B,WACxCC,KAAKC,eAAeF,QAAUA,GAAW,S,CAI3CG,mBAAmBC,GACjBH,KAAKC,eAAeE,aAAeA,C,CAIrCC,wBAAwBC,GACtBL,KAAKC,eAAeI,kBAAoBA,EAExC,IAAKA,EAAmB,CACtB,MAAMC,EAAeC,MAAMC,KAAKR,KAAKS,KAAKC,iBAA8B,yCAGxEJ,EAAaK,QAEbL,EAAaM,SAASC,GAAYb,KAAKc,qBAAqBD,EAAS,Q,EAQzEE,kBACE,OAAOf,KAAKC,c,CAUdc,oBAAoBC,EAAsCC,GACxD,MAAMC,EAAWX,MAAMC,KAAKR,KAAKS,KAAKC,iBAA8B,mCAEpE,UAAWM,IAAmB,SAAU,CACtC,MAAMH,EAAUK,EAASF,GACzB,GAAIH,aAAmBM,YAAa,CAClCH,EAAiBH,C,EAIrB,KAAMG,aAA0BG,eAAiBD,EAASE,SAASJ,GAAiB,CAClF,M,CAGF,MAAMK,EAAgBrB,KAAKsB,cAAcN,GAEzC,GAAIhB,KAAKK,kBAAmB,CAC1BL,KAAKc,qBAAqBE,GAAiBK,GAC3CrB,KAAKuB,gBAAgBP,EAAgBE,EAAUD,GAC/C,OAAQI,C,CAGV,GAAIA,EAAe,CACjBrB,KAAKc,qBAAqBE,EAAgB,OAC1ChB,KAAKuB,gBAAgBP,EAAgBE,EAAUD,GAE/C,OAAO,K,OAGHjB,KAAKwB,oBAEXxB,KAAKc,qBAAqBE,EAAgB,MAC1ChB,KAAKuB,gBAAgBP,EAAgBE,EAAUD,GAE/C,OAAO,I,CAOTF,mBAAmBC,GACjBhB,KAAKyB,6BAA6BC,KAAK,CACrCb,QAAS,CACPc,QAASX,EACTY,KAAM5B,KAAKsB,cAAcN,K,CAS/BD,0BACE,MAAMG,EAAWX,MAAMC,KAAKR,KAAKS,KAAKC,iBAA8B,mCAEpE,MAAMJ,EAAeY,EAASW,QAAQC,GAAM9B,KAAKsB,cAAcQ,KAC/DxB,EAAaM,SAASC,GAAYb,KAAKc,qBAAqBD,EAAS,Q,CAIvEkB,oBACE,GAAI/B,KAAKC,eAAeF,UAAYC,KAAKD,QAAS,CAChDC,KAAKC,eAAeF,QAAUC,KAAKD,SAAW,S,CAGhD,GAAIC,KAAKC,eAAeE,eAAiBH,KAAKG,aAAc,CAC1DH,KAAKC,eAAeE,aAAeH,KAAKG,Y,CAG1C,GAAIH,KAAKC,eAAeI,oBAAsBL,KAAKK,kBAAmB,CACpEL,KAAKC,eAAeI,kBAAoBL,KAAKK,iB,EAIjD2B,YAAAC,G,qJAjJ6B,U,kBAMd,M,uBAMK,MAsIlB,MAAMC,MAAEA,GAAUC,EAAoC,CACpDpC,QAASC,KAAKD,SAAW,UACzBI,aAAcH,KAAKG,aACnBE,kBAAmBL,KAAKK,oBAG1BL,KAAKC,eAAiBiC,C,CAGxBE,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACL,gBAAiB,OAGnBF,EAAA,a,CAKEd,gBAAgBP,EAA6BE,EAAyBsB,GAC5ExC,KAAKyC,iBAAiBf,KAAK,CACzBgB,cAAeF,EACf3B,QAAS,CACPc,QAASX,EACTY,KAAM5B,KAAKsB,cAAcN,IAE3BE,Y,CAIII,cAAcN,GACpB,cAAcA,EAAe2B,aAAa,UAAY,Q,CAGhD7B,qBAAqBE,EAA6B4B,GACxD,GAAIA,EAAc,CAChB5B,EAAe4B,aAAa,OAAQ,G,KAC/B,CACL5B,EAAe6B,gBAAgB,O"}

package/dist/dso-toolkit/p-25b9716f.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as o,h as s,F as e,g as i}from"./p-53c8538c.js";import{c as l}from"./p-6a1980b4.js";import{d as n}from"./p-1805f5b0.js";const a=":host{display:inline-block;max-width:100%}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-label{background-color:#f2f2f2;border-radius:4px;color:#191919;display:inline-block;line-height:1.5;max-width:100%;padding:4px 8px}.dso-label:focus-within,.dso-label.dso-hover{text-decoration:line-through}.dso-label button{background:none;border:0;border-radius:0 4px 4px 0;color:inherit;float:right;font-size:1rem;margin-bottom:-4px;margin-left:8px;margin-right:-4px;margin-top:0;padding:0}.dso-label button:hover{cursor:pointer}.dso-label button>dso-icon,.dso-label button>svg.di{display:block}.dso-label.dso-label-info{background-color:#6ca4d9;color:#000}.dso-label.dso-label-primary{background-color:#275937;color:#fff}.dso-label.dso-label-success{background-color:#39870c;color:#fff}.dso-label.dso-label-warning{background-color:#dcd400;color:#000}.dso-label.dso-label-danger{background-color:#ce3f51;color:#fff}.dso-label.dso-label-error{background-color:#ce3f51;color:#fff}.dso-label.dso-label-bright{background-color:#fff;color:#191919;outline:1px solid #ccc;outline-offset:-1px}.dso-label.dso-label-attention{background-color:#8b4a6a;color:#fff}.dso-label.dso-compact{padding:0 8px}.dso-label.dso-hover .dso-label-content{text-decoration:line-through}.dso-truncate.dso-label-content{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}:host([removable]) .dso-truncate.dso-label-content{max-width:calc(100% - 28px)}";const r=new ResizeObserver(n.debounce((t=>{t.forEach((({target:t})=>{if(d(t)){t._truncateLabel()}}))}),150));function d(t){return t.tagName==="DSO-LABEL"}function c(t){return t.scrollWidth>t.clientWidth}const h=class{constructor(s){t(this,s);this.dsoRemoveClick=o(this,"dsoRemoveClick",7);this.keydownListenerActive=false;this.keyDownListener=t=>{if(t.key==="Escape"){this.textHover=false;this.textFocus=false}};this.compact=undefined;this.removable=undefined;this.status=undefined;this.removeHover=undefined;this.removeFocus=undefined;this.truncate=undefined;this.textHover=undefined;this.textFocus=undefined;this.isTruncated=undefined;this.labelText=null}watchTruncate(t){if(t){this.startTruncate()}else{this.stopTruncate()}}watchTooltipActive(){if(!this.keydownListenerActive&&(this.textHover||this.textFocus)){document.addEventListener("keydown",this.keyDownListener);this.keydownListenerActive=true}if(!this.textHover&&!this.textFocus){document.removeEventListener("keydown",this.keyDownListener);this.keydownListenerActive=false}}async _truncateLabel(){setTimeout((()=>{this.isTruncated=this.labelContent&&c(this.labelContent)}))}syncLabelText(){this.labelText=this.host.textContent}componentDidLoad(){if(this.truncate){this.startTruncate()}if(this.removable){this.startMutationObserver()}}disconnectedCallback(){this.stopTruncate()}startMutationObserver(){if(this.mutationObserver){return}this.mutationObserver=new MutationObserver((t=>t.forEach((()=>this.syncLabelText()))));this.mutationObserver.observe(this.host,{characterData:true,subtree:true,attributes:true});this.labelText=this.host.textContent}startTruncate(){r.observe(this.host);this.startMutationObserver();this._truncateLabel()}stopTruncate(){document.removeEventListener("keydown",this.keyDownListener);r.unobserve(this.host);this.isTruncated=undefined;this.keydownListenerActive=false}render(){return s(e,null,s("span",{"aria-describedby":"toggle-anchor",class:l("dso-label",{[`dso-label-${this.status}`]:this.status,"dso-compact":this.compact&&!this.removable,"dso-hover":this.removeHover||this.removeFocus})},s("slot",{name:"symbol"}),s("span",{class:l("dso-label-content",{"dso-truncate":!!this.truncate}),ref:t=>this.labelContent=t,tabindex:this.truncate&&this.isTruncated?0:undefined,onMouseEnter:()=>this.textHover=true,onMouseLeave:()=>this.textHover=false,onFocus:()=>this.textFocus=true,onBlur:()=>this.textFocus=false},s("slot",null)),this.removable&&s("button",{type:"button",onClick:t=>this.dsoRemoveClick.emit(t),onMouseEnter:()=>this.removeHover=true,onMouseLeave:()=>this.removeHover=false,onFocus:()=>this.removeFocus=true,onBlur:()=>this.removeFocus=false},s("span",{class:"sr-only"},"Verwijder: ",this.labelText),s("dso-icon",{icon:"times"}))),this.isTruncated&&s("dso-tooltip",{stateless:true,id:"toggle-anchor",active:this.textHover||this.textFocus,position:"top",strategy:"absolute"},this.labelText))}get host(){return i(this)}static get watchers(){return{truncate:["watchTruncate"],textHover:["watchTooltipActive"],textFocus:["watchTooltipActive"]}}};h.style=a;export{h as dso_label};
-//# sourceMappingURL=p-25b9716f.entry.js.map

package/dist/dso-toolkit/p-25b9716f.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["labelCss","resizeObserver","ResizeObserver","debounce","entries","forEach","target","isDsoLabelComponent","_truncateLabel","element","tagName","hasEllipses","el","scrollWidth","clientWidth","Label","this","keydownListenerActive","keyDownListener","event","key","textHover","textFocus","watchTruncate","truncate","startTruncate","stopTruncate","watchTooltipActive","document","addEventListener","removeEventListener","async","setTimeout","isTruncated","labelContent","syncLabelText","labelText","host","textContent","componentDidLoad","removable","startMutationObserver","disconnectedCallback","mutationObserver","MutationObserver","observe","characterData","subtree","attributes","unobserve","undefined","render","h","Fragment","class","clsx","status","compact","removeHover","removeFocus","name","ref","tabindex","onMouseEnter","onMouseLeave","onFocus","onBlur","type","onClick","e","dsoRemoveClick","emit","icon","stateless","id","active","position","strategy"],"sources":["./src/components/label/label.scss?tag=dso-label&encapsulation=shadow","./src/components/label/label.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/label\";\r\n\r\n:host {\r\n  display: inline-block;\r\n  max-width: 100%;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n// Todo: Replace .sr-only selector with web component specific selector, no need for .sr-only if we can generate the SCSS\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-label {\r\n  @include label.root();\r\n\r\n  &.dso-hover {\r\n    .dso-label-content {\r\n      text-decoration: line-through;\r\n    }\r\n  }\r\n}\r\n\r\n.dso-truncate.dso-label-content {\r\n  display: inline-block;\r\n  max-width: 100%;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n  vertical-align: bottom;\r\n  white-space: nowrap; // stylelint-disable-line declaration-property-value-disallowed-list -- full text can be viewed via tooltip.\r\n}\r\n\r\n:host([removable]) {\r\n  .dso-truncate.dso-label-content {\r\n    max-width: calc(100% - (units.$u3 + 4px));\r\n  }\r\n}\r\n","import {\r\n  h,\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  Method,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\nimport { debounce } from \"debounce\";\r\n\r\nconst resizeObserver = new ResizeObserver(\r\n  debounce((entries) => {\r\n    entries.forEach(({ target }) => {\r\n      if (isDsoLabelComponent(target)) {\r\n        target._truncateLabel();\r\n      }\r\n    });\r\n  }, 150)\r\n);\r\n\r\nfunction isDsoLabelComponent(element: Element): element is HTMLDsoLabelElement {\r\n  return element.tagName === \"DSO-LABEL\";\r\n}\r\n\r\nfunction hasEllipses(el: HTMLElement): boolean {\r\n  return el.scrollWidth > el.clientWidth;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-label\",\r\n  styleUrl: \"label.scss\",\r\n  shadow: true,\r\n})\r\nexport class Label implements ComponentInterface {\r\n  private labelContent: HTMLSpanElement | undefined;\r\n\r\n  private keydownListenerActive = false;\r\n\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoLabelElement;\r\n\r\n  /**\r\n   * For compact Label\r\n   */\r\n  @Prop()\r\n  compact?: boolean;\r\n\r\n  /**\r\n   * Shows a button that can be used to remove the Label.\r\n   */\r\n  @Prop()\r\n  removable?: boolean;\r\n\r\n  /**\r\n   * The status of this Label.\r\n   */\r\n  @Prop()\r\n  status?: \"primary\" | \"info\" | \"success\" | \"warning\" | \"danger\" | \"error\" | \"bright\" | \"attention\";\r\n\r\n  @State()\r\n  removeHover?: boolean;\r\n\r\n  @State()\r\n  removeFocus?: boolean;\r\n\r\n  /**\r\n   * Whether the Label is allowed to truncate the contents if it does not fit the container element.\r\n   */\r\n  @Prop()\r\n  truncate?: boolean;\r\n\r\n  @State()\r\n  textHover?: boolean;\r\n\r\n  @State()\r\n  textFocus?: boolean;\r\n\r\n  @State()\r\n  isTruncated?: boolean;\r\n\r\n  @State()\r\n  labelText: string | null = null;\r\n\r\n  /**\r\n   * Emitted when the user activates the remove button.\r\n   */\r\n  @Event()\r\n  dsoRemoveClick!: EventEmitter<MouseEvent>;\r\n\r\n  @Watch(\"truncate\")\r\n  watchTruncate(truncate: boolean) {\r\n    if (truncate) {\r\n      this.startTruncate();\r\n    } else {\r\n      this.stopTruncate();\r\n    }\r\n  }\r\n\r\n  @Watch(\"textHover\")\r\n  @Watch(\"textFocus\")\r\n  watchTooltipActive() {\r\n    if (!this.keydownListenerActive && (this.textHover || this.textFocus)) {\r\n      document.addEventListener(\"keydown\", this.keyDownListener);\r\n      this.keydownListenerActive = true;\r\n    }\r\n\r\n    if (!this.textHover && !this.textFocus) {\r\n      document.removeEventListener(\"keydown\", this.keyDownListener);\r\n      this.keydownListenerActive = false;\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _truncateLabel() {\r\n    setTimeout(() => {\r\n      this.isTruncated = this.labelContent && hasEllipses(this.labelContent);\r\n    });\r\n  }\r\n\r\n  private syncLabelText() {\r\n    this.labelText = this.host.textContent;\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (this.truncate) {\r\n      this.startTruncate();\r\n    }\r\n\r\n    if (this.removable) {\r\n      this.startMutationObserver();\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    this.stopTruncate();\r\n  }\r\n\r\n  /** The mutationObserver fetches the text placed inside the label, this is then used for the remove button and tooltip. */\r\n  private startMutationObserver(): void {\r\n    if (this.mutationObserver) {\r\n      return;\r\n    }\r\n\r\n    this.mutationObserver = new MutationObserver((entries) => entries.forEach(() => this.syncLabelText()));\r\n\r\n    this.mutationObserver.observe(this.host, {\r\n      characterData: true,\r\n      subtree: true,\r\n      attributes: true,\r\n    });\r\n\r\n    this.labelText = this.host.textContent;\r\n  }\r\n\r\n  private startTruncate(): void {\r\n    resizeObserver.observe(this.host);\r\n    this.startMutationObserver();\r\n    this._truncateLabel();\r\n  }\r\n\r\n  private stopTruncate(): void {\r\n    document.removeEventListener(\"keydown\", this.keyDownListener);\r\n\r\n    resizeObserver.unobserve(this.host);\r\n    this.isTruncated = undefined;\r\n    this.keydownListenerActive = false;\r\n  }\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (event.key === \"Escape\") {\r\n      this.textHover = false;\r\n      this.textFocus = false;\r\n    }\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <Fragment>\r\n        <span\r\n          aria-describedby=\"toggle-anchor\"\r\n          class={clsx(\"dso-label\", {\r\n            [`dso-label-${this.status}`]: this.status,\r\n            \"dso-compact\": this.compact && !this.removable,\r\n            \"dso-hover\": this.removeHover || this.removeFocus,\r\n          })}\r\n        >\r\n          <slot name=\"symbol\"></slot>\r\n          <span\r\n            class={clsx(\"dso-label-content\", {\r\n              \"dso-truncate\": !!this.truncate,\r\n            })}\r\n            ref={(element) => (this.labelContent = element)}\r\n            tabindex={this.truncate && this.isTruncated ? 0 : undefined}\r\n            onMouseEnter={() => (this.textHover = true)}\r\n            onMouseLeave={() => (this.textHover = false)}\r\n            onFocus={() => (this.textFocus = true)}\r\n            onBlur={() => (this.textFocus = false)}\r\n          >\r\n            <slot></slot>\r\n          </span>\r\n          {this.removable && (\r\n            <button\r\n              type=\"button\"\r\n              onClick={(e) => this.dsoRemoveClick.emit(e)}\r\n              onMouseEnter={() => (this.removeHover = true)}\r\n              onMouseLeave={() => (this.removeHover = false)}\r\n              onFocus={() => (this.removeFocus = true)}\r\n              onBlur={() => (this.removeFocus = false)}\r\n            >\r\n              <span class=\"sr-only\">Verwijder: {this.labelText}</span>\r\n              <dso-icon icon=\"times\"></dso-icon>\r\n            </button>\r\n          )}\r\n        </span>\r\n        {this.isTruncated && (\r\n          <dso-tooltip\r\n            stateless\r\n            id=\"toggle-anchor\"\r\n            active={this.textHover || this.textFocus}\r\n            position=\"top\"\r\n            strategy=\"absolute\"\r\n          >\r\n            {this.labelText}\r\n          </dso-tooltip>\r\n        )}\r\n      </Fragment>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/dso-toolkit/p-348f8556.entry.js

@@ -1,2 +0,0 @@
-import{r as o,c as d,h as s,F as t,g as r}from"./p-53c8538c.js";import{c as a}from"./p-91963e3d.js";import{v as e}from"./p-5d7f4ff2.js";import"./p-5950644a.js";const i="@keyframes slideInFromTop{0%{opacity:0}100%{opacity:1}}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}.dso-modal{bottom:0;height:100%;left:0;position:fixed;right:0;top:0;z-index:530}.dso-modal .dso-dialog{animation:1s ease-out 0s 1 slideInFromTop;margin-top:15vh;margin-left:auto;margin-right:auto;max-width:640px;opacity:1;background-color:#fff;box-shadow:0 8px 24px 0 rgba(25, 25, 25, 0.4)}.dso-modal .dso-header{border-bottom:1px solid #ccc;padding:16px;position:relative}.dso-modal .dso-header h2{color:#275937;margin:0;max-width:calc(100% - 24px)}.dso-modal .dso-header .dso-close{background-color:transparent;border:0;height:32px;padding:0;position:absolute;right:13px;text-align:center;top:16px;width:32px}.dso-modal .dso-body{height:calc(100% - 96px - 1.5rem);max-height:calc(70vh - 144px - 1.5em);min-height:1.5rem;overflow-x:auto;padding:32px}.dso-modal .dso-body p{margin:0 0 16px}.dso-modal .dso-body ul,.dso-modal .dso-body ol{margin-bottom:16px}.dso-modal .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal .dso-body pre{margin:0 0 16px}.dso-modal .dso-body blockquote{padding:16px 24px}.dso-modal .dso-body dso-highlight-box,.dso-modal .dso-body .dso-highlight-box{margin-bottom:24px}.dso-modal .dso-body img{height:auto;max-width:100%}.dso-modal .dso-footer{min-height:80px;padding:0 32px 32px;text-align:right}@media screen and (max-width: 767px){.dso-modal .dso-footer .btn+.btn,.dso-modal .dso-footer .btn+.dso-primary,.dso-modal .dso-footer .btn+.dso-secondary,.dso-modal .dso-footer .btn+.dso-tertiary,.dso-modal .dso-footer .dso-primary+.btn,.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.btn,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.btn,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-left:0}.dso-modal .dso-footer button{text-align:center;width:100%}.dso-modal .dso-footer button+button{margin-top:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span,.dso-modal .dso-footer button.btn-link,.dso-modal .dso-footer button.btn-link span{float:none}}@media screen and (min-width: 768px){.dso-modal .dso-footer .btn+.dso-secondary,.dso-modal .dso-footer .btn+.btn-default,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.btn-default,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.btn-default,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.btn-default{margin-left:16px}.dso-modal .dso-footer .btn+.dso-tertiary,.dso-modal .dso-footer .btn+.btn-link,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-primary+.btn-link,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.btn-link,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.btn-link{margin-left:0}}@media screen and (max-width: 767px){.dso-modal .dso-dialog{max-width:100%;margin-top:0}.dso-modal .dso-footer .btn+.btn,.dso-modal .dso-footer .btn+.dso-primary,.dso-modal .dso-footer .btn+.dso-secondary,.dso-modal .dso-footer .btn+.dso-tertiary,.dso-modal .dso-footer .dso-primary+.btn,.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.btn,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.btn,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-left:0}.dso-modal .dso-footer button{text-align:center;width:100%}.dso-modal .dso-footer button+button{margin-top:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span,.dso-modal .dso-footer button.btn-link,.dso-modal .dso-footer button.btn-link span{float:none}}.dso-modal-overlay{background-color:rgba(255, 255, 255, 0.8);bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:529}.dso-close dso-icon{color:#39870c}";const n=class{constructor(s){o(this,s);this.dsoClose=d(this,"dsoClose",7);this.ariaId=e();this.hasFooter=undefined;this.modalTitle=undefined;this.role="dialog";this.showCloseButton=true;this.initialFocus=undefined;this.returnFocus=undefined}componentWillLoad(){this.hasFooter=this.host.querySelector("*[slot = 'footer']")!==null}componentDidLoad(){this.setFocusTrap()}disconnectedCallback(){var o;(o=this.trap)===null||o===void 0?void 0:o.deactivate({onDeactivate:()=>undefined})}render(){var o;return s(t,null,s("div",{class:"dso-modal-overlay"}),s("div",{class:"dso-modal",role:(o=this.role)!==null&&o!==void 0?o:undefined,"aria-modal":"true","aria-labelledby":this.ariaId,ref:o=>this.modalElement=o},s("div",{class:"dso-dialog",role:"document",ref:o=>this.dialogElement=o},this.modalTitle?s("div",{class:"dso-header"},s("h2",{id:this.ariaId},this.modalTitle),this.showCloseButton&&s("button",{type:"button",class:"dso-close",onClick:o=>this.dsoClose.emit({originalEvent:o})},s("dso-icon",{icon:"times"}),s("span",{class:"sr-only"},"Sluiten"))):s("span",{class:"sr-only",id:this.ariaId},"Dialoog"),s("div",{class:"dso-body",tabIndex:0},s("slot",{name:"body"})),this.hasFooter&&s("div",{class:"dso-footer"},s("slot",{name:"footer"})))))}setFocusTrap(){if(this.dialogElement&&!this.trap){this.trap=a(this.dialogElement,{initialFocus:()=>{var o,d,s;if(this.initialFocus){const o=this.host.querySelector(this.initialFocus);if(!o){console.warn(`element '${this.initialFocus}' could not be found`)}else{return o}}return(s=(o=this.host.querySelector("div[slot='footer'] .dso-primary"))!==null&&o!==void 0?o:(d=this.modalElement)===null||d===void 0?void 0:d.querySelector(".dso-close"))!==null&&s!==void 0?s:false},allowOutsideClick:true,setReturnFocus:o=>{var d,s;return(s=(d=this.returnFocus)===null||d===void 0?void 0:d.call(this,o))!==null&&s!==void 0?s:o},escapeDeactivates:true,tabbableOptions:{getShadowRoot:true},clickOutsideDeactivates:o=>{if(o instanceof MouseEvent&&o.composedPath()[0]===this.modalElement){return true}return false},onDeactivate:()=>{delete this.trap;this.dsoClose.emit({originalEvent:undefined})}}).activate()}}get host(){return r(this)}};n.style=i;export{n as dso_modal};
-//# sourceMappingURL=p-348f8556.entry.js.map