@pisell/materials 1.8.18 → 1.8.19

package/lib/components/dataSourceComponents/fields/RecordListWrapper/type.d.ts

@@ -0,0 +1,87 @@
+import React from 'react';
+import { ModeType } from '../../dataSourceForm/type';
+export interface RecordListWrapperOption {
+    label?: React.ReactNode;
+    value: string | number;
+}
+export interface RecordListWrapperFieldSchema {
+    name: string;
+    label?: React.ReactNode;
+    component?: string;
+    componentName?: string;
+    type?: string;
+    /** 接口类型，用于映射到具体组件（如 Select、Input 等） */
+    interface?: string;
+    options?: RecordListWrapperOption[];
+    props?: Record<string, any>;
+    /** 子字段（用于嵌套结构，如 Input.JSON） */
+    children?: RecordListWrapperFieldSchema[];
+    _children?: RecordListWrapperFieldSchema[];
+    schema?: Record<string, any>;
+    uiSchema?: {
+        title?: React.ReactNode;
+        enum?: RecordListWrapperOption[];
+        'x-component'?: string;
+        'x-component-props'?: Record<string, any>;
+        'x-read-pretty'?: boolean;
+        'x-validator'?: string;
+        'x-display'?: 'visible' | 'hidden' | 'none';
+        'x-pattern'?: 'editable' | 'disabled' | 'readPretty';
+        'x-data-source'?: {
+            type?: string;
+            options?: Array<{
+                id?: string;
+                label: string | Record<string, any>;
+                value: string;
+                color?: string;
+            }>;
+            labelField?: string;
+            valueField?: string;
+            dataSource?: any;
+            extraParams?: Record<string, any>;
+        };
+        'x-record-schema'?: RecordListWrapperSchema | RecordListWrapperFieldSchema[] | string;
+        default?: any;
+        type?: 'string' | 'number' | 'integer' | 'boolean' | 'array' | 'object';
+    };
+}
+export interface RecordListWrapperSchema {
+    fields?: RecordListWrapperFieldSchema[];
+    properties?: Record<string, any>;
+    children?: RecordListWrapperFieldSchema[];
+}
+/**
+ * @title RecordListWrapper 组件 Props
+ * @description
+ * 值结构为 Map：key 是 xDataSource option 的 value，value 是该 option 对应的表单字段值。
+ * 例如：{ "5": { "code": "xxx", "type": "yyy" }, "3": { "code": "aaa" } }
+ */
+export interface RecordListWrapperProps {
+    renderMode: ModeType;
+    /**
+     * 值: Map 结构
+     * - key: xDataSource option 的 value
+     * - value: 该 option 对应的 xRecordSchema 字段值对象
+     */
+    value?: Record<string, Record<string, any>>;
+    onChange?: (value: Record<string, Record<string, any>>) => void;
+    /** xDataSource 选项列表，驱动 tabs 导航和 records 结构 */
+    options?: RecordListWrapperOption[];
+    /**
+     * 上部插槽：用户可在低代码平台拖入自定义导航组件。
+     * RecordListWrapper 会通过 cloneElement 注入 options、value（activeKey）、onChange。
+     */
+    topSlot?: React.ReactNode;
+    slot?: React.ReactNode;
+    /** xRecordSchema：定义每条记录的子字段结构 */
+    xRecordSchema?: string | RecordListWrapperSchema | RecordListWrapperFieldSchema[];
+    /** 容器 children：低代码引擎渲染的子组件节点 */
+    children?: React.ReactNode;
+    /** 低代码设计模式标识 */
+    __designMode?: string;
+    /**
+     * 默认激活的 Tab key，外部传入时优先于 options[0].value
+     */
+    defaultValue?: string;
+    [key: string]: any;
+}

package/lib/components/dataSourceComponents/fields/RecordListWrapper/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/RecordListWrapper/type.ts
+var type_exports = {};
+module.exports = __toCommonJS(type_exports);

package/lib/components/dataSourceComponents/fields/Select/index.d.ts

@@ -1,12 +1,12 @@
-import React from 'react';
+/// <reference types="react" />
 declare const SelectWithDataSource: (props: import("antd").SelectProps<any, import("antd/es/select").DefaultOptionType> & import("../../dataSourceForm/utils").WithModeProps & import("../../dataSourceForm/utils").WithFormItemProps & {
     options?: any;
-    optionSourceType?: "default" | "custom" | "api" | undefined;
+    optionSourceType?: "custom" | "default" | "api" | undefined;
     labelField: string;
     valueField: string;
     extraParams?: Record<string, any> | undefined;
 } & {
     dataSource?: any;
     extraParams?: Record<string, any> | undefined;
-}) => React.JSX.Element;
+}) => JSX.Element;
 export default SelectWithDataSource;

package/lib/components/dataSourceComponents/fields/Tabs/ReadPretty.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { TabsReadPrettyProps } from './type';
+/**
+ * Tabs 只读展示组件
+ *
+ * @description 在 view / tableView 模式下展示选中的标签名称文本。
+ */
+declare const TabsReadPretty: React.FC<TabsReadPrettyProps>;
+export default TabsReadPretty;

