@das-fed/upf-ui 6.4.0-dev.226 → 6.4.0-dev.227

package/packages/business-components/area-phone-select/index.d.ts

@@ -57,7 +57,7 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
     $props: {
         readonly modelValue: Record<any, any>;
         readonly label?: string | undefined;
-        readonly width?: number | string | undefined;
+        readonly width?: (number | string) | undefined;
         readonly visible?: boolean | undefined;
         readonly isView?: boolean | undefined;
         readonly disabled?: boolean | undefined;
@@ -91,11 +91,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -169,11 +169,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -287,11 +287,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -365,11 +365,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -449,7 +449,7 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
     $props: {
         readonly modelValue: Record<any, any>;
         readonly label?: string | undefined;
-        readonly width?: number | string | undefined;
+        readonly width?: (number | string) | undefined;
         readonly visible?: boolean | undefined;
         readonly isView?: boolean | undefined;
         readonly disabled?: boolean | undefined;
@@ -483,11 +483,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -561,11 +561,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -679,11 +679,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -757,11 +757,11 @@ declare const DasAreaPopoverRef: () => import("vue").Ref<({
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -860,11 +860,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -938,11 +938,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -1038,11 +1038,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -1116,11 +1116,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
             $data: {};
             $props: {
                 readonly title?: string | undefined;
-                readonly width?: string | number | undefined;
+                readonly width?: (string | number) | undefined;
                 readonly content?: string | undefined;
                 readonly popperClass?: string | undefined;
                 readonly showBtns?: boolean | undefined;
-                readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+                readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
                 readonly onCancel?: (() => any) | undefined;
                 readonly onConfirm?: (() => any) | undefined;
                 readonly onClickOutside?: (() => any) | undefined;
@@ -1209,11 +1209,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -1287,11 +1287,11 @@ declare const DasAreaPopover: import("@das-fed/upf-utils").SFCWithInstall<{
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;

package/packages/business-components/area-phone-select/index.js

@@ -1,18 +1,18 @@
 import '@das-fed/upf-ui/packages/business-components/area-phone-select/style.css';
-import { defineComponent as $, ref as s, computed as c, onMounted as N, openBlock as d, createBlock as A, unref as p, mergeProps as W, withCtx as _, renderSlot as M, createElementVNode as y, normalizeClass as B, toDisplayString as R, createVNode as C, createElementBlock as h, createCommentVNode as z, withDirectives as U, Fragment as L, renderList as x, createTextVNode as j, nextTick as q, onBeforeUnmount as G, normalizeStyle as H } from "vue";
+import { defineComponent as $, ref as l, computed as p, onMounted as N, openBlock as d, createBlock as A, unref as c, mergeProps as W, withCtx as I, renderSlot as M, createElementVNode as y, normalizeClass as B, toDisplayString as R, createVNode as C, createElementBlock as h, createCommentVNode as z, withDirectives as U, Fragment as L, renderList as j, createTextVNode as q, nextTick as G, onBeforeUnmount as H, normalizeStyle as J } from "vue";
 import { withInstall as O } from "@das-fed/upf-utils/with-install/index";
-import { t as J, setI18nRule as K } from "@das-fed/upf-web/packages/i18n/index";
-import { DasPopoverRef as Q, DasPopover as X } from "@das-fed/upf-ui/packages/components/popover/index";
-import { DasScrollbar as Y } from "@das-fed/upf-ui/packages/components/scrollbar/index";
-import { DasSearch as Z } from "@das-fed/upf-ui/packages/components/search/index";
+import { t as K, setI18nRule as Q } from "@das-fed/upf-web/packages/i18n/index";
+import { DasPopoverRef as X, DasPopover as Y } from "@das-fed/upf-ui/packages/components/popover/index";
+import { DasScrollbar as Z } from "@das-fed/upf-ui/packages/components/scrollbar/index";
+import { DasSearch as _ } from "@das-fed/upf-ui/packages/components/search/index";
 import { DasIconFold as ee } from "@das-fed/upf-ui/packages/icons/fold/index";
-import { DasEmpty as oe } from "@das-fed/upf-ui/packages/components/empty/index";
-import { vDasTooltip as te } from "@das-fed/upf-ui/packages/components/text-tooltip/index";
+import { DasEmpty as te } from "@das-fed/upf-ui/packages/components/empty/index";
+import { vDasTooltip as oe } from "@das-fed/upf-ui/packages/components/text-tooltip/index";
 import { vDasLoading as ae } from "@das-fed/upf-ui/packages/components/loading/index";
-import { createService as se } from "@das-fed/upf-utils/api-services";
-import { DasInput as le } from "@das-fed/upf-ui/packages/components/input/index";
+import { createService as le } from "@das-fed/upf-utils/api-services";
+import { DasInput as se } from "@das-fed/upf-ui/packages/components/input/index";
 import { SizeWatcher as ne } from "@das-fed/upf-utils/size-watcher";
-const re = (t) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)$/.test(t), E = (t) => typeof t == "string" && re(t) ? t : t + "px", ie = se("/api/tool/v2"), de = ie.get("/dictionary/phone-codes"), ue = { class: "label" }, pe = { class: "das-ui-area-phone-popover-content" }, ce = {
+const ie = (e) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)$/.test(e), E = (e) => typeof e == "string" && ie(e) ? e : e + "px", re = le("/api/tool/v2"), de = re.get("/dictionary/phone-codes"), ue = { class: "label" }, ce = { class: "das-ui-area-phone-popover-content" }, pe = {
   key: 0,
   class: "search-box"
 }, ve = { class: "list" }, me = ["onClick"], fe = { class: "item-label" }, he = { class: "item-code" }, be = {
@@ -30,8 +30,8 @@ const re = (t) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
     filter: { type: Boolean, default: !0 }
   },
   emits: ["update:modelValue", "update:visible", "change"],
-  setup(t, { expose: b, emit: r }) {
-    const a = t, v = r, V = Q(), m = s(""), g = s(J("area-phone-placeholder")), P = c(() => a.width ? E(a.width) : "240px"), D = s({
+  setup(e, { expose: b, emit: i }) {
+    const o = e, v = i, V = X(), m = l(""), g = l(K("area-phone-placeholder")), P = p(() => o.width ? E(o.width) : "240px"), x = l({
       modifiers: [
         {
           name: "offset",
@@ -40,103 +40,145 @@ const re = (t) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
           }
         }
       ]
-    }), f = c({
-      get: () => a.visible,
-      set: (o) => {
-        v("update:visible", o);
+    }), f = p({
+      get: () => o.visible,
+      set: (a) => {
+        v("update:visible", a);
       }
-    }), u = c({
-      get: () => a.modelValue ?? {
+    }), u = p({
+      get: () => o.modelValue ?? {
         name: "中国",
         code: "CN",
         phoneCode: "+86"
       },
-      set: (o) => {
-        v("update:modelValue", o);
+      set: (a) => {
+        v("update:modelValue", a);
       }
-    }), k = c(() => u.value[a.label]), S = (o) => {
-      u.value = o, f.value = !1, v("change", o);
-    }, I = c(() => a.filter ? e.value.filter((o) => o.name.includes(m.value)) : e.value), e = s([]), l = s(!1);
+    }), D = p(() => u.value[o.label]), S = (a) => {
+      u.value = a, f.value = !1, v("change", a);
+    }, k = p(() => o.filter ? t.value.filter((a) => a.name.includes(m.value)) : t.value), t = l([]), s = l(!1);
     return N(async () => {
-      l.value = !0;
-      const [o, i] = await de().run();
-      l.value = !1, !o && (e.value = i || []);
-    }), b({ popoverRef: V }), (o, i) => (d(), A(p(X), W({
+      s.value = !0;
+      const [a, r] = await de().run();
+      s.value = !1, !a && (t.value = r || []);
+    }), b({ popoverRef: V }), (a, r) => (d(), A(c(Y), W({
       ref_key: "popoverRef",
       ref: V,
-      "show-arrow": o.showArrow,
-      "popper-options": D.value,
+      "show-arrow": e.showArrow,
+      "popper-options": x.value,
       trigger: "click",
       width: P.value,
       popperClass: "das-ui-area-phone-popover",
       visible: f.value,
-      "onUpdate:visible": i[1] || (i[1] = (n) => f.value = n),
-      disabled: o.isView || o.disabled
-    }, o.$attrs, {
-      onBeforeLeave: i[2] || (i[2] = (n) => m.value = "")
+      "onUpdate:visible": r[1] || (r[1] = (n) => f.value = n),
+      disabled: e.isView || e.disabled
+    }, a.$attrs, {
+      onBeforeLeave: r[2] || (r[2] = (n) => m.value = "")
     }), {
-      reference: _(() => [
-        M(o.$slots, "reference", {}, () => [
-          y("div", {
-            class: B(["das-ui-area-phone-popover-reference", o.disabled ? "is-disabled" : ""])
-          }, [
-            y("div", ue, R(k.value), 1),
-            y("div", {
-              class: B({ "icon-box": !0, show: f.value, hide: o.isView || o.disabled })
-            }, [
-              C(p(ee), { size: "medium" })
-            ], 2)
-          ], 2)
+      reference: I(() => [
+        M(a.$slots, "reference", {}, () => [
+          y(
+            "div",
+            {
+              class: B(["das-ui-area-phone-popover-reference", e.disabled ? "is-disabled" : ""])
+            },
+            [
+              y(
+                "div",
+                ue,
+                R(D.value),
+                1
+                /* TEXT */
+              ),
+              y(
+                "div",
+                {
+                  class: B({ "icon-box": !0, show: f.value, hide: e.isView || e.disabled })
+                },
+                [
+                  C(c(ee), { size: "medium" })
+                ],
+                2
+                /* CLASS */
+              )
+            ],
+            2
+            /* CLASS */
+          )
         ], !0)
       ]),
-      default: _(() => [
-        y("div", pe, [
-          o.filter ? (d(), h("div", ce, [
-            C(p(Z), {
+      default: I(() => [
+        y("div", ce, [
+          e.filter ? (d(), h("div", pe, [
+            C(c(_), {
               isIconLeft: "",
               size: "custom",
               placeholder: g.value,
               border: "",
               width: "100%",
               modelValue: m.value,
-              "onUpdate:modelValue": i[0] || (i[0] = (n) => m.value = n)
+              "onUpdate:modelValue": r[0] || (r[0] = (n) => m.value = n)
             }, null, 8, ["placeholder", "modelValue"])
-          ])) : z("", !0),
-          C(p(Y), null, {
-            default: _(() => [
+          ])) : z("v-if", !0),
+          C(c(Z), null, {
+            default: I(() => [
               U((d(), h("div", ve, [
-                l.value ? z("", !0) : (d(), h(L, { key: 0 }, [
-                  (d(!0), h(L, null, x(I.value, (n) => (d(), h("div", {
-                    class: B(["item", {
-                      selected: u.value && u.value.name + u.value.phoneCode == n.name + n.phoneCode
-                    }]),
-                    onClick: (Ce) => S(n)
-                  }, [
-                    U((d(), h("div", fe, [
-                      j(R(n.name ?? ""), 1)
-                    ])), [
-                      [p(te)]
-                    ]),
-                    y("div", he, R(n.phoneCode ?? ""), 1)
-                  ], 10, me))), 256)),
-                  I.value.length ? z("", !0) : (d(), A(p(oe), { key: 0 }))
-                ], 64))
+                s.value ? z("v-if", !0) : (d(), h(
+                  L,
+                  { key: 0 },
+                  [
+                    (d(!0), h(
+                      L,
+                      null,
+                      j(k.value, (n) => (d(), h("div", {
+                        class: B(["item", {
+                          selected: u.value && u.value.name + u.value.phoneCode == n.name + n.phoneCode
+                        }]),
+                        onClick: (Ce) => S(n)
+                      }, [
+                        U((d(), h("div", fe, [
+                          q(
+                            R(n.name ?? ""),
+                            1
+                            /* TEXT */
+                          )
+                        ])), [
+                          [c(oe)]
+                        ]),
+                        y(
+                          "div",
+                          he,
+                          R(n.phoneCode ?? ""),
+                          1
+                          /* TEXT */
+                        )
+                      ], 10, me))),
+                      256
+                      /* UNKEYED_FRAGMENT */
+                    )),
+                    k.value.length ? z("v-if", !0) : (d(), A(c(te), { key: 0 }))
+                  ],
+                  64
+                  /* STABLE_FRAGMENT */
+                ))
               ])), [
-                [p(ae), l.value]
+                [c(ae), s.value]
               ])
             ]),
             _: 1
+            /* STABLE */
           })
         ])
       ]),
       _: 3
+      /* FORWARDED */
     }, 16, ["show-arrow", "popper-options", "width", "visible", "disabled"]));
   }
-}), T = (t, b) => {
-  const r = t.__vccOpts || t;
-  for (const [a, v] of b)
-    r[a] = v;
-  return r;
+}), T = (e, b) => {
+  const i = e.__vccOpts || e;
+  for (const [o, v] of b)
+    i[o] = v;
+  return i;
 }, F = /* @__PURE__ */ T(we, [["__scopeId", "data-v-ab8fd375"]]), Ve = /* @__PURE__ */ $({
   __name: "index",
   props: {
@@ -147,70 +189,77 @@ const re = (t) => /^[+-]?\d+(\.\d+)?(px|em|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|%)
     disabled: { type: Boolean }
   },
   emits: ["update:modelValue", "update:areaItem", "change", "area-change"],
-  setup(t, { emit: b }) {
-    const r = t, a = b, v = c(() => r.width ? E(r.width) : "100%"), V = c({
-      get: () => r.modelValue,
-      set: (e) => a("update:modelValue", e)
-    }), m = c({
-      get: () => r.areaItem ?? {},
-      set: (e) => {
-        a("update:areaItem", e);
+  setup(e, { emit: b }) {
+    const i = e, o = b, v = p(() => i.width ? E(i.width) : "100%"), V = p({
+      get: () => i.modelValue,
+      set: (t) => o("update:modelValue", t)
+    }), m = p({
+      get: () => i.areaItem ?? {},
+      set: (t) => {
+        o("update:areaItem", t);
       }
-    }), g = s(null), P = s(null), D = s(null), f = s(240), u = s(!1), k = () => {
+    }), g = l(null), P = l(null), x = l(null), f = l(240), u = l(!1), D = () => {
       f.value = g.value.clientWidth ?? 0;
     };
     N(() => {
-      q(() => {
-        k(), D.value = ne(() => {
-          k();
+      G(() => {
+        D(), x.value = ne(() => {
+          D();
         }, g.value);
       });
-    }), G(() => {
-      var e;
-      (e = D.value) == null || e.disconnect();
+    }), H(() => {
+      var t;
+      (t = x.value) == null || t.disconnect();
     });
-    const S = (e) => {
-      a("area-change", e);
-    }, I = (e) => {
-      a("change", e);
+    const S = (t) => {
+      o("area-change", t);
+    }, k = (t) => {
+      o("change", t);
     };
-    return (e, l) => (d(), h("div", {
-      ref_key: "phoneRef",
-      ref: g,
-      class: B(["das-ui-area-phone-select", { "is-disabled": e.disabled && !e.isView, "is-view": e.isView }]),
-      style: H({ width: v.value })
-    }, [
-      C(p(le), W({
-        ref_key: "inputRef",
-        ref: P,
-        width: "100%",
-        disabled: e.disabled,
-        isView: e.isView,
-        modelValue: V.value,
-        "onUpdate:modelValue": l[2] || (l[2] = (w) => V.value = w),
-        onChange: I
-      }, e.$attrs), {
-        prepend: _(() => [
-          C(F, {
-            visible: u.value,
-            "onUpdate:visible": l[0] || (l[0] = (w) => u.value = w),
-            isView: e.isView,
-            disabled: e.disabled,
-            modelValue: m.value,
-            "onUpdate:modelValue": l[1] || (l[1] = (w) => m.value = w),
-            width: f.value,
-            onChange: S
-          }, null, 8, ["visible", "isView", "disabled", "modelValue", "width"])
-        ]),
-        _: 1
-      }, 16, ["disabled", "isView", "modelValue"])
-    ], 6));
+    return (t, s) => (d(), h(
+      "div",
+      {
+        ref_key: "phoneRef",
+        ref: g,
+        class: B(["das-ui-area-phone-select", { "is-disabled": e.disabled && !e.isView, "is-view": e.isView }]),
+        style: J({ width: v.value })
+      },
+      [
+        C(c(se), W({
+          ref_key: "inputRef",
+          ref: P,
+          width: "100%",
+          disabled: e.disabled,
+          isView: e.isView,
+          modelValue: V.value,
+          "onUpdate:modelValue": s[2] || (s[2] = (w) => V.value = w),
+          onChange: k
+        }, t.$attrs), {
+          prepend: I(() => [
+            C(F, {
+              visible: u.value,
+              "onUpdate:visible": s[0] || (s[0] = (w) => u.value = w),
+              isView: e.isView,
+              disabled: e.disabled,
+              modelValue: m.value,
+              "onUpdate:modelValue": s[1] || (s[1] = (w) => m.value = w),
+              width: f.value,
+              onChange: S
+            }, null, 8, ["visible", "isView", "disabled", "modelValue", "width"])
+          ]),
+          _: 1
+          /* STABLE */
+        }, 16, ["disabled", "isView", "modelValue"])
+      ],
+      6
+      /* CLASS, STYLE */
+    ));
   }
 }), ge = /* @__PURE__ */ T(Ve, [["__scopeId", "data-v-203bb4f0"]]), ye = {
   "area-phone-placeholder": { "zh-CN": "请输入所在国家或区域中文名称", en: "Please enter your country or region", "zh-MO": "請輸入所在國家或區域中文名稱" }
 };
-K(ye);
-const Ne = () => s(null), We = () => s(null), Oe = O(ge), Ee = O(F), Te = { name: "区号选择手机号输入框" };
+Q(ye);
+const Ne = () => l(null), We = () => l(null), Oe = O(ge), Ee = O(F), Te = { name: "区号选择手机号输入框" };
 export {
   Oe as DasAreaPhoneSelect,
   Ne as DasAreaPhoneSelectRef,

package/packages/business-components/area-phone-select/src/area-popover/index.vue.d.ts

@@ -5,11 +5,11 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<Props, {
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;
@@ -83,11 +83,11 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<Props, {
         $data: {};
         $props: {
             readonly title?: string | undefined;
-            readonly width?: string | number | undefined;
+            readonly width?: (string | number) | undefined;
             readonly content?: string | undefined;
             readonly popperClass?: string | undefined;
             readonly showBtns?: boolean | undefined;
-            readonly placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | undefined;
+            readonly placement?: ("top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end") | undefined;
             readonly onCancel?: (() => any) | undefined;
             readonly onConfirm?: (() => any) | undefined;
             readonly onClickOutside?: (() => any) | undefined;