@varlet/ui 3.13.1 → 3.14.0

package/es/select/useOptionsMutationObserver.mjs

@@ -0,0 +1,73 @@
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { nextTick, ref, watch } from "vue";
+import { getStyle } from "@varlet/shared";
+import { onSmartUnmounted } from "@varlet/use";
+function useOptionsMutationObserver(container, showContainer, options) {
+  const showEmpty = ref(false);
+  let observer = null;
+  watch(
+    () => showContainer.value,
+    () => __async(this, null, function* () {
+      disconnectObserver();
+      if (!showContainer.value) {
+        return;
+      }
+      yield nextTick();
+      connectObserver();
+      handler();
+    }),
+    { immediate: true }
+  );
+  onSmartUnmounted(disconnectObserver);
+  function handler() {
+    var _a;
+    const el = container.value;
+    const optionEls = el == null ? void 0 : el.querySelectorAll(".var-option");
+    showEmpty.value = !(optionEls == null ? void 0 : optionEls.length) ? true : Array.from(optionEls).every((option) => getStyle(option).display === "none");
+    (_a = options == null ? void 0 : options.onAfterUpdate) == null ? void 0 : _a.call(options);
+  }
+  function connectObserver() {
+    if (!container.value) {
+      return;
+    }
+    observer = new MutationObserver(() => __async(this, null, function* () {
+      yield nextTick();
+      handler();
+    }));
+    observer.observe(container.value, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: ["style", "class"]
+    });
+  }
+  function disconnectObserver() {
+    observer == null ? void 0 : observer.disconnect();
+    observer = null;
+  }
+  return {
+    showEmpty
+  };
+}
+export {
+  useOptionsMutationObserver
+};

package/es/select/useSelectFilterSize.mjs

@@ -0,0 +1,27 @@
+import { computed, nextTick, ref, shallowRef, unref, watch } from "vue";
+const MINIMUM_FILTER_WIDTH = 11;
+function useSelectFilterSize(value) {
+  const calculatorRef = shallowRef();
+  const calculatorWidth = ref(0);
+  const filterStyle = computed(() => ({
+    minWidth: `${Math.max(calculatorWidth.value, MINIMUM_FILTER_WIDTH)}px`
+  }));
+  const resize = () => {
+    var _a, _b;
+    calculatorWidth.value = (_b = (_a = calculatorRef.value) == null ? void 0 : _a.getBoundingClientRect().width) != null ? _b : 0;
+  };
+  watch(
+    () => unref(value),
+    () => {
+      nextTick(resize);
+    }
+  );
+  return {
+    calculatorRef,
+    filterStyle,
+    resize
+  };
+}
+export {
+  useSelectFilterSize
+};

package/es/themes/dark/fieldDecorator.mjs

@@ -15,7 +15,7 @@ var stdin_default = {
   "--field-decorator-standard-normal-icon-margin-bottom": "4px",
   "--field-decorator-standard-normal-non-hint-margin-top": "4px",
   "--field-decorator-standard-small-margin-top": "18px",
-  "--field-decorator-standard-small-margin-bottom": "4px",
+  "--field-decorator-standard-small-margin-bottom": "0",
   "--field-decorator-standard-small-icon-margin-top": "18px",
   "--field-decorator-standard-small-icon-margin-bottom": "4px",
   "--field-decorator-standard-small-non-hint-margin-top": "2px",

package/es/themes/dark/select.mjs

@@ -9,7 +9,10 @@ var stdin_default = {
   "--select-chip-background-color": "#555",
   "--select-arrow-size": "20px",
   "--select-standard-menu-margin": `calc(var(--field-decorator-placeholder-size) * 0.75 + 12px) 0 0 0`,
-  "--select-label-font-size": "16px"
+  "--select-label-font-size": "16px",
+  "--select-empty-text-color": "#aaaaaa",
+  "--select-empty-height": "38px",
+  "--select-empty-font-size": "14px"
 };
 export {
   stdin_default as default

package/es/themes/md3-dark/fieldDecorator.mjs

@@ -15,7 +15,7 @@ var stdin_default = {
   "--field-decorator-standard-normal-icon-margin-bottom": "4px",
   "--field-decorator-standard-normal-non-hint-margin-top": "4px",
   "--field-decorator-standard-small-margin-top": "18px",
-  "--field-decorator-standard-small-margin-bottom": "4px",
+  "--field-decorator-standard-small-margin-bottom": "0",
   "--field-decorator-standard-small-icon-margin-top": "18px",
   "--field-decorator-standard-small-icon-margin-bottom": "4px",
   "--field-decorator-standard-small-non-hint-margin-top": "2px",

package/es/themes/md3-dark/select.mjs

@@ -9,7 +9,10 @@ var stdin_default = {
   "--select-chip-background-color": "var(--color-surface-container-highest)",
   "--select-arrow-size": "20px",
   "--select-standard-menu-margin": `calc(var(--field-decorator-placeholder-size) * 0.75 + 12px) 0 0 0`,
-  "--select-label-font-size": "16px"
+  "--select-label-font-size": "16px",
+  "--select-empty-text-color": "var(--color-on-surface-variant)",
+  "--select-empty-height": "38px",
+  "--select-empty-font-size": "14px"
 };
 export {
   stdin_default as default

package/es/themes/md3-light/fieldDecorator.mjs

@@ -15,7 +15,7 @@ var stdin_default = {
   "--field-decorator-standard-normal-icon-margin-bottom": "4px",
   "--field-decorator-standard-normal-non-hint-margin-top": "4px",
   "--field-decorator-standard-small-margin-top": "18px",
-  "--field-decorator-standard-small-margin-bottom": "4px",
+  "--field-decorator-standard-small-margin-bottom": "0",
   "--field-decorator-standard-small-icon-margin-top": "18px",
   "--field-decorator-standard-small-icon-margin-bottom": "4px",
   "--field-decorator-standard-small-non-hint-margin-top": "2px",

package/es/themes/md3-light/select.mjs

@@ -9,7 +9,10 @@ var stdin_default = {
   "--select-chip-background-color": "rgb(218, 212, 219)",
   "--select-arrow-size": "20px",
   "--select-standard-menu-margin": `calc(var(--field-decorator-placeholder-size) * 0.75 + 12px) 0 0 0`,
-  "--select-label-font-size": "16px"
+  "--select-label-font-size": "16px",
+  "--select-empty-text-color": "var(--color-on-surface-variant)",
+  "--select-empty-height": "38px",
+  "--select-empty-font-size": "14px"
 };
 export {
   stdin_default as default