@wfrog/vc-ui 1.3.1 → 1.4.0

package/dist/es/components/explorer-tools/explorer-tools.d.ts

@@ -0,0 +1,35 @@
+import { IColumnConfig } from '../explorer-column-table/explorer-column-table';
+export interface IExplorerToolsProps {
+    tools?: ('search' | 'refresh' | 'fullscreen' | 'setter' | 'layout')[];
+    searchPlaceholder?: string;
+    layout?: 'card' | 'list';
+    create?: boolean;
+    createText?: string;
+    fullscreenTarget?: 'panel' | 'page';
+    throttle?: number;
+    toolsKey?: string;
+    columnSetterSize?: 'small' | 'default' | 'large';
+    columnToStorage?: boolean;
+    columnResetVisible?: boolean;
+}
+export interface IExplorerToolsEmits {
+    (e: 'refresh'): void;
+    (e: 'fullscreen', status: boolean): void;
+    (e: 'search', value: string): void;
+    (e: 'layout', value: 'card' | 'list'): void;
+    (e: 'create'): void;
+    (e: 'configConfirm', config: IColumnConfig[]): void;
+    (e: 'columnReset'): void;
+}
+export interface IColumnSetterProps {
+    data?: IColumnConfig[];
+    size?: 'small' | 'default' | 'large';
+    columnToStorage?: boolean;
+    toolsKey?: string;
+    resetVisible?: boolean;
+}
+export interface IColumnSetterEmits {
+    (e: 'update:data', data: IColumnConfig[]): void;
+    (e: 'configConfirm', data: IColumnConfig[]): void;
+    (e: 'reset'): void;
+}

package/dist/es/components/explorer-tools/explorer-tools.mjs

