@paris-ias/list 1.0.137 → 1.0.139

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@paris-ias/list",
   "configKey": "list",
-  "version": "1.0.137",
+  "version": "1.0.139",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/actions/DenseItem.vue

@@ -0,0 +1,64 @@
+<template>
+  <v-row
+    class="my-2 highlight-on-hover"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col v-if="mdAndUp" cols="12" md="2">
+      <MiscAtomsImageContainer
+        :loading="isLoading"
+        :src="imageSrc"
+        :ratio="1 / 1"
+        cover
+      />
+    </v-col>
+    <v-col cols="12" :md="mdAndUp ? 10 : 12" class="px-4">
+      <v-skeleton-loader
+        v-if="isLoading"
+        :type="
+          [
+            'heading, subtitle, text@6',
+            'heading, subtitle, text@6',
+            'heading, subtitle, text@4',
+            'heading, subtitle, text@4',
+            'heading, subtitle, text@4',
+            'heading, subtitle, text@4',
+          ][['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')]
+        "
+      />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="text-body-1 mt-2">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
+</template>
+
+<script setup>
+import { useDisplay } from "vuetify"
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const { name, mdAndUp } = useDisplay()
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  index: { type: Number, required: false, default: 0 },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, required: false, default: false },
+})
+
+const isLoading = computed(() => rootStore.loading || props.loading)
+const imageSrc = computed(() => {
+  const img = props.item && props.item.image
+  if (!img) return "/default.png"
+  if (typeof img === "string") return img
+  if (img && img.url) return img
+  return "/default.png"
+})
+</script>
+
+<style></style>

package/dist/runtime/components/actions/ExpandedItem.vue

@@ -1,20 +1,23 @@
 <template>
-  <div>
-    {{ item.name }}
-  </div>
+  <v-card flat class="pa-4">
+    <v-skeleton-loader v-if="isLoading" type="heading, text@10" />
+    <template v-else>
+      <div class="text-h4 mb-2">{{ item.name }}</div>
+      <MDC v-if="item.description" :value="item.description" />
+    </template>
+  </v-card>
 </template>
 
-<script lang="ts" setup>
+<script setup>
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
 const props = defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
-</script>
 
-<style></style>
+const isLoading = computed(() => rootStore.loading || props.loading)
+</script>

package/dist/runtime/components/actions/RowsItem.vue

@@ -1,17 +1,63 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col v-if="mdAndUp" cols="12" md="3">
+      <MiscAtomsImageContainer
+        cover
+        :src="imageSrc"
+        :ratio="1 / 1"
+        :loading="isLoading"
+      />
+    </v-col>
+    <v-col cols="12" :md="mdAndUp ? 9 : 12" class="px-6">
+      <v-skeleton-loader
+        v-if="isLoading"
+        :type="
+          [
+            'heading, ossein, text@6, button',
+            'heading, ossein, text@6, button',
+            'heading, ossein, text@4, button',
+            'heading, ossein, text@4, button',
+            'heading, ossein, text@4, button',
+            'heading, ossein, text@4, button',
+          ][['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')]
+        "
+      />
+      <template v-else>
+        <div class="text-h5 text-wrap">{{ item.name }}</div>
+        <div v-if="item.summary" class="mt-2">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { useDisplay } from "vuetify"
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const { name, mdAndUp } = useDisplay()
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  index: { type: Number, required: false, default: 0 },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, required: false, default: false },
+})
+
+const isLoading = computed(() => rootStore.loading || props.loading)
+const imageSrc = computed(() => {
+  const img = props.item && props.item.image
+  if (!img) return "/default.png"
+  if (typeof img === "string") return img
+  if (img && img.url) return img
+  return "/default.png"
 })
 </script>
 

package/dist/runtime/components/actions/View.vue

@@ -1,22 +1,10 @@
 <template>
-  {{ item }}
+  <v-row no-gutters>
+    <slot />
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-import { useNuxtApp } from "#imports"
-
-const { $stores } = useNuxtApp()
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  loading: {
-    type: Boolean,
-    required: false,
-    default: false,
-  },
-})
-
-$stores.actions.loading = false
+defineProps({ loading: { type: Boolean, default: false } })
 </script>

