@shwfed/nuxt 0.1.20 → 0.1.22

package/dist/module.d.mts

@@ -1,7 +1,7 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
 interface ModuleOptions {
-    clientId: string;
+    features: ReadonlyArray<string>;
 }
 declare module 'nuxt/schema' {
     interface PublicRuntimeConfig {

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@shwfed/nuxt",
   "configKey": "shwfed",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,16 +1,23 @@
-import { defineNuxtModule, createResolver, addPlugin, addImportsDir, addComponentsDir } from '@nuxt/kit';
+import { defineNuxtModule, createResolver, addVitePlugin, addPlugin, addImportsDir, addComponentsDir } from '@nuxt/kit';
+import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
 
 const module$1 = defineNuxtModule({
   meta: {
     name: "@shwfed/nuxt",
     configKey: "shwfed"
   },
-  defaults: {},
+  defaults: {
+    features: []
+  },
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);
     nuxt.options.runtimeConfig.public.shwfed = options;
     nuxt.options.css ||= [];
     nuxt.options.css.push("vue-sonner/style.css");
+    addVitePlugin(VueI18nPlugin({
+      ssr: true
+    }));
+    addPlugin(resolver.resolve("runtime/plugins/i18n/index"));
     addPlugin(resolver.resolve("runtime/plugins/cel/index"));
     addPlugin(resolver.resolve("runtime/plugins/markdown/index"));
     addPlugin({

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

@@ -1,6 +1,6 @@
-declare var __VLS_19: {};
+declare var __VLS_53: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_19) => any;
+    default?: (props: typeof __VLS_53) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/app.vue

@@ -1,7 +1,13 @@
 <script setup>
 import { useHead } from "#app";
-import { Tooltip } from "reka-ui/namespaced";
+import { ref } from "vue";
+import { CommandDialog, CommandInput, CommandList, CommandGroup, CommandEmpty } from "./ui/command";
+import { TooltipProvider } from "./ui/tooltip";
 import { Toaster } from "vue-sonner";
+import { useMagicKeys, whenever } from "@vueuse/core";
+import { useI18n } from "vue-i18n";
+import { Icon } from "@iconify/vue";
+const { t } = useI18n();
 useHead({
   bodyAttrs: {
     style: {
@@ -9,13 +15,62 @@ useHead({
     }
   }
 });
+const isCommandOpen = ref(false);
+const { meta_k } = useMagicKeys();
+whenever(() => meta_k?.value, () => {
+  isCommandOpen.value = !isCommandOpen.value;
+});
 </script>
 
 <template>
-  <Tooltip.Provider>
+  <TooltipProvider>
     <ClientOnly>
       <Toaster />
+      <CommandDialog
+        v-if="$dsl.evaluate`feature('command-palette')`()"
+        v-model:open="isCommandOpen"
+      >
+        <CommandInput />
+        <CommandList>
+          <CommandEmpty as-child>
+            <section class="h-32 flex flex-col text-lg items-center justify-center gap-2 select-none">
+              <Icon
+                icon="fluent:app-recent-20-regular"
+                class="text-zinc-400 text-2xl!"
+              />
+              <p class="text-zinc-500">
+                {{ t("command-palette.empty") }}
+              </p>
+            </section>
+          </CommandEmpty>
+          <CommandGroup>
+            <!-- <CommandItem
+              v-for="command in commands"
+              :key="command.title"
+              :value="command.title"
+            >
+              <Icon
+                v-if="command.icon"
+                :icon="command.icon"
+              />
+              <span>{{ command.title }}</span>
+            </CommandItem> -->
+          </CommandGroup>
+        </CommandList>
+      </CommandDialog>
     </ClientOnly>
     <slot />
-  </Tooltip.Provider>
+  </TooltipProvider>
 </template>
+
+<i18n lang="yaml">
+zh:
+  command-palette:
+    empty: 无搜索结果
+ja:
+  command-palette:
+    empty: 結果はありません
+en:
+  command-palette:
+    empty: No results
+</i18n>

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

@@ -1,6 +1,6 @@
-declare var __VLS_19: {};
+declare var __VLS_53: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_19) => any;
+    default?: (props: typeof __VLS_53) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -1,4 +1,4 @@
-import type { RowData, TableOptions } from '@tanstack/vue-table';
+import type { CellContext, RowData, TableOptions } from '@tanstack/vue-table';
 export type Expression = string;
 export type Markdown = string;
 export type Render = string | Readonly<{
@@ -32,7 +32,7 @@ declare module '@tanstack/vue-table' {
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<Readonly<{
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;
@@ -63,4 +63,13 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     readonly enableMultiRowSelection: Expression;
     readonly enableRowSelection: Expression;
     readonly cellStyles: Expression;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    [key: string]: (props: Readonly<{
+        cell: CellContext<unknown, unknown>;
+    }>) => void;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/table.vue

@@ -7,10 +7,8 @@ import { Pagination } from "reka-ui/namespaced";
 import { computed, ref } from "vue";
 import { useNuxtApp } from "#app";
 import { Button } from "./ui/button";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 import { useTableRenderers } from "../composables/useTableRenderers";
-import Tooltip from "./tooltip.vue";
-import Dialog from "./dialog.vue";
-import MarkdownEditor from "./markdown.vue";
 import { useCheating } from "#imports";
 </script>
 
@@ -28,6 +26,7 @@ const props = defineProps({
   paginationLeft: { type: String, required: false },
   paginationRight: { type: String, required: false }
 });
+const slots = defineSlots();
 const { $dsl } = useNuxtApp();
 const isCheating = useCheating();
 const { resolveTableRenderer } = useTableRenderers();
@@ -62,6 +61,9 @@ function translate(column) {
     id: column.id ?? genColumnId(column),
     header: (ctx) => renderer.header?.({ ctx, options }) ?? column.title,
     cell: (ctx) => {
+      if (ctx.column.id in slots) {
+        return slots[ctx.column.id]?.({ cell: ctx });
+      }
       return renderer.cell({ ctx, options });
     },
     accessorFn: (row, index) => {
@@ -70,7 +72,7 @@ function translate(column) {
         return getProperty(row, key);
       } else if (key !== void 0) {
         try {
-          return $dsl.evaluate(key.read, {
+          return $dsl.evaluate`${key.read}`({
             row,
             index: BigInt(index)
           });
@@ -108,8 +110,7 @@ const table = useVueTable({
   getPaginationRowModel: getPaginationRowModel(),
   getRowId: props.getRowId ? (originalRow, index, parent) => {
     try {
-      const key = $dsl.evaluate(
-        props.getRowId,
+      const key = $dsl.evaluate`${props.getRowId}`(
         {
           row: originalRow,
           index,
@@ -132,7 +133,7 @@ const table = useVueTable({
     if (!props.getSubRows)
       return void 0;
     try {
-      const value = $dsl.evaluate(props.getSubRows, {
+      const value = $dsl.evaluate`${props.getSubRows}`({
         row,
         index
       });
@@ -146,7 +147,7 @@ const table = useVueTable({
     if (!props.enableRowSelection)
       return true;
     try {
-      return Boolean($dsl.evaluate(props.enableRowSelection, {
+      return Boolean($dsl.evaluate`${props.enableRowSelection}`({
         row: row.original,
         index: BigInt(row.index),
         id: row.id
@@ -158,7 +159,7 @@ const table = useVueTable({
   },
   enableMultiRowSelection: props.enableMultiRowSelection ? (row) => {
     try {
-      return Boolean($dsl.evaluate(props.enableMultiRowSelection, {
+      return Boolean($dsl.evaluate`${props.enableMultiRowSelection}`({
         row: row.original,
         index: BigInt(row.index),
         id: row.id
@@ -195,7 +196,7 @@ function getCellStyles(ctx) {
   if (!props.cellStyles)
     return {};
   try {
-    const result = $dsl.evaluate(props.cellStyles, {
+    const result = $dsl.evaluate`${props.cellStyles}`({
       row: ctx.row.original,
       index: BigInt(ctx.row.index),
       id: ctx.column.id,
@@ -296,9 +297,16 @@ function getSortIcon(column) {
                 <Tooltip
                   v-if="!header.isPlaceholder && header.column.columnDef.meta?.tooltip"
                   :delay-duration="180"
-                  :content="$md.inline`${header.column.columnDef.meta.tooltip}`()"
                 >
-                  <Icon icon="fluent:info-20-regular" />
+                  <TooltipTrigger as-child>
+                    <Icon icon="fluent:info-20-regular" />
+                  </TooltipTrigger>
+                  <TooltipContent
+                    align="center"
+                    side="top"
+                  >
+                    <span v-html="$md.inline`${header.column.columnDef.meta.tooltip}`()" />
+                  </TooltipContent>
                 </Tooltip>
 
                 <Button
@@ -410,47 +418,24 @@ function getSortIcon(column) {
     </div>
 
     <div class="flex items-center justify-between w-full py-2 gap-2 text-sm text-zinc-600">
-      <Dialog
-        title="编辑分页左侧文字"
-        width="50%"
-        :disabled="!isCheating"
-      >
-        <template #trigger>
-          <div
-            :class="[
+      <div
+        :class="[
   'relative p-1 flex-1 prose prose-zinc text-xs border border-dashed',
   isCheating ? 'border-(--primary)/20 rounded hover:border-(--primary)/40 transition-colors duration-150 group cursor-pointer' : 'border-transparent'
 ]"
-          >
-            <span
-              v-html="$md.inline`${props.paginationLeft}`({
+      >
+        <span
+          v-html="$md.inline`${props.paginationLeft}`({
   selected: table.getSelectedRowModel().rows.map((row) => row.original)
 })"
-            />
-            <Icon
-              v-if="isCheating"
-              icon="fluent:edit-20-regular"
-              class="w-4 h-4 text-(--primary) absolute right-1 top-1/2 -translate-y-1/2 transform-3d group-hover:opacity-100 opacity-50 transition-opacity duration-150"
-            />
+        />
+        <Icon
+          v-if="isCheating"
+          icon="fluent:edit-20-regular"
+          class="w-4 h-4 text-(--primary) absolute right-1 top-1/2 -translate-y-1/2 transform-3d group-hover:opacity-100 opacity-50 transition-opacity duration-150"
+        />
             &nbsp;
-          </div>
-        </template>
-        <template #default>
-          <MarkdownEditor
-            :model-value="props.paginationLeft ?? ''"
-            class="w-full h-64"
-            :variables="[
-  {
-    identity: 'selected',
-    type: 'list<dyn>',
-    description: $md.raw`
-                  表格被选中的行：如果没有被选中的行，那么这个变量将始终为空列表。
-                `
-  }
-]"
-          />
-        </template>
-      </Dialog>
+      </div>
       <div class="flex items-center gap-4">
         <span class="text-xs">{{ `\u5171 ${props.data.length} \u6761` }}</span>
         <Pagination.Root
@@ -535,47 +520,24 @@ function getSortIcon(column) {
         </Pagination.Root>
         <span class="text-xs">前往</span>
       </div>
-      <Dialog
-        title="编辑分页右侧文字"
-        width="50%"
-        :disabled="!isCheating"
-      >
-        <template #trigger>
-          <div
-            :class="[
+      <div
+        :class="[
   'relative p-1 flex-1 prose prose-zinc text-xs border border-dashed',
   isCheating ? 'border-(--primary)/20 rounded hover:border-(--primary)/40 transition-colors duration-150 group cursor-pointer' : 'border-transparent'
 ]"
-          >
-            <span
-              v-html="$md.inline`${props.paginationRight}`({
+      >
+        <span
+          v-html="$md.inline`${props.paginationRight}`({
   selected: table.getSelectedRowModel().rows.map((row) => row.original)
 })"
-            />
-            <Icon
-              v-if="isCheating"
-              icon="fluent:edit-20-regular"
-              class="w-4 h-4 text-(--primary) absolute right-1 top-1/2 -translate-y-1/2 transform-3d group-hover:opacity-100 opacity-50 transition-opacity duration-150"
-            />
+        />
+        <Icon
+          v-if="isCheating"
+          icon="fluent:edit-20-regular"
+          class="w-4 h-4 text-(--primary) absolute right-1 top-1/2 -translate-y-1/2 transform-3d group-hover:opacity-100 opacity-50 transition-opacity duration-150"
+        />
             &nbsp;
-          </div>
-        </template>
-        <template #default>
-          <MarkdownEditor
-            :model-value="props.paginationRight ?? ''"
-            class="w-full h-64"
-            :variables="[
-  {
-    identity: 'selected',
-    type: 'list<dyn>',
-    description: $md.raw`
-                  表格被选中的行：如果没有被选中的行，那么这个变量将始终为空列表。
-                `
-  }
-]"
-          />
-        </template>
-      </Dialog>
+      </div>
     </div>
   </div>
 </template>

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

@@ -1,4 +1,4 @@
-import type { RowData, TableOptions } from '@tanstack/vue-table';
+import type { CellContext, RowData, TableOptions } from '@tanstack/vue-table';
 export type Expression = string;
 export type Markdown = string;
 export type Render = string | Readonly<{
@@ -32,7 +32,7 @@ declare module '@tanstack/vue-table' {
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<Readonly<{
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;
@@ -63,4 +63,13 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     readonly enableMultiRowSelection: Expression;
     readonly enableRowSelection: Expression;
     readonly cellStyles: Expression;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    [key: string]: (props: Readonly<{
+        cell: CellContext<unknown, unknown>;
+    }>) => void;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/button/index.d.ts

@@ -1,7 +1,7 @@
 import type { VariantProps } from 'class-variance-authority';
 export { default as Button } from './Button.vue.js';
 export declare const buttonVariants: (props?: ({
-    variant?: "primary" | "default" | "destructive" | "ghost" | null | undefined;
+    variant?: "default" | "primary" | "destructive" | "ghost" | null | undefined;
     size?: "default" | "sm" | "xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export type ButtonVariants = VariantProps<typeof buttonVariants>;

package/dist/runtime/components/ui/button-group/ButtonGroup.d.vue.ts

@@ -0,0 +1,19 @@
+import type { HTMLAttributes } from 'vue';
+import type { ButtonGroupVariants } from '.';
+type __VLS_Props = {
+    class?: HTMLAttributes['class'];
+    orientation?: ButtonGroupVariants['orientation'];
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: 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: __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/ui/button-group/ButtonGroup.vue

@@ -0,0 +1,19 @@
+<script setup>
+import { cn } from "../../../utils/cn";
+import { buttonGroupVariants } from ".";
+const props = defineProps({
+  class: { type: null, required: false },
+  orientation: { type: null, required: false }
+});
+</script>
+
+<template>
+  <div
+    role="group"
+    data-slot="button-group"
+    :data-orientation="props.orientation"
+    :class="cn(buttonGroupVariants({ orientation: props.orientation }), props.class)"
+  >
+    <slot />
+  </div>
+</template>

package/dist/runtime/components/ui/button-group/ButtonGroup.vue.d.ts

@@ -0,0 +1,19 @@
+import type { HTMLAttributes } from 'vue';
+import type { ButtonGroupVariants } from '.';
+type __VLS_Props = {
+    class?: HTMLAttributes['class'];
+    orientation?: ButtonGroupVariants['orientation'];
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: 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: __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/ui/button-group/ButtonGroupSeparator.d.vue.ts

@@ -0,0 +1,10 @@
+import type { SeparatorProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = SeparatorProps & {
+    class?: HTMLAttributes['class'];
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    orientation: "vertical" | "horizontal";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/button-group/ButtonGroupSeparator.vue

@@ -0,0 +1,25 @@
+<script setup>
+import { reactiveOmit } from "@vueuse/core";
+import { cn } from "../../../utils/cn";
+import { Separator } from "../separator";
+const props = defineProps({
+  orientation: { type: String, required: false, default: "vertical" },
+  decorative: { type: Boolean, required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  class: { type: null, required: false }
+});
+const delegatedProps = reactiveOmit(props, "class");
+</script>
+
+<template>
+  <Separator
+    data-slot="button-group-separator"
+    v-bind="delegatedProps"
+    :orientation="props.orientation"
+    :class="cn(
+  'bg-input relative m-0! self-stretch data-[orientation=vertical]:h-auto',
+  props.class
+)"
+  />
+</template>

package/dist/runtime/components/ui/button-group/ButtonGroupSeparator.vue.d.ts

@@ -0,0 +1,10 @@
+import type { SeparatorProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = SeparatorProps & {
+    class?: HTMLAttributes['class'];
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    orientation: "vertical" | "horizontal";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/button-group/ButtonGroupText.d.vue.ts

@@ -0,0 +1,22 @@
+import type { PrimitiveProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+import type { ButtonGroupVariants } from '.';
+interface Props extends PrimitiveProps {
+    class?: HTMLAttributes['class'];
+    orientation?: ButtonGroupVariants['orientation'];
+}
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    as: import("reka-ui").AsTag | import("vue").Component;
+}, {}, {}, {}, 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/ui/button-group/ButtonGroupText.vue

@@ -0,0 +1,23 @@
+<script setup>
+import { Primitive } from "reka-ui";
+import { cn } from "../../../utils/cn";
+const props = defineProps({
+  class: { type: null, required: false },
+  orientation: { type: null, required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false, default: "div" }
+});
+</script>
+
+<template>
+  <Primitive
+    role="group"
+    data-slot="button-group"
+    :data-orientation="props.orientation"
+    :as="as"
+    :as-child="asChild"
+    :class="cn('bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*=\'size-\'])]:size-4', props.class)"
+  >
+    <slot />
+  </Primitive>
+</template>

package/dist/runtime/components/ui/button-group/ButtonGroupText.vue.d.ts

@@ -0,0 +1,22 @@
+import type { PrimitiveProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+import type { ButtonGroupVariants } from '.';
+interface Props extends PrimitiveProps {
+    class?: HTMLAttributes['class'];
+    orientation?: ButtonGroupVariants['orientation'];
+}
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    as: import("reka-ui").AsTag | import("vue").Component;
+}, {}, {}, {}, 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/ui/button-group/index.d.ts

@@ -0,0 +1,8 @@
+import type { VariantProps } from 'class-variance-authority';
+export { default as ButtonGroup } from './ButtonGroup.vue.js';
+export { default as ButtonGroupSeparator } from './ButtonGroupSeparator.vue.js';
+export { default as ButtonGroupText } from './ButtonGroupText.vue.js';
+export declare const buttonGroupVariants: (props?: ({
+    orientation?: "vertical" | "horizontal" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ButtonGroupVariants = VariantProps<typeof buttonGroupVariants>;

package/dist/runtime/components/ui/button-group/index.js

@@ -0,0 +1,18 @@
+import { cva } from "class-variance-authority";
+export { default as ButtonGroup } from "./ButtonGroup.vue";
+export { default as ButtonGroupSeparator } from "./ButtonGroupSeparator.vue";
+export { default as ButtonGroupText } from "./ButtonGroupText.vue";
+export const buttonGroupVariants = cva(
+  "flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2",
+  {
+    variants: {
+      orientation: {
+        horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
+        vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+);