@dso-toolkit/core 81.1.0 → 83.0.0

package/dist/dso-toolkit/{p-c0bb872c.entry.js.map → p-3dfe5dde.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["annotationCss","AnnotationLocatie","constructor","hostRef","this","watcher","host","connectedCallback","watch","disconnectedCallback","unwatch","render","hasSymbool","h","AnnotationBody","key","symbol","AnnotationSymbolSlot","undefined","active","dsoActiveChange","title","Fragment","class","value","locatieNoemer","gewijzigdeLocatie","AnnotationGewijzigdeLocatie","Heading","_a","children","heading","mode","href","onClick","props","__rest","headingElement","Object","assign","documentComponentCss","wijzigactieLabels","nieuweContainer","verwijder","verwijderContainer","voegtoe","AantekenStatus","gereserveerd","vervallen","compact","wijzigactie","status","type","AantekenAlert","DocumentComponent","open","filtered","notApplicable","genesteOntwerpInformatie","bevatOntwerpInformatie","annotated","openAnnotation","handleHeadingClick","e","dsoTableOfContentsClick","emit","originalEvent","isModifiedEvent","dsoOpenToggle","handleOzonContentClick","event","detail","dsoOzonContentClick","ozonContentClick","handleRecursiveToggleClick","dsoRecursiveToggle","current","recursiveToggle","next","kop","_kopInput","_kop","parseXml","inhoud","_inhoudInput","_inhoud","_gereserveerdInput","_gereserveerd","parseAantekenElement","_vervallenInput","_vervallen","wijzigactieLabel","showOntwerpBadge","input","element","doc","documentElement","XMLDocument","parseWijzigactieFromNode","tag","tagName","toLowerCase","collapsible","alternativeTitle","showHeading","Host","part","label","icon","variant","onDsoClick","content","mark","text","call","onDsoOzonContentMarkItemHighlight","dsoMarkItemHighlight","source","inline","urlResolver","ozonContentUrlResolver","begripResolver","ozonContentBegripResolver","MarkText","emitMarkItemHighlight","elementRef","id","dsoAnnotationToggle","onDsoCloseClick","closeButtonLabel","slot","name"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-locatie&encapsulation=shadow","src/components/annotation/annotation-locatie/annotation-locatie.tsx","src/components/document-component/document-component-heading.tsx","src/components/document-component/document-component.scss?tag=dso-document-component&encapsulation=shadow","src/components/document-component/document-component.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 { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-locatie\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationLocatie 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 noemer van de locatie.\r\n   */\r\n  @Prop()\r\n  locatieNoemer?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationLocatieElement;\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}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <span class=\"content\">\r\n              <dso-renvooi value={this.locatieNoemer} />\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n","import { FunctionalComponent, VNode, h } from \"@stencil/core\";\r\nimport { JSXBase } from \"@stencil/core/internal\";\r\n\r\nimport { DocumentComponentMode } from \"./document-component.interfaces\";\r\n\r\ninterface DocumentComponentHeadingProps {\r\n  heading: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\r\n  mode: DocumentComponentMode;\r\n  href?: string;\r\n}\r\n\r\nexport const Heading: FunctionalComponent<\r\n  DocumentComponentHeadingProps & JSXBase.HTMLAttributes<HTMLHeadingElement>\r\n> = ({ heading, mode, href, onClick, ...props }, children) => {\r\n  let headingElement: VNode;\r\n\r\n  switch (heading) {\r\n    default:\r\n    case \"h2\":\r\n      headingElement = (\r\n        <h2 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h2>\r\n      );\r\n      break;\r\n    case \"h3\":\r\n      headingElement = (\r\n        <h3 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h3>\r\n      );\r\n      break;\r\n    case \"h4\":\r\n      headingElement = (\r\n        <h4 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h4>\r\n      );\r\n      break;\r\n    case \"h5\":\r\n      headingElement = (\r\n        <h5 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h5>\r\n      );\r\n      break;\r\n    case \"h6\":\r\n      headingElement = (\r\n        <h6 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h6>\r\n      );\r\n  }\r\n\r\n  if (mode === \"table-of-contents\" && href) {\r\n    return (\r\n      <a href={href} onClick={onClick} class=\"heading-anchor\">\r\n        {headingElement}\r\n      </a>\r\n    );\r\n  }\r\n\r\n  return headingElement;\r\n};\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/link\";\r\n@use \"~dso-toolkit/src/components/button/button\";\r\n@use \"~dso-toolkit/src/components/mark/mark\";\r\n@use \"~dso-toolkit/src/components/document-component\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n@use \"~dso-toolkit/src/components/insert\";\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n:host {\r\n  display: block;\r\n\r\n  --depth: var(--a, 0);\r\n}\r\n\r\n:host([not-collapsible]:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])) {\r\n  padding-inline-start: units.$u1;\r\n  margin-inline-end: units.$u1;\r\n}\r\n\r\n:host(:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])),\r\n:host(:where([wijzigactie=\"nieuweContainer\"], [wijzigactie=\"verwijderContainer\"])) .heading-container {\r\n  padding-block-start: units.$u1 * 0.5;\r\n  padding-block-end: units.$u1 * 0.5;\r\n}\r\n\r\n:host([wijzigactie=\"verwijderContainer\"]) .heading-container,\r\n:host(:where([wijzigactie=\"verwijder\"])) {\r\n  --_dso-document-component-text-decoration: line-through;\r\n\r\n  @include delete.root($strikethrough: false);\r\n}\r\n\r\n.heading-element,\r\n.content {\r\n  @include delete.strikethrough($_value: var(--_dso-document-component-text-decoration));\r\n}\r\n\r\n:host([wijzigactie=\"nieuweContainer\"]) .heading-container,\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([filtered]) {\r\n  position: relative;\r\n\r\n  &::before {\r\n    content: \"\";\r\n    inset-inline-start: -3px;\r\n    position: absolute;\r\n    display: block;\r\n    inline-size: 3px;\r\n    inset-block-start: 0;\r\n    inset-block-end: 0;\r\n    background-color: colors.$lichtblauw;\r\n  }\r\n}\r\n\r\n:host([open]),\r\n:host([open-annotation]) {\r\n  .annotation-container,\r\n  .heading-container {\r\n    margin-block-end: units.$u1;\r\n  }\r\n}\r\n\r\n:host(:not([open])),\r\n:host([mode=\"table-of-contents\"]) {\r\n  dso-ozon-content::part(_subtitels) {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.recursive-toggle,\r\n.toggle-button {\r\n  --_dso-icon-button-tertiary-color: #{colors.$bosgroen};\r\n  border: 0;\r\n  padding: 0;\r\n  background: 0;\r\n  color: colors.$bosgroen;\r\n}\r\n\r\n.heading-anchor {\r\n  display: flex;\r\n  flex-wrap: nowrap;\r\n\r\n  @include link.root();\r\n\r\n  text-decoration: none;\r\n}\r\n\r\n.heading-element {\r\n  align-items: start;\r\n  display: flex;\r\n  font-size: 1rem;\r\n  color: colors.$bosgroen;\r\n  margin: 0;\r\n\r\n  > * {\r\n    vertical-align: middle;\r\n  }\r\n}\r\n\r\n.alternative-title {\r\n  cursor: pointer;\r\n  @include link.pseudo();\r\n}\r\n\r\n:host([not-collapsible]) {\r\n  .heading-container {\r\n    margin-block-end: 0;\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: 0;\r\n  }\r\n\r\n  dso-ozon-content.kop::part(_kop) {\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n\r\n:host([mode=\"document\"]:not([not-collapsible])) {\r\n  --link-color: #{document-component.$heading-anchor-color};\r\n  --link-hover-color: #{document-component.$heading-anchor-hover-color};\r\n\r\n  dso-ozon-content {\r\n    &.kop::part(_kop) {\r\n      cursor: pointer;\r\n\r\n      &:hover {\r\n        color: var(--link-hover-color);\r\n        text-decoration: underline;\r\n      }\r\n    }\r\n\r\n    &[inline].kop::part(_kop) {\r\n      display: inline;\r\n    }\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: document-component.$indent;\r\n  }\r\n}\r\n\r\n:host([mode=\"document\"]:not([not-collapsible]):active) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    text-decoration: none;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"]) {\r\n  .heading-container {\r\n    padding-inline-start: document-component.$indent-table-of-contents;\r\n  }\r\n\r\n  .heading-element {\r\n    color: inherit;\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: 0;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"][type=\"ARTIKEL\"]) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    --_dso-icon-button-tertiary-color: inherit;\r\n    color: inherit;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"]:not([type=\"HOOFDSTUK\"])) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    font-weight: normal;\r\n  }\r\n}\r\n\r\n.addons {\r\n  margin-inline-start: auto;\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.heading {\r\n  display: flex;\r\n  align-items: start;\r\n  gap: units.$u1;\r\n}\r\n\r\n:host([type=\"ARTIKEL\"]:not([alternative-title])) {\r\n  dso-ozon-content.kop::part(_kop),\r\n  .toggle-button {\r\n    --_dso-icon-button-tertiary-color: #{colors.$zwart};\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n\r\n:host([type=\"LID\"][open-annotation]) {\r\n  .annotation-container {\r\n    margin-block-start: units.$u1;\r\n  }\r\n}\r\n\r\n.editaction-label {\r\n  font-style: italic;\r\n  margin-inline-start: units.$u1;\r\n}\r\n\r\n.content,\r\n.heading-container {\r\n  padding-inline-end: units.$u1;\r\n}\r\n\r\n.content {\r\n  --_dso-alert-margin-block-end: #{units.$u1};\r\n}\r\n\r\n.annotation-container {\r\n  padding-inline-end: units.$u1;\r\n\r\n  dso-panel {\r\n    --_dso-panel-body-background-color: #{colors.$wit};\r\n  }\r\n}\r\n\r\n:host(:where([annotations-wijzigactie=\"verwijder\"])) {\r\n  .annotation-container {\r\n    dso-panel {\r\n      --_dso-panel-body-background-color: #{colors.$rood-10};\r\n      --_dso-renvooi-text-decoration: line-through;\r\n    }\r\n  }\r\n}\r\n\r\n:host([annotations-wijzigactie=\"voegtoe\"]) {\r\n  .annotation-container {\r\n    dso-panel {\r\n      --_dso-panel-body-background-color: #{colors.$lime-10};\r\n    }\r\n  }\r\n}\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  FunctionalComponent,\r\n  Host,\r\n  Prop,\r\n  h,\r\n} from \"@stencil/core\";\r\n\r\nimport { DsoOzonContentCustomEvent } from \"../../components\";\r\nimport { MarkText } from \"../../functional-components/mark-text/mark-text.functional-component\";\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\nimport { parseXml } from \"../../utils/parse-xml\";\r\nimport { parseWijzigactieFromNode } from \"../ozon-content/functions/parse-wijzigactie-from-node.function\";\r\nimport {\r\n  OzonContentBegripResolver,\r\n  OzonContentClickEvent,\r\n  OzonContentUrlResolver,\r\n} from \"../ozon-content/ozon-content.interfaces\";\r\n\r\nimport { Heading } from \"./document-component-heading\";\r\nimport {\r\n  DocumentComponentAantekenElement,\r\n  DocumentComponentAnnotationsWijzigactie,\r\n  DocumentComponentInputType,\r\n  DocumentComponentMarkFunction,\r\n  DocumentComponentMarkItemHighlightEvent,\r\n  DocumentComponentMode,\r\n  DocumentComponentOpenToggleEvent,\r\n  DocumentComponentOzonContentClickEvent,\r\n  DocumentComponentRecursiveToggleEvent,\r\n  DocumentComponentRecursiveToggleState,\r\n  DocumentComponentTableOfContentsClickEvent,\r\n  DocumentComponentToggleAnnotationEvent,\r\n  DocumentComponentWijzigactie,\r\n} from \"./document-component.interfaces\";\r\n\r\nconst wijzigactieLabels: { [wijzigactie in DocumentComponentWijzigactie]: string } = {\r\n  nieuweContainer: \"Toegevoegd\",\r\n  verwijder: \"Verwijderd\",\r\n  verwijderContainer: \"Verwijderd\",\r\n  voegtoe: \"Toegevoegd\",\r\n};\r\n\r\nconst AantekenStatus: FunctionalComponent<{\r\n  gereserveerd?: DocumentComponentAantekenElement;\r\n  vervallen?: DocumentComponentAantekenElement;\r\n}> = ({ gereserveerd, vervallen }) => {\r\n  return (\r\n    <Fragment>\r\n      {\" \"}\r\n      {gereserveerd && (\r\n        <dso-label\r\n          compact\r\n          {...(gereserveerd.wijzigactie\r\n            ? { status: gereserveerd.wijzigactie === \"voegtoe\" ? \"toegevoegd\" : \"verwijderd\" }\r\n            : {})}\r\n        >\r\n          {gereserveerd.type}\r\n        </dso-label>\r\n      )}{\" \"}\r\n      {vervallen && (\r\n        <dso-label\r\n          compact\r\n          {...(vervallen.wijzigactie\r\n            ? { status: vervallen.wijzigactie === \"voegtoe\" ? \"toegevoegd\" : \"verwijderd\" }\r\n            : {})}\r\n        >\r\n          {vervallen.type}\r\n        </dso-label>\r\n      )}\r\n    </Fragment>\r\n  );\r\n};\r\n\r\nconst AantekenAlert: FunctionalComponent<{\r\n  gereserveerd?: DocumentComponentAantekenElement;\r\n  vervallen?: DocumentComponentAantekenElement;\r\n}> = ({ gereserveerd, vervallen }) => {\r\n  if (gereserveerd && gereserveerd.wijzigactie !== \"verwijder\" && !vervallen) {\r\n    return <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>;\r\n  }\r\n\r\n  if (vervallen && vervallen.wijzigactie !== \"voegtoe\" && !gereserveerd) {\r\n    return <dso-alert status=\"info\">Dit onderdeel is vervallen.</dso-alert>;\r\n  }\r\n\r\n  return null;\r\n};\r\n\r\n/**\r\n * @part _annotation-container - private part, do not touch.\r\n * @part _children-container - private part, do not touch.\r\n * @part _content - private part, do not touch.\r\n * @part _heading-container - private part, do not touch.\r\n */\r\n@Component({\r\n  tag: \"dso-document-component\",\r\n  styleUrl: \"document-component.scss\",\r\n  shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n  /**\r\n   * The heading element to use.\r\n   */\r\n  @Prop()\r\n  heading: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" = \"h2\";\r\n\r\n  private _kopInput?: DocumentComponentInputType;\r\n  private _kop?: XMLDocument;\r\n  /**\r\n   * The Kop XML.\r\n   */\r\n  @Prop()\r\n  get kop(): DocumentComponentInputType | undefined {\r\n    return this._kopInput;\r\n  }\r\n  set kop(value: DocumentComponentInputType | undefined) {\r\n    this._kopInput = value;\r\n    this._kop = typeof value === \"string\" ? parseXml(value) : value;\r\n  }\r\n\r\n  private _inhoudInput?: DocumentComponentInputType;\r\n  private _inhoud?: XMLDocument;\r\n  /**\r\n   * The Inhoud XML.\r\n   */\r\n  @Prop()\r\n  get inhoud(): DocumentComponentInputType | undefined {\r\n    return this._inhoudInput;\r\n  }\r\n  set inhoud(value: DocumentComponentInputType | undefined) {\r\n    this._inhoudInput = value;\r\n    this._inhoud = typeof value === \"string\" ? parseXml(value) : value;\r\n  }\r\n\r\n  /**\r\n   * This boolean attribute indicates whether the children are visible.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open = false;\r\n\r\n  /**\r\n   * Marks this Document Component as belonging to an active filter.\r\n   */\r\n  @Prop({ reflect: true })\r\n  filtered = false;\r\n\r\n  /**\r\n   * Marks this Document Component as not-applicable.\r\n   */\r\n  @Prop({ reflect: true })\r\n  notApplicable = false;\r\n\r\n  /**\r\n   * When a child Document Component has a status \"Draft\".\r\n   */\r\n  @Prop({ reflect: true })\r\n  genesteOntwerpInformatie = false;\r\n\r\n  /**\r\n   * Marks as draft.\r\n   */\r\n  @Prop({ reflect: true })\r\n  bevatOntwerpInformatie = false;\r\n\r\n  /**\r\n   * Enables annotations.\r\n   */\r\n  @Prop({ reflect: true })\r\n  annotated = false;\r\n\r\n  private _gereserveerdInput?: DocumentComponentInputType;\r\n  private _gereserveerd?: DocumentComponentAantekenElement;\r\n  /**\r\n   * Marks Document Component as reserved.\r\n   */\r\n  @Prop()\r\n  get gereserveerd(): DocumentComponentInputType | undefined {\r\n    return this._gereserveerdInput;\r\n  }\r\n  set gereserveerd(value: DocumentComponentInputType | undefined) {\r\n    this._gereserveerdInput = value;\r\n    this._gereserveerd = this.parseAantekenElement(value);\r\n  }\r\n\r\n  private _vervallenInput?: DocumentComponentInputType;\r\n  private _vervallen?: DocumentComponentAantekenElement;\r\n  /**\r\n   * Marks the Document Component as expired.\r\n   */\r\n  @Prop()\r\n  get vervallen(): DocumentComponentInputType | undefined {\r\n    return this._vervallenInput;\r\n  }\r\n  set vervallen(value: DocumentComponentInputType | undefined) {\r\n    this._vervallenInput = value;\r\n    this._vervallen = this.parseAantekenElement(value);\r\n  }\r\n\r\n  /**\r\n   * When the Annotation is opened, set this to true.\r\n   */\r\n  @Prop({ reflect: true })\r\n  openAnnotation = false;\r\n\r\n  /**\r\n   * An alternative title to show when there is nothing to create a title.\r\n   */\r\n  @Prop({ reflect: true })\r\n  alternativeTitle?: string;\r\n\r\n  /**\r\n   * Type of Document Component.\r\n   */\r\n  @Prop({ reflect: true })\r\n  type?: string;\r\n\r\n  /**\r\n   * The wijzigactie as in STOP.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n  /**\r\n   * The wijzigactie for all annotations.\r\n   */\r\n  @Prop({ reflect: true })\r\n  annotationsWijzigactie?: DocumentComponentAnnotationsWijzigactie;\r\n\r\n  /**\r\n   * To mark text.\r\n   */\r\n  @Prop()\r\n  mark?: DocumentComponentMarkFunction;\r\n\r\n  /**\r\n   * Shows the recursive toggle button. When the user activates this button the event `dsoRecursiveToggle` is emitted.\r\n   */\r\n  @Prop()\r\n  recursiveToggle: DocumentComponentRecursiveToggleState;\r\n\r\n  /**\r\n   * A UrlResolver that will be called for all STOP elements that render to HTML5 elements with external references.\r\n   */\r\n  @Prop()\r\n  ozonContentUrlResolver?: OzonContentUrlResolver;\r\n\r\n  /**\r\n   * A BegripResolver that will be called for STOP element \"IntRef\" with @scope=\"Begrip\".\r\n   */\r\n  @Prop()\r\n  ozonContentBegripResolver?: OzonContentBegripResolver;\r\n\r\n  /**\r\n   * The mode of the Document Component. One of \"document\" or \"table-of-contents\". Defaults to \"document\"\r\n   */\r\n  @Prop({ reflect: true })\r\n  mode: DocumentComponentMode = \"document\";\r\n\r\n  /**\r\n   * The URL to which the Heading links (only in mode=\"table-of-contents\").\r\n   */\r\n  @Prop({ reflect: true })\r\n  href?: string;\r\n\r\n  /**\r\n   * Emitted when the user activates the recursive toggle.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoRecursiveToggle!: EventEmitter<DocumentComponentRecursiveToggleEvent>;\r\n\r\n  /**\r\n   * Emitted when the user activates the toggle.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n  /**\r\n   * Emitted when the user clicks the heading in mode=\"table-of-contents\".\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoTableOfContentsClick!: EventEmitter<DocumentComponentTableOfContentsClickEvent>;\r\n\r\n  /**\r\n   * Emitted when the user interacts with Kop, IntRef or the Kenmerken en kaart button of IntIoRef in Ozon Content\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoOzonContentClick!: EventEmitter<DocumentComponentOzonContentClickEvent>;\r\n\r\n  /**\r\n   * Emitted when the user activates the annotation button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n  /**\r\n   * Emitted each time a marked item gets highlighted.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoMarkItemHighlight!: EventEmitter<DocumentComponentMarkItemHighlightEvent>;\r\n\r\n  private get wijzigactieLabel(): string | undefined {\r\n    return this.wijzigactie && wijzigactieLabels[this.wijzigactie];\r\n  }\r\n\r\n  private handleHeadingClick = (e: MouseEvent) => {\r\n    if (this.mode === \"table-of-contents\") {\r\n      this.dsoTableOfContentsClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n    } else if (this.type !== \"LID\") {\r\n      this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n    }\r\n  };\r\n\r\n  private handleOzonContentClick = (event: DsoOzonContentCustomEvent<OzonContentClickEvent>) => {\r\n    const { detail } = event;\r\n\r\n    if (detail.type === \"Kop\") {\r\n      this.handleHeadingClick(detail.originalEvent);\r\n    } else {\r\n      this.dsoOzonContentClick.emit({ originalEvent: event, ozonContentClick: event.detail });\r\n    }\r\n  };\r\n\r\n  private handleRecursiveToggleClick = (e: MouseEvent) => {\r\n    this.dsoRecursiveToggle.emit({\r\n      originalEvent: e,\r\n      current: this.recursiveToggle,\r\n      next: this.recursiveToggle !== true,\r\n    });\r\n  };\r\n\r\n  private showOntwerpBadge(): boolean {\r\n    return (\r\n      this.genesteOntwerpInformatie &&\r\n      !this.bevatOntwerpInformatie &&\r\n      ((!this.open && this.mode === \"document\") || this.mode === \"table-of-contents\")\r\n    );\r\n  }\r\n\r\n  private parseAantekenElement(input?: DocumentComponentInputType): DocumentComponentAantekenElement | undefined {\r\n    if (!input) {\r\n      return undefined;\r\n    }\r\n\r\n    let element: Element | undefined;\r\n\r\n    if (typeof input === \"string\") {\r\n      const doc = parseXml(input);\r\n      element = doc?.documentElement;\r\n    } else if (input instanceof XMLDocument) {\r\n      element = input.documentElement;\r\n    }\r\n\r\n    if (!element) {\r\n      return undefined;\r\n    }\r\n\r\n    const wijzigactie = parseWijzigactieFromNode(element);\r\n    const tag = element.tagName.toLowerCase();\r\n\r\n    let type: DocumentComponentAantekenElement[\"type\"] | undefined;\r\n    if (tag === \"vervallen\") {\r\n      type = \"Vervallen\";\r\n    } else if (tag === \"gereserveerd\") {\r\n      type = \"Gereserveerd\";\r\n    }\r\n\r\n    if (!type) {\r\n      return undefined;\r\n    }\r\n\r\n    return { type, wijzigactie };\r\n  }\r\n\r\n  render() {\r\n    const collapsible = !!((this._kop || this.alternativeTitle) && this.type !== \"LID\");\r\n\r\n    const showHeading = !!(\r\n      this.wijzigactie ||\r\n      collapsible ||\r\n      this._kop ||\r\n      this.alternativeTitle ||\r\n      this.bevatOntwerpInformatie ||\r\n      this.annotated\r\n    );\r\n\r\n    return (\r\n      <Host not-collapsible={!collapsible}>\r\n        {showHeading && (\r\n          <div class=\"heading-container\" part=\"_heading-container\">\r\n            {this.wijzigactie && <span class=\"editaction-label\">{this.wijzigactieLabel}:</span>}\r\n            <div class=\"heading\">\r\n              <Heading\r\n                heading={this.heading}\r\n                class=\"heading-element\"\r\n                onClick={this.alternativeTitle ? this.handleHeadingClick : undefined}\r\n                mode={this.mode}\r\n                href={this.href}\r\n              >\r\n                {collapsible && this.mode === \"document\" && (\r\n                  <dso-icon-button\r\n                    label={this.open ? \"Invouwen\" : \"Uitvouwen\"}\r\n                    class=\"toggle-button\"\r\n                    icon={this.open ? \"chevron-down\" : \"chevron-right\"}\r\n                    variant=\"tertiary\"\r\n                    onDsoClick={(e) => this.handleHeadingClick(e.detail.originalEvent)}\r\n                  />\r\n                )}\r\n                <div>\r\n                  {this.notApplicable && <span class=\"sr-only\">Niet van toepassing:</span>}\r\n                  {this._kop ? (\r\n                    <dso-ozon-content\r\n                      class=\"kop\"\r\n                      content={this._kop}\r\n                      onDsoClick={this.handleOzonContentClick}\r\n                      mark={this.mark && ((text) => this.mark?.(text, \"kop\"))}\r\n                      onDsoOzonContentMarkItemHighlight={(e) =>\r\n                        this.dsoMarkItemHighlight.emit({ ...e.detail, source: \"kop\" })\r\n                      }\r\n                      inline\r\n                      urlResolver={this.ozonContentUrlResolver}\r\n                      begripResolver={this.ozonContentBegripResolver}\r\n                    />\r\n                  ) : (\r\n                    <span class=\"alternative-title\">\r\n                      {(!this.mark && this.alternativeTitle) ||\r\n                        (this.mark && this.alternativeTitle && (\r\n                          <MarkText\r\n                            mark={this.mark && ((text: string) => this.mark?.(text, \"alternativeTitle\"))}\r\n                            text={this.alternativeTitle}\r\n                            emitMarkItemHighlight={(text, elementRef) =>\r\n                              this.dsoMarkItemHighlight.emit({ text, elementRef, source: \"alternativeTitle\" })\r\n                            }\r\n                          />\r\n                        ))}\r\n                    </span>\r\n                  )}\r\n                  <AantekenStatus gereserveerd={this._gereserveerd} vervallen={this._vervallen} />\r\n                </div>\r\n              </Heading>\r\n\r\n              {this.recursiveToggle !== undefined && this.open && this.mode === \"document\" && (\r\n                <dso-icon-button\r\n                  label={this.recursiveToggle === true ? \"Verberg alles\" : \"Toon alles\"}\r\n                  class=\"recursive-toggle\"\r\n                  icon={this.recursiveToggle === true ? \"eye\" : \"eye-slash\"}\r\n                  variant=\"tertiary\"\r\n                  onDsoClick={(e) => this.handleRecursiveToggleClick(e.detail.originalEvent)}\r\n                />\r\n              )}\r\n\r\n              {this.showOntwerpBadge() && (\r\n                <Fragment>\r\n                  <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n                    !\r\n                  </dso-badge>\r\n                  <dso-tooltip id=\"nested-draft-description\">\r\n                    Er zijn onderliggende onderdelen die veranderen binnen dit ontwerp.\r\n                  </dso-tooltip>\r\n                </Fragment>\r\n              )}\r\n\r\n              {(this.bevatOntwerpInformatie || this.annotated) && (\r\n                <div class=\"addons\">\r\n                  {this.bevatOntwerpInformatie && (\r\n                    <dso-label status=\"warning\" compact>\r\n                      Ontwerp\r\n                    </dso-label>\r\n                  )}\r\n                  {this.annotated && this.mode === \"document\" && (\r\n                    <dso-icon-button\r\n                      label={`Kenmerken en kaartgegevens ${this.openAnnotation ? \"verbergen\" : \"tonen\"}`}\r\n                      icon=\"label\"\r\n                      variant=\"tertiary\"\r\n                      onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e.detail.originalEvent })}\r\n                    />\r\n                  )}\r\n                </div>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n\r\n        {this.openAnnotation && (\r\n          <div class=\"annotation-container\" part=\"_annotation-container\">\r\n            <dso-panel\r\n              id=\"annotations\"\r\n              onDsoCloseClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n              closeButtonLabel=\"Kenmerken en kaartgegevens verbergen\"\r\n            >\r\n              <h2 slot=\"heading\">Kenmerken en kaart</h2>\r\n              <slot name=\"annotations\" />\r\n            </dso-panel>\r\n          </div>\r\n        )}\r\n\r\n        {this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === \"document\" && (\r\n          <div class=\"content\" part=\"_content\">\r\n            <AantekenAlert gereserveerd={this._gereserveerd} vervallen={this._vervallen} />\r\n\r\n            {this._inhoud && (\r\n              <dso-ozon-content\r\n                content={this._inhoud}\r\n                onDsoClick={this.handleOzonContentClick}\r\n                mark={this.mark && ((text) => this.mark?.(text, \"inhoud\"))}\r\n                onDsoOzonContentMarkItemHighlight={(e) =>\r\n                  this.dsoMarkItemHighlight.emit({ ...e.detail, source: \"inhoud\" })\r\n                }\r\n                urlResolver={this.ozonContentUrlResolver}\r\n                begripResolver={this.ozonContentBegripResolver}\r\n              />\r\n            )}\r\n          </div>\r\n        )}\r\n\r\n        <div class=\"children-container\" part=\"_children-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["annotationCss","AnnotationLocatie","constructor","hostRef","this","watcher","host","connectedCallback","watch","disconnectedCallback","unwatch","render","hasSymbool","h","AnnotationBody","key","symbol","AnnotationSymbolSlot","undefined","active","dsoActiveChange","title","Fragment","class","value","locatieNoemer","gewijzigdeLocatie","AnnotationGewijzigdeLocatie","Heading","_a","children","heading","mode","href","onClick","props","__rest","headingElement","Object","assign","documentComponentCss","wijzigactieLabels","nieuweContainer","verwijder","verwijderContainer","voegtoe","AantekenStatus","gereserveerd","vervallen","compact","wijzigactie","status","type","AantekenAlert","DocumentComponent","open","filtered","notApplicable","genesteOntwerpInformatie","bevatOntwerpInformatie","annotated","openAnnotation","handleHeadingClick","e","dsoTableOfContentsClick","emit","originalEvent","isModifiedEvent","dsoOpenToggle","handleOzonContentClick","event","detail","dsoOzonContentClick","ozonContentClick","handleRecursiveToggleClick","dsoRecursiveToggle","current","recursiveToggle","next","kop","_kopInput","_kop","parseXml","inhoud","_inhoudInput","_inhoud","_gereserveerdInput","_gereserveerd","parseAantekenElement","_vervallenInput","_vervallen","wijzigactieLabel","showOntwerpBadge","input","element","doc","documentElement","XMLDocument","parseWijzigactieFromNode","tag","tagName","toLowerCase","collapsible","alternativeTitle","showHeading","Host","part","label","icon","variant","onDsoClick","content","mark","text","call","onDsoOzonContentMarkItemHighlight","dsoMarkItemHighlight","source","inline","urlResolver","ozonContentUrlResolver","begripResolver","ozonContentBegripResolver","MarkText","emitMarkItemHighlight","elementRef","id","dsoAnnotationToggle","onDsoCloseClick","closeButtonLabel","slot","name"],"sources":["src/components/annotation/annotation.scss?tag=dso-annotation-locatie&encapsulation=shadow","src/components/annotation/annotation-locatie/annotation-locatie.tsx","src/components/document-component/document-component-heading.tsx","src/components/document-component/document-component.scss?tag=dso-document-component&encapsulation=shadow","src/components/document-component/document-component.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 { AnnotationSymbolSlot } from \"../annotation-symbol-slot\";\r\nimport { watcher } from \"../annotation-watcher\";\r\nimport { AnnotationActiveChangeEvent, AnnotationWijzigactie } from \"../annotation.interfaces\";\r\n\r\n/**\r\n * @slot symbool - Een optionele afbeelding die de annotatie symboliseert.\r\n */\r\n@Component({\r\n  tag: \"dso-annotation-locatie\",\r\n  styleUrl: \"../annotation.scss\",\r\n  shadow: true,\r\n})\r\nexport class AnnotationLocatie 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 noemer van de locatie.\r\n   */\r\n  @Prop()\r\n  locatieNoemer?: RenvooiValue | string;\r\n\r\n  @Element()\r\n  private host!: HTMLDsoAnnotationLocatieElement;\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}\r\n        dsoActiveChange={this.dsoActiveChange}\r\n        title={\r\n          <>\r\n            <span class=\"content\">\r\n              <dso-renvooi value={this.locatieNoemer} />\r\n            </span>\r\n            {this.gewijzigdeLocatie && <AnnotationGewijzigdeLocatie />}\r\n          </>\r\n        }\r\n      />\r\n    );\r\n  }\r\n}\r\n","import { FunctionalComponent, VNode, h } from \"@stencil/core\";\r\nimport { JSXBase } from \"@stencil/core/internal\";\r\n\r\nimport { DocumentComponentMode } from \"./document-component.interfaces\";\r\n\r\ninterface DocumentComponentHeadingProps {\r\n  heading: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\r\n  mode: DocumentComponentMode;\r\n  href?: string;\r\n}\r\n\r\nexport const Heading: FunctionalComponent<\r\n  DocumentComponentHeadingProps & JSXBase.HTMLAttributes<HTMLHeadingElement>\r\n> = ({ heading, mode, href, onClick, ...props }, children) => {\r\n  let headingElement: VNode;\r\n\r\n  switch (heading) {\r\n    default:\r\n    case \"h2\":\r\n      headingElement = (\r\n        <h2 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h2>\r\n      );\r\n      break;\r\n    case \"h3\":\r\n      headingElement = (\r\n        <h3 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h3>\r\n      );\r\n      break;\r\n    case \"h4\":\r\n      headingElement = (\r\n        <h4 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h4>\r\n      );\r\n      break;\r\n    case \"h5\":\r\n      headingElement = (\r\n        <h5 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h5>\r\n      );\r\n      break;\r\n    case \"h6\":\r\n      headingElement = (\r\n        <h6 {...props} onClick={mode === \"document\" ? onClick : undefined}>\r\n          {children}\r\n        </h6>\r\n      );\r\n  }\r\n\r\n  if (mode === \"table-of-contents\" && href) {\r\n    return (\r\n      <a href={href} onClick={onClick} class=\"heading-anchor\">\r\n        {headingElement}\r\n      </a>\r\n    );\r\n  }\r\n\r\n  return headingElement;\r\n};\r\n","@use \"~dso-toolkit/src/utilities\";\r\n\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/components/link\";\r\n@use \"~dso-toolkit/src/components/button/button\";\r\n@use \"~dso-toolkit/src/components/mark/mark\";\r\n@use \"~dso-toolkit/src/components/document-component\";\r\n@use \"~dso-toolkit/src/components/delete\";\r\n@use \"~dso-toolkit/src/components/insert\";\r\n\r\n.sr-only {\r\n  @include utilities.sr-only();\r\n}\r\n\r\n:host {\r\n  display: block;\r\n\r\n  --depth: var(--a, 0);\r\n}\r\n\r\n:host([not-collapsible]:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])) {\r\n  padding-inline-start: units.$u1;\r\n  margin-inline-end: units.$u1;\r\n}\r\n\r\n:host(:where([wijzigactie=\"verwijder\"], [wijzigactie=\"voegtoe\"])),\r\n:host(:where([wijzigactie=\"nieuweContainer\"], [wijzigactie=\"verwijderContainer\"])) .heading-container {\r\n  padding-block-start: units.$u1 * 0.5;\r\n  padding-block-end: units.$u1 * 0.5;\r\n}\r\n\r\n:host([wijzigactie=\"verwijderContainer\"]) .heading-container,\r\n:host(:where([wijzigactie=\"verwijder\"])) {\r\n  --_dso-document-component-text-decoration: line-through;\r\n\r\n  @include delete.root($strikethrough: false);\r\n}\r\n\r\n.heading-element,\r\n.content {\r\n  @include delete.strikethrough($_value: var(--_dso-document-component-text-decoration));\r\n}\r\n\r\n:host([wijzigactie=\"nieuweContainer\"]) .heading-container,\r\n:host([wijzigactie=\"voegtoe\"]) {\r\n  @include insert.root();\r\n}\r\n\r\n:host([filtered]) {\r\n  position: relative;\r\n\r\n  &::before {\r\n    content: \"\";\r\n    inset-inline-start: -3px;\r\n    position: absolute;\r\n    display: block;\r\n    inline-size: 3px;\r\n    inset-block-start: 0;\r\n    inset-block-end: 0;\r\n    background-color: colors.$lichtblauw;\r\n  }\r\n}\r\n\r\n:host([open]),\r\n:host([open-annotation]) {\r\n  .annotation-container,\r\n  .heading-container {\r\n    margin-block-end: units.$u1;\r\n  }\r\n}\r\n\r\n:host(:not([open])),\r\n:host([mode=\"table-of-contents\"]) {\r\n  dso-ozon-content::part(_subtitels) {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.recursive-toggle,\r\n.toggle-button {\r\n  --_dso-icon-button-tertiary-color: #{colors.$bosgroen};\r\n  border: 0;\r\n  padding: 0;\r\n  background: 0;\r\n  color: colors.$bosgroen;\r\n}\r\n\r\n.heading-anchor {\r\n  display: flex;\r\n  flex-wrap: nowrap;\r\n\r\n  @include link.root();\r\n\r\n  text-decoration: none;\r\n}\r\n\r\n.heading-element {\r\n  align-items: start;\r\n  display: flex;\r\n  font-size: 1rem;\r\n  color: colors.$bosgroen;\r\n  margin: 0;\r\n\r\n  > * {\r\n    vertical-align: middle;\r\n  }\r\n}\r\n\r\n.alternative-title {\r\n  cursor: pointer;\r\n  @include link.pseudo();\r\n}\r\n\r\n:host([not-collapsible]) {\r\n  .heading-container {\r\n    margin-block-end: 0;\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: 0;\r\n  }\r\n\r\n  dso-ozon-content.kop::part(_kop) {\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n\r\n:host([mode=\"document\"]:not([not-collapsible])) {\r\n  --link-color: #{document-component.$heading-anchor-color};\r\n  --link-hover-color: #{document-component.$heading-anchor-hover-color};\r\n\r\n  dso-ozon-content {\r\n    &.kop::part(_kop) {\r\n      cursor: pointer;\r\n\r\n      &:hover {\r\n        color: var(--link-hover-color);\r\n        text-decoration: underline;\r\n      }\r\n    }\r\n\r\n    &[inline].kop::part(_kop) {\r\n      display: inline;\r\n    }\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: document-component.$indent;\r\n  }\r\n}\r\n\r\n:host([mode=\"document\"]:not([not-collapsible]):active) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    text-decoration: none;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"]) {\r\n  .heading-container {\r\n    padding-inline-start: document-component.$indent-table-of-contents;\r\n  }\r\n\r\n  .heading-element {\r\n    color: inherit;\r\n  }\r\n\r\n  .editaction-label {\r\n    margin-inline-start: 0;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"][type=\"ARTIKEL\"]) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    --_dso-icon-button-tertiary-color: inherit;\r\n    color: inherit;\r\n  }\r\n}\r\n\r\n:host([mode=\"table-of-contents\"]:not([type=\"HOOFDSTUK\"])) {\r\n  dso-ozon-content.kop::part(_kop) {\r\n    font-weight: normal;\r\n  }\r\n}\r\n\r\n.addons {\r\n  margin-inline-start: auto;\r\n  display: flex;\r\n  gap: units.$u1;\r\n}\r\n\r\n.heading {\r\n  display: flex;\r\n  align-items: start;\r\n  gap: units.$u1;\r\n}\r\n\r\n:host([type=\"ARTIKEL\"]:not([alternative-title])) {\r\n  dso-ozon-content.kop::part(_kop),\r\n  .toggle-button {\r\n    --_dso-icon-button-tertiary-color: #{colors.$zwart};\r\n    color: colors.$zwart;\r\n  }\r\n}\r\n\r\n:host([type=\"LID\"][open-annotation]) {\r\n  .annotation-container {\r\n    margin-block-start: units.$u1;\r\n  }\r\n}\r\n\r\n.editaction-label {\r\n  font-style: italic;\r\n  margin-inline-start: units.$u1;\r\n}\r\n\r\n.content,\r\n.heading-container {\r\n  padding-inline-end: units.$u1;\r\n}\r\n\r\n.content {\r\n  --_dso-alert-margin-block-end: #{units.$u1};\r\n}\r\n\r\n.annotation-container {\r\n  padding-inline-end: units.$u1;\r\n\r\n  dso-panel {\r\n    --_dso-panel-body-background-color: #{colors.$wit};\r\n  }\r\n}\r\n\r\n:host(:where([annotations-wijzigactie=\"verwijder\"])) {\r\n  .annotation-container {\r\n    dso-panel {\r\n      --_dso-panel-body-background-color: #{colors.$rood-10};\r\n      --_dso-renvooi-text-decoration: line-through;\r\n    }\r\n  }\r\n}\r\n\r\n:host([annotations-wijzigactie=\"voegtoe\"]) {\r\n  .annotation-container {\r\n    dso-panel {\r\n      --_dso-panel-body-background-color: #{colors.$lime-10};\r\n    }\r\n  }\r\n}\r\n","import {\r\n  Component,\r\n  ComponentInterface,\r\n  Event,\r\n  EventEmitter,\r\n  Fragment,\r\n  FunctionalComponent,\r\n  Host,\r\n  Prop,\r\n  h,\r\n} from \"@stencil/core\";\r\n\r\nimport { DsoOzonContentCustomEvent } from \"../../components\";\r\nimport { MarkText } from \"../../functional-components/mark-text/mark-text.functional-component\";\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\nimport { parseXml } from \"../../utils/parse-xml\";\r\nimport { parseWijzigactieFromNode } from \"../ozon-content/functions/parse-wijzigactie-from-node.function\";\r\nimport {\r\n  OzonContentBegripResolver,\r\n  OzonContentClickEvent,\r\n  OzonContentUrlResolver,\r\n} from \"../ozon-content/ozon-content.interfaces\";\r\n\r\nimport { Heading } from \"./document-component-heading\";\r\nimport {\r\n  DocumentComponentAantekenElement,\r\n  DocumentComponentAnnotationsWijzigactie,\r\n  DocumentComponentInputType,\r\n  DocumentComponentMarkFunction,\r\n  DocumentComponentMarkItemHighlightEvent,\r\n  DocumentComponentMode,\r\n  DocumentComponentOpenToggleEvent,\r\n  DocumentComponentOzonContentClickEvent,\r\n  DocumentComponentRecursiveToggleEvent,\r\n  DocumentComponentRecursiveToggleState,\r\n  DocumentComponentTableOfContentsClickEvent,\r\n  DocumentComponentToggleAnnotationEvent,\r\n  DocumentComponentWijzigactie,\r\n} from \"./document-component.interfaces\";\r\n\r\nconst wijzigactieLabels: { [wijzigactie in DocumentComponentWijzigactie]: string } = {\r\n  nieuweContainer: \"Toegevoegd\",\r\n  verwijder: \"Verwijderd\",\r\n  verwijderContainer: \"Verwijderd\",\r\n  voegtoe: \"Toegevoegd\",\r\n};\r\n\r\nconst AantekenStatus: FunctionalComponent<{\r\n  gereserveerd?: DocumentComponentAantekenElement;\r\n  vervallen?: DocumentComponentAantekenElement;\r\n}> = ({ gereserveerd, vervallen }) => {\r\n  return (\r\n    <Fragment>\r\n      {\" \"}\r\n      {gereserveerd && (\r\n        <dso-label\r\n          compact\r\n          {...(gereserveerd.wijzigactie\r\n            ? { status: gereserveerd.wijzigactie === \"voegtoe\" ? \"toegevoegd\" : \"verwijderd\" }\r\n            : {})}\r\n        >\r\n          {gereserveerd.type}\r\n        </dso-label>\r\n      )}{\" \"}\r\n      {vervallen && (\r\n        <dso-label\r\n          compact\r\n          {...(vervallen.wijzigactie\r\n            ? { status: vervallen.wijzigactie === \"voegtoe\" ? \"toegevoegd\" : \"verwijderd\" }\r\n            : {})}\r\n        >\r\n          {vervallen.type}\r\n        </dso-label>\r\n      )}\r\n    </Fragment>\r\n  );\r\n};\r\n\r\nconst AantekenAlert: FunctionalComponent<{\r\n  gereserveerd?: DocumentComponentAantekenElement;\r\n  vervallen?: DocumentComponentAantekenElement;\r\n}> = ({ gereserveerd, vervallen }) => {\r\n  if (gereserveerd && gereserveerd.wijzigactie !== \"verwijder\" && !vervallen) {\r\n    return <dso-alert status=\"info\">Dit onderdeel is gereserveerd voor toekomstige toevoeging.</dso-alert>;\r\n  }\r\n\r\n  if (vervallen && vervallen.wijzigactie !== \"voegtoe\" && !gereserveerd) {\r\n    return <dso-alert status=\"info\">Dit onderdeel is vervallen.</dso-alert>;\r\n  }\r\n\r\n  return null;\r\n};\r\n\r\n/**\r\n * @part _annotation-container - private part, do not touch.\r\n * @part _children-container - private part, do not touch.\r\n * @part _content - private part, do not touch.\r\n * @part _heading-container - private part, do not touch.\r\n */\r\n@Component({\r\n  tag: \"dso-document-component\",\r\n  styleUrl: \"document-component.scss\",\r\n  shadow: true,\r\n})\r\nexport class DocumentComponent implements ComponentInterface {\r\n  /**\r\n   * The heading element to use.\r\n   */\r\n  @Prop()\r\n  heading: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" = \"h2\";\r\n\r\n  private _kopInput?: DocumentComponentInputType;\r\n  private _kop?: XMLDocument;\r\n  /**\r\n   * The Kop XML.\r\n   */\r\n  @Prop()\r\n  get kop(): DocumentComponentInputType | undefined {\r\n    return this._kopInput;\r\n  }\r\n  set kop(value: DocumentComponentInputType | undefined) {\r\n    this._kopInput = value;\r\n    this._kop = typeof value === \"string\" ? parseXml(value) : value;\r\n  }\r\n\r\n  private _inhoudInput?: DocumentComponentInputType;\r\n  private _inhoud?: XMLDocument;\r\n  /**\r\n   * The Inhoud XML.\r\n   */\r\n  @Prop()\r\n  get inhoud(): DocumentComponentInputType | undefined {\r\n    return this._inhoudInput;\r\n  }\r\n  set inhoud(value: DocumentComponentInputType | undefined) {\r\n    this._inhoudInput = value;\r\n    this._inhoud = typeof value === \"string\" ? parseXml(value) : value;\r\n  }\r\n\r\n  /**\r\n   * This boolean attribute indicates whether the children are visible.\r\n   */\r\n  @Prop({ reflect: true })\r\n  open = false;\r\n\r\n  /**\r\n   * Marks this Document Component as belonging to an active filter.\r\n   */\r\n  @Prop({ reflect: true })\r\n  filtered = false;\r\n\r\n  /**\r\n   * Marks this Document Component as not-applicable.\r\n   */\r\n  @Prop({ reflect: true })\r\n  notApplicable = false;\r\n\r\n  /**\r\n   * When a child Document Component has a status \"Draft\".\r\n   */\r\n  @Prop({ reflect: true })\r\n  genesteOntwerpInformatie = false;\r\n\r\n  /**\r\n   * Marks as draft.\r\n   */\r\n  @Prop({ reflect: true })\r\n  bevatOntwerpInformatie = false;\r\n\r\n  /**\r\n   * Enables annotations.\r\n   */\r\n  @Prop({ reflect: true })\r\n  annotated = false;\r\n\r\n  private _gereserveerdInput?: DocumentComponentInputType;\r\n  private _gereserveerd?: DocumentComponentAantekenElement;\r\n  /**\r\n   * Marks Document Component as reserved.\r\n   */\r\n  @Prop()\r\n  get gereserveerd(): DocumentComponentInputType | undefined {\r\n    return this._gereserveerdInput;\r\n  }\r\n  set gereserveerd(value: DocumentComponentInputType | undefined) {\r\n    this._gereserveerdInput = value;\r\n    this._gereserveerd = this.parseAantekenElement(value);\r\n  }\r\n\r\n  private _vervallenInput?: DocumentComponentInputType;\r\n  private _vervallen?: DocumentComponentAantekenElement;\r\n  /**\r\n   * Marks the Document Component as expired.\r\n   */\r\n  @Prop()\r\n  get vervallen(): DocumentComponentInputType | undefined {\r\n    return this._vervallenInput;\r\n  }\r\n  set vervallen(value: DocumentComponentInputType | undefined) {\r\n    this._vervallenInput = value;\r\n    this._vervallen = this.parseAantekenElement(value);\r\n  }\r\n\r\n  /**\r\n   * When the Annotation is opened, set this to true.\r\n   */\r\n  @Prop({ reflect: true })\r\n  openAnnotation = false;\r\n\r\n  /**\r\n   * An alternative title to show when there is nothing to create a title.\r\n   */\r\n  @Prop({ reflect: true })\r\n  alternativeTitle?: string;\r\n\r\n  /**\r\n   * Type of Document Component.\r\n   */\r\n  @Prop({ reflect: true })\r\n  type?: string;\r\n\r\n  /**\r\n   * The wijzigactie as in STOP.\r\n   */\r\n  @Prop({ reflect: true })\r\n  wijzigactie?: DocumentComponentWijzigactie;\r\n\r\n  /**\r\n   * The wijzigactie for all annotations.\r\n   */\r\n  @Prop({ reflect: true })\r\n  annotationsWijzigactie?: DocumentComponentAnnotationsWijzigactie;\r\n\r\n  /**\r\n   * To mark text.\r\n   */\r\n  @Prop()\r\n  mark?: DocumentComponentMarkFunction;\r\n\r\n  /**\r\n   * Shows the recursive toggle button. When the user activates this button the event `dsoRecursiveToggle` is emitted.\r\n   */\r\n  @Prop()\r\n  recursiveToggle: DocumentComponentRecursiveToggleState;\r\n\r\n  /**\r\n   * A UrlResolver that will be called for all STOP elements that render to HTML5 elements with external references.\r\n   */\r\n  @Prop()\r\n  ozonContentUrlResolver?: OzonContentUrlResolver;\r\n\r\n  /**\r\n   * A BegripResolver that will be called for STOP element \"IntRef\" with @scope=\"Begrip\".\r\n   */\r\n  @Prop()\r\n  ozonContentBegripResolver?: OzonContentBegripResolver;\r\n\r\n  /**\r\n   * The mode of the Document Component. One of \"document\" or \"table-of-contents\". Defaults to \"document\"\r\n   */\r\n  @Prop({ reflect: true })\r\n  mode: DocumentComponentMode = \"document\";\r\n\r\n  /**\r\n   * The URL to which the Heading links (only in mode=\"table-of-contents\").\r\n   */\r\n  @Prop({ reflect: true })\r\n  href?: string;\r\n\r\n  /**\r\n   * Emitted when the user activates the recursive toggle.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoRecursiveToggle!: EventEmitter<DocumentComponentRecursiveToggleEvent>;\r\n\r\n  /**\r\n   * Emitted when the user activates the toggle.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoOpenToggle!: EventEmitter<DocumentComponentOpenToggleEvent>;\r\n\r\n  /**\r\n   * Emitted when the user clicks the heading in mode=\"table-of-contents\".\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoTableOfContentsClick!: EventEmitter<DocumentComponentTableOfContentsClickEvent>;\r\n\r\n  /**\r\n   * Emitted when the user interacts with Kop, IntRef or the Kenmerken en kaart button of IntIoRef in Ozon Content\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoOzonContentClick!: EventEmitter<DocumentComponentOzonContentClickEvent>;\r\n\r\n  /**\r\n   * Emitted when the user activates the annotation button.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoAnnotationToggle!: EventEmitter<DocumentComponentToggleAnnotationEvent>;\r\n\r\n  /**\r\n   * Emitted each time a marked item gets highlighted.\r\n   */\r\n  @Event({ bubbles: false })\r\n  dsoMarkItemHighlight!: EventEmitter<DocumentComponentMarkItemHighlightEvent>;\r\n\r\n  private get wijzigactieLabel(): string | undefined {\r\n    return this.wijzigactie && wijzigactieLabels[this.wijzigactie];\r\n  }\r\n\r\n  private handleHeadingClick = (e: MouseEvent) => {\r\n    if (this.mode === \"table-of-contents\") {\r\n      this.dsoTableOfContentsClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n    } else if (this.type !== \"LID\") {\r\n      this.dsoOpenToggle.emit({ originalEvent: e, open: !this.open });\r\n    }\r\n  };\r\n\r\n  private handleOzonContentClick = (event: DsoOzonContentCustomEvent<OzonContentClickEvent>) => {\r\n    const { detail } = event;\r\n\r\n    if (detail.type === \"Kop\") {\r\n      this.handleHeadingClick(detail.originalEvent);\r\n    } else {\r\n      this.dsoOzonContentClick.emit({ originalEvent: event, ozonContentClick: event.detail });\r\n    }\r\n  };\r\n\r\n  private handleRecursiveToggleClick = (e: MouseEvent) => {\r\n    this.dsoRecursiveToggle.emit({\r\n      originalEvent: e,\r\n      current: this.recursiveToggle,\r\n      next: this.recursiveToggle !== true,\r\n    });\r\n  };\r\n\r\n  private showOntwerpBadge(): boolean {\r\n    return (\r\n      this.genesteOntwerpInformatie &&\r\n      !this.bevatOntwerpInformatie &&\r\n      ((!this.open && this.mode === \"document\") || this.mode === \"table-of-contents\")\r\n    );\r\n  }\r\n\r\n  private parseAantekenElement(input?: DocumentComponentInputType): DocumentComponentAantekenElement | undefined {\r\n    if (!input) {\r\n      return undefined;\r\n    }\r\n\r\n    let element: Element | undefined;\r\n\r\n    if (typeof input === \"string\") {\r\n      const doc = parseXml(input);\r\n      element = doc?.documentElement;\r\n    } else if (input instanceof XMLDocument) {\r\n      element = input.documentElement;\r\n    }\r\n\r\n    if (!element) {\r\n      return undefined;\r\n    }\r\n\r\n    const wijzigactie = parseWijzigactieFromNode(element);\r\n    const tag = element.tagName.toLowerCase();\r\n\r\n    let type: DocumentComponentAantekenElement[\"type\"] | undefined;\r\n    if (tag === \"vervallen\") {\r\n      type = \"Vervallen\";\r\n    } else if (tag === \"gereserveerd\") {\r\n      type = \"Gereserveerd\";\r\n    }\r\n\r\n    if (!type) {\r\n      return undefined;\r\n    }\r\n\r\n    return { type, wijzigactie };\r\n  }\r\n\r\n  render() {\r\n    const collapsible = !!((this._kop || this.alternativeTitle) && this.type !== \"LID\");\r\n\r\n    const showHeading = !!(\r\n      this.wijzigactie ||\r\n      collapsible ||\r\n      this._kop ||\r\n      this.alternativeTitle ||\r\n      this.bevatOntwerpInformatie ||\r\n      this.annotated\r\n    );\r\n\r\n    return (\r\n      <Host not-collapsible={!collapsible}>\r\n        {showHeading && (\r\n          <div class=\"heading-container\" part=\"_heading-container\">\r\n            {this.wijzigactie && <span class=\"editaction-label\">{this.wijzigactieLabel}:</span>}\r\n            <div class=\"heading\">\r\n              <Heading\r\n                heading={this.heading}\r\n                class=\"heading-element\"\r\n                onClick={this.alternativeTitle ? this.handleHeadingClick : undefined}\r\n                mode={this.mode}\r\n                href={this.href}\r\n              >\r\n                {collapsible && this.mode === \"document\" && (\r\n                  <dso-icon-button\r\n                    label={this.open ? \"Invouwen\" : \"Uitvouwen\"}\r\n                    class=\"toggle-button\"\r\n                    icon={this.open ? \"chevron-down\" : \"chevron-right\"}\r\n                    variant=\"tertiary\"\r\n                    onDsoClick={(e) => this.handleHeadingClick(e.detail.originalEvent)}\r\n                  />\r\n                )}\r\n                <div>\r\n                  {this.notApplicable && <span class=\"sr-only\">Niet van toepassing:</span>}\r\n                  {this._kop ? (\r\n                    <dso-ozon-content\r\n                      class=\"kop\"\r\n                      content={this._kop}\r\n                      onDsoClick={this.handleOzonContentClick}\r\n                      mark={this.mark && ((text) => this.mark?.(text, \"kop\"))}\r\n                      onDsoOzonContentMarkItemHighlight={(e) =>\r\n                        this.dsoMarkItemHighlight.emit({ ...e.detail, source: \"kop\" })\r\n                      }\r\n                      inline\r\n                      urlResolver={this.ozonContentUrlResolver}\r\n                      begripResolver={this.ozonContentBegripResolver}\r\n                    />\r\n                  ) : (\r\n                    <span class=\"alternative-title\">\r\n                      {(!this.mark && this.alternativeTitle) ||\r\n                        (this.mark && this.alternativeTitle && (\r\n                          <MarkText\r\n                            mark={this.mark && ((text: string) => this.mark?.(text, \"alternativeTitle\"))}\r\n                            text={this.alternativeTitle}\r\n                            emitMarkItemHighlight={(text, elementRef) =>\r\n                              this.dsoMarkItemHighlight.emit({ text, elementRef, source: \"alternativeTitle\" })\r\n                            }\r\n                          />\r\n                        ))}\r\n                    </span>\r\n                  )}\r\n                  <AantekenStatus gereserveerd={this._gereserveerd} vervallen={this._vervallen} />\r\n                </div>\r\n              </Heading>\r\n\r\n              {this.recursiveToggle !== undefined && this.open && this.mode === \"document\" && (\r\n                <dso-icon-button\r\n                  label={this.recursiveToggle === true ? \"Verberg alles\" : \"Toon alles\"}\r\n                  class=\"recursive-toggle\"\r\n                  icon={this.recursiveToggle === true ? \"eye\" : \"eye-slash\"}\r\n                  variant=\"tertiary\"\r\n                  onDsoClick={(e) => this.handleRecursiveToggleClick(e.detail.originalEvent)}\r\n                />\r\n              )}\r\n\r\n              {this.showOntwerpBadge() && (\r\n                <Fragment>\r\n                  <dso-badge status=\"warning\" aria-describedby=\"nested-draft-description\">\r\n                    !\r\n                  </dso-badge>\r\n                  <dso-tooltip id=\"nested-draft-description\">\r\n                    Er zijn onderliggende onderdelen die veranderen binnen dit ontwerp.\r\n                  </dso-tooltip>\r\n                </Fragment>\r\n              )}\r\n\r\n              {(this.bevatOntwerpInformatie || this.annotated) && (\r\n                <div class=\"addons\">\r\n                  {this.bevatOntwerpInformatie && (\r\n                    <dso-label status=\"warning\" compact>\r\n                      Ontwerp\r\n                    </dso-label>\r\n                  )}\r\n                  {this.annotated && this.mode === \"document\" && (\r\n                    <dso-icon-button\r\n                      label={`Kenmerken en kaartgegevens ${this.openAnnotation ? \"verbergen\" : \"tonen\"}`}\r\n                      icon=\"label\"\r\n                      variant=\"tertiary\"\r\n                      onDsoClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e.detail.originalEvent })}\r\n                    />\r\n                  )}\r\n                </div>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n\r\n        {this.openAnnotation && (\r\n          <div class=\"annotation-container\" part=\"_annotation-container\">\r\n            <dso-panel\r\n              id=\"annotations\"\r\n              onDsoCloseClick={(e) => this.dsoAnnotationToggle.emit({ originalEvent: e })}\r\n              closeButtonLabel=\"Kenmerken en kaartgegevens verbergen\"\r\n            >\r\n              <h2 slot=\"heading\">Kenmerken en kaart</h2>\r\n              <slot name=\"annotations\" />\r\n            </dso-panel>\r\n          </div>\r\n        )}\r\n\r\n        {this.open && (this._inhoud || this._gereserveerd || this._vervallen) && this.mode === \"document\" && (\r\n          <div class=\"content\" part=\"_content\">\r\n            <AantekenAlert gereserveerd={this._gereserveerd} vervallen={this._vervallen} />\r\n\r\n            {this._inhoud && (\r\n              <dso-ozon-content\r\n                content={this._inhoud}\r\n                onDsoClick={this.handleOzonContentClick}\r\n                mark={this.mark && ((text) => this.mark?.(text, \"inhoud\"))}\r\n                onDsoOzonContentMarkItemHighlight={(e) =>\r\n                  this.dsoMarkItemHighlight.emit({ ...e.detail, source: \"inhoud\" })\r\n                }\r\n                urlResolver={this.ozonContentUrlResolver}\r\n                begripResolver={this.ozonContentBegripResolver}\r\n              />\r\n            )}\r\n          </div>\r\n        )}\r\n\r\n        <div class=\"children-container\" part=\"_children-container\">\r\n          <slot />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}

package/dist/dso-toolkit/p-4c5a75e6.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,c as i,H as s,g as a}from"./p-DxWmN7gh.js";import{c as n}from"./p-ChV9xqsO.js";const o=":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:inset(0)}.dso-attachments{color:var(--dso-attachments-counter-color, #666);display:inline-block;font-weight:400;text-decoration:none;white-space:nowrap}";const r=class{constructor(t){e(this,t)}render(){return t("span",{key:"cd8239d516bd4ea96cdb3d6273d092e1441aa5bb",class:"dso-attachments"},this.count," ",t("span",{key:"b050b4ad32bbab6403b7cff89fe7f2f5c1aa5786",class:"sr-only"},"bijlage",this.count!==1?"n":""),t("dso-icon",{key:"2ad49e0eb4a1f41bee68b5348a25ab1a5fce7b0e",icon:"paperclip"}))}};r.style=o;const l=":host([enable-animation]){display:grid;grid-template-rows:0fr;overflow:hidden;opacity:0;transition:grid-template-rows 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host([enable-animation]:not([open=true])) .slot-container{min-block-size:0;visibility:hidden;transition:visibility 260ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:not([enable-animation])),:host([enable-animation=false]){display:none}:host([open][enable-animation]:not([open=false])){grid-template-rows:1fr;opacity:1}:host([open][enable-animation]:not([open=false])) .slot-container{visibility:visible}:host([open]:not([enable-animation]):not([open=false])),:host([open][enable-animation=false]:not([open=false])){display:block}*,*::after,*::before{box-sizing:border-box}";const d=class{constructor(t){e(this,t);this.dsoExpandableAnimationStart=i(this,"dsoExpandableAnimationStart",3);this.dsoExpandableAnimationEnd=i(this,"dsoExpandableAnimationEnd",3);this.enableAnimation=false;this.isClosed=true}toggleOpen(){if(!this.enableAnimation){this.isClosed=!this.open}}transitionstartHandler(e){e.stopPropagation();if(e.propertyName==="grid-template-rows"){this.dsoExpandableAnimationStart.emit({currentOpen:!!this.open,nextOpen:!this.open})}}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 t(s,{key:"f1a8622196eb5d688a650059380fb0cf0b81c2f4","aria-hidden":this.open?"false":"true",class:n({"dso-animate-ready":this.enableAnimation,"dso-hide":this.isClosed})},t("div",{key:"ffc3a8788dc58b4a03be497698379aa839dfad7e",class:"slot-container"},t("slot",{key:"a5506b08d7d63030124c483dd5f6faf09630c2c2"})))}get host(){return a(this)}static get watchers(){return{open:["toggleOpen"]}}};d.style=l;export{r as dso_attachments_counter,d as dso_expandable};
+//# sourceMappingURL=p-4c5a75e6.entry.js.map

package/dist/dso-toolkit/p-4c5a75e6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["attachmentsCounterCss","AttachmentsCounter","render","h","key","class","this","count","icon","expandableCss","Expandable","constructor","hostRef","enableAnimation","isClosed","toggleOpen","open","transitionstartHandler","e","stopPropagation","propertyName","dsoExpandableAnimationStart","emit","currentOpen","nextOpen","transitionendHandler","dsoExpandableAnimationEnd","bodyHeight","Host","clsx"],"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"],"mappings":"oGAAA,MAAMA,EAAwB,oV,MCOjBC,EAAkB,M,yBAO7B,MAAAC,GACE,OACEC,EAAA,QAAAC,IAAA,2CAAMC,MAAM,mBACTC,KAAKC,MAAK,IAAEJ,EAAM,QAAAC,IAAA,2CAAAC,MAAM,WAAS,UAASC,KAAKC,QAAU,EAAI,IAAM,IACpEJ,EAAA,YAAAC,IAAA,2CAAUI,KAAK,c,aClBvB,MAAMC,EAAgB,ywB,MC8BTC,EAAU,MALvB,WAAAC,CAAAC,G,wJAqBEN,KAAeO,gBAAG,MAgBlBP,KAAQQ,SAAG,IAyDZ,CAhEC,UAAAC,GACE,IAAKT,KAAKO,gBAAiB,CACzBP,KAAKQ,UAAYR,KAAKU,I,EAuB1B,sBAAAC,CAAuBC,GACrBA,EAAEC,kBAEF,GAAID,EAAEE,eAAiB,qBAAsB,CAC3Cd,KAAKe,4BAA4BC,KAAK,CACpCC,cAAejB,KAAKU,KACpBQ,UAAWlB,KAAKU,M,EAStB,oBAAAS,CAAqBP,GACnBA,EAAEC,kBAEF,GAAID,EAAEE,eAAiB,qBAAsB,CAC3Cd,KAAKQ,UAAYR,KAAKU,KACtBV,KAAKoB,0BAA0BJ,KAAK,CAAEK,WAAYrB,KAAKqB,WAAYX,OAAQV,KAAKU,M,EAIpF,MAAAd,GACE,OACEC,EAACyB,EAAI,CAAAxB,IAAA,yDACUE,KAAKU,KAAO,QAAU,OACnCX,MAAOwB,EAAK,CACV,oBAAqBvB,KAAKO,gBAC1B,WAAYP,KAAKQ,YAGnBX,EAAK,OAAAC,IAAA,2CAAAC,MAAM,kBACTF,EAAQ,QAAAC,IAAA,8C","ignoreList":[]}

