@dso-toolkit/core 79.0.0 → 79.1.0

package/dist/esm/dso-annotation-omgevingsnormwaarde.entry.js.map

@@ -1 +1 @@
-{"version":3,"file":"dso-annotation-omgevingsnormwaarde.entry.js","sources":["src/components/annotation/annotation.scss?tag=dso-annotation-omgevingsnormwaarde&encapsulation=shadow","src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/link/link\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n *\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-omgevingsnormwaarde\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De naam van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  naam?: RenvooiValue | string;\r\n\r\n  /**\r\n   * De toelichting van de waardes.\r\n   */\r\n  @Prop()\r\n  toelichting?: string;\r\n\r\n  /**\r\n   * De waardes van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  waardes?: Array<RenvooiValue | string>;\r\n\r\n  /**\r\n   * De eenheid van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  eenheid?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active || false}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <dso-renvooi value={this.naam} />\r\n            {this.eenheid && (\r\n              <>\r\n                {\" \"}\r\n                (in <dso-renvooi value={this.eenheid} />)\r\n              </>\r\n            )}\r\n          </>\r\n        }\r\n        data={\r\n          <>\r\n            <span class=\"content\">\r\n              {this.toelichting && <>{this.toelichting}</>}\r\n              {this.waardes && this.waardes.length > 0 && (\r\n                <>\r\n                  : <AnnotationListRenvooiValues values={this.waardes} />\r\n                </>\r\n              )}\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,uoLAAuoL;;MCoBhpL,6BAA6B,GAAA,MAAA;AAL1C,IAAA,WAAA,CAAA,OAAA,EAAA;;;QAyDU,IAAA,CAAA,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;AA6CrC;IA3CC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;;IAGtB,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;;IAGxB,MAAM,GAAA;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;AAE5C,QAAA,QACE,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EACb,MAAM,EAAE,UAAU,GAAG,CAAA,CAAC,oBAAoB,EAAA,IAAA,CAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA,EAChC,IAAI,CAAC,OAAO,KACX,CAAA,CAAA,QAAA,EAAA,IAAA,EACG,GAAG,UACA,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,OAAO,EAAI,CAAA,MACvC,CACJ,CACA,EAEL,IAAI,EACF,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,IAAI,CAAC,WAAW,IAAI,kBAAG,IAAI,CAAC,WAAW,CAAI,EAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,KACtC,CAAA,CAAA,QAAA,EAAA,IAAA,QACI,CAAC,CAAA,2BAA2B,EAAC,EAAA,MAAM,EAAE,IAAI,CAAC,OAAO,EAAA,CAAI,CACtD,CACJ,CACI,EACN,IAAI,CAAC,iBAAiB,IAAI,CAAA,CAAC,2BAA2B,EAAG,IAAA,CAAA,CACzD,EAEL,CAAA;;;;;;;;"}
+{"version":3,"file":"dso-annotation-omgevingsnormwaarde.entry.js","sources":["src/components/annotation/annotation.scss?tag=dso-annotation-omgevingsnormwaarde&encapsulation=shadow","src/components/annotation/annotation-omgevingsnormwaarde/annotation-omgevingsnormwaarde.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/insert\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n\r\n@use \"~dso-toolkit/src/components/link/link\";\r\n\r\n:host {\r\n  display: block;\r\n  padding: 2px;\r\n}\r\n\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([wijzigactie=\"verwijder\"]) {\r\n  @include delete.root();\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.annotation-body {\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.annotation-info {\r\n  flex-grow: 1;\r\n}\r\n\r\n.annotation-symbol,\r\n.annotation-control {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.annotation-title {\r\n  font-weight: 500;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.annotation-title,\r\n.annotation-data {\r\n  margin-block: 0;\r\n\r\n  .content:has(+ dso-label) {\r\n    margin-inline-end: units.$u1 * 0.5;\r\n  }\r\n}\r\n\r\n.annotation-data {\r\n  font-size: 0.875rem;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Fragment, Prop, h } from \"@stencil/core\";\r\n\r\nimport { RenvooiValue } from \"../../renvooi/renvooi.interfaces\";\r\nimport { AnnotationBody } from \"../annotation-body\";\r\nimport { AnnotationGewijzigdeLocatie } from \"../annotation-gewijzigde-locatie\";\r\nimport { AnnotationListRenvooiValues } from \"../annotation-list-renvooi-values\";\r\nimport { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * Dit component wordt voor een Omgevingsnorm en Omgevingswaarde gebruikt.\r\n *\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-omgevingsnormwaarde\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationOmgevingsnormwaarde implements ComponentInterface {\r\n  /**\r\n   * Een optionele wijzigactie die aangeeft of de annotatie toegevoegd of verwijderd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: AnnotationWijzigactie;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de annotatie actief is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Een optionele boolean die aangeeft of de locatie van de annotatie gewijzigd is.\r\n   */\r\n  @Prop({ reflect: true })\r\n  gewijzigdeLocatie?: boolean;\r\n\r\n  /**\r\n   * Een optionele event listener voor wijzigingen aan de status van de annotatie.\r\n   */\r\n  @Event()\r\n  dsoActiveChange!: EventEmitter<AnnotationActiveChangeEvent>;\r\n\r\n  /**\r\n   * De naam van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  naam?: RenvooiValue | string;\r\n\r\n  /**\r\n   * De toelichting van de waardes.\r\n   */\r\n  @Prop()\r\n  toelichting?: string;\r\n\r\n  /**\r\n   * De waardes van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  waardes?: Array<RenvooiValue | string>;\r\n\r\n  /**\r\n   * De eenheid van de omgevingsnorm of omgevingswaarde.\r\n   */\r\n  @Prop()\r\n  eenheid?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationOmgevingsnormwaardeElement;\r\n\r\n  private watcher = watcher(this.host);\r\n\r\n  connectedCallback(): void {\r\n    this.watcher.watch();\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.watcher.unwatch();\r\n  }\r\n\r\n  render() {\r\n    const hasSymbool = this.watcher.hasSymbool();\r\n\r\n    return (\r\n      <AnnotationBody\r\n        symbol={hasSymbool ? <AnnotationSymbolSlot /> : undefined}\r\n        active={this.active || false}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <dso-renvooi value={this.naam} />\r\n            {this.eenheid && (\r\n              <>\r\n                {\" \"}\r\n                (in <dso-renvooi value={this.eenheid} />)\r\n              </>\r\n            )}\r\n          </>\r\n        }\r\n        data={\r\n          <>\r\n            <span class=\"content\">\r\n              {this.toelichting && <>{this.toelichting}</>}\r\n              {this.waardes && this.waardes.length > 0 && (\r\n                <>\r\n                  : <AnnotationListRenvooiValues values={this.waardes} />\r\n                </>\r\n              )}\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,6/LAA6/L;;MCoBtgM,6BAA6B,GAAA,MAAA;AAL1C,IAAA,WAAA,CAAA,OAAA,EAAA;;;QAyDU,IAAA,CAAA,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;AA6CrC;IA3CC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;;IAGtB,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;;IAGxB,MAAM,GAAA;QACJ,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE;AAE5C,QAAA,QACE,CAAA,CAAC,cAAc,EAAA,EAAA,GAAA,EAAA,0CAAA,EACb,MAAM,EAAE,UAAU,GAAG,CAAA,CAAC,oBAAoB,EAAA,IAAA,CAAG,GAAG,SAAS,EACzD,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,KAAK,EAC5B,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,KAAK,EACH,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA,EAChC,IAAI,CAAC,OAAO,KACX,CAAA,CAAA,QAAA,EAAA,IAAA,EACG,GAAG,UACA,CAAA,CAAA,aAAA,EAAA,EAAa,KAAK,EAAE,IAAI,CAAC,OAAO,EAAI,CAAA,MACvC,CACJ,CACA,EAEL,IAAI,EACF,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,IAAI,CAAC,WAAW,IAAI,kBAAG,IAAI,CAAC,WAAW,CAAI,EAC3C,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,KACtC,CAAA,CAAA,QAAA,EAAA,IAAA,QACI,CAAC,CAAA,2BAA2B,EAAC,EAAA,MAAM,EAAE,IAAI,CAAC,OAAO,EAAA,CAAI,CACtD,CACJ,CACI,EACN,IAAI,CAAC,iBAAiB,IAAI,CAAA,CAAC,2BAA2B,EAAG,IAAA,CAAA,CACzD,EAEL,CAAA;;;;;;;;"}

package/dist/esm/dso-attachments-counter.dso-expandable.entry.js.map

@@ -1 +1 @@
-{"version":3,"file":"dso-attachments-counter.dso-expandable.entry.js","sources":["src/components/attachments-counter/attachments-counter.scss?tag=dso-attachments-counter&encapsulation=shadow","src/components/attachments-counter/attachments-counter.tsx","src/components/expandable/expandable.scss?tag=dso-expandable&encapsulation=shadow","src/components/expandable/expandable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/attachments-counter\";\r\n\r\n:host {\r\n  display: inline-block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-attachments {\r\n  @include attachments-counter.root();\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-attachments-counter\",\r\n  styleUrl: \"attachments-counter.scss\",\r\n  shadow: true,\r\n})\r\nexport class AttachmentsCounter {\r\n  /**\r\n   * The number of attachments.\r\n   */\r\n  @Prop()\r\n  count!: number;\r\n\r\n  render() {\r\n    return (\r\n      <span class=\"dso-attachments\">\r\n        {this.count} <span class=\"sr-only\">bijlage{this.count !== 1 ? \"n\" : \"\"}</span>\r\n        <dso-icon icon=\"paperclip\"></dso-icon>\r\n      </span>\r\n    );\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host([enable-animation]) {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  overflow: hidden;\r\n  opacity: 0;\r\n\r\n  @include utilities.transition((\"grid-template-rows\", 150ms), (\"opacity\", 300ms));\r\n}\r\n\r\n:host([enable-animation]:not([open=\"true\"])) {\r\n  .slot-container {\r\n    min-block-size: 0;\r\n    visibility: hidden;\r\n\r\n    @include utilities.transition(visibility);\r\n  }\r\n}\r\n\r\n:host(:not([enable-animation])),\r\n:host([enable-animation=\"false\"]) {\r\n  display: none;\r\n}\r\n\r\n:host([open][enable-animation]:not([open=\"false\"])) {\r\n  grid-template-rows: 1fr;\r\n  opacity: 1;\r\n\r\n  .slot-container {\r\n    visibility: visible;\r\n  }\r\n}\r\n\r\n:host([open]:not([enable-animation]):not([open=\"false\"])),\r\n:host([open][enable-animation=\"false\"]:not([open=\"false\"])) {\r\n  display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Host,\r\n  Listen,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n  h,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nexport interface ExpandableAnimationStartEvent {\r\n  currentOpen: boolean;\r\n  nextOpen: boolean;\r\n}\r\n\r\nexport interface ExpandableAnimationEndEvent {\r\n  bodyHeight: number | undefined;\r\n  open: boolean;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-expandable\",\r\n  styleUrl: \"expandable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Expandable implements ComponentInterface {\r\n  private bodyHeight?: number;\r\n\r\n  @Element()\r\n  host!: HTMLDsoExpandableElement;\r\n\r\n  /**\r\n   * Set to `true` to expand the content.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open?: boolean;\r\n\r\n  /**\r\n   * Set to `true` to show the content animated.\r\n   */\r\n  @Prop({ reflect: true })\r\n  enableAnimation = false;\r\n\r\n  /**\r\n   * When enableAnimation is set to `true`, this property specifies the height of this element at which the animation will expand from / collapse to\r\n   */\r\n  @Prop()\r\n  minimumHeight?: number;\r\n\r\n  @Watch(\"open\")\r\n  toggleOpen() {\r\n    if (!this.enableAnimation) {\r\n      this.isClosed = !this.open;\r\n    }\r\n  }\r\n\r\n  @State()\r\n  isClosed = true;\r\n\r\n  /**\r\n   * Fired before expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationStart!: EventEmitter<ExpandableAnimationStartEvent>;\r\n\r\n  /**\r\n   * Fired after expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationEnd!: EventEmitter<ExpandableAnimationEndEvent>;\r\n\r\n  /**\r\n   * Listens to the transitionstart event\r\n   */\r\n  @Listen(\"transitionstart\")\r\n  transitionstartHandler(e: TransitionEvent) {\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.dsoExpandableAnimationStart.emit({\r\n        currentOpen: !!this.open,\r\n        nextOpen: !this.open,\r\n      });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Listens to the transitionend event\r\n   */\r\n  @Listen(\"transitionend\")\r\n  transitionendHandler(e: TransitionEvent) {\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.isClosed = !this.open;\r\n      this.dsoExpandableAnimationEnd.emit({ bodyHeight: this.bodyHeight, open: !!this.open });\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        aria-hidden={this.open ? \"false\" : \"true\"}\r\n        class={clsx({\r\n          \"dso-animate-ready\": this.enableAnimation,\r\n          \"dso-hide\": this.isClosed,\r\n        })}\r\n      >\r\n        <div class=\"slot-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;AAAA,MAAM,qBAAqB,GAAG,sVAAsV;;MCOvW,kBAAkB,GAAA,MAAA;;;;IAO7B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,KAAK,OAAE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,aAAS,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAQ,EAC9E,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,WAAW,EAAY,CAAA,CACjC;;;;;ACnBb,MAAM,aAAa,GAAG,wwBAAwwB;;MC8BjxB,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAiBE;;AAEG;AAEH,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAgBvB,QAAA,IAAQ,CAAA,QAAA,GAAG,IAAI;AAqDhB;IA5DC,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;;;AAmB9B;;AAEG;AAEH,IAAA,sBAAsB,CAAC,CAAkB,EAAA;AACvC,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC;AACpC,gBAAA,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;AACxB,gBAAA,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI;AACrB,aAAA,CAAC;;;AAIN;;AAEG;AAEH,IAAA,oBAAoB,CAAC,CAAkB,EAAA;AACrC,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;YAC1B,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;;;IAI3F,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,oEACU,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,KAAK,EAAE,IAAI,CAAC;gBACV,mBAAmB,EAAE,IAAI,CAAC,eAAe;gBACzC,UAAU,EAAE,IAAI,CAAC,QAAQ;AAC1B,aAAA,CAAC,EAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ,CACD;;;;;;;;;;;"}
+{"version":3,"file":"dso-attachments-counter.dso-expandable.entry.js","sources":["src/components/attachments-counter/attachments-counter.scss?tag=dso-attachments-counter&encapsulation=shadow","src/components/attachments-counter/attachments-counter.tsx","src/components/expandable/expandable.scss?tag=dso-expandable&encapsulation=shadow","src/components/expandable/expandable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/attachments-counter\";\r\n\r\n:host {\r\n  display: inline-block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-attachments {\r\n  @include attachments-counter.root();\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-attachments-counter\",\r\n  styleUrl: \"attachments-counter.scss\",\r\n  shadow: true,\r\n})\r\nexport class AttachmentsCounter {\r\n  /**\r\n   * The number of attachments.\r\n   */\r\n  @Prop()\r\n  count!: number;\r\n\r\n  render() {\r\n    return (\r\n      <span class=\"dso-attachments\">\r\n        {this.count} <span class=\"sr-only\">bijlage{this.count !== 1 ? \"n\" : \"\"}</span>\r\n        <dso-icon icon=\"paperclip\"></dso-icon>\r\n      </span>\r\n    );\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host([enable-animation]) {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  overflow: hidden;\r\n  opacity: 0;\r\n\r\n  @include utilities.transition((\"grid-template-rows\", 150ms), (\"opacity\", 300ms));\r\n}\r\n\r\n:host([enable-animation]:not([open=\"true\"])) {\r\n  .slot-container {\r\n    min-block-size: 0;\r\n    visibility: hidden;\r\n\r\n    @include utilities.transition(visibility);\r\n  }\r\n}\r\n\r\n:host(:not([enable-animation])),\r\n:host([enable-animation=\"false\"]) {\r\n  display: none;\r\n}\r\n\r\n:host([open][enable-animation]:not([open=\"false\"])) {\r\n  grid-template-rows: 1fr;\r\n  opacity: 1;\r\n\r\n  .slot-container {\r\n    visibility: visible;\r\n  }\r\n}\r\n\r\n:host([open]:not([enable-animation]):not([open=\"false\"])),\r\n:host([open][enable-animation=\"false\"]:not([open=\"false\"])) {\r\n  display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Host,\r\n  Listen,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n  h,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nexport interface ExpandableAnimationStartEvent {\r\n  currentOpen: boolean;\r\n  nextOpen: boolean;\r\n}\r\n\r\nexport interface ExpandableAnimationEndEvent {\r\n  bodyHeight: number | undefined;\r\n  open: boolean;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-expandable\",\r\n  styleUrl: \"expandable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Expandable implements ComponentInterface {\r\n  private bodyHeight?: number;\r\n\r\n  @Element()\r\n  host!: HTMLDsoExpandableElement;\r\n\r\n  /**\r\n   * Set to `true` to expand the content.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open?: boolean;\r\n\r\n  /**\r\n   * Set to `true` to show the content animated.\r\n   */\r\n  @Prop({ reflect: true })\r\n  enableAnimation = false;\r\n\r\n  /**\r\n   * When enableAnimation is set to `true`, this property specifies the height of this element at which the animation will expand from / collapse to\r\n   */\r\n  @Prop()\r\n  minimumHeight?: number;\r\n\r\n  @Watch(\"open\")\r\n  toggleOpen() {\r\n    if (!this.enableAnimation) {\r\n      this.isClosed = !this.open;\r\n    }\r\n  }\r\n\r\n  @State()\r\n  isClosed = true;\r\n\r\n  /**\r\n   * Fired before expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationStart!: EventEmitter<ExpandableAnimationStartEvent>;\r\n\r\n  /**\r\n   * Fired after expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationEnd!: EventEmitter<ExpandableAnimationEndEvent>;\r\n\r\n  /**\r\n   * Listens to the transitionstart event\r\n   */\r\n  @Listen(\"transitionstart\")\r\n  transitionstartHandler(e: TransitionEvent) {\r\n    e.stopPropagation();\r\n\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.dsoExpandableAnimationStart.emit({\r\n        currentOpen: !!this.open,\r\n        nextOpen: !this.open,\r\n      });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Listens to the transitionend event\r\n   */\r\n  @Listen(\"transitionend\")\r\n  transitionendHandler(e: TransitionEvent) {\r\n    e.stopPropagation();\r\n\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.isClosed = !this.open;\r\n      this.dsoExpandableAnimationEnd.emit({ bodyHeight: this.bodyHeight, open: !!this.open });\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        aria-hidden={this.open ? \"false\" : \"true\"}\r\n        class={clsx({\r\n          \"dso-animate-ready\": this.enableAnimation,\r\n          \"dso-hide\": this.isClosed,\r\n        })}\r\n      >\r\n        <div class=\"slot-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;AAAA,MAAM,qBAAqB,GAAG,sVAAsV;;MCOvW,kBAAkB,GAAA,MAAA;;;;IAO7B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,KAAK,OAAE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,aAAS,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAQ,EAC9E,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,WAAW,EAAY,CAAA,CACjC;;;;;ACnBb,MAAM,aAAa,GAAG,wwBAAwwB;;MC8BjxB,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAiBE;;AAEG;AAEH,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAgBvB,QAAA,IAAQ,CAAA,QAAA,GAAG,IAAI;AAyDhB;IAhEC,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;;;AAmB9B;;AAEG;AAEH,IAAA,sBAAsB,CAAC,CAAkB,EAAA;QACvC,CAAC,CAAC,eAAe,EAAE;AAEnB,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC;AACpC,gBAAA,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;AACxB,gBAAA,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI;AACrB,aAAA,CAAC;;;AAIN;;AAEG;AAEH,IAAA,oBAAoB,CAAC,CAAkB,EAAA;QACrC,CAAC,CAAC,eAAe,EAAE;AAEnB,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;YAC1B,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;;;IAI3F,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,oEACU,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,KAAK,EAAE,IAAI,CAAC;gBACV,mBAAmB,EAAE,IAAI,CAAC,eAAe;gBACzC,UAAU,EAAE,IAAI,CAAC,QAAQ;AAC1B,aAAA,CAAC,EAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ,CACD;;;;;;;;;;;"}

package/dist/esm/dso-attachments-counter_2.entry.js

@@ -8,7 +8,7 @@ const AttachmentsCounter = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("span", { key: '7bc1608fbe166e44971fe220ab4d6d5ee80aa6cd', class: "dso-attachments" }, this.count, " ", h("span", { key: '6a1ad89f68cff3c54069c0631fe823149fd57f06', class: "sr-only" }, "bijlage", this.count !== 1 ? "n" : ""), h("dso-icon", { key: '8f45aec5a772805bace01ae3b79e25b52e18a815', icon: "paperclip" })));
+        return (h("span", { key: 'b11de72fcb7669716ed27ed4bfb65ee395b6c4bd', class: "dso-attachments" }, this.count, " ", h("span", { key: '2b9017488e1a4d57983863b38f2bcf928d984a21', class: "sr-only" }, "bijlage", this.count !== 1 ? "n" : ""), h("dso-icon", { key: 'cf3647f6e9d3ad22d614323aae84d8eaa196b5df', icon: "paperclip" })));
     }
 };
 AttachmentsCounter.style = attachmentsCounterCss;
@@ -35,6 +35,7 @@ const Expandable = class {
      * Listens to the transitionstart event
      */
     transitionstartHandler(e) {
+        e.stopPropagation();
         if (e.propertyName === "grid-template-rows") {
             this.dsoExpandableAnimationStart.emit({
                 currentOpen: !!this.open,
@@ -46,16 +47,17 @@ const Expandable = class {
      * Listens to the transitionend event
      */
     transitionendHandler(e) {
+        e.stopPropagation();
         if (e.propertyName === "grid-template-rows") {
             this.isClosed = !this.open;
             this.dsoExpandableAnimationEnd.emit({ bodyHeight: this.bodyHeight, open: !!this.open });
         }
     }
     render() {
-        return (h(Host, { key: 'a96a5d368bb844e3598b290ae43a35c80d98df21', "aria-hidden": this.open ? "false" : "true", class: clsx({
+        return (h(Host, { key: '0ac682bd5e9d129cdf4328de0a4284ccad034b65', "aria-hidden": this.open ? "false" : "true", class: clsx({
                 "dso-animate-ready": this.enableAnimation,
                 "dso-hide": this.isClosed,
-            }) }, h("div", { key: '52544669ddbf2b2fd7c3c9066ff351ec7461841a', class: "slot-container" }, h("slot", { key: 'a1f810275d75983b6e584092fe576bd1d54e116d' }))));
+            }) }, h("div", { key: 'a231cdd101a5be780dc5da7c08138e1f3e2290e5', class: "slot-container" }, h("slot", { key: 'ab6aee1ae95ca0767352ccfce24f240b6a05d8dd' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/dso-attachments-counter_2.entry.js.map

@@ -1 +1 @@
-{"file":"dso-attachments-counter.dso-expandable.entry.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,sVAAsV;;MCOvW,kBAAkB,GAAA,MAAA;;;;IAO7B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,KAAK,OAAE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,aAAS,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAQ,EAC9E,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,WAAW,EAAY,CAAA,CACjC;;;;;ACnBb,MAAM,aAAa,GAAG,wwBAAwwB;;MC8BjxB,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAiBE;;AAEG;AAEH,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAgBvB,QAAA,IAAQ,CAAA,QAAA,GAAG,IAAI;AAqDhB;IA5DC,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;;;AAmB9B;;AAEG;AAEH,IAAA,sBAAsB,CAAC,CAAkB,EAAA;AACvC,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC;AACpC,gBAAA,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;AACxB,gBAAA,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI;AACrB,aAAA,CAAC;;;AAIN;;AAEG;AAEH,IAAA,oBAAoB,CAAC,CAAkB,EAAA;AACrC,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;YAC1B,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;;;IAI3F,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,oEACU,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,KAAK,EAAE,IAAI,CAAC;gBACV,mBAAmB,EAAE,IAAI,CAAC,eAAe;gBACzC,UAAU,EAAE,IAAI,CAAC,QAAQ;AAC1B,aAAA,CAAC,EAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ,CACD;;;;;;;;;;;","names":[],"sources":["src/components/attachments-counter/attachments-counter.scss?tag=dso-attachments-counter&encapsulation=shadow","src/components/attachments-counter/attachments-counter.tsx","src/components/expandable/expandable.scss?tag=dso-expandable&encapsulation=shadow","src/components/expandable/expandable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/attachments-counter\";\r\n\r\n:host {\r\n  display: inline-block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-attachments {\r\n  @include attachments-counter.root();\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-attachments-counter\",\r\n  styleUrl: \"attachments-counter.scss\",\r\n  shadow: true,\r\n})\r\nexport class AttachmentsCounter {\r\n  /**\r\n   * The number of attachments.\r\n   */\r\n  @Prop()\r\n  count!: number;\r\n\r\n  render() {\r\n    return (\r\n      <span class=\"dso-attachments\">\r\n        {this.count} <span class=\"sr-only\">bijlage{this.count !== 1 ? \"n\" : \"\"}</span>\r\n        <dso-icon icon=\"paperclip\"></dso-icon>\r\n      </span>\r\n    );\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host([enable-animation]) {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  overflow: hidden;\r\n  opacity: 0;\r\n\r\n  @include utilities.transition((\"grid-template-rows\", 150ms), (\"opacity\", 300ms));\r\n}\r\n\r\n:host([enable-animation]:not([open=\"true\"])) {\r\n  .slot-container {\r\n    min-block-size: 0;\r\n    visibility: hidden;\r\n\r\n    @include utilities.transition(visibility);\r\n  }\r\n}\r\n\r\n:host(:not([enable-animation])),\r\n:host([enable-animation=\"false\"]) {\r\n  display: none;\r\n}\r\n\r\n:host([open][enable-animation]:not([open=\"false\"])) {\r\n  grid-template-rows: 1fr;\r\n  opacity: 1;\r\n\r\n  .slot-container {\r\n    visibility: visible;\r\n  }\r\n}\r\n\r\n:host([open]:not([enable-animation]):not([open=\"false\"])),\r\n:host([open][enable-animation=\"false\"]:not([open=\"false\"])) {\r\n  display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Host,\r\n  Listen,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n  h,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nexport interface ExpandableAnimationStartEvent {\r\n  currentOpen: boolean;\r\n  nextOpen: boolean;\r\n}\r\n\r\nexport interface ExpandableAnimationEndEvent {\r\n  bodyHeight: number | undefined;\r\n  open: boolean;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-expandable\",\r\n  styleUrl: \"expandable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Expandable implements ComponentInterface {\r\n  private bodyHeight?: number;\r\n\r\n  @Element()\r\n  host!: HTMLDsoExpandableElement;\r\n\r\n  /**\r\n   * Set to `true` to expand the content.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open?: boolean;\r\n\r\n  /**\r\n   * Set to `true` to show the content animated.\r\n   */\r\n  @Prop({ reflect: true })\r\n  enableAnimation = false;\r\n\r\n  /**\r\n   * When enableAnimation is set to `true`, this property specifies the height of this element at which the animation will expand from / collapse to\r\n   */\r\n  @Prop()\r\n  minimumHeight?: number;\r\n\r\n  @Watch(\"open\")\r\n  toggleOpen() {\r\n    if (!this.enableAnimation) {\r\n      this.isClosed = !this.open;\r\n    }\r\n  }\r\n\r\n  @State()\r\n  isClosed = true;\r\n\r\n  /**\r\n   * Fired before expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationStart!: EventEmitter<ExpandableAnimationStartEvent>;\r\n\r\n  /**\r\n   * Fired after expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationEnd!: EventEmitter<ExpandableAnimationEndEvent>;\r\n\r\n  /**\r\n   * Listens to the transitionstart event\r\n   */\r\n  @Listen(\"transitionstart\")\r\n  transitionstartHandler(e: TransitionEvent) {\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.dsoExpandableAnimationStart.emit({\r\n        currentOpen: !!this.open,\r\n        nextOpen: !this.open,\r\n      });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Listens to the transitionend event\r\n   */\r\n  @Listen(\"transitionend\")\r\n  transitionendHandler(e: TransitionEvent) {\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.isClosed = !this.open;\r\n      this.dsoExpandableAnimationEnd.emit({ bodyHeight: this.bodyHeight, open: !!this.open });\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        aria-hidden={this.open ? \"false\" : \"true\"}\r\n        class={clsx({\r\n          \"dso-animate-ready\": this.enableAnimation,\r\n          \"dso-hide\": this.isClosed,\r\n        })}\r\n      >\r\n        <div class=\"slot-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"dso-attachments-counter.dso-expandable.entry.js","mappings":";;;AAAA,MAAM,qBAAqB,GAAG,sVAAsV;;MCOvW,kBAAkB,GAAA,MAAA;;;;IAO7B,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAC1B,IAAI,CAAC,KAAK,OAAE,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,aAAS,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAQ,EAC9E,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,WAAW,EAAY,CAAA,CACjC;;;;;ACnBb,MAAM,aAAa,GAAG,wwBAAwwB;;MC8BjxB,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAiBE;;AAEG;AAEH,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAgBvB,QAAA,IAAQ,CAAA,QAAA,GAAG,IAAI;AAyDhB;IAhEC,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;AACzB,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;;;AAmB9B;;AAEG;AAEH,IAAA,sBAAsB,CAAC,CAAkB,EAAA;QACvC,CAAC,CAAC,eAAe,EAAE;AAEnB,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC;AACpC,gBAAA,WAAW,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI;AACxB,gBAAA,QAAQ,EAAE,CAAC,IAAI,CAAC,IAAI;AACrB,aAAA,CAAC;;;AAIN;;AAEG;AAEH,IAAA,oBAAoB,CAAC,CAAkB,EAAA;QACrC,CAAC,CAAC,eAAe,EAAE;AAEnB,QAAA,IAAI,CAAC,CAAC,YAAY,KAAK,oBAAoB,EAAE;AAC3C,YAAA,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI;YAC1B,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;;;IAI3F,MAAM,GAAA;QACJ,QACE,CAAC,CAAA,IAAI,oEACU,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,KAAK,EAAE,IAAI,CAAC;gBACV,mBAAmB,EAAE,IAAI,CAAC,eAAe;gBACzC,UAAU,EAAE,IAAI,CAAC,QAAQ;AAC1B,aAAA,CAAC,EAAA,EAEF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACzB,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ,CACD;;;;;;;;;;;","names":[],"sources":["src/components/attachments-counter/attachments-counter.scss?tag=dso-attachments-counter&encapsulation=shadow","src/components/attachments-counter/attachments-counter.tsx","src/components/expandable/expandable.scss?tag=dso-expandable&encapsulation=shadow","src/components/expandable/expandable.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/attachments-counter\";\r\n\r\n:host {\r\n  display: inline-block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n.dso-attachments {\r\n  @include attachments-counter.root();\r\n}\r\n","import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-attachments-counter\",\r\n  styleUrl: \"attachments-counter.scss\",\r\n  shadow: true,\r\n})\r\nexport class AttachmentsCounter {\r\n  /**\r\n   * The number of attachments.\r\n   */\r\n  @Prop()\r\n  count!: number;\r\n\r\n  render() {\r\n    return (\r\n      <span class=\"dso-attachments\">\r\n        {this.count} <span class=\"sr-only\">bijlage{this.count !== 1 ? \"n\" : \"\"}</span>\r\n        <dso-icon icon=\"paperclip\"></dso-icon>\r\n      </span>\r\n    );\r\n  }\r\n}\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n:host([enable-animation]) {\r\n  display: grid;\r\n  grid-template-rows: 0fr;\r\n  overflow: hidden;\r\n  opacity: 0;\r\n\r\n  @include utilities.transition((\"grid-template-rows\", 150ms), (\"opacity\", 300ms));\r\n}\r\n\r\n:host([enable-animation]:not([open=\"true\"])) {\r\n  .slot-container {\r\n    min-block-size: 0;\r\n    visibility: hidden;\r\n\r\n    @include utilities.transition(visibility);\r\n  }\r\n}\r\n\r\n:host(:not([enable-animation])),\r\n:host([enable-animation=\"false\"]) {\r\n  display: none;\r\n}\r\n\r\n:host([open][enable-animation]:not([open=\"false\"])) {\r\n  grid-template-rows: 1fr;\r\n  opacity: 1;\r\n\r\n  .slot-container {\r\n    visibility: visible;\r\n  }\r\n}\r\n\r\n:host([open]:not([enable-animation]):not([open=\"false\"])),\r\n:host([open][enable-animation=\"false\"]:not([open=\"false\"])) {\r\n  display: block;\r\n}\r\n\r\n@include utilities.box-sizing();\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Host,\r\n  Listen,\r\n  Prop,\r\n  State,\r\n  Watch,\r\n  h,\r\n} from \"@stencil/core\";\r\nimport clsx from \"clsx\";\r\n\r\nexport interface ExpandableAnimationStartEvent {\r\n  currentOpen: boolean;\r\n  nextOpen: boolean;\r\n}\r\n\r\nexport interface ExpandableAnimationEndEvent {\r\n  bodyHeight: number | undefined;\r\n  open: boolean;\r\n}\r\n\r\n@Component({\r\n  tag: \"dso-expandable\",\r\n  styleUrl: \"expandable.scss\",\r\n  shadow: true,\r\n})\r\nexport class Expandable implements ComponentInterface {\r\n  private bodyHeight?: number;\r\n\r\n  @Element()\r\n  host!: HTMLDsoExpandableElement;\r\n\r\n  /**\r\n   * Set to `true` to expand the content.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open?: boolean;\r\n\r\n  /**\r\n   * Set to `true` to show the content animated.\r\n   */\r\n  @Prop({ reflect: true })\r\n  enableAnimation = false;\r\n\r\n  /**\r\n   * When enableAnimation is set to `true`, this property specifies the height of this element at which the animation will expand from / collapse to\r\n   */\r\n  @Prop()\r\n  minimumHeight?: number;\r\n\r\n  @Watch(\"open\")\r\n  toggleOpen() {\r\n    if (!this.enableAnimation) {\r\n      this.isClosed = !this.open;\r\n    }\r\n  }\r\n\r\n  @State()\r\n  isClosed = true;\r\n\r\n  /**\r\n   * Fired before expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationStart!: EventEmitter<ExpandableAnimationStartEvent>;\r\n\r\n  /**\r\n   * Fired after expanding.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoExpandableAnimationEnd!: EventEmitter<ExpandableAnimationEndEvent>;\r\n\r\n  /**\r\n   * Listens to the transitionstart event\r\n   */\r\n  @Listen(\"transitionstart\")\r\n  transitionstartHandler(e: TransitionEvent) {\r\n    e.stopPropagation();\r\n\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.dsoExpandableAnimationStart.emit({\r\n        currentOpen: !!this.open,\r\n        nextOpen: !this.open,\r\n      });\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Listens to the transitionend event\r\n   */\r\n  @Listen(\"transitionend\")\r\n  transitionendHandler(e: TransitionEvent) {\r\n    e.stopPropagation();\r\n\r\n    if (e.propertyName === \"grid-template-rows\") {\r\n      this.isClosed = !this.open;\r\n      this.dsoExpandableAnimationEnd.emit({ bodyHeight: this.bodyHeight, open: !!this.open });\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        aria-hidden={this.open ? \"false\" : \"true\"}\r\n        class={clsx({\r\n          \"dso-animate-ready\": this.enableAnimation,\r\n          \"dso-hide\": this.isClosed,\r\n        })}\r\n      >\r\n        <div class=\"slot-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/esm/dso-autosuggest.entry.js

@@ -512,7 +512,7 @@ const Autosuggest = class {
         else if (this.input) {
             this.input.removeAttribute("aria-controls");
         }
-        return (h(Fragment, null, h("slot", { key: '75db3245d7e2a85722c0a408bfa8c2d117000a4a' }), this.loading && this.showLoading ? (h("div", { class: "autosuggest-progress-box" }, h("dso-progress-indicator", { label: this.loadingLabel }))) : (showListbox && (h(Fragment, null, h("dso-scrollable", { class: "listbox-container", ref: (element) => (this.listboxContainer = element) }, h("div", { class: "listbox", role: "listbox", id: this.listboxId, "aria-labelledby": this.labelId, ref: (element) => (this.listbox = element), tabindex: "0" }, (flat &&
+        return (h(Fragment, null, h("slot", { key: '21764b36de5db37e44defc6473ea96e8e06d54e0' }), this.loading && this.showLoading ? (h("div", { class: "autosuggest-progress-box" }, h("dso-progress-indicator", { label: this.loadingLabel }))) : (showListbox && (h(Fragment, null, h("dso-scrollable", { class: "listbox-container", ref: (element) => (this.listboxContainer = element) }, h("div", { class: "listbox", role: "listbox", id: this.listboxId, "aria-labelledby": this.labelId, ref: (element) => (this.listbox = element), tabindex: "0" }, (flat &&
             this.showSuggestions &&
             this.suggestions &&
             this.suggestions.map((suggestion) => (h(Option, { id: this.listboxItemId(suggestion), mouseEnter: () => this.selectSuggestion(suggestion), mouseLeave: () => this.resetSelectedSuggestion(), click: () => this.pickSelectedValue(), selected: (suggestion === this.selectedSuggestion).toString(), suggestion: suggestion, ref: (element) => element && this.listboxItems.push(element), markedSuggestion: this.getMarkedSuggestions(suggestion) })))) ||

package/dist/esm/dso-banner.entry.js

@@ -18,9 +18,9 @@ const Banner = class {
         this.icon = false;
     }
     render() {
-        return (h("section", { key: '6ec542fbb7b329d79fb6065c74be3c30edaa5bcc', class: clsx("dso-banner", `alert-${this.status}`, {
+        return (h("section", { key: 'd19ab00faab47b26f6cc5dbda513eabfebde19f6', class: clsx("dso-banner", `alert-${this.status}`, {
                 "dso-compact": this.compact,
-            }), role: "alert" }, h("slot", { key: 'c940029d0ad0ec681811cd6bb68446ccd41878c9' })));
+            }), role: "alert" }, h("slot", { key: '5b5a7b14ebf06f9d12a88ff89d9591aa643579bc' })));
     }
 };
 Banner.style = bannerCss;

package/dist/esm/dso-button-group.entry.js

@@ -29,7 +29,7 @@ const ButtonGroup = class {
         return !!this.host.querySelector(":scope > .dso-map");
     }
     render() {
-        return (h("div", { key: '0833d62def3ca95de506748637bfb925c73f4b3a', class: clsx("container", { "has-map-buttons": this.hasMapButtons }), role: "group" }, h("slot", { key: '2185893b0e429692b16d40460cf4f877e2a0d1e5' })));
+        return (h("div", { key: 'd32c6176a41155f548387a437eb249fd867527f0', class: clsx("container", { "has-map-buttons": this.hasMapButtons }), role: "group" }, h("slot", { key: 'e62a071cf6fb4bcd779fcd086aa6825e1694ef86' })));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-card-container.entry.js

@@ -11,7 +11,7 @@ const CardContainer = class {
         this.mode = "list";
     }
     render() {
-        return (h(Fragment, null, this.mode === "list" && (h("ul", { key: '90b07c1be81c9e8891fc3c56d9d67304347c2756', class: "dso-card-list" }, h("slot", { key: '28fd7e44a59870508de16cefaf245146004319bc' }))), this.mode === "grid" && (h("div", { key: '8a73e7edf8c218f0dee90aac272b148207c20d13', class: "dso-card-grid" }, h("slot", { key: '9406a30a0ddf5ac7d1c48b5e0003f61936945783' })))));
+        return (h(Fragment, null, this.mode === "list" && (h("ul", { key: 'd593775800ecb1923ef9ad855255e7dd37ea591a', class: "dso-card-list" }, h("slot", { key: '7ea9f4b7e848bf3afa2039f5ec4ab14ce2573243' }))), this.mode === "grid" && (h("div", { key: 'b4ce1e46af681b37be5e7d53ee56be82a286d9c7', class: "dso-card-grid" }, h("slot", { key: '1d29ddba3f221ee0a507ba93a36869a24e4ad19f' })))));
     }
 };
 CardContainer.style = cardContainerCss;

package/dist/esm/dso-card.entry.js

@@ -31,8 +31,8 @@ const Card = class {
     }
     render() {
         const isSelectable = this.selectableSlottedElement !== null;
-        return (h(Host, { key: '36c7e37e3565af414ebf091a9118b8c881ac18f7', "is-selectable": isSelectable }, h("div", { key: '69e0f342122bd4ac53ca18ea53ca9ea64c1802d1', class: "dso-card-container" }, h("div", { key: '880b4c8a61b841dfda3043f86f1b5ea37c742b44', class: "dso-card-selectable", hidden: !isSelectable }, h("slot", { key: '985861bac731aecc3dc914a32db5bce35fc18da0', name: "selectable" })), h("div", { key: '3a77b0bcd5892f7e4a8d2e32c14d0d2eb7024144', class: "dso-card-heading" }, (this.mode === "extern" && (h("a", { key: '756424c1507d093386d91ebd1b38f03f415071ac', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '052ff25dc558d89c3e674fb2efa4cfd9c83e385f', name: "heading" }), h("dso-icon", { key: '29f7e56fcdb75c2e4aaf2706e86197108239f1b3', icon: "external-link" }), h("span", { key: '1f8cff9385a86bd2fc4b20ee61f53019051d434d', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
-            (this.mode === "download" && (h("a", { key: '3a18f6a6570b8967f16526503e2a23b8eea1937e', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'c50da6e83a090f725853154d3cbcd46b159ce893', name: "heading" }), h("dso-icon", { key: '06f7c304bffeab5264d2efb08490f00fe5ddf970', icon: "download" })))) || (h("a", { key: '17359530043bde8ca2c8c31a541667da26241c26', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'd6e44c271ee256b1f4ab024836854077dd7802ed', name: "heading" }), h("dso-icon", { key: '0d3445bd395ad3df910a42e93cdd3da375315fc9', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && h("slot", { key: '916c08c993eb995d6f572d0d3ae03eb69d17b755', name: "interactions" })), h("div", { key: '464f37a71643a16f2c63aa7ffaa9b0dda9b331fc', class: "dso-card-content" }, h("slot", { key: 'd05e86980f31e1af748768f5b8791fad464cc559', name: "content" })))));
+        return (h(Host, { key: '4054a302510ad07362d9089c942e58995baa99be', "is-selectable": isSelectable }, h("div", { key: '6bc8237ad90d02bfe4b3f051c616ce1fa5c2e93e', class: "dso-card-container" }, h("div", { key: '655658b4979420b339e0acd1e25d799b36ab8d33', class: "dso-card-selectable", hidden: !isSelectable }, h("slot", { key: '441362e9baa84ea7366fd1eeda03bb694c3af304', name: "selectable" })), h("div", { key: 'b38fc0c9bbbb2fa228936039b6a4897ac1c27ad2', class: "dso-card-heading" }, (this.mode === "extern" && (h("a", { key: 'df8998e9b31aa38b61595cd49012b8f3ff51464e', href: this.href, class: "heading-anchor", target: "_blank", rel: "noopener noreferrer", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'b4685d2a490ed81e6eb7082a537a28fbae4d6072', name: "heading" }), h("dso-icon", { key: 'eb741b5b1d283c333e06ae0c87eb501aacb741b5', icon: "external-link" }), h("span", { key: '6f88b705b3967c9dd6b03419b6f18a7b1e77dc15', class: "sr-only" }, "(Opent andere website in nieuw tabblad)")))) ||
+            (this.mode === "download" && (h("a", { key: 'e0cf75a7c96ded19a96d96f4451c973336a1a507', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'c33e908eedae868f081bff313f0981449852de12', name: "heading" }), h("dso-icon", { key: 'ff774bc81320ea2f532f816de3a14c35899fb3ac', icon: "download" })))) || (h("a", { key: 'e0160cd81ad54b2665e5c87b49769aa8cf31fcfd', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: '48dff93e79734127e2e578c1b8d28c2c6bf67085', name: "heading" }), h("dso-icon", { key: '89d2c5f135e95204702b1b76725c694da3e3ba8b', icon: "chevron-right" }))), this.interactionsSlottedElement !== null && h("slot", { key: '177b551119e7b08ed23d501199d1ec57a60e6a95', name: "interactions" })), h("div", { key: '11a6c27534df33821844c9ff6ea602517f1602b0', class: "dso-card-content" }, h("slot", { key: '0145480ad4b5b50a80dcaa6c816e7cab3784d06f', name: "content" })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-contact-information.entry.js

@@ -7,7 +7,7 @@ const ContactInformation = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'a511c3b7e61371a74f3e55c0a71abaf56768cb52', class: "dso-contact-information" }, h("slot", { key: '98fae6e8614de0c46fb8fb5d55e77f5807dc4231', name: "heading" }), h("slot", { key: 'b84cd2bcc9a9874110d302b16ece15d37ab35896', name: "anchor-items" }), h("slot", { key: '32bae418af1a46f538c8cb4dde38e347f99cf7b1', name: "info-items" })));
+        return (h("div", { key: 'bbabd0b1c2088b6e7fffdd7c51dcbad08205a7e7', class: "dso-contact-information" }, h("slot", { key: 'e002381ccc600ede34f2d024d9ff6afa992d497b', name: "heading" }), h("slot", { key: 'f03b77b304836ccfe8cf48b310ea79f6fbdebb61', name: "anchor-items" }), h("slot", { key: 'b73bae3565c07464938d138c31fe5a9f3156e1f4', name: "info-items" })));
     }
 };
 ContactInformation.style = contactInformationCss;

package/dist/esm/dso-date-picker-legacy.entry.js

@@ -711,14 +711,14 @@ const DsoDatePickerLegacy = class {
         if (maxDate) {
             maxYear = Math.min(maxYear, maxDate.getFullYear());
         }
-        return (h(Host, { key: '0b1ec6d7508b3bd54868d792da349f56723c49f7' }, h("div", { key: '3760db6ad5de67e53d9b663f21d9fa7c19c0c47a', class: { "dso-date": true, "dso-visible": this.visible } }, h("div", { key: 'f757525e60df0cd5566dba5c188cb9e6483f057d', class: "dso-date__input-wrapper" }, h("input", { key: 'c8ef8c3fb2524c1b996d0eedd5061b4c9b406738', class: "dso-date__input", value: this.value, placeholder: this.localization.placeholder, id: this.identifier, disabled: this.disabled, role: (_a = this.role) !== null && _a !== void 0 ? _a : undefined, required: this.required ? true : undefined, "aria-autocomplete": "none", "aria-invalid": (_b = this.invalid) === null || _b === void 0 ? void 0 : _b.toString(), "aria-describedby": this.describedBy, onInput: this.handleInputChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, autoComplete: "off", ref: (element) => (this.datePickerLegacyInput = element) }), h("button", { key: '0b43d6689f0e9a450b3f5ea98bb7e61739552847', type: "button", class: "dso-date__toggle", onClick: this.toggleOpen, disabled: this.disabled, ref: (element) => (this.datePickerLegacyButton = element) }, h("span", { key: 'fd6f7ae09f4f28fc80f5e59022080a4340cd57ff', class: "dso-date__toggle-icon" }, h("dso-icon", { key: 'd956ec013af3fa9969e159093bdc9e83da2040cd', icon: "calendar" })), h("span", { key: '5fb48f01acb482324f576afb50884dfc8bf8ac5c', class: "dso-date__vhidden" }, this.localization.buttonLabel, formattedDate && (h("span", { key: 'a9e593f6baedfd379febefd8b3259433314b7a03' }, ", ", this.localization.selectedDateMessage, " ", formattedDate))))), h("div", { key: '58475a8e3df7056be4486e40c566d8f589bfc4b9', class: {
+        return (h(Host, { key: '396b32409bc093895e3f35d18dba8bd7e6777f46' }, h("div", { key: 'd5a5787fcc7f6a5126a266ff5add00b7ff586cba', class: { "dso-date": true, "dso-visible": this.visible } }, h("div", { key: '85fd7e86974ab53580fb452ac1f18bc12a907c6d', class: "dso-date__input-wrapper" }, h("input", { key: 'b4f2997aa317cdf00396ff49d6c0a5f72764d503', class: "dso-date__input", value: this.value, placeholder: this.localization.placeholder, id: this.identifier, disabled: this.disabled, role: (_a = this.role) !== null && _a !== void 0 ? _a : undefined, required: this.required ? true : undefined, "aria-autocomplete": "none", "aria-invalid": (_b = this.invalid) === null || _b === void 0 ? void 0 : _b.toString(), "aria-describedby": this.describedBy, onInput: this.handleInputChange, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, autoComplete: "off", ref: (element) => (this.datePickerLegacyInput = element) }), h("button", { key: 'e2b34c1e6d804f6bf96aaea34daea995c59cbec5', type: "button", class: "dso-date__toggle", onClick: this.toggleOpen, disabled: this.disabled, ref: (element) => (this.datePickerLegacyButton = element) }, h("span", { key: '578b0315ed115d28f7906d585914bc6dae2a40cc', class: "dso-date__toggle-icon" }, h("dso-icon", { key: '90488726ea142805085372ed273ef6a10691f85a', icon: "calendar" })), h("span", { key: '34d925fe5facf889afa518e64150121df6e0ade7', class: "dso-date__vhidden" }, this.localization.buttonLabel, formattedDate && (h("span", { key: '53471bfd4a6d8a3dd7a27582fadbf847f824f1dd' }, ", ", this.localization.selectedDateMessage, " ", formattedDate))))), h("div", { key: '6a292ed13e8dfa5b972c8f1133238a535511cb8e', class: {
                 "dso-date__dialog": true,
                 "is-left": this.direction === "left",
                 "is-active": this.open,
-            }, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("div", { key: 'b9aaf2ee2e85356ebbb97c81ec6d2fc60d433aba', class: "dso-date__dialog-content", onKeyDown: this.handleEscKey }, h("div", { key: 'd5b24a9d0967a9389486c6d2d62c7df973092360', class: "dso-date__vhidden dso-date__instructions", "aria-live": "polite" }, this.localization.keyboardInstruction), h("div", { key: 'a7fa892c6141fb05cd9d5e25941b58d3f33103d8', class: "dso-date__mobile", onFocusin: this.disableActiveFocus }, h("label", { key: '9ee19bb1e9323ded05446ea3f3e6a52817a32302', class: "dso-date__mobile-heading" }, this.localization.calendarHeading), h("button", { key: '0b0f38cf720508e49a03b3336d22b484db8db0a9', class: "dso-date__close", ref: (element) => (this.firstFocusableElement = element), onKeyDown: this.handleFirstFocusableKeydown, onClick: () => this.hide(), type: "button" }, h("dso-icon", { key: '55688d9e29a9d0e703cf9b05e064670f0eba97ae', icon: "times" }), h("span", { key: 'c851850368265c521ae301d7c9e0c753157d5739', class: "dso-date__vhidden" }, this.localization.closeLabel))), h("div", { key: '0e768e06ffca70d595b49199cc43394f893f1936', class: "dso-date__header", onFocusin: this.disableActiveFocus }, h("div", { key: '650fce41916c3ddf60c5148d58300846cbc41bc2' }, h("h2", { key: '93e6938990982c205dbf34105dcfb7beeedfe5fb', id: this.dialogLabelId, class: "dso-date__vhidden", "aria-live": "polite" }, this.localization.monthNames[focusedMonth], " ", this.focusedDay.getFullYear()), h("label", { key: 'e956e5066fbd5c56f33cdcacd9f4530a90bd1967', htmlFor: this.monthSelectId, class: "dso-date__vhidden" }, this.localization.monthSelectLabel), h("div", { key: 'a4c988914df53fd0d0af4c808ee1094a72c15bdc', class: "dso-date__select" }, h("select", { key: 'ab5b9dd4f543d13278b4dd65edfae89c00339cc9', id: this.monthSelectId, class: "dso-date__select--month", ref: (element) => (this.monthSelectNode = element), onChange: this.handleMonthSelect }, monthRange(this.localization, selectedYear, minDate, maxDate).map((month) => {
+            }, role: "dialog", "aria-modal": "true", "aria-hidden": this.open ? "false" : "true", "aria-labelledby": this.dialogLabelId, onTouchMove: this.handleTouchMove, onTouchStart: this.handleTouchStart, onTouchEnd: this.handleTouchEnd }, h("div", { key: 'f8bb4ca24600a728f81e4247ef94641794ad84e3', class: "dso-date__dialog-content", onKeyDown: this.handleEscKey }, h("div", { key: '1582c6e4e4d89c4339f791c43e3fc01e18f03989', class: "dso-date__vhidden dso-date__instructions", "aria-live": "polite" }, this.localization.keyboardInstruction), h("div", { key: '3158d79a673e502aaa701fc41a2a15dd6ba5dc4b', class: "dso-date__mobile", onFocusin: this.disableActiveFocus }, h("label", { key: 'fcc075c9782196ec11a77f5d6aa703b8e48cea78', class: "dso-date__mobile-heading" }, this.localization.calendarHeading), h("button", { key: 'bee7a83296c5f1f3bfe498c0392f41bebb9fd27d', class: "dso-date__close", ref: (element) => (this.firstFocusableElement = element), onKeyDown: this.handleFirstFocusableKeydown, onClick: () => this.hide(), type: "button" }, h("dso-icon", { key: '3f66fe3d47a25baea3d7c148b1f5bec301f2bc29', icon: "times" }), h("span", { key: 'c5d4618409573374228a7e4489cdbfe1c66fdd7c', class: "dso-date__vhidden" }, this.localization.closeLabel))), h("div", { key: 'd9ba961084fb524b7f94139ce2a9857e9f7e1b0d', class: "dso-date__header", onFocusin: this.disableActiveFocus }, h("div", { key: '37d0dbcc0d777aafd31866d81dd758372585e908' }, h("h2", { key: 'de0e154dc96dc4e5cb3bcd2e588201a6cc5c9259', id: this.dialogLabelId, class: "dso-date__vhidden", "aria-live": "polite" }, this.localization.monthNames[focusedMonth], " ", this.focusedDay.getFullYear()), h("label", { key: 'cd0ffce7c78da9bf2d49bdca4d0394341608e249', htmlFor: this.monthSelectId, class: "dso-date__vhidden" }, this.localization.monthSelectLabel), h("div", { key: '48230fd3e09c932282bbb4990eda095cb95fce06', class: "dso-date__select" }, h("select", { key: 'f00134b32f100aefd5c61a4de98e221ed09137a2', id: this.monthSelectId, class: "dso-date__select--month", ref: (element) => (this.monthSelectNode = element), onChange: this.handleMonthSelect }, monthRange(this.localization, selectedYear, minDate, maxDate).map((month) => {
             const index = this.localization.monthNames.indexOf(month);
             return (h("option", { key: month, value: index, selected: index === focusedMonth }, month));
-        })), h("div", { key: '55a1a117e095115fc80403ca836df2e69951f745', class: "dso-date__select-label", "aria-hidden": "true" }, h("span", { key: 'd18823683d95dae481d4da151cd45637918c6e46' }, this.localization.monthNamesShort[focusedMonth]), h("dso-icon", { key: '087bdd2d44ec99c7ded483fe930e166f91ccd0b4', icon: "chevron-down" }))), h("label", { key: 'f96ca586396432132d9482cbfac0a8896cf8c46d', htmlFor: this.yearSelectId, class: "dso-date__vhidden" }, this.localization.yearSelectLabel), h("div", { key: 'ea7f1f0e42bf3344dab30e1a9aa9eff497ca11b5', class: "dso-date__select" }, h("select", { key: 'ab06d22ec2edd4b1d4828b47d4d495932ffd8e14', id: this.yearSelectId, class: "dso-date__select--year", onChange: this.handleYearSelect }, range(minYear, maxYear).map((year) => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: '094f3bab580202d91c94658a5084812547c44017', class: "dso-date__select-label", "aria-hidden": "true" }, h("span", { key: '1e4eabb3b6a4a546a79c43f91e18f8abffe9cf51' }, this.focusedDay.getFullYear()), h("dso-icon", { key: 'ecc4a276f2dd83053cb3759eda3a56bd4161f265', icon: "chevron-down" })))), h("div", { key: 'bbc9b3fad3a82919a006fd78befe7c88140ac97e', class: "dso-date__nav" }, h("button", { key: 'f8d45217ff383c4e140fc34e083fa163908510bb', class: "dso-date__prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, type: "button" }, h("dso-icon", { key: 'f4a8cee55b8c3c8d5fa4db365e3a88137bc2ab3e', icon: "chevron-left" }), h("span", { key: '2f860a03cda77d7c9621906eb2ebb218635ef4cc', class: "dso-date__vhidden" }, this.localization.prevMonthLabel)), h("button", { key: '2222d594e39d8e7f39400777dc43a00d35f002a5', class: "dso-date__next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, type: "button" }, h("dso-icon", { key: '080cf2578b603e2c50e6bf4a50c3f1b4f9189db1', icon: "chevron-right" }), h("span", { key: 'b8388d0ccbd1a04a27737f6948d8bb6013b0322f', class: "dso-date__vhidden" }, this.localization.nextMonthLabel)))), h(DatePickerLegacyMonth, { key: 'b9043d6761d0dbe9ce13ba0e4d26f646e0b2ffa5', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, localization: this.localization, firstDayOfWeek: this.firstDayOfWeek, focusedDayRef: this.processFocusedDayNode, min: minDate, max: maxDate }))))));
+        })), h("div", { key: 'a1670f7170408e13a577b9bb65ce222e02341af6', class: "dso-date__select-label", "aria-hidden": "true" }, h("span", { key: 'c0878373562b07a3c4860c766219da9289734fd3' }, this.localization.monthNamesShort[focusedMonth]), h("dso-icon", { key: '64b610f732f03334432be7ccdc60fa634b83b5b1', icon: "chevron-down" }))), h("label", { key: 'bb21bbcb63a45b503d26f9c50fa0ab987a7d7081', htmlFor: this.yearSelectId, class: "dso-date__vhidden" }, this.localization.yearSelectLabel), h("div", { key: '9a2ecf4ed6c4396a15ccadd40f2c04d9bf60dcbc', class: "dso-date__select" }, h("select", { key: 'a1a935ba195eca516b0a94e129ed320c64dd43ef', id: this.yearSelectId, class: "dso-date__select--year", onChange: this.handleYearSelect }, range(minYear, maxYear).map((year) => (h("option", { key: year, selected: year === focusedYear }, year)))), h("div", { key: 'b16f15541e3637b65b39dd0b8e871710e36e59bb', class: "dso-date__select-label", "aria-hidden": "true" }, h("span", { key: '64a6a5a00cbcf3ee9268c478cf2c1ff2d40e0abe' }, this.focusedDay.getFullYear()), h("dso-icon", { key: 'c0744674bcbba803aeaeca6ac1d684a1e7d3894a', icon: "chevron-down" })))), h("div", { key: '433d90659d6521b41a8cccd7683fad3da0bd4b2a', class: "dso-date__nav" }, h("button", { key: 'b40b6fd0c99e18e9f033cf1d41127194404408a1', class: "dso-date__prev", onClick: this.handlePreviousMonthClick, disabled: prevMonthDisabled, type: "button" }, h("dso-icon", { key: 'e658b36996f0d2e3d9c164f746b66220a75dcbbf', icon: "chevron-left" }), h("span", { key: '499a5213ff977b13bd36ff4e91d83730a13ab51d', class: "dso-date__vhidden" }, this.localization.prevMonthLabel)), h("button", { key: 'dcd28b6b36bfbf16de2fe529e5dbf4e65920c66b', class: "dso-date__next", onClick: this.handleNextMonthClick, disabled: nextMonthDisabled, type: "button" }, h("dso-icon", { key: '034b916fa47349e82bdf2a95c9dab465784f1499', icon: "chevron-right" }), h("span", { key: '184cef66312cdcea2a50d0dcc218a55963577398', class: "dso-date__vhidden" }, this.localization.nextMonthLabel)))), h(DatePickerLegacyMonth, { key: '254d598e4ed0ca17332abef195292828262712c7', selectedDate: valueAsDate, focusedDate: this.focusedDay, onDateSelect: this.handleDaySelect, onKeyboardNavigation: this.handleKeyboardNavigation, labelledById: this.dialogLabelId, localization: this.localization, firstDayOfWeek: this.firstDayOfWeek, focusedDayRef: this.processFocusedDayNode, min: minDate, max: maxDate }))))));
     }
     get element() { return getElement(this); }
 };

package/dist/esm/dso-date-picker.entry.js

@@ -147,7 +147,7 @@ const DsoDatePicker = class {
     }
     render() {
         var _a;
-        return (h("input", { key: 'a3e6335fedd3f1934ae485f331130c4975a7c009', type: "date", id: this.identifier, class: "dso-date__input", value: parseToValueFormat(this.value), name: this.name, min: parseToValueFormat(this.min), max: parseToValueFormat(this.max), disabled: this.disabled || undefined, required: this.required || undefined, "aria-autocomplete": "none", "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": this.describedBy, autoComplete: "off", autofocus: this.dsoAutofocus || undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, onChange: this.handleInputChange }));
+        return (h("input", { key: 'f2fe8194c48bed2392736327c79db4420da4b14a', type: "date", id: this.identifier, class: "dso-date__input", value: parseToValueFormat(this.value), name: this.name, min: parseToValueFormat(this.min), max: parseToValueFormat(this.max), disabled: this.disabled || undefined, required: this.required || undefined, "aria-autocomplete": "none", "aria-invalid": (_a = this.invalid) === null || _a === void 0 ? void 0 : _a.toString(), "aria-describedby": this.describedBy, autoComplete: "off", autofocus: this.dsoAutofocus || undefined, onBlur: this.handleBlur, onFocus: this.handleFocus, onKeyUp: this.handleKeyUp, onKeyDown: this.handleKeyDown, onChange: this.handleInputChange }));
     }
     get element() { return getElement(this); }
 };

package/dist/esm/dso-document-card.entry.js

@@ -27,7 +27,7 @@ const DocumentCard = class {
         return this.host.querySelector("[slot='meta']");
     }
     render() {
-        return (h("div", { key: 'a56e8db95294c83dfa5b558e47d72ee36c22c523', class: "dso-document-card-container" }, h("div", { key: '14fce780fceba683eb4e30cc6f060f7c7ff1dbce', class: "dso-document-card-heading" }, h("a", { key: '3423b19ac876cdd90135094d8d0b1430c4a53d0e', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { key: '611617cd46d12105826465a46c3eb6ac41cb8dc4', class: "icon-container" }, h("dso-icon", { key: '84e9dc5793d9eb51b7748268df8c5b87cb27b24e', icon: "chevron-right" }), h("slot", { key: 'fdbb9ef5d508c67d7432e4aa6dd57d17f4bc730d', name: "heading" }))), this.metaSlottedElement !== null && h("slot", { key: '054d80082247a4eb97136f8e6d199229cb75edf6', name: "meta" })), h("div", { key: 'b7099c9ceaacf8691392fab1cfce9684b83babe2', class: "dso-document-card-type" }, h("slot", { key: '1e7a73fe9efa71d7362ae366ee1f4823b55720d6', name: "type" })), h("div", { key: '34309e92ede40ea37abfe3fc09d7e5270c56c7e9', class: "dso-document-card-status" }, h("slot", { key: 'c708100dfa943e139d3d17e5bd02dcffd02f185e', name: "status" }))));
+        return (h("div", { key: 'bbd724d0e936c3f7adb87aff14b8e30b85c7b0c9', class: "dso-document-card-container" }, h("div", { key: '4e8689ef58c31d4f490f105afe64b17c4f764cca', class: "dso-document-card-heading" }, h("a", { key: 'f8aa9dbc91f3307d6d7042599fab6d7d9ee110c7', href: this.href, class: "heading-anchor", onClick: (e) => this.clickEventHandler(e) }, h("span", { key: '35815a6a48d9ff6666197b0facbf30b4eef242cf', class: "icon-container" }, h("dso-icon", { key: '80a301e406813a4874aa64a565ef9cef7663a494', icon: "chevron-right" }), h("slot", { key: '79bb4598f8e89d9ac047347910c3e0dae3877fbf', name: "heading" }))), this.metaSlottedElement !== null && h("slot", { key: '94090520fef0be8297eeb50848e67ef2b3440367', name: "meta" })), h("div", { key: '5499a344d6a3b3e486df41e789cc1eb20634cbd2', class: "dso-document-card-type" }, h("slot", { key: '0f535e6c5b5574e9844e5ccb6a3fcb0f4fb15770', name: "type" })), h("div", { key: 'da465fb5a9994e922a87954beebfc95b64b04d06', class: "dso-document-card-status" }, h("slot", { key: 'eac2432d9123f912c7d37270c570e6dc23ca147b', name: "status" }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-dropdown-menu.entry.js

@@ -176,7 +176,7 @@ const DropdownMenu = class {
         (_a = tabbables[nextIndex]) === null || _a === void 0 ? void 0 : _a.focus();
     }
     render() {
-        return (h(Host, { key: '67dc063007a13557b2f87c335532e65790bc05fb', onFocusout: this.focusOutListener }, h("slot", { key: '1609e638697b18c00ef4607ab8f08e77b8ea1c9e', name: "toggle" }), h("div", { key: 'fc1aeee0f0c9ea89c083d325e6c05acb42a23af3', popover: "manual", ref: (element) => (this.popoverElement = element) }, h("slot", { key: '4d6c1bc84e3a3fa44274b3af63e630537914c3e9' }))));
+        return (h(Host, { key: 'bf5fb4088e7540a4fb7958e3653123515b665a8b', onFocusout: this.focusOutListener }, h("slot", { key: '38a83ede094335f426c774c8de7f6f5e1eb81e8b', name: "toggle" }), h("div", { key: '52845806c297a13d7003c286c113fc5680858d07', popover: "manual", ref: (element) => (this.popoverElement = element) }, h("slot", { key: 'cad8348ae2046f3856a8ce659f464adc2fef7e7b' }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/dso-header.entry.js

@@ -155,7 +155,7 @@ const Header = class {
         }
     }
     render() {
-        return (h(Host, { key: 'f72d9f1acbd5b8fd0ba398cf43cc22f1ee07c899', "is-compact": this.isCompact }, h("div", { key: '6c66bf734a3f88ffdc357b6dcdc6226b7c24f2cc', class: "dso-header" }, h("div", { key: '363201a9db9097cf5125b98881e4833015f17abf', class: "logo-container" }, h("slot", { key: 'f9668b6900acbb14140f626377c70a030b03c969', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
+        return (h(Host, { key: 'b507d3eb3598597f7722fca9a9163013e0294291', "is-compact": this.isCompact }, h("div", { key: 'fb47a63d706442a5b140388c5e330de5f95dc476', class: "dso-header" }, h("div", { key: 'b9351cbe605c7357af4da5d3682a87252c3f950e', class: "logo-container" }, h("slot", { key: '89aac2265810ea41b491483fccef79ee7eb22372', name: "logo" })), this.isCompact ? this.renderCompact() : this.renderNormal())));
     }
     renderCompact() {
         return ((this.mainMenu.length > 0 || this.userHomeUrl || this.authStatus !== "none") && (h("div", { class: "dropdown" }, h("dso-dropdown-menu", { "dropdown-align": "right", dropdownOptionsOffset: this.dropdownOptionsOffset, ref: (element) => (this.dropdownElement = element) }, h("button", { type: "button", slot: "toggle" }, h("span", null, this.text("menu")), h("dso-icon", { icon: "chevron-down" })), h("div", { class: "dso-dropdown-options" }, h("ul", null, this.mainMenu.map((menuItem) => (h(MenuItem, { item: menuItem, onClick: (e) => this.clickHandler(e, "menuItem", { menuItem }), key: menuItem.label }))), this.userHomeUrl && (h("li", null, h("a", { href: this.userHomeUrl, onClick: (e) => this.clickHandler(e, "userHome", { url: this.userHomeUrl }) }, this.text("userHome")))), this.userProfileUrl && this.userProfileName && this.authStatus === "loggedIn" && (h("li", null, h("a", { href: this.userProfileUrl, onClick: (e) => this.clickHandler(e, "profile", { url: this.userProfileUrl }) }, this.userProfileName, h("span", { class: "profile-label" }, " - Mijn profiel")))), this.authStatus === "loggedOut" && (h("li", null, this.loginUrl ? (h("a", { href: this.loginUrl, onClick: (e) => this.clickHandler(e, "login", { url: this.loginUrl }) }, this.text("login"))) : (h("button", { type: "button", onClick: (e) => this.clickHandler(e, "login") }, this.text("login"))))), this.authStatus === "loggedIn" && (h("li", null, this.logoutUrl ? (h("a", { href: this.logoutUrl, onClick: (e) => this.clickHandler(e, "logout", { url: this.logoutUrl }) }, this.text("logout"))) : (h("button", { type: "button", onClick: (e) => this.clickHandler(e, "logout") }, this.text("logout"))))), this.showHelp && (h("li", null, this.helpUrl ? (h("a", { href: this.helpUrl, class: "dso-tertiary", onClick: (e) => this.clickHandler(e, "help", { url: this.helpUrl }) }, h("span", null, this.text("help")), h("dso-icon", { icon: "help" }))) : (h("button", { type: "button", class: "dso-tertiary", onClick: (e) => this.clickHandler(e, "help") }, h("span", null, this.text("help")), h("dso-icon", { icon: "help" })))))))))));

package/dist/esm/dso-highlight-box.entry.js

@@ -9,7 +9,7 @@ const HighlightBox = class {
     render() {
         var _a;
         const hasCounter = this.step || !!this.element.querySelector("[slot=icon]");
-        return (h(Host, { key: 'a17c902d2d0218ca9535995de35277932314703a', "has-counter": hasCounter }, hasCounter && h("div", { key: '51784bd453e91291a9b6f89f63a53860bd0015dd', class: "dso-step-counter" }, (_a = this.step) !== null && _a !== void 0 ? _a : h("slot", { key: '48e88b38b2ea9e9b696db3830bb489ffcf129ff6', name: "icon" })), h("slot", { key: 'cd1d9e7ab981c5c155c624dc604a58b6b5a1ca65' })));
+        return (h(Host, { key: '92f1193d1be8513927d98a516266dc58bdf90595', "has-counter": hasCounter }, hasCounter && h("div", { key: '6f74f4dc98f935ca8ee0f95530a3679c94250c43', class: "dso-step-counter" }, (_a = this.step) !== null && _a !== void 0 ? _a : h("slot", { key: 'f9e0dd343429a6f8c55e693d987eeec1e2c28c1c', name: "icon" })), h("slot", { key: '867c1fcafd7864e0d631180e25a7c181a155a042' })));
     }
     get element() { return getElement(this); }
 };

package/dist/esm/dso-history-item.entry.js

@@ -0,0 +1,52 @@
+import { r as registerInstance, c as createEvent, f as forceUpdate, h, F as Fragment, g as getElement } from './index-DxWmN7gh.js';
+import { i as isModifiedEvent } from './is-modified-event-Hgv-pDpy.js';
+
+const historyItemCss = ":host{border-block-end:1px solid #e5e5e5;display:flex;gap:8px;inline-size:100%;padding-block:16px}:host:has(.history-item-title a:is(:hover,:focus-visible)){background-color:#f2f2f2}*,*::after,*::before{box-sizing:border-box}:host([type=tijdelijk-regelingdeel]) .history-item-status-message{color:#8b4a6a}:host([type=waarschuwing]) .history-item-status-message{color:#b62f41}.history-item-date,.history-item-content{display:flex;flex-direction:column}.history-item-date{flex:0 0 90px}.history-item-status-message,.history-item-warning{display:flex}.history-item-status-message dso-icon,.history-item-warning dso-icon{flex-shrink:0;margin-inline-end:8px}.history-item-warning{color:#b62f41}.history-item-title,.history-item-explanation,.history-item-warning{margin-block-start:8px;margin-inline-start:32px}.title-anchor{color:#39870c;font-weight:600;text-decoration:none}.title-anchor:hover{color:#39870c;text-decoration:underline}.title-anchor:visited{color:#39870c}";
+
+const HistoryItem = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.dsoClick = createEvent(this, "dsoClick", 3);
+        this.typeIcons = {
+            ontwerp: "pencil",
+            "in-werking": "document",
+            "tijdelijk-regelingdeel": "document",
+            waarschuwing: "status-warning-inline",
+            besluit: "hammer",
+        };
+    }
+    connectedCallback() {
+        this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));
+        this.mutationObserver.observe(this.host, { attributes: true, childList: true });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+        delete this.mutationObserver;
+    }
+    clickEventHandler(e) {
+        if (!(e.target instanceof HTMLElement) || !this.href) {
+            return;
+        }
+        return this.dsoClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });
+    }
+    get titleSlottedElement() {
+        return this.host.querySelector("[slot='title']");
+    }
+    get explanationSlottedElement() {
+        return this.host.querySelector("[slot='explanation']");
+    }
+    get warningSlottedElement() {
+        return this.host.querySelector("[slot='warning']");
+    }
+    render() {
+        return (h(Fragment, { key: '03b2a5c27abfebab61b6099131114398a2c4fdbd' }, h("div", { key: '102a2efbeaf63257c2927aa77c5a7fe3057c39be', class: "history-item-date" }, h("slot", { key: '4cf89b9e55c8b015de363190ca0939db382a46a3', name: "date" })), h("div", { key: '119142bfa00ef20b76c7aae1604d171d47d92a2d', class: "history-item-content" }, h("div", { key: '7d251c14c4a31842b5c0628eebb4483a5d6a4ab1', class: "history-item-status-message" }, h("dso-icon", { key: '9f9057cc900cc54649ee6c1a4f7075c5ef853d93', icon: this.typeIcons[this.type], "aria-hidden": "true" }), h("slot", { key: '813c6354f2b29d0a2605e74fde8b9e7ecb993a28', name: "status" })), this.titleSlottedElement !== null && this.href && (h("div", { key: '4b9e2a03c557ca302d745343276064503b16475b', class: "history-item-title" }, h("a", { key: '859217e78f2b0665bc58ddc12fc8a68634fe7fbe', href: this.href, class: "title-anchor", onClick: (e) => this.clickEventHandler(e) }, h("slot", { key: 'b2c820d4ca1424ab2850f04fd7d6967395a62ddc', name: "title" })))), this.explanationSlottedElement !== null && (h("div", { key: 'bb9acb8eac2cc3eae221a6ee9d5c93cccd8a9bfc', class: "history-item-explanation" }, h("slot", { key: 'a26746173f1c32cc3ef6a3d4a3517fbdaa4f58ae', name: "explanation" }))), this.warningSlottedElement !== null && (h("div", { key: '244f130873fc0dd937e115fffdfb3fa3c2c56dad', class: "history-item-warning" }, h("dso-icon", { key: '22309670f01412115df0faa265201fbf44afd271', icon: "status-warning-inline", role: "img", "aria-label": "Waarschuwing" }), h("slot", { key: '7dae3bbbad535d05726fd69d8830bfa9352846be', name: "warning" }))))));
+    }
+    get host() { return getElement(this); }
+};
+HistoryItem.style = historyItemCss;
+
+export { HistoryItem as dso_history_item };
+//# sourceMappingURL=dso-history-item.entry.js.map
+
+//# sourceMappingURL=dso-history-item.entry.js.map

package/dist/esm/dso-history-item.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dso-history-item.entry.js","sources":["src/components/history-item/history-item.scss?tag=dso-history-item&encapsulation=shadow","src/components/history-item/history-item.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"history-item.variables\" as history-item-variables;\r\n\r\n:host {\r\n  border-block-end: 1px solid colors.$grijs-10;\r\n  display: flex;\r\n  gap: units.$u1;\r\n  inline-size: 100%;\r\n  padding-block: units.$u2;\r\n\r\n  &:has(.history-item-title a:is(:hover, :focus-visible)) {\r\n    background-color: history-item-variables.$background-color-hover;\r\n  }\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host([type=\"tijdelijk-regelingdeel\"]) {\r\n  .history-item-status-message {\r\n    color: history-item-variables.$tijdelijke-regeldingdeel-color;\r\n  }\r\n}\r\n\r\n:host([type=\"waarschuwing\"]) {\r\n  .history-item-status-message {\r\n    color: history-item-variables.$waarschuwing-color;\r\n  }\r\n}\r\n\r\n.history-item-date,\r\n.history-item-content {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.history-item-date {\r\n  flex: 0 0 90px;\r\n}\r\n\r\n.history-item-status-message,\r\n.history-item-warning {\r\n  display: flex;\r\n\r\n  dso-icon {\r\n    flex-shrink: 0;\r\n    margin-inline-end: units.$u1;\r\n  }\r\n}\r\n\r\n.history-item-warning {\r\n  color: history-item-variables.$waarschuwing-color;\r\n}\r\n\r\n.history-item-title,\r\n.history-item-explanation,\r\n.history-item-warning {\r\n  margin-block-start: units.$u1;\r\n  margin-inline-start: units.$u4;\r\n}\r\n\r\n.title-anchor {\r\n  color: history-item-variables.$title-anchor-color;\r\n  font-weight: 600;\r\n  text-decoration: none;\r\n\r\n  &:hover {\r\n    color: history-item-variables.$title-anchor-color;\r\n    text-decoration: underline;\r\n  }\r\n\r\n  &:visited {\r\n    color: history-item-variables.$title-anchor-color;\r\n  }\r\n}\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Element,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  Prop,\r\n  forceUpdate,\r\n  h,\r\n} from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { HistoryItemClickEvent, HistoryItemType } from \"./history-item.interfaces\";\r\n\r\n/**\r\n * @slot date - The slot to place a string that holds a date in.\r\n * @slot status - The slot to place the status message in.\r\n * @slot title - An optional slot to place the title in. When used, the property `href` must be set.\r\n * @slot explanation - An optional slot to place explanation in.\r\n * @slot warning - An optional slot to place a warning in.\r\n */\r\n@Component({\r\n  tag: \"dso-history-item\",\r\n  styleUrl: \"history-item.scss\",\r\n  shadow: true,\r\n})\r\nexport class HistoryItem implements ComponentInterface {\r\n  private typeIcons: Record<HistoryItemType, string> = {\r\n    ontwerp: \"pencil\",\r\n    \"in-werking\": \"document\",\r\n    \"tijdelijk-regelingdeel\": \"document\",\r\n    waarschuwing: \"status-warning-inline\",\r\n    besluit: \"hammer\",\r\n  };\r\n\r\n  @Element()\r\n  host!: HTMLDsoHistoryItemElement;\r\n\r\n  /**\r\n   * The type of History Item\r\n   */\r\n  @Prop({ reflect: true })\r\n  type!: HistoryItemType;\r\n\r\n  /**\r\n   * The optional URL to which the History Item title links. Needs to be provided when slot `title` is used.\r\n   */\r\n  @Prop({ reflect: true })\r\n  href?: string;\r\n\r\n  /**\r\n   * Emitted when the History Item title is clicked.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoClick!: EventEmitter<HistoryItemClickEvent>;\r\n\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  connectedCallback(): void {\r\n    this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, { attributes: true, childList: true });\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n\r\n    delete this.mutationObserver;\r\n  }\r\n  private clickEventHandler(e: MouseEvent) {\r\n    if (!(e.target instanceof HTMLElement) || !this.href) {\r\n      return;\r\n    }\r\n\r\n    return this.dsoClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n  }\r\n\r\n  get titleSlottedElement() {\r\n    return this.host.querySelector(\"[slot='title']\");\r\n  }\r\n\r\n  get explanationSlottedElement() {\r\n    return this.host.querySelector(\"[slot='explanation']\");\r\n  }\r\n\r\n  get warningSlottedElement() {\r\n    return this.host.querySelector(\"[slot='warning']\");\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Fragment>\r\n        <div class=\"history-item-date\">\r\n          <slot name=\"date\"></slot>\r\n        </div>\r\n        <div class=\"history-item-content\">\r\n          <div class=\"history-item-status-message\">\r\n            <dso-icon icon={this.typeIcons[this.type]} aria-hidden=\"true\"></dso-icon>\r\n            <slot name=\"status\"></slot>\r\n          </div>\r\n          {this.titleSlottedElement !== null && this.href && (\r\n            <div class=\"history-item-title\">\r\n              <a href={this.href} class=\"title-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n                <slot name=\"title\"></slot>\r\n              </a>\r\n            </div>\r\n          )}\r\n          {this.explanationSlottedElement !== null && (\r\n            <div class=\"history-item-explanation\">\r\n              <slot name=\"explanation\"></slot>\r\n            </div>\r\n          )}\r\n          {this.warningSlottedElement !== null && (\r\n            <div class=\"history-item-warning\">\r\n              <dso-icon icon=\"status-warning-inline\" role=\"img\" aria-label=\"Waarschuwing\"></dso-icon>\r\n              <slot name=\"warning\"></slot>\r\n            </div>\r\n          )}\r\n        </div>\r\n      </Fragment>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;;AAAA,MAAM,cAAc,GAAG,w8BAAw8B;;MC4Bl9B,WAAW,GAAA,MAAA;AALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;QAMU,IAAA,CAAA,SAAS,GAAoC;AACnD,YAAA,OAAO,EAAE,QAAQ;AACjB,YAAA,YAAY,EAAE,UAAU;AACxB,YAAA,wBAAwB,EAAE,UAAU;AACpC,YAAA,YAAY,EAAE,uBAAuB;AACrC,YAAA,OAAO,EAAE,QAAQ;SAClB;AAyFF;IAhEC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAE1E,QAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;;IAGjF,oBAAoB,GAAA;;QAClB,CAAA,EAAA,GAAA,IAAI,CAAC,gBAAgB,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,UAAU,EAAE;QAEnC,OAAO,IAAI,CAAC,gBAAgB;;AAEtB,IAAA,iBAAiB,CAAC,CAAa,EAAA;AACrC,QAAA,IAAI,EAAE,CAAC,CAAC,MAAM,YAAY,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACpD;;AAGF,QAAA,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC;;AAGtF,IAAA,IAAI,mBAAmB,GAAA;QACrB,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC;;AAGlD,IAAA,IAAI,yBAAyB,GAAA;QAC3B,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,sBAAsB,CAAC;;AAGxD,IAAA,IAAI,qBAAqB,GAAA;QACvB,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,kBAAkB,CAAC;;IAGpD,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACP,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,MAAM,EAAA,CAAQ,CACrB,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAA,EAC/B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,6BAA6B,EAAA,EACtC,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,EAAc,aAAA,EAAA,MAAM,EAAY,CAAA,EACzE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,QAAQ,EAAA,CAAQ,CACvB,EACL,IAAI,CAAC,mBAAmB,KAAK,IAAI,IAAI,IAAI,CAAC,IAAI,KAC7C,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,EAC7B,CAAG,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,cAAc,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAA,EAChF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,OAAO,EAAQ,CAAA,CACxB,CACA,CACP,EACA,IAAI,CAAC,yBAAyB,KAAK,IAAI,KACtC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,0BAA0B,EAAA,EACnC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,aAAa,EAAA,CAAQ,CAC5B,CACP,EACA,IAAI,CAAC,qBAAqB,KAAK,IAAI,KAClC,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,sBAAsB,EAAA,EAC/B,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,uBAAuB,EAAC,IAAI,EAAC,KAAK,EAAY,YAAA,EAAA,cAAc,EAAY,CAAA,EACvF,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,CACP,CACG,CACG;;;;;;;;"}

package/dist/esm/dso-icon-button.entry.js

@@ -0,0 +1,98 @@
+import { h, r as registerInstance, c as createEvent } from './index-DxWmN7gh.js';
+import { p as positionTooltip } from './position-tooltip.function-CozxeEX7.js';
+import { c as clsx } from './clsx-ChV9xqsO.js';
+import './floating-ui.dom-gdsca1fx.js';
+
+const Tooltip = ({ visible, onAfterHidden, tipElementRef, tipArrowElementRef }, children) => (h("div", { popover: "manual", id: "tooltip", class: clsx(["dso-tooltip", { visible }]), ref: tipElementRef, onTransitionEnd: (e) => {
+        e.stopPropagation();
+        if (e.propertyName === "opacity" && !visible) {
+            onAfterHidden();
+        }
+    } },
+    h("span", { class: "tooltip-arrow", ref: tipArrowElementRef }),
+    h("div", { class: "tooltip-inner" }, children)));
+
+const iconButtonCss = ".dso-tooltip {\n  --link-color: currentColor;\n  --link-hover-color: currentColor;\n  --link-visited-color: currentColor;\n  --_dso-icon-button-tertiary-color: #fff;\n  background-color: #666;\n  border-color: #666;\n  color: #fff;\n}\n.dso-tooltip a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#download-wit\"));\n}\n.dso-tooltip a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#external-link-wit\"));\n}\n.dso-tooltip a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"tel:\"], [href^=\"tel:\"]:hover, [href^=\"tel:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#call-wit\"));\n}\n.dso-tooltip a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"mailto:\"], [href^=\"mailto:\"]:hover, [href^=\"mailto:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#email-wit\"));\n}\n.dso-tooltip {\n  border-radius: 4px;\n  overflow: unset;\n  margin: 0;\n  border: 0;\n  padding: 0;\n  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity 0.15s;\n}\n.dso-tooltip.visible {\n  opacity: 1;\n  visibility: visible;\n}\n.dso-tooltip .tooltip-inner {\n  --link-color: currentColor;\n  --link-hover-color: currentColor;\n  --link-visited-color: currentColor;\n  --_dso-icon-button-tertiary-color: #fff;\n  background-color: #666;\n  border-color: #666;\n  color: #fff;\n}\n.dso-tooltip .tooltip-inner a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#download-wit\"));\n}\n.dso-tooltip .tooltip-inner a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#external-link-wit\"));\n}\n.dso-tooltip .tooltip-inner a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"tel:\"], [href^=\"tel:\"]:hover, [href^=\"tel:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#call-wit\"));\n}\n.dso-tooltip .tooltip-inner a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"mailto:\"], [href^=\"mailto:\"]:hover, [href^=\"mailto:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#email-wit\"));\n}\n.dso-tooltip .tooltip-inner {\n  font-family: Asap, sans-serif;\n  font-size: 1rem;\n  font-weight: normal;\n  padding-block: 0;\n  padding-inline: 8px;\n  border-radius: 4px;\n  line-height: 1.5;\n  max-inline-size: 320px;\n}\n.dso-tooltip .tooltip-arrow {\n  --link-color: currentColor;\n  --link-hover-color: currentColor;\n  --link-visited-color: currentColor;\n  --_dso-icon-button-tertiary-color: #fff;\n  background-color: #666;\n  border-color: #666;\n  color: #fff;\n}\n.dso-tooltip .tooltip-arrow a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.download, .download:hover, .download:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#download-wit\"));\n}\n.dso-tooltip .tooltip-arrow a:not(.dso-primary, .dso-secondary, .dso-tertiary):is(.extern, .extern:hover, .extern:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#external-link-wit\"));\n}\n.dso-tooltip .tooltip-arrow a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"tel:\"], [href^=\"tel:\"]:hover, [href^=\"tel:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#call-wit\"));\n}\n.dso-tooltip .tooltip-arrow a:not(.dso-primary, .dso-secondary, .dso-tertiary):is([href^=\"mailto:\"], [href^=\"mailto:\"]:hover, [href^=\"mailto:\"]:focus-visible) {\n  background-image: var(--_dso-di-background-image, url(\"./di.svg#email-wit\"));\n}\n.dso-tooltip .tooltip-arrow {\n  position: absolute;\n  border-start-start-radius: 4px;\n  block-size: 8px;\n  inline-size: 8px;\n  pointer-events: none;\n  z-index: -1;\n}\n\n:host {\n  display: inline-block;\n  line-height: 1;\n}\n\n*,\n*::after,\n*::before {\n  box-sizing: border-box;\n}\n\n.dso-secondary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-secondary:focus, .dso-secondary:focus-visible {\n  outline-offset: 2px;\n}\n.dso-secondary:active {\n  outline: 0;\n}\n.dso-secondary.extern::after, .dso-secondary.download::after {\n  content: \"\";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\n.dso-secondary {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\n.dso-secondary {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\n.dso-secondary:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\n.dso-secondary:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\n.dso-secondary[disabled], .dso-secondary[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\n.dso-secondary.dso-small {\n  line-height: 1rem;\n}\n.dso-secondary.dso-small dso-icon,\n.dso-secondary.dso-small svg.di, .dso-secondary.dso-small.extern::after, .dso-secondary.dso-small.download::after, .dso-secondary.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\n.dso-secondary.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary.dso-extra-small {\n  line-height: 1rem;\n}\n.dso-secondary.dso-extra-small dso-icon,\n.dso-secondary.dso-extra-small svg.di, .dso-secondary.dso-extra-small.extern::after, .dso-secondary.dso-extra-small.download::after, .dso-secondary.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\n.dso-secondary.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary.dso-extra-small {\n  padding-block: 9px;\n}\n.dso-secondary dso-icon:has(+ span:not(.sr-only)),\n.dso-secondary svg.di:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\n.dso-secondary span:not(.sr-only) + dso-icon,\n.dso-secondary span:not(.sr-only) + svg.di {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\n.dso-secondary dso-icon + span:not(.sr-only),\n.dso-secondary svg.di + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\n.dso-secondary.dso-spinner-left[disabled], .dso-secondary.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\n.dso-secondary.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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-secondary.dso-spinner-left:not([disabled]):hover::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: %23fff; 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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-secondary.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary.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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-secondary.dso-spinner-right:not([disabled]):hover::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: %23fff; 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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-secondary.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-secondary {\n  padding-inline: calc(8px - 1px);\n  padding-block: calc(8px - 1px);\n}\n\n.dso-tertiary {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\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.extern::after, .dso-tertiary.download::after {\n  content: \"\";\n  display: inline-block;\n  margin-inline-start: 8px;\n}\n.dso-tertiary {\n  padding-inline: 0;\n  padding-block: 0;\n  color: var(--_dso-icon-button-tertiary-color, #39870c);\n  background-color: transparent;\n  border: 0;\n}\n.dso-tertiary:not([disabled]):hover {\n  color: var(--_dso-icon-button-tertiary-hover-color, var(--_dso-icon-button-tertiary-color, #275937));\n}\n.dso-tertiary:not([disabled]):active {\n  color: var(--_dso-icon-button-tertiary-active-color, var(--_dso-icon-button-tertiary-color, #275937));\n}\n.dso-tertiary[disabled] {\n  color: var(--_dso-icon-button-tertiary-disabled-color, var(--_dso-icon-button-tertiary-color, #afcf9d));\n}\n\n.dso-map {\n  display: inline-block;\n  font-size: 1em;\n  font-weight: 500;\n  margin-block-end: 0;\n  text-decoration: none;\n  touch-action: manipulation;\n  text-align: start;\n  user-select: none;\n  vertical-align: middle;\n}\n.dso-map:focus, .dso-map:focus-visible {\n  outline-offset: 2px;\n}\n.dso-map:active {\n  outline: 0;\n}\n.dso-map {\n  background-color: var(--_dso-button-secondary-background-color, #fff);\n  border-color: var(--_dso-button-secondary-border-color, #39870c);\n  color: var(--_dso-button-secondary-color, #39870c);\n}\n.dso-map {\n  border-width: 1px;\n  border-style: solid;\n  border-radius: 4px;\n  line-height: 1.5;\n  min-inline-size: 56px;\n  padding-block: 11px;\n  padding-inline: 15px;\n}\n.dso-map:hover {\n  background-color: var(--_dso-button-secondary-hover-background-color, #d7e7ce);\n  border-color: var(--_dso-button-secondary-hover-border-color, #275937);\n  color: var(--_dso-button-secondary-hover-color, #275937);\n}\n.dso-map:active {\n  background-color: var(--_dso-button-secondary-active-background-color, #275937);\n  border-color: var(--_dso-button-secondary-active-border-color, #275937);\n  color: var(--_dso-button-secondary-active-color, #fff);\n}\n.dso-map[disabled], .dso-map[disabled]:hover {\n  background-color: var(--_dso-button-secondary-disabled-background-color, #fff);\n  border-color: var(--_dso-button-secondary-disabled-border-color, #afcf9d);\n  color: var(--_dso-button-secondary-disabled-color, #afcf9d);\n}\n.dso-map.dso-small {\n  line-height: 1rem;\n}\n.dso-map.dso-small dso-icon,\n.dso-map.dso-small svg.di, .dso-map.dso-small.extern::after, .dso-map.dso-small.download::after, .dso-map.dso-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\n.dso-map.dso-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map.dso-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map.dso-extra-small {\n  line-height: 1rem;\n}\n.dso-map.dso-extra-small dso-icon,\n.dso-map.dso-extra-small svg.di, .dso-map.dso-extra-small.extern::after, .dso-map.dso-extra-small.download::after, .dso-map.dso-extra-small.dso-spinner::before {\n  margin-block-end: -4px;\n  margin-block-start: -4px;\n}\n.dso-map.dso-extra-small.dso-spinner-left::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map.dso-extra-small.dso-spinner-right::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map.dso-extra-small {\n  padding-block: 9px;\n}\n.dso-map dso-icon:has(+ span:not(.sr-only)),\n.dso-map svg.di:has(+ span:not(.sr-only)) {\n  margin-inline-start: -8px;\n}\n.dso-map span:not(.sr-only) + dso-icon,\n.dso-map span:not(.sr-only) + svg.di {\n  margin-inline-start: 8px;\n  margin-inline-end: -8px;\n}\n.dso-map dso-icon + span:not(.sr-only),\n.dso-map svg.di + span:not(.sr-only) {\n  margin-inline-start: 8px;\n}\n.dso-map.dso-spinner-left[disabled], .dso-map.dso-spinner-right[disabled] {\n  background-color: #fff;\n  border-color: #39870c;\n  color: #39870c;\n}\n.dso-map.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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-map.dso-spinner-left:not([disabled]):hover::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: %23fff; 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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-end: 8px;\n}\n.dso-map.dso-spinner-left:not([disabled]).dso-small:hover::before {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map.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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-map.dso-spinner-right:not([disabled]):hover::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: %23fff; 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  block-size: 24px;\n  vertical-align: top;\n  inline-size: 24px;\n  margin-inline-start: 8px;\n}\n.dso-map.dso-spinner-right:not([disabled]).dso-small:hover::after {\n  block-size: 16px;\n  inline-size: 16px;\n}\n.dso-map {\n  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);\n  border: 0;\n  font-weight: 600;\n  margin-inline-end: 16px;\n  padding-block: 8px;\n  padding-inline: 16px;\n  white-space: nowrap;\n}\n.dso-map:focus, .dso-map:focus-visible {\n  outline-offset: -1px;\n}\n.dso-map:has(span.sr-only):has(dso-icon, svg.di) {\n  padding: 8px;\n  min-inline-size: auto;\n  block-size: 40px;\n  inline-size: 40px;\n}\n.dso-map {\n  padding-inline: 8px;\n  padding-block: 8px;\n  border: 0;\n  margin-inline-end: 0;\n  box-shadow: var(--_dso-icon-button-map-box-shadow, 0 0 8px 0 rgba(0, 0, 0, 0.3));\n  border-radius: var(--_dso-icon-button-map-border-radius, 4px);\n}\n\n.icon-button {\n  min-inline-size: auto;\n  cursor: pointer;\n}\n.icon-button[disabled] {\n  cursor: default;\n}";
+
+const IconButton = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.dsoClick = createEvent(this, "dsoClick", 3);
+        /**
+         * The variant of the Icon Button.
+         */
+        this.variant = "secondary";
+        /**
+         * The placement of the tooltip on hover and focus of the Icon Button.
+         */
+        this.tooltipPlacement = "top";
+        /**
+         * To disable the Icon Button
+         */
+        this.disabled = false;
+        this.showTooltip = false;
+        this.lastClickTime = 0;
+        this.tooltipShowDelay = 500;
+        this.handleShowTooltip = () => {
+            if (this.disabled) {
+                return;
+            }
+            // Don't show the tooltip if the button is clicked within 500ms of the last click
+            if (Date.now() - this.lastClickTime < this.tooltipShowDelay) {
+                return;
+            }
+            if (this.tooltipTimeout) {
+                clearTimeout(this.tooltipTimeout);
+            }
+            this.tooltipTimeout = window.setTimeout(() => {
+                var _a;
+                this.showTooltip = true;
+                (_a = this.tooltipElRef) === null || _a === void 0 ? void 0 : _a.showPopover();
+                if (!this.cleanUp && this.buttonElRef && this.tooltipElRef && this.tipArrowElRef) {
+                    this.cleanUp = positionTooltip({
+                        referenceElement: this.buttonElRef,
+                        tipRef: this.tooltipElRef,
+                        tipArrowRef: this.tipArrowElRef,
+                        placementTip: this.tooltipPlacement,
+                        topPositionSmallViewPort: false,
+                        halfMainAxisOffset: false,
+                        forceVisible: true,
+                    });
+                }
+            }, this.tooltipShowDelay);
+        };
+        this.handleHideTooltip = () => {
+            var _a;
+            if (this.tooltipTimeout) {
+                clearTimeout(this.tooltipTimeout);
+            }
+            this.showTooltip = false;
+            (_a = this.tooltipElRef) === null || _a === void 0 ? void 0 : _a.hidePopover();
+            if (!this.showTooltip && this.cleanUp) {
+                this.cleanUp();
+                this.cleanUp = undefined;
+            }
+        };
+        this.handleClick = (e) => {
+            this.lastClickTime = Date.now();
+            this.handleHideTooltip();
+            this.dsoClick.emit({ originalEvent: e });
+        };
+    }
+    /**
+     * Focuses the button.
+     */
+    async setFocus() {
+        var _a;
+        (_a = this.buttonElRef) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+    render() {
+        return (h("button", { key: '8e39b350f929f7cee82d93375afa1daab5d9fb55', ref: (el) => (this.buttonElRef = el), type: "button", disabled: this.disabled, "aria-label": this.label, class: `icon-button dso-${this.variant}`, onMouseEnter: this.handleShowTooltip, onMouseLeave: this.handleHideTooltip, onFocus: this.handleShowTooltip, onBlur: this.handleHideTooltip, onClick: this.handleClick }, h("dso-icon", { key: '6e45b442c90b2b4e6eded5383346fdfc77591912', icon: this.icon }), h(Tooltip, { key: 'fb5a1b523d0a5306feb7615de420cf609cd6738a', visible: this.showTooltip, onAfterHidden: this.handleHideTooltip, tipElementRef: (element) => (this.tooltipElRef = element), tipArrowElementRef: (element) => (this.tipArrowElRef = element) }, this.label)));
+    }
+};
+IconButton.style = iconButtonCss;
+
+export { IconButton as dso_icon_button };
+//# sourceMappingURL=dso-icon-button.entry.js.map
+
+//# sourceMappingURL=dso-icon-button.entry.js.map