@rotki/ui-library 2.8.0 → 2.8.2

package/dist/components/overlays/dialog/RuiDialog.vue2.js

@@ -0,0 +1,172 @@
+import { transformPropsUnit, getRootAttrs, getNonRootAttrs } from "../../../utils/helpers.js";
+import { defineComponent, toRefs, ref, nextTick, watch, computed, createElementBlock, openBlock, normalizeProps, guardReactiveProps, unref, renderSlot, createBlock, Teleport, createCommentVNode, mergeProps, withKeys, withModifiers, createVNode, Transition, withCtx, normalizeClass, normalizeStyle } from "vue";
+import { watchImmediate } from "@vueuse/core";
+import { set, get } from "@vueuse/shared";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "RuiDialog",
+    inheritAttrs: false
+  },
+  __name: "RuiDialog",
+  props: {
+    modelValue: { type: Boolean, default: false },
+    persistent: { type: Boolean, default: false },
+    width: { default: "98%" },
+    maxWidth: {},
+    bottomSheet: { type: Boolean, default: false },
+    contentClass: { default: "" },
+    zIndex: { default: 9999 }
+  },
+  emits: ["update:model-value", "closed", "click:outside", "click:esc"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const {
+      modelValue,
+      width,
+      maxWidth,
+      bottomSheet
+    } = toRefs(props);
+    const internalValue = ref(false);
+    const isOpen = ref(false);
+    watchImmediate(modelValue, (value) => {
+      nextTick(() => {
+        set(internalValue, value);
+      });
+    });
+    watch(internalValue, (value) => {
+      if (value) {
+        nextTick(() => {
+          set(isOpen, value);
+        });
+      } else {
+        setTimeout(() => {
+          set(isOpen, value);
+        }, 100);
+      }
+    });
+    function onUpdateModelValue(value) {
+      emit("update:model-value", value);
+      if (!value)
+        emit("closed");
+    }
+    watch(isOpen, (isOpen2) => {
+      if (isOpen2) {
+        onUpdateModelValue(isOpen2);
+        set(internalValue, isOpen2);
+      } else {
+        setTimeout(() => {
+          onUpdateModelValue(isOpen2);
+          set(internalValue, isOpen2);
+        }, 100);
+      }
+    });
+    function close() {
+      set(isOpen, false);
+    }
+    const style = computed(() => ({
+      width: transformPropsUnit(get(width)),
+      maxWidth: transformPropsUnit(get(maxWidth))
+    }));
+    const contentRef = ref();
+    watch(contentRef, (contentRef2) => {
+      if (contentRef2) {
+        nextTick(() => {
+          contentRef2.focus();
+        });
+      }
+    });
+    const dialogAttrs = computed(() => ({
+      onClick: () => {
+        const newValue = !get(internalValue);
+        set(internalValue, newValue);
+        onUpdateModelValue(newValue);
+      }
+    }));
+    const contentTransition = computed(() => {
+      if (!get(bottomSheet)) {
+        return {
+          enterFromClass: "opacity-0 scale-75",
+          enterActiveClass: "ease-out duration-150",
+          enterToClass: "opacity-100 scale-100",
+          leaveFromClass: "opacity-100 scale-100",
+          leaveActiveClass: "ease-in duration-100",
+          leaveToClass: "opacity-0 scale-75"
+        };
+      }
+      return {
+        enterFromClass: "translate-y-full",
+        enterActiveClass: "ease-out duration-150",
+        enterToClass: "translate-y-0",
+        leaveFromClass: "translate-y-0",
+        leaveActiveClass: "ease-in duration-100",
+        leaveToClass: "translate-y-full"
+      };
+    });
+    function onEscClick() {
+      if (!props.persistent) {
+        close();
+      }
+      emit("click:esc");
+    }
+    function onClickOutside() {
+      if (!props.persistent) {
+        close();
+      }
+      emit("click:outside");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(("getRootAttrs" in _ctx ? _ctx.getRootAttrs : unref(getRootAttrs))(_ctx.$attrs))), [
+        renderSlot(_ctx.$slots, "activator", normalizeProps(guardReactiveProps({ attrs: unref(dialogAttrs), isOpen: unref(isOpen) }))),
+        (openBlock(), createBlock(Teleport, { to: "body" }, [
+          unref(isOpen) || unref(internalValue) ? (openBlock(), createElementBlock("div", mergeProps({
+            key: 0,
+            class: _ctx.$style.wrapper,
+            style: { zIndex: __props.zIndex },
+            role: "dialog",
+            tabindex: "0"
+          }, ("getNonRootAttrs" in _ctx ? _ctx.getNonRootAttrs : unref(getNonRootAttrs))(_ctx.$attrs), {
+            onKeydown: _cache[1] || (_cache[1] = withKeys(withModifiers(($event) => onEscClick(), ["stop"]), ["esc"]))
+          }), [
+            createVNode(Transition, {
+              "enter-from-class": "opacity-0",
+              "enter-active-class": "ease-out duration-150",
+              "enter-to-class": "opacity-100",
+              "leave-from-class": "opacity-100",
+              "leave-active-class": "ease-in duration-100",
+              "leave-to-class": "opacity-0"
+            }, {
+              default: withCtx(() => [
+                unref(isOpen) && unref(internalValue) ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(_ctx.$style.overlay),
+                  onClick: _cache[0] || (_cache[0] = withModifiers(($event) => onClickOutside(), ["stop"]))
+                }, null, 2)) : createCommentVNode("", true)
+              ]),
+              _: 1
+            }),
+            createVNode(Transition, normalizeProps(guardReactiveProps(unref(contentTransition))), {
+              default: withCtx(() => [
+                unref(isOpen) && unref(internalValue) ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  ref_key: "contentRef",
+                  ref: contentRef,
+                  style: normalizeStyle(unref(style)),
+                  tabindex: "0",
+                  class: normalizeClass([_ctx.$style.content, __props.contentClass, { [_ctx.$style.center]: !unref(bottomSheet) }])
+                }, [
+                  renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ isOpen: unref(isOpen), close })))
+                ], 6)) : createCommentVNode("", true)
+              ]),
+              _: 3
+            }, 16)
+          ], 16)) : createCommentVNode("", true)
+        ]))
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=RuiDialog.vue2.js.map

