@antscorp/antsomi-ui 1.3.5-beta.322 → 1.3.5-beta.324

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 (14) hide show
  1. package/es/components/molecules/EditorTab/EditorTab.js +25 -13
  2. package/es/components/molecules/ThumbnailCard/ThumbnailCard.js +39 -7
  3. package/es/components/molecules/ThumbnailCard/constants.d.ts +5 -0
  4. package/es/components/molecules/ThumbnailCard/constants.js +22 -0
  5. package/es/components/molecules/ThumbnailCard/styled.js +4 -2
  6. package/es/components/molecules/ThumbnailCard/types.d.ts +11 -2
  7. package/es/constants/theme.js +26 -25
  8. package/es/locales/en/translation.json +2 -1
  9. package/es/locales/i18n.d.ts +9 -0
  10. package/es/locales/translations.d.ts +1 -0
  11. package/es/locales/vi/translation.json +9 -1
  12. package/es/providers/ConfigProvider/GlobalStyle.js +1 -1
  13. package/es/types/variables.d.ts +17 -0
  14. package/package.json +2 -2
package/es/components/molecules/EditorTab/EditorTab.js CHANGED
@@ -27,11 +27,10 @@ export const EditorTab = props => {
27
27
  setArrTabs(listTab);
28
28
  // eslint-disable-next-line react-hooks/exhaustive-deps
29
29
  }, [listTab]);
