@seresweb/website-component 2.0.0

package/dist/es/drawer.mjs

@@ -0,0 +1,174 @@
+import { defineComponent as Z, useSlots as j, computed as c, ref as $, watch as b, onMounted as G, onBeforeUnmount as J, createElementBlock as p, openBlock as i, Fragment as K, createCommentVNode as h, createElementVNode as w, normalizeStyle as m, normalizeClass as o, renderSlot as y, createBlock as z, Teleport as Q, createVNode as W, Transition as I, unref as Y, withCtx as S, withDirectives as M, vShow as R } from "vue";
+import { P as a } from "../_vars-BV4QQF-p.js";
+const k = /* @__PURE__ */ (() => {
+  let l = 1e3;
+  return () => ++l;
+})(), T = /* @__PURE__ */ Z({
+  __name: "drawer",
+  props: {
+    modelValue: { type: Boolean, default: !1 },
+    direction: { default: "right" },
+    showMask: { type: Boolean, default: !0 },
+    maskClosable: { type: Boolean, default: !0 },
+    hoverable: { type: Boolean, default: !1 },
+    triggerOnTop: { type: Boolean },
+    width: {},
+    class: {}
+  },
+  emits: ["update:modelValue"],
+  setup(l, { emit: O }) {
+    const D = `${a}-drawer`, N = `${a}-drawer-wrapper`, A = `${a}-drawer-content`, F = `${a}-drawer-mask`, _ = `${a}-drawer-trigger`, P = `${a}-drawer-header`, r = l, q = O, B = j(), L = c(() => !!B.trigger), x = c(() => !!B.header), s = $(!!r.modelValue), v = $(null), d = $(null);
+    b(
+      () => r.modelValue,
+      (e) => s.value = !!e
+    ), b(s, (e) => q("update:modelValue", e));
+    const H = c(() => `${a}-drawer-${r.direction}`), U = c(() => `${a}-drawer-${r.direction}`), u = c(() => {
+      const e = {
+        zIndex: k()
+      }, t = {}, n = { zIndex: k() }, V = { zIndex: k() };
+      return (r.direction === "left" || r.direction === "right") && (V.width = r.width || "50vw"), r.triggerOnTop && (t.zIndex = k()), {
+        main: e,
+        mask: n,
+        wrapper: V,
+        trigger: t
+      };
+    }), X = () => {
+      r.maskClosable !== !1 && (s.value = !1);
+    };
+    let C = [], E = null;
+    const f = () => {
+      E && clearTimeout(E), s.value = !0;
+    }, g = () => {
+      E = setTimeout(() => {
+        s.value = !1;
+      }, 200);
+    };
+    return G(() => {
+      var e, t;
+      r.hoverable && v.value && (C = Array.from(v.value.querySelectorAll("[data-hover-trigger]")), C.forEach((n) => {
+        n.addEventListener("mouseenter", f), n.addEventListener("mouseleave", g);
+      }), (e = d.value) == null || e.addEventListener("mouseenter", f), (t = d.value) == null || t.addEventListener("mouseleave", g));
+    }), J(() => {
+      var e, t;
+      C.forEach((n) => {
+        n.removeEventListener("mouseenter", f), n.removeEventListener("mouseleave", g);
+      }), (e = d.value) == null || e.removeEventListener("mouseenter", f), (t = d.value) == null || t.removeEventListener("mouseleave", g);
+    }), (e, t) => (i(), p(
+      K,
+      null,
+      [
+        L.value && !e.triggerOnTop ? (i(), p(
+          "div",
+          {
+            key: 0,
+            class: o(_),
+            ref_key: "triggerRef",
+            ref: v,
+            style: m(u.value.trigger)
+          },
+          [
+            y(e.$slots, "trigger")
+          ],
+          4
+          /* STYLE */
+        )) : h("v-if", !0),
+        w(
+          "div",
+          {
+            class: o([D, r.class]),
+            style: m(u.value.main)
+          },
+          [
+            L.value && e.triggerOnTop ? (i(), p(
+              "div",
+              {
+                key: 0,
+                class: o(_),
+                ref_key: "triggerRef",
+                ref: v,
+                style: m(u.value.trigger)
+              },
+              [
+                y(e.$slots, "trigger")
+              ],
+              4
+              /* STYLE */
+            )) : h("v-if", !0),
+            (i(), z(Q, {
+              to: "body",
+              disabled: e.triggerOnTop
+            }, [
+              e.showMask ? (i(), z(I, {
+                key: 0,
+                name: `${Y(a)}-fade`,
+                persisted: ""
+              }, {
+                default: S(() => [
+                  M(w(
+                    "div",
+                    {
+                      class: o(F),
+                      style: m(u.value.mask),
+                      onClick: X
+                    },
+                    null,
+                    4
+                    /* STYLE */
+                  ), [
+                    [R, s.value]
+                  ])
+                ]),
+                _: 1
+                /* STABLE */
+              }, 8, ["name"])) : h("v-if", !0),
+              W(I, {
+                name: H.value,
+                persisted: ""
+              }, {
+                default: S(() => [
+                  M(w(
+                    "div",
+                    {
+                      class: o([N, U.value]),
+                      style: m(u.value.wrapper),
+                      ref_key: "mainRef",
+                      ref: d
+                    },
+                    [
+                      x.value ? (i(), p("div", {
+                        key: 0,
+                        class: o(P)
+                      }, [
+                        y(e.$slots, "header")
+                      ])) : h("v-if", !0),
+                      w("div", {
+                        class: o(A)
+                      }, [
+                        y(e.$slots, "default")
+                      ])
+                    ],
+                    6
+                    /* CLASS, STYLE */
+                  ), [
+                    [R, s.value]
+                  ])
+                ]),
+                _: 3
+                /* FORWARDED */
+              }, 8, ["name"])
+            ], 8, ["disabled"]))
+          ],
+          6
+          /* CLASS, STYLE */
+        )
+      ],
+      64
+      /* STABLE_FRAGMENT */
+    ));
+  }
+});
+T.install = (l) => (l.component("ScDrawer", T), l);
+const te = T;
+export {
+  te as ScDrawer
+};