package/dist/components/overlays/dialog/RuiDialog.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiDialog.vue2.js","sources":["../../../../src/components/overlays/dialog/RuiDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nexport interface DialogProps {\n  modelValue?: boolean;\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n  bottomSheet?: boolean;\n  contentClass?: any;\n  zIndex?: string | number;\n}\n\ndefineOptions({\n  name: 'RuiDialog',\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<DialogProps>(), {\n  modelValue: false,\n  persistent: false,\n  width: '98%',\n  bottomSheet: false,\n  contentClass: '',\n  zIndex: 9999,\n});\n\nconst emit = defineEmits<{\n  (e: 'update:model-value', value: boolean): void;\n  (e: 'closed'): void;\n  (e: 'click:outside'): void;\n  (e: 'click:esc'): void;\n}>();\n\nconst {\n  modelValue,\n  width,\n  maxWidth,\n  bottomSheet,\n} = toRefs(props);\n\nconst internalValue = ref<boolean>(false);\nconst isOpen = ref<boolean>(false);\n\nwatchImmediate(modelValue, (value) => {\n  nextTick(() => {\n    set(internalValue, value);\n  });\n});\n\nwatch(internalValue, (value) => {\n  if (value) {\n    nextTick(() => {\n      set(isOpen, value);\n    });\n  }\n  else {\n    setTimeout(() => {\n      set(isOpen, value);\n    }, 100);\n  }\n});\n\nfunction onUpdateModelValue(value: boolean) {\n  emit('update:model-value', value);\n\n  if (!value)\n    emit('closed');\n}\n\nwatch(isOpen, (isOpen) => {\n  if (isOpen) {\n    onUpdateModelValue(isOpen);\n    set(internalValue, isOpen);\n  }\n  else {\n    setTimeout(() => {\n      onUpdateModelValue(isOpen);\n      set(internalValue, isOpen);\n    }, 100);\n  }\n});\n\nfunction close() {\n  set(isOpen, false);\n}\n\nconst style = computed(() => ({\n  width: transformPropsUnit(get(width)),\n  maxWidth: transformPropsUnit(get(maxWidth)),\n}));\n\nconst contentRef = ref<HTMLDivElement>();\n\nwatch(contentRef, (contentRef) => {\n  if (contentRef) {\n    nextTick(() => {\n      contentRef.focus();\n    });\n  }\n});\n\nconst dialogAttrs = computed(() => ({\n  onClick: () => {\n    const newValue = !get(internalValue);\n    set(internalValue, newValue);\n    onUpdateModelValue(newValue);\n  },\n}));\n\nconst contentTransition = computed(() => {\n  if (!get(bottomSheet)) {\n    return {\n      enterFromClass: 'opacity-0 scale-75',\n      enterActiveClass: 'ease-out duration-150',\n      enterToClass: 'opacity-100 scale-100',\n      leaveFromClass: 'opacity-100 scale-100',\n      leaveActiveClass: 'ease-in duration-100',\n      leaveToClass: 'opacity-0 scale-75',\n    };\n  }\n\n  return {\n    enterFromClass: 'translate-y-full',\n    enterActiveClass: 'ease-out duration-150',\n    enterToClass: 'translate-y-0',\n    leaveFromClass: 'translate-y-0',\n    leaveActiveClass: 'ease-in duration-100',\n    leaveToClass: 'translate-y-full',\n  };\n});\n\nfunction onEscClick() {\n  if (!props.persistent) {\n    close();\n  }\n  emit('click:esc');\n}\n\nfunction onClickOutside() {\n  if (!props.persistent) {\n    close();\n  }\n  emit('click:outside');\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <slot\n      name=\"activator\"\n      v-bind=\"{ attrs: dialogAttrs, isOpen }\"\n    />\n    <Teleport to=\"body\">\n      <div\n        v-if=\"isOpen || internalValue\"\n        :class=\"$style.wrapper\"\n        :style=\"{ zIndex }\"\n        role=\"dialog\"\n        tabindex=\"0\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        @keydown.esc.stop=\"onEscClick()\"\n      >\n        <Transition\n          enter-from-class=\"opacity-0\"\n          enter-active-class=\"ease-out duration-150\"\n          enter-to-class=\"opacity-100\"\n          leave-from-class=\"opacity-100\"\n          leave-active-class=\"ease-in duration-100\"\n          leave-to-class=\"opacity-0\"\n        >\n          <div\n            v-if=\"isOpen && internalValue\"\n            :class=\"$style.overlay\"\n            @click.stop=\"onClickOutside()\"\n          />\n        </Transition>\n        <Transition v-bind=\"contentTransition\">\n          <div\n            v-if=\"isOpen && internalValue\"\n            ref=\"contentRef\"\n            :style=\"style\"\n            tabindex=\"0\"\n            :class=\"[$style.content, contentClass, { [$style.center]: !bottomSheet }]\"\n          >\n            <slot v-bind=\"{ isOpen, close }\" />\n          </div>\n        </Transition>\n      </div>\n    </Teleport>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n.wrapper {\n  @apply fixed w-full h-full top-0 left-0;\n}\n\n.overlay {\n  @apply absolute top-0 left-0 w-full h-full backdrop-blur bg-rui-grey-500/[0.5];\n}\n\n.content {\n  @apply absolute left-1/2 bottom-0 transform -translate-x-1/2 outline-none overflow-y-auto max-h-[90vh];\n\n  &.center {\n    @apply top-1/2 -translate-y-1/2 bottom-auto;\n  }\n}\n\n:global(.dark) {\n  .overlay {\n    @apply bg-black/[0.5];\n  }\n}\n</style>\n"],"names":["isOpen","contentRef","_createElementBlock","_normalizeProps","_guardReactiveProps","getRootAttrs","$attrs","_renderSlot","_unref","_createBlock","_Teleport","_openBlock","_mergeProps","$style","getNonRootAttrs","_createVNode","_Transition","_normalizeClass"],"mappings":"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"}

