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

package/dist/esm/components/search/internal/SearchPanel.vue2.mjs

@@ -0,0 +1,199 @@
+import { defineComponent as E, computed as u, openBlock as s, createElementBlock as o, renderSlot as a, createElementVNode as h, toDisplayString as c, unref as l, Fragment as k, renderList as g, createVNode as m, createCommentVNode as d, createBlock as L, withModifiers as I, withCtx as p, normalizeClass as N } from "vue";
+import { OIcon as C } from "@opensig/opendesign";
+import V from "../../../icons/icon-delete-hover.mjs";
+import x from "../../../icons/components-icon-delete.mjs";
+import R from "../../../icons/icon-refresh.mjs";
+import K from "./HighlightText.vue.mjs";
+import { useI18n as z } from "../../../i18n/index.mjs";
+const A = { class: "o-search-panel" }, F = {
+  key: 0,
+  class: "o-search-panel-section o-search-panel-onestep"
+}, M = { class: "o-search-panel-section-title onestep" }, P = ["onClick"], j = {
+  key: 0,
+  class: "o-search-panel-onestep-tag"
+}, q = {
+  key: 1,
+  class: "o-search-panel-divider"
+}, G = {
+  key: 2,
+  class: "o-search-panel-section o-search-panel-suggest"
+}, J = { class: "o-search-panel-section-title suggest" }, Q = ["onClick"], U = {
+  key: 1,
+  class: "o-search-panel-no-data"
+}, W = {
+  key: 3,
+  class: "o-search-panel-section o-search-panel-recommend"
+}, X = ["onClick"], Y = {
+  key: 4,
+  class: "o-search-panel-section o-search-panel-history"
+}, Z = { class: "o-search-panel-common-header" }, _ = { class: "o-search-panel-section-title" }, ee = ["onClick"], te = { class: "o-search-panel-history-row-text" }, se = {
+  key: 1,
+  class: "o-search-panel-history-list"
+}, oe = ["onClick"], ne = { class: "o-search-panel-history-text" }, le = {
+  key: 5,
+  class: "o-search-panel-divider"
+}, ae = {
+  key: 6,
+  class: "o-search-panel-section o-search-panel-hot"
+}, ce = { class: "o-search-panel-common-header" }, ie = { class: "o-search-panel-section-title" }, re = { class: "o-search-panel-hot-list" }, he = ["onClick"], fe = /* @__PURE__ */ E({
+  __name: "SearchPanel",
+  props: {
+    keyword: { default: "" },
+    onestepItems: { default: () => [] },
+    onestepTitle: {},
+    suggestItems: { default: () => [] },
+    suggestTitle: {},
+    recommendItems: { default: () => [] },
+    historyItems: { default: () => [] },
+    historyTitle: {},
+    hotItems: { default: () => [] },
+    hotTitle: {},
+    noDataText: {},
+    highlightKeyword: { type: Boolean, default: !0 },
+    hideOnKeyword: { type: Boolean, default: !1 },
+    showSuggestEmpty: { type: Boolean, default: !1 },
+    isDark: { type: Boolean, default: !1 },
+    historyLayout: { default: "chips" }
+  },
+  emits: ["onestep-click", "suggest-click", "recommend-click", "history-click", "hot-click", "history-remove", "history-clear", "hot-refresh"],
+  setup(e, { emit: S }) {
+    const i = e, r = S, { t: v } = z(), f = u(() => {
+      var n;
+      return !!((n = i.keyword) != null && n.trim());
+    }), $ = u(() => f.value && i.onestepItems.length > 0), T = u(() => f.value && (i.suggestItems.length > 0 || i.showSuggestEmpty)), H = u(
+      () => !f.value && i.recommendItems.length > 0
+    ), D = u(
+      () => (!i.hideOnKeyword || !f.value) && i.historyItems.length > 0
+    ), B = u(
+      () => (!i.hideOnKeyword || !f.value) && i.hotItems.length > 0
+    ), O = u(() => $.value && T.value), b = u(() => D.value && B.value);
+    return (n, w) => (s(), o("div", A, [
+      $.value ? (s(), o("div", F, [
+        a(n.$slots, "onestep-header", { items: e.onestepItems }, () => [
+          h("div", M, c(e.onestepTitle ?? l(v)("search.onestep")), 1)
+        ], !0),
+        a(n.$slots, "onestep-content", {
+          items: e.onestepItems,
+          keyword: e.keyword
+        }, () => [
+          (s(!0), o(k, null, g(e.onestepItems, (t) => (s(), o("div", {
+            key: t.key + (t.path ?? ""),
+            class: "o-search-panel-item o-search-panel-onestep-item",
+            onClick: (y) => r("onestep-click", t)
+          }, [
+            m(K, {
+              text: t.key,
+              keyword: e.keyword,
+              enabled: e.highlightKeyword
+            }, null, 8, ["text", "keyword", "enabled"]),
+            t.type ? (s(), o("span", j, c(t.type), 1)) : d("", !0)
+          ], 8, P))), 128))
+        ], !0)
+      ])) : d("", !0),
+      O.value ? (s(), o("div", q)) : d("", !0),
+      T.value ? (s(), o("div", G, [
+        a(n.$slots, "suggest-header", { items: e.suggestItems }, () => [
+          h("div", J, c(e.suggestTitle ?? l(v)("search.suggest")), 1)
+        ], !0),
+        a(n.$slots, "suggest-content", {
+          items: e.suggestItems,
+          keyword: e.keyword
+        }, () => [
+          e.suggestItems.length ? (s(!0), o(k, { key: 0 }, g(e.suggestItems, (t) => (s(), o("div", {
+            key: t.key,
+            class: "o-search-panel-item",
+            onClick: (y) => r("suggest-click", t)
+          }, [
+            m(K, {
+              text: t.key,
+              keyword: e.keyword,
+              enabled: e.highlightKeyword
+            }, null, 8, ["text", "keyword", "enabled"])
+          ], 8, Q))), 128)) : (s(), o("div", U, c(e.noDataText ?? l(v)("search.noData")), 1))
+        ], !0)
+      ])) : d("", !0),
+      H.value ? (s(), o("div", W, [
+        a(n.$slots, "recommend-header", { items: e.recommendItems }, void 0, !0),
+        a(n.$slots, "recommend-content", { items: e.recommendItems }, () => [
+          (s(!0), o(k, null, g(e.recommendItems, (t) => (s(), o("div", {
+            key: t,
+            class: "o-search-panel-recommend-item",
+            onClick: (y) => r("recommend-click", t)
+          }, c(t), 9, X))), 128))
+        ], !0)
+      ])) : d("", !0),
+      D.value ? (s(), o("div", Y, [
+        a(n.$slots, "history-header", { items: e.historyItems }, () => [
+          h("div", Z, [
+            h("span", _, c(e.historyTitle ?? l(v)("search.history")), 1),
+            e.historyLayout !== "list" ? (s(), L(l(C), {
+              key: 0,
+              class: "o-search-panel-icon",
+              onClick: w[0] || (w[0] = I((t) => r("history-clear"), ["stop"]))
+            }, {
+              default: p(() => [
+                m(l(x))
+              ]),
+              _: 1
+            })) : d("", !0)
+          ])
+        ], !0),
+        a(n.$slots, "history-content", { items: e.historyItems }, () => [
+          e.historyLayout === "list" ? (s(!0), o(k, { key: 0 }, g(e.historyItems, (t) => (s(), o("div", {
+            key: t,
+            class: "o-search-panel-history-row",
+            onClick: (y) => r("history-click", t)
+          }, [
+            h("span", te, c(t), 1)
+          ], 8, ee))), 128)) : (s(), o("div", se, [
+            (s(!0), o(k, null, g(e.historyItems, (t) => (s(), o("div", {
+              key: t,
+              class: N(["o-search-panel-history-item", { "is-dark": e.isDark }]),
+              onClick: (y) => r("history-click", t)
+            }, [
+              h("span", ne, c(t), 1),
+              m(l(C), {
+                class: "o-search-panel-history-remove",
+                onClick: I((y) => r("history-remove", t), ["stop"])
+              }, {
+                default: p(() => [
+                  m(l(V))
+                ]),
+                _: 1
+              }, 8, ["onClick"])
+            ], 10, oe))), 128))
+          ]))
+        ], !0)
+      ])) : d("", !0),
+      b.value ? (s(), o("div", le)) : d("", !0),
+      B.value ? (s(), o("div", ae, [
+        a(n.$slots, "hot-header", { items: e.hotItems }, () => [
+          h("div", ce, [
+            h("div", ie, c(e.hotTitle ?? l(v)("search.hot")), 1),
+            m(l(C), {
+              class: "o-search-panel-icon",
+              onClick: w[1] || (w[1] = I((t) => r("hot-refresh"), ["stop"]))
+            }, {
+              default: p(() => [
+                m(l(R))
+              ]),
+              _: 1
+            })
+          ])
+        ], !0),
+        a(n.$slots, "hot-content", { items: e.hotItems }, () => [
+          h("div", re, [
+            (s(!0), o(k, null, g(e.hotItems, (t) => (s(), o("div", {
+              key: t,
+              class: "o-search-panel-hot-item",
+              onClick: (y) => r("hot-click", t)
+            }, c(t), 9, he))), 128))
+          ])
+        ], !0)
+      ])) : d("", !0)
+    ]));
+  }
+});
+export {
+  fe as default
+};

