@rotki/ui-library 2.8.1 → 2.8.3

package/dist/components/tabs/tab-items/RuiTabItems.vue2.js

@@ -0,0 +1,90 @@
+import { defineComponent, useCssVars, unref, useModel, useSlots, ref, watch, nextTick, computed, createElementBlock, openBlock, mergeProps, createElementVNode, Fragment, renderList, createBlock, resolveDynamicComponent, isVNode } from "vue";
+import { set, get } from "@vueuse/shared";
+import { useElementSize } from "@vueuse/core";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "RuiTabItems",
+    inheritAttrs: false
+  },
+  __name: "RuiTabItems",
+  props: {
+    "modelValue": {},
+    "modelModifiers": {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props) {
+    useCssVars((_ctx) => ({
+      "v1ef23b00": unref(innerHeight)
+    }));
+    const modelValue = useModel(__props, "modelValue");
+    const slots = useSlots();
+    const reverse = ref(false);
+    const currIndex = ref(-1);
+    const activeIndex = ref(-1);
+    watch(currIndex, (index) => {
+      nextTick(() => {
+        set(activeIndex, index);
+      });
+    });
+    function getChildrenTabs(children2) {
+      return children2.flatMap((item) => {
+        if (item.type === Fragment && Array.isArray(item.children) && item.children.length > 0)
+          return getChildrenTabs(item.children.filter(isVNode));
+        return [item];
+      }).flat();
+    }
+    const children = computed(() => {
+      const slotContent = slots.default?.() ?? [];
+      const tabs = getChildrenTabs(slotContent);
+      let anyActive = false;
+      const children2 = tabs.map((tab, index) => {
+        const value = tab.props?.value ?? index;
+        const active = get(modelValue) === value;
+        if (active) {
+          anyActive = true;
+          if (index !== get(currIndex)) {
+            set(reverse, index < get(currIndex));
+            set(currIndex, index);
+          }
+        }
+        return {
+          ...tab,
+          props: {
+            value,
+            ...tab.props
+          }
+        };
+      });
+      if (!anyActive)
+        set(currIndex, -1);
+      return children2;
+    });
+    const wrapper = ref();
+    const inner = ref();
+    const { height: innerHeight } = useElementSize(inner);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "wrapper",
+        ref: wrapper,
+        class: _ctx.$style.tabs
+      }, _ctx.$attrs), [
+        createElementVNode("div", {
+          ref_key: "inner",
+          ref: inner
+        }, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(children), (child, i) => {
+            return openBlock(), createBlock(resolveDynamicComponent(child), {
+              key: i,
+              reverse: unref(reverse),
+              active: i === unref(activeIndex)
+            }, null, 8, ["reverse", "active"]);
+          }), 128))
+        ], 512)
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=RuiTabItems.vue2.js.map