package/lib/components/dataSourceComponents/fields/Tabs/ReadPretty.js

@@ -0,0 +1,45 @@
+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/Tabs/ReadPretty.tsx
+var ReadPretty_exports = {};
+__export(ReadPretty_exports, {
+  default: () => ReadPretty_default
+});
+module.exports = __toCommonJS(ReadPretty_exports);
+var import_useValueMap = __toESM(require("../../hooks/useValueMap"));
+var import_utils = require("../../dataSourceForm/utils");
+var TabsReadPretty = ({
+  value,
+  options,
+  renderMode
+}) => {
+  const valueMap = (0, import_useValueMap.default)(options || []);
+  return (0, import_utils.renderValueWithMap)(value, valueMap, renderMode);
+};
+var ReadPretty_default = TabsReadPretty;

package/lib/components/dataSourceComponents/fields/Tabs/Tabs.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { TabsProps } from './type';
+import './Tabs.less';
+/**
+ * Tabs 胶囊风格选项卡组件
+ *
+ * @description 提供类似 Segmented 控件的胶囊风格选项卡，支持受控与非受控模式。
+ * 用于表单中替代 Radio.Group，展示更为直观的标签页切换交互。
+ *
+ * @example
+ * ```tsx
+ * <Tabs
+ *   value={current}
+ *   options={[
+ *     { label: '校区', value: 'campus' },
+ *     { label: '场地', value: 'venue' },
+ *   ]}
+ *   onChange={(val) => setCurrent(val)}
+ * />
+ * ```
+ */
+declare const Tabs: React.FC<TabsProps>;
+export default Tabs;

package/lib/components/dataSourceComponents/fields/Tabs/Tabs.js

@@ -0,0 +1,95 @@
+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/Tabs/Tabs.tsx
+var Tabs_exports = {};
+__export(Tabs_exports, {
+  default: () => Tabs_default
+});
+module.exports = __toCommonJS(Tabs_exports);
+var import_react = __toESM(require("react"));
+var import_classnames = __toESM(require("classnames"));
+var import_Tabs = require("./Tabs.less");
+var Tabs = ({
+  value,
+  defaultValue,
+  options = [],
+  disabled = false,
+  onChange,
+  className,
+  style
+}) => {
+  const [internalValue, setInternalValue] = import_react.default.useState(defaultValue);
+  const selectedValue = value !== void 0 ? value : internalValue;
+  const handleSelect = (option) => {
+    if (disabled || option.disabled) return;
+    const newValue = option.value;
+    if (value === void 0) {
+      setInternalValue(newValue);
+    }
+    onChange == null ? void 0 : onChange(newValue);
+  };
+  const tabItems = (0, import_react.useMemo)(() => {
+    return options.map((option) => {
+      const isActive = selectedValue != null && selectedValue !== void 0 && String(selectedValue) === String(option.value);
+      const isDisabled = disabled || option.disabled;
+      return /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          key: option.value,
+          className: (0, import_classnames.default)("pisell-form-tabs-item", {
+            "pisell-form-tabs-item--active": isActive,
+            "pisell-form-tabs-item--disabled": isDisabled
+          }),
+          onClick: () => handleSelect(option),
+          role: "tab",
+          "aria-selected": isActive,
+          "aria-disabled": isDisabled,
+          tabIndex: isDisabled ? -1 : 0,
+          onKeyDown: (e) => {
+            if (e.key === "Enter" || e.key === " ") {
+              e.preventDefault();
+              handleSelect(option);
+            }
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-form-tabs-item-label" }, option.label)
+      );
+    });
+  }, [options, selectedValue, disabled]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)("pisell-form-tabs", className),
+      style,
+      role: "tablist"
+    },
+    tabItems
+  );
+};
+var Tabs_default = Tabs;

package/lib/components/dataSourceComponents/fields/Tabs/Tabs.less

@@ -0,0 +1,64 @@
+.pisell-form-tabs {
+  height: 40px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+  padding: 2px;
+  gap: 2px;
+  flex-wrap: nowrap;
+  box-sizing: border-box;
+  color: rgba(0, 0, 0, .65);
+  background-color: rgba(0, 0, 0, .04);
+  overflow-x: auto;
+
+  /* 隐藏滚动条：兼容 WebKit（Chrome/Safari/Edge）、Firefox、IE/Edge 旧版 */
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+
+  &-item {
+    min-height: 36px;
+    min-width: 90px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 12px;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: background-color 0.2s ease, box-shadow 0.2s ease,
+      color 0.2s ease;
+    user-select: none;
+    white-space: nowrap;
+    flex: 0 0 auto;
+    outline: none;
+
+    &-label {
+      font-size: 14px;
+      color: rgba(0, 0, 0, 0.65);
+      font-weight: 400;
+    }
+
+    &:hover:not(&--active):not(&--disabled) {
+      background-color: rgba(0, 0, 0, 0.06);
+    }
+
+    &--active {
+      background-color: #ffffff;
+
+      .pisell-form-tabs-item-label {
+        color: #262626;
+        font-weight: 500;
+      }
+    }
+
+    &--disabled {
+      cursor: not-allowed;
+      opacity: 0.4;
+    }
+  }
+}

