@shwfed/nuxt 0.1.19 → 0.1.21

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "@shwfed/nuxt",
   "configKey": "shwfed",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
-    "unbuild": "unknown"
+    "unbuild": "3.6.1"
   }
 }

package/dist/module.mjs

@@ -9,8 +9,14 @@ const module$1 = defineNuxtModule({
   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");
     addPlugin(resolver.resolve("runtime/plugins/cel/index"));
     addPlugin(resolver.resolve("runtime/plugins/markdown/index"));
+    addPlugin({
+      src: resolver.resolve("runtime/plugins/toast/index"),
+      mode: "client"
+    });
     addImportsDir(resolver.resolve("runtime/composables"));
     addComponentsDir({
       path: resolver.resolve("runtime/components"),

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

@@ -1,6 +1,6 @@
-declare var __VLS_8: {};
+declare var __VLS_19: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_8) => any;
+    default?: (props: typeof __VLS_19) => 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,6 +1,7 @@
 <script setup>
 import { useHead } from "#app";
-import { Tooltip } from "reka-ui/namespaced";
+import { TooltipProvider } from "./ui/tooltip";
+import { Toaster } from "vue-sonner";
 useHead({
   bodyAttrs: {
     style: {
@@ -11,7 +12,10 @@ useHead({
 </script>
 
 <template>
-  <Tooltip.Provider>
+  <TooltipProvider>
+    <ClientOnly>
+      <Toaster />
+    </ClientOnly>
     <slot />
-  </Tooltip.Provider>
+  </TooltipProvider>
 </template>

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

@@ -1,6 +1,6 @@
-declare var __VLS_8: {};
+declare var __VLS_19: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_8) => any;
+    default?: (props: typeof __VLS_19) => 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

@@ -44,7 +44,7 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     props?: Omit<TableOptions<unknown>, "columns" | "data" | "getRowId" | "getCoreRowModel">;
     paginationLeft?: Markdown;
     paginationRight?: Markdown;
-}>, import("@tanstack/vue-table").Table<unknown>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Readonly<{
+}>, import("@tanstack/table-core").Table<unknown>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;

package/dist/runtime/components/table.vue

@@ -6,8 +6,10 @@ import { getProperty } from "dot-prop";
 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 { useCheating } from "#imports";
 </script>
 
 <script setup>
@@ -25,6 +27,7 @@ const props = defineProps({
   paginationRight: { type: String, required: false }
 });
 const { $dsl } = useNuxtApp();
+const isCheating = useCheating();
 const { resolveTableRenderer } = useTableRenderers();
 const containerRef = ref(null);
 function genColumnId(column) {
@@ -65,7 +68,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)
           });
@@ -103,8 +106,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,
@@ -127,7 +129,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
       });
@@ -141,7 +143,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
@@ -153,7 +155,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
@@ -190,7 +192,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,
@@ -291,22 +293,27 @@ 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
+                <Button
                   v-if="!header.isPlaceholder && header.column.getCanSort()"
-                  type="button"
-                  :class="[
-  'p-1 cursor-pointer outline-none absolute right-1 top-1/2 -translate-y-1/2 transform-3d',
-  'group-hover:opacity-100 opacity-60 transition-opacity duration-180 bg-transparent'
-]"
-                  @click="header.column.getToggleSortingHandler()?.($event)"
+                  variant="ghost"
+                  size="xs"
+                  class="absolute hover:bg-transparent right-1 top-1/2 -translate-y-1/2 transform-3d group-hover:opacity-100 opacity-60 transition-opacity duration-180"
+                  @click="(event) => header.column.getToggleSortingHandler()?.(event)"
                 >
                   <Icon :icon="getSortIcon(header.column)" />
-                </button>
+                </Button>
 
                 <div
                   v-if="!header.isPlaceholder && header.column.getCanResize() && (!header.column.getIsLastColumn('right') || !table.getIsSomeColumnsPinned('right') && !header.column.getIsLastColumn('center'))"
@@ -328,7 +335,7 @@ function getSortIcon(column) {
 ]"
                   @mousedown="header.getResizeHandler()($event)"
                 >
-                  <div :class="['w-2pt', 'translate-x-1pt', 'h-full', 'bg-blue-400']" />
+                  <div :class="['w-2pt', 'h-full', 'translate-x-1pt', 'transform-3d', 'bg-[color-mix(in_srgb,var(--primary)_80%,white)]']" />
                 </div>
               </th>
             </tr>
@@ -370,7 +377,7 @@ function getSortIcon(column) {
             </tr>
           </tbody>
 
-          <tfoot class="hidden has-[[data-footer]]:grid sticky bottom-0 z-10 select-none border-t border-zinc-200">
+          <tfoot class="hidden has-data-footer:grid sticky bottom-0 z-10 select-none border-t border-zinc-200">
             <tr
               v-for="group in table.getFooterGroups()"
               :key="group.id"
@@ -406,9 +413,24 @@ function getSortIcon(column) {
       </div>
     </div>
 
-    <div class="flex items-center justify-between w-full p-4 text-sm text-zinc-600">
-      <div>
-        <div />
+    <div class="flex items-center justify-between w-full py-2 gap-2 text-sm text-zinc-600">
+      <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}`({
+  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"
+        />
+            &nbsp;
       </div>
       <div class="flex items-center gap-4">
         <span class="text-xs">{{ `\u5171 ${props.data.length} \u6761` }}</span>
@@ -426,7 +448,7 @@ function getSortIcon(column) {
             <Pagination.First
               :class="[
   'w-7 h-7 flex items-center justify-center bg-transparent hover:bg-zinc-100 transition disabled:opacity-50 rounded text-zinc-600',
-  'data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed cursor-pointer'
+  'data-disabled:opacity-50 data-disabled:cursor-not-allowed cursor-pointer'
 ]"
             >
               <Icon
@@ -437,7 +459,7 @@ function getSortIcon(column) {
             <Pagination.Prev
               :class="[
   'w-7 h-7 flex items-center justify-center bg-transparent hover:bg-zinc-100 transition disabled:opacity-50 rounded text-zinc-600',
-  'data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed cursor-pointer'
+  'data-disabled:opacity-50 data-disabled:cursor-not-allowed cursor-pointer'
 ]"
             >
               <Icon
@@ -453,8 +475,8 @@ function getSortIcon(column) {
               <Pagination.ListItem
                 v-if="page.type === 'page'"
                 :class="[
-  'w-7 h-7 flex items-center justify-center border border-zinc-200 rounded text-xs bg-transparent',
-  'data-[selected]:text-[var(--primary)] data-[selected]:border-[var(--primary)] hover:bg-zinc-100 transition cursor-pointer'
+  'w-7 h-7 flex items-center justify-center rounded text-xs bg-transparent',
+  'data-selected:text-(--primary) data-selected:border-(--primary) hover:bg-zinc-100 transition cursor-pointer'
 ]"
                 :value="page.value"
               >
@@ -471,7 +493,7 @@ function getSortIcon(column) {
             <Pagination.Next
               :class="[
   'w-7 h-7 flex items-center justify-center bg-transparent hover:bg-zinc-100 transition disabled:opacity-50 rounded text-zinc-600',
-  'data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed cursor-pointer'
+  'data-disabled:opacity-50 data-disabled:cursor-not-allowed cursor-pointer'
 ]"
             >
               <Icon
@@ -482,7 +504,7 @@ function getSortIcon(column) {
             <Pagination.Last
               :class="[
   'w-7 h-7 flex items-center justify-center bg-transparent hover:bg-zinc-100 transition disabled:opacity-50 rounded text-zinc-600',
-  'data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed cursor-pointer'
+  'data-disabled:opacity-50 data-disabled:cursor-not-allowed cursor-pointer'
 ]"
             >
               <Icon
@@ -494,7 +516,24 @@ function getSortIcon(column) {
         </Pagination.Root>
         <span class="text-xs">前往</span>
       </div>
-      <div />
+      <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}`({
+  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"
+        />
+            &nbsp;
+      </div>
     </div>
   </div>
 </template>

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

@@ -44,7 +44,7 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     props?: Omit<TableOptions<unknown>, "columns" | "data" | "getRowId" | "getCoreRowModel">;
     paginationLeft?: Markdown;
     paginationRight?: Markdown;
-}>, import("@tanstack/vue-table").Table<unknown>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Readonly<{
+}>, import("@tanstack/table-core").Table<unknown>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;

package/dist/runtime/components/ui/button/Button.d.vue.ts

@@ -0,0 +1,27 @@
+import type { PrimitiveProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+import type { ButtonVariants } from '.';
+interface Props extends PrimitiveProps {
+    variant?: ButtonVariants['variant'];
+    size?: ButtonVariants['size'];
+    class?: HTMLAttributes['class'];
+}
+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, {
+    click: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onClick?: ((...args: any[]) => any) | undefined;
+}>, {
+    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/Button.vue

@@ -0,0 +1,24 @@
+<script setup>
+import { cn } from "../../../utils/cn";
+import { Primitive, useForwardPropsEmits } from "reka-ui";
+import { buttonVariants } from ".";
+const props = defineProps({
+  variant: { type: null, required: false },
+  size: { type: null, required: false },
+  class: { type: null, required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false, default: "button" }
+});
+const emits = defineEmits(["click"]);
+const forwarded = useForwardPropsEmits(props, emits);
+</script>
+
+<template>
+  <Primitive
+    data-slot="button"
+    v-bind="forwarded"
+    :class="cn(buttonVariants({ variant, size }), props.class)"
+  >
+    <slot />
+  </Primitive>
+</template>

package/dist/runtime/components/ui/button/Button.vue.d.ts

@@ -0,0 +1,27 @@
+import type { PrimitiveProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+import type { ButtonVariants } from '.';
+interface Props extends PrimitiveProps {
+    variant?: ButtonVariants['variant'];
+    size?: ButtonVariants['size'];
+    class?: HTMLAttributes['class'];
+}
+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, {
+    click: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onClick?: ((...args: any[]) => any) | undefined;
+}>, {
+    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/index.d.ts

@@ -0,0 +1,7 @@
+import type { VariantProps } from 'class-variance-authority';
+export { default as Button } from './Button.vue.js';
+export declare const buttonVariants: (props?: ({
+    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/index.js

@@ -0,0 +1,24 @@
+import { cva } from "class-variance-authority";
+export { default as Button } from "./Button.vue";
+export const buttonVariants = cva(
+  "cursor-pointer tracking-wide inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-sm text-sm font-medium transition-all duration-180 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none aria-invalid:border-red-200 select-none",
+  {
+    variants: {
+      variant: {
+        default: "border border-slate-200 bg-white text-slate-700 hover:bg-[color-mix(in_srgb,var(--primary)_20%,white)] hover:border-[color-mix(in_srgb,var(--primary)_60%,white)] hover:text-(--primary)",
+        destructive: "border border-red-200 text-red-600 bg-[color-mix(in_srgb,red_10%,white)] hover:bg-red-400 hover:border-red-400 hover:text-white",
+        primary: "bg-(--primary) text-white hover:bg-[color-mix(in_srgb,var(--primary)_70%,white)]",
+        ghost: "border-none bg-transparent text-slate-700 hover:bg-slate-100 hover:text-slate-900"
+      },
+      size: {
+        default: "h-8 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-6 rounded gap-1.5 text-xs px-3 has-[>svg]:px-2.5",
+        xs: "h-4 rounded gap-1 text-xs px-2 has-[>svg]:px-1"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);

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: "horizontal" | "vertical";
+}, {}, {}, {}, 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: "horizontal" | "vertical";
+}, {}, {}, {}, 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?: "horizontal" | "vertical" | 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"
+    }
+  }
+);