@antscorp/antsomi-ui 1.3.5-beta.256 → 1.3.5-beta.258

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.
@@ -2,7 +2,6 @@ import React from 'react';
2
2
  import { StepsProps as AntdStepsProps, StepProps as AntdStepProps } from 'antd';
3
3
  export type StepsProps = AntdStepsProps & {
4
4
  saveHighestStep?: boolean;
5
- iconSize?: number;
6
5
  };
7
6
  export type StepProps = AntdStepProps;
8
7
  export declare const Steps: React.FC<StepsProps>;
@@ -15,7 +15,7 @@ import { isNumber } from 'lodash';
15
15
  // Styled
16
16
  import { SelectedIcon, StepsWrapper } from './styled';
17
17
  export const Steps = memo(props => {
18
- const { items, saveHighestStep = true, iconSize = 24, className } = props, restOfProps = __rest(props, ["items", "saveHighestStep", "iconSize", "className"]);
18
+ const { items, saveHighestStep = true, className } = props, restOfProps = __rest(props, ["items", "saveHighestStep", "className"]);
19
19
  const { current, size = 'small' } = restOfProps;
20
20
  const [highestStep, setHighestStep] = useState(0);
21
21
  useEffect(() => {
@@ -38,14 +38,14 @@ export const Steps = memo(props => {
38
38
  }
39
39
  else {
40
40
  status = 'finish';
41
- icon = React.createElement(SelectedIcon, { size: size }, index + 1);
41
+ icon = React.createElement(SelectedIcon, null, index + 1);
42
42
  className = `antsomi-steps-item-selectable${index === highestStep ? ' highest-step' : ''}`;
43
43
  }
44
44
  }
45
45
  return Object.assign({ status, icon, className }, item);
46
46
  })
47
- : items, [current, saveHighestStep, highestStep, items, size]);
47
+ : items, [current, saveHighestStep, highestStep, items]);
48
48
  /** Check whether the user has reactivated the previous step or not */
49
49
  const isReactivate = saveHighestStep && isNumber(current) && current < highestStep;
50
- return (React.createElement(StepsWrapper, Object.assign({ items: customItems }, restOfProps, { size: "small", iconSize: iconSize, isReactivate: isReactivate, highestStep: highestStep, className: `${className || ''}${saveHighestStep ? ' save-highest-step' : ''}` })));
50
+ return (React.createElement(StepsWrapper, Object.assign({ items: customItems }, restOfProps, { size: size, isReactivate: isReactivate, highestStep: highestStep, className: `${className || ''}${saveHighestStep ? ' save-highest-step' : ''}` })));
51
51
  });
@@ -1,11 +1,8 @@
1
1
  /// <reference types="react" />
2
- export declare const SelectedIcon: import("styled-components").StyledComponent<"div", any, {
3
- size: 'small' | 'default';
4
- }, never>;
2
+ export declare const SelectedIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
5
3
  export declare const StepsWrapper: import("styled-components").StyledComponent<import("react").FC<import("antd").StepsProps> & {
6
4
  Step: typeof import("rc-steps").Step;
7
5
  }, any, {
8
- iconSize: number;
9
6
  isReactivate: boolean;
10
7
  highestStep: number;
11
8
  }, never>;
@@ -3,28 +3,54 @@ import styled from 'styled-components';
3
3
  import { Steps } from 'antd';
4
4
  // Constants
5
5
  import { THEME } from '@antscorp/antsomi-ui/es/constants';
6
+ const STEP_SIZE = {
7
+ SMALL: 24,
8
+ DEFAULT: 32,
9
+ };
6
10
  export const SelectedIcon = styled.div `
7
11
  border: 1px solid #b8cfe6;
8
12
  border-radius: 100%;
9
- width: ${({ size }) => (size === 'small' ? 20 : 30)}px;
10
- height: ${({ size }) => (size === 'small' ? 20 : 30)}px;
11
13
  font-size: 14px;
12
14
  color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary};
15
+ box-sizing: border-box;
16
+ width: 100%;
17
+ height: 100%;
18
+ display: flex;
19
+ justify-content: center;
20
+ align-items: center;
13
21
  `;
14
22
  export const StepsWrapper = styled(Steps) `
15
23
  &.save-highest-step {
16
24
  /** Steps Default */
17
25
  &.antsomi-steps:not(.antsomi-steps-dot) {
26
+ &.antsomi-steps-small
27
+ .antsomi-steps-item
28
+ .antsomi-steps-item-container
29
+ .antsomi-steps-item-icon {
30
+ width: ${STEP_SIZE.SMALL}px;
31
+ height: ${STEP_SIZE.SMALL}px;
32
+ }
33
+
18
34
  .antsomi-steps-item {
19
- .antsomi-steps-item-container {
20
- .antsomi-steps-item-icon {
21
- box-sizing: content-box;
35
+ & > .antsomi-steps-item-container {
36
+ & > .antsomi-steps-item-icon {
37
+ box-sizing: border-box;
22
38
  border-radius: 100%;
23
39
  font-size: 14px;
24
40
  font-weight: bold;
41
+ display: inline-flex;
42
+ justify-content: center;
43
+ align-items: center;
44
+ width: ${STEP_SIZE.DEFAULT}px;
45
+ height: ${STEP_SIZE.DEFAULT}px;
25
46
 
26
47
  .antsomi-steps-icon {
27
48
  color: white;
49
+ width: 100%;
50
+ height: 100%;
51
+ display: flex;
52
+ justify-content: center;
53
+ align-items: center;
28
54
  }
29
55
  }
30
56
 
@@ -54,6 +54,7 @@ export declare class ObjectTemplate extends Model<TObjectTemplate> {
54
54
  get goal(): number[] | undefined;
55
55
  get channel(): number | undefined;
56
56
  get shareAccess(): TShareAccess | undefined;
57
+ get deviceType(): number | undefined;
57
58
  toJson(): {
58
59
  id: string | number;
59
60
  name: string;
@@ -79,5 +80,6 @@ export declare class ObjectTemplate extends Model<TObjectTemplate> {
79
80
  goal: number[] | undefined;
80
81
  channel: number | undefined;
81
82
  shareAccess: TShareAccess | undefined;
83
+ deviceType: number | undefined;
82
84
  };
83
85
  }
@@ -76,6 +76,9 @@ export class ObjectTemplate extends Model {
76
76
  get shareAccess() {
77
77
  return this.model.share_access;
78
78
  }
79
+ get deviceType() {
80
+ return this.model.device_type;
81
+ }
79
82
  toJson() {
80
83
  return {
81
84
  id: this.id,
@@ -102,6 +105,7 @@ export class ObjectTemplate extends Model {
102
105
  goal: this.goal,
103
106
  channel: this.channel,
104
107
  shareAccess: this.shareAccess,
108
+ deviceType: this.deviceType,
105
109
  };
106
110
  }
107
111
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.256",
3
+ "version": "1.3.5-beta.258",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",
@@ -60,7 +60,7 @@
60
60
  "not op_mini all"
61
61
  ],
62
62
  "dependencies": {
63
- "@antscorp/icons": "^0.27.14",
63
+ "@antscorp/icons": "^0.27.22",
64
64
  "@antscorp/image-editor": "1.0.2",
65
65
  "@antscorp/processing-notification": "^1.0.3",
66
66
  "@emotion/react": "^11.11.1",