@abraca/nuxt 1.9.1 → 2.0.0

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

@@ -0,0 +1,75 @@
+<script setup>
+import { computed, useAttrs } from "vue";
+import { useAAField } from "../../composables/useAAField";
+import { useAAFieldValue } from "../../composables/useAAFieldValue";
+import { awareRingStyle } from "../../utils/awareRingStyle";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  fieldKey: { type: String, required: true },
+  sync: { type: Boolean, required: false, default: false },
+  max: { type: Number, required: false, default: 3 }
+});
+const attrs = useAttrs();
+const { hoverers, focusers, pressers, isPressed, handlers } = useAAField(() => props.fieldKey);
+const synced = useAAFieldValue(() => props.fieldKey);
+const hasExternalModel = computed(
+  () => "modelValue" in attrs || "onUpdate:modelValue" in attrs
+);
+const ringStyle = computed(() => awareRingStyle({
+  hover: hoverers.value[0]?.user?.color,
+  focus: focusers.value[0]?.user?.color,
+  press: pressers.value[0]?.user?.color,
+  radius: "9999px"
+}));
+const overlayPeers = computed(() => {
+  const seen = /* @__PURE__ */ new Set();
+  const out = [];
+  for (const p of focusers.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>
+  <span
+    class="aa-host aa-host--inline"
+    :class="{ 'aa-host--pressed': isPressed }"
+    :style="ringStyle"
+    v-on="handlers"
+  >
+    <USwitch
+      v-if="props.sync && !hasExternalModel"
+      v-model="synced"
+      v-bind="attrs"
+    />
+    <USwitch
+      v-else
+      v-bind="attrs"
+    />
+    <Transition name="aa-peer">
+      <span
+        v-if="overlayPeers.length"
+        class="aa-overlay"
+      >
+        <AAvatar
+          v-for="p in overlayPeers.slice(0, max)"
+          :key="p.clientId"
+          :user="p"
+          size="2xs"
+          :show-status="false"
+          :show-tooltip="true"
+        />
+      </span>
+    </Transition>
+  </span>
+</template>
+
+<style scoped>
+.aa-host{border-radius:9999px;position:relative;transition:filter .12s ease}.aa-host--inline{align-items:center;display:inline-flex}.aa-host--pressed{filter:brightness(.85)}.aa-overlay{display:flex;gap:0;pointer-events:none;position:absolute;right:0;top:-.625rem;z-index:10}.aa-overlay>*+*{margin-left:-.25rem}.aa-peer-enter-active,.aa-peer-leave-active{transition:opacity .15s ease}.aa-peer-enter-from,.aa-peer-leave-to{opacity:0}
+</style>

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

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    fieldKey: string;
+    sync?: boolean;
+    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<{}>, {
+    sync: boolean;
+    max: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -0,0 +1,23 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    peers?: boolean;
+    total?: boolean;
+};
+declare var __VLS_9: string, __VLS_10: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    peers: boolean;
+    awareness: 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/ATable.vue

@@ -0,0 +1,97 @@
+<script setup>
+import { computed, ref, useAttrs, watch } from "vue";
+import { useAAField } from "../../composables/useAAField";
+import { useAAEphemeral } from "../../composables/useAAEphemeral";
+import { awareRingStyle } from "../../utils/awareRingStyle";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  fieldKey: { type: String, required: true },
+  awareness: { type: Boolean, required: false, default: true },
+  peers: { type: Boolean, required: false, default: false },
+  total: { type: Boolean, required: false, default: false }
+});
+const enableAwareness = computed(() => props.awareness || props.total);
+const enablePeers = computed(() => props.peers || props.total);
+const attrs = useAttrs();
+const { hoverers, focusers, pressers, isPressed, hoverHandlers } = useAAField(() => props.fieldKey);
+const ringStyle = computed(
+  () => enableAwareness.value ? awareRingStyle({
+    hover: hoverers.value[0]?.user?.color,
+    focus: focusers.value[0]?.user?.color,
+    press: pressers.value[0]?.user?.color
+  }) : void 0
+);
+const { peers: hoveredRowPeers, setLocal: setHoveredRow } = useAAEphemeral(() => `${props.fieldKey}:hoveredRow`);
+const hostRef = ref(null);
+function onRowOver(e) {
+  if (!enablePeers.value) return;
+  const tr = e.target?.closest("tr");
+  const id = tr?.getAttribute("data-row-id") || tr?.dataset.rowKey || tr?.getAttribute("aria-rowindex");
+  if (id) setHoveredRow(id);
+}
+function onRowOut() {
+  if (!enablePeers.value) return;
+  setHoveredRow(null);
+}
+watch([hoveredRowPeers, hostRef], () => {
+  const host = hostRef.value;
+  if (!host) return;
+  for (const tr of host.querySelectorAll("tr[data-aa-peer]")) {
+    tr.style.backgroundColor = "";
+    tr.style.boxShadow = "";
+    tr.removeAttribute("data-aa-peer");
+  }
+  if (!enablePeers.value) return;
+  for (const p of hoveredRowPeers.value) {
+    const id = String(p.value);
+    const tr = host.querySelector(`tr[data-row-id="${id}"], tr[data-row-key="${id}"], tr[aria-rowindex="${id}"]`);
+    if (!tr) continue;
+    const color = p.user?.color ?? "currentColor";
+    tr.style.backgroundColor = colorMix(color, 0.15);
+    tr.style.boxShadow = `inset 3px 0 0 0 ${color}`;
+    tr.setAttribute("data-aa-peer", String(p.clientId));
+  }
+}, { deep: true, flush: "post" });
+function colorMix(color, alpha) {
+  if (color.startsWith("#") && color.length === 7) {
+    const a = Math.round(alpha * 255).toString(16).padStart(2, "0");
+    return `${color}${a}`;
+  }
+  if (color.startsWith("rgb(")) return color.replace("rgb(", "rgba(").replace(")", `, ${alpha})`);
+  if (color.startsWith("hsl(")) return color.replace("hsl(", "hsla(").replace(")", `, ${alpha})`);
+  return color;
+}
+</script>
+
+<template>
+  <div
+    ref="hostRef"
+    class="aa-table-host aa-host"
+    :class="{ 'aa-host--pressed': isPressed }"
+    :style="ringStyle"
+    v-on="enableAwareness ? hoverHandlers : {}"
+    @mouseover="onRowOver"
+    @mouseleave="onRowOut"
+  >
+    <UTable v-bind="attrs">
+      <template v-for="(_, name) in $slots" #[name]="slotData">
+        <slot :name="name" v-bind="slotData ?? {}" />
+      </template>
+    </UTable>
+    <div v-if="enablePeers && hoveredRowPeers.length" class="aa-table-peers">
+      <span
+        v-for="p in hoveredRowPeers"
+        :key="p.clientId"
+        class="aa-table-peer-chip"
+        :style="{ borderColor: p.user?.color ?? 'var(--ui-border)' }"
+      >
+        <span class="aa-table-peer-dot" :style="{ background: p.user?.color ?? 'var(--ui-text-muted)' }" />
+        {{ p.user?.name || "Anonymous" }} on row #{{ p.value }}
+      </span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.aa-table-host{position:relative;transition:filter .12s ease,box-shadow .1s ease}.aa-host--pressed{filter:brightness(.94)}.aa-table-peers{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.5rem}.aa-table-peer-chip{align-items:center;border:1px solid var(--ui-border);border-radius:999px;color:var(--ui-text-highlighted);display:inline-flex;font-size:.6875rem;font-weight:500;gap:.35rem;padding:.15rem .55rem}.aa-table-peer-dot{border-radius:999px;height:.5rem;width:.5rem}
+</style>

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

@@ -0,0 +1,23 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    peers?: boolean;
+    total?: boolean;
+};
+declare var __VLS_9: string, __VLS_10: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    peers: boolean;
+    awareness: 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/ATabs.d.vue.ts

