@pisell/materials 2.2.53 → 2.2.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/build/lowcode/assets-daily.json +11 -11
  2. package/build/lowcode/assets-dev.json +2 -2
  3. package/build/lowcode/assets-prod.json +11 -11
  4. package/build/lowcode/index.js +1 -1
  5. package/build/lowcode/meta.js +5 -5
  6. package/build/lowcode/preview.js +164 -148
  7. package/build/lowcode/render/default/view.css +1 -1
  8. package/build/lowcode/render/default/view.js +39 -25
  9. package/build/lowcode/view.css +1 -1
  10. package/build/lowcode/view.js +39 -25
  11. package/es/components/Pagination/index.d.ts +1 -1
  12. package/es/components/appVersionControl/index.d.ts +0 -1
  13. package/es/components/colorPicker/index.d.ts +1 -0
  14. package/es/components/dataSourceComponents/dataSourceForm/utils.d.ts +1 -1
  15. package/es/components/dataSourceComponents/dataSourceMenu/Basic.d.ts +8 -2
  16. package/es/components/dataSourceComponents/dataSourceMenu/Basic.js +13 -3
  17. package/es/components/dataSourceComponents/dataSourceMenu/index.d.ts +8 -2
  18. package/es/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.d.ts +0 -1
  19. package/es/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +1 -1
  20. package/es/components/dataSourceComponents/fields/Input.Subdomain/index.d.ts +1 -1
  21. package/es/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +2 -0
  22. package/es/components/dataSourceComponents/fields/Select/index.d.ts +1 -1
  23. package/es/components/dataSourceComponents/fields/index.d.ts +10 -10
  24. package/es/components/drag-sort-tree/index.d.ts +0 -1
  25. package/es/components/filter/components/items/index.d.ts +1 -0
  26. package/es/components/filter/components/items/text/Editor/index.d.ts +1 -0
  27. package/es/components/filter/components/items/text/Preview/index.d.ts +1 -0
  28. package/es/components/filter/components/items/text/index.d.ts +1 -0
  29. package/es/components/iconfont/index.js +1 -1
  30. package/es/components/login-and-register/index.js +23 -21
  31. package/es/components/login-and-register/index.less +7 -7
  32. package/es/components/page/index.js +23 -57
  33. package/es/components/pisellAnchor/index.d.ts +1 -1
  34. package/es/components/pisellAnchor/index.js +109 -199
  35. package/es/components/pisellAnchor/index.less +3 -5
  36. package/es/components/pisellAvatar/index.js +2 -1
  37. package/es/components/pisellAvatar/index.less +2 -1
  38. package/es/components/pisellCustomCheckboxGroup/index.js +3 -0
  39. package/es/components/pisellGoodPassCard/index.d.ts +47 -0
  40. package/es/components/pisellGoodPassCard/index.js +115 -0
  41. package/es/components/pisellGoodPassCard/index.less +52 -0
  42. package/es/components/pisellModal/components/MobileModal/index.less +4 -0
  43. package/es/components/pisellNavigationMenu/PisellNavigationMenu.js +18 -2
  44. package/es/components/pisellWalletPassCard/index.d.ts +0 -1
  45. package/es/components/productCard/components/MultiDay/index.js +2 -1
  46. package/es/components/productCard/components/Packages/components/collapsibleList/utils.js +4 -3
  47. package/es/components/productCard/components/Time/components/SelectResource/index.d.ts +3 -0
  48. package/es/components/productCard/components/Time/components/SelectResource/index.js +53 -0
  49. package/es/components/productCard/components/Time/index.d.ts +1 -1
  50. package/es/components/productCard/components/Time/index.js +21 -7
  51. package/es/components/productCard/components/Time/index.less +29 -0
  52. package/es/components/productCard/index.js +5 -2
  53. package/es/components/productCard/locales.d.ts +6 -0
  54. package/es/components/productCard/locales.js +19 -1
  55. package/es/components/productCard/types.d.ts +4 -0
  56. package/es/components/productCard/utils.js +18 -2
  57. package/es/components/table/Actions/component/ExportImport/index.d.ts +0 -1
  58. package/es/components/table/Table/SelectField/index.d.ts +1 -0
  59. package/es/components/table/Table/tableConfig/summary/index.d.ts +1 -0
  60. package/es/components/table/Table/utils.d.ts +1 -1
  61. package/es/components/tabs/index.js +6 -1
  62. package/es/index.d.ts +10 -11
  63. package/es/index.js +11 -12
  64. package/es/locales/en-US.d.ts +28 -2
  65. package/es/locales/en-US.js +43 -10
  66. package/es/locales/zh-CN.d.ts +26 -0
  67. package/es/locales/zh-CN.js +29 -1
  68. package/es/locales/zh-TW.d.ts +26 -0
  69. package/es/locales/zh-TW.js +28 -1
  70. package/lib/components/Pagination/index.d.ts +1 -1
  71. package/lib/components/appVersionControl/index.d.ts +0 -1
  72. package/lib/components/colorPicker/index.d.ts +1 -0
  73. package/lib/components/dataSourceComponents/dataSourceForm/utils.d.ts +1 -1
  74. package/lib/components/dataSourceComponents/dataSourceMenu/Basic.d.ts +8 -2
  75. package/lib/components/dataSourceComponents/dataSourceMenu/Basic.js +12 -3
  76. package/lib/components/dataSourceComponents/dataSourceMenu/index.d.ts +8 -2
  77. package/lib/components/dataSourceComponents/dataSourceTable/hooks/useDrawerState.d.ts +0 -1
  78. package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.d.ts +1 -1
  79. package/lib/components/dataSourceComponents/fields/Input.Subdomain/index.d.ts +1 -1
  80. package/lib/components/dataSourceComponents/fields/Input.Url/ReadPretty.less +2 -0
  81. package/lib/components/dataSourceComponents/fields/Select/index.d.ts +1 -1
  82. package/lib/components/dataSourceComponents/fields/index.d.ts +10 -10
  83. package/lib/components/drag-sort-tree/index.d.ts +0 -1
  84. package/lib/components/filter/components/items/index.d.ts +1 -0
  85. package/lib/components/filter/components/items/text/Editor/index.d.ts +1 -0
  86. package/lib/components/filter/components/items/text/Preview/index.d.ts +1 -0
  87. package/lib/components/filter/components/items/text/index.d.ts +1 -0
  88. package/lib/components/iconfont/index.js +1 -1
  89. package/lib/components/login-and-register/index.js +23 -21
  90. package/lib/components/login-and-register/index.less +7 -7
  91. package/lib/components/page/index.js +37 -65
  92. package/lib/components/pisellAnchor/index.d.ts +1 -1
  93. package/lib/components/pisellAnchor/index.js +64 -131
  94. package/lib/components/pisellAnchor/index.less +3 -5
  95. package/lib/components/pisellAvatar/index.js +1 -1
  96. package/lib/components/pisellAvatar/index.less +2 -1
  97. package/lib/components/pisellCustomCheckboxGroup/index.js +1 -1
  98. package/lib/components/pisellEmpty/index.js +9 -1
  99. package/lib/components/pisellGoodPassCard/index.d.ts +47 -0
  100. package/lib/components/pisellGoodPassCard/index.js +109 -0
  101. package/lib/components/pisellGoodPassCard/index.less +52 -0
  102. package/lib/components/pisellModal/components/MobileModal/index.less +4 -0
  103. package/lib/components/pisellNavigationMenu/PisellNavigationMenu.js +24 -3
  104. package/lib/components/pisellWalletPassCard/index.d.ts +0 -1
  105. package/lib/components/productCard/components/MultiDay/index.js +3 -2
  106. package/lib/components/productCard/components/Packages/components/collapsibleList/utils.js +5 -4
  107. package/lib/components/productCard/components/Time/components/SelectResource/index.d.ts +3 -0
  108. package/lib/components/productCard/components/Time/components/SelectResource/index.js +63 -0
  109. package/lib/components/productCard/components/Time/index.d.ts +1 -1
  110. package/lib/components/productCard/components/Time/index.js +38 -14
  111. package/lib/components/productCard/components/Time/index.less +29 -0
  112. package/lib/components/productCard/index.js +4 -1
  113. package/lib/components/productCard/locales.d.ts +6 -0
  114. package/lib/components/productCard/locales.js +7 -1
  115. package/lib/components/productCard/types.d.ts +4 -0
  116. package/lib/components/productCard/utils.js +14 -2
  117. package/lib/components/table/Actions/component/ExportImport/index.d.ts +0 -1
  118. package/lib/components/table/Table/SelectField/index.d.ts +1 -0
  119. package/lib/components/table/Table/tableConfig/summary/index.d.ts +1 -0
  120. package/lib/components/table/Table/utils.d.ts +1 -1
  121. package/lib/components/tabs/index.js +1 -0
  122. package/lib/index.d.ts +10 -11
  123. package/lib/index.js +12 -15
  124. package/lib/locales/en-US.d.ts +28 -2
  125. package/lib/locales/en-US.js +29 -3
  126. package/lib/locales/zh-CN.d.ts +26 -0
  127. package/lib/locales/zh-CN.js +29 -1
  128. package/lib/locales/zh-TW.d.ts +26 -0
  129. package/lib/locales/zh-TW.js +28 -1
  130. package/lowcode/pisell-good-pass-card/meta.ts +38 -0
  131. package/lowcode/pisell-good-pass-card/snippets.ts +9 -0
  132. package/lowcode/product-card/meta.ts +28 -0
  133. package/package.json +1 -1
