@nu-grid/nuxt 0.1.1

package/dist/runtime/components/_internal/NuGridGroupCheckbox.d.vue.ts

@@ -0,0 +1,22 @@
+import type { CheckboxProps, CheckboxSlots } from '@nuxt/ui';
+type __VLS_Props = CheckboxProps;
+type __VLS_Slots = CheckboxSlots;
+type __VLS_ModelProps = {
+    modelValue?: boolean | 'indeterminate';
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (event: Event) => any;
+    "update:modelValue": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onChange?: ((event: Event) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {}, {}, {}, {}, 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/_internal/NuGridGroupCheckbox.vue

@@ -0,0 +1,132 @@
+<script setup>
+import { useAppConfig } from "#imports";
+import { tv } from "@nuxt/ui/runtime/utils/tv.js";
+import { reactivePick } from "@vueuse/core";
+import { CheckboxIndicator, CheckboxRoot, Label, Primitive, useForwardProps } from "reka-ui";
+import { computed, inject, useId } from "vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  as: { type: null, required: false },
+  label: { type: String, required: false },
+  description: { type: String, required: false },
+  color: { type: null, required: false },
+  variant: { type: null, required: false },
+  size: { type: null, required: false },
+  indicator: { type: null, required: false },
+  icon: { type: null, required: false },
+  indeterminateIcon: { type: null, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false },
+  disabled: { type: Boolean, required: false },
+  required: { type: Boolean, required: false },
+  name: { type: String, required: false },
+  value: { type: null, required: false },
+  id: { type: String, required: false },
+  defaultValue: { type: [Boolean, String], required: false }
+});
+const emits = defineEmits(["change"]);
+const slots = defineSlots();
+const uiConfig = inject("nugrid-ui-config", null);
+const modelValue = defineModel({ type: [Boolean, String], ...{ default: void 0 } });
+const appConfig = useAppConfig();
+const rootProps = useForwardProps(reactivePick(props, "required", "value", "defaultValue"));
+const {
+  id: _id,
+  emitFormChange,
+  emitFormInput,
+  size,
+  color,
+  name,
+  disabled,
+  ariaAttrs
+} = useFormField(props);
+const id = _id.value ?? useId();
+const ui = computed(() => {
+  const mergedTheme = uiConfig?.checkboxTheme?.value;
+  return tv({
+    extend: mergedTheme ? tv(mergedTheme) : void 0,
+    ...appConfig.ui?.checkbox || {}
+  })({
+    size: size.value,
+    color: color.value,
+    variant: props.variant,
+    indicator: props.indicator,
+    required: props.required,
+    disabled: disabled.value
+  });
+});
+function onUpdate(value) {
+  const event = new Event("change", { target: { value } });
+  emits("change", event);
+  emitFormChange();
+  emitFormInput();
+}
+</script>
+
+<template>
+  <Primitive
+    :as="!variant || variant === 'list' ? as : Label"
+    data-slot="root"
+    :class="ui.root({ class: [props.ui?.root, props.class] })"
+  >
+    <div data-slot="container" :class="ui.container({ class: props.ui?.container })">
+      <CheckboxRoot
+        :id="id"
+        v-bind="{ ...rootProps, ...$attrs, ...ariaAttrs }"
+        v-model="modelValue"
+        :name="name"
+        :disabled="disabled"
+        data-slot="base"
+        :class="ui.base({ class: props.ui?.base })"
+        @update:model-value="onUpdate"
+      >
+        <template #default="{ modelValue }">
+          <CheckboxIndicator
+            data-slot="indicator"
+            :class="ui.indicator({ class: props.ui?.indicator })"
+          >
+            <UIcon
+              v-if="modelValue === 'indeterminate'"
+              :name="indeterminateIcon || appConfig.ui.icons.minus"
+              data-slot="icon"
+              :class="ui.icon({ class: props.ui?.icon })"
+            />
+            <UIcon
+              v-else
+              :name="icon || appConfig.ui.icons.check"
+              data-slot="icon"
+              :class="ui.icon({ class: props.ui?.icon })"
+            />
+          </CheckboxIndicator>
+        </template>
+      </CheckboxRoot>
+    </div>
+
+    <div
+      v-if="label || !!slots.label || description || !!slots.description"
+      data-slot="wrapper"
+      :class="ui.wrapper({ class: props.ui?.wrapper })"
+    >
+      <component
+        :is="!variant || variant === 'list' ? Label : 'p'"
+        v-if="label || !!slots.label"
+        :for="id"
+        data-slot="label"
+        :class="ui.label({ class: props.ui?.label })"
+      >
+        <slot name="label" :label="label">
+          {{ label }}
+        </slot>
+      </component>
+      <p
+        v-if="description || !!slots.description"
+        data-slot="description"
+        :class="ui.description({ class: props.ui?.description })"
+      >
+        <slot name="description" :description="description">
+          {{ description }}
+        </slot>
+      </p>
+    </div>
+  </Primitive>
+</template>