package/lib/components/dataSourceComponents/fields/Tabs/WithMode.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+/**
+ * TabsWithMode
+ */
+declare const TabsWithMode: import("react").FC<import("./type").TabsProps & import("../../dataSourceForm/utils").WithModeProps>;
+export default TabsWithMode;

package/lib/components/dataSourceComponents/fields/Tabs/WithMode.js

@@ -0,0 +1,39 @@
+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/Tabs/WithMode.tsx
+var WithMode_exports = {};
+__export(WithMode_exports, {
+  default: () => WithMode_default
+});
+module.exports = __toCommonJS(WithMode_exports);
+var import_utils = require("../../dataSourceForm/utils");
+var import_Tabs = __toESM(require("./Tabs"));
+var import_ReadPretty = __toESM(require("./ReadPretty"));
+var TabsWithMode = (0, import_utils.withMode)(import_Tabs.default, import_ReadPretty.default);
+var WithMode_default = TabsWithMode;

package/lib/components/dataSourceComponents/fields/Tabs/index.d.ts

@@ -0,0 +1,12 @@
+/** 包装 DataSource 层（提供数据源上下文） */
+declare const FormItemTabs: (props: import("./type").TabsProps & import("../../dataSourceForm/utils").WithModeProps & import("../../dataSourceForm/utils").WithFormItemProps & {
+    options?: any;
+    optionSourceType?: "custom" | "default" | "api" | undefined;
+    labelField: string;
+    valueField: string;
+    extraParams?: Record<string, any> | undefined;
+} & {
+    dataSource?: any;
+    extraParams?: Record<string, any> | undefined;
+}) => JSX.Element;
+export default FormItemTabs;

package/lib/components/dataSourceComponents/fields/Tabs/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/dataSourceComponents/fields/Tabs/index.tsx
+var Tabs_exports = {};
+__export(Tabs_exports, {
+  default: () => Tabs_default
+});
+module.exports = __toCommonJS(Tabs_exports);
+var import_utils = require("../../dataSourceForm/utils");
+var import_WithMode = __toESM(require("./WithMode"));
+var TabsWithFormItem = (0, import_utils.withFormItem)(import_WithMode.default);
+var TabsWithOptions = (0, import_utils.withOptions)(TabsWithFormItem);
+var FormItemTabs = (0, import_utils.withDataSource)(TabsWithOptions);
+var Tabs_default = FormItemTabs;

package/lib/components/dataSourceComponents/fields/Tabs/type.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { ModeType } from '../../dataSourceForm/type';
+/**
+ * Tabs 选项配置
+ */
+export interface TabOption {
+    /** 选项显示文本 */
+    label: React.ReactNode;
+    /** 选项对应的值 */
+    value: string | number;
+    /** 是否禁用该选项 */
+    disabled?: boolean;
+}
+/**
+ * Tabs 基础 Props（编辑态组件使用，不含 renderMode）
+ */
+export interface TabsProps {
+    /** 当前选中的值（受控） */
+    value?: string | number;
+    /** 默认选中的值（非受控） */
+    defaultValue?: string | number;
+    /** 选项列表 */
+    options?: TabOption[];
+    /** 是否禁用整个组件 */
+    disabled?: boolean;
+    /** 选中值变化时的回调 */
+    onChange?: (value: string | number) => void;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: React.CSSProperties;
+}
+/**
+ * Tabs ReadPretty Props（只读态组件使用，包含必填 renderMode）
+ */
+export interface TabsReadPrettyProps extends TabsProps {
+    renderMode: ModeType;
+}

package/lib/components/dataSourceComponents/fields/Tabs/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/Tabs/type.ts
+var type_exports = {};
+module.exports = __toCommonJS(type_exports);

package/lib/components/dataSourceComponents/fields/TimePicker/ReadPretty.d.ts

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

package/lib/components/dataSourceComponents/fields/Translation/ReadPretty.d.ts

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

package/lib/components/dataSourceComponents/fields/Upload/CameraPopover.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+/// <reference types="react" />
 declare const CameraPopover: (props: {
     onLocalFileClick: () => void;
     onCameraChange: (file: any) => void;
-}) => React.JSX.Element;
+}) => JSX.Element;
 export default CameraPopover;

package/lib/components/dataSourceComponents/fields/Upload/ReadPretty.d.ts

@@ -1,5 +1,4 @@
-import React from 'react';
 import { UploadProps } from './type';
 import './ReadPretty.less';
-declare const UploadReadPretty: (props: UploadProps) => React.JSX.Element | null;
+declare const UploadReadPretty: (props: UploadProps) => JSX.Element | null;
 export default UploadReadPretty;