@@ -0,0 +1,585 @@
+import './index.css'
+import { i as isString, b as buildProps, d as definePropType, u as useNamespace, a as debugWarn, j as isObject } from '../../chunk/By7FMB3I.mjs';
+import { E as ElRadioGroup, a as ElRadioButton } from '../../chunk/BL8WhaLp.mjs';
+import '../choice/choice.mjs';
+import { defineComponent, ref, reactive, computed, watch, createElementBlock, createCommentVNode, openBlock, unref, normalizeClass, createElementVNode, normalizeStyle, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, useTemplateRef, useCssModule, onBeforeMount, createBlock, createSlots, withCtx, createVNode, isRef, nextTick, withKeys } from 'vue';
+import { Search } from '@element-plus/icons-vue';
+import usePersistentModel from '../../use/usePersistentModel/index.mjs';
+import { C as Component$1 } from '../button/button.mjs';
+import { i as injectExplorerPanelState } from '../explorer-panel/explorer-panel2.mjs';
+import { i as injectExplorerState } from '../explorer/explorer2.mjs';
+import { C as Component$4 } from '../iconify-icon/iconify-icon.mjs';
+import { C as Component$3 } from '../input/input.mjs';
+import '../../chunk/BfjuZmry.mjs';
+/* empty css                    */
+import { E as ElDivider } from '../../chunk/DNsAO9iB.mjs';
+import { E as ElText } from '../../chunk/DTbnchOm.mjs';
+import { i as index } from '../../chunk/D9iEroQw.mjs';
+import { C as Component$2 } from '../explorer-column-table/explorer-column-table.mjs';
+import { useActiveElement, useResizeObserver, useVModel, useThrottleFn } from '@vueuse/core';
+import { E as ElPopover } from '../../chunk/DQK0ezHm.mjs';
+import { u as useSizeProp } from '../../chunk/CPCieLBG.mjs';
+import { u as useAriaProps } from '../../chunk/DCS0eqqM.mjs';
+import { C as CHANGE_EVENT, U as UPDATE_MODEL_EVENT } from '../../chunk/Ct6q2FXg.mjs';
+import { b as isNumber, d as isBoolean } from '../../chunk/DViraU6I.mjs';
+import { _ as _export_sfc, w as withInstall } from '../../chunk/dN0VcQc2.mjs';
+import { u as useId } from '../../chunk/Co77DVCw.mjs';
+import { c as useFormSize, a as useFormDisabled, u as useFormItem, b as useFormItemInputId } from '../../chunk/BvNFaD5d.mjs';
+import { _ as _export_sfc$1 } from '../../chunk/pcqpp-6-.mjs';
+
+const defaultProps = {
+  label: "label",
+  value: "value",
+  disabled: "disabled"
+};
+const segmentedProps = buildProps({
+  direction: {
+    type: definePropType(String),
+    default: "horizontal"
+  },
+  options: {
+    type: definePropType(Array),
+    default: () => []
+  },
+  modelValue: {
+    type: [String, Number, Boolean],
+    default: void 0
+  },
+  props: {
+    type: definePropType(Object),
+    default: () => defaultProps
+  },
+  block: Boolean,
+  size: useSizeProp,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  id: String,
+  name: String,
+  ...useAriaProps(["ariaLabel"])
+});
+const segmentedEmits = {
+  [UPDATE_MODEL_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val),
+  [CHANGE_EVENT]: (val) => isString(val) || isNumber(val) || isBoolean(val)
+};
+
+const _hoisted_1 = ["id", "aria-label", "aria-labelledby"];
+const _hoisted_2 = ["name", "disabled", "checked", "onChange"];
+const _sfc_main$2 = defineComponent({
+  ...{
+    name: "ElSegmented"
+  },
+  __name: "segmented",
+  props: segmentedProps,
+  emits: segmentedEmits,
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const ns = useNamespace("segmented");
+    const segmentedId = useId();
+    const segmentedSize = useFormSize();
+    const _disabled = useFormDisabled();
+    const { formItem } = useFormItem();
+    const { inputId, isLabeledByFormItem } = useFormItemInputId(props, {
+      formItemContext: formItem
+    });
+    const segmentedRef = ref(null);
+    const activeElement = useActiveElement();
+    const state = reactive({
+      isInit: false,
+      width: 0,
+      height: 0,
+      translateX: 0,
+      translateY: 0,
+      focusVisible: false
+    });
+    const handleChange = (evt, item) => {
+      const value = getValue(item);
+      emit(UPDATE_MODEL_EVENT, value);
+      emit(CHANGE_EVENT, value);
+      evt.target.checked = value === props.modelValue;
+    };
+    const aliasProps = computed(() => ({ ...defaultProps, ...props.props }));
+    const intoAny = (item) => item;
+    const getValue = (item) => {
+      return isObject(item) ? item[aliasProps.value.value] : item;
+    };
+    const getLabel = (item) => {
+      return isObject(item) ? item[aliasProps.value.label] : item;
+    };
+    const getDisabled = (item) => {
+      return !!(_disabled.value || (isObject(item) ? item[aliasProps.value.disabled] : false));
+    };
+    const getSelected = (item) => {
+      return props.modelValue === getValue(item);
+    };
+    const getOption = (value) => {
+      return props.options.find((item) => getValue(item) === value);
+    };
+    const getItemCls = (item) => {
+      return [
+        ns.e("item"),
+        ns.is("selected", getSelected(item)),
+        ns.is("disabled", getDisabled(item))
+      ];
+    };
+    const updateSelect = () => {
+      if (!segmentedRef.value)
+        return;
+      const selectedItem = segmentedRef.value.querySelector(
+        ".is-selected"
+      );
+      const selectedItemInput = segmentedRef.value.querySelector(
+        ".is-selected input"
+      );
+      if (!selectedItem || !selectedItemInput) {
+        state.width = 0;
+        state.height = 0;
+        state.translateX = 0;
+        state.translateY = 0;
+        state.focusVisible = false;
+        return;
+      }
+      state.isInit = true;
+      if (props.direction === "vertical") {
+        state.height = selectedItem.offsetHeight;
+        state.translateY = selectedItem.offsetTop;
+      } else {
+        state.width = selectedItem.offsetWidth;
+        state.translateX = selectedItem.offsetLeft;
+      }
+      try {
+        state.focusVisible = selectedItemInput.matches(":focus-visible");
+      } catch (e) {
+      }
+    };
+    const segmentedCls = computed(() => [
+      ns.b(),
+      ns.m(segmentedSize.value),
+      ns.is("block", props.block)
+    ]);
+    const selectedStyle = computed(() => ({
+      width: props.direction === "vertical" ? "100%" : `${state.width}px`,
+      height: props.direction === "vertical" ? `${state.height}px` : "100%",
+      transform: props.direction === "vertical" ? `translateY(${state.translateY}px)` : `translateX(${state.translateX}px)`,
+      display: state.isInit ? "block" : "none"
+    }));
+    const selectedCls = computed(() => [
+      ns.e("item-selected"),
+      ns.is("disabled", getDisabled(getOption(props.modelValue))),
+      ns.is("focus-visible", state.focusVisible)
+    ]);
+    const name = computed(() => {
+      return props.name || segmentedId.value;
+    });
+    useResizeObserver(segmentedRef, updateSelect);
+    watch(activeElement, updateSelect);
+    watch(
+      () => props.modelValue,
+      () => {
+        var _a;
+        updateSelect();
+        if (props.validateEvent) {
+          (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "change").catch((err) => debugWarn(err));
+        }
+      },
+      {
+        flush: "post"
+      }
+    );
+    return (_ctx, _cache) => {
+      return _ctx.options.length ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        id: unref(inputId),
+        ref_key: "segmentedRef",
+        ref: segmentedRef,
+        class: normalizeClass(segmentedCls.value),
+        role: "radiogroup",
+        "aria-label": !unref(isLabeledByFormItem) ? _ctx.ariaLabel || "segmented" : void 0,
+        "aria-labelledby": unref(isLabeledByFormItem) ? unref(formItem).labelId : void 0
+      }, [
+        createElementVNode(
+          "div",
+          {
+            class: normalizeClass([unref(ns).e("group"), unref(ns).m(_ctx.direction)])
+          },
+          [
+            createElementVNode(
+              "div",
+              {
+                style: normalizeStyle(selectedStyle.value),
+                class: normalizeClass(selectedCls.value)
+              },
+              null,
+              6
+            ),
+            (openBlock(true), createElementBlock(
+              Fragment,
+              null,
+              renderList(_ctx.options, (item, index) => {
+                return openBlock(), createElementBlock(
+                  "label",
+                  {
+                    key: index,
+                    class: normalizeClass(getItemCls(item))
+                  },
+                  [
+                    createElementVNode("input", {
+                      class: normalizeClass(unref(ns).e("item-input")),
+                      type: "radio",
+                      name: name.value,
+                      disabled: getDisabled(item),
+                      checked: getSelected(item),
+                      onChange: ($event) => handleChange($event, item)
+                    }, null, 42, _hoisted_2),
+                    createElementVNode(
+                      "div",
+                      {
+                        class: normalizeClass(unref(ns).e("item-label"))
+                      },
+                      [
+                        renderSlot(_ctx.$slots, "default", {
+                          item: intoAny(item)
+                        }, () => [
+                          createTextVNode(
+                            toDisplayString(getLabel(item)),
+                            1
+                          )
+                        ])
+                      ],
+                      2
+                    )
+                  ],
+                  2
+                );
+              }),
+              128
+            ))
+          ],
+          2
+        )
+      ], 10, _hoisted_1)) : createCommentVNode("v-if", true);
+    };
+  }
+});
+var Segmented = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/segmented/src/segmented.vue"]]);
+
+const ElSegmented = withInstall(Segmented);
+
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "column-setter",
+  props: {
+    data: { default: () => [] },
+    size: {},
+    columnToStorage: { type: Boolean },
+    toolsKey: {},
+    resetVisible: { type: Boolean }
+  },
+  emits: ["update:data", "configConfirm", "reset"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const { key } = injectExplorerState();
+    const panelState = injectExplorerPanelState();
+    const myData = useVModel(props, "data", emits);
+    const columnTableRef = useTemplateRef("columnTableRef");
+    const $style = useCssModule();
+    const columnStorageKey = props.toolsKey ? `${key}-${props.toolsKey}-column-config` : `${key}-column-config`;
+    const modeOptions = [
+      { label: "简单设置", value: "easy" },
+      { label: "完整设置", value: "full" }
+    ];
+    const mode = ref("easy");
+    const isFullMode = computed(() => mode.value === "full");
+    const popoverWidth = computed(() => isFullMode.value ? "800px" : "270px");
+    const isInit = ref(false);
+    function onHide() {
+      emits("configConfirm", myData.value);
+      if (!props.columnToStorage) {
+        return;
+      }
+      index.set(columnStorageKey, myData.value);
+    }
+    function loadConfig() {
+      if (props.columnToStorage) {
+        const columnConfig = index.get(columnStorageKey);
+        if (Array.isArray(columnConfig) && columnConfig.length) {
+          myData.value = columnConfig;
+        }
+      } else {
+        index.remove(columnStorageKey);
+      }
+    }
+    async function handleBefore() {
+      isInit.value = true;
+      loadConfig();
+      await nextTick();
+      columnTableRef.value?.init();
+    }
+    onBeforeMount(() => {
+      loadConfig();
+      panelState.actions.saveColumnConfig = onHide;
+    });
+    return (_ctx, _cache) => {
+      const _component_ElText = ElText;
+      const _component_ElSegmented = ElSegmented;
+      const _component_ElDivider = ElDivider;
+      const _component_ElPopover = ElPopover;
+      return openBlock(), createBlock(_component_ElPopover, {
+        placement: "bottom-end",
+        trigger: "click",
+        width: unref(popoverWidth),
+        teleported: false,
+        "show-arrow": false,
+        onHide,
+        onBeforeEnter: handleBefore
+      }, createSlots({
+        reference: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        unref(isInit) ? {
+          name: "default",
+          fn: withCtx(() => [
+            createElementVNode("div", {
+              class: normalizeClass(unref($style).header)
+            }, [
+              createVNode(_component_ElText, { size: "large" }, {
+                default: withCtx(() => [..._cache[3] || (_cache[3] = [
+                  createTextVNode("列设置", -1)
+                ])]),
+                _: 1
+              }),
+              createElementVNode("div", {
+                class: normalizeClass(unref($style)["mode-wrapper"])
+              }, [
+                unref(isFullMode) && __props.resetVisible ? (openBlock(), createBlock(Component$1, {
+                  key: 0,
+                  class: normalizeClass(unref($style).reset),
+                  icon: { name: "RefreshLeft" },
+                  onClick: _cache[0] || (_cache[0] = ($event) => emits("reset"))
+                }, {
+                  default: withCtx(() => [..._cache[4] || (_cache[4] = [
+                    createTextVNode("重置", -1)
+                  ])]),
+                  _: 1
+                }, 8, ["class"])) : createCommentVNode("", true),
+                createVNode(_component_ElSegmented, {
+                  modelValue: unref(mode),
+                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(mode) ? mode.value = $event : null),
+                  options: modeOptions,
+                  class: normalizeClass(unref($style).segmented)
+                }, null, 8, ["modelValue", "class"])
+              ], 2)
+            ], 2),
+            createVNode(_component_ElDivider, {
+              class: normalizeClass(unref($style).divider)
+            }, null, 8, ["class"]),
+            createVNode(Component$2, {
+              ref_key: "columnTableRef",
+              ref: columnTableRef,
+              data: unref(myData),
+              "onUpdate:data": _cache[2] || (_cache[2] = ($event) => isRef(myData) ? myData.value = $event : null),
+              size: __props.size,
+              mode: unref(mode),
+              height: 320
+            }, null, 8, ["data", "size", "mode"])
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["width"]);
+    };
+  }
+});
+
+/* unplugin-vue-components disabled */const header = "_header_971vy_1";
+const segmented = "_segmented_971vy_13";
+const reset = "_reset_971vy_17";
+const divider = "_divider_971vy_21";
+const style0$1 = {
+	header: header,
+	"mode-wrapper": "_mode-wrapper_971vy_7",
+	segmented: segmented,
+	reset: reset,
+	divider: divider
+};
+
+const cssModules$1 = {
+  "$style": style0$1
+};
+const ColumnSetter = /* @__PURE__ */ _export_sfc$1(_sfc_main$1, [["__cssModules", cssModules$1]]);
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "explorer-tools",
+  props: {
+    tools: { default: () => ["refresh", "fullscreen", "setter"] },
+    searchPlaceholder: { default: "请输入搜索内容" },
+    layout: { default: "list" },
+    create: { type: Boolean },
+    createText: { default: "新增" },
+    fullscreenTarget: { default: "page" },
+    throttle: { default: 800 },
+    toolsKey: {},
+    columnSetterSize: { default: "small" },
+    columnToStorage: { type: Boolean },
+    columnResetVisible: { type: Boolean, default: true }
+  },
+  emits: ["refresh", "fullscreen", "search", "layout", "create", "configConfirm", "columnReset"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const { key, fullscreenTarget: pageTarget } = injectExplorerState();
+    const { fullscreenTarget: panelTarget, columnConfig } = injectExplorerPanelState();
+    const $style = useCssModule();
+    const layoutStorageKey = props.toolsKey ? `${key}-${props.toolsKey}-layout` : `${key}-layout`;
+    const myLayout = usePersistentModel("layout", layoutStorageKey, props.layout);
+    const keyword = ref("");
+    const handleSearch = useThrottleFn(() => {
+      emits("search", keyword.value);
+    }, props.throttle);
+    const isFullScreen = ref(false);
+    function toggleFullScreen() {
+      const target = props.fullscreenTarget === "page" ? pageTarget.value : panelTarget.value;
+      if (target) {
+        isFullScreen.value = !isFullScreen.value;
+        isFullScreen.value ? target.classList.add($style.fullscreen) : target.classList.remove($style.fullscreen);
+        emits("fullscreen", isFullScreen.value);
+      }
+    }
+    return (_ctx, _cache) => {
+      const _component_ElRadioButton = ElRadioButton;
+      const _component_ElRadioGroup = ElRadioGroup;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref($style)["explorer-tools"])
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref($style).buttons)
+        }, [
+          __props.create ? (openBlock(), createBlock(Component$1, {
+            key: 0,
+            type: "primary",
+            onClick: _cache[0] || (_cache[0] = ($event) => emits("create"))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(__props.createText), 1)
+            ]),
+            _: 1
+          })) : createCommentVNode("", true),
+          renderSlot(_ctx.$slots, "default")
+        ], 2),
+        Array.isArray(__props.tools) && __props.tools.length > 0 ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(unref($style).tools)
+        }, [
+          __props.tools.includes("search") ? (openBlock(), createBlock(Component$3, {
+            key: 0,
+            modelValue: unref(keyword),
+            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(keyword) ? keyword.value = $event : null),
+            placeholder: __props.searchPlaceholder,
+            clearable: "",
+            "prefix-icon": unref(Search),
+            width: "180px",
+            onKeydown: withKeys(unref(handleSearch), ["enter"]),
+            onClear: unref(handleSearch)
+          }, null, 8, ["modelValue", "placeholder", "prefix-icon", "onKeydown", "onClear"])) : createCommentVNode("", true),
+          __props.tools.includes("layout") ? (openBlock(), createBlock(_component_ElRadioGroup, {
+            key: 1,
+            modelValue: unref(myLayout),
+            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(myLayout) ? myLayout.value = $event : null),
+            class: normalizeClass(unref($style).layout),
+            onChange: _cache[3] || (_cache[3] = ($event) => emits("layout", unref(myLayout)))
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_ElRadioButton, {
+                value: "card",
+                title: "卡片视图"
+              }, {
+                default: withCtx(() => [
+                  createVNode(Component$4, { name: "lucide:layout-grid" })
+                ]),
+                _: 1
+              }),
+              createVNode(_component_ElRadioButton, {
+                value: "list",
+                title: "列表视图"
+              }, {
+                default: withCtx(() => [
+                  createVNode(Component$4, { name: "lucide:table-of-contents" })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["modelValue", "class"])) : createCommentVNode("", true),
+          __props.tools.includes("refresh") ? (openBlock(), createBlock(Component$1, {
+            key: 2,
+            title: "刷新",
+            throttle: __props.throttle,
+            circle: "",
+            icon: { name: "Refresh", type: "el" },
+            onClick: _cache[4] || (_cache[4] = ($event) => emits("refresh"))
+          }, null, 8, ["throttle"])) : createCommentVNode("", true),
+          __props.tools.includes("fullscreen") ? (openBlock(), createBlock(Component$1, {
+            key: 3,
+            title: "全屏",
+            type: unref(isFullScreen) ? "primary" : "default",
+            circle: "",
+            icon: { name: "FullScreen", type: "el" },
+            onClick: toggleFullScreen
+          }, null, 8, ["type"])) : createCommentVNode("", true),
+          __props.tools.includes("setter") ? (openBlock(), createBlock(ColumnSetter, {
+            key: 4,
+            data: unref(columnConfig),
+            "onUpdate:data": _cache[5] || (_cache[5] = ($event) => isRef(columnConfig) ? columnConfig.value = $event : null),
+            "tools-key": __props.toolsKey,
+            size: __props.columnSetterSize,
+            "column-to-storage": __props.columnToStorage,
+            "reset-visible": __props.columnResetVisible,
+            onConfigConfirm: _cache[6] || (_cache[6] = (val) => emits("configConfirm", val)),
+            onReset: _cache[7] || (_cache[7] = ($event) => emits("columnReset"))
+          }, {
+            default: withCtx(() => [
+              createVNode(Component$1, {
+                title: "设置",
+                circle: "",
+                icon: { name: "Setting", type: "el" },
+                throttle: __props.throttle
+              }, null, 8, ["throttle"])
+            ]),
+            _: 1
+          }, 8, ["data", "tools-key", "size", "column-to-storage", "reset-visible"])) : createCommentVNode("", true)
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+
+/* unplugin-vue-components disabled */const buttons = "_buttons_1hb33_10";
+const tools = "_tools_1hb33_19";
+const layout = "_layout_1hb33_30";
+const fullscreen = "_fullscreen_1hb33_35";
+const style0 = {
+	"explorer-tools": "_explorer-tools_1hb33_1",
+	buttons: buttons,
+	tools: tools,
+	layout: layout,
+	fullscreen: fullscreen
+};
+
+const cssModules = {
+  "$style": style0
+};
+const Component = /* @__PURE__ */ _export_sfc$1(_sfc_main, [["__cssModules", cssModules]]);
+
+const __vite_glob_0_27 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
+  __proto__: null,
+  default: Component
+}, Symbol.toStringTag, { value: 'Module' }));
+
+export { Component as C, __vite_glob_0_27 as _ };

