@pisell/materials 6.3.27 → 6.3.28

package/es/components/pisellSingleSelect/components/ReadOnlyView.js

@@ -1,20 +1,21 @@
 /**
  * PisellSingleSelect - ReadOnlyView (只读态视图)
- * 只读状态下的渲染
+ * 只读状态下使用 Tag 展示选中值
  */
 
 import React, { useMemo } from 'react';
+import { Tag } from 'antd';
 import classNames from 'classnames';
 import { findOptionByValue } from '@pisell/utils';
+import { getDefaultTagColor } from "../../../utils/tagColor";
 var ReadOnlyView = function ReadOnlyView(props) {
+  var _selectedOption$color;
   var value = props.value,
     options = props.options,
     label = props.label,
     required = props.required,
     className = props.className,
     style = props.style;
-
-  // 查找选中的选项
   var selectedOption = useMemo(function () {
     return value !== null && value !== undefined ? findOptionByValue(value, options) : undefined;
   }, [value, options]);
@@ -27,9 +28,12 @@ var ReadOnlyView = function ReadOnlyView(props) {
     })
   }, label), /*#__PURE__*/React.createElement("div", {
     className: "pisell-single-select-readonly-display"
-  }, selectedOption ? /*#__PURE__*/React.createElement(React.Fragment, null, selectedOption.icon && /*#__PURE__*/React.createElement("span", {
-    className: "pisell-single-select-readonly-icon"
-  }, selectedOption.icon), /*#__PURE__*/React.createElement("span", null, selectedOption.label)) : /*#__PURE__*/React.createElement("span", {
+  }, selectedOption ? /*#__PURE__*/React.createElement(Tag, {
+    className: "pisell-single-select-readonly-tag",
+    color: (_selectedOption$color = selectedOption.color) !== null && _selectedOption$color !== void 0 ? _selectedOption$color : getDefaultTagColor(selectedOption.value, 0)
+  }, selectedOption.icon && /*#__PURE__*/React.createElement("span", {
+    className: "pisell-single-select-readonly-tag-icon"
+  }, selectedOption.icon), selectedOption.label) : /*#__PURE__*/React.createElement("span", {
     className: "pisell-single-select-readonly-empty"
   }, "-")));
 };

package/es/components/pisellSingleSelect/index.d.ts

@@ -1,6 +1,7 @@
 /**
  * PisellSingleSelect 组件导出
  */
-export { default as PisellSingleSelect } from './PisellSingleSelect';
+import PisellSingleSelect from './PisellSingleSelect';
+export { PisellSingleSelect };
 export type { PisellSingleSelectProps, SingleSelectRef, EditViewProps, DisabledViewProps, ReadOnlyViewProps, } from './types';
 export type { SelectOption, FilterOptionFunc, SortDirection, SelectState, } from './types';

package/es/components/pisellSingleSelect/index.js

@@ -2,6 +2,21 @@
  * PisellSingleSelect 组件导出
  */
 
-export { default as PisellSingleSelect } from "./PisellSingleSelect";
+import { getText } from "../../locales";
+import PisellSingleSelect from "./PisellSingleSelect";
+
+/** RecordBoard 列 type 联动排序：内置 First → Last / Last → First */
+PisellSingleSelect.SortOptions = {
+  getSortItems: function getSortItems(fieldKey) {
+    return [{
+      key: "".concat(fieldKey, ":asc"),
+      label: getText('sort-first-last')
+    }, {
+      key: "".concat(fieldKey, ":desc"),
+      label: getText('sort-last-first')
+    }];
+  }
+};
+export { PisellSingleSelect };
 
 // 公共类型从 types 中重新导出，方便使用

package/es/components/pisellTimeRangeDisplay/PisellTimeRangeDisplay.js

@@ -10,6 +10,7 @@ import 'dayjs/locale/zh-cn';
 import 'dayjs/locale/en';
 import { parseTimeRange, getDayjsLocale, getRelativeDay } from "./utils";
 import { TimeRangeBlock, DateBlock, WeekdayBlock, DurationBlock } from "./components";