package/dist/dso-toolkit/p-4f87903d.entry.js

@@ -0,0 +1,2 @@
+import{a as t,f as e,r as o,h as s,H as n,g as r}from"./p-DxWmN7gh.js";const c=(t,e,o)=>{const s=t.get(e);if(!s){t.set(e,[o])}else if(!s.includes(o)){s.push(o)}};const a=(t,e)=>{let o;return(...s)=>{if(o){clearTimeout(o)}o=setTimeout((()=>{o=0;t(...s)}),e)}};const i=t=>!("isConnected"in t)||t.isConnected;const d=a((t=>{for(let e of t.keys()){t.set(e,t.get(e).filter(i))}}),2e3);const f=()=>{if(typeof t!=="function"){return{}}const o=new Map;return{dispose:()=>o.clear(),get:e=>{const s=t();if(s){c(o,e,s)}},set:t=>{const s=o.get(t);if(s){o.set(t,s.filter(e))}d(o)},reset:()=>{o.forEach((t=>t.forEach(e)));d(o)}}};const l=t=>typeof t==="function"?t():t;const u=(t,e=(t,e)=>t!==e)=>{const o=l(t);let s=new Map(Object.entries(o??{}));const n={dispose:[],get:[],set:[],reset:[]};const r=new Map;const c=()=>{s=new Map(Object.entries(l(t)??{}));n.reset.forEach((t=>t()))};const a=()=>{n.dispose.forEach((t=>t()));c()};const i=t=>{n.get.forEach((e=>e(t)));return s.get(t)};const d=(t,o)=>{const r=s.get(t);if(e(o,r,t)){s.set(t,o);n.set.forEach((e=>e(t,o,r)))}};const f=typeof Proxy==="undefined"?{}:new Proxy(o,{get(t,e){return i(e)},ownKeys(t){return Array.from(s.keys())},getOwnPropertyDescriptor(){return{enumerable:true,configurable:true}},has(t,e){return s.has(e)},set(t,e,o){d(e,o);return true}});const u=(t,e)=>{n[t].push(e);return()=>{p(n[t],e)}};const b=(e,o)=>{const s=(t,s)=>{if(t===e){o(s)}};const n=()=>o(l(t)[e]);const c=u("set",s);const a=u("reset",n);r.set(o,{setHandler:s,resetHandler:n,propName:e});return()=>{c();a();r.delete(o)}};const g=(...t)=>{const e=t.reduce(((t,e)=>{if(e.set){t.push(u("set",e.set))}if(e.get){t.push(u("get",e.get))}if(e.reset){t.push(u("reset",e.reset))}if(e.dispose){t.push(u("dispose",e.dispose))}return t}),[]);return()=>e.forEach((t=>t()))};const h=t=>{const e=s.get(t);n.set.forEach((o=>o(t,e,e)))};const m=(t,e)=>{const o=r.get(e);if(o&&o.propName===t){p(n.set,o.setHandler);p(n.reset,o.resetHandler);r.delete(e)}};return{state:f,get:i,set:d,on:u,onChange:b,use:g,dispose:a,reset:c,forceUpdate:h,removeListener:m}};const p=(t,e)=>{const o=t.indexOf(e);if(o>=0){t[o]=t[t.length-1];t.length--}};const b=(t,e)=>{const o=u(t,e);o.use(f());return o};const g=":host{display:block;margin-block-end:var(--_dso-accordion-margin-block-end, 32px)}*,*::after,*::before{box-sizing:border-box}::slotted(dso-accordion-section:not(:first-child,.dso-accordion-compact,.dso-accordion-compact-black)){margin-block-start:4px}::slotted(dso-accordion-section.dso-accordion-compact:last-child),::slotted(dso-accordion-section.dso-accordion-compact-black:last-child){border-block-end:1px solid #ccc}";const h=class{constructor(t){o(this,t);const{state:e}=b({variant:"default",reverseAlign:false});this.accordionState=e}get variant(){return this.accordionState.variant}set variant(t){this.accordionState.variant=t||"default"}get reverseAlign(){return this.accordionState.reverseAlign}set reverseAlign(t){this.accordionState.reverseAlign=t||false}async _getState(){return this.accordionState}render(){return s(n,{key:"a86cfcda16f93c5bb818a2c5b3566f8a493c77d8"},s("slot",{key:"e171013f8b1a480c9ceb386a4fa820ab3e04647a"}))}get host(){return r(this)}};h.style=g;export{h as dso_accordion};
+//# sourceMappingURL=p-4f87903d.entry.js.map

