@nu-grid/nuxt 0.1.1

package/dist/runtime/cell-types/boolean/BooleanRenderer.d.vue.ts

@@ -0,0 +1,13 @@
+interface Props {
+    value: boolean;
+    editable?: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:value"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {
+    editable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/boolean/BooleanRenderer.vue

@@ -0,0 +1,23 @@
+<script setup>
+import NuGridCellCheckbox from "../../components/NuGridCellCheckbox.vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  value: { type: Boolean, required: true },
+  editable: { type: Boolean, required: false, default: false }
+});
+const emit = defineEmits(["update:value"]);
+const handleUpdate = (newValue) => {
+  if (props.editable) {
+    emit("update:value", newValue);
+  }
+};
+</script>
+
+<template>
+  <NuGridCellCheckbox
+    :model-value="value"
+    :disabled="!editable"
+    :interactive="editable"
+    @update:model-value="handleUpdate"
+  />
+</template>

package/dist/runtime/cell-types/boolean/BooleanRenderer.vue.d.ts

@@ -0,0 +1,13 @@
+interface Props {
+    value: boolean;
+    editable?: boolean;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:value"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {
+    editable: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/boolean/index.d.ts

@@ -0,0 +1,8 @@
+import type { NuGridCellType } from '../../types/cells.js';
+/**
+ * Boolean cell type
+ * Checkbox input with special keyboard handling:
+ * - Space: Toggle the boolean value directly without entering edit mode
+ * - Enter: Enter edit mode (standard behavior)
+ */
+export declare const booleanCellType: NuGridCellType;

package/dist/runtime/cell-types/boolean/index.js

@@ -0,0 +1,31 @@
+import BooleanEditor from "./BooleanEditor.vue";
+import BooleanFilter from "./BooleanFilter.vue";
+import BooleanRenderer from "./BooleanRenderer.vue";
+export const booleanCellType = {
+  name: "boolean",
+  displayName: "Boolean",
+  description: "Checkbox column with toggle on Space key",
+  editor: BooleanEditor,
+  renderer: BooleanRenderer,
+  filter: {
+    component: BooleanFilter
+  },
+  enableFiltering: true,
+  keyboardHandler: (event, context) => {
+    const { isFocused, canEdit, getValue, row, columnDef, data, tableApi, emitChange } = context;
+    if (isFocused && canEdit && event.key === " ") {
+      const currentValue = getValue();
+      const newValue = !currentValue;
+      const rowIndex = data.findIndex((r, index) => {
+        return tableApi.options.getRowId?.(r, index) === row.id || r === row.original;
+      });
+      if (rowIndex !== -1 && columnDef.accessorKey) {
+        const key = columnDef.accessorKey;
+        data[rowIndex][key] = newValue;
+        emitChange(currentValue, newValue);
+      }
+      return { handled: true, preventDefault: true, stopPropagation: true };
+    }
+    return { handled: false };
+  }
+};

package/dist/runtime/cell-types/currency/CurrencyEditor.d.vue.ts

@@ -0,0 +1,15 @@
+import type { NuGridCellEditorProps } from '../../types/index.js';
+type __VLS_Props = NuGridCellEditorProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: any) => any;
+    "update:isNavigating": (value: boolean) => any;
+    "stop-editing": (moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any;
+    "cancel-editing": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:isNavigating"?: ((value: boolean) => any) | undefined;
+    "onStop-editing"?: ((moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any) | undefined;
+    "onCancel-editing"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/currency/CurrencyEditor.vue

@@ -0,0 +1,40 @@
+<script setup>
+import { computed, ref } from "vue";
+import { useNuGridCellEditor } from "../../composables";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  modelValue: { type: null, required: true },
+  cell: { type: null, required: true },
+  row: { type: Object, required: true },
+  isNavigating: { type: Boolean, required: true },
+  shouldFocus: { type: Boolean, required: true },
+  validationError: { type: [String, null], required: false },
+  showValidationErrors: { type: String, required: false },
+  interactionRouter: { type: Object, required: false }
+});
+const emit = defineEmits(["update:modelValue", "stop-editing", "cancel-editing", "update:isNavigating"]);
+const inputRef = ref(null);
+const { handleKeydown, handleBlur } = useNuGridCellEditor(props, emit, inputRef);
+const displayValue = computed(() => {
+  const value = props.modelValue;
+  if (value === null || value === void 0) return "";
+  return String(value);
+});
+</script>
+
+<template>
+  <div class="flex items-center gap-1">
+    <span class="text-gray-500">$</span>
+    <UInput
+      ref="inputRef"
+      :model-value="displayValue"
+      type="number"
+      step="0.01"
+      min="0"
+      class="flex-1 pl-0.5!"
+      @update:model-value="emit('update:modelValue', $event ? Number($event) : null)"
+      @blur="handleBlur"
+      @keydown="handleKeydown"
+    />
+  </div>
+</template>