+import useEngineContext from "../../hooks/useEngineContext";
 import "./PisellTimeRangeDisplay.less";
 
 /**
@@ -37,7 +38,7 @@ import "./PisellTimeRangeDisplay.less";
  * />
  */
 export var PisellTimeRangeDisplay = function PisellTimeRangeDisplay(props) {
-  var _durationFormat$showS;
+  var _context$engine, _durationFormat$showS;
   var startAt = props.startAt,
     endAt = props.endAt,
     _props$textAlign = props.textAlign,
@@ -58,9 +59,11 @@ export var PisellTimeRangeDisplay = function PisellTimeRangeDisplay(props) {
     className = props.className,
     style = props.style,
     onClick = props.onClick;
+  var context = useEngineContext();
+  var resolvedLocale = localeProp || (context === null || context === void 0 || (_context$engine = context.engine) === null || _context$engine === void 0 || (_context$engine = _context$engine.props) === null || _context$engine === void 0 ? void 0 : _context$engine.locale) || 'en';
   var effectiveLocale = useMemo(function () {
-    return localeProp !== null && localeProp !== void 0 ? localeProp : getDayjsLocale();
-  }, [localeProp]);
+    return getDayjsLocale(resolvedLocale);
+  }, [resolvedLocale]);
   var _useMemo = useMemo(function () {
       return parseTimeRange(startAt, endAt, effectiveLocale);
     }, [startAt, endAt, effectiveLocale]),

package/es/components/pisellTimeRangeDisplay/utils/formatDuration.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 将毫秒数格式化为持续时间字符串（d h m s 或 天/时/分/秒）
+ *
+ * @param ms 持续时间（毫秒）
+ * @param showSeconds 是否显示秒，默认 false
+ * @param locale 语言代码，zh 时使用「天/时/分/秒」，否则使用 d/h/m/s
+ * @returns 如 "2h30m"、"1d2h30m23s" 或 "2时30分"、"1天2时30分23秒"
+ *
+ * @example
+ * formatDuration(9000000, false)        // => "2h30m"
+ * formatDuration(9000000, false, 'zh-cn') // => "2时30分"
+ * formatDuration(86400000, false)       // => "1d"
+ */
+export declare function formatDuration(ms: number, showSeconds?: boolean, locale?: string): string;

package/es/components/pisellUrl/PisellUrl.less

@@ -1,37 +1,135 @@
 /**
  * PisellUrl 组件样式
+ * 基于 Figma 设计规范，与 SingleLineText / PisellEmail 设计体系一致，覆盖时使用 pisell-lowcode-xxx
  */
 
 .pisell-url {
   &-edit {
+    position: relative;
     width: 100%;
 
-    // 错误提示样式
-    &-error {
-      margin-top: 4px;
-      font-size: 12px;
-      color: #ff4d4f;
-      line-height: 1.5;
+    // Input 组件内置样式（Figma 设计规范）
+    .pisell-lowcode-input,
+    .pisell-lowcode-input-affix-wrapper {
+      font-size: 16px !important;
+      line-height: 24px !important;
+      border-radius: 8px !important;
+      border: 1px solid #d0d5dd !important; // Gray/300
+      padding: 12px 16px !important;
+      height: 48px !important;
+      color: #101828 !important; // Gray/900
+      background-color: #ffffff !important;
+
+      &::placeholder {
+        color: #667085 !important; // Gray/500
+      }
+
+      &:focus,
+      &:focus-within {
+        border-color: #d6bbfb !important; // Primary/300
+        box-shadow: 0 0 0 4px #f4ebff !important; // Primary/100
+        outline: none !important;
+      }
+
+      &:hover:not(:focus):not(:focus-within):not([disabled]) {
+        border-color: #b692f6 !important; // Primary/400
+      }
+
+      &[disabled],
+      &.pisell-lowcode-input-disabled {
+        background-color: #f9fafb !important; // Gray/50
+        color: #98a2b3 !important; // Gray/400
+        border-color: #d0d5dd !important;
+        cursor: not-allowed !important;
+      }
+    }
+
+    // 带前缀（链接图标）的 Input 容器
+    .pisell-lowcode-input-affix-wrapper {
+      padding: 0 !important;
+
+      .pisell-lowcode-input-prefix {
+        margin-right: 8px;
+        margin-left: 16px;
+        color: #667085; // Gray/500
+        font-size: 16px;
+      }
+
+      .pisell-lowcode-input-suffix {
+        margin-left: 8px;
+        margin-right: 16px;
+        color: #667085;
+        font-size: 16px;
+      }
+
+      .pisell-lowcode-input {
+        padding: 12px 0 !important;
+        border: none !important;
+        box-shadow: none !important;
+
+        &:focus {
+          box-shadow: none !important;
+        }
+      }
+    }
+
+    // 清空按钮
+    .pisell-lowcode-input-clear-icon {
+      color: #667085 !important;
+      font-size: 14px !important;
+
+      &:hover {
+        color: #344054 !important; // Gray/700
+      }
+    }
+
+    // 错误状态
+    .pisell-lowcode-input-status-error,
+    .pisell-lowcode-input-affix-wrapper-status-error {
+      border-color: #fda29b !important; // Error/300
+
+      &:focus,
+      &:focus-within {
+        border-color: #f97066 !important; // Error/400
+        box-shadow: 0 0 0 4px #fee4e2 !important; // Error/100
+      }
+
+      &:hover:not(:focus):not(:focus-within) {
+        border-color: #f97066 !important; // Error/400
+      }
     }
   }
 
+  // 错误提示（与设计体系一致）
+  &-edit-error {
+    margin-top: 4px;
+    font-size: 12px;
+    color: #d92d20; // Error/600
+    line-height: 1.5;
+    animation: pisell-url-fadeIn 0.3s ease-in-out;
+  }
+
   &-read {
     display: inline-flex;
     align-items: center;
 
-    // 链接样式
     .pisell-lowcode-typography-link {
       cursor: pointer;
-      transition: all 0.3s;
+      transition: color 0.2s ease-in-out;
 
       &:hover {
-        opacity: 0.8;
+        color: #6d48c4 !important;
+      }
+
+      &:active {
+        color: #5f3da8 !important;
       }
     }
 
-    // 链接图标
-    .anticon-link {
+    // 链接图标（只读态 Space 内第一项）
+    .pisell-lowcode-space-item:first-child {
       font-size: 14px;
+      line-height: 1;
     }
   }
 
@@ -44,3 +142,14 @@
     }
   }
 }
