@1024pix/epreuves-components 0.5.0 → 0.6.0

package/dist/components/llm-compare-messages.ce.js.js

@@ -1,5 +1,5 @@
-import { d as m, c as a, o as n, a as s, t, F as i, r as d, b as r, _ as p, e as u } from "../_plugin-vue_export-helper-rf--DmCY.js";
-import { p as f, L as l } from "../LLMMessage.ce-CklO8QgD.js";
+import { d as m, c as a, o as n, a as s, t, F as i, r as d, b as r, _ as p, e as u } from "../_plugin-vue_export-helper-BDNE3C4u.js";
+import { p as f, L as l } from "../LLMMessage.ce-CHtRURwX.js";
 const g = {
   class: "header",
   "aria-hidden": "true"

package/dist/components/llm-messages.ce.js.js

@@ -1,28 +1,28 @@
-import { d as m, u as i, w as p, c as o, o as s, F as g, r as d, f, _ as u, e as _ } from "../_plugin-vue_export-helper-rf--DmCY.js";
-import { p as h, L as w } from "../LLMMessage.ce-CklO8QgD.js";
-const y = {
+import { d as m, u as i, w as p, c as o, o as e, F as d, r as u, i as g, _ as f, e as h } from "../_plugin-vue_export-helper-BDNE3C4u.js";
+import { p as _, L as v } from "../LLMMessage.ce-CHtRURwX.js";
+const w = {
   class: "llm-messages",
   "aria-live": "polite"
-}, L = /* @__PURE__ */ m({
+}, y = /* @__PURE__ */ m({
   __name: "LLMMessages.ce",
   props: {
     messages: { type: Array }
   },
   setup(t) {
     const a = t;
-    h();
-    const e = i();
-    function l() {
-      e.scrollTop = e.scrollHeight;
+    _();
+    const s = i();
+    function r() {
+      s.scrollTop = s.scrollHeight;
     }
     return p(async () => {
-      a.messages, l();
-    }), (n, B) => (s(), o("div", y, [
-      (s(!0), o(g, null, d(n.messages, (r, c) => (s(), f(w, {
+      a.messages, r();
+    }), (l, B) => (e(), o("div", w, [
+      (e(!0), o(d, null, u(l.messages, (n, c) => (e(), g(v, {
         key: c,
-        message: r
+        message: n
       }, null, 8, ["message"]))), 128))
     ]));
   }
-}), v = ":host{height:100%;overflow:auto;scroll-behavior:smooth}.llm-messages{display:flex;flex-direction:column;gap:24px;padding:24px}", x = /* @__PURE__ */ u(L, [["styles", [v]]]);
-window.customElements.define("llm-messages", _(x));
+}), L = ":host{height:100%;overflow:auto;scroll-behavior:smooth}@media (prefers-reduced-motion: reduce){:host{scroll-behavior:auto}}.llm-messages{display:flex;flex-direction:column;gap:24px;padding:24px}", x = /* @__PURE__ */ f(y, [["styles", [L]]]);
+window.customElements.define("llm-messages", h(x));

package/dist/components/llm-prompt-select.ce.js.js

@@ -0,0 +1,67 @@
+import { d as h, f as c, g as y, c as i, o as d, b as x, a as l, h as w, F as _, r as k, t as S, _ as C, e as L } from "../_plugin-vue_export-helper-BDNE3C4u.js";
+import "./llm-messages.ce.js.js";
+const N = { class: "prompt-select" }, P = { class: "prompt-select__options" }, B = ["disabled", "onClick"], E = /* @__PURE__ */ h({
+  __name: "LLMPromptSelect.ce",
+  props: {
+    messages: { type: Array },
+    prompts: { type: Array },
+    speed: { type: Number }
+  },
+  setup(f, { expose: b }) {
+    const t = f, s = c(t.messages), m = c(t.prompts.map((e) => ({
+      ...e,
+      disabled: !1
+    }))), r = c(!1);
+    function g() {
+      s.value = t.messages, m.value = t.prompts.map((e) => ({
+        ...e,
+        disabled: !1
+      })), r.value = !1;
+    }
+    b({
+      reset: g
+    });
+    async function v(e) {
+      const o = t.speed === 0 || window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+      if (s.value = [
+        ...s.value,
+        {
+          direction: "outbound",
+          content: e.prompt
+        },
+        {
+          direction: "inbound",
+          content: o ? e.response : ""
+        }
+      ], e.disabled = !0, o) return;
+      const a = s.value.length - 1;
+      r.value = !0;
+      const n = e.response.split(/(\s+|<[^>]+>)/);
+      for (const p of n)
+        await new Promise((u) => {
+          setTimeout(u, t.speed ?? 20);
+        }), s.value = [...s.value], s.value[a].content += p;
+      r.value = !1;
+    }
+    return (e, o) => {
+      const a = y("llm-messages");
+      return d(), i(_, null, [
+        x(a, { messages: s.value }, null, 8, ["messages"]),
+        l("div", N, [
+          o[0] || (o[0] = l("p", { class: "prompt-select__label" }, [
+            w(" Sélectionner un des prompts "),
+            l("span", { class: "sr-only" }, "  une fois sélectionnés, les prompts ne sont plus disponibles. ")
+          ], -1)),
+          l("div", P, [
+            (d(!0), i(_, null, k(m.value, (n, p) => (d(), i("button", {
+              key: p,
+              disabled: n.disabled || r.value,
+              onClick: (u) => v(n)
+            }, S(n.prompt), 9, B))), 128))
+          ])
+        ])
+      ], 64);
+    };
+  }
+}), M = ".sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}llm-messages{display:block;height:400px}.prompt-select{border-top:solid 1px grey;padding:24px}.prompt-select__label{margin-top:0;font-weight:700}.prompt-select__options{display:flex;gap:1rem;justify-content:left;padding-bottom:1rem;flex-wrap:wrap}.prompt-select__options>button{padding:.5rem 1.5rem;border:none;background:#cec3f4;border-radius:5px}.prompt-select__options>button:hover:not(:disabled){background:#9a8dc7;color:#fff;cursor:pointer}.prompt-select__options>button:disabled{cursor:not-allowed}", V = /* @__PURE__ */ C(E, [["styles", [M]]]);
+window.customElements.define("llm-prompt-select", L(V));

package/dist/components/message-conversation.ce.js.js

@@ -1,4 +1,4 @@
-import { _ as f, c as i, o as t, d as x, g as D, k as v, l as S, n as h, p as u, a as p, q as b, t as _, b as $, F as y, r as k, f as M, e as A } from "../_plugin-vue_export-helper-rf--DmCY.js";
+import { _ as f, c as i, o as t, d as x, f as D, p as v, q as S, n as h, v as u, a as p, h as b, t as _, b as $, F as y, r as w, i as M, e as A } from "../_plugin-vue_export-helper-BDNE3C4u.js";
 const C = ".loader{width:8px;aspect-ratio:1;border-radius:50%;animation:l5 1s infinite linear alternate;transform:translate(100%)}@keyframes l5{0%{box-shadow:13px 0 #000,-13px 0 #0002;background:#000}33%{box-shadow:13px 0 #000,-13px 0 #0002;background:#0002}66%{box-shadow:13px 0 #0002,-13px 0 #000;background:#0002}to{box-shadow:13px 0 #0002,-13px 0 #000;background:#000}}@media (prefers-reduced-motion: reduce){.loader{display:none}}", B = {}, V = { class: "loader" };
 function E(n, s) {
   return t(), i("div", V);
@@ -45,7 +45,7 @@ const F = /* @__PURE__ */ f(B, [["render", E], ["styles", [C]]]), z = ["part"],
         class: h(["message__content", { "hidden-state": s.value !== "visible" }]),
         part: `message ${e.message.direction}`
       }, [
-        (t(!0), i(y, null, k(m.value, (d, o) => (t(), i(y, { key: o }, [
+        (t(!0), i(y, null, w(m.value, (d, o) => (t(), i(y, { key: o }, [
           o > 0 ? (t(), i("br", j)) : u("", !0),
           b(" " + _(d), 1)
         ], 64))), 128))
@@ -70,8 +70,8 @@ const F = /* @__PURE__ */ f(B, [["render", E], ["styles", [C]]]), z = ["part"],
             message: l,
             startAnimation: c,
             animationDuration: g
-          } = e.at(-1), w = a.direction !== l.direction || a.userName !== l.userName, N = c + g + s;
-          return [...e, { message: a, displaySender: w, startAnimation: N, animationDuration: o }];
+          } = e.at(-1), k = a.direction !== l.direction || a.userName !== l.userName, N = c + g + s;
+          return [...e, { message: a, displaySender: k, startAnimation: N, animationDuration: o }];
         },
         []
       )
@@ -81,7 +81,7 @@ const F = /* @__PURE__ */ f(B, [["render", E], ["styles", [C]]]), z = ["part"],
     }
     return (e, a) => (t(), i("figure", G, [
       p("figcaption", H, _(e.title), 1),
-      (t(!0), i(y, null, k(m.value, ({ message: d, displaySender: o, startAnimation: l, animationDuration: c }, g) => (t(), M(P, {
+      (t(!0), i(y, null, w(m.value, ({ message: d, displaySender: o, startAnimation: l, animationDuration: c }, g) => (t(), M(P, {
         message: d,
         "start-animation": l,
         "animation-duration": c,

package/dist/components/qcu-image.ce.js.js

@@ -1,4 +1,4 @@
-import { d as y, g as w, h as C, c as l, o as n, i as g, j as h, n as x, a as k, m as $, t as v, _ as b, k as p, s as N, F as P, r as B, f as S, e as z } from "../_plugin-vue_export-helper-rf--DmCY.js";
+import { d as y, f as w, j as C, c as l, o as n, k as p, l as h, n as x, a as k, m as $, t as v, _ as b, p as g, s as N, F as P, r as B, i as S, e as z } from "../_plugin-vue_export-helper-BDNE3C4u.js";
 function j(c, t = L) {
   const a = [...c];
   for (let o = a.length - 1; o > 0; o--) {
@@ -38,9 +38,9 @@ const E = ["aria-checked", "tabindex"], I = { key: 0 }, q = /* @__PURE__ */ y({
       tabindex: e.focusable ? 0 : -1,
       onClick: i[0] || (i[0] = h((r) => e.$emit("check"), ["stop"])),
       onKeydown: [
-        i[1] || (i[1] = g(h((r) => e.$emit("check"), ["stop", "prevent"]), ["enter", "space"])),
-        i[2] || (i[2] = g(h((r) => e.$emit("checkPrevious"), ["stop", "prevent"]), ["up", "left"])),
-        i[3] || (i[3] = g(h((r) => e.$emit("checkNext"), ["stop", "prevent"]), ["down", "right"]))
+        i[1] || (i[1] = p(h((r) => e.$emit("check"), ["stop", "prevent"]), ["enter", "space"])),
+        i[2] || (i[2] = p(h((r) => e.$emit("checkPrevious"), ["stop", "prevent"]), ["up", "left"])),
+        i[3] || (i[3] = p(h((r) => e.$emit("checkNext"), ["stop", "prevent"]), ["down", "right"]))
       ]
     }, [
       e.choice.image ? (n(), l("figure", I, [
@@ -70,7 +70,7 @@ const E = ["aria-checked", "tabindex"], I = { key: 0 }, q = /* @__PURE__ */ y({
   },
   emits: ["answer"],
   setup(c, { emit: t }) {
-    const a = t, o = p(() => c.hideChoicesName ? "sr-only" : ""), e = p(() => c.orderChoices ? c.choices : j(c.choices)), i = N(), r = p(() => i.value ?? e.value[0]);
+    const a = t, o = g(() => c.hideChoicesName ? "sr-only" : ""), e = g(() => c.orderChoices ? c.choices : j(c.choices)), i = N(), r = g(() => i.value ?? e.value[0]);
     function u(s) {
       s === -1 ? i.value = e.value[e.value.length - 1] : s === e.value.length ? i.value = e.value[0] : i.value = e.value[s], a("answer", i.value.response ?? i.value.name);
     }

package/dist/index.js

@@ -1,4 +1,5 @@
 import "./components/message-conversation.ce.js.js";
 import "./components/llm-messages.ce.js.js";
 import "./components/llm-compare-messages.ce.js.js";
+import "./components/llm-prompt-select.ce.js.js";
 import "./components/qcu-image.ce.js.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@1024pix/epreuves-components",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "A collection of interactive components to be used in Pix challenges or modules",
   "exports": {
     ".": "./dist/index.js",