@1024pix/epreuves-components 0.4.1 → 0.5.0

package/dist/components/cartes-a-retourner.js

@@ -1,43 +0,0 @@
-import { d as o, r as l, c as n, o as a, n as p, a as t, b as c, F as u, e as f, f as m, _ as g, g as _ } from "../_plugin-vue_export-helper-ne_y2ta8.js";
-const y = { class: "card-inner" }, v = /* @__PURE__ */ o({
-  __name: "CarteARetourner",
-  props: {
-    card: {}
-  },
-  setup(d) {
-    const e = l(!1);
-    return (s, r) => (a(), n("div", {
-      class: p(["card", { flipped: e.value }]),
-      onClick: r[0] || (r[0] = (i) => e.value = !e.value)
-    }, [
-      t("div", y, [
-        t("div", {
-          class: "card-face card-front",
-          style: c({ backgroundImage: `url('${s.card.frontImageUrl}')` })
-        }, null, 4),
-        t("div", {
-          class: "card-face card-back",
-          style: c({ backgroundImage: `url('${s.card.backImageUrl}')` })
-        }, null, 4)
-      ])
-    ], 2));
-  }
-}), b = /* @__PURE__ */ o({
-  __name: "CartesARetourner.ce",
-  props: {
-    cards: { type: Array },
-    cardsPerLine: { type: Number }
-  },
-  setup(d) {
-    return (e, s) => (a(), n("div", {
-      class: "container",
-      style: c({ "--cards-per-line": e.cardsPerLine })
-    }, [
-      (a(!0), n(u, null, f(e.cards, (r, i) => (a(), m(v, {
-        key: i,
-        card: r
-      }, null, 8, ["card"]))), 128))
-    ], 4));
-  }
-}), k = ".container{display:grid;grid-template-columns:repeat(var(--cards-per-line),1fr);gap:20px;justify-items:center}.card{width:150px;height:150px;perspective:1000px;cursor:pointer}.card-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s}.card.flipped .card-inner{transform:rotateY(180deg)}.card-face{width:100%;height:100%;position:absolute;backface-visibility:hidden;display:flex;justify-content:center;align-items:center;font-size:24px;border-radius:10px;background-size:cover}.card-back{transform:rotateY(180deg)}", h = /* @__PURE__ */ g(b, [["styles", [k]]]);
-window.customElements.define("cartes-a-retourner", _(h));

package/dist/components/message-conversation.js