@@ -67,7 +67,7 @@
67
67
  position: relative;
68
68
 
69
69
  &.active {
70
- color: #7F56D9;
70
+ color: var(--theme-color);
71
71
 
72
72
  &:after {
73
73
  content: '';
@@ -76,7 +76,7 @@
76
76
  left: 0;
77
77
  right: 0;
78
78
  height: 2px;
79
- background: #7F56D9;
79
+ background: var(--theme-color);
80
80
  }
81
81
  }
82
82
 
@@ -105,11 +105,11 @@
105
105
  background: #FFF;
106
106
 
107
107
  &:hover {
108
- border-color: #7F56D9;
108
+ border-color: var(--theme-color);
109
109
  }
110
110
 
111
111
  &:focus {
112
- border-color: #7F56D9;
112
+ border-color: var(--theme-color);
113
113
  box-shadow: 0 0 0 4px rgba(127, 86, 217, 0.1);
114
114
  }
115
115
 
@@ -126,7 +126,7 @@
126
126
  .saas-login-button {
127
127
  height: 44px;
128
128
  border-radius: 8px;
129
- background: #7F56D9;
129
+ background: var(--theme-color);
130
130
  border: none;
131
131
  font-weight: 500;
132
132
 
@@ -135,7 +135,7 @@
135
135
  }
