tuikit-atomicx-vue3 0.1.0

package/dist/components/UserPicker/hooks/useSelection.d.ts

@@ -0,0 +1,32 @@
+import { Ref } from 'vue';
+import { IUserPickerNode, IUserPickerDataSource, IUserPickerResult } from '../type';
+
+interface UseSelectionOptions<T = unknown> {
+    defaultSelectedKeys?: string[];
+    lockedKeys?: string[];
+    maxCount?: number;
+    minCount?: number;
+    isTreeMode?: boolean;
+    dataSource: Ref<IUserPickerDataSource<T>>;
+    onSelectedChange?: (selectedItems: IUserPickerResult<T>) => void;
+    onMaxCountExceed?: (selectedItems: IUserPickerResult<T>) => void;
+}
+interface UseSelectionReturn<T = unknown> {
+    selectedKeys: Ref<Set<string>>;
+    halfSelectedKeys: Ref<Set<string>>;
+    lockedKeys: Ref<Set<string>>;
+    isSelected: (key: string) => boolean;
+    isHalfSelected: (key: string) => boolean;
+    isLocked: (key: string) => boolean;
+    toggle: (key: string) => void;
+    getSelectedItems: () => IUserPickerResult<T>;
+    getNodeChildKeys: (node: IUserPickerNode<T>) => string[];
+    getNodeParentChildrenMap: () => Map<string, string[]>;
+    canSelectMore: Ref<boolean>;
+    reachMaxCount: Ref<boolean>;
+    allSelectedCount: Ref<number>;
+    getSelectableLeafNodes: (nodeKey: string) => IUserPickerNode<T>[];
+    getCancelableLeafNodes: (nodeKey: string) => IUserPickerNode<T>[];
+}
+export declare function useSelection<T = unknown>({ defaultSelectedKeys, lockedKeys, maxCount, minCount, isTreeMode, dataSource, onSelectedChange, onMaxCountExceed, }: UseSelectionOptions<T>): UseSelectionReturn<T>;
+export {};

package/dist/components/UserPicker/hooks/useSelection.js

