@opendesign-plus-test/components 0.0.1-rc.220 → 0.0.1-rc.221

package/dist/treeshaking/components/search-result/components/OSearchResultFeedback.css

@@ -0,0 +1,154 @@
+.hover-icon-rotate .o-icon[data-v-bf624516] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-bf624516] {
+    transform: rotate(-180deg);
+}
+}
+.o-search-result-feedback[data-v-bf624516] {
+  --o-search-result-feedback-radius: var(--o-search-result-radius, var(--o-radius-xs));
+  max-width: var(--grid-4);
+  color: var(--o-color-info1);
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback[data-v-bf624516] {
+    max-width: var(--grid-5);
+}
+}
+.o-search-result-feedback .o-search-result-feedback-title[data-v-bf624516] {
+  display: flex;
+  align-items: center;
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 28px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-title[data-v-bf624516] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback .o-search-result-feedback-title[data-v-bf624516] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback .o-search-result-feedback-title[data-v-bf624516] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback .o-search-result-feedback-title[data-v-bf624516] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-icon-edit[data-v-bf624516] {
+  margin-right: 12px;
+  font-size: 24px;
+  line-height: 32px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-icon-edit[data-v-bf624516] {
+    font-size: 20px;
+    line-height: 28px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback .o-search-result-feedback-icon-edit[data-v-bf624516] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback .o-search-result-feedback-icon-edit[data-v-bf624516] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback .o-search-result-feedback-icon-edit[data-v-bf624516] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-divider[data-v-bf624516] {
+  margin: 12px 0;
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-divider[data-v-bf624516] {
+    margin: 8px 0;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-desc[data-v-bf624516] {
+  color: var(--o-color-info2);
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-desc[data-v-bf624516] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback .o-search-result-feedback-desc[data-v-bf624516] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback .o-search-result-feedback-desc[data-v-bf624516] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback .o-search-result-feedback-desc[data-v-bf624516] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-btn[data-v-bf624516] {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin-top: 12px;
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-btn[data-v-bf624516] {
+    margin-top: 8px;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-input-wrap[data-v-bf624516] {
+  margin-top: 12px;
+  padding: 16px;
+  background-color: var(--o-color-fill1);
+  border-radius: var(--o-search-result-feedback-radius);
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback .o-search-result-feedback-input-wrap[data-v-bf624516] {
+    margin-top: 8px;
+    padding: 12px;
+}
+}
+.o-search-result-feedback .o-search-result-feedback-textarea[data-v-bf624516] {
+  width: 100%;
+}
+.o-search-result-feedback .o-search-result-feedback-input-btn[data-v-bf624516] {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 16px;
+  margin-top: 12px;
+}
+.o-search-result-feedback .o-search-result-message-wrap[data-v-bf624516] {
+  margin-top: 12px;
+}
+.o-search-result-feedback .o-search-result-message[data-v-bf624516] {
+  --message-padding: 8px 10px;
+}

package/dist/treeshaking/components/search-result/components/OSearchResultFeedback.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    submit?: (form: {
+        searchFlag: boolean;
+        feedbackText: string;
+    }) => Promise<boolean>;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/treeshaking/components/search-result/components/OSearchResultFeedback.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./OSearchResultFeedback.vue2.mjs";
+import './OSearchResultFeedback.css';
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const OSearchResultFeedback = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bf624516"]]);
+export {
+  OSearchResultFeedback as default
+};

package/dist/treeshaking/components/search-result/components/OSearchResultFeedback.vue2.mjs

@@ -0,0 +1,171 @@
+import { defineComponent, ref, openBlock, createElementBlock, createElementVNode, createVNode, unref, withCtx, toDisplayString, createTextVNode, createCommentVNode } from "vue";
+import { OIcon, ODivider, OButton, OTextarea, OMessage } from "@opensig/opendesign";
+import { useI18n } from "../../../i18n/index.mjs";
+import IconEdit from "../../../_virtual/icon-edit.mjs";
+import IconLike from "../../../_virtual/icon-like.mjs";
+import IconUnlike from "../../../_virtual/icon-unlike.mjs";
+const _hoisted_1 = { class: "o-search-result-feedback" };
+const _hoisted_2 = { class: "o-search-result-feedback-title" };
+const _hoisted_3 = { class: "o-search-result-feedback-desc" };
+const _hoisted_4 = { class: "o-search-result-feedback-btn" };
+const _hoisted_5 = {
+  key: 0,
+  class: "o-search-result-feedback-input-wrap"
+};
+const _hoisted_6 = { class: "o-search-result-feedback-input-btn" };
+const _hoisted_7 = {
+  key: 1,
+  class: "o-search-result-message-wrap"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OSearchResultFeedback",
+  props: {
+    submit: { type: Function }
+  },
+  setup(__props) {
+    const { t } = useI18n();
+    const props = __props;
+    const showInput = ref(false);
+    const loading = ref(false);
+    const input = ref("");
+    const submitStatus = ref(false);
+    const showMessage = ref(false);
+    const onClickNotFound = () => {
+      if (loading.value) {
+        return;
+      }
+      showInput.value = true;
+      showMessage.value = false;
+    };
+    const onClickCancelInput = () => {
+      showInput.value = false;
+      input.value = "";
+    };
+    let messageTimer;
+    const onSubmit = async (searchFlag) => {
+      if (loading.value || !props.submit) {
+        return;
+      }
+      loading.value = true;
+      if (searchFlag) {
+        onClickCancelInput();
+      }
+      submitStatus.value = await props.submit({
+        searchFlag,
+        feedbackText: searchFlag ? input.value : ""
+      });
+      onClickCancelInput();
+      clearTimeout(messageTimer);
+      showMessage.value = true;
+      messageTimer = setTimeout(() => {
+        showMessage.value = false;
+      }, 3e3);
+      loading.value = false;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createVNode(unref(OIcon), { class: "o-search-result-feedback-icon-edit" }, {
+            default: withCtx(() => [
+              createVNode(unref(IconEdit))
+            ]),
+            _: 1
+          }),
+          createElementVNode("span", null, toDisplayString(unref(t)("search.feedback")), 1)
+        ]),
+        createVNode(unref(ODivider), { class: "o-search-result-feedback-divider" }),
+        createElementVNode("div", _hoisted_3, toDisplayString(unref(t)("search.feedbackDesc")), 1),
+        createElementVNode("div", _hoisted_4, [
+          createVNode(unref(OButton), {
+            color: "primary",
+            size: "large",
+            round: "pill",
+            onClick: _cache[0] || (_cache[0] = ($event) => onSubmit(true))
+          }, {
+            icon: withCtx(() => [
+              createVNode(unref(OIcon), null, {
+                default: withCtx(() => [
+                  createVNode(unref(IconLike))
+                ]),
+                _: 1
+              })
+            ]),
+            default: withCtx(() => [
+              createTextVNode(" " + toDisplayString(unref(t)("search.found")), 1)
+            ]),
+            _: 1
+          }),
+          createVNode(unref(OButton), {
+            color: "primary",
+            size: "large",
+            round: "pill",
+            onClick: onClickNotFound
+          }, {
+            icon: withCtx(() => [
+              createVNode(unref(OIcon), null, {
+                default: withCtx(() => [
+                  createVNode(unref(IconUnlike))
+                ]),
+                _: 1
+              })
+            ]),
+            default: withCtx(() => [
+              createTextVNode(" " + toDisplayString(unref(t)("search.notFound")), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        showInput.value ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          createVNode(unref(OTextarea), {
+            modelValue: input.value,
+            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => input.value = $event),
+            class: "o-search-result-feedback-textarea",
+            placeholder: unref(t)("search.notFoundPlaceholder"),
+            "max-length": 200,
+            resize: "none"
+          }, null, 8, ["modelValue", "placeholder"]),
+          createElementVNode("div", _hoisted_6, [
+            createVNode(unref(OButton), {
+              loading: loading.value,
+              disabled: loading.value,
+              color: "primary",
+              round: "pill",
+              variant: "solid",
+              onClick: _cache[2] || (_cache[2] = ($event) => onSubmit(false))
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("search.submitFeedback")), 1)
+              ]),
+              _: 1
+            }, 8, ["loading", "disabled"]),
+            createVNode(unref(OButton), {
+              disabled: loading.value,
+              color: "primary",
+              round: "pill",
+              onClick: onClickCancelInput
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("search.cancel")), 1)
+              ]),
+              _: 1
+            }, 8, ["disabled"])
+          ])
+        ])) : createCommentVNode("", true),
+        showMessage.value ? (openBlock(), createElementBlock("div", _hoisted_7, [
+          createVNode(unref(OMessage), {
+            class: "o-search-result-message",
+            status: submitStatus.value ? "success" : "danger"
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(submitStatus.value ? unref(t)("feedback.submitSuccess") : unref(t)("feedback.submitFailed")), 1)
+            ]),
+            _: 1
+          }, 8, ["status"])
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/search-result/components/OSearchResultFeedbackBanner.css

@@ -0,0 +1,188 @@
+.hover-icon-rotate .o-icon[data-v-b3c8f1f6] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-b3c8f1f6] {
+    transform: rotate(-180deg);
+}
+}
+.o-search-result-feedback-banner[data-v-b3c8f1f6] {
+  --o-search-result-feedback-radius: var(--o-search-result-radius, var(--o-radius-xs));
+  padding: 32px;
+  background-color: var(--o-color-fill1);
+  border-radius: var(--o-search-result-feedback-radius);
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback-banner[data-v-b3c8f1f6] {
+    padding: 16px 24px;
+}
+}
+@media (max-width: 1200px) {
+.o-search-result-feedback-banner[data-v-b3c8f1f6] {
+    padding: 12px 16px;
+}
+}
+@media (max-width: 840px) {
+.o-search-result-feedback-banner[data-v-b3c8f1f6] {
+    padding: 12px;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+  display: flex;
+  align-items: center;
+  font-size: 18px;
+  line-height: 26px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-content[data-v-b3c8f1f6] {
+    flex-direction: column;
+    align-items: flex-start;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-icon-edit[data-v-b3c8f1f6] {
+  margin-right: 8px;
+  font-size: 24px;
+  line-height: 32px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback-banner .o-search-result-feedback-icon-edit[data-v-b3c8f1f6] {
+    font-size: 20px;
+    line-height: 28px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback-banner .o-search-result-feedback-icon-edit[data-v-b3c8f1f6] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-icon-edit[data-v-b3c8f1f6] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback-banner .o-search-result-feedback-icon-edit[data-v-b3c8f1f6] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-banner-btns[data-v-b3c8f1f6] {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin-left: 48px;
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-btns[data-v-b3c8f1f6] {
+    margin-left: 24px;
+}
+}
+@media (max-width: 1200px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-btns[data-v-b3c8f1f6] {
+    margin-left: 16px;
+}
+}
+@media (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-banner-btns[data-v-b3c8f1f6] {
+    margin-left: 0;
+    margin-top: 16px;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-input-wrap[data-v-b3c8f1f6] {
+  margin-top: 16px;
+  padding-left: 32px;
+  background-color: var(--o-color-fill1);
+  border-radius: var(--o-search-result-feedback-radius);
+}
+@media (max-width: 1680px) {
+.o-search-result-feedback-banner .o-search-result-feedback-input-wrap[data-v-b3c8f1f6] {
+    margin-top: 12px;
+    padding-left: 28px;
+}
+}
+@media (max-width: 1200px) {
+.o-search-result-feedback-banner .o-search-result-feedback-input-wrap[data-v-b3c8f1f6] {
+    padding-left: 24px;
+}
+}
+@media (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-input-wrap[data-v-b3c8f1f6] {
+    padding-left: 0;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-textarea[data-v-b3c8f1f6] {
+  width: 100%;
+}
+.o-search-result-feedback-banner .o-search-result-feedback-input-btn[data-v-b3c8f1f6] {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin-top: 12px;
+}
+.o-search-result-feedback-banner .o-search-result-feedback-mb-title[data-v-b3c8f1f6] {
+  display: flex;
+  align-items: center;
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 28px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.o-search-result-feedback-banner .o-search-result-feedback-mb-title[data-v-b3c8f1f6] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.o-search-result-feedback-banner .o-search-result-feedback-mb-title[data-v-b3c8f1f6] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.o-search-result-feedback-banner .o-search-result-feedback-mb-title[data-v-b3c8f1f6] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (max-width: 600px) {
+.o-search-result-feedback-banner .o-search-result-feedback-mb-title[data-v-b3c8f1f6] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+.o-search-result-feedback-banner .o-search-result-feedback-divider[data-v-b3c8f1f6] {
+  margin: 8px 0;
+}
+.o-search-result-feedback-banner .o-search-result-feedback-mb-desc[data-v-b3c8f1f6] {
+  font-size: 14px;
+  line-height: 22px;
+}
+.o-search-result-feedback-banner .o-search-result-message-wrap[data-v-b3c8f1f6] {
+  margin-top: 12px;
+}

package/dist/treeshaking/components/search-result/components/OSearchResultFeedbackBanner.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    submit?: (form: {
+        searchFlag: boolean;
+        feedbackText: string;
+    }) => Promise<boolean>;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/treeshaking/components/search-result/components/OSearchResultFeedbackBanner.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./OSearchResultFeedbackBanner.vue2.mjs";
+import './OSearchResultFeedbackBanner.css';
+import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
+const OSearchResultFeedbackBanner = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b3c8f1f6"]]);
+export {
+  OSearchResultFeedbackBanner as default
+};