@winchsa/ui 0.1.34 → 0.1.36

package/dist/components/forms/AppSelect.d.vue.ts

@@ -1,12 +1,16 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_18: string | number, __VLS_19: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_18>]?: (props: typeof __VLS_19) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:model-value": (value: string | null) => any;
-}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:model-value"?: ((value: string | null) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>, {}, {}, {}, {}, 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;

package/dist/components/forms/AppSelect.vue

@@ -6,18 +6,21 @@ defineOptions({
   name: "AppSelect",
   inheritAttrs: false
 });
+const props = defineProps({
+  label: { type: String, required: false },
+  title: { type: String, required: false }
+});
 const { t } = useI18n();
 const attrs = useAttrs();
 const emit = defineEmits(["update:model-value"]);
 const uid = Math.random().toString(36).slice(2, 7);
-const label = computed(() => attrs.label);
-const langLabel = computed(() => label.value ? t(label.value) : "");
+const langLabel = computed(() => props.label ? t(props.label) : "");
 const elementId = computed(() => {
-  const token = attrs.id || label.value;
+  const token = attrs.id || props.label;
   return token ? `app-select-${token}-${uid}` : void 0;
 });
 const placeholder = computed(() => {
-  return attrs.placeholder || (label.value ? t("inputs.placeholder_select", { name: langLabel.value }) : "");
+  return attrs.placeholder || (props.label ? t("inputs.placeholder_select", { name: langLabel.value }) : "");
 });
 const handleMenuToggle = ($event) => {
   const container = document.getElementsByClassName("v-overlay-container");
@@ -39,10 +42,10 @@ const handleMenuToggle = ($event) => {
     :class="$attrs.class"
   >
     <VLabel
-      v-if="label"
+      v-if="title ?? label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
-      :text="langLabel"
+      :text="title ?? langLabel"
     />
 
     <VSelect

package/dist/components/forms/AppSelect.vue.d.ts

@@ -1,12 +1,16 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_18: string | number, __VLS_19: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_18>]?: (props: typeof __VLS_19) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:model-value": (value: string | null) => any;
-}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:model-value"?: ((value: string | null) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>, {}, {}, {}, {}, 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;

package/dist/components/forms/AppSwitch.d.vue.ts

@@ -1,4 +1,6 @@
 type __VLS_Props = {
+    label?: string;
+    title?: string;
     labelSwitch?: string;
 };
 declare var __VLS_15: string | number, __VLS_16: any;

package/dist/components/forms/AppSwitch.vue

@@ -2,7 +2,9 @@
 import { computed, useAttrs } from "vue";
 import { VLabel, VSwitch } from "vuetify/components";
 import { useI18n } from "vue-i18n";
