atom-nuxt 1.3.1 → 1.3.3

package/dist/module.d.mts

@@ -16,7 +16,9 @@ interface AtomCrudModuleOptions {
     azureAdB2C?: azureAdB2COptions;
     googleMapsApiKey?: string;
     debug?: boolean;
+    defaultDialogStyle?: 'default' | 'leaf';
 }
 declare const _default: _nuxt_schema.NuxtModule<AtomCrudModuleOptions, AtomCrudModuleOptions, false>;
 
-export { type AtomCrudModuleOptions, type azureAdB2COptions, _default as default };
+export { _default as default };
+export type { AtomCrudModuleOptions, azureAdB2COptions };

package/dist/module.json

@@ -1,9 +1,9 @@
 {
   "name": "@atomengine/atom-nuxt",
   "configKey": "atomNuxt",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "builder": {
-    "@nuxt/module-builder": "0.8.4",
-    "unbuild": "2.0.0"
+    "@nuxt/module-builder": "1.0.1",
+    "unbuild": "3.5.0"
   }
 }

package/dist/module.mjs

@@ -10,7 +10,8 @@ const module = defineNuxtModule({
     additionalHeaders: {
       "Content-Type": "application/json",
       "Accept": "application/json"
-    }
+    },
+    defaultDialogStyle: "default"
   },
   async setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);

package/dist/runtime/components/AlertDisplay.vue

@@ -1,46 +1,43 @@
-<script setup lang="ts">
-import {useAlertService} from '../composables/useAlertService';
-import {computed} from 'vue';
-
-const {alertMessage, alertActive} = useAlertService();
-
+<script setup>
+import { useAlertService } from "../composables/useAlertService";
+import { computed } from "vue";
+const { alertMessage, alertActive } = useAlertService();
 const message = computed(() => {
   if (!alertMessage.value || !alertActive.value) {
     return null;
   }
-  return typeof alertMessage.value === 'string' ? alertMessage.value : alertMessage.value.message;
+  return typeof alertMessage.value === "string" ? alertMessage.value : alertMessage.value.message;
 });
 const color = computed(() => {
   if (!alertMessage.value || !alertActive.value) {
     return null;
   }
-  return typeof alertMessage.value === 'string' ? 'success' : alertMessage.value.color || 'success';
+  return typeof alertMessage.value === "string" ? "success" : alertMessage.value.color || "success";
 });
 const location = computed(() => {
   if (!alertMessage.value || !alertActive.value) {
     return "";
   }
-  return typeof alertMessage.value === 'string' ? "" : alertMessage.value.location || "";
+  return typeof alertMessage.value === "string" ? "" : alertMessage.value.location || "";
 });
 const icon = computed(() => {
   if (!alertMessage.value || !alertActive.value) {
     return null;
   }
-  return typeof alertMessage.value === 'string' ? null : alertMessage.value.icon || null;
+  return typeof alertMessage.value === "string" ? null : alertMessage.value.icon || null;
 });
-
 const clickable = computed(() => {
-  if (!alertMessage.value || !alertActive.value || typeof alertMessage.value === 'string' || !alertMessage.value.onClick) {
+  if (!alertMessage.value || !alertActive.value || typeof alertMessage.value === "string" || !alertMessage.value.onClick) {
     return false;
   }
   return true;
-})
+});
 const onClick = () => {
   if (!clickable.value) {
     return;
   }
   alertMessage.value.onClick();
-}
+};
 </script>
 
 <template>