package/dist/runtime/components/_internal/NuGridGroupCheckbox.vue.d.ts

@@ -0,0 +1,22 @@
+import type { CheckboxProps, CheckboxSlots } from '@nuxt/ui';
+type __VLS_Props = CheckboxProps;
+type __VLS_Slots = CheckboxSlots;
+type __VLS_ModelProps = {
+    modelValue?: boolean | 'indeterminate';
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (event: Event) => any;
+    "update:modelValue": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onChange?: ((event: Event) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {}, {}, {}, {}, 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/_internal/NuGridHeaderSortButton.d.vue.ts

@@ -0,0 +1,31 @@
+import type { TableData } from '@nuxt/ui';
+import type { Header } from '@tanstack/vue-table';
+import type { NuGridSortIcon } from '../../types/index.js';
+declare const __VLS_export: <T extends TableData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        /**
+         * The TanStack Table header object
+         */
+        header: Header<any, unknown>;
+        /**
+         * Column-specific sort icon configuration
+         * Overrides the grid-level sortIcons
+         */
+        sortIcons?: NuGridSortIcon;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {};
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/components/_internal/NuGridHeaderSortButton.vue

@@ -0,0 +1,61 @@
+<script setup>
+import { nuGridDefaults } from "../../config/_internal";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  header: { type: Object, required: true },
+  sortIcons: { type: Object, required: false }
+});
+const coreContext = inject("nugrid-core");
+const uiConfigContext = inject("nugrid-ui-config");
+if (!coreContext || !uiConfigContext) {
+  throw new Error("NuGridHeaderSortButton must be used within a NuGrid component.");
+}
+const { propsUi, ui } = coreContext;
+const { sortIcons: gridSortIcons } = uiConfigContext;
+const effectiveIcons = computed(() => ({
+  unsorted: props.sortIcons?.unsorted ?? gridSortIcons.value?.unsorted ?? nuGridDefaults.columnDefaults.sortIcons.unsorted,
+  asc: props.sortIcons?.asc ?? gridSortIcons.value?.asc ?? nuGridDefaults.columnDefaults.sortIcons.asc,
+  desc: props.sortIcons?.desc ?? gridSortIcons.value?.desc ?? nuGridDefaults.columnDefaults.sortIcons.desc,
+  unsortedHover: props.sortIcons?.unsortedHover ?? gridSortIcons.value?.unsortedHover ?? nuGridDefaults.columnDefaults.sortIcons.unsortedHover
+}));
+const sortState = computed(() => props.header.column.getIsSorted());
+const canSort = computed(() => props.header.column.getCanSort());
+const icon = computed(() => {
+  if (sortState.value === "asc") {
+    return effectiveIcons.value.asc;
+  }
+  if (sortState.value === "desc") {
+    return effectiveIcons.value.desc;
+  }
+  return effectiveIcons.value.unsorted;
+});
+const sortIndex = computed(() => {
+  const index = props.header.column.getSortIndex();
+  return index >= 1 ? index : null;
+});
+const shouldHideUnsorted = computed(() => {
+  return !sortState.value && effectiveIcons.value.unsortedHover;
+});
+</script>
+
+<template>
+  <div
+    v-if="canSort && icon"
+    :class="
+  shouldHideUnsorted ? ui.sortHandleHover({ class: [propsUi?.sortHandleHover] }) : ui.sortHandle({ class: [propsUi?.sortHandle] })
+"
+    @click="props.header.column.getToggleSortingHandler()?.($event)"
+  >
+    <!-- Multi-sort: Show chip with icon and index inside -->
+    <UChip
+      v-if="sortIndex !== null"
+      :text="sortIndex"
+      size="lg"
+      :ui="{ base: 'rounded-md px-1 py-1.5' }"
+    >
+      <UIcon :name="icon" class="size-4" />
+    </UChip>
+    <!-- Single sort or unsorted: Just show icon -->
+    <UIcon v-else :name="icon" class="size-4" />
+  </div>
+</template>