package/dist/dso-toolkit/p-4f87903d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["appendToMap","map","propName","value","items","get","set","includes","push","debounce","fn","ms","timeoutId","args","clearTimeout","setTimeout","isConnected","maybeElement","cleanupElements","key","keys","filter","stencilSubscription","getRenderingRef","elmsToUpdate","Map","dispose","clear","elm","elements","forceUpdate","reset","forEach","elms","unwrap","val","createObservableMap","defaultState","shouldUpdate","a","b","unwrappedState","states","Object","entries","handlers","changeListeners","cb","oldValue","state","Proxy","_","ownKeys","Array","from","getOwnPropertyDescriptor","enumerable","configurable","has","on","eventName","callback","removeFromArray","onChange","setHandler","newValue","resetHandler","unSet","unReset","delete","use","subscriptions","unsubs","reduce","subscription","unsub","removeListener","listener","listenerInfo","array","item","index","indexOf","length","createStore","accordionCss","Accordion","constructor","hostRef","variant","reverseAlign","this","accordionState","_getState","render","h","Host"],"sources":["../../node_modules/@stencil/store/dist/index.js","src/components/accordion/accordion.scss?tag=dso-accordion&encapsulation=shadow","src/components/accordion/accordion.tsx"],"sourcesContent":["import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n    const items = map.get(propName);\n    if (!items) {\n        map.set(propName, [value]);\n    }\n    else if (!items.includes(value)) {\n        items.push(value);\n    }\n};\nconst debounce = (fn, ms) => {\n    let timeoutId;\n    return (...args) => {\n        if (timeoutId) {\n            clearTimeout(timeoutId);\n        }\n        timeoutId = setTimeout(() => {\n            timeoutId = 0;\n            fn(...args);\n        }, ms);\n    };\n};\n\n/**\n * Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n *\n * We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n *\n * Better leak in Edge than to be useless.\n */\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n    for (let key of map.keys()) {\n        map.set(key, map.get(key).filter(isConnected));\n    }\n}, 2_000);\nconst stencilSubscription = () => {\n    if (typeof getRenderingRef !== 'function') {\n        // If we are not in a stencil project, we do nothing.\n        // This function is not really exported by @stencil/core.\n        return {};\n    }\n    const elmsToUpdate = new Map();\n    return {\n        dispose: () => elmsToUpdate.clear(),\n        get: (propName) => {\n            const elm = getRenderingRef();\n            if (elm) {\n                appendToMap(elmsToUpdate, propName, elm);\n            }\n        },\n        set: (propName) => {\n            const elements = elmsToUpdate.get(propName);\n            if (elements) {\n                elmsToUpdate.set(propName, elements.filter(forceUpdate));\n            }\n            cleanupElements(elmsToUpdate);\n        },\n        reset: () => {\n            elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n            cleanupElements(elmsToUpdate);\n        },\n    };\n};\n\nconst unwrap = (val) => (typeof val === 'function' ? val() : val);\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n    const unwrappedState = unwrap(defaultState);\n    let states = new Map(Object.entries(unwrappedState ?? {}));\n    const handlers = {\n        dispose: [],\n        get: [],\n        set: [],\n        reset: [],\n    };\n    // Track onChange listeners to enable removeListener functionality\n    const changeListeners = new Map();\n    const reset = () => {\n        // When resetting the state, the default state may be a function - unwrap it to invoke it.\n        // otherwise, the state won't be properly reset\n        states = new Map(Object.entries(unwrap(defaultState) ?? {}));\n        handlers.reset.forEach((cb) => cb());\n    };\n    const dispose = () => {\n        // Call first dispose as resetting the state would\n        // cause less updates ;)\n        handlers.dispose.forEach((cb) => cb());\n        reset();\n    };\n    const get = (propName) => {\n        handlers.get.forEach((cb) => cb(propName));\n        return states.get(propName);\n    };\n    const set = (propName, value) => {\n        const oldValue = states.get(propName);\n        if (shouldUpdate(value, oldValue, propName)) {\n            states.set(propName, value);\n            handlers.set.forEach((cb) => cb(propName, value, oldValue));\n        }\n    };\n    const state = (typeof Proxy === 'undefined'\n        ? {}\n        : new Proxy(unwrappedState, {\n            get(_, propName) {\n                return get(propName);\n            },\n            ownKeys(_) {\n                return Array.from(states.keys());\n            },\n            getOwnPropertyDescriptor() {\n                return {\n                    enumerable: true,\n                    configurable: true,\n                };\n            },\n            has(_, propName) {\n                return states.has(propName);\n            },\n            set(_, propName, value) {\n                set(propName, value);\n                return true;\n            },\n        }));\n    const on = (eventName, callback) => {\n        handlers[eventName].push(callback);\n        return () => {\n            removeFromArray(handlers[eventName], callback);\n        };\n    };\n    const onChange = (propName, cb) => {\n        const setHandler = (key, newValue) => {\n            if (key === propName) {\n                cb(newValue);\n            }\n        };\n        const resetHandler = () => cb(unwrap(defaultState)[propName]);\n        // Register the handlers\n        const unSet = on('set', setHandler);\n        const unReset = on('reset', resetHandler);\n        // Track the relationship between the user callback and internal handlers\n        changeListeners.set(cb, { setHandler, resetHandler, propName });\n        return () => {\n            unSet();\n            unReset();\n            changeListeners.delete(cb);\n        };\n    };\n    const use = (...subscriptions) => {\n        const unsubs = subscriptions.reduce((unsubs, subscription) => {\n            if (subscription.set) {\n                unsubs.push(on('set', subscription.set));\n            }\n            if (subscription.get) {\n                unsubs.push(on('get', subscription.get));\n            }\n            if (subscription.reset) {\n                unsubs.push(on('reset', subscription.reset));\n            }\n            if (subscription.dispose) {\n                unsubs.push(on('dispose', subscription.dispose));\n            }\n            return unsubs;\n        }, []);\n        return () => unsubs.forEach((unsub) => unsub());\n    };\n    const forceUpdate = (key) => {\n        const oldValue = states.get(key);\n        handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n    };\n    const removeListener = (propName, listener) => {\n        const listenerInfo = changeListeners.get(listener);\n        if (listenerInfo && listenerInfo.propName === propName) {\n            // Remove the specific handlers that were created for this listener\n            removeFromArray(handlers.set, listenerInfo.setHandler);\n            removeFromArray(handlers.reset, listenerInfo.resetHandler);\n            changeListeners.delete(listener);\n        }\n    };\n    return {\n        state,\n        get,\n        set,\n        on,\n        onChange,\n        use,\n        dispose,\n        reset,\n        forceUpdate,\n        removeListener,\n    };\n};\nconst removeFromArray = (array, item) => {\n    const index = array.indexOf(item);\n    if (index >= 0) {\n        array[index] = array[array.length - 1];\n        array.length--;\n    }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n    const map = createObservableMap(defaultState, shouldUpdate);\n    map.use(stencilSubscription());\n    return map;\n};\n\nexport { createObservableMap, createStore };\n","@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"accordion.variables\" as accordion-variables;\r\n\r\n:host {\r\n  display: block;\r\n  margin-block-end: var(--_dso-accordion-margin-block-end, units.$block-spacing-xlarge);\r\n}\r\n\r\n@include utilities.box-sizing();\r\n\r\n::slotted(dso-accordion-section:not(:first-child, .dso-accordion-compact, .dso-accordion-compact-black)) {\r\n  margin-block-start: units.$u1 * 0.5;\r\n}\r\n\r\n::slotted(dso-accordion-section.dso-accordion-compact:last-child),\r\n::slotted(dso-accordion-section.dso-accordion-compact-black:last-child) {\r\n  border-block-end: 1px solid accordion-variables.$compact-border-color;\r\n}\r\n","import { Component, ComponentInterface, Element, Host, Method, Prop, h } from \"@stencil/core\";\r\nimport { createStore } from \"@stencil/store\";\r\n\r\nimport { AccordionInternalState, AccordionVariant } from \"./accordion.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-accordion\",\r\n  styleUrl: \"accordion.scss\",\r\n  shadow: true,\r\n})\r\nexport class Accordion implements ComponentInterface {\r\n  private readonly accordionState: AccordionInternalState;\r\n\r\n  @Element()\r\n  host!: HTMLDsoAccordionElement;\r\n\r\n  constructor() {\r\n    const { state } = createStore<AccordionInternalState>({\r\n      variant: \"default\",\r\n      reverseAlign: false,\r\n    });\r\n\r\n    this.accordionState = state;\r\n  }\r\n\r\n  /**\r\n   * The variant of the Accordion.\r\n   */\r\n  @Prop()\r\n  get variant(): AccordionVariant {\r\n    return this.accordionState.variant;\r\n  }\r\n  set variant(value: AccordionVariant) {\r\n    this.accordionState.variant = value || \"default\";\r\n  }\r\n\r\n  /**\r\n   * Places the chevron at the opposite side.\r\n   *\r\n   * Note: this mode does not display `state`, `attachmentCount` or `status` props on Accordion Sections\r\n   */\r\n  @Prop()\r\n  get reverseAlign() {\r\n    return this.accordionState.reverseAlign;\r\n  }\r\n  set reverseAlign(value: boolean) {\r\n    this.accordionState.reverseAlign = value || false;\r\n  }\r\n\r\n  /**\r\n   * @internal\r\n   */\r\n  @Method()\r\n  async _getState(): Promise<AccordionInternalState> {\r\n    return this.accordionState;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <slot></slot>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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","ignoreList":[]}

