@zanichelli/albe-web-components 19.3.0-RC6 → 19.3.0

package/www/build/p-da213c6e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZPopover","constructor","hostRef","this","position","PopoverPosition","TOP","open","showArrow","center","closable","spaceTolerance","closePopoverWithKeyboard","e","key","KeyboardCode","ESC","stopPropagation","handleOutsideClick","target","containsElement","host","boundElement","validatePosition","newValue","Object","values","includes","AUTO","currentPosition","setPosition","onOpen","cancelAnimationFrame","animationFrameRequestId","openChange","emit","assign","style","top","right","bottom","left","maxWidth","maxHeight","visibility","undefined","updatePositionLoop","requestAnimationFrame","setTimeout","onBindingChange","findBoundElement","offsetModifier","bindTo","ownerDocument","querySelector","getParentElement","tagName","toLowerCase","hasCenteredHorizontalSpace","availableLeft","availableRight","hostWidth","boundElementWidth","requiredSideSpace","hasCenteredVerticalSpace","availableTop","availableBottom","hostHeight","boundElementHeight","hasEnoughSideSpace","availableSpace","hostSize","boundElementSize","getOptimalPopoverPosition","desiredPosition","offsetWidth","offsetHeight","getBoundingClientRect","width","height","fits","pos","TOP_RIGHT","TOP_LEFT","RIGHT","RIGHT_BOTTOM","RIGHT_TOP","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","LEFT","LEFT_TOP","LEFT_BOTTOM","positions","positionOrder","startIndex","indexOf","i","length","posIndex","findBestFallbackPosition","bestHorizontalDirection","bestVerticalDirection","maxHorizontalSpace","Math","max","maxVerticalSpace","mainDirection","needsSecondaryDirection","minHorizontalSpace","min","minVerticalSpace","secondaryDirection","findScrollableAncestor","element","parent","documentElement","getComputedStyle","overflow","overflowX","overflowY","hasHiddenOverflow","isScrollable","scrollHeight","clientHeight","scrollWidth","clientWidth","calculateAvailableSpace","boundElementRect","lastBoundRect","x","y","cachedAvailableSpace","scrollableAncestor","scrollableAncestorRect","isScrollableAncestorNested","documentWidth","documentHeight","safeSpace","deltaTop","deltaRight","deltaBottom","deltaLeft","getBoundElementOffsets","elementRect","computePositionOffsets","boundElementOffsets","containingBlockAncestor","findContainingBlockAncestor","isDocumentElement","containingBlockRect","containingBlockStyle","paddingBox","parseFloat","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","relativeOffsets","scrollTop","scrollLeft","applyPositionStyles","arrowModifier","hostStyle","distanceFromBound","marginTop","replace","positionOffsets","leftBase","rightBase","topBase","bottomBase","sideTopBase","sideBottomBase","getDevice","Device","MOBILE","isElementVisibleInContainer","positionChange","componentWillLoad","componentDidLoad","disconnectedCallback","render","h","Host"],"sources":["src/components/z-popover/styles.css?tag=z-popover&encapsulation=shadow","src/components/z-popover/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --z-popover-theme--surface: background color of the popover.\n   * @prop --z-popover-theme--text: foreground color of the popover.\n   * @prop --z-popover-padding: padding of the popover.\n   * @prop --z-popover-shadow-filter: drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n   */\n  --z-popover-theme--surface: ;\n  --z-popover-theme--text: ;\n  --z-popover-padding: ;\n  --z-popover-shadow-filter: ;\n\n  position: fixed;\n  display: none;\n  max-width: calc(100dvw - var(--grid-margin) * 2);\n  max-height: calc(100dvh - var(--grid-margin) * 2);\n  padding: var(--z-popover-padding, 0);\n  background: var(--z-popover-theme--surface, var(--color-surface01));\n  border-radius: var(--border-radius-small);\n  color: var(--z-popover-theme--text, var(--color-default-text));\n  fill: currentcolor;\n  filter: var(--z-popover-shadow-filter, drop-shadow(0 1px 2px var(--shadow-color-base)));\n  text-align: center;\n  visibility: hidden; /* hidden by default. the positioning algorithm will set it to 'visible' when needed */\n}\n\n:host([open]:not([open=\"false\"])[current-position]) {\n  display: block;\n}\n\n:host([center][current-position=\"top\"]),\n:host([center][current-position=\"bottom\"]) {\n  transform: translateX(-50%);\n}\n\n:host([center][current-position=\"right\"]),\n:host([center][current-position=\"left\"]) {\n  transform: translateY(-50%);\n}\n\n:host([current-position^=\"top\"]) {\n  margin: 0 0 var(--space-unit);\n}\n\n:host([current-position^=\"bottom\"]) {\n  margin: var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"left\"]) {\n  margin: 0 var(--space-unit) 0 0;\n}\n\n:host([current-position^=\"right\"]) {\n  margin: 0 0 0 var(--space-unit);\n}\n\n/* Arrow style */\n:host([current-position])::before {\n  --arrow-size: 6px;\n  --arrow-edge-offset: calc(100% - var(--space-unit) - (var(--arrow-size) / 2));\n  --arrow-center-x-offset: calc(50% - (var(--arrow-size) / 2));\n  --arrow-center-y-offset: calc(100% - (var(--arrow-size) / 2));\n\n  position: absolute;\n  display: block;\n  width: var(--arrow-size);\n  height: var(--arrow-size);\n  background: var(--z-popover-theme--surface, var(--color-surface01));\n  content: \"\";\n  transform: rotate(45deg);\n}\n\n:host([show-arrow=\"false\"])::before,\n:host(:not([show-arrow]))::before {\n  display: none;\n}\n\n:host([current-position^=\"top\"])::before {\n  top: var(--arrow-center-y-offset);\n}\n\n:host([current-position^=\"bottom\"])::before {\n  bottom: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top\"])::before,\n:host([current-position=\"bottom\"])::before {\n  right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before,\n:host([current-position=\"left\"])::before {\n  bottom: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right\"])::before {\n  right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left\"])::before {\n  left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"top_right\"])::before,\n:host([current-position=\"bottom_right\"])::before {\n  right: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"top_left\"])::before,\n:host([current-position=\"bottom_left\"])::before {\n  left: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"left_top\"])::before {\n  top: var(--arrow-edge-offset);\n}\n\n:host([current-position=\"right_top\"])::before,\n:host([current-position=\"right_bottom\"])::before {\n  right: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"left_top\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n  left: var(--arrow-center-y-offset);\n}\n\n:host([current-position=\"right_bottom\"])::before,\n:host([current-position=\"left_bottom\"])::before {\n  bottom: var(--arrow-edge-offset);\n}\n\n:host([center][current-position=\"top\"])::before,\n:host([center][current-position=\"bottom\"])::before {\n  right: auto;\n  left: var(--arrow-center-x-offset);\n}\n\n:host([center][current-position=\"right\"])::before,\n:host([center][current-position=\"left\"])::before {\n  top: var(--arrow-center-x-offset);\n  bottom: auto;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {Device, KeyboardCode, PopoverPosition} from \"../../beans\";\nimport {\n  containsElement,\n  findContainingBlockAncestor,\n  getDevice,\n  getParentElement,\n  isElementVisibleInContainer,\n} from \"../../utils/utils\";\n\n/** Centering offset modifier. 0 for no offset, 0.5 for centering. */\ntype OffsetModifier = 0 | 0.5;\ntype Offsets = {top: number; right: number; bottom: number; left: number};\n\n/**\n * Popover component.\n * This component displays a popover bound to an element.\n * It supports various positions and can automatically adjust it based on available space, accounting for scrollable containers.\n *\n * Notes:\n * - If positioning has an odd behavior, consider manually adjusting the size of the slotted elements (using `width`, `height`, `max-width`, `max-height`, etc...) when its content is \"fluid\" (like text), because it can interfere with the position calculation (for example a long text on one single line can be bigger than the available space, letting the algorithm think the popover doesn't fits).\n */\n@Component({\n  tag: \"z-popover\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZPopover implements ComponentInterface {\n  /**\n   * The preferred position to render the popover.\n   * The popover will automatically search another position if not enough space is available for the preferred position.\n   * If the preferred position is not available, it will try to find the best position starting from `TOP` and going clockwise.\n   */\n  @Prop({reflect: true, mutable: true})\n  position?: PopoverPosition = PopoverPosition.TOP;\n\n  /**\n   * The initial open state of the popover.\n   * Internal changes of this prop are emitted through the `openChange` event.\n   * Make sure to listen to that event if you need the updated state of the popover from the outside, to avoid inconsistent values.\n   */\n  @Prop({reflect: true, mutable: true})\n  open = false;\n\n  /**\n   * The selector or the element bound with the popover.\n   * If string css selector is provided make sure to use a valid selector.\n   */\n  @Prop()\n  bindTo?: string | HTMLElement;\n\n  /** Whether to show popover's arrow. */\n  @Prop({reflect: true})\n  showArrow = false;\n\n  /** Whether to center the popup on the main side (according to \"position\"). */\n  @Prop({reflect: true})\n  center = false;\n\n  /**\n   * Whether the popover can be closed by clicking outside of it or pressing the escape key.\n   * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n   * Default: `true`.\n   */\n  @Prop()\n  closable = true;\n\n  /**\n   * The current position of the popover.\n   * It differs from `position` only when calculated automatically for space reasons.\n   */\n  @State()\n  currentPosition?: PopoverPosition;\n\n  @Element() host: HTMLZPopoverElement;\n\n  // Clockwise order of positions.\n  private static readonly positionOrder: PopoverPosition[] = [\n    PopoverPosition.TOP,\n    PopoverPosition.TOP_RIGHT,\n    PopoverPosition.TOP_LEFT,\n    PopoverPosition.RIGHT,\n    PopoverPosition.RIGHT_BOTTOM,\n    PopoverPosition.RIGHT_TOP,\n    PopoverPosition.BOTTOM,\n    PopoverPosition.BOTTOM_LEFT,\n    PopoverPosition.BOTTOM_RIGHT,\n    PopoverPosition.LEFT,\n    PopoverPosition.LEFT_TOP,\n    PopoverPosition.LEFT_BOTTOM,\n  ] as const;\n\n  private animationFrameRequestId?: number;\n\n  /** space tolerance for space calculations */\n  private readonly spaceTolerance = 3;\n\n  /** The element bound to the popover. */\n  private boundElement?: HTMLElement;\n\n  /** Cached available space around the bound element to avoid unnecessary recalculations */\n  private cachedAvailableSpace?: Offsets;\n\n  /** Last bounding rect of the bound element to detect changes and eventually invalidate the caches. */\n  private lastBoundRect?: DOMRect;\n\n  /** Fired when the position changes. */\n  @Event()\n  positionChange: EventEmitter<{position: PopoverPosition}>;\n\n  /** Event emitted when the open state of the popover changes (e.g. when the user clicks outside the popover to close it, if `closable` is true). */\n  @Event()\n  openChange: EventEmitter<{open: boolean}>;\n\n  @Listen(\"keyup\", {target: \"window\", capture: true})\n  closePopoverWithKeyboard(e: KeyboardEvent): void {\n    if (this.closable && e.key === KeyboardCode.ESC) {\n      e.stopPropagation();\n      this.open = false;\n    }\n  }\n\n  /**\n   * Close the popover when clicking outside of its content.\n   * Stop event propagation if the click was fired by popover's trigger element,\n   * to prevent close and reopen glitches.\n   */\n  @Listen(\"click\", {target: \"body\", capture: true})\n  handleOutsideClick(e: MouseEvent): void {\n    const target = e.target as Element;\n    if (!this.closable || !this.open || containsElement(this.host, target)) {\n      return;\n    }\n\n    if (containsElement(this.boundElement, target)) {\n      // stop propagation if the click was on the trigger element to prevent close and reopen glitches\n      e.stopPropagation();\n    }\n    this.open = false;\n  }\n\n  @Watch(\"position\")\n  validatePosition(newValue: PopoverPosition): void {\n    if (!Object.values(PopoverPosition).includes(newValue as PopoverPosition) || newValue === PopoverPosition.AUTO) {\n      newValue = PopoverPosition.TOP;\n      this.position = newValue;\n    }\n    this.currentPosition = newValue;\n    if (this.open) {\n      this.setPosition();\n    }\n  }\n\n  /** Setup popover behaviors when `open` changes. */\n  @Watch(\"open\")\n  onOpen(): void {\n    cancelAnimationFrame(this.animationFrameRequestId);\n    this.openChange.emit({open: this.open});\n    if (!this.open) {\n      Object.assign(this.host.style, {\n        // Reset all positioning properties\n        top: \"auto\",\n        right: \"auto\",\n        bottom: \"auto\",\n        left: \"auto\",\n        maxWidth: \"\",\n        maxHeight: \"\",\n        // Set initial visibility to hidden while calculating position...\n        visibility: \"hidden\",\n      });\n      this.currentPosition = undefined;\n\n      return;\n    }\n\n    const updatePositionLoop = (): void => {\n      if (!this.open) {\n        return;\n      }\n\n      this.setPosition();\n      this.animationFrameRequestId = requestAnimationFrame(updatePositionLoop);\n    };\n\n    // call `setPosition` after a tick to ensure the DOM is ready and sizes are available\n    setTimeout(() => {\n      updatePositionLoop();\n    }, 0);\n  }\n\n  @Watch(\"bindTo\")\n  onBindingChange(): void {\n    this.findBoundElement();\n  }\n\n  /** Returns the offset modifier to use in calculations to align the popover with the bound element. */\n  private get offsetModifier(): OffsetModifier {\n    return this.center ? 0.5 : 0;\n  }\n\n  private findBoundElement(): void {\n    if (typeof this.bindTo === \"string\") {\n      this.boundElement = this.host.ownerDocument.querySelector(this.bindTo) as HTMLElement;\n    } else if (this.bindTo) {\n      this.boundElement = this.bindTo;\n    } else {\n      this.boundElement = getParentElement(this.host) as HTMLElement;\n      if (this.boundElement.tagName.toLowerCase() === \"z-tooltip\") {\n        // If the popover is used inside a tooltip without a specified `bindTo`, bind it to the parent of the tooltip.\n        this.boundElement = getParentElement(this.boundElement) as HTMLElement;\n      }\n    }\n  }\n\n  /**\n   * Check if element has enough space to the right and left to be centered.\n   * Used for `TOP` and `BOTTOM` position.\n   * When `center` is not enabled, only one side needs to be checked and `RIGHT` is the default.\n   */\n  private hasCenteredHorizontalSpace(\n    availableLeft: number,\n    availableRight: number,\n    hostWidth: number,\n    boundElementWidth: number\n  ): boolean {\n    const requiredSideSpace = (hostWidth - boundElementWidth) * (1 - this.offsetModifier);\n\n    if (!this.center) {\n      return availableRight >= requiredSideSpace - this.spaceTolerance;\n    }\n\n    return (\n      availableRight >= requiredSideSpace - this.spaceTolerance &&\n      availableLeft >= requiredSideSpace - this.spaceTolerance\n    );\n  }\n\n  /**\n   * Check if element has enough space to the top and bottom to be centered.\n   * Used for `RIGHT` and `LEFT` position.\n   * When `center` is not enabled, only one side needs to be checked and `BOTTOM` is the default.\n   */\n  private hasCenteredVerticalSpace(\n    availableTop: number,\n    availableBottom: number,\n    hostHeight: number,\n    boundElementHeight: number\n  ): boolean {\n    const requiredSideSpace = (hostHeight - boundElementHeight) * (1 - this.offsetModifier);\n\n    if (!this.center) {\n      return availableBottom >= requiredSideSpace - this.spaceTolerance;\n    }\n\n    return (\n      availableTop >= requiredSideSpace - this.spaceTolerance &&\n      availableBottom >= requiredSideSpace - this.spaceTolerance\n    );\n  }\n\n  /**\n   * Check if there is enough space in the given direction to fit the popover.\n   * Used for composed positions like TOP_RIGHT, LEFT_BOTTOM, etc.\n   */\n  private hasEnoughSideSpace(\n    availableSpace: number,\n    hostSize: number,\n    boundElementSize: number,\n    offsetModifier: OffsetModifier\n  ): boolean {\n    return availableSpace >= hostSize - boundElementSize * (1 - offsetModifier) - this.spaceTolerance;\n  }\n\n  /**\n   * Given a desired position and available space around the bound element, returns the best position\n   * that fits the popover, trying all positions if needed.\n   * Takes into account offsetModifier for centering.\n   * @param desiredPosition The desired position of the popover.\n   * @param availableSpace The available space around the bound element.\n   */\n  private getOptimalPopoverPosition(desiredPosition: PopoverPosition, availableSpace: Offsets): PopoverPosition {\n    const hostWidth = this.host.offsetWidth;\n    const hostHeight = this.host.offsetHeight;\n    const boundElementWidth = this.boundElement.getBoundingClientRect().width;\n    const boundElementHeight = this.boundElement.getBoundingClientRect().height;\n    const offsetModifier = this.offsetModifier;\n\n    /** Check if there is enough space to fit the popover in the desired position */\n    const fits = (pos: PopoverPosition): boolean => {\n      switch (pos) {\n        case PopoverPosition.TOP:\n          return (\n            availableSpace.top >= hostHeight - this.spaceTolerance &&\n            this.hasCenteredHorizontalSpace(availableSpace.left, availableSpace.right, hostWidth, boundElementWidth)\n          );\n        case PopoverPosition.TOP_RIGHT:\n          return (\n            availableSpace.top >= hostHeight &&\n            this.hasEnoughSideSpace(availableSpace.right, hostWidth, boundElementWidth, offsetModifier)\n          );\n        case PopoverPosition.TOP_LEFT:\n          return (\n            availableSpace.top >= hostHeight &&\n            this.hasEnoughSideSpace(availableSpace.left, hostWidth, boundElementWidth, offsetModifier)\n          );\n        case PopoverPosition.RIGHT:\n          return (\n            availableSpace.right >= hostWidth &&\n            this.hasCenteredVerticalSpace(availableSpace.top, availableSpace.bottom, hostHeight, boundElementHeight)\n          );\n        case PopoverPosition.RIGHT_BOTTOM:\n          return (\n            availableSpace.right >= hostWidth &&\n            this.hasEnoughSideSpace(availableSpace.bottom, hostHeight, boundElementHeight, offsetModifier)\n          );\n        case PopoverPosition.RIGHT_TOP:\n          return (\n            availableSpace.right >= hostWidth &&\n            this.hasEnoughSideSpace(availableSpace.top, hostHeight, boundElementHeight, offsetModifier)\n          );\n        case PopoverPosition.BOTTOM:\n          return (\n            availableSpace.bottom >= hostHeight &&\n            this.hasCenteredHorizontalSpace(availableSpace.left, availableSpace.right, hostWidth, boundElementWidth)\n          );\n        case PopoverPosition.BOTTOM_LEFT:\n          return (\n            availableSpace.bottom >= hostHeight &&\n            this.hasEnoughSideSpace(availableSpace.left, hostWidth, boundElementWidth, offsetModifier)\n          );\n        case PopoverPosition.BOTTOM_RIGHT:\n          return (\n            availableSpace.bottom >= hostHeight &&\n            this.hasEnoughSideSpace(availableSpace.right, hostWidth, boundElementWidth, offsetModifier)\n          );\n        case PopoverPosition.LEFT:\n          return (\n            availableSpace.left >= hostWidth &&\n            this.hasCenteredVerticalSpace(availableSpace.top, availableSpace.bottom, hostHeight, boundElementHeight)\n          );\n        case PopoverPosition.LEFT_TOP:\n          return (\n            availableSpace.left >= hostWidth &&\n            this.hasEnoughSideSpace(availableSpace.top, hostHeight, boundElementHeight, offsetModifier)\n          );\n        case PopoverPosition.LEFT_BOTTOM:\n          return (\n            availableSpace.left >= hostWidth &&\n            this.hasEnoughSideSpace(availableSpace.bottom, hostHeight, boundElementHeight, offsetModifier)\n          );\n\n        default:\n          return false;\n      }\n    };\n\n    // Check desired position first\n    if (fits(desiredPosition)) {\n      return desiredPosition;\n    }\n\n    // Find position index and create rotation starting from next position\n    const positions = ZPopover.positionOrder;\n    const startIndex = positions.indexOf(desiredPosition);\n\n    if (startIndex === -1) {\n      return desiredPosition; // fallback if position not found\n    }\n\n    // Try all other positions starting from the next one\n    for (let i = 1; i < positions.length; i++) {\n      const posIndex = (startIndex + i) % positions.length;\n      const pos = positions[posIndex];\n      if (fits(pos)) {\n        return pos;\n      }\n    }\n\n    return this.findBestFallbackPosition(availableSpace);\n  }\n\n  /** Find the best fallback position based on available space when no position fits perfectly. */\n  private findBestFallbackPosition(availableSpace: Offsets): PopoverPosition {\n    // Determine which horizontal and vertical direction has the most available space\n    const bestHorizontalDirection =\n      availableSpace.right >= availableSpace.left ? PopoverPosition.RIGHT : PopoverPosition.LEFT;\n\n    const bestVerticalDirection =\n      availableSpace.bottom >= availableSpace.top ? PopoverPosition.BOTTOM : PopoverPosition.TOP;\n\n    // Choose the main direction based on which axis has more space overall\n    const maxHorizontalSpace = Math.max(availableSpace.right, availableSpace.left);\n    const maxVerticalSpace = Math.max(availableSpace.bottom, availableSpace.top);\n\n    const mainDirection = maxVerticalSpace >= maxHorizontalSpace ? bestVerticalDirection : bestHorizontalDirection;\n\n    // Decide if a secondary direction is needed\n    // Only add a secondary direction if the difference between min and max in that axis is at least double\n    let needsSecondaryDirection = false;\n\n    if (mainDirection === bestVerticalDirection) {\n      // If main direction is vertical, check horizontal space difference\n      const minHorizontalSpace = Math.min(availableSpace.right, availableSpace.left);\n      needsSecondaryDirection = maxHorizontalSpace >= minHorizontalSpace * 2;\n    } else {\n      // If main direction is horizontal, check vertical space difference\n      const minVerticalSpace = Math.min(availableSpace.bottom, availableSpace.top);\n      needsSecondaryDirection = maxVerticalSpace >= minVerticalSpace * 2;\n    }\n\n    if (!needsSecondaryDirection) {\n      return mainDirection;\n    }\n\n    const secondaryDirection =\n      mainDirection === bestVerticalDirection ? bestHorizontalDirection : bestVerticalDirection;\n\n    // Return a combined position (e.g., \"bottom_right\")\n    return `${mainDirection}_${secondaryDirection}` as PopoverPosition;\n  }\n\n  /**\n   * Find the nearest scrollable ancestor of an element to take as a reference for positioning.\n   * The ancestor is considered scrollable if it doesn't have `overflow` property set to `hidden` and its scroll size is bigger than its client size.\n   */\n  private findScrollableAncestor(element: HTMLElement): HTMLElement {\n    let parent = getParentElement(element);\n\n    while (parent) {\n      if (parent === element.ownerDocument.documentElement) {\n        return parent as HTMLElement;\n      }\n\n      const style = getComputedStyle(parent);\n      const {overflow, overflowX, overflowY} = style;\n      const hasHiddenOverflow = overflow === \"hidden\" || overflowY === \"hidden\" || overflowX === \"hidden\";\n      const isScrollable =\n        (parent.scrollHeight > parent.clientHeight && overflow !== \"visible\" && overflowY !== \"visible\") ||\n        (parent.scrollWidth > parent.clientWidth && overflow !== \"visible\" && overflowX !== \"visible\");\n\n      if (!hasHiddenOverflow && isScrollable) {\n        return parent as HTMLElement;\n      }\n\n      parent = getParentElement(parent);\n    }\n\n    return element.ownerDocument.documentElement;\n  }\n\n  /**\n   * Calculate available space around the element bound with the popover, based on its nearest scrollable ancestor.\n   *\n   * Calculations for `right` and `bottom` can be a little bit confusing because `boundingRect.right` and `bottom` may not be what you expect...\n   * For more information see the explanation in the docs.\n   * @link https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#return_value\n   */\n  private calculateAvailableSpace(): Offsets {\n    const boundElementRect = this.boundElement.getBoundingClientRect();\n\n    if (\n      this.lastBoundRect &&\n      this.lastBoundRect.x === boundElementRect.x &&\n      this.lastBoundRect.y === boundElementRect.y &&\n      this.lastBoundRect.width === boundElementRect.width &&\n      this.lastBoundRect.height === boundElementRect.height &&\n      this.cachedAvailableSpace\n    ) {\n      // If the bound element's rect hasn't changed, return the cached rect\n      return this.cachedAvailableSpace;\n    }\n\n    this.lastBoundRect = boundElementRect;\n    const scrollableAncestor = this.findScrollableAncestor(this.boundElement);\n    const scrollableAncestorRect = scrollableAncestor.getBoundingClientRect();\n    const isScrollableAncestorNested = scrollableAncestor !== this.boundElement.ownerDocument.documentElement;\n    const documentWidth = this.boundElement.ownerDocument.documentElement.clientWidth;\n    const documentHeight = this.boundElement.ownerDocument.documentElement.clientHeight;\n    const safeSpace = 8; // extra space to avoid popover being too close to the edges\n\n    // These deltas represent the offset between the scrollable ancestor and the viewport.\n    // They are used to adjust the available space calculations when the scrollable ancestor is not the document or body,\n    // to try to fit the popover inside the scrollable ancestor.\n    const deltaTop = isScrollableAncestorNested ? scrollableAncestorRect.top : 0;\n    const deltaRight = isScrollableAncestorNested ? documentWidth - scrollableAncestorRect.right : 0;\n    const deltaBottom = isScrollableAncestorNested ? documentHeight - scrollableAncestorRect.bottom : 0;\n    const deltaLeft = isScrollableAncestorNested ? scrollableAncestorRect.left : 0;\n\n    this.cachedAvailableSpace = {\n      top: boundElementRect.top - deltaTop - safeSpace,\n      right: documentWidth - boundElementRect.right - deltaRight - safeSpace,\n      bottom: documentHeight - boundElementRect.bottom - deltaBottom - safeSpace,\n      left: boundElementRect.left - deltaLeft - safeSpace,\n    };\n\n    return this.cachedAvailableSpace;\n  }\n\n  /** Calculate the space around the bound element relative to the viewport. */\n  private getBoundElementOffsets(): Offsets {\n    const elementRect = this.boundElement.getBoundingClientRect();\n    const documentWidth = this.boundElement.ownerDocument.documentElement.clientWidth;\n    const documentHeight = this.boundElement.ownerDocument.documentElement.clientHeight;\n\n    return {\n      top: elementRect.top,\n      right: documentWidth - elementRect.right,\n      bottom: documentHeight - elementRect.bottom,\n      left: elementRect.left,\n    };\n  }\n\n  /** Compute positioning offsets in the appropriate coordinate space, accounting for transformed containing blocks and scroll. */\n  private computePositionOffsets(): Offsets {\n    const boundElementOffsets = this.getBoundElementOffsets();\n    const containingBlockAncestor = findContainingBlockAncestor(this.host);\n    const isDocumentElement = containingBlockAncestor === this.host.ownerDocument.documentElement;\n\n    if (isDocumentElement) {\n      return boundElementOffsets;\n    }\n\n    const containingBlockRect = containingBlockAncestor.getBoundingClientRect();\n    const containingBlockStyle = getComputedStyle(containingBlockAncestor);\n    /** Padding box of the containing block, accounting for borders. */\n    const paddingBox = {\n      top: containingBlockRect.top + parseFloat(containingBlockStyle.borderTopWidth),\n      right: containingBlockRect.right - parseFloat(containingBlockStyle.borderRightWidth),\n      bottom: containingBlockRect.bottom - parseFloat(containingBlockStyle.borderBottomWidth),\n      left: containingBlockRect.left + parseFloat(containingBlockStyle.borderLeftWidth),\n    };\n\n    const boundElementRect = this.boundElement.getBoundingClientRect();\n    /** Bound element offsets relative to the containing block padding box. */\n    const relativeOffsets = {\n      top: boundElementRect.top - paddingBox.top,\n      right: paddingBox.right - boundElementRect.right,\n      bottom: paddingBox.bottom - boundElementRect.bottom,\n      left: boundElementRect.left - paddingBox.left,\n    };\n\n    /** Account for scroll to keep the popover aligned while the containing block scrolls. */\n    return {\n      top: relativeOffsets.top + containingBlockAncestor.scrollTop,\n      right: relativeOffsets.right - containingBlockAncestor.scrollLeft,\n      bottom: relativeOffsets.bottom - containingBlockAncestor.scrollTop,\n      left: relativeOffsets.left + containingBlockAncestor.scrollLeft,\n    };\n  }\n\n  /** Apply positioning styles based on `position` parameter. */\n  private applyPositionStyles(position: PopoverPosition, availableSpace: Offsets): void {\n    const boundElementWidth = this.boundElement.offsetWidth;\n    const boundElementHeight = this.boundElement.offsetHeight;\n    const offsetModifier = this.offsetModifier;\n    /**\n     * Distance between the arrow center and the popover edge.\n     * Needed to align the center of the arrow with the center of the bound element when `showArrow` and `center` are enabled.\n     */\n    const arrowModifier = this.showArrow && this.center ? 8 : 0;\n    const hostStyle = this.host.style;\n    /** Gap between the popover and the bound element, set as margin in CSS. */\n    const distanceFromBound = parseFloat(getComputedStyle(this.host).marginTop.replace(\"px\", \"\")) || 0;\n    const positionOffsets = this.computePositionOffsets();\n\n    /**\n     * Precomputed bases to reduce repeated arithmetic in the switch below.\n     * They represent the bound element edges plus optional centering offsets.\n     */\n    const leftBase = positionOffsets.left + boundElementWidth * offsetModifier;\n    const rightBase = positionOffsets.right + boundElementWidth * offsetModifier;\n    const topBase = positionOffsets.top + boundElementHeight;\n    const bottomBase = positionOffsets.bottom + boundElementHeight;\n    const sideTopBase = positionOffsets.top + boundElementHeight * offsetModifier;\n    const sideBottomBase = positionOffsets.bottom + boundElementHeight * offsetModifier;\n\n    let maxWidth: number;\n    let maxHeight: number;\n\n    switch (position) {\n      case PopoverPosition.TOP:\n      case PopoverPosition.TOP_RIGHT:\n        hostStyle.bottom = `${bottomBase}px`;\n        hostStyle.left = `${leftBase - (position === PopoverPosition.TOP_RIGHT ? arrowModifier : 0)}px`;\n        maxHeight = availableSpace.top - distanceFromBound;\n        if (position === PopoverPosition.TOP_RIGHT) {\n          maxWidth = availableSpace.right + boundElementWidth * offsetModifier;\n        }\n        break;\n\n      case PopoverPosition.TOP_LEFT:\n        hostStyle.right = `${rightBase - arrowModifier}px`;\n        hostStyle.bottom = `${bottomBase}px`;\n        maxWidth = availableSpace.left + boundElementWidth * offsetModifier;\n        maxHeight = availableSpace.top - distanceFromBound;\n        break;\n\n      case PopoverPosition.BOTTOM:\n      case PopoverPosition.BOTTOM_RIGHT:\n        hostStyle.top = `${topBase}px`;\n        hostStyle.left = `${leftBase - (position === PopoverPosition.BOTTOM_RIGHT ? arrowModifier : 0)}px`;\n        maxHeight = availableSpace.bottom - distanceFromBound;\n        if (position === PopoverPosition.BOTTOM_RIGHT) {\n          maxWidth = availableSpace.right + boundElementWidth * offsetModifier;\n        }\n        break;\n\n      case PopoverPosition.BOTTOM_LEFT:\n        hostStyle.top = `${topBase}px`;\n        hostStyle.right = `${rightBase - arrowModifier}px`;\n        maxWidth = availableSpace.left + boundElementWidth * offsetModifier;\n        maxHeight = availableSpace.bottom - distanceFromBound;\n        break;\n\n      case PopoverPosition.RIGHT:\n      case PopoverPosition.RIGHT_BOTTOM:\n        hostStyle.top = `${sideTopBase - (position === PopoverPosition.RIGHT_BOTTOM ? arrowModifier : 0)}px`;\n        hostStyle.left = `${positionOffsets.left + boundElementWidth}px`;\n        maxWidth = availableSpace.right - distanceFromBound;\n        if (position === PopoverPosition.RIGHT) {\n          maxHeight = availableSpace.top + availableSpace.bottom + boundElementHeight;\n        } else {\n          maxHeight = availableSpace.bottom + boundElementHeight * offsetModifier;\n        }\n        break;\n\n      case PopoverPosition.RIGHT_TOP:\n        hostStyle.bottom = `${sideBottomBase - arrowModifier}px`;\n        hostStyle.left = `${positionOffsets.left + boundElementWidth}px`;\n        maxWidth = availableSpace.right - distanceFromBound;\n        maxHeight = availableSpace.top + boundElementHeight * offsetModifier;\n        break;\n\n      case PopoverPosition.LEFT:\n      case PopoverPosition.LEFT_BOTTOM:\n        hostStyle.top = `${sideTopBase - (position === PopoverPosition.LEFT_BOTTOM ? arrowModifier : 0)}px`;\n        hostStyle.right = `${positionOffsets.right + boundElementWidth}px`;\n        maxWidth = availableSpace.left - distanceFromBound;\n        if (position === PopoverPosition.LEFT_BOTTOM) {\n          maxHeight = availableSpace.bottom + boundElementHeight * offsetModifier;\n        }\n        break;\n\n      case PopoverPosition.LEFT_TOP:\n        hostStyle.right = `${positionOffsets.right + boundElementWidth}px`;\n        hostStyle.bottom = `${sideBottomBase - arrowModifier}px`;\n        maxWidth = availableSpace.left - distanceFromBound;\n        maxHeight = availableSpace.top + boundElementHeight * offsetModifier;\n        break;\n    }\n\n    if (getDevice() !== Device.MOBILE) {\n      // Only force max sizes on non-mobile viewports\n      Object.assign(hostStyle, {\n        maxWidth: maxWidth ? `${maxWidth}px` : \"\",\n        maxHeight: maxHeight ? `${maxHeight}px` : \"\",\n      });\n    }\n  }\n\n  /** Set the position of the popover. */\n  private setPosition(): void {\n    if (!this.boundElement) {\n      return;\n    }\n\n    if (!isElementVisibleInContainer(this.boundElement, this.findScrollableAncestor(this.boundElement))) {\n      // If the bound element is not visible, hide the popover too\n      this.open = false;\n\n      return;\n    }\n\n    Object.assign(this.host.style, {\n      // Reset all positioning properties\n      top: \"auto\",\n      right: \"auto\",\n      bottom: \"auto\",\n      left: \"auto\",\n      maxWidth: \"\",\n      maxHeight: \"\",\n      // Set initial visibility to hidden while calculating position...\n      visibility: \"hidden\",\n    });\n\n    const availableSpace = this.calculateAvailableSpace();\n    const position = this.getOptimalPopoverPosition(this.position, availableSpace);\n\n    this.applyPositionStyles(position, availableSpace);\n    this.currentPosition = position;\n    this.positionChange.emit({position: this.currentPosition});\n\n    // ...then restore the visibility\n    this.host.style.visibility = \"visible\";\n  }\n\n  componentWillLoad(): void {\n    this.validatePosition(this.position);\n  }\n\n  componentDidLoad(): void {\n    this.findBoundElement();\n    if (this.open) {\n      this.onOpen();\n    }\n  }\n\n  disconnectedCallback(): void {\n    cancelAnimationFrame(this.animationFrameRequestId);\n  }\n\n  render(): HTMLZPopoverElement {\n    return (\n      <Host current-position={this.currentPosition}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/www/build/p-e4622c5d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as o,h as e,H as s,d as n}from"./p-BEHxru6n.js";import{P as i,S as a,e as r,B as c}from"./p-B3nR3-Jw.js";const h=()=>`:host{position:relative;display:flex;max-width:100%;align-items:center;padding:calc(var(--z-table--cells-padding, calc(var(--space-unit) * 2)));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}`;const l=()=>`:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}.cell--content{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2))}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{position:relative;padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}.z-th--sort-button:focus,.z-th--sort-button:focus-visible{box-shadow:var(--shadow-focus-primary);opacity:1;outline:none;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-sorting="hover"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting="hover"]:hover) .z-th--sort-button,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting="always"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting="hover"]:hover) .z-th--sort-button::after,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting="always"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:""}`;const u=class{constructor(e){t(this,e);this.sort=o(this,"sort",7);this.showMenu=null;this.showSorting=null;this.sticky=false;this.sorted=false;this.popoverPosition=i.AUTO;this.isMenuOpen=false}get ariaSortDirection(){if(!this.sortDirection){return null}return this.sortDirection===a.ASC?"ascending":"descending"}handleSort(){if(!this.sortDirection){this.sorted=false;return}this.sortDirection=this.sortDirection===a.ASC?a.DESC:a.ASC;this.sorted=true;this.sort.emit({sortDirection:this.sortDirection})}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}}componentWillLoad(){this.updateColspan()}render(){return e(s,{key:"029656c92d8e6abda98ecb1c1f8f37df5561993b",role:"columnheader","menu-open":this.isMenuOpen,"aria-sort":this.ariaSortDirection,sortable:this.showSorting},e("div",{key:"a00a37619da7fba5ce5f0ff00644c321f6324d3d",class:"cell--content"},e("slot",{key:"427c778843968776001f3a8486df91a32a51a620"}),this.showSorting&&e("button",{key:"77d2f3841e1398e9df475d91445a9ccd52133335",class:"z-th--sort-button",type:"button",onClick:this.handleSort.bind(this)},e("z-icon",{key:"3e29de562c699e7ea2b1acab0273d759f80f5b1f",name:this.sortDirection===a.DESC?"arrow-simple-up":"arrow-simple-down",width:14,height:14})),this.showMenu&&e("div",{key:"a6fe1bc8e02e9f5238835c57f32a2a17b5f3e5a2",class:"cell--menu-container"},e("z-button",{key:"7df03bf2a1411aa5357a9f31f2812572a9e564df",variant:c.TERTIARY,icon:"contextual-menu",size:r.X_SMALL,ref:t=>this.menuTrigger=t,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),e("z-popover",{key:"73ecdad7bc49295072fa2163e6c94413e269755e",ref:t=>this.popoverEl=t,bindTo:this.menuTrigger,onOpenChange:t=>this.isMenuOpen=t.detail.open,position:this.popoverPosition},e("slot",{key:"c5cb377cc2304e37f508589f818fb97037d9935d",name:"contextual-menu"})))))}get host(){return n(this)}static get watchers(){return{colspan:[{updateColspan:0}]}}};u.style=h()+l();export{u as z_th};
+//# sourceMappingURL=p-e4622c5d.entry.js.map

package/www/build/p-e4622c5d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["zTableCellsCss","stylesCss","ZTh","constructor","hostRef","this","showMenu","showSorting","sticky","sorted","popoverPosition","PopoverPosition","AUTO","isMenuOpen","ariaSortDirection","sortDirection","SortDirection","ASC","handleSort","DESC","sort","emit","updateColspan","colspan","host","style","gridColumn","removeProperty","componentWillLoad","render","h","Host","key","role","sortable","class","type","onClick","bind","name","width","height","variant","ButtonVariant","TERTIARY","icon","size","ControlSize","X_SMALL","ref","el","menuTrigger","popoverEl","open","bindTo","onOpenChange","event","detail","position"],"sources":["src/components/table/cells/z-table-cells.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  max-width: 100%;\n  align-items: center;\n  padding: calc(var(--z-table--cells-padding, calc(var(--space-unit) * 2)));\n  background-color: var(--color-surface01);\n  gap: calc(var(--space-unit) * 2) var(--space-unit);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host([sticky]) {\n  position: sticky;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  box-shadow: 8px 0 16px -8px var(--shadow-color-base);\n}\n\n:host([menu-open]) {\n  z-index: 2;\n}\n\n.cell--content {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  align-items: center;\n}\n\n:host([show-menu]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.cell--menu-container {\n  margin-left: auto;\n}\n\n:host(:not([show-menu])) .cell--menu-container {\n  opacity: 0;\n  pointer-events: none;\n}\n\n:host(:is([show-menu], [menu-open])) .cell--menu-container,\n:host([show-menu]) .cell--menu-container:focus-within {\n  z-index: 1;\n  opacity: 1;\n  pointer-events: all;\n}\n\n:host .cell-popover {\n  z-index: 100;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-menu=\"hover\"]) .cell--menu-container {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-menu=\"hover\"]:hover) .cell--menu-container {\n    z-index: 1;\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n",":host {\n  z-index: 1;\n  padding: 0;\n  background-color: var(--color-background);\n  font-weight: var(--font-sb);\n}\n\n.cell--content {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n}\n\n:host([show-sorting]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n  position: relative;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  outline: none;\n}\n\n.z-th--sort-button:focus,\n.z-th--sort-button:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  opacity: 1;\n  outline: none;\n  pointer-events: all;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-sorting=\"hover\"]) .z-th--sort-button {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n  :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n  :host([show-sorting=\"always\"]) .z-th--sort-button,\n  :host([sorted]) .z-th--sort-button {\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n  position: absolute;\n  top: 6px;\n  left: 6px;\n  width: calc(100% - 12px);\n  height: calc(100% - 10px);\n  background-color: transparent;\n  content: \"\";\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrls: [\"../z-table-cells.css\", \"styles.css\"],\n  shadow: true,\n})\nexport class ZTh implements ComponentInterface {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Enables the sorting button.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the sort button.\n   */\n  @Prop({reflect: true})\n  showSorting: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Sorted state of the column.\n   */\n  @Prop({reflect: true, mutable: true})\n  sorted: boolean | null = false;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      this.sorted = false;\n\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sorted = true;\n\n    this.sort.emit({sortDirection: this.sortDirection});\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n        sortable={this.showSorting}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showSorting && (\n            <button\n              class=\"z-th--sort-button\"\n              type=\"button\"\n              onClick={this.handleSort.bind(this)}\n            >\n              <z-icon\n                name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n                width={14}\n                height={14}\n              />\n            </button>\n          )}\n          {this.showMenu && (\n            <div class=\"cell--menu-container\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLElement)}\n                onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n              />\n              <z-popover\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yHAAA,MAAMA,EAAiB,IAAM,8hCCA7B,MAAMC,EAAY,IAAM,wsC,MCaXC,EAAG,MALhB,WAAAC,CAAAC,G,qCAoBEC,KAAAC,SAAgC,KAQhCD,KAAAE,YAAmC,KAMnCF,KAAAG,OAAS,MAYTH,KAAAI,OAAyB,MAMzBJ,KAAAK,gBAAkBC,EAAgBC,KAMlCP,KAAAQ,WAAa,KAqGd,CApFC,qBAAYC,GACV,IAAKT,KAAKU,cAAe,CACvB,OAAO,I,CAGT,OAAOV,KAAKU,gBAAkBC,EAAcC,IAAM,YAAc,Y,CAO1D,UAAAC,GACN,IAAKb,KAAKU,cAAe,CACvBV,KAAKI,OAAS,MAEd,M,CAGFJ,KAAKU,cAAgBV,KAAKU,gBAAkBC,EAAcC,IAAMD,EAAcG,KAAOH,EAAcC,IACnGZ,KAAKI,OAAS,KAEdJ,KAAKe,KAAKC,KAAK,CAACN,cAAeV,KAAKU,e,CAI5B,aAAAO,GACR,GAAIjB,KAAKkB,QAAS,CAChBlB,KAAKmB,KAAKC,MAAMC,WAAa,QAAQrB,KAAKkB,S,KACrC,CACLlB,KAAKmB,KAAKC,MAAME,eAAe,c,EAInC,iBAAAC,GACEvB,KAAKiB,e,CAGP,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,eAAc,YACR5B,KAAKQ,WAAU,YACfR,KAAKS,kBAChBoB,SAAU7B,KAAKE,aAEfuB,EAAA,OAAAE,IAAA,2CAAKG,MAAM,iBACTL,EAAA,QAAAE,IAAA,6CACC3B,KAAKE,aACJuB,EAAA,UAAAE,IAAA,2CACEG,MAAM,oBACNC,KAAK,SACLC,QAAShC,KAAKa,WAAWoB,KAAKjC,OAE9ByB,EAAA,UAAAE,IAAA,2CACEO,KAAMlC,KAAKU,gBAAkBC,EAAcG,KAAO,kBAAoB,oBACtEqB,MAAO,GACPC,OAAQ,MAIbpC,KAAKC,UACJwB,EAAA,OAAAE,IAAA,2CAAKG,MAAM,wBACTL,EAAA,YAAAE,IAAA,2CACEU,QAASC,EAAcC,SACvBC,KAAK,kBACLC,KAAMC,EAAYC,QAClBC,IAAMC,GAAQ7C,KAAK8C,YAAcD,EACjCb,QAAS,IAAOhC,KAAK+C,UAAUC,MAAQhD,KAAK+C,UAAUC,OAExDvB,EAAA,aAAAE,IAAA,2CACEiB,IAAMC,GAAQ7C,KAAK+C,UAAYF,EAC/BI,OAAQjD,KAAK8C,YACbI,aAAeC,GAAWnD,KAAKQ,WAAa2C,EAAMC,OAAOJ,KACzDK,SAAUrD,KAAKK,iBAEfoB,EAAA,QAAAE,IAAA,2CAAMO,KAAK,uB","ignoreList":[]}

package/www/build/p-e7e98d15.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as o,h as e,H as r,d as a}from"./p-BEHxru6n.js";import{r as n}from"./p-C8pbzcmM.js";import"./p-6fc4fd53.entry.js";import"./p-e4622c5d.entry.js";import"./p-B3nR3-Jw.js";import"./p-Q-tWjk7P.js";const s=()=>`:host{position:relative;display:grid;width:100%;box-sizing:border-box;grid-auto-flow:column;grid-template-columns:var(--z-table--expand-button-size, 0) repeat(var(--columns), minmax(128px, 1fr));--columns:1}*{box-sizing:border-box}.z-tr--expand-button-container,::slotted(*){border-bottom:var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03)}::slotted(*:not(:last-child)){border-right:var(--z-table--cell-left-border, none)}:host([expandable]){--show-expandable-button:visible;cursor:pointer}:host([expandable]) ::slotted(*){grid-row:1}:host([expandable]) ::slotted(:nth-last-child(2)){border-right:none}:host([expandable]) ::slotted(*:last-child){border-left:0;grid-column:1 / span calc(var(--columns) + 1);grid-row:2}:host([expandable]:not([expanded])) ::slotted(*:last-child){display:none}:host([expanded]){margin-bottom:4px;box-shadow:0 4px 4px -2px var(--shadow-color-base)}:host([expanded]) .z-tr--expand-button-container,:host([expanded]) ::slotted(*){background-color:var(--color-background)}:host(:hover):has([tabIndex]) ::slotted(z-td),:host(:hover):has([tabIndex]) ::slotted(z-th){border-top:var(--border-size-small) solid var(--color-surface04);border-bottom:var(--border-size-small) solid var(--color-surface04);background-color:var(--color-surface02)}:host(:focus){position:relative;z-index:20;box-shadow:var(--shadow-focus-primary);outline:none}.z-tr--expand-button-container{display:flex;align-items:center;justify-content:center;background-color:var(--z-table--cells-background, var(--color-surface01))}.z-tr--expand-button-container button{display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:auto;appearance:none;background:transparent;cursor:pointer;visibility:var(--show-expandable-button, hidden)}.z-tr--expand-button-container button z-icon{--z-icon-width:16px;--z-icon-height:16px}.z-tr--focus-overlay{position:absolute;z-index:30;right:0;left:0;width:100%;border-radius:4px;box-shadow:none;inset:0;outline:none;pointer-events:none;transition:box-shadow 0.2s}:host(:focus) .z-tr--focus-overlay{box-shadow:0 0 0 2px var(--shadow-focus-primary),     var(--shadow-focus-primary);outline:none}:host(:focus) ::slotted(*){border-bottom:none}:host(:focus) .z-tr--expand-button-container{border-bottom:none}`;const i=class{constructor(e){t(this,e);this.expand=o(this,"expand",7);this.expandable=false;this.expanded=false}updateColumns(){const t=Array.from(this.host.querySelectorAll("z-td, z-th"));if(this.expandable){t.pop()}const o=t.map((t=>t.colspan||1)).reduce(((t,o)=>t+o),0);this.host.style.setProperty("--columns",`${o}`);if(this.expandable){const o=t.pop();o.id=o.id||`z-tr-expandable-content-${n()}`;this.expandableContentId=o.id}}onRowClick(t){const o=t.target.closest(".prevent-expand");if(!this.expandable||o){return}this.expanded=!this.expanded;this.expand.emit({expanded:this.expanded})}onKeyDown(t){if(!this.expandable){return}const o=document.activeElement;if(o!==this.host){return}if(t.key==="Enter"||t.key===" "){t.preventDefault();this.expanded=!this.expanded;this.expand.emit({expanded:this.expanded})}}componentWillLoad(){this.updateColumns()}render(){return e(r,{key:"92be779ec3e863cc85336fcedb02f718fa3a19fa",role:"row",tabIndex:this.expandable?0:undefined,expanded:this.expanded,onClick:this.onRowClick.bind(this),onKeyDown:this.onKeyDown.bind(this)},e("div",{key:"720c8209c21104e78129cbd76c12a6cdf8806ca2",class:"z-tr--focus-overlay","aria-hidden":"true"}),e("div",{key:"3bb4f4d2e5ae60da5c105d1c8a99d6ff0fa59302",class:"z-tr--expand-button-container"},this.expandable&&e("button",{key:"d27d18c1a4515ac055ce7db13ec3efdfc7d0314d",tabIndex:-1,"aria-expanded":this.expanded?"true":"false","aria-label":this.expanded?"Comprimi riga":"Espandi riga","aria-controls":this.expandableContentId,type:"button"},e("z-icon",{key:"9fd14fcab4ea512b42c63928c3e2dabb83fd1da3",name:this.expanded?"minus-circled":"plus-circled"}))),e("slot",{key:"c5fcb7a2f92eb8401c4d27d28e5b68a5001616b7",onSlotchange:this.updateColumns.bind(this)}))}get host(){return a(this)}static get watchers(){return{expandable:[{updateColumns:0}]}}};i.style=s();export{i as z_tr};
+//# sourceMappingURL=p-e7e98d15.entry.js.map

package/www/build/p-e7e98d15.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZTr","constructor","hostRef","this","expandable","expanded","updateColumns","cells","Array","from","host","querySelectorAll","pop","columns","map","cell","colspan","reduce","a","b","style","setProperty","expandableContent","id","randomId","expandableContentId","onRowClick","event","preventExpand","target","closest","expand","emit","onKeyDown","active","document","activeElement","key","preventDefault","componentWillLoad","render","h","Host","role","tabIndex","undefined","onClick","bind","class","type","name","onSlotchange"],"sources":["src/components/table/z-tr/styles.css?tag=z-tr&encapsulation=shadow","src/components/table/z-tr/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: grid;\n  width: 100%;\n  box-sizing: border-box;\n  grid-auto-flow: column;\n  grid-template-columns: var(--z-table--expand-button-size, 0) repeat(var(--columns), minmax(128px, 1fr));\n\n  --columns: 1;\n}\n\n* {\n  box-sizing: border-box;\n}\n\n.z-tr--expand-button-container,\n::slotted(*) {\n  border-bottom: var(--z-table--cells-bottom-border-size, var(--border-size-small)) solid var(--color-surface03);\n}\n\n::slotted(*:not(:last-child)) {\n  border-right: var(--z-table--cell-left-border, none);\n}\n\n:host([expandable]) {\n  --show-expandable-button: visible;\n\n  cursor: pointer;\n}\n\n:host([expandable]) ::slotted(*) {\n  grid-row: 1;\n}\n\n:host([expandable]) ::slotted(:nth-last-child(2)) {\n  border-right: none;\n}\n\n:host([expandable]) ::slotted(*:last-child) {\n  border-left: 0;\n  grid-column: 1 / span calc(var(--columns) + 1);\n  grid-row: 2;\n}\n\n:host([expandable]:not([expanded])) ::slotted(*:last-child) {\n  display: none;\n}\n\n:host([expanded]) {\n  margin-bottom: 4px; /* prevents shadow to be cut by the next element */\n  box-shadow: 0 4px 4px -2px var(--shadow-color-base);\n}\n\n:host([expanded]) .z-tr--expand-button-container,\n:host([expanded]) ::slotted(*) {\n  background-color: var(--color-background);\n}\n\n:host(:hover):has([tabIndex]) ::slotted(z-td),\n:host(:hover):has([tabIndex]) ::slotted(z-th) {\n  border-top: var(--border-size-small) solid var(--color-surface04);\n  border-bottom: var(--border-size-small) solid var(--color-surface04);\n  background-color: var(--color-surface02);\n}\n\n:host(:focus) {\n  position: relative;\n  z-index: 20;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-tr--expand-button-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--z-table--cells-background, var(--color-surface01));\n}\n\n.z-tr--expand-button-container button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  margin: auto;\n  appearance: none;\n  background: transparent;\n  cursor: pointer;\n  visibility: var(--show-expandable-button, hidden);\n}\n\n.z-tr--expand-button-container button z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n.z-tr--focus-overlay {\n  position: absolute;\n  z-index: 30;\n  right: 0;\n  left: 0;\n  width: 100%;\n  border-radius: 4px;\n  box-shadow: none;\n  inset: 0;\n  outline: none;\n  pointer-events: none;\n  transition: box-shadow 0.2s;\n}\n\n:host(:focus) .z-tr--focus-overlay {\n  box-shadow:\n    0 0 0 2px var(--shadow-focus-primary),\n    var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host(:focus) ::slotted(*) {\n  border-bottom: none;\n}\n\n:host(:focus) .z-tr--expand-button-container {\n  border-bottom: none;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {randomId} from \"../../../utils/utils\";\nimport \"../cells/z-td/index\";\nimport \"../cells/z-th/index\";\n\n/**\n * ZTr component.\n * When the row is `expandable`, you can set the `prevent-expand` css class on an interactive element inside the row\n * to prevent the row from expanding.\n * @slot - ZTr content (`z-td` or `z-th`).\n */\n@Component({\n  tag: \"z-tr\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTr implements ComponentInterface {\n  @Element() host: HTMLZTrElement;\n\n  /**\n   * Whether the row is expandable.\n   * Use a `z-td` as the last cell of the row for the additional content.\n   * It will show a button to expand/collapse the row.\n   * The last cell will be hidden until the button or row is clicked.\n   *\n   * If some element inside the expandable row contains the `prevent-expand` css class,\n   * the row will not expand by clicking that element.\n   */\n  @Prop({reflect: true})\n  expandable = false;\n\n  /**\n   * Whether the row is currently expanded.\n   */\n  @State()\n  expanded = false;\n\n  /**\n   * HTML Id of the expandable content.\n   * It is used to link the button to the content through the `aria-controls` attribute.\n   */\n  @State()\n  expandableContentId: string;\n\n  /** Row has been expanded */\n  @Event()\n  expand: EventEmitter;\n\n  @Watch(\"expandable\")\n  @Listen(\"colspanchange\")\n  protected updateColumns(): void {\n    const cells = Array.from(this.host.querySelectorAll<HTMLZTdElement | HTMLZThElement>(\"z-td, z-th\"));\n    if (this.expandable) {\n      cells.pop();\n    }\n\n    const columns = cells.map((cell) => cell.colspan || 1).reduce((a, b) => a + b, 0);\n    this.host.style.setProperty(\"--columns\", `${columns}`);\n\n    if (this.expandable) {\n      const expandableContent = cells.pop();\n      expandableContent.id = expandableContent.id || `z-tr-expandable-content-${randomId()}`;\n      this.expandableContentId = expandableContent.id;\n    }\n  }\n\n  /**\n   * Handle click on row.\n   * Skip expansion if the click is on a element with `prevent-expand` css class.\n   */\n  private onRowClick(event: MouseEvent): void {\n    const preventExpand = (event.target as HTMLElement).closest(\".prevent-expand\");\n    if (!this.expandable || preventExpand) {\n      return;\n    }\n\n    this.expanded = !this.expanded;\n    this.expand.emit({expanded: this.expanded});\n  }\n\n  private onKeyDown(event: KeyboardEvent): void {\n    if (!this.expandable) {\n      return;\n    }\n\n    const active = document.activeElement;\n    if (active !== this.host) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      this.expanded = !this.expanded;\n      this.expand.emit({expanded: this.expanded});\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColumns();\n  }\n\n  render(): HTMLZTrElement {\n    return (\n      <Host\n        role=\"row\"\n        tabIndex={this.expandable ? 0 : undefined}\n        expanded={this.expanded}\n        onClick={this.onRowClick.bind(this)}\n        onKeyDown={this.onKeyDown.bind(this)}\n      >\n        <div\n          class=\"z-tr--focus-overlay\"\n          aria-hidden=\"true\"\n        ></div>\n        <div class=\"z-tr--expand-button-container\">\n          {this.expandable && (\n            <button\n              tabIndex={-1}\n              aria-expanded={this.expanded ? \"true\" : \"false\"}\n              aria-label={this.expanded ? \"Comprimi riga\" : \"Espandi riga\"}\n              aria-controls={this.expandableContentId}\n              type=\"button\"\n            >\n              <z-icon name={this.expanded ? \"minus-circled\" : \"plus-circled\"}></z-icon>\n            </button>\n          )}\n        </div>\n        <slot onSlotchange={this.updateColumns.bind(this)}></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gNAAA,MAAMA,EAAY,IAAM,4vE,MC4BXC,EAAG,MALhB,WAAAC,CAAAC,G,yCAkBEC,KAAAC,WAAa,MAMbD,KAAAE,SAAW,KAgGZ,CAjFW,aAAAC,GACR,MAAMC,EAAQC,MAAMC,KAAKN,KAAKO,KAAKC,iBAAkD,eACrF,GAAIR,KAAKC,WAAY,CACnBG,EAAMK,K,CAGR,MAAMC,EAAUN,EAAMO,KAAKC,GAASA,EAAKC,SAAW,IAAGC,QAAO,CAACC,EAAGC,IAAMD,EAAIC,GAAG,GAC/EhB,KAAKO,KAAKU,MAAMC,YAAY,YAAa,GAAGR,KAE5C,GAAIV,KAAKC,WAAY,CACnB,MAAMkB,EAAoBf,EAAMK,MAChCU,EAAkBC,GAAKD,EAAkBC,IAAM,2BAA2BC,MAC1ErB,KAAKsB,oBAAsBH,EAAkBC,E,EAQzC,UAAAG,CAAWC,GACjB,MAAMC,EAAiBD,EAAME,OAAuBC,QAAQ,mBAC5D,IAAK3B,KAAKC,YAAcwB,EAAe,CACrC,M,CAGFzB,KAAKE,UAAYF,KAAKE,SACtBF,KAAK4B,OAAOC,KAAK,CAAC3B,SAAUF,KAAKE,U,CAG3B,SAAA4B,CAAUN,GAChB,IAAKxB,KAAKC,WAAY,CACpB,M,CAGF,MAAM8B,EAASC,SAASC,cACxB,GAAIF,IAAW/B,KAAKO,KAAM,CACxB,M,CAGF,GAAIiB,EAAMU,MAAQ,SAAWV,EAAMU,MAAQ,IAAK,CAC9CV,EAAMW,iBACNnC,KAAKE,UAAYF,KAAKE,SACtBF,KAAK4B,OAAOC,KAAK,CAAC3B,SAAUF,KAAKE,U,EAIrC,iBAAAkC,GACEpC,KAAKG,e,CAGP,MAAAkC,GACE,OACEC,EAACC,EAAI,CAAAL,IAAA,2CACHM,KAAK,MACLC,SAAUzC,KAAKC,WAAa,EAAIyC,UAChCxC,SAAUF,KAAKE,SACfyC,QAAS3C,KAAKuB,WAAWqB,KAAK5C,MAC9B8B,UAAW9B,KAAK8B,UAAUc,KAAK5C,OAE/BsC,EAAA,OAAAJ,IAAA,2CACEW,MAAM,sBAAqB,cACf,SAEdP,EAAA,OAAAJ,IAAA,2CAAKW,MAAM,iCACR7C,KAAKC,YACJqC,EAAA,UAAAJ,IAAA,2CACEO,UAAU,EAAE,gBACGzC,KAAKE,SAAW,OAAS,QAAO,aACnCF,KAAKE,SAAW,gBAAkB,eAAc,gBAC7CF,KAAKsB,oBACpBwB,KAAK,UAELR,EAAA,UAAAJ,IAAA,2CAAQa,KAAM/C,KAAKE,SAAW,gBAAkB,mBAItDoC,EAAA,QAAAJ,IAAA,2CAAMc,aAAchD,KAAKG,cAAcyC,KAAK5C,Q","ignoreList":[]}

package/www/build/p-e87e13b0.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as l,d as n}from"./p-BEHxru6n.js";import{g as s}from"./p-B3nR3-Jw.js";const r=()=>`:host{font-family:var(--font-family-sans)}z-list-element{position:relative;display:block;padding-top:var(--space-unit)}z-list-element::before,z-list-element::after{position:absolute;z-index:100;top:0.125rem;left:-0.5rem;content:""}z-list z-list-element::before{width:var(--space-unit);height:calc(var(--space-unit) * 2);border-bottom:var(--border-size-small) solid var(--color-disabled01-icon);border-left:var(--border-size-small) solid var(--color-disabled01-icon)}z-list z-list-element::after{width:var(--space-unit);height:100%;border-left:var(--border-size-small) solid var(--color-disabled01-icon)}z-list z-list-element:last-child::after,z-list>z-list-element::before,z-list>z-list-element::after,z-list>z-list-group>z-list-element::before,z-list>z-list-group>z-list-element::after{display:none}z-list>div.children-node{padding-left:calc(var(--space-unit) * 2)}z-list-element>.list-element{z-index:100;display:flex;justify-content:space-between;padding:0;color:var(--color-default-text);font-size:var(--font-size-2);font-style:normal;font-weight:var(--font-rg);text-decoration:none}z-list-element>.list-element.link-clickable{color:var(--color-primary01)}z-list-element>.list-element.link-clickable:hover{text-decoration:underline}z-list-element>.list-element .item.ellipsis{overflow:hidden}z-list-element .list-element::after{position:absolute;top:0;right:-0.0625rem;display:block;width:100%;height:calc(var(--space-unit) * 5);content:"";transform:translateX(-100%)}.item-label{overflow:hidden;flex-grow:1;font-size:var(--font-size-2);font-style:normal;font-weight:var(--font-rg);letter-spacing:0.0032rem;line-height:1.25rem;text-overflow:ellipsis;white-space:nowrap}.item-label.bold-item{font-weight:var(--font-sb)}.item.ellipsis{display:flex;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}.children-node>z-list-element{padding:0;padding-top:0.125;padding-left:calc(var(--space-unit) * 1.25)}.item-icon{margin-right:var(--space-unit)}.no-icon-label{padding-left:var(--space-unit)}.children-node>z-list-element.no-icon-elm{padding-left:0}z-list-element>.list-element:focus:focus-visible{position:relative;z-index:200;box-shadow:var(--shadow-focus-primary);outline:none}@media (max-width: 767px){z-list-element::before,z-list-element::after{top:0.1875rem}z-list z-list-element::before{height:calc(var(--space-unit) * 2.5)}.children-node>z-list-element{padding-top:var(--space-unit)}}`;const a=class{constructor(i){e(this,i);this.treeItemClicked=t(this,"treeItemClicked",7);this.items=[];this.parsedItems=[]}watchItems(){this.parsedItems=typeof this.items==="string"?JSON.parse(this.items):this.items}componentWillLoad(){this.watchItems()}handleClick(e){this.treeItemClicked.emit({id:e.id,name:e.name,url:e.url})}getFocusableElements(){return Array.from(this.host.shadowRoot.querySelectorAll('a[tabindex="0"]'))}getAncestor(e,t){let i=e;for(let e=0;e<t;e++){i=i===null||i===void 0?void 0:i.parentElement;if(!i){return}}return i}handleArrowNav(e){if(e.code===s.TAB){e.preventDefault();return}const t=this.getFocusableElements();const i=t.indexOf(e.target);if(i===-1){return}if(e.code===s.ARROW_DOWN||e.code===s.ARROW_UP){e.preventDefault();const l=i+(e.code===s.ARROW_DOWN?1:-1);if(l<0||l>=t.length){return}t[l].focus()}if(e.code===s.ARROW_LEFT){e.preventDefault();const l=this.getAncestor(t[i],4);if(!l||!l.children[0]||l.children[0].tagName.toLowerCase()!=="a"&&l.getAttribute("tabindex")===null){return}l.children[0].focus()}if(e.code===s.ARROW_RIGHT){e.preventDefault();const t=e.target.closest("z-list-element");if(!t){return}const i=t.querySelector("z-list");if(!i){return}const l=i.querySelector('a[tabindex="0"]');if(!l){return}l.focus()}}renderTreeList(e,t,l=1){var n,r;this.htmlTag=e.url?"a":"span";const a=i("z-list-element",{id:t,class:!e.icon?"no-icon-elm":"",clickable:Boolean(e.url),hasTreeItems:true,role:"none","aria-hidden":undefined},i(this.htmlTag,{class:{"list-element":true,"z-link":Boolean(e.url),"link-clickable":Boolean(e.url)},tabIndex:e.url?0:-1,onClick:()=>this.handleClick(e),onKeyUp:t=>{if(t.code===s.ENTER||t.code===s.SPACE){this.handleClick(e)}},onKeyDown:e=>this.handleArrowNav(e),role:e.url?"treeitem":undefined,"aria-hidden":e.url?undefined:"true","aria-expanded":((n=e.children)===null||n===void 0?void 0:n.length)>0&&true,"aria-level":l,"aria-label":e.name,href:e.url},i("span",{class:"item ellipsis"},e.icon&&i("z-icon",{width:16,height:16,fill:e.url?"color-primary01":"color-default-icon",class:"item-icon",name:e.icon}),i("span",{class:{"item-label":true,"no-icon-label":!e.icon,"bold-item":e.bold},title:e.name},e.name))),((r=e.children)===null||r===void 0?void 0:r.length)>0&&i("z-list",{role:"group"},i("div",{class:"children-node"},e.children.map(((e,t)=>this.renderTreeList(e,`${t}`,l+1))))));return a}render(){const e=this.parsedItems.some((e=>!!e.url));return i(l,{key:"68d06fd53ad0f4bce01853b95aef0f7482f3304a",class:"tree-list",role:e?"navigation":"none","aria-hidden":e?undefined:"true","aria-labelledby":this.htmlAriaLabelledby},i("div",{key:"6b8010ae9caf73ec0a43b09f5d9610247110d1a6",tabIndex:-1,role:e?"tree":"none","aria-hidden":e?undefined:"true","aria-label":this.htmlSectionTitle},this.parsedItems.map(((e,t)=>this.renderTreeList(e,`${t}`)))))}get host(){return n(this)}static get watchers(){return{items:[{watchItems:0}]}}};a.style=r();export{a as z_tree_list};
+//# sourceMappingURL=p-e87e13b0.entry.js.map