package/dist/esm/components/section/OSection.css

@@ -0,0 +1,173 @@
+.hover-icon-rotate .o-icon[data-v-dae37748] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-dae37748] {
+    transform: rotate(-180deg);
+}
+}
+.app-section[data-v-dae37748] {
+  --o-gap-section: var(--o-gap-7);
+}
+.app-section .section-wrapper[data-v-dae37748] {
+  margin: var(--o-gap-section) auto 0;
+}
+.app-section.is-full .section-body[data-v-dae37748] {
+  max-width: 100%;
+  width: 100%;
+  padding: 0;
+}
+.app-section:last-child .section-wrapper[data-v-dae37748] {
+  padding-bottom: var(--o-gap-section);
+}
+.app-section .section-header.is-left .section-title[data-v-dae37748],
+.app-section .section-header.is-left .section-subtitle[data-v-dae37748] {
+  justify-content: start;
+}
+.app-section .section-title[data-v-dae37748] {
+  max-width: var(--layout-content-max-width);
+  padding: 0 var(--layout-content-padding);
+  margin: 0 auto;
+  display: flex;
+  justify-content: center;
+  color: var(--o-color-info1);
+  text-align: center;
+  font-size: 40px;
+  line-height: 56px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.app-section .section-title[data-v-dae37748] {
+    font-size: 32px;
+    line-height: 44px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.app-section .section-title[data-v-dae37748] {
+    font-size: 24px;
+    line-height: 32px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.app-section .section-title[data-v-dae37748] {
+    font-size: 22px;
+    line-height: 30px;
+}
+}
+@media (max-width: 600px) {
+.app-section .section-title[data-v-dae37748] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+.app-section .section-title[data-v-dae37748] {
+  font-weight: 500;
+}
+.app-section .section-subtitle[data-v-dae37748] {
+  max-width: var(--layout-content-max-width);
+  padding: 0 var(--layout-content-padding);
+  margin: 0 auto;
+  display: flex;
+  justify-content: center;
+  margin-top: 12px;
+  color: var(--o-color-info2);
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (min-width: 601px) and (max-width: 1680px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    margin-top: 8px;
+}
+}
+@media (max-width: 600px) {
+.app-section .section-subtitle[data-v-dae37748] {
+    margin-top: 12px;
+    text-align: center;
+}
+}
+.app-section .section-body[data-v-dae37748] {
+  max-width: var(--layout-content-max-width);
+  padding: 0 var(--layout-content-padding);
+  margin: 0 auto;
+  margin-top: var(--o-gap-7);
+}
+.app-section .section-footer[data-v-dae37748] {
+  max-width: var(--layout-content-max-width);
+  padding: 0 var(--layout-content-padding);
+  margin: 0 auto;
+  color: var(--o-color-info1);
+  display: flex;
+  justify-content: center;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.app-section .section-footer[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.app-section .section-footer[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.app-section .section-footer[data-v-dae37748] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.app-section .section-footer[data-v-dae37748] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.app-section .section-footer[data-v-dae37748] {
+  margin-top: 32px;
+}
+.app-section .section-footer[data-v-dae37748] .o-btn {
+  border-radius: var(--btn-height);
+}
+@media (max-width: 1680px) {
+.app-section .section-footer[data-v-dae37748] {
+    margin-top: 16px;
+}
+}
+@media (max-width: 600px) {
+.app-section .section-footer[data-v-dae37748] {
+    margin-top: 12px;
+}
+}
+.app-section .section-footer:hover .footer-icon[data-v-dae37748] {
+  fill: var(--link-color-active);
+}
+.app-section .footer-icon[data-v-dae37748] {
+  font-size: 16px;
+  height: 24px;
+}

package/dist/esm/components/section/OSection.vue.mjs

@@ -0,0 +1,7 @@
+import o from "./OSection.vue2.mjs";
+import './OSection.css';
+import t from "../../_plugin-vue_export-helper.mjs";
+const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-dae37748"]]);
+export {
+  e as default
+};

package/dist/esm/components/section/OSection.vue2.mjs

@@ -0,0 +1,84 @@
+import { defineComponent as h, openBlock as o, createElementBlock as s, normalizeClass as c, createElementVNode as m, renderSlot as l, unref as i, Fragment as y, renderList as k, toDisplayString as a, createTextVNode as n, createCommentVNode as r, createVNode as u, withCtx as d } from "vue";
+import { isArray as v, OLink as $, OIcon as b } from "@opensig/opendesign";
+import _ from "../../icons/icon-chevron-right.mjs";
+const C = { class: "section-wrapper" }, g = {
+  key: 1,
+  class: "section-title"
+}, B = {
+  key: 2,
+  class: "section-subtitle"
+}, N = {
+  key: 1,
+  class: "section-body"
+}, V = {
+  key: 2,
+  class: "section-footer"
+}, H = /* @__PURE__ */ h({
+  __name: "OSection",
+  props: {
+    title: { default: void 0 },
+    subtitle: { default: void 0 },
+    full: { type: Boolean, default: !1 },
+    headerJustifyCenter: { type: Boolean, default: !0 },
+    footer: { default: void 0 },
+    footerHref: { default: void 0 }
+  },
+  setup(p) {
+    const e = p;
+    return (t, O) => (o(), s("div", {
+      class: c(["app-section", { "is-full": e.full }])
+    }, [
+      m("div", C, [
+        l(t.$slots, "main", {}, () => [
+          t.$slots.header || e.title || e.subtitle ? (o(), s("div", {
+            key: 0,
+            class: c(["section-header", { "is-left": !e.headerJustifyCenter }])
+          }, [
+            l(t.$slots, "header", {}, () => [
+              i(v)(e.title) ? (o(!0), s(y, { key: 0 }, k(e.title, (f) => (o(), s("h2", {
+                key: f,
+                class: "section-title"
+              }, a(f), 1))), 128)) : t.$slots.title || e.title ? (o(), s("h2", g, [
+                l(t.$slots, "title", {}, () => [
+                  n(a(e.title), 1)
+                ], !0)
+              ])) : r("", !0),
+              t.$slots.subtitle || e.subtitle ? (o(), s("p", B, [
+                l(t.$slots, "subtitle", {}, () => [
+                  n(a(e.subtitle), 1)
+                ], !0)
+              ])) : r("", !0)
+            ], !0)
+          ], 2)) : r("", !0),
+          t.$slots.default ? (o(), s("div", N, [
+            l(t.$slots, "default", {}, void 0, !0)
+          ])) : r("", !0),
+          t.$slots.footer || e.footer ? (o(), s("div", V, [
+            l(t.$slots, "footer", {}, () => [
+              u(i($), {
+                href: e.footerHref,
+                target: "_blank"
+              }, {
+                suffix: d(() => [
+                  u(i(b), { class: "footer-icon" }, {
+                    default: d(() => [
+                      u(i(_))
+                    ]),
+                    _: 1
+                  })
+                ]),
+                default: d(() => [
+                  n(a(e.footer) + " ", 1)
+                ]),
+                _: 1
+              }, 8, ["href"])
+            ], !0)
+          ])) : r("", !0)
+        ], !0)
+      ])
+    ], 2));
+  }
+});
+export {
+  H as default
+};

package/dist/esm/components/section/index.mjs

@@ -0,0 +1,9 @@
+import o from "./OSection.vue.mjs";
+const c = Object.assign(o, {
+  install(t) {
+    t.component("OSection", o);
+  }
+});
+export {
+  c as OSection
+};