136
136
 
137
137
  &:focus {
138
- background: #7F56D9;
138
+ background: var(--theme-color);
139
139
  box-shadow: 0 0 0 4px rgba(127, 86, 217, 0.1);
140
140
  }
141
141
  }
@@ -185,7 +185,7 @@
185
185
  margin-bottom: 16px;
186
186
 
187
187
  a {
188
- color: #7F56D9;
188
+ //color: #7F56D9;
189
189
  margin-left: 4px;
190
190
  cursor: pointer;
191
191
 
@@ -83,7 +83,7 @@ var Page = (props) => {
83
83
  token: {
84
84
  ...props.theme.token,
85
85
  // 外部透传主题时,如果没有传入colorPrimary 默认使用主项目内主题色
86
- colorPrimary: ((_b2 = (_a2 = props == null ? void 0 : props.theme) == null ? void 0 : _a2.token) == null ? void 0 : _b2.colorPrimary) || themeColor || "#7F56D9"
86
+ colorPrimary: ((_b2 = (_a2 = props == null ? void 0 : props.theme) == null ? void 0 : _a2.token) == null ? void 0 : _b2.colorPrimary) || themeColor || "#5D3F9F"
87
87
  }
88
88
  };
89
89
  }
@@ -120,10 +120,10 @@ var Page = (props) => {
120
120
  colorErrorBg: "#FEF3F2",
121
121
  colorErrorBorderHover: "#FDA29B",
122
122
  colorErrorOutline: "rgba(217, 45, 32, 0.06)",
123
- colorLink: "#175CD3",
124
- colorLinkActive: "#194185",
125
- colorLinkHover: "#1849A9",
126
- // colorPrimaryActive: '#7f56d9',
123
+ colorLink: "#7F56DA",
124
+ colorLinkActive: "#5F3DA8",
125
+ colorLinkHover: "#6D48C4",
126
+ // colorPrimaryActive: '#5D3F9F',
127
127
  // colorPrimaryBorder: '#E9D7FE',
128
128
  colorText: "#344054",
129
129
  colorTextDisabled: "#D0D5DD",
@@ -170,59 +170,25 @@ var Page = (props) => {
170
170
  Select: {
171
171
  fontSizeIcon: 16
172
172
  // "lineHeight": 1
173
+ },
174
+ Menu: {
175
+ subMenuItemSelectedColor: "#9976e3"
173
176
  }
174
177
  },
175
178
  token: {
176
- colorPrimary: themeColor || "#7F56D9",
177
- // colorPrimaryBg: '#F9F5FF',
178
- // colorPrimaryBgHover: '#F4EBFF',
179
- // colorPrimaryBorder: '#E9D7FE',
180
- // colorPrimaryBorderHover: '#D6BBFB',
181
- // colorPrimaryHover: '#6941C6',
182
- // colorPrimaryActive: '#53389E',
183
- // colorPrimaryTextHover: '#53389E',
184
- // colorPrimaryText: '#6941C6',
185
- // colorPrimaryTextActive: '#42307D',
186
- colorSuccess: "#079455",
187
- colorSuccessBg: "#ECFDF3",
188
- colorSuccessBgHover: "#DCFAE6",
189
- colorSuccessBorder: "#ABEFC6",
190
- colorSuccessBorderHover: "#75E0A7",
191
- colorSuccessHover: "#067647",
192
- colorSuccessText: "#067647",
193
- colorSuccessActive: "#085D3A",
194
- colorSuccessTextHover: "#085D3A",
195
- colorSuccessTextActive: "#074D31",
196
- colorWarning: "#dc6803",
197
- colorWarningBg: "#FFFAEB",
198
- colorWarningBgHover: "#FEF0C7",
199
- colorWarningBorder: "#FEDF89",
200
- colorWarningBorderHover: "#FEC84B",
201
- colorWarningHover: "#B54708",
202
- colorWarningText: "#B54708",
203
- colorWarningActive: "#93370D",
204
- colorWarningTextHover: "#93370D",
205
- colorWarningTextActive: "#7A2E0E",
206
- colorError: "#d92d20",
207
- colorErrorBg: "#FEF3F2",
208
- colorErrorBgHover: "#FEE4E2",
209
- colorErrorBorder: "#FECDCA",
210
- colorErrorBorderHover: "#FDA29B",
211
- colorErrorHover: "#B42318",
212
- colorErrorText: "#B42318",
213
- colorErrorActive: "#912018",
214
- colorErrorTextHover: "#912018",
215
- colorErrorTextActive: "#7A271A",
216
- colorInfo: "#1570ef",
217
- colorInfoBg: "#EFF8FF",
218
- colorInfoBgHover: "#D1E9FF",
219
- colorInfoBorder: "#B2DDFF",
220
- colorInfoBorderHover: "#84CAFF",
221
- colorInfoHover: "#175CD3",
222
- colorInfoText: "#175CD3",
223
- colorInfoActive: "#1849A9",
224
- colorInfoTextHover: "#1849A9",
225
- colorInfoTextActive: "#194185",
179
+ colorPrimary: themeColor || "#5D3F9F",
180
+ colorPrimaryBg: "#eee5ff",
181
+ colorPrimaryBgHover: "#e4d9fc",
182
+ colorPrimaryBorder: "#d4c3f7",
183
+ colorSuccess: "#5f9e3f",
184
+ colorInfo: "#5d3f9f",
185
+ colorError: "#f5222d",
186
+ colorSuccessBg: "#e5fcd9",
187
+ colorSuccessBgHover: "#d5f7c3",
188
+ // 链接色
189
+ colorLink: "#7F56DA",
190
+ colorLinkActive: "#5F3DA8",
191
+ colorLinkHover: "#6D48C4",
226
192
  colorText: "#101828",
227
193
  colorTextSecondary: "#475467",
228
194
  colorTextTertiary: "#667085",
@@ -245,7 +211,7 @@ var Page = (props) => {
245
211
  var _a2;
246
212
  return (0, import_date_picker.createTheme)({
247
213
  palette: {
248
- primary: { main: ((_a2 = theme.token) == null ? void 0 : _a2.colorPrimary) || "#7F56D9" }
214
+ primary: { main: ((_a2 = theme.token) == null ? void 0 : _a2.colorPrimary) || "#5D3F9F" }
249
215
  }
250
216
  });
251
217
  }, [platform, themeColor]);
@@ -271,17 +237,23 @@ var Page = (props) => {
271
237
  dateAdapter: import_AdapterDayjs.AdapterDayjs,
272
238
  adapterLocale: ((_d = localeDateMap == null ? void 0 : localeDateMap[locale]) == null ? void 0 : _d.adapterLocale) || "en"
273
239
  },
274
- /* @__PURE__ */ import_react.default.createElement(import_date_picker.ThemeProvider, { theme: datePickerTheme }, /* @__PURE__ */ import_react.default.createElement(import_date_picker.LocaleProvider, { value: { locale } }, /* @__PURE__ */ import_react.default.createElement(import_pisell_config_provider.default, { locale }, /* @__PURE__ */ import_react.default.createElement(import_VariablesProvider.default, { variables: ((_f = (_e = context.engine) == null ? void 0 : _e.props) == null ? void 0 : _f.variables) || {} }, /* @__PURE__ */ import_react.default.createElement(
275
- "div",
240
+ /* @__PURE__ */ import_react.default.createElement(import_date_picker.ThemeProvider, { theme: datePickerTheme }, /* @__PURE__ */ import_react.default.createElement(import_date_picker.LocaleProvider, { value: { locale } }, /* @__PURE__ */ import_react.default.createElement(import_pisell_config_provider.default, { locale }, /* @__PURE__ */ import_react.default.createElement(
241
+ import_VariablesProvider.default,
276
242
  {
277
- style: {
278
- ...style,
279
- "--theme-color": themeColor || "#7F56D9"
280
- },
281
- className
243
+ variables: ((_f = (_e = context.engine) == null ? void 0 : _e.props) == null ? void 0 : _f.variables) || {}
282
244
  },
283
- children
284
- )))))
245
+ /* @__PURE__ */ import_react.default.createElement(
246
+ "div",
247
+ {
248
+ style: {
249
+ ...style,
250
+ "--theme-color": themeColor || "#5D3F9F"
251
+ },
252
+ className
253
+ },
254
+ children
255
+ )
256
+ ))))
285
257
  )
