@icvdeveloper/common-module 0.0.67 → 0.0.69

package/dist/runtime/components/core/Modal.vue

@@ -1,113 +1,113 @@
-<script setup lang="ts">
-import { ref, toRefs, computed } from "vue";
-import { useClassBinding } from "../../composables/useClassBinding";
-import {
-  modalClassObj,
-  modalCompObj,
-  svgIconClassObj,
-} from "../../@types/components";
-
-type Props = {
-  visible?: boolean;
-  modalSize?: string;
-  noScroll?: boolean;
-  showClose?: boolean;
-  usePadding?: boolean;
-  classObject?: modalClassObj;
-};
-
-// classObject.components.svgIcon is not functioning properly and cannot be passed to svgIcon component
-const props = withDefaults(defineProps<Props>(), {
-  visible: false,
-  modalSize: "50",
-  noScroll: false,
-  showClose: true,
-  usePadding: true,
-  classObject: () => {
-    return {
-      container: "",
-      modalPositionContainer: "",
-      modalContainer: "",
-      modalCloseContainer: "",
-      modalButton: "",
-      modalButtonIcon: "",
-      components: ref<modalCompObj>({
-        svgIcon: ref<svgIconClassObj>({}),
-      }),
-    };
-  },
-});
-
-const emit = defineEmits(["trigger", "clicked"]);
-
-const { visible, modalSize, noScroll, showClose, usePadding, classObject } =
-  toRefs(props);
-const { classBinding } = useClassBinding();
-
-const modalClass = computed(() => {
-  const padding = usePadding.value ? "p-6" : "";
-  const classes = `relative w-full ${padding} m-auto flex-col flex rounded shadow bg-white modal-box`;
-  if (noScroll.value) {
-    return classes + ` max-h-full overflow-hidden`;
-  } else {
-    return classes + ` overflow-y-auto`;
-  }
-});
-
-const closeModal = () => {
-  emit("trigger");
-};
-
-const clicked = () => {
-  emit("clicked");
-};
-</script>
-
-<template>
-  <Transition>
-    <div
-      v-if="visible"
-      :class="
-        classBinding(
-          classObject,
-          'modalPositionContainer',
-          'fixed top-0 bottom-0 left-0 right-0 z-50 flex bg-smoke-light p-3'
-        )
-      "
-      @click="clicked"
-    >
-      <div
-        class="custom-max-width max-h-full"
-        :class="classBinding(classObject, 'modalContainer', modalClass)"
-        :style="'--maxw: ' + modalSize + '%;'"
-      >
-        <span
-          v-if="showClose"
-          :class="
-            classBinding(
-              classObject,
-              'modalCloseContainer',
-              'absolute top-0 bottom-0 right-0 z-30 max-h-1em'
-            )
-          "
-        >
-          <button
-            :class="classBinding(classObject, 'modalButton', 'p-3')"
-            @click="closeModal()"
-          >
-            <span :class="classBinding(classObject, 'modalButtonIcon', '')"
-              ><CommonSvgIcon icon="close" width=".7rem"
-            /></span>
-          </button>
-        </span>
-
-        <slot name="modal-title" />
-        <slot name="modal-body" />
-      </div>
-    </div>
-  </Transition>
-</template>
-
+<script setup lang="ts">
+import { ref, toRefs, computed } from "vue";
+import { useClassBinding } from "../../composables/useClassBinding";
+import {
+  modalClassObj,
+  modalCompObj,
+  svgIconClassObj,
+} from "../../@types/components";
+
+type Props = {
+  visible?: boolean;
+  modalSize?: string;
+  noScroll?: boolean;
+  showClose?: boolean;
+  usePadding?: boolean;
+  classObject?: modalClassObj;
+};
+
+// classObject.components.svgIcon is not functioning properly and cannot be passed to svgIcon component
+const props = withDefaults(defineProps<Props>(), {
+  visible: false,
+  modalSize: "50",
+  noScroll: false,
+  showClose: true,
+  usePadding: true,
+  classObject: () => {
+    return {
+      container: "",
+      modalPositionContainer: "",
+      modalContainer: "",
+      modalCloseContainer: "",
+      modalButton: "",
+      modalButtonIcon: "",
+      components: ref<modalCompObj>({
+        svgIcon: ref<svgIconClassObj>({}),
+      }),
+    };
+  },
+});
+
+const emit = defineEmits(["trigger", "clicked"]);
+
+const { visible, modalSize, noScroll, showClose, usePadding, classObject } =
+  toRefs(props);
+const { classBinding } = useClassBinding();
+
+const modalClass = computed(() => {
+  const padding = usePadding.value ? "p-6" : "";
+  const classes = `relative w-full ${padding} m-auto flex-col flex rounded shadow bg-white modal-box`;
+  if (noScroll.value) {
+    return classes + ` max-h-full overflow-hidden`;
+  } else {
+    return classes + ` overflow-y-auto`;
+  }
+});
+
+const closeModal = () => {
+  emit("trigger");
+};
+
+const clicked = () => {
+  emit("clicked");
+};
+</script>
+
+<template>
+  <Transition>
+    <div
+      v-if="visible"
+      :class="
+        classBinding(
+          classObject,
+          'modalPositionContainer',
+          'fixed top-0 bottom-0 left-0 right-0 z-50 flex bg-smoke-light p-3'
+        )
+      "
+      @click="clicked"
+    >
+      <div
+        class="custom-max-width max-h-full"
+        :class="classBinding(classObject, 'modalContainer', modalClass)"
+        :style="'--maxw: ' + modalSize + '%;'"
+      >
+        <span
+          v-if="showClose"
+          :class="
+            classBinding(
+              classObject,
+              'modalCloseContainer',
+              'absolute top-0 bottom-0 right-0 z-30 max-h-1em'
+            )
+          "
+        >
+          <button
+            :class="classBinding(classObject, 'modalButton', 'p-3')"
+            @click="closeModal()"
+          >
+            <span :class="classBinding(classObject, 'modalButtonIcon', '')"
+              ><CommonSvgIcon icon="close" width=".7rem"
+            /></span>
+          </button>
+        </span>
+
+        <slot name="modal-title" />
+        <slot name="modal-body" />
+      </div>
+    </div>
+  </Transition>
+</template>
+
 <style scoped>
 .max-h-1em {
   max-height: 1em;
@@ -130,4 +130,4 @@ const clicked = () => {
     max-width: var(--maxw);
   }
 }
