@nanoporetech-digital/components 7.6.0 → 7.8.0

package/dist/cjs/nano-sortable.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nano-sortable.entry.cjs.js","mappings":"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","names":["writeTask","addListeners","drag","readTask","nanoDebounce","h","Host"],"sources":["src/components/sortable/sortable.scss?tag=nano-sortable&encapsulation=shadow","src/components/sortable/sortable.tsx"],"sourcesContent":["@use '../../global/style/utilities/mixins' as mx;\n\n:host {\n  position: relative;\n  display: block;\n}\n\n.sortable__live-region {\n  @include mx.visually-hide();\n}\n","import {\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Component,\n  ComponentInterface,\n  Watch,\n  Method,\n  State,\n  Host,\n  readTask,\n  writeTask,\n  Build,\n} from '@stencil/core';\nimport { drag } from '../../utils/drag';\nimport { nanoDebounce } from '../..';\nimport { addListeners } from '../../utils/events';\n\n// Orientation map to limit dragging to horizontal or vertical.\nconst orientationMap = {\n  horizontal: { x: 1, y: 0 },\n  vertical: { x: 0, y: 1 },\n};\n\nlet sortableIds = 0;\n\n/**\n * An accessible and flexible re-order / sort utility component.\n *\n *- Drag and drop via mouse, touch or keyboard\n *- Live announcements for screen readers\n *- Works with or without an explicit handle (although with is preferable)\n\n * @part announcements - the a11y, live region. Visually hidden by default\n *\n * @slot - The default slot containing any items you might want to sort\n */\n@Component({\n  tag: 'nano-sortable',\n  shadow: true,\n  styleUrl: 'sortable.scss',\n})\nexport class Sortable implements ComponentInterface {\n  /// Public API & surface ///\n\n  /** A css query selector which matches a set of elements that should be sortable. e.g. `<li>` or `<tr>` */\n  @Prop() itemSelector = 'li';\n  @Watch('itemSelector')\n  handleItemSelectorChange() {\n    this.refreshKeyboardHandles();\n  }\n\n  /** A css query selector which matches an element *within* the `itemSelector` element\n   * which will act like a drag handle. **Note** For keyboard a11y it's recommended\n   * to use `handleSelector` when possible. Alternatively, the `createKeyboardHandle` prop will be used */\n  @Prop() handleSelector?: string;\n  @Watch('handleSelector')\n  handleHandleSelectorChange() {\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n  }\n\n  /** When dragging between grouped collections of items, it is possible to drag all sortable items from one group to another.\n   * At that point, you will not be able to drag items back to the original group.\n   * A `dropzoneSelector` allows you to define a placeholder area where items can always be dropped.\n   */\n  @Prop() dropzoneSelector?: string;\n\n  /** Accessibility helper text applied to handle controls */\n  @Prop() helperText =\n    'Press \"Space\" or \"Enter\" to enable element reordering and use the arrow keys to reorder items.' +\n    'Press \"Escape\" to cancel reordering. Alternatively, use your mouse to drag / reorder.';\n\n  /**\n   * As a sortable element is interacted with, announcements are made to screen readers\n   * - informing the user what is changing.\n   * By default, the text from the element is extracted to describe the interacted with element.\n   * Use this function to provide a more meaningful, concise item descriptor\n   * @param el the element being interacted with\n   * @returns a string, describing the element being interacted with\n   */\n  @Prop() itemDescriptor = (el: Element) => `\"${el?.textContent.trim()}\"`;\n\n  /**\n   * Used to generate a screen reader live update, informing the user of the current element being grabbed.\n   * @param el the element that has been grabbed by the user\n   * @returns a string, describing the element being grabbed\n   */\n  @Prop() grabbedHelperText = (el: Element) =>\n    `${this.itemDescriptor(el)} grabbed`;\n\n  /**\n   * Used to generate a screen reader live update, informing the user of the current element being dropped.\n   * @param el the element that has been dropped by the user\n   * @returns a string, describing the element that has been dropped\n   */\n  @Prop() droppedHelperText = (el: Element) =>\n    `${this.itemDescriptor(el)} dropped`;\n\n  /**\n   *  Used to generate a screen reader live update, informing the user when items have been reordered.\n   * @param el the element that has been reordered by the user\n   * @param elements the elements in the sortable list\n   * @param position the new position of the dropped element\n   * @returns a string, describing the element being dropped\n   */\n  @Prop() reorderHelperText = (\n    el: Element,\n    elements: Element[],\n    position: number\n  ) =>\n    `The list has been reordered, ${this.itemDescriptor(\n      el\n    )} is now item ${position} of ${elements.length}`;\n\n  /**\n   * A function that should attach a keyboard accessible control.\n   * When a `handleSelector` is not used - to allow keyboard accessibility -\n   * `createKeyboardHandle` should render a focusable element.\n   *\n   * If your sortable item is itself focusable,\n   * you must use this function to render a control *outside* of the focusable element.\n   * @param _number\n   * @param _element\n   * @returns a function that attaches a keyboard accessible handle control element.\n   * The function itself *must* return the handle element.\n   */\n  @Prop() createKeyboardHandle = (_number: number, _element: Element) => {\n    const handleTpl = /* html */ `\n      <nano-icon-button\n        slot=\"end\"\n        icon-name=\"light/arrows-up-down-left-right\"\n        class=\"nano-sortable__keyboard-handle visually-hidden\"\n        label=\"Re-order this item\"\n      ></nano-icon-button>`;\n    const div = document.createElement('div');\n    div.innerHTML = handleTpl;\n\n    const handle = div.children[0] as HTMLElement;\n    _element.append(handle);\n    return handle;\n  };\n  @Watch('createKeyboardHandle')\n  handleCreateKeyboardHandleChange() {\n    this.refreshKeyboardHandles();\n  }\n\n  /** use `sortableHostElement` to watch a sortable list without needing to wrap in `nano-sortable`.\n   * Note that the `sortableHostElement` element css `position` will be set to `relative` */\n  @Prop() sortableHostElement?: HTMLElement;\n  @Watch('sortableHostElement')\n  handleSortableHostElement(_newVal?, oldVal?: HTMLElement) {\n    if (oldVal) this.removeEventHandlers(oldVal);\n\n    this.addEventHandlers();\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n\n    if (this.sortableHostElement) {\n      // sortable host must have position relative\n      this.sortableHostElement.style.position = 'relative';\n    }\n  }\n\n  /** Items being sorted will animate into place */\n  @Prop() animationEnabled = true;\n\n  /** Use this class to change how the element looks whilst being sorted */\n  @Prop() draggedClass = 'nano-sortable__dragged';\n\n  /** Use this class to change how the handle looks whilst being sorted */\n  @Prop() handleDraggedClass = 'nano-sortable__handle-dragged';\n\n  /** Use this class to change how the element looks when acting as a placeholder */\n  @Prop() placeholderClass = 'nano-sortable__placeholder';\n\n  /** Used in-conjunction with `dropzoneSelector`, applied when a dropzone is dragged over */\n  @Prop() dropzoneActiveClass?: string = '';\n\n  /** The css animation timing applied when `animationEnabled` is `true` */\n  @Prop() animationTiming: any = { duration: 200, easing: 'ease-out' };\n\n  /** The axis to lock dragging elements to. `undefined` means any axis */\n  @Prop() orientation?: 'horizontal' | 'vertical';\n\n  /** Dragged items by default, will take whatever default css is applied in situ.\n   * When sortable items' dimensions are dynamic (i.e they can shrink / grow via the space allowed) dragging items can look 'wrong'.\n   * Apply `dragResize` to read & recreate the dragged items current dimensions when dragged.  */\n  @Prop() dragResize = false;\n\n  /** Fired when an the order changes. Use this to update any underlying data model.\n   * `event.preventDefault()` to prevent the element being moved; will revert to original position. */\n  @Event() nanoOrderChange: EventEmitter<{\n    element: HTMLElement;\n    originalIndex: number;\n    targetIndex: number;\n  }>;\n\n  /** Fired when a sortable element is picked-up; via keyboard, mouse or touch.\n   * `event.preventDefault()` to prevent the element being picked-up. */\n  @Event() nanoGrabbed: EventEmitter<{ element: HTMLElement; index: number }>;\n\n  /** Fired when a sortable element is dropped after having been picked up. */\n  @Event() nanoDropped: EventEmitter<{ element: HTMLElement }>;\n\n  /** If sortable elements change dynamically, use this method to add handle controls to new elements */\n  @Method()\n  async refreshKeyboardHandles() {\n    if (this.handleSelector) {\n      if (this.keyboardHandleMap?.size) {\n        this.keyboardHandleMap.clear();\n      }\n\n      this.sortableHost\n        .querySelectorAll<HTMLElement>(this.handleSelector)\n        .forEach((handle) => {\n          if (!handle.getAttribute('aria-describedby'))\n            handle.setAttribute('aria-describedby', this.sortableId);\n          const sortEle = handle.closest<HTMLElement>(this.itemSelector);\n          if (sortEle) this.keyboardHandleMap.set(handle, sortEle);\n        });\n      return;\n    }\n\n    if (this.keyboardHandleMap?.size) {\n      this.keyboardHandleMap?.forEach((_ele, handle) => handle.remove());\n      this.keyboardHandleMap.clear();\n    }\n    this.sortableHost\n      .querySelectorAll<HTMLElement>(this.itemSelector)\n      .forEach((ele, i) => {\n        const handle = this.createKeyboardHandle(i, ele);\n        if (!handle) {\n          console.error(\n            '`createKeyboardHandle` *must* return the handle element it creates'\n          );\n          return;\n        }\n        this.keyboardHandleMap.set(handle, ele);\n        handle.setAttribute('aria-describedby', this.sortableId);\n      });\n  }\n\n  /// Private state & logic ///\n\n  @Element() host: HTMLNanoSortableElement;\n  private dragRequestPending = false;\n  private draggedElement?: HTMLElement;\n  private draggedElementClone?: HTMLElement;\n  private draggedElementOrigin?: HTMLElement;\n  private sortableNodes: HTMLElement[] = [];\n  private dropzoneNodes: HTMLElement[] = [];\n  private animatedElements: HTMLElement[] = [];\n  private animationPromise?: Promise<void>;\n  private keyboardHandleMap: Map<HTMLElement, HTMLElement> = new Map();\n  private sortableId = `nano-sortable-${sortableIds++}`;\n  private mouseDownTimer: number;\n  private mutationObserver: MutationObserver;\n\n  @State() keyboardSortActive = false;\n  @State() ariaTextList: string[] = [];\n\n  /**\n   * Get instance of sortable host.\n   * By default it is `nano-sortable` which can be overridden by property `sortableHostElement`\n   */\n  get sortableHost() {\n    if (this.sortableHostElement) return this.sortableHostElement;\n    return this.host;\n  }\n\n  /**\n   * Queues aria messages which are then displayed in a 'live' region.\n   * Messages are cleared after 10s\n   * @param msg aria message to announce\n   */\n  private addAriaMsg(msg: string) {\n    this.ariaTextList = [...this.ariaTextList, msg];\n\n    setTimeout(() => {\n      const mIdx = this.ariaTextList.indexOf(msg);\n      this.ariaTextList.splice(mIdx, 1);\n      this.ariaTextList = [...this.ariaTextList];\n    }, 10000);\n  }\n\n  /**\n   * Try to stop text highlight whilst dragging\n   * @param userSelect\n   */\n  private updateUserSelectStyle(userSelect: '' | 'none') {\n    this.host.style.userSelect = userSelect;\n  }\n\n  /**\n   * Fast and simple hit test to check whether the center of a node intersects with the rectangle of any of the\n   * given targets. Returns an array of matches.\n   * @param node\n   * @param targets\n   * @returns all the items that currently intersect with the target node\n   */\n  private hitTest(node: HTMLElement, targets: HTMLElement[]): HTMLElement[] {\n    const {\n      left: l,\n      top: t,\n      width: w,\n      height: h,\n    } = node.getBoundingClientRect();\n    const x = l + w / 2;\n    const y = t + h / 2;\n\n    return targets.filter((item) => {\n      const { left, right, top, bottom } = item.getBoundingClientRect();\n      return !(x < left || x > right || y < top || y > bottom);\n    });\n  }\n\n  /**\n   * Returns a boolean indicating whether the node is currently in an animation.\n   * @param node\n   * @returns whether a node is currently animating or not\n   */\n  private isAnimating(node: HTMLElement) {\n    return this.animatedElements.indexOf(node) !== -1;\n  }\n\n  /**\n   * Triggers a CSS animation on a node with the given dx and dy. Used following dom updates to make it appear as\n   * if nodes animate from their old to their new position in the dom. */\n  private animateNode(node: HTMLElement, dx = 0, dy = 0) {\n    if (!node.animate) {\n      return;\n    }\n\n    // keep a stack of currently animating nodes to exclude as drag & drop targets.\n    this.animatedElements.push(node);\n\n    node.style.willChange = 'transform';\n\n    // animate from dx/dy (old node position) to none (new node position)\n    writeTask(() => {\n      this.animationPromise = new Promise((resolve) => {\n        node\n          .animate(\n            [\n              { transform: `translate3d(${dx}px, ${dy}px, 0)` },\n              { transform: 'none' },\n            ],\n            this.animationTiming\n          )\n          .addEventListener(\n            'finish',\n            () => {\n              const index = this.animatedElements.indexOf(node);\n              node.style.willChange = '';\n\n              if (index !== -1) {\n                // splice out when done to unlock as a valid target\n                this.animatedElements.splice(index, 1);\n              }\n\n              resolve();\n              delete this.animationPromise;\n            },\n            { once: true }\n          );\n      });\n    });\n  }\n\n  /**\n   * Inserts node at target to update sibling sorting. If the node precedes the target, it is inserted after it;\n   * If it follows the target, it is inserted before it. This ensures any node can be dragged from the very\n   * beginning to the very end and vice versa. The animateNode function is called for all nodes that moved because\n   * of this dom update */\n  private insertAtTarget(node: Element, target: HTMLElement) {\n    if (!node || !target) return;\n\n    let offsets: any[] = [];\n    if (this.animationEnabled) {\n      offsets = this.sortableNodes.map((item) => ({\n        x: item.offsetLeft,\n        y: item.offsetTop,\n      }));\n    }\n\n    if (!node.isConnected || !target.isConnected) return;\n\n    if (this.dropzoneNodes.indexOf(target) > -1) {\n      target.append(node);\n    } else {\n      const nodeComparison = node.compareDocumentPosition(target);\n      let position;\n\n      if (nodeComparison & this.host.DOCUMENT_POSITION_FOLLOWING) {\n        position =\n          target.parentNode === node.parentNode ? 'afterend' : 'beforebegin';\n      }\n      if (nodeComparison & this.host.DOCUMENT_POSITION_PRECEDING) {\n        position =\n          target.parentNode === node.parentNode ? 'beforebegin' : 'afterend';\n      }\n      if (position) target.insertAdjacentElement(position, node);\n    }\n\n    if (this.animationEnabled) {\n      this.sortableNodes.forEach((sortableNode, i) => {\n        const { x, y } = offsets[i];\n        const dx = x - sortableNode.offsetLeft;\n        const dy = y - sortableNode.offsetTop;\n        if (dx !== 0 || dy !== 0) {\n          this.animateNode(sortableNode, dx, dy);\n        }\n      });\n    }\n  }\n\n  private reset() {\n    if (\n      this.draggedElementClone !== undefined &&\n      this.draggedElementClone.parentNode !== null\n    ) {\n      this.draggedElementClone.parentNode.removeChild(this.draggedElementClone);\n    }\n\n    if (\n      this.draggedElement &&\n      this.draggedElement.parentNode &&\n      this.draggedElementOrigin\n    ) {\n      this.draggedElement.classList.remove(this.placeholderClass);\n    }\n\n    if (this.dropzoneActiveClass && this.dropzoneNodes.length) {\n      this.dropzoneNodes.forEach((dze) =>\n        dze.classList.remove(this.dropzoneActiveClass)\n      );\n    }\n\n    delete this.draggedElementClone;\n    delete this.draggedElement;\n\n    this.dropzoneNodes = [];\n    this.sortableNodes = [];\n    this.animatedElements = [];\n    this.dragRequestPending = false;\n    this.updateUserSelectStyle('');\n  }\n\n  /**\n   * Clones a given node to visually drag around. The original node is left in the same flow as its siblings.\n   * Clone styles are added onto the style object directly, since the ::slotted()\n   * selector can't universally target nodes that may be nested an unknown amount of shadow dom levels deep\n   * @param node html node to clone\n   * @returns the cloned html node\n   */\n  private createClone(node: HTMLElement): HTMLElement {\n    const clone = node.cloneNode(true) as HTMLElement;\n    if (node.id) clone.id = 'clone__' + clone.id;\n\n    /**\n     * Bugfix for table row sorting.\n     * During dragging table rows shrink, so we manually set them width of original node.\n     */\n    Array.from(clone.children).forEach((nodeChild: HTMLElement, index) => {\n      const clonedNodeChild = nodeChild;\n      const originalNodeChild = node.children.item(index) as HTMLElement;\n\n      if (originalNodeChild) {\n        clonedNodeChild.style.width = `${originalNodeChild.offsetWidth}px`;\n      }\n    });\n    const {\n      offsetLeft: x,\n      offsetTop: y,\n      offsetWidth: w,\n      offsetHeight: h,\n    } = node;\n\n    Object.assign(clone.style, {\n      position: 'absolute',\n      left: `calc(${x}px - var(--grab-offset-x, 0px))`,\n      top: `calc(${y}px - var(--grab-offset-y, 0px))`,\n      height: this.dragResize ? `${h}px` : undefined,\n      width: this.dragResize ? `${w}px` : undefined,\n      willChange: 'transform,opacity',\n    });\n\n    clone.classList.add(this.draggedClass);\n\n    return node.parentNode.appendChild(clone);\n  }\n\n  /// Event handlers ///\n\n  private removeEventHandlers(ele?: HTMLElement) {\n    ele = ele || this.sortableHost;\n    ele.removeEventListener('mousedown', this.handleTrack);\n    ele.removeEventListener('touchstart', this.handleTrack);\n    ele.removeEventListener('keydown', this.handleKeydown);\n  }\n\n  private addEventHandlers(ele?: HTMLElement) {\n    ele = ele || this.sortableHost;\n    addListeners(ele, 'mousedown touchstart', this.handleTrack, {\n      passive: true,\n    });\n    ele.addEventListener('keydown', this.handleKeydown);\n  }\n\n  /**\n   * Watch for any changes in grab-able handle elements.\n   */\n  private attachMutationObserver() {\n    if (!Build.isBrowser) return;\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n      this.mutationObserver = undefined;\n    }\n\n    this.mutationObserver = new MutationObserver(() => {\n      const currHandles = Array.from(this.keyboardHandleMap.values());\n      const newHandles = Array.from(\n        this.sortableHost.querySelectorAll<HTMLElement>(this.itemSelector)\n      );\n\n      // simple test for equality\n      if (\n        currHandles.length !== newHandles.length ||\n        !!newHandles.find((h) => !currHandles.includes(h))\n      ) {\n        this.refreshKeyboardHandles();\n      }\n    });\n    this.mutationObserver.observe(this.sortableHost, {\n      subtree: true,\n      childList: true,\n    });\n  }\n\n  private handleKeydown(e: KeyboardEvent) {\n    const targetElement = e.target as HTMLElement;\n    let foundHandle: HTMLElement;\n    let sortEle: HTMLElement;\n\n    if (this.handleSelector) {\n      foundHandle = targetElement.closest(this.handleSelector);\n      sortEle = targetElement.closest(this.itemSelector);\n    } else {\n      sortEle = this.keyboardHandleMap.get(targetElement);\n      foundHandle = targetElement;\n    }\n\n    // have we found a handle and matching sort element from the keydown element\n    if (!foundHandle || !sortEle) return;\n\n    const activateSort = (isActive: boolean) => {\n      this.keyboardSortActive = isActive;\n      this.draggedElement = isActive ? sortEle : undefined;\n      sortEle.classList.toggle(this.draggedClass, isActive);\n      foundHandle.classList.toggle(this.handleDraggedClass, isActive);\n\n      if (isActive) {\n        this.addAriaMsg(this.grabbedHelperText(sortEle));\n        document.addEventListener('mousedown', () => activateSort(false), {\n          once: true,\n        });\n      } else {\n        this.addAriaMsg(this.droppedHelperText(sortEle));\n      }\n    };\n\n    // start editing this element's order?\n    if ([' ', 'Space', 'Enter'].includes(e.key)) {\n      e.preventDefault();\n\n      if (!this.keyboardSortActive) {\n        // grabbed the element\n        activateSort(true);\n\n        this.sortableNodes =\n          Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) ||\n          [];\n        const nanoGrabbedEv = this.nanoGrabbed.emit({\n          element: sortEle,\n          index: this.sortableNodes.indexOf(sortEle),\n        });\n\n        if (nanoGrabbedEv.defaultPrevented) {\n          activateSort(false);\n          return;\n        }\n      } else {\n        // dropped the element\n        activateSort(false);\n        this.nanoDropped.emit({ element: sortEle });\n      }\n      return;\n    }\n    if (!this.keyboardSortActive) return;\n\n    // Tabbing away from this handle - deactivate\n    if (['Escape', 'Tab'].includes(e.key)) activateSort(false);\n\n    let moveKeys = ['Home', 'End'];\n    if (!this.orientation || this.orientation === 'horizontal')\n      moveKeys = [...moveKeys, 'ArrowRight', 'ArrowLeft'];\n    if (!this.orientation || this.orientation === 'vertical')\n      moveKeys = [...moveKeys, 'ArrowUp', 'ArrowDown'];\n\n    if (!moveKeys.includes(e.key)) return;\n\n    // move the element with the keyboard\n    e.preventDefault();\n\n    /** Collect all elements that have drag positions.\n     * Both sortable elements and 'dropzones' (placeholders where items can always be placed) */\n\n    this.sortableNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) || [];\n    this.dropzoneNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.dropzoneSelector)) ||\n      [];\n    const currIdx = this.sortableNodes.indexOf(this.draggedElement);\n    let curDzIdx: number = -1;\n\n    if (this.dropzoneNodes.length) {\n      const curDropzone = this.draggedElement.closest<HTMLElement>(\n        this.dropzoneSelector\n      );\n      curDzIdx = this.dropzoneNodes.indexOf(curDropzone);\n      curDzIdx = curDzIdx > -1 ? curDzIdx : -1;\n    }\n\n    /** If we don't have a next / prev sortable element in our list, test to see if there's a dropzone instead */\n    const prevEle =\n      currIdx - 1 < 0 && curDzIdx > -1\n        ? this.dropzoneNodes[curDzIdx - 1]\n        : this.sortableNodes[currIdx - 1];\n    const nextEle =\n      currIdx + 1 === this.sortableNodes.length && curDzIdx > -1\n        ? this.dropzoneNodes[curDzIdx + 1]\n        : this.sortableNodes[currIdx + 1];\n\n    if (e.key === 'Home') {\n      this.insertAtTarget(this.draggedElement, this.sortableNodes[0]);\n    }\n    if (e.key === 'End') {\n      this.insertAtTarget(\n        this.draggedElement,\n        this.sortableNodes[this.sortableNodes.length - 1]\n      );\n    }\n    if (['ArrowRight', 'ArrowDown'].includes(e.key)) {\n      this.insertAtTarget(this.draggedElement, nextEle);\n    }\n    if (['ArrowLeft', 'ArrowUp'].includes(e.key)) {\n      this.insertAtTarget(this.draggedElement, prevEle);\n    }\n\n    this.finishOrder();\n    this.draggedElement = sortEle;\n\n    const focus = () => {\n      requestAnimationFrame(() => {\n        if (typeof foundHandle['setFocus'] === 'function')\n          (foundHandle as HTMLNanoIconButtonElement).setFocus();\n        else foundHandle.focus();\n      });\n    };\n\n    // replace focus to handle so we don't 'drop' the element\n    if (this.animationPromise) this.animationPromise.then(() => focus());\n    else focus();\n  }\n\n  /** Tracks a pointer from touchstart/mousedown to touchend/mouseup. */\n  private handleTrack(e: PointerEvent) {\n    // ignore if we've started dragging or right click\n    if (this.dragRequestPending || (e.button && e.button !== 1)) return;\n\n    // ignore touchmove events (namespace it so we can remove it)\n    const handleMove = (e: Event) => {\n      if (e.cancelable) e.preventDefault();\n      clearTimeout(this.mouseDownTimer);\n    };\n\n    // remove temporary events and reset timer\n    const resetTrack = () => {\n      clearTimeout(this.mouseDownTimer);\n      document.removeEventListener('touchmove', handleMove);\n      document.removeEventListener('contextmenu', this.finishOrder);\n    };\n    resetTrack();\n\n    // start a timer - only start dragging if pressed for 150ms\n    this.mouseDownTimer = window?.setTimeout(() => {\n      // ignore if this is not a valid drag target\n      if (!this.trackStart(e)) return;\n\n      // ignore touchmove events (they scroll the screen)\n      document.addEventListener('touchmove', handleMove, {\n        passive: false,\n      });\n      // cancel if user presses and holds (without move) for context menu\n      document.addEventListener('contextmenu', this.finishOrder);\n\n      this.addAriaMsg(this.grabbedHelperText(this.draggedElement));\n\n      drag(this.sortableHost, {\n        initialEvent: e,\n        relative: true,\n        onMove: (x, y) => {\n          this.trackMove(x, y);\n        },\n        onStop: () => {\n          this.nanoDropped.emit({ element: this.draggedElement });\n          resetTrack();\n\n          const didStop = () => {\n            this.addAriaMsg(this.droppedHelperText(this.draggedElement));\n            requestAnimationFrame(() => this.finishOrder());\n          };\n          if (this.animationPromise) {\n            this.animationPromise.then(() => didStop());\n          } else didStop();\n        },\n      });\n    }, 150);\n\n    // reset track timer & cancel DnD on mouseup / touchend / touchmove\n    addListeners(\n      document,\n      'mouseup touchend touchmove',\n      () => clearTimeout(this.mouseDownTimer),\n      { once: true }\n    );\n  }\n\n  /**\n   * Initialized a drag and drop sequence if a child node was clicked that matches the itemSelector property.\n   * OR If a handleSelector is defined, a node matching this selector must be clicked instead\n   * @returns boolean - whether tracking for this event should continue or not\n   */\n  private trackStart(e: Event) {\n    const targetElement = e.target as HTMLElement;\n    let targetHandle: HTMLElement;\n\n    // If we have a handle set, return now if not being pressed\n    if (this.handleSelector) {\n      targetHandle = targetElement.closest(this.handleSelector);\n\n      if (!targetHandle) return;\n      targetHandle.classList.add(this.handleDraggedClass);\n    }\n\n    // Check that we've found the target element via itemSelector\n    const node = targetElement.closest<HTMLElement>(this.itemSelector);\n    if (!node) return false;\n\n    this.sortableNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) || [];\n    const nanoGrabbedEv = this.nanoGrabbed.emit({\n      element: node,\n      index: this.sortableNodes.indexOf(node),\n    });\n    if (nanoGrabbedEv.defaultPrevented) return false;\n\n    // Element found... start everything\n    e.preventDefault();\n    this.updateUserSelectStyle('none');\n    this.dragRequestPending = true;\n    this.draggedElement = node;\n    this.dropzoneNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.dropzoneSelector)) ||\n      [];\n    this.draggedElementClone = this.createClone(node);\n    this.draggedElementOrigin = node.nextSibling as HTMLElement;\n    this.animatedElements = [];\n    this.draggedElement.classList.add(this.placeholderClass);\n    return true;\n  }\n\n  /** Ends re-ordering */\n  private finishOrder = () => {\n    if (!this.draggedElement) return;\n\n    const updated = Array.from(\n      this.sortableHost.querySelectorAll<HTMLElement>(this.itemSelector)\n    ).filter((ele) => ele !== this.draggedElementClone);\n    const originalIndex = this.sortableNodes.indexOf(this.draggedElement);\n    const targetIndex = updated.indexOf(this.draggedElement);\n\n    if (this.handleSelector) {\n      const targetHandle = this.draggedElement.querySelector(\n        this.handleSelector\n      );\n      targetHandle.classList.remove(this.handleDraggedClass);\n    }\n\n    if (originalIndex !== targetIndex) {\n      const orderChangeEv = this.nanoOrderChange.emit({\n        element: this.draggedElement,\n        originalIndex,\n        targetIndex,\n      });\n\n      if (orderChangeEv.defaultPrevented) {\n        /** Event was prevented, wait a moment to send element back to whence it came - gives a nicer visual queue */\n        this.animationPromise = new Promise((resolve) => {\n          setTimeout(() => {\n            this.insertAtTarget(this.draggedElement, updated[originalIndex]);\n            this.reset();\n            this.dragRequestPending = false;\n            resolve();\n          }, 200);\n        });\n        return;\n      }\n      this.addAriaMsg(\n        this.reorderHelperText(this.draggedElement, updated, targetIndex + 1)\n      );\n    }\n\n    this.reset();\n    this.dragRequestPending = false;\n  };\n\n  /**\n   * Moves the active node's clone to follow the pointer. The node that the clone intersects with (via hitTest) is\n   * the insert point for updated sorting */\n  private trackMove = (x: number, y: number) => {\n    if (!this.draggedElementClone) {\n      return;\n    }\n\n    if (this.orientation) {\n      x = x * orientationMap[this.orientation].x;\n      y = y * orientationMap[this.orientation].y;\n    }\n\n    writeTask(() => {\n      Object.assign(this.draggedElementClone.style, {\n        transform: `translate3d(${x}px, ${y}px, 0)`,\n      });\n    });\n\n    let target = this.hitTest(this.draggedElementClone, this.sortableNodes)[0];\n    let activeDropzone: HTMLElement;\n\n    if (this.dropzoneSelector && this.dropzoneActiveClass) {\n      readTask(() => {\n        activeDropzone = this.draggedElement.closest(this.dropzoneSelector);\n\n        writeTask(() => {\n          this.dropzoneNodes\n            .filter((dze) => dze !== activeDropzone)\n            .forEach((dze) => dze.classList.remove(this.dropzoneActiveClass));\n          activeDropzone.classList.add(this.dropzoneActiveClass);\n        });\n      });\n    }\n\n    // didn't find a target - let's test to see if we can use a drop-zone instead\n    if (!target && this.dropzoneNodes.length) {\n      target = this.hitTest(this.draggedElementClone, this.dropzoneNodes)[0];\n      if (this.draggedElement.closest(this.dropzoneSelector) === target) return;\n    }\n\n    if (\n      // if clone intersects with a valid target,\n      target &&\n      // other than its own origin,\n      target !== this.draggedElement &&\n      // and the target isn't currently animating, which causes false hit tests,\n      !this.isAnimating(target)\n    ) {\n      this.insertAtTarget(this.draggedElement, target);\n    }\n  };\n\n  /// Component lifecycle ///\n\n  constructor() {\n    this.handleTrack = this.handleTrack.bind(this);\n    this.handleKeydown = this.handleKeydown.bind(this);\n    this.refreshKeyboardHandles = this.refreshKeyboardHandles.bind(this);\n    this.refreshKeyboardHandles = nanoDebounce(\n      this.refreshKeyboardHandles,\n      500\n    );\n  }\n\n  connectedCallback() {\n    this.addEventHandlers();\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n\n    if (Build.isBrowser && !this.host.querySelector(`#${this.sortableId}`)) {\n      // inject a light-dom / a11y description that we can connect sortable items to\n      this.host.insertAdjacentHTML(\n        'beforeend',\n        `<div class=\"visually-hidden\" id=\"${this.sortableId}\">${this.helperText}</div>`\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    this.removeEventHandlers();\n    this.host.querySelector(`#${this.sortableId}`)?.remove();\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n      this.mutationObserver = undefined;\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class=\"sortable__live-region\"\n          aria-live=\"polite\"\n          aria-relevant=\"additions\"\n          aria-atomic=\"true\"\n          role=\"log\"\n          part=\"announcements\"\n        >\n          {this.ariaTextList.map((str) => (\n            <div>{str}</div>\n          ))}\n        </div>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nano-sortable.entry.cjs.js","mappings":"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","names":["writeTask","addListeners","drag","readTask","nanoDebounce","h","Host"],"sources":["src/components/sortable/sortable.scss?tag=nano-sortable&encapsulation=shadow","src/components/sortable/sortable.tsx"],"sourcesContent":["@use '../../global/style/utilities/mixins' as mx;\n\n:host {\n  position: relative;\n  display: block;\n}\n\n.sortable__live-region {\n  @include mx.visually-hide();\n}\n","import {\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Component,\n  ComponentInterface,\n  Watch,\n  Method,\n  State,\n  Host,\n  readTask,\n  writeTask,\n  Build,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\nimport { drag } from '../../utils/drag';\nimport { nanoDebounce } from '../..';\nimport { addListeners } from '../../utils/events';\n\n// Orientation map to limit dragging to horizontal or vertical.\nconst orientationMap = {\n  horizontal: { x: 1, y: 0 },\n  vertical: { x: 0, y: 1 },\n};\n\nlet sortableIds = 0;\n\n/**\n * An accessible and flexible re-order / sort utility component.\n *\n *- Drag and drop via mouse, touch or keyboard\n *- Live announcements for screen readers\n *- Works with or without an explicit handle (although with is preferable)\n\n * @part announcements - the a11y, live region. Visually hidden by default\n *\n * @slot - The default slot containing any items you might want to sort\n */\n@Component({\n  tag: 'nano-sortable',\n  shadow: true,\n  styleUrl: 'sortable.scss',\n})\nexport class Sortable implements ComponentInterface {\n  /// Public API & surface ///\n\n  /** A css query selector which matches a set of elements that should be sortable. e.g. `<li>` or `<tr>` */\n  @Prop() itemSelector = 'li';\n  @Watch('itemSelector')\n  handleItemSelectorChange() {\n    this.refreshKeyboardHandles();\n  }\n\n  /** A css query selector which matches an element *within* the `itemSelector` element\n   * which will act like a drag handle. **Note** For keyboard a11y it's recommended\n   * to use `handleSelector` when possible. Alternatively, the `createKeyboardHandle` prop will be used */\n  @Prop() handleSelector?: string;\n  @Watch('handleSelector')\n  handleHandleSelectorChange() {\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n  }\n\n  /** When dragging between grouped collections of items, it is possible to drag all sortable items from one group to another.\n   * At that point, you will not be able to drag items back to the original group.\n   * A `dropzoneSelector` allows you to define a placeholder area where items can always be dropped.\n   */\n  @Prop() dropzoneSelector?: string;\n\n  /** Accessibility helper text applied to handle controls */\n  @Prop() helperText =\n    'Press \"Space\" or \"Enter\" to enable element reordering and use the arrow keys to reorder items.' +\n    'Press \"Escape\" to cancel reordering. Alternatively, use your mouse to drag / reorder.';\n\n  /**\n   * As a sortable element is interacted with, announcements are made to screen readers\n   * - informing the user what is changing.\n   * By default, the text from the element is extracted to describe the interacted with element.\n   * Use this function to provide a more meaningful, concise item descriptor\n   * @param el the element being interacted with\n   * @returns a string, describing the element being interacted with\n   */\n  @Prop() itemDescriptor = (el: Element) => `\"${el?.textContent.trim()}\"`;\n\n  /**\n   * Used to generate a screen reader live update, informing the user of the current element being grabbed.\n   * @param el the element that has been grabbed by the user\n   * @returns a string, describing the element being grabbed\n   */\n  @Prop() grabbedHelperText = (el: Element) =>\n    `${this.itemDescriptor(el)} grabbed`;\n\n  /**\n   * Used to generate a screen reader live update, informing the user of the current element being dropped.\n   * @param el the element that has been dropped by the user\n   * @returns a string, describing the element that has been dropped\n   */\n  @Prop() droppedHelperText = (el: Element) =>\n    `${this.itemDescriptor(el)} dropped`;\n\n  /**\n   *  Used to generate a screen reader live update, informing the user when items have been reordered.\n   * @param el the element that has been reordered by the user\n   * @param elements the elements in the sortable list\n   * @param position the new position of the dropped element\n   * @returns a string, describing the element being dropped\n   */\n  @Prop() reorderHelperText = (\n    el: Element,\n    elements: Element[],\n    position: number\n  ) =>\n    `The list has been reordered, ${this.itemDescriptor(\n      el\n    )} is now item ${position} of ${elements.length}`;\n\n  /**\n   * A function that should attach a keyboard accessible control.\n   * When a `handleSelector` is not used - to allow keyboard accessibility -\n   * `createKeyboardHandle` should render a focusable element.\n   *\n   * If your sortable item is itself focusable,\n   * you must use this function to render a control *outside* of the focusable element.\n   * @param _number\n   * @param _element\n   * @returns a function that attaches a keyboard accessible handle control element.\n   * The function itself *must* return the handle element.\n   */\n  @Prop() createKeyboardHandle = (_number: number, _element: Element) => {\n    const handleTpl = /* html */ `\n      <nano-icon-button\n        slot=\"end\"\n        icon-name=\"light/arrows-up-down-left-right\"\n        class=\"nano-sortable__keyboard-handle visually-hidden\"\n        label=\"Re-order this item\"\n      ></nano-icon-button>`;\n    const div = document.createElement('div');\n    div.innerHTML = handleTpl;\n\n    const handle = div.children[0] as HTMLElement;\n    _element.append(handle);\n    return handle;\n  };\n  @Watch('createKeyboardHandle')\n  handleCreateKeyboardHandleChange() {\n    this.refreshKeyboardHandles();\n  }\n\n  /** use `sortableHostElement` to watch a sortable list without needing to wrap in `nano-sortable`.\n   * Note that the `sortableHostElement` element css `position` will be set to `relative` */\n  @Prop() sortableHostElement?: HTMLElement;\n  @Watch('sortableHostElement')\n  handleSortableHostElement(_newVal?, oldVal?: HTMLElement) {\n    if (oldVal) this.removeEventHandlers(oldVal);\n\n    this.addEventHandlers();\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n\n    if (this.sortableHostElement) {\n      // sortable host must have position relative\n      this.sortableHostElement.style.position = 'relative';\n    }\n  }\n\n  /** Items being sorted will animate into place */\n  @Prop() animationEnabled = true;\n\n  /** Use this class to change how the element looks whilst being sorted */\n  @Prop() draggedClass = 'nano-sortable__dragged';\n\n  /** Use this class to change how the handle looks whilst being sorted */\n  @Prop() handleDraggedClass = 'nano-sortable__handle-dragged';\n\n  /** Use this class to change how the element looks when acting as a placeholder */\n  @Prop() placeholderClass = 'nano-sortable__placeholder';\n\n  /** Used in-conjunction with `dropzoneSelector`, applied when a dropzone is dragged over */\n  @Prop() dropzoneActiveClass?: string = '';\n\n  /** The css animation timing applied when `animationEnabled` is `true` */\n  @Prop() animationTiming: any = { duration: 200, easing: 'ease-out' };\n\n  /** The axis to lock dragging elements to. `undefined` means any axis */\n  @Prop() orientation?: 'horizontal' | 'vertical';\n\n  /** Dragged items by default, will take whatever default css is applied in situ.\n   * When sortable items' dimensions are dynamic (i.e they can shrink / grow via the space allowed) dragging items can look 'wrong'.\n   * Apply `dragResize` to read & recreate the dragged items current dimensions when dragged.  */\n  @Prop() dragResize = false;\n\n  /** Fired when an the order changes. Use this to update any underlying data model.\n   * `event.preventDefault()` to prevent the element being moved; will revert to original position. */\n  @Event() nanoOrderChange: EventEmitter<{\n    element: HTMLElement;\n    originalIndex: number;\n    targetIndex: number;\n  }>;\n\n  /** Fired when a sortable element is picked-up; via keyboard, mouse or touch.\n   * `event.preventDefault()` to prevent the element being picked-up. */\n  @Event() nanoGrabbed: EventEmitter<{ element: HTMLElement; index: number }>;\n\n  /** Fired when a sortable element is dropped after having been picked up. */\n  @Event() nanoDropped: EventEmitter<{ element: HTMLElement }>;\n\n  /** If sortable elements change dynamically, use this method to add handle controls to new elements */\n  @Method()\n  async refreshKeyboardHandles() {\n    if (this.handleSelector) {\n      if (this.keyboardHandleMap?.size) {\n        this.keyboardHandleMap.clear();\n      }\n\n      this.sortableHost\n        .querySelectorAll<HTMLElement>(this.handleSelector)\n        .forEach((handle) => {\n          if (!handle.getAttribute('aria-describedby'))\n            handle.setAttribute('aria-describedby', this.sortableId);\n          const sortEle = handle.closest<HTMLElement>(this.itemSelector);\n          if (sortEle) this.keyboardHandleMap.set(handle, sortEle);\n        });\n      return;\n    }\n\n    if (this.keyboardHandleMap?.size) {\n      this.keyboardHandleMap?.forEach((_ele, handle) => handle.remove());\n      this.keyboardHandleMap.clear();\n    }\n    this.sortableHost\n      .querySelectorAll<HTMLElement>(this.itemSelector)\n      .forEach((ele, i) => {\n        const handle = this.createKeyboardHandle(i, ele);\n        if (!handle) {\n          console.error(\n            '`createKeyboardHandle` *must* return the handle element it creates'\n          );\n          return;\n        }\n        this.keyboardHandleMap.set(handle, ele);\n        handle.setAttribute('aria-describedby', this.sortableId);\n      });\n  }\n\n  /// Private state & logic ///\n\n  @Element() host: HTMLNanoSortableElement;\n  private dragRequestPending = false;\n  private draggedElement?: HTMLElement;\n  private draggedElementClone?: HTMLElement;\n  private draggedElementOrigin?: HTMLElement;\n  private sortableNodes: HTMLElement[] = [];\n  private dropzoneNodes: HTMLElement[] = [];\n  private animatedElements: HTMLElement[] = [];\n  private animationPromise?: Promise<void>;\n  private keyboardHandleMap: Map<HTMLElement, HTMLElement> = new Map();\n  private sortableId = `nano-sortable-${sortableIds++}`;\n  private mouseDownTimer: number;\n  private mutationObserver: MutationObserver;\n\n  @State() keyboardSortActive = false;\n  @State() ariaTextList: string[] = [];\n\n  /**\n   * Get instance of sortable host.\n   * By default it is `nano-sortable` which can be overridden by property `sortableHostElement`\n   */\n  get sortableHost() {\n    if (this.sortableHostElement) return this.sortableHostElement;\n    return this.host;\n  }\n\n  /**\n   * Queues aria messages which are then displayed in a 'live' region.\n   * Messages are cleared after 10s\n   * @param msg aria message to announce\n   */\n  private addAriaMsg(msg: string) {\n    this.ariaTextList = [...this.ariaTextList, msg];\n\n    setTimeout(() => {\n      const mIdx = this.ariaTextList.indexOf(msg);\n      this.ariaTextList.splice(mIdx, 1);\n      this.ariaTextList = [...this.ariaTextList];\n    }, 10000);\n  }\n\n  /**\n   * Try to stop text highlight whilst dragging\n   * @param userSelect\n   */\n  private updateUserSelectStyle(userSelect: '' | 'none') {\n    this.host.style.userSelect = userSelect;\n  }\n\n  /**\n   * Fast and simple hit test to check whether the center of a node intersects with the rectangle of any of the\n   * given targets. Returns an array of matches.\n   * @param node\n   * @param targets\n   * @returns all the items that currently intersect with the target node\n   */\n  private hitTest(node: HTMLElement, targets: HTMLElement[]): HTMLElement[] {\n    const {\n      left: l,\n      top: t,\n      width: w,\n      height: h,\n    } = node.getBoundingClientRect();\n    const x = l + w / 2;\n    const y = t + h / 2;\n\n    return targets.filter((item) => {\n      const { left, right, top, bottom } = item.getBoundingClientRect();\n      return !(x < left || x > right || y < top || y > bottom);\n    });\n  }\n\n  /**\n   * Returns a boolean indicating whether the node is currently in an animation.\n   * @param node\n   * @returns whether a node is currently animating or not\n   */\n  private isAnimating(node: HTMLElement) {\n    return this.animatedElements.indexOf(node) !== -1;\n  }\n\n  /**\n   * Triggers a CSS animation on a node with the given dx and dy. Used following dom updates to make it appear as\n   * if nodes animate from their old to their new position in the dom. */\n  private animateNode(node: HTMLElement, dx = 0, dy = 0) {\n    if (!node.animate) {\n      return;\n    }\n\n    // keep a stack of currently animating nodes to exclude as drag & drop targets.\n    this.animatedElements.push(node);\n\n    node.style.willChange = 'transform';\n\n    // animate from dx/dy (old node position) to none (new node position)\n    writeTask(() => {\n      this.animationPromise = new Promise((resolve) => {\n        node\n          .animate(\n            [\n              { transform: `translate3d(${dx}px, ${dy}px, 0)` },\n              { transform: 'none' },\n            ],\n            this.animationTiming\n          )\n          .addEventListener(\n            'finish',\n            () => {\n              const index = this.animatedElements.indexOf(node);\n              node.style.willChange = '';\n\n              if (index !== -1) {\n                // splice out when done to unlock as a valid target\n                this.animatedElements.splice(index, 1);\n              }\n\n              resolve();\n              delete this.animationPromise;\n            },\n            { once: true }\n          );\n      });\n    });\n  }\n\n  /**\n   * Inserts node at target to update sibling sorting. If the node precedes the target, it is inserted after it;\n   * If it follows the target, it is inserted before it. This ensures any node can be dragged from the very\n   * beginning to the very end and vice versa. The animateNode function is called for all nodes that moved because\n   * of this dom update */\n  private insertAtTarget(node: Element, target: HTMLElement) {\n    if (!node || !target) return;\n\n    let offsets: any[] = [];\n    if (this.animationEnabled) {\n      offsets = this.sortableNodes.map((item) => ({\n        x: item.offsetLeft,\n        y: item.offsetTop,\n      }));\n    }\n\n    if (!node.isConnected || !target.isConnected) return;\n\n    if (this.dropzoneNodes.indexOf(target) > -1) {\n      target.append(node);\n    } else {\n      const nodeComparison = node.compareDocumentPosition(target);\n      let position;\n\n      if (nodeComparison & this.host.DOCUMENT_POSITION_FOLLOWING) {\n        position =\n          target.parentNode === node.parentNode ? 'afterend' : 'beforebegin';\n      }\n      if (nodeComparison & this.host.DOCUMENT_POSITION_PRECEDING) {\n        position =\n          target.parentNode === node.parentNode ? 'beforebegin' : 'afterend';\n      }\n      if (position) target.insertAdjacentElement(position, node);\n    }\n\n    if (this.animationEnabled) {\n      this.sortableNodes.forEach((sortableNode, i) => {\n        const { x, y } = offsets[i];\n        const dx = x - sortableNode.offsetLeft;\n        const dy = y - sortableNode.offsetTop;\n        if (dx !== 0 || dy !== 0) {\n          this.animateNode(sortableNode, dx, dy);\n        }\n      });\n    }\n  }\n\n  private reset() {\n    if (\n      this.draggedElementClone !== undefined &&\n      this.draggedElementClone.parentNode !== null\n    ) {\n      this.draggedElementClone.parentNode.removeChild(this.draggedElementClone);\n    }\n\n    if (\n      this.draggedElement &&\n      this.draggedElement.parentNode &&\n      this.draggedElementOrigin\n    ) {\n      this.draggedElement.classList.remove(this.placeholderClass);\n    }\n\n    if (this.dropzoneActiveClass && this.dropzoneNodes.length) {\n      this.dropzoneNodes.forEach((dze) =>\n        dze.classList.remove(this.dropzoneActiveClass)\n      );\n    }\n\n    delete this.draggedElementClone;\n    delete this.draggedElement;\n\n    this.dropzoneNodes = [];\n    this.sortableNodes = [];\n    this.animatedElements = [];\n    this.dragRequestPending = false;\n    this.updateUserSelectStyle('');\n  }\n\n  /**\n   * Clones a given node to visually drag around. The original node is left in the same flow as its siblings.\n   * Clone styles are added onto the style object directly, since the ::slotted()\n   * selector can't universally target nodes that may be nested an unknown amount of shadow dom levels deep\n   * @param node html node to clone\n   * @returns the cloned html node\n   */\n  private createClone(node: HTMLElement): HTMLElement {\n    const clone = node.cloneNode(true) as HTMLElement;\n    if (node.id) clone.id = 'clone__' + clone.id;\n\n    /**\n     * Bugfix for table row sorting.\n     * During dragging table rows shrink, so we manually set them width of original node.\n     */\n    Array.from(clone.children).forEach((nodeChild: HTMLElement, index) => {\n      const clonedNodeChild = nodeChild;\n      const originalNodeChild = node.children.item(index) as HTMLElement;\n\n      if (originalNodeChild) {\n        clonedNodeChild.style.width = `${originalNodeChild.offsetWidth}px`;\n      }\n    });\n    const {\n      offsetLeft: x,\n      offsetTop: y,\n      offsetWidth: w,\n      offsetHeight: h,\n    } = node;\n\n    Object.assign(clone.style, {\n      position: 'absolute',\n      left: `calc(${x}px - var(--grab-offset-x, 0px))`,\n      top: `calc(${y}px - var(--grab-offset-y, 0px))`,\n      height: this.dragResize ? `${h}px` : undefined,\n      width: this.dragResize ? `${w}px` : undefined,\n      willChange: 'transform,opacity',\n    });\n\n    clone.classList.add(this.draggedClass);\n\n    return node.parentNode.appendChild(clone);\n  }\n\n  /// Event handlers ///\n\n  private removeEventHandlers(ele?: HTMLElement) {\n    ele = ele || this.sortableHost;\n    ele.removeEventListener('mousedown', this.handleTrack);\n    ele.removeEventListener('touchstart', this.handleTrack);\n    ele.removeEventListener('keydown', this.handleKeydown);\n  }\n\n  private addEventHandlers(ele?: HTMLElement) {\n    ele = ele || this.sortableHost;\n    addListeners(ele, 'mousedown touchstart', this.handleTrack, {\n      passive: true,\n    });\n    ele.addEventListener('keydown', this.handleKeydown);\n  }\n\n  /**\n   * Watch for any changes in grab-able handle elements.\n   */\n  private attachMutationObserver() {\n    if (!Build.isBrowser) return;\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n      this.mutationObserver = undefined;\n    }\n\n    this.mutationObserver = new MutationObserver(() => {\n      const currHandles = Array.from(this.keyboardHandleMap.values());\n      const newHandles = Array.from(\n        this.sortableHost.querySelectorAll<HTMLElement>(this.itemSelector)\n      );\n\n      // simple test for equality\n      if (\n        currHandles.length !== newHandles.length ||\n        !!newHandles.find((h) => !currHandles.includes(h))\n      ) {\n        this.refreshKeyboardHandles();\n      }\n    });\n    this.mutationObserver.observe(this.sortableHost, {\n      subtree: true,\n      childList: true,\n    });\n  }\n\n  private handleKeydown(e: KeyboardEvent) {\n    const targetElement = e.target as HTMLElement;\n    let foundHandle: HTMLElement;\n    let sortEle: HTMLElement;\n\n    if (this.handleSelector) {\n      foundHandle = targetElement.closest(this.handleSelector);\n      sortEle = targetElement.closest(this.itemSelector);\n    } else {\n      sortEle = this.keyboardHandleMap.get(targetElement);\n      foundHandle = targetElement;\n    }\n\n    // have we found a handle and matching sort element from the keydown element\n    if (!foundHandle || !sortEle) return;\n\n    const activateSort = (isActive: boolean) => {\n      this.keyboardSortActive = isActive;\n      this.draggedElement = isActive ? sortEle : undefined;\n      sortEle.classList.toggle(this.draggedClass, isActive);\n      foundHandle.classList.toggle(this.handleDraggedClass, isActive);\n\n      if (isActive) {\n        this.addAriaMsg(this.grabbedHelperText(sortEle));\n        document.addEventListener('mousedown', () => activateSort(false), {\n          once: true,\n        });\n      } else {\n        this.addAriaMsg(this.droppedHelperText(sortEle));\n      }\n    };\n\n    // start editing this element's order?\n    if ([' ', 'Space', 'Enter'].includes(e.key)) {\n      e.preventDefault();\n\n      if (!this.keyboardSortActive) {\n        // grabbed the element\n        activateSort(true);\n\n        this.sortableNodes =\n          Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) ||\n          [];\n        const nanoGrabbedEv = this.nanoGrabbed.emit({\n          element: sortEle,\n          index: this.sortableNodes.indexOf(sortEle),\n        });\n\n        if (nanoGrabbedEv.defaultPrevented) {\n          activateSort(false);\n          return;\n        }\n      } else {\n        // dropped the element\n        activateSort(false);\n        this.nanoDropped.emit({ element: sortEle });\n      }\n      return;\n    }\n    if (!this.keyboardSortActive) return;\n\n    // Tabbing away from this handle - deactivate\n    if (['Escape', 'Tab'].includes(e.key)) activateSort(false);\n\n    let moveKeys = ['Home', 'End'];\n    if (!this.orientation || this.orientation === 'horizontal')\n      moveKeys = [...moveKeys, 'ArrowRight', 'ArrowLeft'];\n    if (!this.orientation || this.orientation === 'vertical')\n      moveKeys = [...moveKeys, 'ArrowUp', 'ArrowDown'];\n\n    if (!moveKeys.includes(e.key)) return;\n\n    // move the element with the keyboard\n    e.preventDefault();\n\n    /** Collect all elements that have drag positions.\n     * Both sortable elements and 'dropzones' (placeholders where items can always be placed) */\n\n    this.sortableNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) || [];\n    this.dropzoneNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.dropzoneSelector)) ||\n      [];\n    const currIdx = this.sortableNodes.indexOf(this.draggedElement);\n    let curDzIdx: number = -1;\n\n    if (this.dropzoneNodes.length) {\n      const curDropzone = this.draggedElement.closest<HTMLElement>(\n        this.dropzoneSelector\n      );\n      curDzIdx = this.dropzoneNodes.indexOf(curDropzone);\n      curDzIdx = curDzIdx > -1 ? curDzIdx : -1;\n    }\n\n    /** If we don't have a next / prev sortable element in our list, test to see if there's a dropzone instead */\n    const prevEle =\n      currIdx - 1 < 0 && curDzIdx > -1\n        ? this.dropzoneNodes[curDzIdx - 1]\n        : this.sortableNodes[currIdx - 1];\n    const nextEle =\n      currIdx + 1 === this.sortableNodes.length && curDzIdx > -1\n        ? this.dropzoneNodes[curDzIdx + 1]\n        : this.sortableNodes[currIdx + 1];\n\n    if (e.key === 'Home') {\n      this.insertAtTarget(this.draggedElement, this.sortableNodes[0]);\n    }\n    if (e.key === 'End') {\n      this.insertAtTarget(\n        this.draggedElement,\n        this.sortableNodes[this.sortableNodes.length - 1]\n      );\n    }\n    if (['ArrowRight', 'ArrowDown'].includes(e.key)) {\n      this.insertAtTarget(this.draggedElement, nextEle);\n    }\n    if (['ArrowLeft', 'ArrowUp'].includes(e.key)) {\n      this.insertAtTarget(this.draggedElement, prevEle);\n    }\n\n    this.finishOrder();\n    this.draggedElement = sortEle;\n\n    const focus = () => {\n      requestAnimationFrame(() => {\n        if (typeof foundHandle['setFocus'] === 'function')\n          (foundHandle as HTMLNanoIconButtonElement).setFocus();\n        else foundHandle.focus();\n      });\n    };\n\n    // replace focus to handle so we don't 'drop' the element\n    if (this.animationPromise) this.animationPromise.then(() => focus());\n    else focus();\n  }\n\n  /** Tracks a pointer from touchstart/mousedown to touchend/mouseup. */\n  private handleTrack(e: PointerEvent) {\n    // ignore if we've started dragging or right click\n    if (this.dragRequestPending || (e.button && e.button !== 1)) return;\n\n    // ignore touchmove events (namespace it so we can remove it)\n    const handleMove = (e: Event) => {\n      if (e.cancelable) e.preventDefault();\n      clearTimeout(this.mouseDownTimer);\n    };\n\n    // remove temporary events and reset timer\n    const resetTrack = () => {\n      clearTimeout(this.mouseDownTimer);\n      document.removeEventListener('touchmove', handleMove);\n      document.removeEventListener('contextmenu', this.finishOrder);\n    };\n    resetTrack();\n\n    // start a timer - only start dragging if pressed for 150ms\n    this.mouseDownTimer = window?.setTimeout(() => {\n      // ignore if this is not a valid drag target\n      if (!this.trackStart(e)) return;\n\n      // ignore touchmove events (they scroll the screen)\n      document.addEventListener('touchmove', handleMove, {\n        passive: false,\n      });\n      // cancel if user presses and holds (without move) for context menu\n      document.addEventListener('contextmenu', this.finishOrder);\n\n      this.addAriaMsg(this.grabbedHelperText(this.draggedElement));\n\n      drag(this.sortableHost, {\n        initialEvent: e,\n        relative: true,\n        onMove: (x, y) => {\n          this.trackMove(x, y);\n        },\n        onStop: () => {\n          this.nanoDropped.emit({ element: this.draggedElement });\n          resetTrack();\n\n          const didStop = () => {\n            this.addAriaMsg(this.droppedHelperText(this.draggedElement));\n            requestAnimationFrame(() => this.finishOrder());\n          };\n          if (this.animationPromise) {\n            this.animationPromise.then(() => didStop());\n          } else didStop();\n        },\n      });\n    }, 150);\n\n    // reset track timer & cancel DnD on mouseup / touchend / touchmove\n    addListeners(\n      document,\n      'mouseup touchend touchmove',\n      () => clearTimeout(this.mouseDownTimer),\n      { once: true }\n    );\n  }\n\n  /**\n   * Initialized a drag and drop sequence if a child node was clicked that matches the itemSelector property.\n   * OR If a handleSelector is defined, a node matching this selector must be clicked instead\n   * @returns boolean - whether tracking for this event should continue or not\n   */\n  private trackStart(e: Event) {\n    const targetElement = e.target as HTMLElement;\n    let targetHandle: HTMLElement;\n\n    // If we have a handle set, return now if not being pressed\n    if (this.handleSelector) {\n      targetHandle = targetElement.closest(this.handleSelector);\n\n      if (!targetHandle) return;\n      targetHandle.classList.add(this.handleDraggedClass);\n    }\n\n    // Check that we've found the target element via itemSelector\n    const node = targetElement.closest<HTMLElement>(this.itemSelector);\n    if (!node) return false;\n\n    this.sortableNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.itemSelector)) || [];\n    const nanoGrabbedEv = this.nanoGrabbed.emit({\n      element: node,\n      index: this.sortableNodes.indexOf(node),\n    });\n    if (nanoGrabbedEv.defaultPrevented) return false;\n\n    // Element found... start everything\n    e.preventDefault();\n    this.updateUserSelectStyle('none');\n    this.dragRequestPending = true;\n    this.draggedElement = node;\n    this.dropzoneNodes =\n      Array.from(this.sortableHost.querySelectorAll(this.dropzoneSelector)) ||\n      [];\n    this.draggedElementClone = this.createClone(node);\n    this.draggedElementOrigin = node.nextSibling as HTMLElement;\n    this.animatedElements = [];\n    this.draggedElement.classList.add(this.placeholderClass);\n    return true;\n  }\n\n  /** Ends re-ordering */\n  private finishOrder = () => {\n    if (!this.draggedElement) return;\n\n    const updated = Array.from(\n      this.sortableHost.querySelectorAll<HTMLElement>(this.itemSelector)\n    ).filter((ele) => ele !== this.draggedElementClone);\n    const originalIndex = this.sortableNodes.indexOf(this.draggedElement);\n    const targetIndex = updated.indexOf(this.draggedElement);\n\n    if (this.handleSelector) {\n      const targetHandle = this.draggedElement.querySelector(\n        this.handleSelector\n      );\n      targetHandle.classList.remove(this.handleDraggedClass);\n    }\n\n    if (originalIndex !== targetIndex) {\n      const orderChangeEv = this.nanoOrderChange.emit({\n        element: this.draggedElement,\n        originalIndex,\n        targetIndex,\n      });\n\n      if (orderChangeEv.defaultPrevented) {\n        /** Event was prevented, wait a moment to send element back to whence it came - gives a nicer visual queue */\n        this.animationPromise = new Promise((resolve) => {\n          setTimeout(() => {\n            this.insertAtTarget(this.draggedElement, updated[originalIndex]);\n            this.reset();\n            this.dragRequestPending = false;\n            resolve();\n          }, 200);\n        });\n        return;\n      }\n      this.addAriaMsg(\n        this.reorderHelperText(this.draggedElement, updated, targetIndex + 1)\n      );\n    }\n\n    this.reset();\n    this.dragRequestPending = false;\n  };\n\n  /**\n   * Moves the active node's clone to follow the pointer. The node that the clone intersects with (via hitTest) is\n   * the insert point for updated sorting */\n  private trackMove = (x: number, y: number) => {\n    if (!this.draggedElementClone) {\n      return;\n    }\n\n    if (this.orientation) {\n      x = x * orientationMap[this.orientation].x;\n      y = y * orientationMap[this.orientation].y;\n    }\n\n    writeTask(() => {\n      Object.assign(this.draggedElementClone.style, {\n        transform: `translate3d(${x}px, ${y}px, 0)`,\n      });\n    });\n\n    let target = this.hitTest(this.draggedElementClone, this.sortableNodes)[0];\n    let activeDropzone: HTMLElement;\n\n    if (this.dropzoneSelector && this.dropzoneActiveClass) {\n      readTask(() => {\n        activeDropzone = this.draggedElement.closest(this.dropzoneSelector);\n\n        writeTask(() => {\n          this.dropzoneNodes\n            .filter((dze) => dze !== activeDropzone)\n            .forEach((dze) => dze.classList.remove(this.dropzoneActiveClass));\n          activeDropzone.classList.add(this.dropzoneActiveClass);\n        });\n      });\n    }\n\n    // didn't find a target - let's test to see if we can use a drop-zone instead\n    if (!target && this.dropzoneNodes.length) {\n      target = this.hitTest(this.draggedElementClone, this.dropzoneNodes)[0];\n      if (this.draggedElement.closest(this.dropzoneSelector) === target) return;\n    }\n\n    if (\n      // if clone intersects with a valid target,\n      target &&\n      // other than its own origin,\n      target !== this.draggedElement &&\n      // and the target isn't currently animating, which causes false hit tests,\n      !this.isAnimating(target)\n    ) {\n      this.insertAtTarget(this.draggedElement, target);\n    }\n  };\n\n  /// Component lifecycle ///\n\n  constructor() {\n    this.handleTrack = this.handleTrack.bind(this);\n    this.handleKeydown = this.handleKeydown.bind(this);\n    this.refreshKeyboardHandles = this.refreshKeyboardHandles.bind(this);\n    this.refreshKeyboardHandles = nanoDebounce(\n      this.refreshKeyboardHandles,\n      500\n    );\n  }\n\n  connectedCallback() {\n    this.addEventHandlers();\n    this.refreshKeyboardHandles();\n    this.attachMutationObserver();\n\n    if (Build.isBrowser && !this.host.querySelector(`#${this.sortableId}`)) {\n      // inject a light-dom / a11y description that we can connect sortable items to\n      this.host.insertAdjacentHTML(\n        'beforeend',\n        `<div class=\"visually-hidden\" id=\"${this.sortableId}\">${this.helperText}</div>`\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    this.removeEventHandlers();\n    this.host.querySelector(`#${this.sortableId}`)?.remove();\n\n    if (this.mutationObserver) {\n      this.mutationObserver.disconnect();\n      this.mutationObserver = undefined;\n    }\n  }\n\n  render() {\n    return (\n      <Host class=\"nano-sortable\">\n        <div\n          class=\"sortable__live-region\"\n          aria-live=\"polite\"\n          aria-relevant=\"additions\"\n          aria-atomic=\"true\"\n          role=\"log\"\n          part=\"announcements\"\n        >\n          {this.ariaTextList.map((str) => (\n            <div>{str}</div>\n          ))}\n        </div>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/nano-spinner.cjs.entry.js

