@opendesign-plus-test/components 0.0.1-rc.66 → 0.0.1-rc.67

package/dist/esm/components/events/OEventsCalendar.vue.mjs

@@ -1,228 +0,0 @@
-import { defineComponent as P, ref as T, watch as z, openBlock as e, createElementBlock as o, unref as c, Fragment as _, renderList as y, createElementVNode as l, toDisplayString as i, createCommentVNode as M, createVNode as k, withCtx as m, createBlock as g, normalizeStyle as N, normalizeClass as V, mergeProps as F, createTextVNode as J, resolveDynamicComponent as $, withDirectives as H } from "vue";
-import { buildVueDompurifyHTMLDirective as U } from "vue-dompurify-html";
-import { OCollapse as W, OCollapseItem as j, OLink as O, OIcon as x, OIconChevronRight as R } from "@opensig/opendesign";
-import { useScreen as q } from "@opendesign-plus/composables";
-import { EVENTS_COLOR_MAP as G, EVENTS_ICON_MAP as K } from "./config.mjs";
-const Q = { class: "o-events-calendar" }, X = {
-  key: 0,
-  class: "month-list"
-}, Y = { class: "collapse-header" }, Z = { class: "collapse-title" }, ee = {
-  key: 0,
-  class: "collapse-desc"
-}, te = {
-  key: 0,
-  class: "month-content month-content-span"
-}, oe = {
-  key: 0,
-  class: "event-location"
-}, ne = { class: "event-name" }, ae = { key: 1 }, le = {
-  key: 0,
-  class: "month-content-row"
-}, se = { class: "month-name" }, re = { class: "event-name" }, ce = { class: "event-location" }, ie = { class: "event-name" }, de = { class: "event-location" }, ue = {
-  key: 1,
-  class: "month-content month-content-column"
-}, me = { class: "event-location" }, he = { class: "event-name" }, _e = { key: 1 }, ge = /* @__PURE__ */ P({
-  __name: "OEventsCalendar",
-  props: {
-    data: { default: () => [] }
-  },
-  setup(b) {
-    const S = U(), { lePadV: C } = q(), A = b, D = ["JAN", "FEB", "MAR", "Apr", "May", "JUN", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], v = T([]);
-    z(
-      [() => A.data, () => C.value],
-      () => {
-        var s;
-        A.data.length ? C.value ? v.value = [(s = A.data[0]) == null ? void 0 : s.name] : v.value = A.data.map((a) => a.name) : v.value = [];
-      },
-      {
-        immediate: !0
-      }
-    );
-    const f = (s) => {
-      const a = s.split("/");
-      return parseInt(a[1], 10);
-    }, I = (s) => {
-      const a = new Array(12).fill(0), t = [];
-      return s.forEach((d, r) => {
-        const [u, n] = Array.isArray(d.date) ? [f(d.date[0]), f(d.date[1])] : [f(d.date), f(d.date)];
-        let h = 0;
-        for (let p = u - 1; p < n; p++)
-          h = Math.max(h, a[p]);
-        const E = h + 1;
-        for (let p = u - 1; p < n; p++)
-          a[p] = E;
-        t.push({
-          event: d,
-          row: E,
-          eventIndex: r,
-          start: u,
-          end: n
-        });
-      }), t;
-    }, L = (s) => {
-      const a = Array.from({ length: 12 }, () => []);
-      return s.forEach((t) => {
-        const d = Array.isArray(t.date) ? f(t.date[0]) : f(t.date);
-        a[d - 1].push(t);
-      }), a;
-    }, w = (s) => {
-      const a = s.color || G[s.type];
-      return a != null && a.startsWith("--") ? `var(${a})` : a;
-    }, B = (s) => s.icon ? s.icon : K[s.type];
-    return (s, a) => (e(), o("div", Q, [
-      c(C) ? M("", !0) : (e(), o("div", X, [
-        (e(), o(_, null, y(D, (t) => l("div", {
-          class: "month-header",
-          key: t
-        }, i(t), 1)), 64))
-      ])),
-      k(c(W), {
-        modelValue: v.value,
-        "onUpdate:modelValue": a[0] || (a[0] = (t) => v.value = t)
-      }, {
-        default: m(() => [
-          (e(!0), o(_, null, y(b.data, (t, d) => (e(), g(c(j), {
-            key: d,
-            value: t.name
-          }, {
-            title: m(() => [
-              l("div", Y, [
-                l("div", Z, [
-                  l("div", {
-                    class: "title-icon",
-                    style: N({
-                      "--bg-color": w(t)
-                    })
-                  }, [
-                    k(c(x), null, {
-                      default: m(() => [
-                        (e(), g($(B(t))))
-                      ]),
-                      _: 2
-                    }, 1024)
-                  ], 4),
-                  l("span", null, i(t.name), 1)
-                ]),
-                t.desc ? (e(), o("div", ee, [
-                  H(l("div", null, null, 512), [
-                    [c(S), t.desc]
-                  ])
-                ])) : M("", !0)
-              ])
-            ]),
-            default: m(() => [
-              t.isSpanMonth ? (e(), o("div", te, [
-                (e(!0), o(_, null, y(I(t.data), ({ event: r, row: u, eventIndex: n, start: h, end: E }) => (e(), o("div", {
-                  key: n,
-                  class: V(["event-item", { "event-item-center": r.align === "center", "has-link": r.link }]),
-                  style: N({
-                    gridColumn: `${h} / ${E + 1}`,
-                    gridRow: u,
-                    "--bg-color": w(t) || void 0
-                  })
-                }, [
-                  r.location ? (e(), o("div", oe, i(r.location), 1)) : M("", !0),
-                  l("div", ne, [
-                    r.link ? (e(), g(c(O), F({
-                      key: 0,
-                      href: r.link,
-                      target: "_blank"
-                    }, { ref_for: !0 }, r.linkProps || {}), {
-                      default: m(() => [
-                        J(i(r.name), 1)
-                      ]),
-                      _: 2
-                    }, 1040, ["href"])) : (e(), o("span", ae, i(r.name), 1))
-                  ])
-                ], 6))), 128))
-              ])) : (e(), o(_, { key: 1 }, [
-                c(C) ? (e(), o("div", le, [
-                  (e(!0), o(_, null, y(L(t.data), (r, u) => (e(), o("div", {
-                    key: u,
-                    class: V(["month-row", {
-                      "empty-month": r.length === 0
-                    }])
-                  }, [
-                    l("div", se, i(D[u]), 1),
-                    (e(!0), o(_, null, y(r, (n, h) => (e(), o("div", {
-                      key: h,
-                      class: V(["event-item", n.link ? "has-link" : ""]),
-                      style: N({
-                        "--bd-color": w(t) || void 0
-                      })
-                    }, [
-                      n.link ? (e(), g(c(O), {
-                        key: 0,
-                        href: n.link,
-                        target: "_blank"
-                      }, {
-                        default: m(() => [
-                          l("div", null, [
-                            l("div", re, [
-                              l("span", null, i(n.name), 1)
-                            ]),
-                            l("div", ce, i(n.location), 1)
-                          ]),
-                          k(c(x), null, {
-                            default: m(() => [
-                              k(c(R))
-                            ]),
-                            _: 1
-                          })
-                        ]),
-                        _: 2
-                      }, 1032, ["href"])) : (e(), o(_, { key: 1 }, [
-                        l("div", ie, i(n.name), 1),
-                        l("div", de, i(n.location), 1)
-                      ], 64))
-                    ], 6))), 128))
-                  ], 2))), 128))
-                ])) : (e(), o("div", ue, [
-                  (e(!0), o(_, null, y(L(t.data), (r, u) => (e(), o("div", {
-                    key: u,
-                    class: "month-column"
-                  }, [
-                    (e(!0), o(_, null, y(r, (n, h) => (e(), o("div", {
-                      key: h,
-                      class: V(["event-item", n.link ? "has-link" : ""]),
-                      style: N({
-                        "--bg-color": w(t) || void 0
-                      })
-                    }, [
-                      l("div", me, i(n.location), 1),
-                      l("div", he, [
-                        n.link ? (e(), g(c(O), {
-                          key: 0,
-                          href: n.link,
-                          target: "_blank"
-                        }, {
-                          suffix: m(() => [
-                            k(c(x), null, {
-                              default: m(() => [
-                                k(c(R))
-                              ]),
-                              _: 1
-                            })
-                          ]),
-                          default: m(() => [
-                            l("span", null, i(n.name), 1)
-                          ]),
-                          _: 2
-                        }, 1032, ["href"])) : (e(), o("span", _e, i(n.name), 1))
-                      ])
-                    ], 6))), 128))
-                  ]))), 128))
-                ]))
-              ], 64))
-            ]),
-            _: 2
-          }, 1032, ["value"]))), 128))
-        ]),
-        _: 1
-      }, 8, ["modelValue"])
-    ]));
-  }
-});
-export {
-  ge as default
-};

