@vue-skuilder/common-ui 0.2.34 → 0.2.35

package/dist/admin/components/EChart.vue.d.ts

@@ -0,0 +1,14 @@
+import { ECElementEvent, EChartsCoreOption } from 'echarts/core';
+type __VLS_Props = {
+    option: EChartsCoreOption;
+    height: number;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: ECElementEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((event: ECElementEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    el: HTMLDivElement;
+}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=EChart.vue.d.ts.map

package/dist/admin/components/EChart.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EChart.vue.d.ts","sourceRoot":"","sources":["../../../src/admin/components/EChart.vue"],"names":[],"mappings":"AA8DA,OAAO,EAAa,KAAK,cAAc,EAAE,KAAK,iBAAiB,EAAoB,MAAM,cAAc,CAAC;AA2BxG,KAAK,WAAW,GAAG;IAAE,MAAM,EAAE,iBAAiB,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;;;;;;;;AAsEjE,wBASG"}

package/dist/admin/components/LearnerDiagnostics.vue.d.ts

@@ -1,9 +1,9 @@
 import { DiagnosticsInterpreters, LearnerDataset } from '@vue-skuilder/db/diagnostics';
 /**
- * One learner: sessions (list, then a session's detail), card history, and,
+ * One learner: sessions (list, then a session's detail), card history,
  * when the dataset carries the course's strategy docs, the pipeline with this
- * learner's run stats. Session timelines link into card history. Navigation is internal;
- * hosts that want URLs can compose the three views themselves.
+ * learner's run stats, and per-tag ELO. Session timelines link into card history. Navigation is internal;
+ * hosts that want URLs can compose the views themselves.
  */
 type __VLS_Props = {
     dataset: LearnerDataset;

package/dist/admin/components/LearnerDiagnostics.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LearnerDiagnostics.vue.d.ts","sourceRoot":"","sources":["../../../src/admin/components/LearnerDiagnostics.vue"],"names":[],"mappings":"AAwFA,OAAO,EAAoB,KAAK,uBAAuB,EAAE,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAMnH;;;;;GAKG;AACH,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,cAAc,CAAC;IACxB,YAAY,CAAC,EAAE,uBAAuB,CAAC;CACxC,CAAC;;AAmOF,wBAOG"}
+{"version":3,"file":"LearnerDiagnostics.vue.d.ts","sourceRoot":"","sources":["../../../src/admin/components/LearnerDiagnostics.vue"],"names":[],"mappings":"AA4FA,OAAO,EAAoB,KAAK,uBAAuB,EAAE,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAOnH;;;;;GAKG;AACH,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,cAAc,CAAC;IACxB,YAAY,CAAC,EAAE,uBAAuB,CAAC;CACxC,CAAC;;AA4PF,wBAOG"}

package/dist/admin/components/LearnerTagElo.vue.d.ts

@@ -0,0 +1,14 @@
+import { DiagnosticsInterpreters, LearnerDataset } from '@vue-skuilder/db/diagnostics';
+/**
+ * A learner's per-tag ELO: which skills they're rated high or low on, how
+ * much evidence each rating rests on, and how ratings moved. Filtered by tag
+ * batch: the namespace × role groups found on the tags, plus any the course
+ * names (`interpreters.tagBatches`).
+ */
+type __VLS_Props = {
+    dataset: LearnerDataset;
+    interpreters?: DiagnosticsInterpreters;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=LearnerTagElo.vue.d.ts.map

package/dist/admin/components/LearnerTagElo.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LearnerTagElo.vue.d.ts","sourceRoot":"","sources":["../../../src/admin/components/LearnerTagElo.vue"],"names":[],"mappings":"AAwjBA,OAAO,EAIL,KAAK,uBAAuB,EAE5B,KAAK,cAAc,EAGpB,MAAM,8BAA8B,CAAC;AAItC;;;;;GAKG;AACH,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,cAAc,CAAC;IACxB,YAAY,CAAC,EAAE,uBAAuB,CAAC;CACxC,CAAC;;AAo7BF,wBAOG"}

package/dist/admin/index.d.ts

@@ -20,4 +20,5 @@ export { default as LearnerCardHistory } from './components/LearnerCardHistory.v
 export { default as CardDossierDetail } from './components/CardDossierDetail.vue';
 export { default as RunDetail } from './components/RunDetail.vue';
 export { default as PipelineOverview } from './components/PipelineOverview.vue';
+export { default as LearnerTagElo } from './components/LearnerTagElo.vue';
 //# sourceMappingURL=index.d.ts.map

package/dist/admin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/admin/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,KAAK,kBAAkB,GACxB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,mCAAmC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/admin/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,KAAK,kBAAkB,GACxB,MAAM,iCAAiC,CAAC;AAEzC,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AACxF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAChF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,gCAAgC,CAAC"}

package/dist/components/CourseCardBrowser.vue.d.ts

@@ -297,7 +297,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             readonly required: false;
             readonly default: "";
         };
-    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("first" | "prev" | "next" | "last" | "set-page")[], "first" | "prev" | "next" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("next" | "prev" | "first" | "last" | "set-page")[], "next" | "prev" | "first" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         readonly pages: {
             readonly type: PropType<number[]>;
             readonly required: true;
@@ -317,9 +317,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             readonly default: "";
         };
     }>> & Readonly<{
-        onFirst?: ((...args: any[]) => any) | undefined;
-        onPrev?: ((...args: any[]) => any) | undefined;
         onNext?: ((...args: any[]) => any) | undefined;
+        onPrev?: ((...args: any[]) => any) | undefined;
+        onFirst?: ((...args: any[]) => any) | undefined;
         onLast?: ((...args: any[]) => any) | undefined;
         "onSet-page"?: ((...args: any[]) => any) | undefined;
     }>, {

package/dist/components/CourseInformation.vue.d.ts

@@ -341,7 +341,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
                 readonly required: false;
                 readonly default: "";
             };
-        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("first" | "prev" | "next" | "last" | "set-page")[], "first" | "prev" | "next" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("next" | "prev" | "first" | "last" | "set-page")[], "next" | "prev" | "first" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
             readonly pages: {
                 readonly type: PropType<number[]>;
                 readonly required: true;
@@ -361,9 +361,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
                 readonly default: "";
             };
         }>> & Readonly<{
-            onFirst?: ((...args: any[]) => any) | undefined;
-            onPrev?: ((...args: any[]) => any) | undefined;
             onNext?: ((...args: any[]) => any) | undefined;
+            onPrev?: ((...args: any[]) => any) | undefined;
+            onFirst?: ((...args: any[]) => any) | undefined;
             onLast?: ((...args: any[]) => any) | undefined;
             "onSet-page"?: ((...args: any[]) => any) | undefined;
         }>, {

package/dist/components/PaginatingToolbar.vue.d.ts

@@ -18,7 +18,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         readonly required: false;
         readonly default: "";
     };
-}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("first" | "prev" | "next" | "last" | "set-page")[], "first" | "prev" | "next" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("next" | "prev" | "first" | "last" | "set-page")[], "next" | "prev" | "first" | "last" | "set-page", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     readonly pages: {
         readonly type: PropType<number[]>;
         readonly required: true;
@@ -38,9 +38,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         readonly default: "";
     };
 }>> & Readonly<{
-    onFirst?: ((...args: any[]) => any) | undefined;
-    onPrev?: ((...args: any[]) => any) | undefined;
     onNext?: ((...args: any[]) => any) | undefined;
+    onPrev?: ((...args: any[]) => any) | undefined;
+    onFirst?: ((...args: any[]) => any) | undefined;
     onLast?: ((...args: any[]) => any) | undefined;
     "onSet-page"?: ((...args: any[]) => any) | undefined;
 }>, {

package/dist/components/SkMouseTrapToolTip.vue.d.ts

@@ -59,7 +59,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     showTooltip: boolean;
     position: "left" | "top" | "bottom" | "right";
     disabled: boolean;
-    highlightEffect: "none" | "glow" | "scale" | "border";
+    highlightEffect: "none" | "border" | "glow" | "scale";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;
 //# sourceMappingURL=SkMouseTrapToolTip.vue.d.ts.map

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.2.34",
+  "version": "0.2.35",
   "sideEffects": false,
   "main": "./dist/common-ui.umd.js",
   "module": "./dist/common-ui.es.js",
@@ -47,8 +47,9 @@
     "@highlightjs/vue-plugin": "^2.1.2",
     "@mdi/font": "^7.3.67",
     "@vojtechlanka/vue-tags-input": "^3",
-    "@vue-skuilder/common": "0.2.34",
-    "@vue-skuilder/db": "0.2.34",
+    "@vue-skuilder/common": "0.2.35",
+    "@vue-skuilder/db": "0.2.35",
+    "echarts": "6.1.0",
     "highlight.js": "^11.0.1",
     "marked": "^15.0.6",
     "moment": "^2.29.4",
@@ -84,5 +85,5 @@
     "vite-plugin-dts": "^4.5.3",
     "vitest": "^4.1.0"
   },
