@hostlink/nuxt-light 1.66.0 → 1.67.0

package/dist/runtime/components/{l-tab.d.vue.ts → L/Tab.d.vue.ts}

@@ -1,8 +1,8 @@
 import type { QTabPanelProps, QTabProps } from 'quasar';
 type __VLS_Props = QTabPanelProps & QTabProps;
-declare var __VLS_7: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_7) => any;
+    default?: (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>;

package/dist/runtime/components/L/Tab.vue

@@ -0,0 +1,38 @@
+<script setup>
+import { QTabs, QTabPanels } from "quasar";
+import { getCurrentInstance, computed } from "vue";
+import { useLightLabel } from "../../composables/useLightProps";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  name: { type: [Number, String], required: false },
+  disable: { type: Boolean, required: false },
+  icon: { type: null, required: false },
+  label: { type: null, required: false },
+  alert: { type: [Boolean, String], required: false, skipCheck: true },
+  alertIcon: { type: null, required: false },
+  noCaps: { type: Boolean, required: false, skipCheck: true },
+  contentClass: { type: null, required: false },
+  ripple: { type: Boolean, required: false, skipCheck: true },
+  tabindex: { type: null, required: false }
+});
+const parentType = getCurrentInstance()?.parent?.type;
+const isTab = parentType === QTabs;
+const isPanel = parentType === QTabPanels;
+const translatedLabel = useLightLabel(props);
+const tabProps = computed(() => {
+  const { scrollTarget, ...rest } = props;
+  return { ...rest, label: translatedLabel.value };
+});
+const panelProps = computed(() => ({
+  name: props.name,
+  disable: props.disable,
+  scrollTarget: props.scrollTarget
+}));
+</script>
+
+<template>
+    <q-tab-panel v-if="isPanel" v-bind="panelProps">
+        <slot></slot>
+    </q-tab-panel>
+    <q-tab v-else-if="isTab" v-bind="tabProps" />
+</template>

package/dist/runtime/components/{l-tab.vue.d.ts → L/Tab.vue.d.ts}

@@ -1,8 +1,8 @@
 import type { QTabPanelProps, QTabProps } from 'quasar';
 type __VLS_Props = QTabPanelProps & QTabProps;
