feat: publish types

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-screener",
-  "version": "0.15.11",
+  "version": "0.15.12",
   "type": "module",
   "description": "Easily search and filter data in Vue3.",
   "author": "Francis Ashley",

src/components/VueScreener.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script lang="ts" setup>
-import type { Column, VueScreener } from '../interfaces/vue-screener'
+import type { Column, IVueScreener } from '../interfaces/vue-screener'
 import { useElementSize } from '../hooks/use-element-size'
 import { computed, ref, watch } from 'vue'
 import VueScreenerViewport from './viewport/VueScreenerViewport.vue'
@@ -30,7 +30,7 @@ import { useVueScreener } from '../hooks/use-vue-screener'
 import { twMerge } from 'tailwind-merge'
 
 const props = defineProps<{
-  screener?: VueScreener
+  screener?: IVueScreener
   data?: any[]
   class?: string
   // options

src/components/pagination/VueScreenerPagination.vue

@@ -31,15 +31,15 @@
 </template>
 
 <script lang="ts" setup>
-import { VueScreener } from '@/interfaces/vue-screener'
+import { IVueScreener } from '@/interfaces/vue-screener'
 import { computed, HTMLAttributes, onMounted, watch } from 'vue'
 import VueScreenerPaginationRowsPerPage from '../pagination/VueScreenerPaginationRowsPerPage.vue'
 import VueScreenerPaginationResults from '../pagination/VueScreenerPaginationResults.vue'
 import VueScreenerPaginationButtons from '../pagination/VueScreenerPaginationButtons.vue'
 import { twMerge } from 'tailwind-merge'
 
 const props = defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
   class?: HTMLAttributes['class']
 }>()
 

src/components/search/VueScreenerSearch.vue

@@ -20,15 +20,15 @@
 </template>
 
 <script lang="ts" setup>
-import { VueScreener } from '@/interfaces/vue-screener'
+import { IVueScreener } from '@/interfaces/vue-screener'
 import { computed, HTMLAttributes, ref } from 'vue'
 import { isValidRegExp } from '../../utils/regex.utils'
 import UiInput from '../ui/input/Input.vue'
 import VueScreenerSearchOptions from './VueScreenerSearchOptions.vue'
 import { twMerge } from 'tailwind-merge'
 
 const props = defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
   inputClass?: HTMLAttributes['class']
   optionsClass?: string
   toggleButtonClass?: string

src/components/search/VueScreenerSearchOptions.vue

@@ -31,14 +31,14 @@
 </template>
 
 <script lang="ts" setup>
-import { VueScreener } from '@/interfaces/vue-screener'
+import { IVueScreener } from '@/interfaces/vue-screener'
 import ToggleButtonGroup from '../ui/toggle-button/ToggleButtonGroup.vue'
 import ToggleButton from '../ui/toggle-button/ToggleButton.vue'
 import { twMerge } from '../../utils/tailwind-merge.utils'
 import { Icon } from '@iconify/vue'
 
 const props = defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
   toggleButtonClass?: string
   toggleButtonActiveClass?: string
   iconClass?: string

src/components/table/VueScreenerTableCell.vue

@@ -21,11 +21,11 @@
 <script lang="ts" setup>
 import { computed, defineProps, HTMLAttributes } from 'vue'
 import { twMerge } from '../../utils/tailwind-merge.utils'
-import { Column, Row, VueScreener } from '@/interfaces/vue-screener'
+import { Column, Row, IVueScreener } from '@/interfaces/vue-screener'
 import { highlightMatches } from '../../utils/text.utils'
 
 const props = defineProps<{
-  screener?: VueScreener
+  screener?: IVueScreener
   column: Column
   row?: Row
   pinnedClass?: string

src/components/table/VueScreenerTableHeadCell.vue

@@ -22,13 +22,13 @@
 
 <script lang="ts" setup>
 import { computed, HTMLAttributes } from 'vue'
-import type { VueScreener, Column } from '../../interfaces/vue-screener'
+import type { IVueScreener, Column } from '../../interfaces/vue-screener'
 import VueScreenerTableCell from '../table/VueScreenerTableCell.vue'
 import SortIcon from '../icons/SortIcon.vue'
 import { twMerge } from '../../utils/tailwind-merge.utils'
 
 const props = defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
   column: Column
   sortableClass?: string
   sortingClass?: string

src/components/viewport/VueScreenerViewport.vue

@@ -23,15 +23,15 @@
 </template>
 
 <script lang="ts" setup>
-import type { VueScreener } from '../../interfaces/vue-screener'
+import type { IVueScreener } from '../../interfaces/vue-screener'
 import { computed } from 'vue'
 import VueScreenerTableState from './states/VueScreenerTableState.vue'
 import VueScreenerErrorState from './states/VueScreenerErrorState.vue'
 import VueScreenerEmptyState from './states/VueScreenerEmptyState.vue'
 import VueScreenerLoadingState from './states/VueScreenerLoadingState.vue'
 
 const props = defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
 }>()
 
 const state = computed<'default' | 'loading' | 'empty' | 'error'>(() => {

src/components/viewport/states/VueScreenerTableState.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script lang="ts" setup>
-import type { VueScreener } from '../../../interfaces/vue-screener'
+import type { IVueScreener } from '../../../interfaces/vue-screener'
 import VueScreenerTableRow from '../../table/VueScreenerTableRow.vue'
 import VueScreenerTableSummaryRow from '../../table/VueScreenerTableSummaryRow.vue'
 import VueScreenerTableCell from '../../table/VueScreenerTableCell.vue'
@@ -44,6 +44,6 @@ import VueScreenerTable from '../../table/VueScreenerTable.vue'
 import VueScreenerTableHead from '../../table/VueScreenerTableHead.vue'
 
 defineProps<{
-  screener: VueScreener
+  screener: IVueScreener
 }>()
 </script>

src/hooks/use-vue-screener.ts

@@ -1,9 +1,9 @@
-import { Column, Row, VueScreener, SearchQuery, VueScreenerOptions } from '@/interfaces/vue-screener'
+import { Column, Row, IVueScreener, SearchQuery, VueScreenerOptions } from '@/interfaces/vue-screener'
 import { createColumn, getFields, getPaginated, isValidInput, convertToRows, sortRows } from '../utils/data.utils'
 import { computed, ref } from 'vue'
 import { search } from '../utils/search.utils'
 
-export const useVueScreener = (inputData?: unknown[], defaultOptions: VueScreenerOptions = {}): VueScreener => {
+export const useVueScreener = (inputData?: unknown[], defaultOptions: VueScreenerOptions = {}): IVueScreener => {
   const options = ref<VueScreenerOptions>({
     contentHeight: defaultOptions.contentHeight,
     disableSearchHighlight: defaultOptions.disableSearchHighlight ?? false,

src/index.ts

@@ -20,6 +20,8 @@ import VueScreenerPaginationRowsPerPage from './components/pagination/VueScreene
 import { useVueScreener } from './hooks/use-vue-screener'
 import './assets/tailwind.css'
 
+export type { IVueScreener, VueScreenerOptions, SearchQuery, Column, Row, DataType } from './interfaces/vue-screener'
+
 export {
   // Base component
   VueScreener,

src/interfaces/vue-screener.ts

@@ -12,7 +12,7 @@ export type VueScreenerOptions = {
   loading?: boolean
 }
 
-export type VueScreener = {
+export interface IVueScreener {
   options: Ref<VueScreenerOptions>
   searchQuery: Ref<SearchQuery>
   hasError: ComputedRef<boolean>