@pisell/materials 6.3.25 → 6.3.27

package/lib/components/pisellUrl/components/EditView.js

@@ -0,0 +1,109 @@
+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/pisellUrl/components/EditView.tsx
+var EditView_exports = {};
+__export(EditView_exports, {
+  default: () => EditView_default
+});
+module.exports = __toCommonJS(EditView_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_utils = require("@pisell/utils");
+var import_utils2 = require("../utils");
+var EditView = (props) => {
+  const {
+    placeholder = "请输入 URL 地址",
+    maxLength = 2048,
+    allowClear = false,
+    autoFocus = false,
+    disabled = false,
+    className,
+    style,
+    autoCompleteProtocol = true,
+    defaultProtocol = "https://",
+    strictValidation = true,
+    allowedProtocols,
+    requireProtocol = false,
+    errorMessage,
+    onProtocolComplete
+  } = props;
+  const { value, isValid, errors, handleChange, handleBlur, handleFocus } = (0, import_utils.useTextInputState)({
+    ...props,
+    validator: (val) => {
+      if (!val) return true;
+      const normalizedUrl = autoCompleteProtocol ? (0, import_utils2.normalizeUrl)(val, defaultProtocol) : val;
+      if (strictValidation && !(0, import_utils2.validateUrl)(normalizedUrl)) {
+        return errorMessage || "URL 地址格式不正确";
+      }
+      if (requireProtocol && !val.match(/^[a-z]+:\/\//i)) {
+        return "URL 必须包含协议（如 http:// 或 https://）";
+      }
+      if (allowedProtocols && allowedProtocols.length > 0) {
+        const protocolValidation = (0, import_utils2.validateUrlProtocol)(normalizedUrl, allowedProtocols);
+        if (!protocolValidation.isValid) {
+          return protocolValidation.errors[0];
+        }
+      }
+      return true;
+    }
+  });
+  const handleBlurWithProtocol = () => {
+    if (autoCompleteProtocol && value && !value.match(/^[a-z]+:\/\//i)) {
+      const normalized = (0, import_utils2.normalizeUrl)(value, defaultProtocol);
+      if (normalized !== value) {
+        handleChange(normalized);
+        onProtocolComplete == null ? void 0 : onProtocolComplete(normalized);
+      }
+    }
+    handleBlur();
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-url-edit" }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Input,
+    {
+      type: "url",
+      value,
+      onChange: (e) => handleChange(e.target.value),
+      onBlur: handleBlurWithProtocol,
+      onFocus: handleFocus,
+      prefix: /* @__PURE__ */ import_react.default.createElement(import_icons.LinkOutlined, null),
+      placeholder,
+      maxLength,
+      allowClear,
+      autoFocus,
+      disabled,
+      status: isValid ? void 0 : "error",
+      className,
+      style,
+      "aria-label": props["aria-label"],
+      "aria-describedby": props["aria-describedby"]
+    }
+  ), !isValid && errors.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-url-edit-error" }, errors[0]));
+};
+var EditView_default = EditView;

package/lib/components/pisellUrl/components/ReadOnlyView.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { PisellUrlProps } from '../types';
+/**
+ * PisellUrl 只读态视图组件
+ *
+ * 职责：
+ * - 渲染只读态 URL 链接展示
+ * - 支持点击新窗口打开链接（安全性保障）
+ * - 支持协议/路径隐藏
+ * - 支持链接图标
+ *
+ * @param props 组件 Props
+ */
+declare const ReadOnlyView: React.FC<PisellUrlProps>;
+export default ReadOnlyView;

package/lib/components/pisellUrl/components/ReadOnlyView.js

@@ -0,0 +1,98 @@
+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/pisellUrl/components/ReadOnlyView.tsx
+var ReadOnlyView_exports = {};
+__export(ReadOnlyView_exports, {
+  default: () => ReadOnlyView_default
+});
+module.exports = __toCommonJS(ReadOnlyView_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_utils = require("../utils");
+var ReadOnlyView = (props) => {
+  const {
+    value = "",
+    enableLinkClick = true,
+    openInNewWindow = true,
+    showLinkIcon = true,
+    showProtocol = false,
+    showWww = false,
+    showPathname = true,
+    displayFormat = "full",
+    customFormat,
+    defaultProtocol = "https://",
+    fontSize = 16,
+    fontWeight = 500,
+    color = "#101828",
+    linkColor = "#7F56DA",
+    onLinkClick
+  } = props;
+  const displayUrl = (0, import_utils.formatUrlDisplay)(value, {
+    showProtocol,
+    showWww,
+    showPathname,
+    displayFormat,
+    customFormat
+  });
+  const handleClick = () => {
+    if (enableLinkClick && value) {
+      onLinkClick == null ? void 0 : onLinkClick(value);
+      (0, import_utils.handleUrlClick)(value, openInNewWindow, defaultProtocol);
+    }
+  };
+  const canClick = enableLinkClick && !!value;
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-url-read" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { size: "small" }, showLinkIcon && /* @__PURE__ */ import_react.default.createElement(import_icons.LinkOutlined, { style: { color: linkColor } }), canClick ? /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Typography.Link,
+    {
+      onClick: handleClick,
+      style: {
+        fontSize,
+        fontWeight,
+        color: linkColor
+      },
+      "aria-label": props["aria-label"],
+      "aria-describedby": props["aria-describedby"]
+    },
+    displayUrl
+  ) : /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Typography.Text,
+    {
+      style: {
+        fontSize,
+        fontWeight,
+        color
+      },
+      "aria-label": props["aria-label"],
+      "aria-describedby": props["aria-describedby"]
+    },
+    displayUrl
+  )));
+};
+var ReadOnlyView_default = ReadOnlyView;