package/dist/components/overlays/dialog/RuiDialog.vue3.js

@@ -0,0 +1,18 @@
+const wrapper = "_wrapper_xf8dx_1";
+const overlay = "_overlay_xf8dx_5";
+const content = "_content_xf8dx_9";
+const center = "_center_xf8dx_12";
+const style0 = {
+  wrapper,
+  overlay,
+  content,
+  center
+};
+export {
+  center,
+  content,
+  style0 as default,
+  overlay,
+  wrapper
+};
+//# sourceMappingURL=RuiDialog.vue3.js.map

package/dist/components/overlays/dialog/RuiDialog.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiDialog.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/components/overlays/menu/RuiMenu.vue.d.ts

@@ -1,4 +1,4 @@
-import { type PopperOptions } from '../../../composables/popper';
+import { type PopperOptions } from '../../../composables/popper.js';
 export interface MenuProps {
     modelValue?: boolean;
     openOnHover?: boolean;

package/dist/components/overlays/menu/RuiMenu.vue.js

@@ -0,0 +1,11 @@
+import _sfc_main from "./RuiMenu.vue2.js";
+import style0 from "./RuiMenu.vue3.js";
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const cssModules = {
+  "$style": style0
+};
+const RuiMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  RuiMenu as default
+};
+//# sourceMappingURL=RuiMenu.vue.js.map

package/dist/components/overlays/menu/RuiMenu.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiMenu.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/components/overlays/menu/RuiMenu.vue2.js

