nuxt-ui-elements-pro 0.1.9 → 0.1.11

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

@@ -0,0 +1,118 @@
+import type { AppConfig } from "@nuxt/schema";
+import type { ComponentConfig } from "nuxt-ui-elements";
+import type { FeedbackType, FeedbackTypeId, FeedbackSubmission, FeedbackSubmitResult, FeedbackWidgetPosition, FeedbackWidgetContext } from "../types/feedback-widget.js";
+import { type Component } from "vue";
+import theme from "#build/ui-elements-pro/feedback-widget";
+type FeedbackWidgetTheme = ComponentConfig<typeof theme, AppConfig, "feedbackWidget">;
+export interface FeedbackWidgetProps {
+    /** Rendered element type @defaultValue 'div' */
+    as?: string | Component;
+    /** Configurable feedback type options @defaultValue bug/feature/general */
+    feedbackTypes?: FeedbackType[];
+    /** Widget position @defaultValue 'bottom-right' */
+    position?: FeedbackWidgetPosition;
+    /** Theme color @defaultValue 'primary' */
+    color?: FeedbackWidgetTheme["variants"]["color"];
+    /** Show screenshot capture button @defaultValue false */
+    showScreenshot?: boolean;
+    /** Custom button icon @defaultValue 'i-lucide-message-square-plus' */
+    buttonIcon?: string;
+    /** Button label (screen reader) @defaultValue 'Send feedback' */
+    buttonLabel?: string;
+    /** Panel title @defaultValue 'Send Feedback' */
+    title?: string;
+    /** Email field placeholder @defaultValue 'your@email.com' */
+    emailPlaceholder?: string;
+    /** Message field placeholder @defaultValue 'Tell us what you think...' */
+    messagePlaceholder?: string;
+    /** Custom submit handler. If provided, bypasses built-in server route. */
+    onSubmit?: (submission: FeedbackSubmission) => Promise<FeedbackSubmitResult> | FeedbackSubmitResult;
+    /** Built-in endpoint path @defaultValue '/api/_feedback' */
+    submitEndpoint?: string;
+    /** Slot class overrides */
+    ui?: FeedbackWidgetTheme["slots"];
+}
+export interface FeedbackWidgetEmits {
+    /** Fires when the panel opens */
+    open: [];
+    /** Fires when the panel closes */
+    close: [];
+    /** Fires after successful submission */
+    success: [submission: FeedbackSubmission];
+    /** Fires on submission error */
+    error: [message: string];
+}
+export interface FeedbackWidgetSlots {
+    /** Compound mode: full rendering control */
+    default?: (props: FeedbackWidgetContext) => any;
+    /** Custom trigger button */
+    button?: (props: {
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
+        isOpen: boolean;
+    }) => any;
+    /** Custom panel header */
+    "panel-header"?: (props: {
+        title: string;
+        close: () => void;
+    }) => any;
+    /** Custom type selector */
+    "type-selector"?: (props: {
+        types: FeedbackType[];
+        selected: FeedbackTypeId | null;
+        select: (id: FeedbackTypeId) => void;
+    }) => any;
+    /** Custom form fields */
+    form?: (props: {
+        email: string;
+        message: string;
+        screenshot: string | null;
+    }) => any;
+    /** Custom success state */
+    success?: (props: {
+        reset: () => void;
+        close: () => void;
+    }) => any;
+    /** Custom submit button area */
+    "submit-area"?: (props: {
+        submit: () => void;
+        isValid: boolean;
+        isSubmitting: boolean;
+    }) => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FeedbackWidgetProps, {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    reset: () => void;
+    submit: () => Promise<void>;
+    isOpen: import("vue").Ref<boolean, boolean>;
+    isSubmitted: import("vue").Ref<boolean, boolean>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    success: (submission: FeedbackSubmission) => any;
+    error: (message: string) => any;
+    close: () => any;
+    open: () => any;
+}, string, import("vue").PublicProps, Readonly<FeedbackWidgetProps> & Readonly<{
+    onSuccess?: ((submission: FeedbackSubmission) => any) | undefined;
+    onError?: ((message: string) => any) | undefined;
+    onClose?: (() => any) | undefined;
+    onOpen?: (() => any) | undefined;
+}>, {
+    title: string;
+    position: FeedbackWidgetPosition;
+    buttonIcon: string;
+    showScreenshot: boolean;
+    buttonLabel: string;
+    emailPlaceholder: string;
+    messagePlaceholder: string;
+    submitEndpoint: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FeedbackWidgetSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,138 @@
+import type { AppConfig } from "@nuxt/schema";
+import type { ComponentConfig } from "nuxt-ui-elements";
+import type { DateValue } from "@internationalized/date";
+import type { GanttTask, GanttDependency, GanttZoomLevel, GanttTaskBar, GanttTaskDropPayload, GanttTaskResizePayload, GanttChartContext } from "../types/gantt-chart.js";
+import { type Component } from "vue";
+import theme from "#build/ui-elements-pro/gantt-chart";
+type GanttChartTheme = ComponentConfig<typeof theme, AppConfig, "ganttChart">;
+export interface GanttChartProps {
+    /** Rendered element type @defaultValue 'div' */
+    as?: string | Component;
+    /** Array of tasks to display */
+    tasks?: GanttTask[];
+    /** Array of task dependencies */
+    dependencies?: GanttDependency[];
+    /** Displayed date (v-model) */
+    modelValue?: Date | string | DateValue;
+    /** Current zoom level (v-model:zoomLevel) @defaultValue 'month' */
+    zoomLevel?: GanttZoomLevel;
+    /** Available zoom levels @defaultValue all levels */
+    zoomLevels?: GanttZoomLevel[];
+    /** Locale for formatting @defaultValue 'en-US' */
+    locale?: string;
+    /** Enable drag/drop and resize @defaultValue true */
+    editable?: boolean;
+    /** Show loading state @defaultValue false */
+    loading?: boolean;
+    /** Theme color @defaultValue 'primary' */
+    color?: GanttChartTheme["variants"]["color"];
+    /** Row height in pixels @defaultValue 40 */
+    rowHeight?: number;
+    /** Two-way binding for expanded group IDs */
+    expanded?: (string | number)[];
+    /** Slot class overrides */
+    ui?: GanttChartTheme["slots"];
+}
+export interface GanttChartEmits {
+    /** Fires when displayed date changes */
+    "update:modelValue": [value: import("@internationalized/date").CalendarDate];
+    /** Fires when zoom level changes */
+    "update:zoomLevel": [value: GanttZoomLevel];
+    /** Fires when expanded group IDs change */
+    "update:expanded": [value: (string | number)[]];
+    /** Fires when a task is clicked */
+    "taskClick": [task: GanttTask];
+    /** Fires when a task is moved via drag */
+    "taskDrop": [payload: GanttTaskDropPayload];
+    /** Fires when a task is resized */
+    "taskResize": [payload: GanttTaskResizePayload];
+}
+export interface GanttChartSlots {
+    /** Compound mode: full rendering control */
+    default?: (props: GanttChartContext) => any;
+    /** Custom header rendering */
+    header?: (props: {
+        title: string;
+        zoomLevel: GanttZoomLevel;
+        setZoomLevel: (l: GanttZoomLevel) => void;
+    }) => any;
+    /** Custom header title */
+    "header-title"?: (props: {
+        title: string;
+    }) => any;
+    /** Custom navigation buttons */
+    "header-nav"?: (props: {
+        prev: () => void;
+        next: () => void;
+        today: () => void;
+    }) => any;
+    /** Custom zoom level switcher */
+    "zoom-switcher"?: (props: {
+        zoomLevel: GanttZoomLevel;
+        setZoomLevel: (l: GanttZoomLevel) => void;
+        zoomLevels: GanttZoomLevel[];
+    }) => any;
+    /** Custom task bar rendering */
+    "task-bar"?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+    }) => any;
+    /** Custom milestone rendering */
+    milestone?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+    }) => any;
+    /** Custom group header rendering */
+    "group-header"?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+        expanded: boolean;
+        toggle: () => void;
+    }) => any;
+    /** Custom today marker */
+    "today-marker"?: () => any;
+    /** Custom dependency arrow rendering */
+    dependency?: (props: {
+        paths: import("../types/gantt-chart.js").GanttDependencyPath[];
+    }) => any;
+    /** Custom loading state */
+    loading?: () => any;
+    /** Custom empty state */
+    empty?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<GanttChartProps, {
+    expandAll: () => void;
+    collapseAll: () => void;
+    toggleExpand: (id: string | number) => void;
+    scrollToDate: (date: import("@internationalized/date").CalendarDate) => void;
+    scrollToTask: (taskId: string | number) => void;
+    layout: import("vue").ComputedRef<import("../types/gantt-chart.js").GanttLayout>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: import("@internationalized/date").CalendarDate) => any;
+    "update:zoomLevel": (value: GanttZoomLevel) => any;
+    "update:expanded": (value: (string | number)[]) => any;
+    taskClick: (task: GanttTask) => any;
+    taskDrop: (payload: GanttTaskDropPayload) => any;
+    taskResize: (payload: GanttTaskResizePayload) => any;
+}, string, import("vue").PublicProps, Readonly<GanttChartProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: import("@internationalized/date").CalendarDate) => any) | undefined;
+    "onUpdate:zoomLevel"?: ((value: GanttZoomLevel) => any) | undefined;
+    "onUpdate:expanded"?: ((value: (string | number)[]) => any) | undefined;
+    onTaskClick?: ((task: GanttTask) => any) | undefined;
+    onTaskDrop?: ((payload: GanttTaskDropPayload) => any) | undefined;
+    onTaskResize?: ((payload: GanttTaskResizePayload) => any) | undefined;
+}>, {
+    editable: boolean;
+    loading: boolean;
+    locale: string;
+    zoomLevel: GanttZoomLevel;
+    zoomLevels: GanttZoomLevel[];
+    rowHeight: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, GanttChartSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/GanttChart.vue

@@ -0,0 +1,206 @@
+<script>
+import { Primitive } from "reka-ui";
+import { computed, provide, useSlots } from "vue";
+import { tv } from "../utils/tv";
+import { useGanttChart } from "../composables/useGanttChart";
+import { useGanttChartDragDrop } from "../composables/useGanttChartDragDrop";
+import { useGanttChartResize } from "../composables/useGanttChartResize";
+import { useGanttChartKeyboard } from "../composables/useGanttChartKeyboard";
+import { ganttChartContextKey } from "../composables/useGanttChartContext";
+import { DEFAULT_ROW_HEIGHT } from "../utils/gantt-chart";
+import GanttChartHeader from "./gantt-chart/GanttChartHeader.vue";
+import GanttChartTimeline from "./gantt-chart/GanttChartTimeline.vue";
+import theme from "#build/ui-elements-pro/gantt-chart";
+</script>
+
+<script setup>
+const props = defineProps({
+  as: { type: null, required: false },
+  tasks: { type: Array, required: false },
+  dependencies: { type: Array, required: false },
+  modelValue: { type: null, required: false },
+  zoomLevel: { type: String, required: false, default: "month" },
+  zoomLevels: { type: Array, required: false, default: () => ["day", "week", "month", "quarter", "year"] },
+  locale: { type: String, required: false, default: "en-US" },
+  editable: { type: Boolean, required: false, default: true },
+  loading: { type: Boolean, required: false, default: false },
+  color: { type: null, required: false },
+  rowHeight: { type: Number, required: false, default: DEFAULT_ROW_HEIGHT },
+  expanded: { type: Array, required: false },
+  ui: { type: Object, required: false }
+});
+const emit = defineEmits(["update:modelValue", "update:zoomLevel", "update:expanded", "taskClick", "taskDrop", "taskResize"]);
+defineSlots();
+const slots = useSlots();
+const ui = computed(
+  () => tv({
+    extend: tv(theme)
+  })({
+    color: props.color ?? "primary"
+  })
+);
+const ganttChart = useGanttChart({
+  tasks: () => props.tasks ?? [],
+  dependencies: () => props.dependencies ?? [],
+  modelValue: () => props.modelValue,
+  zoomLevel: () => props.zoomLevel,
+  zoomLevels: () => props.zoomLevels,
+  locale: () => props.locale,
+  rowHeight: () => props.rowHeight,
+  expanded: () => props.expanded,
+  onUpdateModelValue: (date) => emit("update:modelValue", date),
+  onUpdateZoomLevel: (level) => emit("update:zoomLevel", level),
+  onUpdateExpanded: (ids) => emit("update:expanded", ids)
+});
+const dragDrop = useGanttChartDragDrop({
+  editable: () => props.editable,
+  layout: ganttChart.layout,
+  zoomLevel: ganttChart.zoomLevel,
+  unitWidth: ganttChart.unitWidth,
+  dateToPixel: ganttChart.dateToPixel,
+  pixelToDate: ganttChart.pixelToDate,
+  onTaskDrop: (payload) => emit("taskDrop", payload)
+});
+const resize = useGanttChartResize({
+  editable: () => props.editable,
+  zoomLevel: ganttChart.zoomLevel,
+  unitWidth: ganttChart.unitWidth,
+  dateToPixel: ganttChart.dateToPixel,
+  pixelToDate: ganttChart.pixelToDate,
+  onTaskResize: (payload) => emit("taskResize", payload)
+});
+const flatVisibleTaskBars = computed(() => ganttChart.layout.value.taskBars);
+const keyboard = useGanttChartKeyboard({
+  flatVisibleTasks: flatVisibleTaskBars,
+  expandedIds: ganttChart.expandedIds,
+  toggleExpand: ganttChart.toggleExpand,
+  scrollToTask: ganttChart.scrollToTask
+});
+function handleTaskClick(task, _e) {
+  emit("taskClick", task.original);
+}
+const ctx = {
+  zoomLevel: ganttChart.zoomLevel,
+  locale: computed(() => props.locale),
+  editable: computed(() => props.editable),
+  loading: computed(() => props.loading),
+  color: computed(() => props.color ?? "primary"),
+  layout: ganttChart.layout,
+  rowHeight: ganttChart.rowHeight,
+  timelineStart: ganttChart.timelineStart,
+  timelineEnd: ganttChart.timelineEnd,
+  headerTitle: ganttChart.headerTitle,
+  goToPrev: ganttChart.goToPrev,
+  goToNext: ganttChart.goToNext,
+  goToToday: ganttChart.goToToday,
+  setZoomLevel: ganttChart.setZoomLevel,
+  scrollToDate: ganttChart.scrollToDate,
+  scrollToTask: ganttChart.scrollToTask,
+  zoomLevels: ganttChart.zoomLevels,
+  expandedIds: ganttChart.expandedIds,
+  toggleExpand: ganttChart.toggleExpand,
+  expandAll: ganttChart.expandAll,
+  collapseAll: ganttChart.collapseAll,
+  isExpanded: ganttChart.isExpanded,
+  handleTaskClick,
+  getTaskStyle: ganttChart.getTaskStyle,
+  draggedTaskId: dragDrop.draggedTaskId,
+  dragPreview: dragDrop.dragPreview,
+  onDragStart: dragDrop.onDragStart,
+  resizingTaskId: resize.resizingTaskId,
+  resizeEdge: resize.resizeEdge,
+  resizePreview: resize.resizePreview,
+  onResizePointerDown: resize.onResizePointerDown,
+  focusedTaskId: keyboard.focusedTaskId,
+  onKeydown: keyboard.onKeydown,
+  dateToPixel: ganttChart.dateToPixel,
+  pixelToDate: ganttChart.pixelToDate,
+  ui,
+  propUi: computed(() => props.ui)
+};
+provide(ganttChartContextKey, ctx);
+defineExpose({
+  expandAll: ganttChart.expandAll,
+  collapseAll: ganttChart.collapseAll,
+  toggleExpand: ganttChart.toggleExpand,
+  scrollToDate: ganttChart.scrollToDate,
+  scrollToTask: ganttChart.scrollToTask,
+  layout: ganttChart.layout
+});
+</script>
+
+<template>
+  <Primitive
+    :as="props.as ?? 'div'"
+    data-slot="root"
+    :class="ui.root({ class: props.ui?.root })"
+    role="treegrid"
+    aria-label="Gantt chart"
+    tabindex="0"
+    @keydown="ctx.onKeydown"
+  >
+    <!-- Compound mode: user provides #default and owns rendering -->
+    <slot v-if="slots.default" v-bind="ctx" />
+
+    <!-- Auto mode: render everything with slot forwarding -->
+    <template v-else>
+      <slot name="header" :title="ctx.headerTitle.value" :zoom-level="ctx.zoomLevel.value" :set-zoom-level="ctx.setZoomLevel">
+        <GanttChartHeader>
+          <template v-if="slots['header-title']" #title="titleProps">
+            <slot name="header-title" v-bind="titleProps" />
+          </template>
+          <template v-if="slots['zoom-switcher']" #zoom-switcher="zoomProps">
+            <slot name="zoom-switcher" v-bind="zoomProps" />
+          </template>
+          <template v-if="slots['header-nav']" #nav="navProps">
+            <slot name="header-nav" v-bind="navProps" />
+          </template>
+        </GanttChartHeader>
+      </slot>
+
+      <div
+        v-if="ganttChart.layout.value.taskBars.length > 0"
+        :ref="(el) => {
+  ganttChart.bodyEl.value = el;
+}"
+        data-slot="body"
+        :class="ui.body({ class: props.ui?.body })"
+      >
+        <GanttChartTimeline>
+          <template v-if="slots['task-bar']" #task-bar="barProps">
+            <slot name="task-bar" v-bind="barProps" />
+          </template>
+          <template v-if="slots.milestone" #milestone="msProps">
+            <slot name="milestone" v-bind="msProps" />
+          </template>
+          <template v-if="slots['group-header']" #group-header="ghProps">
+            <slot name="group-header" v-bind="ghProps" />
+          </template>
+          <template v-if="slots['today-marker']" #today-marker>
+            <slot name="today-marker" />
+          </template>
+          <template v-if="slots.dependency" #dependency="depProps">
+            <slot name="dependency" v-bind="depProps" />
+          </template>
+        </GanttChartTimeline>
+      </div>
+
+      <slot v-else name="empty">
+        <div data-slot="emptyState" :class="ui.emptyState({ class: props.ui?.emptyState })">
+          <p :class="ui.emptyStateText({ class: props.ui?.emptyStateText })">No tasks to display</p>
+        </div>
+      </slot>
+
+      <!-- Loading overlay -->
+      <div
+        v-if="props.loading"
+        data-slot="loadingOverlay"
+        :class="ui.loadingOverlay({ class: props.ui?.loadingOverlay })"
+      >
+        <slot name="loading">
+          <UIcon name="i-lucide-loader-2" class="size-8 text-muted animate-spin" />
+        </slot>
+      </div>
+    </template>
+  </Primitive>
+</template>

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