package/dist/components/tabs/tab-items/RuiTabItems.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiTabItems.vue2.js","sources":["../../../../src/components/tabs/tab-items/RuiTabItems.vue"],"sourcesContent":["<script lang=\"ts\" setup generic='T extends string | number'>\nimport { Fragment, isVNode } from 'vue';\n\nexport interface Props<T> {\n  modelValue?: T;\n}\n\ndefineOptions({\n  name: 'RuiTabItems',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<Props<T>['modelValue']>();\n\nconst slots = useSlots();\nconst reverse = ref<boolean>(false);\nconst currIndex = ref<number>(-1);\nconst activeIndex = ref<number>(-1);\n\nwatch(currIndex, (index) => {\n  nextTick(() => {\n    set(activeIndex, index);\n  });\n});\n\n// When using dynamic content with v-for the slot content can contain fragment,\n// Go through the fragment and always return RuiTabItem only\nfunction getChildrenTabs(children: VNode[]): VNode[] {\n  return children.flatMap((item) => {\n    if (item.type === Fragment && Array.isArray(item.children) && item.children.length > 0)\n      return getChildrenTabs(item.children.filter(isVNode));\n\n    return [item];\n  }).flat();\n}\n\nconst children = computed(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  const tabs = getChildrenTabs(slotContent);\n\n  let anyActive = false;\n  const children = tabs.map((tab, index) => {\n    const value = tab.props?.value ?? index;\n    const active = get(modelValue) === value;\n    if (active) {\n      anyActive = true;\n      if (index !== get(currIndex)) {\n        set(reverse, index < get(currIndex));\n        set(currIndex, index);\n      }\n    }\n\n    return {\n      ...tab,\n      props: {\n        value,\n        ...tab.props,\n      },\n    };\n  });\n\n  if (!anyActive)\n    set(currIndex, -1);\n\n  return children;\n});\n\nconst wrapper = ref<HTMLDivElement>();\nconst inner = ref<HTMLDivElement>();\n\nconst { height: innerHeight } = useElementSize(inner);\n</script>\n\n<template>\n  <div\n    ref=\"wrapper\"\n    :class=\"$style.tabs\"\n    v-bind=\"$attrs\"\n  >\n    <div ref=\"inner\">\n      <Component\n        :is=\"child\"\n        v-for=\"(child, i) in children\"\n        :key=\"i\"\n        :reverse=\"reverse\"\n        :active=\"i === activeIndex\"\n      />\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n.tabs {\n  @apply grow transition-all overflow-hidden;\n  height: calc(v-bind(innerHeight) * 1px);\n}\n</style>\n"],"names":["_useModel","children","_openBlock","_createElementBlock","_mergeProps","$style","$attrs","_createElementVNode","_Fragment","_renderList","_unref","_createBlock","_resolveDynamicComponent"],"mappings":";;;;;;;;;;;;;;;;;;AAYA,UAAM,aAAaA,8BAAoC;AAEvD,UAAM,QAAQ,SAAA;AACd,UAAM,UAAU,IAAa,KAAK;AAClC,UAAM,YAAY,IAAY,EAAE;AAChC,UAAM,cAAc,IAAY,EAAE;AAElC,UAAM,WAAW,CAAC,UAAU;AAC1B,eAAS,MAAM;AACb,YAAI,aAAa,KAAK;AAAA,MACxB,CAAC;AAAA,IACH,CAAC;AAID,aAAS,gBAAgBC,WAA4B;AACnD,aAAOA,UAAS,QAAQ,CAAC,SAAS;AAChC,YAAI,KAAK,SAAS,YAAY,MAAM,QAAQ,KAAK,QAAQ,KAAK,KAAK,SAAS,SAAS;AACnF,iBAAO,gBAAgB,KAAK,SAAS,OAAO,OAAO,CAAC;AAEtD,eAAO,CAAC,IAAI;AAAA,MACd,CAAC,EAAE,KAAA;AAAA,IACL;AAEA,UAAM,WAAW,SAAS,MAAM;AAC9B,YAAM,cAAc,MAAM,UAAA,KAAe,CAAA;AAEzC,YAAM,OAAO,gBAAgB,WAAW;AAExC,UAAI,YAAY;AAChB,YAAMA,YAAW,KAAK,IAAI,CAAC,KAAK,UAAU;AACxC,cAAM,QAAQ,IAAI,OAAO,SAAS;AAClC,cAAM,SAAS,IAAI,UAAU,MAAM;AACnC,YAAI,QAAQ;AACV,sBAAY;AACZ,cAAI,UAAU,IAAI,SAAS,GAAG;AAC5B,gBAAI,SAAS,QAAQ,IAAI,SAAS,CAAC;AACnC,gBAAI,WAAW,KAAK;AAAA,UACtB;AAAA,QACF;AAEA,eAAO;AAAA,UACL,GAAG;AAAA,UACH,OAAO;AAAA,YACL;AAAA,YACA,GAAG,IAAI;AAAA,UAAA;AAAA,QACT;AAAA,MAEJ,CAAC;AAED,UAAI,CAAC;AACH,YAAI,WAAW,EAAE;AAEnB,aAAOA;AAAAA,IACT,CAAC;AAED,UAAM,UAAU,IAAA;AAChB,UAAM,QAAQ,IAAA;AAEd,UAAM,EAAE,QAAQ,gBAAgB,eAAe,KAAK;;AAIlD,aAAAC,UAAA,GAAAC,mBAcM,OAdNC,WAcM;AAAA,iBAbA;AAAA,QAAJ,KAAI;AAAA,QACH,OAAOC,KAAAA,OAAO;AAAA,MAAA,GACPC,KAAAA,MAAM,GAAA;AAAA,QAEdC,mBAQM,OAAA;AAAA,mBARG;AAAA,UAAJ,KAAI;AAAA,QAAA;WACPL,UAAA,IAAA,GAAAC,mBAMEK,UAAA,MAAAC,WAJqBC,MAAA,QAAA,GAAQ,CAArB,OAAO,MAAC;AAFlB,mBAAAR,UAAA,GAAAS,YAMEC,wBALK,KAAK,GAAA;AAAA,cAET,KAAK;AAAA,cACL,SAASF,MAAA,OAAA;AAAA,cACT,QAAQ,MAAMA,MAAA,WAAA;AAAA,YAAA;;;;;;;"}