package/dist/dso-toolkit/{p-19019f3b.entry.js → p-4fb7266b.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as s,H as e,g as i}from"./p-DxWmN7gh.js";import{a as o,c as n,o as a,f as r}from"./p-gdsca1fx.js";import{t as h}from"./p-Pk8qng7t.js";import{g as f}from"./p-CodDyi2J.js";import{v as l}from"./p-BF0_OXTe.js";const d=":host(:focus){outline:none}:host{display:inline-block}div[popover]{margin:0 !important;border:0;padding:0;background-color:transparent;overflow:unset;inline-size:max-content}";const c=class{constructor(s){t(this,s);this.open=false;this.dropdownAlign="left";this.dropdownOptionsOffset=2;this.checkable=false;this.focusOutListener=t=>{if(this.open&&(!(t.relatedTarget instanceof HTMLElement)||!this.tabbables(true).includes(t.relatedTarget))){this.toggleOptions(false)}};this.keyDownListener=t=>{if(t.defaultPrevented||!this.open){return}switch(t.key){case"Tab":if(t.shiftKey){this.tabInPopup(this.tabbables(true),-1)}else{this.tabInPopup(this.tabbables(true),1)}break;case"ArrowDown":this.tabInPopup(this.tabbables(false),1);break;case"ArrowUp":this.tabInPopup(this.tabbables(false),-1);break;case"Escape":this.escape();break;case" ":if(t.target instanceof HTMLElement){t.target.click()}break;default:return}t.preventDefault()};this.escape=()=>{this.button.focus();this.toggleOptions(false)}}get button(){const t=this.host.querySelector('button[slot="toggle"]');if(!(t instanceof HTMLButtonElement)){throw new ReferenceError("Mandatory toggle button not found")}return t}tabbables(t){const s=this.host.isConnected?h(this.host):[];return t?s:s.filter((t=>t!==this.button))}componentDidLoad(){this.button.setAttribute("aria-haspopup","menu");this.button.setAttribute("aria-expanded","false");if(!this.button.id){this.button.id=l()}const t=this.host.querySelector(".dso-dropdown-options");if(!(t instanceof HTMLElement)){throw new Error("dropdown options element is not instanceof HTMLElement")}t.setAttribute("role","menu");t.setAttribute("aria-labelledby",this.button.id);for(const t of Array.from(this.host.getElementsByTagName("ul"))){t.setAttribute("role","group");for(const s of Array.from(t.getElementsByTagName("li"))){s.setAttribute("role","none")}}}componentDidRender(){for(const t of Array.from(this.host.getElementsByTagName("li"))){for(const s of this.host.isConnected?h(t):[]){s.setAttribute("role",this.checkable?"menuitemradio":"menuitem");if(this.checkable){s.setAttribute("aria-checked",t.classList.contains("dso-checked").toString())}}}this.button.setAttribute("aria-expanded",this.open?"true":"false");if(this.popoverElement&&!this.cleanUp){const t=this.popoverElement;this.cleanUp=o(this.button,t,(()=>{n(this.button,t,{strategy:"fixed",middleware:[a(this.dropdownOptionsOffset),r({padding:this.dropdownOptionsOffset})],placement:this.dropdownAlign==="right"?"bottom-end":"bottom-start"}).then((({x:s,y:e})=>{Object.assign(t.style,{left:`${s}px`,top:`${e}px`})}))}))}}onClick(t){const s=t.composedPath();if(this.isToggleButtonEvent(s)){this.toggleOptions()}else if(this.open&&this.isMenuItemEvent(s)){this.toggleOptions(false)}}isToggleButtonEvent(t){return t.includes(this.button)}isMenuItemEvent(t){return t.includes(this.host)&&!this.isToggleButtonEvent(t)}toggleOptions(t){var s,e;this.open=t!==null&&t!==void 0?t:!this.open;if((s=this.popoverElement)===null||s===void 0?void 0:s.isConnected){(e=this.popoverElement)===null||e===void 0?void 0:e.togglePopover(this.open)}if(!this.open&&this.cleanUp){this.cleanUp();this.cleanUp=undefined}}connectedCallback(){this.host.addEventListener("keydown",this.keyDownListener)}disconnectedCallback(){this.host.removeEventListener("keydown",this.keyDownListener);this.toggleOptions(false)}tabInPopup(t,s){var e;const i=t.findIndex((t=>t===f()));let o=i+s;if(o>=t.length){o=0}else if(o<0){o=t.length-1}(e=t[o])===null||e===void 0?void 0:e.focus()}render(){return s(e,{key:"b1a25aa6b96718a1974f27ada7062b142b2b5b52",onFocusout:this.focusOutListener},s("slot",{key:"f1139c595bc1b7d5030e2f3299ef938f98be50c6",name:"toggle"}),s("div",{key:"267fdfa08df18d6606b75040022ef4dcf8747526",popover:"manual",ref:t=>this.popoverElement=t},s("slot",{key:"895ab1da89ab93d33632bfeb5691a7c0090d881a"})))}get host(){return i(this)}};c.style=d;export{c as dso_dropdown_menu};
-//# sourceMappingURL=p-19019f3b.entry.js.map
+import{r as t,h as s,H as e,g as i}from"./p-DxWmN7gh.js";import{a as o,c as n,o as a,f as r}from"./p-_RZbmuMU.js";import{t as h}from"./p-DDSMs62-.js";import{g as d}from"./p-CodDyi2J.js";import{v as c}from"./p-C_akviUd.js";const l=":host(:focus){outline:none}:host{display:inline-block}div[popover]{margin:0 !important;border:0;padding:0;background-color:transparent;overflow:unset;inline-size:max-content}";const f=class{constructor(s){t(this,s);this.open=false;this.dropdownAlign="left";this.dropdownOptionsOffset=2;this.checkable=false;this.focusOutListener=t=>{if(this.open&&(!(t.relatedTarget instanceof HTMLElement)||!this.tabbables(true).includes(t.relatedTarget))){this.toggleOptions(false)}};this.keyDownListener=t=>{if(t.defaultPrevented||!this.open){return}switch(t.key){case"Tab":if(t.shiftKey){this.tabInPopup(this.tabbables(true),-1)}else{this.tabInPopup(this.tabbables(true),1)}break;case"ArrowDown":this.tabInPopup(this.tabbables(false),1);break;case"ArrowUp":this.tabInPopup(this.tabbables(false),-1);break;case"Escape":this.escape();break;case" ":if(t.target instanceof HTMLElement){t.target.click()}break;default:return}t.preventDefault()};this.escape=()=>{this.button.focus();this.toggleOptions(false)}}get button(){const t=this.host.querySelector('button[slot="toggle"]');if(!(t instanceof HTMLButtonElement)){throw new ReferenceError("Mandatory toggle button not found")}return t}tabbables(t){const s=this.host.isConnected?h(this.host):[];return t?s:s.filter((t=>t!==this.button))}componentDidLoad(){this.button.setAttribute("aria-haspopup","menu");this.button.setAttribute("aria-expanded","false");if(!this.button.id){this.button.id=c()}const t=this.host.querySelector(".dso-dropdown-options");if(!(t instanceof HTMLElement)){throw new Error("dropdown options element is not instanceof HTMLElement")}t.setAttribute("role","menu");t.setAttribute("aria-labelledby",this.button.id);for(const t of Array.from(this.host.getElementsByTagName("ul"))){t.setAttribute("role","group");for(const s of Array.from(t.getElementsByTagName("li"))){s.setAttribute("role","none")}}}componentDidRender(){for(const t of Array.from(this.host.getElementsByTagName("li"))){for(const s of this.host.isConnected?h(t):[]){s.setAttribute("role",this.checkable?"menuitemradio":"menuitem");if(this.checkable){s.setAttribute("aria-checked",t.classList.contains("dso-checked").toString())}}}this.button.setAttribute("aria-expanded",this.open?"true":"false");if(this.popoverElement&&!this.cleanUp){const t=this.popoverElement;this.cleanUp=o(this.button,t,(()=>{n(this.button,t,{strategy:"fixed",middleware:[a(this.dropdownOptionsOffset),r({padding:this.dropdownOptionsOffset})],placement:this.dropdownAlign==="right"?"bottom-end":"bottom-start"}).then((({x:s,y:e})=>{Object.assign(t.style,{left:`${s}px`,top:`${e}px`})}))}))}}onClick(t){const s=t.composedPath();if(this.isToggleButtonEvent(s)){this.toggleOptions()}else if(this.open&&this.isMenuItemEvent(s)){this.toggleOptions(false)}}isToggleButtonEvent(t){return t.includes(this.button)}isMenuItemEvent(t){return t.includes(this.host)&&!this.isToggleButtonEvent(t)}toggleOptions(t){var s,e;this.open=t!==null&&t!==void 0?t:!this.open;if((s=this.popoverElement)===null||s===void 0?void 0:s.isConnected){(e=this.popoverElement)===null||e===void 0?void 0:e.togglePopover(this.open)}if(!this.open&&this.cleanUp){this.cleanUp();this.cleanUp=undefined}}connectedCallback(){this.host.addEventListener("keydown",this.keyDownListener)}disconnectedCallback(){this.host.removeEventListener("keydown",this.keyDownListener);this.toggleOptions(false)}tabInPopup(t,s){var e;const i=t.findIndex((t=>t===d()));let o=i+s;if(o>=t.length){o=0}else if(o<0){o=t.length-1}(e=t[o])===null||e===void 0?void 0:e.focus()}render(){return s(e,{key:"cb2c5a2237719a61e590aca29c4eddae1987f88e",onFocusout:this.focusOutListener},s("slot",{key:"96a6a5570d7904dad8e906a1e86427addc9bcb1b",name:"toggle"}),s("div",{key:"864f70e5ccdbc9366ddc2fce8593112bf3dcd557",popover:"manual",ref:t=>this.popoverElement=t},s("slot",{key:"da97c38c3dc0d8476e59d76bbc9442cc60b7fc5f"})))}get host(){return i(this)}};f.style=l;export{f as dso_dropdown_menu};
+//# sourceMappingURL=p-4fb7266b.entry.js.map