package/dist/runtime/components/affiliation/DenseItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="my-2 highlight-on-hover"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-4">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@6" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="text-body-1 mt-1">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/affiliation/RowsItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-6">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@8, button" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="mt-2">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/apps/DenseItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="my-2 highlight-on-hover"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-4">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@6" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="text-body-1 mt-1">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/apps/RowsItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-6">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@8, button" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="mt-2">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/disciplines/DenseItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="my-2 highlight-on-hover"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-4">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@6" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="text-body-1 mt-1">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/disciplines/RowsItem.vue

@@ -1,18 +1,34 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-6">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@8, button" />
+      <template v-else>
+        <div class="text-h5">{{ item.name }}</div>
+        <div v-if="item.summary" class="mt-2">
+          <MDC :value="item.summary" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/events/DenseItem.vue

@@ -3,7 +3,7 @@
     <v-col v-if="mdAndUp" cols="1">
       <MiscAtomsDateStamp
         v-if="item.start"
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :date-start="item.start"
         :date-stop="item.stop"
         class="pr-6 mt-md-2"
@@ -12,7 +12,7 @@
     <v-col v-if="mdAndUp" cols="1">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.events.loading"
+        :loading="isLoading"
         :src="
           item && item.image && item.image.url ? item.image.url : '/default.png'
         "
@@ -67,12 +67,14 @@
 </template>
 
 <script setup>
-import { useI18n, useNuxtApp } from "#imports"
+import { useI18n, useNuxtApp, computed } from "#imports"
 import { useDisplay } from "vuetify"
+import { useRootStore } from "../../stores/root"
 const { $rootStore } = useNuxtApp()
 const { smAndDown, mdAndUp } = useDisplay()
 
 const { locale } = useI18n()
+const rootStore = useRootStore()
 const props = defineProps({
   item: {
     type: Object,
@@ -86,7 +88,14 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => props.loading)
 </script>
 <!-- <NuxtLink
     v-if="item && item.slug"

package/dist/runtime/components/events/RowsItem.vue

@@ -5,7 +5,7 @@
     <v-col cols="12" md="1">
       <MiscAtomsDateStamp
         v-if="item.start"
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :date-start="item.start"
         :date-stop="item.stop"
         class="pr-6 mt-md-2"
@@ -15,7 +15,7 @@
       <v-row no-gutters>
         <v-col cols="12" class="pr-lg-6">
           <v-skeleton-loader
-            v-if="rootStore.loading || $stores['events'].loading"
+            v-if="isLoading"
             :type="
               [
                 'heading, subtitle, text@6,subtitle, text,  ossein,  button, button',
@@ -61,7 +61,7 @@
       >
         <v-col cols="12">
           <v-skeleton-loader
-            v-if="rootStore.loading || $stores['events'].loading"
+            v-if="isLoading"
             :type="
               ['article, heading, text, heading, text, button, button'][
                 ['md'].indexOf(name || 'md')
@@ -78,7 +78,7 @@
     <v-col cols="12" md="4">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :src="item.image && item.image.url ? item.image : '/default.png'"
         :ratio="1 / 1"
       />
@@ -89,7 +89,7 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../stores/root"
-import { useNuxtApp } from "#imports"
+import { useNuxtApp, computed } from "#imports"
 
 const { name, mdAndDown, lgAndUp } = useDisplay()
 
@@ -108,5 +108,12 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>

package/dist/runtime/components/fellowships/DenseItem.vue

@@ -1,7 +1,9 @@
 <template>
   <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover">
     <v-col align-self="center" cols="8" class="text-h5 dense">
+      <v-skeleton-loader v-if="isLoading" type="heading" />
       <div
+        v-else
         v-html="
           $rootStore.search.length
             ? highlightAndTruncate(300, item.name, $rootStore.search.split(' '))
@@ -11,7 +13,9 @@
       <FellowshipsBadges :item="item" />
     </v-col>
     <v-col align-self="center" cols="4">
+      <v-skeleton-loader v-if="isLoading" type="chip@3" class="mt-2" />
       <MiscMoleculesChipContainer
+        v-else
         :items="[
           $t('list.filters.fellowships.fellowshipType.' + item.fellowshipType),
           ...(props.item && props.item.disciplines
@@ -26,6 +30,8 @@
 
 <script setup>
 import { useNuxtApp } from "#imports"
+import { useRootStore } from "../../stores/root"
+import { computed } from "#imports"
 const { $rootStore } = useNuxtApp()
 
 const props = defineProps({
@@ -42,5 +48,13 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const rootStore = useRootStore()
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>