x-star-design 0.0.51 → 0.0.52

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.
@@ -78,8 +78,8 @@ export declare const useLocale: <T extends "VisualDataConfig" | "TranslateButton
78
78
  readonly FEEDBACK_TYPE: "反馈类型";
79
79
  readonly SUBMIT: "提交";
80
80
  readonly FEEDBACK_ON_THE_PROBLEM: "您对本题目的反馈";
81
- readonly ACCLAIM: "喜欢";
82
- readonly BAD_REVIEW: "不喜欢";
81
+ readonly ACCLAIM: "满意";
82
+ readonly BAD_REVIEW: "不满意";
83
83
  readonly PLEASE_SELECT_FEEDBACK_TYPE: "请填写反馈评价";
84
84
  readonly FEEDBACK_TEXTAREA_PLACEHOLDER: "请详细描述你的反馈,我们会尽快处理";
85
85
  readonly FEEDBACK_MESSAGE_1: "请填写满意度";
@@ -67,8 +67,8 @@ declare const _default: {
67
67
  readonly FEEDBACK_TYPE: "反馈类型";
68
68
  readonly SUBMIT: "提交";
69
69
  readonly FEEDBACK_ON_THE_PROBLEM: "您对本题目的反馈";
70
- readonly ACCLAIM: "喜欢";
71
- readonly BAD_REVIEW: "不喜欢";
70
+ readonly ACCLAIM: "满意";
71
+ readonly BAD_REVIEW: "不满意";
72
72
  readonly PLEASE_SELECT_FEEDBACK_TYPE: "请填写反馈评价";
73
73
  readonly FEEDBACK_TEXTAREA_PLACEHOLDER: "请详细描述你的反馈,我们会尽快处理";
74
74
  readonly FEEDBACK_MESSAGE_1: "请填写满意度";
@@ -67,8 +67,8 @@ export default {
67
67
  FEEDBACK_TYPE: '反馈类型',
68
68
  SUBMIT: '提交',
69
69
  FEEDBACK_ON_THE_PROBLEM: '您对本题目的反馈',
70
- ACCLAIM: '喜欢',
71
- BAD_REVIEW: '不喜欢',
70
+ ACCLAIM: '满意',
71
+ BAD_REVIEW: '不满意',
72
72
  PLEASE_SELECT_FEEDBACK_TYPE: '请填写反馈评价',
73
73
  FEEDBACK_TEXTAREA_PLACEHOLDER: '请详细描述你的反馈,我们会尽快处理',
74
74
  FEEDBACK_MESSAGE_1: '请填写满意度',
@@ -39,7 +39,6 @@
39
39
  z-index: 999;
40
40
  border: 3px dashed orange !important;
41
41
  }
42
- .x-star-design-contactButtonCard .ant-card-body,
43
42
  .x-star-design-contactButtonCard .x-star-design-card-body {
44
43
  padding: 5px;
45
44
  }
@@ -518,18 +517,21 @@
518
517
  width: 100%;
519
518
  }
520
519
 
