nuxt-ui-tools 0.1.0

package/dist/runtime/table/components/data-list/DataListSortMenu.d.vue.ts

@@ -0,0 +1,34 @@
+import type { DataListControlSize, DataListSortMenuUi } from '../../types/index.js';
+type __VLS_Props = {
+    label?: string;
+    size?: DataListControlSize;
+    ui?: DataListSortMenuUi;
+};
+declare var __VLS_8: {
+    label: string | null;
+    sorting: {
+        key: string | undefined;
+        dir: "desc" | "asc" | undefined;
+        active: boolean;
+    };
+    setSorting: (sorting: {
+        key: string;
+        dir: "asc" | "desc";
+    } | null) => void;
+    triggerProps: {
+        readonly type: "button";
+        readonly 'aria-haspopup': "menu";
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListSortMenu.vue

@@ -0,0 +1,104 @@
+<script setup>
+import UButton from "@nuxt/ui/components/Button.vue";
+import UDropdownMenu from "@nuxt/ui/components/DropdownMenu.vue";
+import { computed } from "vue";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import { useTableInternals } from "../../composables/use-table-internals";
+const props = defineProps({
+  label: { type: String, required: false },
+  size: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const internals = useTableInternals();
+const dataListUi = useDataListUi();
+const { t } = useUiToolsLocale();
+const triggerProps = {
+  type: "button",
+  "aria-haspopup": "menu"
+};
+const resolvedSize = computed(
+  () => props.size ?? dataListUi.ui.value.sortMenu?.size ?? dataListUi.controlSize.value
+);
+const resolvedUi = computed(() => ({
+  ...dataListUi.ui.value.sortMenu?.ui,
+  ...props.ui
+}));
+const sortLabels = computed(() => {
+  const labels = /* @__PURE__ */ new Map();
+  for (const option of internals.schema.value.grid?.sortOptions ?? [])
+    labels.set(option.key, typeof option.label === "string" ? option.label : String(option.label()));
+  for (const column of internals.tableColumns.runtimeColumns.value)
+    if (column.sortableKey) labels.set(column.sortableKey, column.label);
+  return labels;
+});
+const activeKey = computed(() => internals.tableColumns.sortingState.value.key);
+const sortKeys = computed(() => [
+  .../* @__PURE__ */ new Set([
+    ...internals.tableColumns.sortKeys.value,
+    ...(internals.schema.value.grid?.sortOptions ?? []).map((option) => option.key)
+  ])
+]);
+const activeLabel = computed(
+  () => activeKey.value ? sortLabels.value.get(activeKey.value) ?? humanize(activeKey.value) : null
+);
+const items = computed(() => [
+  sortKeys.value.map((key) => ({
+    label: sortLabels.value.get(key) ?? humanize(key),
+    icon: activeKey.value === key ? "i-lucide-check" : void 0,
+    onSelect: () => internals.tableColumns.setSortKey(key)
+  })),
+  [
+    {
+      label: t("table.columnsMenu.sortAsc"),
+      icon: "i-lucide-arrow-up-narrow-wide",
+      onSelect: () => internals.tableColumns.setSortDirection("asc")
+    },
+    {
+      label: t("table.columnsMenu.sortDesc"),
+      icon: "i-lucide-arrow-down-wide-narrow",
+      onSelect: () => internals.tableColumns.setSortDirection("desc")
+    }
+  ]
+]);
+function humanize(value) {
+  return value.split(".").at(-1)?.replace(/[_-]+/g, " ").replace(/\b\w/g, (char) => char.toUpperCase()) ?? value;
+}
+</script>
+
+<template>
+  <UDropdownMenu
+    :items="items"
+    :content="{ align: 'end', sideOffset: 8 }"
+    :ui="{
+  content: resolvedUi.content,
+  group: resolvedUi.group,
+  item: resolvedUi.item,
+  itemLeadingIcon: resolvedUi.itemLeadingIcon,
+  itemLabel: resolvedUi.itemLabel,
+  itemTrailingIcon: resolvedUi.itemTrailingIcon
+}"
+  >
+    <slot
+      name="trigger"
+      :label="activeLabel"
+      :sorting="internals.tableColumns.sortingState.value"
+      :set-sorting="internals.tableColumns.setSorting"
+      :trigger-props="triggerProps"
+    >
+      <UButton
+        color="neutral"
+        variant="outline"
+        :size="resolvedSize"
+        :label="`${label ?? t('table.controls.sort')}${activeLabel ? `: ${activeLabel}` : ''}`"
+        trailing-icon="i-lucide-chevron-down"
+        :ui="{
+  base: resolvedUi.trigger,
+  label: resolvedUi.triggerLabel,
+  leadingIcon: resolvedUi.triggerLeadingIcon,
+  trailingIcon: resolvedUi.triggerTrailingIcon
+}"
+      />
+    </slot>
+  </UDropdownMenu>
+</template>

package/dist/runtime/table/components/data-list/DataListSortMenu.vue.d.ts

@@ -0,0 +1,34 @@
+import type { DataListControlSize, DataListSortMenuUi } from '../../types/index.js';
+type __VLS_Props = {
+    label?: string;
+    size?: DataListControlSize;
+    ui?: DataListSortMenuUi;
+};
+declare var __VLS_8: {
+    label: string | null;
+    sorting: {
+        key: string | undefined;
+        dir: "desc" | "asc" | undefined;
+        active: boolean;
+    };
+    setSorting: (sorting: {
+        key: string;
+        dir: "asc" | "desc";
+    } | null) => void;
+    triggerProps: {
+        readonly type: "button";
+        readonly 'aria-haspopup': "menu";
+    };
+};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListTable.d.vue.ts

@@ -0,0 +1,18 @@
+import type { DataListTableUi } from '../../types/index.js';
+type __VLS_Props = {
+    height?: string;
+    ui?: DataListTableUi;
+};
+declare var __VLS_10: string, __VLS_11: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/data-list/DataListTable.vue

@@ -0,0 +1,22 @@
+<script setup>
+import { computed } from "vue";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import TableRenderer from "../table/TableRenderer.vue";
+const props = defineProps({
+  height: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const dataListUi = useDataListUi();
+const resolvedUi = computed(() => ({
+  ...dataListUi.ui.value.table?.ui,
+  ...props.ui
+}));
+</script>
+
+<template>
+  <TableRenderer :height="height" :ui="resolvedUi">
+    <template v-for="(_, name) in $slots" #[name]="scope">
+      <slot :name="name" v-bind="scope ?? {}" />
+    </template>
+  </TableRenderer>
+</template>

package/dist/runtime/table/components/data-list/DataListTable.vue.d.ts

@@ -0,0 +1,18 @@
+import type { DataListTableUi } from '../../types/index.js';
+type __VLS_Props = {
+    height?: string;
+    ui?: DataListTableUi;
+};
+declare var __VLS_10: string, __VLS_11: any;
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,26 @@
+import type { DataListColumnPanelUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListColumnPanelUi;
+};
+type __VLS_Slots = {
+    trigger?: (props: {
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
+        openState: boolean;
+        triggerProps: {
+            type: 'button';
+            'aria-expanded': boolean;
+        };
+    }) => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/drawers/ColumnPanel.vue

@@ -0,0 +1,379 @@
+<script setup>
+import UButton from "@nuxt/ui/components/Button.vue";
+import UIcon from "@nuxt/ui/components/Icon.vue";
+import UInput from "@nuxt/ui/components/Input.vue";
+import UPopover from "@nuxt/ui/components/Popover.vue";
+import { computed } from "vue";
+import { VueDraggable } from "vue-draggable-plus";
+import { useUiToolsLocale } from "#ui-tools/i18n";
+import { useDataListUi } from "../../composables/use-data-list-ui";
+import { useTableInternals } from "../../composables/use-table-internals";
+import { mergeDataListUiClass } from "../../utils";
+const props = defineProps({
+  size: { type: String, required: false },
+  ui: { type: Object, required: false }
+});
+const internals = useTableInternals();
+const dataListUi = useDataListUi();
+const { t } = useUiToolsLocale();
+const ui = computed(() => ({
+  ...dataListUi.ui.value.columnPanel?.ui,
+  ...props.ui
+}));
+defineSlots();
+const configurableColumns = computed(
+  () => internals.tableColumns.orderedColumns.value.filter((column) => column.configurable !== false)
+);
+const pinnedLeft = computed(() => {
+  const leftIds = internals.tableColumns.tableState.value.columnPinning?.left ?? [];
+  return configurableColumns.value.filter((col) => leftIds.includes(col.id));
+});
+const pinnedRight = computed(() => {
+  const rightIds = internals.tableColumns.tableState.value.columnPinning?.right ?? [];
+  return configurableColumns.value.filter((col) => rightIds.includes(col.id));
+});
+const unpinnedColumns = computed(() => {
+  const leftIds = internals.tableColumns.tableState.value.columnPinning?.left ?? [];
+  const rightIds = internals.tableColumns.tableState.value.columnPinning?.right ?? [];
+  return configurableColumns.value.filter(
+    (col) => !leftIds.includes(col.id) && !rightIds.includes(col.id)
+  );
+});
+const filteredColumns = computed(() => {
+  const search = internals.controls.columnsPanelSearch.value.trim().toLowerCase();
+  if (!search) return configurableColumns.value;
+  return configurableColumns.value.filter((column) => column.label.toLowerCase().includes(search));
+});
+const draggableColumns = computed({
+  get: () => unpinnedColumns.value,
+  set: (columns) => internals.tableColumns.setOrder({
+    columnIds: [
+      ...pinnedLeft.value.map((col) => col.id),
+      ...columns.map((col) => col.id),
+      ...pinnedRight.value.map((col) => col.id)
+    ]
+  })
+});
+function toggleColumn(columnId) {
+  const isVisible = internals.tableColumns.tableState.value.columnVisibility?.[columnId] !== false;
+  internals.tableColumns.setVisibility({ columnId, visible: !isVisible });
+}
+function open() {
+  internals.controls.columnsPanelOpen.value = true;
+}
+function close() {
+  internals.controls.columnsPanelOpen.value = false;
+}
+function toggle() {
+  internals.controls.columnsPanelOpen.value = !internals.controls.columnsPanelOpen.value;
+}
+</script>
+
+<template>
+  <UPopover
+    :open="internals.controls.columnsPanelOpen.value"
+    @update:open="internals.controls.columnsPanelOpen.value = $event"
+    mode="click"
+    :content="{ side: 'bottom', align: 'end', sideOffset: 8 }"
+    :ui="{
+  content: mergeDataListUiClass(
+    'w-fit overflow-hidden p-0 shadow-none',
+    void 0,
+    ui.popoverContent
+  )
+}"
+  >
+    <slot
+      name="trigger"
+      :open="open"
+      :close="close"
+      :toggle="toggle"
+      :open-state="internals.controls.columnsPanelOpen.value"
+      :trigger-props="{
+  type: 'button',
+  'aria-expanded': internals.controls.columnsPanelOpen.value
+}"
+    >
+      <UButton
+        color="neutral"
+        variant="outline"
+        :size="props.size ?? dataListUi.ui.value.columnPanel?.size ?? dataListUi.controlSize.value"
+        icon="i-lucide-sliders-horizontal"
+        :label="t('table.controls.view')"
+        :ui="{ base: ui.trigger }"
+      />
+    </slot>
+
+    <template #content>
+      <div
+        :class="
+  mergeDataListUiClass('w-fit max-w-[calc(100vw-1rem)] bg-default', void 0, ui.panel)
+"
+      >
+        <div
+          :class="mergeDataListUiClass('border-b border-default p-2', void 0, ui.searchHeader)"
+        >
+          <UInput
+            :model-value="internals.controls.columnsPanelSearch.value"
+            @update:model-value="internals.controls.columnsPanelSearch.value = String($event ?? '')"
+            size="sm"
+            icon="i-lucide-search"
+            :placeholder="t('table.controls.searchColumns')"
+            color="neutral"
+            variant="ghost"
+            :ui="{ root: mergeDataListUiClass('w-full', void 0, ui.search) }"
+          />
+        </div>
+
+        <div
+          :class="
+  mergeDataListUiClass('grid max-h-80 gap-1 overflow-y-auto p-2', void 0, ui.list)
+"
+        >
+          <div
+            v-if="!internals.controls.columnsPanelSearch.value"
+            :class="mergeDataListUiClass('grid gap-0.5', void 0, ui.section)"
+          >
+            <div
+              v-for="column in pinnedLeft"
+              :key="column.id"
+              :class="
+  mergeDataListUiClass(
+    'flex items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors hover:bg-elevated/70',
+    void 0,
+    ui.row
+  )
+"
+            >
+              <div
+                :class="
+  mergeDataListUiClass(
+    'flex size-6 items-center justify-center rounded-md text-muted',
+    void 0,
+    ui.icon
+  )
+"
+              >
+                <UIcon name="i-lucide-pin" class="size-4" />
+              </div>
+              <button
+                type="button"
+                class="flex min-w-0 flex-1 items-center gap-3 text-left"
+                @click="toggleColumn(column.id)"
+              >
+                <UIcon v-if="column.icon" :name="column.icon" class="size-4 text-muted" />
+                <span :class="mergeDataListUiClass('truncate text-default', void 0, ui.label)">{{
+                  column.label
+                }}</span>
+              </button>
+              <UIcon
+                :name="
+  internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'i-lucide-eye-off' : 'i-lucide-check'
+"
+                class="size-4 shrink-0"
+                :class="
+  mergeDataListUiClass(
+    internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'text-muted' : 'text-default',
+    void 0,
+    ui.stateIcon
+  )
+"
+              />
+            </div>
+
+            <VueDraggable
+              v-if="draggableColumns.length"
+              v-model="draggableColumns"
+              item-key="id"
+              handle=".column-drag-handle"
+              :animation="180"
+              easing="cubic-bezier(0.22, 1, 0.36, 1)"
+              ghost-class="column-panel-row-ghost"
+              chosen-class="column-panel-row-chosen"
+              drag-class="column-panel-row-dragging"
+              :class="mergeDataListUiClass('grid gap-0.5', void 0, ui.section)"
+            >
+              <div
+                v-for="column in draggableColumns"
+                :key="column.id"
+                :class="
+  mergeDataListUiClass(
+    'flex items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors hover:bg-elevated/70',
+    void 0,
+    ui.row
+  )
+"
+              >
+                <button
+                  type="button"
+                  :class="
+  mergeDataListUiClass(
+    'column-drag-handle flex size-6 cursor-grab items-center justify-center rounded-md text-muted hover:bg-elevated active:cursor-grabbing',
+    void 0,
+    ui.handle
+  )
+"
+                >
+                  <UIcon name="i-lucide-grip" class="size-4" />
+                </button>
+
+                <button
+                  type="button"
+                  class="flex min-w-0 flex-1 items-center gap-3 text-left"
+                  @click="toggleColumn(column.id)"
+                >
+                  <UIcon v-if="column.icon" :name="column.icon" class="size-4 text-muted" />
+                  <span
+                    :class="mergeDataListUiClass('truncate text-default', void 0, ui.label)"
+                    >{{ column.label }}</span
+                  >
+                </button>
+
+                <UIcon
+                  :name="
+  internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'i-lucide-eye-off' : 'i-lucide-check'
+"
+                  class="size-4 shrink-0"
+                  :class="
+  mergeDataListUiClass(
+    internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'text-muted' : 'text-default',
+    void 0,
+    ui.stateIcon
+  )
+"
+                />
+              </div>
+            </VueDraggable>
+
+            <div
+              v-for="column in pinnedRight"
+              :key="column.id"
+              :class="
+  mergeDataListUiClass(
+    'flex items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors hover:bg-elevated/70',
+    void 0,
+    ui.row
+  )
+"
+            >
+              <div
+                :class="
+  mergeDataListUiClass(
+    'flex size-6 items-center justify-center rounded-md text-muted',
+    void 0,
+    ui.icon
+  )
+"
+              >
+                <UIcon name="i-lucide-pin" class="size-4" />
+              </div>
+              <button
+                type="button"
+                class="flex min-w-0 flex-1 items-center gap-3 text-left"
+                @click="toggleColumn(column.id)"
+              >
+                <UIcon v-if="column.icon" :name="column.icon" class="size-4 text-muted" />
+                <span :class="mergeDataListUiClass('truncate text-default', void 0, ui.label)">{{
+                  column.label
+                }}</span>
+              </button>
+              <UIcon
+                :name="
+  internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'i-lucide-eye-off' : 'i-lucide-check'
+"
+                class="size-4 shrink-0"
+                :class="
+  mergeDataListUiClass(
+    internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'text-muted' : 'text-default',
+    void 0,
+    ui.stateIcon
+  )
+"
+              />
+            </div>
+          </div>
+
+          <div v-else :class="mergeDataListUiClass('grid gap-0.5', void 0, ui.section)">
+            <button
+              v-for="column in filteredColumns"
+              :key="column.id"
+              type="button"
+              :class="
+  mergeDataListUiClass(
+    'flex items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm transition-colors hover:bg-elevated/70',
+    void 0,
+    ui.row
+  )
+"
+              @click="toggleColumn(column.id)"
+            >
+              <div
+                :class="
+  mergeDataListUiClass(
+    'flex size-6 items-center justify-center rounded-md text-muted',
+    void 0,
+    ui.icon
+  )
+"
+              >
+                <UIcon
+                  :name="
+  internals.tableColumns.getPinnedState({ columnId: column.id }) ? 'i-lucide-pin' : column.icon ?? 'i-lucide-columns-3'
+"
+                  class="size-4"
+                />
+              </div>
+              <span
+                :class="
+  mergeDataListUiClass('min-w-0 flex-1 truncate text-default', void 0, ui.label)
+"
+                >{{ column.label }}</span
+              >
+              <UIcon
+                :name="
+  internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'i-lucide-eye-off' : 'i-lucide-check'
+"
+                class="size-4 shrink-0"
+                :class="
+  mergeDataListUiClass(
+    internals.tableColumns.tableState.value.columnVisibility?.[column.id] === false ? 'text-muted' : 'text-default',
+    void 0,
+    ui.stateIcon
+  )
+"
+              />
+            </button>
+          </div>
+        </div>
+
+        <div
+          :class="
+  mergeDataListUiClass(
+    'flex items-center justify-between gap-3 border-t border-default px-3 py-2',
+    void 0,
+    ui.footer
+  )
+"
+        >
+          <div :class="mergeDataListUiClass('text-sm text-muted', void 0, ui.footerSummary)">
+            {{ t("table.controls.configurableColumns", { count: configurableColumns.length }) }}
+          </div>
+
+          <UButton
+            color="neutral"
+            variant="ghost"
+            size="sm"
+            icon="i-lucide-rotate-ccw"
+            :label="t('table.controls.resetColumns')"
+            :ui="{ base: ui.reset }"
+            @click="internals.tableColumns.reset()"
+          />
+        </div>
+      </div>
+    </template>
+  </UPopover>
+</template>
+
+<style scoped>
+:deep(.column-panel-row-ghost){background-color:rgb(var(--ui-bg-elevated)/.55);opacity:.35}:deep(.column-panel-row-chosen){background-color:rgb(var(--ui-bg-elevated)/.8)}:deep(.column-panel-row-dragging){background-color:rgb(var(--ui-bg-default));box-shadow:0 12px 28px rgba(15,23,42,.14),0 2px 6px rgba(15,23,42,.08);opacity:1}
+</style>

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

@@ -0,0 +1,26 @@
+import type { DataListColumnPanelUi, DataListControlSize } from '../../types/index.js';
+type __VLS_Props = {
+    size?: DataListControlSize;
+    ui?: DataListColumnPanelUi;
+};
+type __VLS_Slots = {
+    trigger?: (props: {
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
+        openState: boolean;
+        triggerProps: {
+            type: 'button';
+            'aria-expanded': boolean;
+        };
+    }) => unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/table/components/filters/panel/BooleanFilterPanelField.d.vue.ts

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