30
- useEffect(() => {
31
- if (onActiveTab)
32
- onActiveTab(activeTabId);
33
- // eslint-disable-next-line react-hooks/exhaustive-deps
34
- }, [activeTabId]);
30
+ // useEffect(() => {
31
+ // if (onActiveTab) onActiveTab(activeTabId);
32
+ // // eslint-disable-next-line react-hooks/exhaustive-deps
33
+ // }, [activeTabId]);
35
34
  useEffect(() => {
36
35
  const tabEl = document.getElementById(`tab-${activeTabId}`);
37
36
  if (tabEl) {
@@ -55,20 +54,29 @@ export const EditorTab = props => {
55
54
  if (activeTabId === tab.id) {
56
55
  if (idx === arrTabs.length - 1) {
57
56
  setActiveTabId(arrTabs[idx - 1].id);
57
+ if (onActiveTab)
58
+ onActiveTab(arrTabs[idx - 1].id);
58
59
  }
59
60
  else if (arrTabs.length > 1) {
60
61
  setActiveTabId(arrTabs[idx + 1].id);
62
+ if (onActiveTab)
63
+ onActiveTab(arrTabs[idx - 1].id);
61
64
  }
62
65
  }
63
- setArrTabs(prevTabs => {
64
- const newTabs = [...prevTabs];
65
- newTabs.splice(idx, 1);
66
- onCloseTab(tab, idx, newTabs);
67
- return newTabs;
68
- });
66
+ const newTabs = [...arrTabs];
67
+ newTabs.splice(idx, 1);
68
+ onCloseTab(tab, idx, newTabs);
69
+ // setArrTabs(prevTabs => {
70
+ // const newTabs = [...prevTabs];
71
+ // newTabs.splice(idx, 1);
72
+ // onCloseTab(tab, idx, newTabs);
73
+ // return newTabs;
74
+ // });
69
75
  };
70
- const handleActiveTab = (tab, idx) => {
76
+ const handleActiveTab = tab => {
71
77
  setActiveTabId(tab.id);
78
+ if (onActiveTab)
79
+ onActiveTab(tab.id);
72
80
  };
73
81
  const onWheelLeftBlock = event => {
74
82
  try {
@@ -94,12 +102,16 @@ export const EditorTab = props => {
94
102
  return;
95
103
  }
96
104
  setActiveTabId(arrTabs[idx - 1].id);
105
+ if (onActiveTab)
106
+ onActiveTab(arrTabs[idx - 1].id);
97
107
  break;
98
108
  case 'right':
99
109
  if (idx === arrTabs.length - 1) {
100
110
  return;
101
111
  }
102
112
  setActiveTabId(arrTabs[idx + 1].id);
113
+ if (onActiveTab)
114
+ onActiveTab(arrTabs[idx + 1].id);
103
115
  break;
104
116
  default:
105
117
  break;
@@ -115,7 +127,7 @@ export const EditorTab = props => {
115
127
  ? arrTabs.map((tab, idx) => {
116
128
  const { showIcon = true, closeable = true } = tab;
117
129
  // const { showIcon = true, showDropdown = true, closeable = true } = tab;
118
- return (React.createElement("div", { key: tab.id, id: `tab-${tab.id}`, onClick: () => handleActiveTab(tab, idx), className: classnames('tab-item', tabItemClassName, {
130
+ return (React.createElement("div", { key: tab.id, id: `tab-${tab.id}`, onClick: () => handleActiveTab(tab), className: classnames('tab-item', tabItemClassName, {
119
131
  active: tab.id === activeTabId,
120
132
  }) },
121
133
  showIcon &&
package/es/components/molecules/ThumbnailCard/ThumbnailCard.js CHANGED
@@ -19,19 +19,22 @@ var __rest = (this && this.__rest) || function (s, e) {
19
19
  return t;
20
20
  };
21
21
  // Libraries
22
- import Icon from '@antscorp/icons';
23
- import { Modal } from 'antd';
24
22
  import React, { memo } from 'react';
23
+ import { Icon } from '@antscorp/antsomi-ui/es/components/atoms';
24
+ import { Modal } from 'antd';
25
+ import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
25
26
  // Styled
26
27
  import { ThumbnailCardWrapper } from './styled';
27
28
  // Components
28
- import { Button, Flex, Spin, Typography } from '../../atoms';
29
+ import { Button, Flex, Typography, Spin, Tooltip } from '../../atoms';
29
30
  // Constants
30
- import { THUMBNAIL_CARD_DEFAULT_HEIGHT, THUMBNAIL_CARD_DEFAULT_WIDTH } from './constants';
31
+ import { THUMBNAIL_CARD_ACTION_OPTIONS, THUMBNAIL_CARD_DEFAULT_HEIGHT, THUMBNAIL_CARD_DEFAULT_WIDTH, } from './constants';
31
32
  import { getUrlNoCache, checkShowSkeletonBaseUrl } from '@antscorp/antsomi-ui/es/utils';
33
+ import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
32
34
  export const ThumbnailCard = memo(props => {
33
35
  const [modal, contextHolder] = Modal.useModal();
34
- const { id, name, width = THUMBNAIL_CARD_DEFAULT_WIDTH, height = THUMBNAIL_CARD_DEFAULT_HEIGHT, thumbnail, thumbnailFit, removable = true, actionAvailable = true, showSkeleton, loading = false, removeModalProps, editBtnProps, previewBtnProps, thumbnailCacheValue, onClickWrapper } = props, restOfProps = __rest(props, ["id", "name", "width", "height", "thumbnail", "thumbnailFit", "removable", "actionAvailable", "showSkeleton", "loading", "removeModalProps", "editBtnProps", "previewBtnProps", "thumbnailCacheValue", "onClickWrapper"]);
36
+ const { id, name, width = THUMBNAIL_CARD_DEFAULT_WIDTH, height = THUMBNAIL_CARD_DEFAULT_HEIGHT, thumbnail, thumbnailFit, removable = true, actionAvailable = true, showSkeleton, loading = false, removeModalProps, editBtnProps, previewBtnProps, thumbnailCacheValue, actionButtons, onClickWrapper } = props, restOfProps = __rest(props, ["id", "name", "width", "height", "thumbnail", "thumbnailFit", "removable", "actionAvailable", "showSkeleton", "loading", "removeModalProps", "editBtnProps", "previewBtnProps", "thumbnailCacheValue", "actionButtons", "onClickWrapper"]);
37
+ console.log({ actionButtons });
35
38
  const _a = removeModalProps || {}, { onOk } = _a, restOfRemoveTemplateModalProps = __rest(_a, ["onOk"]);
36
39
  const _b = editBtnProps || {}, { text: editText = 'Use template', onClick: onClickEdit } = _b, restOfEditBtnProps = __rest(_b, ["text", "onClick"]);
37
40
  const _c = previewBtnProps || {}, { text: previewText = 'Preview', onClick: onClickPreview } = _c, restOfPreviewBtnProps = __rest(_c, ["text", "onClick"]);
@@ -57,6 +60,33 @@ export const ThumbnailCard = memo(props => {
57
60
  e.stopPropagation();
58
61
  onClickWrapper === null || onClickWrapper === void 0 ? void 0 : onClickWrapper(id);
59
62
  };
63
+ // Handlers
64
+ const renderActionButtons = () => {
65
+ if (!actionButtons)
66
+ return null;
67
+ return Object.keys(actionButtons)
68
+ .map(key => {
69
+ const option = THUMBNAIL_CARD_ACTION_OPTIONS[key];
70
+ const actionSettings = actionButtons[key];
71
+ if (actionSettings) {
72
+ const { buttonProps, key, customRender } = actionSettings;
73
+ const icon = actionSettings.icon || option.icon || '';
74
+ const label = actionSettings.label || option.label || '';
75
+ const ButtonComponent = (React.createElement(Tooltip, { title: label },
76
+ React.createElement(Button, Object.assign({ key: key || option.key, type: "primary", icon: React.createElement(Icon, { type: icon || option.icon, style: { fontSize: 24, color: '#FFFFFF' } }) }, buttonProps))));
77
+ /**
78
+ * Handle custom render for action button
79
+ * If customRender is a function, return the function callback the ButtonComponent
80
+ * If not, return ButtonComponent
81
+ */
82
+ return typeof customRender === 'function'
83
+ ? customRender(ButtonComponent)
84
+ : ButtonComponent;
85
+ }
86
+ return null;
87
+ })
88
+ .filter(Boolean);
89
+ };
60
90
  return (React.createElement(Flex, Object.assign({ gap: 10, vertical: true }, restOfProps, { style: Object.assign({ width }, restOfProps.style) }),
61
91
  React.createElement(ThumbnailCardWrapper, { "$showSkeleton": showSkeletonMemo, style: { height, cursor: actionAvailable ? 'default' : 'pointer' }, onClick: handleWrapperClick },
62
92
  React.createElement("div", { className: "screen" }, thumbnail && (React.createElement("img", { src: getUrlNoCache(thumbnail, thumbnailCacheValue), alt: "", style: { objectFit: thumbnailFit }, onError: e => {
@@ -74,8 +104,10 @@ export const ThumbnailCard = memo(props => {
74
104
  onClickPreview === null || onClickPreview === void 0 ? void 0 : onClickPreview(id);
75
105
  } }, restOfPreviewBtnProps),
76
106
  React.createElement(Typography.Text, { ellipsis: { tooltip: previewText }, style: { maxWidth: '100%', color: 'inherit' } }, previewText))),
77
- removable && (React.createElement("div", { className: "top-right-corner-action animate__animated animate__fadeIn" },
78
- React.createElement(Button, { type: "primary", icon: React.createElement(Icon, { type: "icon-ants-trash-outline", style: { fontSize: 24, color: '#FFFFFF' } }), onClick: handleRemoveThumbnail }))),
107
+ React.createElement("div", { className: "top-right-corner-action animate__animated animate__fadeIn" },
108
+ renderActionButtons(),
109
+ removable && (React.createElement(Tooltip, { title: i18nInstance.t(translations.remove).toString() },
110
+ React.createElement(Button, { type: "primary", icon: React.createElement(Icon, { type: "icon-ants-trash-outline", style: { fontSize: 24, color: '#FFFFFF' } }), onClick: handleRemoveThumbnail })))),
79
111
  React.createElement("div", { className: "backdrop" }),
80
112
  React.createElement("div", null, contextHolder))),
81
113
  loading && React.createElement(Spin, { className: "thumbnail__loading", spinning: true })),
package/es/components/molecules/ThumbnailCard/constants.d.ts CHANGED
@@ -1,3 +1,8 @@
1
1
  export declare const THUMBNAIL_CARD_DEFAULT_WIDTH = 330;
2
2
  export declare const THUMBNAIL_CARD_DEFAULT_HEIGHT = 230;
3
3
  export declare const THUMBNAIL_URL = "https://st-media-template.antsomi.com/base64-img/37563.png";
4
+ export declare const THUMBNAIL_CARD_ACTION_KEYS: {
5
+ readonly EDIT: "EDIT";
6
+ readonly DUPLICATE: "DUPLICATE";
7
+ };
8
+ export declare const THUMBNAIL_CARD_ACTION_OPTIONS: Record<string, any>;
package/es/components/molecules/ThumbnailCard/constants.js CHANGED
@@ -1,3 +1,25 @@
1
+ // Libraries
2
+ import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
3
+ // Constants
4
+ import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
1
5
  export const THUMBNAIL_CARD_DEFAULT_WIDTH = 330;
2
6
  export const THUMBNAIL_CARD_DEFAULT_HEIGHT = 230;
3
7
  export const THUMBNAIL_URL = 'https://st-media-template.antsomi.com/base64-img/37563.png';
8
+ /* CARD ACTION KEYS */
9
+ export const THUMBNAIL_CARD_ACTION_KEYS = {
10
+ EDIT: 'EDIT',
11
+ DUPLICATE: 'DUPLICATE',
12
+ };
13
+ const { EDIT, DUPLICATE } = THUMBNAIL_CARD_ACTION_KEYS;
14
+ export const THUMBNAIL_CARD_ACTION_OPTIONS = {
15
+ [EDIT]: {
16
+ key: EDIT,
17
+ label: i18nInstance.t(translations.edit.title).toString(),
18
+ icon: 'icon-ants-pencil',
19
+ },
20
+ [DUPLICATE]: {
21
+ key: DUPLICATE,
22
+ label: i18nInstance.t(translations.duplicate.title).toString(),
23
+ icon: 'icon-ants-duplicate',
24
+ },
25
+ };
package/es/components/molecules/ThumbnailCard/styled.js CHANGED
@@ -27,11 +27,11 @@ export const ThumbnailCardWrapper = styled.div `
27
27
  }
28
28
 
29
29
  .top-right-corner-action {
30
- display: block;
30
+ display: flex;
31
31
  }
32
32
 
33
33
  .backdrop {
34
- opacity: 0.6 !important;
34
+ opacity: 0.5 !important;
35
35
  }
36
36
  }
37
37
 
@@ -66,6 +66,8 @@ export const ThumbnailCardWrapper = styled.div `
66
66
  top: 16px;
67
67
  right: 16px;
68
68
  display: none;
69
+ align-items: center;
70
+ gap: 12px;
69
71
  z-index: 12;
70
72
 
71
73
  button {
package/es/components/molecules/ThumbnailCard/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { ModalFuncProps, ButtonProps } from 'antd';
2
- import React, { HTMLAttributes } from 'react';
2
+ import React, { HTMLAttributes, ReactNode } from 'react';
3
+ import { THUMBNAIL_CARD_ACTION_KEYS } from './constants';
3
4
  export type TThumbnailCardId = string | number;
4
5
  export type TRemoveModalProps = Omit<ModalFuncProps, 'onOk'> & {
5
6
  onOk?: (id: TThumbnailCardId) => void;
@@ -8,7 +9,7 @@ export type TThumbnailButton = Omit<ButtonProps, 'onClick'> & {
8
9
  text?: string;
9
10
  onClick?: (id: TThumbnailCardId) => void;
10
11
  };
11
- export interface ThumbnailCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'id'> {
12
+ export interface ThumbnailCardProps<TActionKey extends string[] = []> extends Omit<HTMLAttributes<HTMLDivElement>, 'id'> {
12
13
  id: TThumbnailCardId;
13
14
  name?: string;
14
15
  width?: number;
@@ -22,6 +23,14 @@ export interface ThumbnailCardProps extends Omit<HTMLAttributes<HTMLDivElement>,
22
23
  actionAvailable?: boolean;
23
24
  removeModalProps?: TRemoveModalProps;
24
25
  thumbnailFit?: React.CSSProperties['objectFit'];
26
+ actionButtons?: Partial<Record<TActionButtonKey<TActionKey>, {
27
+ buttonProps?: ButtonProps;
28
+ key?: string;
29
+ label?: string;
30
+ icon?: string;
31
+ customRender?: (node: ReactNode) => ReactNode;
32
+ }>>;
25
33
  thumbnailCacheValue?: string | number;
26
34
  onClickWrapper?: (id: TThumbnailCardId) => void;
27
35
  }
36
+ export type TActionButtonKey<T extends string[] = []> = (typeof THUMBNAIL_CARD_ACTION_KEYS)[keyof typeof THUMBNAIL_CARD_ACTION_KEYS] | T[number];
package/es/constants/theme.js CHANGED
@@ -1,4 +1,4 @@
1
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2;
1
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
2
2
  // Types
3
3
  import { theme } from 'antd';
4
4
  // Variables
@@ -89,18 +89,19 @@ THEME.components = {
89
89
  colorBorder: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.blue1,
90
90
  colorText: (_b = THEME.token) === null || _b === void 0 ? void 0 : _b.colorPrimary,
91
91
  colorBgContainerDisabled: (_c = THEME.token) === null || _c === void 0 ? void 0 : _c.bw6,
92
- colorTextDisabled: (_d = THEME.token) === null || _d === void 0 ? void 0 : _d.bw0,
92
+ borderColorDisabled: (_d = THEME.token) === null || _d === void 0 ? void 0 : _d.bw6,
93
+ colorTextDisabled: (_e = THEME.token) === null || _e === void 0 ? void 0 : _e.bw0,
93
94
  textHoverBg: '#F2F9FF',
94
95
  /* Text type */
95
- colorBgTextHover: (_e = THEME.token) === null || _e === void 0 ? void 0 : _e.blue,
96
- colorBgTextActive: (_f = THEME.token) === null || _f === void 0 ? void 0 : _f.blue1_1,
96
+ colorBgTextHover: (_f = THEME.token) === null || _f === void 0 ? void 0 : _f.blue,
97
+ colorBgTextActive: (_g = THEME.token) === null || _g === void 0 ? void 0 : _g.blue1_1,
97
98
  },
98
99
  Input: {
99
100
  controlHeight: 32,
100
- colorBgContainerDisabled: (_g = THEME.token) === null || _g === void 0 ? void 0 : _g.bw2,
101
- colorTextDisabled: (_h = THEME.token) === null || _h === void 0 ? void 0 : _h.bw10,
102
- colorBorder: (_j = THEME.token) === null || _j === void 0 ? void 0 : _j.blue1,
103
- colorTextPlaceholder: (_k = THEME.token) === null || _k === void 0 ? void 0 : _k.bw6,
101
+ colorBgContainerDisabled: (_h = THEME.token) === null || _h === void 0 ? void 0 : _h.bw2,
102
+ colorTextDisabled: (_j = THEME.token) === null || _j === void 0 ? void 0 : _j.bw10,
103
+ colorBorder: (_k = THEME.token) === null || _k === void 0 ? void 0 : _k.blue1,
104
+ colorTextPlaceholder: (_l = THEME.token) === null || _l === void 0 ? void 0 : _l.bw6,
104
105
  borderRadius: 0,
105
106
  borderRadiusLG: 0,
106
107
  borderRadiusSM: 0,
@@ -114,10 +115,10 @@ THEME.components = {
114
115
  borderRadiusOuter: 0,
115
116
  borderRadiusXS: 0,
116
117
  optionActiveBg: '#F2F9FF',
117
- optionSelectedBg: (_l = THEME.token) === null || _l === void 0 ? void 0 : _l.blue1_1,
118
- colorBorder: (_m = THEME.token) === null || _m === void 0 ? void 0 : _m.blue1,
118
+ optionSelectedBg: (_m = THEME.token) === null || _m === void 0 ? void 0 : _m.blue1_1,
119
+ colorBorder: (_o = THEME.token) === null || _o === void 0 ? void 0 : _o.blue1,
119
120
  controlItemBgActive: '#E0EBF7',
120
- colorBgContainerDisabled: (_o = THEME.token) === null || _o === void 0 ? void 0 : _o.bw2,
121
+ colorBgContainerDisabled: (_p = THEME.token) === null || _p === void 0 ? void 0 : _p.bw2,
121
122
  fontSizeIcon: 14,
122
123
  paddingSM: 6,
123
124
  },
@@ -131,9 +132,9 @@ THEME.components = {
131
132
  borderRadiusOuter: 0,
132
133
  controlHeight: 30,
133
134
  borderRadiusXS: 0,
134
- colorBorder: (_p = THEME.token) === null || _p === void 0 ? void 0 : _p.blue1,
135
+ colorBorder: (_q = THEME.token) === null || _q === void 0 ? void 0 : _q.blue1,
135
136
  controlItemBgActive: '#E0EBF7',
136
- colorBgContainerDisabled: (_q = THEME.token) === null || _q === void 0 ? void 0 : _q.bw2,
137
+ colorBgContainerDisabled: (_r = THEME.token) === null || _r === void 0 ? void 0 : _r.bw2,
137
138
  // fontSizeIcon: 14,
138
139
  },
139
140
  DatePicker: {
@@ -142,20 +143,20 @@ THEME.components = {
142
143
  borderRadiusSM: 0,
143
144
  borderRadiusOuter: 0,
144
145
  borderRadiusXS: 0,
145
- colorBorder: (_r = THEME.token) === null || _r === void 0 ? void 0 : _r.blue1,
146
+ colorBorder: (_s = THEME.token) === null || _s === void 0 ? void 0 : _s.blue1,
146
147
  controlItemBgActive: '#E0EBF7',
147
- colorBgContainerDisabled: (_s = THEME.token) === null || _s === void 0 ? void 0 : _s.bw2,
148
+ colorBgContainerDisabled: (_t = THEME.token) === null || _t === void 0 ? void 0 : _t.bw2,
148
149
  fontSizeIcon: 14,
149
150
  controlHeight: 31,
150
151
  },
151
152
  Divider: {
152
153
  marginLG: 15,
153
154
  marginXL: 15,
154
- colorSplit: (_t = THEME.token) === null || _t === void 0 ? void 0 : _t.accent3,
155
+ colorSplit: (_u = THEME.token) === null || _u === void 0 ? void 0 : _u.accent3,
155
156
  },
156
157
  Checkbox: {
157
158
  controlInteractiveSize: 18,
158
- colorBorder: (_u = THEME.token) === null || _u === void 0 ? void 0 : _u.colorPrimary,
159
+ colorBorder: (_v = THEME.token) === null || _v === void 0 ? void 0 : _v.colorPrimary,
159
160
  lineWidth: 2,
160
161
  borderRadiusSM: 5,
161
162
  },
@@ -168,7 +169,7 @@ THEME.components = {
168
169
  paddingMD: 0,
169
170
  },
170
171
  Tabs: {
171
- itemColor: (_v = THEME.token) === null || _v === void 0 ? void 0 : _v.bw8,
172
+ itemColor: (_w = THEME.token) === null || _w === void 0 ? void 0 : _w.bw8,
172
173
  horizontalItemPadding: '17px 30px',
173
174
  horizontalItemGutter: 0,
174
175
  lineWidthBold: 3,
@@ -180,7 +181,7 @@ THEME.components = {
180
181
  lineHeight: 1.143,
181
182
  lineHeightLG: 1.143,
182
183
  lineHeightSM: 1.143,
183
- itemHoverColor: (_w = THEME.token) === null || _w === void 0 ? void 0 : _w.colorPrimary,
184
+ itemHoverColor: (_x = THEME.token) === null || _x === void 0 ? void 0 : _x.colorPrimary,
184
185
  },
185
186
  Collapse: {
186
187
  headerBg: '#FFF',
@@ -188,12 +189,12 @@ THEME.components = {
188
189
  headerPadding: '15px 10px',
189
190
  },
190
191
  Switch: {
191
- colorTextQuaternary: (_x = THEME.token) === null || _x === void 0 ? void 0 : _x.bw0,
192
- colorTextTertiary: (_y = THEME.token) === null || _y === void 0 ? void 0 : _y.bw0,
192
+ colorTextQuaternary: (_y = THEME.token) === null || _y === void 0 ? void 0 : _y.bw0,
193
+ colorTextTertiary: (_z = THEME.token) === null || _z === void 0 ? void 0 : _z.bw0,
193
194
  handleSize: 12,
194
195
  handleSizeSM: 7,
195
196
  trackMinWidth: 30,
196
- handleBg: (_z = THEME.token) === null || _z === void 0 ? void 0 : _z.colorPrimary,
197
+ handleBg: (_0 = THEME.token) === null || _0 === void 0 ? void 0 : _0.colorPrimary,
197
198
  },
198
199
  Popover: {
199
200
  borderRadiusLG: 10,
@@ -205,7 +206,7 @@ THEME.components = {
205
206
  controlItemBgHover: '#F2F9FF',
206
207
  },
207
208
  Tooltip: {
208
- colorBgSpotlight: (_0 = THEME.token) === null || _0 === void 0 ? void 0 : _0.bw8,
209
+ colorBgSpotlight: (_1 = THEME.token) === null || _1 === void 0 ? void 0 : _1.bw8,
209
210
  },
210
211
  Menu: {
211
212
  itemHoverBg: '#F2F9FF',
@@ -214,8 +215,8 @@ THEME.components = {
214
215
  itemMarginBlock: 5,
215
216
  itemBorderRadius: 5,
216
217
  subMenuItemBg: 'transparent',
217
- itemDisabledColor: (_1 = THEME.token) === null || _1 === void 0 ? void 0 : _1.colorTextDisabled,
218
- itemActiveBg: (_2 = THEME.token) === null || _2 === void 0 ? void 0 : _2.blue1_1,
218
+ itemDisabledColor: (_2 = THEME.token) === null || _2 === void 0 ? void 0 : _2.colorTextDisabled,
219
+ itemActiveBg: (_3 = THEME.token) === null || _3 === void 0 ? void 0 : _3.blue1_1,
219
220
  },
220
221
  Form: {},
221
222
  };
package/es/locales/en/translation.json CHANGED
@@ -543,5 +543,6 @@
543
543
  "column": "Column",
544
544
  "explore": "Explore"
545
545
  }
546
- }
546
+ },
547
+ "remove": "Remove"
547
548
  }
package/es/locales/i18n.d.ts CHANGED
@@ -546,6 +546,7 @@ export declare const translationsJson: {
546
546
  explore: string;
547
547
  };
548
548
  };
549
+ remove: string;
549
550
  };
550
551
  };
551
552
  vi: {
@@ -638,6 +639,14 @@ export declare const translationsJson: {
638
639
  explore: string;
639
640
  };
640
641
  };
642
+ edit: {
643
+ title: string;
644
+ description: string;
645
+ };
646
+ duplicate: {
647
+ title: string;
648
+ };
649
+ remove: string;
641
650
  };
642
651
  };
643
652
  };
package/es/locales/translations.d.ts CHANGED
@@ -546,6 +546,7 @@ export declare const convertLanguageJsonToObject: (json: any, objToConvertTo?: C
546
546
  explore: string;
547
547
  };
548
548
  };
549
+ remove: string;
549
550
  }>, current?: string) => void;
550
551
  export declare const t: (id: string, ...rest: any[]) => [string, ...any[]];
551
552
  export declare const getTranslateMessage: (id: string, defaultMessage?: string, value?: Record<string, unknown>) => string;
package/es/locales/vi/translation.json CHANGED
@@ -86,5 +86,13 @@
86
86
  "column": "Cột",
87
87
  "explore": "Khám phá"
88
88
  }
89
- }
89
+ },
90
+ "edit": {
91
+ "title": "Chỉnh sửa",
92
+ "description": ""
93
+ },
94
+ "duplicate": {
95
+ "title": "Sao chép"
96
+ },
97
+ "remove": "Xóa"
90
98
  }
package/es/providers/ConfigProvider/GlobalStyle.js CHANGED
@@ -139,7 +139,7 @@ export const GlobalStyle = () => {
139
139
  color: ${(_h = THEME.token) === null || _h === void 0 ? void 0 : _h.bw6} !important;
140
140
  }
141
141
 
142
- .antsomi-btn-primary:disabled,
142
+ /* .antsomi-btn-primary:disabled, */
143
143
  .antsomi-btn-default:disabled,
144
144
  .antsomi-btn-dashed:disabled,
145
145
  .antsomi-btn-disabled,
package/es/types/variables.d.ts CHANGED
@@ -1,5 +1,22 @@
1
+ import { ButtonProps } from 'antd';
1
2
  import { GET_LIST_TYPE } from '../constants';
3
+ import { ReactNode } from 'react';
2
4
  export type TUnit = 'px' | '%' | any;
3
5
  export type TAlign = 'left' | 'center' | 'right';
4
6
  export type TGetListType = (typeof GET_LIST_TYPE)[keyof typeof GET_LIST_TYPE];
5
7
  export type TBoolean = 1 | 0;
8
+ /**
9
+ * @typedef {Object} TActionButton
10
+ * @property {ButtonProps} [buttonProps] - Optional properties for the button.
11
+ * @property {string} [key] - Optional unique key for the button.
12
+ * @property {string} [label] - Optional label for the button.
13
+ * @property {string} [icon] - Optional icon for the button.
14
+ * @property {function(ReactNode): ReactNode} [customRender] - Optional custom render function for the button's node.
15
+ */
16
+ export type TActionButton = {
17
+ buttonProps?: ButtonProps;
18
+ key?: string;
19
+ label?: string;
20
+ icon?: string;
21
+ customRender?: (node: ReactNode) => ReactNode;
22
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.322",
3
+ "version": "1.3.5-beta.324",
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.24",
63
+ "@antscorp/icons": "^0.27.26",
64
64
  "@antscorp/image-editor": "1.0.2",
65
65
  "@antscorp/processing-notification": "^1.0.3",
66
66
  "@dnd-kit/core": "^6.1.0",