@@ -0,0 +1,221 @@
+import { defineComponent, toRefs, ref, watch, computed, createElementBlock, openBlock, withKeys, withModifiers, unref, createElementVNode, createBlock, createCommentVNode, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, Teleport, createVNode, TransitionGroup, withCtx, mergeProps, nextTick } from "vue";
+import _sfc_main$1 from "../../helpers/RuiFormTextDetail.vue.js";
+import { usePopper } from "../../../composables/popper.js";
+import { useElementSize, onClickOutside } from "@vueuse/core";
+import { set, get } from "@vueuse/shared";
+import { useFormTextDetail } from "../../../utils/form-text-detail.js";
+const _hoisted_1 = ["data-menu-disabled"];
+const FOCUSABLE_ELEMENTS_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "RuiMenu"
+  },
+  __name: "RuiMenu",
+  props: {
+    modelValue: { type: Boolean, default: false },
+    openOnHover: { type: Boolean, default: false },
+    fullWidth: { type: Boolean, default: false },
+    disabled: { type: Boolean, default: false },
+    openDelay: { default: 0 },
+    closeDelay: { default: 0 },
+    popper: { default: () => ({}) },
+    wrapperClass: { default: "" },
+    menuClass: { default: "" },
+    closeOnContentClick: { type: Boolean, default: false },
+    persistOnActivatorClick: { type: Boolean, default: false },
+    hint: { default: void 0 },
+    errorMessages: { default: () => [] },
+    successMessages: { default: () => [] },
+    showDetails: { type: Boolean },
+    dense: { type: Boolean },
+    persistent: { type: Boolean, default: false },
+    disableAutoFocus: { type: Boolean, default: false }
+  },
+  emits: ["update:model-value"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const {
+      modelValue,
+      closeDelay,
+      openDelay,
+      popper,
+      disabled,
+      persistOnActivatorClick,
+      closeOnContentClick,
+      openOnHover,
+      errorMessages,
+      successMessages,
+      persistent,
+      disableAutoFocus
+    } = toRefs(props);
+    const {
+      reference: activator,
+      popper: menu,
+      open,
+      popperEnter,
+      leavePending,
+      onLeavePending,
+      onOpen,
+      onClose,
+      onPopperLeave,
+      updatePopper
+    } = usePopper(popper, disabled, openDelay, closeDelay);
+    const { width } = useElementSize(activator);
+    const click = ref(false);
+    const menuContent = ref();
+    function focusMenu() {
+      if (get(disableAutoFocus))
+        return;
+      nextTick(() => {
+        const content = get(menuContent);
+        if (!content)
+          return;
+        content.focus();
+      });
+    }
+    function onLeave(event) {
+      if (!get(open))
+        return;
+      onClose();
+      set(click, false);
+      if (!get(disableAutoFocus)) {
+        nextTick(() => {
+          const activatorEl = get(activator);
+          if (activatorEl) {
+            const focusableEl = activatorEl.querySelector(
+              FOCUSABLE_ELEMENTS_SELECTOR
+            );
+            if (focusableEl) {
+              focusableEl.focus();
+            }
+          }
+        });
+      }
+    }
+    function checkClick() {
+      if (get(open) && get(click)) {
+        if (!get(persistOnActivatorClick))
+          onLeave();
+      } else {
+        onOpen();
+        set(click, true);
+      }
+    }
+    watch(modelValue, (value) => {
+      if (value) {
+        onOpen();
+        set(click, true);
+      } else {
+        onLeave();
+      }
+    });
+    watch(open, (open2) => {
+      emit("update:model-value", open2);
+      if (open2) {
+        focusMenu();
+      }
+    });
+    onClickOutside(menu, () => {
+      if (get(open) && !get(persistent))
+        onLeave();
+    }, { ignore: [activator] });
+    const baseMenuAttrs = computed(() => {
+      if (get(disabled))
+        return {};
+      const openOnHoverVal = get(openOnHover);
+      const clickVal = get(click);
+      return {
+        onMouseover: () => {
+          if (openOnHoverVal)
+            onOpen();
+        },
+        onMouseleave: () => {
+          if (openOnHoverVal && !clickVal)
+            onClose();
+        }
+      };
+    });
+    const menuAttrs = computed(() => {
+      if (get(disabled))
+        return {};
+      return { ...get(baseMenuAttrs), onClick: checkClick };
+    });
+    const { hasError, hasSuccess } = useFormTextDetail(
+      errorMessages,
+      successMessages
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        onKeydown: [
+          _cache[5] || (_cache[5] = withKeys(withModifiers(($event) => onLeave(), ["stop"]), ["esc"])),
+          _cache[6] || (_cache[6] = withKeys(($event) => !unref(disableAutoFocus) && unref(open) ? void 0 : null, ["tab"]))
+        ]
+      }, [
+        createElementVNode("div", {
+          ref_key: "activator",
+          ref: activator,
+          class: normalizeClass([_ctx.$style.wrapper, __props.wrapperClass, { "w-full": __props.fullWidth }]),
+          "data-menu-disabled": unref(disabled)
+        }, [
+          renderSlot(_ctx.$slots, "activator", normalizeProps(guardReactiveProps({ attrs: unref(menuAttrs), open: unref(open), disabled: unref(disabled), hasError: unref(hasError), hasSuccess: unref(hasSuccess) })))
+        ], 10, _hoisted_1),
+        !unref(disabled) ? (openBlock(), createBlock(Teleport, {
+          key: 0,
+          to: "body"
+        }, [
+          unref(popperEnter) ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            ref_key: "menu",
+            ref: menu,
+            class: normalizeClass([
+              _ctx.$style.menu,
+              __props.menuClass,
+              _ctx.$style[`menu__${unref(popper)?.strategy ?? "absolute"}`]
+            ]),
+            role: "menu",
+            onClick: _cache[3] || (_cache[3] = ($event) => unref(closeOnContentClick) ? onLeave() : void 0),
+            onKeydown: _cache[4] || (_cache[4] = withKeys(withModifiers(($event) => onLeave(), ["stop"]), ["esc"]))
+          }, [
+            createVNode(TransitionGroup, {
+              "enter-active-class": "transition ease-out duration-200",
+              "enter-from-class": "opacity-0 translate-y-1",
+              "enter-to-class": "opacity-100 translate-y-0",
+              "leave-active-class": "transition ease-in duration-150",
+              "leave-from-class": "opacity-100 translate-y-0",
+              "leave-to-class": "opacity-0 translate-y-1",
+              onBeforeEnter: _cache[0] || (_cache[0] = ($event) => unref(updatePopper)()),
+              onAfterLeave: _cache[1] || (_cache[1] = ($event) => unref(leavePending) ? unref(onPopperLeave)() : void 0),
+              onBeforeLeave: _cache[2] || (_cache[2] = ($event) => unref(onLeavePending)())
+            }, {
+              default: withCtx(() => [
+                unref(open) ? (openBlock(), createElementBlock("div", mergeProps({
+                  ref_key: "menuContent",
+                  ref: menuContent,
+                  key: "menu",
+                  role: "menu-content",
+                  class: _ctx.$style.base,
+                  tabindex: "-1"
+                }, unref(baseMenuAttrs)), [
+                  renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ width: unref(width) })))
+                ], 16)) : createCommentVNode("", true)
+              ]),
+              _: 3
+            })
+          ], 34)) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true),
+        __props.showDetails ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 1,
+          class: normalizeClass(["pt-1", [__props.dense ? "px-2" : "px-4"]]),
+          "error-messages": unref(errorMessages),
+          "success-messages": unref(successMessages),
+          hint: __props.hint
+        }, null, 8, ["class", "error-messages", "success-messages", "hint"])) : createCommentVNode("", true)
+      ], 32);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=RuiMenu.vue2.js.map

