@pixelium/web-vue 0.0.2-fix → 0.0.3-beta

package/es/message-box/index.js

@@ -1,117 +1,101 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { ref, createVNode, render, nextTick } from "vue";
-import { _ as _sfc_main } from "./message-box.js";
-import { p, m } from "../aside/index.js";
-const urlAlphabet = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
-let nanoid = (size = 21) => {
-  let id = "";
-  let bytes = crypto.getRandomValues(new Uint8Array(size |= 0));
-  while (size--) {
-    id += urlAlphabet[bytes[size] & 63];
-  }
-  return id;
+import './css.js'
+import { B as y, F as m, c as nanoid } from "../vendor.js";
+import { t as message_box_default } from "./message-box.js";
+import { n as _defineProperty } from "../index.js";
+import { createVNode, nextTick, ref, render } from "vue";
+var MessageManager = class {
+	constructor(options) {
+		_defineProperty(this, "messages", void 0);
+		_defineProperty(this, "messageBox", void 0);
+		_defineProperty(this, "container", null);
+		this.messages = ref([]);
+		this.messageBox = createVNode(message_box_default, {
+			messages: this.messages.value,
+			placement: options.placement,
+			onClose: (id$1) => {
+				const idx = this.messages.value.findIndex((e) => e.id === id$1);
+				if (idx >= 0) this.messages.value.splice(idx, 1);
+			}
+		});
+		const root = (y(options.root) ? document.querySelector(options.root) : options.root) || document.body;
+		const id = nanoid();
+		this.container = document.createElement("div");
+		this.container.id = id;
+		this.container.className = `px-message-box-wrapper`;
+		root.appendChild(this.container);
+		render(this.messageBox, this.container);
+	}
+	push(options) {
+		const id = options.id ?? nanoid();
+		this.messages.value.push({
+			...options,
+			id
+		});
+		return id;
+	}
+	close(id) {
+		var _this$messageBox$comp;
+		(_this$messageBox$comp = this.messageBox.component) === null || _this$messageBox$comp === void 0 || (_this$messageBox$comp = _this$messageBox$comp.exposed) === null || _this$messageBox$comp === void 0 || _this$messageBox$comp.close(id);
+	}
+	clear() {
+		this.messages.value.length = 0;
+	}
+	unmount() {
+		if (this.container) {
+			const container = this.container;
+			render(this.messageBox, container);
+			nextTick(() => {
+				container.remove();
+				this.container = null;
+			});
+		}
+	}
 };
-class MessageManager {
-  constructor(options) {
-    __publicField(this, "messages");
-    __publicField(this, "messageBox");
-    __publicField(this, "container", null);
-    this.messages = ref([]);
-    this.messageBox = createVNode(_sfc_main, {
-      messages: this.messages.value,
-      placement: options.placement,
-      onClose: (id2) => {
-        const idx = this.messages.value.findIndex((e) => e.id === id2);
-        if (idx >= 0) {
-          this.messages.value.splice(idx, 1);
-        }
-      }
-    });
-    const root = (p(options.root) ? document.querySelector(options.root) : options.root) || document.body;
-    const id = nanoid();
-    this.container = document.createElement("div");
-    this.container.id = id;
-    this.container.className = `px-message-box-wrapper`;
-    root.appendChild(this.container);
-    render(this.messageBox, this.container);
-  }
-  push(options) {
-    const id = options.id ?? nanoid();
-    this.messages.value.push({
-      ...options,
-      id
-    });
-    return id;
-  }
-  close(id) {
-    var _a, _b;
-    (_b = (_a = this.messageBox.component) == null ? void 0 : _a.exposed) == null ? void 0 : _b.close(id);
-  }
-  clear() {
-    this.messages.value.length = 0;
-  }
-  unmount() {
-    if (this.container) {
-      const container = this.container;
-      render(this.messageBox, container);
-      nextTick(() => {
-        container.remove();
-        this.container = null;
-      });
-    }
-  }
-}
-const messageManagers = {
-  top: void 0,
-  bottom: void 0,
-  "top-left": void 0,
-  "top-right": void 0,
-  "bottom-left": void 0,
-  "bottom-right": void 0
+var messageManagers = {
+	top: void 0,
+	bottom: void 0,
+	"top-left": void 0,
+	"top-right": void 0,
+	"bottom-left": void 0,
+	"bottom-right": void 0
 };
-const messageCall = (options) => {
-  if (p(options) || m(options)) {
-    options = {
-      content: options
-    };
-  }
-  const placement = options.placement || options.position || "top";
-  const currentManager = messageManagers[placement] ? messageManagers[placement] : messageManagers[placement] = new MessageManager({
-    placement,
-    root: options.root || "body"
-  });
-  const id = currentManager.push({
-    content: options.content,
-    icon: options.icon,
-    duration: options.duration || 3e3,
-    type: options.type || "normal",
-    color: options.color,
-    closable: options.closable
-  });
-  return {
-    close: () => currentManager.close(id),
-    clear: () => currentManager.clear()
-  };
-};
-const message = messageCall;
-["info", "success", "warning", "error", "loading", "sakura", "normal"].forEach(
-  (key) => {
-    message[key] = (options) => {
-      if (p(options) || m(options)) {
-        options = {
-          content: options
-        };
-      }
-      return message({
-        ...options,
-        type: key
-      });
-    };
-  }
-);
-export {
-  message as m,
-  nanoid as n
+var messageCall = (options) => {
+	if (y(options) || m(options)) options = { content: options };
+	const placement = options.placement || options.position || "top";
+	const currentManager = messageManagers[placement] ? messageManagers[placement] : messageManagers[placement] = new MessageManager({
+		placement,
+		root: options.root || "body"
+	});
+	const id = currentManager.push({
+		content: options.content,
+		icon: options.icon,
+		duration: options.duration || 3e3,
+		type: options.type || "normal",
+		color: options.color,
+		closable: options.closable
+	});
+	return {
+		close: () => currentManager.close(id),
+		clear: () => currentManager.clear()
+	};
 };
+var message = messageCall;
+[
+	"info",
+	"success",
+	"warning",
+	"error",
+	"loading",
+	"sakura",
+	"normal"
+].forEach((key) => {
+	message[key] = (options) => {
+		if (y(options) || m(options)) options = { content: options };
+		return message({
+			...options,
+			type: key
+		});
+	};
+});
+var message_box_default$1 = message;
+export { message_box_default$1 as t };

package/es/message-box/message-box-wrapped.js

@@ -1,47 +1,34 @@
-import { defineComponent, useAttrs, ref, createBlock, openBlock, Teleport, createVNode, mergeProps, unref } from "vue";
-import { _ as _sfc_main$1 } from "./message-box.js";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...{
-    name: "MessageBox"
-  },
-  __name: "message-box-wrapped",
-  props: {
-    messages: null,
-    placement: null,
-    position: null,
-    zIndex: null,
-    root: { default: "body" },
-    "onUpdate:messages": { type: Function },
-    onClose: { type: Function }
-  },
-  setup(__props, { expose: __expose }) {
-    const props = __props;
-    const attrs = useAttrs();
-    const messageBoxRef = ref(null);
-    __expose({
-      close: (id) => {
-        var _a;
-        (_a = messageBoxRef.value) == null ? void 0 : _a.close(id);
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(Teleport, {
-        to: props.root
-      }, [
-        createVNode(
-          _sfc_main$1,
-          mergeProps({ ...props, ...unref(attrs) }, {
-            ref_key: "messageBoxRef",
-            ref: messageBoxRef
-          }),
-          null,
-          16
-          /* FULL_PROPS */
-        )
-      ], 8, ["to"]);
-    };
-  }
+import { t as message_box_default } from "./message-box.js";
+import { Teleport, createBlock, createVNode, defineComponent, mergeProps, openBlock, ref, unref, useAttrs } from "vue";
+var message_box_wrapped_default = /* @__PURE__ */ defineComponent({
+	name: "MessageBox",
+	__name: "message-box-wrapped",
+	props: {
+		messages: null,
+		placement: null,
+		position: null,
+		zIndex: null,
+		root: { default: "body" },
+		"onUpdate:messages": { type: Function },
+		onClose: { type: Function }
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const attrs = useAttrs();
+		const messageBoxRef = ref(null);
+		__expose({ close: (id) => {
+			var _messageBoxRef$value;
+			(_messageBoxRef$value = messageBoxRef.value) === null || _messageBoxRef$value === void 0 || _messageBoxRef$value.close(id);
+		} });
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Teleport, { to: props.root }, [createVNode(message_box_default, mergeProps({
+				...props,
+				...unref(attrs)
+			}, {
+				ref_key: "messageBoxRef",
+				ref: messageBoxRef
+			}), null, 16)], 8, ["to"]);
+		};
+	}
 });
-export {
-  _sfc_main as _
-};
+export { message_box_wrapped_default as t };

package/es/message-box/message-box.js

@@ -1,112 +1,80 @@
-import './css.js'
-import { defineComponent, useModel, computed, shallowRef, createElementBlock, openBlock, normalizeStyle, unref, createElementVNode, normalizeClass, Fragment, renderList, createBlock } from "vue";
-import { N } from "../aside/index.js";
-import { _ as _sfc_main$1 } from "../message/index.js";
-import { n as nanoid } from "./index.js";
-import { u as useZIndex } from "../share/hook/use-z-index.js";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...{
-    name: "MessageBoxInner"
-  },
-  __name: "message-box",
-  props: {
-    messages: {},
-    placement: { default: "top" },
-    position: { default: "top" },
-    zIndex: {},
-    root: {},
-    "onUpdate:messages": {}
-  },
-  emits: ["close"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const [currentZIndex] = useZIndex("message");
-    const messages = useModel(props, "messages");
-    const emits = __emit;
-    const clone = computed(() => {
-      return messages.value.map((e) => {
-        return {
-          ...e,
-          id: e.id ?? nanoid()
-        };
-      });
-    });
-    const closeHandler = (id) => {
-      if (N(id)) {
-        return;
-      }
-      if (props["onUpdate:messages"]) {
-        const idx = clone.value.findIndex((item) => item.id === id);
-        if (idx >= 0) {
-          const cur = [...clone.value];
-          cur.splice(idx, 1);
-          messages.value = cur;
-        }
-      }
-      emits("close", id);
-    };
-    const messageRef = shallowRef([]);
-    __expose({
-      close: (id) => {
-        var _a;
-        const idx = clone.value.findIndex((e) => e.id === id);
-        if (idx === -1) {
-          return;
-        }
-        (_a = messageRef.value[idx]) == null ? void 0 : _a.close();
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock(
-        "div",
-        {
-          class: "px-message-box",
-          style: normalizeStyle({
-            zIndex: props.zIndex ?? unref(currentZIndex)
-          })
-        },
-        [
-          createElementVNode(
-            "div",
-            {
-              class: normalizeClass(["px-message-box-container", {
-                [`px-message-box-container__${props.placement || props.position || "top"}`]: true
-              }])
-            },
-            [
-              (openBlock(true), createElementBlock(
-                Fragment,
-                null,
-                renderList(clone.value, (message) => {
-                  return openBlock(), createBlock(_sfc_main$1, {
-                    key: message.id,
-                    duration: message.duration,
-                    content: message.content,
-                    id: message.id,
-                    onClose: closeHandler,
-                    type: message.type,
-                    color: message.color,
-                    icon: message.icon,
-                    closable: message.closable,
-                    ref_for: true,
-                    ref_key: "messageRef",
-                    ref: messageRef
-                  }, null, 8, ["duration", "content", "id", "type", "color", "icon", "closable"]);
-                }),
-                128
-                /* KEYED_FRAGMENT */
-              ))
-            ],
-            2
-            /* CLASS */
-          )
-        ],
-        4
-        /* STYLE */
-      );
-    };
-  }
+import { _ as E, c as nanoid } from "../vendor.js";
+import { t as message_default } from "../message/index.js";
+import { t as useZIndex } from "../share/hook/use-z-index.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderList, shallowRef, unref, useModel } from "vue";
+var message_box_default = /* @__PURE__ */ defineComponent({
+	name: "MessageBoxInner",
+	__name: "message-box",
+	props: {
+		messages: {},
+		placement: { default: "top" },
+		position: { default: "top" },
+		zIndex: {},
+		root: {},
+		"onUpdate:messages": {}
+	},
+	emits: ["close"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const [currentZIndex] = useZIndex("message");
+		const messages = useModel(props, "messages");
+		const emits = __emit;
+		const clone = computed(() => {
+			return messages.value.map((e) => {
+				return {
+					...e,
+					id: e.id ?? nanoid()
+				};
+			});
+		});
+		const closeHandler = (id) => {
+			if (E(id)) return;
+			if (props["onUpdate:messages"]) {
+				const idx = clone.value.findIndex((item) => item.id === id);
+				if (idx >= 0) {
+					const cur = [...clone.value];
+					cur.splice(idx, 1);
+					messages.value = cur;
+				}
+			}
+			emits("close", id);
+		};
+		const messageRef = shallowRef([]);
+		__expose({ close: (id) => {
+			var _messageRef$value$idx;
+			const idx = clone.value.findIndex((e) => e.id === id);
+			if (idx === -1) return;
+			(_messageRef$value$idx = messageRef.value[idx]) === null || _messageRef$value$idx === void 0 || _messageRef$value$idx.close();
+		} });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: "px-message-box",
+				style: normalizeStyle({ zIndex: props.zIndex ?? unref(currentZIndex) })
+			}, [createElementVNode("div", { class: normalizeClass(["px-message-box-container", { [`px-message-box-container__${props.placement || props.position || "top"}`]: true }]) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(clone.value, (message) => {
+				return openBlock(), createBlock(message_default, {
+					key: message.id,
+					duration: message.duration,
+					content: message.content,
+					id: message.id,
+					onClose: closeHandler,
+					type: message.type,
+					color: message.color,
+					icon: message.icon,
+					closable: message.closable,
+					ref_for: true,
+					ref_key: "messageRef",
+					ref: messageRef
+				}, null, 8, [
+					"duration",
+					"content",
+					"id",
+					"type",
+					"color",
+					"icon",
+					"closable"
+				]);
+			}), 128))], 2)], 4);
+		};
+	}
 });
