@newschools/sdk 0.2.2 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/nuxt/src/runtime/components/EntityBentoGrid.vue +21 -7
  2. package/package.json +1 -1
package/nuxt/src/runtime/components/EntityBentoGrid.vue CHANGED
@@ -3,10 +3,10 @@
3
3
  <BentoGridItem
4
4
  v-for="(item, index) in items"
5
5
  :key="getItemKey(item, index)"
6
- :col-span="layout[index]?.colSpan"
7
- :row-span="layout[index]?.rowSpan"
8
- :col-start="layout[index]?.colStart"
9
- :row-start="layout[index]?.rowStart"
6
+ :col-span="getLayout(index)?.colSpan"
7
+ :row-span="getLayout(index)?.rowSpan"
8
+ :col-start="getLayout(index)?.colStart"
9
+ :row-start="getLayout(index)?.rowStart"
10
10
  >
11
11
  <!-- Allow custom item rendering via slot -->
12
12
  <slot name="item" :item="item" :index="index">
@@ -25,8 +25,8 @@
25
25
  </template>
26
26
 
27
27
  <script setup lang="ts">
28
- import { computed } from "vue";
29
28
  import { getBentoLayout } from "../internal/services/bento-layout.service";
29
+ import type { BentoItemConfig } from "../internal/services/bento-layout.service";
30
30
  import BentoGrid from "./BentoGrid.vue";
31
31
  import BentoGridItem from "./BentoGridItem.vue";
32
32
  import EntityCard from "./EntityCard.vue";
@@ -43,8 +43,22 @@ const props = withDefaults(defineProps<Props>(), {
43
43
  keyField: "id",
44
44
  });
45
45
 
46
- // Generate bento layout based on item count
47
- const layout = computed(() => getBentoLayout(props.items?.length || 0));
46
+ // Cache layout to avoid recalculating on every access
47
+ let layoutCache: BentoItemConfig[] = [];
48
+ let lastItemCount = 0;
49
+
50
+ // Get layout for specific index
51
+ function getLayout(index: number): BentoItemConfig | undefined {
52
+ const itemCount = props.items?.length || 0;
53
+
54
+ // Regenerate layout if item count changed
55
+ if (itemCount !== lastItemCount) {
56
+ layoutCache = getBentoLayout(itemCount);
57
+ lastItemCount = itemCount;
58
+ }
59
+
60
+ return layoutCache[index];
61
+ }
48
62
 
49
63
  // Helper to get unique key for v-for
50
64
  function getItemKey(item: any, index: number): string | number {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@newschools/sdk",
3
- "version": "0.2.2",
3
+ "version": "0.2.3",
4
4
  "description": "New Schools SDK - Multi-framework components and modules for integrating New Schools learning content",
5
5
  "type": "module",
6
6
  "main": "./nuxt/src/module.ts",