521
- .x-star-design-XTabs.x-star-design-tabs, .x-star-design-XTabs.ant-tabs {
520
+ .x-star-design-xtabs-wrapper {
521
+ width: 100%;
522
+ }
523
+
524
+ .x-star-design-xtabs.x-star-design-tabs {
522
525
  width: 100%;
523
526
  min-height: 80vh;
524
527
  border: 0;
525
528
  background-color: #fff;
526
529
  color: #9e9e9e;
527
530
  }
528
- .x-star-design-XTabs .x-star-design-tabs-nav-wrap,
529
- .x-star-design-XTabs .ant-tabs-nav-wrap {
531
+ .x-star-design-xtabs .x-star-design-tabs-nav-wrap {
530
532
  background-color: var(--xtabs-secondary-color);
531
533
  }
532
- .x-star-design-XTabs.x-star-design-tabs-card > .x-star-design-tabs-nav .x-star-design-tabs-tab, .x-star-design-XTabs.ant-tabs-card > .ant-tabs-nav .ant-tabs-tab {
534
+ .x-star-design-xtabs.x-star-design-tabs-card > .x-star-design-tabs-nav .x-star-design-tabs-tab {
533
535
  width: 130px;
534
536
  height: 130px;
535
537
  background-color: unset;
@@ -540,42 +542,38 @@
540
542
  border: 0;
541
543
  color: #9e9e9e;
542
544
  }
543
- .x-star-design-XTabs.x-star-design-tabs-card > .x-star-design-tabs-nav .x-star-design-tabs-tab-active, .x-star-design-XTabs.ant-tabs-card > .ant-tabs-nav .ant-tabs-tab-active {
545
+ .x-star-design-xtabs.x-star-design-tabs-card > .x-star-design-tabs-nav .x-star-design-tabs-tab-active {
544
546
  border-left: 6px solid var(--xtabs-primary-color);
545
547
  background-color: #fff;
546
548
  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
547
549
  border-radius: 0;
548
550
  }
549
- .x-star-design-XTabs.x-star-design-tabs .x-star-design-tabs-tab:hover, .x-star-design-XTabs.ant-tabs .ant-tabs-tab:hover {
551
+ .x-star-design-xtabs.x-star-design-tabs .x-star-design-tabs-tab:hover {
550
552
  color: var(--xtabs-primary-color);
551
553
  }
552
- .x-star-design-XTabs .x-star-design-tabs-tab-btn,
553
- .x-star-design-XTabs .ant-tabs-tab-btn {
554
+ .x-star-design-xtabs .x-star-design-tabs-tab-btn {
554
555
  text-align: center;
555
556
  white-space: normal;
556
557
  }
557
- .x-star-design-XTabs .x-star-design-tabs-content-holder,
558
- .x-star-design-XTabs .ant-tabs-content-holder {
558
+ .x-star-design-xtabs .x-star-design-tabs-content-holder {
559
559
  border-left: 0;
560
560
  }
561
- .x-star-design-XTabs .x-star-design-tabs-content,
562
- .x-star-design-XTabs .ant-tabs-content {
561
+ .x-star-design-xtabs .x-star-design-tabs-content {
563
562
  display: flex;
564
563
  width: 100%;
565
564
  height: 100%;
566
565
  border: 1px solid #d7d7d7;
567
566
  padding: 0 20px;
568
567
  }
569
- .x-star-design-XTabs .x-star-design-tabs-tabpane,
570
- .x-star-design-XTabs .ant-tabs-tabpane {
568
+ .x-star-design-xtabs .x-star-design-tabs-tabpane {
571
569
  padding: 0 24px 24px;
572
570
  }
573
- .x-star-design-XTabs .x-star-design-icon-img {
571
+ .x-star-design-xtabs .x-star-design-icon-img {
574
572
  text-align: center;
575
573
  font-size: 44px;
576
574
  padding-left: 10px;
577
575
  }
578
- .x-star-design-XTabs .x-star-design-icon-title {
576
+ .x-star-design-xtabs .x-star-design-icon-title {
579
577
  font-size: 16px;
580
578
  display: block;
581
579
  padding-top: 10px;
@@ -1,9 +1,9 @@
1
1
  import React from 'react';
2
- type TitleWithIconProps = {
3
- title: React.ReactNode;
2
+ interface TitleWithIconProps {
3
+ id?: string;
4
4
  className?: string;
5
+ title?: React.ReactNode;
5
6
  description?: React.ReactNode;
6
- id?: string;
7
- };
8
- declare const TitleWithIcon: ({ className, title, description, id, }: TitleWithIconProps) => React.JSX.Element;
7
+ }
8
+ declare const TitleWithIcon: ({ id, className, title, description, }: TitleWithIconProps) => React.JSX.Element;
9
9
  export default TitleWithIcon;
@@ -4,21 +4,23 @@ import classNames from 'classnames';
4
4
  import React, { useContext } from 'react';
5
5
  import { prefix } from "../utils/global";
6
6
  var TitleWithIcon = function TitleWithIcon(_ref) {
7
- var className = _ref.className,
7
+ var _theme$token;
8
+ var id = _ref.id,
9
+ className = _ref.className,
8
10
  title = _ref.title,
9
- description = _ref.description,
10
- id = _ref.id;
11
+ description = _ref.description;
11
12
  var _useContext = useContext(ConfigContext),
12
13
  theme = _useContext.theme;
13
- var _ref2 = (theme === null || theme === void 0 ? void 0 : theme.token) || {},
14
- colorPrimary = _ref2.colorPrimary;
14
+ var _ref2 = (_theme$token = theme === null || theme === void 0 ? void 0 : theme.token) !== null && _theme$token !== void 0 ? _theme$token : {},
15
+ _ref2$colorPrimary = _ref2.colorPrimary,
16
+ colorPrimary = _ref2$colorPrimary === void 0 ? '#1990fe' : _ref2$colorPrimary;
15
17
  return /*#__PURE__*/React.createElement("div", {
16
18
  "data-testid": "wrapper",
17
- className: classNames(className, "".concat(prefix, "-titleSection")),
18
- id: id
19
+ id: id,
20
+ className: classNames(className, "".concat(prefix, "-titleSection"))
19
21
  }, /*#__PURE__*/React.createElement(RightSquareFilled, {
20
22
  style: {
21
- color: colorPrimary || '#1990fe'
23
+ color: colorPrimary
22
24
  }
23
25
  }), /*#__PURE__*/React.createElement("span", {
24
26
  "data-testid": "title",
@@ -2,9 +2,9 @@ import { TabsProps } from 'antd';
2
2
  import React from 'react';
3
3
  type XTabsItem = Exclude<TabsProps['items'], undefined> extends (infer Item)[] ? Item & {
4
4
  icon?: React.ReactNode;
5
- } : undefined;
5
+ } : never;
6
6
  interface XTabsProps extends TabsProps {
7
- items: XTabsItem[];
7
+ items?: XTabsItem[];
8
8
  }
9
9
  declare const XTabs: ({ items, ...props }: XTabsProps) => React.JSX.Element;
10
10
  export default XTabs;
@@ -7,6 +7,7 @@ import { ConfigContext } from 'antd/es/config-provider';
7
7
  import React, { useContext, useEffect, useMemo, useRef } from 'react';
8
8
  import ConfigProviderWrapper from "../config-provider-wrapper";
9
9
  import { prefix } from "../utils/global";
10
+
10
11
  //hash颜色转换rgba
11
12
  function hexToRGBA(hex, alpha) {
12
13
  var r = '',
@@ -24,25 +25,21 @@ function hexToRGBA(hex, alpha) {
24
25
  return "rgba(".concat(+r, ",").concat(+g, ",").concat(+b, ",").concat(alpha, ")");
25
26
  }
26
27
  var XTabs = function XTabs(_ref) {
28
+ var _theme$token;
27
29
  var items = _ref.items,
28
30
  props = _objectWithoutProperties(_ref, _excluded);
31
+ var colorThemeRef = useRef(null);
29
32
  var _useContext = useContext(ConfigContext),
30
33
  theme = _useContext.theme;
31
- var _ref2 = (theme === null || theme === void 0 ? void 0 : theme.token) || {},
34
+ var _ref2 = (_theme$token = theme === null || theme === void 0 ? void 0 : theme.token) !== null && _theme$token !== void 0 ? _theme$token : {},
32
35
  _ref2$colorPrimary = _ref2.colorPrimary,
33
36
  colorPrimary = _ref2$colorPrimary === void 0 ? '#1990fe' : _ref2$colorPrimary;
34
- var colorThemeRef = useRef(null);
35
37
  useEffect(function () {
36
38
  var _colorThemeRef$curren, _colorThemeRef$curren2;
37
39
  //设置主题色
38
40
  (_colorThemeRef$curren = colorThemeRef.current) === null || _colorThemeRef$curren === void 0 ? void 0 : _colorThemeRef$curren.style.setProperty('--xtabs-primary-color', colorPrimary);
39
41
  (_colorThemeRef$curren2 = colorThemeRef.current) === null || _colorThemeRef$curren2 === void 0 ? void 0 : _colorThemeRef$curren2.style.setProperty('--xtabs-secondary-color', hexToRGBA(colorPrimary, 0.15));
40
- return function () {
41
- var _colorThemeRef$curren3, _colorThemeRef$curren4;
42
- (_colorThemeRef$curren3 = colorThemeRef.current) === null || _colorThemeRef$curren3 === void 0 ? void 0 : _colorThemeRef$curren3.style.removeProperty('--xtabs-primary-color');
43
- (_colorThemeRef$curren4 = colorThemeRef.current) === null || _colorThemeRef$curren4 === void 0 ? void 0 : _colorThemeRef$curren4.style.removeProperty('--xtabs-secondary-color');
44
- };
45
- }, []);
42
+ }, [colorPrimary]);
46
43
  var newItems = useMemo(function () {
47
44
  return items === null || items === void 0 ? void 0 : items.map(function (item) {
48
45
  return _objectSpread(_objectSpread({}, item), {}, {
@@ -57,10 +54,11 @@ var XTabs = function XTabs(_ref) {
57
54
  });
58
55
  }, [items]);
59
56
  return /*#__PURE__*/React.createElement(ConfigProviderWrapper, null, /*#__PURE__*/React.createElement("div", {
57
+ "data-testid": 'xtabsColorTheme',
60
58
  ref: colorThemeRef,
61
- "data-testid": 'xtabsColorTheme'
59
+ className: "".concat(prefix, "-xtabs-wrapper")
62
60
  }, /*#__PURE__*/React.createElement(Tabs, _extends({
63
- className: "".concat(prefix, "-XTabs"),
61
+ className: "".concat(prefix, "-xtabs"),
64
62
  tabPosition: 'left',
65
63
  size: "large",
66
64
  type: "card",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "x-star-design",
3
- "version": "0.0.51",
3
+ "version": "0.0.52",
4
4
  "description": "A react component library developed by turingstar",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",
@@ -1,24 +0,0 @@
1
- <?xml version="1.0" encoding="UTF-8"?>
2
- <svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
3
- <title>review</title>
4
- <g id="融合题页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
5
- <g id="融合题-页面布局-方案一" transform="translate(-186.000000, -824.000000)" fill="#FC7D33">
6
- <g id="左侧" transform="translate(50.000000, 88.000000)">
7
- <g id="图例" transform="translate(0.000000, 522.000000)">
8
- <g id="状态区分" transform="translate(24.000000, 128.000000)">
9
- <g transform="translate(10.000000, 30.000000)" id="客观题备份-4">
10
- <g transform="translate(86.000000, 52.000000)">
11
- <g id="1备份-11" transform="translate(12.000000, 0.000000)">
12
- <g id="review" transform="translate(4.000000, 4.000000)">
13
- <rect id="矩形" fill-rule="nonzero" opacity="0" x="0" y="0" width="12" height="12"></rect>
14
- <rect id="矩形" stroke="#FC7D33" x="1.92753247" y="5.96077922" width="8.14285714" height="1"></rect>
15
- </g>
16
- </g>
17
- </g>
18
- </g>
19
- </g>
20
- </g>
21
- </g>
22
- </g>
23
- </g>
24
- </svg>
@@ -1,16 +0,0 @@
1
- <svg
2
- t="1692761303575"
3
- class="icon"
4
- viewBox="64 64 896 896"
5
- version="1.1"
6
- xmlns="http://www.w3.org/2000/svg"
7
- p-id="8268"
8
- data-spm-anchor-id="a313x.search_index.0.i2.2cc53a81BXBCFy"
9
- width="1em"
10
- height="1em"
11
- >
12
- <path
13
- d="M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zM658.7 518.5l-246 178c-5.3 3.8-12.7 0-12.7-6.5v-46.9c0-10.2 4.9-19.9 13.2-25.9L558.6 512 413.2 406.8c-8.3-6-13.2-15.6-13.2-25.9V334c0-6.5 7.4-10.3 12.7-6.5l246 178c4.4 3.2 4.4 9.8 0 13z"
14
- fill="#1890ff"
15
- ></path>
16
- </svg>