package/www/build/p-e87e13b0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZTreeList","constructor","hostRef","this","items","parsedItems","watchItems","JSON","parse","componentWillLoad","handleClick","item","treeItemClicked","emit","id","name","url","getFocusableElements","Array","from","host","shadowRoot","querySelectorAll","getAncestor","element","levels","ancestor","i","parentElement","handleArrowNav","event","code","KeyboardCode","TAB","preventDefault","focusableElements","currentIndex","indexOf","target","ARROW_DOWN","ARROW_UP","nextIndex","length","focus","ARROW_LEFT","children","tagName","toLowerCase","getAttribute","ARROW_RIGHT","parentElm","closest","childrenContainer","querySelector","firstChild","renderTreeList","key","level","htmlTag","treeListContent","h","class","icon","clickable","Boolean","hasTreeItems","role","undefined","tabIndex","onClick","onKeyUp","ENTER","SPACE","onKeyDown","_a","href","width","height","fill","bold","title","_b","map","child","render","hasClickableItems","some","Host","htmlAriaLabelledby","htmlSectionTitle"],"sources":["src/components/list/z-tree-list/styles.css?tag=z-tree-list&encapsulation=shadow","src/components/list/z-tree-list/index.tsx"],"sourcesContent":[":host {\n  font-family: var(--font-family-sans);\n}\n\nz-list-element {\n  position: relative;\n  display: block;\n  padding-top: var(--space-unit);\n}\n\nz-list-element::before,\nz-list-element::after {\n  position: absolute;\n  z-index: 100;\n  top: 0.125rem;\n  left: -0.5rem;\n  content: \"\";\n}\n\nz-list z-list-element::before {\n  width: var(--space-unit);\n  height: calc(var(--space-unit) * 2);\n  border-bottom: var(--border-size-small) solid var(--color-disabled01-icon);\n  border-left: var(--border-size-small) solid var(--color-disabled01-icon);\n}\n\nz-list z-list-element::after {\n  width: var(--space-unit);\n  height: 100%;\n  border-left: var(--border-size-small) solid var(--color-disabled01-icon);\n}\n\nz-list z-list-element:last-child::after,\nz-list > z-list-element::before,\nz-list > z-list-element::after,\nz-list > z-list-group > z-list-element::before,\nz-list > z-list-group > z-list-element::after {\n  display: none;\n}\n\nz-list > div.children-node {\n  padding-left: calc(var(--space-unit) * 2);\n}\n\nz-list-element > .list-element {\n  z-index: 100;\n  display: flex;\n  justify-content: space-between;\n  padding: 0;\n  color: var(--color-default-text);\n  font-size: var(--font-size-2);\n  font-style: normal;\n  font-weight: var(--font-rg);\n  text-decoration: none;\n}\n\nz-list-element > .list-element.link-clickable {\n  color: var(--color-primary01);\n}\n\nz-list-element > .list-element.link-clickable:hover {\n  text-decoration: underline;\n}\n\nz-list-element > .list-element .item.ellipsis {\n  overflow: hidden;\n}\n\nz-list-element .list-element::after {\n  position: absolute;\n  top: 0;\n  right: -0.0625rem;\n  display: block;\n  width: 100%;\n  height: calc(var(--space-unit) * 5);\n  content: \"\";\n  transform: translateX(-100%);\n}\n\n.item-label {\n  overflow: hidden;\n  flex-grow: 1;\n  font-size: var(--font-size-2);\n  font-style: normal;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.0032rem;\n  line-height: 1.25rem;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.item-label.bold-item {\n  font-weight: var(--font-sb);\n}\n\n.item.ellipsis {\n  display: flex;\n  overflow: hidden;\n  max-width: 100%;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.children-node > z-list-element {\n  padding: 0;\n  padding-top: 0.125;\n  padding-left: calc(var(--space-unit) * 1.25);\n}\n\n.item-icon {\n  margin-right: var(--space-unit);\n}\n\n.no-icon-label {\n  padding-left: var(--space-unit);\n}\n\n.children-node > z-list-element.no-icon-elm {\n  padding-left: 0;\n}\n\nz-list-element > .list-element:focus:focus-visible {\n  position: relative;\n  z-index: 200;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n@media (max-width: 767px) {\n  z-list-element::before,\n  z-list-element::after {\n    top: 0.1875rem;\n  }\n\n  z-list z-list-element::before {\n    height: calc(var(--space-unit) * 2.5);\n  }\n\n  .children-node > z-list-element {\n    padding-top: var(--space-unit);\n  }\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode, TreeListItem} from \"../../../beans\";\n\n@Component({\n  tag: \"z-tree-list\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTreeList implements ComponentInterface {\n  @Element() host: HTMLZTreeListElement;\n\n  /** Items to render, if they have the url property they will be rendered as clickable links */\n  @Prop()\n  items: TreeListItem[] | string = [];\n\n  /** Used for aria-labelledby attribute, sets name in \"navigation\" */\n  @Prop({reflect: true})\n  htmlAriaLabelledby: string;\n\n  /** Used for aria-label attribute, sets name in \"tree\" */\n  @Prop({reflect: true})\n  htmlSectionTitle: string;\n\n  /** Emitted on item click, it return the id, name and url of the clicked item */\n  @Event()\n  treeItemClicked: EventEmitter<{id: string; name: string; url: string}>;\n\n  private parsedItems: TreeListItem[] = [];\n\n  private htmlTag: string;\n\n  @Watch(\"items\")\n  watchItems(): void {\n    this.parsedItems = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n  }\n\n  componentWillLoad(): void {\n    this.watchItems();\n  }\n\n  private handleClick(item: TreeListItem): void {\n    this.treeItemClicked.emit({id: item.id, name: item.name, url: item.url});\n  }\n\n  private getFocusableElements(): HTMLElement[] {\n    return Array.from(this.host.shadowRoot.querySelectorAll('a[tabindex=\"0\"]'));\n  }\n\n  private getAncestor(element: HTMLElement, levels: number): HTMLElement | null {\n    let ancestor: HTMLElement | null = element;\n\n    for (let i = 0; i < levels; i++) {\n      ancestor = ancestor?.parentElement;\n      if (!ancestor) {\n        return;\n      }\n    }\n\n    return ancestor;\n  }\n\n  private handleArrowNav(event: KeyboardEvent): void {\n    if (event.code === KeyboardCode.TAB) {\n      event.preventDefault();\n\n      return;\n    }\n\n    const focusableElements = this.getFocusableElements();\n    const currentIndex = focusableElements.indexOf(event.target as HTMLElement);\n\n    if (currentIndex === -1) {\n      return;\n    }\n\n    if (event.code === KeyboardCode.ARROW_DOWN || event.code === KeyboardCode.ARROW_UP) {\n      event.preventDefault();\n\n      const nextIndex = currentIndex + (event.code === KeyboardCode.ARROW_DOWN ? 1 : -1);\n      if (nextIndex < 0 || nextIndex >= focusableElements.length) {\n        return;\n      }\n\n      focusableElements[nextIndex].focus();\n    }\n\n    if (event.code === KeyboardCode.ARROW_LEFT) {\n      event.preventDefault();\n      const ancestor = this.getAncestor(focusableElements[currentIndex], 4);\n\n      if (\n        !ancestor ||\n        !ancestor.children[0] ||\n        (ancestor.children[0].tagName.toLowerCase() !== \"a\" && ancestor.getAttribute(\"tabindex\") === null)\n      ) {\n        return;\n      }\n\n      (ancestor.children[0] as HTMLElement).focus();\n    }\n\n    if (event.code === KeyboardCode.ARROW_RIGHT) {\n      event.preventDefault();\n\n      const parentElm = (event.target as HTMLElement).closest(\"z-list-element\") as HTMLElement;\n\n      if (!parentElm) {\n        return;\n      }\n\n      const childrenContainer = parentElm.querySelector(\"z-list\") as HTMLElement;\n\n      if (!childrenContainer) {\n        return;\n      }\n\n      const firstChild = childrenContainer.querySelector('a[tabindex=\"0\"]') as HTMLElement;\n\n      if (!firstChild) {\n        return;\n      }\n\n      firstChild.focus();\n    }\n  }\n\n  private renderTreeList(item: TreeListItem, key: string, level = 1): HTMLZListElementElement {\n    this.htmlTag = item.url ? \"a\" : \"span\";\n\n    const treeListContent = (\n      <z-list-element\n        id={key}\n        class={!item.icon ? \"no-icon-elm\" : \"\"}\n        clickable={Boolean(item.url)}\n        hasTreeItems={true}\n        role=\"none\"\n        aria-hidden={undefined}\n      >\n        <this.htmlTag\n          class={{\n            \"list-element\": true,\n            \"z-link\": Boolean(item.url),\n            \"link-clickable\": Boolean(item.url),\n          }}\n          tabIndex={item.url ? 0 : -1}\n          onClick={() => this.handleClick(item)}\n          onKeyUp={(event: KeyboardEvent) => {\n            if (event.code === KeyboardCode.ENTER || event.code === KeyboardCode.SPACE) {\n              this.handleClick(item);\n            }\n          }}\n          onKeyDown={(event: KeyboardEvent) => this.handleArrowNav(event)}\n          role={item.url ? \"treeitem\" : undefined}\n          aria-hidden={item.url ? undefined : \"true\"}\n          aria-expanded={item.children?.length > 0 && true}\n          aria-level={level}\n          aria-label={item.name}\n          href={item.url}\n        >\n          <span class=\"item ellipsis\">\n            {item.icon && (\n              <z-icon\n                width={16}\n                height={16}\n                fill={item.url ? \"color-primary01\" : \"color-default-icon\"}\n                class=\"item-icon\"\n                name={item.icon}\n              />\n            )}\n            <span\n              class={{\n                \"item-label\": true,\n                \"no-icon-label\": !item.icon,\n                \"bold-item\": item.bold,\n              }}\n              title={item.name}\n            >\n              {item.name}\n            </span>\n          </span>\n        </this.htmlTag>\n        {item.children?.length > 0 && (\n          <z-list role=\"group\">\n            <div class=\"children-node\">\n              {item.children.map((child, key) => this.renderTreeList(child, `${key}`, level + 1))}\n            </div>\n          </z-list>\n        )}\n      </z-list-element>\n    );\n\n    return treeListContent;\n  }\n\n  render(): HTMLZTreeListElement {\n    const hasClickableItems = this.parsedItems.some((item) => !!item.url);\n\n    return (\n      <Host\n        class=\"tree-list\"\n        role={hasClickableItems ? \"navigation\" : \"none\"}\n        aria-hidden={hasClickableItems ? undefined : \"true\"}\n        aria-labelledby={this.htmlAriaLabelledby}\n      >\n        <div\n          tabIndex={-1}\n          role={hasClickableItems ? \"tree\" : \"none\"}\n          aria-hidden={hasClickableItems ? undefined : \"true\"}\n          aria-label={this.htmlSectionTitle}\n        >\n          {this.parsedItems.map((item, key) => this.renderTreeList(item, `${key}`))}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,IAAM,i3E,MCQXC,EAAS,MALtB,WAAAC,CAAAC,G,2DAUEC,KAAAC,MAAiC,GAczBD,KAAAE,YAA8B,EA4LvC,CAvLC,UAAAC,GACEH,KAAKE,mBAAqBF,KAAKC,QAAU,SAAWG,KAAKC,MAAML,KAAKC,OAASD,KAAKC,K,CAGpF,iBAAAK,GACEN,KAAKG,Y,CAGC,WAAAI,CAAYC,GAClBR,KAAKS,gBAAgBC,KAAK,CAACC,GAAIH,EAAKG,GAAIC,KAAMJ,EAAKI,KAAMC,IAAKL,EAAKK,K,CAG7D,oBAAAC,GACN,OAAOC,MAAMC,KAAKhB,KAAKiB,KAAKC,WAAWC,iBAAiB,mB,CAGlD,WAAAC,CAAYC,EAAsBC,GACxC,IAAIC,EAA+BF,EAEnC,IAAK,IAAIG,EAAI,EAAGA,EAAIF,EAAQE,IAAK,CAC/BD,EAAWA,IAAQ,MAARA,SAAQ,SAARA,EAAUE,cACrB,IAAKF,EAAU,CACb,M,EAIJ,OAAOA,C,CAGD,cAAAG,CAAeC,GACrB,GAAIA,EAAMC,OAASC,EAAaC,IAAK,CACnCH,EAAMI,iBAEN,M,CAGF,MAAMC,EAAoBhC,KAAKc,uBAC/B,MAAMmB,EAAeD,EAAkBE,QAAQP,EAAMQ,QAErD,GAAIF,KAAiB,EAAI,CACvB,M,CAGF,GAAIN,EAAMC,OAASC,EAAaO,YAAcT,EAAMC,OAASC,EAAaQ,SAAU,CAClFV,EAAMI,iBAEN,MAAMO,EAAYL,GAAgBN,EAAMC,OAASC,EAAaO,WAAa,GAAI,GAC/E,GAAIE,EAAY,GAAKA,GAAaN,EAAkBO,OAAQ,CAC1D,M,CAGFP,EAAkBM,GAAWE,O,CAG/B,GAAIb,EAAMC,OAASC,EAAaY,WAAY,CAC1Cd,EAAMI,iBACN,MAAMR,EAAWvB,KAAKoB,YAAYY,EAAkBC,GAAe,GAEnE,IACGV,IACAA,EAASmB,SAAS,IAClBnB,EAASmB,SAAS,GAAGC,QAAQC,gBAAkB,KAAOrB,EAASsB,aAAa,cAAgB,KAC7F,CACA,M,CAGDtB,EAASmB,SAAS,GAAmBF,O,CAGxC,GAAIb,EAAMC,OAASC,EAAaiB,YAAa,CAC3CnB,EAAMI,iBAEN,MAAMgB,EAAapB,EAAMQ,OAAuBa,QAAQ,kBAExD,IAAKD,EAAW,CACd,M,CAGF,MAAME,EAAoBF,EAAUG,cAAc,UAElD,IAAKD,EAAmB,CACtB,M,CAGF,MAAME,EAAaF,EAAkBC,cAAc,mBAEnD,IAAKC,EAAY,CACf,M,CAGFA,EAAWX,O,EAIP,cAAAY,CAAe5C,EAAoB6C,EAAaC,EAAQ,G,QAC9DtD,KAAKuD,QAAU/C,EAAKK,IAAM,IAAM,OAEhC,MAAM2C,EACJC,EAAA,kBACE9C,GAAI0C,EACJK,OAAQlD,EAAKmD,KAAO,cAAgB,GACpCC,UAAWC,QAAQrD,EAAKK,KACxBiD,aAAc,KACdC,KAAK,OAAM,cACEC,WAEbP,EAACzD,KAAKuD,QAAO,CACXG,MAAO,CACL,eAAgB,KAChB,SAAUG,QAAQrD,EAAKK,KACvB,iBAAkBgD,QAAQrD,EAAKK,MAEjCoD,SAAUzD,EAAKK,IAAM,GAAI,EACzBqD,QAAS,IAAMlE,KAAKO,YAAYC,GAChC2D,QAAUxC,IACR,GAAIA,EAAMC,OAASC,EAAauC,OAASzC,EAAMC,OAASC,EAAawC,MAAO,CAC1ErE,KAAKO,YAAYC,E,GAGrB8D,UAAY3C,GAAyB3B,KAAK0B,eAAeC,GACzDoC,KAAMvD,EAAKK,IAAM,WAAamD,UAAS,cAC1BxD,EAAKK,IAAMmD,UAAY,OAAM,kBAC3BO,EAAA/D,EAAKkC,YAAQ,MAAA6B,SAAA,SAAAA,EAAEhC,QAAS,GAAK,KAAI,aACpCe,EAAK,aACL9C,EAAKI,KACjB4D,KAAMhE,EAAKK,KAEX4C,EAAA,QAAMC,MAAM,iBACTlD,EAAKmD,MACJF,EAAA,UACEgB,MAAO,GACPC,OAAQ,GACRC,KAAMnE,EAAKK,IAAM,kBAAoB,qBACrC6C,MAAM,YACN9C,KAAMJ,EAAKmD,OAGfF,EAAA,QACEC,MAAO,CACL,aAAc,KACd,iBAAkBlD,EAAKmD,KACvB,YAAanD,EAAKoE,MAEpBC,MAAOrE,EAAKI,MAEXJ,EAAKI,UAIXkE,EAAAtE,EAAKkC,YAAQ,MAAAoC,SAAA,SAAAA,EAAEvC,QAAS,GACvBkB,EAAA,UAAQM,KAAK,SACXN,EAAA,OAAKC,MAAM,iBACRlD,EAAKkC,SAASqC,KAAI,CAACC,EAAO3B,IAAQrD,KAAKoD,eAAe4B,EAAO,GAAG3B,IAAOC,EAAQ,QAO1F,OAAOE,C,CAGT,MAAAyB,GACE,MAAMC,EAAoBlF,KAAKE,YAAYiF,MAAM3E,KAAWA,EAAKK,MAEjE,OACE4C,EAAC2B,EAAI,CAAA/B,IAAA,2CACHK,MAAM,YACNK,KAAMmB,EAAoB,aAAe,OAAM,cAClCA,EAAoBlB,UAAY,OAAM,kBAClChE,KAAKqF,oBAEtB5B,EAAA,OAAAJ,IAAA,2CACEY,UAAU,EACVF,KAAMmB,EAAoB,OAAS,OAAM,cAC5BA,EAAoBlB,UAAY,OAAM,aACvChE,KAAKsF,kBAEhBtF,KAAKE,YAAY6E,KAAI,CAACvE,EAAM6C,IAAQrD,KAAKoD,eAAe5C,EAAM,GAAG6C,Q","ignoreList":[]}