package/dist/es/dropdown.mjs

@@ -0,0 +1,62 @@
+import { defineComponent as w, ref as v, createElementBlock as f, openBlock as _, normalizeClass as t, createElementVNode as a, createVNode as C, renderSlot as l, Transition as $, withCtx as h, withDirectives as g, vShow as E } from "vue";
+import { P as o } from "../_vars-BV4QQF-p.js";
+const r = /* @__PURE__ */ w({
+  __name: "dropdown",
+  setup(n) {
+    const c = `${o}-dropdown-wrapper`, d = `${o}-dropdown-trigger`, i = `${o}-dropdown-content`, p = `${o}-dropdown`, e = v(!1), u = () => {
+      e.value || (e.value = !0);
+    }, m = () => {
+      e.value && (e.value = !1);
+    };
+    return (s, M) => (_(), f(
+      "div",
+      {
+        class: t(c),
+        onMouseleave: m
+      },
+      [
+        a(
+          "div",
+          {
+            class: t(d),
+            onMouseenter: u
+          },
+          [
+            l(s.$slots, "default")
+          ],
+          32
+          /* NEED_HYDRATION */
+        ),
+        C($, {
+          name: p,
+          persisted: ""
+        }, {
+          default: h(() => [
+            g(a(
+              "div",
+              {
+                class: t(i)
+              },
+              [
+                l(s.$slots, "content")
+              ],
+              512
+              /* NEED_PATCH */
+            ), [
+              [E, e.value]
+            ])
+          ]),
+          _: 3
+          /* FORWARDED */
+        })
+      ],
+      32
+      /* NEED_HYDRATION */
+    ));
+  }
+});
+r.install = (n) => (n.component("ScDropdown", r), n);
+const N = r;
+export {
+  N as ScDropdown
+};

package/dist/es/gradual-highlight.mjs

