cosey 0.9.5 → 0.10.1

package/components/upload/upload.d.ts

@@ -34,7 +34,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: "large";
     };
     request: {
-        type: import("vue").PropType<import(".").UploadContext["request"]>;
+        type: import("vue").PropType<import("../../config/upload").UploadContext["request"]>;
     };
     requestConfig: {
         type: import("vue").PropType<import("axios").AxiosRequestConfig>;
@@ -82,7 +82,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: "large";
     };
     request: {
-        type: import("vue").PropType<import(".").UploadContext["request"]>;
+        type: import("vue").PropType<import("../../config/upload").UploadContext["request"]>;
     };
     requestConfig: {
         type: import("vue").PropType<import("axios").AxiosRequestConfig>;

package/components/upload/upload.js

@@ -3,9 +3,9 @@ import { uploadEmits, uploadSlots, uploadProps } from './upload.api.js';
 import { useFormItem, CHANGE_EVENT, ElMessage } from 'element-plus';
 import stdin_default$2 from './upload-item.js';
 import { TransitionGroup as _TransitionGroup } from '../transition-group/index.js';
-import stdin_default$3 from '../icon/icon.vue.js';
+import stdin_default$3 from '../icon/icon.js';
 import stdin_default$1 from './upload.style.js';
-import { useUpload } from '../upload-context.js';
+import { injectUploadConfig } from '../../config/upload.js';
 import { getFileType, chooseFiles } from '../../utils/file.js';
 import { useLocale } from '../../hooks/useLocale.js';
 import { useComponentConfig } from '../config-provider/config-provider.api.js';
@@ -37,7 +37,7 @@ var stdin_default = defineComponent({
     } = stdin_default$1(prefixCls);
     const {
       request
-    } = useUpload() || {};
+    } = injectUploadConfig() || {};
     const mergedLimit = computed(() => props.single ? 1 : props.limit);
     const mergedMultiple = computed(() => props.single ? false : props.multiple);
     const fileList = ref([]);
@@ -48,7 +48,7 @@ var stdin_default = defineComponent({
     } = useFormItem();
     watch(() => props.modelValue, () => {
       if (props.validateEvent) {
-        formItem?.validate?.(CHANGE_EVENT).catch(err => debugWarn(err));
+        formItem?.validate?.(CHANGE_EVENT).catch(debugWarn);
       }
     });
     watch(() => props.modelValue, newValue => {

package/components/video-card/video-card.js

@@ -2,7 +2,7 @@ import { defineComponent, ref, createVNode, Fragment, mergeProps } from 'vue';
 import { videoCardEmits, videoCardProps } from './video-card.api.js';
 import { useLockscreen } from 'element-plus';
 import stdin_default$3 from '../video-viewer/video-viewer.js';
-import stdin_default$2 from '../icon/icon.vue.js';
+import stdin_default$2 from '../icon/icon.js';
 import stdin_default$1 from './video-card.style.js';
 import { useComponentConfig } from '../config-provider/config-provider.api.js';
 

package/config/root-config-provider.js

@@ -6,8 +6,8 @@ import stdin_default$1 from './nprogress.style.js';
 import 'element-plus/dist/index.css';
 import 'element-plus/theme-chalk/dark/css-vars.css';
 import { ElConfigProvider } from 'element-plus';
+import { provideUploadConfig } from './upload.js';
 import { useColorSchemeProvide } from '../hooks/useColorScheme.js';
-import { useUploadProvide } from '../components/upload-context.js';
 import { containerContextKey } from '../components/container/container.api.js';
 import { useStackDialogProvide } from '../components/stack-dialog/stack-dialog.api.js';
 import { ConfigProvider as _ConfigProvider } from '../components/config-provider/index.js';
@@ -37,7 +37,7 @@ var stdin_default = defineComponent({
     const apiConfig = useGlobalConfig()?.api;
     if (apiConfig) {
       const uploadApi = apiConfig.upload?.();
-      useUploadProvide({
+      provideUploadConfig({
         request: uploadApi
       });
     }

package/{components/upload-context.d.ts → config/upload.d.ts}

@@ -2,5 +2,5 @@ import type { AxiosRequestConfig } from 'axios';
 export interface UploadContext {
     request?: (data: Blob, config?: AxiosRequestConfig, extra?: Record<PropertyKey, any>) => Promise<string>;
 }
-export declare const useUploadProvide: (context: UploadContext) => void;
-export declare const useUpload: () => UploadContext | null;
+export declare const provideUploadConfig: (context: UploadContext) => void;
+export declare const injectUploadConfig: () => UploadContext | null;

package/{components/upload-context.js → config/upload.js}

@@ -1,11 +1,11 @@
 import { inject, provide } from 'vue';
 
 const uploadContextKey = Symbol("uploadContext");
-const useUploadProvide = (context) => {
+const provideUploadConfig = (context) => {
   provide(uploadContextKey, context);
 };
-const useUpload = () => {
+const injectUploadConfig = () => {
   return inject(uploadContextKey, null);
 };
 
-export { useUpload, useUploadProvide };
+export { injectUploadConfig, provideUploadConfig };

package/hooks/index.d.ts

@@ -21,3 +21,5 @@ export * from './useOptionalComponent';
 export * from './useMounted';
 export * from './useDir';
 export * from './useProps';
+export * from './useSingleUpload';
+export * from './useObjectUrl';

package/hooks/index.js

@@ -21,3 +21,5 @@ export { useOptionalComponent } from './useOptionalComponent.js';
 export { useMounted } from './useMounted.js';
 export { useDir } from './useDir.js';
 export { defaultProps, useProps } from './useProps.js';
+export { useSingleUpload } from './useSingleUpload.js';
+export { useObjectUrl } from './useObjectUrl.js';

package/hooks/useObjectUrl.d.ts

@@ -0,0 +1,2 @@
+import { type MaybeRefOrGetter } from 'vue';
+export declare function useObjectUrl(file: MaybeRefOrGetter<Blob | MediaSource | null | undefined>): Readonly<import("vue").Ref<string | undefined, string | undefined>>;

package/hooks/useObjectUrl.js

@@ -0,0 +1,27 @@
+import { shallowRef, onBeforeUnmount, watch, toValue, readonly } from 'vue';
+
+function useObjectUrl(file) {
+  const url = shallowRef();
+  const revoke = () => {
+    if (url.value) {
+      URL.revokeObjectURL(url.value);
+    }
+    url.value = void 0;
+  };
+  onBeforeUnmount(() => {
+    revoke();
+  });
+  watch(
+    () => toValue(file),
+    (file2) => {
+      revoke();
+      if (file2) {
+        url.value = URL.createObjectURL(file2);
+      }
+    },
+    { immediate: true }
+  );
+  return readonly(url);
+}
+
+export { useObjectUrl };

package/hooks/useSingleUpload.d.ts

@@ -0,0 +1,15 @@
+import { type MaybeRefOrGetter } from 'vue';
+import { AxiosRequestConfig } from 'axios';
+type UploadStatus = 'unsent' | 'senting' | 'success' | 'error';
+interface UseUploadOptions {
+    onProgress?: (progress: number) => void;
+    onSuccess?: (url: string) => void;
+    onError?: (err: any) => void;
+}
+export declare function useSingleUpload(file: MaybeRefOrGetter<File | undefined | null>, options?: UseUploadOptions, requestConfig?: AxiosRequestConfig<any>, requestExtra?: Record<PropertyKey, any>): {
+    sent: () => Promise<void>;
+    cancel: () => void;
+    status: Readonly<import("vue").Ref<UploadStatus, UploadStatus>>;
+    progress: Readonly<import("vue").Ref<number, number>>;
+};
+export {};

package/hooks/useSingleUpload.js

@@ -0,0 +1,64 @@
+import { ref, readonly, toValue } from 'vue';
+import { injectUploadConfig } from '../config/upload.js';
+import { warningOnce } from '../utils/warning.js';
+
+function useSingleUpload(file, options = {}, requestConfig, requestExtra) {
+  const { onProgress, onSuccess, onError } = options;
+  const status = ref("unsent");
+  const progress = ref(0);
+  const { request } = injectUploadConfig() || {};
+  if (!request) {
+    warningOnce(!!request, 'The "request" api is required.');
+  }
+  let controller = null;
+  const cancel = () => {
+    if (status.value === "senting") {
+      controller?.abort();
+    }
+  };
+  const sent = async () => {
+    try {
+      const _file = toValue(file);
+      if (!_file) {
+        throw new Error("file is required");
+      }
+      status.value = "senting";
+      progress.value = 0;
+      controller = new AbortController();
+      const url = await new Promise((resolve, reject) => {
+        return request?.(
+          _file,
+          {
+            ...requestConfig,
+            signal: controller.signal,
+            onUploadProgress(event) {
+              if (event.total) {
+                progress.value = Math.floor(event.loaded / event.total * 100);
+                onProgress?.(progress.value);
+              }
+              requestConfig?.onUploadProgress?.(event);
+            }
+          },
+          requestExtra
+        ).then((url2) => {
+          resolve(url2);
+        }).catch((err) => {
+          reject(err);
+        });
+      });
+      status.value = "success";
+      onSuccess?.(url);
+    } catch (err) {
+      status.value = "error";
+      onError?.(err);
+    }
+  };
+  return {
+    sent,
+    cancel,
+    status: readonly(status),
+    progress: readonly(progress)
+  };
+}
+
+export { useSingleUpload };

package/layout/layout-menu/style/index.js

@@ -1,5 +1,5 @@
-import { getTruncateStyle } from '../../../components/style/mixins.js';
 import { getSimpleStyleHook } from '../../../components/theme/getSimpleStyleHook.js';
+import { getTruncateStyle } from '../../../components/style/mixins.js';
 
 var stdin_default = getSimpleStyleHook("CoLayoutMenu", (token) => {
   const { componentCls } = token;

package/locale/lang/ar.d.ts

@@ -48,12 +48,14 @@ declare const _default: {
             edit: string;
             insert: string;
             link: string;
+            insertLink: string;
             currentWindow: string;
             newWindow: string;
             sourceCode: string;
             width: string;
             height: string;
             video: string;
+            image: string;
         };
         table: {
             export: string;

package/locale/lang/ar.js

@@ -51,12 +51,14 @@ var stdin_default = {
       edit: "\u062A\u0639\u062F\u064A\u0644",
       insert: "\u0625\u062F\u0631\u0627\u062C",
       link: "\u0631\u0627\u0628\u0637",
+      insertLink: "\u0625\u062F\u0631\u0627\u062C \u0631\u0627\u0628\u0637",
       currentWindow: "\u0627\u0644\u0646\u0627\u0641\u0630\u0629 \u0627\u0644\u062D\u0627\u0644\u064A\u0629",
       newWindow: "\u0646\u0627\u0641\u0630\u0629 \u062C\u062F\u064A\u062F\u0629",
       sourceCode: "\u0627\u0644\u0643\u0648\u062F \u0627\u0644\u0645\u0635\u062F\u0631\u064A",
       width: "\u0627\u0644\u0639\u0631\u0636",
       height: "\u0627\u0644\u0627\u0631\u062A\u0641\u0627\u0639",
-      video: "\u0641\u064A\u062F\u064A\u0648"
+      video: "\u0641\u064A\u062F\u064A\u0648",
+      image: "\u0635\u0648\u0631\u0629"
     },
     table: {
       export: "\u062A\u0635\u062F\u064A\u0631",

package/locale/lang/en.d.ts

@@ -48,12 +48,14 @@ declare const _default: {
             edit: string;
             insert: string;
             link: string;
+            insertLink: string;
             currentWindow: string;
             newWindow: string;
             sourceCode: string;
             width: string;
             height: string;
             video: string;
+            image: string;
         };
         table: {
             export: string;

package/locale/lang/en.js

@@ -51,12 +51,14 @@ var stdin_default = {
       edit: "Edit",
       insert: "Insert",
       link: "Link",
+      insertLink: "Insert link",
       currentWindow: "Current window",
       newWindow: "New window",
       sourceCode: "Source code",
       width: "Width",
       height: "Height",
-      video: "Video"
+      video: "Video",
+      image: "Image"
     },
     table: {
       export: "Export",

package/locale/lang/zh-cn.d.ts

@@ -48,12 +48,14 @@ declare const _default: {
             edit: string;
             insert: string;
             link: string;
+            insertLink: string;
             currentWindow: string;
             newWindow: string;
             sourceCode: string;
             width: string;
             height: string;
             video: string;
+            image: string;
         };
         table: {
             export: string;

package/locale/lang/zh-cn.js

@@ -51,12 +51,14 @@ var stdin_default = {
       edit: "\u7F16\u8F91",
       insert: "\u63D2\u5165",
       link: "\u94FE\u63A5",
+      insertLink: "\u63D2\u5165\u94FE\u63A5",
       currentWindow: "\u5F53\u524D\u7A97\u53E3",
       newWindow: "\u65B0\u7A97\u53E3",
       sourceCode: "\u6E90\u7801",
       width: "\u5BBD\u5EA6",
       height: "\u9AD8\u5EA6",
-      video: "\u89C6\u9891"
+      video: "\u89C6\u9891",
+      image: "\u56FE\u7247"
     },
     table: {
       export: "\u5BFC\u51FA",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosey",
-  "version": "0.9.5",
+  "version": "0.10.1",
   "description": "基于 Vue3 + vite 的后台管理系统框架",
   "type": "module",
   "main": "index.js",
@@ -10,7 +10,7 @@
   },
   "devDependencies": {
     "@casl/ability": "^6.7.3",
-    "@cosey/icons": "^0.1.6",
+    "@cosey/icons": "^0.1.7",
     "@ctrl/tinycolor": "^4.1.0",
     "@element-plus/icons-vue": "^2.3.1",
     "@emotion/hash": "^0.9.2",
@@ -18,7 +18,9 @@
     "@floating-ui/dom": "^1.6.13",
     "@gunny/persist": "^1.0.2",
     "@iconify/types": "^2.0.0",
+    "@types/is-hotkey": "^0.1.10",
     "@types/nprogress": "^0.2.3",
+    "@types/prismjs": "^1.26.5",
     "@types/stylis": "^4.2.7",
     "@vue/shared": "^3.5.13",
     "@vueuse/core": "^13.2.0",
@@ -28,14 +30,15 @@
     "dayjs": "^1.11.13",
     "echarts": "^5.6.0",
     "element-plus": "^2.11.4",
-    "highlight.js": "^11.11.1",
+    "is-hotkey": "^0.2.0",
     "jszip": "^3.10.1",
     "katex": "^0.16.22",
     "lodash-es": "^4.17.21",
     "mime": "^4.0.7",
     "nprogress": "^0.2.0",
     "pinia": "^3.0.2",
-    "quill": "^2.0.3",
+    "prismjs": "^1.30.0",
+    "slate-vue3": "^0.10.0",
     "stylis": "^4.3.6",
     "svga": "^2.1.1",
     "vue": "^3.5.21",
@@ -44,7 +47,7 @@
   },
   "peerDependencies": {
     "@casl/ability": "^6.7.3",
-    "@cosey/icons": "^0.1.6",
+    "@cosey/icons": "^0.1.7",
     "@ctrl/tinycolor": "^4.1.0",
     "@element-plus/icons-vue": "^2.3.1",
     "@emotion/hash": "^0.9.2",
@@ -61,14 +64,15 @@
     "dayjs": "^1.11.13",
     "echarts": "^5.6.0",
     "element-plus": "^2.10.4",
-    "highlight.js": "^11.11.1",
+    "is-hotkey": "^0.2.0",
     "jszip": "^3.10.1",
     "katex": "^0.16.22",
     "lodash-es": "^4.17.21",
     "mime": "^4.0.7",
     "nprogress": "^0.2.0",
     "pinia": "^3.0.2",
-    "quill": "^2.0.3",
+    "prismjs": "^1.30.0",
+    "slate-vue3": "^0.10.0",
     "stylis": "^4.3.6",
     "svga": "^2.1.1",
     "vue": "^3.5.21",

package/utils/array.d.ts

@@ -5,7 +5,7 @@ export declare function arrayMove<T extends any[]>(arr: T, fromIndex: number, to
 /**
  * 将传入的值转换为数组
  */
-export declare function toArray(target: unknown): any[];
+export declare function toArray<T>(target: T | T[]): T[];
 /**
  * 判断两数组元素是否一致
  */

package/utils/browser.d.ts

@@ -2,3 +2,4 @@
  * 返回当前操作系统的 Control 键
  */
 export declare function getControlKey(): "⌘" | "Ctrl";
+export declare const IS_APPLE: boolean;

package/utils/browser.js

@@ -1,5 +1,6 @@
 function getControlKey() {
-  return /Mac OS/i.test(navigator.userAgent) ? "\u2318" : "Ctrl";
+  return IS_APPLE ? "\u2318" : "Ctrl";
 }
+const IS_APPLE = typeof navigator !== "undefined" && /Mac OS X/.test(navigator.userAgent);
 
-export { getControlKey };
+export { IS_APPLE, getControlKey };

package/utils/file.d.ts

@@ -20,3 +20,8 @@ export declare function readAsArrayBuffer(file: File): Promise<ArrayBuffer>;
 export declare function downloadAttachment(response: AxiosResponse, options?: {
     filename?: string;
 }): void;
+export declare const imageExtensions: string[];
+/**
+ * 判断是否为图片地址
+ */
+export declare function isImageUrl(url: string): boolean;

package/utils/file.js

@@ -89,5 +89,28 @@ function downloadAttachment(response, options) {
     window.URL.revokeObjectURL(link.href);
   }, 100);
 }
+const imageExtensions = [
+  "jpg",
+  "jpeg",
+  "png",
+  "gif",
+  "webp",
+  "bmp",
+  "heic",
+  "heif",
+  "tiff",
+  "tif",
+  "svg",
+  "eps",
+  "ico"
+];
+function isImageUrl(url) {
+  try {
+    const ext = new URL(url).pathname.split(".").pop();
+    return !!ext && imageExtensions.includes(ext);
+  } catch {
+    return false;
+  }
+}
 
-export { chooseFiles, downloadAttachment, getFileType, readAsArrayBuffer, readAsDataURL };
+export { chooseFiles, downloadAttachment, getFileType, imageExtensions, isImageUrl, readAsArrayBuffer, readAsDataURL };

package/utils/index.js

@@ -1,11 +1,11 @@
 export { arrayMove, isShallowEqual, omitUniqueKey, toArray } from './array.js';
 export { getCssVarProp } from './bem.js';
-export { getControlKey } from './browser.js';
+export { IS_APPLE, getControlKey } from './browser.js';
 export { getLabelByValue, getTreeLabelByValue } from './collection.js';
 export { addPxUnit, cssObjectToString, getContextBoxWidth, getDir, getStyle, setStyle } from './css.js';
 export { DATE_FORMAT, DATE_TIME_FORMAT, MONTH_FORMAT, TIME_FORMAT, YEAR_FORMAT, formatAsBasicDateTime, formatToDate, formatToDateTime, getDayjs } from './date.js';
 export { exportExcel, flatColumns } from './excel/index.js';
-export { chooseFiles, downloadAttachment, getFileType, readAsArrayBuffer, readAsDataURL } from './file.js';
+export { chooseFiles, downloadAttachment, getFileType, imageExtensions, isImageUrl, readAsArrayBuffer, readAsDataURL } from './file.js';
 export { isBoolean, isEmpty, isFunction, isNullish, isNumber, isObject, isPlainObject, isPrimitive, isString, isThenable, isUndefined } from './is.js';
 export { minmax } from './number.js';
 export { deepAssign, initObject, omitObject, omitUndefined, uniformAssign } from './object.js';

package/utils/url.d.ts

@@ -0,0 +1,4 @@
+/**
+ * URL.canParse() 静态方法的兼容实现
+ */
+export declare function canParseUrl(url: string): boolean;

package/utils/url.js

@@ -0,0 +1,10 @@
+function canParseUrl(url) {
+  try {
+    new URL(url);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+export { canParseUrl };

package/components/editor/components/button-group.vue.d.ts

@@ -1,12 +0,0 @@
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
-};
-declare const __VLS_component: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/components/editor/components/button-group.vue.js

@@ -1,19 +0,0 @@
-import { defineComponent, createElementBlock, openBlock, normalizeClass, unref, renderSlot } from 'vue';
-import { useComponentConfig } from '../../config-provider/config-provider.api.js';
-
-var stdin_default = /* @__PURE__ */defineComponent({
-  __name: "button-group",
-  setup(__props) {
-    const {
-      prefixCls
-    } = useComponentConfig("editor-button");
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(`${unref(prefixCls)}-group`)
-      }, [renderSlot(_ctx.$slots, "default")], 2
-      /* CLASS */);
-    };
-  }
-});
-
-export { stdin_default as default };

package/components/editor/components/button.vue.d.ts

@@ -1,17 +0,0 @@
-type __VLS_Props = {
-    active?: boolean;
-};
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
-    el: Readonly<import("vue").ShallowRef<HTMLButtonElement | null>>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/components/editor/components/button.vue.js

@@ -1,35 +0,0 @@
-import { defineComponent, useTemplateRef, createElementBlock, openBlock, normalizeClass, unref, renderSlot } from 'vue';
-import { useComponentConfig } from '../../config-provider/config-provider.api.js';
-
-var stdin_default = /* @__PURE__ */defineComponent({
-  __name: "button",
-  props: {
-    active: {
-      type: Boolean,
-      required: false
-    }
-  },
-  setup(__props, {
-    expose: __expose
-  }) {
-    const {
-      prefixCls
-    } = useComponentConfig("editor-button");
-    const buttonRef = useTemplateRef("button");
-    __expose({
-      el: buttonRef
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("button", {
-        ref: "button",
-        type: "button",
-        class: normalizeClass([unref(prefixCls), {
-          "is-active": _ctx.active
-        }])
-      }, [renderSlot(_ctx.$slots, "default")], 2
-      /* CLASS */);
-    };
-  }
-});
-
-export { stdin_default as default };

package/components/editor/components/color-picker/color-picker.vue.d.ts

@@ -1,23 +0,0 @@
-type __VLS_Props = {
-    visible?: boolean;
-};
-declare var __VLS_5: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_5) => any;
-};
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    clear: () => any;
-    select: (color: string) => any;
-    "update:visible": (visible: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onClear?: (() => any) | undefined;
-    onSelect?: ((color: string) => any) | undefined;
-    "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};