package/lib/components/pisellUrl/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * PisellUrl 组件导出文件
+ */
+export { PisellUrl, default } from './PisellUrl';
+export type { PisellUrlProps } from './types';

package/lib/components/pisellUrl/index.js

@@ -0,0 +1,40 @@
+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/pisellUrl/index.tsx
+var pisellUrl_exports = {};
+__export(pisellUrl_exports, {
+  PisellUrl: () => import_PisellUrl.PisellUrl,
+  default: () => import_PisellUrl.default
+});
+module.exports = __toCommonJS(pisellUrl_exports);
+var import_PisellUrl = __toESM(require("./PisellUrl"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PisellUrl
+});

package/lib/components/pisellUrl/types.d.ts

@@ -0,0 +1,160 @@
+import type { CSSProperties } from 'react';
+import type { BaseTextInputProps } from '@pisell/utils';
+/**
+ * PisellUrl 组件 Props 类型定义
+ *
+ * 继承 BaseTextInputProps，添加 URL 特有的配置
+ */
+export interface PisellUrlProps extends BaseTextInputProps {
+    /**
+     * 状态模式
+     * @default 'edit'
+     */
+    mode?: 'read' | 'edit';
+    /**
+     * 是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 是否使用严格校验
+     * @default true
+     */
+    strictValidation?: boolean;
+    /**
+     * 允许的协议列表
+     * @example ['http', 'https']
+     * @default ['http', 'https']
+     */
+    allowedProtocols?: string[];
+    /**
+     * 是否要求必须有协议
+     * @default false
+     */
+    requireProtocol?: boolean;
+    /**
+     * 是否自动补全协议
+     * @default true
+     */
+    autoCompleteProtocol?: boolean;
+    /**
+     * 默认协议
+     * @default 'https://'
+     */
+    defaultProtocol?: 'http://' | 'https://';
+    /**
+     * 协议补全回调
+     * @param url 补全后的 URL
+     */
+    onProtocolComplete?: (url: string) => void;
+    /**
+     * 是否启用链接跳转（只读态）
+     * @default true
+     */
+    enableLinkClick?: boolean;
+    /**
+     * 是否新窗口打开
+     * @default true
+     */
+    openInNewWindow?: boolean;
+    /**
+     * 是否显示链接图标
+     * @default true
+     */
+    showLinkIcon?: boolean;
+    /**
+     * 链接点击回调
+     * @param url URL 地址
+     */
+    onLinkClick?: (url: string) => void;
+    /**
+     * 是否显示协议（只读态）
+     * @default false
+     */
+    showProtocol?: boolean;
+    /**
+     * 是否显示 www 前缀（只读态）
+     * @default false
+     */
+    showWww?: boolean;
+    /**
+     * 是否显示路径（只读态）
+     * @default true
+     */
+    showPathname?: boolean;
+    /**
+     * 显示格式（只读态）
+     * - full: 完整 URL
+     * - domain: 仅域名
+     * - custom: 自定义格式
+     * @default 'full'
+     */
+    displayFormat?: 'full' | 'domain' | 'custom';
+    /**
+     * 自定义格式化函数（只读态）
+     * @param url URL 地址
+     * @returns 格式化后的显示文本
+     */
+    customFormat?: (url: string) => string;
+    /**
+     * 字号
+     * @example '14px' 或 14
+     * @default 16
+     */
+    fontSize?: string | number;
+    /**
+     * 字重
+     * @example 'bold' 或 600
+     * @default 500
+     */
+    fontWeight?: string | number;
+    /**
+     * 文本颜色
+     * @example '#000000'
+     * @default '#101828'
+     */
+    color?: string;
+    /**
+     * 链接颜色（只读态）
+     * @example '#1890ff'
+     * @default '#7F56DA'
+     */
+    linkColor?: string;
+    /**
+     * 占位文本
+     * @default '请输入 URL 地址'
+     */
+    placeholder?: string;
+    /**
+     * 最大长度
+     * @default 2048
+     */
+    maxLength?: number;
+    /**
+     * 是否显示清空按钮
+     * @default false
+     */
+    allowClear?: boolean;
+    /**
+     * 是否自动聚焦
+     * @default false
+     */
+    autoFocus?: boolean;
+    /**
+     * 自定义类名
+     */
+    className?: string;
+    /**
+     * 自定义样式
+     */
+    style?: CSSProperties;
+    /**
+     * ARIA 标签
+     */
+    'aria-label'?: string;
+    /**
+     * ARIA 描述
+     */
+    'aria-describedby'?: string;
+}
+export type { DisplayState, ValidationResult, TextInputState } from '@pisell/utils';