package/dist/components/tabs/tab-items/RuiTabItems.vue3.js

@@ -0,0 +1,9 @@
+const tabs = "_tabs_1wt4o_1";
+const style0 = {
+  tabs
+};
+export {
+  style0 as default,
+  tabs
+};
+//# sourceMappingURL=RuiTabItems.vue3.js.map

package/dist/components/tabs/tab-items/RuiTabItems.vue3.js.map

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

package/dist/components/tabs/tabs/RuiTabs.vue.d.ts

@@ -1,4 +1,4 @@
-import type { ContextColorsType } from '../../../consts/colors';
+import type { ContextColorsType } from '../../../consts/colors.js';
 export interface Props {
     color?: ContextColorsType;
     vertical?: boolean;

package/dist/components/tabs/tabs/RuiTabs.vue.js

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

package/dist/components/tabs/tabs/RuiTabs.vue.js.map

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

package/dist/components/tabs/tabs/RuiTabs.vue2.js

@@ -0,0 +1,281 @@
+import { defineComponent, toRefs, ref, useSlots, computed, onMounted, watch, createElementBlock, openBlock, normalizeClass, unref, createCommentVNode, createElementVNode, createVNode, withCtx, Fragment, renderList, createBlock, resolveDynamicComponent, isVNode, nextTick } from "vue";
+import { get, set, throttleFilter } from "@vueuse/shared";
+import { useRoute, useRouter } from "vue-router";
+import RuiButton from "../../buttons/button/RuiButton.vue.js";
+import RuiIcon from "../../icons/RuiIcon.vue.js";
+import { useElementSize, useScroll, watchTriggerable, watchImmediate, useResizeObserver } from "@vueuse/core";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "RuiTabs"
+  },
+  __name: "RuiTabs",
+  props: {
+    color: { default: void 0 },
+    vertical: { type: Boolean, default: false },
+    disabled: { type: Boolean, default: false },
+    grow: { type: Boolean, default: false },
+    modelValue: { default: void 0 },
+    align: { default: "center" },
+    indicatorPosition: { default: "end" }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const { color, grow, modelValue, disabled, vertical, align, indicatorPosition } = toRefs(props);
+    const internalModelValue = ref();
+    const bar = ref();
+    const wrapper = ref();
+    const showArrows = ref(false);
+    function getChildrenTabs(children2) {
+      return children2.flatMap((item) => {
+        if (item.type === Fragment && Array.isArray(item.children) && item.children.length > 0)
+          return getChildrenTabs(item.children.filter(isVNode));
+        return [item];
+      }).flat();
+    }
+    const slots = useSlots();
+    const children = computed(() => {
+      const slotContent = slots.default?.() ?? [];
+      const tabs = getChildrenTabs(slotContent);
+      const currentModelValue = get(internalModelValue);
+      const inheritedProps = {
+        color: get(color),
+        grow: get(grow),
+        disabled: get(disabled),
+        vertical: get(vertical),
+        align: get(align),
+        indicatorPosition: get(indicatorPosition)
+      };
+      return tabs.map((tab, index) => {
+        let tabValue = tab.props?.value ?? index;
+        if (tab.props?.link !== false && tab.props?.to)
+          tabValue = tab.props.to;
+        const active = currentModelValue === tabValue;
+        return {
+          ...tab,
+          props: {
+            value: tabValue,
+            active,
+            ...inheritedProps,
+            ...tab.props
+          }
+        };
+      });
+    });
+    function updateModelValue(newModelValue) {
+      emit("update:modelValue", newModelValue);
+      set(internalModelValue, newModelValue);
+    }
+    const route = useRoute();
+    function isPathMatch(path, { exactPath, exact }) {
+      const currentRoute = route.fullPath;
+      if (exactPath)
+        return currentRoute === path;
+      const routeWithoutQueryParams = new URL(path, window.location.origin).pathname;
+      if (exact)
+        return currentRoute === routeWithoutQueryParams;
+      return currentRoute.startsWith(routeWithoutQueryParams);
+    }
+    function keepActiveTabVisible() {
+      nextTick(() => {
+        if (!get(showArrows))
+          return;
+        const elem = get(wrapper);
+        const barElem = get(bar);
+        if (elem) {
+          const activeTab = elem.querySelector(".active-tab") ?? elem.querySelector(".active-tab-link");
+          if (!activeTab || !barElem)
+            return;
+          const childLeft = activeTab.offsetLeft - elem.offsetLeft;
+          const childTop = activeTab.offsetTop - elem.offsetTop;
+          const childWidth = activeTab.offsetWidth;
+          const childHeight = activeTab.offsetHeight;
+          const parentScrollLeft = barElem.scrollLeft;
+          const parentScrollTop = barElem.scrollTop;
+          const parentWidth = barElem.offsetWidth;
+          const parentHeight = barElem.offsetHeight;
+          const scrollLeft = Math.max(
+            Math.min(parentScrollLeft, childLeft),
+            childLeft + childWidth - parentWidth
+          );
+          const scrollTop = Math.max(
+            Math.min(parentScrollTop, childTop),
+            childTop + childHeight - parentHeight
+          );
+          barElem.scrollTo({
+            left: scrollLeft,
+            top: scrollTop,
+            behavior: "smooth"
+          });
+        }
+      });
+    }
+    const router = useRouter();
+    function applyNewValue(onlyLink = false) {
+      const enabledChildren = get(children).filter(
+        (child) => !child.props.disabled
+      );
+      if (enabledChildren.length > 0) {
+        let newModelValue = get(modelValue) || 0;
+        enabledChildren.forEach((child, index) => {
+          const props2 = child.props;
+          if (!onlyLink && index === 0 && props2.value)
+            newModelValue = props2.value;
+          const to = props2.to ? router.resolve(props2.to) : void 0;
+          if (props2.link !== false && to && isPathMatch(to.fullPath, props2))
+            newModelValue = to.fullPath;
+        });
+        updateModelValue(newModelValue);
+      }
+      keepActiveTabVisible();
+    }
+    onMounted(() => {
+      if (get(modelValue) !== void 0)
+        return;
+      applyNewValue();
+    });
+    watch(route, () => {
+      applyNewValue(true);
+    });
+    const { width, height } = useElementSize(bar);
+    const { width: wrapperWidth, height: wrapperHeight } = useElementSize(wrapper);
+    const { arrivedState, x, y } = useScroll(bar, { behavior: "smooth" });
+    const { top, bottom, left, right } = toRefs(arrivedState);
+    const { trigger: triggerHorizontal, stop: stopHorizontal } = watchTriggerable(
+      [wrapperWidth, width],
+      ([ww, w]) => {
+        if (w > 0)
+          set(showArrows, ww > w);
+      },
+      {
+        eventFilter: throttleFilter(50)
+      }
+    );
+    const { trigger: triggerVertical, stop: stopVertical } = watchTriggerable(
+      [wrapperHeight, height],
+      ([wh, h]) => {
+        if (h > 0)
+          set(showArrows, wh > h);
+      },
+      {
+        eventFilter: throttleFilter(500)
+      }
+    );
+    watchImmediate(vertical, (vertical2) => {
+      if (vertical2) {
+        triggerVertical();
+        stopHorizontal();
+      } else {
+        triggerHorizontal();
+        stopVertical();
+      }
+    });
+    const prevArrowDisabled = computed(() => {
+      if (!get(vertical))
+        return get(left);
+      return get(top);
+    });
+    const nextArrowDisabled = computed(() => {
+      if (!get(vertical))
+        return get(right);
+      return get(bottom);
+    });
+    function onPrevSliderClick() {
+      if (!get(vertical))
+        set(x, get(x) - get(width));
+      else
+        set(y, get(y) - get(height));
+    }
+    function onNextSliderClick() {
+      if (!get(vertical))
+        set(x, get(x) + get(width));
+      else
+        set(y, get(y) + get(height));
+    }
+    useResizeObserver(bar, () => {
+      keepActiveTabVisible();
+    });
+    watchImmediate(modelValue, (modelValue2) => {
+      set(internalModelValue, modelValue2);
+    });
+    watch(internalModelValue, () => {
+      keepActiveTabVisible();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([_ctx.$style.tabs, { [_ctx.$style["tabs--vertical"] ?? ""]: unref(vertical) }])
+      }, [
+        unref(showArrows) ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass([_ctx.$style.arrow, { [_ctx.$style["arrow--vertical"] ?? ""]: unref(vertical) }])
+        }, [
+          createVNode(RuiButton, {
+            class: "w-full h-full !rounded-none",
+            variant: "text",
+            color: unref(color),
+            disabled: unref(prevArrowDisabled),
+            onClick: _cache[0] || (_cache[0] = ($event) => onPrevSliderClick())
+          }, {
+            default: withCtx(() => [
+              createVNode(RuiIcon, {
+                name: unref(vertical) ? "lu-chevron-up" : "lu-chevron-left"
+              }, null, 8, ["name"])
+            ]),
+            _: 1
+          }, 8, ["color", "disabled"])
+        ], 2)) : createCommentVNode("", true),
+        createElementVNode("div", {
+          ref_key: "bar",
+          ref: bar,
+          class: normalizeClass(["no-scrollbar", [
+            _ctx.$style["tabs-bar"],
+            { [_ctx.$style["tabs-bar--vertical"] ?? ""]: unref(vertical) },
+            { [_ctx.$style["tabs-bar--grow"] ?? ""]: unref(grow) }
+          ]])
+        }, [
+          createElementVNode("div", {
+            ref_key: "wrapper",
+            ref: wrapper,
+            role: "tablist",
+            class: normalizeClass([
+              _ctx.$style["tabs-wrapper"],
+              { [_ctx.$style["tabs-wrapper--vertical"] ?? ""]: unref(vertical) },
+              { [_ctx.$style["tabs-wrapper--grow"] ?? ""]: unref(grow) }
+            ])
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(children), (child, i) => {
+              return openBlock(), createBlock(resolveDynamicComponent(child), {
+                key: i,
+                onClick: _cache[1] || (_cache[1] = ($event) => updateModelValue($event))
+              });
+            }), 128))
+          ], 2)
+        ], 2),
+        unref(showArrows) ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: normalizeClass([_ctx.$style.arrow, { [_ctx.$style["arrow--vertical"] ?? ""]: unref(vertical) }])
+        }, [
+          createVNode(RuiButton, {
+            class: "w-full h-full !rounded-none",
+            variant: "text",
+            color: unref(color),
+            disabled: unref(nextArrowDisabled),
+            onClick: _cache[2] || (_cache[2] = ($event) => onNextSliderClick())
+          }, {
+            default: withCtx(() => [
+              createVNode(RuiIcon, {
+                name: unref(vertical) ? "lu-chevron-down" : "lu-chevron-right"
+              }, null, 8, ["name"])
+            ]),
+            _: 1
+          }, 8, ["color", "disabled"])
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=RuiTabs.vue2.js.map

package/dist/components/tabs/tabs/RuiTabs.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuiTabs.vue2.js","sources":["../../../../src/components/tabs/tabs/RuiTabs.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Props as TabProps } from '@/components/tabs/tab/RuiTab.vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport { throttleFilter } from '@vueuse/shared';\nimport { Fragment, isVNode, type VNode } from 'vue';\nimport { useRoute, useRouter } from 'vue-router';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\n\nexport interface Props {\n  color?: ContextColorsType;\n  vertical?: boolean;\n  disabled?: boolean;\n  grow?: boolean;\n  modelValue?: number | string;\n  align?: 'start' | 'center' | 'end';\n  indicatorPosition?: 'start' | 'end';\n}\n\ndefineOptions({\n  name: 'RuiTabs',\n});\n\nconst props = withDefaults(defineProps<Props>(), {\n  color: undefined,\n  vertical: false,\n  disabled: false,\n  grow: false,\n  modelValue: undefined,\n  align: 'center',\n  indicatorPosition: 'end',\n});\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', modelValue: number | string): void;\n}>();\n\nconst { color, grow, modelValue, disabled, vertical, align, indicatorPosition } = toRefs(props);\n\nconst internalModelValue = ref();\nconst bar = ref<HTMLDivElement>();\nconst wrapper = ref<HTMLDivElement>();\nconst showArrows: Ref<boolean> = ref(false);\n\n// When using dynamic content with v-for the slot content can contain fragment,\n// Go through the fragment and always return RuiTab only\nfunction getChildrenTabs(children: VNode[]): VNode[] {\n  return children.flatMap((item) => {\n    if (item.type === Fragment && Array.isArray(item.children) && item.children.length > 0)\n      return getChildrenTabs(item.children.filter(isVNode));\n\n    return [item];\n  }).flat();\n}\n\nconst slots = useSlots();\nconst children = computed(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  const tabs = getChildrenTabs(slotContent);\n\n  const currentModelValue = get(internalModelValue);\n  const inheritedProps = {\n    color: get(color),\n    grow: get(grow),\n    disabled: get(disabled),\n    vertical: get(vertical),\n    align: get(align),\n    indicatorPosition: get(indicatorPosition),\n  };\n  return tabs.map((tab, index) => {\n    let tabValue = tab.props?.value ?? index;\n    if (tab.props?.link !== false && tab.props?.to)\n      tabValue = tab.props.to;\n\n    const active = currentModelValue === tabValue;\n    return {\n      ...tab,\n      props: {\n        value: tabValue,\n        active,\n        ...inheritedProps,\n        ...tab.props,\n      },\n    };\n  });\n});\n\nfunction updateModelValue(newModelValue: string | number) {\n  emit('update:modelValue', newModelValue);\n  set(internalModelValue, newModelValue);\n}\n\nconst route = useRoute();\n\nfunction isPathMatch(path: string, { exactPath, exact }: { exactPath?: boolean; exact?: boolean }) {\n  const currentRoute = route.fullPath;\n\n  if (exactPath)\n    return currentRoute === path;\n\n  const routeWithoutQueryParams = new URL(path, window.location.origin)\n    .pathname;\n\n  if (exact)\n    return currentRoute === routeWithoutQueryParams;\n\n  return currentRoute.startsWith(routeWithoutQueryParams);\n}\n\nfunction keepActiveTabVisible() {\n  nextTick(() => {\n    if (!get(showArrows))\n      return;\n\n    const elem = get(wrapper);\n    const barElem = get(bar);\n    if (elem) {\n      const activeTab = (elem.querySelector('.active-tab')\n        ?? elem.querySelector('.active-tab-link')) as HTMLElement;\n\n      if (!activeTab || !barElem)\n        return;\n\n      const childLeft = activeTab.offsetLeft - elem.offsetLeft;\n      const childTop = activeTab.offsetTop - elem.offsetTop;\n      const childWidth = activeTab.offsetWidth;\n      const childHeight = activeTab.offsetHeight;\n      const parentScrollLeft = barElem.scrollLeft;\n      const parentScrollTop = barElem.scrollTop;\n      const parentWidth = barElem.offsetWidth;\n      const parentHeight = barElem.offsetHeight;\n\n      const scrollLeft = Math.max(\n        Math.min(parentScrollLeft, childLeft),\n        childLeft + childWidth - parentWidth,\n      );\n\n      const scrollTop = Math.max(\n        Math.min(parentScrollTop, childTop),\n        childTop + childHeight - parentHeight,\n      );\n\n      barElem.scrollTo({\n        left: scrollLeft,\n        top: scrollTop,\n        behavior: 'smooth',\n      });\n    }\n  });\n}\n\nconst router = useRouter();\n\nfunction applyNewValue(onlyLink = false) {\n  const enabledChildren = get(children).filter(\n    child => !child.props.disabled,\n  );\n  if (enabledChildren.length > 0) {\n    let newModelValue: string | number = get(modelValue) || 0;\n    enabledChildren.forEach((child, index) => {\n      const props = child.props as TabProps;\n      if (!onlyLink && index === 0 && props.value)\n        newModelValue = props.value;\n\n      const to = props.to ? router.resolve(props.to) : undefined;\n\n      if (props.link !== false && to && isPathMatch(to.fullPath, props))\n        newModelValue = to.fullPath;\n    });\n    updateModelValue(newModelValue);\n  }\n  keepActiveTabVisible();\n}\n\nonMounted(() => {\n  if (get(modelValue) !== undefined)\n    return;\n\n  applyNewValue();\n});\n\nwatch(route, () => {\n  applyNewValue(true);\n});\n\nconst { width, height } = useElementSize(bar);\nconst { width: wrapperWidth, height: wrapperHeight } = useElementSize(wrapper);\nconst { arrivedState, x, y } = useScroll(bar, { behavior: 'smooth' });\n\nconst { top, bottom, left, right } = toRefs(arrivedState);\n\nconst { trigger: triggerHorizontal, stop: stopHorizontal } = watchTriggerable(\n  [wrapperWidth, width],\n  ([ww, w]) => {\n    if (w > 0)\n      set(showArrows, ww > w);\n  },\n  {\n    eventFilter: throttleFilter(50),\n  },\n);\n\nconst { trigger: triggerVertical, stop: stopVertical } = watchTriggerable(\n  [wrapperHeight, height],\n  ([wh, h]) => {\n    if (h > 0)\n      set(showArrows, wh > h);\n  },\n  {\n    eventFilter: throttleFilter(500),\n  },\n);\n\nwatchImmediate(vertical, (vertical) => {\n  if (vertical) {\n    triggerVertical();\n    stopHorizontal();\n  }\n  else {\n    triggerHorizontal();\n    stopVertical();\n  }\n});\n\nconst prevArrowDisabled = computed(() => {\n  if (!get(vertical))\n    return get(left);\n\n  return get(top);\n});\n\nconst nextArrowDisabled = computed(() => {\n  if (!get(vertical))\n    return get(right);\n\n  return get(bottom);\n});\n\nfunction onPrevSliderClick() {\n  if (!get(vertical))\n    set(x, get(x) - get(width));\n  else\n    set(y, get(y) - get(height));\n}\n\nfunction onNextSliderClick() {\n  if (!get(vertical))\n    set(x, get(x) + get(width));\n  else\n    set(y, get(y) + get(height));\n}\n\nuseResizeObserver(bar, () => {\n  keepActiveTabVisible();\n});\n\nwatchImmediate(modelValue, (modelValue) => {\n  set(internalModelValue, modelValue);\n});\n\nwatch(internalModelValue, () => {\n  keepActiveTabVisible();\n});\n</script>\n\n<template>\n  <div :class=\"[$style.tabs, { [$style['tabs--vertical'] ?? '']: vertical }]\">\n    <div\n      v-if=\"showArrows\"\n      :class=\"[$style.arrow, { [$style['arrow--vertical'] ?? '']: vertical }]\"\n    >\n      <RuiButton\n        class=\"w-full h-full !rounded-none\"\n        variant=\"text\"\n        :color=\"color\"\n        :disabled=\"prevArrowDisabled\"\n        @click=\"onPrevSliderClick()\"\n      >\n        <RuiIcon :name=\"vertical ? 'lu-chevron-up' : 'lu-chevron-left'\" />\n      </RuiButton>\n    </div>\n    <div\n      ref=\"bar\"\n      class=\"no-scrollbar\"\n      :class=\"[\n        $style['tabs-bar'],\n        { [$style['tabs-bar--vertical'] ?? '']: vertical },\n        { [$style['tabs-bar--grow'] ?? '']: grow },\n      ]\"\n    >\n      <div\n        ref=\"wrapper\"\n        role=\"tablist\"\n        :class=\"[\n          $style['tabs-wrapper'],\n          { [$style['tabs-wrapper--vertical'] ?? '']: vertical },\n          { [$style['tabs-wrapper--grow'] ?? '']: grow },\n        ]\"\n      >\n        <Component\n          :is=\"child\"\n          v-for=\"(child, i) in children\"\n          :key=\"i\"\n          @click=\"updateModelValue($event)\"\n        />\n      </div>\n    </div>\n    <div\n      v-if=\"showArrows\"\n      :class=\"[$style.arrow, { [$style['arrow--vertical'] ?? '']: vertical }]\"\n    >\n      <RuiButton\n        class=\"w-full h-full !rounded-none\"\n        variant=\"text\"\n        :color=\"color\"\n        :disabled=\"nextArrowDisabled\"\n        @click=\"onNextSliderClick()\"\n      >\n        <RuiIcon :name=\"vertical ? 'lu-chevron-down' : 'lu-chevron-right'\" />\n      </RuiButton>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" module>\n.tabs {\n  @apply flex h-[2.625rem];\n\n  &--vertical {\n    @apply h-auto max-h-full flex-col;\n  }\n\n  &-bar {\n    @apply max-h-full overflow-auto;\n\n    &--vertical,\n    &--grow {\n      @apply w-full;\n    }\n  }\n\n  &-wrapper {\n    @apply h-full inline-flex max-w-none;\n\n    &--vertical {\n      @apply flex-col h-auto;\n    }\n\n    &--vertical,\n    &--grow {\n      @apply min-w-full;\n    }\n  }\n}\n\n.arrow {\n  @apply h-full w-10;\n\n  &--vertical {\n    @apply min-h-[2.625rem] w-full h-auto;\n  }\n}\n</style>\n"],"names":["children","props","vertical","modelValue","_createElementBlock","$style","_unref","_createVNode","_createElementVNode","_normalizeClass","_openBlock","_Fragment","_renderList","_createBlock","_resolveDynamicComponent"],"mappings":"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"}