286
258
  )
287
259
  );
@@ -19,5 +19,5 @@ export interface PisellAnchorProps {
19
19
  */
20
20
  platform?: 'pc' | 'h5';
21
21
  }
22
- declare const PisellAnchor: React.ForwardRefExoticComponent<PisellAnchorProps & React.RefAttributes<any>>;
22
+ declare const PisellAnchor: React.FC<PisellAnchorProps>;
23
23
  export default PisellAnchor;
@@ -38,160 +38,109 @@ var import_ahooks = require("ahooks");
38
38
  var import_ChevronLeft = __toESM(require("@pisell/icon/es/ChevronLeft"));
39
39
  var import_ChevronRight = __toESM(require("@pisell/icon/es/ChevronRight"));
40
40
  var import_index = require("./index.less");
41
- var PisellAnchor = (0, import_react.forwardRef)((props, ref) => {
42
- const {
43
- options = [],
44
- tab,
45
- className,
46
- style,
47
- onChange,
48
- onTabClick,
49
- containerRef,
50
- platform = "pc"
51
- } = props;
41
+ var PisellAnchor = ({
42
+ options = [],
43
+ tab,
44
+ className,
45
+ style,
46
+ onChange,
47
+ onTabClick,
48
+ containerRef,
49
+ platform = "pc"
50
+ }) => {
52
51
  const contentRef = (0, import_react.useRef)(null);
53
- const scrollTimeoutRef = (0, import_react.useRef)(null);
54
52
  const isClickScrolling = (0, import_react.useRef)(false);
55
- const clickedTabRef = (0, import_react.useRef)(null);
56
53
  const [leftWidth, setLeftWidth] = (0, import_react.useState)(0);
57
54
  const [rightWidth, setRightWidth] = (0, import_react.useState)(40);
58
55
  const [showButtons, setShowButtons] = (0, import_react.useState)(false);
59
- const [hoveredTab, setHoveredTab] = (0, import_react.useState)(null);
60
56
  (0, import_react.useEffect)(() => {
61
57
  if (contentRef.current) {
62
58
  const { scrollWidth, clientWidth } = contentRef.current;
63
59
  setShowButtons(scrollWidth > clientWidth);
64
60
  }
65
61
  }, [options]);
66
- (0, import_react.useEffect)(() => {
67
- return () => {
68
- if (scrollTimeoutRef.current) {
69
- clearTimeout(scrollTimeoutRef.current);
70
- }
71
- };
72
- }, []);
73
- const { run: onScrollDebounced } = (0, import_ahooks.useDebounceFn)(
62
+ const handleHorizontalScroll = (0, import_ahooks.useDebounceFn)(
74
63
  (e) => {
75
- const { scrollLeft, scrollWidth, clientWidth } = e.target;
64
+ const target = e.target;
65
+ const { scrollLeft, scrollWidth, clientWidth } = target;
76
66
  setLeftWidth(scrollLeft > 0 ? 40 : 0);
77
67
  setRightWidth(scrollLeft + clientWidth >= scrollWidth ? 0 : 40);
78
68
  },
79
69
  { wait: 200 }
80
- );
81
- const { run: handleScrollThrottled } = (0, import_ahooks.useThrottleFn)(
70
+ ).run;
71
+ const handleContentScroll = (0, import_ahooks.useDebounceFn)(
82
72
  () => {
83
- if (isClickScrolling.current) return;
84
- if (!(containerRef == null ? void 0 : containerRef.current)) return;
73
+ if (isClickScrolling.current || !(containerRef == null ? void 0 : containerRef.current)) return;
85
74
  const container = containerRef.current;
86
- const headerHeight = 65;
87
- const containerRect = container.getBoundingClientRect();
88
75
  const scrollTop = container.scrollTop;
89
- const containerHeight = containerRect.height;
76
+ const containerHeight = container.clientHeight;
90
77
  const scrollHeight = container.scrollHeight;
91
- const isAtBottom = scrollTop + containerHeight >= scrollHeight - 50;
78
+ const isAtBottom = Math.abs(scrollTop + containerHeight - scrollHeight) < 1;
92
79
  if (isAtBottom) {
93
80
  const lastOption = options[options.length - 1];
94
- if (tab !== lastOption.id && lastOption.id !== clickedTabRef.current) {
81
+ if (lastOption && tab !== lastOption.id) {
95
82
  onChange == null ? void 0 : onChange(lastOption.id);
96
83
  }
97
84
  return;
98
85
  }
99
- let closestOption = null;
100
- let minDistance = Infinity;
86
+ let maxVisibleRatio = 0;
87
+ let activeOption = null;
101
88
  for (const option of options) {
102
- const elementById = document.getElementById(option.id);
103
- const elementByDataAttr = document.querySelector(`[data-section="${option.id}"]`);
104
- const element = elementById || elementByDataAttr;
105
- if (element) {
106
- const htmlElement = element;
107
- const elementOffsetTop = htmlElement.offsetTop;
108
- const elementHeight = htmlElement.offsetHeight;
109
- const elementTopRelativeToViewport = elementOffsetTop - scrollTop;
110
- const isTopVisible = elementTopRelativeToViewport >= headerHeight && elementTopRelativeToViewport <= containerHeight;
111
- const isBottomVisible = elementTopRelativeToViewport + elementHeight >= headerHeight && elementTopRelativeToViewport + elementHeight <= containerHeight;
112
- const isElementPartiallyVisible = isTopVisible || isBottomVisible || elementTopRelativeToViewport < headerHeight && elementTopRelativeToViewport + elementHeight > containerHeight;
113
- const distance = Math.abs(elementTopRelativeToViewport - headerHeight);
114
- if (distance < minDistance) {
115
- minDistance = distance;
116
- closestOption = option;
89
+ const element = document.querySelector(`[data-section="${option.id}"]`);
90
+ if (element instanceof HTMLElement) {
91
+ const elementTop = element.offsetTop;
92
+ const elementHeight = element.offsetHeight;
93
+ const elementBottom = elementTop + elementHeight;
94
+ const visibleTop = Math.max(elementTop, scrollTop);
95
+ const visibleBottom = Math.min(elementBottom, scrollTop + containerHeight);
96
+ const visibleHeight = Math.max(0, visibleBottom - visibleTop);
97
+ const visibleRatio = visibleHeight / elementHeight;
98
+ if (visibleRatio > maxVisibleRatio) {
99
+ maxVisibleRatio = visibleRatio;
100
+ activeOption = option;
117
101
  }
118
102
  }
119
103
  }
120
- if (closestOption && tab !== closestOption.id && closestOption.id !== clickedTabRef.current && minDistance < 50) {
121
- onChange == null ? void 0 : onChange(closestOption.id);
104
+ if (activeOption && tab !== activeOption.id) {
105
+ onChange == null ? void 0 : onChange(activeOption.id);
122
106
  }
123
107
  },
124
- { wait: 150 }
125
- );
108
+ { wait: 100 }
109
+ ).run;
126
110
  (0, import_react.useEffect)(() => {
127
- if (!(containerRef == null ? void 0 : containerRef.current)) return;
128
- const handleScroll = () => {
129
- if (!isClickScrolling.current) {
130
- handleScrollThrottled();
131
- }
132
- };
133
- const container = containerRef.current;
134
- container.addEventListener("scroll", handleScroll);
135
- return () => {
136
- container.removeEventListener("scroll", handleScroll);
137
- };
138
- }, [handleScrollThrottled]);
111
+ const container = containerRef == null ? void 0 : containerRef.current;
112
+ if (!container) return;
113
+ container.addEventListener("scroll", handleContentScroll);
114
+ return () => container.removeEventListener("scroll", handleContentScroll);
115
+ }, [handleContentScroll]);
139
116
  const handleOptionClick = (item) => {
140
- console.log("PisellAnchor: Tab clicked", item.id);
141
- if (scrollTimeoutRef.current) {
142
- clearTimeout(scrollTimeoutRef.current);
143
- }
144
117
  onChange == null ? void 0 : onChange(item.id);
145
118
  onTabClick == null ? void 0 : onTabClick();
146
- const elementById = document.getElementById(String(item.id));
147
- const elementByDataAttr = document.querySelector(`[data-section="${String(item.id)}"]`);
148
- const element = elementById || elementByDataAttr;
149
- console.log("PisellAnchor: Target element found?", !!element);
150
- console.log("PisellAnchor: Container ref exists?", !!(containerRef == null ? void 0 : containerRef.current));
151
- if (element && (containerRef == null ? void 0 : containerRef.current)) {
119
+ const targetElement = document.querySelector(`[data-section="${item.id}"]`);
120
+ if (targetElement instanceof HTMLElement && (containerRef == null ? void 0 : containerRef.current)) {
152
121
  isClickScrolling.current = true;
153
- clickedTabRef.current = item.id;
154
- requestAnimationFrame(() => {
155
- if (!(containerRef == null ? void 0 : containerRef.current)) return;
156
- const htmlElement = element;
157
- const headerHeight = 65;
158
- const elementOffsetTop = htmlElement.offsetTop;
159
- console.log("PisellAnchor: Scrolling using offsetTop", {
160
- elementOffsetTop,
161
- targetScrollTop: elementOffsetTop - headerHeight
162
- });
163
- containerRef.current.scrollTo({
164
- top: elementOffsetTop - headerHeight,
165
- behavior: "smooth"
166
- });
167
- setTimeout(() => {
168
- if (!(containerRef == null ? void 0 : containerRef.current)) return;
169
- containerRef.current.scrollTo({
170
- top: elementOffsetTop - headerHeight,
171
- behavior: "auto"
172
- // 使用即时滚动确保位置准确
173
- });
174
- }, 300);
122
+ let scrollDistance = 0;
123
+ for (const option of options) {
124
+ if (option.id === item.id) break;
125
+ const element = document.querySelector(`[data-section="${option.id}"]`);
126
+ if (element instanceof HTMLElement) {
127
+ scrollDistance += element.offsetHeight;
128
+ }
129
+ }
130
+ containerRef.current.scrollTo({
131
+ top: scrollDistance,
132
+ behavior: "smooth"
175
133
  });
176
- scrollTimeoutRef.current = setTimeout(() => {
134
+ setTimeout(() => {
177
135
  isClickScrolling.current = false;
178
- clickedTabRef.current = null;
179
136
  }, 1e3);
180
- } else {
181
- console.warn("PisellAnchor: Cannot scroll, element or container not found", {
182
- elementId: item.id,
183
- elementByIdExists: !!elementById,
184
- elementByDataAttrExists: !!elementByDataAttr,
185
- containerExists: !!(containerRef == null ? void 0 : containerRef.current)
186
- });
187
137
  }
188
138
  };
189
- const onPageChange = (type) => {
139
+ const handlePageChange = (type) => {
190
140
  if (contentRef.current) {
191
141
  const { scrollLeft, clientWidth } = contentRef.current;
192
- const newScrollLeft = scrollLeft + (type === "left" ? -clientWidth : clientWidth);
193
142
  contentRef.current.scrollTo({
194
- left: newScrollLeft,
143
+ left: scrollLeft + (type === "left" ? -clientWidth : clientWidth),
195
144
  behavior: "smooth"
196
145
  });
197
146
  }
@@ -201,7 +150,7 @@ var PisellAnchor = (0, import_react.forwardRef)((props, ref) => {
201
150
  {
202
151
  className: "pisell-anchor-tabs-btn-left",
203
152
  style: { width: leftWidth },
204
- onClick: () => onPageChange("left")
153
+ onClick: () => handlePageChange("left")
205
154
  },
206
155
  /* @__PURE__ */ import_react.default.createElement(import_ChevronLeft.default, { className: "pisell-anchor-tabs-btn-icon" })
207
156
  ), /* @__PURE__ */ import_react.default.createElement(
@@ -209,43 +158,27 @@ var PisellAnchor = (0, import_react.forwardRef)((props, ref) => {
209
158
  {
210
159
  ref: contentRef,
211
160
  className: "pisell-anchor-tabs-content",
212
- id: `tab-${tab}-content`,
213
- onScroll: onScrollDebounced
161
+ onScroll: handleHorizontalScroll
214
162
  },
215
163
  options.map((item) => /* @__PURE__ */ import_react.default.createElement(
216
164
  "div",
217
165
  {
218
166
  key: item.id,
219
- id: `tab-${item.id}`,
220
167
  className: (0, import_classnames.default)("pisell-anchor-tabs-tab", {
221
168
  "pisell-anchor-tabs-tab-active": tab === item.id
222
169
  }),
223
- onClick: () => {
224
- console.log("PisellAnchor: Tab div clicked", item.id);
225
- handleOptionClick(item);
226
- }
170
+ onClick: () => handleOptionClick(item)
227
171
  },
228
- /* @__PURE__ */ import_react.default.createElement(
229
- "span",
230
- {
231
- className: "pisell-anchor-tabs-tab-content",
232
- onClick: (e) => {
233
- e.stopPropagation();
234
- console.log("PisellAnchor: Tab span clicked", item.id);
235
- handleOptionClick(item);
236
- }
237
- },
238
- item.name
239
- )
172
+ /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-anchor-tabs-tab-content" }, item.name)
240
173
  ))
241
174
  ), showButtons && /* @__PURE__ */ import_react.default.createElement(
242
175
  "div",
243
176
  {
244
177
  className: "pisell-anchor-tabs-btn-right",
245
178
  style: { width: rightWidth },
246
- onClick: () => onPageChange("right")
179
+ onClick: () => handlePageChange("right")
247
180
  },
248
181
  /* @__PURE__ */ import_react.default.createElement(import_ChevronRight.default, { className: "pisell-anchor-tabs-btn-icon" })
249
182
  ));
250
- });
183
+ };
251
184
  var pisellAnchor_default = PisellAnchor;
@@ -114,7 +114,7 @@
114
114
  display: flex;
115
115
  align-items: center;
116
116
  justify-content: center;
117
- background: linear-gradient(90deg, #fff 30%, rgba(255, 255, 255, 0.8) 100%);
117
+ background:none;
118
118
  cursor: pointer;
119
119
  transition: width 300ms ease;
120
120
  user-select: none;
@@ -134,12 +134,10 @@
134
134
 
135
135
  .pisell-anchor-tabs-btn-left {
136
136
  left: 0;
137
- background: linear-gradient(270deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
138
137
  }
139
138
 
140
139
  .pisell-anchor-tabs-btn-right {
141
140
  right: 0;
142
- background: linear-gradient(90deg, rgba(255, 255, 255, 0.8) 0%, #fff 70%);
143
141
  }
144
142
 
145
143
  .pisell-anchor-tabs-content {
@@ -172,7 +170,7 @@
172
170
  border-radius: 100px;
173
171
 
174
172
  &:hover:not(.pisell-anchor-tabs-tab-active) {
175
- color: var(--theme-color, #7f56d9);
173
+ color: inherit;
176
174
  }
177
175
 
178
176
  &.pisell-anchor-tabs-tab-active {
@@ -189,7 +187,7 @@
189
187
  }
190
188
 
191
189
  .pisell-anchor {
192
- border-bottom: 1px solid #EAECF0;
190
+ border-bottom: 1px solid #eaecf0;
193
191
 
194
192
  &.pisell-anchor-no-border {
195
193
  border-bottom: none;
@@ -88,7 +88,7 @@ var PisellAvatar = ({
88
88
  if (useTextAvatar && children) {
89
89
  return children;
90
90
  }
91
- return /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "pisell2-user-01" });
91
+ return /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "pisell2-user-01", className: "pisell-avatar-icon" });
92
92
  }, [useTextAvatar, children]);
93
93
  return /* @__PURE__ */ import_react.default.createElement(
94
94
  import_antd.Avatar,
@@ -5,7 +5,7 @@
5
5
  align-items: center;
6
6
  justify-content: center;
7
7
  background: var(--Gray-100, #f2f4f7); // 默认背景色
8
- border: 1px solid #D0D5DD; // 移除默认边框
8
+ border: 1px solid #d0d5dd; // 移除默认边框
9
9
  box-sizing: border-box;
10
10
 
11
11
  img {
@@ -14,6 +14,7 @@
14
14
 
15
15
  .anticon {
16
16
  font-size: inherit !important;
17
+ color: var(--Gray-600, #475467) !important;
17
18
  }
18
19
 
19
20
  // 文本头像样式
@@ -54,7 +54,7 @@ var PisellCustomCheckboxGroup = ({
54
54
  }, [allowAdd, dataSource]);
55
55
  const renderGridItem = (item, index) => {
56
56
  var _a;
57
- return /* @__PURE__ */ import_react.default.createElement("div", { onClick: () => onClick(item) }, (item == null ? void 0 : item.isAddCard) && renderAddItem ? renderAddItem(item) : (_a = rest == null ? void 0 : rest.renderItem) == null ? void 0 : _a.call(rest, item, index));
57
+ return /* @__PURE__ */ import_react.default.createElement("div", { onClick: () => onClick(item), style: { height: "100%" } }, (item == null ? void 0 : item.isAddCard) && renderAddItem ? renderAddItem(item) : (_a = rest == null ? void 0 : rest.renderItem) == null ? void 0 : _a.call(rest, item, index));
58
58
  };
59
59
  return /* @__PURE__ */ import_react.default.createElement(
60
60
  import_pisellViewGrid.default,
@@ -54,7 +54,15 @@ var PisellEmpty = (props) => {
54
54
  ...others,
55
55
  className: (0, import_classnames.default)("pisell-empty-wrap", className),
56
56
  image: /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-icon-wrap" }, icon || /* @__PURE__ */ import_react.default.createElement(import_Inbox01.default, { style: { color: "#667085" } })),
57
- description: /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-wrap-description-wrap", style: { maxWidth: maxWidth || 300 } }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-wrap-description" }, description), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-wrap-extra-description" }, extraDescription))
57
+ description: /* @__PURE__ */ import_react.default.createElement(
58
+ "div",
59
+ {
60
+ className: "pisell-empty-wrap-description-wrap",
61
+ style: { maxWidth: maxWidth || 300 }
62
+ },
63
+ /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-wrap-description" }, description),
64
+ /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-empty-wrap-extra-description" }, extraDescription)
65
+ )
58
66
  },
59
67
  footer
60
68
  );
@@ -0,0 +1,47 @@
1
+ import React from 'react';
2
+ import './index.less';
3
+ interface ApplicableProductDetails {
4
+ amount: string;
5
+ type: string;
6
+ resource_id: number;
7
+ title: string;
8
+ original_amount: string;
9
+ }
10
+ interface Discount {
11
+ id: number;
12
+ product_name: string;
13
+ encoded: string;
14
+ code: string;
15
+ tag: string;
16
+ expire_time?: string;
17
+ product_id: number;
18
+ relation_type: string;
19
+ par_value: string;
20
+ used_par_value: string;
21
+ limit_status: string;
22
+ limited_relation_product_data: any;
23
+ balance: string;
24
+ format_title: any;
25
+ product: any;
26
+ savedAmount: number;
27
+ isDisabled: boolean;
28
+ isSelected?: boolean;
29
+ isAvailable?: boolean;
30
+ isUsed?: boolean;
31
+ applicableProductIds?: number[];
32
+ applicableProductDetails: ApplicableProductDetails[];
33
+ appliedProductDetails: any[];
34
+ }
35
+ export interface PisellGoodPassCardProps {
36
+ /**数据源 */
37
+ dataSource: Array<Discount>;
38
+ /**事件 */
39
+ onChange?: (current: {
40
+ id: string | number;
41
+ isSelected: boolean;
42
+ }) => void;
43
+ /**样式 */
44
+ style: React.CSSProperties;
45
+ }
46
+ declare const index: (props: PisellGoodPassCardProps) => JSX.Element;
47
+ export default index;