package/www/build/p-e9212c7a.entry.js

@@ -0,0 +1,2 @@
+import{r as a,c as o,h as r,d as i}from"./p-BEHxru6n.js";import{e as s,$ as e}from"./p-B3nR3-Jw.js";const t=()=>`:host,:host *,:host ::slotted(*){box-sizing:border-box}:host{--z-accordion-highlight-color:transparent;--z-accordion-bg:var(--color-surface01);--z-accordion-label-color:var(--color-default-text);--z-accordion-disabled-label-color:var(--color-text03);--z-accordion-content-bg:var(--color-surface01);--z-accordion-content-fg:var(--color-default-text);--z-accordion-hover-color:var(--color-surface02);--z-accordion-left-padding:calc(var(--space-unit) * 2);--z-accordion-right-padding:var(--space-unit);--z-accordion-label-font-weight:var(--font-sb);display:block;border-top:var(--border-size-small) solid var(--color-surface03);border-bottom:var(--border-size-small) solid var(--color-surface03);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host([variant="background"]){border:var(--border-size-small) solid var(--color-surface03);border-radius:var(--border-radius)}:host([variant="background"][shadow]){box-shadow:var(--shadow-2)}details{background-color:transparent}summary{--summary-x-small-height:32px;--summary-small-height:36px;--summary-big-height:44px;--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit);position:relative;display:flex;min-height:var(--summary-height);align-items:center;padding:var(--summary-y-padding) var(--z-accordion-right-padding) var(--summary-y-padding)     var(--z-accordion-left-padding);background-color:var(--z-accordion-bg);column-gap:var(--space-unit);cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}:host([size="x-small"]) summary{--summary-height:var(--summary-x-small-height)}:host([size="small"]) summary{--summary-height:var(--summary-small-height)}:host(:is([size="x-small"],[size="small"])) summary{--summary-y-padding:calc(var(--space-unit) / 2)}:host([variant="background"]) summary{padding-right:calc(var(--space-unit) * 2);border-radius:calc(var(--border-radius) - var(--border-size-small))}:host([variant="background"][open]) summary{border-bottom-left-radius:0;border-bottom-right-radius:0}:host([is-disabled]) summary{cursor:default}summary:focus:focus-visible{background-color:var(--z-accordion-hover-color);box-shadow:var(--shadow-focus-primary);outline:none}summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{position:absolute;top:0;left:0;display:block;width:var(--space-unit);height:100%;content:""}:host([highlight][variant="background"]) summary::before{border-top-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight][variant="background"]:not([open])) summary::before,:host([highlight][variant="background"][open]) .z-accordion-content::before{border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight]) summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-highlight-color, transparent)}:host([is-disabled][highlight]) summary::before,:host([is-disabled][highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-disabled-label-color)}summary>z-icon{fill:var(--z-accordion-label-color)}:host([is-disabled]) summary>z-icon{fill:var(--z-accordion-disabled-label-color)}.z-accordion-label{color:var(--z-accordion-label-color);font-size:var(--font-size-3);font-weight:var(--z-accordion-label-font-weight)}:host([size="x-small"]) .z-accordion-label{font-size:var(--font-size-2)}:host([size="x-small"]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:16px;--z-icon-height:16px}.z-accordion-tags{display:flex;align-items:center;column-gap:calc(var(--space-unit) / 2)}summary z-icon.z-accordion-chevron{margin-left:auto}.z-accordion-content{position:relative;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);background-color:var(--z-accordion-content-bg);color:var(--z-accordion-content-fg);font-size:var(--font-size-2);}:host(:is([size="x-small"],[size="small"])) .z-accordion-content{padding-bottom:var(--space-unit)}:host([size="x-small"]) .z-accordion-content{font-size:var(--font-size-1)}:host([variant="background"]) .z-accordion-content{padding-right:calc(var(--space-unit) * 2);border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small));border-bottom-right-radius:calc(var(--border-radius) - var(--border-size-small))}:host([is-disabled]) .z-accordion-label{color:var(--z-accordion-disabled-label-color)}:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot="tag"]){--z-tag-bg:var(--z-accordion-disabled-label-color) !important;--z-tag-text-color:var(--color-text-inverse) !important}@media (hover: hover){summary:focus:focus-visible{position:relative;z-index:1}:host(:not([is-disabled])) summary:hover{background-color:var(--z-accordion-hover-color)}:host(:not([is-disabled])) summary:hover .z-accordion-label{text-decoration:underline}}@media (hover: none){:host([size]) summary{--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit)}:host([size]) .z-accordion-label{font-size:var(--font-size-3)}:host([size]) .z-accordion-content{font-size:var(--font-size-2)}:host([size]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:18px;--z-icon-height:18px}}`;const c=class{constructor(r){a(this,r);this.toggled=o(this,"toggled",7);this.size=s.BIG;this.isDisabled=false;this.open=false;this.highlight=false;this.variant=e.DEFAULT;this.shadow=true;this.hasSlottedTags=false}onDisabledChange(){if(this.isDisabled){this.open=false}}checkSlottedTags(){this.hasSlottedTags=!!this.host.querySelector('[slot="tag"]')}onDetailsToggle(){if(this.isDisabled){this.open=false;this.detailsElm.open=false;return}this.open=this.detailsElm.open;this.toggled.emit(this.open)}componentWillLoad(){this.checkSlottedTags()}render(){return r("details",{key:"677f29eb9a981a8444c6de2966101caa04063bdc",ref:a=>this.detailsElm=a,onToggle:this.onDetailsToggle.bind(this),open:this.open},r("summary",{key:"498a94e2aec123598bcf6b4cd7d755b72726d9e9",tabIndex:this.isDisabled?-1:null,part:"summary"},this.icon&&r("z-icon",{key:"09eec9beaa82d2a2f81de5c0ea2d5ebee856b190",class:"z-accordion-label-icon",name:this.icon}),r("span",{key:"dbf0026bd5a832300e17ec30da2cfaf7946d1c5e",class:"z-accordion-label"},this.label),this.hasSlottedTags&&r("span",{key:"21b3f6c772537d97100d593d5415f7d73bdaeab6",class:"z-accordion-tags"},r("slot",{key:"676b85cf03540aad8a2797073e0376d23816635a",name:"tag",onSlotchange:()=>this.checkSlottedTags()})),r("z-icon",{key:"45341fe9e93b6ceafb938b4345d065d684c40246",class:"z-accordion-chevron",name:this.open?"chevron-up":"chevron-down"})),!this.isDisabled&&r("div",{key:"dea671e91b2ddd6e2666304452cc2b60b7b8fda4",class:"z-accordion-content",part:"content"},r("slot",{key:"382274fc573c359786db1a5cc986b1cc400e2960"})))}get host(){return i(this)}static get watchers(){return{isDisabled:[{onDisabledChange:0}]}}};c.style=t();export{c as z_accordion};
+//# sourceMappingURL=p-e9212c7a.entry.js.map