package/dist/components/overlays/menu/RuiMenu.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiMenu.vue2.js","sources":["../../../../src/components/overlays/menu/RuiMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { type PopperOptions, usePopper } from '@/composables/popper';\n\nexport interface MenuProps {\n  modelValue?: boolean;\n  openOnHover?: boolean;\n  fullWidth?: boolean;\n  disabled?: boolean;\n  openDelay?: number;\n  closeDelay?: number;\n  popper?: PopperOptions;\n  wrapperClass?: string | object | string[];\n  menuClass?: string | object | string[];\n  closeOnContentClick?: boolean;\n  persistOnActivatorClick?: boolean;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  showDetails?: boolean;\n  dense?: boolean;\n  persistent?: boolean;\n  disableAutoFocus?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiMenu',\n});\n\nconst props = withDefaults(defineProps<MenuProps>(), {\n  modelValue: false,\n  openOnHover: false,\n  disabled: false,\n  fullWidth: false,\n  openDelay: 0,\n  closeDelay: 0,\n  popper: () => ({}),\n  wrapperClass: '',\n  menuClass: '',\n  closeOnContentClick: false,\n  persistOnActivatorClick: false,\n  hint: undefined,\n  errorMessages: () => [],\n  successMessages: () => [],\n  persistent: false,\n  disableAutoFocus: false,\n});\n\nconst emit = defineEmits<{\n  (e: 'update:model-value', value: boolean): void;\n}>();\n\nconst {\n  modelValue,\n  closeDelay,\n  openDelay,\n  popper,\n  disabled,\n  persistOnActivatorClick,\n  closeOnContentClick,\n  openOnHover,\n  errorMessages,\n  successMessages,\n  persistent,\n  disableAutoFocus,\n} = toRefs(props);\n\nconst {\n  reference: activator,\n  popper: menu,\n  open,\n  popperEnter,\n  leavePending,\n  onLeavePending,\n  onOpen,\n  onClose,\n  onPopperLeave,\n  updatePopper,\n} = usePopper(popper, disabled, openDelay, closeDelay);\n\nconst { width } = useElementSize(activator);\n\nconst click = ref<boolean>(false);\nconst menuContent = ref<HTMLElement>();\n\nconst FOCUSABLE_ELEMENTS_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n\nfunction focusMenu() {\n  if (get(disableAutoFocus))\n    return;\n\n  nextTick(() => {\n    const content = get(menuContent);\n    if (!content)\n      return;\n\n    // Focus on the menu container itself\n    content.focus();\n  });\n}\n\nfunction onLeave(event?: KeyboardEvent) {\n  if (!get(open))\n    return;\n  onClose();\n  set(click, false);\n  event?.stopPropagation();\n\n  // Return focus to activator when menu closes\n  if (!get(disableAutoFocus)) {\n    nextTick(() => {\n      const activatorEl = get(activator);\n      if (activatorEl) {\n        const focusableEl = activatorEl.querySelector<HTMLElement>(\n          FOCUSABLE_ELEMENTS_SELECTOR,\n        );\n        if (focusableEl) {\n          focusableEl.focus();\n        }\n      }\n    });\n  }\n}\n\nfunction checkClick() {\n  if (get(open) && get(click)) {\n    if (!get(persistOnActivatorClick))\n      onLeave();\n  }\n  else {\n    onOpen();\n    set(click, true);\n  }\n}\n\nwatch(modelValue, (value) => {\n  if (value) {\n    onOpen();\n    set(click, true);\n  }\n  else {\n    onLeave();\n  }\n});\n\nwatch(open, (open) => {\n  emit('update:model-value', open);\n  if (open) {\n    focusMenu();\n  }\n});\n\nonClickOutside(menu, () => {\n  if (get(open) && !get(persistent))\n    onLeave();\n}, { ignore: [activator] });\n\nconst baseMenuAttrs = computed(() => {\n  if (get(disabled))\n    return {};\n\n  const openOnHoverVal = get(openOnHover);\n  const clickVal = get(click);\n  return {\n    onMouseover: () => {\n      if (openOnHoverVal)\n        onOpen();\n    },\n    onMouseleave: () => {\n      if (openOnHoverVal && !clickVal)\n        onClose();\n    },\n  };\n});\n\nconst menuAttrs = computed(() => {\n  if (get(disabled))\n    return {};\n\n  return { ...get(baseMenuAttrs), onClick: checkClick };\n});\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  errorMessages,\n  successMessages,\n);\n</script>\n\n<template>\n  <div\n    @keydown.esc.stop=\"onLeave()\"\n    @keydown.tab=\"!disableAutoFocus && open ? undefined : null\"\n  >\n    <div\n      ref=\"activator\"\n      :class=\"[$style.wrapper, wrapperClass, { 'w-full': fullWidth }]\"\n      :data-menu-disabled=\"disabled\"\n    >\n      <slot\n        name=\"activator\"\n        v-bind=\"{ attrs: menuAttrs, open, disabled, hasError, hasSuccess }\"\n      />\n    </div>\n    <Teleport\n      v-if=\"!disabled\"\n      to=\"body\"\n    >\n      <div\n        v-if=\"popperEnter\"\n        ref=\"menu\"\n        :class=\"[\n          $style.menu,\n          menuClass,\n          $style[`menu__${popper?.strategy ?? 'absolute'}`],\n        ]\"\n        role=\"menu\"\n        @click=\"closeOnContentClick ? onLeave() : undefined\"\n        @keydown.esc.stop=\"onLeave()\"\n      >\n        <TransitionGroup\n          enter-active-class=\"transition ease-out duration-200\"\n          enter-from-class=\"opacity-0 translate-y-1\"\n          enter-to-class=\"opacity-100 translate-y-0\"\n          leave-active-class=\"transition ease-in duration-150\"\n          leave-from-class=\"opacity-100 translate-y-0\"\n          leave-to-class=\"opacity-0 translate-y-1\"\n          @before-enter=\"updatePopper()\"\n          @after-leave=\"leavePending ? onPopperLeave() : undefined\"\n          @before-leave=\"onLeavePending()\"\n        >\n          <div\n            v-if=\"open\"\n            ref=\"menuContent\"\n            key=\"menu\"\n            role=\"menu-content\"\n            :class=\"$style.base\"\n            tabindex=\"-1\"\n            v-bind=\"baseMenuAttrs\"\n          >\n            <slot v-bind=\"{ width }\" />\n          </div>\n        </TransitionGroup>\n      </div>\n    </Teleport>\n    <RuiFormTextDetail\n      v-if=\"showDetails\"\n      class=\"pt-1\"\n      :class=\"[dense ? 'px-2' : 'px-4']\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n.wrapper {\n  @apply relative inline-flex max-w-full;\n}\n\n.menu {\n  @apply w-max transform transition-opacity delay-0 z-[9999];\n\n  &__fixed {\n    @apply fixed;\n  }\n\n  &__absolute {\n    @apply absolute;\n  }\n\n  .base {\n    @apply rounded overflow-hidden shadow-8;\n    @apply bg-white text-rui-text;\n\n    &:focus {\n      @apply outline-none;\n    }\n  }\n}\n\n:global(.dark) {\n  .menu {\n    .base {\n      @apply bg-[#2E2E2E];\n    }\n  }\n}\n</style>\n"],"names":["open","_createElementBlock","_unref","_createElementVNode","$style","_renderSlot","_normalizeProps","_guardReactiveProps","_createBlock","_Teleport","_normalizeClass","_createVNode","_TransitionGroup","_openBlock","_mergeProps","RuiFormTextDetail"],"mappings":"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"}

package/dist/components/overlays/menu/RuiMenu.vue3.js

@@ -0,0 +1,21 @@
+const wrapper = "_wrapper_kk7hi_1";
+const menu = "_menu_kk7hi_5";
+const menu__fixed = "_menu__fixed_kk7hi_8";
+const menu__absolute = "_menu__absolute_kk7hi_11";
+const base = "_base_kk7hi_14";
+const style0 = {
+  wrapper,
+  menu,
+  menu__fixed,
+  menu__absolute,
+  base
+};
+export {
+  base,
+  style0 as default,
+  menu,
+  menu__absolute,
+  menu__fixed,
+  wrapper
+};
+//# sourceMappingURL=RuiMenu.vue3.js.map

package/dist/components/overlays/menu/RuiMenu.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiMenu.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/components/overlays/navigation-drawer/RuiNavigationDrawer.vue.js

@@ -0,0 +1,11 @@
+import _sfc_main from "./RuiNavigationDrawer.vue2.js";
+import style0 from "./RuiNavigationDrawer.vue3.js";
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.js";
+const cssModules = {
+  "$style": style0
+};
+const RuiNavigationDrawer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  RuiNavigationDrawer as default
+};
+//# sourceMappingURL=RuiNavigationDrawer.vue.js.map

