@abraca/nuxt 1.8.2 → 2.0.0

package/dist/runtime/components/AServerInfoModal.vue

@@ -0,0 +1,150 @@
+<script setup>
+import { ref, computed } from "vue";
+import { useAbracadabra } from "../composables/useAbracadabra";
+const props = defineProps({
+  open: { type: Boolean, required: false },
+  serverUrl: { type: String, required: false },
+  version: { type: String, required: false },
+  connected: { type: Boolean, required: false },
+  capabilities: { type: Array, required: false },
+  title: { type: String, required: false },
+  switchable: { type: Boolean, required: false }
+});
+const emit = defineEmits(["update:open", "switch-server", "reconnect"]);
+const _abra = useAbracadabra();
+const _serverUrl = computed(
+  () => props.serverUrl ?? (_abra.currentServerUrl?.value ?? "")
+);
+const open = computed({
+  get: () => !!props.open,
+  set: (v) => emit("update:open", v)
+});
+const copied = ref(false);
+async function copyUrl() {
+  if (!_serverUrl.value) return;
+  try {
+    await navigator.clipboard.writeText(_serverUrl.value);
+    copied.value = true;
+    setTimeout(() => {
+      copied.value = false;
+    }, 1500);
+  } catch (e) {
+    if (import.meta.dev) console.warn("[abracadabra] server-info: copy failed:", e);
+  }
+}
+</script>
+
+<template>
+  <UModal
+    v-model:open="open"
+    :title="title ?? 'Server'"
+    :ui="{ content: 'sm:max-w-md' }"
+  >
+    <template #body>
+      <div class="flex flex-col gap-4">
+        <div class="flex items-center gap-3">
+          <div
+            class="size-10 rounded-lg flex items-center justify-center"
+            :class="connected ? 'bg-(--ui-success)/10 text-(--ui-success)' : 'bg-(--ui-bg-elevated) text-(--ui-text-muted)'"
+          >
+            <UIcon
+              :name="connected ? 'i-lucide-cloud' : 'i-lucide-cloud-off'"
+              class="size-5"
+            />
+          </div>
+          <div class="flex-1 min-w-0">
+            <div class="text-sm font-semibold text-(--ui-text-highlighted) truncate">
+              {{ _serverUrl || "No server" }}
+            </div>
+            <div class="text-xs text-(--ui-text-muted)">
+              <span :class="connected ? 'text-(--ui-success)' : ''">
+                {{ connected ? "Connected" : "Disconnected" }}
+              </span>
+              <template v-if="version">
+                · v{{ version }}
+              </template>
+            </div>
+          </div>
+          <UButton
+            :icon="copied ? 'i-lucide-check' : 'i-lucide-copy'"
+            size="xs"
+            variant="ghost"
+            color="neutral"
+            :disabled="!_serverUrl"
+            @click="copyUrl"
+          />
+        </div>
+
+        <div
+          v-if="capabilities?.length"
+          class="flex flex-col gap-1"
+        >
+          <label class="text-xs font-medium text-(--ui-text-muted) px-1">Capabilities</label>
+          <div class="rounded-md border border-(--ui-border) overflow-hidden divide-y divide-(--ui-border)">
+            <div
+              v-for="cap in capabilities"
+              :key="cap.label"
+              class="flex items-center gap-2.5 px-3 py-2 text-sm bg-(--ui-bg)"
+            >
+              <UIcon
+                :name="cap.icon"
+                class="size-4 text-(--ui-text-muted) shrink-0"
+              />
+              <span class="flex-1 text-(--ui-text)">{{ cap.label }}</span>
+              <span
+                v-if="typeof cap.value === 'boolean'"
+                class="text-xs"
+                :class="cap.value ? 'text-(--ui-success)' : 'text-(--ui-text-dimmed)'"
+              >
+                {{ cap.value ? "on" : "off" }}
+              </span>
+              <span
+                v-else
+                class="text-xs font-mono text-(--ui-text-muted)"
+              >
+                {{ cap.value }}
+              </span>
+            </div>
+          </div>
+        </div>
+
+        <slot
+          name="extra"
+          :server-url="_serverUrl"
+          :version="version"
+        />
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex items-center justify-between gap-2 w-full">
+        <UButton
+          variant="ghost"
+          color="neutral"
+          size="sm"
+          icon="i-lucide-refresh-cw"
+          label="Reconnect"
+          @click="emit('reconnect')"
+        />
+        <div class="flex items-center gap-2">
+          <UButton
+            v-if="switchable"
+            variant="outline"
+            color="neutral"
+            size="sm"
+            icon="i-lucide-arrow-right-left"
+            label="Switch server"
+            @click="emit('switch-server')"
+          />
+          <UButton
+            variant="solid"
+            color="primary"
+            size="sm"
+            label="Done"
+            @click="open = false"
+          />
+        </div>
+      </div>
+    </template>
+  </UModal>
+</template>

