@pisell/materials 6.11.17 → 6.11.19

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

@@ -1,4 +1,5 @@
-import type { ReactNode, Key, ComponentType } from 'react';
+import type { ReactNode, Key, ComponentType, Ref } from 'react';
+import type { PisellFloorMapLayoutProps, PisellFloorMapLayoutRef, FloorMapDataSources, FloorMapLayoutContextValue } from '../pisellFloorMapLayout/types';
 import type { TableProps } from 'antd';
 /**
  * 布局类型：一种 layout 对应一种「视图的集合」
@@ -120,11 +121,26 @@ export interface RecordBoardListResult {
     count?: number;
     total?: number;
 }
+/** ShellFrame 内容区：表格或平面图（与 GridLayout 同级切换） */
+export declare type RecordBoardBodyView = 'grid' | 'floorMap';
+/**
+ * 平面图槽位 props：与 PisellFloorMapLayout 对齐；items/renderItem 可省略（由 RecordBoard 默认 [] / () => null）。
+ */
+export declare type RecordBoardFloorMapProps = Partial<PisellFloorMapLayoutProps>;
 /**
  * RecordBoard 容器 Context 值
  * 与具体 layout 类型无关，所有 layout 共用同一套数据与操作
  */
 export interface RecordBoardContextValue {
+    /**
+     * 平面图多数据源字典（整份各 key，不参与表格分页切片）。
+     * ShellFrame 会与 FloorMap 子 props 中的 dataSources 合并后传入 PisellFloorMapLayout。
+     */
+    dataSources?: FloorMapDataSources;
+    /**
+     * 表格绑定 `dataSources` 的 key；仅当未传入根级 `data` 时，表格数据由 `dataSources[gridDataSourceKey]` 推导并做客户端分页切片。
+     */
+    gridDataSourceKey?: string;
     /** 当前列表数据 */
     data: any[];
     /** 加载态 */
@@ -174,6 +190,24 @@ export interface RecordBoardContextValue {
     filterResetKey?: number;
     /** 递增 filterResetKey，由 ToolBarReset 在重置时调用 */
     setFilterResetKey?: (fn: (prev: number) => number) => void;
+    /** 当前主内容区：表格或平面图；无平面图配置时一般为 grid（ShellFrame 内仅 FloorMap 时会改为 floorMap） */
+    bodyView: RecordBoardBodyView;
+    setBodyView: (v: RecordBoardBodyView) => void;
+    /** 根级传入的平面图 props（可选）；与 ShellFrame 内 FloorMap 子组件合并，子优先 */
+    floorMapProps?: RecordBoardFloorMapProps;
+    /**
+     * 平面图数据/保存等注入上下文（与 `FloorMapLayoutContextValue` 同形），由 Shell 内置 `FloorMapLayoutProvider` 注入 `PisellFloorMapLayout`；
+     * 与 `useRecordBoardContext()` 同源镜像，供 Toolbar 等读取。
+     */
+    floorMapLayoutContext?: FloorMapLayoutContextValue;
+    /** 双视图并存时首屏偏好（根 props，与 PisellRecordBoard.defaultBodyView 一致） */
+    defaultBodyView?: RecordBoardBodyView;
+    /** 挂到 ShellFrame 内 PisellFloorMapLayout，供外部 imperative 调用（如 saveLayout / fitBounds） */
+    floorMapLayoutRef?: Ref<PisellFloorMapLayoutRef | null>;
+    /**
+     * 平面图视图下叠在画布内的底部居中悬浮区（如「编辑平面图」），不单独占一行 footer。
+     */
+    floorMapFooter?: ReactNode;
 }
 /**
  * 各 layout 下子组件的可选透传配置（类似 ChildComponentProps）
@@ -209,6 +243,7 @@ export interface RecordBoardToolBarProps {
      * 在 ToolBar 左侧展示内联快速筛选（替代 Filter 弹层内的 quickFilter）。
      * 为 true 时使用 columns 派生的 quickFilter 列表；为对象时可传 filterList、formFiltersPrefix、size 等。
      * 启用后建议对 filter 传 hiddenQuickFilter: true，弹层内仅保留高级筛选。
+     * hideFilterNamesOnFloorMap：仅当 Shell 内同时有表格+平面图且当前为平面图时，按筛选项 name（或 key）从内联快筛中移除，避免与顶栏日程重复（如预约 booking_time_start_between）。
      */
     quickFilter?: boolean | Record<string, any>;
     /** 列显示隐藏设置入口；默认 true（有 grid.columns 时显示）；false 时不渲染 */
@@ -280,9 +315,19 @@ export interface RecordBoardProps {
     rowKey?: string | ((record: any) => Key);
     /** 当前列表数据 */
     data?: any[];
+    /**
+     * 平面图多数据源；与 `FloorMap` / 根级 `floorMap` 的 dataSources 在 ShellFrame 内合并（后者覆盖同 key）。
+     * 表格默认仍用 `data`；若不传 `data` 且提供 `gridDataSourceKey`，则由本字段对应 key 推导表格行并客户端分页。
+     */
+    dataSources?: FloorMapDataSources;
+    /**
+     * 表格使用的 `dataSources` key（如 `'tables'`）；与 `floorMapConfig` 内 `dataSourceKey` 对齐。
+     * 仅在根级 **`data` 未传入**时生效。
+     */
+    gridDataSourceKey?: string;
     /** 加载态 */
     loading?: boolean;
-    /** 总数（用于分页） */
+    /** 总数（用于分页）；由 `dataSources` 推导表格时，未传则默认为该 key 对应数组长度 */
     total?: number;
     /** 分页状态 */
     pagination?: RecordBoardPaginationState;
@@ -310,6 +355,27 @@ export interface RecordBoardProps {
     cardList?: Record<string, any>;
     /** 是否启用分页（与 pagination 状态区分） */
     enablePagination?: boolean;
+    /**
+     * 平面图（可选，兼容低代码 / SalesGrid 等）：与 PisellFloorMapLayout 对齐。
+     * 推荐在 ShellFrame 内使用 PisellRecordBoard.FloorMap 声明；若同时传根级与本项，Shell 内子组件 props 优先合并。
+     */
+    floorMap?: RecordBoardFloorMapProps;
+    /**
+     * 平面图 Context 注入（`FloorMapLayoutContextValue`）：配置/保存/加载等；展示向 props 仍建议走 `floorMap`。
+     * Shell 在平面图节点内置 Provider，无需再包一层 `FloorMapLayoutProvider`。
+     */
+    floorMapLayoutContext?: FloorMapLayoutContextValue;
+    /**
+     * 表格与平面图并存时首屏子视图，默认 grid。
+     * 仅声明 FloorMap 而无 Grid/Card 内容时由 ShellFrame 固定为平面图，不出现切换器。
+     */
+    defaultBodyView?: RecordBoardBodyView;
+    /** 与 bodyView 同步持久化到 localStorage 的 key（双视图时生效） */
+    bodyViewStorageKey?: string;
+    /** 平面图 Layout 实例 ref，由 ShellFrame 注入 */
+    floorMapLayoutRef?: Ref<PisellFloorMapLayoutRef | null>;
+    /** 平面图画布内底部悬浮插槽（如编辑入口），注入 Context 供 ShellFrame 渲染 */
+    floorMapFooter?: ReactNode;
     /** 其他 */
     [key: string]: any;
 }

package/lib/components/pisellRecordBoard/utils/partitionShellFrameChildren.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { RecordBoardFloorMapProps } from '../types';
+/** 与 shellFrame/FloorMap 上定义的 displayName 一致，用于从 ShellFrame children 中识别平面图槽 */
+export declare const RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME = "RecordBoard.FloorMap";
+/**
+ * 将 ShellFrame 的 children 拆成：供表格区渲染的子树 + 可选的 FloorMap 透传 props。
+ * 支持 Fragment 嵌套；多个 FloorMap 时以最后一个为准。
+ */
+export declare function partitionShellFrameChildren(children: React.ReactNode): {
+    gridChildren: React.ReactNode;
+    /** 是否出现 FloorMap 槽位节点（props 可为空，可与根级 floorMap 合并） */
+    hasFloorMapChild: boolean;
+    floorMapPropsFromChild?: RecordBoardFloorMapProps;
+    hasGridContent: boolean;
+};

package/lib/components/pisellRecordBoard/utils/partitionShellFrameChildren.js

@@ -0,0 +1,88 @@
+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/pisellRecordBoard/utils/partitionShellFrameChildren.tsx
+var partitionShellFrameChildren_exports = {};
+__export(partitionShellFrameChildren_exports, {
+  RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME: () => RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME,
+  partitionShellFrameChildren: () => partitionShellFrameChildren
+});
+module.exports = __toCommonJS(partitionShellFrameChildren_exports);
+var import_react = __toESM(require("react"));
+var import_FloorMap = __toESM(require("../shellFrame/FloorMap"));
+var RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME = "RecordBoard.FloorMap";
+function isRecordBoardFloorMapElementType(type) {
+  if (type === import_FloorMap.default) return true;
+  const dn = type == null ? void 0 : type.displayName;
+  return dn === RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME;
+}
+function partitionShellFrameChildren(children) {
+  let foundFloorMap = false;
+  let floorProps;
+  const gridChunks = [];
+  const walk = (node) => {
+    import_react.default.Children.forEach(node, (child) => {
+      if (child == null || child === false) return;
+      if (!import_react.default.isValidElement(child)) {
+        gridChunks.push(child);
+        return;
+      }
+      if (child.type === import_react.default.Fragment) {
+        walk(child.props.children);
+        return;
+      }
+      if (isRecordBoardFloorMapElementType(child.type)) {
+        foundFloorMap = true;
+        floorProps = child.props;
+        return;
+      }
+      gridChunks.push(child);
+    });
+  };
+  walk(children);
+  const hasGridContent = gridChunks.length > 0;
+  let gridChildren;
+  if (!hasGridContent) {
+    gridChildren = null;
+  } else if (gridChunks.length === 1) {
+    gridChildren = gridChunks[0];
+  } else {
+    gridChildren = /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, gridChunks);
+  }
+  return {
+    gridChildren,
+    hasFloorMapChild: foundFloorMap,
+    floorMapPropsFromChild: floorProps,
+    hasGridContent
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RECORD_BOARD_FLOOR_MAP_DISPLAY_NAME,
+  partitionShellFrameChildren
+});

package/lib/components/pisellRecordBoard/utils/recordBoardColumns.js

@@ -49,6 +49,7 @@ var import_pisellRating = require("../../pisellRating");
 var import_pisellSingleSelect = require("../../pisellSingleSelect");
 var import_pisellMultipleSelect = require("../../pisellMultipleSelect");
 var import_pisellDateTimeDisplay = require("../../pisellDateTimeDisplay");
+var import_locales = require("../../../locales");
 var FIELD_TYPE_TO_READ_COMPONENT = {
   singleLineText: import_pisellSingleLineText.PisellSingleLineText,
   longText: import_pisellLongText.PisellLongText,
@@ -254,7 +255,16 @@ function columnToFilterItem(column) {
       key,
       name: key,
       label,
-      props: filterType2 === "single" ? { options: options ?? [], getOptions: fieldProps.getOptions, ...fieldProps } : { placeholder: fieldProps.placeholder ?? `请输入${label}`, ...fieldProps },
+      props: filterType2 === "single" ? {
+        options: options ?? [],
+        getOptions: fieldProps.getOptions,
+        ...fieldProps
+      } : {
+        placeholder: fieldProps.placeholder ?? String(
+          (0, import_locales.getText)("pisell2.recordBoard.filter.placeholderEnter") ?? ""
+        ).replace(/\{label\}/g, label),
+        ...fieldProps
+      },
       other: { fieldType, getOptions: fieldProps.getOptions, ...fieldProps }
     };
   }

package/lib/components/pisellReservationSchedule/PisellReservationSchedule.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { PisellReservationScheduleProps } from './types';
+import './PisellReservationSchedule.less';
+/**
+ * 营业日导航条：上一日、中间日期文案、下一日（深色条样式，适配预约顶栏）
+ */
+export declare function PisellReservationSchedule(props: PisellReservationScheduleProps): React.JSX.Element;
+export declare namespace PisellReservationSchedule {
+    var displayName: string;
+}

package/lib/components/pisellReservationSchedule/PisellReservationSchedule.js

@@ -0,0 +1,200 @@
+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/pisellReservationSchedule/PisellReservationSchedule.tsx
+var PisellReservationSchedule_exports = {};
+__export(PisellReservationSchedule_exports, {
+  PisellReservationSchedule: () => PisellReservationSchedule
+});
+module.exports = __toCommonJS(PisellReservationSchedule_exports);
+var import_react = __toESM(require("react"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_classnames = __toESM(require("classnames"));
+var import_antd = require("antd");
+var import_date_picker = require("@pisell/date-picker");
+var import_ChevronLeft = __toESM(require("@pisell/icon/es/ChevronLeft"));
+var import_ChevronRight = __toESM(require("@pisell/icon/es/ChevronRight"));
+var import_utils = require("@pisell/utils");
+var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
+var import_locales = __toESM(require("./locales"));
+var import_PisellReservationSchedule = require("./PisellReservationSchedule.less");
+var I18N_TODAY = "pisell-reservation-schedule.today";
+var I18N_PREV = "pisell-reservation-schedule.prev";
+var I18N_NEXT = "pisell-reservation-schedule.next";
+var I18N_PICK_DATE = "pisell-reservation-schedule.pick-date";
+var I18N_PICK_DATE_TITLE = "pisell-reservation-schedule.pick-date-title";
+function parseDay(input, fallback) {
+  if (input == null) return fallback.startOf("day");
+  const d = (0, import_dayjs.default)(input);
+  return (d.isValid() ? d : fallback).startOf("day");
+}
+function toDayjsLocale(engineLocale) {
+  if (!engineLocale || engineLocale === "en") return "en";
+  if (engineLocale === "zh-HK") return "zh-hk";
+  return "zh-cn";
+}
+function PisellReservationSchedule(props) {
+  var _a, _b;
+  const {
+    value: valueProp,
+    onChange,
+    defaultValue,
+    minDate: minDateProp,
+    maxDate: maxDateProp,
+    navigationLocked = false,
+    className,
+    style
+  } = props;
+  const context = (0, import_useEngineContext.default)();
+  const engineLocale = ((_b = (_a = context == null ? void 0 : context.engine) == null ? void 0 : _a.props) == null ? void 0 : _b.locale) || "en";
+  import_utils.locales.init(import_locales.default, engineLocale);
+  const today = (0, import_react.useMemo)(() => (0, import_dayjs.default)().startOf("day"), []);
+  const isControlled = valueProp !== void 0;
+  const [internal, setInternal] = (0, import_react.useState)(
+    () => parseDay(valueProp ?? defaultValue, today)
+  );
+  const value = isControlled ? parseDay(valueProp, today) : internal;
+  const minDate = (0, import_react.useMemo)(
+    () => minDateProp != null ? parseDay(minDateProp, today) : void 0,
+    [minDateProp, today]
+  );
+  const maxDate = (0, import_react.useMemo)(
+    () => maxDateProp != null ? parseDay(maxDateProp, today) : void 0,
+    [maxDateProp, today]
+  );
+  const emit = (0, import_react.useCallback)(
+    (next) => {
+      let d = next.startOf("day");
+      if (minDate && d.isBefore(minDate)) d = minDate;
+      if (maxDate && d.isAfter(maxDate)) d = maxDate;
+      if (!isControlled) setInternal(d);
+      onChange == null ? void 0 : onChange(d);
+    },
+    [isControlled, onChange, minDate, maxDate]
+  );
+  const prevDisabled = navigationLocked || (minDate ? value.isSame(minDate, "day") : false);
+  const nextDisabled = navigationLocked || (maxDate ? value.isSame(maxDate, "day") : false);
+  const [calendarOpen, setCalendarOpen] = (0, import_react.useState)(false);
+  const centerLabel = (0, import_react.useMemo)(() => {
+    const djLoc = toDayjsLocale(engineLocale);
+    const dl = value.locale(djLoc);
+    const isToday = value.isSame(today, "day");
+    const todayText = import_utils.locales.getText(I18N_TODAY);
+    const dateStr = djLoc === "en" ? dl.format("MMM D") : dl.format("M月D日");
+    const weekStr = dl.format("ddd");
+    const parts = [];
+    if (isToday && todayText) parts.push(todayText);
+    parts.push(dateStr);
+    parts.push(weekStr);
+    return parts.join(djLoc === "en" ? " · " : " · ");
+  }, [value, today, engineLocale]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: (0, import_classnames.default)("pisell-reservation-schedule", className),
+      style
+    },
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-reservation-schedule-inner" }, /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "pisell-reservation-schedule-btn",
+        "aria-label": import_utils.locales.getText(I18N_PREV),
+        disabled: prevDisabled,
+        onClick: () => {
+          if (navigationLocked) return;
+          emit(value.subtract(1, "day"));
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_ChevronLeft.default, { className: "pisell-reservation-schedule-btn-icon" })
+    ), navigationLocked ? /* @__PURE__ */ import_react.default.createElement(
+      "span",
+      {
+        className: "pisell-reservation-schedule-label pisell-reservation-schedule-label--static",
+        "aria-label": centerLabel
+      },
+      centerLabel
+    ) : /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "pisell-reservation-schedule-label pisell-reservation-schedule-label-trigger",
+        "aria-label": import_utils.locales.getText(I18N_PICK_DATE),
+        "aria-haspopup": "dialog",
+        "aria-expanded": calendarOpen,
+        onClick: () => setCalendarOpen(true)
+      },
+      centerLabel
+    ), /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        type: "button",
+        className: "pisell-reservation-schedule-btn",
+        "aria-label": import_utils.locales.getText(I18N_NEXT),
+        disabled: nextDisabled,
+        onClick: () => {
+          if (navigationLocked) return;
+          emit(value.add(1, "day"));
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_ChevronRight.default, { className: "pisell-reservation-schedule-btn-icon" })
+    )),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Modal,
+      {
+        title: import_utils.locales.getText(I18N_PICK_DATE_TITLE),
+        open: !navigationLocked && calendarOpen,
+        onCancel: () => setCalendarOpen(false),
+        footer: null,
+        width: "auto",
+        centered: true,
+        destroyOnClose: true,
+        wrapClassName: "pisell-reservation-schedule-date-modal"
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_date_picker.DateCalendar,
+        {
+          value,
+          minDate,
+          maxDate,
+          onChange: (d) => {
+            if (d) {
+              emit((0, import_dayjs.default)(d));
+              setCalendarOpen(false);
+            }
+          }
+        }
+      )
+    )
+  );
+}
+PisellReservationSchedule.displayName = "PisellReservationSchedule";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PisellReservationSchedule
+});

