@opendesign-plus-test/components 0.0.1-rc.146 → 0.0.1-rc.148

package/dist/treeshaking/components/common/ThFilter.css

@@ -1,146 +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);
-}
-}
-.th-filter-wrapper {
-  display: flex;
-  column-gap: var(--o-gap-2);
-  flex-wrap: nowrap;
-  align-items: center;
-}
-.th-filter-wrapper > span:first-child {
-  word-break: keep-all;
-}
-.th-filter-wrapper .filter-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-}
-.th-filter-wrapper .filter-wrapper > * {
-  flex-shrink: 0;
-}
-.th-filter-wrapper .filter-wrapper .filter-hover-icon {
-  display: none;
-}
-.th-filter-wrapper .filter-wrapper .filter-icon {
-  font-size: 24px;
-  line-height: 32px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 20px;
-    line-height: 28px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (max-width: 600px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 16px;
-    line-height: 24px;
-}
-}
-.th-filter-wrapper .filter-wrapper:hover .filter-icon, .th-filter-wrapper .filter-wrapper.has-checked .filter-icon {
-  color: var(--o-color-primary1);
-}
-.th-filter-wrapper .filter-wrapper:hover .o-icon path, .th-filter-wrapper .filter-wrapper.has-checked .o-icon path {
-  fill: currentColor;
-}
-.th-filter-dropdown .o-dropdown-item {
-  min-width: 80px;
-  max-width: calc(var(--table-width, 300) * 0.8px);
-  --dropdown-item-justify: flex-start;
-  --dropdown-item-padding: 7px 12px;
-}
-.th-filter-dropdown .o-dropdown-item.is-active {
-  font-weight: 500;
-  background-color: var(--dropdown-item-bg-color-hover);
-  color: var(--dropdown-item-color-hover);
-}
-.th-filter-popover {
-  --popup-radius: var(--o-radius-xs);
-}
-.th-filter-popover .o-popup-body {
-  padding: var(--o-gap-2) 0 0 0;
-}
-.th-filter-popover .list-content-wrapper {
-  display: flex;
-}
-.th-filter-popover .list-content-wrapper .o-scrollbar-wrapper:first-child {
-  border-right: 1px solid rgb(224, 226, 230);
-}
-.th-filter-popover .content-wrapper {
-  padding: 0 var(--o-gap-4);
-  overflow: auto;
-  max-height: 300px;
-}
-.th-filter-popover .content-wrapper .o-checkbox-group {
-  flex-shrink: 0;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label {
-  flex-grow: 1;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper {
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper .o-svg-icon {
-  font-size: 24px;
-}
-.th-filter-popover .btn-wrapper {
-  min-width: 158px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding-bottom: var(--o-gap-3);
-  font-size: 16px;
-  line-height: 24px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 600px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-.th-filter-popover .btn-wrapper .o-link {
-  width: 80px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}

package/dist/treeshaking/components/common/ThFilter.vue.mjs

@@ -1,270 +0,0 @@
-import { defineComponent, computed, ref, watch, resolveComponent, openBlock, createElementBlock, createElementVNode, renderSlot, createBlock, unref, withCtx, createVNode, Fragment, renderList, withDirectives, createTextVNode, toDisplayString, normalizeClass, normalizeStyle, createCommentVNode, nextTick, h } from "vue";
-import { OPopover, OScroller, OCheckboxGroup, OCheckbox, ODivider, OLink, OIcon, ODropdown, ODropdownItem } from "@opensig/opendesign";
-import IconFilter from "../../_virtual/icon-filter.mjs";
-import { useI18n } from "../../i18n/index.mjs";
-import { buildVueDompurifyHTMLDirective } from "vue-dompurify-html";
-const _hoisted_1 = {
-  class: "th-filter-wrapper",
-  ref: "filterRef"
-};
-const _hoisted_2 = {
-  key: 1,
-  class: "list-content-wrapper"
-};
-const _hoisted_3 = { class: "btn-wrapper" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "ThFilter",
-  props: {
-    modelValue: {},
-    list: { default: () => [] },
-    multiple: { type: Boolean, default: false },
-    tableWidth: {}
-  },
-  emits: ["update:model-value", "confirm"],
-  setup(__props, { emit: __emit }) {
-    const vDompurifyHtml = buildVueDompurifyHTMLDirective();
-    const { t } = useI18n();
-    const props = __props;
-    const emits = __emit;
-    const isCascader = computed(() => props.list.some((v) => {
-      var _a;
-      return (_a = v.children) == null ? void 0 : _a.length;
-    }));
-    const options = computed(() => {
-      return props.list.map((v) => {
-        const children = (v.children || []).map((t2) => {
-          return {
-            label: t2.label,
-            value: t2.value
-          };
-        });
-        return {
-          label: v.label,
-          value: v.value,
-          children: isCascader.value ? children : void 0
-        };
-      });
-    });
-    const visible = ref(false);
-    watch(
-      () => props.modelValue,
-      (val) => {
-        if (!props.multiple) {
-          checked.value = val;
-        } else {
-          multiChecked.value = val;
-        }
-      }
-    );
-    const multiChecked = ref([]);
-    const change = (val) => {
-      multiChecked.value = val;
-    };
-    const cascaderValue = ref([]);
-    const checked = ref(null);
-    const handleCommand = (val) => {
-      if (checked.value === val) {
-        checked.value = null;
-      } else {
-        checked.value = val;
-      }
-      confirmFn();
-    };
-    const reset = () => {
-      multiChecked.value = [];
-      cascaderValue.value = [];
-      checked.value = null;
-      confirmFn();
-    };
-    const confirmFn = () => {
-      let finalValue = null;
-      if (!props.multiple) {
-        finalValue = checked.value;
-      } else if (isCascader.value) {
-        finalValue = cascaderValue.value;
-      } else {
-        finalValue = multiChecked.value;
-      }
-      emits("update:model-value", finalValue);
-      visible.value = true;
-      nextTick(() => {
-        emits("confirm");
-        visible.value = false;
-      });
-    };
-    const hasChecked = computed(() => {
-      return multiChecked.value.length || cascaderValue.value.length || checked.value || props.modelValue;
-    });
-    const aref = ref(null);
-    const clickLabelSpan = async (e) => {
-      var _a, _b;
-      const ele = e.target.parentElement.parentElement;
-      await nextTick();
-      const input = ele.querySelector("input");
-      input.click();
-      await nextTick();
-      (_a = input.change) == null ? void 0 : _a.call(input, input);
-      await nextTick();
-      (_b = aref.value) == null ? void 0 : _b.$forceUpdate();
-      cascaderValue.value = JSON.parse(JSON.stringify(cascaderValue.value));
-    };
-    const renderLabel = ({ data }) => {
-      return h("span", { onclick: clickLabelSpan }, data.label);
-    };
-    return (_ctx, _cache) => {
-      const _component_ElCascaderPanel = resolveComponent("ElCascaderPanel");
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createElementVNode("span", null, [
-          renderSlot(_ctx.$slots, "default")
-        ]),
-        __props.multiple ? (openBlock(), createBlock(unref(OPopover), {
-          key: 0,
-          visible: visible.value,
-          position: "bottom",
-          wrapClass: "th-filter-popover",
-          trigger: "click",
-          anchor: false
-        }, {
-          target: withCtx(() => [
-            createElementVNode("div", {
-              class: normalizeClass(["filter-wrapper", hasChecked.value && "has-checked"])
-            }, [
-              createVNode(unref(OIcon), { class: "filter-icon" }, {
-                default: withCtx(() => [
-                  createVNode(unref(IconFilter))
-                ]),
-                _: 1
-              })
-            ], 2)
-          ]),
-          default: withCtx(() => [
-            !isCascader.value ? (openBlock(), createBlock(unref(OScroller), {
-              key: 0,
-              class: "content-wrapper",
-              "show-type": "hover",
-              "disabled-x": ""
-            }, {
-              default: withCtx(() => [
-                createVNode(unref(OCheckboxGroup), {
-                  direction: "v",
-                  onChange: change,
-                  modelValue: multiChecked.value,
-                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => multiChecked.value = $event)
-                }, {
-                  default: withCtx(() => [
-                    (openBlock(true), createElementBlock(Fragment, null, renderList(options.value, (item) => {
-                      return openBlock(), createBlock(unref(OCheckbox), {
-                        key: item.value,
-                        value: item.value
-                      }, {
-                        default: withCtx(() => [
-                          withDirectives(createElementVNode("span", null, null, 512), [
-                            [unref(vDompurifyHtml), item.label]
-                          ])
-                        ]),
-                        _: 2
-                      }, 1032, ["value"]);
-                    }), 128))
-                  ]),
-                  _: 1
-                }, 8, ["modelValue"])
-              ]),
-              _: 1
-            })) : (openBlock(), createElementBlock("div", _hoisted_2, [
-              createVNode(_component_ElCascaderPanel, {
-                ref_key: "aref",
-                ref: aref,
-                expandTrigger: "hover",
-                renderLabel,
-                modelValue: cascaderValue.value,
-                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => cascaderValue.value = $event),
-                style: { "width": "fit-content" },
-                options: options.value,
-                props: { multiple: true, expandTrigger: "hover" }
-              }, null, 8, ["modelValue", "options"])
-            ])),
-            createVNode(unref(ODivider)),
-            createElementVNode("div", _hoisted_3, [
-              createVNode(unref(OLink), { onClick: reset }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(unref(t)("common.reset")), 1)
-                ]),
-                _: 1
-              }),
-              createVNode(unref(OLink), { onClick: confirmFn }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(unref(t)("common.confirm")), 1)
-                ]),
-                _: 1
-              })
-            ])
-          ]),
-          _: 1
-        }, 8, ["visible"])) : (openBlock(), createBlock(unref(ODropdown), {
-          key: 1,
-          optionPosition: "bottom",
-          optionWrapClass: "th-filter-dropdown",
-          modelValue: checked.value,
-          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => checked.value = $event)
-        }, {
-          dropdown: withCtx(() => [
-            options.value.length ? (openBlock(), createBlock(unref(OScroller), {
-              key: 0,
-              "disabled-x": "",
-              style: { "max-height": "300px" },
-              "show-type": "always"
-            }, {
-              default: withCtx(() => [
-                createVNode(unref(ODropdownItem), {
-                  style: normalizeStyle({
-                    "--table-width": __props.tableWidth
-                  }),
-                  class: normalizeClass([{ "is-active": __props.modelValue === "" }]),
-                  value: "''",
-                  label: unref(t)("common.all"),
-                  onClick: _cache[2] || (_cache[2] = ($event) => handleCommand(""))
-                }, null, 8, ["style", "class", "label"]),
-                (openBlock(true), createElementBlock(Fragment, null, renderList(options.value, (item) => {
-                  return openBlock(), createBlock(unref(ODropdownItem), {
-                    style: normalizeStyle({
-                      "--table-width": __props.tableWidth
-                    }),
-                    class: normalizeClass([{ "is-active": item.value === __props.modelValue }]),
-                    key: item.value,
-                    value: item.value,
-                    onClick: ($event) => handleCommand(item.value)
-                  }, {
-                    default: withCtx(() => [
-                      withDirectives(createElementVNode("span", null, null, 512), [
-                        [unref(vDompurifyHtml), item.label]
-                      ])
-                    ]),
-                    _: 2
-                  }, 1032, ["style", "class", "value", "onClick"]);
-                }), 128))
-              ]),
-              _: 1
-            })) : createCommentVNode("", true),
-            !options.value.length ? renderSlot(_ctx.$slots, "empty", { key: 1 }) : createCommentVNode("", true)
-          ]),
-          default: withCtx(() => [
-            createElementVNode("div", {
-              class: normalizeClass(["filter-wrapper", hasChecked.value && "has-checked"])
-            }, [
-              createVNode(unref(OIcon), { class: "filter-icon" }, {
-                default: withCtx(() => [
-                  createVNode(unref(IconFilter))
-                ]),
-                _: 1
-              })
-            ], 2)
-          ]),
-          _: 3
-        }, 8, ["modelValue"]))
-      ], 512);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};

package/dist/treeshaking/components/common/ThFilter.vue3.mjs

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