@@ -0,0 +1,27 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    live?: boolean;
+    peers?: 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<{}>, {
+    peers: boolean;
+    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/ATabs.vue

@@ -0,0 +1,128 @@
+<script setup>
+import { computed, ref, useAttrs, watch } from "vue";
+import { useAAField } from "../../composables/useAAField";
+import { useAAUIState } from "../../composables/useAAUIState";
+import { useAAEphemeral } from "../../composables/useAAEphemeral";
+import AHoverItem from "./AHoverItem.vue";
+function tabId(item) {
+  if (item == null) return "";
+  if (typeof item === "string") return item;
+  return String(item.value ?? item.id ?? item.label ?? "");
+}
+function tabLabel(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 },
+  peers: { 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 enablePeers = computed(() => props.peers || props.total);
+const attrs = useAttrs();
+const { hoverers, focusers, hoverHandlers } = useAAField(() => props.fieldKey);
+const liveActive = useAAUIState(() => `${props.fieldKey}:active`, { defaultValue: "" });
+const { peers: peerActives, setLocal } = useAAEphemeral(() => `${props.fieldKey}:active`);
+const hasExternalModel = computed(
+  () => "modelValue" in attrs || "onUpdate:modelValue" in attrs
+);
+const local = ref(enableLive.value ? liveActive.value || "" : "");
+watch(liveActive, (val) => {
+  if (!enableLive.value) return;
+  const next = val || "";
+  if (local.value !== next) local.value = next;
+});
+watch(local, (val) => {
+  if (enableLive.value && (liveActive.value || "") !== val) liveActive.value = val;
+  if (enablePeers.value) setLocal(val || null);
+});
+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"
+  >
+    <UTabs
+      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:${tabId(item)}`" variant="block" :show-flag="false">
+          {{ tabLabel(item) }}
+        </AHoverItem>
+      </template>
+    </UTabs>
+    <UTabs
+      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:${tabId(item)}`" variant="block" :show-flag="false">
+          {{ tabLabel(item) }}
+        </AHoverItem>
+      </template>
+    </UTabs>
+
+    <Transition name="aa-peer">
+      <span
+        v-if="enablePeers && peerActives.length"
+        class="aa-overlay"
+      >
+        <AAvatar
+          v-for="p in peerActives.slice(0, 5)"
+          :key="p.clientId"
+          :user="{ clientId: p.clientId, user: p.user, docId: p.value }"
+          size="2xs"
+          :show-status="false"
+          :show-tooltip="true"
+        />
+      </span>
+    </Transition>
+  </div>
+</template>
+
+<style scoped>
+.aa-host{border-radius:var(--ui-radius,.375rem);position:relative}.aa-host--block{display:block}.aa-overlay{display:flex;gap:0;pointer-events:none;position:absolute;right:0;top:-.625rem;z-index:10}.aa-overlay>*+*{margin-left:-.25rem}.aa-peer-enter-active,.aa-peer-leave-active{transition:opacity .15s ease}.aa-peer-enter-from,.aa-peer-leave-to{opacity:0}
+</style>

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

@@ -0,0 +1,27 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    live?: boolean;
+    peers?: 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<{}>, {
+    peers: boolean;
+    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/ATextarea.d.vue.ts

@@ -1,7 +1,17 @@
 type __VLS_Props = {
-    /** Unique field key for awareness broadcasting. Convention: "{scope}:{id}" */
     fieldKey: string;
+    awareness?: boolean;
+    sync?: boolean;
+    peers?: boolean;
+    total?: boolean;
+    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<{}>, {
+    sync: boolean;
+    peers: boolean;
+    awareness: boolean;
+    max: number;
+    total: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -1,38 +1,91 @@
 <script setup>
-import { computed } from "vue";
+import { computed, onMounted, ref, useAttrs, watch } from "vue";
 import { useAAField } from "../../composables/useAAField";
+import { useAAFieldValue } from "../../composables/useAAFieldValue";
+import { useAACaret } from "../../composables/useAACaret";
+import { awareRingStyle } from "../../utils/awareRingStyle";
+import APeerCaretLayer from "./APeerCaretLayer.vue";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
-  fieldKey: { type: String, required: true }
+  fieldKey: { type: String, required: true },
+  awareness: { type: Boolean, required: false, default: true },
+  sync: { type: Boolean, required: false, default: false },
+  peers: { type: Boolean, required: false, default: false },
+  total: { type: Boolean, required: false, default: false },
+  max: { type: Number, required: false, default: 3 }
 });
-const { hoverers, focusers, handlers } = useAAField(props.fieldKey);
-const focusRingStyle = computed(() => {
-  if (focusers.value.length) {
-    const color = focusers.value[0]?.user?.color;
-    if (color) return { boxShadow: `0 0 0 2px ${color}`, borderRadius: "0.375rem" };
+const enableAwareness = computed(() => props.awareness || props.total);
+const enableSync = computed(() => props.sync || props.total);
+const enablePeers = computed(() => props.peers || props.total);
+const attrs = useAttrs();
+const { hoverers, focusers, pressers, isPressed, handlers } = useAAField(() => props.fieldKey);
+const synced = useAAFieldValue(() => props.fieldKey);
+const hasExternalModel = computed(
+  () => "modelValue" in attrs || "onUpdate:modelValue" in attrs
+);
+const hostRef = ref(null);
+const textareaEl = ref(null);
+function resolveTextarea() {
+  textareaEl.value = hostRef.value?.querySelector("textarea") ?? null;
+}
+onMounted(resolveTextarea);
+watch(() => props.fieldKey, resolveTextarea);
+const { carets } = useAACaret(() => props.fieldKey, textareaEl);
+const ringStyle = computed(
+  () => enableAwareness.value ? awareRingStyle({
+    hover: hoverers.value[0]?.user?.color,
+    focus: focusers.value[0]?.user?.color,
+    press: pressers.value[0]?.user?.color
+  }) : void 0
+);
+const overlayPeers = computed(() => {
+  if (!enableAwareness.value) return [];
+  const seen = /* @__PURE__ */ new Set();
+  const out = [];
+  for (const p of focusers.value) if (!seen.has(p.clientId)) {
+    seen.add(p.clientId);
+    out.push(p);
   }
-  if (hoverers.value.length) {
-    const color = hoverers.value[0]?.user?.color;
-    if (color) return { boxShadow: `0 0 0 1px ${color}40`, borderRadius: "0.375rem" };
+  for (const p of hoverers.value) if (!seen.has(p.clientId)) {
+    seen.add(p.clientId);
+    out.push(p);
   }
-  return {};
+  return out;
 });
+const eventHandlers = computed(() => enableAwareness.value ? handlers : {});
 </script>
 
 <template>
   <div
-    class="relative w-full"
-    :style="focusRingStyle"
-    v-on="handlers"
+    ref="hostRef"
+    class="aa-host aa-host--block"
+    :class="{ 'aa-host--pressed': isPressed }"
+    :style="ringStyle"
+    v-on="eventHandlers"
   >
-    <UTextarea v-bind="$attrs" />
+    <UTextarea
+      v-if="enableSync && !hasExternalModel"
+      v-model="synced"
+      v-bind="attrs"
+    />
+    <UTextarea
+      v-else
+      v-bind="attrs"
+    />
+
+    <APeerCaretLayer
+      v-if="enablePeers"
+      :target="textareaEl"
+      :carets="carets"
+    />
+
     <Transition name="aa-peer">
       <span
-        v-if="focusers.length"
-        class="absolute -top-2.5 right-0 flex -space-x-1 pointer-events-none z-10"
+        v-if="overlayPeers.length"
+        class="aa-overlay"
       >
         <AAvatar
-          v-for="p in focusers.slice(0, 2)"
+          v-for="p in overlayPeers.slice(0, max)"
           :key="p.clientId"
           :user="p"
           size="2xs"
@@ -45,5 +98,5 @@ const focusRingStyle = 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-host{border-radius:var(--ui-radius,.375rem);position:relative;transition:filter .12s ease}.aa-host--block{display:block}.aa-host--pressed{filter:brightness(.9)}.aa-overlay{display:flex;gap:0;pointer-events:none;position:absolute;right:0;top:-.625rem;z-index:10}.aa-overlay>*+*{margin-left:-.25rem}.aa-peer-enter-active,.aa-peer-leave-active{transition:opacity .15s ease}.aa-peer-enter-from,.aa-peer-leave-to{opacity:0}
 </style>

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

@@ -1,7 +1,17 @@
 type __VLS_Props = {
-    /** Unique field key for awareness broadcasting. Convention: "{scope}:{id}" */
     fieldKey: string;
+    awareness?: boolean;
+    sync?: boolean;
+    peers?: boolean;
+    total?: boolean;
+    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<{}>, {
+    sync: boolean;
+    peers: boolean;
+    awareness: boolean;
+    max: number;
+    total: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

@@ -0,0 +1,27 @@
+type __VLS_Props = {
+    fieldKey: string;
+    awareness?: boolean;
+    sync?: boolean;
+    total?: boolean;
+    max?: number;
+};
+declare var __VLS_9: string, __VLS_10: any, __VLS_20: string, __VLS_21: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+} & {
+    [K in NonNullable<typeof __VLS_20>]?: (props: typeof __VLS_21) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    sync: boolean;
+    awareness: boolean;
+    max: number;
+    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;
+    };
+};