@@ -0,0 +1,351 @@
+import { ref, computed, watch } from "vue";
+function isTreeDataSource(data) {
+  if (data.length === 0) {
+    return false;
+  }
+  return "isLeafNode" in data[0];
+}
+function buildAllNodesMap(nodes) {
+  const map = /* @__PURE__ */ new Map();
+  const traverse = (nodesToScan) => {
+    nodesToScan.forEach((node) => {
+      map.set(node.key, node);
+      if (node.children && node.children.length) {
+        traverse(node.children);
+      }
+    });
+  };
+  traverse(nodes);
+  return map;
+}
+function buildParentChildrenMap(nodes) {
+  const map = /* @__PURE__ */ new Map();
+  const traverse = (nodesList, parentKey) => {
+    nodesList.forEach((node) => {
+      var _a;
+      if (parentKey) {
+        if (!map.has(parentKey)) {
+          map.set(parentKey, []);
+        }
+        (_a = map.get(parentKey)) == null ? void 0 : _a.push(node.key);
+      }
+      if (node.children && node.children.length) {
+        traverse(node.children, node.key);
+      }
+    });
+  };
+  traverse(nodes);
+  return map;
+}
+function buildChildParentMap(nodes) {
+  const map = /* @__PURE__ */ new Map();
+  const traverse = (nodesList, parentKey) => {
+    nodesList.forEach((node) => {
+      if (parentKey) {
+        map.set(node.key, parentKey);
+      }
+      if (node.children && node.children.length) {
+        traverse(node.children, node.key);
+      }
+    });
+  };
+  traverse(nodes);
+  return map;
+}
+function areSetsEqual(a, b) {
+  if (a.size !== b.size) {
+    return false;
+  }
+  return Array.from(a).every((item) => b.has(item));
+}
+function useSelection({
+  defaultSelectedKeys = [],
+  lockedKeys = [],
+  maxCount = Infinity,
+  minCount = 0,
+  isTreeMode = false,
+  dataSource,
+  onSelectedChange,
+  onMaxCountExceed
+}) {
+  const selectedKeys = ref(new Set(defaultSelectedKeys));
+  const halfSelectedKeys = ref(/* @__PURE__ */ new Set());
+  const lockedKeysSet = ref(new Set(lockedKeys));
+  const parentChildrenMap = computed(() => {
+    if (isTreeMode && isTreeDataSource(dataSource.value)) {
+      return buildParentChildrenMap(dataSource.value);
+    }
+    return /* @__PURE__ */ new Map();
+  });
+  const childParentMap = computed(() => {
+    if (isTreeMode && isTreeDataSource(dataSource.value)) {
+      return buildChildParentMap(dataSource.value);
+    }
+    return /* @__PURE__ */ new Map();
+  });
+  const nodeEntitiesMap = computed(() => {
+    if (isTreeMode && isTreeDataSource(dataSource.value)) {
+      return buildAllNodesMap(dataSource.value);
+    }
+    return /* @__PURE__ */ new Map();
+  });
+  const allSelectedCount = computed(() => selectedKeys.value.size);
+  const canSelectMore = computed(() => allSelectedCount.value < maxCount);
+  const reachMaxCount = computed(() => allSelectedCount.value >= maxCount);
+  const getNodeChildKeys = (node) => {
+    const result = [];
+    const traverse = (nodeKey) => {
+      const childKeys = parentChildrenMap.value.get(nodeKey);
+      if (childKeys) {
+        childKeys.forEach((childKey) => {
+          result.push(childKey);
+          traverse(childKey);
+        });
+      }
+    };
+    traverse(node.key);
+    return result;
+  };
+  const getSelectableLeafNodes = (nodeKey) => {
+    const nodeEntity = nodeEntitiesMap.value.get(nodeKey);
+    if ((nodeEntity == null ? void 0 : nodeEntity.isLeafNode) && !selectedKeys.value.has(nodeKey) && !lockedKeysSet.value.has(nodeKey)) {
+      return [nodeEntity];
+    }
+    const childKeys = getNodeChildKeys({ key: nodeKey });
+    const selectableLeafNodes = childKeys.filter((key) => !selectedKeys.value.has(key) && !lockedKeysSet.value.has(key)).map((key) => nodeEntitiesMap.value.get(key)).filter((childNode) => childNode == null ? void 0 : childNode.isLeafNode);
+    return selectableLeafNodes;
+  };
+  const getCancelableLeafNodes = (nodeKey) => {
+    const nodeEntity = nodeEntitiesMap.value.get(nodeKey);
+    if ((nodeEntity == null ? void 0 : nodeEntity.isLeafNode) && selectedKeys.value.has(nodeKey)) {
+      return [nodeEntity];
+    }
+    const childKeys = getNodeChildKeys({ key: nodeKey });
+    const cancelableLeafNodes = childKeys.filter((key) => selectedKeys.value.has(key) && !lockedKeysSet.value.has(key)).map((key) => nodeEntitiesMap.value.get(key)).filter((childNode) => childNode == null ? void 0 : childNode.isLeafNode);
+    return cancelableLeafNodes;
+  };
+  const getNodeParentKeyPath = (key) => {
+    const path = [key];
+    let current = key;
+    while (childParentMap.value.has(current)) {
+      const parentKey = childParentMap.value.get(current);
+      path.push(parentKey);
+      current = parentKey;
+    }
+    return path;
+  };
+  const updateSelectedStates = () => {
+    if (!isTreeMode) {
+      return;
+    }
+    const newSelectedKeys = /* @__PURE__ */ new Set();
+    const newHalfSelectedKeys = /* @__PURE__ */ new Set();
+    const allNodes = new Set(Array.from(selectedKeys.value));
+    parentChildrenMap.value.forEach((_, parentKey) => {
+      allNodes.add(parentKey);
+    });
+    parentChildrenMap.value.forEach((childKeys) => {
+      childKeys.forEach((childKey) => allNodes.add(childKey));
+    });
+    selectedKeys.value.forEach((key) => {
+      const childKeys = parentChildrenMap.value.get(key);
+      if (!childKeys || childKeys.length === 0) {
+        if (selectedKeys.value.has(key)) {
+          newSelectedKeys.add(key);
+        }
+      }
+    });
+    let stateChanged = true;
+    const updateParentState = (nodeKey) => {
+      if (lockedKeysSet.value.has(nodeKey)) {
+        return;
+      }
+      const childKeys = parentChildrenMap.value.get(nodeKey);
+      if (!childKeys || childKeys.length === 0) {
+        return;
+      }
+      const unlockedChildKeys = childKeys.filter((key) => !lockedKeysSet.value.has(key));
+      if (unlockedChildKeys.length === 0) {
+        return;
+      }
+      const selectedChildCount = unlockedChildKeys.filter((key) => newSelectedKeys.has(key)).length;
+      const halfSelectedChildCount = unlockedChildKeys.filter((key) => newHalfSelectedKeys.has(key)).length;
+      const wasSelected = newSelectedKeys.has(nodeKey);
+      const wasHalfSelected = newHalfSelectedKeys.has(nodeKey);
+      if (selectedChildCount === unlockedChildKeys.length) {
+        if (!wasSelected || wasHalfSelected) {
+          newSelectedKeys.add(nodeKey);
+          newHalfSelectedKeys.delete(nodeKey);
+          stateChanged = true;
+        }
+      } else if (selectedChildCount > 0 || halfSelectedChildCount > 0) {
+        if (wasSelected || !wasHalfSelected) {
+          newSelectedKeys.delete(nodeKey);
+          newHalfSelectedKeys.add(nodeKey);
+          stateChanged = true;
+        }
+      } else if (wasSelected || wasHalfSelected) {
+        newSelectedKeys.delete(nodeKey);
+        newHalfSelectedKeys.delete(nodeKey);
+        stateChanged = true;
+      }
+    };
+    while (stateChanged) {
+      stateChanged = false;
+      allNodes.forEach(updateParentState);
+    }
+    if (!areSetsEqual(newSelectedKeys, selectedKeys.value)) {
+      selectedKeys.value = newSelectedKeys;
+    }
+    if (!areSetsEqual(newHalfSelectedKeys, halfSelectedKeys.value)) {
+      halfSelectedKeys.value = newHalfSelectedKeys;
+    }
+  };
+  const toggle = (key) => {
+    if (lockedKeysSet.value.has(key)) {
+      return;
+    }
+    const newSelectedKeys = new Set(selectedKeys.value);
+    if (isTreeMode) {
+      const isFullySelected = newSelectedKeys.has(key);
+      const isHalfSelected = halfSelectedKeys.value.has(key);
+      if (isFullySelected) {
+        const cancelableLeafNodes = getCancelableLeafNodes(key);
+        const selectedLeafNodes = getSelectedItems().filter((item) => item.isLeafNode);
+        const currentSelectedKeyCount = selectedLeafNodes.length;
+        if (cancelableLeafNodes.length > 0) {
+          if (currentSelectedKeyCount - cancelableLeafNodes.length >= minCount) {
+            cancelableLeafNodes.forEach((node) => {
+              newSelectedKeys.delete(node.key);
+            });
+          }
+        }
+      } else if (isHalfSelected) {
+        const selectableChildLeafCount = getSelectableLeafNodes(key).length;
+        if (selectableChildLeafCount === 0) {
+          const cancelableLeafNodes = getCancelableLeafNodes(key);
+          const selectedLeafNodes = getSelectedItems().filter((item) => item.isLeafNode);
+          const currentSelectedKeyCount = selectedLeafNodes.length;
+          if (cancelableLeafNodes.length > 0) {
+            if (currentSelectedKeyCount - cancelableLeafNodes.length >= minCount) {
+              cancelableLeafNodes.forEach((node) => {
+                newSelectedKeys.delete(node.key);
+              });
+            }
+          }
+        } else if (selectableChildLeafCount > 0) {
+          const selectedLeafNodes = getSelectedItems().filter((item) => item.isLeafNode);
+          if (selectedLeafNodes.length + selectableChildLeafCount <= maxCount) {
+            const selectableLeafNodes = getSelectableLeafNodes(key);
+            selectableLeafNodes.forEach((node) => {
+              newSelectedKeys.add(node.key);
+            });
+          }
+        }
+      } else {
+        const selectableLeafNodes = getSelectableLeafNodes(key);
+        if (selectableLeafNodes.length > 0) {
+          const selectedLeafNodes = getSelectedItems().filter((item) => item.isLeafNode);
+          if (selectedLeafNodes.length + selectableLeafNodes.length <= maxCount) {
+            selectableLeafNodes.forEach((node) => {
+              newSelectedKeys.add(node.key);
+            });
+          }
+        }
+      }
+    } else {
+      const isCurrentlySelected = newSelectedKeys.has(key);
+      if (isCurrentlySelected) {
+        newSelectedKeys.delete(key);
+      } else if (newSelectedKeys.size < maxCount) {
+        newSelectedKeys.add(key);
+      } else {
+        onMaxCountExceed == null ? void 0 : onMaxCountExceed(getSelectedItems());
+      }
+    }
+    selectedKeys.value = newSelectedKeys;
+  };
+  const getSelectedItems = () => {
+    const result = [];
+    if (isTreeMode && isTreeDataSource(dataSource.value)) {
+      const treeData = dataSource.value;
+      const findNode = (key, nodes) => {
+        var _a;
+        const found = nodes.find((node) => node.key === key);
+        if (found) {
+          return found;
+        }
+        for (let i = 0; i < nodes.length; i += 1) {
+          const node = nodes[i];
+          if ((_a = node.children) == null ? void 0 : _a.length) {
+            const foundInChildren = findNode(key, node.children);
+            if (foundInChildren) {
+              return foundInChildren;
+            }
+          }
+        }
+        return null;
+      };
+      selectedKeys.value.forEach((key) => {
+        const node = findNode(key, treeData);
+        if (node) {
+          result.push({
+            key: node.key,
+            label: node.label,
+            avatarUrl: node.avatarUrl,
+            isLeafNode: node.isLeafNode,
+            extraData: node.extraData,
+            // Calculate node path
+            path: [...getNodeParentKeyPath(node.key)].reverse()
+          });
+        }
+      });
+    } else {
+      const listData = dataSource.value;
+      selectedKeys.value.forEach((key) => {
+        const item = listData.find((listItem) => listItem.key === key);
+        if (item) {
+          result.push({
+            key: item.key,
+            label: item.label,
+            avatarUrl: item.avatarUrl,
+            extraData: item.extraData
+          });
+        }
+      });
+    }
+    return result;
+  };
+  watch(
+    [selectedKeys, halfSelectedKeys],
+    () => {
+      if (isTreeMode) {
+        updateSelectedStates();
+      }
+      if (onSelectedChange) {
+        onSelectedChange(getSelectedItems());
+      }
+    },
+    { deep: true }
+  );
+  return {
+    selectedKeys,
+    halfSelectedKeys,
+    lockedKeys: lockedKeysSet,
+    isSelected: (key) => selectedKeys.value.has(key),
+    isHalfSelected: (key) => halfSelectedKeys.value.has(key),
+    isLocked: (key) => lockedKeysSet.value.has(key),
+    toggle,
+    getSelectedItems,
+    getNodeChildKeys,
+    getSelectableLeafNodes,
+    getCancelableLeafNodes,
+    getNodeParentChildrenMap: () => parentChildrenMap.value,
+    canSelectMore,
+    reachMaxCount,
+    allSelectedCount
+  };
+}
+export {
+  useSelection
+};