-declare var __VLS_7: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_7) => any;
+    default?: (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>;

package/dist/runtime/components/{l-table.d.vue.ts → L/Table.d.vue.ts}

@@ -1,10 +1,18 @@
 import type { Component } from "vue";
 import { Dialog } from 'quasar';
 import type { QTableColumn, QTableProps } from 'quasar';
+export interface SearchOptionsContext {
+    filters: Record<string, any>;
+    columnValue: any;
+    column: LTableColumn;
+}
+export type SearchOptionsResolver = (ctx: SearchOptionsContext) => Promise<Record<string, any>[]>;
 export type LTableColumn = QTableColumn & {
     searchType?: "date" | "text" | "number" | "select" | "boolean";
     searchable?: boolean;
-    searchOptions?: Record<string, any>[] | Function;
+    searchPlaceholder?: string;
+    searchOptions?: Record<string, any>[] | SearchOptionsResolver;
+    searchDependsOn?: string[];
     searchMultiple?: boolean;
     searchIndex?: string;
     component?: Component;
@@ -15,7 +23,7 @@ export type LTableColumn = QTableColumn & {
      * @deprecated use gql instead
      */
     gqlField?: string | Array<string> | Object;
-    searchMethod?: "equals" | "contains";
+    searchMethod?: "equals" | "contains" | "range";
     autoWidth?: boolean;
 };
 export type LTableProps = QTableProps & {
@@ -71,17 +79,17 @@ export interface LTableRequest {
     }) => void;
 }
 declare function requestServerInteraction(): void;
-declare var __VLS_114: any, __VLS_117: string, __VLS_118: any, __VLS_149: any, __VLS_152: any, __VLS_315: string, __VLS_316: any;
+declare var __VLS_135: any, __VLS_138: string, __VLS_139: any, __VLS_170: any, __VLS_173: any, __VLS_343: string, __VLS_344: any;
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_117>]?: (props: typeof __VLS_118) => any;
+    [K in NonNullable<typeof __VLS_138>]?: (props: typeof __VLS_139) => any;
 } & {
-    [K in NonNullable<typeof __VLS_315>]?: (props: typeof __VLS_316) => any;
+    [K in NonNullable<typeof __VLS_343>]?: (props: typeof __VLS_344) => any;
 } & {
-    actions?: (props: typeof __VLS_114) => any;
+    actions?: (props: typeof __VLS_135) => any;
 } & {
-    'row-expand'?: (props: typeof __VLS_149) => any;
+    'row-expand'?: (props: typeof __VLS_170) => any;
 } & {
-    'top-right'?: (props: typeof __VLS_152) => any;
+    'top-right'?: (props: typeof __VLS_173) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<LTableProps, {
     requestServerInteraction: typeof requestServerInteraction;

package/dist/runtime/components/{l-table.vue → L/Table.vue}

@@ -1,9 +1,10 @@
 <script setup>
 import { useQuasar, QTable, Dialog } from "quasar";
 import { defu } from "defu";
-import { ref, computed, onMounted, useSlots, watch, reactive } from "vue";
-import useLight from "../composables/useLight";
-import model from "../composables/model";
+import { ref, computed, onMounted, useSlots, watch, useAttrs } from "vue";
+import useLight from "../../composables/useLight";
+import { useLightTableDefaults } from "../../composables/useLightProps";
+import model from "../../composables/model";
 import { toQuery } from "@hostlink/light";
 import { list, navigateTo } from "#imports";
 import { useI18n } from "vue-i18n";
@@ -134,40 +135,29 @@ const filters = useSessionStorage(storageKey.value, {});
 if (!saveFilters.value) {
   filters.value = {};
 }
+defineOptions({ inheritAttrs: false });
 const light = useLight();
+const vAttrs = useAttrs();
+const L_KEYS = ["actions", "sortBy", "modelName", "searchable", "onRequestData", "addComponent", "addComponentProps", "name", "searchStyle", "canExpandRow"];
+const base = useLightTableDefaults(props, vAttrs, L_KEYS);
 const pagination = ref(props.pagination);
 if (props.rowsPerPageOptions[0] == 0) {
   pagination.value.rowsPerPage = 0;
 }
-props.columns?.forEach((col) => {
-  if (!col.align) {
-    col.align = "left";
-  }
-  if (!col.field && col.name) {
-    col.field = col.name;
-  }
-  col.label = t(col.label);
-});
-if (props.columns) {
-  for (let i = 0; i < props.columns.length; i++) {
-    if (props.columns[i]?.searchOptions) {
-      let opts = props.columns[i]?.searchOptions;
-      if (typeof opts == "function") {
-        props.columns[i].searchOptions = await opts();
-      }
-    }
-  }
-}
+const localColumns = computed(
+  () => props.columns?.map((col) => ({
+    ...col,
+    align: col.align ?? "left",
+    field: col.field ?? col.name,
+    label: t(col.label),
+    searchPlaceholder: col.searchPlaceholder ? t(col.searchPlaceholder) : void 0
+  }))
+);
 const emits = defineEmits(["request-data", "update:selected", "delete"]);
 const loading = ref(false);
-let activeEdit = false;
-let actionView = false;
-let actionDelete = false;
-if (props.actions.length > 0) {
-  actionView = props.actions.includes("view");
-  activeEdit = props.actions.includes("edit") || props.actions.includes("update");
-  actionDelete = props.actions.includes("delete");
-}
+const actionView = computed(() => props.actions.includes("view"));
+const activeEdit = computed(() => props.actions.includes("edit") || props.actions.includes("update"));
+const actionDelete = computed(() => props.actions.includes("delete"));
 if (props.sortBy) {
   let [sortBy, descending] = props.sortBy.split(":");
   pagination.value.sortBy = sortBy;
@@ -179,14 +169,49 @@ const hasSearch = computed(() => {
   });
 });
 const table = ref();
-const rows = ref(props.rows);
-if (rows.value == void 0) {
-  rows.value = [];
-}
-onMounted(() => {
-  table.value && table.value.requestServerInteraction();
+const rows = ref(props.rows ?? []);
+const resolvedSearchOptions = ref({});
+const localSearchOptions = ref({});
+let resolveSeq = 0;
+const resolveColumnOptions = async (col) => {
+  if (!col.searchOptions || !col.name) return;
+  if (Array.isArray(col.searchOptions)) {
+    resolvedSearchOptions.value[col.name] = col.searchOptions;
+    localSearchOptions.value[col.name] = col.searchOptions;
+    return;
+  }
+  const ctx = {
+    filters: { ...filters.value },
+    columnValue: filters.value[col.name],
+    column: col
+  };
+  const seq = ++resolveSeq;
+  try {
+    const result = await col.searchOptions(ctx);
+    if (seq !== resolveSeq) return;
+    resolvedSearchOptions.value[col.name] = result;
+    localSearchOptions.value[col.name] = result;
+  } catch {
+  }
+};
+onMounted(async () => {
+  await Promise.all(
+    (props.columns ?? []).map((col) => resolveColumnOptions(col))
+  );
+  table.value?.requestServerInteraction();
 });
-let primaryKey = ref(props.rowKey);
+watch(filters, (newFilters, oldFilters) => {
+  if (!props.columns) return;
+  for (const col of props.columns) {
+    if (!col.searchDependsOn?.length) continue;
+    if (typeof col.searchOptions !== "function") continue;
+    if (!col.name) continue;
+    const deps = col.searchDependsOn;
+    const changed = deps.some((dep) => newFilters?.[dep] !== oldFilters?.[dep]);
+    if (changed) resolveColumnOptions(col);
+  }
+}, { deep: true });
+const primaryKey = ref(props.rowKey);
 const modelName = ref(props.modelName);
 const validateData = () => {
   if (primaryKey.value == null) return;
@@ -234,13 +259,13 @@ const onLocalRequest = async (p) => {
     }
     localFields = defu(localFields, { [col.name]: true });
   });
-  if (actionView) {
+  if (actionView.value) {
     localFields = defu(localFields, { canView: true });
   }
-  if (actionDelete) {
+  if (actionDelete.value) {
     localFields = defu(localFields, { canDelete: true });
   }
-  if (activeEdit) {
+  if (activeEdit.value) {
     localFields = defu(localFields, { canUpdate: true });
   }
   const callback = {
@@ -316,7 +341,7 @@ const onLocalRequest = async (p) => {
         }
         this.setData(await l.fetchWithMeta());
       } catch (e) {
-        quasar.dialog({
+        $q.dialog({
           message: e,
           color: "negative"
         });
@@ -341,6 +366,18 @@ const getFilterValue = () => {
         const k = col.searchIndex ?? col.name;
         if (col.searchType == "boolean") {
           f[k] = filters.value[col.name];
+        } else if (col.searchMethod == "range" && typeof filters.value[col.name] === "object") {
+          const rangeValue = filters.value[col.name];
+          const rangeFilter = {};
+          if (rangeValue.min !== null && rangeValue.min !== "" && rangeValue.min !== void 0) {
+            rangeFilter._gte = Number(rangeValue.min);
+          }
+          if (rangeValue.max !== null && rangeValue.max !== "" && rangeValue.max !== void 0) {
+            rangeFilter._lte = Number(rangeValue.max);
+          }
+          if (Object.keys(rangeFilter).length > 0) {
+            f[k] = rangeFilter;
+          }
         } else if (col.searchType == "number") {
           f[k] = filters.value[col.name];
         } else if (col.searchType == "date") {
@@ -378,16 +415,13 @@ const onFilters = () => {
   });
 };
 const slots = useSlots();
-const ss = Object.entries(slots).map(([key, value]) => {
-  return key;
-});
-const quasar = useQuasar();
+const ss = computed(() => Object.keys(slots));
 const onDelete = async (id) => {
   if (modelName.value == null) return;
   try {
     await model(modelName.value).delete(id);
   } catch (e) {
-    quasar.notify({
+    $q.notify({
       message: e.message,
       color: "negative"
     });
@@ -399,12 +433,9 @@ const onDelete = async (id) => {
   emits("delete", id);
 };
 const attrs = computed(() => {
-  const a = { ...light.styles.table, ...Object.fromEntries(Object.entries(props).filter(([key, value]) => value !== void 0)) };
-  if (props.name) {
-    a.visibleColumns = visibleColumns.value;
-  }
   return {
-    ...a,
+    ...base.value,
+    ...props.name ? { visibleColumns: visibleColumns.value } : {},
     loadingLabel: t(props.loadingLabel),
     noDataLabel: t(props.noDataLabel),
     rowsPerPageOptions: props.rowsPerPageOptions,
@@ -414,20 +445,14 @@ const attrs = computed(() => {
   };
 });
 const filter = ref("");
-const toColumns = props.columns?.filter((col) => {
-  return col.to;
-}).map((col) => {
-  col.slot_name = "body-cell-" + col.name;
-  return col;
-});
 const isDark = computed(() => {
   return light.theme == "dark";
 });
 const hasRowExpand = computed(() => {
-  return ss.indexOf("row-expand") >= 0;
+  return ss.value.indexOf("row-expand") >= 0;
 });
 const hasActions = computed(() => {
-  return props.actions.length > 0 || ss.indexOf("actions") >= 0;
+  return props.actions.length > 0 || ss.value.indexOf("actions") >= 0;
 });
 const localSelected = computed({
   get() {
@@ -440,9 +465,6 @@ const localSelected = computed({
 watch(() => props.rows, (val) => {
   rows.value = val;
 });
-const computedColumns = computed(() => {
-  return props.columns;
-});
 function requestServerInteraction() {
   table.value && table.value.requestServerInteraction();
 }
@@ -458,26 +480,40 @@ const onAdd = () => {
     requestServerInteraction();
   });
 };
-const localSearchOptions = ref({});
 const searchSelectFilter = (val, update, name) => {
-  if (val == "") {
+  const allOptions = resolvedSearchOptions.value[name] ?? [];
+  if (val === "") {
     update(() => {
-      const column = props.columns?.find((col) => col.name == name);
-      localSearchOptions.value[name] = column?.searchOptions;
+      localSearchOptions.value[name] = allOptions;
     });
   } else {
     update(() => {
       const needle = val.toLocaleLowerCase();
-      const column = props.columns?.find((col) => col.name == name);
-      const options = column?.searchOptions;
-      if (Array.isArray(options)) {
-        localSearchOptions.value[name] = options.filter((v) => v.label.toLocaleLowerCase().indexOf(needle) > -1);
-      } else {
-        localSearchOptions.value[name] = options;
-      }
+      localSearchOptions.value[name] = Array.isArray(allOptions) ? allOptions.filter((v) => v.label.toLocaleLowerCase().indexOf(needle) > -1) : allOptions;
     });
   }
 };
+const localFilterMethod = (rows2, terms) => {
+  if (!terms || Object.keys(terms).length === 0) return rows2;
+  return rows2.filter((row) => {
+    for (const [key, value] of Object.entries(terms)) {
+      if (value === null || value === void 0 || value === "") continue;
+      const cell = row[key];
+      if (typeof value === "object" && value !== null && "contains" in value) {
+        if (!String(cell ?? "").toLowerCase().includes(String(value.contains).toLowerCase())) return false;
+      } else if (typeof value === "object" && value !== null && "_between" in value) {
+        if (cell < value._between[0] || cell > value._between[1]) return false;
+      } else if (typeof value === "object" && value !== null && ("_gte" in value || "_lte" in value)) {
+        if ("_gte" in value && value._gte !== null && value._gte !== void 0 && cell < value._gte) return false;
+        if ("_lte" in value && value._lte !== null && value._lte !== void 0 && cell > value._lte) return false;
+      } else {
+        if (cell !== value) return false;
+      }
+    }
+    return true;
+  });
+};
+const clientFilterTerms = computed(() => isServerSide ? null : getFilterValue());
 const showTopRight = computed(() => {
   return props.name && hasFilters.value || props.searchable || props.name && (props.columns && props.columns.length > 0);
 });
@@ -517,8 +553,11 @@ const hasFilters = computed(() => {
 </script>
 
 <template>
-    <q-table v-bind="attrs" :loading="loading" :rows="rows" ref="table" @request="onLocalRequest" :columns="columns"
-        v-model:pagination="pagination" :filter="filter" v-model:selected="localSelected">
+    <q-table v-bind="attrs" :loading="loading" :rows="rows" ref="table" @request="onLocalRequest" :columns="localColumns"
+        v-model:pagination="pagination"
+        :filter="isServerSide ? filter : clientFilterTerms"
+        :filter-method="isServerSide ? void 0 : localFilterMethod"
+        v-model:selected="localSelected">
         <template #header="props">
             <q-tr :props="props">
                 <q-th v-if="selection != 'none'" auto-width>
@@ -556,13 +595,22 @@ const hasFilters = computed(() => {
                     <div :class="{ 'text-grey-8': !isDark }" v-if="primaryKey">
 
                         <l-action-btn v-if="actionView && props.row.canView"
-                            :to="`/${modelName}/${props.row[primaryKey]}/view`" icon="sym_o_search" />
+                            :to="`/${modelName}/${props.row[primaryKey]}/view`"
+                            :icon="light.styles.table.actionIcons.view">
+                            <q-tooltip>{{ $t("View") }}</q-tooltip>
+                        </l-action-btn>
 
                         <l-action-btn v-if="activeEdit && props.row.canUpdate"
-                            :to="`/${modelName}/${props.row[primaryKey]}/edit`" icon="sym_o_edit" />
+                            :to="`/${modelName}/${props.row[primaryKey]}/edit`"
+                            :icon="light.styles.table.actionIcons.edit">
+                            <q-tooltip>{{ $t("Edit") }}</q-tooltip>
+                        </l-action-btn>
 
                         <l-delete-btn v-if="actionDelete && props.row.canDelete"
-                            @submit="onDelete(props.row[primaryKey])" size="sm"></l-delete-btn>
+                            :icon="light.styles.table.actionIcons.delete"
+                            @submit="onDelete(props.row[primaryKey])" size="sm">
+                            <q-tooltip>{{ $t("Delete") }}</q-tooltip>
+                        </l-delete-btn>
 
                         <slot name="actions" v-bind="props"></slot>
                     </div>
@@ -571,10 +619,10 @@ const hasFilters = computed(() => {
 
                 <template v-for="col in props.cols">
                     <template v-if="ss.indexOf('body-cell-' + col.name) >= 0">
-                        <slot :name="'body-cell-' + col.name" v-bind="props"></slot>
+                        <slot :name="'body-cell-' + col.name" v-bind="{ ...props, col, value: props.row[col.field] }"></slot>
                     </template>
                     <template v-else>
-                        <q-td :key="col.name" :props="props" :auto-width="col.autoWidth ?? false"><template
+                        <q-td :key="col.name" :props="props" :auto-width="col.autoWidth ?? false" :style="col.style"><template
                                 v-if="col.to" class="bg-primary">
                                 <l-link :to="col.to(props.row)" v-if="col.to(props.row)">{{ col.value }}</l-link>
                             </template>
@@ -646,7 +694,7 @@ const hasFilters = computed(() => {
             </q-td>
         </template -->
 
-        <template #top-row="props" v-if="hasSearch && isServerSide">
+        <template #top-row="props" v-if="hasSearch">
             <q-tr>
                 <q-td v-if="selection != 'none'" auto-width />
                 <q-td v-if="hasRowExpand" auto-width />
@@ -655,7 +703,14 @@ const hasFilters = computed(() => {
 
                     <template v-if="col.searchable">
 
-                        <template v-if="col.searchType == 'number'">
+                        <template v-if="col.searchMethod == 'range' && (!col.searchType || col.searchType == 'number')">
+                            <l-search-number
+                                v-model="filters[col.name]"
+                                @change="onFilters"
+                            />
+                        </template>
+
+                        <template v-else-if="col.searchType == 'number'">
                             <q-input style="min-width: 80px;" dense clearable filled square
                                 v-model.number="tempFilters[col.name]"
                                 @keydown.enter.prevent="filters[col.name] = tempFilters[col.name]"
@@ -684,9 +739,9 @@ const hasFilters = computed(() => {
 
                         </template>
 
-                        <template v-if="!col.searchType || col.searchType == 'text'">
+                        <template v-if="(!col.searchType || col.searchType == 'text') && col.searchMethod != 'range'">
                             <q-input style="min-width: 80px;" dense clearable filled square
-                                v-model="tempFilters[col.name]" @keydown.enter.prevent="filters[col.name] = tempFilters[col.name]" @clear="delete filters[col.name]" :enterkeyhint="$t('search')" :style="col.searchStyle"></q-input>
+                                v-model="tempFilters[col.name]" @keydown.enter.prevent="filters[col.name] = tempFilters[col.name]" @clear="delete filters[col.name]" :enterkeyhint="$t('search')" :placeholder="col.searchPlaceholder" :style="col.searchStyle"></q-input>
 
                         </template>
 

package/dist/runtime/components/{l-table.vue.d.ts → L/Table.vue.d.ts}

@@ -1,10 +1,18 @@
 import type { Component } from "vue";
 import { Dialog } from 'quasar';
 import type { QTableColumn, QTableProps } from 'quasar';
+export interface SearchOptionsContext {
+    filters: Record<string, any>;
+    columnValue: any;
+    column: LTableColumn;
+}
+export type SearchOptionsResolver = (ctx: SearchOptionsContext) => Promise<Record<string, any>[]>;
 export type LTableColumn = QTableColumn & {
     searchType?: "date" | "text" | "number" | "select" | "boolean";
     searchable?: boolean;
-    searchOptions?: Record<string, any>[] | Function;
+    searchPlaceholder?: string;
+    searchOptions?: Record<string, any>[] | SearchOptionsResolver;
+    searchDependsOn?: string[];
     searchMultiple?: boolean;
     searchIndex?: string;
     component?: Component;
@@ -15,7 +23,7 @@ export type LTableColumn = QTableColumn & {
      * @deprecated use gql instead
      */
     gqlField?: string | Array<string> | Object;
-    searchMethod?: "equals" | "contains";
+    searchMethod?: "equals" | "contains" | "range";
     autoWidth?: boolean;
 };
 export type LTableProps = QTableProps & {
@@ -71,17 +79,17 @@ export interface LTableRequest {
     }) => void;
 }
 declare function requestServerInteraction(): void;
-declare var __VLS_114: any, __VLS_117: string, __VLS_118: any, __VLS_149: any, __VLS_152: any, __VLS_315: string, __VLS_316: any;
+declare var __VLS_135: any, __VLS_138: string, __VLS_139: any, __VLS_170: any, __VLS_173: any, __VLS_343: string, __VLS_344: any;
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_117>]?: (props: typeof __VLS_118) => any;
+    [K in NonNullable<typeof __VLS_138>]?: (props: typeof __VLS_139) => any;
 } & {
-    [K in NonNullable<typeof __VLS_315>]?: (props: typeof __VLS_316) => any;
+    [K in NonNullable<typeof __VLS_343>]?: (props: typeof __VLS_344) => any;
 } & {
-    actions?: (props: typeof __VLS_114) => any;
+    actions?: (props: typeof __VLS_135) => any;
 } & {
-    'row-expand'?: (props: typeof __VLS_149) => any;
+    'row-expand'?: (props: typeof __VLS_170) => any;
 } & {
-    'top-right'?: (props: typeof __VLS_152) => any;
+    'top-right'?: (props: typeof __VLS_173) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<LTableProps, {
     requestServerInteraction: typeof requestServerInteraction;

package/dist/runtime/components/{l-tabs.vue → L/Tabs.vue}

@@ -1,5 +1,6 @@
 <script setup>
-import { useSlots, useRouter, useRoute, watch, onMounted } from "#imports";
+import { useLight } from "#imports";
+import { useSlots, useRouter, useRoute, watch, computed } from "#imports";
 const props = defineProps({
   name: { type: String, required: false, default: "tab" },
   route: { type: Boolean, required: false },
@@ -25,6 +26,7 @@ const props = defineProps({
   dense: { type: Boolean, required: false, skipCheck: true },
   "onUpdate:modelValue": { type: Function, required: false }
 });
+const light = useLight();
 const slots = useSlots();
 const router = useRouter();
 const route = useRoute();
@@ -38,12 +40,7 @@ if (modelValue.value === void 0) {
 }
 watch(modelValue, (newValue) => {
   if (props.route && props.name && newValue) {
-    router.push({
-      query: {
-        ...route.query,
-        [props.name]: newValue
-      }
-    });
+    router.push({ query: { ...route.query, [props.name]: newValue } });
   }
 }, { immediate: false });
 watch(() => props.name ? route.query[props.name] : null, (newTab) => {
@@ -51,11 +48,21 @@ watch(() => props.name ? route.query[props.name] : null, (newTab) => {
     modelValue.value = newTab;
   }
 });
+const L_KEYS = ["route", "name"];
+const tabsProps = computed(() => {
+  const result = {};
+  for (const [k, v] of Object.entries(props)) {
+    if (!L_KEYS.includes(k) && v !== void 0) result[k] = v;
+  }
+  return result;
+});
 </script>
 
 <template>
     <l-card>
-        <q-tabs v-bind="$props" class="text-grey" active-color="primary" indicator-color="primary"
+        <q-tabs v-bind="tabsProps" class="text-grey"
+            :active-color="light.color"
+            :indicator-color="light.color"
             v-model="modelValue">
             <slot></slot>
         </q-tabs>

package/dist/runtime/components/{l-time-picker.d.vue.ts → L/TimePicker.d.vue.ts}

@@ -6,9 +6,11 @@ export interface LTimePickerProps {
     nowBtn?: boolean;
     withSeconds?: boolean;
     format24h?: boolean;
-    mask?: string;
     hideBottomSpace?: boolean;
     color?: string;
+    disable?: boolean;
+    readonly?: boolean;
+    dark?: boolean;
 }
 type __VLS_Props = LTimePickerProps;
 type __VLS_ModelProps = {
@@ -24,7 +26,6 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: any) => any) | undefined;
 }>, {
-    mask: string;
     format24h: boolean;
     required: boolean;
     hideBottomSpace: boolean;