@aplus-frontend/ui 7.0.0-beta.0 → 7.0.0-beta.1

package/es/src/business/ap-select-layout/style/index.mjs

@@ -0,0 +1,135 @@
+import { genComponentStyleHook as o } from "../../../utils/cssinjs/index.mjs";
+const t = (e) => {
+  const { componentCls: i } = e;
+  return {
+    [i]: {
+      display: "flex",
+      width: "100%",
+      height: "100%",
+      [`${i}-side`]: {
+        display: "flex",
+        flexDirection: "column",
+        width: "214px",
+        minWidth: "214px",
+        maxWidth: "214px",
+        marginInlineEnd: "16px",
+        overflow: "hidden",
+        backgroundColor: "#fff",
+        "&__header": {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          padding: "12px 16px",
+          borderBottom: "1px solid #e9e9e9",
+          overflow: "hidden",
+          whiteSpace: "nowrap",
+          "& > h3": {
+            margin: 0,
+            color: "#333",
+            fontSize: e.fontSize,
+            fontWeight: "bold",
+            lineHeight: e.lineHeightLG
+          },
+          "&--imgWrap": {
+            borderRadius: "2px",
+            cursor: "pointer",
+            fontSize: "20px",
+            color: "#999",
+            display: "flex",
+            height: "20px",
+            "&:hover": {
+              background: "#f5f5f5"
+            },
+            "& > img": {
+              width: "24px",
+              height: "24px"
+            }
+          }
+        },
+        "&__body": {
+          position: "relative",
+          flex: 1,
+          "&--search": {
+            margin: "10px 0",
+            padding: "0 16px"
+          },
+          "&--scroll": {
+            position: "absolute",
+            inset: "52px 0 0",
+            overflowY: "auto",
+            padding: "0 16px"
+          },
+          "&--scroll-item": {
+            marginBottom: "8px",
+            padding: "8px 12px",
+            overflow: "hidden",
+            color: "#333",
+            lineHeight: "22px",
+            width: "calc(214px - 32px)",
+            textOverflow: "ellipsis",
+            textWrap: "nowrap",
+            cursor: "pointer",
+            borderRadius: "4px",
+            "&:hover": {
+              background: "#f5f5f5"
+            },
+            "&.active": {
+              backgroundColor: "#e4faf1",
+              color: "#34b77c",
+              fontWeight: "bold",
+              "& > .ant-typography": {
+                color: "#34b77c"
+              }
+            }
+          }
+        }
+      },
+      ".v-enter-active, .v-leave-active": {
+        transition: "all 0.2s, background 0s"
+      },
+      ".v-enter-from, .v-leave-to": {
+        width: 0,
+        minWidth: 0,
+        maxWidth: 0,
+        marginInlineEnd: 0
+      },
+      [`${i}-content`]: {
+        flex: 1,
+        overflowX: "hidden",
+        display: "flex",
+        flexDirection: "column",
+        "&__header": {
+          display: "flex",
+          alignItems: "center",
+          height: "32px",
+          padding: "16px 16px 0",
+          boxSizing: "content-box",
+          background: "#fff",
+          "&--imgWrap": {
+            marginRight: "10px",
+            borderRadius: "2px",
+            cursor: "pointer",
+            fontSize: "20px",
+            display: "flex",
+            height: "20px",
+            color: "#999",
+            "&:hover": {
+              background: "#f5f5f5"
+            }
+          },
+          "&--title": {
+            margin: 0,
+            fontSize: e.fontSizeLG,
+            fontWeight: "bold",
+            lineHeight: e.lineHeightLG
+          }
+        }
+      }
+    }
+  };
+}, r = o("ApSelectLayout", (e) => [
+  t(e)
+]);
+export {
+  r as default
+};

package/es/src/business/ap-size-input/ApSizeInput.d.ts