-</style>
+</style>

package/dist/runtime/components/core/Navbar.vue

@@ -1,154 +1,154 @@
-<script lang="ts" setup>
-import { ref, toRefs, computed } from "vue";
-import { cloneDeep } from "lodash-es";
-import { useNavigationConfigStore } from "../../store/navigationConfig";
-import { useTemplateConfigsStore } from "../../store/templateConfigs";
-import { useNavigation } from "../../composables/useNavigation";
-
-type AdditionalItems = {
-  [index: number]: Array<{
-    name: string;
-    url: string;
-  }>;
-};
-
-// props
-type Props = {
-  additionalItems?: AdditionalItems;
-};
-
-const props = withDefaults(defineProps<Props>(), {
-  additionalItems: () => {
-    return {};
-  },
-});
-
-const { getEnabled } = useNavigationConfigStore();
-const { globalConfigValue } = useTemplateConfigsStore();
-
-// data
-const { additionalItems } = toRefs(props);
-const navItems = getEnabled();
-const htmlHeader = globalConfigValue("html_header");
-const open = ref<boolean>(false);
-
-// methods
-const { isExternalLink, formatLink } = useNavigation();
-const toggle = () => {
-  open.value = !open.value;
-};
-
-// computed
-const combinedNavItems = computed(() => {
-  const items = cloneDeep(navItems);
-
-  if (Object.keys(additionalItems.value).length > 0) {
-    // get index to insert items at.
-    Object.keys(additionalItems.value).forEach((index) => {
-      if (items[index] !== "undefined") {
-        for (let i = 0; i < additionalItems.value[index].length; i++) {
-          items.splice(index + i, 0, additionalItems.value[index][i]);
-        }
-      }
-    });
-  }
-
-  return items;
-});
-</script>
-
-<template>
-  <div>
-    <div class="flex flex-col">
-      <header class="min-w-full flex sticky pin-t z-50">
-        <!-- Standard Screen Nav -->
-        <div
-          class="hidden flex-1 flex-col mx-auto min-w-full"
-          :class="combinedNavItems.length < 7 ? 'md:flex' : 'lg:flex'"
-        >
-          <CommonDynamicHtml
-            v-if="htmlHeader.length"
-            class="flex-initial mb-0"
-            :template="htmlHeader"
-          ></CommonDynamicHtml>
-
-          <nav class="flex flex-1 min-h-8 content-center">
-            <ul class="list-reset h-full">
-              <li v-for="(item, index) in combinedNavItems" :key="index">
-                <nuxt-link
-                  v-if="!isExternalLink(item)"
-                  :to="formatLink(item)"
-                  exact
-                  class="inline-block"
-                >
-                  {{ item.label || item.name }}
-                </nuxt-link>
-                <a
-                  v-else
-                  :href="formatLink(item)"
-                  :target="isExternalLink(item) ? '_blank' : ''"
-                >
-                  {{ item.label || item.name }}
-                </a>
-              </li>
-            </ul>
-          </nav>
-        </div>
-
-        <!-- Mobile Nav -->
-        <div
-          class="flex flex-col content-start mx-auto min-w-full"
-          :class="combinedNavItems.length >= 7 ? 'lg:hidden' : 'md:hidden'"
-        >
-          <div class="mobile-nav flex flex-row justify-between">
-            <CommonDynamicHtml
-              v-if="htmlHeader.length"
-              class="flex-1"
-              :template="htmlHeader"
-            ></CommonDynamicHtml>
-
-            <div class="float-right p-2">
-              <button class="flex items-center px-3 py-2" @click="toggle">
-                <svg
-                  class="fill-current h-3 w-3"
-                  viewBox="0 0 20 20"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <title>Menu</title>
-                  <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
-                </svg>
-              </button>
-            </div>
-          </div>
-
-          <div class="flex">
-            <nav :class="open ? 'flex' : 'hidden'" class="w-full">
-              <ul class="flex-col self-center list-reset mx-auto">
-                <li v-for="(item, index) in combinedNavItems" :key="index">
-                  <nuxt-link
-                    v-if="!isExternalLink(item)"
-                    :to="formatLink(item)"
-                    exact
-                    class="block w-full text-center"
-                    @click.native="toggle"
-                  >
-                    {{ item.label || item.name }}
-                  </nuxt-link>
-
-                  <a
-                    v-if="isExternalLink(item)"
-                    :href="formatLink(item)"
-                    target="_blank"
-                    @click.native="toggle"
-                  >
-                    {{ item.label || item.name }}
-                  </a>
-                </li>
-              </ul>
-            </nav>
-          </div>
-        </div>
-      </header>
-    </div>
-  </div>
-</template>
+<script lang="ts" setup>
+import { ref, toRefs, computed } from "vue";
+import { cloneDeep } from "lodash-es";
+import { useNavigationConfigStore } from "../../store/navigationConfig";
+import { useTemplateConfigsStore } from "../../store/templateConfigs";
+import { useNavigation } from "../../composables/useNavigation";
+
+type AdditionalItems = {
+  [index: number]: Array<{
+    name: string;
+    url: string;
+  }>;
+};
+
+// props
+type Props = {
+  additionalItems?: AdditionalItems;
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  additionalItems: () => {
+    return {};
+  },
+});
+
+const { getEnabled } = useNavigationConfigStore();
+const { globalConfigValue } = useTemplateConfigsStore();
+
+// data
+const { additionalItems } = toRefs(props);
+const navItems = getEnabled();
+const htmlHeader = globalConfigValue("html_header");
+const open = ref<boolean>(false);
+
+// methods
+const { isExternalLink, formatLink } = useNavigation();
+const toggle = () => {
+  open.value = !open.value;
+};
+
+// computed
+const combinedNavItems = computed(() => {
+  const items = cloneDeep(navItems);
+
+  if (Object.keys(additionalItems.value).length > 0) {
+    // get index to insert items at.
+    Object.keys(additionalItems.value).forEach((index) => {
+      if (items[index] !== "undefined") {
+        for (let i = 0; i < additionalItems.value[index].length; i++) {
+          items.splice(index + i, 0, additionalItems.value[index][i]);
+        }
+      }
+    });
+  }
+
+  return items;
+});
+</script>
+
+<template>
+  <div>
+    <div class="flex flex-col">
+      <header class="min-w-full flex sticky pin-t z-50">
+        <!-- Standard Screen Nav -->
+        <div
+          class="hidden flex-1 flex-col mx-auto min-w-full"
+          :class="combinedNavItems.length < 7 ? 'md:flex' : 'lg:flex'"
+        >
+          <CommonDynamicHtml
+            v-if="htmlHeader.length"
+            class="flex-initial mb-0"
+            :template="htmlHeader"
+          ></CommonDynamicHtml>
+
+          <nav class="flex flex-1 min-h-8 content-center">
+            <ul class="list-reset h-full">
+              <li v-for="(item, index) in combinedNavItems" :key="index">
+                <nuxt-link
+                  v-if="!isExternalLink(item)"
+                  :to="formatLink(item)"
+                  exact
+                  class="inline-block"
+                >
+                  {{ item.label || item.name }}
+                </nuxt-link>
+                <a
+                  v-else
+                  :href="formatLink(item)"
+                  :target="isExternalLink(item) ? '_blank' : ''"
+                >
+                  {{ item.label || item.name }}
+                </a>
+              </li>
+            </ul>
+          </nav>
+        </div>
+
+        <!-- Mobile Nav -->
+        <div
+          class="flex flex-col content-start mx-auto min-w-full"
+          :class="combinedNavItems.length >= 7 ? 'lg:hidden' : 'md:hidden'"
+        >
+          <div class="mobile-nav flex flex-row justify-between">
+            <CommonDynamicHtml
+              v-if="htmlHeader.length"
+              class="flex-1"
+              :template="htmlHeader"
+            ></CommonDynamicHtml>
+
+            <div class="float-right p-2">
+              <button class="flex items-center px-3 py-2" @click="toggle">
+                <svg
+                  class="fill-current h-3 w-3"
+                  viewBox="0 0 20 20"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <title>Menu</title>
+                  <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
+                </svg>
+              </button>
+            </div>
+          </div>
+
+          <div class="flex">
+            <nav :class="open ? 'flex' : 'hidden'" class="w-full">
+              <ul class="flex-col self-center list-reset mx-auto">
+                <li v-for="(item, index) in combinedNavItems" :key="index">
+                  <nuxt-link
+                    v-if="!isExternalLink(item)"
+                    :to="formatLink(item)"
+                    exact
+                    class="block w-full text-center"
+                    @click.native="toggle"
+                  >
+                    {{ item.label || item.name }}
+                  </nuxt-link>
+
+                  <a
+                    v-if="isExternalLink(item)"
+                    :href="formatLink(item)"
+                    target="_blank"
+                    @click.native="toggle"
+                  >
+                    {{ item.label || item.name }}
+                  </a>
+                </li>
+              </ul>
+            </nav>
+          </div>
+        </div>
+      </header>
+    </div>
+  </div>
+</template>