package/dist/components/UserPicker/hooks/useTreeState.d.ts

@@ -0,0 +1,16 @@
+import { Ref } from 'vue';
+import { IUserPickerNode } from '../type';
+
+interface UseTreeStateOptions<T = unknown> {
+    onExpand?: (node: IUserPickerNode<T>) => void;
+}
+interface UseTreeStateReturn<T = unknown> {
+    expandedKeys: Ref<Set<string>>;
+    loadingKeys: Ref<Set<string>>;
+    checkNodeIsExpanded: (key: string) => boolean;
+    checkNodeIsLoading: (key: string) => boolean;
+    toggleExpand: (node: IUserPickerNode<T>) => void;
+    setNodeLoading: (key: string, loading: boolean) => void;
+}
+export declare function useTreeState<T = unknown>({ onExpand }?: UseTreeStateOptions<T>): UseTreeStateReturn<T>;
+export {};

package/dist/components/UserPicker/hooks/useTreeState.js

@@ -0,0 +1,43 @@
+import { ref } from "vue";
+function useTreeState({ onExpand } = {}) {
+  const expandedKeys = ref(/* @__PURE__ */ new Set());
+  const loadingKeys = ref(/* @__PURE__ */ new Set());
+  const checkNodeIsExpanded = (key) => expandedKeys.value.has(key);
+  const checkNodeIsLoading = (key) => loadingKeys.value.has(key);
+  const setNodeLoading = (key, loading) => {
+    const newKeys = new Set(loadingKeys.value);
+    if (loading) {
+      newKeys.add(key);
+    } else {
+      newKeys.delete(key);
+    }
+    loadingKeys.value = newKeys;
+  };
+  const toggleExpand = (node) => {
+    if (node.isLeafNode) {
+      return;
+    }
+    const newKeys = new Set(expandedKeys.value);
+    if (newKeys.has(node.key)) {
+      newKeys.delete(node.key);
+    } else {
+      newKeys.add(node.key);
+      if (node.lazyLoad && onExpand) {
+        setNodeLoading(node.key, true);
+        onExpand(node);
+      }
+    }
+    expandedKeys.value = newKeys;
+  };
+  return {
+    expandedKeys,
+    loadingKeys,
+    checkNodeIsExpanded,
+    checkNodeIsLoading,
+    toggleExpand,
+    setNodeLoading
+  };
+}
+export {
+  useTreeState
+};