@@ -1,95 +0,0 @@
-import { _ as x, c as i, o as n, d as b, r as S, h as v, i as A, n as h, j as u, a as p, k as y, t as _, l as N, F as f, e as k, f as $, g as M } from "../_plugin-vue_export-helper-ne_y2ta8.js";
-const C = {}, B = { class: "loader" };
-function V(t, s) {
-  return n(), i("div", B);
-}
-const E = /* @__PURE__ */ x(C, [["render", V]]), F = ["part"], z = {
-  key: 1,
-  class: "message__loader message__content",
-  "aria-hidden": "true"
-}, L = ["part"], T = { key: 0 }, j = /* @__PURE__ */ b({
-  __name: "Message",
-  props: {
-    displaySender: { type: Boolean, default: !0 },
-    message: {},
-    startAnimation: {},
-    animationDuration: {},
-    loadingDuration: {}
-  },
-  setup(t) {
-    const s = S("hidden"), m = v(() => t.message.content.split(`
-`));
-    function r(e) {
-      return new Promise((a) => setTimeout(a, e));
-    }
-    return A(async () => {
-      await r(t.startAnimation), s.value = "loading", await r(t.loadingDuration), s.value = "visible", await r(t.animationDuration);
-    }), (e, a) => (n(), i("div", {
-      class: h(["message", [
-        `message--${e.message.direction}`,
-        { "hidden-state": s.value === "hidden" }
-      ]])
-    }, [
-      e.displaySender ? (n(), i("p", {
-        key: 0,
-        class: "message__sender",
-        part: `sender ${e.message.direction}`
-      }, [
-        a[0] || (a[0] = p("span", { class: "sr-only" }, "Message de ", -1)),
-        y(_(e.message.userName), 1)
-      ], 8, F)) : u("", !0),
-      s.value === "loading" ? (n(), i("div", z, [
-        N(E)
-      ])) : u("", !0),
-      p("p", {
-        class: h(["message__content", { "hidden-state": s.value !== "visible" }]),
-        part: `message ${e.message.direction}`
-      }, [
-        (n(!0), i(f, null, k(m.value, (d, o) => (n(), i(f, { key: o }, [
-          o > 0 ? (n(), i("br", T)) : u("", !0),
-          y(" " + _(d), 1)
-        ], 64))), 128))
-      ], 10, L)
-    ], 2));
-  }
-}), P = { part: "conversation" }, q = { class: "sr-only" }, G = /* @__PURE__ */ b({
-  __name: "MessageConversation.ce",
-  props: {
-    title: { default: "Conversation par messages", type: String },
-    messages: { type: Array },
-    animationSpeed: { default: 20, type: Number }
-  },
-  setup(t) {
-    const s = 50 * t.animationSpeed, m = v(
-      () => t.messages.reduce(
-        (e, a, d) => {
-          const o = r(a);
-          if (d === 0)
-            return [{ message: a, displaySender: !0, startAnimation: 0, animationDuration: o }];
-          const {
-            message: l,
-            startAnimation: c,
-            animationDuration: g
-          } = e.at(-1), w = a.direction !== l.direction || a.userName !== l.userName, D = c + g + s;
-          return [...e, { message: a, displaySender: w, startAnimation: D, animationDuration: o }];
-        },
-        []
-      )
-    );
-    function r(e) {
-      return e.content.length * t.animationSpeed;
-    }
-    return (e, a) => (n(), i("figure", P, [
-      p("figcaption", q, _(e.title), 1),
-      (n(!0), i(f, null, k(m.value, ({ message: d, displaySender: o, startAnimation: l, animationDuration: c }, g) => (n(), $(j, {
-        message: d,
-        "start-animation": l,
-        "animation-duration": c,
-        "loading-duration": s,
-        "display-sender": o,
-        key: g
-      }, null, 8, ["message", "start-animation", "animation-duration", "display-sender"]))), 128))
-    ]));
-  }
-}), H = "figure{background-color:#fff;border-radius:16px;display:flex;flex-direction:column;gap:8px;margin:0;padding:16px}.message{max-width:80%;position:relative}.message--incoming{align-self:start}.message--incoming .message__sender{padding-left:10px}.message--incoming .message__loader{left:10px}.message--incoming .message__content{background-color:#e8e8e8}.message--outgoing{align-self:end}.message--outgoing .message__sender{padding-right:10px;text-align:right}.message--outgoing .message__loader{right:10px}.message--outgoing .message__content{background-color:#d1eaff}.message__sender{color:#444;font-size:.8rem;font-weight:700;margin:0}.message__loader{position:absolute;width:24px}.message__content{border-radius:16px;margin:0;padding:10px 14px}.message__content:not(.hidden-state){animation:fade .3s ease-in-out both}.loader{width:8px;aspect-ratio:1;border-radius:50%;animation:l5 1s infinite linear alternate;transform:translate(100%)}.hidden-state{visibility:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes fade{0%{opacity:0}to{opacity:1}}@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){.message__content:not(.hidden-state){animation:none}.loader,.message__loader{display:none}.hidden-state{visibility:visible}}", I = /* @__PURE__ */ x(G, [["styles", [H]]]);
-window.customElements.define("message-conversation", M(I));

package/dist/components/qcu-image.js