package/dist/runtime/components/AServerInfoModal.vue.d.ts

@@ -0,0 +1,43 @@
+export interface ServerCapability {
+    icon: string;
+    label: string;
+    value: string | boolean;
+}
+type __VLS_Props = {
+    open?: boolean;
+    /** Server URL override. Defaults to useAbracadabra().currentServerUrl. */
+    serverUrl?: string;
+    /** Server version string. */
+    version?: string;
+    /** Whether the connection is currently healthy. */
+    connected?: boolean;
+    /** Custom capability rows shown in the body. */
+    capabilities?: ServerCapability[];
+    title?: string;
+    /** Show the "Switch server" footer button. Default: false. */
+    switchable?: boolean;
+};
+declare var __VLS_26: {
+    serverUrl: string;
+    version: string | undefined;
+};
+type __VLS_Slots = {} & {
+    extra?: (props: typeof __VLS_26) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (open: boolean) => any;
+    reconnect: () => any;
+    "switch-server": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:open"?: ((open: boolean) => any) | undefined;
+    onReconnect?: (() => any) | undefined;
+    "onSwitch-server"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ASpaceFormModal.vue

@@ -29,7 +29,7 @@ async function handleCreate() {
       description: description.value.trim() || void 0,
       visibility: visibility.value
     });