package/dist/dso-toolkit/p-539cd8e4.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as o,H as n}from"./p-DxWmN7gh.js";const s=":host{display:inline-block}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:inset(0)}button{background-color:transparent;color:#39870c;border:0;margin-inline-start:var(--_dt-info-button-margin-inline-start, 8px);padding:0}button.dso-info-secondary{color:#666}button{vertical-align:top;line-height:1}dso-icon-button{margin-inline-start:var(--_dt-info-button-margin-inline-start, 8px);vertical-align:top}";const e=class{constructor(o){i(this,o);this.dsoToggle=t(this,"dsoToggle",7);this.hover=false;this.label="Toelichting bij optie"}async setFocus(){var i,t;(i=this.button)===null||i===void 0?void 0:i.setFocus();(t=this.buttonSecondary)===null||t===void 0?void 0:t.focus()}handleToggle(i){this.active=!this.active;this.dsoToggle.emit({originalEvent:i,active:this.active})}render(){return o(n,{key:"5fc1ae354bfc278bedbca0f2aaaff7a15deb5449",onMouseenter:()=>this.hover=true,onMouseleave:()=>this.hover=false},!this.secondary?o("dso-icon-button",{variant:"tertiary",label:this.label,onDsoClick:i=>this.handleToggle(i.detail.originalEvent),icon:this.active||this.hover?"info-active":"info",ref:i=>this.button=i}):o("button",{type:"button",class:"dso-info-secondary","aria-expanded":typeof this.active==="boolean"?this.active.toString():undefined,onClick:i=>this.handleToggle(i),ref:i=>this.buttonSecondary=i},o("dso-icon",{icon:this.active||this.hover?"info-active":"info"}),o("span",{class:"sr-only"},this.label)))}};e.style=s;export{e as dso_info_button};
+//# sourceMappingURL=p-539cd8e4.entry.js.map