@@ -5,7 +5,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b6fa04fa.js');
+const index = require('./index-615cdb64.js');
+const renderer = require('./renderer-cd8b6098.js');
 
 const spinnerCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:inline-block;--base-color-rgb:var(--nano-indicator-rgb, 84 140 175);--indicator-color:var(\n      --nano-indicator-color,\n      rgb(var(--base-color-rgb) / 100%)\n    );--track-color:var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));--overlay-color:var(--nano-layer-overlay-light, rgb(255 255 255 / 70%))}.spinner{display:flex;flex-direction:column;align-items:center;justify-content:center}:host([overlay]:not([overlay=false])) .spinner{position:absolute;inset:0}:host([overlay]:not([overlay=false])) .spinner .spinner__loader,:host([overlay]:not([overlay=false])) .spinner .spinner__text{z-index:1}.spinner__overlay{background:var(--overlay-color);position:absolute;inset:0;z-index:0;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.spinner__loader{font-size:var(--spinner-scale, 1em)}.spinner__spin{display:block;margin:auto;inline-size:1em;block-size:1em;border-radius:50%;border:solid 0.1em var(--track-color);border-block-start-color:var(--indicator-color);border-inline-end-color:var(--indicator-color);border-inline-start-color:var(--indicator-color);animation:1s linear infinite spin}.spinner__dna{font-size:0.2286em;display:flex}.spinner__dnatrack{position:relative;padding-block:0;padding-inline:0.625em;block-size:4.375em;inline-size:0.625em;overflow:hidden}.spinner__dnatrack::before{content:\"\";position:absolute;inset-block-start:1.875em;inset-inline-start:50%;transform:translateX(-50%) translateZ(0);inline-size:0.0625em;inline-size:max(.0625em, 1px);block-size:0.625em;background:var(--track-color);animation:flex 1.5s linear infinite;transform-origin:center center}.spinner__dnatrack--2::before{animation:flex 1.5s -1.3s linear infinite}.spinner__dnatrack--3::before{animation:flex 1.5s -1.1s linear infinite}.spinner__dnatrack--4::before{animation:flex 1.5s -0.9s linear infinite}.spinner__dnatrack--5::before{animation:flex 1.5s -0.75s linear infinite}.spinner__dnadot{position:absolute;inline-size:0.5em;block-size:0.5em;border-radius:50%;background:var(--indicator-color);animation:rotate 1.5s linear infinite;transform-origin:center center;inset-inline-start:50%;transform:translateX(-50%) translateZ(0) translateY(0)}.spinner__dnadot--2{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--3{animation:rotate 1.5s -1.3s linear infinite}.spinner__dnadot--4{animation:rotate 1.5s -0.55s linear infinite}.spinner__dnadot--5{animation:rotate 1.5s -1.1s linear infinite}.spinner__dnadot--6{animation:rotate 1.5s -0.35s linear infinite}.spinner__dnadot--7{animation:rotate 1.5s -0.9s linear infinite}.spinner__dnadot--8{animation:rotate 1.5s -0.15s linear infinite}.spinner__dnadot--9{animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--10{animation:rotate 1.5s 0s linear infinite}.spinner__text{text-align:center;position:relative;margin-block-start:0.5em}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes rotate{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}25%{transform:translateX(-50%) translateY(1.875em) scale(2)}50%{transform:translateX(-50%) translateY(3.75em) scale(1)}75%{transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@keyframes flex{0%,100%{transform:translateX(-50%) scaleY(5)}25%{transform:translateX(-50%) scaleY(1)}50%{transform:translateX(-50%) scaleY(5)}75%{transform:translateX(-50%) scaleY(1)}}";
 const NanoSpinnerStyle0 = spinnerCss;
@@ -24,7 +25,7 @@ const Spinner = class {
         this.hasText = !!this.el.childNodes.length;
     }
     render() {
-        return (index.h("div", { key: 'bf3c9c701299ad688a9befe51ebb57a005af5eb1', class: "spinner", "aria-busy": "true", "aria-live": "polite" }, index.h("div", { key: 'd3ead911719c415b15ea0aefec292f8205f36f43', class: "spinner__loader" }, this.type === 'dna' && (index.h("div", { key: '69d9f55f9fc1c9b7a786c73f2b3773bbe5f04cfe', class: "spinner__dna" }, index.h("div", { key: '7e3cddb01607045969421bbff175138e2c7e2171', class: "spinner__dnatrack spinner__dnatrack--1" }, index.h("div", { key: '20552425058b7148cf7ab750330cd650bb653cd3', class: "spinner__dnadot spinner__dnadot--1" }), index.h("div", { key: '9d41cf549c34ecd465fba4e18f138b25df9f627c', class: "spinner__dnadot spinner__dnadot--2" })), index.h("div", { key: '5f69f3e654d9082aa06d72f37ad5b39094a923b6', class: "spinner__dnatrack spinner__dnatrack--2" }, index.h("div", { key: 'd7744a929bd439d7eae49f06f1b49b8dba527991', class: "spinner__dnadot spinner__dnadot--3" }), index.h("div", { key: 'df64b356ac817c45e43f80c5dc8bcb31b29ff2c0', class: "spinner__dnadot spinner__dnadot--4" })), index.h("div", { key: '462fc990493da3b6947a32eca06c63ec3797fa33', class: "spinner__dnatrack spinner__dnatrack--3" }, index.h("div", { key: '75e5beaceda3aa7eb2a1c0f2055257990d7da440', class: "spinner__dnadot spinner__dnadot--5" }), index.h("div", { key: '4387620a95ce780d9c47accbd4bf7b24bd0cf707', class: "spinner__dnadot spinner__dnadot--6" })), index.h("div", { key: 'edf7dee0f9c6fec893eb3721fa1e798fc5926523', class: "spinner__dnatrack spinner__dnatrack--4" }, index.h("div", { key: '3787f671edd1390969f56cca251a7d41b5db4a19', class: "spinner__dnadot spinner__dnadot--7" }), index.h("div", { key: '239a8fefdf0c875e8aa950b17966d31d399bcf54', class: "spinner__dnadot spinner__dnadot--8" })), index.h("div", { key: '0a713f87acb9b744f8566ee30c32a3f85ddfe6a1', class: "spinner__dnatrack spinner__dnatrack--5" }, index.h("div", { key: 'e4b28fd81404fee9e52a1dae5ddc2579f5d90dc5', class: "spinner__dnadot spinner__dnadot--9" }), index.h("div", { key: '3707286cd22fa5c2f24e1d2fcba0bcd500c69b86', class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && index.h("span", { key: '0caad855007af9134362e12c39be0fa79fc8f987', class: "spinner__spin" })), this.hasText && (index.h("div", { class: "spinner__text", key: "spinner-text" }, index.h("slot", { key: '724dce48bfb1f48c531138f67c39a1e8ea01ec79' }))), this.overlay && (index.h("div", { class: "spinner__overlay", key: "spinner-overlay" }))));
+        return (renderer.h(index.Host, { key: '650f22e1f076d786590389993562fb03d73b50d5', class: "nano-spinner" }, renderer.h("div", { key: '392afaac4ae23acdc247a7d4d5dea7166beaa6f4', class: "spinner", "aria-busy": "true", "aria-live": "polite" }, renderer.h("div", { key: '71699c822304d7bc40bc6510a373bd6da4905dc0', class: "spinner__loader" }, this.type === 'dna' && (renderer.h("div", { key: 'f3cf1be6056a3aacd9f08fb2ba20a0196a751912', class: "spinner__dna" }, renderer.h("div", { key: '9fbc4e80ce66f14751001ed7e9559e01649d1e7b', class: "spinner__dnatrack spinner__dnatrack--1" }, renderer.h("div", { key: '1242c2d9c928cf0e371133335ad05dc1e1426380', class: "spinner__dnadot spinner__dnadot--1" }), renderer.h("div", { key: '1dcfced70f0813796681ca5049fb50144d83e9ec', class: "spinner__dnadot spinner__dnadot--2" })), renderer.h("div", { key: 'cdb111d45ddbab07c9c0fed293bff499e306215e', class: "spinner__dnatrack spinner__dnatrack--2" }, renderer.h("div", { key: '326aa2074a4e16f7d6fddc41354672188c602f70', class: "spinner__dnadot spinner__dnadot--3" }), renderer.h("div", { key: 'd436ba81949ada55d5fe2356e663ba1b2f24f1fd', class: "spinner__dnadot spinner__dnadot--4" })), renderer.h("div", { key: 'ad2b9393afa3d2e9109fe7af696ab06001541344', class: "spinner__dnatrack spinner__dnatrack--3" }, renderer.h("div", { key: 'db18ff89bdfa702a733e817099ec03e550b7a967', class: "spinner__dnadot spinner__dnadot--5" }), renderer.h("div", { key: '812f51e0fdb34fae89c048fef6925feeed8e5d7f', class: "spinner__dnadot spinner__dnadot--6" })), renderer.h("div", { key: 'e53e41b6adc1fbf35ae07f7e0783b097d5a201db', class: "spinner__dnatrack spinner__dnatrack--4" }, renderer.h("div", { key: '0407e5a7234424094b1bc452a6f3bfe2c38ad7a7', class: "spinner__dnadot spinner__dnadot--7" }), renderer.h("div", { key: 'f9c9ee014b3cb7df2f6ca9e1f5ef6fc21a7b2c5c', class: "spinner__dnadot spinner__dnadot--8" })), renderer.h("div", { key: '3af97dda00e1ed9eaa738a2e0167f59916a69dbe', class: "spinner__dnatrack spinner__dnatrack--5" }, renderer.h("div", { key: '1f49f2d13828475a24dc318f3f28cca6973e01d5', class: "spinner__dnadot spinner__dnadot--9" }), renderer.h("div", { key: '5aee21e437ab1f35a35a1616e170ce1fed8d2811', class: "spinner__dnadot spinner__dnadot--10" })))), this.type === 'circle' && renderer.h("span", { key: '3e87f7a4aca4c55d750b6f01d14f83c8c9b232e8', class: "spinner__spin" })), this.hasText && (renderer.h("div", { class: "spinner__text", key: "spinner-text" }, renderer.h("slot", { key: '1e3e90c45121e16f4297ccf31d3809910d5721cf' }))), this.overlay && (renderer.h("div", { class: "spinner__overlay", key: "spinner-overlay" })))));
     }
 };
 Spinner.style = NanoSpinnerStyle0;

package/dist/cjs/nano-spinner.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nano-spinner.entry.cjs.js","mappings":";;;;;;;;;AAAA,MAAM,UAAU,GAAG,uiHAAuiH,CAAC;AAC3jH,0BAAe,UAAU;;MCiBZ,OAAO;;;;;IAET,OAAO,GAAY,KAAK,CAAC;;IAG1B,IAAI,GAAqB,QAAQ,CAAC;;IAGjB,OAAO,GAAY,KAAK,CAAC;IAElD,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC;KAC5C;IAED,MAAM;QACJ,QACEA,kEAAK,KAAK,EAAC,SAAS,eAAW,MAAM,eAAW,QAAQ,IACtDA,kEAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,IAAI,KAAK,KAAK,KAClBA,kEAAK,KAAK,EAAC,cAAc,IACvBA,kEAAK,KAAK,EAAC,wCAAwC,IACjDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,kEAAK,KAAK,EAAC,wCAAwC,IACjDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,kEAAK,KAAK,EAAC,wCAAwC,IACjDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,kEAAK,KAAK,EAAC,wCAAwC,IACjDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,kEAAK,KAAK,EAAC,wCAAwC,IACjDA,kEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,kEAAK,KAAK,EAAC,qCAAqC,GAAO,CACnD,CACF,CACP,EACA,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAIA,mEAAM,KAAK,EAAC,eAAe,GAAQ,CAC1D,EACL,IAAI,CAAC,OAAO,KACXA,iBAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAC,cAAc,IAC3CA,oEAAQ,CACJ,CACP,EACA,IAAI,CAAC,OAAO,KACXA,iBAAK,KAAK,EAAC,kBAAkB,EAAC,GAAG,EAAC,iBAAiB,GAAO,CAC3D,CACG,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/spinner/spinner.scss?tag=nano-spinner&encapsulation=shadow","src/components/spinner/spinner.tsx"],"sourcesContent":["@use '../../global/style/nano-theme/tokens';\n\n:host {\n  /**\n   * @prop --base-color-rgb: default #{tokens.$progress-indicator-color-rgb}\n   * @prop --indicator-color: default var(--nano-indicator-color, rgb(var(--base-color-rgb) / 10%));\n   * @prop --track-color: default var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));\n   * @prop --spinner-scale: optional scaling of the spinner. default contextual font-size\n   * @prop --overlay-color: #{tokens.$layer-overlay-light};\n   */\n\n  display: inline-block;\n\n  // --spinner-scale: 5em;\n  --base-color-rgb: #{tokens.$progress-indicator-color-rgb};\n  --indicator-color:\n    var(\n      --nano-indicator-color,\n      rgb(var(--base-color-rgb) / 100%)\n    );\n  --track-color: var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));\n  --overlay-color: #{tokens.$layer-overlay-light};\n}\n\n.spinner {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  :host([overlay]:not([overlay='false'])) & {\n    position: absolute;\n    inset: 0;\n\n    .spinner__loader,\n    .spinner__text {\n      z-index: 1;\n    }\n  }\n\n  &__overlay {\n    background: var(--overlay-color);\n    position: absolute;\n    inset: 0;\n    z-index: 0;\n    backdrop-filter: blur(#{tokens.$layer-overlay-blur});\n  }\n\n  &__loader {\n    font-size: var(--spinner-scale, 1em);\n  }\n\n  &__spin {\n    display: block;\n    margin: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    border-radius: 50%;\n    border: solid 0.1em var(--track-color);\n    border-block-start-color: var(--indicator-color);\n    border-inline-end-color: var(--indicator-color);\n    border-inline-start-color: var(--indicator-color);\n    animation: 1s linear infinite spin;\n  }\n\n  &__dna {\n    font-size: 0.2286em;\n    display: flex;\n  }\n\n  &__dnatrack {\n    position: relative;\n    padding-block: 0;\n    padding-inline: 0.625em;\n    block-size: 4.375em;\n    inline-size: 0.625em;\n    overflow: hidden;\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset-block-start: 1.875em;\n      inset-inline-start: 50%;\n      transform: translateX(-50%) translateZ(0);\n      inline-size: 0.0625em;\n      inline-size: #{'max(.0625em, 1px)'};\n      block-size: 0.625em;\n      background: var(--track-color);\n      animation: flex 1.5s linear infinite;\n      transform-origin: center center;\n    }\n\n    &--2::before {\n      animation: flex 1.5s -1.3s linear infinite;\n    }\n\n    &--3::before {\n      animation: flex 1.5s -1.1s linear infinite;\n    }\n\n    &--4::before {\n      animation: flex 1.5s -0.9s linear infinite;\n    }\n\n    &--5::before {\n      animation: flex 1.5s -0.75s linear infinite;\n    }\n  }\n\n  &__dnadot {\n    position: absolute;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: 50%;\n    background: var(--indicator-color);\n    animation: rotate 1.5s linear infinite;\n    transform-origin: center center;\n    inset-inline-start: 50%;\n    transform: translateX(-50%) translateZ(0) translateY(0);\n\n    &--2 {\n      animation: rotate 1.5s -0.75s linear infinite;\n    }\n\n    &--3 {\n      animation: rotate 1.5s -1.3s linear infinite;\n    }\n\n    &--4 {\n      animation: rotate 1.5s -0.55s linear infinite;\n    }\n\n    &--5 {\n      animation: rotate 1.5s -1.1s linear infinite;\n    }\n\n    &--6 {\n      animation: rotate 1.5s -0.35s linear infinite;\n    }\n\n    &--7 {\n      animation: rotate 1.5s -0.9s linear infinite;\n    }\n\n    &--8 {\n      animation: rotate 1.5s -0.15s linear infinite;\n    }\n\n    &--9 {\n      animation: rotate 1.5s -0.75s linear infinite;\n    }\n\n    &--10 {\n      animation: rotate 1.5s 0s linear infinite;\n    }\n  }\n\n  &__text {\n    text-align: center;\n    position: relative;\n    margin-block-start: 0.5em;\n  }\n\n  @keyframes spin {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes rotate {\n    0%,\n    100% {\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n\n    25% {\n      transform: translateX(-50%) translateY(1.875em) scale(2);\n    }\n\n    50% {\n      transform: translateX(-50%) translateY(3.75em) scale(1);\n    }\n\n    75% {\n      transform: translateX(-50%) translateY(1.875em) scale(0.3);\n    }\n  }\n\n  @keyframes flex {\n    0%,\n    100% {\n      transform: translateX(-50%) scaleY(5);\n    }\n\n    25% {\n      transform: translateX(-50%) scaleY(1);\n    }\n\n    50% {\n      transform: translateX(-50%) scaleY(5);\n    }\n\n    75% {\n      transform: translateX(-50%) scaleY(1);\n    }\n  }\n}\n","import {\n  Component,\n  h,\n  ComponentInterface,\n  Prop,\n  Element,\n  State,\n} from '@stencil/core';\n\n/**\n * Spinners are used to show the progress of an indeterminate operation.\n * @slot - Used for loading messages\n */\n@Component({\n  tag: 'nano-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner implements ComponentInterface {\n  @Element() el: HTMLNanoSpinnerElement;\n  @State() hasText: boolean = false;\n\n  /** The type of spinner animation */\n  @Prop() type: 'dna' | 'circle' = 'circle';\n\n  /** Displays absolutely with an overlay */\n  @Prop({ reflect: true }) overlay: boolean = false;\n\n  componentWillLoad() {\n    this.hasText = !!this.el.childNodes.length;\n  }\n\n  render() {\n    return (\n      <div class=\"spinner\" aria-busy=\"true\" aria-live=\"polite\">\n        <div class=\"spinner__loader\">\n          {this.type === 'dna' && (\n            <div class=\"spinner__dna\">\n              <div class=\"spinner__dnatrack spinner__dnatrack--1\">\n                <div class=\"spinner__dnadot spinner__dnadot--1\"></div>\n                <div class=\"spinner__dnadot spinner__dnadot--2\"></div>\n              </div>\n              <div class=\"spinner__dnatrack spinner__dnatrack--2\">\n                <div class=\"spinner__dnadot spinner__dnadot--3\"></div>\n                <div class=\"spinner__dnadot spinner__dnadot--4\"></div>\n              </div>\n              <div class=\"spinner__dnatrack spinner__dnatrack--3\">\n                <div class=\"spinner__dnadot spinner__dnadot--5\"></div>\n                <div class=\"spinner__dnadot spinner__dnadot--6\"></div>\n              </div>\n              <div class=\"spinner__dnatrack spinner__dnatrack--4\">\n                <div class=\"spinner__dnadot spinner__dnadot--7\"></div>\n                <div class=\"spinner__dnadot spinner__dnadot--8\"></div>\n              </div>\n              <div class=\"spinner__dnatrack spinner__dnatrack--5\">\n                <div class=\"spinner__dnadot spinner__dnadot--9\"></div>\n                <div class=\"spinner__dnadot spinner__dnadot--10\"></div>\n              </div>\n            </div>\n          )}\n          {this.type === 'circle' && <span class=\"spinner__spin\"></span>}\n        </div>\n        {this.hasText && (\n          <div class=\"spinner__text\" key=\"spinner-text\">\n            <slot />\n          </div>\n        )}\n        {this.overlay && (\n          <div class=\"spinner__overlay\" key=\"spinner-overlay\"></div>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"nano-spinner.entry.cjs.js","mappings":";;;;;;;;;;AAAA,MAAM,UAAU,GAAG,uiHAAuiH,CAAC;AAC3jH,0BAAe,UAAU;;MCkBZ,OAAO;;;;;IAET,OAAO,GAAY,KAAK,CAAC;;IAG1B,IAAI,GAAqB,QAAQ,CAAC;;IAGjB,OAAO,GAAY,KAAK,CAAC;IAElD,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC;KAC5C;IAED,MAAM;QACJ,QACEA,WAACC,UAAI,qDAAC,KAAK,EAAC,cAAc,IACxBD,qEAAK,KAAK,EAAC,SAAS,eAAW,MAAM,eAAW,QAAQ,IACtDA,qEAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,IAAI,KAAK,KAAK,KAClBA,qEAAK,KAAK,EAAC,cAAc,IACvBA,qEAAK,KAAK,EAAC,wCAAwC,IACjDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,qEAAK,KAAK,EAAC,wCAAwC,IACjDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,qEAAK,KAAK,EAAC,wCAAwC,IACjDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,qEAAK,KAAK,EAAC,wCAAwC,IACjDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,CAClD,EACNA,qEAAK,KAAK,EAAC,wCAAwC,IACjDA,qEAAK,KAAK,EAAC,oCAAoC,GAAO,EACtDA,qEAAK,KAAK,EAAC,qCAAqC,GAAO,CACnD,CACF,CACP,EACA,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAIA,sEAAM,KAAK,EAAC,eAAe,GAAQ,CAC1D,EACL,IAAI,CAAC,OAAO,KACXA,oBAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAC,cAAc,IAC3CA,uEAAQ,CACJ,CACP,EACA,IAAI,CAAC,OAAO,KACXA,oBAAK,KAAK,EAAC,kBAAkB,EAAC,GAAG,EAAC,iBAAiB,GAAO,CAC3D,CACG,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/spinner/spinner.scss?tag=nano-spinner&encapsulation=shadow","src/components/spinner/spinner.tsx"],"sourcesContent":["@use '../../global/style/nano-theme/tokens';\n\n:host {\n  /**\n   * @prop --base-color-rgb: default #{tokens.$progress-indicator-color-rgb}\n   * @prop --indicator-color: default var(--nano-indicator-color, rgb(var(--base-color-rgb) / 10%));\n   * @prop --track-color: default var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));\n   * @prop --spinner-scale: optional scaling of the spinner. default contextual font-size\n   * @prop --overlay-color: #{tokens.$layer-overlay-light};\n   */\n\n  display: inline-block;\n\n  // --spinner-scale: 5em;\n  --base-color-rgb: #{tokens.$progress-indicator-color-rgb};\n  --indicator-color:\n    var(\n      --nano-indicator-color,\n      rgb(var(--base-color-rgb) / 100%)\n    );\n  --track-color: var(--nano-track-color, rgb(var(--base-color-rgb) / 20%));\n  --overlay-color: #{tokens.$layer-overlay-light};\n}\n\n.spinner {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  :host([overlay]:not([overlay='false'])) & {\n    position: absolute;\n    inset: 0;\n\n    .spinner__loader,\n    .spinner__text {\n      z-index: 1;\n    }\n  }\n\n  &__overlay {\n    background: var(--overlay-color);\n    position: absolute;\n    inset: 0;\n    z-index: 0;\n    backdrop-filter: blur(#{tokens.$layer-overlay-blur});\n  }\n\n  &__loader {\n    font-size: var(--spinner-scale, 1em);\n  }\n\n  &__spin {\n    display: block;\n    margin: auto;\n    inline-size: 1em;\n    block-size: 1em;\n    border-radius: 50%;\n    border: solid 0.1em var(--track-color);\n    border-block-start-color: var(--indicator-color);\n    border-inline-end-color: var(--indicator-color);\n    border-inline-start-color: var(--indicator-color);\n    animation: 1s linear infinite spin;\n  }\n\n  &__dna {\n    font-size: 0.2286em;\n    display: flex;\n  }\n\n  &__dnatrack {\n    position: relative;\n    padding-block: 0;\n    padding-inline: 0.625em;\n    block-size: 4.375em;\n    inline-size: 0.625em;\n    overflow: hidden;\n\n    &::before {\n      content: '';\n      position: absolute;\n      inset-block-start: 1.875em;\n      inset-inline-start: 50%;\n      transform: translateX(-50%) translateZ(0);\n      inline-size: 0.0625em;\n      inline-size: #{'max(.0625em, 1px)'};\n      block-size: 0.625em;\n      background: var(--track-color);\n      animation: flex 1.5s linear infinite;\n      transform-origin: center center;\n    }\n\n    &--2::before {\n      animation: flex 1.5s -1.3s linear infinite;\n    }\n\n    &--3::before {\n      animation: flex 1.5s -1.1s linear infinite;\n    }\n\n    &--4::before {\n      animation: flex 1.5s -0.9s linear infinite;\n    }\n\n    &--5::before {\n      animation: flex 1.5s -0.75s linear infinite;\n    }\n  }\n\n  &__dnadot {\n    position: absolute;\n    inline-size: 0.5em;\n    block-size: 0.5em;\n    border-radius: 50%;\n    background: var(--indicator-color);\n    animation: rotate 1.5s linear infinite;\n    transform-origin: center center;\n    inset-inline-start: 50%;\n    transform: translateX(-50%) translateZ(0) translateY(0);\n\n    &--2 {\n      animation: rotate 1.5s -0.75s linear infinite;\n    }\n\n    &--3 {\n      animation: rotate 1.5s -1.3s linear infinite;\n    }\n\n    &--4 {\n      animation: rotate 1.5s -0.55s linear infinite;\n    }\n\n    &--5 {\n      animation: rotate 1.5s -1.1s linear infinite;\n    }\n\n    &--6 {\n      animation: rotate 1.5s -0.35s linear infinite;\n    }\n\n    &--7 {\n      animation: rotate 1.5s -0.9s linear infinite;\n    }\n\n    &--8 {\n      animation: rotate 1.5s -0.15s linear infinite;\n    }\n\n    &--9 {\n      animation: rotate 1.5s -0.75s linear infinite;\n    }\n\n    &--10 {\n      animation: rotate 1.5s 0s linear infinite;\n    }\n  }\n\n  &__text {\n    text-align: center;\n    position: relative;\n    margin-block-start: 0.5em;\n  }\n\n  @keyframes spin {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes rotate {\n    0%,\n    100% {\n      transform: translateX(-50%) translateY(0) scale(1);\n    }\n\n    25% {\n      transform: translateX(-50%) translateY(1.875em) scale(2);\n    }\n\n    50% {\n      transform: translateX(-50%) translateY(3.75em) scale(1);\n    }\n\n    75% {\n      transform: translateX(-50%) translateY(1.875em) scale(0.3);\n    }\n  }\n\n  @keyframes flex {\n    0%,\n    100% {\n      transform: translateX(-50%) scaleY(5);\n    }\n\n    25% {\n      transform: translateX(-50%) scaleY(1);\n    }\n\n    50% {\n      transform: translateX(-50%) scaleY(5);\n    }\n\n    75% {\n      transform: translateX(-50%) scaleY(1);\n    }\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Prop,\n  Element,\n  State,\n  Host,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\n\n/**\n * Spinners are used to show the progress of an indeterminate operation.\n * @slot - Used for loading messages\n */\n@Component({\n  tag: 'nano-spinner',\n  styleUrl: 'spinner.scss',\n  shadow: true,\n})\nexport class Spinner implements ComponentInterface {\n  @Element() el: HTMLNanoSpinnerElement;\n  @State() hasText: boolean = false;\n\n  /** The type of spinner animation */\n  @Prop() type: 'dna' | 'circle' = 'circle';\n\n  /** Displays absolutely with an overlay */\n  @Prop({ reflect: true }) overlay: boolean = false;\n\n  componentWillLoad() {\n    this.hasText = !!this.el.childNodes.length;\n  }\n\n  render() {\n    return (\n      <Host class=\"nano-spinner\">\n        <div class=\"spinner\" aria-busy=\"true\" aria-live=\"polite\">\n          <div class=\"spinner__loader\">\n            {this.type === 'dna' && (\n              <div class=\"spinner__dna\">\n                <div class=\"spinner__dnatrack spinner__dnatrack--1\">\n                  <div class=\"spinner__dnadot spinner__dnadot--1\"></div>\n                  <div class=\"spinner__dnadot spinner__dnadot--2\"></div>\n                </div>\n                <div class=\"spinner__dnatrack spinner__dnatrack--2\">\n                  <div class=\"spinner__dnadot spinner__dnadot--3\"></div>\n                  <div class=\"spinner__dnadot spinner__dnadot--4\"></div>\n                </div>\n                <div class=\"spinner__dnatrack spinner__dnatrack--3\">\n                  <div class=\"spinner__dnadot spinner__dnadot--5\"></div>\n                  <div class=\"spinner__dnadot spinner__dnadot--6\"></div>\n                </div>\n                <div class=\"spinner__dnatrack spinner__dnatrack--4\">\n                  <div class=\"spinner__dnadot spinner__dnadot--7\"></div>\n                  <div class=\"spinner__dnadot spinner__dnadot--8\"></div>\n                </div>\n                <div class=\"spinner__dnatrack spinner__dnatrack--5\">\n                  <div class=\"spinner__dnadot spinner__dnadot--9\"></div>\n                  <div class=\"spinner__dnadot spinner__dnadot--10\"></div>\n                </div>\n              </div>\n            )}\n            {this.type === 'circle' && <span class=\"spinner__spin\"></span>}\n          </div>\n          {this.hasText && (\n            <div class=\"spinner__text\" key=\"spinner-text\">\n              <slot />\n            </div>\n          )}\n          {this.overlay && (\n            <div class=\"spinner__overlay\" key=\"spinner-overlay\"></div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/nano-split-pane.cjs.entry.js

@@ -5,7 +5,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b6fa04fa.js');
+const index = require('./index-615cdb64.js');
+const renderer = require('./renderer-cd8b6098.js');
 const drag = require('./drag-c0a99167.js');
 const math = require('./math-ea9cdc71.js');
 const throttle = require('./throttle-46a497fb.js');
@@ -289,7 +290,7 @@ const SplitPane = class {
         else {
             styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;
         }
-        return (index.h(index.Host, { style: styles }, index.h("div", { part: "panel start", class: "start" }, index.h("slot", { name: "start" })), index.h("div", { part: "divider", class: "divider", tabindex: this.disabled ? undefined : '0', role: "separator", "aria-label": "Resize", onKeyDown: this.handleKeyDown, onMouseDown: this.handleDrag, onTouchStart: this.handleDrag }, index.h("slot", { name: "handle" }, !this.disabled && this.vertical ? (index.h("nano-icon", { slot: "handle", name: "solid/grip-lines" })) : (index.h("nano-icon", { slot: "handle", name: "solid/grip-lines-vertical" })))), index.h("div", { part: "panel end", class: "end" }, index.h("slot", { name: "end" }))));
+        return (renderer.h(index.Host, { style: styles, class: "nano-split-pane" }, renderer.h("div", { part: "panel start", class: "start" }, renderer.h("slot", { name: "start" })), renderer.h("div", { part: "divider", class: "divider", tabindex: this.disabled ? undefined : '0', role: "separator", "aria-label": "Resize", onKeyDown: this.handleKeyDown, onMouseDown: this.handleDrag, onTouchStart: this.handleDrag }, renderer.h("slot", { name: "handle" }, !this.disabled && this.vertical ? (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-lines" })) : (renderer.h("nano-icon", { slot: "handle", name: "solid/grip-lines-vertical" })))), renderer.h("div", { part: "panel end", class: "end" }, renderer.h("slot", { name: "end" }))));
     }
     static get watchers() { return {
         "position": ["handlePositionChange"],

package/dist/cjs/nano-split-pane.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"nano-split-pane.entry.cjs.js","mappings":";;;;;;;;;;;;AAAA,MAAM,YAAY,GAAG,80CAA80C,CAAC;AACp2C,4BAAe,YAAY;;MCgCd,SAAS;;IAEZ,sBAAsB,CAAS;IAC/B,EAAE,CAAiB;IACnB,WAAW,GAAG,KAAK,CAAC;IACpB,OAAO,GAAG,KAAK,CAAC;IAExB,IAAY,IAAI;QACd,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC5D,OAAO,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,KAAK,CAAC;KACvC;IAED,IAAY,aAAa;QACvB,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC;KAC5C;IACD,IAAY,aAAa,CAAC,EAAW;QACnC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;KAC1B;IACO,cAAc,GAAY,IAAI,CAAC;IAEvC;;;;QACE,IAAI,CAAC,oBAAoB,GAAGA,iBAAQ,CAClC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,EACpC,GAAG,CACJ,CAAC;KACH;;;;;IAMD,IACI,QAAQ;QACV,OAAO,IAAI,CAAC,SAAS,CAAC;KACvB;IACD,IAAI,QAAQ,CAAC,GAAW;;QAEtB,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QACtC,IAAI,KAAK,CAAC,GAAG,CAAC,IAAI,GAAG,KAAK,IAAI,CAAC,SAAS;YAAE,OAAO;QAEjD,IACE,IAAI,CAAC,aAAa;YAClB,IAAI,CAAC,iBAAiB,GAAG,CAAC;YAC1B,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,EACrB;YACA,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;YAC1B,OAAO;SACR;QACD,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC;KACtB;IACO,SAAS,CAAS;IAG1B,oBAAoB;QAClB,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACrE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC/D,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;KAC5B;;;;IAKwB,gBAAgB,CAAS;IAGlD,4BAA4B;QAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;KAChE;;IAGwB,QAAQ,GAAG,KAAK,CAAC;;IAGjB,QAAQ,GAAG,KAAK,CAAC;;;;;;IAOlC,OAAO,CAAmB;;;;;IAM1B,IAAI,CAAU;;IAGd,aAAa,GAAG,EAAE,CAAC;;IAGnB,iBAAiB,GAAG,GAAG,CAAC;;IAGvB,cAAc,CAAe;;IAG7B,YAAY,CAAuB;;;;;;IAQ5C,MAAM,qBAAqB,CAAC,KAAa;QACvC,OAAO,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;KACvC;;;;;;IAQD,MAAM,qBAAqB,CAAC,KAAa;QACvC,OAAO,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;KACvC;;IAIO,eAAe,CAAC,GAAW;QACjC,IAAI,IAAI,CAAC,WAAW;YAAE,OAAO;QAE7B,MAAM,QAAQ,GAAG,IAAI,CAAC,iBAAiB,CAAC;QACxC,MAAM,GAAG,GAAG,EAAE,CAAC;QACf,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC5B,MAAM,QAAQ,GAAG,GAAG,GAAG,KAAK,CAAC;QAE7B,IAAI,QAAQ,GAAG,KAAK,CAAC;QACrB,IAAI,IAAI,GAAG,CAAC,CAAC;QAEb,SAAS,aAAa,CAAC,CAAS,EAAE,CAAS,EAAE,CAAS,EAAE,CAAS;YAC/D,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;gBAAE,OAAO,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;;gBAC5C,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;SAChD;QAED,MAAM,EAAE,GAAG;YACT,IAAI,IAAI,CAAC,GAAG,GAAG,CAAC;YAChB,QAAQ,GAAG,aAAa,CAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;YAE1D,IACE,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,IAAI,GAAG;iBAC9B,GAAG,GAAG,KAAK,IAAI,QAAQ,IAAI,GAAG,CAAC,EAChC;gBACA,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;gBACpB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;gBAC1B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;gBACzB,OAAO;aACR;YACD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;YACzB,qBAAqB,CAAC,EAAE,CAAC,CAAC;SAC3B,CAAC;QAEF,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC3B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,qBAAqB,CAAC,EAAE,CAAC,CAAC;KAC3B;IAEO,kBAAkB,CAAC,KAAa;QACtC,OAAO,IAAI,CAAC,IAAI,IAAI,KAAK,GAAG,GAAG,CAAC,CAAC;KAClC;IAEO,kBAAkB,CAAC,KAAa;QACtC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,IAAI,GAAG,CAAC;KAClC;IAEO,QAAQ;QACd,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;YAAE,OAAO;QAEtC,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,IAAI,CAAC,EAAE,GAAG,IAAI,cAAc,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;QACxD,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC5B;IAEO,QAAQ;QACd,IAAI,CAAC,IAAI,CAAC,EAAE;YAAE,OAAO;QACrB,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,EAAE,GAAG,SAAS,CAAC;KACrB;;IAIO,UAAU,GAAG,CAAC,CAAQ;QAC5B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;;QAGD,CAAC,CAAC,cAAc,EAAE,CAAC;QAEnBC,SAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC;gBACX,IAAI,mBAAmB,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAC;gBAEhD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;;gBAG5C,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE;oBAC1B,mBAAmB,GAAG,IAAI,CAAC,IAAI,GAAG,mBAAmB,CAAC;iBACvD;;gBAGD,IAAI,IAAI,CAAC,IAAI,EAAE;oBACb,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;oBAEnC,KAAK,CAAC,OAAO,CAAC,CAAC,KAAK;wBAClB,IAAI,SAAiB,CAAC;wBAEtB,IAAI,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;4BACvB,SAAS,GAAG,IAAI,CAAC,IAAI,IAAI,UAAU,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,CAAC;yBACnD;6BAAM;4BACL,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC;yBAC/B;wBAED,IACE,mBAAmB,IAAI,SAAS,GAAG,IAAI,CAAC,aAAa;4BACrD,mBAAmB,IAAI,SAAS,GAAG,IAAI,CAAC,aAAa,EACrD;4BACA,mBAAmB,GAAG,SAAS,CAAC;yBACjC;qBACF,CAAC,CAAC;iBACJ;gBACD,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;gBAC3B,IAAI,CAAC,QAAQ,GAAGC,UAAK,CACnB,IAAI,CAAC,kBAAkB,CAAC,mBAAmB,CAAC,EAC5C,CAAC,EACD,GAAG,CACJ,CAAC;gBACF,qBAAqB,CAAC,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC,CAAC;aAC1D;SACF,CAAC,CAAC;KACJ,CAAC;IAEM,aAAa,GAAG,CAAC,KAAoB;QAC3C,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO;SACR;QAED,IACE;YACE,WAAW;YACX,YAAY;YACZ,SAAS;YACT,WAAW;YACX,MAAM;YACN,KAAK;SACN,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,EACrB;YACA,IAAI,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC;YAChC,MAAM,IAAI,GACR,CAAC,KAAK,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,KAAK,IAAI,CAAC,OAAO,KAAK,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;YAEhE,KAAK,CAAC,cAAc,EAAE,CAAC;YAEvB,IACE,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,IAAI,CAAC,QAAQ;iBAC3C,KAAK,CAAC,GAAG,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,CAAC,EAC1C;gBACA,WAAW,IAAI,IAAI,CAAC;aACrB;YAED,IACE,CAAC,KAAK,CAAC,GAAG,KAAK,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ;iBAC5C,KAAK,CAAC,GAAG,KAAK,WAAW,IAAI,IAAI,CAAC,QAAQ,CAAC,EAC5C;gBACA,WAAW,IAAI,IAAI,CAAC;aACrB;YAED,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE;gBACxB,WAAW,GAAG,IAAI,CAAC,OAAO,KAAK,KAAK,GAAG,GAAG,GAAG,CAAC,CAAC;aAChD;YAED,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE;gBACvB,WAAW,GAAG,IAAI,CAAC,OAAO,KAAK,KAAK,GAAG,CAAC,GAAG,GAAG,CAAC;aAChD;YAED,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;YAE3B,IAAI,CAAC,QAAQ,GAAGA,UAAK,CAAC,WAAW,EAAE,CAAC,EAAE,GAAG,CAAC,CAAC;YAC3C,qBAAqB,CAAC,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC,CAAC;SAC1D;KACF,CAAC;IAEM,YAAY,GAAG;QACrB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,WAAW;YAAE,OAAO;;QAG9C,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;YAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;YACrE,qBAAqB,CAAC,OAAO,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC,CAAC;SAC1D;KACF,CAAC;IAEF,gBAAgB;QACd,IAAI,IAAI,CAAC,gBAAgB;YAAE,IAAI,CAAC,4BAA4B,EAAE,CAAC;QAC/D,UAAU,CAAC,OAAO,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC;KACzC;IAED,iBAAiB;QACf,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACrE,IAAI,CAAC,QAAQ,EAAE,CAAC;KACjB;IAED,oBAAoB;QAClB,IAAI,CAAC,QAAQ,EAAE,CAAC;KACjB;IAED,kBAAkB;;;;QAIhB,qBAAqB,CAAC;YACpB,IAAI,OAAO,IAAI,CAAC,QAAQ,KAAK,WAAW,EAAE;gBACxC,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;aACpB;SACF,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,IAAI,OAAO,IAAI,CAAC,QAAQ,KAAK,WAAW;YAAE,OAAO;QACjD,MAAM,MAAM,GACV,EAAE,CAAC;QACL,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ;cAC9B,kBAAkB;cAClB,qBAAqB,CAAC;QAC1B,MAAM,OAAO,GAAG;;;;;YAKR,IAAI,CAAC,QAAQ;;;;;KAKpB,CAAC;QACF,MAAM,SAAS,GAAG,MAAM,CAAC;QAEzB,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE;YAC1B,MAAM,CAAC,YAAY,CAAC,GAAG,GAAG,SAAS,yBAAyB,OAAO,EAAE,CAAC;SACvE;aAAM;YACL,MAAM,CAAC,YAAY,CAAC,GAAG,GAAG,OAAO,yBAAyB,SAAS,EAAE,CAAC;SACvE;QAED,QACEC,QAACC,UAAI,IAAC,KAAK,EAAE,MAAM,IACjBD,iBAAK,IAAI,EAAC,aAAa,EAAC,KAAK,EAAC,OAAO,IACnCA,kBAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,EACNA,iBACE,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,SAAS,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,GAAG,EACzC,IAAI,EAAC,WAAW,gBACL,QAAQ,EACnB,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,WAAW,EAAE,IAAI,CAAC,UAAU,EAC5B,YAAY,EAAE,IAAI,CAAC,UAAU,IAE7BA,kBAAM,IAAI,EAAC,QAAQ,IAChB,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,IAC9BA,uBAAW,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,kBAAkB,GAAG,KAEnDA,uBAAW,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,2BAA2B,GAAG,CAC7D,CACI,CACH,EACNA,iBAAK,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,KAAK,IAC/BA,kBAAM,IAAI,EAAC,KAAK,GAAQ,CACpB,CACD,EACP;KACH;;;;;;;;;;","names":["debounce","drag","clamp","h","Host"],"sources":["src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/nano-theme/tokens';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get(tokens.$colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get(tokens.$colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get(tokens.$colors, lightgrey)};\n  --content-color: #{map.get(tokens.$colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{tokens.$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical]):not([disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  block-size: 100%;\n  inset-inline-start:\n    calc(\n      var(--divider-hit-area) / -2 + var(--divider-width) / 2\n    );\n  inline-size: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  inline-size: 100%;\n  inset-block-start:\n    calc(\n      var(--divider-hit-area) / -2 + var(--divider-width) / 2\n    );\n  block-size: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  h,\n  Method,\n} from '@stencil/core';\nimport { drag } from '../../utils/drag';\nimport { clamp } from '../../utils/math';\nimport { debounce } from '../../utils/throttle';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge\n   * as a percentage 0-100. Defaults to 50% of the container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (\n      this.shouldAnimate &&\n      this.animationDuration > 0 &&\n      !isNaN(this.position)\n    ) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  /** Emitted when the divider is being dragged. */\n  @Event() nanoDragging: EventEmitter<number>;\n\n  /**\n   * Utility to convert % to pixels\n   * @param value to convert\n   * @returns converted value as pixels\n   */\n  @Method()\n  async getPercentageToPixels(value: number) {\n    return this.percentageToPixels(value);\n  }\n\n  /**\n   * Utility to convert pixels to % (`position`)\n   * @param value to convert\n   * @returns converted value as a %\n   */\n  @Method()\n  async getPixelsToPercentage(value: number) {\n    return this.pixelsToPercentage(value);\n  }\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      requestAnimationFrame(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    requestAnimationFrame(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    if (!window['ResizeObserver']) return;\n\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, {\n      onMove: (x, y) => {\n        let newPositionInPixels = this.vertical ? y : x;\n\n        this.nanoDragging.emit(newPositionInPixels);\n\n        // Flip for end panels\n        if (this.primary === 'end') {\n          newPositionInPixels = this.size - newPositionInPixels;\n        }\n\n        // Check snap points\n        if (this.snap) {\n          const snaps = this.snap.split(' ');\n\n          snaps.forEach((value) => {\n            let snapPoint: number;\n\n            if (value.endsWith('%')) {\n              snapPoint = this.size * (parseFloat(value) / 100);\n            } else {\n              snapPoint = parseFloat(value);\n            }\n\n            if (\n              newPositionInPixels >= snapPoint - this.snapThreshold &&\n              newPositionInPixels <= snapPoint + this.snapThreshold\n            ) {\n              newPositionInPixels = snapPoint;\n            }\n          });\n        }\n        this.shouldAnimate = false;\n        this.position = clamp(\n          this.pixelsToPercentage(newPositionInPixels),\n          0,\n          100\n        );\n        requestAnimationFrame(() => (this.shouldAnimate = true));\n      },\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      requestAnimationFrame(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      requestAnimationFrame(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    requestAnimationFrame(() => {\n      if (typeof this.position === 'undefined') {\n        this.position = 50;\n      }\n    });\n  }\n\n  render() {\n    if (typeof this.position === 'undefined') return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles}>\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"nano-split-pane.entry.cjs.js","mappings":"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","names":["debounce","drag","clamp","h","Host"],"sources":["src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/nano-theme/tokens';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get(tokens.$colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get(tokens.$colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get(tokens.$colors, lightgrey)};\n  --content-color: #{map.get(tokens.$colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{tokens.$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical]):not([disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  block-size: 100%;\n  inset-inline-start:\n    calc(\n      var(--divider-hit-area) / -2 + var(--divider-width) / 2\n    );\n  inline-size: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  inline-size: 100%;\n  inset-block-start:\n    calc(\n      var(--divider-hit-area) / -2 + var(--divider-width) / 2\n    );\n  block-size: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  Method,\n} from '@stencil/core';\nimport { h } from '../../utils/renderer';\nimport { drag } from '../../utils/drag';\nimport { clamp } from '../../utils/math';\nimport { debounce } from '../../utils/throttle';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge\n   * as a percentage 0-100. Defaults to 50% of the container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (\n      this.shouldAnimate &&\n      this.animationDuration > 0 &&\n      !isNaN(this.position)\n    ) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  /** Emitted when the divider is being dragged. */\n  @Event() nanoDragging: EventEmitter<number>;\n\n  /**\n   * Utility to convert % to pixels\n   * @param value to convert\n   * @returns converted value as pixels\n   */\n  @Method()\n  async getPercentageToPixels(value: number) {\n    return this.percentageToPixels(value);\n  }\n\n  /**\n   * Utility to convert pixels to % (`position`)\n   * @param value to convert\n   * @returns converted value as a %\n   */\n  @Method()\n  async getPixelsToPercentage(value: number) {\n    return this.pixelsToPercentage(value);\n  }\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      requestAnimationFrame(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    requestAnimationFrame(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    if (!window['ResizeObserver']) return;\n\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, {\n      onMove: (x, y) => {\n        let newPositionInPixels = this.vertical ? y : x;\n\n        this.nanoDragging.emit(newPositionInPixels);\n\n        // Flip for end panels\n        if (this.primary === 'end') {\n          newPositionInPixels = this.size - newPositionInPixels;\n        }\n\n        // Check snap points\n        if (this.snap) {\n          const snaps = this.snap.split(' ');\n\n          snaps.forEach((value) => {\n            let snapPoint: number;\n\n            if (value.endsWith('%')) {\n              snapPoint = this.size * (parseFloat(value) / 100);\n            } else {\n              snapPoint = parseFloat(value);\n            }\n\n            if (\n              newPositionInPixels >= snapPoint - this.snapThreshold &&\n              newPositionInPixels <= snapPoint + this.snapThreshold\n            ) {\n              newPositionInPixels = snapPoint;\n            }\n          });\n        }\n        this.shouldAnimate = false;\n        this.position = clamp(\n          this.pixelsToPercentage(newPositionInPixels),\n          0,\n          100\n        );\n        requestAnimationFrame(() => (this.shouldAnimate = true));\n      },\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      requestAnimationFrame(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      requestAnimationFrame(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    requestAnimationFrame(() => {\n      if (typeof this.position === 'undefined') {\n        this.position = 50;\n      }\n    });\n  }\n\n  render() {\n    if (typeof this.position === 'undefined') return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles} class=\"nano-split-pane\">\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/nano-sticker.cjs.entry.js

@@ -5,10 +5,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b6fa04fa.js');
-const dom = require('./dom-756fcdac.js');
+const index = require('./index-615cdb64.js');
+const dom = require('./dom-b99a1aec.js');
 const throttle = require('./throttle-46a497fb.js');
 const scrollParent = require('./scroll-parent-798d9651.js');
+const renderer = require('./renderer-cd8b6098.js');
 
 const stickerCss = ":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-inline-size:100%}:host([sticky]){position:sticky;transition:0.3s ease transform;will-change:min-block-size}:host([sticky][stuck]){inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){transform:var(--bottom-hide)}:host([sticky][index=\"1\"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index=\"2\"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index=\"3\"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index=\"4\"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index=\"5\"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-inline-size:inherit;inline-size:100%}.sticker:not(.stuck){inline-size:auto !important}.sticker.sticky{transition:0.3s ease all;position:relative}:host([index=\"1\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index=\"2\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index=\"3\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index=\"4\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index=\"5\"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index);transform:translateY(0)}:host([placed-top]) .sticker.stuck{inset-block-start:0}:host([placed-bottom]) .sticker.stuck{inset-block-end:0}:host([placed-top]) .sticker.stuck.hide{transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{transform:var(--bottom-hide)}.sticker-content{display:flex;flex-wrap:wrap}";
 const NanoStickerStyle0 = stickerCss;
@@ -570,7 +571,7 @@ const Sticker = class {
         this.quietModeChange();
         this.listenForScrollParent = true;
         this.handleParentEvents(true);
-        this.stickerIndex = Array.from(this.scrollParent.querySelectorAll('nano-sticker'))
+        this.stickerIndex = Array.from(this.scrollParent.querySelectorAll(renderer.transformTag('nano-sticker')))
             .filter((sticker) => sticker.position === this.position)
             .findIndex((sticker) => sticker === this.host);
         this.setOffset();
@@ -612,12 +613,12 @@ const Sticker = class {
         this.hasBootstrapped = false;
     }
     render() {
-        return (index.h(index.Host, { key: '8446391b0510c305f2bead6865154636c329ab9f', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start') }, index.h("div", { key: '2465296095699dd336a3f0af5663e61b151807eb', class: {
+        return (renderer.h(index.Host, { key: 'b282e10cddb66120a13fcade77d1f2b554a20579', sticky: !this.isRootSticker && !this.stickToEle && this.isSticky, hide: this.hide && this.isStuck, siblings: this.stuckCounter, index: this.stickerIndex, stuck: this.isStuck && this.isSticky, "placed-bottom": this.positions.includes('bottom'), "placed-top": this.positions.includes('top'), "placed-end": this.positions.includes('end'), "placed-start": this.positions.includes('start'), class: "nano-sticker" }, renderer.h("div", { key: '33b8b8a569e522809bc9dd8efba10282728117a8', class: {
                 sticker: true,
                 sticky: this.isRootSticker && this.isSticky,
                 stuck: this.isStuck && this.isRootSticker && this.isSticky,
                 hide: this.isRootSticker && this.hide && this.isStuck,
-            }, ref: (div) => (this.sticker = div) }, index.h("div", { key: '351a73899ac20bb834f9610d4210c4860b3db836', class: "sticker-content", ref: (div) => (this.content = div) }, index.h("slot", { key: 'eacb03d1f9e5637b352bb28b80f60d50bf3b5ac1' })))));
+            }, ref: (div) => (this.sticker = div) }, renderer.h("div", { key: 'bc0584d28222ecaa8c362817ef3a71f618fe4796', class: "sticker-content", ref: (div) => (this.content = div) }, renderer.h("slot", { key: '12f6f6dca5d58ccdc446aee97cd5bee39f3c322e' })))));
     }
     static get watchers() { return {
         "trigger": ["updateTriggerOffset"],