package/dist/components/tabs/tabs/RuiTabs.vue3.js

@@ -0,0 +1,20 @@
+const tabs = "_tabs_1a7up_1";
+const arrow = "_arrow_1a7up_23";
+const style0 = {
+  tabs,
+  "tabs--vertical": "_tabs--vertical_1a7up_4",
+  "tabs-bar": "_tabs-bar_1a7up_7",
+  "tabs-bar--vertical": "_tabs-bar--vertical_1a7up_10",
+  "tabs-bar--grow": "_tabs-bar--grow_1a7up_10",
+  "tabs-wrapper": "_tabs-wrapper_1a7up_13",
+  "tabs-wrapper--vertical": "_tabs-wrapper--vertical_1a7up_16",
+  "tabs-wrapper--grow": "_tabs-wrapper--grow_1a7up_19",
+  arrow,
+  "arrow--vertical": "_arrow--vertical_1a7up_26"
+};
+export {
+  arrow,
+  style0 as default,
+  tabs
+};
+//# sourceMappingURL=RuiTabs.vue3.js.map

package/dist/components/tabs/tabs/RuiTabs.vue3.js.map

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

package/dist/components/time-picker/RuiTimePicker.vue.d.ts

@@ -1,4 +1,4 @@
-import { TimeAccuracy } from '../../consts/time-accuracy';
+import { TimeAccuracy } from '../../consts/time-accuracy.js';
 export type TimePickerSelection = 'hour' | 'minute' | 'second' | 'millisecond';
 export interface RuiTimePickerProps {
     accuracy?: TimeAccuracy;

package/dist/components/time-picker/RuiTimePicker.vue.js

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

package/dist/components/time-picker/RuiTimePicker.vue.js.map

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