@@ -0,0 +1,90 @@
+import { defineComponent as x, computed as A, ref as E, onMounted as q, onBeforeUnmount as z, createElementBlock as _, openBlock as w, normalizeClass as u, unref as H, Fragment as B, renderList as T, normalizeStyle as G, createElementVNode as F } from "vue";
+import { P as g } from "../_vars-BV4QQF-p.js";
+const I = ["innerHTML"], b = ["innerHTML"], M = /* @__PURE__ */ x({
+  __name: "gradual-highlight",
+  props: {
+    text: {},
+    originColor: { default: "#fafafa" },
+    highlightColor: { default: "#000" },
+    startRatio: { default: 0.9 },
+    endRatio: { default: 0.5 }
+  },
+  setup(o) {
+    const i = o, $ = `${g}-gradual-highlight__wrap`, C = `${g}-gradual-highlight__pass`, S = A(() => i.text.split(/(\s+)/)), l = E(), s = E(0);
+    let d = 0, c = 0, m = !1;
+    const L = () => {
+      const e = d - s.value;
+      if (Math.abs(e) < 1e-3) {
+        s.value = d, m = !1;
+        return;
+      }
+      s.value += e * 0.07, P(s.value), c = requestAnimationFrame(L);
+    }, h = () => {
+      if (!l.value) return;
+      const e = l.value.getBoundingClientRect(), n = window.innerHeight, t = n * i.startRatio, r = n * i.endRatio, f = t - r;
+      let a = (t - e.top) / f;
+      a = Math.max(0, Math.min(1, a)), d = a, m || (m = !0, cancelAnimationFrame(c), c = requestAnimationFrame(L));
+    }, P = (e) => {
+      var r;
+      const n = (r = l.value) == null ? void 0 : r.querySelectorAll(`.${$}`);
+      if (!n) return;
+      const t = 1 / n.length;
+      n.forEach((f, a) => {
+        const R = a * t;
+        let p = (e - R) / t;
+        p = Math.max(0, Math.min(1, p));
+        const k = Math.round(p * 100), v = f.querySelector(`.${C}`);
+        v && (v.style.color = i.highlightColor, v.style.width = `${k}%`);
+      });
+    }, y = () => {
+      h();
+    };
+    return q(() => {
+      window.addEventListener("scroll", y, { passive: !0 }), window.addEventListener("resize", h), h();
+    }), z(() => {
+      window.removeEventListener("scroll", y), window.removeEventListener("resize", h), cancelAnimationFrame(c);
+    }), (e, n) => (w(), _(
+      "div",
+      {
+        ref_key: "container",
+        ref: l,
+        class: u(`${H(g)}-gradual-highlight`)
+      },
+      [
+        (w(!0), _(
+          B,
+          null,
+          T(S.value, (t, r) => (w(), _(
+            "span",
+            {
+              key: `${t}-${r}`,
+              class: u($),
+              style: G(`color:${e.originColor}`)
+            },
+            [
+              F("span", {
+                class: u(`${H(g)}-gradual-highlight__origin`),
+                innerHTML: t
+              }, null, 10, I),
+              F("span", {
+                class: u(C),
+                innerHTML: t
+              }, null, 8, b)
+            ],
+            4
+            /* STYLE */
+          ))),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+});
+M.install = (o) => (o.component("ScGradualHighlight", M), o);
+const U = M;
+export {
+  U as ScGradualHighlight
+};

package/dist/es/horizontal-viewer.mjs

@@ -0,0 +1,4 @@
+import { S as e } from "../index-BgNMAlW8.js";
+export {
+  e as ScHorizontalViewer
+};

package/dist/es/image-indicator.mjs

@@ -0,0 +1,4 @@
+import { a as r } from "../index-BgNMAlW8.js";
+export {
+  r as ScImageIndicator
+};

package/dist/es/index.mjs

@@ -0,0 +1,60 @@
+import { ScInput as f } from "./Input.mjs";
+import { ScAccordionInfoPanel as p } from "./accordion-info-panel.mjs";
+import { ScAnimatedNumber as S } from "./animated-number.mjs";
+import { ScDrawer as l } from "./drawer.mjs";
+import { ScDropdown as d } from "./dropdown.mjs";
+import { ScGradualHighlight as u } from "./gradual-highlight.mjs";
+import { S as h, a as w, b as y } from "../index-BgNMAlW8.js";
+import { ScLayzImage as g } from "./layz-image.mjs";
+import { ScParameterBox as I } from "./parameter-box.mjs";
+import { ScRadio as $ } from "./radio.mjs";
+import { S as b } from "../index-BrggpRcU.js";
+import { ScTabIndicator as v } from "./tab-indicator.mjs";
+import { ScVideo as x } from "./video.mjs";
+const n = "@seresweb/website-component", Z = (t = {}) => {
+  const s = t.prefix || "Sc", o = t.importStyle ?? "css";
+  return {
+    type: "component",
+    resolve: (i) => {
+      if (!i.startsWith(s)) return;
+      const c = i.slice(s.length).replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase(), a = `${n}/dist/es/${c}`;
+      let e;
+      const m = (r) => {
+        if (r === "scss") return `${n}/dist/scss/${c}.scss`;
+        if (r === "css") return `${n}/dist/css/${c}.css`;
+      };
+      if (typeof o == "function") {
+        const r = o(c);
+        r === "css" || r === "scss" ? e = m(r) : r === !0 && (e = m("css"));
+      } else (o === !0 || o === "css" || o === "scss") && (e = m(o === !0 ? "css" : o));
+      return {
+        name: i,
+        from: a,
+        sideEffects: e ? [e] : void 0
+      };
+    }
+  };
+}, N = [f, p, S, l, d, u, h, w, g, I, $, y, b, v, x], j = {
+  install: (t) => (N.forEach((s) => {
+    t.use(s);
+  }), t)
+};
+export {
+  Z as ComponentsResolver,
+  p as ScAccordionInfoPanel,
+  S as ScAnimatedNumber,
+  l as ScDrawer,
+  d as ScDropdown,
+  u as ScGradualHighlight,
+  h as ScHorizontalViewer,
+  w as ScImageIndicator,
+  f as ScInput,
+  g as ScLayzImage,
+  I as ScParameterBox,
+  $ as ScRadio,
+  y as ScSwiperNormal,
+  b as ScSwiperVehicle,
+  v as ScTabIndicator,
+  x as ScVideo,
+  j as default
+};

package/dist/es/layz-image.mjs

@@ -0,0 +1,51 @@
+import { defineComponent as m, computed as l, createElementBlock as i, openBlock as u, normalizeClass as a, createElementVNode as t, normalizeStyle as d } from "vue";
+const p = ["srcset"], g = ["srcset"], S = ["srcset"], h = ["src", "alt"], r = /* @__PURE__ */ m({
+  __name: "layz-image",
+  props: {
+    src: {},
+    lSrcset: {},
+    mSrcset: {},
+    sSrcset: {},
+    alt: {},
+    class: {},
+    imgClass: {},
+    style: {}
+  },
+  setup(e) {
+    const c = e, n = l(() => ["sc-img", c.imgClass]), o = l(() => ["sc-picture", c.class]);
+    return (s, y) => (u(), i(
+      "picture",
+      {
+        class: a(o.value)
+      },
+      [
+        t("source", {
+          srcset: s.lSrcset || s.src,
+          media: "(min-width: 1921px)"
+        }, null, 8, p),
+        t("source", {
+          srcset: s.mSrcset || s.src,
+          media: "(min-width: 768px)"
+        }, null, 8, g),
+        t("source", {
+          srcset: s.sSrcset || s.src,
+          media: "(max-width: 767px)"
+        }, null, 8, S),
+        t("img", {
+          src: s.src,
+          alt: s.alt,
+          class: a(n.value),
+          style: d(s.style),
+          loading: "lazy"
+        }, null, 14, h)
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+});
+r.install = (e) => (e.component("ScLayzImage", r), e);
+const C = r;
+export {
+  C as ScLayzImage
+};

package/dist/es/parameter-box.mjs

@@ -0,0 +1,115 @@
+import { defineComponent as c, createElementBlock as n, openBlock as a, normalizeClass as d, unref as i, Fragment as v, renderList as _, createElementVNode as t, toDisplayString as r, createBlock as u } from "vue";
+import { P as l } from "../_vars-BV4QQF-p.js";
+import { ScAnimatedNumber as p } from "./animated-number.mjs";
+const y = {
+  key: 0,
+  class: "parameter-wrap"
+}, f = { class: "item-name" }, h = { class: "item-value" }, k = { key: 1 }, B = {
+  key: 1,
+  class: "parameter-wrap"
+}, A = { class: "item-value" }, b = { key: 1 }, g = { class: "item-name" }, m = /* @__PURE__ */ c({
+  __name: "parameter-box",
+  props: {
+    dataList: {},
+    isAnimation: { type: Boolean, default: !0 },
+    showDivider: { type: Boolean },
+    nameOnTop: { type: Boolean },
+    colorMode: { default: "light" },
+    inline: { type: Boolean }
+  },
+  setup(s) {
+    return (o, P) => (a(), n(
+      "div",
+      {
+        class: d([
+          `${i(l)}-parameter-box`,
+          `${i(l)}-parameter-box--${o.colorMode}`,
+          o.inline && `${i(l)}-parameter-box--inline`
+        ])
+      },
+      [
+        (a(!0), n(
+          v,
+          null,
+          _(o.dataList, (e) => (a(), n("div", {
+            key: e.name,
+            class: "parameter-item"
+          }, [
+            o.nameOnTop ? (a(), n("div", y, [
+              t(
+                "div",
+                f,
+                r(e.name),
+                1
+                /* TEXT */
+              ),
+              t("div", h, [
+                typeof e.value == "number" ? (a(), u(i(p), {
+                  key: 0,
+                  value: e.value,
+                  format: "",
+                  direction: "up",
+                  isAnimation: o.isAnimation,
+                  range: e.value / 10
+                }, null, 8, ["value", "isAnimation", "range"])) : (a(), n(
+                  "span",
+                  k,
+                  r(e.value),
+                  1
+                  /* TEXT */
+                )),
+                t(
+                  "span",
+                  null,
+                  r(e.unit),
+                  1
+                  /* TEXT */
+                )
+              ])
+            ])) : (a(), n("div", B, [
+              t("div", A, [
+                typeof e.value == "number" ? (a(), u(i(p), {
+                  key: 0,
+                  value: e.value,
+                  format: "",
+                  direction: "up",
+                  isAnimation: o.isAnimation,
+                  range: e.value / 10
+                }, null, 8, ["value", "isAnimation", "range"])) : (a(), n(
+                  "span",
+                  b,
+                  r(e.value),
+                  1
+                  /* TEXT */
+                )),
+                t(
+                  "span",
+                  null,
+                  r(e.unit),
+                  1
+                  /* TEXT */
+                )
+              ]),
+              t(
+                "div",
+                g,
+                r(e.name),
+                1
+                /* TEXT */
+              )
+            ]))
+          ]))),
+          128
+          /* KEYED_FRAGMENT */
+        ))
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+});
+m.install = (s) => (s.component("ScParameterBox", m), s);
+const E = m;
+export {
+  E as ScParameterBox
+};

package/dist/es/radio.mjs

@@ -0,0 +1,56 @@
+import { defineComponent as r, createElementBlock as m, openBlock as u, normalizeClass as p, unref as d, createElementVNode as o, toDisplayString as b } from "vue";
+import { P as i } from "../_vars-BV4QQF-p.js";
+const c = ["id", "name", "value", "checked", "disabled"], v = { class: "radio-label" }, n = /* @__PURE__ */ r({
+  __name: "radio",
+  props: {
+    modelValue: { type: [String, Number, Boolean] },
+    value: { type: [String, Number, Boolean] },
+    label: {},
+    disabled: { type: Boolean },
+    id: {},
+    name: {}
+  },
+  emits: ["change", "update:modelValue"],
+  setup(l, { emit: s }) {
+    const t = s;
+    return (e, a) => (u(), m(
+      "label",
+      {
+        class: p([`${d(i)}-radio`, e.disabled && `${d(i)}-disabled`])
+      },
+      [
+        o("input", {
+          type: "radio",
+          id: e.id,
+          name: e.name,
+          value: e.value,
+          checked: e.modelValue === e.value,
+          disabled: e.disabled,
+          class: "radio-input",
+          onChange: a[0] || (a[0] = (f) => t("update:modelValue", e.value))
+        }, null, 40, c),
+        a[1] || (a[1] = o(
+          "span",
+          { class: "radio-box" },
+          null,
+          -1
+          /* CACHED */
+        )),
+        o(
+          "span",
+          v,
+          b(e.label),
+          1
+          /* TEXT */
+        )
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+});
+n.install = (l) => (l.component("ScRadio", n), l);
+const B = n;
+export {
+  B as ScRadio
+};

package/dist/es/swiper-normal.mjs

@@ -0,0 +1,4 @@
+import { b as a } from "../index-BgNMAlW8.js";
+export {
+  a as ScSwiperNormal
+};

package/dist/es/swiper-vehicle.mjs

@@ -0,0 +1,4 @@
+import { S } from "../index-BrggpRcU.js";
+export {
+  S as ScSwiperVehicle
+};