package/dist/components/overlays/navigation-drawer/RuiNavigationDrawer.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiNavigationDrawer.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/components/overlays/navigation-drawer/RuiNavigationDrawer.vue2.js

@@ -0,0 +1,112 @@
+import { defineComponent, toRefs, ref, watch, computed, createElementBlock, openBlock, renderSlot, createBlock, normalizeProps, guardReactiveProps, unref, Teleport, createCommentVNode, createElementVNode, Transition, withCtx, withModifiers, normalizeClass, mergeProps } from "vue";
+import { transformPropsUnit, getRootAttrs } from "../../../utils/helpers.js";
+import { watchImmediate, onClickOutside } from "@vueuse/core";
+import { set, get } from "@vueuse/shared";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "RuiNavigationDrawer",
+    inheritAttrs: false
+  },
+  __name: "RuiNavigationDrawer",
+  props: {
+    modelValue: { type: Boolean, default: false },
+    temporary: { type: Boolean, default: false },
+    stateless: { type: Boolean, default: false },
+    width: { default: 360 },
+    miniVariant: { type: Boolean, default: false },
+    overlay: { type: Boolean, default: false },
+    position: { default: "left" },
+    contentClass: { default: "" }
+  },
+  emits: ["update:model-value", "closed"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const {
+      modelValue,
+      position,
+      miniVariant,
+      width
+    } = toRefs(props);
+    function onUpdateModelValue(value) {
+      emit("update:model-value", value);
+      if (!value)
+        emit("closed");
+    }
+    const internalValue = ref(false);
+    watchImmediate(modelValue, (value) => {
+      set(internalValue, value);
+    });
+    watch(internalValue, (value) => {
+      onUpdateModelValue(value);
+    });
+    function close() {
+      set(internalValue, false);
+    }
+    const style = computed(() => ({
+      width: transformPropsUnit(get(width))
+    }));
+    const content = ref(null);
+    onClickOutside(content, () => {
+      if (get(internalValue) && props.temporary && !props.stateless) {
+        setTimeout(() => {
+          close();
+        }, 50);
+      }
+    });
+    const activatorAttrs = computed(() => ({
+      onClick: () => {
+        const newValue = !get(internalValue);
+        set(internalValue, newValue);
+        onUpdateModelValue(newValue);
+      }
+    }));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        renderSlot(_ctx.$slots, "activator", normalizeProps(guardReactiveProps({ open: internalValue.value, attrs: unref(activatorAttrs) }))),
+        (openBlock(), createBlock(Teleport, { to: "body" }, [
+          __props.overlay ? (openBlock(), createBlock(Transition, {
+            key: 0,
+            "enter-from-class": "opacity-0",
+            "enter-active-class": "ease-out duration-150",
+            "enter-to-class": "opacity-100",
+            "leave-from-class": "opacity-100",
+            "leave-active-class": "ease-in duration-100",
+            "leave-to-class": "opacity-0"
+          }, {
+            default: withCtx(() => [
+              internalValue.value ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: normalizeClass(_ctx.$style.overlay),
+                onClick: _cache[0] || (_cache[0] = withModifiers(($event) => close(), ["stop"]))
+              }, null, 2)) : createCommentVNode("", true)
+            ]),
+            _: 1
+          })) : createCommentVNode("", true),
+          createElementVNode("aside", mergeProps({
+            ref_key: "content",
+            ref: content,
+            style: unref(style),
+            class: [
+              _ctx.$style.content,
+              __props.contentClass,
+              {
+                [_ctx.$style.visible]: internalValue.value,
+                [_ctx.$style[unref(position)]]: unref(position),
+                [_ctx.$style.mini]: unref(miniVariant),
+                [_ctx.$style.temporary]: __props.temporary,
+                [_ctx.$style["with-overlay"]]: __props.overlay
+              }
+            ]
+          }, unref(getRootAttrs)(_ctx.$attrs)), [
+            renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ attrs: unref(activatorAttrs), close })))
+          ], 16)
+        ]))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=RuiNavigationDrawer.vue2.js.map

