@leaflink/stash 50.2.0 → 50.3.0

package/dist/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../src/components/Textarea/Textarea.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { computed, nextTick, onBeforeUnmount, onMounted, ref, useAttrs, useCssModule, useSlots, watch } from 'vue';\n\n  import Field, { type FieldProps } from '../Field/Field.vue';\n\n  export interface TextareaResizeOptions {\n    /**\n     * It will automatically scroll the page down when it reaches the bottom of the viewport/element\n     */\n    forceBrowserScroll: boolean;\n  }\n\n  export interface TextAreaProps extends FieldProps {\n    /**\n     * Value for the textarea element.\n     */\n    modelValue?: string;\n\n    /**\n     * Deprecated. Use :model-value or v-model instead of :value.\n     * @deprecated Use :model-value or v-model instead of :value.\n     */\n    value?: string | number | null;\n\n    /**\n     * Allow textarea to be resizable vertically.\n     * Alternatively if you want to disable automatic scroll when resizing, you can set `{ forceBrowserScroll: false }`\n     */\n    resize?: boolean | TextareaResizeOptions;\n\n    /**\n     * Placeholder text for the textarea element.\n     * **Note:** placeholders should be used to display examples; they should not be used as labels because they are not accessible as labels. If a real label cannot be used, use the `aria-label` attribute.\n     */\n    placeholder?: string;\n  }\n\n  defineOptions({\n    name: 'll-textarea',\n  });\n\n  const attrs = useAttrs();\n  const slots = useSlots();\n  const classes = useCssModule();\n\n  const props = withDefaults(defineProps<TextAreaProps>(), {\n    modelValue: '',\n    value: null,\n    resize: false,\n    placeholder: undefined,\n  });\n\n  const emits = defineEmits<{\n    /**\n     * Emitted when the model value changes.\n     */\n    (e: 'update:model-value', value: string): void;\n  }>();\n\n  const textareaRef = ref<HTMLTextAreaElement>();\n  const observer = ref<ResizeObserver>();\n  const isReadOnly = computed(() => props.isReadOnly || ('readonly' in attrs && attrs.readonly !== false));\n\n  const inputAttrs = computed(() => {\n    const allAttrs = { ...attrs };\n\n    delete allAttrs['data-test'];\n    delete allAttrs.class;\n\n    return allAttrs;\n  });\n\n  watch(\n    () => props.resize,\n    (v) => {\n      v ? setupResizeObserver() : observer.value?.disconnect();\n    },\n  );\n\n  const onInput = (event: Event) => {\n    emits('update:model-value', (event.target as HTMLTextAreaElement).value);\n  };\n\n  const setupResizeObserver = () => {\n    if (observer.value || !textareaRef.value) {\n      return;\n    }\n\n    // the ResizeObserver will be in charge to detect if page needs to scroll when resizing the component\n    observer.value = new ResizeObserver(([entry]) => {\n      const { target } = entry;\n      const parent = findParentScrollable(textareaRef.value as HTMLTextAreaElement) || document.documentElement;\n\n      const { scrollTop: scrollPosition } = parent;\n      let offsetDiff = 0;\n\n      // checks if the closest parent element scrollable is the document page\n      if (parent === document.documentElement) {\n        const { top, height } = getOffsetClipRect(target as HTMLElement);\n        const { innerHeight: viewportHeight } = window;\n\n        offsetDiff = Math.max(top + height - (viewportHeight + scrollPosition), 0);\n      } else {\n        const { top, height } = (target as HTMLElement).getBoundingClientRect();\n        const { top: parentTop } = parent.getBoundingClientRect();\n        const { offsetHeight: parentHeight } = parent;\n        const offsetTop = top - parentTop;\n\n        offsetDiff = Math.max(offsetTop + height - parentHeight, 0);\n      }\n\n      if (offsetDiff) {\n        requestAnimationFrame(() => {\n          parent.scrollTop = scrollPosition + offsetDiff;\n        });\n      }\n    });\n\n    observer.value.observe(textareaRef.value);\n  };\n\n  /**\n   * Retrieve the closest parent that has a scroll. Defaults to the document page.\n   */\n  const findParentScrollable = (el: HTMLElement): HTMLElement | null => {\n    const parent = el.parentElement as HTMLElement;\n    if (!parent) {\n      return null;\n    }\n\n    const { overflowY } = getComputedStyle(parent);\n    if (overflowY !== 'visible') {\n      return parent;\n    }\n\n    if (parent === document.body) {\n      return document.documentElement;\n    }\n\n    return findParentScrollable(parent);\n  };\n\n  /**\n   * Retrieve element absolute positioning relative to the page.\n   */\n  const getOffsetClipRect = (el: HTMLElement) => {\n    const { offsetWidth: width, offsetHeight: height } = el;\n\n    let left = 0;\n    let top = 0;\n\n    const findPos = function ({ offsetLeft, offsetTop, offsetParent }: HTMLElement) {\n      left += offsetLeft;\n      top += offsetTop;\n\n      if (offsetParent) {\n        findPos(offsetParent as HTMLElement);\n      }\n    };\n\n    findPos(el);\n\n    return {\n      top,\n      left,\n      width,\n      height,\n    };\n  };\n\n  onMounted(async () => {\n    if (props.value !== null) {\n      throw new Error('ll-input: use :model-value or v-model instead of :value.');\n    }\n\n    if (attrs.onInput) {\n      throw new Error('ll-input: use the @update:model-value event instead of @input');\n    }\n\n    if (\n      (typeof props.resize === 'boolean' && props.resize) ||\n      (props.resize as TextareaResizeOptions)?.forceBrowserScroll\n    ) {\n      await nextTick();\n      setupResizeObserver();\n    }\n  });\n\n  onBeforeUnmount(() => {\n    observer.value?.disconnect();\n  });\n</script>\n\n<template>\n  <Field v-bind=\"props\" class=\"stash-textarea\" :class=\"[classes.root]\" data-test=\"stash-textarea\">\n    <template #default=\"{ fieldId, hasError }\">\n      <textarea\n        :id=\"fieldId\"\n        ref=\"textareaRef\"\n        :class=\"[\n          classes.textarea,\n          { 'stash-textarea--error': hasError, 'tw-resize-y': props.resize, 'tw-resize-none': !props.resize },\n        ]\"\n        :value=\"props.modelValue\"\n        data-test=\"stash-textarea|textarea\"\n        :placeholder=\"props.placeholder\"\n        v-bind=\"inputAttrs\"\n        :disabled=\"props.disabled\"\n        :readonly=\"isReadOnly\"\n        @input=\"onInput\"\n      ></textarea>\n    </template>\n    <template v-if=\"slots.hint\" #hint>\n      <!-- @slot Hint content -->\n      <slot name=\"hint\"></slot>\n    </template>\n  </Field>\n</template>\n\n<style module>\n  .root {\n    position: relative;\n    width: 100%;\n  }\n\n  .textarea {\n    background: var(--color-white);\n    border: 1px solid;\n    border-color: var(--color-ice-500);\n    border-radius: theme('borderRadius.DEFAULT');\n    color: var(--color-ice-700);\n    display: block;\n    min-height: 100px;\n    outline: none;\n    padding: theme('spacing[1.5]');\n    width: 100%;\n\n    &:hover {\n      border-color: var(--color-ice-500);\n    }\n\n    &:focus,\n    &:active {\n      border-color: var(--color-blue-500);\n    }\n\n    &.stash-textarea--error {\n      border-color: var(--color-red-500);\n      color: var(--color-red-500);\n    }\n\n    &::placeholder {\n      color: var(--color-ice-500);\n      opacity: 1;\n    }\n\n    &[disabled] {\n      background-color: var(--color-ice-100);\n      border-color: var(--color-ice-500);\n      color: var(--color-ice-500);\n      pointer-events: none;\n    }\n\n    &[disabled]:active,\n    &[disabled]:focus {\n      box-shadow: none;\n    }\n\n    &[disabled]::placeholder {\n      text-transform: none;\n      color: var(--color-ice-500);\n    }\n\n    &[readonly] {\n      border-color: transparent;\n      background-color: transparent;\n      padding-left: 0;\n      padding-right: 0;\n      min-height: unset;\n    }\n  }\n</style>\n"],"names":["attrs","useAttrs","slots","useSlots","classes","useCssModule","props","__props","emits","__emit","textareaRef","ref","observer","isReadOnly","computed","inputAttrs","allAttrs","watch","v","setupResizeObserver","_a","onInput","event","entry","target","parent","findParentScrollable","scrollPosition","offsetDiff","top","height","getOffsetClipRect","viewportHeight","parentTop","parentHeight","offsetTop","el","overflowY","width","left","findPos","offsetLeft","offsetParent","onMounted","nextTick","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAyCE,UAAMA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,KAEVC,IAAQC,GAORC,IAAQC,GAORC,IAAcC,KACdC,IAAWD,KACXE,IAAaC,EAAS,MAAMR,EAAM,cAAe,cAAcN,KAASA,EAAM,aAAa,EAAM,GAEjGe,IAAaD,EAAS,MAAM;AAC1B,YAAAE,IAAW,EAAE,GAAGhB;AAEtB,oBAAOgB,EAAS,WAAW,GAC3B,OAAOA,EAAS,OAETA;AAAA,IAAA,CACR;AAED,IAAAC;AAAA,MACE,MAAMX,EAAM;AAAA,MACZ,CAACY,MAAM;;AACL,QAAAA,IAAIC,EAAoB,KAAIC,IAAAR,EAAS,UAAT,QAAAQ,EAAgB;AAAA,MAC9C;AAAA,IAAA;AAGI,UAAAC,IAAU,CAACC,MAAiB;AAC1B,MAAAd,EAAA,sBAAuBc,EAAM,OAA+B,KAAK;AAAA,IAAA,GAGnEH,IAAsB,MAAM;AAChC,MAAIP,EAAS,SAAS,CAACF,EAAY,UAKnCE,EAAS,QAAQ,IAAI,eAAe,CAAC,CAACW,CAAK,MAAM;AACzC,cAAA,EAAE,QAAAC,EAAW,IAAAD,GACbE,IAASC,EAAqBhB,EAAY,KAA4B,KAAK,SAAS,iBAEpF,EAAE,WAAWiB,EAAmB,IAAAF;AACtC,YAAIG,IAAa;AAGb,YAAAH,MAAW,SAAS,iBAAiB;AACvC,gBAAM,EAAE,KAAAI,GAAK,QAAAC,EAAO,IAAIC,EAAkBP,CAAqB,GACzD,EAAE,aAAaQ,EAAmB,IAAA;AAExC,UAAAJ,IAAa,KAAK,IAAIC,IAAMC,KAAUE,IAAiBL,IAAiB,CAAC;AAAA,QAAA,OACpE;AACL,gBAAM,EAAE,KAAAE,GAAK,QAAAC,EAAO,IAAKN,EAAuB,sBAAsB,GAChE,EAAE,KAAKS,EAAU,IAAIR,EAAO,sBAAsB,GAClD,EAAE,cAAcS,EAAiB,IAAAT,GACjCU,IAAYN,IAAMI;AAExB,UAAAL,IAAa,KAAK,IAAIO,IAAYL,IAASI,GAAc,CAAC;AAAA,QAC5D;AAEA,QAAIN,KACF,sBAAsB,MAAM;AAC1B,UAAAH,EAAO,YAAYE,IAAiBC;AAAA,QAAA,CACrC;AAAA,MACH,CACD,GAEQhB,EAAA,MAAM,QAAQF,EAAY,KAAK;AAAA,IAAA,GAMpCgB,IAAuB,CAACU,MAAwC;AACpE,YAAMX,IAASW,EAAG;AAClB,UAAI,CAACX;AACI,eAAA;AAGT,YAAM,EAAE,WAAAY,EAAA,IAAc,iBAAiBZ,CAAM;AAC7C,aAAIY,MAAc,YACTZ,IAGLA,MAAW,SAAS,OACf,SAAS,kBAGXC,EAAqBD,CAAM;AAAA,IAAA,GAM9BM,IAAoB,CAACK,MAAoB;AAC7C,YAAM,EAAE,aAAaE,GAAO,cAAcR,MAAWM;AAErD,UAAIG,IAAO,GACPV,IAAM;AAEV,YAAMW,IAAU,SAAU,EAAE,YAAAC,GAAY,WAAAN,GAAW,cAAAO,KAA6B;AACtE,QAAAH,KAAAE,GACDZ,KAAAM,GAEHO,KACFF,EAAQE,CAA2B;AAAA,MACrC;AAGF,aAAAF,EAAQJ,CAAE,GAEH;AAAA,QACL,KAAAP;AAAA,QACA,MAAAU;AAAA,QACA,OAAAD;AAAA,QACA,QAAAR;AAAA,MAAA;AAAA,IACF;AAGF,WAAAa,EAAU,YAAY;;AAChB,UAAArC,EAAM,UAAU;AACZ,cAAA,IAAI,MAAM,0DAA0D;AAG5E,UAAIN,EAAM;AACF,cAAA,IAAI,MAAM,+DAA+D;AAI9E,OAAA,OAAOM,EAAM,UAAW,aAAaA,EAAM,WAC3Cc,IAAAd,EAAM,WAAN,QAAAc,EAAwC,wBAEzC,MAAMwB,EAAS,GACKzB;IACtB,CACD,GAED0B,EAAgB,MAAM;;AACpB,OAAAzB,IAAAR,EAAS,UAAT,QAAAQ,EAAgB;AAAA,IAAW,CAC5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Textarea.js","sources":["../src/components/Textarea/Textarea.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { computed, nextTick, onBeforeUnmount, onMounted, ref, useAttrs, useCssModule, useSlots, watch } from 'vue';\n\n  import { FieldProps } from '../Field/Field.types';\n  import Field from '../Field/Field.vue';\n\n  export interface TextareaResizeOptions {\n    /**\n     * It will automatically scroll the page down when it reaches the bottom of the viewport/element\n     */\n    forceBrowserScroll: boolean;\n  }\n\n  export interface TextAreaProps extends FieldProps {\n    /**\n     * Value for the textarea element.\n     */\n    modelValue?: string;\n\n    /**\n     * Deprecated. Use :model-value or v-model instead of :value.\n     * @deprecated Use :model-value or v-model instead of :value.\n     */\n    value?: string | number | null;\n\n    /**\n     * Allow textarea to be resizable vertically.\n     * Alternatively if you want to disable automatic scroll when resizing, you can set `{ forceBrowserScroll: false }`\n     */\n    resize?: boolean | TextareaResizeOptions;\n\n    /**\n     * Placeholder text for the textarea element.\n     * **Note:** placeholders should be used to display examples; they should not be used as labels because they are not accessible as labels. If a real label cannot be used, use the `aria-label` attribute.\n     */\n    placeholder?: string;\n  }\n\n  defineOptions({\n    name: 'll-textarea',\n  });\n\n  const attrs = useAttrs();\n  const slots = useSlots();\n  const classes = useCssModule();\n\n  const props = withDefaults(defineProps<TextAreaProps>(), {\n    modelValue: '',\n    value: null,\n    resize: false,\n    placeholder: undefined,\n  });\n\n  const emits = defineEmits<{\n    /**\n     * Emitted when the model value changes.\n     */\n    (e: 'update:model-value', value: string): void;\n  }>();\n\n  const textareaRef = ref<HTMLTextAreaElement>();\n  const observer = ref<ResizeObserver>();\n  const isReadOnly = computed(() => props.isReadOnly || ('readonly' in attrs && attrs.readonly !== false));\n\n  const inputAttrs = computed(() => {\n    const allAttrs = { ...attrs };\n\n    delete allAttrs['data-test'];\n    delete allAttrs.class;\n\n    return allAttrs;\n  });\n\n  watch(\n    () => props.resize,\n    (v) => {\n      v ? setupResizeObserver() : observer.value?.disconnect();\n    },\n  );\n\n  const onInput = (event: Event) => {\n    emits('update:model-value', (event.target as HTMLTextAreaElement).value);\n  };\n\n  const setupResizeObserver = () => {\n    if (observer.value || !textareaRef.value) {\n      return;\n    }\n\n    // the ResizeObserver will be in charge to detect if page needs to scroll when resizing the component\n    observer.value = new ResizeObserver(([entry]) => {\n      const { target } = entry;\n      const parent = findParentScrollable(textareaRef.value as HTMLTextAreaElement) || document.documentElement;\n\n      const { scrollTop: scrollPosition } = parent;\n      let offsetDiff = 0;\n\n      // checks if the closest parent element scrollable is the document page\n      if (parent === document.documentElement) {\n        const { top, height } = getOffsetClipRect(target as HTMLElement);\n        const { innerHeight: viewportHeight } = window;\n\n        offsetDiff = Math.max(top + height - (viewportHeight + scrollPosition), 0);\n      } else {\n        const { top, height } = (target as HTMLElement).getBoundingClientRect();\n        const { top: parentTop } = parent.getBoundingClientRect();\n        const { offsetHeight: parentHeight } = parent;\n        const offsetTop = top - parentTop;\n\n        offsetDiff = Math.max(offsetTop + height - parentHeight, 0);\n      }\n\n      if (offsetDiff) {\n        requestAnimationFrame(() => {\n          parent.scrollTop = scrollPosition + offsetDiff;\n        });\n      }\n    });\n\n    observer.value.observe(textareaRef.value);\n  };\n\n  /**\n   * Retrieve the closest parent that has a scroll. Defaults to the document page.\n   */\n  const findParentScrollable = (el: HTMLElement): HTMLElement | null => {\n    const parent = el.parentElement as HTMLElement;\n    if (!parent) {\n      return null;\n    }\n\n    const { overflowY } = getComputedStyle(parent);\n    if (overflowY !== 'visible') {\n      return parent;\n    }\n\n    if (parent === document.body) {\n      return document.documentElement;\n    }\n\n    return findParentScrollable(parent);\n  };\n\n  /**\n   * Retrieve element absolute positioning relative to the page.\n   */\n  const getOffsetClipRect = (el: HTMLElement) => {\n    const { offsetWidth: width, offsetHeight: height } = el;\n\n    let left = 0;\n    let top = 0;\n\n    const findPos = function ({ offsetLeft, offsetTop, offsetParent }: HTMLElement) {\n      left += offsetLeft;\n      top += offsetTop;\n\n      if (offsetParent) {\n        findPos(offsetParent as HTMLElement);\n      }\n    };\n\n    findPos(el);\n\n    return {\n      top,\n      left,\n      width,\n      height,\n    };\n  };\n\n  onMounted(async () => {\n    if (props.value !== null) {\n      throw new Error('ll-input: use :model-value or v-model instead of :value.');\n    }\n\n    if (attrs.onInput) {\n      throw new Error('ll-input: use the @update:model-value event instead of @input');\n    }\n\n    if (\n      (typeof props.resize === 'boolean' && props.resize) ||\n      (props.resize as TextareaResizeOptions)?.forceBrowserScroll\n    ) {\n      await nextTick();\n      setupResizeObserver();\n    }\n  });\n\n  onBeforeUnmount(() => {\n    observer.value?.disconnect();\n  });\n</script>\n\n<template>\n  <Field v-bind=\"props\" class=\"stash-textarea\" :class=\"[classes.root]\" data-test=\"stash-textarea\">\n    <template #default=\"{ fieldId, hasError }\">\n      <textarea\n        :id=\"fieldId\"\n        ref=\"textareaRef\"\n        :class=\"[\n          classes.textarea,\n          { 'stash-textarea--error': hasError, 'tw-resize-y': props.resize, 'tw-resize-none': !props.resize },\n        ]\"\n        :value=\"props.modelValue\"\n        data-test=\"stash-textarea|textarea\"\n        :placeholder=\"props.placeholder\"\n        v-bind=\"inputAttrs\"\n        :disabled=\"props.disabled\"\n        :readonly=\"isReadOnly\"\n        @input=\"onInput\"\n      ></textarea>\n    </template>\n    <template v-if=\"slots.hint\" #hint>\n      <!-- @slot Hint content -->\n      <slot name=\"hint\"></slot>\n    </template>\n  </Field>\n</template>\n\n<style module>\n  .root {\n    position: relative;\n    width: 100%;\n  }\n\n  .textarea {\n    background: var(--color-white);\n    border: 1px solid;\n    border-color: var(--color-ice-500);\n    border-radius: theme('borderRadius.DEFAULT');\n    color: var(--color-ice-700);\n    display: block;\n    min-height: 100px;\n    outline: none;\n    padding: theme('spacing[1.5]');\n    width: 100%;\n\n    &:hover {\n      border-color: var(--color-ice-500);\n    }\n\n    &:focus,\n    &:active {\n      border-color: var(--color-blue-500);\n    }\n\n    &.stash-textarea--error {\n      border-color: var(--color-red-500);\n      color: var(--color-red-500);\n    }\n\n    &::placeholder {\n      color: var(--color-ice-500);\n      opacity: 1;\n    }\n\n    &[disabled] {\n      background-color: var(--color-ice-100);\n      border-color: var(--color-ice-500);\n      color: var(--color-ice-500);\n      pointer-events: none;\n    }\n\n    &[disabled]:active,\n    &[disabled]:focus {\n      box-shadow: none;\n    }\n\n    &[disabled]::placeholder {\n      text-transform: none;\n      color: var(--color-ice-500);\n    }\n\n    &[readonly] {\n      border-color: transparent;\n      background-color: transparent;\n      padding-left: 0;\n      padding-right: 0;\n      min-height: unset;\n    }\n  }\n</style>\n"],"names":["attrs","useAttrs","slots","useSlots","classes","useCssModule","props","__props","emits","__emit","textareaRef","ref","observer","isReadOnly","computed","inputAttrs","allAttrs","watch","v","setupResizeObserver","_a","onInput","event","entry","target","parent","findParentScrollable","scrollPosition","offsetDiff","top","height","getOffsetClipRect","viewportHeight","parentTop","parentHeight","offsetTop","el","overflowY","width","left","findPos","offsetLeft","offsetParent","onMounted","nextTick","onBeforeUnmount"],"mappings":"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"}

package/dist/Tooltip.js

@@ -1,131 +1,10 @@
-import { getCurrentScope as C, onScopeDispose as D, unref as M, ref as p, watch as $, defineComponent as F, computed as A, openBlock as Y, createElementBlock as P, createElementVNode as X, renderSlot as E, createBlock as j, Teleport as I, normalizeStyle as k, createTextVNode as R, toDisplayString as V } from "vue";
-import { u as z, a as L, f as N, o as G, b as U } from "./floating-ui.vue-BmfQDqE-.js";
-function q(e) {
-  return C() ? (D(e), !0) : !1;
-}
-function B(e) {
-  return typeof e == "function" ? e() : M(e);
-}
-const J = typeof window < "u" && typeof document < "u";
-typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
-const K = Object.prototype.toString, Q = (e) => K.call(e) === "[object Object]", Z = () => {
-}, W = J ? window : void 0;
-function H(e) {
-  var s;
-  const n = B(e);
-  return (s = n == null ? void 0 : n.$el) != null ? s : n;
-}
-function b(...e) {
-  let s, n, l, i;
-  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, l, i] = e, s = W) : [s, n, l, i] = e, !s)
-    return Z;
-  Array.isArray(n) || (n = [n]), Array.isArray(l) || (l = [l]);
-  const c = [], f = () => {
-    c.forEach((o) => o()), c.length = 0;
-  }, y = (o, r, u, a) => (o.addEventListener(r, u, a), () => o.removeEventListener(r, u, a)), d = $(
-    () => [H(s), B(i)],
-    ([o, r]) => {
-      if (f(), !o)
-        return;
-      const u = Q(r) ? { ...r } : r;
-      c.push(
-        ...n.flatMap((a) => l.map((m) => y(o, a, m, u)))
-      );
-    },
-    { immediate: !0, flush: "post" }
-  ), w = () => {
-    d(), f();
-  };
-  return q(w), w;
-}
-const ee = {
-  page: (e) => [e.pageX, e.pageY],
-  client: (e) => [e.clientX, e.clientY],
-  screen: (e) => [e.screenX, e.screenY],
-  movement: (e) => e instanceof Touch ? null : [e.movementX, e.movementY]
-};
-function te(e = {}) {
-  const {
-    type: s = "page",
-    touch: n = !0,
-    resetOnTouchEnds: l = !1,
-    initialValue: i = { x: 0, y: 0 },
-    window: c = W,
-    target: f = c,
-    scroll: y = !0,
-    eventFilter: d
-  } = e;
-  let w = null;
-  const o = p(i.x), r = p(i.y), u = p(null), a = typeof s == "function" ? s : ee[s], m = (t) => {
-    const h = a(t);
-    w = t, h && ([o.value, r.value] = h, u.value = "mouse");
-  }, v = (t) => {
-    if (t.touches.length > 0) {
-      const h = a(t.touches[0]);
-      h && ([o.value, r.value] = h, u.value = "touch");
-    }
-  }, g = () => {
-    if (!w || !c)
-      return;
-    const t = a(w);
-    w instanceof MouseEvent && t && (o.value = t[0] + c.scrollX, r.value = t[1] + c.scrollY);
-  }, x = () => {
-    o.value = i.x, r.value = i.y;
-  }, S = d ? (t) => d(() => m(t), {}) : (t) => m(t), O = d ? (t) => d(() => v(t), {}) : (t) => v(t), _ = d ? () => d(() => g(), {}) : () => g();
-  if (f) {
-    const t = { passive: !0 };
-    b(f, ["mousemove", "dragover"], S, t), n && s !== "movement" && (b(f, ["touchstart", "touchmove"], O, t), l && b(f, "touchend", x, t)), y && s === "page" && b(c, "scroll", _, { passive: !0 });
-  }
-  return {
-    x: o,
-    y: r,
-    sourceType: u
-  };
-}
-function oe(e, s = {}) {
-  const {
-    handleOutside: n = !0,
-    window: l = W
-  } = s, i = s.type || "page", { x: c, y: f, sourceType: y } = te(s), d = p(e ?? (l == null ? void 0 : l.document.body)), w = p(0), o = p(0), r = p(0), u = p(0), a = p(0), m = p(0), v = p(!0);
-  let g = () => {
-  };
-  return l && (g = $(
-    [d, c, f],
-    () => {
-      const x = H(d);
-      if (!x || !(x instanceof Element))
-        return;
-      const {
-        left: S,
-        top: O,
-        width: _,
-        height: t
-      } = x.getBoundingClientRect();
-      r.value = S + (i === "page" ? l.pageXOffset : 0), u.value = O + (i === "page" ? l.pageYOffset : 0), a.value = t, m.value = _;
-      const h = c.value - r.value, T = f.value - u.value;
-      v.value = _ === 0 || t === 0 || h < 0 || T < 0 || h > _ || T > t, (n || !v.value) && (w.value = h, o.value = T);
-    },
-    { immediate: !0 }
-  ), b(document, "mouseleave", () => {
-    v.value = !0;
-  })), {
-    x: c,
-    y: f,
-    sourceType: y,
-    elementX: w,
-    elementY: o,
-    elementPositionX: r,
-    elementPositionY: u,
-    elementHeight: a,
-    elementWidth: m,
-    isOutside: v,
-    stop: g
-  };
-}
-const ne = {
+import { defineComponent as g, ref as n, computed as r, openBlock as d, createElementBlock as S, createElementVNode as i, renderSlot as l, createBlock as T, Teleport as E, normalizeStyle as u, unref as $, createTextVNode as k, toDisplayString as O } from "vue";
+import { u as A, a as B, f as F, o as D, b as I } from "./floating-ui.vue-BmfQDqE-.js";
+import { u as P } from "./index-Ck3Dl09q.js";
+const z = {
   ref: "wrapper",
   class: "stash-tooltip__wrapper tw-relative tw-inline-flex tw-h-fit tw-w-fit"
-}, se = 6, le = 12, ce = /* @__PURE__ */ F({
+}, M = 6, N = 12, X = /* @__PURE__ */ g({
   __name: "Tooltip",
   props: {
     disableTeleport: { type: Boolean, default: !1 },
@@ -134,59 +13,59 @@ const ne = {
     teleportTo: { default: "#stash-menus-mount-node" },
     text: { default: "" }
   },
-  setup(e) {
-    const s = {
+  setup(f) {
+    const m = {
       top: "bottom",
       right: "left",
       bottom: "top",
       left: "right"
-    }, n = e, l = p(null), i = p(null), c = p(null), { isOutside: f } = oe(l), y = A(() => !f.value || n.isOpen), d = A(() => n.side), { floatingStyles: w, middlewareData: o, placement: r } = z(l, c, {
-      whileElementsMounted: L,
-      placement: d,
-      middleware: [N(), G(le), U({ element: i })]
-    }), u = A(() => {
-      var m, v;
-      const a = s[r.value];
+    }, e = f, a = n(null), p = n(null), c = n(null), { isOutside: h } = P(a), _ = r(() => !h.value || e.isOpen), y = r(() => e.side), { floatingStyles: x, middlewareData: o, placement: v } = A(a, c, {
+      whileElementsMounted: B,
+      placement: y,
+      middleware: [F(), D(N), I({ element: p })]
+    }), b = r(() => {
+      var s, w;
+      const t = m[v.value];
       return {
-        left: ((m = o.value.arrow) == null ? void 0 : m.x) != null ? `${o.value.arrow.x}px` : "",
-        top: ((v = o.value.arrow) == null ? void 0 : v.y) != null ? `${o.value.arrow.y}px` : "",
-        [a]: `-${se}px`
+        left: ((s = o.value.arrow) == null ? void 0 : s.x) != null ? `${o.value.arrow.x}px` : "",
+        top: ((w = o.value.arrow) == null ? void 0 : w.y) != null ? `${o.value.arrow.y}px` : "",
+        [t]: `-${M}px`
       };
     });
-    return (a, m) => (Y(), P("div", ne, [
-      X("span", {
+    return (t, s) => (d(), S("div", z, [
+      i("span", {
         ref_key: "anchor",
-        ref: l,
+        ref: a,
         "data-test": "stash-tooltip|anchor",
         class: "stash-tooltip__anchor"
       }, [
-        E(a.$slots, "default")
+        l(t.$slots, "default")
       ], 512),
-      (Y(), j(I, {
-        to: n.teleportTo,
-        disabled: n.disableTeleport
+      (d(), T(E, {
+        to: e.teleportTo,
+        disabled: e.disableTeleport
       }, [
-        X("div", {
+        i("div", {
           ref_key: "tooltip",
           ref: c,
           "data-test": "stash-tooltip",
           class: "stash-tooltip tw-pointer-events-none tw-z-screen tw-flex tw-w-[148px] tw-flex-col tw-items-center tw-whitespace-normal tw-rounded tw-bg-ice-900 tw-p-3 tw-text-center tw-text-xs tw-text-white tw-opacity-0 tw-shadow tw-transition-opacity",
           role: "tooltip",
-          style: k({
-            ...M(w),
-            opacity: y.value ? 0.95 : 0
+          style: u({
+            ...$(x),
+            opacity: _.value ? 0.95 : 0
           })
         }, [
-          E(a.$slots, "icon"),
-          E(a.$slots, "content", {}, () => [
-            R(V(n.text), 1)
+          l(t.$slots, "icon"),
+          l(t.$slots, "content", {}, () => [
+            k(O(e.text), 1)
           ]),
-          E(a.$slots, "secondaryIcon"),
-          X("div", {
+          l(t.$slots, "secondaryIcon"),
+          i("div", {
             ref_key: "floatingArrow",
-            ref: i,
+            ref: p,
             class: "stash-tooltip__arrow tw-absolute tw-z-behind tw-h-[12px] tw-w-[12px] tw-rotate-45 tw-bg-ice-900",
-            style: k(u.value)
+            style: u(b.value)
           }, null, 4)
         ], 4)
       ], 8, ["to", "disabled"]))
@@ -194,6 +73,6 @@ const ne = {
   }
 });
 export {
-  ce as default
+  X as default
 };
 //# sourceMappingURL=Tooltip.js.map