package/dist/components/UserPicker/index.d.ts

@@ -0,0 +1,6 @@
+import { default as UserPicker } from './UserPicker.vue';
+import { IUserPickerProps, IUserPickerRef, IUserPickerRow, IUserPickerNode, IUserPickerDataSource, IUserPickerResult } from './type';
+
+export type { IUserPickerProps, IUserPickerRef, IUserPickerRow, IUserPickerNode, IUserPickerDataSource, IUserPickerResult, };
+export { UserPicker };
+export default UserPicker;

package/dist/components/UserPicker/index.js

@@ -0,0 +1,5 @@
+import UserPicker from "./UserPicker.js";
+export {
+  UserPicker,
+  UserPicker as default
+};

package/dist/components/UserPicker/type.d.ts

@@ -0,0 +1,60 @@
+export interface IUserPickerRow<T = unknown> {
+    key: string;
+    label: string;
+    avatarUrl?: string | undefined;
+    extraData?: T | undefined;
+}
+export interface IUserPickerNode<T = unknown> {
+    key: string;
+    label: string;
+    isLeafNode: boolean;
+    avatarUrl?: string | undefined;
+    lazyLoad?: boolean;
+    children?: Array<IUserPickerNode<T>>;
+    extraData?: T | undefined;
+}
+export type IUserPickerDataSource<T = unknown> = Array<IUserPickerRow<T>> | Array<IUserPickerNode<T>>;
+export interface IUserPickerResultItem<T = unknown> {
+    key: string;
+    label: string;
+    avatarUrl?: string | undefined;
+    isLeafNode?: boolean | undefined;
+    extraData?: T | undefined;
+    path?: string[] | undefined;
+}
+export type IUserPickerResult<T = unknown> = Array<IUserPickerResultItem<T>>;
+export interface IUserPickerProps<T = unknown> {
+    displayMode: 'list' | 'tree';
+    dataSource: IUserPickerDataSource<T>;
+    defaultSelectedItems?: Array<{
+        key: string;
+        [key: string]: any;
+    }>;
+    lockedItems?: Array<{
+        key: string;
+        [key: string]: any;
+    }>;
+    maxCount?: number | undefined;
+    minCount?: number | undefined;
+    onMaxCountExceed?: (selectedItems: IUserPickerResult<T>) => void;
+    enableSearch?: boolean;
+    searchPlaceholder?: string;
+    onSearch?: (value: string) => void;
+    renderItem?: (data: IUserPickerRow<T> | IUserPickerNode<T>) => any;
+    onSelectedChange?: (selectedItems: IUserPickerResult<T>) => void;
+    onReachEnd?: () => void;
+    onExpand?: (node: IUserPickerNode<T>) => void;
+}
+export interface IUserPickerRef<T = unknown> {
+    getSelectedItems: () => IUserPickerResult<T>;
+    updateListData: (newDataSource: Array<IUserPickerRow<T>>) => void;
+    updateTreeData: (key: string, partialNewNode: Partial<IUserPickerNode<T>>) => void;
+}
+export interface ISelectionState {
+    selectedKeys: Set<string>;
+    halfSelectedKeys?: Set<string>;
+}
+export interface ITreeState {
+    expandedKeys: Set<string>;
+    loadingKeys: Set<string>;
+}

