@vue-skuilder/common-ui 0.2.35 → 0.2.36

package/dist/components/CourseCardBrowser.mjs

@@ -0,0 +1,175 @@
+import "../_virtual/_rolldown/runtime.mjs";
+import e from "../_virtual/_plugin-vue_export-helper.mjs";
+import t from "./CourseCardBrowser.vue_vue_type_script_lang.mjs";
+/* empty css                                                                   */
+import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, mergeProps as l, normalizeClass as u, openBlock as d, renderList as f, resolveComponent as p, toDisplayString as m, vShow as h, withCtx as g, withDirectives as _, withModifiers as v } from "vue";
+//#region src/components/CourseCardBrowser.vue
+var y = {
+	key: 0,
+	class: "d-flex justify-center align-center pa-6"
+}, b = { key: 1 }, x = {
+	key: 0,
+	class: "px-4 py-2 bg-blue-grey-lighten-5"
+}, S = {
+	key: 0,
+	class: "mt-4"
+}, C = { class: "mt-4" }, w = {
+	key: 0,
+	class: "ml-4"
+};
+function _sfc_render(e, t, T, E, D, O) {
+	let k = p("v-progress-circular"), A = p("paginating-toolbar"), j = p("v-list-item-title"), M = p("v-list-item-subtitle"), N = p("v-btn"), P = p("v-icon"), F = p("v-speed-dial"), I = p("v-list-item"), L = p("card-loader"), R = p("v-chip"), z = p("v-chip-group"), B = p("tags-input"), V = p("v-list"), H = p("v-card");
+	return d(), r(H, null, {
+		default: g(() => [e.updatePending ? (d(), a("div", y, [c(k, {
+			indeterminate: "",
+			color: "primary"
+		})])) : (d(), a("div", b, [
+			c(A, {
+				title: "Exercises",
+				page: e.page,
+				pages: e.pages,
+				subtitle: `(${e.questionCount})`,
+				onFirst: e.first,
+				onPrev: e.prev,
+				onNext: e.next,
+				onLast: e.last,
+				onSetPage: t[0] || (t[0] = (t) => e.setPage(t))
+			}, null, 8, [
+				"page",
+				"pages",
+				"subtitle",
+				"onFirst",
+				"onPrev",
+				"onNext",
+				"onLast"
+			]),
+			c(V, null, {
+				default: g(() => [(d(!0), a(n, null, f(e.cards, (p) => (d(), a(n, { key: p.card.cardID }, [c(I, {
+					class: u({
+						"bg-blue-grey-lighten-5": p.isOpen,
+						"elevation-4": p.isOpen
+					}),
+					density: "compact",
+					"data-cy": "course-card"
+				}, {
+					prepend: g(() => [o("div", null, [c(j, { class: u([{ "text-blue-grey-darken-1": p.isOpen }, "font-weight-medium"]) }, {
+						default: g(() => [s(m(e.cardPreview[p.card.cardID]), 1)]),
+						_: 2
+					}, 1032, ["class"]), c(M, null, {
+						default: g(() => [s(" ELO: " + m(e.cardElos[p.card.cardID]?.global?.score || "(unknown)"), 1)]),
+						_: 2
+					}, 1024)])]),
+					append: g(() => [c(F, {
+						modelValue: p.isOpen,
+						"onUpdate:modelValue": (e) => p.isOpen = e,
+						location: "left center",
+						transition: "slide-x-transition",
+						style: {
+							display: "flex",
+							"flex-direction": "row-reverse"
+						},
+						persistent: ""
+					}, {
+						activator: g(({ props: t }) => [c(N, l({ ref_for: !0 }, t, {
+							icon: p.isOpen ? "mdi-close" : "mdi-plus",
+							size: "small",
+							variant: "text",
+							onClick: (t) => e.clearSelections(p.card.cardID)
+						}), null, 16, ["icon", "onClick"])]),
+						default: g(() => [e.editMode === "full" ? (d(), r(N, {
+							key: "tags",
+							icon: "",
+							size: "small",
+							variant: e.internalEditMode === "tags" ? "elevated" : "outlined",
+							color: e.internalEditMode === "tags" ? "teal" : "teal-darken-3",
+							onClick: t[1] || (t[1] = v((t) => e.internalEditMode = "tags", ["stop"]))
+						}, {
+							default: g(() => [c(P, null, {
+								default: g(() => t[4] || (t[4] = [s("mdi-bookmark")])),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["variant", "color"])) : i("", !0), e.editMode === "full" ? (d(), r(N, {
+							key: "flag",
+							icon: "",
+							size: "small",
+							variant: e.internalEditMode === "flag" ? "elevated" : "outlined",
+							color: e.internalEditMode === "flag" ? "error" : "error-darken-3",
+							onClick: t[2] || (t[2] = v((t) => e.internalEditMode = "flag", ["stop"]))
+						}, {
+							default: g(() => [c(P, null, {
+								default: g(() => t[5] || (t[5] = [s("mdi-flag")])),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["variant", "color"])) : i("", !0)]),
+						_: 2
+					}, 1032, ["modelValue", "onUpdate:modelValue"])]),
+					_: 2
+				}, 1032, ["class"]), p.isOpen ? (d(), a("div", x, [
+					c(L, {
+						qualified_id: p.card,
+						"view-lookup": e.viewLookup,
+						class: "elevation-1"
+					}, null, 8, ["qualified_id", "view-lookup"]),
+					e.editMode === "readonly" && e.cardTags[p.card.cardID] ? (d(), a("div", S, [c(z, null, {
+						default: g(() => [(d(!0), a(n, null, f(e.cardTags[p.card.cardID], (e) => (d(), r(R, {
+							key: e.name,
+							size: "small",
+							color: "primary",
+							variant: "outlined"
+						}, {
+							default: g(() => [s(m(e.name), 1)]),
+							_: 2
+						}, 1024))), 128))]),
+						_: 2
+					}, 1024)])) : i("", !0),
+					_(c(B, {
+						"course-i-d": e.courseId,
+						"card-i-d": p.card.cardID,
+						class: "mt-4"
+					}, null, 8, ["course-i-d", "card-i-d"]), [[h, e.internalEditMode === "tags" && e.editMode === "full"]]),
+					_(o("div", C, [c(N, {
+						color: "error",
+						variant: "outlined",
+						onClick: (e) => p.delBtn = !0
+					}, {
+						default: g(() => t[6] || (t[6] = [s(" Delete this card ")])),
+						_: 2
+					}, 1032, ["onClick"]), p.delBtn ? (d(), a("span", w, [t[8] || (t[8] = o("span", { class: "mr-2" }, "Are you sure?", -1)), c(N, {
+						color: "error",
+						variant: "elevated",
+						onClick: (t) => e.deleteCard(p.card.cardID)
+					}, {
+						default: g(() => t[7] || (t[7] = [s(" Confirm ")])),
+						_: 2
+					}, 1032, ["onClick"])])) : i("", !0)], 512), [[h, e.internalEditMode === "flag" && e.editMode === "full"]])
+				])) : i("", !0)], 64))), 128))]),
+				_: 1
+			}),
+			c(A, {
+				class: "elevation-0",
+				page: e.page,
+				pages: e.pages,
+				onFirst: e.first,
+				onPrev: e.prev,
+				onNext: e.next,
+				onLast: e.last,
+				onSetPage: t[3] || (t[3] = (t) => e.setPage(t))
+			}, null, 8, [
+				"page",
+				"pages",
+				"onFirst",
+				"onPrev",
+				"onNext",
+				"onLast"
+			])
+		]))]),
+		_: 1
+	});
+}
+var T = /* @__PURE__ */ e(t, [["render", _sfc_render], ["__scopeId", "data-v-5ecc9d21"]]);
+//#endregion
+export { T as default };
+
+//# sourceMappingURL=CourseCardBrowser.mjs.map

package/dist/components/CourseCardBrowser.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CourseCardBrowser.mjs","names":[],"sources":["../../src/components/CourseCardBrowser.vue"],"sourcesContent":["<template>\n  <v-card>\n    <div v-if=\"updatePending\" class=\"d-flex justify-center align-center pa-6\">\n      <v-progress-circular indeterminate color=\"primary\" />\n    </div>\n    <div v-else>\n      <paginating-toolbar\n        title=\"Exercises\"\n        :page=\"page\"\n        :pages=\"pages\"\n        :subtitle=\"`(${questionCount})`\"\n        @first=\"first\"\n        @prev=\"prev\"\n        @next=\"next\"\n        @last=\"last\"\n        @set-page=\"(n) => setPage(n)\"\n      />\n\n      <v-list>\n        <template v-for=\"c in cards\" :key=\"c.card.cardID\">\n          <v-list-item\n            :class=\"{\n              'bg-blue-grey-lighten-5': c.isOpen,\n              'elevation-4': c.isOpen,\n            }\"\n            density=\"compact\"\n            data-cy=\"course-card\"\n          >\n            <template #prepend>\n              <div>\n                <v-list-item-title :class=\"{ 'text-blue-grey-darken-1': c.isOpen }\" class=\"font-weight-medium\">\n                  {{ cardPreview[c.card.cardID] }}\n                </v-list-item-title>\n                <v-list-item-subtitle>\n                  ELO: {{ cardElos[c.card.cardID]?.global?.score || '(unknown)' }}\n                </v-list-item-subtitle>\n              </div>\n            </template>\n\n            <template #append>\n              <v-speed-dial\n                v-model=\"c.isOpen\"\n                location=\"left center\"\n                transition=\"slide-x-transition\"\n                style=\"display: flex; flex-direction: row-reverse\"\n                persistent\n              >\n                <template #activator=\"{ props }\">\n                  <v-btn\n                    v-bind=\"props\"\n                    :icon=\"c.isOpen ? 'mdi-close' : 'mdi-plus'\"\n                    size=\"small\"\n                    variant=\"text\"\n                    @click=\"clearSelections(c.card.cardID)\"\n                  />\n                </template>\n\n                <v-btn\n                  v-if=\"editMode === 'full'\"\n                  key=\"tags\"\n                  icon\n                  size=\"small\"\n                  :variant=\"internalEditMode !== 'tags' ? 'outlined' : 'elevated'\"\n                  :color=\"internalEditMode === 'tags' ? 'teal' : 'teal-darken-3'\"\n                  @click.stop=\"internalEditMode = 'tags'\"\n                >\n                  <v-icon>mdi-bookmark</v-icon>\n                </v-btn>\n\n                <v-btn\n                  v-if=\"editMode === 'full'\"\n                  key=\"flag\"\n                  icon\n                  size=\"small\"\n                  :variant=\"internalEditMode !== 'flag' ? 'outlined' : 'elevated'\"\n                  :color=\"internalEditMode === 'flag' ? 'error' : 'error-darken-3'\"\n                  @click.stop=\"internalEditMode = 'flag'\"\n                >\n                  <v-icon>mdi-flag</v-icon>\n                </v-btn>\n              </v-speed-dial>\n            </template>\n          </v-list-item>\n\n          <div v-if=\"c.isOpen\" class=\"px-4 py-2 bg-blue-grey-lighten-5\">\n            <card-loader :qualified_id=\"c.card\" :view-lookup=\"viewLookup\" class=\"elevation-1\" />\n\n            <!-- Tags display for readonly mode -->\n            <div v-if=\"editMode === 'readonly' && cardTags[c.card.cardID]\" class=\"mt-4\">\n              <v-chip-group>\n                <v-chip\n                  v-for=\"tag in cardTags[c.card.cardID]\"\n                  :key=\"tag.name\"\n                  size=\"small\"\n                  color=\"primary\"\n                  variant=\"outlined\"\n                >\n                  {{ tag.name }}\n                </v-chip>\n              </v-chip-group>\n            </div>\n\n            <tags-input\n              v-show=\"internalEditMode === 'tags' && editMode === 'full'\"\n              :course-i-d=\"courseId\"\n              :card-i-d=\"c.card.cardID\"\n              class=\"mt-4\"\n            />\n\n            <div v-show=\"internalEditMode === 'flag' && editMode === 'full'\" class=\"mt-4\">\n              <v-btn color=\"error\" variant=\"outlined\" @click=\"c.delBtn = true\"> Delete this card </v-btn>\n              <span v-if=\"c.delBtn\" class=\"ml-4\">\n                <span class=\"mr-2\">Are you sure?</span>\n                <v-btn color=\"error\" variant=\"elevated\" @click=\"deleteCard(c.card.cardID)\"> Confirm </v-btn>\n              </span>\n            </div>\n          </div>\n        </template>\n      </v-list>\n\n      <paginating-toolbar\n        class=\"elevation-0\"\n        :page=\"page\"\n        :pages=\"pages\"\n        @first=\"first\"\n        @prev=\"prev\"\n        @next=\"next\"\n        @last=\"last\"\n        @set-page=\"(n) => setPage(n)\"\n      />\n    </div>\n  </v-card>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, PropType } from 'vue';\nimport { displayableDataToViewData, Status, CourseElo } from '@vue-skuilder/common';\nimport {\n  getDataLayer,\n  CourseDBInterface,\n  CardData,\n  DisplayableData,\n  Tag,\n  TagStub,\n  QualifiedCardID,\n} from '@vue-skuilder/db';\n// local imports\nimport TagsInput from './TagsInput.vue';\nimport PaginatingToolbar from './PaginatingToolbar.vue';\nimport { ViewComponent } from '../composables/Displayable';\nimport CardLoader from './cardRendering/CardLoader.vue';\nimport { alertUser } from './SnackbarService';\n\n// Legacy isConstructor function removed - no longer needed for Vue 3 components\n\nexport default defineComponent({\n  name: 'CourseCardBrowser',\n\n  components: {\n    CardLoader,\n    TagsInput,\n    PaginatingToolbar,\n  },\n\n  props: {\n    courseId: {\n      type: String,\n      required: true,\n    },\n    tagId: {\n      type: String,\n      required: false,\n      default: '',\n    },\n    viewLookupFunction: {\n      type: Function,\n      required: true,\n      default: () => {\n        console.warn('No viewLookupFunction provided to CourseCardBrowser');\n        return null;\n      },\n    },\n    editMode: {\n      type: String as PropType<'none' | 'readonly' | 'full'>,\n      required: false,\n      default: 'full',\n    },\n  },\n\n  data() {\n    return {\n      courseDB: null as CourseDBInterface | null,\n      page: 1,\n      pages: [] as number[],\n      cards: [] as { card: QualifiedCardID; isOpen: boolean; delBtn: boolean }[],\n      cardData: {} as { [card: string]: string[] },\n      cardPreview: {} as { [card: string]: string },\n      cardElos: {} as Record<string, CourseElo>,\n      cardTags: {} as Record<string, TagStub[]>,\n      internalEditMode: 'none' as 'tags' | 'flag' | 'none',\n      delBtn: false,\n      updatePending: true,\n      userIsRegistered: false,\n      questionCount: 0,\n      tags: [] as Tag[],\n      viewLookup: this.viewLookupFunction,\n    };\n  },\n\n  async created() {\n    try {\n      this.courseDB = getDataLayer().getCourseDB(this.courseId);\n\n      if (this.tagId) {\n        this.questionCount = (await this.courseDB.getTag(this.tagId)).taggedCards.length;\n      } else {\n        this.questionCount = (await this.courseDB!.getCourseInfo()).cardCount;\n      }\n\n      for (let i = 1; (i - 1) * 25 < this.questionCount; i++) {\n        this.pages.push(i);\n      }\n\n      await this.populateTableData();\n    } catch (error) {\n      console.error('Error initializing CourseCardBrowser:', error);\n    } finally {\n      this.updatePending = false;\n    }\n  },\n\n  methods: {\n    idQualify(id: string): string {\n      const delimiters = id.includes('-');\n      if (delimiters) {\n        return id;\n      } else {\n        return `${this.courseId}-${id}`;\n      }\n    },\n\n    idToQualifiedObject(id: string): QualifiedCardID {\n      const delimiters = id.includes('-');\n      if (delimiters) {\n        const parts = id.split('-');\n        return {\n          courseID: parts[0],\n          cardID: parts[1],\n        };\n      } else {\n        return {\n          courseID: this.courseId,\n          cardID: id,\n        };\n      }\n    },\n\n    first() {\n      this.page = 1;\n      this.populateTableData();\n    },\n    prev() {\n      this.page--;\n      this.populateTableData();\n    },\n    next() {\n      this.page++;\n      this.populateTableData();\n    },\n    last() {\n      this.page = this.pages.length;\n      this.populateTableData();\n    },\n    setPage(n: number) {\n      this.page = n;\n      this.populateTableData();\n    },\n    async loadCardTags(cardIds: string[]) {\n      try {\n        // Use the proper API method to get tags for each card\n        await Promise.all(\n          cardIds.map(async (cardId) => {\n            const appliedTags = await this.courseDB!.getAppliedTags(cardId);\n\n            // Convert to TagStub format\n            this.cardTags[cardId] = appliedTags.rows.map((row) => ({\n              name: row.value.name,\n              snippet: row.value.snippet,\n              count: row.value.count,\n            }));\n          })\n        );\n      } catch (error) {\n        console.error('Error loading card tags:', error);\n      }\n    },\n    clearSelections(exception: string = '') {\n      this.cards.forEach((card) => {\n        if (card.card.cardID !== exception) {\n          card.isOpen = false;\n        }\n      });\n      this.internalEditMode = 'none';\n      this.delBtn = false;\n    },\n    async deleteCard(cID: string) {\n      console.log(`Deleting card ${cID}`);\n      const res = await this.courseDB!.removeCard(cID);\n      if (res.ok) {\n        this.cards = this.cards.filter((card) => card.card.cardID != cID);\n        this.clearSelections();\n      } else {\n        console.error(`Failed to delete card:\\n\\n${JSON.stringify(res)}`);\n        alertUser({\n          text: 'Failed to delete card',\n          status: Status.error,\n        });\n      }\n    },\n    async populateTableData() {\n      this.updatePending = true;\n      if (this.tagId) {\n        const tag = await this.courseDB!.getTag(this.tagId);\n        this.cards = tag.taggedCards.map((c) => {\n          return { card: { cardID: c, courseID: this.courseId }, isOpen: false, delBtn: false };\n        });\n      } else {\n        this.cards = (await this.courseDB!.getCardsByELO(0, 25)).map((c) => {\n          return {\n            card: c,\n            isOpen: false,\n            delBtn: false,\n          };\n        });\n      }\n\n      const toRemove: string[] = [];\n      const hydratedCardData = (\n        await this.courseDB!.getCourseDocs<CardData>(\n          this.cards.map((c) => c.card.cardID),\n          {\n            include_docs: true,\n          }\n        )\n      ).rows\n        .filter((r) => {\n          if (r.doc) {\n            return true;\n          } else {\n            console.error(`Card ${r.id}.doc not found.\\ncard: ${JSON.stringify(r)}`);\n            // toRemove.push(r.id);\n            // if (this.tagId) {\n            //   this.courseDB!.removeTagFromCard(r.id, this.tagId);\n            // }\n            return false;\n          }\n        })\n        .map((r) => r.doc!);\n\n      this.cards = this.cards.filter((c) => !toRemove.includes(c.card.cardID));\n\n      hydratedCardData.forEach((c) => {\n        if (c && c.id_displayable_data) {\n          this.cardData[c._id] = c.id_displayable_data;\n        }\n      });\n\n      try {\n        await Promise.all(\n          this.cards.map(async (c) => {\n            const _cardID: string = c.card.cardID;\n\n            const tmpCardData = hydratedCardData.find((c) => c._id == _cardID);\n            if (!tmpCardData || !tmpCardData.id_displayable_data) {\n              console.error(`No valid data found for card ${_cardID}`);\n              return;\n            }\n            const tmpView: ViewComponent = this.viewLookupFunction(\n              tmpCardData.id_view || 'default.question.BlanksCard.FillInView'\n            );\n\n            const tmpDataDocs = tmpCardData.id_displayable_data.map((id) => {\n              return this.courseDB!.getCourseDoc<DisplayableData>(id, {\n                attachments: false,\n                binary: true,\n              });\n            });\n\n            const allDocs = await Promise.all(tmpDataDocs);\n            await Promise.all(\n              allDocs.map((doc) => {\n                const tmpData = [];\n                tmpData.unshift(displayableDataToViewData(doc));\n\n                // Vue 3: Use component name for preview (legacy constructor code removed)\n                this.cardPreview[c.card.cardID] = tmpView.name ? tmpView.name : 'Unknown';\n              })\n            );\n          })\n        );\n\n        // Load ELO data for all cards\n        const cardIds = this.cards.map((c) => c.card.cardID);\n        const eloData = await this.courseDB!.getCardEloData(cardIds); // general case lookup\n\n        // Store ELO data indexed by card ID\n        cardIds.forEach((cardId, index) => {\n          this.cardElos[cardId] = eloData[index];\n        });\n\n        // Load tags for each card\n        await this.loadCardTags(cardIds);\n      } catch (error) {\n        console.error('Error populating table data:', error);\n      } finally {\n        this.updatePending = false;\n        this.$forceUpdate();\n      }\n    },\n  },\n});\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter, .component-fade-leave-to\n/* .component-fade-leave-active below version 2.1.8 */ {\n  opacity: 0;\n}\n\n.component-scale-enter-active,\n.component-scale-leave-active {\n  max-height: auto;\n  transform: scale(1, 1);\n  transform-origin: top;\n  transition:\n    transform 0.3s ease,\n    max-height 0.3s ease;\n}\n.component-scale-enter,\n.component-fade-leave-to {\n  max-height: 0px;\n  transform: scale(1, 0);\n  overflow: hidden;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/CourseCardBrowser.vue_vue_type_script_lang.mjs

@@ -0,0 +1,173 @@
+import "../_virtual/_rolldown/runtime.mjs";
+import { alertUser as e } from "./SnackbarService.mjs";
+import t from "./PaginatingToolbar.mjs";
+import n from "./cardRendering/CardLoader.mjs";
+import r from "./TagsInput.mjs";
+import { defineComponent as i } from "vue";
+import { Status as a, displayableDataToViewData as o } from "@vue-skuilder/common";
+import { getDataLayer as s } from "@vue-skuilder/db";
+//#region src/components/CourseCardBrowser.vue?vue&type=script&lang.ts
+var c = i({
+	name: "CourseCardBrowser",
+	components: {
+		CardLoader: n,
+		TagsInput: r,
+		PaginatingToolbar: t
+	},
+	props: {
+		courseId: {
+			type: String,
+			required: !0
+		},
+		tagId: {
+			type: String,
+			required: !1,
+			default: ""
+		},
+		viewLookupFunction: {
+			type: Function,
+			required: !0,
+			default: () => (console.warn("No viewLookupFunction provided to CourseCardBrowser"), null)
+		},
+		editMode: {
+			type: String,
+			required: !1,
+			default: "full"
+		}
+	},
+	data() {
+		return {
+			courseDB: null,
+			page: 1,
+			pages: [],
+			cards: [],
+			cardData: {},
+			cardPreview: {},
+			cardElos: {},
+			cardTags: {},
+			internalEditMode: "none",
+			delBtn: !1,
+			updatePending: !0,
+			userIsRegistered: !1,
+			questionCount: 0,
+			tags: [],
+			viewLookup: this.viewLookupFunction
+		};
+	},
+	async created() {
+		try {
+			this.courseDB = s().getCourseDB(this.courseId), this.tagId ? this.questionCount = (await this.courseDB.getTag(this.tagId)).taggedCards.length : this.questionCount = (await this.courseDB.getCourseInfo()).cardCount;
+			for (let e = 1; (e - 1) * 25 < this.questionCount; e++) this.pages.push(e);
+			await this.populateTableData();
+		} catch (e) {
+			console.error("Error initializing CourseCardBrowser:", e);
+		} finally {
+			this.updatePending = !1;
+		}
+	},
+	methods: {
+		idQualify(e) {
+			return e.includes("-") ? e : `${this.courseId}-${e}`;
+		},
+		idToQualifiedObject(e) {
+			if (e.includes("-")) {
+				let t = e.split("-");
+				return {
+					courseID: t[0],
+					cardID: t[1]
+				};
+			} else return {
+				courseID: this.courseId,
+				cardID: e
+			};
+		},
+		first() {
+			this.page = 1, this.populateTableData();
+		},
+		prev() {
+			this.page--, this.populateTableData();
+		},
+		next() {
+			this.page++, this.populateTableData();
+		},
+		last() {
+			this.page = this.pages.length, this.populateTableData();
+		},
+		setPage(e) {
+			this.page = e, this.populateTableData();
+		},
+		async loadCardTags(e) {
+			try {
+				await Promise.all(e.map(async (e) => {
+					let t = await this.courseDB.getAppliedTags(e);
+					this.cardTags[e] = t.rows.map((e) => ({
+						name: e.value.name,
+						snippet: e.value.snippet,
+						count: e.value.count
+					}));
+				}));
+			} catch (e) {
+				console.error("Error loading card tags:", e);
+			}
+		},
+		clearSelections(e = "") {
+			this.cards.forEach((t) => {
+				t.card.cardID !== e && (t.isOpen = !1);
+			}), this.internalEditMode = "none", this.delBtn = !1;
+		},
+		async deleteCard(t) {
+			console.log(`Deleting card ${t}`);
+			let n = await this.courseDB.removeCard(t);
+			n.ok ? (this.cards = this.cards.filter((e) => e.card.cardID != t), this.clearSelections()) : (console.error(`Failed to delete card:\n\n${JSON.stringify(n)}`), e({
+				text: "Failed to delete card",
+				status: a.error
+			}));
+		},
+		async populateTableData() {
+			this.updatePending = !0, this.tagId ? this.cards = (await this.courseDB.getTag(this.tagId)).taggedCards.map((e) => ({
+				card: {
+					cardID: e,
+					courseID: this.courseId
+				},
+				isOpen: !1,
+				delBtn: !1
+			})) : this.cards = (await this.courseDB.getCardsByELO(0, 25)).map((e) => ({
+				card: e,
+				isOpen: !1,
+				delBtn: !1
+			}));
+			let e = [], t = (await this.courseDB.getCourseDocs(this.cards.map((e) => e.card.cardID), { include_docs: !0 })).rows.filter((e) => e.doc ? !0 : (console.error(`Card ${e.id}.doc not found.\ncard: ${JSON.stringify(e)}`), !1)).map((e) => e.doc);
+			this.cards = this.cards.filter((t) => !e.includes(t.card.cardID)), t.forEach((e) => {
+				e && e.id_displayable_data && (this.cardData[e._id] = e.id_displayable_data);
+			});
+			try {
+				await Promise.all(this.cards.map(async (e) => {
+					let n = e.card.cardID, r = t.find((e) => e._id == n);
+					if (!r || !r.id_displayable_data) {
+						console.error(`No valid data found for card ${n}`);
+						return;
+					}
+					let i = this.viewLookupFunction(r.id_view || "default.question.BlanksCard.FillInView"), a = r.id_displayable_data.map((e) => this.courseDB.getCourseDoc(e, {
+						attachments: !1,
+						binary: !0
+					})), s = await Promise.all(a);
+					await Promise.all(s.map((t) => {
+						[].unshift(o(t)), this.cardPreview[e.card.cardID] = i.name ? i.name : "Unknown";
+					}));
+				}));
+				let e = this.cards.map((e) => e.card.cardID), n = await this.courseDB.getCardEloData(e);
+				e.forEach((e, t) => {
+					this.cardElos[e] = n[t];
+				}), await this.loadCardTags(e);
+			} catch (e) {
+				console.error("Error populating table data:", e);
+			} finally {
+				this.updatePending = !1, this.$forceUpdate();
+			}
+		}
+	}
+});
+//#endregion
+export { c as default };
+
+//# sourceMappingURL=CourseCardBrowser.vue_vue_type_script_lang.mjs.map

package/dist/components/CourseCardBrowser.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CourseCardBrowser.vue_vue_type_script_lang.mjs","names":[],"sources":["../../src/components/CourseCardBrowser.vue"],"sourcesContent":["<template>\n  <v-card>\n    <div v-if=\"updatePending\" class=\"d-flex justify-center align-center pa-6\">\n      <v-progress-circular indeterminate color=\"primary\" />\n    </div>\n    <div v-else>\n      <paginating-toolbar\n        title=\"Exercises\"\n        :page=\"page\"\n        :pages=\"pages\"\n        :subtitle=\"`(${questionCount})`\"\n        @first=\"first\"\n        @prev=\"prev\"\n        @next=\"next\"\n        @last=\"last\"\n        @set-page=\"(n) => setPage(n)\"\n      />\n\n      <v-list>\n        <template v-for=\"c in cards\" :key=\"c.card.cardID\">\n          <v-list-item\n            :class=\"{\n              'bg-blue-grey-lighten-5': c.isOpen,\n              'elevation-4': c.isOpen,\n            }\"\n            density=\"compact\"\n            data-cy=\"course-card\"\n          >\n            <template #prepend>\n              <div>\n                <v-list-item-title :class=\"{ 'text-blue-grey-darken-1': c.isOpen }\" class=\"font-weight-medium\">\n                  {{ cardPreview[c.card.cardID] }}\n                </v-list-item-title>\n                <v-list-item-subtitle>\n                  ELO: {{ cardElos[c.card.cardID]?.global?.score || '(unknown)' }}\n                </v-list-item-subtitle>\n              </div>\n            </template>\n\n            <template #append>\n              <v-speed-dial\n                v-model=\"c.isOpen\"\n                location=\"left center\"\n                transition=\"slide-x-transition\"\n                style=\"display: flex; flex-direction: row-reverse\"\n                persistent\n              >\n                <template #activator=\"{ props }\">\n                  <v-btn\n                    v-bind=\"props\"\n                    :icon=\"c.isOpen ? 'mdi-close' : 'mdi-plus'\"\n                    size=\"small\"\n                    variant=\"text\"\n                    @click=\"clearSelections(c.card.cardID)\"\n                  />\n                </template>\n\n                <v-btn\n                  v-if=\"editMode === 'full'\"\n                  key=\"tags\"\n                  icon\n                  size=\"small\"\n                  :variant=\"internalEditMode !== 'tags' ? 'outlined' : 'elevated'\"\n                  :color=\"internalEditMode === 'tags' ? 'teal' : 'teal-darken-3'\"\n                  @click.stop=\"internalEditMode = 'tags'\"\n                >\n                  <v-icon>mdi-bookmark</v-icon>\n                </v-btn>\n\n                <v-btn\n                  v-if=\"editMode === 'full'\"\n                  key=\"flag\"\n                  icon\n                  size=\"small\"\n                  :variant=\"internalEditMode !== 'flag' ? 'outlined' : 'elevated'\"\n                  :color=\"internalEditMode === 'flag' ? 'error' : 'error-darken-3'\"\n                  @click.stop=\"internalEditMode = 'flag'\"\n                >\n                  <v-icon>mdi-flag</v-icon>\n                </v-btn>\n              </v-speed-dial>\n            </template>\n          </v-list-item>\n\n          <div v-if=\"c.isOpen\" class=\"px-4 py-2 bg-blue-grey-lighten-5\">\n            <card-loader :qualified_id=\"c.card\" :view-lookup=\"viewLookup\" class=\"elevation-1\" />\n\n            <!-- Tags display for readonly mode -->\n            <div v-if=\"editMode === 'readonly' && cardTags[c.card.cardID]\" class=\"mt-4\">\n              <v-chip-group>\n                <v-chip\n                  v-for=\"tag in cardTags[c.card.cardID]\"\n                  :key=\"tag.name\"\n                  size=\"small\"\n                  color=\"primary\"\n                  variant=\"outlined\"\n                >\n                  {{ tag.name }}\n                </v-chip>\n              </v-chip-group>\n            </div>\n\n            <tags-input\n              v-show=\"internalEditMode === 'tags' && editMode === 'full'\"\n              :course-i-d=\"courseId\"\n              :card-i-d=\"c.card.cardID\"\n              class=\"mt-4\"\n            />\n\n            <div v-show=\"internalEditMode === 'flag' && editMode === 'full'\" class=\"mt-4\">\n              <v-btn color=\"error\" variant=\"outlined\" @click=\"c.delBtn = true\"> Delete this card </v-btn>\n              <span v-if=\"c.delBtn\" class=\"ml-4\">\n                <span class=\"mr-2\">Are you sure?</span>\n                <v-btn color=\"error\" variant=\"elevated\" @click=\"deleteCard(c.card.cardID)\"> Confirm </v-btn>\n              </span>\n            </div>\n          </div>\n        </template>\n      </v-list>\n\n      <paginating-toolbar\n        class=\"elevation-0\"\n        :page=\"page\"\n        :pages=\"pages\"\n        @first=\"first\"\n        @prev=\"prev\"\n        @next=\"next\"\n        @last=\"last\"\n        @set-page=\"(n) => setPage(n)\"\n      />\n    </div>\n  </v-card>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, PropType } from 'vue';\nimport { displayableDataToViewData, Status, CourseElo } from '@vue-skuilder/common';\nimport {\n  getDataLayer,\n  CourseDBInterface,\n  CardData,\n  DisplayableData,\n  Tag,\n  TagStub,\n  QualifiedCardID,\n} from '@vue-skuilder/db';\n// local imports\nimport TagsInput from './TagsInput.vue';\nimport PaginatingToolbar from './PaginatingToolbar.vue';\nimport { ViewComponent } from '../composables/Displayable';\nimport CardLoader from './cardRendering/CardLoader.vue';\nimport { alertUser } from './SnackbarService';\n\n// Legacy isConstructor function removed - no longer needed for Vue 3 components\n\nexport default defineComponent({\n  name: 'CourseCardBrowser',\n\n  components: {\n    CardLoader,\n    TagsInput,\n    PaginatingToolbar,\n  },\n\n  props: {\n    courseId: {\n      type: String,\n      required: true,\n    },\n    tagId: {\n      type: String,\n      required: false,\n      default: '',\n    },\n    viewLookupFunction: {\n      type: Function,\n      required: true,\n      default: () => {\n        console.warn('No viewLookupFunction provided to CourseCardBrowser');\n        return null;\n      },\n    },\n    editMode: {\n      type: String as PropType<'none' | 'readonly' | 'full'>,\n      required: false,\n      default: 'full',\n    },\n  },\n\n  data() {\n    return {\n      courseDB: null as CourseDBInterface | null,\n      page: 1,\n      pages: [] as number[],\n      cards: [] as { card: QualifiedCardID; isOpen: boolean; delBtn: boolean }[],\n      cardData: {} as { [card: string]: string[] },\n      cardPreview: {} as { [card: string]: string },\n      cardElos: {} as Record<string, CourseElo>,\n      cardTags: {} as Record<string, TagStub[]>,\n      internalEditMode: 'none' as 'tags' | 'flag' | 'none',\n      delBtn: false,\n      updatePending: true,\n      userIsRegistered: false,\n      questionCount: 0,\n      tags: [] as Tag[],\n      viewLookup: this.viewLookupFunction,\n    };\n  },\n\n  async created() {\n    try {\n      this.courseDB = getDataLayer().getCourseDB(this.courseId);\n\n      if (this.tagId) {\n        this.questionCount = (await this.courseDB.getTag(this.tagId)).taggedCards.length;\n      } else {\n        this.questionCount = (await this.courseDB!.getCourseInfo()).cardCount;\n      }\n\n      for (let i = 1; (i - 1) * 25 < this.questionCount; i++) {\n        this.pages.push(i);\n      }\n\n      await this.populateTableData();\n    } catch (error) {\n      console.error('Error initializing CourseCardBrowser:', error);\n    } finally {\n      this.updatePending = false;\n    }\n  },\n\n  methods: {\n    idQualify(id: string): string {\n      const delimiters = id.includes('-');\n      if (delimiters) {\n        return id;\n      } else {\n        return `${this.courseId}-${id}`;\n      }\n    },\n\n    idToQualifiedObject(id: string): QualifiedCardID {\n      const delimiters = id.includes('-');\n      if (delimiters) {\n        const parts = id.split('-');\n        return {\n          courseID: parts[0],\n          cardID: parts[1],\n        };\n      } else {\n        return {\n          courseID: this.courseId,\n          cardID: id,\n        };\n      }\n    },\n\n    first() {\n      this.page = 1;\n      this.populateTableData();\n    },\n    prev() {\n      this.page--;\n      this.populateTableData();\n    },\n    next() {\n      this.page++;\n      this.populateTableData();\n    },\n    last() {\n      this.page = this.pages.length;\n      this.populateTableData();\n    },\n    setPage(n: number) {\n      this.page = n;\n      this.populateTableData();\n    },\n    async loadCardTags(cardIds: string[]) {\n      try {\n        // Use the proper API method to get tags for each card\n        await Promise.all(\n          cardIds.map(async (cardId) => {\n            const appliedTags = await this.courseDB!.getAppliedTags(cardId);\n\n            // Convert to TagStub format\n            this.cardTags[cardId] = appliedTags.rows.map((row) => ({\n              name: row.value.name,\n              snippet: row.value.snippet,\n              count: row.value.count,\n            }));\n          })\n        );\n      } catch (error) {\n        console.error('Error loading card tags:', error);\n      }\n    },\n    clearSelections(exception: string = '') {\n      this.cards.forEach((card) => {\n        if (card.card.cardID !== exception) {\n          card.isOpen = false;\n        }\n      });\n      this.internalEditMode = 'none';\n      this.delBtn = false;\n    },\n    async deleteCard(cID: string) {\n      console.log(`Deleting card ${cID}`);\n      const res = await this.courseDB!.removeCard(cID);\n      if (res.ok) {\n        this.cards = this.cards.filter((card) => card.card.cardID != cID);\n        this.clearSelections();\n      } else {\n        console.error(`Failed to delete card:\\n\\n${JSON.stringify(res)}`);\n        alertUser({\n          text: 'Failed to delete card',\n          status: Status.error,\n        });\n      }\n    },\n    async populateTableData() {\n      this.updatePending = true;\n      if (this.tagId) {\n        const tag = await this.courseDB!.getTag(this.tagId);\n        this.cards = tag.taggedCards.map((c) => {\n          return { card: { cardID: c, courseID: this.courseId }, isOpen: false, delBtn: false };\n        });\n      } else {\n        this.cards = (await this.courseDB!.getCardsByELO(0, 25)).map((c) => {\n          return {\n            card: c,\n            isOpen: false,\n            delBtn: false,\n          };\n        });\n      }\n\n      const toRemove: string[] = [];\n      const hydratedCardData = (\n        await this.courseDB!.getCourseDocs<CardData>(\n          this.cards.map((c) => c.card.cardID),\n          {\n            include_docs: true,\n          }\n        )\n      ).rows\n        .filter((r) => {\n          if (r.doc) {\n            return true;\n          } else {\n            console.error(`Card ${r.id}.doc not found.\\ncard: ${JSON.stringify(r)}`);\n            // toRemove.push(r.id);\n            // if (this.tagId) {\n            //   this.courseDB!.removeTagFromCard(r.id, this.tagId);\n            // }\n            return false;\n          }\n        })\n        .map((r) => r.doc!);\n\n      this.cards = this.cards.filter((c) => !toRemove.includes(c.card.cardID));\n\n      hydratedCardData.forEach((c) => {\n        if (c && c.id_displayable_data) {\n          this.cardData[c._id] = c.id_displayable_data;\n        }\n      });\n\n      try {\n        await Promise.all(\n          this.cards.map(async (c) => {\n            const _cardID: string = c.card.cardID;\n\n            const tmpCardData = hydratedCardData.find((c) => c._id == _cardID);\n            if (!tmpCardData || !tmpCardData.id_displayable_data) {\n              console.error(`No valid data found for card ${_cardID}`);\n              return;\n            }\n            const tmpView: ViewComponent = this.viewLookupFunction(\n              tmpCardData.id_view || 'default.question.BlanksCard.FillInView'\n            );\n\n            const tmpDataDocs = tmpCardData.id_displayable_data.map((id) => {\n              return this.courseDB!.getCourseDoc<DisplayableData>(id, {\n                attachments: false,\n                binary: true,\n              });\n            });\n\n            const allDocs = await Promise.all(tmpDataDocs);\n            await Promise.all(\n              allDocs.map((doc) => {\n                const tmpData = [];\n                tmpData.unshift(displayableDataToViewData(doc));\n\n                // Vue 3: Use component name for preview (legacy constructor code removed)\n                this.cardPreview[c.card.cardID] = tmpView.name ? tmpView.name : 'Unknown';\n              })\n            );\n          })\n        );\n\n        // Load ELO data for all cards\n        const cardIds = this.cards.map((c) => c.card.cardID);\n        const eloData = await this.courseDB!.getCardEloData(cardIds); // general case lookup\n\n        // Store ELO data indexed by card ID\n        cardIds.forEach((cardId, index) => {\n          this.cardElos[cardId] = eloData[index];\n        });\n\n        // Load tags for each card\n        await this.loadCardTags(cardIds);\n      } catch (error) {\n        console.error('Error populating table data:', error);\n      } finally {\n        this.updatePending = false;\n        this.$forceUpdate();\n      }\n    },\n  },\n});\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter, .component-fade-leave-to\n/* .component-fade-leave-active below version 2.1.8 */ {\n  opacity: 0;\n}\n\n.component-scale-enter-active,\n.component-scale-leave-active {\n  max-height: auto;\n  transform: scale(1, 1);\n  transform-origin: top;\n  transition:\n    transform 0.3s ease,\n    max-height 0.3s ease;\n}\n.component-scale-enter,\n.component-fade-leave-to {\n  max-height: 0px;\n  transform: scale(1, 0);\n  overflow: hidden;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/CourseInformation.mjs

@@ -0,0 +1,132 @@
+import "../_virtual/_rolldown/runtime.mjs";
+import e from "../_virtual/_plugin-vue_export-helper.mjs";
+import t from "./CourseInformation.vue_vue_type_script_lang.mjs";
+/* empty css                                                                   */
+import { Fragment as n, Transition as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, openBlock as u, renderList as d, renderSlot as f, resolveComponent as p, toDisplayString as m, withCtx as h } from "vue";
+//#region src/components/CourseInformation.vue
+var g = { key: 0 }, _ = { class: "text-h4 mb-2" }, v = { class: "text-body-2" }, y = { key: 0 }, b = { key: 1 };
+function _sfc_render(e, t, x, S, C, w) {
+	let T = p("v-btn"), E = p("v-icon"), D = p("v-toolbar-title"), O = p("v-toolbar-items"), k = p("v-toolbar"), A = p("v-chip"), j = p("v-card-text"), M = p("v-card"), N = p("course-card-browser");
+	return e.updatePending ? a("", !0) : (u(), o("div", g, [
+		f(e.$slots, "header", {
+			courseConfig: e.courseConfig,
+			courseId: e.courseId
+		}, () => [s("h1", _, m(e.courseConfig.name), 1)], !0),
+		s("p", v, m(e.courseConfig.description), 1),
+		f(e.$slots, "actions", {
+			userIsRegistered: e.userIsRegistered,
+			courseId: e.courseId,
+			editMode: e.editMode,
+			register: e.register,
+			drop: e.drop
+		}, () => [l(r, {
+			name: "component-fade",
+			mode: "out-in"
+		}, {
+			default: h(() => [e.userIsRegistered ? (u(), o("div", y, [
+				l(T, {
+					color: "success",
+					"data-cy": "focused-study-session-btn",
+					class: "me-2"
+				}, {
+					default: h(() => t[0] || (t[0] = [c("Start ad study session")])),
+					_: 1
+				}),
+				e.editMode === "full" ? (u(), i(T, {
+					key: 0,
+					"data-cy": "add-content-btn",
+					color: "indigo-lighten-1",
+					class: "me-2"
+				}, {
+					default: h(() => [l(E, { start: "" }, {
+						default: h(() => t[1] || (t[1] = [c("mdi-plus")])),
+						_: 1
+					}), t[2] || (t[2] = c(" Add content "))]),
+					_: 1
+				})) : a("", !0),
+				e.editMode === "full" ? (u(), i(T, {
+					key: 1,
+					color: "green-darken-2",
+					title: "Rank course content for difficulty",
+					class: "me-2"
+				}, {
+					default: h(() => [l(E, { start: "" }, {
+						default: h(() => t[3] || (t[3] = [c("mdi-format-list-numbered")])),
+						_: 1
+					}), t[4] || (t[4] = c(" Arrange "))]),
+					_: 1
+				})) : a("", !0),
+				e.editMode === "full" ? (u(), i(T, {
+					key: 2,
+					color: "error",
+					size: "small",
+					variant: "outlined",
+					onClick: e.drop
+				}, {
+					default: h(() => t[5] || (t[5] = [c(" Drop this course ")])),
+					_: 1
+				}, 8, ["onClick"])) : a("", !0)
+			])) : (u(), o("div", b, [l(T, {
+				"data-cy": "register-btn",
+				color: "primary",
+				class: "me-2",
+				onClick: e.register
+			}, {
+				default: h(() => t[6] || (t[6] = [c("Register")])),
+				_: 1
+			}, 8, ["onClick"]), l(T, {
+				variant: "outlined",
+				color: "primary",
+				class: "me-2"
+			}, {
+				default: h(() => t[7] || (t[7] = [c("Start a trial study session")])),
+				_: 1
+			})]))]),
+			_: 1
+		})], !0),
+		f(e.$slots, "additional-content", {}, void 0, !0),
+		l(M, { class: "my-2" }, {
+			default: h(() => [l(k, { density: "compact" }, {
+				default: h(() => [l(D, null, {
+					default: h(() => t[8] || (t[8] = [c("Tags")])),
+					_: 1
+				}), l(O, null, {
+					default: h(() => [l(T, { variant: "text" }, {
+						default: h(() => [c("(" + m(e.tags.length) + ")", 1)]),
+						_: 1
+					})]),
+					_: 1
+				})]),
+				_: 1
+			}), l(j, null, {
+				default: h(() => [(u(!0), o(n, null, d(e.tags, (t, n) => (u(), o("span", { key: n }, [f(e.$slots, "tag-link", {
+					tag: t,
+					courseId: e.courseId
+				}, () => [l(A, {
+					variant: "tonal",
+					class: "me-2 mb-2"
+				}, {
+					default: h(() => [c(m(t.name), 1)]),
+					_: 2
+				}, 1024)], !0)]))), 128))]),
+				_: 3
+			})]),
+			_: 3
+		}),
+		l(N, {
+			class: "my-3",
+			"course-id": e.courseId,
+			"view-lookup-function": e.viewLookupFunction,
+			"edit-mode": e.editMode
+		}, null, 8, [
+			"course-id",
+			"view-lookup-function",
+			"edit-mode"
+		])
+	]));
+}
+var x = /* @__PURE__ */ e(t, [["render", _sfc_render], ["__scopeId", "data-v-38e9efe1"]]);
+//#endregion
+export { x as default };
+
+//# sourceMappingURL=CourseInformation.mjs.map

package/dist/components/CourseInformation.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CourseInformation.mjs","names":[],"sources":["../../src/components/CourseInformation.vue"],"sourcesContent":["<template>\n  <div v-if=\"!updatePending\">\n    <slot name=\"header\" :course-config=\"courseConfig\" :course-id=\"courseId\">\n      <h1 class=\"text-h4 mb-2\">{{ courseConfig.name }}</h1>\n    </slot>\n\n    <p class=\"text-body-2\">\n      {{ courseConfig.description }}\n    </p>\n\n    <slot\n      name=\"actions\"\n      :user-is-registered=\"userIsRegistered\"\n      :course-id=\"courseId\"\n      :edit-mode=\"editMode\"\n      :register=\"register\"\n      :drop=\"drop\"\n    >\n      <!-- Default fallback content if no actions slot provided -->\n      <transition name=\"component-fade\" mode=\"out-in\">\n        <div v-if=\"userIsRegistered\">\n          <v-btn color=\"success\" data-cy=\"focused-study-session-btn\" class=\"me-2\">Start ad study session</v-btn>\n          <v-btn v-if=\"editMode === 'full'\" data-cy=\"add-content-btn\" color=\"indigo-lighten-1\" class=\"me-2\">\n            <v-icon start>mdi-plus</v-icon>\n            Add content\n          </v-btn>\n          <v-btn\n            v-if=\"editMode === 'full'\"\n            color=\"green-darken-2\"\n            title=\"Rank course content for difficulty\"\n            class=\"me-2\"\n          >\n            <v-icon start>mdi-format-list-numbered</v-icon>\n            Arrange\n          </v-btn>\n          <v-btn v-if=\"editMode === 'full'\" color=\"error\" size=\"small\" variant=\"outlined\" @click=\"drop\">\n            Drop this course\n          </v-btn>\n        </div>\n        <div v-else>\n          <v-btn data-cy=\"register-btn\" color=\"primary\" class=\"me-2\" @click=\"register\">Register</v-btn>\n          <v-btn variant=\"outlined\" color=\"primary\" class=\"me-2\">Start a trial study session</v-btn>\n        </div>\n      </transition>\n    </slot>\n\n    <slot name=\"additional-content\"></slot>\n    \n    <v-card class=\"my-2\">\n      <v-toolbar density=\"compact\">\n        <v-toolbar-title>Tags</v-toolbar-title>\n        <v-toolbar-items>\n          <v-btn variant=\"text\">({{ tags.length }})</v-btn>\n        </v-toolbar-items>\n      </v-toolbar>\n      <v-card-text>\n        <span v-for=\"(tag, i) in tags\" :key=\"i\">\n          <slot name=\"tag-link\" :tag=\"tag\" :course-id=\"courseId\">\n            <v-chip variant=\"tonal\" class=\"me-2 mb-2\">\n              {{ tag.name }}\n            </v-chip>\n          </slot>\n        </span>\n      </v-card-text>\n    </v-card>\n\n    <course-card-browser\n      class=\"my-3\"\n      :course-id=\"courseId\"\n      :view-lookup-function=\"viewLookupFunction\"\n      :edit-mode=\"editMode\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, PropType } from 'vue';\n// import { MidiConfig } from '@vue-skuilder/courseware'; // Removed to break circular dependency\nimport CourseCardBrowser from './CourseCardBrowser.vue';\nimport { log } from '@vue-skuilder/common';\nimport { CourseDBInterface, Tag, UserDBInterface, getDataLayer } from '@vue-skuilder/db';\nimport { CourseConfig } from '@vue-skuilder/common';\nimport { getCurrentUser } from '../stores/useAuthStore';\n\nexport default defineComponent({\n  name: 'CourseInformation',\n\n  components: {\n    // MidiConfig, // Removed to break circular dependency\n    CourseCardBrowser,\n  },\n\n  props: {\n    courseId: {\n      type: String as PropType<string>,\n      required: true,\n    },\n    viewLookupFunction: {\n      type: Function,\n      required: false,\n      default: (x: unknown) => {\n        console.warn('No viewLookupFunction provided to CourseInformation');\n        return null;\n      },\n    },\n    editMode: {\n      type: String as PropType<'none' | 'readonly' | 'full'>,\n      required: false,\n      default: 'full',\n    },\n  },\n\n  data() {\n    return {\n      courseDB: null as CourseDBInterface | null,\n      nameRules: [\n        (value: string): string | boolean => {\n          const max = 30;\n          return value.length > max ? `Course name must be ${max} characters or less` : true;\n        },\n      ],\n      updatePending: true,\n      courseConfig: {} as CourseConfig,\n      userIsRegistered: false,\n      tags: [] as Tag[],\n      user: null as UserDBInterface | null,\n    };\n  },\n\n  computed: {\n    // isPianoCourse removed - piano-specific logic should be in wrapper component\n  },\n\n  async created() {\n    this.courseDB = getDataLayer().getCourseDB(this.courseId);\n    this.user = await getCurrentUser();\n\n    const userCourses = await this.user.getCourseRegistrationsDoc();\n\n    // Admin users always have edit access (for studio mode)\n    if (this.user.getUsername() === 'admin') {\n      this.userIsRegistered = true;\n    } else {\n      this.userIsRegistered =\n        userCourses.courses.filter((c) => {\n          return c.courseID === this.courseId && (c.status === 'active' || c.status === undefined);\n        }).length === 1;\n    }\n\n    this.courseConfig = (await this.courseDB!.getCourseConfig())!;\n    this.tags = (await this.courseDB!.getCourseTagStubs()).rows.map((r) => r.doc!);\n    this.updatePending = false;\n  },\n\n  methods: {\n    async register() {\n      log(`Registering for ${this.courseId}`);\n      const res = await this.user!.registerForCourse(this.courseId);\n      if (res.ok) {\n        this.userIsRegistered = true;\n      }\n    },\n\n    async drop() {\n      log(`Dropping course ${this.courseId}`);\n      const res = await this.user!.dropCourse(this.courseId);\n      if (res.ok) {\n        this.userIsRegistered = false;\n      }\n    },\n  },\n});\n</script>\n\n<style scoped>\n.component-fade-enter-active,\n.component-fade-leave-active {\n  transition: opacity 0.5s ease;\n}\n.component-fade-enter,\n.component-fade-leave-to {\n  opacity: 0;\n}\n\n.component-scale-enter-active,\n.component-scale-leave-active {\n  max-height: auto;\n  transform: scale(1, 1);\n  transform-origin: top;\n  transition:\n    transform 0.3s ease,\n    max-height 0.3s ease;\n}\n.component-scale-enter,\n.component-fade-leave-to {\n  max-height: 0px;\n  transform: scale(1, 0);\n  overflow: hidden;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/CourseInformation.vue_vue_type_script_lang.mjs

@@ -0,0 +1,56 @@
+import "../_virtual/_rolldown/runtime.mjs";
+import { getCurrentUser as e } from "../stores/useAuthStore.mjs";
+import t from "./CourseCardBrowser.mjs";
+import { defineComponent as n } from "vue";
+import { log as r } from "@vue-skuilder/common";
+import { getDataLayer as i } from "@vue-skuilder/db";
+//#region src/components/CourseInformation.vue?vue&type=script&lang.ts
+var a = n({
+	name: "CourseInformation",
+	components: { CourseCardBrowser: t },
+	props: {
+		courseId: {
+			type: String,
+			required: !0
+		},
+		viewLookupFunction: {
+			type: Function,
+			required: !1,
+			default: (e) => (console.warn("No viewLookupFunction provided to CourseInformation"), null)
+		},
+		editMode: {
+			type: String,
+			required: !1,
+			default: "full"
+		}
+	},
+	data() {
+		return {
+			courseDB: null,
+			nameRules: [(e) => e.length > 30 ? "Course name must be 30 characters or less" : !0],
+			updatePending: !0,
+			courseConfig: {},
+			userIsRegistered: !1,
+			tags: [],
+			user: null
+		};
+	},
+	computed: {},
+	async created() {
+		this.courseDB = i().getCourseDB(this.courseId), this.user = await e();
+		let t = await this.user.getCourseRegistrationsDoc();
+		this.user.getUsername() === "admin" ? this.userIsRegistered = !0 : this.userIsRegistered = t.courses.filter((e) => e.courseID === this.courseId && (e.status === "active" || e.status === void 0)).length === 1, this.courseConfig = await this.courseDB.getCourseConfig(), this.tags = (await this.courseDB.getCourseTagStubs()).rows.map((e) => e.doc), this.updatePending = !1;
+	},
+	methods: {
+		async register() {
+			r(`Registering for ${this.courseId}`), (await this.user.registerForCourse(this.courseId)).ok && (this.userIsRegistered = !0);
+		},
+		async drop() {
+			r(`Dropping course ${this.courseId}`), (await this.user.dropCourse(this.courseId)).ok && (this.userIsRegistered = !1);
+		}
+	}
+});
+//#endregion
+export { a as default };
+
+//# sourceMappingURL=CourseInformation.vue_vue_type_script_lang.mjs.map