@shwfed/nuxt 0.7.8 → 0.7.9

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

@@ -0,0 +1,155 @@
+import z from 'zod';
+import { Effect } from 'effect';
+export declare const StringFieldC: z.ZodObject<{
+    type: z.ZodLiteral<"string">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    discardEmptyString: z.ZodOptional<z.ZodBoolean>;
+    maxLength: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+export declare const NumberFieldC: z.ZodObject<{
+    type: z.ZodLiteral<"number">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    min: z.ZodOptional<z.ZodString>;
+    max: z.ZodOptional<z.ZodString>;
+    step: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+export declare const SelectFieldC: z.ZodObject<{
+    type: z.ZodLiteral<"select">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    options: z.ZodString;
+    label: z.ZodString;
+    value: z.ZodString;
+    key: z.ZodString;
+    style: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+export declare const CalendarFieldC: z.ZodObject<{
+    type: z.ZodLiteral<"calendar">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    mode: z.ZodEnum<{
+        year: "year";
+        month: "month";
+        date: "date";
+    }>;
+    display: z.ZodOptional<z.ZodString>;
+    value: z.ZodString;
+    disableDate: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+export declare const FieldC: z.ZodUnion<readonly [z.ZodObject<{
+    type: z.ZodLiteral<"string">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    discardEmptyString: z.ZodOptional<z.ZodBoolean>;
+    maxLength: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"number">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    min: z.ZodOptional<z.ZodString>;
+    max: z.ZodOptional<z.ZodString>;
+    step: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"select">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    options: z.ZodString;
+    label: z.ZodString;
+    value: z.ZodString;
+    key: z.ZodString;
+    style: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>, z.ZodObject<{
+    type: z.ZodLiteral<"calendar">;
+    path: z.ZodString;
+    title: z.ZodArray<z.ZodObject<{
+        locale: z.ZodString;
+        message: z.ZodString;
+    }, z.core.$strip>>;
+    icon: z.ZodOptional<z.ZodString>;
+    style: z.ZodOptional<z.ZodString>;
+    mode: z.ZodEnum<{
+        year: "year";
+        month: "month";
+        date: "date";
+    }>;
+    display: z.ZodOptional<z.ZodString>;
+    value: z.ZodString;
+    disableDate: z.ZodOptional<z.ZodString>;
+    hidden: z.ZodOptional<z.ZodString>;
+    disabled: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>]>;
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    orientation?: "horizontal" | "vertical" | "floating";
+    fields: Effect.Effect<ReadonlyArray<z.infer<typeof FieldC>>>;
+} & {
+    modelValue?: Record<string, unknown>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: Record<string, unknown>) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    orientation?: "horizontal" | "vertical" | "floating";
+    fields: Effect.Effect<ReadonlyArray<z.infer<typeof FieldC>>>;
+} & {
+    modelValue?: Record<string, unknown>;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Record<string, unknown>) => any) | undefined;
+}>, {
+    orientation: "horizontal" | "vertical" | "floating";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -18,7 +18,7 @@ const delegatedProps = reactiveOmit(props, "class");
     v-bind="delegatedProps"
     :orientation="props.orientation"
     :class="cn(
-  'bg-input relative m-0! self-stretch data-[orientation=vertical]:h-auto',
+  'bg-zinc-200 relative m-0! self-stretch data-[orientation=vertical]:h-auto',
   props.class
 )"
   />

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

@@ -16,7 +16,7 @@ const props = defineProps({
     :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)"
+    :class="cn('bg-zinc-100 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>

package/dist/runtime/components/ui/calendar/Calendar.d.vue.ts

@@ -4,23 +4,16 @@ import type { LayoutTypes } from '.';
 type __VLS_Props = CalendarRootProps & {
     class?: HTMLAttributes['class'];
     layout?: LayoutTypes;
-    yearRange?: DateValue[];
 };
-declare var __VLS_59: {}, __VLS_67: {}, __VLS_69: {
+declare var __VLS_20: {}, __VLS_28: {}, __VLS_30: {
     date: DateValue;
-    month: import("@vueuse/core").ReuseTemplateComponent<{
-        date: DateValue;
-    }, Record<"default", undefined>>;
-    year: import("@vueuse/core").ReuseTemplateComponent<{
-        date: DateValue;
-    }, Record<"default", undefined>>;
 };
 type __VLS_Slots = {} & {
-    'calendar-prev-icon'?: (props: typeof __VLS_59) => any;
+    'calendar-prev-icon'?: (props: typeof __VLS_20) => any;
 } & {
-    'calendar-next-icon'?: (props: typeof __VLS_67) => any;
+    'calendar-next-icon'?: (props: typeof __VLS_28) => any;
 } & {
-    'calendar-heading'?: (props: typeof __VLS_69) => any;
+    'calendar-heading'?: (props: typeof __VLS_30) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (date: DateValue | undefined) => any;
@@ -30,7 +23,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
     "onUpdate:placeholder"?: ((date: DateValue) => any) | undefined;
 }>, {
     modelValue: DateValue | DateValue[];
-    layout: "month-and-year" | "month-only" | "year-only";
+    layout: LayoutTypes;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/ui/calendar/Calendar.vue

@@ -1,11 +1,11 @@
 <script setup>
-import { getLocalTimeZone, today } from "@internationalized/date";
-import { createReusableTemplate, reactiveOmit, useNavigatorLanguage, useVModel } from "@vueuse/core";
+import { CalendarDate, getLocalTimeZone, today } from "@internationalized/date";
+import { reactiveOmit, useNavigatorLanguage, useVModel } from "@vueuse/core";
 import { CalendarRoot, useDateFormatter, useForwardPropsEmits } from "reka-ui";
-import { createYear, createYearRange, toDate } from "reka-ui/date";
-import { computed, toRaw } from "vue";
+import { toDate } from "reka-ui/date";
+import { computed } from "vue";
 import { cn } from "../../../utils/cn";
-import { NativeSelect, NativeSelectOption } from "../native-select";
+import { buttonVariants } from "../button";
 import { CalendarCell, CalendarCellTrigger, CalendarGrid, CalendarGridBody, CalendarGridHead, CalendarGridRow, CalendarHeadCell, CalendarHeader, CalendarHeading, CalendarNextButton, CalendarPrevButton } from ".";
 const props = defineProps({
   defaultValue: { type: null, required: false },
@@ -35,8 +35,7 @@ const props = defineProps({
   asChild: { type: Boolean, required: false },
   as: { type: null, required: false },
   class: { type: null, required: false },
-  layout: { type: null, required: false, default: void 0 },
-  yearRange: { type: Array, required: false }
+  layout: { type: String, required: false, default: void 0 }
 });
 const emits = defineEmits(["update:modelValue", "update:placeholder"]);
 const delegatedProps = reactiveOmit(props, "class", "layout", "placeholder");
@@ -45,14 +44,6 @@ const placeholder = useVModel(props, "placeholder", emits, {
   defaultValue: props.defaultPlaceholder ?? today(getLocalTimeZone())
 });
 const formatter = useDateFormatter(props.locale ?? "en");
-const yearRange = computed(() => {
-  return props.yearRange ?? createYearRange({
-    start: props?.minValue ?? (toRaw(props.placeholder) ?? props.defaultPlaceholder ?? today(getLocalTimeZone())).cycle("year", -100),
-    end: props?.maxValue ?? (toRaw(props.placeholder) ?? props.defaultPlaceholder ?? today(getLocalTimeZone())).cycle("year", 10)
-  });
-});
-const [DefineMonthTemplate, ReuseMonthTemplate] = createReusableTemplate();
-const [DefineYearTemplate, ReuseYearTemplate] = createReusableTemplate();
 const forwarded = useForwardPropsEmits(delegatedProps, emits);
 const locale = useNavigatorLanguage();
 const weekStartsOn = computed(() => {
@@ -63,77 +54,34 @@ const weekStartsOn = computed(() => {
   }
   return void 0;
 });
+const yearGridStart = computed(() => Math.floor(placeholder.value.year / 12) * 12);
+function isPickerDateDisabled(date) {
+  const fn = props.isDateDisabled;
+  if (typeof fn !== "function") return false;
+  return fn(date);
+}
 </script>
 
 <template>
-  <DefineMonthTemplate v-slot="{ date }">
-    <div class="**:data-[slot=native-select-icon]:right-1">
-      <div class="relative">
-        <div class="absolute inset-0 flex h-full items-center text-sm pl-2 pointer-events-none">
-          {{ formatter.custom(toDate(date), { month: "short" }) }}
-        </div>
-        <NativeSelect
-          class="text-xs h-8 pr-6 pl-2 text-transparent relative"
-          @change="(e) => {
-  placeholder = placeholder.set({
-    month: Number(e?.target?.value)
-  });
-}"
-        >
-          <NativeSelectOption
-            v-for="(month) in createYear({ dateObj: date })"
-            :key="month.toString()"
-            :value="month.month"
-            :selected="date.month === month.month"
-          >
-            {{ formatter.custom(toDate(month), { month: "short" }) }}
-          </NativeSelectOption>
-        </NativeSelect>
-      </div>
-    </div>
-  </DefineMonthTemplate>
-
-  <DefineYearTemplate v-slot="{ date }">
-    <div class="**:data-[slot=native-select-icon]:right-1">
-      <div class="relative">
-        <div class="absolute inset-0 flex h-full items-center text-sm pl-2 pointer-events-none">
-          {{ formatter.custom(toDate(date), { year: "numeric" }) }}
-        </div>
-        <NativeSelect
-          class="text-xs h-8 pr-6 pl-2 text-transparent relative"
-          @change="(e) => {
-  placeholder = placeholder.set({
-    year: Number(e?.target?.value)
-  });
-}"
-        >
-          <NativeSelectOption
-            v-for="(year) in yearRange"
-            :key="year.toString()"
-            :value="year.year"
-            :selected="date.year === year.year"
-          >
-            {{ formatter.custom(toDate(year), { year: "numeric" }) }}
-          </NativeSelectOption>
-        </NativeSelect>
-      </div>
-    </div>
-  </DefineYearTemplate>
-
   <CalendarRoot
     v-slot="{ grid, weekDays, date }"
     v-bind="forwarded"
     v-model:placeholder="placeholder"
     data-slot="calendar"
     :week-starts-on="weekStartsOn"
+    fixed-weeks
     :class="cn('p-3', props.class)"
   >
-    <CalendarHeader class="pt-0">
-      <nav class="w-full flex items-center gap-1 absolute top-1/2 -translate-y-1/2 transform-gpu inset-x-0 justify-between">
-        <CalendarPrevButton>
+    <CalendarHeader :class="layout === 'year' ? 'pt-2 pb-2' : 'pt-0'">
+      <nav class="w-full flex items-center gap-1 absolute top-1/2 -translate-y-1/2 transform-gpu inset-x-0 justify-between z-10">
+        <CalendarPrevButton
+          :prev-page="layout === 'year' ? (d) => d.subtract({ years: 12 }) : layout === 'month' ? (d) => d.subtract({ years: 1 }) : void 0"
+        >
           <slot name="calendar-prev-icon" />
         </CalendarPrevButton>
-        <CalendarNextButton>
+        <CalendarNextButton
+          :next-page="layout === 'year' ? (d) => d.add({ years: 12 }) : layout === 'month' ? (d) => d.add({ years: 1 }) : void 0"
+        >
           <slot name="calendar-next-icon" />
         </CalendarNextButton>
       </nav>
@@ -141,34 +89,71 @@ const weekStartsOn = computed(() => {
       <slot
         name="calendar-heading"
         :date="date"
-        :month="ReuseMonthTemplate"
-        :year="ReuseYearTemplate"
       >
-        <template v-if="layout === 'month-and-year'">
-          <div class="flex items-center justify-center gap-1">
-            <ReuseMonthTemplate :date="date" />
-            <ReuseYearTemplate :date="date" />
-          </div>
-        </template>
-        <template v-else-if="layout === 'month-only'">
-          <div class="flex items-center justify-center gap-1">
-            <ReuseMonthTemplate :date="date" />
+        <template v-if="layout === 'month'">
+          <span
+            class="text-sm font-medium"
+            style="text-autospace: normal"
+          >
             {{ formatter.custom(toDate(date), { year: "numeric" }) }}
-          </div>
-        </template>
-        <template v-else-if="layout === 'year-only'">
-          <div class="flex items-center justify-center gap-1">
-            {{ formatter.custom(toDate(date), { month: "short" }) }}
-            <ReuseYearTemplate :date="date" />
-          </div>
+          </span>
         </template>
+        <template v-else-if="layout === 'year'" />
         <template v-else>
           <CalendarHeading />
         </template>
       </slot>
     </CalendarHeader>
 
-    <div class="flex flex-col gap-y-4 mt-4 sm:flex-row sm:gap-x-4 sm:gap-y-0">
+    <!-- Month picker grid (month-only / month-and-year) -->
+    <div
+      v-if="layout === 'month'"
+      class="grid grid-cols-4 gap-1 mt-4"
+    >
+      <button
+        v-for="m in 12"
+        :key="m"
+        type="button"
+        :disabled="isPickerDateDisabled(new CalendarDate(placeholder.year, m, 1))"
+        :class="cn(
+  buttonVariants({ variant: 'ghost' }),
+  'h-9 w-full rounded-md font-normal',
+  modelValue && !Array.isArray(modelValue) && modelValue.year === placeholder.year && modelValue.month === m ? 'bg-[color-mix(in_srgb,var(--primary)_20%,white)] text-(--primary)' : '',
+  isPickerDateDisabled(new CalendarDate(placeholder.year, m, 1)) ? 'text-zinc-500 opacity-50 cursor-default' : 'cursor-pointer'
+)"
+        @click="emits('update:modelValue', new CalendarDate(placeholder.year, m, 1))"
+      >
+        {{ formatter.custom(toDate(new CalendarDate(placeholder.year, m, 1)), { month: "short" }) }}
+      </button>
+    </div>
+
+    <!-- Year picker grid -->
+    <div
+      v-else-if="layout === 'year'"
+      class="grid grid-cols-4 gap-1 mt-4"
+    >
+      <button
+        v-for="i in 12"
+        :key="i"
+        type="button"
+        :disabled="isPickerDateDisabled(new CalendarDate(yearGridStart + i - 1, 1, 1))"
+        :class="cn(
+  buttonVariants({ variant: 'ghost' }),
+  'h-9 w-full rounded-md font-normal',
+  modelValue && !Array.isArray(modelValue) && modelValue.year === yearGridStart + i - 1 ? 'bg-[color-mix(in_srgb,var(--primary)_20%,white)] text-(--primary)' : '',
+  isPickerDateDisabled(new CalendarDate(yearGridStart + i - 1, 1, 1)) ? 'text-zinc-500 opacity-50 cursor-default' : 'cursor-pointer'
+)"
+        @click="emits('update:modelValue', new CalendarDate(yearGridStart + i - 1, 1, 1))"
+      >
+        {{ yearGridStart + i - 1 }}
+      </button>
+    </div>
+
+    <!-- Default: day grid -->
+    <div
+      v-else
+      class="flex flex-col gap-y-4 mt-4 sm:flex-row sm:gap-x-4 sm:gap-y-0"
+    >
       <CalendarGrid
         v-for="month in grid"
         :key="month.value.toString()"

package/dist/runtime/components/ui/calendar/Calendar.vue.d.ts

@@ -4,23 +4,16 @@ import type { LayoutTypes } from '.';
 type __VLS_Props = CalendarRootProps & {
     class?: HTMLAttributes['class'];
     layout?: LayoutTypes;
-    yearRange?: DateValue[];
 };
-declare var __VLS_59: {}, __VLS_67: {}, __VLS_69: {
+declare var __VLS_20: {}, __VLS_28: {}, __VLS_30: {
     date: DateValue;
-    month: import("@vueuse/core").ReuseTemplateComponent<{
-        date: DateValue;
-    }, Record<"default", undefined>>;
-    year: import("@vueuse/core").ReuseTemplateComponent<{
-        date: DateValue;
-    }, Record<"default", undefined>>;
 };
 type __VLS_Slots = {} & {
-    'calendar-prev-icon'?: (props: typeof __VLS_59) => any;
+    'calendar-prev-icon'?: (props: typeof __VLS_20) => any;
 } & {
-    'calendar-next-icon'?: (props: typeof __VLS_67) => any;
+    'calendar-next-icon'?: (props: typeof __VLS_28) => any;
 } & {
-    'calendar-heading'?: (props: typeof __VLS_69) => any;
+    'calendar-heading'?: (props: typeof __VLS_30) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (date: DateValue | undefined) => any;
@@ -30,7 +23,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {},
     "onUpdate:placeholder"?: ((date: DateValue) => any) | undefined;
 }>, {
     modelValue: DateValue | DateValue[];
-    layout: "month-and-year" | "month-only" | "year-only";
+    layout: LayoutTypes;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/ui/calendar/CalendarCellTrigger.vue

@@ -24,7 +24,7 @@ const forwardedProps = useForwardProps(delegatedProps);
   // Selected
   'data-selected:bg-[color-mix(in_srgb,var(--primary)_20%,white)] data-selected:opacity-100 data-selected:text-(--primary)',
   // Disabled
-  'data-disabled:text-zinc-500 data-disabled:opacity-50',
+  'data-disabled:text-zinc-500 data-disabled:opacity-50 data-disabled:cursor-not-allowed data-disabled:hover:bg-transparent data-disabled:hover:text-zinc-500',
   // Unavailable
   'data-unavailable:text-zinc-300 data-unavailable:line-through',
   // Outside months

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

@@ -10,4 +10,4 @@ export { default as CalendarHeader } from './CalendarHeader.vue.js';
 export { default as CalendarHeading } from './CalendarHeading.vue.js';
 export { default as CalendarNextButton } from './CalendarNextButton.vue.js';
 export { default as CalendarPrevButton } from './CalendarPrevButton.vue.js';
-export type LayoutTypes = 'month-and-year' | 'month-only' | 'year-only' | undefined;
+export type LayoutTypes = 'year' | 'month' | 'date';

package/dist/runtime/components/ui/command/CommandGroup.vue

@@ -39,6 +39,10 @@ onUnmounted(() => {
     >
       {{ heading }}
     </ListboxGroupLabel>
+    <div
+      v-else
+      class="h-1"
+    />
     <slot />
   </ListboxGroup>
 </template>

package/dist/runtime/components/ui/dialog/DialogOverlay.vue

@@ -15,7 +15,7 @@ const delegatedProps = reactiveOmit(props, "class");
   <DialogOverlay
     data-slot="dialog-overlay"
     v-bind="delegatedProps"
-    :class="cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/60', props.class)"
+    :class="cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-zinc-900/60', props.class)"
   >
     <slot />
   </DialogOverlay>

package/dist/runtime/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue

@@ -25,7 +25,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits);
     data-slot="dropdown-menu-checkbox-item"
     v-bind="forwarded"
     :class="cn(
-  'focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
+  'focus:bg-zinc-100 focus:text-zinc-700 relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
   props.class
 )"
   >

package/dist/runtime/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue

@@ -24,7 +24,7 @@ const forwardedProps = useForwardProps(delegatedProps);
     v-bind="forwardedProps"
     :data-inset="inset ? '' : void 0"
     :class="cn(
-  'focus:bg-zinc-100 focus:text-zinc-700 data-[state=open]:bg-zinc-100 data-[state=open]:text-zinc-700 relative flex cursor-pointer items-center gap-2 rounded-sm p-2 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive! [&_svg:not([class*=\'text-\'])]:text-muted-foreground',
+  'focus:bg-zinc-100 focus:text-zinc-700 data-[state=open]:bg-zinc-100 data-[state=open]:text-zinc-700 relative flex cursor-pointer items-center gap-2 rounded-sm p-2 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 data-[variant=destructive]:*:[svg]:text-red-600! [&_svg:not([class*=\'text-\'])]:text-zinc-400',
   props.class
 )"
   >

package/dist/runtime/components/ui/field/FieldDescription.vue

@@ -9,7 +9,7 @@ const props = defineProps({
   <p
     data-slot="field-description"
     :class="cn(
-  'text-muted-foreground text-sm leading-normal font-normal group-has-data-[orientation=horizontal]/field:text-balance',
+  'text-zinc-400 text-sm leading-normal font-normal group-has-data-[orientation=horizontal]/field:text-balance',
   'last:mt-0 nth-last-2:-mt-1 [[data-variant=legend]+&]:-mt-1.5',
   '[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4',
   props.class

package/dist/runtime/components/ui/field/FieldError.vue

@@ -28,7 +28,7 @@ const content = computed(() => {
     v-if="$slots.default || content"
     role="alert"
     data-slot="field-error"
-    :class="cn('text-destructive text-sm font-normal', props.class)"
+    :class="cn('text-red-600 text-sm font-normal', props.class)"
   >
     <slot v-if="$slots.default" />
 

package/dist/runtime/components/ui/field/FieldLabel.vue

@@ -10,7 +10,7 @@ const props = defineProps({
   <Label
     data-slot="field-label"
     :class="cn(
-  'group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50',
+  'group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:text-zinc-600 group-data-[disabled=true]/field:opacity-100',
   'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border *:data-[slot=field]:p-4',
   'has-data-[state=checked]:bg-primary/5 has-data-[state=checked]:border-primary dark:has-data-[state=checked]:bg-primary/10',
   props.class

package/dist/runtime/components/ui/field/FieldSeparator.vue

@@ -18,7 +18,7 @@ const props = defineProps({
     <Separator class="absolute inset-0 top-1/2" />
     <span
       v-if="$slots.default"
-      class="bg-background text-muted-foreground relative mx-auto block w-fit px-2"
+      class="bg-zinc-50 text-zinc-400 relative mx-auto block w-fit px-2"
       data-slot="field-separator-content"
     >
       <slot />

package/dist/runtime/components/ui/field/index.js

@@ -1,13 +1,13 @@
 import { cva } from "class-variance-authority";
 export const fieldVariants = cva(
-  "group/field flex w-full gap-3 data-[invalid=true]:text-destructive",
+  "group/field flex w-full gap-3 data-[invalid=true]:text-red-400",
   {
     variants: {
       orientation: {
         vertical: ["flex-col *:w-full [&>.sr-only]:w-auto"],
         horizontal: [
           "flex-row items-center",
-          "*:data-[slot=field-label]:flex-auto",
+          "*:data-[slot=field-label]:shrink-0 *:data-[slot=field-label]:whitespace-nowrap",
           "has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
         ],
         responsive: [
@@ -16,11 +16,12 @@ export const fieldVariants = cva(
           "@md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
         ],
         floating: [
-          "relative *:data-[slot=field-label]:absolute *:data-[slot=field-label]:text-zinc-500",
-          "*:data-[slot=field-label]:top-1/2 *:data-[slot=field-label]:-translate-y-1/2 *:data-[slot=field-label]:transition-all *:data-[slot=field-label]:duration-180",
+          "relative *:data-[slot=field-label]:absolute *:data-[slot=field-label]:text-zinc-500 *:data-[slot=field-label]:z-20",
+          "*:data-[slot=field-label]:top-1/2 *:data-[slot=field-label]:-translate-y-1/2 *:data-[slot=field-label]:transition-[top,transform,color,font-size] *:data-[slot=field-label]:duration-180",
           "*:data-[slot=field-label]:pointer-events-none *:data-[slot=field-label]:select-none *:data-[slot=field-label]:cursor-text",
           "has-data-[value=true]:**:data-[slot=field-label]:top-0",
           "**:data-[slot=field-label]:bg-white",
+          "data-[disabled=true]:**:data-[slot=field-label]:bg-transparent",
           "**:data-[slot=field-label]:px-1",
           "has-data-[value=true]:**:data-[slot=field-label]:text-xs",
           "has-[[data-slot=input-group-control]:focus]:**:data-[slot=field-label]:top-0",
@@ -30,13 +31,14 @@ export const fieldVariants = cva(
           "has-[[data-slot=input-group-control]:focus]:**:data-[slot=field-label]:text-zinc-700",
           "has-data-[state=open]:**:data-[slot=field-label]:text-zinc-700",
           "has-data-[value=true]:**:data-[slot=field-label]:text-zinc-700",
+          "data-[disabled=true]:**:data-[slot=field-label]:text-zinc-400",
           "*:data-[slot=field-label]:left-3",
           "has-[[data-slot=input-group-addon][data-align=inline-start]]:**:data-[slot=field-label]:left-7"
         ]
       }
     },
     defaultVariants: {
-      orientation: "floating"
+      orientation: "horizontal"
     }
   }
 );

package/dist/runtime/components/ui/input/Input.vue

@@ -20,7 +20,7 @@ const modelValue = useVModel(props, "modelValue", emits, {
     data-slot="input"
     :data-value="!treatEmptyAsDifferentStateFromNull ? !!modelValue : modelValue !== void 0"
     :class="cn(
-  'file:text-zinc-700 placeholder:text-zinc-700 text-zinc-700 border-zinc-200 h-9 w-full min-w-0 rounded border bg-transparent px-3 py-1 text-base transition-colors ease-out duration-180 outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+  'file:text-zinc-700 placeholder:text-zinc-300 text-zinc-700 border-zinc-200 h-9 w-full min-w-0 rounded border bg-transparent px-3 py-1 text-base transition-colors ease-out duration-180 outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
   'aria-invalid:border-red-400 hover:border-zinc-300 focus-visible:border-(--primary)',
   props.class
 )"

package/dist/runtime/components/ui/input-group/InputGroup.vue

@@ -15,6 +15,9 @@ setInputGroupReference(useTemplateRef("input-group"));
     role="group"
     :class="cn(
   'group/input-group border-zinc-200 relative flex w-full items-center rounded-md border transition-[color,box-shadow] outline-none',
+  'data-[disabled=true]:border-zinc-100 data-[disabled=true]:bg-zinc-100',
+  'data-[disabled=true]:[&_[data-slot=input-group-control]]:text-zinc-600',
+  'data-[disabled=true]:[&_[data-slot=input-group-control]]:opacity-100',
   'h-9 min-w-0 has-[>textarea]:h-auto',
   // Variants based on alignment.
   'has-[>[data-align=inline-start]]:[&>input]:pl-2',