@pisell/materials 2.2.47 → 2.2.49

package/lib/components/dataSourceComponents/fields/Input.Phone/ReadPretty.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { PhoneInputProps } from './WithMode';
+import './ReadPretty.less';
+declare const ReadPretty: React.FC<PhoneInputProps>;
+export default ReadPretty;

package/lib/components/dataSourceComponents/fields/Input.Phone/ReadPretty.js

@@ -0,0 +1,58 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Phone/ReadPretty.tsx
+var ReadPretty_exports = {};
+__export(ReadPretty_exports, {
+  default: () => ReadPretty_default
+});
+module.exports = __toCommonJS(ReadPretty_exports);
+var import_react = __toESM(require("react"));
+var import_libphonenumber_js = require("libphonenumber-js");
+var import_classnames = __toESM(require("classnames"));
+var import_ReadPretty = require("./ReadPretty.less");
+var ReadPretty = ({
+  value,
+  renderMode
+}) => {
+  if (!value)
+    return null;
+  const className = (0, import_classnames.default)("pisell-phone-read-pretty", {
+    "pisell-phone-read-pretty-table-view": renderMode === "tableView"
+  });
+  try {
+    const phoneNumber = (0, import_libphonenumber_js.parsePhoneNumberFromString)(value);
+    if (!phoneNumber)
+      return /* @__PURE__ */ import_react.default.createElement("span", { className }, value);
+    const formattedValue = `(${phoneNumber.formatInternational().split(" ")[0]}) ${phoneNumber.formatNational()}`;
+    return /* @__PURE__ */ import_react.default.createElement("span", { className }, formattedValue);
+  } catch (error) {
+    return /* @__PURE__ */ import_react.default.createElement("span", { className }, value);
+  }
+};
+var ReadPretty_default = ReadPretty;

package/lib/components/dataSourceComponents/fields/Input.Phone/ReadPretty.less