package/dist/components/UserPicker/type.js

@@ -0,0 +1 @@
+

package/dist/components/VideoSetting/CameraSelect.js

@@ -0,0 +1,73 @@
+import { defineComponent, ref, watch, onBeforeMount, createBlock, openBlock, unref, withCtx, createElementBlock, Fragment, renderList } from "vue";
+import SelectPC from "../../baseComp/Select/SelectPC.js";
+import OptionPC from "../../baseComp/Option/OptionPC.js";
+import { useDeviceState } from "../../states/DeviceState.js";
+import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "CameraSelect",
+  props: {
+    onChange: {},
+    disabled: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    var _a;
+    const { cameraList, currentCamera, setCurrentCamera, getCameraList } = useDeviceState();
+    const props = __props;
+    const currentDeviceId = ref((_a = currentCamera.value) == null ? void 0 : _a.deviceId);
+    watch(
+      () => {
+        var _a2;
+        return (_a2 = currentCamera.value) == null ? void 0 : _a2.deviceId;
+      },
+      (val) => {
+        if (currentDeviceId.value !== val) {
+          currentDeviceId.value = val;
+        }
+      },
+      { immediate: true }
+    );
+    async function handleChange(deviceId) {
+      var _a2, _b, _c;
+      props.onChange && props.onChange(deviceId);
+      try {
+        await setCurrentCamera({
+          deviceId
+        });
+      } catch (error) {
+        if (((_a2 = currentCamera.value) == null ? void 0 : _a2.deviceId) && cameraList.value.map((item) => item.deviceId).includes((_b = currentCamera.value) == null ? void 0 : _b.deviceId)) {
+          currentDeviceId.value = (_c = currentCamera.value) == null ? void 0 : _c.deviceId;
+        }
+      }
+    }
+    onBeforeMount(async () => {
+      await getCameraList();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(SelectPC), {
+        modelValue: currentDeviceId.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => currentDeviceId.value = $event),
+        placeholder: "placeholder",
+        class: "select",
+        disabled: _ctx.disabled,
+        teleported: false,
+        "popper-append-to-body": false,
+        onChange: handleChange
+      }, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(cameraList), (item) => {
+            return openBlock(), createBlock(unref(OptionPC), {
+              key: item.deviceId,
+              label: item.deviceName,
+              value: item.deviceId
+            }, null, 8, ["label", "value"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "disabled"]);
+    };
+  }
+});
+const CameraSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2d3ccda4"]]);
+export {
+  CameraSelect as default
+};

package/dist/components/VideoSetting/CameraSelect.vue.d.ts

@@ -0,0 +1,29 @@
+interface Props {
+    onChange?: (id: string) => void;
+    disabled?: boolean;
+}
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    disabled: boolean;
+}>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    disabled: boolean;
+}>>> & Readonly<{}>, {
+    disabled: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};