+
+@keyframes pisell-url-fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(-4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}

package/es/components/pisellUrl/PisellUrl.stories.js

@@ -19,7 +19,7 @@ import React from 'react';
  * - 协议白名单限制
  */
 var meta = {
-  title: '表单/PisellUrl',
+  title: '表单/表单组件/PisellUrl',
   component: PisellUrl,
   parameters: {
     layout: 'centered',

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

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

package/es/components/pisellUrl/index.js

@@ -2,4 +2,20 @@
  * PisellUrl 组件导出文件
  */
 
-export { PisellUrl, default } from "./PisellUrl";
+import { getText } from "../../locales";
+import PisellUrl from "./PisellUrl";
+
+/** RecordBoard 列 type 联动排序：内置 A → Z / Z → A */
+PisellUrl.SortOptions = {
+  getSortItems: function getSortItems(fieldKey) {
+    return [{
+      key: "".concat(fieldKey, ":asc"),
+      label: getText('sort-a-z')
+    }, {
+      key: "".concat(fieldKey, ":desc"),
+      label: getText('sort-z-a')
+    }];
+  }
+};
+export { PisellUrl };
+export default PisellUrl;

package/es/components/pisellUrl/utils/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * PisellUrl 工具函数导出
+ */
+export * from './urlValidator';
+export * from './urlHelper';
+export * from './urlFormatter';

package/es/components/pisellUrl/utils/urlFormatter.d.ts

@@ -0,0 +1,38 @@
+/**
+ * URL 格式化工具函数
+ */
+/**
+ * 格式化 URL 显示
+ * @param url URL 地址
+ * @param options 格式化选项
+ * @returns 格式化后的 URL
+ *
+ * @example
+ * formatUrlDisplay('https://www.example.com/path', { showProtocol: false })
+ * // 'www.example.com/path'
+ */
+export declare function formatUrlDisplay(url: string, options: {
+    showProtocol?: boolean;
+    showWww?: boolean;
+    showPathname?: boolean;
+    displayFormat?: 'full' | 'domain' | 'custom';
+    customFormat?: (url: string) => string;
+}): string;
+/**
+ * 隐藏 URL 协议
+ * @param url URL 地址
+ * @returns 隐藏协议后的 URL
+ *
+ * @example
+ * hideUrlProtocol('https://example.com') // 'example.com'
+ */
+export declare function hideUrlProtocol(url: string): string;
+/**
+ * 隐藏 www 前缀
+ * @param url URL 地址
+ * @returns 隐藏 www 后的 URL
+ *
+ * @example
+ * hideWwwPrefix('https://www.example.com') // 'https://example.com'
+ */
+export declare function hideWwwPrefix(url: string): string;

package/es/components/pisellUrl/utils/urlHelper.d.ts

@@ -0,0 +1,63 @@
+/**
+ * URL 辅助函数
+ */
+/**
+ * 规范化 URL（补全协议）
+ * @param url URL 地址
+ * @param defaultProtocol 默认协议
+ * @returns 规范化后的 URL
+ *
+ * @example
+ * normalizeUrl('example.com', 'https://') // 'https://example.com'
+ * normalizeUrl('http://example.com', 'https://') // 'http://example.com'
+ */
+export declare function normalizeUrl(url: string, defaultProtocol?: string): string;
+/**
+ * 智能补全协议（识别 localhost）
+ * @param url URL 地址
+ * @returns 规范化后的 URL
+ *
+ * @example
+ * smartNormalizeUrl('localhost:3000') // 'http://localhost:3000'
+ * smartNormalizeUrl('example.com') // 'https://example.com'
+ */
+export declare function smartNormalizeUrl(url: string): string;
+/**
+ * 提取域名
+ * @param url URL 地址
+ * @returns 域名
+ *
+ * @example
+ * extractDomain('https://www.example.com/path') // 'www.example.com'
+ */
+export declare function extractDomain(url: string): string;
+/**
+ * 处理链接跳转（安全性保障）
+ * @param url URL 地址
+ * @param openInNewWindow 是否新窗口打开
+ * @param defaultProtocol 默认协议
+ *
+ * @example
+ * handleUrlClick('example.com', true, 'https://')
+ */
+export declare function handleUrlClick(url: string, openInNewWindow?: boolean, defaultProtocol?: string): void;
+/**
+ * 检测是否为安全链接（HTTPS）
+ * @param url URL 地址
+ * @returns 是否为 HTTPS
+ *
+ * @example
+ * isSecureUrl('https://example.com') // true
+ * isSecureUrl('http://example.com') // false
+ */
+export declare function isSecureUrl(url: string): boolean;
+/**
+ * 提取 URL 参数
+ * @param url URL 地址
+ * @returns 参数对象
+ *
+ * @example
+ * extractUrlParams('https://example.com?foo=bar&baz=qux')
+ * // { foo: 'bar', baz: 'qux' }
+ */
+export declare function extractUrlParams(url: string): Record<string, string>;

package/es/components/pisellUrl/utils/urlValidator.d.ts

@@ -0,0 +1,46 @@
+/**
+ * URL 校验工具函数
+ */
+/**
+ * URL 格式校验（使用 URL 构造函数）
+ * @param url URL 地址
+ * @returns 是否通过校验
+ *
+ * @example
+ * validateUrl('https://example.com') // true
+ * validateUrl('invalid-url') // false
+ */
+export declare function validateUrl(url: string): boolean;
+/**
+ * URL 正则校验（备选方法）
+ * @param url URL 地址
+ * @returns 是否通过校验
+ */
+export declare function validateUrlByRegex(url: string): boolean;
+/**
+ * 解析 URL 各部分
+ * @param url URL 地址
+ * @returns URL 各部分或 null
+ *
+ * @example
+ * parseUrl('https://example.com:8080/path?key=value#hash')
+ * // { protocol: 'https', host: 'example.com', port: '8080', ... }
+ */
+export declare function parseUrl(url: string): {
+    protocol: string;
+    host: string;
+    port: string;
+    pathname: string;
+    search: string;
+    hash: string;
+} | null;
+/**
+ * 协议白名单校验
+ * @param url URL 地址
+ * @param allowedProtocols 允许的协议列表
+ * @returns 校验结果
+ */
+export declare function validateUrlProtocol(url: string, allowedProtocols: string[]): {
+    isValid: boolean;
+    errors: string[];
+};

package/es/components/select/index.less

@@ -5,16 +5,32 @@
   &-select-dropdown-render-divider {
     margin: 8px 0;
   }
+
   &-select-dropdown-render-options-wrap {
     padding: 0 5px 5px;
   }
+
+  &-select-clear {
+    color: #667085;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 36px;
+    min-height: 36px;
+    margin: -18px -6px;
+    padding: 8px 6px;
+
+    &:hover {
+      color: #344054;
+    }
+  }
 }
 
 // 添加选项间距
 .pisell-base-select-dropdown {
   .pisell-lowcode-select-item {
     margin-bottom: 4px;
-    
+
     &:last-child {
       margin-bottom: 0;
     }
@@ -27,4 +43,4 @@
 
   box-shadow: none !important;
   border-color: transparent !important;
-}
+}

package/es/components/sort/index.js

@@ -70,6 +70,19 @@ var sortChildrenMap = {
         content: getText('sort-9-0')
       })
     }];