@@ -0,0 +1,138 @@
+import type { AppConfig } from "@nuxt/schema";
+import type { ComponentConfig } from "nuxt-ui-elements";
+import type { DateValue } from "@internationalized/date";
+import type { GanttTask, GanttDependency, GanttZoomLevel, GanttTaskBar, GanttTaskDropPayload, GanttTaskResizePayload, GanttChartContext } from "../types/gantt-chart.js";
+import { type Component } from "vue";
+import theme from "#build/ui-elements-pro/gantt-chart";
+type GanttChartTheme = ComponentConfig<typeof theme, AppConfig, "ganttChart">;
+export interface GanttChartProps {
+    /** Rendered element type @defaultValue 'div' */
+    as?: string | Component;
+    /** Array of tasks to display */
+    tasks?: GanttTask[];
+    /** Array of task dependencies */
+    dependencies?: GanttDependency[];
+    /** Displayed date (v-model) */
+    modelValue?: Date | string | DateValue;
+    /** Current zoom level (v-model:zoomLevel) @defaultValue 'month' */
+    zoomLevel?: GanttZoomLevel;
+    /** Available zoom levels @defaultValue all levels */
+    zoomLevels?: GanttZoomLevel[];
+    /** Locale for formatting @defaultValue 'en-US' */
+    locale?: string;
+    /** Enable drag/drop and resize @defaultValue true */
+    editable?: boolean;
+    /** Show loading state @defaultValue false */
+    loading?: boolean;
+    /** Theme color @defaultValue 'primary' */
+    color?: GanttChartTheme["variants"]["color"];
+    /** Row height in pixels @defaultValue 40 */
+    rowHeight?: number;
+    /** Two-way binding for expanded group IDs */
+    expanded?: (string | number)[];
+    /** Slot class overrides */
+    ui?: GanttChartTheme["slots"];
+}
+export interface GanttChartEmits {
+    /** Fires when displayed date changes */
+    "update:modelValue": [value: import("@internationalized/date").CalendarDate];
+    /** Fires when zoom level changes */
+    "update:zoomLevel": [value: GanttZoomLevel];
+    /** Fires when expanded group IDs change */
+    "update:expanded": [value: (string | number)[]];
+    /** Fires when a task is clicked */
+    "taskClick": [task: GanttTask];
+    /** Fires when a task is moved via drag */
+    "taskDrop": [payload: GanttTaskDropPayload];
+    /** Fires when a task is resized */
+    "taskResize": [payload: GanttTaskResizePayload];
+}
+export interface GanttChartSlots {
+    /** Compound mode: full rendering control */
+    default?: (props: GanttChartContext) => any;
+    /** Custom header rendering */
+    header?: (props: {
+        title: string;
+        zoomLevel: GanttZoomLevel;
+        setZoomLevel: (l: GanttZoomLevel) => void;
+    }) => any;
+    /** Custom header title */
+    "header-title"?: (props: {
+        title: string;
+    }) => any;
+    /** Custom navigation buttons */
+    "header-nav"?: (props: {
+        prev: () => void;
+        next: () => void;
+        today: () => void;
+    }) => any;
+    /** Custom zoom level switcher */
+    "zoom-switcher"?: (props: {
+        zoomLevel: GanttZoomLevel;
+        setZoomLevel: (l: GanttZoomLevel) => void;
+        zoomLevels: GanttZoomLevel[];
+    }) => any;
+    /** Custom task bar rendering */
+    "task-bar"?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+    }) => any;
+    /** Custom milestone rendering */
+    milestone?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+    }) => any;
+    /** Custom group header rendering */
+    "group-header"?: (props: {
+        task: GanttTask;
+        bar: GanttTaskBar;
+        expanded: boolean;
+        toggle: () => void;
+    }) => any;
+    /** Custom today marker */
+    "today-marker"?: () => any;
+    /** Custom dependency arrow rendering */
+    dependency?: (props: {
+        paths: import("../types/gantt-chart.js").GanttDependencyPath[];
+    }) => any;
+    /** Custom loading state */
+    loading?: () => any;
+    /** Custom empty state */
+    empty?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<GanttChartProps, {
+    expandAll: () => void;
+    collapseAll: () => void;
+    toggleExpand: (id: string | number) => void;
+    scrollToDate: (date: import("@internationalized/date").CalendarDate) => void;
+    scrollToTask: (taskId: string | number) => void;
+    layout: import("vue").ComputedRef<import("../types/gantt-chart.js").GanttLayout>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: import("@internationalized/date").CalendarDate) => any;
+    "update:zoomLevel": (value: GanttZoomLevel) => any;
+    "update:expanded": (value: (string | number)[]) => any;
+    taskClick: (task: GanttTask) => any;
+    taskDrop: (payload: GanttTaskDropPayload) => any;
+    taskResize: (payload: GanttTaskResizePayload) => any;
+}, string, import("vue").PublicProps, Readonly<GanttChartProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: import("@internationalized/date").CalendarDate) => any) | undefined;
+    "onUpdate:zoomLevel"?: ((value: GanttZoomLevel) => any) | undefined;
+    "onUpdate:expanded"?: ((value: (string | number)[]) => any) | undefined;
+    onTaskClick?: ((task: GanttTask) => any) | undefined;
+    onTaskDrop?: ((payload: GanttTaskDropPayload) => any) | undefined;
+    onTaskResize?: ((payload: GanttTaskResizePayload) => any) | undefined;
+}>, {
+    editable: boolean;
+    loading: boolean;
+    locale: string;
+    zoomLevel: GanttZoomLevel;
+    zoomLevels: GanttZoomLevel[];
+    rowHeight: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, GanttChartSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/event-calendar/EventCalendarMonthView.d.vue.ts

@@ -12,6 +12,9 @@ export interface EventCalendarMonthViewSlots {
     "month-day-header": (props: {
         day: CalendarDay;
     }) => any;
+    "month-day-cell": (props: {
+        day: CalendarDay;
+    }) => any;
     event: (props: {
         event: CalendarEvent;
         view: CalendarView;

package/dist/runtime/components/event-calendar/EventCalendarMonthView.vue

@@ -78,6 +78,7 @@ onKeyStroke("Escape", () => {
           :aria-current="day.isToday ? 'date' : void 0"
           :data-date="day.date.toString()"
           :class="[
+  'group/cell',
   ctx.ui.value.dayCell({ class: ctx.propUi.value?.dayCell }),
   !day.isCurrentMonth && ctx.ui.value.dayCellOutside({ class: ctx.propUi.value?.dayCellOutside }),
   ctx.dropTargetKey.value === `month-${day.date.toString()}` && ctx.ui.value.dropTarget({ class: ctx.propUi.value?.dropTarget }),
@@ -96,6 +97,12 @@ onKeyStroke("Escape", () => {
           @dragover="ctx.onDragOver(`month-${day.date.toString()}`, $event)"
           @dragleave="ctx.onDragLeave"
           @drop="ctx.onDropMonthCell(day.date, $event)">
+          <div
+            v-if="$slots['month-day-cell']"
+            data-slot="monthDayCell"
+            :class="ctx.ui.value.monthDayCell({ class: ctx.propUi.value?.monthDayCell })">
+            <slot name="month-day-cell" :day="day" />
+          </div>
         </div>
 
         <!-- Layer 2: Day numbers (row 1) -->
@@ -108,16 +115,18 @@ onKeyStroke("Escape", () => {
   gridColumn: `${colIdx + 1}`,
   gridRow: '1'
 }">
-          <slot name="month-day-header" :day="day">
-            <div
-              :class="[
+          <div class="pointer-events-auto w-fit">
+            <slot name="month-day-header" :day="day">
+              <div
+                :class="[
   !day.isToday && ctx.ui.value.dayNumber({ class: ctx.propUi.value?.dayNumber }),
   day.isToday && ctx.ui.value.dayNumberToday({ class: ctx.propUi.value?.dayNumberToday }),
   !day.isCurrentMonth && !day.isToday && ctx.ui.value.dayNumberOutside({ class: ctx.propUi.value?.dayNumberOutside })
 ]">
-              {{ day.date.day }}
-            </div>
-          </slot>
+                {{ day.date.day }}
+              </div>
+            </slot>
+          </div>
         </div>
 
         <!-- Layer 3: Spanning event bars -->

package/dist/runtime/components/event-calendar/EventCalendarMonthView.vue.d.ts

@@ -12,6 +12,9 @@ export interface EventCalendarMonthViewSlots {
     "month-day-header": (props: {
         day: CalendarDay;
     }) => any;
+    "month-day-cell": (props: {
+        day: CalendarDay;
+    }) => any;
     event: (props: {
         event: CalendarEvent;
         view: CalendarView;