package/dist/esm/components/events/OEventsCalendar.vue3.mjs

@@ -1,5 +0,0 @@
-import o from "./OEventsCalendar.vue.mjs";
-import './OEventsCalendar.css';
-export {
-  o as default
-};

package/dist/esm/components/events/OEventsList.css

@@ -1,474 +0,0 @@
-.hover-icon-rotate .o-icon {
-  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
-}
-@media (hover: hover) {
-.hover-icon-rotate:hover .o-icon {
-    transform: rotate(-180deg);
-}
-}
-.o-events-list {
-  --events-card-radius: var(--o-radius-xs);
-  --events-tag-radius: var(--o-radius-xs);
-}
-.o-events-list .filter-slot-wrapper {
-  background-color: var(--o-color-fill2);
-  border-radius: var(--events-card-radius);
-  padding: var(--o-gap-5) var(--o-gap-6);
-  gap: var(--o-gap-3) var(--o-gap-2);
-  font-size: 16px;
-  line-height: 24px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .filter-slot-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .filter-slot-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .filter-slot-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 600px) {
-.o-events-list .filter-slot-wrapper {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .filter-slot-wrapper {
-    padding: var(--o-gap-4) var(--o-gap-5);
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .filter-slot-wrapper {
-    padding: var(--o-gap-4) var(--o-gap-5);
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .filter-slot-wrapper {
-    padding: var(--o-gap-3) var(--o-gap-4);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .filter-slot-wrapper {
-    padding: var(--o-gap-3) var(--o-gap-4);
-}
-}
-.o-events-list .filter-wrapper {
-  display: flex;
-  align-items: center;
-  flex-wrap: wrap;
-  justify-content: space-between;
-}
-.o-events-list .filter-wrapper .filter-left {
-  display: flex;
-  align-items: center;
-  gap: var(--o-gap-2);
-  flex-wrap: wrap;
-}
-.o-events-list .filter-wrapper .filter-left span:first-child {
-  flex-shrink: 0;
-  margin-right: var(--o-gap-5);
-  font-weight: 500;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .filter-wrapper .filter-left span:first-child {
-    margin-right: var(--o-gap-4);
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .filter-wrapper .filter-left span:first-child {
-    margin-right: var(--o-gap-3);
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .filter-wrapper .filter-left span:first-child {
-    margin-right: var(--o-gap-4);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .filter-wrapper .filter-left span:first-child {
-    margin-right: var(--o-gap-4);
-}
-}
-.o-events-list .filter-wrapper .filter-left .o-toggle {
-  --toggle-size: 32px;
-  --toggle-padding: 3px 15px;
-  --toggle-radius: var(--events-tag-radius);
-  max-height: 32px;
-  --toggle-bg-color: var(--o-color-fill1);
-  --toggle-bg-color-hover: var(--o-color-control2-light);
-  --toggle-color: var(--o-color-info1);
-  --toggle-color-hover: var(--o-color-info1);
-  --toggle-color-active: var(--o-color-primary1);
-  --toggle-color-disabled: var(--o-color-info4);
-  font-size: 16px;
-  line-height: 24px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .filter-wrapper .filter-left .o-toggle {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .filter-wrapper .filter-left .o-toggle {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .filter-wrapper .filter-left .o-toggle {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 600px) {
-.o-events-list .filter-wrapper .filter-left .o-toggle {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-.o-events-list .filter-wrapper .o-input .o-icon-search {
-  font-size: 24px;
-}
-@media (max-width: 840px) {
-.o-events-list .filter-wrapper .o-input .o-icon-search {
-    font-size: 16px;
-}
-}
-.o-events-list .list-content {
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  gap: var(--o-gap-6);
-  margin-top: var(--o-gap-6);
-}
-@media (max-width: 840px) {
-.o-events-list .list-content {
-    grid-template-columns: repeat(1, 1fr);
-    container-type: inline-size;
-}
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content {
-    margin-top: var(--o-gap-5);
-    gap: var(--o-gap-5);
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content {
-    margin-top: var(--o-gap-4);
-    gap: var(--o-gap-4);
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content {
-    margin-top: var(--o-gap-4);
-    gap: var(--o-gap-3);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content {
-    margin-top: var(--o-gap-4);
-    gap: var(--o-gap-3);
-}
-}
-.o-events-list .list-content .o-card {
-  aspect-ratio: 1/1;
-  position: relative;
-}
-@media (max-width: 840px) {
-.o-events-list .list-content .o-card {
-    aspect-ratio: 1/0.4;
-}
-}
-@container (max-width: 300px) {
-.o-events-list .list-content .o-card {
-    height: 140px;
-    width: 100%;
-    aspect-ratio: unset;
-}
-}
-.o-events-list .list-content .o-card .o-card-cover {
-  padding: 0;
-  height: 100%;
-}
-.o-events-list .list-content .o-card .o-card-main {
-  padding: 0;
-  position: absolute;
-  overflow: hidden;
-  box-sizing: border-box;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-}
-.o-events-list .list-content .o-card .o-card-content {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  color: var(--o-color-white);
-  text-align: center;
-  padding: var(--o-gap-6);
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content {
-    margin-top: var(--o-gap-4);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content {
-    margin-top: var(--o-gap-4);
-}
-}
-.o-events-list .list-content .o-card .o-card-content .tags-wrapper {
-  position: absolute;
-  top: var(--o-gap-3);
-  right: var(--o-gap-3);
-  display: flex;
-  align-items: center;
-  column-gap: var(--o-gap-2);
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .tags-wrapper {
-    top: var(--o-gap-2);
-    right: var(--o-gap-2);
-}
-}
-.o-events-list .list-content .o-card .o-card-content .tags-wrapper .o-tag {
-  --tag-color: rgb(var(--o-white));
-  --tag-bg-color: rgba(var(--o-black), 0.25);
-  --tag-padding: var(--o-gap-1) var(--o-gap-3);
-  border: none;
-  border-radius: var(--events-tag-radius);
-}
-@media (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .tags-wrapper .o-tag {
-    --tag-padding: var(--o-gap-1);
-}
-}
-.o-events-list .list-content .o-card .o-card-content .event-name {
-  font-weight: 500;
-  text-align: center;
-  height: 3lh;
-  font-size: 24px;
-  line-height: 32px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 20px;
-    line-height: 28px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 16px;
-    line-height: 24px;
-}
-}
-.o-events-list .list-content .o-card .o-card-content .event-name {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  word-break: break-all;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 32px;
-    line-height: 44px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) and (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 20px;
-    line-height: 28px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) and (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 20px;
-    line-height: 28px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) and (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) and (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    font-size: 16px;
-    line-height: 24px;
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-name {
-    height: 2lh;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
-}
-}
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-  text-align: center;
-  font-weight: 500;
-  margin-top: var(--o-gap-5);
-}
-.o-events-list .list-content .o-card .o-card-content .event-desc .o-divider {
-  --o-divider-color: var(--o-color-info1-inverse);
-  --o-divider-bd-color: var(--o-color-info1-inverse);
-  display: none;
-}
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-  font-size: 16px;
-  line-height: 24px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    margin-top: var(--o-gap-4);
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    margin-top: var(--o-gap-3);
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    margin-top: var(--o-gap-2);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    margin-top: var(--o-gap-2);
-}
-}
-@media (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    display: flex;
-    align-items: center;
-}
-.o-events-list .list-content .o-card .o-card-content .event-desc .o-divider {
-    display: block;
-}
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 840px) and (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (max-width: 840px) and (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (max-width: 840px) and (min-width: 601px) and (max-width: 840px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (max-width: 840px) and (max-width: 600px) {
-.o-events-list .list-content .o-card .o-card-content .event-desc {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-.o-events-list .list-content .event-card {
-  border-radius: var(--events-card-radius);
-  color: rgb(var(--o-white));
-  background-size: cover;
-  background-repeat: no-repeat;
-}
-.o-events-list .o-pagination {
-  margin-top: var(--o-gap-6);
-  --pagination-item-bg-color-current: var(--o-color-primary1);
-  --pagination-item-color-current: #fff;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-events-list .o-pagination {
-    margin-top: var(--o-gap-5);
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-events-list .o-pagination {
-    margin-top: var(--o-gap-4);
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-events-list .o-pagination {
-    margin-top: var(--o-gap-4);
-}
-}
-@media (max-width: 600px) {
-.o-events-list .o-pagination {
-    margin-top: var(--o-gap-4);
-}
-}
-.o-events-list .o-pagination .o-pagination-wrap {
-  justify-content: flex-end;
-}