@@ -1,97 +0,0 @@
-import { d as w, r as C, w as b, c as l, o as t, m as f, p as h, n as x, a as k, q as y, t as v, h as g, s as _, F as q, e as $, f as P, _ as B, g as N } from "../_plugin-vue_export-helper-ne_y2ta8.js";
-function z(o, s = S) {
-  const a = [...o];
-  for (let c = a.length - 1; c > 0; c--) {
-    const e = s() % (c + 1);
-    [a[c], a[e]] = [a[e], a[c]];
-  }
-  return a;
-}
-function S() {
-  return Math.floor(Math.random() * 2 ** 32);
-}
-const L = ["aria-checked", "tabindex"], E = { key: 0 }, j = /* @__PURE__ */ w({
-  __name: "QCUChoice",
-  props: {
-    choice: {},
-    maxChoicesPerLine: {},
-    imageClass: {},
-    nameClass: {},
-    checked: { type: Boolean },
-    focusable: { type: Boolean }
-  },
-  emits: ["check", "checkNext", "checkPrevious"],
-  setup(o) {
-    const s = o, a = C();
-    b(() => {
-      var e;
-      s.checked && ((e = a.value) == null || e.focus());
-    });
-    const c = `qcu-image-choice-${(s.choice.response ?? s.choice.name).replace(/[^\w\-_:.]/g, "")}`;
-    return (e, i) => (t(), l("li", {
-      ref_key: "el",
-      ref: a,
-      role: "radio",
-      class: x(["qcu-image__choice", `qcu-image__choice--max${s.maxChoicesPerLine}`]),
-      "aria-labelledby": c,
-      "aria-checked": e.checked,
-      tabindex: e.focusable ? 0 : -1,
-      onClick: i[0] || (i[0] = h((r) => e.$emit("check"), ["stop"])),
-      onKeydown: [
-        i[1] || (i[1] = f(h((r) => e.$emit("check"), ["stop", "prevent"]), ["enter", "space"])),
-        i[2] || (i[2] = f(h((r) => e.$emit("checkPrevious"), ["stop", "prevent"]), ["up", "left"])),
-        i[3] || (i[3] = f(h((r) => e.$emit("checkNext"), ["stop", "prevent"]), ["down", "right"]))
-      ]
-    }, [
-      e.choice.image ? (t(), l("figure", E, [
-        k("img", y(e.choice.image, {
-          class: e.imageClass,
-          alt: ""
-        }), null, 16),
-        k("figcaption", {
-          class: x(e.nameClass),
-          id: c
-        }, v(e.choice.name), 3)
-      ])) : (t(), l("span", {
-        key: 1,
-        id: c
-      }, v(e.choice.name), 1))
-    ], 42, L));
-  }
-}), M = ["aria-label"], Q = /* @__PURE__ */ w({
-  __name: "QCUImage.ce",
-  props: {
-    choices: { type: Array },
-    maxChoicesPerLine: { default: 5, type: Number },
-    name: { type: String },
-    hideChoicesName: { type: Boolean },
-    orderChoices: { type: Boolean },
-    imageChoicesSize: { default: "icon", type: String }
-  },
-  emits: ["answer"],
-  setup(o, { emit: s }) {
-    const a = s, c = g(() => o.hideChoicesName ? "sr-only" : ""), e = g(() => o.orderChoices ? o.choices : z(o.choices)), i = _(), r = g(() => i.value ?? e.value[0]);
-    function u(n) {
-      n === -1 ? i.value = e.value[e.value.length - 1] : n === e.value.length ? i.value = e.value[0] : i.value = e.value[n], a("answer", i.value.response ?? i.value.name);
-    }
-    return (n, F) => (t(), l("ul", {
-      role: "radiogroup",
-      class: "qcu-image",
-      "aria-label": n.name
-    }, [
-      (t(!0), l(q, null, $(e.value, (d, m) => (t(), P(j, {
-        choice: d,
-        "max-choices-per-line": n.maxChoicesPerLine,
-        key: m,
-        "name-class": c.value,
-        "image-class": o.imageChoicesSize,
-        checked: d === i.value,
-        focusable: d === r.value,
-        onCheck: (p) => u(m),
-        onCheckNext: (p) => u(m + 1),
-        onCheckPrevious: (p) => u(m - 1)
-      }, null, 8, ["choice", "max-choices-per-line", "name-class", "image-class", "checked", "focusable", "onCheck", "onCheckNext", "onCheckPrevious"]))), 128))
-    ], 8, M));
-  }
-}), U = '*{box-sizing:border-box}ul,li{padding:0;margin:0}li{list-style:none}.qcu-image{display:flex;width:100%;flex-wrap:wrap;justify-content:space-around;font-size:110%;font-family:Open Sans,Arial,sans-serif}.qcu-image__choice{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;margin:1em;border:solid 2px #c1c7d0;border-radius:10px;background:#fff;width:calc(20% - 2em);min-width:120px}.qcu-image__choice--max4{width:calc(25% - 2em);min-width:175px}.qcu-image__choice--max3{width:calc(33% - 2em)}.qcu-image__choice--max2{width:calc(50% - 2em);min-width:300px}.qcu-image__choice--max1{width:calc(100% - 4em);min-width:300px}.qcu-image__choice:hover{cursor:pointer;box-shadow:0 3px 10px #0000001a;transform:scale(1.04);transition:transform ease-in .1s}.qcu-image__choice:focus{outline:none;box-shadow:5px 5px #ffbe00,-5px 5px #ffbe00,5px -5px #ffbe00,-5px -5px #ffbe00}.qcu-image__choice[aria-checked=true]{border-color:#3d68ff}.qcu-image__choice[aria-checked=true]:after{content:"";position:absolute;width:100%;height:100%;background:#3d68ff4d;border-radius:10px;z-index:3}.qcu-image__choice figure{width:100%;padding:0 10px;margin:3px;text-align:center}.qcu-image__choice figure img{max-width:100%;height:auto}.qcu-image__choice figure img.icon{max-height:100px;width:auto}.qcu-image__choice figure img.medium{max-width:50%;height:auto}.qcu-image__choice figure figcaption{margin:1ex}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}', A = /* @__PURE__ */ B(Q, [["styles", [U]]]);
-window.customElements.define("qcu-image", N(A));