-export {
-  _sfc_main as _
-};
+export { message_box_default as t };

package/es/option-list/index.css

@@ -1,9 +1,6 @@
 .px-option-list {
-  --item-size: var(--px-medium-base-size);
-  --px-padding-x: var(--px-interval-1);
-  --px-padding-group-x: var(--px-interval-2);
   overflow: auto;
-  max-height: calc(var(--item-size) * 6);
+  max-height: 168px;
   background-color: var(--px-neutral-1);
   color: var(--px-neutral-10);
   list-style: none;
@@ -11,19 +8,25 @@
   margin-top: 0;
   margin-bottom: 0;
 }
+.px-option-list-virtual-list.px-virtual-list {
+  height: 168px;
+}
 .px-option-list-item {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  height: var(--item-size);
+  height: 28px;
   display: flex;
   align-items: center;
   cursor: pointer;
   transition: background-color 0.25s;
-  padding-left: var(--px-padding-x);
-  padding-right: var(--px-padding-x);
+  padding-left: 4px;
+  padding-right: 4px;
   background-color: var(--px-neutral-1);
 }
+.px-option-list-item__child {
+  padding-left: 16px;
+}
 .px-option-list-item:hover {
   background-color: var(--px-primary-1);
 }
@@ -41,17 +44,14 @@
 .px-option-list-item__active {
   color: var(--px-primary-6);
 }