package/lib/components/pisellUrl/types.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/pisellUrl/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/components/pisellUrl/utils/index.js

@@ -0,0 +1,27 @@
+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 __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellUrl/utils/index.ts
+var utils_exports = {};
+module.exports = __toCommonJS(utils_exports);
+__reExport(utils_exports, require("./urlValidator"), module.exports);
+__reExport(utils_exports, require("./urlHelper"), module.exports);
+__reExport(utils_exports, require("./urlFormatter"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./urlValidator"),
+  ...require("./urlHelper"),
+  ...require("./urlFormatter")
+});

package/lib/components/pisellUrl/utils/urlFormatter.js

@@ -0,0 +1,66 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellUrl/utils/urlFormatter.ts
+var urlFormatter_exports = {};
+__export(urlFormatter_exports, {
+  formatUrlDisplay: () => formatUrlDisplay,
+  hideUrlProtocol: () => hideUrlProtocol,
+  hideWwwPrefix: () => hideWwwPrefix
+});
+module.exports = __toCommonJS(urlFormatter_exports);
+var import_urlHelper = require("./urlHelper");
+function formatUrlDisplay(url, options) {
+  if (!url) return "";
+  if (options.displayFormat === "custom" && options.customFormat) {
+    return options.customFormat(url);
+  }
+  if (options.displayFormat === "domain") {
+    return (0, import_urlHelper.extractDomain)(url);
+  }
+  let display = url;
+  if (options.showProtocol === false) {
+    display = display.replace(/^https?:\/\//, "");
+  }
+  if (options.showWww === false) {
+    display = display.replace(/^(https?:\/\/)?(www\.)/, "$1");
+  }
+  if (options.showPathname === false) {
+    try {
+      const urlObj = new URL(url.startsWith("http") ? url : "https://" + url);
+      display = urlObj.hostname;
+      if (options.showProtocol !== false && urlObj.protocol) {
+        display = urlObj.protocol + "//" + display;
+      }
+    } catch {
+    }
+  }
+  return display;
+}
+function hideUrlProtocol(url) {
+  return url.replace(/^https?:\/\//, "");
+}
+function hideWwwPrefix(url) {
+  return url.replace(/^(https?:\/\/)?(www\.)/, "$1");
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  formatUrlDisplay,
+  hideUrlProtocol,
+  hideWwwPrefix
+});

package/lib/components/pisellUrl/utils/urlHelper.js

@@ -0,0 +1,97 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellUrl/utils/urlHelper.ts
+var urlHelper_exports = {};
+__export(urlHelper_exports, {
+  extractDomain: () => extractDomain,
+  extractUrlParams: () => extractUrlParams,
+  handleUrlClick: () => handleUrlClick,
+  isSecureUrl: () => isSecureUrl,
+  normalizeUrl: () => normalizeUrl,
+  smartNormalizeUrl: () => smartNormalizeUrl
+});
+module.exports = __toCommonJS(urlHelper_exports);
+function normalizeUrl(url, defaultProtocol = "https://") {
+  if (!url) return "";
+  const trimmedUrl = url.trim();
+  if (/^[a-z]+:\/\//i.test(trimmedUrl)) {
+    return trimmedUrl;
+  }
+  return defaultProtocol + trimmedUrl;
+}
+function smartNormalizeUrl(url) {
+  if (!url) return "";
+  const trimmedUrl = url.trim();
+  if (/^[a-z]+:\/\//i.test(trimmedUrl)) {
+    return trimmedUrl;
+  }
+  if (trimmedUrl.startsWith("localhost") || trimmedUrl.startsWith("127.0.0.1") || trimmedUrl.startsWith("192.168.") || trimmedUrl.startsWith("10.0.") || trimmedUrl.startsWith("172.")) {
+    return "http://" + trimmedUrl;
+  }
+  return "https://" + trimmedUrl;
+}
+function extractDomain(url) {
+  try {
+    const normalizedUrl = url.startsWith("http") ? url : "https://" + url;
+    const urlObj = new URL(normalizedUrl);
+    return urlObj.hostname;
+  } catch {
+    return url;
+  }
+}
+function handleUrlClick(url, openInNewWindow = true, defaultProtocol = "https://") {
+  if (!url) return;
+  const normalizedUrl = normalizeUrl(url, defaultProtocol);
+  try {
+    new URL(normalizedUrl);
+  } catch {
+    console.warn("Invalid URL:", normalizedUrl);
+    return;
+  }
+  if (openInNewWindow) {
+    window.open(normalizedUrl, "_blank", "noopener,noreferrer");
+  } else {
+    window.location.href = normalizedUrl;
+  }
+}
+function isSecureUrl(url) {
+  return url.startsWith("https://");
+}
+function extractUrlParams(url) {
+  try {
+    const normalizedUrl = url.startsWith("http") ? url : "https://" + url;
+    const urlObj = new URL(normalizedUrl);
+    const params = {};
+    urlObj.searchParams.forEach((value, key) => {
+      params[key] = value;
+    });
+    return params;
+  } catch {
+    return {};
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  extractDomain,
+  extractUrlParams,
+  handleUrlClick,
+  isSecureUrl,
+  normalizeUrl,
+  smartNormalizeUrl
+});