-    emit("created", { id: result.doc_id });
+    emit("created", { id: result.id });
     emit("update:open", false);
   } catch (e) {
     error.value = e?.message ?? "Failed to create space";

package/dist/runtime/components/aware/AAccordion.d.vue.ts

@@ -0,0 +1,25 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    live?: boolean;
+    total?: boolean;
+};
+declare var __VLS_9: string, __VLS_10: any, __VLS_27: string, __VLS_28: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+} & {
+    [K in NonNullable<typeof __VLS_27>]?: (props: typeof __VLS_28) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    awareness: boolean;
+    live: boolean;
+    total: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/aware/AAccordion.vue

@@ -0,0 +1,107 @@
+<script setup>
+import { computed, ref, useAttrs, watch } from "vue";
+import { useAAField } from "../../composables/useAAField";
+import { useAAUIState } from "../../composables/useAAUIState";
+import AHoverItem from "./AHoverItem.vue";
+function itemId(item) {
+  if (item == null) return "";
+  if (typeof item === "string") return item;
+  return String(item.value ?? item.id ?? item.label ?? "");
+}
+function itemLabel(item) {
+  if (item == null) return "";
+  if (typeof item === "string") return item;
+  return String(item.label ?? item.value ?? item.id ?? "");
+}
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  fieldKey: { type: String, required: true },
+  awareness: { type: Boolean, required: false, default: true },
+  live: { type: Boolean, required: false, default: false },
+  total: { type: Boolean, required: false, default: false }
+});
+const enableAwareness = computed(() => props.awareness || props.total);
+const enableLive = computed(() => props.live || props.total);
+const attrs = useAttrs();
+const { hoverers, focusers, hoverHandlers } = useAAField(() => props.fieldKey);
+const liveExpanded = useAAUIState(() => `${props.fieldKey}:expanded`, { defaultValue: "" });
+const hasExternalModel = computed(
+  () => "modelValue" in attrs || "onUpdate:modelValue" in attrs
+);
+const local = ref(enableLive.value ? liveExpanded.value ?? "" : "");
+watch(liveExpanded, (val) => {
+  if (!enableLive.value) return;
+  if (JSON.stringify(local.value) !== JSON.stringify(val)) local.value = val ?? "";
+});
+watch(local, (val) => {
+  if (!enableLive.value) return;
+  if (JSON.stringify(liveExpanded.value) !== JSON.stringify(val)) liveExpanded.value = val;
+});
+const ringStyle = computed(() => {
+  if (!enableAwareness.value) return void 0;
+  const focusColor = focusers.value[0]?.user?.color;
+  const hoverColor = hoverers.value[0]?.user?.color;
+  if (!focusColor && !hoverColor) return void 0;
+  const layers = [];
+  if (hoverColor) layers.push(`0 0 0 1px ${hoverColor}40`);
+  if (focusColor) layers.push(`0 0 0 2px ${focusColor}`);
+  return {
+    boxShadow: layers.join(", "),
+    borderRadius: "var(--ui-radius, 0.375rem)",
+    transition: "box-shadow 150ms ease"
+  };
+});
+const eventHandlers = computed(() => enableAwareness.value ? hoverHandlers : {});
+</script>
+
+<template>
+  <div
+    class="aa-host aa-host--block"
+    :style="ringStyle"
+    v-on="eventHandlers"
+  >
+    <UAccordion
+      v-if="enableLive && !hasExternalModel"
+      v-model="local"
+      v-bind="attrs"
+    >
+      <template
+        v-for="(_, name) in $slots"
+        #[name]="slotData"
+      >
+        <slot
+          :name="name"
+          v-bind="slotData ?? {}"
+        />
+      </template>
+      <template #trigger="{ item }">
+        <AHoverItem :field-key="`${fieldKey}:item:${itemId(item)}`" variant="block" :show-flag="false">
+          {{ itemLabel(item) }}
+        </AHoverItem>
+      </template>
+    </UAccordion>
+    <UAccordion
+      v-else
+      v-bind="attrs"
+    >
+      <template
+        v-for="(_, name) in $slots"
+        #[name]="slotData"
+      >
+        <slot
+          :name="name"
+          v-bind="slotData ?? {}"
+        />
+      </template>
+      <template #trigger="{ item }">
+        <AHoverItem :field-key="`${fieldKey}:item:${itemId(item)}`" variant="block" :show-flag="false">
+          {{ itemLabel(item) }}
+        </AHoverItem>
+      </template>
+    </UAccordion>
+  </div>
+</template>
+
+<style scoped>
+.aa-host{border-radius:var(--ui-radius,.375rem);position:relative}.aa-host--block{display:block}
+</style>

package/dist/runtime/components/aware/AAccordion.vue.d.ts