package/dist/components/overlays/navigation-drawer/RuiNavigationDrawer.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiNavigationDrawer.vue2.js","sources":["../../../../src/components/overlays/navigation-drawer/RuiNavigationDrawer.vue"],"sourcesContent":["<script setup lang='ts'>\nimport type { MaybeElement } from '@vueuse/core';\nimport { type Ref, ref } from 'vue';\nimport { getRootAttrs } from '@/utils/helpers';\n\nexport interface NavigationDrawerProps {\n  modelValue?: boolean;\n  temporary?: boolean;\n  stateless?: boolean;\n  width?: string | number;\n  miniVariant?: boolean;\n  overlay?: boolean;\n  position?: 'left' | 'right';\n  contentClass?: string | object | string[];\n}\n\ndefineOptions({\n  name: 'RuiNavigationDrawer',\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<NavigationDrawerProps>(), {\n  modelValue: false,\n  temporary: false,\n  stateless: false,\n  width: 360,\n  miniVariant: false,\n  overlay: false,\n  position: 'left',\n  contentClass: '',\n});\n\nconst emit = defineEmits<{\n  (e: 'update:model-value', value: boolean): void;\n  (e: 'closed'): void;\n}>();\n\nconst {\n  modelValue,\n  position,\n  miniVariant,\n  width,\n} = toRefs(props);\n\nfunction onUpdateModelValue(value: boolean) {\n  emit('update:model-value', value);\n\n  if (!value)\n    emit('closed');\n}\n\nconst internalValue: Ref<boolean> = ref(false);\n\nwatchImmediate(modelValue, (value) => {\n  set(internalValue, value);\n});\n\nwatch(internalValue, (value) => {\n  onUpdateModelValue(value);\n});\n\nfunction close() {\n  set(internalValue, false);\n}\n\nconst style = computed(() => ({\n  width: transformPropsUnit(get(width)),\n}));\n\nconst content: Ref<MaybeElement | null> = ref(null);\n\nonClickOutside(content, () => {\n  if (get(internalValue) && props.temporary && !props.stateless) {\n    setTimeout(() => {\n      close();\n    }, 50);\n  }\n});\n\nconst activatorAttrs = computed(() => ({\n  onClick: () => {\n    const newValue = !get(internalValue);\n    set(internalValue, newValue);\n    onUpdateModelValue(newValue);\n  },\n}));\n</script>\n\n<template>\n  <div>\n    <slot\n      name=\"activator\"\n      v-bind=\"{ open: internalValue, attrs: activatorAttrs }\"\n    />\n    <Teleport to=\"body\">\n      <Transition\n        v-if=\"overlay\"\n        enter-from-class=\"opacity-0\"\n        enter-active-class=\"ease-out duration-150\"\n        enter-to-class=\"opacity-100\"\n        leave-from-class=\"opacity-100\"\n        leave-active-class=\"ease-in duration-100\"\n        leave-to-class=\"opacity-0\"\n      >\n        <div\n          v-if=\"internalValue\"\n          :class=\"$style.overlay\"\n          @click.stop=\"close()\"\n        />\n      </Transition>\n      <aside\n        ref=\"content\"\n        :style=\"style\"\n        :class=\"[\n          $style.content,\n          contentClass,\n          {\n            [$style.visible]: internalValue,\n            [$style[position]]: position,\n            [$style.mini]: miniVariant,\n            [$style.temporary]: temporary,\n            [$style['with-overlay']]: overlay,\n          },\n        ]\"\n        v-bind=\"getRootAttrs($attrs)\"\n      >\n        <slot v-bind=\"{ attrs: activatorAttrs, close }\" />\n      </aside>\n    </Teleport>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n.overlay {\n  @apply absolute top-0 left-0 w-full h-full backdrop-blur bg-rui-grey-500/[0.5] z-[10000];\n}\n\n.content {\n  @apply transition-all top-0 h-full fixed text-rui-text bg-white z-[7];\n\n  &.left {\n    @apply -translate-x-full left-0;\n  }\n\n  &.right {\n    @apply translate-x-full right-0;\n  }\n\n  &.with-overlay {\n    @apply z-[10000];\n  }\n\n  &.visible {\n    @apply translate-x-0;\n  }\n\n  &.temporary {\n    &.visible {\n      @apply shadow-5;\n    }\n  }\n\n  &.mini {\n    @apply translate-x-0;\n\n    &:not(.visible) {\n      @apply w-14 #{!important};\n    }\n  }\n}\n\n:global(.dark) {\n  .overlay {\n    @apply bg-black/[0.5];\n  }\n\n  .content {\n    @apply bg-[#363636];\n  }\n}\n</style>\n"],"names":["_createElementBlock","_renderSlot","_normalizeProps","_guardReactiveProps","_unref","_createBlock","_Teleport","_Transition","_normalizeClass","$style","_createElementVNode","_mergeProps","$attrs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,UAAM,QAAQ;AAWd,UAAM,OAAO;AAKb,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,IACE,OAAO,KAAK;AAEhB,aAAS,mBAAmB,OAAgB;AAC1C,WAAK,sBAAsB,KAAK;AAEhC,UAAI,CAAC;AACH,aAAK,QAAQ;AAAA,IACjB;AAEA,UAAM,gBAA8B,IAAI,KAAK;AAE7C,mBAAe,YAAY,CAAC,UAAU;AACpC,UAAI,eAAe,KAAK;AAAA,IAC1B,CAAC;AAED,UAAM,eAAe,CAAC,UAAU;AAC9B,yBAAmB,KAAK;AAAA,IAC1B,CAAC;AAED,aAAS,QAAQ;AACf,UAAI,eAAe,KAAK;AAAA,IAC1B;AAEA,UAAM,QAAQ,SAAS,OAAO;AAAA,MAC5B,OAAO,mBAAmB,IAAI,KAAK,CAAC;AAAA,IAAA,EACpC;AAEF,UAAM,UAAoC,IAAI,IAAI;AAElD,mBAAe,SAAS,MAAM;AAC5B,UAAI,IAAI,aAAa,KAAK,MAAM,aAAa,CAAC,MAAM,WAAW;AAC7D,mBAAW,MAAM;AACf,gBAAA;AAAA,QACF,GAAG,EAAE;AAAA,MACP;AAAA,IACF,CAAC;AAED,UAAM,iBAAiB,SAAS,OAAO;AAAA,MACrC,SAAS,MAAM;AACb,cAAM,WAAW,CAAC,IAAI,aAAa;AACnC,YAAI,eAAe,QAAQ;AAC3B,2BAAmB,QAAQ;AAAA,MAC7B;AAAA,IAAA,EACA;;0BAIAA,mBAwCM,OAAA,MAAA;AAAA,QAvCJC,WAGE,KAAA,QAAA,aAAAC,eAAAC,mBAAA,EAAA,MADgB,cAAA,OAAa,OAASC,MAAA,cAAA,EAAA,CAAc,CAAA,CAAA;AAAA,sBAEtDC,YAkCWC,UAAA,EAlCD,IAAG,UAAM;AAAA,UAET,QAAA,wBADRD,YAcaE,YAAA;AAAA;YAZX,oBAAiB;AAAA,YACjB,sBAAmB;AAAA,YACnB,kBAAe;AAAA,YACf,oBAAiB;AAAA,YACjB,sBAAmB;AAAA,YACnB,kBAAe;AAAA,UAAA;6BAEf,MAIE;AAAA,cAHM,cAAA,sBADRP,mBAIE,OAAA;AAAA;gBAFC,OAAKQ,eAAEC,KAAAA,OAAO,OAAO;AAAA,gBACrB,6DAAY,SAAK,CAAA,MAAA,CAAA;AAAA,cAAA;;;;UAGtBC,mBAiBQ,SAjBRC,WAiBQ;AAAA,qBAhBF;AAAA,YAAJ,KAAI;AAAA,YACH,OAAOP,MAAA,KAAA;AAAA,YACP,OAAK;AAAA,cAAcK,KAAAA,OAAO;AAAA,cAAmB,QAAA;AAAA;iBAAuCA,KAAAA,OAAO,OAAO,GAAG,cAAA;AAAA,iBAA4BA,KAAAA,OAAOL,MAAA,QAAA,CAAQ,CAAA,GAAIA,MAAA,QAAA;AAAA,iBAAuBK,KAAAA,OAAO,IAAI,GAAGL,MAAA,WAAA;AAAA,iBAA0BK,KAAAA,OAAO,SAAS,GAAG,QAAA;AAAA,gBAAwBA,CAAAA,KAAAA,yBAAyB,QAAA;AAAA,cAAA;AAAA;aAWhRL,MAAA,YAAA,EAAaQ,KAAAA,MAAM,CAAA,GAAA;AAAA,YAE3BX,WAAkD,KAAA,QAAA,WAAAC,eAAAC,mBAAA,EAAA,OAA3BC,MAAA,cAAA,GAAc,MAAA,CAAO,CAAA,CAAA;AAAA,UAAA;;;;;;"}