@@ -74,11 +74,11 @@ declare const _default: DefineComponent<ExtractPropTypes<{
 }>> & Readonly<{}>, {
     step: number;
     value: (string | number)[];
-    max: number;
-    min: number;
-    editable: boolean;
     placeholder: string[];
+    min: number;
+    max: number;
     precision: number;
+    editable: boolean;
     perfix: string;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/src/business/ap-size-input/ApSizeInput.mjs

@@ -1,50 +1,51 @@
-import { defineComponent as o, toRaw as x, createVNode as n } from "vue";
-import { ApSizeInputProps as f } from "./constans.mjs";
+import { defineComponent as f, toRaw as x, createVNode as t } from "vue";
+import { ApSizeInputProps as r } from "./constans.mjs";
 import "../../ap-field/number/index.vue2.mjs";
-import { Form as g, Space as r } from "@aplus-frontend/antdv";
+import { Form as g, Space as I } from "@aplus-frontend/antdv";
 import "../../config-provider/index.mjs";
-import { useNamespace as I } from "../../config-provider/hooks/use-namespace.mjs";
+import v from "./style/index.mjs";
+import { useNamespace as z } from "../../config-provider/hooks/use-namespace.mjs";
 import { useLocale as C } from "../../config-provider/hooks/use-locale.mjs";
 import m from "../../ap-field/number/index.vue.mjs";
-const N = /* @__PURE__ */ o({
+const y = /* @__PURE__ */ f({
   name: "ApSizeInput",
-  props: f(),
+  props: r(),
   setup(e, {
     emit: c
   }) {
     const {
-      b: d
-    } = I("ap-size-input"), {
-      t
-    } = C(), u = g.useInjectFormItemContext(), i = (a, h) => {
+      b: u
+    } = z("ap-size-input"), d = v("ap-size-input"), {
+      t: n
+    } = C(), h = g.useInjectFormItemContext(), i = (a, o) => {
       const l = e.value;
-      l[a] = h, c("update:value", l), c("SizeInputChange", x(l)), u.onFieldChange();
+      l[a] = o, c("update:value", l), c("SizeInputChange", x(l)), h.onFieldChange();
     };
-    return () => n(r, {
-      class: [d()]
+    return () => t(I, {
+      class: [u(), d.value]
     }, {
-      default: () => [n(m, {
+      default: () => [t(m, {
         mode: e.editable ? "edit" : "read",
         value: e.value?.[0],
-        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[0] : t("ap.apSizeInput.length"),
+        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[0] : n("ap.apSizeInput.length"),
         precision: e.precision ? e.precision : 2,
         min: e.min ? e.min : 1,
         max: e.max ? e.max : 999.99,
         onChange: (a) => i(0, a),
         step: e.step ? e.step : 1
-      }, null), e.perfix, n(m, {
+      }, null), e.perfix, t(m, {
         mode: e.editable ? "edit" : "read",
         value: e.value?.[1],
-        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[1] : t("ap.apSizeInput.width"),
+        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[1] : n("ap.apSizeInput.width"),
         precision: e.precision ? e.precision : 2,
         min: e.min ? e.min : 1,
         max: e.max ? e.max : 999.99,
         onChange: (a) => i(1, a),
         step: e.step ? e.step : 1
-      }, null), e.perfix, n(m, {
+      }, null), e.perfix, t(m, {
         mode: e.editable ? "edit" : "read",
         value: e.value?.[2],
-        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[2] : t("ap.apSizeInput.height"),
+        placeholder: e.placeholder && e.placeholder.length >= 3 ? e.placeholder[2] : n("ap.apSizeInput.height"),
         precision: e.precision ? e.precision : 2,
         min: e.min ? e.min : 1,
         max: e.max ? e.max : 999.99,
@@ -55,5 +56,5 @@ const N = /* @__PURE__ */ o({
   }
 });
 export {
-  N as default
+  y as default
 };

package/es/src/business/ap-size-input/index.d.ts

@@ -40,11 +40,11 @@ declare const ApSizeInput: {
     }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, PublicProps, {
         step: number;
         value: (string | number)[];
-        max: number;
-        min: number;
-        editable: boolean;
         placeholder: string[];
+        min: number;
+        max: number;
         precision: number;
+        editable: boolean;
         perfix: string;
     }, true, {}, {}, GlobalComponents, GlobalDirectives, string, {}, any, ComponentProvideOptions, {
         P: {};
@@ -92,11 +92,11 @@ declare const ApSizeInput: {
     }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, {
         step: number;
         value: (string | number)[];
-        max: number;
-        min: number;
-        editable: boolean;
         placeholder: string[];
+        min: number;
+        max: number;
         precision: number;
+        editable: boolean;
         perfix: string;
     }>;
     __isFragment?: never;
@@ -141,11 +141,11 @@ declare const ApSizeInput: {
 }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
     step: number;
     value: (string | number)[];
-    max: number;
-    min: number;
-    editable: boolean;
     placeholder: string[];
+    min: number;
+    max: number;
     precision: number;
+    editable: boolean;
     perfix: string;
 }, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & VNodeProps & AllowedComponentProps & ComponentCustomProps & ( Plugin & (new (...args: any[]) => {
     $props: {

package/es/src/business/ap-size-input/style/index.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+declare const _default: (prefixCls: string) => Ref<string | undefined, string | undefined>;
+export default _default;

package/es/src/business/ap-size-input/style/index.mjs

@@ -0,0 +1,12 @@
+import { genComponentStyleHook as t } from "../../../utils/cssinjs/index.mjs";
+const n = (e) => ({
+  [e.componentCls]: {
+    display: "flex",
+    alignItems: "center"
+  }
+}), p = t("ApSizeInput", (e) => [
+  n(e)
+]);
+export {
+  p as default
+};

package/es/src/business/ap-status/ApStatus.vue2.mjs

@@ -1,7 +1,8 @@
-import { defineComponent as u, computed as a, createElementBlock as d, createCommentVNode as i, openBlock as m, normalizeStyle as r, normalizeClass as s, unref as t, createTextVNode as f, createElementVNode as y, toDisplayString as g } from "vue";
+import { defineComponent as d, computed as a, createElementBlock as m, createCommentVNode as i, openBlock as f, normalizeStyle as s, normalizeClass as r, unref as e, createTextVNode as y, createElementVNode as g, toDisplayString as S } from "vue";
 import "../../config-provider/index.mjs";
-import { useNamespace as x } from "../../config-provider/hooks/use-namespace.mjs";
-const C = /* @__PURE__ */ u({
+import x from "./style/index.mjs";
+import { useNamespace as h } from "../../config-provider/hooks/use-namespace.mjs";
+const B = /* @__PURE__ */ d({
   name: "ApStatus",
   __name: "ApStatus",
   props: {
@@ -12,27 +13,27 @@ const C = /* @__PURE__ */ u({
     style: {}
   },
   setup(l) {
-    const e = l, n = a(() => ({
-      "padding-left": e.padding + "px",
-      "padding-right": e.padding + "px",
-      color: e.color,
-      ...e.style
+    const t = l, n = a(() => ({
+      "padding-left": t.padding + "px",
+      "padding-right": t.padding + "px",
+      color: t.color,
+      ...t.style
     })), p = a(() => ({
-      "background-color": e.color
-    })), { b: c, e: o } = x("ap-status");
-    return (S, _) => e.show ? (m(), d("div", {
+      "background-color": t.color
+    })), { b: c, e: o } = h("ap-status"), u = x("ap-status");
+    return (_, k) => t.show ? (f(), m("div", {
       key: 0,
-      class: s([t(c)()]),
-      style: r(n.value)
+      class: r([e(c)(), e(u)]),
+      style: s(n.value)
     }, [
-      f(g(e.text) + " ", 1),
-      y("div", {
-        class: s([t(o)("bg"), t(o)("primary")]),
-        style: r(p.value)
+      y(S(t.text) + " ", 1),
+      g("div", {
+        class: r([e(o)("bg"), e(o)("primary")]),
+        style: s(p.value)
       }, null, 6)
     ], 6)) : i("", !0);
   }
 });
 export {
-  C as default
+  B as default
 };

package/es/src/business/ap-status/style/index.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+declare const _default: (prefixCls: string) => Ref<string | undefined, string | undefined>;
+export default _default;

package/es/src/business/ap-status/style/index.mjs

@@ -0,0 +1,37 @@
+import { genComponentStyleHook as s } from "../../../utils/cssinjs/index.mjs";
+const n = (t) => {
+  const { componentCls: o } = t;
+  return [
+    `
+    @font-face {
+      font-family: aplusstatusfont;
+      src: url('https://front-ljh.oss-cn-hangzhou.aliyuncs.com/fonts/PlayfairDisplay-SemiBold.ttf');
+      src: url('https://front-ljh.oss-cn-hangzhou.aliyuncs.com/fonts/SourceHanSerifCN-Heavy.woff2');
+    }
+  `,
+    {
+      [o]: {
+        fontSize: t.fontSizeXL,
+        lineHeight: "2",
+        display: "inline-block",
+        position: "relative",
+        fontFamily: "aplusstatusfont",
+        [`${o}__bg`]: {
+          maskImage: "url('https://front-ljh.oss-cn-hangzhou.aliyuncs.com/aplus-ui/svg/ap-status-bg.svg')",
+          maskRepeat: "no-repeat",
+          maskSize: "100% 100%",
+          position: "absolute",
+          left: 0,
+          top: 0,
+          right: 0,
+          bottom: 0
+        }
+      }
+    }
+  ];
+}, l = s("ApStatus", (t) => [
+  n(t)
+]);
+export {
+  l as default
+};

package/es/src/business/ap-summary/ap-summary.vue2.mjs

@@ -1,12 +1,13 @@
-import { defineComponent as I, computed as d, createVNode as N, Fragment as p, createBlock as m, openBlock as l, unref as s, normalizeClass as f, withCtx as y, createElementBlock as w, renderList as z, normalizeStyle as B, resolveDynamicComponent as R } from "vue";
-import { isNil as A, get as i } from "lodash-unified";
-import { TableSummaryRow as D, TableSummaryCell as F } from "@aplus-frontend/antdv";
-import { flattenColumns as V, formatDataIndex as u } from "./utils.mjs";
+import { defineComponent as N, computed as d, createVNode as w, Fragment as p, createBlock as l, openBlock as m, unref as n, normalizeClass as f, withCtx as y, createElementBlock as z, renderList as B, normalizeStyle as R, resolveDynamicComponent as A } from "vue";
+import { isNil as D, get as u } from "lodash-unified";
+import { TableSummaryRow as F, TableSummaryCell as V } from "@aplus-frontend/antdv";
+import { flattenColumns as E, formatDataIndex as i } from "./utils.mjs";
 import "../../config-provider/index.mjs";
-import { isNumeric as E, toThousand as P, toFixed as $ } from "@aplus-frontend/utils";
-import { useLocale as j } from "../../config-provider/hooks/use-locale.mjs";
-import { useNamespace as q } from "../../config-provider/hooks/use-namespace.mjs";
-const X = /* @__PURE__ */ I({
+import { isNumeric as P, toThousand as $, toFixed as j } from "@aplus-frontend/utils";
+import q from "./style/index.mjs";
+import { useLocale as G } from "../../config-provider/hooks/use-locale.mjs";
+import { useNamespace as H } from "../../config-provider/hooks/use-namespace.mjs";
+const tt = /* @__PURE__ */ N({
   name: "ApSummary",
   __name: "ap-summary",
   props: {
@@ -22,43 +23,43 @@ const X = /* @__PURE__ */ I({
     }
   },
   setup(x) {
-    const n = x, {
-      t: k
-    } = j(), h = d(() => n.summaryTitle ?? k("ap.apSummary.total")), T = (e) => e === 0, S = (e, r) => {
-      if (!E(e) || r.valueType !== "number")
+    const s = x, {
+      t: h
+    } = G(), k = d(() => s.summaryTitle ?? h("ap.apSummary.total")), S = (e) => e === 0, T = (e, r) => {
+      if (!P(e) || r.valueType !== "number")
         return e;
       const a = r.fieldProps?.field, t = a?.precision || 0;
-      return (A(a?.thousands) ? !0 : a?.thousands) ? P(e, t) : $(e, t);
+      return (D(a?.thousands) ? !0 : a?.thousands) ? $(e, t) : j(e, t);
     }, C = d(() => {
       let e = [];
-      n.hasSelect && e.push({
+      s.hasSelect && e.push({
         key: "select",
         rowSpan: 1,
         align: "left",
         value: ""
       });
-      const a = V(n.columns).map((t, c) => {
+      const a = E(s.columns).map((t, c) => {
         let o;
-        const b = i(n.data, u(t.dataIndex || t.key));
-        if (T(c))
-          o = h.value;
-        else if (b && (t.customRender || t.renderText)) {
-          const L = i(n.data, u(t.dataIndex || t.key));
+        const I = u(s.data, i(t.dataIndex || t.key));
+        if (S(c))
+          o = k.value;
+        else if (I && (t.customRender || t.renderText)) {
+          const L = u(s.data, i(t.dataIndex || t.key));
           o = (t.customRender || t.renderText)?.({
             value: L,
-            record: n.data,
+            record: s.data,
             text: void 0,
             index: 0,
             renderIndex: 0,
             column: {}
           });
         } else
-          o = S(i(n.data, u(t.dataIndex || t.key)), t);
+          o = T(u(s.data, i(t.dataIndex || t.key)), t);
         return {
           key: t.key,
           rowSpan: 1,
           align: t.align,
-          value: N(p, null, [o])
+          value: w(p, null, [o])
         };
       });
       return e.concat(a);
@@ -66,19 +67,19 @@ const X = /* @__PURE__ */ I({
       b: _,
       e: g,
       em: v
-    } = q("ap-summary");
-    return (e, r) => (l(), m(s(D), {
-      class: f(s(_)())
+    } = H("ap-summary"), b = q("ap-summary");
+    return (e, r) => (m(), l(n(F), {
+      class: f([n(_)(), n(b)])
     }, {
-      default: y(() => [(l(!0), w(p, null, z(C.value, (a, t) => (l(), m(s(F), {
+      default: y(() => [(m(!0), z(p, null, B(C.value, (a, t) => (m(), l(n(V), {
         key: a.key,
-        class: f(`${n.size === "small" ? s(v)("item", "small") : s(g)("item")}`),
+        class: f(`${s.size === "small" ? n(v)("item", "small") : n(g)("item")}`),
         index: t,
-        style: B({
+        style: R({
           textAlign: a.align
         })
       }, {
-        default: y(() => [(l(), m(R(a.value)))]),
+        default: y(() => [(m(), l(A(a.value)))]),
         _: 2
       }, 1032, ["class", "index", "style"]))), 128))]),
       _: 1
@@ -86,5 +87,5 @@ const X = /* @__PURE__ */ I({
   }
 });
 export {
-  X as default
+  tt as default
 };

package/es/src/business/ap-summary/style/index.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'vue';
+declare const _default: (prefixCls: string) => Ref<string | undefined, string | undefined>;
+export default _default;

package/es/src/business/ap-summary/style/index.mjs

@@ -0,0 +1,25 @@
+import { genComponentStyleHook as r } from "../../../utils/cssinjs/index.mjs";
+const a = (o) => {
+  const { componentCls: t } = o;
+  return {
+    [t]: {
+      [`${t}__item`]: {
+        height: "38px",
+        padding: "8px 12px !important",
+        backgroundColor: "var(--ap-summary-background, #f9ecc7) !important",
+        color: "#333",
+        fontWeight: "bolder",
+        "&--small": {
+          height: "28px",
+          padding: "4px 12px !important",
+          backgroundColor: "var(--ap-summary-background, #E6EDFF) !important"
+        }
+      }
+    }
+  };
+}, p = r("ApSummary", (o) => [
+  a(o)
+]);
+export {
+  p as default
+};

package/es/src/business/ap-table-modal/style/index.d.ts

@@ -0,0 +1,5 @@
+import { GenStyleFunc } from '../../../design-token/interface';
+import { Ref } from 'vue';
+export declare const genApTableModalStyle: GenStyleFunc;
+declare const _default: (prefixCls: string) => Ref<string | undefined, string | undefined>;
+export default _default;

package/es/src/business/ap-table-modal/style/index.mjs

@@ -0,0 +1,55 @@
+import { genComponentStyleHook as o } from "../../../utils/cssinjs/index.mjs";
+const t = (e) => ({
+  [`${e.componentCls}`]: {
+    [`${e.componentCls}--table-layout`]: {
+      display: "flex",
+      justifyContent: "space-between",
+      height: "100%",
+      "&.complex-layout": {
+        height: "100%",
+        position: "relative"
+      },
+      "&-left": {
+        flex: 1,
+        minWidth: 0,
+        paddingInlineEnd: "20px",
+        boxSizing: "border-box",
+        display: "flex",
+        flexDirection: "column",
+        "&-content": {
+          flex: 1,
+          ".ant-table-body": {
+            height: "100%"
+          }
+        }
+      },
+      "&-right": {
+        maxHeight: "643px",
+        width: "410px",
+        paddingLeft: "20px",
+        position: "relative",
+        display: "flex",
+        flexDirection: "column",
+        "&-content": {
+          flex: 1,
+          overflowY: "auto"
+        },
+        "&::before": {
+          content: '""',
+          height: "calc(100% + 16px)",
+          width: "1px",
+          backgroundColor: e.borderColorBase,
+          position: "absolute",
+          left: 0,
+          top: "-16px"
+        }
+      }
+    }
+  }
+}), n = o("ApTable.Modal", (e) => [
+  t(e)
+]);
+export {
+  n as default,
+  t as genApTableModalStyle
+};

package/es/src/business/ap-table-modal/table-layout/index.vue2.mjs

@@ -15,11 +15,11 @@ const F = /* @__PURE__ */ N({
   },
   emits: ["clear", "deleteItem"],
   setup(k, { emit: I }) {
-    const { t: d } = V(), u = k, y = I, C = () => {
+    const { t: d } = V(), u = k, y = I, { m: r } = D("ap-table-modal"), C = () => {
       y("clear");
     }, E = (e) => {
       y("deleteItem", e);
-    }, L = (e) => typeof u.rightTitle == "function" ? u.rightTitle(e) : `${d("ap.apTableModal.selected")} (${e})`, { m: r } = D("ap-table-modal");
+    }, L = (e) => typeof u.rightTitle == "function" ? u.rightTitle(e) : `${d("ap.apTableModal.selected")} (${e})`;
     return (e, j) => (l(), o("div", {
       class: a([
         e.renderSelectedItem ? t(r)("table-layout") : "",