package/dist/runtime/components/_internal/NuGridHeaderSortButton.vue.d.ts

@@ -0,0 +1,31 @@
+import type { TableData } from '@nuxt/ui';
+import type { Header } from '@tanstack/vue-table';
+import type { NuGridSortIcon } from '../../types/index.js';
+declare const __VLS_export: <T extends TableData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        /**
+         * The TanStack Table header object
+         */
+        header: Header<any, unknown>;
+        /**
+         * Column-specific sort icon configuration
+         * Overrides the grid-level sortIcons
+         */
+        sortIcons?: NuGridSortIcon;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {};
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/components/_internal/NuGridPaging.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/_internal/NuGridPaging.vue

@@ -0,0 +1,65 @@
+<script setup>
+import { computed, inject } from "vue";
+const paging = inject("nugrid-paging");
+const currentPage = computed({
+  get: () => (paging.pageIndex.value ?? 0) + 1,
+  set: (val) => paging.setPageIndex(val - 1)
+});
+const pageSizeSelectOptions = computed(
+  () => paging.pageSizeOptions.value.map((size) => ({
+    label: `${size} per page`,
+    value: size
+  }))
+);
+const selectedPageSize = computed({
+  get: () => paging.pageSize.value,
+  set: (val) => paging.setPageSize(val)
+});
+const startRow = computed(() => {
+  if (paging.totalRows.value === 0) return 0;
+  return paging.pageIndex.value * paging.pageSize.value + 1;
+});
+const endRow = computed(() => {
+  const end = (paging.pageIndex.value + 1) * paging.pageSize.value;
+  return Math.min(end, paging.totalRows.value);
+});
+const showPageSizeSelector = computed(() => paging.pageSizeOptions.value.length > 0);
+</script>
+
+<template>
+  <div
+    v-if="paging.enabled.value"
+    class="flex flex-wrap items-center justify-between gap-2 px-4 py-3 border-t border-default
+      sm:gap-4"
+  >
+    <!-- Row count display (hidden on small screens) -->
+    <div class="hidden text-sm text-muted sm:block">
+      <template v-if="paging.totalRows.value > 0">
+        Showing {{ startRow }} to {{ endRow }} of {{ paging.totalRows.value }} rows
+      </template>
+      <template v-else> No rows </template>
+    </div>
+
+    <!-- Controls -->
+    <div class="flex flex-1 items-center justify-end gap-2 sm:flex-none sm:gap-4">
+      <!-- Page size selector (hidden on small screens) -->
+      <USelect
+        v-if="showPageSizeSelector"
+        v-model="selectedPageSize"
+        :items="pageSizeSelectOptions"
+        size="sm"
+        class="hidden w-32 md:block"
+      />
+
+      <!-- Paging controls -->
+      <UPagination
+        v-model:page="currentPage"
+        :total="paging.totalRows.value"
+        :items-per-page="paging.pageSize.value"
+        size="sm"
+        :sibling-count="1"
+        :show-edges="true"
+      />
+    </div>
+  </div>
+</template>

package/dist/runtime/components/_internal/NuGridPaging.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/_internal/NuGridRow.d.vue.ts

@@ -0,0 +1,40 @@
+import type { TableData } from '@nuxt/ui';
+import type { Cell, Row } from '@tanstack/vue-table';
+import type { ComponentPublicInstance } from 'vue';
+declare const __VLS_export: <T extends TableData>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
+        row: Row<T>;
+        style?: Record<string, any>;
+        minHeight?: number;
+        dataIndex?: number;
+        measureRef?: (el: Element | ComponentPublicInstance | null) => void;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: {
+        default?: (props: {
+            cell: any;
+            row: Row<T>;
+            cellIndex: number;
+        }) => any;
+        expanded?: (props: {
+            row: Row<T>;
+        }) => any;
+        row?: (props: {
+            row: Row<T>;
+            cells: Cell<T, unknown>[];
+        }) => any;
+    };
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};