@trackunit/utilization-indicator 0.0.308 → 0.0.309

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 (5) hide show
  1. package/index.cjs.js +8 -7
  2. package/index.esm.js +8 -7
  3. package/package.json +1 -1
  4. package/src/ActivityIndicator.d.ts +1 -1
  5. package/src/useActivity.d.ts +3 -2
package/index.cjs.js CHANGED
@@ -61,16 +61,17 @@ const setupLibraryTranslations = () => {
61
61
  * Returns the activity indicator props.
62
62
  *
63
63
  * @param state - The activity state.
64
- * @returns {UseActivity}- The activity indicator props.
64
+ * @param size - The size of the icon.
65
+ * @returns {UseActivity} - The activity indicator props.
65
66
  */
66
- const useActivity = state => {
67
+ const useActivity = (state, size = "medium") => {
67
68
  const [t] = useTranslation();
68
69
  switch (state) {
69
70
  case utilizationTokens.assetActivityState.Working:
70
71
  case "WORKING":
71
72
  return {
72
73
  activityIndicator: {
73
- icon: jsxRuntime.jsx(reactComponents.Icon, { name: "PlayCircle", size: "medium" }),
74
+ icon: jsxRuntime.jsx(reactComponents.Icon, { name: "PlayCircle", size: size }),
74
75
  label: t("indicator.activity.working"),
75
76
  color: "working",
76
77
  },
@@ -79,7 +80,7 @@ const useActivity = state => {
79
80
  case "IDLING":
80
81
  return {
81
82
  activityIndicator: {
82
- icon: jsxRuntime.jsx(reactComponents.Icon, { name: "PauseCircle", size: "medium" }),
83
+ icon: jsxRuntime.jsx(reactComponents.Icon, { name: "PauseCircle", size: size }),
83
84
  label: t("indicator.activity.idle"),
84
85
  color: "idle",
85
86
  },
@@ -88,7 +89,7 @@ const useActivity = state => {
88
89
  case "STOPPED":
89
90
  return {
90
91
  activityIndicator: {
91
- icon: jsxRuntime.jsx(reactComponents.Icon, { name: "StopCircle", size: "medium" }),
92
+ icon: jsxRuntime.jsx(reactComponents.Icon, { name: "StopCircle", size: size }),
92
93
  label: t("indicator.activity.stopped"),
93
94
  color: "stopped",
94
95
  },
@@ -97,7 +98,7 @@ const useActivity = state => {
97
98
  case "UNKNOWN":
98
99
  return {
99
100
  activityIndicator: {
100
- icon: jsxRuntime.jsx(reactComponents.Icon, { name: "QuestionMarkCircle", size: "medium" }),
101
+ icon: jsxRuntime.jsx(reactComponents.Icon, { name: "QuestionMarkCircle", size: size }),
101
102
  label: t("indicator.activity.unknown"),
102
103
  color: "unknown",
103
104
  },
@@ -116,7 +117,7 @@ const useActivity = state => {
116
117
  * @returns {JSX.Element | null } - Activity indicator.
117
118
  */
118
119
  const ActivityIndicator = (props) => {
119
- const { activityIndicator } = useActivity(props.state);
120
+ const { activityIndicator } = useActivity(props.state, props.size);
120
121
  return activityIndicator ? jsxRuntime.jsx(reactComponents.Indicator, { ...activityIndicator, ...props }) : null;
121
122
  };
122
123
 
package/index.esm.js CHANGED
@@ -59,16 +59,17 @@ const setupLibraryTranslations = () => {
59
59
  * Returns the activity indicator props.
60
60
  *
61
61
  * @param state - The activity state.
62
- * @returns {UseActivity}- The activity indicator props.
62
+ * @param size - The size of the icon.
63
+ * @returns {UseActivity} - The activity indicator props.
63
64
  */
64
- const useActivity = state => {
65
+ const useActivity = (state, size = "medium") => {
65
66
  const [t] = useTranslation();
66
67
  switch (state) {
67
68
  case assetActivityState.Working:
68
69
  case "WORKING":
69
70
  return {
70
71
  activityIndicator: {
71
- icon: jsx(Icon, { name: "PlayCircle", size: "medium" }),
72
+ icon: jsx(Icon, { name: "PlayCircle", size: size }),
72
73
  label: t("indicator.activity.working"),
73
74
  color: "working",
74
75
  },
@@ -77,7 +78,7 @@ const useActivity = state => {
77
78
  case "IDLING":
78
79
  return {
79
80
  activityIndicator: {
80
- icon: jsx(Icon, { name: "PauseCircle", size: "medium" }),
81
+ icon: jsx(Icon, { name: "PauseCircle", size: size }),
81
82
  label: t("indicator.activity.idle"),
82
83
  color: "idle",
83
84
  },
@@ -86,7 +87,7 @@ const useActivity = state => {
86
87
  case "STOPPED":
87
88
  return {
88
89
  activityIndicator: {
89
- icon: jsx(Icon, { name: "StopCircle", size: "medium" }),
90
+ icon: jsx(Icon, { name: "StopCircle", size: size }),
90
91
  label: t("indicator.activity.stopped"),
91
92
  color: "stopped",
92
93
  },
@@ -95,7 +96,7 @@ const useActivity = state => {
95
96
  case "UNKNOWN":
96
97
  return {
97
98
  activityIndicator: {
98
- icon: jsx(Icon, { name: "QuestionMarkCircle", size: "medium" }),
99
+ icon: jsx(Icon, { name: "QuestionMarkCircle", size: size }),
99
100
  label: t("indicator.activity.unknown"),
100
101
  color: "unknown",
101
102
  },
@@ -114,7 +115,7 @@ const useActivity = state => {
114
115
  * @returns {JSX.Element | null } - Activity indicator.
115
116
  */
116
117
  const ActivityIndicator = (props) => {
117
- const { activityIndicator } = useActivity(props.state);
118
+ const { activityIndicator } = useActivity(props.state, props.size);
118
119
  return activityIndicator ? jsx(Indicator, { ...activityIndicator, ...props }) : null;
119
120
  };
120
121
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trackunit/utilization-indicator",
3
- "version": "0.0.308",
3
+ "version": "0.0.309",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "engines": {
package/src/ActivityIndicator.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { CommonProps, IndicatorProps } from "@trackunit/react-components";
2
2
  import { AssetActivityState } from "@trackunit/utilization-tokens";
3
- export interface ActivityIndicatorProps extends Pick<IndicatorProps, "withBackground" | "withLabel" | "ping">, CommonProps {
3
+ export interface ActivityIndicatorProps extends Pick<IndicatorProps, "withBackground" | "withLabel" | "ping" | "size">, CommonProps {
4
4
  state: AssetActivityState;
5
5
  }
6
6
  /**
package/src/useActivity.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { ActivityColors } from "@trackunit/ui-design-tokens";
2
2
  import { AssetActivityState } from "@trackunit/utilization-tokens";
3
- type UseActivity = (state?: AssetActivityState) => {
3
+ type UseActivity = (state?: AssetActivityState, size?: "small" | "medium" | "large") => {
4
4
  activityIndicator?: {
5
5
  icon: JSX.Element;
6
6
  label: string;
@@ -11,7 +11,8 @@ type UseActivity = (state?: AssetActivityState) => {
11
11
  * Returns the activity indicator props.
12
12
  *
13
13
  * @param state - The activity state.
14
- * @returns {UseActivity}- The activity indicator props.
14
+ * @param size - The size of the icon.
15
+ * @returns {UseActivity} - The activity indicator props.
15
16
  */
16
17
  export declare const useActivity: UseActivity;
17
18
  export {};