package/dist/dso-toolkit/{p-b3f2cf42.entry.js.map → p-539cd8e4.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["infoButtonCss","InfoButton","constructor","hostRef","this","hover","label","setFocus","_a","button","_b","buttonSecondary","focus","handleToggle","originalEvent","active","dsoToggle","emit","render","h","Host","key","onMouseenter","onMouseleave","secondary","variant","onDsoClick","e","detail","icon","ref","element","type","class","toString","undefined","onClick"],"sources":["src/components/info-button/info-button.scss?tag=dso-info-button&encapsulation=shadow","src/components/info-button/info-button.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/info-button\";\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// ToDo: remove this part in https://github.com/dso-toolkit/dso-toolkit/issues/3350. Tertiary on color already working\r\nbutton {\r\n  @include info-button.root();\r\n\r\n  vertical-align: top;\r\n  line-height: 1;\r\n}\r\n\r\ndso-icon-button {\r\n  margin-inline-start: var(--_dt-info-button-margin-inline-start, units.$u1);\r\n  vertical-align: top;\r\n}\r\n","import { Component, Event, EventEmitter, Host, Method, Prop, State, h } from \"@stencil/core\";\r\n\r\nimport { InfoButtonToggleEvent } from \"./info-button.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-info-button\",\r\n  shadow: true,\r\n  styleUrl: \"info-button.scss\",\r\n})\r\nexport class InfoButton {\r\n  private button?: HTMLDsoIconButtonElement;\r\n  private buttonSecondary?: HTMLButtonElement;\r\n\r\n  /**\r\n   * Whether the InfoButton is active.\r\n   */\r\n  @Prop({ mutable: true, reflect: true })\r\n  active?: boolean;\r\n\r\n  @State()\r\n  hover = false;\r\n\r\n  /**\r\n   * For secondary Info Button.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  /**\r\n   * The label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting bij optie\";\r\n\r\n  /**\r\n   * Emitted when the user activates the Info Button.\r\n   */\r\n  @Event()\r\n  dsoToggle!: EventEmitter<InfoButtonToggleEvent>;\r\n\r\n  /**\r\n   * To set focus to the toggle button.\r\n   */\r\n  @Method()\r\n  async setFocus() {\r\n    this.button?.setFocus();\r\n    this.buttonSecondary?.focus();\r\n  }\r\n\r\n  private handleToggle(originalEvent: MouseEvent) {\r\n    this.active = !this.active;\r\n    this.dsoToggle.emit({ originalEvent, active: this.active });\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host onMouseenter={() => (this.hover = true)} onMouseleave={() => (this.hover = false)}>\r\n        {!this.secondary ? (\r\n          <dso-icon-button\r\n            variant=\"tertiary\"\r\n            label={this.label}\r\n            onDsoClick={(e) => this.handleToggle(e.detail.originalEvent)}\r\n            icon={this.active || this.hover ? \"info-active\" : \"info\"}\r\n            ref={(element) => (this.button = element)}\r\n          />\r\n        ) : (\r\n          // ToDo: remove this part in https://github.com/dso-toolkit/dso-toolkit/issues/3350. Tertiary on color already working\r\n          <button\r\n            type=\"button\"\r\n            class=\"dso-info-secondary\"\r\n            aria-expanded={typeof this.active === \"boolean\" ? this.active.toString() : undefined}\r\n            onClick={(e) => this.handleToggle(e)}\r\n            ref={(element) => (this.buttonSecondary = element)}\r\n          >\r\n            <dso-icon icon={this.active || this.hover ? \"info-active\" : \"info\"}></dso-icon>\r\n            <span class=\"sr-only\">{this.label}</span>\r\n          </button>\r\n        )}\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"yDAAA,MAAMA,EAAgB,8f,MCSTC,EAAU,MALvB,WAAAC,CAAAC,G,+CAgBEC,KAAKC,MAAG,MAYRD,KAAKE,MAAG,uBAiDT,CArCC,cAAMC,G,SACJC,EAAAJ,KAAKK,UAAQ,MAAAD,SAAA,SAAAA,EAAAD,YACbG,EAAAN,KAAKO,mBAAiB,MAAAD,SAAA,SAAAA,EAAAE,O,CAGhB,YAAAC,CAAaC,GACnBV,KAAKW,QAAUX,KAAKW,OACpBX,KAAKY,UAAUC,KAAK,CAAEH,gBAAeC,OAAQX,KAAKW,Q,CAGpD,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,aAAc,IAAOlB,KAAKC,MAAQ,KAAOkB,aAAc,IAAOnB,KAAKC,MAAQ,QAC7ED,KAAKoB,UACLL,EACE,mBAAAM,QAAQ,WACRnB,MAAOF,KAAKE,MACZoB,WAAaC,GAAMvB,KAAKS,aAAac,EAAEC,OAAOd,eAC9Ce,KAAMzB,KAAKW,QAAUX,KAAKC,MAAQ,cAAgB,OAClDyB,IAAMC,GAAa3B,KAAKK,OAASsB,IAInCZ,EACE,UAAAa,KAAK,SACLC,MAAM,qBAAoB,uBACJ7B,KAAKW,SAAW,UAAYX,KAAKW,OAAOmB,WAAaC,UAC3EC,QAAUT,GAAMvB,KAAKS,aAAac,GAClCG,IAAMC,GAAa3B,KAAKO,gBAAkBoB,GAE1CZ,EAAA,YAAUU,KAAMzB,KAAKW,QAAUX,KAAKC,MAAQ,cAAgB,SAC5Dc,EAAA,QAAMc,MAAM,WAAW7B,KAAKE,Q","ignoreList":[]}
+{"version":3,"names":["infoButtonCss","InfoButton","constructor","hostRef","this","hover","label","setFocus","_a","button","_b","buttonSecondary","focus","handleToggle","originalEvent","active","dsoToggle","emit","render","h","Host","key","onMouseenter","onMouseleave","secondary","variant","onDsoClick","e","detail","icon","ref","element","type","class","toString","undefined","onClick"],"sources":["src/components/info-button/info-button.scss?tag=dso-info-button&encapsulation=shadow","src/components/info-button/info-button.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/info-button\";\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// ToDo: remove this part in https://github.com/dso-toolkit/dso-toolkit/issues/3350. Tertiary on color already working\r\nbutton {\r\n  @include info-button.root();\r\n\r\n  vertical-align: top;\r\n  line-height: 1;\r\n}\r\n\r\ndso-icon-button {\r\n  margin-inline-start: var(--_dt-info-button-margin-inline-start, units.$u1);\r\n  vertical-align: top;\r\n}\r\n","import { Component, Event, EventEmitter, Host, Method, Prop, State, h } from \"@stencil/core\";\r\n\r\nimport { InfoButtonToggleEvent } from \"./info-button.interfaces\";\r\n\r\n@Component({\r\n  tag: \"dso-info-button\",\r\n  shadow: true,\r\n  styleUrl: \"info-button.scss\",\r\n})\r\nexport class InfoButton {\r\n  private button?: HTMLDsoIconButtonElement;\r\n  private buttonSecondary?: HTMLButtonElement;\r\n\r\n  /**\r\n   * Whether the InfoButton is active.\r\n   */\r\n  @Prop({ mutable: true, reflect: true })\r\n  active?: boolean;\r\n\r\n  @State()\r\n  hover = false;\r\n\r\n  /**\r\n   * For secondary Info Button.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  /**\r\n   * The label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting bij optie\";\r\n\r\n  /**\r\n   * Emitted when the user activates the Info Button.\r\n   */\r\n  @Event()\r\n  dsoToggle!: EventEmitter<InfoButtonToggleEvent>;\r\n\r\n  /**\r\n   * To set focus to the toggle button.\r\n   */\r\n  @Method()\r\n  async setFocus() {\r\n    this.button?.setFocus();\r\n    this.buttonSecondary?.focus();\r\n  }\r\n\r\n  private handleToggle(originalEvent: MouseEvent) {\r\n    this.active = !this.active;\r\n    this.dsoToggle.emit({ originalEvent, active: this.active });\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host onMouseenter={() => (this.hover = true)} onMouseleave={() => (this.hover = false)}>\r\n        {!this.secondary ? (\r\n          <dso-icon-button\r\n            variant=\"tertiary\"\r\n            label={this.label}\r\n            onDsoClick={(e) => this.handleToggle(e.detail.originalEvent)}\r\n            icon={this.active || this.hover ? \"info-active\" : \"info\"}\r\n            ref={(element) => (this.button = element)}\r\n          />\r\n        ) : (\r\n          // ToDo: remove this part in https://github.com/dso-toolkit/dso-toolkit/issues/3350. Tertiary on color already working\r\n          <button\r\n            type=\"button\"\r\n            class=\"dso-info-secondary\"\r\n            aria-expanded={typeof this.active === \"boolean\" ? this.active.toString() : undefined}\r\n            onClick={(e) => this.handleToggle(e)}\r\n            ref={(element) => (this.buttonSecondary = element)}\r\n          >\r\n            <dso-icon icon={this.active || this.hover ? \"info-active\" : \"info\"}></dso-icon>\r\n            <span class=\"sr-only\">{this.label}</span>\r\n          </button>\r\n        )}\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"yDAAA,MAAMA,EAAgB,kgB,MCSTC,EAAU,MALvB,WAAAC,CAAAC,G,+CAgBEC,KAAKC,MAAG,MAYRD,KAAKE,MAAG,uBAiDT,CArCC,cAAMC,G,SACJC,EAAAJ,KAAKK,UAAQ,MAAAD,SAAA,SAAAA,EAAAD,YACbG,EAAAN,KAAKO,mBAAiB,MAAAD,SAAA,SAAAA,EAAAE,O,CAGhB,YAAAC,CAAaC,GACnBV,KAAKW,QAAUX,KAAKW,OACpBX,KAAKY,UAAUC,KAAK,CAAEH,gBAAeC,OAAQX,KAAKW,Q,CAGpD,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,aAAc,IAAOlB,KAAKC,MAAQ,KAAOkB,aAAc,IAAOnB,KAAKC,MAAQ,QAC7ED,KAAKoB,UACLL,EACE,mBAAAM,QAAQ,WACRnB,MAAOF,KAAKE,MACZoB,WAAaC,GAAMvB,KAAKS,aAAac,EAAEC,OAAOd,eAC9Ce,KAAMzB,KAAKW,QAAUX,KAAKC,MAAQ,cAAgB,OAClDyB,IAAMC,GAAa3B,KAAKK,OAASsB,IAInCZ,EACE,UAAAa,KAAK,SACLC,MAAM,qBAAoB,uBACJ7B,KAAKW,SAAW,UAAYX,KAAKW,OAAOmB,WAAaC,UAC3EC,QAAUT,GAAMvB,KAAKS,aAAac,GAClCG,IAAMC,GAAa3B,KAAKO,gBAAkBoB,GAE1CZ,EAAA,YAAUU,KAAMzB,KAAKW,QAAUX,KAAKC,MAAQ,cAAgB,SAC5Dc,EAAA,QAAMc,MAAM,WAAW7B,KAAKE,Q","ignoreList":[]}

package/dist/dso-toolkit/p-55390fd2.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,f as a,h as n,g as o}from"./p-DxWmN7gh.js";import{i}from"./p-Hgv-pDpy.js";const d="*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;flex-shrink:0 !important;align-self:end !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){display:inline !important;color:#275937 !important;font-size:1.125em !important;font-weight:700 !important;line-height:1.25 !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip-path:inset(0)}.heading-anchor .icon-container{position:relative;padding-inline-end:24px}.heading-anchor .icon-container dso-icon{position:absolute;inset-inline-end:0;inset-block-end:-3px;block-size:24px;inline-size:24px}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}";const c=class{constructor(a){e(this,a);this.dsoDocumentCardClick=t(this,"dsoDocumentCardClick",7)}connectedCallback(){this.mutationObserver=new MutationObserver((()=>a(this.host)));this.mutationObserver.observe(this.host,{attributes:true,childList:true})}disconnectedCallback(){var e;(e=this.mutationObserver)===null||e===void 0?void 0:e.disconnect();delete this.mutationObserver}clickEventHandler(e){if(!(e.target instanceof HTMLElement)||!this.href){return}return this.dsoDocumentCardClick.emit({originalEvent:e,isModifiedEvent:i(e)})}get metaSlottedElement(){return this.host.querySelector("[slot='meta']")}render(){return n("div",{key:"fa7b46b5f893de1939b774c925d34f7f18e15571",class:"dso-document-card-container"},n("div",{key:"682a8fa1673b1c38ca16fc6f4f1a274719adb9f4",class:"dso-document-card-heading"},n("a",{key:"ee6c434a98e009753e38f92ef38580970025a58b",href:this.href,class:"heading-anchor",onClick:e=>this.clickEventHandler(e)},n("span",{key:"a14a1a16baafedd1806bf3417dea1135b9cfdb41",class:"icon-container"},n("dso-icon",{key:"843ee861b72689523ce5af6479a3aa1a9ffd84c2",icon:"chevron-right"}),n("slot",{key:"918b8e3797b99bd07902ab849f95e3a5b2bf1531",name:"heading"}))),this.metaSlottedElement!==null&&n("slot",{key:"226986aeeb3d0091f274697b67ebd8de3c358c53",name:"meta"})),n("div",{key:"e0d5195cfa6feb274e4df486b4ca5869f6654ada",class:"dso-document-card-type"},n("slot",{key:"089ae1f70596e1bff98b74acad76a0c6f00e665e",name:"type"})),n("div",{key:"6ae6d7023a4b045f7120977d5bccd9b3edaf5ccd",class:"dso-document-card-status"},n("slot",{key:"832d0c2fda8e6fab9ff211d3fbbdd3a8bdf3bbce",name:"status"})))}get host(){return o(this)}};c.style=d;export{c as dso_document_card};
+//# sourceMappingURL=p-55390fd2.entry.js.map

package/dist/dso-toolkit/{p-a61e4944.entry.js.map → p-55390fd2.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["documentCardCss","DocumentCard","connectedCallback","this","mutationObserver","MutationObserver","forceUpdate","host","observe","attributes","childList","disconnectedCallback","_a","disconnect","clickEventHandler","e","target","HTMLElement","href","dsoDocumentCardClick","emit","originalEvent","isModifiedEvent","metaSlottedElement","querySelector","render","h","key","class","onClick","icon","name"],"sources":["src/components/document-card/document-card.scss?tag=dso-document-card&encapsulation=shadow","src/components/document-card/document-card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/components/document-card\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.dso-document-card-container {\r\n  padding-block: units.$u2;\r\n  padding-inline: units.$u2;\r\n  inline-size: 100%;\r\n\r\n  .dso-document-card-heading {\r\n    align-items: center;\r\n    display: flex;\r\n\r\n    @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n      flex-wrap: wrap;\r\n    }\r\n  }\r\n\r\n  &:has(.dso-document-card-heading a:is(:hover, :focus-visible)) {\r\n    background-color: document-card.$background-color-hover;\r\n  }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n  .dso-document-card-container {\r\n    background-color: document-card.$background-color-active;\r\n  }\r\n}\r\n\r\n::slotted([slot=\"meta\"]) {\r\n  display: flex !important;\r\n  justify-content: space-between !important;\r\n  flex-shrink: 0 !important;\r\n  align-self: end !important;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n    flex-basis: 100% !important;\r\n    margin-block-start: units.$u2 !important;\r\n  }\r\n}\r\n\r\n::slotted([slot=\"heading\"]) {\r\n  display: inline !important;\r\n  color: colors.$bosgroen !important;\r\n  font-size: 1.125em !important;\r\n  font-weight: 700 !important;\r\n  line-height: 1.25 !important;\r\n  margin-block-end: 0 !important;\r\n  margin-block-start: 0 !important;\r\n}\r\n\r\n.heading-anchor {\r\n  color: document-card.$heading-anchor-color;\r\n  text-decoration: none;\r\n\r\n  &:hover {\r\n    color: document-card.$heading-anchor-hover-color;\r\n    text-decoration: underline;\r\n  }\r\n\r\n  &:visited {\r\n    color: document-card.$heading-anchor-color;\r\n  }\r\n\r\n  .sr-only {\r\n    @include utilities.sr-only();\r\n  }\r\n\r\n  .icon-container {\r\n    position: relative;\r\n    padding-inline-end: units.$u3;\r\n\r\n    dso-icon {\r\n      position: absolute;\r\n      inset-inline-end: 0;\r\n      inset-block-end: -3px;\r\n      block-size: units.$u3;\r\n      inline-size: units.$u3;\r\n    }\r\n  }\r\n}\r\n\r\n::slotted([slot=\"type\"]) {\r\n  --_dt-info-button-margin-inline-start: 0;\r\n\r\n  display: flex !important;\r\n  gap: units.$u1 !important;\r\n}\r\n\r\n.dso-document-card-heading + .dso-document-card-type,\r\n.dso-document-card-heading + .dso-document-card-status,\r\n.dso-document-card-type + .dso-document-card-status {\r\n  margin-block-start: units.$u1;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Prop, forceUpdate, h } from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { DocumentCardClickEvent } from \"./document-card.interfaces\";\r\n\r\n/**\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot meta - An optional slot to place a `Label` in.\r\n * @slot type - A slot to hold type of document with an optional `Toggletip`.\r\n * @slot status - A slot to hold some status information on the document.\r\n */\r\n@Component({\r\n  tag: \"dso-document-card\",\r\n  styleUrl: \"document-card.scss\",\r\n  shadow: true,\r\n})\r\nexport class DocumentCard implements ComponentInterface {\r\n  @Element()\r\n  host!: HTMLDsoDocumentCardElement;\r\n\r\n  /**\r\n   * The URL to which the DocumentCard heading links.\r\n   */\r\n  @Prop({ reflect: true })\r\n  href!: string | undefined;\r\n\r\n  /**\r\n   * Makes the DocumentCard active.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Emitted when the DocumentCard heading is clicked.\r\n   */\r\n  @Event()\r\n  dsoDocumentCardClick!: EventEmitter<DocumentCardClickEvent>;\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\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.dsoDocumentCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n  }\r\n\r\n  get metaSlottedElement() {\r\n    return this.host.querySelector(\"[slot='meta']\");\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"dso-document-card-container\">\r\n        <div class=\"dso-document-card-heading\">\r\n          <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n            <span class=\"icon-container\">\r\n              <dso-icon icon=\"chevron-right\" />\r\n              <slot name=\"heading\" />\r\n            </span>\r\n          </a>\r\n          {this.metaSlottedElement !== null && <slot name=\"meta\" />}\r\n        </div>\r\n        <div class=\"dso-document-card-type\">\r\n          <slot name=\"type\" />\r\n        </div>\r\n        <div class=\"dso-document-card-status\">\r\n          <slot name=\"status\" />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"+FAAA,MAAMA,EAAkB,4xD,MCiBXC,EAAY,M,oFAwBvB,iBAAAC,GACEC,KAAKC,iBAAmB,IAAIC,kBAAiB,IAAMC,EAAYH,KAAKI,QAEpEJ,KAAKC,iBAAiBI,QAAQL,KAAKI,KAAM,CAAEE,WAAY,KAAMC,UAAW,M,CAG1E,oBAAAC,G,OACEC,EAAAT,KAAKC,oBAAkB,MAAAQ,SAAA,SAAAA,EAAAC,oBAEhBV,KAAKC,gB,CAGN,iBAAAU,CAAkBC,GACxB,KAAMA,EAAEC,kBAAkBC,eAAiBd,KAAKe,KAAM,CACpD,M,CAGF,OAAOf,KAAKgB,qBAAqBC,KAAK,CAAEC,cAAeN,EAAGO,gBAAiBA,EAAgBP,I,CAG7F,sBAAIQ,GACF,OAAOpB,KAAKI,KAAKiB,cAAc,gB,CAGjC,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,+BACTF,EAAK,OAAAC,IAAA,2CAAAC,MAAM,6BACTF,EAAG,KAAAC,IAAA,2CAAAT,KAAMf,KAAKe,KAAMU,MAAM,iBAAiBC,QAAUd,GAAMZ,KAAKW,kBAAkBC,IAChFW,EAAM,QAAAC,IAAA,2CAAAC,MAAM,kBACVF,EAAU,YAAAC,IAAA,2CAAAG,KAAK,kBACfJ,EAAA,QAAAC,IAAA,2CAAMI,KAAK,cAGd5B,KAAKoB,qBAAuB,MAAQG,EAAA,QAAAC,IAAA,2CAAMI,KAAK,UAElDL,EAAK,OAAAC,IAAA,2CAAAC,MAAM,0BACTF,EAAA,QAAAC,IAAA,2CAAMI,KAAK,UAEbL,EAAK,OAAAC,IAAA,2CAAAC,MAAM,4BACTF,EAAA,QAAAC,IAAA,2CAAMI,KAAK,Y","ignoreList":[]}
+{"version":3,"names":["documentCardCss","DocumentCard","connectedCallback","this","mutationObserver","MutationObserver","forceUpdate","host","observe","attributes","childList","disconnectedCallback","_a","disconnect","clickEventHandler","e","target","HTMLElement","href","dsoDocumentCardClick","emit","originalEvent","isModifiedEvent","metaSlottedElement","querySelector","render","h","key","class","onClick","icon","name"],"sources":["src/components/document-card/document-card.scss?tag=dso-document-card&encapsulation=shadow","src/components/document-card/document-card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/components/document-card\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.dso-document-card-container {\r\n  padding-block: units.$u2;\r\n  padding-inline: units.$u2;\r\n  inline-size: 100%;\r\n\r\n  .dso-document-card-heading {\r\n    align-items: center;\r\n    display: flex;\r\n\r\n    @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n      flex-wrap: wrap;\r\n    }\r\n  }\r\n\r\n  &:has(.dso-document-card-heading a:is(:hover, :focus-visible)) {\r\n    background-color: document-card.$background-color-hover;\r\n  }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n  .dso-document-card-container {\r\n    background-color: document-card.$background-color-active;\r\n  }\r\n}\r\n\r\n::slotted([slot=\"meta\"]) {\r\n  display: flex !important;\r\n  justify-content: space-between !important;\r\n  flex-shrink: 0 !important;\r\n  align-self: end !important;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n    flex-basis: 100% !important;\r\n    margin-block-start: units.$u2 !important;\r\n  }\r\n}\r\n\r\n::slotted([slot=\"heading\"]) {\r\n  display: inline !important;\r\n  color: colors.$bosgroen !important;\r\n  font-size: 1.125em !important;\r\n  font-weight: 700 !important;\r\n  line-height: 1.25 !important;\r\n  margin-block-end: 0 !important;\r\n  margin-block-start: 0 !important;\r\n}\r\n\r\n.heading-anchor {\r\n  color: document-card.$heading-anchor-color;\r\n  text-decoration: none;\r\n\r\n  &:hover {\r\n    color: document-card.$heading-anchor-hover-color;\r\n    text-decoration: underline;\r\n  }\r\n\r\n  &:visited {\r\n    color: document-card.$heading-anchor-color;\r\n  }\r\n\r\n  .sr-only {\r\n    @include utilities.sr-only();\r\n  }\r\n\r\n  .icon-container {\r\n    position: relative;\r\n    padding-inline-end: units.$u3;\r\n\r\n    dso-icon {\r\n      position: absolute;\r\n      inset-inline-end: 0;\r\n      inset-block-end: -3px;\r\n      block-size: units.$u3;\r\n      inline-size: units.$u3;\r\n    }\r\n  }\r\n}\r\n\r\n::slotted([slot=\"type\"]) {\r\n  --_dt-info-button-margin-inline-start: 0;\r\n\r\n  display: flex !important;\r\n  gap: units.$u1 !important;\r\n}\r\n\r\n.dso-document-card-heading + .dso-document-card-type,\r\n.dso-document-card-heading + .dso-document-card-status,\r\n.dso-document-card-type + .dso-document-card-status {\r\n  margin-block-start: units.$u1;\r\n}\r\n","import { Component, ComponentInterface, Element, Event, EventEmitter, Prop, forceUpdate, h } from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { DocumentCardClickEvent } from \"./document-card.interfaces\";\r\n\r\n/**\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot meta - An optional slot to place a `Label` in.\r\n * @slot type - A slot to hold type of document with an optional `Toggletip`.\r\n * @slot status - A slot to hold some status information on the document.\r\n */\r\n@Component({\r\n  tag: \"dso-document-card\",\r\n  styleUrl: \"document-card.scss\",\r\n  shadow: true,\r\n})\r\nexport class DocumentCard implements ComponentInterface {\r\n  @Element()\r\n  host!: HTMLDsoDocumentCardElement;\r\n\r\n  /**\r\n   * The URL to which the DocumentCard heading links.\r\n   */\r\n  @Prop({ reflect: true })\r\n  href!: string | undefined;\r\n\r\n  /**\r\n   * Makes the DocumentCard active.\r\n   */\r\n  @Prop({ reflect: true })\r\n  active?: boolean;\r\n\r\n  /**\r\n   * Emitted when the DocumentCard heading is clicked.\r\n   */\r\n  @Event()\r\n  dsoDocumentCardClick!: EventEmitter<DocumentCardClickEvent>;\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\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.dsoDocumentCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n  }\r\n\r\n  get metaSlottedElement() {\r\n    return this.host.querySelector(\"[slot='meta']\");\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"dso-document-card-container\">\r\n        <div class=\"dso-document-card-heading\">\r\n          <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n            <span class=\"icon-container\">\r\n              <dso-icon icon=\"chevron-right\" />\r\n              <slot name=\"heading\" />\r\n            </span>\r\n          </a>\r\n          {this.metaSlottedElement !== null && <slot name=\"meta\" />}\r\n        </div>\r\n        <div class=\"dso-document-card-type\">\r\n          <slot name=\"type\" />\r\n        </div>\r\n        <div class=\"dso-document-card-status\">\r\n          <slot name=\"status\" />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"+FAAA,MAAMA,EAAkB,yxD,MCiBXC,EAAY,M,oFAwBvB,iBAAAC,GACEC,KAAKC,iBAAmB,IAAIC,kBAAiB,IAAMC,EAAYH,KAAKI,QAEpEJ,KAAKC,iBAAiBI,QAAQL,KAAKI,KAAM,CAAEE,WAAY,KAAMC,UAAW,M,CAG1E,oBAAAC,G,OACEC,EAAAT,KAAKC,oBAAkB,MAAAQ,SAAA,SAAAA,EAAAC,oBAEhBV,KAAKC,gB,CAGN,iBAAAU,CAAkBC,GACxB,KAAMA,EAAEC,kBAAkBC,eAAiBd,KAAKe,KAAM,CACpD,M,CAGF,OAAOf,KAAKgB,qBAAqBC,KAAK,CAAEC,cAAeN,EAAGO,gBAAiBA,EAAgBP,I,CAG7F,sBAAIQ,GACF,OAAOpB,KAAKI,KAAKiB,cAAc,gB,CAGjC,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,+BACTF,EAAK,OAAAC,IAAA,2CAAAC,MAAM,6BACTF,EAAG,KAAAC,IAAA,2CAAAT,KAAMf,KAAKe,KAAMU,MAAM,iBAAiBC,QAAUd,GAAMZ,KAAKW,kBAAkBC,IAChFW,EAAM,QAAAC,IAAA,2CAAAC,MAAM,kBACVF,EAAU,YAAAC,IAAA,2CAAAG,KAAK,kBACfJ,EAAA,QAAAC,IAAA,2CAAMI,KAAK,cAGd5B,KAAKoB,qBAAuB,MAAQG,EAAA,QAAAC,IAAA,2CAAMI,KAAK,UAElDL,EAAK,OAAAC,IAAA,2CAAAC,MAAM,0BACTF,EAAA,QAAAC,IAAA,2CAAMI,KAAK,UAEbL,EAAK,OAAAC,IAAA,2CAAAC,MAAM,4BACTF,EAAA,QAAAC,IAAA,2CAAMI,KAAK,Y","ignoreList":[]}