-.px-option-list-item-group .px-option-list-item {
-  padding-left: var(--px-padding-group-x);
-}
 .px-option-list-item-group-label {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   color: var(--px-neutral-9);
-  height: var(--item-size);
+  height: 28px;
   display: flex;
   align-items: center;
-  padding-left: var(--px-padding-x);
-  padding-right: var(--px-padding-x);
+  padding-left: 4px;
+  padding-right: 4px;
 }

package/es/option-list/index.d.ts

@@ -1,38 +1,11 @@
 import type { OptionListGroupOption, OptionListOption, OptionListProps } from './type';
-declare var __VLS_1: {
-    option: string;
-}, __VLS_3: {
-    option: OptionListOption | OptionListGroupOption;
-}, __VLS_5: {
-    option: OptionListGroupOption;
-}, __VLS_7: {
-    option: string;
-}, __VLS_9: {
-    option: OptionListOption;
-};
-type __VLS_Slots = {} & {
-    option?: (props: typeof __VLS_1) => any;
-} & {
-    option?: (props: typeof __VLS_3) => any;
-} & {
-    'group-label'?: (props: typeof __VLS_5) => any;
-} & {
-    option?: (props: typeof __VLS_7) => any;
-} & {
-    option?: (props: typeof __VLS_9) => any;
-};
-declare const __VLS_component: import("vue").DefineComponent<OptionListProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    select: (value: any, option: string | OptionListOption, e: MouseEvent) => any;
+declare const _default: import("vue").DefineComponent<OptionListProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (value: any, option: string | OptionListOption<any>, e: MouseEvent) => any;
 }, string, import("vue").PublicProps, Readonly<OptionListProps> & Readonly<{
-    onSelect?: ((value: any, option: string | OptionListOption, e: MouseEvent) => any) | undefined;
+    onSelect?: ((value: any, option: string | OptionListOption<any>, e: MouseEvent) => any) | undefined;
 }>, {
     options: (string | OptionListOption | OptionListGroupOption)[];
     activeValues: any[];
+    virtualScroll: boolean;
 }, {}, {}, {}, 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;
-    };
-};