package/dist/es/components/explorer-tools/explorer-tools.vue.d.ts

@@ -0,0 +1,43 @@
+import { IExplorerToolsProps } from './explorer-tools';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<IExplorerToolsProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    search: (value: string) => any;
+    fullscreen: (status: boolean) => any;
+    refresh: () => any;
+    layout: (value: "list" | "card") => any;
+    create: () => any;
+    configConfirm: (config: import('../explorer-column-table/explorer-column-table').IColumnConfig[]) => any;
+    columnReset: () => any;
+}, string, import('vue').PublicProps, Readonly<IExplorerToolsProps> & Readonly<{
+    onSearch?: ((value: string) => any) | undefined;
+    onFullscreen?: ((status: boolean) => any) | undefined;
+    onRefresh?: (() => any) | undefined;
+    onLayout?: ((value: "list" | "card") => any) | undefined;
+    onCreate?: (() => any) | undefined;
+    onConfigConfirm?: ((config: import('../explorer-column-table/explorer-column-table').IColumnConfig[]) => any) | undefined;
+    onColumnReset?: (() => any) | undefined;
+}>, {
+    throttle: number;
+    layout: "card" | "list";
+    fullscreenTarget: "panel" | "page";
+    tools: ("search" | "refresh" | "fullscreen" | "setter" | "layout")[];
+    searchPlaceholder: string;
+    createText: string;
+    columnSetterSize: "small" | "default" | "large";
+    columnResetVisible: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};