package/dist/runtime/cell-types/currency/CurrencyEditor.vue.d.ts

@@ -0,0 +1,15 @@
+import type { NuGridCellEditorProps } from '../../types/index.js';
+type __VLS_Props = NuGridCellEditorProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: any) => any;
+    "update:isNavigating": (value: boolean) => any;
+    "stop-editing": (moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any;
+    "cancel-editing": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:isNavigating"?: ((value: boolean) => any) | undefined;
+    "onStop-editing"?: ((moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any) | undefined;
+    "onCancel-editing"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/currency/CurrencyFilter.d.vue.ts

@@ -0,0 +1,7 @@
+import type { NuGridFilterContext } from '../../types/cells.js';
+interface Props {
+    context: NuGridFilterContext;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/currency/CurrencyFilter.vue

@@ -0,0 +1,76 @@
+<script setup>
+import { computed, ref } from "vue";
+const props = defineProps({
+  context: { type: Object, required: true }
+});
+const filterValue = computed({
+  get: () => props.context.filterValue.value,
+  set: (value) => props.context.setFilterValue(value)
+});
+const operator = ref("equals");
+const operators = [
+  { value: "equals", label: "Equals" },
+  { value: "greaterThan", label: "Greater than" },
+  { value: "lessThan", label: "Less than" },
+  { value: "greaterThanOrEqual", label: "Greater than or equal" },
+  { value: "lessThanOrEqual", label: "Less than or equal" },
+  { value: "between", label: "Between" }
+];
+const filterValue2 = ref(null);
+function clearFilter() {
+  filterValue.value = null;
+  filterValue2.value = null;
+  props.context.clearFilter();
+}
+</script>
+
+<template>
+  <div class="min-w-[200px] space-y-2 p-2">
+    <div class="flex items-center gap-2">
+      <USelect
+        v-model="operator"
+        :options="operators"
+        option-attribute="label"
+        value-attribute="value"
+        class="flex-1"
+      />
+      <UButton
+        v-if="context.isFiltered"
+        icon="i-heroicons-x-mark"
+        size="xs"
+        color="neutral"
+        variant="ghost"
+        @click="clearFilter"
+      />
+    </div>
+    <div class="flex items-center gap-1">
+      <span class="text-muted">$</span>
+      <UInput
+        v-model="filterValue"
+        type="number"
+        step="0.01"
+        placeholder="Amount..."
+        autofocus
+        class="flex-1"
+        @update:model-value="context.setFilterValue($event ? Number($event) : null)"
+      />
+    </div>
+    <div v-if="operator === 'between'" class="flex items-center gap-1">
+      <span class="text-sm text-muted">and</span>
+      <span class="text-muted">$</span>
+      <UInput
+        v-model="filterValue2"
+        type="number"
+        step="0.01"
+        placeholder="To..."
+        class="flex-1"
+        @update:model-value="
+  context.setFilterValue({
+    from: filterValue,
+    to: filterValue2 ? Number(filterValue2) : null
+  })
+"
+      />
+    </div>
+  </div>
+</template>

package/dist/runtime/cell-types/currency/CurrencyFilter.vue.d.ts

@@ -0,0 +1,7 @@
+import type { NuGridFilterContext } from '../../types/cells.js';
+interface Props {
+    context: NuGridFilterContext;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/currency/index.d.ts

@@ -0,0 +1,6 @@
+import type { NuGridCellType } from '../../types/cells.js';
+/**
+ * Currency cell type
+ * Currency formatting with range filter
+ */
+export declare const currencyCellType: NuGridCellType;

package/dist/runtime/cell-types/currency/index.js

@@ -0,0 +1,42 @@
+import CurrencyEditor from "./CurrencyEditor.vue";
+import CurrencyFilter from "./CurrencyFilter.vue";
+export const currencyCellType = {
+  name: "currency",
+  displayName: "Currency",
+  description: "Currency column with formatting and range filter",
+  editor: CurrencyEditor,
+  filter: {
+    component: CurrencyFilter,
+    defaultOperator: "equals"
+  },
+  enableFiltering: true,
+  validation: (value) => {
+    if (value === null || value === void 0) {
+      return { valid: true };
+    }
+    const numValue = Number(value);
+    if (Number.isNaN(numValue)) {
+      return {
+        valid: false,
+        message: "Value must be a valid number"
+      };
+    }
+    return { valid: true };
+  },
+  formatter: (value, context) => {
+    if (value === null || value === void 0) return "";
+    const numValue = Number(value);
+    if (Number.isNaN(numValue)) return String(value);
+    const currency = context.columnDef.currency || "USD";
+    const locale = context.columnDef.locale || "en-US";
+    return new Intl.NumberFormat(locale, {
+      style: "currency",
+      currency,
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
+    }).format(numValue);
+  },
+  defaultColumnDef: {
+    size: 120
+  }
+};

package/dist/runtime/cell-types/date/DateEditor.d.vue.ts

@@ -0,0 +1,15 @@
+import type { NuGridCellEditorProps } from '../../types/index.js';
+type __VLS_Props = NuGridCellEditorProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: any) => any;
+    "update:isNavigating": (value: boolean) => any;
+    "stop-editing": (moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any;
+    "cancel-editing": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:isNavigating"?: ((value: boolean) => any) | undefined;
+    "onStop-editing"?: ((moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any) | undefined;
+    "onCancel-editing"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/date/DateEditor.vue

@@ -0,0 +1,42 @@
+<script setup>
+import { computed, ref } from "vue";
+import { useNuGridCellEditor } from "../../composables";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  modelValue: { type: null, required: true },
+  cell: { type: null, required: true },
+  row: { type: Object, required: true },
+  isNavigating: { type: Boolean, required: true },
+  shouldFocus: { type: Boolean, required: true },
+  validationError: { type: [String, null], required: false },
+  showValidationErrors: { type: String, required: false },
+  interactionRouter: { type: Object, required: false }
+});
+const emit = defineEmits(["update:modelValue", "stop-editing", "cancel-editing", "update:isNavigating"]);
+const inputRef = ref(null);
+const { handleKeydown, handleBlur } = useNuGridCellEditor(props, emit, inputRef);
+const formattedValue = computed(() => {
+  if (!props.modelValue) return "";
+  if (typeof props.modelValue === "string" && /^\d{4}-\d{2}-\d{2}$/.test(props.modelValue)) {
+    return props.modelValue;
+  }
+  const date = new Date(props.modelValue);
+  if (Number.isNaN(date.getTime())) return "";
+  return date.toISOString().split("T")[0];
+});
+const handleInput = (value) => {
+  emit("update:modelValue", value || null);
+};
+</script>
+
+<template>
+  <UInput
+    ref="inputRef"
+    :model-value="formattedValue"
+    type="date"
+    class="w-full pl-0.5!"
+    @update:model-value="handleInput"
+    @blur="handleBlur"
+    @keydown="handleKeydown"
+  />
+</template>

package/dist/runtime/cell-types/date/DateEditor.vue.d.ts

@@ -0,0 +1,15 @@
+import type { NuGridCellEditorProps } from '../../types/index.js';
+type __VLS_Props = NuGridCellEditorProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: any) => any;
+    "update:isNavigating": (value: boolean) => any;
+    "stop-editing": (moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any;
+    "cancel-editing": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:isNavigating"?: ((value: boolean) => any) | undefined;
+    "onStop-editing"?: ((moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any) | undefined;
+    "onCancel-editing"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/date/DateFilter.d.vue.ts

@@ -0,0 +1,7 @@
+import type { NuGridFilterContext } from '../../types/cells.js';
+interface Props {
+    context: NuGridFilterContext;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/date/DateFilter.vue

@@ -0,0 +1,58 @@
+<script setup>
+import { computed, ref } from "vue";
+const props = defineProps({
+  context: { type: Object, required: true }
+});
+const filterValue = computed({
+  get: () => props.context.filterValue.value,
+  set: (value) => props.context.setFilterValue(value)
+});
+const operator = ref("equals");
+const operators = [
+  { value: "equals", label: "Equals" },
+  { value: "after", label: "After" },
+  { value: "before", label: "Before" },
+  { value: "between", label: "Between" }
+];
+const filterValue2 = ref(null);
+function clearFilter() {
+  filterValue.value = null;
+  filterValue2.value = null;
+  props.context.clearFilter();
+}
+</script>
+
+<template>
+  <div class="min-w-[200px] space-y-2 p-2">
+    <div class="flex items-center gap-2">
+      <USelect
+        v-model="operator"
+        :options="operators"
+        option-attribute="label"
+        value-attribute="value"
+        class="flex-1"
+      />
+      <UButton
+        v-if="context.isFiltered"
+        icon="i-heroicons-x-mark"
+        size="xs"
+        color="neutral"
+        variant="ghost"
+        @click="clearFilter"
+      />
+    </div>
+    <UInput
+      v-model="filterValue"
+      type="date"
+      autofocus
+      @update:model-value="context.setFilterValue($event)"
+    />
+    <UInput
+      v-if="operator === 'between'"
+      v-model="filterValue2"
+      type="date"
+      placeholder="To..."
+      @update:model-value="context.setFilterValue({ from: filterValue, to: filterValue2 })"
+    />
+  </div>
+</template>

package/dist/runtime/cell-types/date/DateFilter.vue.d.ts

@@ -0,0 +1,7 @@
+import type { NuGridFilterContext } from '../../types/cells.js';
+interface Props {
+    context: NuGridFilterContext;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/cell-types/date/index.d.ts

@@ -0,0 +1,6 @@
+import type { NuGridCellType } from '../../types/cells.js';
+/**
+ * Date cell type
+ * Date picker input, no special keyboard handling
+ */
+export declare const dateCellType: NuGridCellType;

package/dist/runtime/cell-types/date/index.js

@@ -0,0 +1,13 @@
+import DateEditor from "./DateEditor.vue";
+import DateFilter from "./DateFilter.vue";
+export const dateCellType = {
+  name: "date",
+  displayName: "Date",
+  description: "Date picker column",
+  editor: DateEditor,
+  filter: {
+    component: DateFilter,
+    defaultOperator: "equals"
+  },
+  enableFiltering: true
+};

package/dist/runtime/cell-types/index.d.ts

@@ -0,0 +1,17 @@
+import type { NuGridCellType } from '../types/cells.js';
+import { actionMenuCellType } from './action-menu/index.js';
+import { booleanCellType } from './boolean/index.js';
+import { currencyCellType } from './currency/index.js';
+import { dateCellType } from './date/index.js';
+import { lookupCellType } from './lookup/index.js';
+import { numberCellType } from './number/index.js';
+import { ratingCellType } from './rating/index.js';
+import { selectionCellType } from './selection/index.js';
+import { textareaCellType, textCellType } from './text/index.js';
+/**
+ * All built-in cell types
+ * These are automatically registered in the cell type registry
+ */
+export declare const builtInCellTypes: NuGridCellType[];
+export { actionMenuCellType, booleanCellType, currencyCellType, dateCellType, lookupCellType, numberCellType, ratingCellType, selectionCellType, textareaCellType, textCellType, };
+export { TextareaEditor } from './text/index.js';

package/dist/runtime/cell-types/index.js

@@ -0,0 +1,34 @@
+import { actionMenuCellType } from "./action-menu/index.js";
+import { booleanCellType } from "./boolean/index.js";
+import { currencyCellType } from "./currency/index.js";
+import { dateCellType } from "./date/index.js";
+import { lookupCellType } from "./lookup/index.js";
+import { numberCellType } from "./number/index.js";
+import { ratingCellType } from "./rating/index.js";
+import { selectionCellType } from "./selection/index.js";
+import { textareaCellType, textCellType } from "./text/index.js";
+export const builtInCellTypes = [
+  textCellType,
+  textareaCellType,
+  numberCellType,
+  dateCellType,
+  booleanCellType,
+  selectionCellType,
+  actionMenuCellType,
+  ratingCellType,
+  currencyCellType,
+  lookupCellType
+];
+export {
+  actionMenuCellType,
+  booleanCellType,
+  currencyCellType,
+  dateCellType,
+  lookupCellType,
+  numberCellType,
+  ratingCellType,
+  selectionCellType,
+  textareaCellType,
+  textCellType
+};
+export { TextareaEditor } from "./text/index.js";

package/dist/runtime/cell-types/lookup/LookupEditor.d.vue.ts

@@ -0,0 +1,15 @@
+import type { NuGridCellEditorProps } from '../../types/index.js';
+type __VLS_Props = NuGridCellEditorProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: any) => any;
+    "update:isNavigating": (value: boolean) => any;
+    "stop-editing": (moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any;
+    "cancel-editing": () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:isNavigating"?: ((value: boolean) => any) | undefined;
+    "onStop-editing"?: ((moveDirection?: "up" | "down" | "next" | "previous" | undefined) => any) | undefined;
+    "onCancel-editing"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;