package/lib/components/pisellReservationSchedule/PisellReservationSchedule.less

@@ -0,0 +1,88 @@
+.pisell-reservation-schedule {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+}
+
+.pisell-reservation-schedule-inner {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  max-width: 100%;
+  padding: 6px 10px;
+  border-radius: 8px;
+  background: rgba(255, 255, 255, 0.1);
+  box-sizing: border-box;
+}
+
+.pisell-reservation-schedule-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  margin: 0;
+  border: none;
+  border-radius: 8px;
+  background: rgba(255, 255, 255, 0.08);
+  color: rgba(255, 255, 255, 0.85);
+  cursor: pointer;
+  flex-shrink: 0;
+
+  &:hover:not(:disabled) {
+    background: rgba(255, 255, 255, 0.14);
+    color: #fff;
+  }
+
+  &:disabled {
+    opacity: 0.35;
+    cursor: not-allowed;
+  }
+}
+
+.pisell-reservation-schedule-btn-icon {
+  width: 16px;
+  height: 16px;
+}
+
+.pisell-reservation-schedule-label {
+  flex: 1;
+  min-width: 0;
+  padding: 0 12px;
+  font-size: 15px;
+  font-weight: 500;
+  line-height: 1.35;
+  color: rgba(255, 255, 255, 0.92);
+  text-align: center;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.pisell-reservation-schedule-label--static {
+  cursor: default;
+}
+
+.pisell-reservation-schedule-label-trigger {
+  margin: 0;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  font-size: inherit;
+  font-weight: inherit;
+  line-height: inherit;
+  color: rgba(255, 255, 255, 0.92);
+  width: 100%;
+
+  &:hover {
+    color: #fff;
+  }
+
+  &:focus-visible {
+    outline: 2px solid rgba(255, 255, 255, 0.45);
+    outline-offset: 2px;
+    border-radius: 4px;
+  }
+}

package/lib/components/pisellReservationSchedule/PisellReservationSchedule.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { PisellReservationSchedule } from './PisellReservationSchedule';
+/**
+ * PisellReservationSchedule：预约营业日导航（上一天 / 日期文案 / 下一天）。
+ * 多语言与日期格式依赖 LowCode 引擎 locale。详见组件目录下 docs/PisellReservationSchedule.md。
+ */
+declare const meta: Meta<typeof PisellReservationSchedule>;
+export default meta;
+declare type Story = StoryObj<typeof PisellReservationSchedule>;
+export declare const Default: Story;
+export declare const WithMinMax: Story;
+export declare const Controlled: Story;

package/lib/components/pisellReservationSchedule/PisellReservationSchedule.stories.js

@@ -0,0 +1,116 @@
+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/pisellReservationSchedule/PisellReservationSchedule.stories.tsx
+var PisellReservationSchedule_stories_exports = {};
+__export(PisellReservationSchedule_stories_exports, {
+  Controlled: () => Controlled,
+  Default: () => Default,
+  WithMinMax: () => WithMinMax,
+  default: () => PisellReservationSchedule_stories_default
+});
+module.exports = __toCommonJS(PisellReservationSchedule_stories_exports);
+var import_react = __toESM(require("react"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_PisellReservationSchedule = require("./PisellReservationSchedule");
+var meta = {
+  title: "Data Entry/PisellReservationSchedule",
+  component: import_PisellReservationSchedule.PisellReservationSchedule,
+  tags: ["autodocs"],
+  parameters: {
+    layout: "padded",
+    docs: {
+      description: {
+        component: "深色圆角营业日条：左右切换日历日，中间展示「今天（若当日）· 日期 · 星期」。可与 PisellTimeNavigator 组合为 PisellReservationScheduleBand。支持受控 `value` / `onChange(dayjs)`，以及 `minDate` / `maxDate`。"
+      }
+    }
+  },
+  argTypes: {
+    value: {
+      description: "当前选中日（受控），dayjs 或可解析字符串",
+      control: "text"
+    },
+    defaultValue: {
+      description: "非受控初始日",
+      control: "text"
+    },
+    minDate: {
+      description: "不可早于该日（含）",
+      control: "text"
+    },
+    maxDate: {
+      description: "不可晚于该日（含）",
+      control: "text"
+    },
+    onChange: {
+      action: "onChange",
+      description: "选中日变更，参数为 Dayjs（当日 0 点）"
+    },
+    className: { control: "text" }
+  }
+};
+var PisellReservationSchedule_stories_default = meta;
+var Default = {
+  args: {
+    defaultValue: (0, import_dayjs.default)().format("YYYY-MM-DD")
+  },
+  decorators: [
+    (StoryComp) => /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 440 } }, /* @__PURE__ */ import_react.default.createElement(StoryComp, null))
+  ]
+};
+var WithMinMax = {
+  args: {
+    defaultValue: (0, import_dayjs.default)().format("YYYY-MM-DD"),
+    minDate: (0, import_dayjs.default)().startOf("day"),
+    maxDate: (0, import_dayjs.default)().add(14, "day").endOf("day")
+  },
+  decorators: [
+    (StoryComp) => /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 440 } }, /* @__PURE__ */ import_react.default.createElement(StoryComp, null))
+  ]
+};
+var Controlled = {
+  render: function ControlledRender() {
+    const [value, setValue] = (0, import_react.useState)((0, import_dayjs.default)().startOf("day"));
+    return /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 440 } }, /* @__PURE__ */ import_react.default.createElement(
+      import_PisellReservationSchedule.PisellReservationSchedule,
+      {
+        value,
+        onChange: (d) => {
+          setValue(d);
+          console.log("onChange", d.format("YYYY-MM-DD"));
+        }
+      }
+    ), /* @__PURE__ */ import_react.default.createElement("p", { style: { marginTop: 12, fontSize: 12, color: "#666" } }, "当前：", value.format("YYYY-MM-DD dddd")));
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Controlled,
+  Default,
+  WithMinMax
+});

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

@@ -0,0 +1,2 @@
+export { PisellReservationSchedule } from './PisellReservationSchedule';
+export type { PisellReservationScheduleProps, ReservationScheduleValue, } from './types';