@@ -56,7 +53,3 @@ const onClick = () => {
     </div>
   </v-snackbar>
 </template>
-
-<style scoped>
-
-</style>

package/dist/runtime/components/AlertDisplay.vue.d.ts

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

package/dist/runtime/components/CrudAddressSearchField.vue

@@ -1,36 +1,33 @@
 <script setup>
-import {ref, watch} from 'vue';
-import {useRuntimeConfig} from "nuxt/app";
-import {useDebounceFn} from '@vueuse/core'; // Ensure @vueuse/core is installed
-
+import { ref, watch } from "vue";
+import { useRuntimeConfig } from "nuxt/app";
+import { useDebounceFn } from "@vueuse/core";
 const atomNuxtConfig = useRuntimeConfig().public.atomNuxt;
 const props = defineProps({
   hint: {
     type: String,
-    default: 'Search by postcode, city or country. You must select an option from the list.'
+    default: "Search by postcode, city or country. You must select an option from the list."
   },
   label: {
     type: String,
-    default: 'Address search'
+    default: "Address search"
   },
   placeholder: {
     type: String,
-    default: 'Start typing address'
+    default: "Start typing address"
   },
   countries: {
     type: Array,
-    default: () => [] // Example: ['gb', 'fr', 'us']
+    default: () => []
+    // Example: ['gb', 'fr', 'us']
   }
 });
-// Data
-const searchText = ref('');
+const searchText = ref("");
 const addressSearchResults = ref([]);
 const loading = ref(false);
 const selectedPlaceId = ref(null);
 const model = defineModel();
-const placeModel = defineModel("place")
-
-// Function to get autocomplete suggestions using fetch
+const placeModel = defineModel("place");
 const fetchAutocompleteSuggestions = async (query) => {
   if (!query || loading.value) return;
   loading.value = true;
@@ -41,23 +38,21 @@ const fetchAutocompleteSuggestions = async (query) => {
         params: {
           input: query,
           key: atomNuxtConfig.googleMapsApiKey,
-          components: props.countries.length
-            ? props.countries.map(c => `country:${c}`).join('|')
-            : undefined
+          components: props.countries.length ? props.countries.map((c) => `country:${c}`).join("|") : void 0
         },
-        method: 'GET'
+        method: "GET"
       }
     );
-    if (result.status === 'OK') {
-      addressSearchResults.value = result.predictions.map(prediction => ({
+    if (result.status === "OK") {
+      addressSearchResults.value = result.predictions.map((prediction) => ({
         text: prediction.description,
         place_id: prediction.place_id
       }));
     } else {
-      console.error('Error fetching autocomplete suggestions:', result.status);
+      console.error("Error fetching autocomplete suggestions:", result.status);
     }
   } catch (error) {
-    console.error('Error fetching autocomplete suggestions:', error);
+    console.error("Error fetching autocomplete suggestions:", error);
   } finally {
     loading.value = false;
   }
@@ -73,37 +68,29 @@ const fetchPlaceId = async (placeId) => {
       `/api/maps/places`,
       {
         params: {
-          placeId: placeId,
-          key: atomNuxtConfig.googleMapsApiKey,
+          placeId,
+          key: atomNuxtConfig.googleMapsApiKey
         },
-        method: 'GET'
+        method: "GET"
       }
     );
-    // Check if the API call was successful
-    if (result.status === 'OK') {
+    if (result.status === "OK") {
       placeModel.value = result.result;
       model.value = `${result.result.geometry.location.lat},${result.result.geometry.location.lng}`;
     } else {
-      console.error('Error fetching place details:', result.status);
+      console.error("Error fetching place details:", result.status);
     }
   } catch (error) {
-    console.error('Error fetching place details:', error);
+    console.error("Error fetching place details:", error);
   }
 };
-
-
-// Debounce the search text updates to avoid excessive API calls
 const debouncedFetchAutocompleteSuggestions = useDebounceFn(fetchAutocompleteSuggestions, 500);
-
-// Watch for changes to searchText and trigger debounced API calls
 watch(searchText, (newQuery) => {
   debouncedFetchAutocompleteSuggestions(newQuery);
 });
-
 watch(selectedPlaceId, (newPlaceId) => {
   fetchPlaceId(newPlaceId);
 });
-
 </script>
 
 <template>

package/dist/runtime/components/CrudAddressSearchField.vue.d.ts

@@ -0,0 +1,8 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    hint: string;
+    label: string;
+    placeholder: string;
+    countries: unknown[];
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/CrudApiSelectorField.vue

@@ -1,44 +1,31 @@
 <script setup>
 import CrudListLoader from "./CrudListLoader.vue";
-import {defineModel, ref, computed} from "vue";
-
+import { defineModel, ref, computed } from "vue";
 const props = defineProps({
-  path: {type: String, required: true},
-  multiple: {type: Boolean, default: false},
-  endpointDisplayKey: {type: String, default: "name"},
-  endpointFilterKey: {type: String, default: "keywords"},
-  endpointResponseKey: {type: String, default: "id"},
-  additionalFilters: {type: Object, default: () => ({})},
-  disableUpdate: {type: Boolean, default: false},
-  createBtnText: {type: String, default: "Select"},
-  updateBtnText: {type: String, default: "Update"}
+  path: { type: String, required: true },
+  multiple: { type: Boolean, default: false },
+  endpointDisplayKey: { type: String, default: "name" },
+  endpointFilterKey: { type: String, default: "keywords" },
+  endpointResponseKey: { type: String, default: "id" },
+  additionalFilters: { type: Object, default: () => ({}) },
+  disableUpdate: { type: Boolean, default: false },
+  createBtnText: { type: String, default: "Select" },
+  updateBtnText: { type: String, default: "Update" }
 });
-
 const selectionModel = defineModel();
 const search = ref("");
 const searchDialog = ref(false);
 const searchDialogSelectedValue = ref(null);
-
 const hasSelection = computed(() => props.multiple ? selectionModel.value !== null && Array.isArray(selectionModel.value) && selectionModel.value.length > 0 : selectionModel.value !== null);
-
 const onAction = () => {
-  // Clone selectionModel into searchDialogSelectedValue (to modify freely inside the dialog)
-  searchDialogSelectedValue.value = selectionModel.value
-    ? Array.isArray(selectionModel.value)
-      ? [...selectionModel.value]
-      : selectionModel.value
-    : null;
+  searchDialogSelectedValue.value = selectionModel.value ? Array.isArray(selectionModel.value) ? [...selectionModel.value] : selectionModel.value : null;
   searchDialog.value = true;
 };
-
 const onDone = () => {
-  // Update selectionModel only when clicking "Done"
   selectionModel.value = searchDialogSelectedValue.value;
   searchDialog.value = false;
 };
-
 const onCancel = () => {
-  // Close the dialog without saving changes
   searchDialog.value = false;
 };
 </script>

package/dist/runtime/components/CrudApiSelectorField.vue.d.ts

@@ -0,0 +1,30 @@
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import("vue").DefineComponent<{}, {
+    path: string;
+    multiple: boolean;
+    endpointDisplayKey: string;
+    endpointFilterKey: string;
+    endpointResponseKey: string;
+    additionalFilters: Record<string, any>;
+    disableUpdate: boolean;
+    createBtnText: string;
+    updateBtnText: string;
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+type __VLS_Slots = {
+    items?: ((props: {
+        items: any;
+    }) => any) | undefined;
+} & {
+    action?: ((props: {
+        action: any;
+    }) => any) | undefined;
+} & {
+    dialogListTitle?: ((props: {
+        item: any;
+    }) => any) | undefined;
+};

package/dist/runtime/components/CrudConfirmDialog.vue

@@ -1,41 +1,40 @@
 <script setup>
-import { ref, defineProps, defineEmits } from 'vue';
+import { ref, defineProps, defineEmits } from "vue";
 defineProps({
   title: {
     type: String,
     default() {
-      return "Delete item"
+      return "Delete item";
     }
   },
   message: {
     type: String,
     default() {
-      return "Are you sure you want to delete this item?"
+      return "Are you sure you want to delete this item?";
     }
   },
   cancelText: {
     type: String,
     default() {
-      return "Cancel"
+      return "Cancel";
     }
   },
   confirmText: {
     type: String,
     default() {
-      return "OK"
+      return "OK";
     }
   }
-})
-const emit = defineEmits(['confirm']); // Declare the 'confirm' event
-const dialog = ref(false)
+});
+const emit = defineEmits(["confirm"]);
+const dialog = ref(false);
 const open = () => {
-  dialog.value = true
-}
+  dialog.value = true;
+};
 const handleConfirm = () => {
-  emit('confirm'); // Emit the 'confirm' event
+  emit("confirm");
   dialog.value = false;
 };
-
 </script>
 
 <template>
@@ -79,11 +78,6 @@ const handleConfirm = () => {
         </v-btn>
       </v-card-actions>
 
-
     </v-card>
   </v-dialog>
 </template>
-
-<style scoped>
-
-</style>

package/dist/runtime/components/CrudConfirmDialog.vue.d.ts

@@ -0,0 +1,18 @@
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & (new () => {
+    $slots: S;
+});
+declare const __VLS_component: import("vue").DefineComponent<{}, {
+    $emit: (event: "confirm", ...args: any[]) => void;
+    message: string;
+    title: string;
+    cancelText: string;
+    confirmText: string;
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+type __VLS_Slots = {
+    default?: ((props: {
+        click: any;
+    }) => any) | undefined;
+};

package/dist/runtime/components/CrudErrorDisplay.vue

@@ -1,6 +1,6 @@
 <script setup>
-import {computed} from 'vue';
-import {defineProps} from 'vue';
+import { computed } from "vue";
+import { defineProps } from "vue";
 const props = defineProps({
   errors: Object,
   errorKey: {
@@ -8,9 +8,9 @@ const props = defineProps({
     default: null
   }
 });
-
 const random = computed(() => Math.random());
 </script>
+
 <template>
   <v-alert
       v-if="errors != null && errors[errorKey ?? 'global'] != null"
@@ -26,4 +26,3 @@ const random = computed(() => Math.random());
     </div>
   </v-alert>
 </template>
-

package/dist/runtime/components/CrudErrorDisplay.vue.d.ts

@@ -0,0 +1,6 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    errorKey: string;
+    errors?: Record<string, any> | undefined;
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/CrudFilter.vue

@@ -1,121 +1,103 @@
 <script setup>
 import CrudListLoader from "./CrudListLoader.vue";
-import {ref, computed, watch, onMounted, onBeforeUnmount} from "vue";
-import {useDebounceFn} from "@vueuse/core";
+import { ref, computed, watch, onMounted, onBeforeUnmount } from "vue";
+import { useDebounceFn } from "@vueuse/core";
 import CrudAddressSearchField from "./CrudAddressSearchField.vue";
-import {useCrudConverters} from "../composables/useCrudConverters";
-import {useCrudApi} from "../composables/useCrudApi";
-
+import { useCrudConverters } from "../composables/useCrudConverters";
+import { useCrudApi } from "../composables/useCrudApi";
 const props = defineProps({
   filter: {
     type: Object,
-    required: true,
+    required: true
   },
   modelValue: null,
-  disabled: Boolean,
+  disabled: Boolean
 });
 const model = ref();
-const emit = defineEmits(['update:modelValue']);
-// Watch for changes in the prop and update the internal model
+const emit = defineEmits(["update:modelValue"]);
 watch(() => props.modelValue, (newValue) => {
-  model.value = newValue; // Sync internal model when the prop changes
+  model.value = newValue;
 });
-// Debounced emit function
-
 const filter = ref(props.filter);
-
-// Watch for changes in the filter prop and update the internal filter
 watch(() => props.filter, (newValue) => {
-  filter.value = newValue; // Sync internal filter when the prop changes
+  filter.value = newValue;
 });
-
 const searchDialogSelectedValue = ref(null);
 const search = ref(null);
 const searchDialog = ref(false);
 const datePickerValue = ref(null);
 const datePicker = ref(false);
-
 const emitUpdate = () => {
-  emit('update:modelValue', model.value);
-}
+  emit("update:modelValue", model.value);
+};
 const debouncedUpdate = useDebounceFn(emitUpdate, 700);
-
-
-const {inputDateForDb, outputDateFromDb, cloneDeep, localDateForDb} = useCrudConverters();
-
+const { inputDateForDb, outputDateFromDb, cloneDeep, localDateForDb } = useCrudConverters();
 const datePickerDisplayValue = computed(() => {
   if (!selectedValue.value || selectedValue.value.length !== 2) {
     return null;
   }
-  const startDate = outputDateFromDb(selectedValue.value[0], 'dd LLL');
-  const endDate = outputDateFromDb(selectedValue.value[1], 'dd LLL');
+  const startDate = outputDateFromDb(selectedValue.value[0], "dd LLL");
+  const endDate = outputDateFromDb(selectedValue.value[1], "dd LLL");
   return `${startDate} - ${endDate}`;
 });
-
 const selectedValue = computed({
   get() {
     if (model.value != null) {
-      if (props.filter.optionType === 'DateTimeRange') {
+      if (props.filter.optionType === "DateTimeRange") {
         if (!model.value || model.value.length !== 2) {
           return null;
         }
         return model.value;
       }
       return model.value;
-    } else if (props.filter.type === 'multiOption' || props.filter.type === 'multiSearch') {
+    } else if (props.filter.type === "multiOption" || props.filter.type === "multiSearch") {
       return [];
     } else {
       return null;
     }
   },
   set(val) {
-    if (props.filter.optionType === 'DateTimeRange' && val && val[0]) {
+    if (props.filter.optionType === "DateTimeRange" && val && val[0]) {
       let start = val[0];
       let end = val[1];
       model.value = [start, end];
     } else {
       model.value = val;
     }
-    if (props.filter.type === 'search' || props.filter.type === 'multiSearch' || props.filter.type === 'option' || props.filter.type === 'multiOption' || props.filter.type === 'multiOptionTree') {
+    if (props.filter.type === "search" || props.filter.type === "multiSearch" || props.filter.type === "option" || props.filter.type === "multiOption" || props.filter.type === "multiOptionTree") {
       emitUpdate();
     } else {
       debouncedUpdate();
     }
-  },
+  }
 });
-
 const {
   getItems: searchGetItems,
   items: searchListItems,
   listPending: searchLoading
 } = useCrudApi(props.filter.endpoint);
-
-
 async function getSearchListValue() {
   if (!selectedValue.value || selectedValue.value.length === 0) {
     return;
   }
-  const filters = {ids: selectedValue.value};
+  const filters = { ids: selectedValue.value };
   await searchGetItems(1, selectedValue.value.length, filters);
 }
-
 const validateDateRange = () => {
   datePicker.value = false;
-
   if (!datePickerValue.value || datePickerValue.value.length < 2) {
     return;
   }
   let startDate = localDateForDb(datePickerValue.value[0]);
   let endDate = localDateForDb(datePickerValue.value[datePickerValue.value.length - 1]);
   selectedValue.value = [startDate, endDate];
-}
-
+};
 const closeDatePicker = (clear = false) => {
   if (clear) {
     selectedValue.value = null;
   }
   datePicker.value = false;
-}
+};
 watch(searchDialog, (newValue, oldValue) => {
   if (!newValue && searchDialogSelectedValue.value != null) {
     selectedValue.value = cloneDeep(searchDialogSelectedValue.value);
@@ -126,22 +108,19 @@ watch(searchDialog, (newValue, oldValue) => {
     searchDialogSelectedValue.value = cloneDeep(model.value);
   }
 });
-
 onMounted(() => {
   model.value = props.modelValue;
-  if (props.filter.type === 'search' || props.filter.type === 'multiSearch') {
+  if (props.filter.type === "search" || props.filter.type === "multiSearch") {
     getSearchListValue();
   }
 });
-
 const displayForChip = (item) => {
-  var searchItem = searchListItems.value.find(inlineItem => inlineItem[props.filter.endpointResponseKey] === item.raw);
+  var searchItem = searchListItems.value.find((inlineItem) => inlineItem[props.filter.endpointResponseKey] === item.raw);
   if (!searchItem) {
     return "Loading";
   }
   return searchItem[props.filter.endpointDisplayKey] ?? "Loading";
-}
-
+};
 </script>
 
 <template>

package/dist/runtime/components/CrudFilter.vue.d.ts

@@ -0,0 +1,8 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    $emit: (event: "update:modelValue", ...args: any[]) => void;
+    filter: Record<string, any>;
+    disabled: boolean;
+    modelValue?: any;
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/runtime/components/CrudFilterList.vue

@@ -1,6 +1,5 @@
 <script setup>
 import CrudFilter from "../components/CrudFilter.vue";
-
 const model = defineModel();
 const props = defineProps({
   filters: {
@@ -10,7 +9,6 @@ const props = defineProps({
     }
   }
 });
-
 </script>
 
 <template>
@@ -20,7 +18,3 @@ const props = defineProps({
     </div>
   </div>
 </template>
-
-<style scoped>
-
-</style>

package/dist/runtime/components/CrudFilterList.vue.d.ts

@@ -0,0 +1,5 @@
+declare const _default: import("vue").DefineComponent<{}, {
+    filters: unknown[];
+    $props: any;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;