+  },
+  option: function option(key, isLocal) {
+    return [{
+      key: "".concat(key, ":asc").concat(isLocal ? ':option' : ''),
+      label: /*#__PURE__*/React.createElement(Label, {
+        content: getText('sort-first-last')
+      })
+    }, {
+      key: "".concat(key, ":desc").concat(isLocal ? ':option' : ''),
+      label: /*#__PURE__*/React.createElement(Label, {
+        content: getText('sort-last-first')
+      })
+    }];
   }
 };
 var Sort = function Sort(_ref2) {
@@ -83,12 +96,21 @@ var Sort = function Sort(_ref2) {
     localPagination = _ref2.localPagination;
   var sortItems = useMemo(function () {
     return list.map(function (d) {
+      var children = d.getSortItems ? d.getSortItems(d.name).map(function (_ref3) {
+        var key = _ref3.key,
+          label = _ref3.label;
+        return {
+          key: key,
+          label: /*#__PURE__*/React.createElement(Label, {
+            content: label
+          })
+        };
+      }) : sortChildrenMap[d.type](d.name, !!(d !== null && d !== void 0 && d.localFilter));
       return {
         key: d.name,
         label: d.label,
-        children: sortChildrenMap[d.type](d.name, !!(d !== null && d !== void 0 && d.localFilter)),
+        children: children,
         popupClassName: "".concat(prefix, "sort-sub-menu-popup-wrap ").concat(prefix, "dropdown-css-var"),
-        // 增加显示隐藏配置
         className: "".concat(d.isHidden ? "".concat(prefix, "sort-menu-wrap-hide") : '')
       };
     });
@@ -133,7 +155,7 @@ var Sort = function Sort(_ref2) {
       items: sortItems,
       onClick: onClick,
       selectable: true,
-      selectedKeys: value
+      selectedKeys: value != null && value !== '' ? [value] : []
     }
   }, btnContent);
 };

package/es/components/sort/types.d.ts

@@ -1,13 +1,32 @@
 import { MenuProps } from "antd";
 import React from "react";
+/** 单个排序子项（如 A→Z、0→9），由组件的 getSortItems 返回 */
+export declare type SortOptionItem = {
+    key: string;
+    label: string;
+};
 export declare type SortItemProps = {
-    type: "date" | "string" | "number";
+    /** 排序类型，与 sortChildrenMap 对应；当 getSortItems 存在时可省略 */
+    type?: "date" | "string" | "number" | "option";
     label?: string;
     name?: string | string[];
     isCustom: boolean;
     columnKey?: string;
     localFilter?: boolean;
     isHidden?: boolean;
+    /** 由组件内置导出：直接返回该列的排序子项，优先于 type */
+    getSortItems?: (fieldKey: string) => SortOptionItem[];
+};
+/**
+ * 组件侧导出的排序支持契约（如 PisellSingleLineText.SortOptions）。
+ * 支持两种形态：
+ * - getSortItems：组件内置完整排序项（key + label），优先使用；
+ * - type：仅类型，由 Sort 的 sortChildrenMap 生成子项（兼容旧用法）。
+ */
+export declare type SortOptionType = (Pick<SortItemProps, "type"> & Partial<Pick<SortItemProps, "label" | "localFilter" | "isHidden">>) | {
+    getSortItems: (fieldKey: string) => SortOptionItem[];
+    label?: string;
+    isHidden?: boolean;
 };
 export declare type SortListProps = {
     list: SortItemProps[];

package/es/components/table/Table/fields/date/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import filter from "./filterUtil";
 declare const _default: {
     field: {

package/es/components/table/Table/fields/image/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     field: {
         field_icon: string;

package/es/components/table/Table/fields/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const fieldMaps: {
     text: {
         field: {
@@ -198,12 +197,12 @@ export declare const fieldList: ({
     field_icon: string;
     field_name: string;
     field_type: string;
-    default_value: boolean;
+    default_value: string;
 } | {
     field_icon: string;
     field_name: string;
     field_type: string;
-    default_value: string;
+    default_value: boolean;
 } | {
     field_icon: string;
     field_name: string;

package/es/components/table/Table/fields/link/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     field: {
         field_icon: string;

package/es/components/table/Table/fields/number/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import filter from "./filterUtil";
 declare const _default: {
     field: {

package/es/components/table/Table/fields/numberRange/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import filter from "./filterUtil";
 declare const _default: {
     field: {

package/es/components/table/Table/fields/oldRangePicker/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import filter from "./filterUtil";
 declare const _default: {
     field: {

package/es/components/table/Table/fields/pSwitch/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     field: {
         field_icon: string;