@@ -0,0 +1,11 @@
+.pisell-phone-read-pretty {
+  color: var(--Gray-900, #101828);
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 24px; /* 150% */
+}
+
+.pisell-phone-read-pretty-table-view {
+  font-size: 14px;
+  font-weight: 400;
+}

package/lib/components/dataSourceComponents/fields/Input.Phone/WithMode.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { InputProps } from 'antd';
+import { ModeType } from "../../dataSourceForm/type";
+export interface PhoneInputProps extends Omit<InputProps, 'value' | 'onChange'> {
+    renderMode: ModeType;
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare const PhoneNumberInputWithMode: React.FC<PhoneInputProps & import("../../dataSourceForm/utils").WithModeProps>;
+export default PhoneNumberInputWithMode;

package/lib/components/dataSourceComponents/fields/Input.Phone/WithMode.js

@@ -0,0 +1,161 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Phone/WithMode.tsx
+var WithMode_exports = {};
+__export(WithMode_exports, {
+  default: () => WithMode_default
+});
+module.exports = __toCommonJS(WithMode_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_select = __toESM(require("../../../select"));
+var import_serve = require("./serve");
+var import_ReadPretty = __toESM(require("./ReadPretty"));
+var import_utils2 = require("../../dataSourceForm/utils");
+var import_useTranslationOriginal = __toESM(require("../../../../hooks/useTranslationOriginal"));
+var { Option } = import_select.default;
+var PhoneNumberInput = ({ value: propsValue, onChange, disabled, ...props }) => {
+  const { data: countries = [] } = (0, import_serve.useCountries)();
+  const translationOriginal = (0, import_useTranslationOriginal.default)();
+  const value = (0, import_react.useMemo)(() => {
+    if ((0, import_utils.isNumber)(propsValue)) {
+      return `${propsValue}`;
+    }
+    return propsValue;
+  }, [propsValue]);
+  const parseExternalValue = (val) => {
+    if (!val)
+      return { countryCode: "AU", phoneNumber: "" };
+    const matchedPrefix = countries.find(
+      (country) => val.startsWith(country.prefix)
+    );
+    if (matchedPrefix) {
+      return {
+        countryCode: matchedPrefix.code,
+        phoneNumber: val.slice(matchedPrefix.prefix.length)
+      };
+    }
+    return {
+      countryCode: "AU",
+      phoneNumber: val.replace(/\D/g, "")
+    };
+  };
+  const [countryCode, setCountryCode] = (0, import_react.useState)(
+    () => parseExternalValue(value).countryCode
+  );
+  const [phoneNumber, setPhoneNumber] = (0, import_react.useState)(
+    () => parseExternalValue(value).phoneNumber
+  );
+  (0, import_react.useEffect)(() => {
+    const { countryCode: newCountryCode, phoneNumber: newPhoneNumber } = parseExternalValue(value);
+    setCountryCode(newCountryCode);
+    setPhoneNumber(newPhoneNumber);
+  }, [value, countries]);
+  const handlePhoneNumberChange = (e) => {
+    const cleanNumber = e.target.value.replace(/\D/g, "");
+    setPhoneNumber(cleanNumber);
+    const selectedCountry = countries.find(
+      (c) => c.code === countryCode
+    );
+    const prefix = (selectedCountry == null ? void 0 : selectedCountry.prefix) || "";
+    const newValue = cleanNumber ? `${prefix}${cleanNumber}` : "";
+    onChange == null ? void 0 : onChange(newValue);
+    if (!cleanNumber) {
+      setTimeout(() => {
+        const formInstance = props.form;
+        const fieldName = props.fieldKey;
+        if (formInstance && fieldName) {
+          formInstance.validateFields([fieldName]);
+        }
+      });
+    }
+  };
+  const handleCountryChange = (value2) => {
+    setCountryCode(value2);
+    const selectedCountry = countries.find(
+      (c) => c.code === value2
+    );
+    const prefix = (selectedCountry == null ? void 0 : selectedCountry.prefix) || "";
+    const newValue = `${prefix}${phoneNumber}`;
+    onChange == null ? void 0 : onChange(newValue);
+    setTimeout(() => {
+      const formInstance = props.form;
+      const fieldName = props.fieldKey;
+      if (formInstance && fieldName) {
+        formInstance.validateFields([fieldName]);
+      }
+    });
+  };
+  const concatenatedNumber = (0, import_react.useMemo)(() => {
+    const selectedCountry = countries.find(
+      (c) => c.code === countryCode
+    );
+    if (phoneNumber.length === 0) {
+      return "";
+    }
+    const prefix = (selectedCountry == null ? void 0 : selectedCountry.prefix) || "";
+    return `${prefix}${phoneNumber}`;
+  }, [countryCode, phoneNumber, countries]);
+  const handleBlur = () => {
+    const finalValue = concatenatedNumber;
+    onChange == null ? void 0 : onChange(finalValue);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Space.Compact, { block: true }, /* @__PURE__ */ import_react.default.createElement(
+    import_select.default,
+    {
+      disabled,
+      value: countryCode,
+      onChange: handleCountryChange,
+      style: { width: "90px" },
+      popupMatchSelectWidth: false,
+      optionLabelProp: "inputValue",
+      optionFilterProp: "label",
+      showSearch: true,
+      options: countries.map((country) => ({
+        value: country.code,
+        label: `${translationOriginal(country.name)} (${country.prefix})`,
+        inputValue: country.prefix
+      }))
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Input,
+    {
+      ...props,
+      disabled,
+      type: "tel",
+      value: phoneNumber,
+      onChange: handlePhoneNumberChange,
+      onBlur: handleBlur,
+      style: { flex: 1 }
+    }
+  ));
+};
+var PhoneNumberInputWithMode = (0, import_utils2.withMode)(PhoneNumberInput, import_ReadPretty.default);
+var WithMode_default = PhoneNumberInputWithMode;

package/lib/components/dataSourceComponents/fields/Input.Phone/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Phone: React.FC<import("./WithMode").PhoneInputProps & import("../../dataSourceForm/utils").WithModeProps & import("../../dataSourceForm/utils").WithFormItemProps>;
+export default Phone;

package/lib/components/dataSourceComponents/fields/Input.Phone/index.js

@@ -0,0 +1,38 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Phone/index.tsx
+var Input_exports = {};
+__export(Input_exports, {
+  default: () => Input_default
+});
+module.exports = __toCommonJS(Input_exports);
+var import_utils = require("../../dataSourceForm/utils");
+var import_WithMode = __toESM(require("./WithMode"));
+var Phone = (0, import_utils.withFormItem)(import_WithMode.default);
+var Input_default = Phone;

package/lib/components/dataSourceComponents/fields/Input.Phone/serve.d.ts

@@ -0,0 +1,24 @@
+/**
+ * 获取nocobase数据列表
+ */
+export declare const getCountryDataList: () => Promise<any>;
+export interface Country {
+    id: number;
+    name: {
+        en: string;
+        "zh-CN": string;
+        "zh-HK": string;
+        original: string;
+    };
+    code: string;
+    calling_code: string;
+    currency_code: string;
+    sort: number;
+    status: string;
+    created_at: string;
+    updated_at: string;
+    prefix: string;
+}
+export declare const useCountries: () => {
+    data: Country[];
+};

package/lib/components/dataSourceComponents/fields/Input.Phone/serve.js

@@ -0,0 +1,89 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Phone/serve.ts
+var serve_exports = {};
+__export(serve_exports, {
+  getCountryDataList: () => getCountryDataList,
+  useCountries: () => useCountries
+});
+module.exports = __toCommonJS(serve_exports);
+var import_react = require("react");
+var import_ahooks = require("ahooks");
+var import_utils = require("../../../table/utils");
+var import_usePlatform = require("../../hooks/usePlatform");
+var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
+var getCountryDataList = async () => {
+  const { data } = await import_utils.request.getRequest().get(`/country:list`, {}, {
+    isNocobase: true,
+    fullResult: true,
+    headers: {
+      "x-data-source": "pisell2"
+    }
+  });
+  return data.map((item) => ({
+    ...item,
+    prefix: `+${item.calling_code}`
+  }));
+};
+var useCountries = () => {
+  const isShop = (0, import_usePlatform.useIsShop)();
+  const { appHelper } = (0, import_useEngineContext.default)();
+  const { data, run } = (0, import_ahooks.useRequest)(getCountryDataList, {
+    cacheKey: "phone-countries",
+    staleTime: 1e3 * 60 * 5,
+    // 5分钟后数据过期
+    cacheTime: 1e3 * 60 * 60,
+    // 1小时后清除缓存
+    manual: true
+  });
+  (0, import_react.useEffect)(() => {
+    if (!isShop) {
+      run();
+    }
+  }, [isShop]);
+  const currentData = (0, import_react.useMemo)(() => {
+    var _a, _b, _c, _d;
+    if (isShop) {
+      const codeList = (_d = (_c = (_b = (_a = appHelper == null ? void 0 : appHelper.utils) == null ? void 0 : _a.store) == null ? void 0 : _b.getState()) == null ? void 0 : _c.global) == null ? void 0 : _d.codeList;
+      if (codeList) {
+        return codeList.map((item) => ({
+          ...item,
+          prefix: `+${item.calling_code}`
+        }));
+      }
+    }
+    return data;
+  }, [isShop, data]);
+  return { data: currentData };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  getCountryDataList,
+  useCountries
+});

package/lib/components/dataSourceComponents/fields/Input.Phone/type.d.ts

@@ -0,0 +1,5 @@
+import { InputProps as AntInputProps } from 'antd';
+import { ModeType } from "../../dataSourceForm/type";
+export interface InputProps extends AntInputProps {
+    renderMode: ModeType;
+}

package/lib/components/dataSourceComponents/fields/Input.Phone/type.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Phone/type.ts
+var type_exports = {};
+module.exports = __toCommonJS(type_exports);

package/lib/components/dataSourceComponents/fields/Input.Subdomain/ReadPretty.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { InputProps } from './type';
+import './ReadPretty.less';
+declare const InputReadPretty: (props: InputProps) => JSX.Element;
+export default InputReadPretty;

package/lib/components/dataSourceComponents/fields/Input.Subdomain/ReadPretty.js

@@ -0,0 +1,50 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Subdomain/ReadPretty.tsx
+var ReadPretty_exports = {};
+__export(ReadPretty_exports, {
+  default: () => ReadPretty_default
+});
+module.exports = __toCommonJS(ReadPretty_exports);
+var import_react = __toESM(require("react"));
+var import_classnames = __toESM(require("classnames"));
+var import_ReadPretty = require("./ReadPretty.less");
+var InputReadPretty = (props) => {
+  const { value, renderMode } = props;
+  return /* @__PURE__ */ import_react.default.createElement(
+    "span",
+    {
+      className: (0, import_classnames.default)("pisell-input-email-read-pretty", {
+        "pisell-input-email-read-pretty-table-view": renderMode === "tableView"
+      })
+    },
+    value
+  );
+};
+var ReadPretty_default = InputReadPretty;

package/lib/components/dataSourceComponents/fields/Input.Subdomain/ReadPretty.less

@@ -0,0 +1,11 @@
+.pisell-input-email-read-pretty {
+  color: var(--Gray-900, #101828);
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 24px; /* 150% */
+}
+
+.pisell-input-email-read-pretty-table-view {
+  font-size: 14px;
+  font-weight: 400;
+}

package/lib/components/dataSourceComponents/fields/Input.Subdomain/WithMode.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { InputProps } from 'antd';
+declare const SubdomainlWithMode: React.FC<InputProps & {
+    onChange: (value: string) => void;
+    onBlur?: ((e: React.FocusEvent<HTMLInputElement>) => void) | undefined;
+    rootDomain: 'xzero' | 'saas' | 'custom';
+    customDomain?: string | undefined;
+    value?: string | undefined;
+    tenantId: string;
+    name?: string | undefined;
+    fieldKey?: string | undefined;
+} & import("../../dataSourceForm/utils").WithModeProps>;
+export default SubdomainlWithMode;