package/www/build/p-e9212c7a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZAccordion","constructor","hostRef","this","size","ControlSize","BIG","isDisabled","open","highlight","variant","AccordionVariant","DEFAULT","shadow","hasSlottedTags","onDisabledChange","checkSlottedTags","host","querySelector","onDetailsToggle","detailsElm","toggled","emit","componentWillLoad","render","h","key","ref","elm","onToggle","bind","tabIndex","part","icon","class","name","label","onSlotchange"],"sources":["src/components/z-accordion/styles.css?tag=z-accordion&encapsulation=shadow","src/components/z-accordion/index.tsx"],"sourcesContent":[":host,\n:host *,\n:host ::slotted(*) {\n  box-sizing: border-box;\n}\n\n:host {\n  /**\n   * @prop --z-accordion-highlight-color: Color of the highlight band on the summary's left edge. Only applies when `highlight` is true. Default: `transparent`.\n   * @prop --z-accordion-bg: Background color of the summary. Default: `--color-surface02`.\n   * @prop --z-accordion-label-color: Label color. Default: `--color-default-text`.\n   * @prop --z-accordion-disabled-label-color: Label color when disabled. Default: `--color-text03`.\n   * @prop --z-accordion-content-bg: Background color of the accordion. Default: `--color-surface02`.\n   * @prop --z-accordion-content-fg: Content text color. Default: `--color-default-text`.\n   * @prop --z-accordion-hover-color: Hover color of the summary. Default: `--color-surface03`.\n   * @prop --z-accordion-left-padding: Left padding of the summary. Default: `--space-unit` * 2.\n   * @prop --z-accordion-right-padding: Right padding of the summary. Default: `--space-unit`.\n   * @prop --z-accordion-label-font-weight: Font weight of the summary label. Default: `--font-sb`.\n   */\n  --z-accordion-highlight-color: transparent;\n  --z-accordion-bg: var(--color-surface01);\n  --z-accordion-label-color: var(--color-default-text);\n  --z-accordion-disabled-label-color: var(--color-text03);\n  --z-accordion-content-bg: var(--color-surface01);\n  --z-accordion-content-fg: var(--color-default-text);\n  --z-accordion-hover-color: var(--color-surface02);\n  --z-accordion-left-padding: calc(var(--space-unit) * 2);\n  --z-accordion-right-padding: var(--space-unit);\n  --z-accordion-label-font-weight: var(--font-sb);\n\n  display: block;\n  border-top: var(--border-size-small) solid var(--color-surface03);\n  border-bottom: var(--border-size-small) solid var(--color-surface03);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host([variant=\"background\"]) {\n  border: var(--border-size-small) solid var(--color-surface03);\n  border-radius: var(--border-radius);\n}\n\n:host([variant=\"background\"][shadow]) {\n  box-shadow: var(--shadow-2);\n}\n\ndetails {\n  background-color: transparent;\n}\n\nsummary {\n  --summary-x-small-height: 32px;\n  --summary-small-height: 36px;\n  --summary-big-height: 44px;\n  --summary-height: var(--summary-big-height);\n  --summary-y-padding: var(--space-unit);\n\n  position: relative;\n  display: flex;\n  min-height: var(--summary-height);\n  align-items: center;\n  padding: var(--summary-y-padding) var(--z-accordion-right-padding) var(--summary-y-padding)\n    var(--z-accordion-left-padding);\n  background-color: var(--z-accordion-bg);\n  column-gap: var(--space-unit);\n  cursor: pointer;\n  list-style: none;\n}\n\n/* remove marker on safari */\nsummary::-webkit-details-marker {\n  display: none;\n}\n\n:host([size=\"x-small\"]) summary {\n  --summary-height: var(--summary-x-small-height);\n}\n\n:host([size=\"small\"]) summary {\n  --summary-height: var(--summary-small-height);\n}\n\n:host(:is([size=\"x-small\"], [size=\"small\"])) summary {\n  --summary-y-padding: calc(var(--space-unit) / 2);\n}\n\n:host([variant=\"background\"]) summary {\n  padding-right: calc(var(--space-unit) * 2);\n\n  /* border-radius of the accordion - width of the accordion's border */\n  border-radius: calc(var(--border-radius) - var(--border-size-small));\n}\n\n:host([variant=\"background\"][open]) summary {\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n}\n\n:host([is-disabled]) summary {\n  cursor: default;\n}\n\nsummary:focus:focus-visible {\n  background-color: var(--z-accordion-hover-color);\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\nsummary::before,\n:host([highlight][variant=\"background\"]) .z-accordion-content::before {\n  position: absolute;\n  top: 0;\n  left: 0;\n  display: block;\n  width: var(--space-unit);\n  height: 100%;\n  content: \"\";\n}\n\n:host([highlight][variant=\"background\"]) summary::before {\n  /* border-radius of the accordion - width of the accordion's border */\n  border-top-left-radius: calc(var(--border-radius) - var(--border-size-small));\n}\n\n:host([highlight][variant=\"background\"]:not([open])) summary::before,\n:host([highlight][variant=\"background\"][open]) .z-accordion-content::before {\n  /* border-radius of the accordion - width of the accordion's border */\n  border-bottom-left-radius: calc(var(--border-radius) - var(--border-size-small));\n}\n\n:host([highlight]) summary::before,\n:host([highlight][variant=\"background\"]) .z-accordion-content::before {\n  background-color: var(--z-accordion-highlight-color, transparent);\n}\n\n:host([is-disabled][highlight]) summary::before,\n:host([is-disabled][highlight][variant=\"background\"]) .z-accordion-content::before {\n  background-color: var(--z-accordion-disabled-label-color);\n}\n\nsummary > z-icon {\n  fill: var(--z-accordion-label-color);\n}\n\n:host([is-disabled]) summary > z-icon {\n  fill: var(--z-accordion-disabled-label-color);\n}\n\n.z-accordion-label {\n  color: var(--z-accordion-label-color);\n  font-size: var(--font-size-3); /* for \"small\" and \"big\" sizes */\n  font-weight: var(--z-accordion-label-font-weight);\n}\n\n:host([size=\"x-small\"]) .z-accordion-label {\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) :is(.z-accordion-label-icon, .z-accordion-chevron) {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n.z-accordion-tags {\n  display: flex;\n  align-items: center;\n  column-gap: calc(var(--space-unit) / 2);\n}\n\nsummary z-icon.z-accordion-chevron {\n  margin-left: auto;\n}\n\n.z-accordion-content {\n  position: relative;\n  padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);\n  background-color: var(--z-accordion-content-bg);\n  color: var(--z-accordion-content-fg);\n  font-size: var(--font-size-2); /* for \"small\" and \"big\" sizes */\n}\n\n:host(:is([size=\"x-small\"], [size=\"small\"])) .z-accordion-content {\n  padding-bottom: var(--space-unit);\n}\n\n:host([size=\"x-small\"]) .z-accordion-content {\n  font-size: var(--font-size-1);\n}\n\n:host([variant=\"background\"]) .z-accordion-content {\n  padding-right: calc(var(--space-unit) * 2);\n  border-bottom-left-radius: calc(var(--border-radius) - var(--border-size-small));\n  border-bottom-right-radius: calc(var(--border-radius) - var(--border-size-small));\n}\n\n:host([is-disabled]) .z-accordion-label {\n  color: var(--z-accordion-disabled-label-color);\n}\n\n:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot=\"tag\"]) {\n  --z-tag-bg: var(--z-accordion-disabled-label-color) !important;\n  --z-tag-text-color: var(--color-text-inverse) !important;\n}\n\n@media (hover: hover) {\n  summary:focus:focus-visible {\n    /* prevents the focus shadow to be covered by the background of an hovered sibling accordion */\n    position: relative;\n    z-index: 1;\n  }\n\n  :host(:not([is-disabled])) summary:hover {\n    background-color: var(--z-accordion-hover-color);\n  }\n\n  :host(:not([is-disabled])) summary:hover .z-accordion-label {\n    text-decoration: underline;\n  }\n}\n\n/* force \"big\" variant on touch devices */\n@media (hover: none) {\n  :host([size]) summary {\n    --summary-height: var(--summary-big-height);\n    --summary-y-padding: var(--space-unit);\n  }\n\n  :host([size]) .z-accordion-label {\n    font-size: var(--font-size-3);\n  }\n\n  :host([size]) .z-accordion-content {\n    font-size: var(--font-size-2);\n  }\n\n  :host([size]) :is(.z-accordion-label-icon, .z-accordion-chevron) {\n    --z-icon-width: 18px;\n    --z-icon-height: 18px;\n  }\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {AccordionVariant, ControlSize} from \"../../beans\";\n\n/**\n * Accordion component.\n *\n * @slot - Slot for the main content.\n * @slot tag - Slot for tags.\n * @part summary - The summary element that is always visible and acts as the accordion's toggle.\n * @part content - The content element that is shown or hidden when the accordion is toggled.\n */\n@Component({\n  tag: \"z-accordion\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZAccordion implements ComponentInterface {\n  @Element() host: HTMLZAccordionElement;\n\n  /**\n   * Text label.\n   */\n  @Prop()\n  label: string;\n\n  /**\n   * Name of the z-icon to display before the label's text.\n   */\n  @Prop()\n  icon: string;\n\n  /**\n   * Size of the component.\n   */\n  @Prop({reflect: true})\n  size = ControlSize.BIG;\n\n  /**\n   * Disabled state of the accordion.\n   */\n  @Prop({reflect: true})\n  isDisabled = false;\n\n  /**\n   * The open state of the accordion.\n   */\n  @Prop({reflect: true, mutable: true})\n  open = false;\n\n  /**\n   * Enable highlight band on the `summary`'s left edge.\n   */\n  @Prop({reflect: true})\n  highlight = false;\n\n  /**\n   * Accordion variant.\n   */\n  @Prop({reflect: true})\n  variant: AccordionVariant = AccordionVariant.DEFAULT;\n\n  /**\n   * Enable box-shadow on the accordion. Only applies when `variant` is `BACKGROUND`.\n   */\n  @Prop({reflect: true})\n  shadow = true;\n\n  @State()\n  private hasSlottedTags = false;\n\n  /**\n   * Event fired when the accordion is toggled.\n   */\n  @Event()\n  toggled: EventEmitter<boolean>;\n\n  @Watch(\"isDisabled\")\n  protected onDisabledChange(): void {\n    if (this.isDisabled) {\n      this.open = false;\n    }\n  }\n\n  private detailsElm: HTMLDetailsElement;\n\n  /** Check if there is any content in the \"tag\" slot. */\n  private checkSlottedTags(): void {\n    this.hasSlottedTags = !!this.host.querySelector('[slot=\"tag\"]');\n  }\n\n  /**\n   * Handle `details` element toggle.\n   * If currently disabled, prevent toggling by forcing the `open` state to `false`.\n   * Unfortunately the \"toggle\" event is not cancelable and when catched, the `open` state is already changed.\n   */\n  private onDetailsToggle(): void {\n    if (this.isDisabled) {\n      this.open = false;\n      this.detailsElm.open = false;\n\n      return;\n    }\n\n    this.open = this.detailsElm.open;\n    this.toggled.emit(this.open);\n  }\n\n  componentWillLoad(): void {\n    this.checkSlottedTags();\n  }\n\n  render(): HTMLDetailsElement {\n    return (\n      <details\n        ref={(elm: HTMLDetailsElement) => (this.detailsElm = elm)}\n        onToggle={this.onDetailsToggle.bind(this)}\n        open={this.open}\n      >\n        <summary\n          tabIndex={this.isDisabled ? -1 : null}\n          part=\"summary\"\n        >\n          {this.icon && (\n            <z-icon\n              class=\"z-accordion-label-icon\"\n              name={this.icon}\n            />\n          )}\n          <span class=\"z-accordion-label\">{this.label}</span>\n          {this.hasSlottedTags && (\n            <span class=\"z-accordion-tags\">\n              <slot\n                name=\"tag\"\n                onSlotchange={() => this.checkSlottedTags()}\n              />\n            </span>\n          )}\n          <z-icon\n            class=\"z-accordion-chevron\"\n            name={this.open ? \"chevron-up\" : \"chevron-down\"}\n          />\n        </summary>\n        {!this.isDisabled && (\n          <div\n            class=\"z-accordion-content\"\n            part=\"content\"\n          >\n            <slot />\n          </div>\n        )}\n      </details>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,IAAM,snK,MCgBXC,EAAU,MALvB,WAAAC,CAAAC,G,2CAwBEC,KAAAC,KAAOC,EAAYC,IAMnBH,KAAAI,WAAa,MAMbJ,KAAAK,KAAO,MAMPL,KAAAM,UAAY,MAMZN,KAAAO,QAA4BC,EAAiBC,QAM7CT,KAAAU,OAAS,KAGDV,KAAAW,eAAiB,KAqF1B,CA5EW,gBAAAC,GACR,GAAIZ,KAAKI,WAAY,CACnBJ,KAAKK,KAAO,K,EAOR,gBAAAQ,GACNb,KAAKW,iBAAmBX,KAAKc,KAAKC,cAAc,e,CAQ1C,eAAAC,GACN,GAAIhB,KAAKI,WAAY,CACnBJ,KAAKK,KAAO,MACZL,KAAKiB,WAAWZ,KAAO,MAEvB,M,CAGFL,KAAKK,KAAOL,KAAKiB,WAAWZ,KAC5BL,KAAKkB,QAAQC,KAAKnB,KAAKK,K,CAGzB,iBAAAe,GACEpB,KAAKa,kB,CAGP,MAAAQ,GACE,OACEC,EAAA,WAAAC,IAAA,2CACEC,IAAMC,GAA6BzB,KAAKiB,WAAaQ,EACrDC,SAAU1B,KAAKgB,gBAAgBW,KAAK3B,MACpCK,KAAML,KAAKK,MAEXiB,EAAA,WAAAC,IAAA,2CACEK,SAAU5B,KAAKI,YAAa,EAAK,KACjCyB,KAAK,WAEJ7B,KAAK8B,MACJR,EAAA,UAAAC,IAAA,2CACEQ,MAAM,yBACNC,KAAMhC,KAAK8B,OAGfR,EAAA,QAAAC,IAAA,2CAAMQ,MAAM,qBAAqB/B,KAAKiC,OACrCjC,KAAKW,gBACJW,EAAA,QAAAC,IAAA,2CAAMQ,MAAM,oBACVT,EAAA,QAAAC,IAAA,2CACES,KAAK,MACLE,aAAc,IAAMlC,KAAKa,sBAI/BS,EAAA,UAAAC,IAAA,2CACEQ,MAAM,sBACNC,KAAMhC,KAAKK,KAAO,aAAe,mBAGnCL,KAAKI,YACLkB,EAAA,OAAAC,IAAA,2CACEQ,MAAM,sBACNF,KAAK,WAELP,EAAA,QAAAC,IAAA,8C","ignoreList":[]}

package/www/build/p-e9722221.entry.js

@@ -0,0 +1,8 @@
+import{r as t,c as e,h as i,H as n,d as r}from"./p-BEHxru6n.js";import{r as s,g as o}from"./p-B3nR3-Jw.js";import{g as a}from"./p-B85MJLTf.js";
+/*! @license DOMPurify 3.4.0 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.4.0/LICENSE */const{entries:l,setPrototypeOf:c,isFrozen:f,getPrototypeOf:u,getOwnPropertyDescriptor:h}=Object;let{freeze:d,seal:p,create:m}=Object;let{apply:v,construct:g}=typeof Reflect!=="undefined"&&Reflect;if(!d){d=function t(e){return e}}if(!p){p=function t(e){return e}}if(!v){v=function t(e,i){for(var n=arguments.length,r=new Array(n>2?n-2:0),s=2;s<n;s++){r[s-2]=arguments[s]}return e.apply(i,r)}}if(!g){g=function t(e){for(var i=arguments.length,n=new Array(i>1?i-1:0),r=1;r<i;r++){n[r-1]=arguments[r]}return new e(...n)}}const b=z(Array.prototype.forEach);const y=z(Array.prototype.lastIndexOf);const w=z(Array.prototype.pop);const T=z(Array.prototype.push);const x=z(Array.prototype.splice);const E=z(String.prototype.toLowerCase);const k=z(String.prototype.toString);const A=z(String.prototype.match);const S=z(String.prototype.replace);const R=z(String.prototype.indexOf);const _=z(String.prototype.trim);const I=z(Object.prototype.hasOwnProperty);const D=z(RegExp.prototype.test);const M=O(TypeError);function z(t){return function(e){if(e instanceof RegExp){e.lastIndex=0}for(var i=arguments.length,n=new Array(i>1?i-1:0),r=1;r<i;r++){n[r-1]=arguments[r]}return v(t,e,n)}}function O(t){return function(){for(var e=arguments.length,i=new Array(e),n=0;n<e;n++){i[n]=arguments[n]}return g(t,i)}}function P(t,e){let i=arguments.length>2&&arguments[2]!==undefined?arguments[2]:E;if(c){c(t,null)}let n=e.length;while(n--){let r=e[n];if(typeof r==="string"){const t=i(r);if(t!==r){if(!f(e)){e[n]=t}r=t}}t[r]=true}return t}function C(t){for(let e=0;e<t.length;e++){const i=I(t,e);if(!i){t[e]=null}}return t}function L(t){const e=m(null);for(const[i,n]of l(t)){const r=I(t,i);if(r){if(Array.isArray(n)){e[i]=C(n)}else if(n&&typeof n==="object"&&n.constructor===Object){e[i]=L(n)}else{e[i]=n}}}return e}function N(t,e){while(t!==null){const i=h(t,e);if(i){if(i.get){return z(i.get)}if(typeof i.value==="function"){return z(i.value)}}t=u(t)}function i(){return null}return i}const F=d(["a","abbr","acronym","address","area","article","aside","audio","b","bdi","bdo","big","blink","blockquote","body","br","button","canvas","caption","center","cite","code","col","colgroup","content","data","datalist","dd","decorator","del","details","dfn","dialog","dir","div","dl","dt","element","em","fieldset","figcaption","figure","font","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","img","input","ins","kbd","label","legend","li","main","map","mark","marquee","menu","menuitem","meter","nav","nobr","ol","optgroup","option","output","p","picture","pre","progress","q","rp","rt","ruby","s","samp","search","section","select","shadow","slot","small","source","spacer","span","strike","strong","style","sub","summary","sup","table","tbody","td","template","textarea","tfoot","th","thead","time","tr","track","tt","u","ul","var","video","wbr"]);const j=d(["svg","a","altglyph","altglyphdef","altglyphitem","animatecolor","animatemotion","animatetransform","circle","clippath","defs","desc","ellipse","enterkeyhint","exportparts","filter","font","g","glyph","glyphref","hkern","image","inputmode","line","lineargradient","marker","mask","metadata","mpath","part","path","pattern","polygon","polyline","radialgradient","rect","stop","style","switch","symbol","text","textpath","title","tref","tspan","view","vkern"]);const U=d(["feBlend","feColorMatrix","feComponentTransfer","feComposite","feConvolveMatrix","feDiffuseLighting","feDisplacementMap","feDistantLight","feDropShadow","feFlood","feFuncA","feFuncB","feFuncG","feFuncR","feGaussianBlur","feImage","feMerge","feMergeNode","feMorphology","feOffset","fePointLight","feSpecularLighting","feSpotLight","feTile","feTurbulence"]);const B=d(["animate","color-profile","cursor","discard","font-face","font-face-format","font-face-name","font-face-src","font-face-uri","foreignobject","hatch","hatchpath","mesh","meshgradient","meshpatch","meshrow","missing-glyph","script","set","solidcolor","unknown","use"]);const H=d(["math","menclose","merror","mfenced","mfrac","mglyph","mi","mlabeledtr","mmultiscripts","mn","mo","mover","mpadded","mphantom","mroot","mrow","ms","mspace","msqrt","mstyle","msub","msup","msubsup","mtable","mtd","mtext","mtr","munder","munderover","mprescripts"]);const W=d(["maction","maligngroup","malignmark","mlongdiv","mscarries","mscarry","msgroup","mstack","msline","msrow","semantics","annotation","annotation-xml","mprescripts","none"]);const X=d(["#text"]);const Y=d(["accept","action","align","alt","autocapitalize","autocomplete","autopictureinpicture","autoplay","background","bgcolor","border","capture","cellpadding","cellspacing","checked","cite","class","clear","color","cols","colspan","controls","controlslist","coords","crossorigin","datetime","decoding","default","dir","disabled","disablepictureinpicture","disableremoteplayback","download","draggable","enctype","enterkeyhint","exportparts","face","for","headers","height","hidden","high","href","hreflang","id","inert","inputmode","integrity","ismap","kind","label","lang","list","loading","loop","low","max","maxlength","media","method","min","minlength","multiple","muted","name","nonce","noshade","novalidate","nowrap","open","optimum","part","pattern","placeholder","playsinline","popover","popovertarget","popovertargetaction","poster","preload","pubdate","radiogroup","readonly","rel","required","rev","reversed","role","rows","rowspan","spellcheck","scope","selected","shape","size","sizes","slot","span","srclang","start","src","srcset","step","style","summary","tabindex","title","translate","type","usemap","valign","value","width","wrap","xmlns","slot"]);const q=d(["accent-height","accumulate","additive","alignment-baseline","amplitude","ascent","attributename","attributetype","azimuth","basefrequency","baseline-shift","begin","bias","by","class","clip","clippathunits","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cx","cy","d","dx","dy","diffuseconstant","direction","display","divisor","dur","edgemode","elevation","end","exponent","fill","fill-opacity","fill-rule","filter","filterunits","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","fx","fy","g1","g2","glyph-name","glyphref","gradientunits","gradienttransform","height","href","id","image-rendering","in","in2","intercept","k","k1","k2","k3","k4","kerning","keypoints","keysplines","keytimes","lang","lengthadjust","letter-spacing","kernelmatrix","kernelunitlength","lighting-color","local","marker-end","marker-mid","marker-start","markerheight","markerunits","markerwidth","maskcontentunits","maskunits","max","mask","mask-type","media","method","mode","min","name","numoctaves","offset","operator","opacity","order","orient","orientation","origin","overflow","paint-order","path","pathlength","patterncontentunits","patterntransform","patternunits","points","preservealpha","preserveaspectratio","primitiveunits","r","rx","ry","radius","refx","refy","repeatcount","repeatdur","restart","result","rotate","scale","seed","shape-rendering","slope","specularconstant","specularexponent","spreadmethod","startoffset","stddeviation","stitchtiles","stop-color","stop-opacity","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke","stroke-width","style","surfacescale","systemlanguage","tabindex","tablevalues","targetx","targety","transform","transform-origin","text-anchor","text-decoration","text-rendering","textlength","type","u1","u2","unicode","values","viewbox","visibility","version","vert-adv-y","vert-origin-x","vert-origin-y","width","word-spacing","wrap","writing-mode","xchannelselector","ychannelselector","x","x1","x2","xmlns","y","y1","y2","z","zoomandpan"]);const $=d(["accent","accentunder","align","bevelled","close","columnalign","columnlines","columnspacing","columnspan","denomalign","depth","dir","display","displaystyle","encoding","fence","frame","height","href","id","largeop","length","linethickness","lquote","lspace","mathbackground","mathcolor","mathsize","mathvariant","maxsize","minsize","movablelimits","notation","numalign","open","rowalign","rowlines","rowspacing","rowspan","rspace","rquote","scriptlevel","scriptminsize","scriptsizemultiplier","selection","separator","separators","stretchy","subscriptshift","supscriptshift","symmetric","voffset","width","xmlns"]);const G=d(["xlink:href","xml:id","xlink:title","xml:space","xmlns:xlink"]);const V=p(/\{\{[\w\W]*|[\w\W]*\}\}/gm);const Z=p(/<%[\w\W]*|[\w\W]*%>/gm);const J=p(/\$\{[\w\W]*/gm);const K=p(/^data-[\-\w.\u00B7-\uFFFF]+$/);const Q=p(/^aria-[\-\w]+$/);const tt=p(/^(?:(?:(?:f|ht)tps?|mailto|tel|callto|sms|cid|xmpp|matrix):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i);const et=p(/^(?:\w+script|data):/i);const it=p(/[\u0000-\u0020\u00A0\u1680\u180E\u2000-\u2029\u205F\u3000]/g);const nt=p(/^html$/i);const rt=p(/^[a-z][.\w]*(-[.\w]+)+$/i);var st=Object.freeze({__proto__:null,ARIA_ATTR:Q,ATTR_WHITESPACE:it,CUSTOM_ELEMENT:rt,DATA_ATTR:K,DOCTYPE_NAME:nt,ERB_EXPR:Z,IS_ALLOWED_URI:tt,IS_SCRIPT_OR_DATA:et,MUSTACHE_EXPR:V,TMPLIT_EXPR:J});const ot={element:1,text:3,progressingInstruction:7,comment:8,document:9};const at=function t(){return typeof window==="undefined"?null:window};const lt=function t(e,i){if(typeof e!=="object"||typeof e.createPolicy!=="function"){return null}let n=null;const r="data-tt-policy-suffix";if(i&&i.hasAttribute(r)){n=i.getAttribute(r)}const s="dompurify"+(n?"#"+n:"");try{return e.createPolicy(s,{createHTML(t){return t},createScriptURL(t){return t}})}catch(t){console.warn("TrustedTypes policy "+s+" could not be created.");return null}};const ct=function t(){return{afterSanitizeAttributes:[],afterSanitizeElements:[],afterSanitizeShadowDOM:[],beforeSanitizeAttributes:[],beforeSanitizeElements:[],beforeSanitizeShadowDOM:[],uponSanitizeAttribute:[],uponSanitizeElement:[],uponSanitizeShadowNode:[]}};function ft(){let t=arguments.length>0&&arguments[0]!==undefined?arguments[0]:at();const e=t=>ft(t);e.version="3.4.0";e.removed=[];if(!t||!t.document||t.document.nodeType!==ot.document||!t.Element){e.isSupported=false;return e}let{document:i}=t;const n=i;const r=n.currentScript;const{DocumentFragment:s,HTMLTemplateElement:o,Node:a,Element:c,NodeFilter:f,NamedNodeMap:u=t.NamedNodeMap||t.MozNamedAttrMap,HTMLFormElement:h,DOMParser:p,trustedTypes:v}=t;const g=c.prototype;const z=N(g,"cloneNode");const O=N(g,"remove");const C=N(g,"nextSibling");const V=N(g,"childNodes");const Z=N(g,"parentNode");if(typeof o==="function"){const t=i.createElement("template");if(t.content&&t.content.ownerDocument){i=t.content.ownerDocument}}let J;let K="";const{implementation:Q,createNodeIterator:et,createDocumentFragment:it,getElementsByTagName:rt}=i;const{importNode:ut}=n;let ht=ct();e.isSupported=typeof l==="function"&&typeof Z==="function"&&Q&&Q.createHTMLDocument!==undefined;const{MUSTACHE_EXPR:dt,ERB_EXPR:pt,TMPLIT_EXPR:mt,DATA_ATTR:vt,ARIA_ATTR:gt,IS_SCRIPT_OR_DATA:bt,ATTR_WHITESPACE:yt,CUSTOM_ELEMENT:wt}=st;let{IS_ALLOWED_URI:Tt}=st;let xt=null;const Et=P({},[...F,...j,...U,...H,...X]);let kt=null;const At=P({},[...Y,...q,...$,...G]);let St=Object.seal(m(null,{tagNameCheck:{writable:true,configurable:false,enumerable:true,value:null},attributeNameCheck:{writable:true,configurable:false,enumerable:true,value:null},allowCustomizedBuiltInElements:{writable:true,configurable:false,enumerable:true,value:false}}));let Rt=null;let _t=null;const It=Object.seal(m(null,{tagCheck:{writable:true,configurable:false,enumerable:true,value:null},attributeCheck:{writable:true,configurable:false,enumerable:true,value:null}}));let Dt=true;let Mt=true;let zt=false;let Ot=true;let Pt=false;let Ct=true;let Lt=false;let Nt=false;let Ft=false;let jt=false;let Ut=false;let Bt=false;let Ht=true;let Wt=false;const Xt="user-content-";let Yt=true;let qt=false;let $t={};let Gt=null;const Vt=P({},["annotation-xml","audio","colgroup","desc","foreignobject","head","iframe","math","mi","mn","mo","ms","mtext","noembed","noframes","noscript","plaintext","script","style","svg","template","thead","title","video","xmp"]);let Zt=null;const Jt=P({},["audio","video","img","source","image","track"]);let Kt=null;const Qt=P({},["alt","class","for","id","label","name","pattern","placeholder","role","summary","title","value","style","xmlns"]);const te="http://www.w3.org/1998/Math/MathML";const ee="http://www.w3.org/2000/svg";const ie="http://www.w3.org/1999/xhtml";let ne=ie;let re=false;let se=null;const oe=P({},[te,ee,ie],k);let ae=P({},["mi","mo","mn","ms","mtext"]);let le=P({},["annotation-xml"]);const ce=P({},["title","style","font","a","script"]);let fe=null;const ue=["application/xhtml+xml","text/html"];const he="text/html";let de=null;let pe=null;const me=i.createElement("form");const ve=function t(e){return e instanceof RegExp||e instanceof Function};const ge=function t(){let e=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};if(pe&&pe===e){return}if(!e||typeof e!=="object"){e={}}e=L(e);fe=ue.indexOf(e.PARSER_MEDIA_TYPE)===-1?he:e.PARSER_MEDIA_TYPE;de=fe==="application/xhtml+xml"?k:E;xt=I(e,"ALLOWED_TAGS")?P({},e.ALLOWED_TAGS,de):Et;kt=I(e,"ALLOWED_ATTR")?P({},e.ALLOWED_ATTR,de):At;se=I(e,"ALLOWED_NAMESPACES")?P({},e.ALLOWED_NAMESPACES,k):oe;Kt=I(e,"ADD_URI_SAFE_ATTR")?P(L(Qt),e.ADD_URI_SAFE_ATTR,de):Qt;Zt=I(e,"ADD_DATA_URI_TAGS")?P(L(Jt),e.ADD_DATA_URI_TAGS,de):Jt;Gt=I(e,"FORBID_CONTENTS")?P({},e.FORBID_CONTENTS,de):Vt;Rt=I(e,"FORBID_TAGS")?P({},e.FORBID_TAGS,de):L({});_t=I(e,"FORBID_ATTR")?P({},e.FORBID_ATTR,de):L({});$t=I(e,"USE_PROFILES")?e.USE_PROFILES:false;Dt=e.ALLOW_ARIA_ATTR!==false;Mt=e.ALLOW_DATA_ATTR!==false;zt=e.ALLOW_UNKNOWN_PROTOCOLS||false;Ot=e.ALLOW_SELF_CLOSE_IN_ATTR!==false;Pt=e.SAFE_FOR_TEMPLATES||false;Ct=e.SAFE_FOR_XML!==false;Lt=e.WHOLE_DOCUMENT||false;jt=e.RETURN_DOM||false;Ut=e.RETURN_DOM_FRAGMENT||false;Bt=e.RETURN_TRUSTED_TYPE||false;Ft=e.FORCE_BODY||false;Ht=e.SANITIZE_DOM!==false;Wt=e.SANITIZE_NAMED_PROPS||false;Yt=e.KEEP_CONTENT!==false;qt=e.IN_PLACE||false;Tt=e.ALLOWED_URI_REGEXP||tt;ne=e.NAMESPACE||ie;ae=e.MATHML_TEXT_INTEGRATION_POINTS||ae;le=e.HTML_INTEGRATION_POINTS||le;St=e.CUSTOM_ELEMENT_HANDLING||m(null);if(e.CUSTOM_ELEMENT_HANDLING&&ve(e.CUSTOM_ELEMENT_HANDLING.tagNameCheck)){St.tagNameCheck=e.CUSTOM_ELEMENT_HANDLING.tagNameCheck}if(e.CUSTOM_ELEMENT_HANDLING&&ve(e.CUSTOM_ELEMENT_HANDLING.attributeNameCheck)){St.attributeNameCheck=e.CUSTOM_ELEMENT_HANDLING.attributeNameCheck}if(e.CUSTOM_ELEMENT_HANDLING&&typeof e.CUSTOM_ELEMENT_HANDLING.allowCustomizedBuiltInElements==="boolean"){St.allowCustomizedBuiltInElements=e.CUSTOM_ELEMENT_HANDLING.allowCustomizedBuiltInElements}if(Pt){Mt=false}if(Ut){jt=true}if($t){xt=P({},X);kt=m(null);if($t.html===true){P(xt,F);P(kt,Y)}if($t.svg===true){P(xt,j);P(kt,q);P(kt,G)}if($t.svgFilters===true){P(xt,U);P(kt,q);P(kt,G)}if($t.mathMl===true){P(xt,H);P(kt,$);P(kt,G)}}It.tagCheck=null;It.attributeCheck=null;if(e.ADD_TAGS){if(typeof e.ADD_TAGS==="function"){It.tagCheck=e.ADD_TAGS}else{if(xt===Et){xt=L(xt)}P(xt,e.ADD_TAGS,de)}}if(e.ADD_ATTR){if(typeof e.ADD_ATTR==="function"){It.attributeCheck=e.ADD_ATTR}else{if(kt===At){kt=L(kt)}P(kt,e.ADD_ATTR,de)}}if(e.ADD_URI_SAFE_ATTR){P(Kt,e.ADD_URI_SAFE_ATTR,de)}if(e.FORBID_CONTENTS){if(Gt===Vt){Gt=L(Gt)}P(Gt,e.FORBID_CONTENTS,de)}if(e.ADD_FORBID_CONTENTS){if(Gt===Vt){Gt=L(Gt)}P(Gt,e.ADD_FORBID_CONTENTS,de)}if(Yt){xt["#text"]=true}if(Lt){P(xt,["html","head","body"])}if(xt.table){P(xt,["tbody"]);delete Rt.tbody}if(e.TRUSTED_TYPES_POLICY){if(typeof e.TRUSTED_TYPES_POLICY.createHTML!=="function"){throw M('TRUSTED_TYPES_POLICY configuration option must provide a "createHTML" hook.')}if(typeof e.TRUSTED_TYPES_POLICY.createScriptURL!=="function"){throw M('TRUSTED_TYPES_POLICY configuration option must provide a "createScriptURL" hook.')}J=e.TRUSTED_TYPES_POLICY;K=J.createHTML("")}else{if(J===undefined){J=lt(v,r)}if(J!==null&&typeof K==="string"){K=J.createHTML("")}}if(d){d(e)}pe=e};const be=P({},[...j,...U,...B]);const ye=P({},[...H,...W]);const we=function t(e){let i=Z(e);if(!i||!i.tagName){i={namespaceURI:ne,tagName:"template"}}const n=E(e.tagName);const r=E(i.tagName);if(!se[e.namespaceURI]){return false}if(e.namespaceURI===ee){if(i.namespaceURI===ie){return n==="svg"}if(i.namespaceURI===te){return n==="svg"&&(r==="annotation-xml"||ae[r])}return Boolean(be[n])}if(e.namespaceURI===te){if(i.namespaceURI===ie){return n==="math"}if(i.namespaceURI===ee){return n==="math"&&le[r]}return Boolean(ye[n])}if(e.namespaceURI===ie){if(i.namespaceURI===ee&&!le[r]){return false}if(i.namespaceURI===te&&!ae[r]){return false}return!ye[n]&&(ce[n]||!be[n])}if(fe==="application/xhtml+xml"&&se[e.namespaceURI]){return true}return false};const Te=function t(i){T(e.removed,{element:i});try{Z(i).removeChild(i)}catch(t){O(i)}};const xe=function t(i,n){try{T(e.removed,{attribute:n.getAttributeNode(i),from:n})}catch(t){T(e.removed,{attribute:null,from:n})}n.removeAttribute(i);if(i==="is"){if(jt||Ut){try{Te(n)}catch(t){}}else{try{n.setAttribute(i,"")}catch(t){}}}};const Ee=function t(e){let n=null;let r=null;if(Ft){e="<remove></remove>"+e}else{const t=A(e,/^[\r\n\t ]+/);r=t&&t[0]}if(fe==="application/xhtml+xml"&&ne===ie){e='<html xmlns="http://www.w3.org/1999/xhtml"><head></head><body>'+e+"</body></html>"}const s=J?J.createHTML(e):e;if(ne===ie){try{n=(new p).parseFromString(s,fe)}catch(t){}}if(!n||!n.documentElement){n=Q.createDocument(ne,"template",null);try{n.documentElement.innerHTML=re?K:s}catch(t){}}const o=n.body||n.documentElement;if(e&&r){o.insertBefore(i.createTextNode(r),o.childNodes[0]||null)}if(ne===ie){return rt.call(n,Lt?"html":"body")[0]}return Lt?n.documentElement:o};const ke=function t(e){return et.call(e.ownerDocument||e,e,f.SHOW_ELEMENT|f.SHOW_COMMENT|f.SHOW_TEXT|f.SHOW_PROCESSING_INSTRUCTION|f.SHOW_CDATA_SECTION,null)};const Ae=function t(e){return e instanceof h&&(typeof e.nodeName!=="string"||typeof e.textContent!=="string"||typeof e.removeChild!=="function"||!(e.attributes instanceof u)||typeof e.removeAttribute!=="function"||typeof e.setAttribute!=="function"||typeof e.namespaceURI!=="string"||typeof e.insertBefore!=="function"||typeof e.hasChildNodes!=="function")};const Se=function t(e){return typeof a==="function"&&e instanceof a};function Re(t,i,n){b(t,(t=>{t.call(e,i,n,pe)}))}const _e=function t(i){let n=null;Re(ht.beforeSanitizeElements,i,null);if(Ae(i)){Te(i);return true}const r=de(i.nodeName);Re(ht.uponSanitizeElement,i,{tagName:r,allowedTags:xt});if(Ct&&i.hasChildNodes()&&!Se(i.firstElementChild)&&D(/<[/\w!]/g,i.innerHTML)&&D(/<[/\w!]/g,i.textContent)){Te(i);return true}if(Ct&&i.namespaceURI===ie&&r==="style"&&Se(i.firstElementChild)){Te(i);return true}if(i.nodeType===ot.progressingInstruction){Te(i);return true}if(Ct&&i.nodeType===ot.comment&&D(/<[/\w]/g,i.data)){Te(i);return true}if(Rt[r]||!(It.tagCheck instanceof Function&&It.tagCheck(r))&&!xt[r]){if(!Rt[r]&&De(r)){if(St.tagNameCheck instanceof RegExp&&D(St.tagNameCheck,r)){return false}if(St.tagNameCheck instanceof Function&&St.tagNameCheck(r)){return false}}if(Yt&&!Gt[r]){const t=Z(i)||i.parentNode;const e=V(i)||i.childNodes;if(e&&t){const n=e.length;for(let r=n-1;r>=0;--r){const n=z(e[r],true);n.__removalCount=(i.__removalCount||0)+1;t.insertBefore(n,C(i))}}}Te(i);return true}if(i instanceof c&&!we(i)){Te(i);return true}if((r==="noscript"||r==="noembed"||r==="noframes")&&D(/<\/no(script|embed|frames)/i,i.innerHTML)){Te(i);return true}if(Pt&&i.nodeType===ot.text){n=i.textContent;b([dt,pt,mt],(t=>{n=S(n,t," ")}));if(i.textContent!==n){T(e.removed,{element:i.cloneNode()});i.textContent=n}}Re(ht.afterSanitizeElements,i,null);return false};const Ie=function t(e,n,r){if(_t[n]){return false}if(Ht&&(n==="id"||n==="name")&&(r in i||r in me)){return false}if(Mt&&!_t[n]&&D(vt,n));else if(Dt&&D(gt,n));else if(It.attributeCheck instanceof Function&&It.attributeCheck(n,e));else if(!kt[n]||_t[n]){if(De(e)&&(St.tagNameCheck instanceof RegExp&&D(St.tagNameCheck,e)||St.tagNameCheck instanceof Function&&St.tagNameCheck(e))&&(St.attributeNameCheck instanceof RegExp&&D(St.attributeNameCheck,n)||St.attributeNameCheck instanceof Function&&St.attributeNameCheck(n,e))||n==="is"&&St.allowCustomizedBuiltInElements&&(St.tagNameCheck instanceof RegExp&&D(St.tagNameCheck,r)||St.tagNameCheck instanceof Function&&St.tagNameCheck(r)));else{return false}}else if(Kt[n]);else if(D(Tt,S(r,yt,"")));else if((n==="src"||n==="xlink:href"||n==="href")&&e!=="script"&&R(r,"data:")===0&&Zt[e]);else if(zt&&!D(bt,S(r,yt,"")));else if(r){return false}else;return true};const De=function t(e){return e!=="annotation-xml"&&A(e,wt)};const Me=function t(i){Re(ht.beforeSanitizeAttributes,i,null);const{attributes:n}=i;if(!n||Ae(i)){return}const r={attrName:"",attrValue:"",keepAttr:true,allowedAttributes:kt,forceKeepAttr:undefined};let s=n.length;while(s--){const t=n[s];const{name:o,namespaceURI:a,value:l}=t;const c=de(o);const f=l;let u=o==="value"?f:_(f);r.attrName=c;r.attrValue=u;r.keepAttr=true;r.forceKeepAttr=undefined;Re(ht.uponSanitizeAttribute,i,r);u=r.attrValue;if(Wt&&(c==="id"||c==="name")){xe(o,i);u=Xt+u}if(Ct&&D(/((--!?|])>)|<\/(style|script|title|xmp|textarea|noscript|iframe|noembed|noframes)/i,u)){xe(o,i);continue}if(c==="attributename"&&A(u,"href")){xe(o,i);continue}if(r.forceKeepAttr){continue}if(!r.keepAttr){xe(o,i);continue}if(!Ot&&D(/\/>/i,u)){xe(o,i);continue}if(Pt){b([dt,pt,mt],(t=>{u=S(u,t," ")}))}const h=de(i.nodeName);if(!Ie(h,c,u)){xe(o,i);continue}if(J&&typeof v==="object"&&typeof v.getAttributeType==="function"){if(a);else{switch(v.getAttributeType(h,c)){case"TrustedHTML":{u=J.createHTML(u);break}case"TrustedScriptURL":{u=J.createScriptURL(u);break}}}}if(u!==f){try{if(a){i.setAttributeNS(a,o,u)}else{i.setAttribute(o,u)}if(Ae(i)){Te(i)}else{w(e.removed)}}catch(t){xe(o,i)}}}Re(ht.afterSanitizeAttributes,i,null)};const ze=function t(e){let i=null;const n=ke(e);Re(ht.beforeSanitizeShadowDOM,e,null);while(i=n.nextNode()){Re(ht.uponSanitizeShadowNode,i,null);_e(i);Me(i);if(i.content instanceof s){ze(i.content)}}Re(ht.afterSanitizeShadowDOM,e,null)};e.sanitize=function(t){let i=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};let r=null;let o=null;let l=null;let c=null;re=!t;if(re){t="\x3c!--\x3e"}if(typeof t!=="string"&&!Se(t)){if(typeof t.toString==="function"){t=t.toString();if(typeof t!=="string"){throw M("dirty is not a string, aborting")}}else{throw M("toString is not a function")}}if(!e.isSupported){return t}if(!Nt){ge(i)}e.removed=[];if(typeof t==="string"){qt=false}if(qt){if(t.nodeName){const e=de(t.nodeName);if(!xt[e]||Rt[e]){throw M("root node is forbidden and cannot be sanitized in-place")}}}else if(t instanceof a){r=Ee("\x3c!----\x3e");o=r.ownerDocument.importNode(t,true);if(o.nodeType===ot.element&&o.nodeName==="BODY"){r=o}else if(o.nodeName==="HTML"){r=o}else{r.appendChild(o)}}else{if(!jt&&!Pt&&!Lt&&t.indexOf("<")===-1){return J&&Bt?J.createHTML(t):t}r=Ee(t);if(!r){return jt?null:Bt?K:""}}if(r&&Ft){Te(r.firstChild)}const f=ke(qt?t:r);while(l=f.nextNode()){_e(l);Me(l);if(l.content instanceof s){ze(l.content)}}if(qt){return t}if(jt){if(Pt){r.normalize();let t=r.innerHTML;b([dt,pt,mt],(e=>{t=S(t,e," ")}));r.innerHTML=t}if(Ut){c=it.call(r.ownerDocument);while(r.firstChild){c.appendChild(r.firstChild)}}else{c=r}if(kt.shadowroot||kt.shadowrootmode){c=ut.call(n,c,true)}return c}let u=Lt?r.outerHTML:r.innerHTML;if(Lt&&xt["!doctype"]&&r.ownerDocument&&r.ownerDocument.doctype&&r.ownerDocument.doctype.name&&D(nt,r.ownerDocument.doctype.name)){u="<!DOCTYPE "+r.ownerDocument.doctype.name+">\n"+u}if(Pt){b([dt,pt,mt],(t=>{u=S(u,t," ")}))}return J&&Bt?J.createHTML(u):u};e.setConfig=function(){let t=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};ge(t);Nt=true};e.clearConfig=function(){pe=null;Nt=false};e.isValidAttribute=function(t,e,i){if(!pe){ge({})}const n=de(t);const r=de(e);return Ie(n,r,i)};e.addHook=function(t,e){if(typeof e!=="function"){return}T(ht[t],e)};e.removeHook=function(t,e){if(e!==undefined){const i=y(ht[t],e);return i===-1?undefined:x(ht[t],i,1)[0]}return w(ht[t])};e.removeHooks=function(t){ht[t]=[]};e.removeAllHooks=function(){ht=ct()};return e}var ut=ft();var ht={exports:{}};
+/*! Hammer.JS - v2.0.7 - 2016-04-22
+ * http://hammerjs.github.io/
+ *
+ * Copyright (c) 2016 Jorik Tangelder;
+ * Licensed under the MIT license */var dt;function pt(){if(dt)return ht.exports;dt=1;(function(t){(function(e,i,n,r){var s=["","webkit","Moz","MS","ms","o"];var o=i.createElement("div");var a="function";var l=Math.round;var c=Math.abs;var f=Date.now;function u(t,e,i){return setTimeout(y(t,i),e)}function h(t,e,i){if(Array.isArray(t)){d(t,i[e],i);return true}return false}function d(t,e,i){var n;if(!t){return}if(t.forEach){t.forEach(e,i)}else if(t.length!==r){n=0;while(n<t.length){e.call(i,t[n],n,t);n++}}else{for(n in t){t.hasOwnProperty(n)&&e.call(i,t[n],n,t)}}}function p(t,i,n){var r="DEPRECATED METHOD: "+i+"\n"+n+" AT \n";return function(){var i=new Error("get-stack-trace");var n=i&&i.stack?i.stack.replace(/^[^\(]+?[\n$]/gm,"").replace(/^\s+at\s+/gm,"").replace(/^Object.<anonymous>\s*\(/gm,"{anonymous}()@"):"Unknown Stack Trace";var s=e.console&&(e.console.warn||e.console.log);if(s){s.call(e.console,r,n)}return t.apply(this,arguments)}}var m;if(typeof Object.assign!=="function"){m=function t(e){if(e===r||e===null){throw new TypeError("Cannot convert undefined or null to object")}var i=Object(e);for(var n=1;n<arguments.length;n++){var s=arguments[n];if(s!==r&&s!==null){for(var o in s){if(s.hasOwnProperty(o)){i[o]=s[o]}}}}return i}}else{m=Object.assign}var v=p((function t(e,i,n){var s=Object.keys(i);var o=0;while(o<s.length){if(!n||n&&e[s[o]]===r){e[s[o]]=i[s[o]]}o++}return e}),"extend","Use `assign`.");var g=p((function t(e,i){return v(e,i,true)}),"merge","Use `assign`.");function b(t,e,i){var n=e.prototype,r;r=t.prototype=Object.create(n);r.constructor=t;r._super=n;if(i){m(r,i)}}function y(t,e){return function i(){return t.apply(e,arguments)}}function w(t,e){if(typeof t==a){return t.apply(e?e[0]||r:r,e)}return t}function T(t,e){return t===r?e:t}function x(t,e,i){d(S(e),(function(e){t.addEventListener(e,i,false)}))}function E(t,e,i){d(S(e),(function(e){t.removeEventListener(e,i,false)}))}function k(t,e){while(t){if(t==e){return true}t=t.parentNode}return false}function A(t,e){return t.indexOf(e)>-1}function S(t){return t.trim().split(/\s+/g)}function R(t,e,i){if(t.indexOf&&!i){return t.indexOf(e)}else{var n=0;while(n<t.length){if(i&&t[n][i]==e||!i&&t[n]===e){return n}n++}return-1}}function _(t){return Array.prototype.slice.call(t,0)}function I(t,e,i){var n=[];var r=[];var s=0;while(s<t.length){var o=t[s][e];if(R(r,o)<0){n.push(t[s])}r[s]=o;s++}{{n=n.sort((function t(i,n){return i[e]>n[e]}))}}return n}function D(t,e){var i,n;var o=e[0].toUpperCase()+e.slice(1);var a=0;while(a<s.length){i=s[a];n=i?i+o:e;if(n in t){return n}a++}return r}var M=1;function z(){return M++}function O(t){var i=t.ownerDocument||t;return i.defaultView||i.parentWindow||e}var P=/mobile|tablet|ip(ad|hone|od)|android/i;var C="ontouchstart"in e;var L=D(e,"PointerEvent")!==r;var N=C&&P.test(navigator.userAgent);var F="touch";var j="pen";var U="mouse";var B="kinect";var H=25;var W=1;var X=2;var Y=4;var q=8;var $=1;var G=2;var V=4;var Z=8;var J=16;var K=G|V;var Q=Z|J;var tt=K|Q;var et=["x","y"];var it=["clientX","clientY"];function nt(t,e){var i=this;this.manager=t;this.callback=e;this.element=t.element;this.target=t.options.inputTarget;this.domHandler=function(e){if(w(t.options.enable,[t])){i.handler(e)}};this.init()}nt.prototype={handler:function(){},init:function(){this.evEl&&x(this.element,this.evEl,this.domHandler);this.evTarget&&x(this.target,this.evTarget,this.domHandler);this.evWin&&x(O(this.element),this.evWin,this.domHandler)},destroy:function(){this.evEl&&E(this.element,this.evEl,this.domHandler);this.evTarget&&E(this.target,this.evTarget,this.domHandler);this.evWin&&E(O(this.element),this.evWin,this.domHandler)}};function rt(t){var e;var i=t.options.inputClass;if(i){e=i}else if(L){e=At}else if(N){e=Ot}else if(!C){e=wt}else{e=Nt}return new e(t,st)}function st(t,e,i){var n=i.pointers.length;var r=i.changedPointers.length;var s=e&W&&n-r===0;var o=e&(Y|q)&&n-r===0;i.isFirst=!!s;i.isFinal=!!o;if(s){t.session={}}i.eventType=e;ot(t,i);t.emit("hammer.input",i);t.recognize(i);t.session.prevInput=i}function ot(t,e){var i=t.session;var n=e.pointers;var r=n.length;if(!i.firstInput){i.firstInput=ct(e)}if(r>1&&!i.firstMultiple){i.firstMultiple=ct(e)}else if(r===1){i.firstMultiple=false}var s=i.firstInput;var o=i.firstMultiple;var a=o?o.center:s.center;var l=e.center=ft(n);e.timeStamp=f();e.deltaTime=e.timeStamp-s.timeStamp;e.angle=pt(a,l);e.distance=dt(a,l);at(i,e);e.offsetDirection=ht(e.deltaX,e.deltaY);var u=ut(e.deltaTime,e.deltaX,e.deltaY);e.overallVelocityX=u.x;e.overallVelocityY=u.y;e.overallVelocity=c(u.x)>c(u.y)?u.x:u.y;e.scale=o?vt(o.pointers,n):1;e.rotation=o?mt(o.pointers,n):0;e.maxPointers=!i.prevInput?e.pointers.length:e.pointers.length>i.prevInput.maxPointers?e.pointers.length:i.prevInput.maxPointers;lt(i,e);var h=t.element;if(k(e.srcEvent.target,h)){h=e.srcEvent.target}e.target=h}function at(t,e){var i=e.center;var n=t.offsetDelta||{};var r=t.prevDelta||{};var s=t.prevInput||{};if(e.eventType===W||s.eventType===Y){r=t.prevDelta={x:s.deltaX||0,y:s.deltaY||0};n=t.offsetDelta={x:i.x,y:i.y}}e.deltaX=r.x+(i.x-n.x);e.deltaY=r.y+(i.y-n.y)}function lt(t,e){var i=t.lastInterval||e,n=e.timeStamp-i.timeStamp,s,o,a,l;if(e.eventType!=q&&(n>H||i.velocity===r)){var f=e.deltaX-i.deltaX;var u=e.deltaY-i.deltaY;var h=ut(n,f,u);o=h.x;a=h.y;s=c(h.x)>c(h.y)?h.x:h.y;l=ht(f,u);t.lastInterval=e}else{s=i.velocity;o=i.velocityX;a=i.velocityY;l=i.direction}e.velocity=s;e.velocityX=o;e.velocityY=a;e.direction=l}function ct(t){var e=[];var i=0;while(i<t.pointers.length){e[i]={clientX:l(t.pointers[i].clientX),clientY:l(t.pointers[i].clientY)};i++}return{timeStamp:f(),pointers:e,center:ft(e),deltaX:t.deltaX,deltaY:t.deltaY}}function ft(t){var e=t.length;if(e===1){return{x:l(t[0].clientX),y:l(t[0].clientY)}}var i=0,n=0,r=0;while(r<e){i+=t[r].clientX;n+=t[r].clientY;r++}return{x:l(i/e),y:l(n/e)}}function ut(t,e,i){return{x:e/t||0,y:i/t||0}}function ht(t,e){if(t===e){return $}if(c(t)>=c(e)){return t<0?G:V}return e<0?Z:J}function dt(t,e,i){if(!i){i=et}var n=e[i[0]]-t[i[0]],r=e[i[1]]-t[i[1]];return Math.sqrt(n*n+r*r)}function pt(t,e,i){if(!i){i=et}var n=e[i[0]]-t[i[0]],r=e[i[1]]-t[i[1]];return Math.atan2(r,n)*180/Math.PI}function mt(t,e){return pt(e[1],e[0],it)+pt(t[1],t[0],it)}function vt(t,e){return dt(e[0],e[1],it)/dt(t[0],t[1],it)}var gt={mousedown:W,mousemove:X,mouseup:Y};var bt="mousedown";var yt="mousemove mouseup";function wt(){this.evEl=bt;this.evWin=yt;this.pressed=false;nt.apply(this,arguments)}b(wt,nt,{handler:function t(e){var i=gt[e.type];if(i&W&&e.button===0){this.pressed=true}if(i&X&&e.which!==1){i=Y}if(!this.pressed){return}if(i&Y){this.pressed=false}this.callback(this.manager,i,{pointers:[e],changedPointers:[e],pointerType:U,srcEvent:e})}});var Tt={pointerdown:W,pointermove:X,pointerup:Y,pointercancel:q,pointerout:q};var xt={2:F,3:j,4:U,5:B};var Et="pointerdown";var kt="pointermove pointerup pointercancel";if(e.MSPointerEvent&&!e.PointerEvent){Et="MSPointerDown";kt="MSPointerMove MSPointerUp MSPointerCancel"}function At(){this.evEl=Et;this.evWin=kt;nt.apply(this,arguments);this.store=this.manager.session.pointerEvents=[]}b(At,nt,{handler:function t(e){var i=this.store;var n=false;var r=e.type.toLowerCase().replace("ms","");var s=Tt[r];var o=xt[e.pointerType]||e.pointerType;var a=o==F;var l=R(i,e.pointerId,"pointerId");if(s&W&&(e.button===0||a)){if(l<0){i.push(e);l=i.length-1}}else if(s&(Y|q)){n=true}if(l<0){return}i[l]=e;this.callback(this.manager,s,{pointers:i,changedPointers:[e],pointerType:o,srcEvent:e});if(n){i.splice(l,1)}}});var St={touchstart:W,touchmove:X,touchend:Y,touchcancel:q};var Rt="touchstart";var _t="touchstart touchmove touchend touchcancel";function It(){this.evTarget=Rt;this.evWin=_t;this.started=false;nt.apply(this,arguments)}b(It,nt,{handler:function t(e){var i=St[e.type];if(i===W){this.started=true}if(!this.started){return}var n=Dt.call(this,e,i);if(i&(Y|q)&&n[0].length-n[1].length===0){this.started=false}this.callback(this.manager,i,{pointers:n[0],changedPointers:n[1],pointerType:F,srcEvent:e})}});function Dt(t,e){var i=_(t.touches);var n=_(t.changedTouches);if(e&(Y|q)){i=I(i.concat(n),"identifier")}return[i,n]}var Mt={touchstart:W,touchmove:X,touchend:Y,touchcancel:q};var zt="touchstart touchmove touchend touchcancel";function Ot(){this.evTarget=zt;this.targetIds={};nt.apply(this,arguments)}b(Ot,nt,{handler:function t(e){var i=Mt[e.type];var n=Pt.call(this,e,i);if(!n){return}this.callback(this.manager,i,{pointers:n[0],changedPointers:n[1],pointerType:F,srcEvent:e})}});function Pt(t,e){var i=_(t.touches);var n=this.targetIds;if(e&(W|X)&&i.length===1){n[i[0].identifier]=true;return[i,i]}var r,s,o=_(t.changedTouches),a=[],l=this.target;s=i.filter((function(t){return k(t.target,l)}));if(e===W){r=0;while(r<s.length){n[s[r].identifier]=true;r++}}r=0;while(r<o.length){if(n[o[r].identifier]){a.push(o[r])}if(e&(Y|q)){delete n[o[r].identifier]}r++}if(!a.length){return}return[I(s.concat(a),"identifier"),a]}var Ct=2500;var Lt=25;function Nt(){nt.apply(this,arguments);var t=y(this.handler,this);this.touch=new Ot(this.manager,t);this.mouse=new wt(this.manager,t);this.primaryTouch=null;this.lastTouches=[]}b(Nt,nt,{handler:function t(e,i,n){var r=n.pointerType==F,s=n.pointerType==U;if(s&&n.sourceCapabilities&&n.sourceCapabilities.firesTouchEvents){return}if(r){Ft.call(this,i,n)}else if(s&&Ut.call(this,n)){return}this.callback(e,i,n)},destroy:function t(){this.touch.destroy();this.mouse.destroy()}});function Ft(t,e){if(t&W){this.primaryTouch=e.changedPointers[0].identifier;jt.call(this,e)}else if(t&(Y|q)){jt.call(this,e)}}function jt(t){var e=t.changedPointers[0];if(e.identifier===this.primaryTouch){var i={x:e.clientX,y:e.clientY};this.lastTouches.push(i);var n=this.lastTouches;var r=function(){var t=n.indexOf(i);if(t>-1){n.splice(t,1)}};setTimeout(r,Ct)}}function Ut(t){var e=t.srcEvent.clientX,i=t.srcEvent.clientY;for(var n=0;n<this.lastTouches.length;n++){var r=this.lastTouches[n];var s=Math.abs(e-r.x),o=Math.abs(i-r.y);if(s<=Lt&&o<=Lt){return true}}return false}var Bt=D(o.style,"touchAction");var Ht=Bt!==r;var Wt="compute";var Xt="auto";var Yt="manipulation";var qt="none";var $t="pan-x";var Gt="pan-y";var Vt=Kt();function Zt(t,e){this.manager=t;this.set(e)}Zt.prototype={set:function(t){if(t==Wt){t=this.compute()}if(Ht&&this.manager.element.style&&Vt[t]){this.manager.element.style[Bt]=t}this.actions=t.toLowerCase().trim()},update:function(){this.set(this.manager.options.touchAction)},compute:function(){var t=[];d(this.manager.recognizers,(function(e){if(w(e.options.enable,[e])){t=t.concat(e.getTouchAction())}}));return Jt(t.join(" "))},preventDefaults:function(t){var e=t.srcEvent;var i=t.offsetDirection;if(this.manager.session.prevented){e.preventDefault();return}var n=this.actions;var r=A(n,qt)&&!Vt[qt];var s=A(n,Gt)&&!Vt[Gt];var o=A(n,$t)&&!Vt[$t];if(r){var a=t.pointers.length===1;var l=t.distance<2;var c=t.deltaTime<250;if(a&&l&&c){return}}if(o&&s){return}if(r||s&&i&K||o&&i&Q){return this.preventSrc(e)}},preventSrc:function(t){this.manager.session.prevented=true;t.preventDefault()}};function Jt(t){if(A(t,qt)){return qt}var e=A(t,$t);var i=A(t,Gt);if(e&&i){return qt}if(e||i){return e?$t:Gt}if(A(t,Yt)){return Yt}return Xt}function Kt(){if(!Ht){return false}var t={};var i=e.CSS&&e.CSS.supports;["auto","manipulation","pan-y","pan-x","pan-x pan-y","none"].forEach((function(n){t[n]=i?e.CSS.supports("touch-action",n):true}));return t}var Qt=1;var te=2;var ee=4;var ie=8;var ne=ie;var re=16;var se=32;function oe(t){this.options=m({},this.defaults,t||{});this.id=z();this.manager=null;this.options.enable=T(this.options.enable,true);this.state=Qt;this.simultaneous={};this.requireFail=[]}oe.prototype={defaults:{},set:function(t){m(this.options,t);this.manager&&this.manager.touchAction.update();return this},recognizeWith:function(t){if(h(t,"recognizeWith",this)){return this}var e=this.simultaneous;t=ce(t,this);if(!e[t.id]){e[t.id]=t;t.recognizeWith(this)}return this},dropRecognizeWith:function(t){if(h(t,"dropRecognizeWith",this)){return this}t=ce(t,this);delete this.simultaneous[t.id];return this},requireFailure:function(t){if(h(t,"requireFailure",this)){return this}var e=this.requireFail;t=ce(t,this);if(R(e,t)===-1){e.push(t);t.requireFailure(this)}return this},dropRequireFailure:function(t){if(h(t,"dropRequireFailure",this)){return this}t=ce(t,this);var e=R(this.requireFail,t);if(e>-1){this.requireFail.splice(e,1)}return this},hasRequireFailures:function(){return this.requireFail.length>0},canRecognizeWith:function(t){return!!this.simultaneous[t.id]},emit:function(t){var e=this;var i=this.state;function n(i){e.manager.emit(i,t)}if(i<ie){n(e.options.event+ae(i))}n(e.options.event);if(t.additionalEvent){n(t.additionalEvent)}if(i>=ie){n(e.options.event+ae(i))}},tryEmit:function(t){if(this.canEmit()){return this.emit(t)}this.state=se},canEmit:function(){var t=0;while(t<this.requireFail.length){if(!(this.requireFail[t].state&(se|Qt))){return false}t++}return true},recognize:function(t){var e=m({},t);if(!w(this.options.enable,[this,e])){this.reset();this.state=se;return}if(this.state&(ne|re|se)){this.state=Qt}this.state=this.process(e);if(this.state&(te|ee|ie|re)){this.tryEmit(e)}},process:function(t){},getTouchAction:function(){},reset:function(){}};function ae(t){if(t&re){return"cancel"}else if(t&ie){return"end"}else if(t&ee){return"move"}else if(t&te){return"start"}return""}function le(t){if(t==J){return"down"}else if(t==Z){return"up"}else if(t==G){return"left"}else if(t==V){return"right"}return""}function ce(t,e){var i=e.manager;if(i){return i.get(t)}return t}function fe(){oe.apply(this,arguments)}b(fe,oe,{defaults:{pointers:1},attrTest:function(t){var e=this.options.pointers;return e===0||t.pointers.length===e},process:function(t){var e=this.state;var i=t.eventType;var n=e&(te|ee);var r=this.attrTest(t);if(n&&(i&q||!r)){return e|re}else if(n||r){if(i&Y){return e|ie}else if(!(e&te)){return te}return e|ee}return se}});function ue(){fe.apply(this,arguments);this.pX=null;this.pY=null}b(ue,fe,{defaults:{event:"pan",threshold:10,pointers:1,direction:tt},getTouchAction:function(){var t=this.options.direction;var e=[];if(t&K){e.push(Gt)}if(t&Q){e.push($t)}return e},directionTest:function(t){var e=this.options;var i=true;var n=t.distance;var r=t.direction;var s=t.deltaX;var o=t.deltaY;if(!(r&e.direction)){if(e.direction&K){r=s===0?$:s<0?G:V;i=s!=this.pX;n=Math.abs(t.deltaX)}else{r=o===0?$:o<0?Z:J;i=o!=this.pY;n=Math.abs(t.deltaY)}}t.direction=r;return i&&n>e.threshold&&r&e.direction},attrTest:function(t){return fe.prototype.attrTest.call(this,t)&&(this.state&te||!(this.state&te)&&this.directionTest(t))},emit:function(t){this.pX=t.deltaX;this.pY=t.deltaY;var e=le(t.direction);if(e){t.additionalEvent=this.options.event+e}this._super.emit.call(this,t)}});function he(){fe.apply(this,arguments)}b(he,fe,{defaults:{event:"pinch",threshold:0,pointers:2},getTouchAction:function(){return[qt]},attrTest:function(t){return this._super.attrTest.call(this,t)&&(Math.abs(t.scale-1)>this.options.threshold||this.state&te)},emit:function(t){if(t.scale!==1){var e=t.scale<1?"in":"out";t.additionalEvent=this.options.event+e}this._super.emit.call(this,t)}});function de(){oe.apply(this,arguments);this._timer=null;this._input=null}b(de,oe,{defaults:{event:"press",pointers:1,time:251,threshold:9},getTouchAction:function(){return[Xt]},process:function(t){var e=this.options;var i=t.pointers.length===e.pointers;var n=t.distance<e.threshold;var r=t.deltaTime>e.time;this._input=t;if(!n||!i||t.eventType&(Y|q)&&!r){this.reset()}else if(t.eventType&W){this.reset();this._timer=u((function(){this.state=ne;this.tryEmit()}),e.time,this)}else if(t.eventType&Y){return ne}return se},reset:function(){clearTimeout(this._timer)},emit:function(t){if(this.state!==ne){return}if(t&&t.eventType&Y){this.manager.emit(this.options.event+"up",t)}else{this._input.timeStamp=f();this.manager.emit(this.options.event,this._input)}}});function pe(){fe.apply(this,arguments)}b(pe,fe,{defaults:{event:"rotate",threshold:0,pointers:2},getTouchAction:function(){return[qt]},attrTest:function(t){return this._super.attrTest.call(this,t)&&(Math.abs(t.rotation)>this.options.threshold||this.state&te)}});function me(){fe.apply(this,arguments)}b(me,fe,{defaults:{event:"swipe",threshold:10,velocity:.3,direction:K|Q,pointers:1},getTouchAction:function(){return ue.prototype.getTouchAction.call(this)},attrTest:function(t){var e=this.options.direction;var i;if(e&(K|Q)){i=t.overallVelocity}else if(e&K){i=t.overallVelocityX}else if(e&Q){i=t.overallVelocityY}return this._super.attrTest.call(this,t)&&e&t.offsetDirection&&t.distance>this.options.threshold&&t.maxPointers==this.options.pointers&&c(i)>this.options.velocity&&t.eventType&Y},emit:function(t){var e=le(t.offsetDirection);if(e){this.manager.emit(this.options.event+e,t)}this.manager.emit(this.options.event,t)}});function ve(){oe.apply(this,arguments);this.pTime=false;this.pCenter=false;this._timer=null;this._input=null;this.count=0}b(ve,oe,{defaults:{event:"tap",pointers:1,taps:1,interval:300,time:250,threshold:9,posThreshold:10},getTouchAction:function(){return[Yt]},process:function(t){var e=this.options;var i=t.pointers.length===e.pointers;var n=t.distance<e.threshold;var r=t.deltaTime<e.time;this.reset();if(t.eventType&W&&this.count===0){return this.failTimeout()}if(n&&r&&i){if(t.eventType!=Y){return this.failTimeout()}var s=this.pTime?t.timeStamp-this.pTime<e.interval:true;var o=!this.pCenter||dt(this.pCenter,t.center)<e.posThreshold;this.pTime=t.timeStamp;this.pCenter=t.center;if(!o||!s){this.count=1}else{this.count+=1}this._input=t;var a=this.count%e.taps;if(a===0){if(!this.hasRequireFailures()){return ne}else{this._timer=u((function(){this.state=ne;this.tryEmit()}),e.interval,this);return te}}}return se},failTimeout:function(){this._timer=u((function(){this.state=se}),this.options.interval,this);return se},reset:function(){clearTimeout(this._timer)},emit:function(){if(this.state==ne){this._input.tapCount=this.count;this.manager.emit(this.options.event,this._input)}}});function ge(t,e){e=e||{};e.recognizers=T(e.recognizers,ge.defaults.preset);return new we(t,e)}ge.VERSION="2.0.7";ge.defaults={domEvents:false,touchAction:Wt,enable:true,inputTarget:null,inputClass:null,preset:[[pe,{enable:false}],[he,{enable:false},["rotate"]],[me,{direction:K}],[ue,{direction:K},["swipe"]],[ve],[ve,{event:"doubletap",taps:2},["tap"]],[de]],cssProps:{userSelect:"none",touchSelect:"none",touchCallout:"none",contentZooming:"none",userDrag:"none",tapHighlightColor:"rgba(0,0,0,0)"}};var be=1;var ye=2;function we(t,e){this.options=m({},ge.defaults,e||{});this.options.inputTarget=this.options.inputTarget||t;this.handlers={};this.session={};this.recognizers=[];this.oldCssProps={};this.element=t;this.input=rt(this);this.touchAction=new Zt(this,this.options.touchAction);Te(this,true);d(this.options.recognizers,(function(t){var e=this.add(new t[0](t[1]));t[2]&&e.recognizeWith(t[2]);t[3]&&e.requireFailure(t[3])}),this)}we.prototype={set:function(t){m(this.options,t);if(t.touchAction){this.touchAction.update()}if(t.inputTarget){this.input.destroy();this.input.target=t.inputTarget;this.input.init()}return this},stop:function(t){this.session.stopped=t?ye:be},recognize:function(t){var e=this.session;if(e.stopped){return}this.touchAction.preventDefaults(t);var i;var n=this.recognizers;var r=e.curRecognizer;if(!r||r&&r.state&ne){r=e.curRecognizer=null}var s=0;while(s<n.length){i=n[s];if(e.stopped!==ye&&(!r||i==r||i.canRecognizeWith(r))){i.recognize(t)}else{i.reset()}if(!r&&i.state&(te|ee|ie)){r=e.curRecognizer=i}s++}},get:function(t){if(t instanceof oe){return t}var e=this.recognizers;for(var i=0;i<e.length;i++){if(e[i].options.event==t){return e[i]}}return null},add:function(t){if(h(t,"add",this)){return this}var e=this.get(t.options.event);if(e){this.remove(e)}this.recognizers.push(t);t.manager=this;this.touchAction.update();return t},remove:function(t){if(h(t,"remove",this)){return this}t=this.get(t);if(t){var e=this.recognizers;var i=R(e,t);if(i!==-1){e.splice(i,1);this.touchAction.update()}}return this},on:function(t,e){if(t===r){return}if(e===r){return}var i=this.handlers;d(S(t),(function(t){i[t]=i[t]||[];i[t].push(e)}));return this},off:function(t,e){if(t===r){return}var i=this.handlers;d(S(t),(function(t){if(!e){delete i[t]}else{i[t]&&i[t].splice(R(i[t],e),1)}}));return this},emit:function(t,e){if(this.options.domEvents){xe(t,e)}var i=this.handlers[t]&&this.handlers[t].slice();if(!i||!i.length){return}e.type=t;e.preventDefault=function(){e.srcEvent.preventDefault()};var n=0;while(n<i.length){i[n](e);n++}},destroy:function(){this.element&&Te(this,false);this.handlers={};this.session={};this.input.destroy();this.element=null}};function Te(t,e){var i=t.element;if(!i.style){return}var n;d(t.options.cssProps,(function(r,s){n=D(i.style,s);if(e){t.oldCssProps[n]=i.style[n];i.style[n]=r}else{i.style[n]=t.oldCssProps[n]||""}}));if(!e){t.oldCssProps={}}}function xe(t,e){var n=i.createEvent("Event");n.initEvent(t,true,true);n.gesture=e;e.target.dispatchEvent(n)}m(ge,{INPUT_START:W,INPUT_MOVE:X,INPUT_END:Y,INPUT_CANCEL:q,STATE_POSSIBLE:Qt,STATE_BEGAN:te,STATE_CHANGED:ee,STATE_ENDED:ie,STATE_RECOGNIZED:ne,STATE_CANCELLED:re,STATE_FAILED:se,DIRECTION_NONE:$,DIRECTION_LEFT:G,DIRECTION_RIGHT:V,DIRECTION_UP:Z,DIRECTION_DOWN:J,DIRECTION_HORIZONTAL:K,DIRECTION_VERTICAL:Q,DIRECTION_ALL:tt,Manager:we,Input:nt,TouchAction:Zt,TouchInput:Ot,MouseInput:wt,PointerEventInput:At,TouchMouseInput:Nt,SingleTouchInput:It,Recognizer:oe,AttrRecognizer:fe,Tap:ve,Pan:ue,Swipe:me,Pinch:he,Rotate:pe,Press:de,on:x,off:E,each:d,merge:g,extend:v,assign:m,inherit:b,bindFn:y,prefixed:D});var Ee=typeof e!=="undefined"?e:typeof self!=="undefined"?self:{};Ee.Hammer=ge;if(t.exports){t.exports=ge}else{e[n]=ge}})(window,document,"Hammer")})(ht);return ht.exports}var mt=pt();var vt=a(mt);const gt=()=>`:host{--percentuale:0;display:flex;width:100%;min-width:200px;max-width:100dvw;box-sizing:border-box;background:var(--color-surface01);border-radius:var(--border-size-large);box-shadow:var(--shadow-3);color:var(--color-default-text);fill:var(--color-primary01-icon);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-weight:var(--font-rg)}:host(.slide-in-left){animation:slideinleft 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-right){animation:slideinright 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-down){animation:slideindown 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-up){animation:slideinup 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-left){animation:slideoutleft 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-right){animation:slideoutright 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-down){animation:slideoutdown 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-up){animation:slideoutup 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}.toast-notification-container{display:flex;width:100%;align-items:baseline;justify-content:space-between;padding:calc(var(--space-unit) * 2);border-radius:var(--border-radius);gap:calc(var(--space-unit) * 2)}.toast-notification-content{display:flex;width:100%;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:calc(var(--space-unit) * 2)}.toast-notification-content .toast-notification-text{color:inherit;letter-spacing:0.16px;line-height:1.25rem}.toast-notification-content .toast-notification-text .title{margin-right:calc(var(--space-unit) / 2);font-weight:var(--font-sb)}.close-button{height:1.125rem;padding:0;border:none;background-color:transparent;cursor:pointer}.close-button z-icon{--z-icon-width:1.125rem;--z-icon-height:1.125rem;display:inline-block;height:1.25rem}.close-button:focus:focus-visible{border-radius:50%;box-shadow:var(--shadow-focus-primary);outline:none}:host(.dark){background:var(--color-surface05);color:var(--color-text-inverse);fill:var(--color-inverse-icon)}:host(.dark) .close-button:focus:focus-visible{box-shadow:0 0 0 2px var(--gray900),     0 0 2px 5px var(--blue25)}:host(.accent){background:var(--color-primary01)}:host(.error){background:var(--color-default-error)}:host(.success){background:var(--color-default-success)}:host(.warning){background:var(--color-default-warning)}:host(.accent),:host(.error),:host(.success){color:var(--color-text-inverse);fill:var(--color-inverse-icon)}:host(.warning) .close-button{fill:var(--color-default-icon)}@media (min-width: 768px){:host{width:fit-content;max-width:50vw}.toast-notification-content{flex-wrap:nowrap}}@media (min-width: 1366px){:host{max-width:33vw}}@keyframes slideinleft{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes slideinright{0%{transform:translateX(-100%)}100%{transform:translateX(0)}}@keyframes slideinup{0%{opacity:0;transform:translateY(100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideindown{0%{opacity:0;transform:translateY(-100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideoutleft{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(-100%)}}@keyframes slideoutright{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(100%)}}@keyframes slideoutup{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(-100%)}}@keyframes slideoutdown{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(100%)}}`;const bt={[s.SLIDE_IN_DOWN]:s.SLIDE_OUT_UP,[s.SLIDE_IN_UP]:s.SLIDE_OUT_DOWN,[s.SLIDE_IN_LEFT]:s.SLIDE_OUT_RIGHT,[s.SLIDE_IN_RIGHT]:s.SLIDE_OUT_LEFT};const yt=class{constructor(i){t(this,i);this.toastClose=e(this,"toastClose",7);this.pauseonfocusloss=true;this.isdraggable=true;this.draggablepercentage=80;this.isCloseEventCalled=false}watchPropIsdraggable(t){if(t){this.sliderManager.get("pan").set({enable:true})}else{this.sliderManager.get("pan").set({enable:false})}}watchPropAutoclose(t){clearTimeout(this.timeoutHandle);this.startClosingTimeout(t)}watchPropPauseonfocusloss(t){if(this.autoclose){if(t){document.addEventListener("visibilitychange",this.visibilityChangeEventHandler)}else{document.removeEventListener("visibilitychange",this.visibilityChangeEventHandler)}}}close(t,e){if(e&&this.timeoutHandle){clearTimeout(this.timeoutHandle)}this.timeoutHandle=null;this.elapsedTime=null;this.toastClose.emit();if(t){this.hostElement.classList.add(t)}else{this.hostElement.parentNode.removeChild(this.hostElement)}}visibilityChangeEventHandler(){if(document.visibilityState==="hidden"){if(this.timeoutHandle){this.onBlur()}}else if(this.elapsedTime){this.onFocus()}}validateAutoclose(){if(!this.autoclose&&!this.closebutton){console.error("At least one between autoclose and closebutton must be present")}}calculateDraggedPercentage(t){const e=this.hostElement.getBoundingClientRect();return Math.round(100*t.deltaX/e.width)}handleSlideOutDragAnimation(){this.sliderManager=new vt(this.hostElement);this.sliderManager.get("pan").set({direction:vt.DIRECTION_HORIZONTAL});this.sliderManager.on("pan",(t=>{this.percentage=this.calculateDraggedPercentage(t);this.hostElement.style.transition="none";if(this.transition){this.hostElement.classList.remove(this.transition)}const e={translate:`translateX(${this.percentage}%)`,translateBack:"translateX(0)"};this.hostElement.style.opacity=`${100-Math.abs(this.percentage)}%`;if(t.eventType===vt.DIRECTION_LEFT||t.eventType===vt.DIRECTION_RIGHT){this.hostElement.style.transform=e.translate;if(Math.abs(this.percentage)>this.draggablepercentage&&!this.isCloseEventCalled){this.isCloseEventCalled=true;this.close(t.direction===vt.DIRECTION_LEFT?s.SLIDE_OUT_LEFT:s.SLIDE_OUT_RIGHT,true)}}if(t.isFinal&&Math.abs(this.percentage)<this.draggablepercentage){this.hostElement.style.transform=e.translateBack;this.hostElement.style.transition="all 1s";this.hostElement.style.opacity="100%";this.percentage=0}}))}onFocus(){let t=this.autoclose;if(this.elapsedTime){t=this.autoclose-this.elapsedTime}if(t>0){this.startClosingTimeout(t)}}onBlur(){this.elapsedTime=Date.now()-this.startTime;clearTimeout(this.timeoutHandle)}startClosingTimeout(t){this.timeoutHandle=window.setTimeout((()=>this.close(bt[this.transition],false)),t)}checkSlottedButton(){this.hasSlottedButton=!!this.hostElement.querySelector("[slot='button']")}componentWillLoad(){this.validateAutoclose();this.checkSlottedButton();this.percentage=0}componentDidLoad(){this.startTime=Date.now();if(this.autoclose){if(this.pauseonfocusloss){document.addEventListener("visibilitychange",this.visibilityChangeEventHandler)}if(!this.transition){this.startClosingTimeout(this.autoclose)}}if(this.isdraggable){this.handleSlideOutDragAnimation()}}render(){return i(n,{key:"1fc53b2a046a69423b79dc155a8047927f820f99",style:{"--percentuale":`${this.percentage}%`},class:{[this.transition]:!!this.transition,[this.type]:!!this.type},onAnimationEnd:t=>{if(this.autoclose&&t.animationName.includes("slidein")){this.startClosingTimeout(this.autoclose)}if(t.animationName.includes("slideout")){this.hostElement.parentNode.removeChild(this.hostElement)}}},i("div",{key:"3ce177f39a21c8431368287ea771e3b9035494a5",class:"toast-notification-container"},i("div",{key:"e516a7f69f5ce2bf2d99d898dc187ed56825cc3a",class:"toast-notification-content"},i("div",{key:"38550c2a0000cfd468a3e98dbaefbd55f063f5ff",class:"toast-notification-text"},this.heading&&i("span",{key:"242f9da4bb8e8e12a33750077ae2c0f471d3af76",class:"title"},this.heading),i("span",{key:"ee4765e96507f08a627d38b2b5462cfceabe378e",class:"message"},i("slot",{key:"fb04698db1b74fff5a226d2f37633b7a827575c4",name:"message"},this.message&&i("span",{key:"cb68e395d3e5986428b3f1bd2d672beb86a53cbc",innerHTML:ut.sanitize(this.message)})))),i("div",{key:"b637f3d6fda242d84208b4334f5979af6d81dc15",class:"button-container",hidden:!this.hasSlottedButton},i("slot",{key:"587c1bb667c497b1dc026a7fd51acf1a12692952",name:"button",onSlotchange:()=>this.checkSlottedButton()}))),this.closebutton&&i("button",{key:"db8aa264cd8c2f04db4d3271c61106930a9d557b",class:"close-button","aria-label":"Chiudi notifica",onClick:()=>this.close(bt[this.transition],true),onKeyDown:t=>{if(t.code==o.SPACE||t.code==o.ENTER){t.preventDefault();this.close(bt[this.transition],true)}}},i("z-icon",{key:"c80895cdd37e91aaad1314d602cb57f5c7d5cbd9",name:"multiply-circled"}))))}get hostElement(){return r(this)}static get watchers(){return{isdraggable:[{watchPropIsdraggable:0}],autoclose:[{watchPropAutoclose:0}],pauseonfocusloss:[{watchPropPauseonfocusloss:0}]}}};yt.style=gt();export{yt as z_toast_notification};
+//# sourceMappingURL=p-e9722221.entry.js.map