@@ -0,0 +1,25 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    live?: boolean;
+    total?: boolean;
+};
+declare var __VLS_9: string, __VLS_10: any, __VLS_27: string, __VLS_28: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+} & {
+    [K in NonNullable<typeof __VLS_27>]?: (props: typeof __VLS_28) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    awareness: boolean;
+    live: boolean;
+    total: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/aware/AArea.vue

@@ -6,30 +6,43 @@ const props = defineProps({
   tag: { type: String, required: false, default: "div" },
   max: { type: Number, required: false, default: 3 }
 });
-const { hoverers, hoverHandlers } = useAAField(props.fieldKey);
-const hoverRingStyle = computed(() => {
-  if (!hoverers.value.length) return {};
-  const color = hoverers.value[0]?.user?.color;
-  if (!color) return {};
-  return { boxShadow: `0 0 0 1px ${color}`, borderRadius: "0.375rem" };
+import { awareRingStyle } from "../../utils/awareRingStyle";
+const { hoverers, pressers, isPressed, hoverPressHandlers } = useAAField(props.fieldKey);
+const hoverRingStyle = computed(() => awareRingStyle({
+  hover: hoverers.value[0]?.user?.color,
+  press: pressers.value[0]?.user?.color
+}) ?? {});
+const allPeers = computed(() => {
+  const seen = /* @__PURE__ */ new Set();
+  const out = [];
+  for (const p of pressers.value) if (!seen.has(p.clientId)) {
+    seen.add(p.clientId);
+    out.push(p);
+  }
+  for (const p of hoverers.value) if (!seen.has(p.clientId)) {
+    seen.add(p.clientId);
+    out.push(p);
+  }
+  return out;
 });
 </script>
 
 <template>
   <component
     :is="tag"
-    class="relative"
+    class="relative aa-area-host"
+    :class="{ 'aa-area-host--pressed': isPressed }"
     :style="hoverRingStyle"
-    v-on="hoverHandlers"
+    v-on="hoverPressHandlers"
   >
     <slot />
     <Transition name="aa-peer">
       <span
-        v-if="hoverers.length"
+        v-if="allPeers.length"
         class="absolute -top-2 right-1 flex -space-x-1 pointer-events-none z-10"
       >
         <AAvatar
-          v-for="p in hoverers.slice(0, max)"
+          v-for="p in allPeers.slice(0, max)"
           :key="p.clientId"
           :user="p"
           size="2xs"
@@ -42,5 +55,5 @@ const hoverRingStyle = computed(() => {
 </template>
 
 <style scoped>
-.aa-peer-enter-active,.aa-peer-leave-active{transition:opacity .15s ease}.aa-peer-enter-from,.aa-peer-leave-to{opacity:0}
+.aa-peer-enter-active,.aa-peer-leave-active{transition:opacity .15s ease}.aa-peer-enter-from,.aa-peer-leave-to{opacity:0}.aa-area-host{transition:filter .12s ease}.aa-area-host--pressed{filter:brightness(.92)}
 </style>

package/dist/runtime/components/aware/AAvatar.d.vue.ts

@@ -10,6 +10,11 @@ type __VLS_Props = {
     showPopover?: boolean;
     /** Current viewer's docId — used to show "In this document" vs "Elsewhere" */
     currentDocId?: string;
+    /** When true and the peer has a `statusIcon`, render that icon centred
+     *  inside the colored ring instead of UAvatar's initials. Per-call so
+     *  the consumer can opt into the look without affecting other call
+     *  sites (e.g. show on the local user's own avatar but not on peers). */
+    useStatusAsAvatar?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     follow: (user: AwarenessUser) => any;
@@ -20,6 +25,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     showStatus: boolean;
     showTooltip: boolean;
     showPopover: boolean;
+    useStatusAsAvatar: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/aware/AAvatar.vue

@@ -9,19 +9,40 @@ const props = defineProps({
   showStatus: { type: Boolean, required: false, default: true },
   showTooltip: { type: Boolean, required: false, default: true },
   showPopover: { type: Boolean, required: false, default: false },
-  currentDocId: { type: String, required: false }
+  currentDocId: { type: String, required: false },
+  useStatusAsAvatar: { type: Boolean, required: false, default: false }
 });
 const emit = defineEmits(["follow"]);
 const appConfig = useAppConfig();
 const neutral = computed(() => appConfig.ui?.colors?.neutral ?? "zinc");
 const name = computed(() => props.user.user?.name || "Anonymous");
 const color = computed(() => props.user.user?.color);
+const statusIconRaw = computed(() => props.user.user?.statusIcon ?? "");
+const statusIcon = computed(
+  () => statusIconRaw.value ? statusIconRaw.value.startsWith("i-") ? statusIconRaw.value : `i-lucide-${statusIconRaw.value}` : ""
+);
+const statusText = computed(() => props.user.user?.statusText ?? "");
+const showStatusAsAvatar = computed(() => props.useStatusAsAvatar && !!statusIcon.value);
 const avatarStyle = computed(
   () => color.value ? avatarBorderStyle(color.value, neutral.value) : ""
 );
+const statusIconClass = computed(() => {
+  switch (props.size) {
+    case "2xs":
+      return "size-3";
+    case "xs":
+      return "size-3";
+    case "md":
+      return "size-4";
+    case "lg":
+      return "size-5";
+    default:
+      return "size-3.5";
+  }
+});
 const tooltipText = computed(() => {
-  if (props.idle) return `${name.value} \xB7 idle`;
-  return name.value;
+  const base = props.idle ? `${name.value} \xB7 idle` : name.value;
+  return statusText.value ? `${base} \u2014 ${statusText.value}` : base;
 });
 const chipColor = computed(() => {
   if (props.idle === void 0) return void 0;
@@ -84,6 +105,13 @@ const popoverOpen = ref(false);
             <p class="text-sm font-semibold text-default truncate">
               {{ name }}
             </p>
+            <p
+              v-if="statusText"
+              class="text-xs text-default truncate flex items-center gap-1"
+            >
+              <UIcon v-if="statusIcon" :name="statusIcon" class="size-3 shrink-0 text-muted" />
+              <span class="truncate">{{ statusText }}</span>
+            </p>
             <p
               v-if="docContext"
               class="text-xs text-muted truncate"
@@ -123,6 +151,7 @@ const popoverOpen = ref(false);
         :alt="name"
         :size="size"
         :style="avatarStyle"
+        :icon="showStatusAsAvatar ? statusIcon : void 0"
       />
     </UChip>
     <UAvatar
@@ -145,6 +174,7 @@ const popoverOpen = ref(false);
         :alt="name"
         :size="size"
         :style="avatarStyle"
+        :icon="showStatusAsAvatar ? statusIcon : void 0"
       />
     </UChip>
     <UAvatar

package/dist/runtime/components/aware/AAvatar.vue.d.ts

@@ -10,6 +10,11 @@ type __VLS_Props = {
     showPopover?: boolean;
     /** Current viewer's docId — used to show "In this document" vs "Elsewhere" */
     currentDocId?: string;
+    /** When true and the peer has a `statusIcon`, render that icon centred
+     *  inside the colored ring instead of UAvatar's initials. Per-call so
+     *  the consumer can opt into the look without affecting other call
+     *  sites (e.g. show on the local user's own avatar but not on peers). */
+    useStatusAsAvatar?: boolean;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     follow: (user: AwarenessUser) => any;
@@ -20,6 +25,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     showStatus: boolean;
     showTooltip: boolean;
     showPopover: boolean;
+    useStatusAsAvatar: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/aware/AAvatarGroup.d.vue.ts

@@ -0,0 +1,10 @@
+type __VLS_Props = {
+    max?: number;
+    size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "2xs" | "xs" | "sm" | "md" | "lg";
+    max: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/aware/AAvatarGroup.vue

@@ -0,0 +1,30 @@
+<script setup>
+import { computed } from "vue";
+import { useAwarenessPeers } from "../../composables/useAwarenessPeers";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  max: { type: Number, required: false, default: 5 },
+  size: { type: String, required: false, default: "sm" }
+});
+const { peers } = useAwarenessPeers();
+const visible = computed(() => peers.value.slice(0, props.max));
+const overflow = computed(() => Math.max(0, peers.value.length - visible.value.length));
+</script>
+
+<template>
+  <UAvatarGroup :size="size">
+    <AAvatar
+      v-for="p in visible"
+      :key="p.clientId"
+      :user="p"
+      :size="size"
+      :show-status="false"
+      :show-tooltip="true"
+    />
+    <UAvatar
+      v-if="overflow > 0"
+      :alt="`+${overflow}`"
+      :size="size"
+    />
+  </UAvatarGroup>
+</template>

package/dist/runtime/components/aware/AAvatarGroup.vue.d.ts

@@ -0,0 +1,10 @@
+type __VLS_Props = {
+    max?: number;
+    size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg';
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "2xs" | "xs" | "sm" | "md" | "lg";
+    max: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/aware/AButton.d.vue.ts

@@ -1,7 +1,9 @@
 type __VLS_Props = {
-    /** Unique field key for awareness broadcasting. Convention: "{scope}:{id}" */
     fieldKey: string;
+    max?: number;
 };
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    max: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;