-defineProps({
+const props = defineProps({
+  label: { type: String, required: false },
+  title: { type: String, required: false },
   labelSwitch: { type: String, required: false }
 });
 defineOptions({
@@ -15,8 +17,7 @@ const elementId = computed(() => {
   const _elementIdToken = attrs.id || attrs.label;
   return _elementIdToken ? `app-switch-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
 });
-const label = computed(() => useAttrs().label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
+const LangLabel = computed(() => props.label ? t(props.label) : "");
 </script>
 
 <template>
@@ -26,10 +27,10 @@ const LangLabel = computed(() => label.value ? t(label.value) : "");
   >
     <div>
       <VLabel
-        v-if="label"
+        v-if="title ?? label"
         :for="elementId"
         class="mb-2 text-body-2 text-high-emphasis"
-        :text="LangLabel"
+        :text="title ?? LangLabel"
       />
     </div>
     <div>

package/dist/components/forms/AppSwitch.vue.d.ts

@@ -1,4 +1,6 @@
 type __VLS_Props = {
+    label?: string;
+    title?: string;
     labelSwitch?: string;
 };
 declare var __VLS_15: string | number, __VLS_16: any;

package/dist/components/forms/AppTextField.d.vue.ts

@@ -1,8 +1,12 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_15: string | number, __VLS_16: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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;

package/dist/components/forms/AppTextField.vue

@@ -6,17 +6,20 @@ defineOptions({
   name: "AppTextField",
   inheritAttrs: false
 });
+const props = defineProps({
+  label: { type: String, required: false },
+  title: { type: String, required: false }
+});
 const { t } = useI18n();
 const attrs = useAttrs();
 const uid = Math.random().toString(36).slice(2, 7);
-const label = computed(() => attrs.label);
-const langLabel = computed(() => label.value ? t(label.value) : "");
+const langLabel = computed(() => props.label ? t(props.label) : "");
 const elementId = computed(() => {
-  const token = attrs.id || label.value;
+  const token = attrs.id || props.label;
   return token ? `AppTextField-${token}-${uid}` : void 0;
 });
 const placeholder = computed(() => {
-  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
+  return attrs.placeholder || (props.label ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
 </script>
 
@@ -26,10 +29,10 @@ const placeholder = computed(() => {
     :class="$attrs.class"
   >
     <VLabel
-      v-if="label"
+      v-if="title ?? label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
-      :text="langLabel"
+      :text="title ?? langLabel"
     />
     <VTextField
       v-bind="{

package/dist/components/forms/AppTextField.vue.d.ts

@@ -1,8 +1,12 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_15: string | number, __VLS_16: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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;

package/dist/components/forms/AppTextarea.d.vue.ts

@@ -1,8 +1,12 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_15: string | number, __VLS_16: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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;

package/dist/components/forms/AppTextarea.vue

@@ -6,17 +6,20 @@ defineOptions({
   name: "AppTextarea",
   inheritAttrs: false
 });
+const props = defineProps({
+  label: { type: String, required: false },
+  title: { type: String, required: false }
+});
 const { t } = useI18n();
 const attrs = useAttrs();
 const uid = Math.random().toString(36).slice(2, 7);
-const label = computed(() => attrs.label);
-const langLabel = computed(() => label.value ? t(label.value) : "");
+const langLabel = computed(() => props.label ? t(props.label) : "");
 const elementId = computed(() => {
-  const token = attrs.id || label.value;
+  const token = attrs.id || props.label;
   return token ? `app-textarea-${token}-${uid}` : void 0;
 });
 const placeholder = computed(() => {
-  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
+  return attrs.placeholder || (props.label ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
 </script>
 
@@ -26,10 +29,10 @@ const placeholder = computed(() => {
     :class="$attrs.class"
   >
     <VLabel
-      v-if="label"
+      v-if="title ?? label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis"
-      :text="langLabel"
+      :text="title ?? langLabel"
     />
     <VTextarea
       v-bind="{

package/dist/components/forms/AppTextarea.vue.d.ts

@@ -1,8 +1,12 @@
+type __VLS_Props = {
+    label?: string;
+    title?: string;
+};
 declare var __VLS_15: string | number, __VLS_16: any;
 type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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;

package/dist/components/forms/AutocompleteInput.d.vue.ts

@@ -24,6 +24,7 @@ type __VLS_Props = {
     placeholder?: string;
     url?: string;
     label?: string;
+    title?: string;
     deselectLabel?: string;
     selectLabel?: string;
     selectedLabel?: string;
@@ -35,11 +36,11 @@ type __VLS_Props = {
     disableIfEmpty?: boolean;
     clearable?: boolean;
 };
-declare var __VLS_68: string | number, __VLS_69: any, __VLS_133: string | number, __VLS_134: any;
+declare var __VLS_71: string | number, __VLS_72: any, __VLS_136: string | number, __VLS_137: any;
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_68>]?: (props: typeof __VLS_69) => any;
+    [K in NonNullable<typeof __VLS_71>]?: (props: typeof __VLS_72) => any;
 } & {
-    [K in NonNullable<typeof __VLS_133>]?: (props: typeof __VLS_134) => any;
+    [K in NonNullable<typeof __VLS_136>]?: (props: typeof __VLS_137) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     records: Ref<{
@@ -69,6 +70,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
         children?: /*elided*/ any[] | undefined;
     } | null)[]>;
     loading: import("vue").ComputedRef<boolean>;
+    refetch: () => Promise<OptionItem[]>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:model-value": (value: unknown) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{

package/dist/components/forms/AutocompleteInput.vue

@@ -33,6 +33,7 @@ const props = defineProps({
   placeholder: { type: String, required: false },
   url: { type: String, required: false },
   label: { type: String, required: false },
+  title: { type: String, required: false },
   deselectLabel: { type: String, required: false, default: "" },
   selectLabel: { type: String, required: false, default: "" },
   selectedLabel: { type: String, required: false, default: "" },
@@ -51,6 +52,7 @@ const loading = ref(false);
 const showTeleport = ref(false);
 const search = ref("");
 const inputRef = ref({});
+const teleportRef = ref(null);
 const errorState = ref(false);
 const isOpen = ref(false);
 const emits = defineEmits(["update:model-value"]);
@@ -69,7 +71,7 @@ const params = computed(() => buildQueryString(props.params));
 const elementId = computed(() => {
   const attrs = useAttrs();
   const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `autocomplete-input-${_elementIdToken}-${guid}` : `autocomplete-input-${_elementIdToken}-${guid}`;
+  return _elementIdToken ? `autocomplete-input-${_elementIdToken}-${guid}` : `autocomplete-input-${guid}`;
 });
 const internalPlaceholder = computed(() => {
   return props.placeholder ? props.placeholder : t("inputs.placeholder_select", {
@@ -209,29 +211,40 @@ watch(() => props.options, () => {
   deep: true,
   immediate: true
 });
+const refetch = async () => {
+  if (props.url) {
+    const options = await getRecords();
+    defaultOptions.value = options;
+    displayedOptions.value = options;
+    return options;
+  }
+  return [];
+};
 defineExpose({
   records: defaultOptions,
   internalOptions: filteredOptions,
-  loading: isLoading
+  loading: isLoading,
+  refetch
 });
 </script>
 
 <template>
   <div :id="elementId" class="d-flex flex-column w-100">
     <VLabel
-      v-if="label"
+      v-if="title || label"
       class="text-body-2 text-high-emphasis mb-2"
-      :text="t(label)"
+      :text="title ?? t(label)"
     />
 
     <Teleport v-if="teleported && showTeleport" to="body">
       <VValidation
-        v-slot="{ errorMessages: validationErrors, isValid }"
+        v-slot="{ errorMessages: _validationErrors, isValid }"
         v-model="value"
         :rules="rules"
         validate-on="input lazy"
       >
         <MultiSelect
+          ref="teleportRef"
           v-model="value"
           :options="filteredOptions"
           :multiple="multiple"
@@ -268,6 +281,7 @@ defineExpose({
           :value="value"
           @search-change="searchInternally ? customSearch($event) : fetchAndUpdateRecords($event)"
           @select="errorState = false, resetTeleportState()"
+          @close="showTeleport = false, isOpen = false"
         >
           <template #caret>
             <span class="multiselect-arrow">
@@ -347,7 +361,8 @@ defineExpose({
         <VMessages
           v-if="!hideDetails"
           class="mt-1"
-          :messages="[validationErrors.value, errorMessages]"
+          color="error"
+          :messages="[..._validationErrors.value, errorMessages]"
           :active="isValid.value === false || errorMessages?.length !== 0"
         />
       </VValidation>
@@ -477,7 +492,8 @@ defineExpose({
       <VMessages
         v-if="!hideDetails"
         class="mt-1"
-        :messages="[validationErrors.value, errorMessages]"
+        color="error"
+        :messages="[...validationErrors.value, errorMessages]"
         :active="isValid.value === false || errorMessages?.length !== 0"
       />
     </VValidation>
@@ -491,22 +507,16 @@ defineExpose({
 <style>
 .app-custom-input-teleport .multiselect__tags {
   display: none !important;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  padding-top: 0;
 }
 .app-custom-input-teleport .multiselect-arrow {
   display: none !important;
 }
 .app-custom-input-teleport .multiselect__placeholder {
-  margin: 0;
-  padding-top: 0;
+  display: none !important;
 }
 .app-custom-input-teleport .multiselect__content-wrapper {
   margin-top: 53px;
-  z-index: 10;
+  z-index: 9999;
   display: block !important;
 }
 
@@ -521,9 +531,6 @@ defineExpose({
   margin: 0;
   padding-top: 0;
 }
-.app-teleport-clone .multiselect__content-wrapper {
-  display: none !important;
-}
 
 .app-custom-input .multiselect__placeholder {
   display: flex;
@@ -566,6 +573,7 @@ defineExpose({
   border-radius: 6px;
   background: rgba(var(--v-theme-surface));
   color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+  z-index: 9999 !important;
 }
 
 .multiselect__input {

package/dist/components/forms/AutocompleteInput.vue.d.ts

@@ -24,6 +24,7 @@ type __VLS_Props = {
     placeholder?: string;
     url?: string;
     label?: string;
+    title?: string;
     deselectLabel?: string;
     selectLabel?: string;
     selectedLabel?: string;
@@ -35,11 +36,11 @@ type __VLS_Props = {
     disableIfEmpty?: boolean;
     clearable?: boolean;
 };
-declare var __VLS_68: string | number, __VLS_69: any, __VLS_133: string | number, __VLS_134: any;
+declare var __VLS_71: string | number, __VLS_72: any, __VLS_136: string | number, __VLS_137: any;
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_68>]?: (props: typeof __VLS_69) => any;
+    [K in NonNullable<typeof __VLS_71>]?: (props: typeof __VLS_72) => any;
 } & {
-    [K in NonNullable<typeof __VLS_133>]?: (props: typeof __VLS_134) => any;
+    [K in NonNullable<typeof __VLS_136>]?: (props: typeof __VLS_137) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     records: Ref<{
@@ -69,6 +70,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
         children?: /*elided*/ any[] | undefined;
     } | null)[]>;
     loading: import("vue").ComputedRef<boolean>;
+    refetch: () => Promise<OptionItem[]>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:model-value": (value: unknown) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{

package/dist/components/forms/CustomRadiosWithIcon.vue

@@ -25,7 +25,7 @@ const labelLang = computed(() => props.label ? t("inputs.placeholder_select", {
 <template>
   <div v-if="radioContent">
     <VLabel
-      class="font-weight-bold mb-4 text-body-2 text-high-emphasis"
+      class="mb-2 text-body-2 text-high-emphasis"
       :text="labelLang"
     />
 

package/dist/components/forms/LicensePlateInput.vue

@@ -125,7 +125,8 @@ watch(() => model.value, (newVal) => {
         </div>
         <VMessages
           v-if="!hideDetails"
-          class="mt-n1"
+          class="mt-1"
+          color="error"
           :messages="errorMessages || validationErrors.value"
           :active="!isValid.value"
         />
@@ -151,7 +152,6 @@ watch(() => model.value, (newVal) => {
   grid-template-columns: 60px 60px 60px 1fr;
   width: 100%;
   min-height: 40px;
-  height: 100%;
   align-items: center;
   border: 1px solid rgba(var(--v-border-color), 0.29);
   border-radius: 6px;

package/dist/components/table/EditableDataTable.vue

@@ -93,7 +93,7 @@ const moduleIdentifier = computed(() => props.module ?? "rows");
   width: header.width
 }"
         >
-          <template v-for="(field) in header.fields" :key="`row.${index}.${field.key}`">
+          <template v-for="(field) in header.fields" :key="`row.${index}.fields.${field.key}`">
             <EditableDataTableRow
               v-model="items[index]"
               :header="field"
@@ -108,7 +108,7 @@ const moduleIdentifier = computed(() => props.module ?? "rows");
 
       <template v-else>
         <EditableDataTableRow
-          :key="`row.${index}.${header.key}.row2`"
+          :key="`row.${index}.${header.key}`"
           v-model="items[index]"
           :header="header"
           :index="index"
@@ -136,8 +136,8 @@ const moduleIdentifier = computed(() => props.module ?? "rows");
   border-bottom: 0px solid rgba(var(--v-table-divider)) !important;
 }
 
-.v-table__wrapper {
-  overflow: inherit !important;
+:deep(.v-table__wrapper) {
+  overflow: visible !important;
 }
 
 table tr th {

package/dist/components/table/EditableDataTableRow.vue

@@ -82,13 +82,13 @@ const autoCompleteParams = computed(() => {
   };
 });
 const placeholder = (header) => {
-  return header.placeholder ?? t(header.text);
+  return header?.placeholder ?? (header?.title ? t(header.title) : "");
 };
 </script>
 
 <template>
   <AppTextField
-    v-if="header.type === 'text'"
+    v-if="(header.type === 'text' || header.type === undefined ) && !(['actions', 'index']).includes(header.key)"
     v-model="item[header.key]"
     class="h-100 app-input-outline"
     :placeholder="placeholder(header)"
@@ -101,7 +101,6 @@ const placeholder = (header) => {
     flat
     hide-details
   />
-
   <AppNumberField
     v-if="header.type === 'number'"
     v-model="item[header.key]"

package/dist/styles/core/template/_components.scss

@@ -626,7 +626,7 @@ $btn-hover-overlay-opacity: (
 
   &:not(.v-input--disabled) .v-switch__track {
     border: 1px solid rgba(var(--v-border-color), var(--v-switch-opacity));
-    background-color: rgb(var(--v-theme-surface));
+    background-color: rgba(var(--v-theme-on-surface),var(--v-focus-opacity));
     opacity: 1;
   }
 
@@ -636,9 +636,7 @@ $btn-hover-overlay-opacity: (
     --v-selection-control-size: 1.5rem;
 
     .v-switch__thumb {
-      background: rgba(var(--v-theme-on-surface), var(--v-switch-opacity));
-      block-size: 1rem;
-      inline-size: 1rem;
+      background: rgb(var(--v-theme-on-success)) !important;
     }
   }
 
@@ -685,6 +683,15 @@ $btn-hover-overlay-opacity: (
   }
 }
 
+.v-switch--inset .v-selection-control--dirty .v-switch__thumb {
+  transform: scale(0.6666666667) !important;
+}
+
+.v-switch--inset .v-switch__thumb {
+  width: 20px !important;
+  height: 20px !important;
+}
+
 .v-switch.v-input,
 .v-checkbox-btn,
 .v-radio-btn,

package/dist/styles/core/template/index.css

@@ -18397,7 +18397,7 @@ body {
 }
 .v-switch.v-switch--inset:not(.v-input--disabled) .v-switch__track {
   border: 1px solid rgba(var(--v-border-color), var(--v-switch-opacity));
-  background-color: rgb(var(--v-theme-surface));
+  background-color: rgba(var(--v-theme-on-surface), var(--v-focus-opacity));
   opacity: 1;
 }
 .v-switch.v-switch--inset .v-selection-control__input {
@@ -18405,9 +18405,7 @@ body {
   --v-selection-control-size: 1.5rem;
 }
 .v-switch.v-switch--inset .v-selection-control__input .v-switch__thumb {
-  background: rgba(var(--v-theme-on-surface), var(--v-switch-opacity));
-  block-size: 1rem;
-  inline-size: 1rem;
+  background: rgb(var(--v-theme-on-success)) !important;
 }
 .v-switch.v-switch--inset .v-selection-control--dirty .v-switch__track {
   border-color: rgba(var(--v-border-color), var(--v-switch-opacity));
@@ -18452,6 +18450,15 @@ body {
   opacity: var(--v-switch-checked-disabled-opacity);
 }
 
+.v-switch--inset .v-selection-control--dirty .v-switch__thumb {
+  transform: scale(0.6666666667) !important;
+}
+
+.v-switch--inset .v-switch__thumb {
+  width: 20px !important;
+  height: 20px !important;
+}
+
 .v-switch.v-input,
 .v-checkbox-btn,
 .v-radio-btn,

package/dist/types.d.ts

@@ -115,7 +115,7 @@ export type EditableDataTableItem = {
 	key: string
 	width?: string
 	title?: string
-	text?: string | undefined
+	text?: string
 	placeholder?: string
 	type?: EditableDataTableItemType
 	required?: boolean

package/package.json

@@ -1,70 +1,70 @@
 {
-  "name": "@winchsa/ui",
-  "version": "0.1.34",
-  "type": "module",
-  "private": false,
-  "publishConfig": {
-    "access": "public"
-  },
-  "files": [
-    "dist/*"
-  ],
-  "exports": {
-    ".": {
-      "require": "./dist/index.js",
-      "import": "./dist/index.mjs",
-      "types": "./dist/index.d.ts"
+    "name": "@winchsa/ui",
+    "version": "0.1.36",
+    "type": "module",
+    "private": false,
+    "publishConfig": {
+        "access": "public"
     },
-    "./utils": {
-      "require": "./dist/utils/index.js",
-      "import": "./dist/utils/index.mjs",
-      "types": "./dist/utils/index.d.ts"
+    "files": [
+        "dist/*"
+    ],
+    "exports": {
+        ".": {
+            "require": "./dist/index.js",
+            "import": "./dist/index.mjs",
+            "types": "./dist/index.d.ts"
+        },
+        "./utils": {
+            "require": "./dist/utils/index.js",
+            "import": "./dist/utils/index.mjs",
+            "types": "./dist/utils/index.d.ts"
+        }
+    },
+    "main": "./dist/index.js",
+    "module": "./dist/index.mjs",
+    "scripts": {
+        "dev": "vite",
+        "build": "unbuild",
+        "lint": "eslint \"**/*.{ts,vue,mjs}\"",
+        "lint:fix": "eslint \"**/*.{ts,vue,mjs}\" --fix",
+        "bump": "pnpm version patch && pnpm run build && git add . && git commit -m \"chore: release v$(node -p \"require('./package.json').version\")\""
+    },
+    "peerDependencies": {
+        "@intlify/unplugin-vue-i18n": "^4.0.0",
+        "@tanstack/vue-query": "^5.74.5",
+        "@vueuse/core": "11.3.0",
+        "@vueuse/router": "^13.1.0",
+        "ofetch": "^1.4.1",
+        "vue": "^3.5.13",
+        "vue-i18n": "9.14.5",
+        "vue-router": "4.4.5",
+        "vue-sonner": "^1.3.0",
+        "vue3-perfect-scrollbar": "2.0.0",
+        "vuetify": "3.10.11"
+    },
+    "dependencies": {
+        "@vuepic/vue-datepicker": "^11.0.0",
+        "cropperjs": "^1.6.2",
+        "print-js": "^1.6.0",
+        "v-calendar": "^3.1.2",
+        "vue-multiselect": "^3.1.0"
+    },
+    "devDependencies": {
+        "@tanstack/eslint-plugin-query": "^5.73.3",
+        "@typescript-eslint/eslint-plugin": "^7.18.0",
+        "@types/node": "^22.12.0",
+        "@vitejs/plugin-vue": "^6.0.1",
+        "eslint": "^8.57.1",
+        "eslint-import-resolver-typescript": "^4.3.3",
+        "eslint-plugin-import": "^2.31.0",
+        "eslint-plugin-vue": "^9.32.0",
+        "sass": "1.92.1",
+        "typescript": "^5.9.3",
+        "unbuild": "^3.0.0",
+        "vite": "^5.4.21",
+        "vite-plugin-vuetify": "^2.1.2",
+        "vue-sfc-transformer": "^0.1.16",
+        "vue-tsc": "^3.1.1"
     }
-  },
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "peerDependencies": {
-    "@intlify/unplugin-vue-i18n": "^4.0.0",
-    "@tanstack/vue-query": "^5.74.5",
-    "@vueuse/core": "11.3.0",
-    "@vueuse/router": "^13.1.0",
-    "ofetch": "^1.4.1",
-    "vue": "^3.5.13",
-    "vue-i18n": "9.14.5",
-    "vue-router": "4.4.5",
-    "vue-sonner": "^1.3.0",
-    "vue3-perfect-scrollbar": "2.0.0",
-    "vuetify": "3.10.11"
-  },
-  "dependencies": {
-    "@vuepic/vue-datepicker": "^11.0.0",
-    "cropperjs": "^1.6.2",
-    "print-js": "^1.6.0",
-    "v-calendar": "^3.1.2",
-    "vue-multiselect": "^3.1.0"
-  },
-  "devDependencies": {
-    "@tanstack/eslint-plugin-query": "^5.73.3",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@types/node": "^22.12.0",
-    "@vitejs/plugin-vue": "^6.0.1",
-    "eslint": "^8.57.1",
-    "eslint-import-resolver-typescript": "^4.3.3",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-vue": "^9.32.0",
-    "sass": "1.92.1",
-    "typescript": "^5.9.3",
-    "unbuild": "^3.0.0",
-    "vite": "^5.4.21",
-    "vite-plugin-vuetify": "^2.1.2",
-    "vue-sfc-transformer": "^0.1.16",
-    "vue-tsc": "^3.1.1"
-  },
-  "scripts": {
-    "dev": "vite",
-    "build": "unbuild",
-    "lint": "eslint \"**/*.{ts,vue,mjs}\"",
-    "lint:fix": "eslint \"**/*.{ts,vue,mjs}\" --fix",
-    "bump": "pnpm version patch && pnpm run build && git add . && git commit -m \"chore: release v$(node -p \"require('./package.json').version\")\""
-  }
-}
+}