-  "stableVersion": "0.2.34"
+  "stableVersion": "0.2.35"
 }

package/src/admin/components/EChart.vue

@@ -0,0 +1,59 @@
+<template>
+  <div ref="el" :style="{ height: `${height}px`, width: '100%' }" />
+</template>
+
+<script setup lang="ts">
+import { onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue';
+import { init, use, type ECElementEvent, type EChartsCoreOption, type EChartsType } from 'echarts/core';
+import { LineChart, ScatterChart } from 'echarts/charts';
+import {
+  DataZoomComponent,
+  GridComponent,
+  LegendComponent,
+  MarkLineComponent,
+  TooltipComponent,
+} from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
+
+/**
+ * An ECharts canvas for the admin views. Registers only what they draw, so
+ * the admin bundle carries a fraction of ECharts. Options are replaced
+ * whole on change (`notMerge`): callers compute the full option.
+ */
+use([
+  LineChart,
+  ScatterChart,
+  DataZoomComponent,
+  GridComponent,
+  LegendComponent,
+  MarkLineComponent,
+  TooltipComponent,
+  CanvasRenderer,
+]);
+
+const props = defineProps<{ option: EChartsCoreOption; height: number }>();
+const emit = defineEmits<{ click: [event: ECElementEvent] }>();
+
+const el = ref<HTMLElement | null>(null);
+const chart = shallowRef<EChartsType | null>(null);
+let resize: ResizeObserver | null = null;
+
+onMounted(() => {
+  if (!el.value) return;
+  chart.value = init(el.value);
+  chart.value.setOption(props.option, { notMerge: true });
+  chart.value.on('click', (e) => emit('click', e as ECElementEvent));
+  resize = new ResizeObserver(() => chart.value?.resize());
+  resize.observe(el.value);
+});
+
+watch(
+  () => props.option,
+  (option) => chart.value?.setOption(option, { notMerge: true })
+);
+
+onBeforeUnmount(() => {
+  resize?.disconnect();
+  chart.value?.dispose();
+});
+</script>

package/src/admin/components/LearnerDiagnostics.vue

@@ -4,6 +4,7 @@
       <v-tab value="sessions">Sessions ({{ dataset.sessions.length }})</v-tab>
       <v-tab value="cards">Cards ({{ dataset.cardHistories.length }})</v-tab>
       <v-tab v-if="dataset.strategies" value="pipeline">Pipeline</v-tab>
+      <v-tab value="elo">ELO</v-tab>
     </v-tabs>
 
     <template v-if="tab === 'sessions'">
@@ -40,6 +41,8 @@
       :stats="pipelineStats"
       :stats-label="dataset.username"
     />
+
+    <learner-tag-elo v-else-if="tab === 'elo'" :dataset="dataset" :interpreters="interpreters" />
   </div>
 </template>
 
@@ -49,20 +52,21 @@ import { pipelineRunStats, type DiagnosticsInterpreters, type LearnerDataset } f
 import LearnerCardHistory from './LearnerCardHistory.vue';
 import LearnerSessionDetail from './LearnerSessionDetail.vue';
 import LearnerSessionList from './LearnerSessionList.vue';
+import LearnerTagElo from './LearnerTagElo.vue';
 import PipelineOverview from './PipelineOverview.vue';
 
 /**
- * One learner: sessions (list, then a session's detail), card history, and,
+ * One learner: sessions (list, then a session's detail), card history,
  * when the dataset carries the course's strategy docs, the pipeline with this
- * learner's run stats. Session timelines link into card history. Navigation is internal;
- * hosts that want URLs can compose the three views themselves.
+ * learner's run stats, and per-tag ELO. Session timelines link into card history. Navigation is internal;
+ * hosts that want URLs can compose the views themselves.
  */
 const props = defineProps<{
   dataset: LearnerDataset;
   interpreters?: DiagnosticsInterpreters;
 }>();
 
-const tab = ref<'sessions' | 'cards' | 'pipeline'>('sessions');
+const tab = ref<'sessions' | 'cards' | 'pipeline' | 'elo'>('sessions');
 const sessionId = ref<string | null>(null);
 const focusCard = ref<string | undefined>(undefined);
 const pipelineStats = computed(() => pipelineRunStats(props.dataset));