@dso-toolkit/core 79.0.0-pre.3 → 79.0.0

package/dist/cjs/dso-tabs.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"dso-tabs.entry.cjs.js","mappings":"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","names":["forceUpdate","h","Host"],"sources":["src/components/tabs/tabs.scss?tag=dso-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/components/link\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.tabs {\r\n  border-block-end: 1px solid colors.$grasgroen;\r\n  display: flex;\r\n  gap: 2px;\r\n  flex-wrap: wrap;\r\n  margin-block-end: units.$block-spacing-large;\r\n  padding-inline-start: 0;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n    border: 0;\r\n    display: block;\r\n  }\r\n}\r\n","import { Component, Element, Host, forceUpdate, h } from \"@stencil/core\";\r\n\r\n/**\r\n * @slot - The dso-tab elements. These should be direct children of the dso-tabs element.\r\n * @slot panel - The panel with the content for the active tab\r\n */\r\n@Component({\r\n  tag: \"dso-tabs\",\r\n  styleUrl: \"tabs.scss\",\r\n  shadow: true,\r\n})\r\nexport class Tabs {\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  host!: HTMLDsoTabsElement;\r\n\r\n  private get enabledTabs() {\r\n    // Only enabled tabs (not disabled) are needed for setting focus via ArrowRight and ArrowLeft\r\n    return Array.from(this.host.querySelectorAll<HTMLDsoTabElement>(\":scope > dso-tab\")).reduce<HTMLDsoTabElement[]>(\r\n      (tabs, tab) => {\r\n        if (!tab.disabled) {\r\n          tabs.push(tab);\r\n        }\r\n\r\n        return tabs;\r\n      },\r\n      [],\r\n    );\r\n  }\r\n\r\n  private get firstTab() {\r\n    return this.enabledTabs[0];\r\n  }\r\n\r\n  private get lastTab() {\r\n    return this.enabledTabs[this.enabledTabs.length - 1];\r\n  }\r\n\r\n  private moveFocusToTab(tab: HTMLDsoTabElement | undefined) {\r\n    tab?._dsoFocus();\r\n  }\r\n\r\n  private moveFocusToPreviousTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index - 1] ?? this.lastTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  private moveFocusToNextTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index + 1] ?? this.firstTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  // Keep track of tabs to set focus on next or previous enabled (not disabled) tab.\r\n  private keyUpHandler = (e: KeyboardEvent) => {\r\n    if (!(e.target instanceof HTMLElement)) {\r\n      return;\r\n    }\r\n\r\n    switch (e.key) {\r\n      case \"ArrowRight\":\r\n      case \"ArrowDown\":\r\n        this.moveFocusToNextTab(e.target);\r\n        break;\r\n      case \"ArrowLeft\":\r\n      case \"ArrowUp\":\r\n        this.moveFocusToPreviousTab(e.target);\r\n        break;\r\n      default:\r\n        return;\r\n    }\r\n  };\r\n\r\n  connectedCallback(): void {\r\n    this.mutationObserver ??= new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, { childList: true });\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"tabs\" role=\"tablist\" onKeyUp={this.keyUpHandler}>\r\n          <slot />\r\n        </div>\r\n        <div role=\"tabpanel\" tabindex=\"0\">\r\n          <slot name=\"panel\" />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"dso-tabs.entry.cjs.js","mappings":"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","names":["forceUpdate","h","Host"],"sources":["src/components/tabs/tabs.scss?tag=dso-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/components/link\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.tabs {\r\n  border-block-end: 1px solid colors.$grasgroen;\r\n  display: flex;\r\n  gap: 2px;\r\n  flex-wrap: wrap;\r\n  margin-block-end: units.$block-spacing-large;\r\n  padding-inline-start: 0;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n    border: 0;\r\n    display: block;\r\n  }\r\n}\r\n","import { Component, Element, Host, forceUpdate, h } from \"@stencil/core\";\r\n\r\n/**\r\n * @slot - The dso-tab elements. These should be direct children of the dso-tabs element.\r\n * @slot panel - The panel with the content for the active tab\r\n */\r\n@Component({\r\n  tag: \"dso-tabs\",\r\n  styleUrl: \"tabs.scss\",\r\n  shadow: true,\r\n})\r\nexport class Tabs {\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  host!: HTMLDsoTabsElement;\r\n\r\n  private get enabledTabs() {\r\n    // Only enabled tabs (not disabled) are needed for setting focus via ArrowRight and ArrowLeft\r\n    return Array.from(this.host.querySelectorAll<HTMLDsoTabElement>(\":scope > dso-tab\")).reduce<HTMLDsoTabElement[]>(\r\n      (tabs, tab) => {\r\n        if (!tab.disabled) {\r\n          tabs.push(tab);\r\n        }\r\n\r\n        return tabs;\r\n      },\r\n      [],\r\n    );\r\n  }\r\n\r\n  private get firstTab() {\r\n    return this.enabledTabs[0];\r\n  }\r\n\r\n  private get lastTab() {\r\n    return this.enabledTabs[this.enabledTabs.length - 1];\r\n  }\r\n\r\n  private moveFocusToTab(tab: HTMLDsoTabElement | undefined) {\r\n    tab?._dsoFocus();\r\n  }\r\n\r\n  private moveFocusToPreviousTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index - 1] ?? this.lastTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  private moveFocusToNextTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index + 1] ?? this.firstTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  // Keep track of tabs to set focus on next or previous enabled (not disabled) tab.\r\n  private keyUpHandler = (e: KeyboardEvent) => {\r\n    if (!(e.target instanceof HTMLElement)) {\r\n      return;\r\n    }\r\n\r\n    switch (e.key) {\r\n      case \"ArrowRight\":\r\n      case \"ArrowDown\":\r\n        this.moveFocusToNextTab(e.target);\r\n        break;\r\n      case \"ArrowLeft\":\r\n      case \"ArrowUp\":\r\n        this.moveFocusToPreviousTab(e.target);\r\n        break;\r\n      default:\r\n        return;\r\n    }\r\n  };\r\n\r\n  connectedCallback(): void {\r\n    this.mutationObserver ??= new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, { childList: true });\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"tabs\" role=\"tablist\" onKeyUp={this.keyUpHandler}>\r\n          <slot />\r\n        </div>\r\n        <div role=\"tabpanel\" tabindex=\"0\">\r\n          <slot name=\"panel\" />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/cjs/dso-tabs.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"dso-tabs.entry.cjs.js","sources":["src/components/tabs/tabs.scss?tag=dso-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/components/link\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.tabs {\r\n  border-block-end: 1px solid colors.$grasgroen;\r\n  display: flex;\r\n  gap: 2px;\r\n  flex-wrap: wrap;\r\n  margin-block-end: units.$block-spacing-large;\r\n  padding-inline-start: 0;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n    border: 0;\r\n    display: block;\r\n  }\r\n}\r\n","import { Component, Element, Host, forceUpdate, h } from \"@stencil/core\";\r\n\r\n/**\r\n * @slot - The dso-tab elements. These should be direct children of the dso-tabs element.\r\n * @slot panel - The panel with the content for the active tab\r\n */\r\n@Component({\r\n  tag: \"dso-tabs\",\r\n  styleUrl: \"tabs.scss\",\r\n  shadow: true,\r\n})\r\nexport class Tabs {\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  host!: HTMLDsoTabsElement;\r\n\r\n  private get enabledTabs() {\r\n    // Only enabled tabs (not disabled) are needed for setting focus via ArrowRight and ArrowLeft\r\n    return Array.from(this.host.querySelectorAll<HTMLDsoTabElement>(\":scope > dso-tab\")).reduce<HTMLDsoTabElement[]>(\r\n      (tabs, tab) => {\r\n        if (!tab.disabled) {\r\n          tabs.push(tab);\r\n        }\r\n\r\n        return tabs;\r\n      },\r\n      [],\r\n    );\r\n  }\r\n\r\n  private get firstTab() {\r\n    return this.enabledTabs[0];\r\n  }\r\n\r\n  private get lastTab() {\r\n    return this.enabledTabs[this.enabledTabs.length - 1];\r\n  }\r\n\r\n  private moveFocusToTab(tab: HTMLDsoTabElement | undefined) {\r\n    tab?._dsoFocus();\r\n  }\r\n\r\n  private moveFocusToPreviousTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index - 1] ?? this.lastTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  private moveFocusToNextTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index + 1] ?? this.firstTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  // Keep track of tabs to set focus on next or previous enabled (not disabled) tab.\r\n  private keyUpHandler = (e: KeyboardEvent) => {\r\n    if (!(e.target instanceof HTMLElement)) {\r\n      return;\r\n    }\r\n\r\n    switch (e.key) {\r\n      case \"ArrowRight\":\r\n      case \"ArrowDown\":\r\n        this.moveFocusToNextTab(e.target);\r\n        break;\r\n      case \"ArrowLeft\":\r\n      case \"ArrowUp\":\r\n        this.moveFocusToPreviousTab(e.target);\r\n        break;\r\n      default:\r\n        return;\r\n    }\r\n  };\r\n\r\n  connectedCallback(): void {\r\n    this.mutationObserver ??= new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, { childList: true });\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"tabs\" role=\"tablist\" onKeyUp={this.keyUpHandler}>\r\n          <slot />\r\n        </div>\r\n        <div role=\"tabpanel\" tabindex=\"0\">\r\n          <slot name=\"panel\" />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":["forceUpdate","h","Host"],"mappings":"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"}
+{"version":3,"file":"dso-tabs.entry.cjs.js","sources":["src/components/tabs/tabs.scss?tag=dso-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/scaffolding\";\r\n@use \"~dso-toolkit/src/variables/typography\";\r\n@use \"~dso-toolkit/src/components/link\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: block;\r\n}\r\n\r\n.tabs {\r\n  border-block-end: 1px solid colors.$grasgroen;\r\n  display: flex;\r\n  gap: 2px;\r\n  flex-wrap: wrap;\r\n  margin-block-end: units.$block-spacing-large;\r\n  padding-inline-start: 0;\r\n\r\n  @media screen and (max-width: media-query-breakpoints.$screen-xs-max) {\r\n    border: 0;\r\n    display: block;\r\n  }\r\n}\r\n","import { Component, Element, Host, forceUpdate, h } from \"@stencil/core\";\r\n\r\n/**\r\n * @slot - The dso-tab elements. These should be direct children of the dso-tabs element.\r\n * @slot panel - The panel with the content for the active tab\r\n */\r\n@Component({\r\n  tag: \"dso-tabs\",\r\n  styleUrl: \"tabs.scss\",\r\n  shadow: true,\r\n})\r\nexport class Tabs {\r\n  private mutationObserver?: MutationObserver;\r\n\r\n  @Element()\r\n  host!: HTMLDsoTabsElement;\r\n\r\n  private get enabledTabs() {\r\n    // Only enabled tabs (not disabled) are needed for setting focus via ArrowRight and ArrowLeft\r\n    return Array.from(this.host.querySelectorAll<HTMLDsoTabElement>(\":scope > dso-tab\")).reduce<HTMLDsoTabElement[]>(\r\n      (tabs, tab) => {\r\n        if (!tab.disabled) {\r\n          tabs.push(tab);\r\n        }\r\n\r\n        return tabs;\r\n      },\r\n      [],\r\n    );\r\n  }\r\n\r\n  private get firstTab() {\r\n    return this.enabledTabs[0];\r\n  }\r\n\r\n  private get lastTab() {\r\n    return this.enabledTabs[this.enabledTabs.length - 1];\r\n  }\r\n\r\n  private moveFocusToTab(tab: HTMLDsoTabElement | undefined) {\r\n    tab?._dsoFocus();\r\n  }\r\n\r\n  private moveFocusToPreviousTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index - 1] ?? this.lastTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  private moveFocusToNextTab(focussedTab: HTMLElement) {\r\n    const index = this.enabledTabs.findIndex((tab) => tab === focussedTab);\r\n    const next = this.enabledTabs[index + 1] ?? this.firstTab;\r\n\r\n    this.moveFocusToTab(next);\r\n  }\r\n\r\n  // Keep track of tabs to set focus on next or previous enabled (not disabled) tab.\r\n  private keyUpHandler = (e: KeyboardEvent) => {\r\n    if (!(e.target instanceof HTMLElement)) {\r\n      return;\r\n    }\r\n\r\n    switch (e.key) {\r\n      case \"ArrowRight\":\r\n      case \"ArrowDown\":\r\n        this.moveFocusToNextTab(e.target);\r\n        break;\r\n      case \"ArrowLeft\":\r\n      case \"ArrowUp\":\r\n        this.moveFocusToPreviousTab(e.target);\r\n        break;\r\n      default:\r\n        return;\r\n    }\r\n  };\r\n\r\n  connectedCallback(): void {\r\n    this.mutationObserver ??= new MutationObserver(() => forceUpdate(this.host));\r\n\r\n    this.mutationObserver.observe(this.host, { childList: true });\r\n  }\r\n\r\n  disconnectedCallback(): void {\r\n    this.mutationObserver?.disconnect();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div class=\"tabs\" role=\"tablist\" onKeyUp={this.keyUpHandler}>\r\n          <slot />\r\n        </div>\r\n        <div role=\"tabpanel\" tabindex=\"0\">\r\n          <slot name=\"panel\" />\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"names":["forceUpdate","h","Host"],"mappings":"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"}

package/dist/cjs/dso-toggletip.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-DvLsepiK.js');
 
-const toggletipCss = "@charset \"UTF-8\";*,*::after,*::before{box-sizing:border-box}:host{display:inline-block;--tooltip-margin-block-start:0;--tooltip-margin-inline-start:3px;--tooltip-margin-inline-end:units.$u1 * -1 !important}:host(:focus){outline:none;z-index:410}";
+const toggletipCss = "*,*::after,*::before{box-sizing:border-box}:host{display:inline-block;--tooltip-margin-block-start:0;--tooltip-margin-inline-start:3px;--tooltip-margin-inline-end:units.$u1 * -1 !important}:host(:focus){outline:none;z-index:410}";
 
 const Toggletip = class {
     constructor(hostRef) {

package/dist/cjs/dso-toggletip.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"dso-toggletip.entry.cjs.js","mappings":";;;;AAAA,MAAM,YAAY,GAAG,yPAAyP;;MCQjQ,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUE,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAK,CAAA,KAAA,GAAG,aAAa;AAErB;;AAEG;AAEH,QAAA,IAAQ,CAAA,QAAA,GAAc,OAAO;AAgBrB,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;AACnB,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,KAAK,EAAE;;iBACP;gBACL,IAAI,CAAC,IAAI,EAAE;;AAEf,SAAC;AAEO,QAAA,IAAI,CAAA,IAAA,GAAG,MAAK;AAClB,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;YAClB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;AAC/D,SAAC;AAEO,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;AAC9D,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAEO,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAiB,KAAI;AAC/C,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE;gBACpD,IAAI,CAAC,KAAK,EAAE;;AAEhB,SAAC;AAEO,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAoB,KAAI;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;gBACrD,IAAI,CAAC,KAAK,EAAE;gBACZ,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,QAAQ,EAAE;gBAC3B,KAAK,CAAC,cAAc,EAAE;;YAGxB;AACF,SAAC;AA2BF;IAzBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACED,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAA,EACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,CAAA,EACFA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,SAAS,EAAA,IAAA,EACT,WAAW,EAAA,IAAA,EACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA,EAEjBA,OAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACI,CACb;;;;;;;;","names":["h","Fragment"],"sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"dso-toggletip.entry.cjs.js","mappings":";;;;AAAA,MAAM,YAAY,GAAG,sOAAsO;;MCQ9O,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUE,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAK,CAAA,KAAA,GAAG,aAAa;AAErB;;AAEG;AAEH,QAAA,IAAQ,CAAA,QAAA,GAAc,OAAO;AAgBrB,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;AACnB,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,KAAK,EAAE;;iBACP;gBACL,IAAI,CAAC,IAAI,EAAE;;AAEf,SAAC;AAEO,QAAA,IAAI,CAAA,IAAA,GAAG,MAAK;AAClB,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;YAClB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;AAC/D,SAAC;AAEO,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;AAC9D,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAEO,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAiB,KAAI;AAC/C,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE;gBACpD,IAAI,CAAC,KAAK,EAAE;;AAEhB,SAAC;AAEO,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAoB,KAAI;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;gBACrD,IAAI,CAAC,KAAK,EAAE;gBACZ,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,QAAQ,EAAE;gBAC3B,KAAK,CAAC,cAAc,EAAE;;YAGxB;AACF,SAAC;AA2BF;IAzBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACED,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAA,EACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,CAAA,EACFA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,SAAS,EAAA,IAAA,EACT,WAAW,EAAA,IAAA,EACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA,EAEjBA,OAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACI,CACb;;;;;;;;","names":["h","Fragment"],"sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/cjs/dso-toggletip.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"dso-toggletip.entry.cjs.js","sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"names":["h","Fragment"],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,yPAAyP;;MCQjQ,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUE,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAK,CAAA,KAAA,GAAG,aAAa;AAErB;;AAEG;AAEH,QAAA,IAAQ,CAAA,QAAA,GAAc,OAAO;AAgBrB,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;AACnB,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,KAAK,EAAE;;iBACP;gBACL,IAAI,CAAC,IAAI,EAAE;;AAEf,SAAC;AAEO,QAAA,IAAI,CAAA,IAAA,GAAG,MAAK;AAClB,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;YAClB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;AAC/D,SAAC;AAEO,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;AAC9D,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAEO,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAiB,KAAI;AAC/C,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE;gBACpD,IAAI,CAAC,KAAK,EAAE;;AAEhB,SAAC;AAEO,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAoB,KAAI;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;gBACrD,IAAI,CAAC,KAAK,EAAE;gBACZ,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,QAAQ,EAAE;gBAC3B,KAAK,CAAC,cAAc,EAAE;;YAGxB;AACF,SAAC;AA2BF;IAzBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACED,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAA,EACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,CAAA,EACFA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,SAAS,EAAA,IAAA,EACT,WAAW,EAAA,IAAA,EACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA,EAEjBA,OAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACI,CACb;;;;;;;;"}
+{"version":3,"file":"dso-toggletip.entry.cjs.js","sources":["src/components/toggletip/toggletip.scss?tag=dso-toggletip&encapsulation=shadow","src/components/toggletip/toggletip.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/zindex\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n  display: inline-block;\r\n\r\n  // tooltip arrow placement exceptions\r\n  --tooltip-margin-block-start: 0;\r\n  --tooltip-margin-inline-start: 3px;\r\n  --tooltip-margin-inline-end: units.$u1 * -1 !important;\r\n}\r\n\r\n:host(:focus) {\r\n  outline: none;\r\n  z-index: zindex.$tooltip;\r\n}\r\n","import { Placement } from \"@popperjs/core\";\r\nimport { Component, Element, Fragment, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"dso-toggletip\",\r\n  styleUrl: \"toggletip.scss\",\r\n  shadow: true,\r\n})\r\nexport class Toggletip {\r\n  @Element()\r\n  host!: HTMLDsoToggletipElement;\r\n\r\n  @State()\r\n  active = false;\r\n\r\n  /**\r\n   * Toggletip label.\r\n   */\r\n  @Prop()\r\n  label = \"Toelichting\";\r\n\r\n  /**\r\n   * Toggletip position.\r\n   */\r\n  @Prop()\r\n  position: Placement = \"right\";\r\n\r\n  /**\r\n   * Set to true for small Toggletip.\r\n   */\r\n  @Prop()\r\n  small?: boolean;\r\n\r\n  /**\r\n   * Set to true for secondary Toggletip.\r\n   */\r\n  @Prop()\r\n  secondary?: boolean;\r\n\r\n  private infoButton?: HTMLDsoInfoButtonElement;\r\n\r\n  private click = () => {\r\n    if (this.active) {\r\n      this.close();\r\n    } else {\r\n      this.open();\r\n    }\r\n  };\r\n\r\n  private open = () => {\r\n    this.active = true;\r\n    this.host.addEventListener(\"keydown\", this.keyDownListener);\r\n    this.host.addEventListener(\"focusout\", this.focusOutListener);\r\n  };\r\n\r\n  private close = () => {\r\n    this.host.removeEventListener(\"focusout\", this.focusOutListener);\r\n    this.host.removeEventListener(\"keydown\", this.keyDownListener);\r\n    this.active = false;\r\n  };\r\n\r\n  private focusOutListener = (event: FocusEvent) => {\r\n    if (!this.host.contains(event.relatedTarget as Node)) {\r\n      this.close();\r\n    }\r\n  };\r\n\r\n  private keyDownListener = (event: KeyboardEvent) => {\r\n    if (!event.defaultPrevented && event.key === \"Escape\") {\r\n      this.close();\r\n      this.infoButton?.setFocus();\r\n      event.preventDefault();\r\n    }\r\n\r\n    return;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <>\r\n        <dso-info-button\r\n          aria-describedby=\"toggle\"\r\n          onClick={this.click}\r\n          label={this.label}\r\n          active={this.active}\r\n          secondary={this.secondary}\r\n          ref={(element) => (this.infoButton = element)}\r\n        />\r\n        <dso-tooltip\r\n          stateless\r\n          descriptive\r\n          id=\"toggle\"\r\n          strategy=\"absolute\"\r\n          active={this.active}\r\n          position={this.position}\r\n          small={this.small}\r\n        >\r\n          <slot />\r\n        </dso-tooltip>\r\n      </>\r\n    );\r\n  }\r\n}\r\n"],"names":["h","Fragment"],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,sOAAsO;;MCQ9O,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUE,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAEd;;AAEG;AAEH,QAAA,IAAK,CAAA,KAAA,GAAG,aAAa;AAErB;;AAEG;AAEH,QAAA,IAAQ,CAAA,QAAA,GAAc,OAAO;AAgBrB,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;AACnB,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,KAAK,EAAE;;iBACP;gBACL,IAAI,CAAC,IAAI,EAAE;;AAEf,SAAC;AAEO,QAAA,IAAI,CAAA,IAAA,GAAG,MAAK;AAClB,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI;YAClB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;AAC/D,SAAC;AAEO,QAAA,IAAK,CAAA,KAAA,GAAG,MAAK;YACnB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;AAC9D,YAAA,IAAI,CAAC,MAAM,GAAG,KAAK;AACrB,SAAC;AAEO,QAAA,IAAA,CAAA,gBAAgB,GAAG,CAAC,KAAiB,KAAI;AAC/C,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAqB,CAAC,EAAE;gBACpD,IAAI,CAAC,KAAK,EAAE;;AAEhB,SAAC;AAEO,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAoB,KAAI;;YACjD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;gBACrD,IAAI,CAAC,KAAK,EAAE;gBACZ,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,QAAQ,EAAE;gBAC3B,KAAK,CAAC,cAAc,EAAE;;YAGxB;AACF,SAAC;AA2BF;IAzBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACED,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,kBAAA,EACmB,QAAQ,EACzB,OAAO,EAAE,IAAI,CAAC,KAAK,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,UAAU,GAAG,OAAO,CAAC,EAC7C,CAAA,EACFA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,SAAS,EAAA,IAAA,EACT,WAAW,EAAA,IAAA,EACX,EAAE,EAAC,QAAQ,EACX,QAAQ,EAAC,UAAU,EACnB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAA,EAEjBA,OAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACI,CACb;;;;;;;;"}

package/dist/cjs/dso-tooltip.cjs.entry.js

@@ -1836,7 +1836,7 @@ function hasOverflow(el) {
     return overflowValues.indexOf(overflowX) !== -1 || overflowValues.indexOf(overflowY) !== -1;
 }
 
-const tooltipCss = "@charset \"UTF-8\";:host(.hidden){visibility:hidden}*,*::after,*::before{box-sizing:border-box}.tooltip{font-family:Asap, sans-serif;font-style:normal;font-weight:400;line-height:1.5;line-break:auto;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;overflow-wrap:anywhere;word-spacing:normal;word-wrap:normal;white-space:normal;--link-color:#39870c;display:block;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));font-size:14px;opacity:0;position:absolute;transition:opacity 0.15s linear;z-index:410}.tooltip.in{opacity:1}.tooltip.in .tooltip-inner{max-block-size:200vh;overflow:auto;visibility:visible;padding-block:8px;padding-inline:16px}.tooltip:not(.in) .tooltip-inner{max-block-size:0;overflow:hidden;visibility:hidden;transition:all 0s linear 0.15s}.tooltip .tooltip-inner{background-color:#fff;border-radius:4px;color:#191919;display:inline-block;font-size:1rem;max-inline-size:640px;position:relative}.tooltip .tooltip-inner.dso-small{max-inline-size:320px}.tooltip .tooltip-arrow{border-color:transparent;border-style:solid;block-size:0;inline-size:0}.tooltip[data-popper-placement=top]{margin-block-start:-3px;padding-inline:0}.tooltip[data-popper-placement=top] .tooltip-arrow{inset-block-end:0;border-block-start-color:#fff;border-width:6px;border-block-end-width:0;margin-inline-start:var(--tooltip-margin-inline-start, -3px)}.tooltip[data-popper-placement=right]{margin-inline-start:3px;padding-inline-start:6px}.tooltip[data-popper-placement=right] .tooltip-arrow{inset-inline-start:0;border-inline-end-color:#fff;border-width:6px;border-inline-start-width:0;margin-block-start:var(--tooltip-margin-block-start, -3px)}.tooltip[data-popper-placement=bottom]{margin-block-start:3px;padding-block-start:6px;padding-inline:0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{inset-block-start:0;border-block-end-color:#fff;border-width:6px;border-block-start-width:0;margin-inline-start:var(--tooltip-margin-inline-start, -3px)}.tooltip[data-popper-placement=left]{margin-inline-start:-3px;margin-inline-end:var(--tooltip-margin-inline-end, unset);padding-block:0;padding-inline-end:6px}.tooltip[data-popper-placement=left] .tooltip-arrow{inset-inline-end:0;border-inline-start-color:#fff;border-width:6px;border-inline-end-width:0;margin-block-start:var(--tooltip-margin-block-start, -3px)}";
+const tooltipCss = ":host(.hidden){visibility:hidden}*,*::after,*::before{box-sizing:border-box}.tooltip{font-family:Asap, sans-serif;font-style:normal;font-weight:400;line-height:1.5;line-break:auto;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;overflow-wrap:anywhere;word-spacing:normal;word-wrap:normal;white-space:normal;--link-color:#39870c;display:block;filter:drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));font-size:14px;opacity:0;position:absolute;transition:opacity 0.15s linear;z-index:410}.tooltip.in{opacity:1}.tooltip.in .tooltip-inner{max-block-size:200vh;overflow:auto;visibility:visible;padding-block:8px;padding-inline:16px}.tooltip:not(.in) .tooltip-inner{max-block-size:0;overflow:hidden;visibility:hidden;transition:all 0s linear 0.15s}.tooltip .tooltip-inner{background-color:#fff;border-radius:4px;color:#191919;display:inline-block;font-size:1rem;max-inline-size:640px;position:relative}.tooltip .tooltip-inner.dso-small{max-inline-size:320px}.tooltip .tooltip-arrow{border-color:transparent;border-style:solid;block-size:0;inline-size:0}.tooltip[data-popper-placement=top]{margin-block-start:-3px;padding-inline:0}.tooltip[data-popper-placement=top] .tooltip-arrow{inset-block-end:0;border-block-start-color:#fff;border-width:6px;border-block-end-width:0;margin-inline-start:var(--tooltip-margin-inline-start, -3px)}.tooltip[data-popper-placement=right]{margin-inline-start:3px;padding-inline-start:6px}.tooltip[data-popper-placement=right] .tooltip-arrow{inset-inline-start:0;border-inline-end-color:#fff;border-width:6px;border-inline-start-width:0;margin-block-start:var(--tooltip-margin-block-start, -3px)}.tooltip[data-popper-placement=bottom]{margin-block-start:3px;padding-block-start:6px;padding-inline:0}.tooltip[data-popper-placement=bottom] .tooltip-arrow{inset-block-start:0;border-block-end-color:#fff;border-width:6px;border-block-start-width:0;margin-inline-start:var(--tooltip-margin-inline-start, -3px)}.tooltip[data-popper-placement=left]{margin-inline-start:-3px;margin-inline-end:var(--tooltip-margin-inline-end, unset);padding-block:0;padding-inline-end:6px}.tooltip[data-popper-placement=left] .tooltip-arrow{inset-inline-end:0;border-inline-start-color:#fff;border-width:6px;border-inline-end-width:0;margin-block-start:var(--tooltip-margin-block-start, -3px)}";
 
 var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
     if (kind === "a" && !f)