@antscorp/antsomi-ui 1.7.3 → 1.7.5

package/CHANGELOG.md

@@ -0,0 +1,83 @@
+### Changelog
+
+All notable changes to this project will be documented in this file. Dates are displayed in UTC.
+
+Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
+
+#### [v1.7.5](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.7.5..v2.0.22)
+
+- chore: update storybook version [`d13f194`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d13f19462c2fe117934df7fe2e09fd0aa95a0167)
+- feat: update input width when in view [`f27b982`](https://bitbucket.org/git-vn/at.packages.frontend/commits/f27b982a4427c414a1b5d5538641516a3d35aa6e)
+- chore: update datatable components [`d38cf96`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d38cf9687b2a6fd03396247d04c6ef37a6b030f1)
+
+### [v2.0.22](https://bitbucket.org/git-vn/at.packages.frontend/compare/v2.0.22..v1.7.4)
+
+> 19 January 2023
+
+#### [v1.7.4](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.7.4..v1.3.5-beta.446)
+
+> 5 July 2024
+
+- chore: update storybook version [`d13f194`](https://bitbucket.org/git-vn/at.packages.frontend/commits/d13f19462c2fe117934df7fe2e09fd0aa95a0167)
+- feat(MatchesAnySelect): create and handle new MatchesAnySelect component [`a89c46e`](https://bitbucket.org/git-vn/at.packages.frontend/commits/a89c46e00e81d5a28ac37f42166dcab1c49212df)
+- chore: update filter matches any datatable [`4db6dc8`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4db6dc81b62a9168ca9fe1a5e39e414e473e7285)
+
+#### [v1.3.5-beta.446](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.3.5-beta.446..v1.0.10)
+
+> 2 July 2024
+
+- chore(datatable): update useTableListing hook [`262def1`](https://bitbucket.org/git-vn/at.packages.frontend/commits/262def14c8a44ae73d1d9163696afc25e026ba45)
+- chore: update data table component [`7fce77d`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7fce77db8191ff7633679ea9befe28718eb40a88)
+- chore(storybook): add addon-controls [`8ea93fc`](https://bitbucket.org/git-vn/at.packages.frontend/commits/8ea93fc4bb41c50f7a7025bc79d968d849e8d113)
+
+#### [v1.0.10](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.10..v1.0.9)
+
+> 20 June 2024
+
+#### [v1.0.9](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.9..v1.0.8)
+
+> 20 June 2024
+
+#### [v1.0.8](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.8..v1.0.3)
+
+> 20 June 2024
+
+- feat(SelectAccount): add component [`2f1dea0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/2f1dea035af07a01a6be8da47b531d52d2977bbe)
+- fix: update style for calendar selection [`4347b91`](https://bitbucket.org/git-vn/at.packages.frontend/commits/4347b91f5bbe31caeb64478116c1822fe443f359)
+- feat(EditorTab): use modal async in onCloseTab [`76aece8`](https://bitbucket.org/git-vn/at.packages.frontend/commits/76aece8cc7a44385d63019058daa1f8477c8fbcb)
+
+#### [v1.0.3](https://bitbucket.org/git-vn/at.packages.frontend/compare/v1.0.3..v1.0.2)
+
+> 17 January 2023
+
+- update timeline package [`e198927`](https://bitbucket.org/git-vn/at.packages.frontend/commits/e198927d83931f9155e90ab9a1d9d3a5ac2989c4)
+- update-ticket-editor [`38dd7b0`](https://bitbucket.org/git-vn/at.packages.frontend/commits/38dd7b0a7b2b0b58a63e725419e9b057e053f44f)
+- update-upload-file-ticket-editor [`bb2f2ef`](https://bitbucket.org/git-vn/at.packages.frontend/commits/bb2f2ef1c46f4239ad716c897e53856a6368ea7d)
+
+#### v1.0.2
+
+> 4 January 2023
+
+- Sprint10/vinlt/feature/date advanced [`#24`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/24)
+- Sprint10/sangndd/feature/extend value matches any [`#23`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/23)
+- Sprint10/sangndd/feature/extend value matches any [`#22`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/22)
+- [Scatter chart] Max X-axis giá trị bị lặp [`#20`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/20)
+- Sprint8/vinlt/feature/show data label short [`#18`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/18)
+- Fix duplicate axis max value [`#17`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/17)
+- [Antalyser] Một số bug khi nhập axis giá trị thập phân [`#16`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/16)
+- Sprint6/vinlt/fixbug/chart [`#15`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/15)
+- - Axis allows input of decimal values [`#14`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/14)
+- Sprint4/sangndd/feature/icons [`#12`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/12)
+- Sprint4/sangndd/feature/icons [`#11`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/11)
+- Sprint4/thanghn/fixbug/pivot alias border [`#10`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/10)
+- fix scroll dimension and total column [`#9`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/9)
+- [ANTALYSER][Filter][Khi filter filed có type date và semantic là "Month day" thì không load được danh sách các ngày trong tháng] [`#7`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/7)
+- [ANTALYSER][Pivot chart][Tính năng Add border shadow chưa hoạt động] [`#8`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/8)
+- Fix bug [ANTALYSER][Scatter chart][Label ở cột X và Y chưa đổi theo alias name đã change ở metric] [`#6`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/6)
+- Fix bug [Pivot chart] Row color không hiển thị được khi chọn hiển thị data của metric là Bar [`#5`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/5)
+- Fix bug package antscorp/charts [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
+- Fix bug package antscorp/chart [`#2`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/2)
+- table component [`#1`](https://bitbucket.org/git-vn/at.packages.frontend/pull-requests/1)
+- Update map indonesia [`fc94208`](https://bitbucket.org/git-vn/at.packages.frontend/commits/fc9420838b3f4087a5763017e9bf7e72ee8c5e31)
+- Update geomap [`43f3098`](https://bitbucket.org/git-vn/at.packages.frontend/commits/43f3098506f30a215dc2b30734590e5c55f8b490)
+- sync package master [`7476118`](https://bitbucket.org/git-vn/at.packages.frontend/commits/7476118de2fcfa1bd6b0a9e3c0f887b29fd149b6)

package/es/components/atoms/Alert/Alert.d.ts

@@ -1,4 +1,9 @@
-/// <reference types="react" />
-export declare const Alert: import("styled-components").StyledComponent<import("react").FC<import("antd").AlertProps> & {
+import React from 'react';
+import type { AlertProps as AntdAlertProps } from 'antd';
+export declare const AlertStyled: import("styled-components").StyledComponent<React.FC<AntdAlertProps> & {
     ErrorBoundary: typeof import("antd/es/alert/ErrorBoundary").default;
 }, any, {}, never>;
+export interface AlertProps extends AntdAlertProps {
+    variant?: 'default' | 'outline';
+}
+export declare const Alert: React.FC<AlertProps>;

package/es/components/atoms/Alert/Alert.js

@@ -1,19 +1,53 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var _a, _b, _c, _d;
 // Libraries
+import React from 'react';
 import styled from 'styled-components';
 import { Alert as AntdAlert } from 'antd';
 // Constants
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const Alert = styled(AntdAlert) `
-  padding: 10px;
+import { globalToken, THEME } from '@antscorp/antsomi-ui/es/constants';
+import clsx from 'clsx';
+import { WarningIcon } from '@antscorp/antsomi-ui/es/components/icons';
+export const AlertStyled = styled(AntdAlert) `
+  padding: 15px !important;
   font-size: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.fontSize}px;
+  box-sizing: border-box;
+  gap: 15px;
 
-  .antsomi-alert-message {
+  /* .antsomi-alert-message {
     color: ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.colorTextBase} !important;
-  }
+  } */
 
   &.antsomi-alert-info {
     background-color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.bw1};
     border-color: ${(_d = THEME.token) === null || _d === void 0 ? void 0 : _d.bw1};
   }
+
+  &.antsomi-alert-outline {
+    background-color: transparent;
+
+    &.antsomi-alert-warning {
+      border-color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.orange6} !important;
+      svg {
+        margin: 0;
+      }
+    }
+  }
 `;
+export const Alert = props => {
+    const { variant = 'default', className, icon, type } = props, restProps = __rest(props, ["variant", "className", "icon", "type"]);
+    return (React.createElement(AlertStyled, Object.assign({ className: clsx(className, {
+            'antsomi-alert-outline': variant === 'outline',
+            'antsomi-alert-default': variant === 'default',
+        }), icon: variant === 'outline' && !icon && type === 'warning' ? React.createElement(WarningIcon, null) : icon, type: type }, restProps)));
+};

package/es/components/atoms/Flex/index.d.ts

@@ -1 +1,2 @@
-export * from './Flex';
+export { Flex } from './Flex';
+export type { FlexProps } from './Flex';

package/es/components/atoms/Flex/index.js

@@ -1 +1 @@
-export * from './Flex';
+export { Flex } from './Flex';

package/es/components/atoms/Input/Input.js

@@ -96,7 +96,7 @@ OriginInput.defaultProps = {
     withWrapper: true,
 };
 export const Input = OriginInput;
-const SearchInput = props => (React.createElement(Input, Object.assign({ bordered: false, autoFocus: true, suffix: React.createElement(Icon, { type: "icon-ants-search-2", size: 24, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 }) }, props, { className: `${props.className} antsomi-search-input` })));
+const SearchInput = props => (React.createElement(OriginInput, Object.assign({ bordered: false, autoFocus: true, suffix: React.createElement(Icon, { type: "icon-ants-search-2", size: 24, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 }) }, props, { className: `${props.className} antsomi-search-input` })));
 Input.CustomSearch = SearchInput;
 Input.TextArea = StyledInput.TextArea;
 Input.DefaultInput = AntdInput;

package/es/components/atoms/Input/styled.d.ts

@@ -9,3 +9,9 @@ export declare const StyledInput: import("styled-components").StyledComponent<im
 export declare const TextArea: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/input").TextAreaProps & import("react").RefAttributes<import("antd/es/input/TextArea").TextAreaRef>>, any, {
     showBorder?: boolean | undefined;
 }, never>;
+export declare const StyledSearchInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").InputProps & import("react").RefAttributes<import("antd").InputRef>> & {
+    Group: import("react").FC<import("antd/es/input").GroupProps>;
+    Search: import("react").ForwardRefExoticComponent<import("antd/es/input").SearchProps & import("react").RefAttributes<import("antd").InputRef>>;
+    TextArea: import("react").ForwardRefExoticComponent<import("antd/es/input").TextAreaProps & import("react").RefAttributes<import("antd/es/input/TextArea").TextAreaRef>>;
+    Password: import("react").ForwardRefExoticComponent<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef>>;
+}, any, {}, never>;

package/es/components/atoms/Input/styled.js

@@ -107,3 +107,8 @@ export const TextArea = styled(InputAntd.TextArea) `
       border: 1px solid #e0e0e0;
     `}
 `;
+export const StyledSearchInput = styled(InputAntd) `
+  &.antsomi-input-affix-wrapper:hover > input.antsomi-input {
+    background-color: transparent;
+  }
+`;

package/es/components/atoms/Popover/index.d.ts

@@ -1 +1,2 @@
 export { Popover } from './Popover';
+export type { PopoverProps } from 'antd';

package/es/components/atoms/Radio/index.js

@@ -16,6 +16,7 @@ export const Radio = styled(AntdRadio) `
       border-color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.colorPrimary};
 
       &::after {
+        flex-shrink: 0;
         background-color: ${(_d = THEME.token) === null || _d === void 0 ? void 0 : _d.colorPrimary};
       }
     }

package/es/components/atoms/Scrollbars/Scrollbars.js

@@ -12,16 +12,17 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { Scrollbars as CustomScrollbars, } from 'react-custom-scrollbars';
 import { cloneDeep } from 'lodash';
 // Libraries
-import React, { useRef } from 'react';
+import React, { forwardRef, useImperativeHandle, useRef } from 'react';
 // Styled
 import { HorizontalTrack, ThumbBar, VerticalTrack } from './styled';
 const THUMB_SIZE = 4;
 const MARGIN = 3;
-export const Scrollbars = props => {
+export const Scrollbars = forwardRef((props, refProp) => {
     // Props
     const { autoHide = true, autoHeightMax = 0, className } = props, restProps = __rest(props, ["autoHide", "autoHeightMax", "className"]);
     // Refs
     const ref = useRef(null);
+    useImperativeHandle(refProp, () => ref.current, []);
     /**
      * Updates the size and position of the custom scrollbar thumbs based on the provided dimensions and scroll positions.
      *
@@ -57,7 +58,7 @@ export const Scrollbars = props => {
         ref.current.trackHorizontal.style.visibility =
             scrollWidth <= clientWidth ? 'hidden' : 'visible';
     };
-    return (React.createElement(CustomScrollbars, Object.assign({ className: `custom-scrollbars ${className || ''}`, ref: ref, autoHide: autoHide, autoHeightMax: autoHeightMax, renderThumbVertical: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-vertical" }, props)), renderThumbHorizontal: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-horizontal" }, props)), renderTrackVertical: (_a) => {
+    return (React.createElement(CustomScrollbars, Object.assign({ className: `custom-scrollbars ${className || ''}`, autoHide: autoHide, autoHeightMax: autoHeightMax, renderThumbVertical: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-vertical" }, props)), renderThumbHorizontal: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-horizontal" }, props)), renderTrackVertical: (_a) => {
             var { style } = _a, restOfProps = __rest(_a, ["style"]);
             return (React.createElement(VerticalTrack, Object.assign({ className: "scrollbar-track" }, restOfProps, { style: Object.assign(Object.assign({}, style), { display: 'block' }) })));
         }, renderTrackHorizontal: (_a) => {
@@ -77,5 +78,5 @@ export const Scrollbars = props => {
             // }
             // Return a div element with the adjusted styles and original props, applying a custom class for styling
             return React.createElement("div", Object.assign({ className: "scrollbar-view" }, props, { style: newStyle }));
-        }, onUpdate: onUpdate, hideTracksWhenNotNeeded: true }, restProps)));
-};
+        }, onUpdate: onUpdate, hideTracksWhenNotNeeded: true }, restProps, { ref: ref })));
+});

package/es/components/atoms/Steps/styled.js

@@ -11,6 +11,7 @@ export const SelectedIcon = styled.div `
   border: 1px solid #b8cfe6;
   border-radius: 100%;
   font-size: 14px;
+  line-height: 23px;
   color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary};
   box-sizing: border-box;
   width: 100%;
@@ -49,6 +50,8 @@ export const StepsWrapper = styled(Steps) `
               width: 100%;
               height: 100%;
               display: flex;
+              line-height: 23px;
+              top: 0px;
               justify-content: center;
               align-items: center;
             }

package/es/components/atoms/index.d.ts

@@ -21,7 +21,6 @@ export { Steps } from './Steps';
 export { Empty } from './Empty';
 export { Icon } from './Icon';
 export { Text } from './Text';
-export { Popover } from './Popover';
 export { RequiredLabel } from './RequiredLabel';
 export { Slider } from './Slider';
 export { Spin } from './Spin';
@@ -41,6 +40,7 @@ export * from './Scrollbars';
 export * from './Switch';
 export * from './Button';
 export * from './RateV2';
+export * from './Popover';
 export type { SliderProps } from './Slider';
 export type { PaginationProps } from './Pagination';
 export type { InputDynamicProps } from './InputDynamic';

package/es/components/atoms/index.js

@@ -21,7 +21,6 @@ export { Steps } from './Steps';
 export { Empty } from './Empty';
 export { Icon } from './Icon';
 export { Text } from './Text';
-export { Popover } from './Popover';
 export { RequiredLabel } from './RequiredLabel';
 export { Slider } from './Slider';
 export { Spin } from './Spin';
@@ -41,3 +40,4 @@ export * from './Scrollbars';
 export * from './Switch';
 export * from './Button';
 export * from './RateV2';
+export * from './Popover';

package/es/components/icons/DataIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './type';
+export declare const DataIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/DataIcon.js

@@ -0,0 +1,18 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+// Libraries
+import React, { forwardRef } from 'react';
+export const DataIcon = forwardRef((props, ref) => {
+    const restProps = __rest(props, []);
+    return (React.createElement("svg", Object.assign({ ref: ref, width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, restProps),
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.002 6.5C19.002 7.88071 15.6499 9 11.515 9C7.38 9 4.02795 7.88071 4.02795 6.5C4.02795 5.11929 7.38 4 11.515 4C15.6499 4 19.002 5.11929 19.002 6.5ZM18.974 12.131C18.974 13.42 15.622 14.465 11.487 14.465C7.352 14.465 4 13.419 4 12.131V8.46204C4 9.75104 7.352 10.795 11.487 10.795C15.622 10.795 18.974 9.74904 18.974 8.46204V12.131ZM18.974 17.8423C18.974 19.1313 15.622 20.1763 11.487 20.1763C7.352 20.1763 4 19.1303 4 17.8423V14.1733C4 15.4623 7.352 16.5063 11.487 16.5063C15.622 16.5063 18.974 15.4603 18.974 14.1733V17.8423Z", fill: "currentColor" })));
+});

package/es/components/icons/EventIcon.js

@@ -14,5 +14,5 @@ export const EventIcon = (_a) => {
     var props = __rest(_a, []);
     return (React.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "currentColor" }, props),
         React.createElement("path", { d: "M0 0h24v24H0V0z", fill: "none" }),
-        React.createElement("path", { d: "M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V10h14v10zm0-12H5V6h14v2zm-7 5h5v5h-5z" })));
+        React.createElement("path", { d: "M16 13h-3c-.55 0-1 .45-1 1v3c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-3c0-.55-.45-1-1-1zm0-10v1H8V3c0-.55-.45-1-1-1s-1 .45-1 1v1H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-1V3c0-.55-.45-1-1-1s-1 .45-1 1zm2 17H6c-.55 0-1-.45-1-1V9h14v10c0 .55-.45 1-1 1z" })));
 };

package/es/components/icons/TableIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './type';
+export declare const TableIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/TableIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const TableIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({}, props, { ref: ref, width: width, height: height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }),
+        React.createElement("path", { d: "M3 14.0156V9.98438H6.98438V14.0156H3ZM3 18.9844V15H6.98438V18.9844H3ZM3 9V5.01562H6.98438V9H3ZM8.01562 14.0156V9.98438H21V14.0156H8.01562ZM8.01562 18.9844V15H21V18.9844H8.01562ZM8.01562 5.01562H21V9H8.01562V5.01562Z", fill: "currentColor" })));
+});

package/es/components/icons/hooks/useIcon.d.ts

@@ -0,0 +1,5 @@
+import { IconProps } from '../type';
+export declare const useIcon: (props: IconProps) => {
+    width: string | number | undefined;
+    height: string | number | undefined;
+};

package/es/components/icons/hooks/useIcon.js

@@ -0,0 +1,9 @@
+import { useMemo } from 'react';
+export const useIcon = (props) => {
+    const { size = 24 } = props;
+    const [width, height] = useMemo(() => [size || (props === null || props === void 0 ? void 0 : props.width), size || (props === null || props === void 0 ? void 0 : props.height)], [size, props.width, props.height]);
+    return {
+        width,
+        height,
+    };
+};

package/es/components/icons/index.d.ts

@@ -54,3 +54,5 @@ export { Interactive } from './Interactive';
 export { Web } from './Web';
 export { LocalMallIcon } from './LocalMallIcon';
 export { LoadingIcon } from './LoadingIcon';
+export { TableIcon } from './TableIcon';
+export { DataIcon } from './DataIcon';

package/es/components/icons/index.js

@@ -54,3 +54,5 @@ export { Interactive } from './Interactive';
 export { Web } from './Web';
 export { LocalMallIcon } from './LocalMallIcon';
 export { LoadingIcon } from './LoadingIcon';
+export { TableIcon } from './TableIcon';
+export { DataIcon } from './DataIcon';

package/es/components/icons/type.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
 export interface IconProps extends React.ComponentPropsWithoutRef<'svg'> {
+    size?: number;
 }

package/es/components/molecules/AccountSelection/AccountListing.d.ts

@@ -4,6 +4,7 @@ export interface AccountListingProps {
     className?: string;
     apiConfig: {
         domain: string;
+        permissionDomain?: string;
         token: string;
         userId: number;
         portalId?: number;

package/es/components/molecules/AccountSelection/hooks/useAccountSelection.d.ts

@@ -7,6 +7,7 @@ interface AccountData {
 }
 export declare const useAccountSelection: (apiConfig: {
     domain: string;
+    permissionDomain?: string;
     token: string;
     userId: number;
     portalId?: number;

package/es/components/molecules/AccountSelection/hooks/useAccountSelection.js

@@ -13,7 +13,7 @@ const isUsePermissionAccount = (appCode) => {
     return false;
 };
 export const useAccountSelection = (apiConfig) => {
-    const { domain, token, userId, appCode, menuCode } = apiConfig;
+    const { permissionDomain, token, userId, appCode, menuCode } = apiConfig;
     const { data } = useGetAccountList({
         apiConfig,
         options: {
@@ -26,13 +26,13 @@ export const useAccountSelection = (apiConfig) => {
             _user_id: userId,
             _app_code: appCode || '',
             _token: token,
-            domain,
+            domain: permissionDomain || '',
             appCode: appCode || '',
             fullParent: true,
             menuCode: menuCode || appCode || '',
         },
         options: {
-            enabled: isUsePermissionAccount(appCode || '') && !!token && !!userId,
+            enabled: isUsePermissionAccount(appCode || '') && !!token && !!userId && !!permissionDomain,
         },
     });
     const { data: recentData } = useGetRecentAccount({

package/es/components/molecules/AccountSelection/styled.js

@@ -1,5 +1,5 @@
 var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
+import { globalToken, THEME } from '@antscorp/antsomi-ui/es/constants';
 import styled from 'styled-components';
 export const AccountSelectionStyled = styled.div `
   background-color: white;
@@ -13,6 +13,12 @@ export const AccountSelectionStyled = styled.div `
     padding: 8px 10px;
     height: 40px;
     box-sizing: border-box;
+    border-color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};
+    &:hover,
+    &:focus,
+    &:focus-within {
+      border-color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};
+    }
   }
 
   .recent-text {

package/es/components/molecules/ApplyPopupContent/ApplyPopupContent.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ButtonProps, FlexProps } from '@antscorp/antsomi-ui/es/components/atoms';
+export interface ApplyPopupContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** The title of the popup content */
+    title?: string;
+    /** Properties for the cancel button. */
+    cancelButtonProps?: ButtonProps;
+    /** Properties for the apply button. */
+    applyButtonProps?: ButtonProps;
+    /** Properties for the footer Flex container, excluding children. */
+    footerProps?: Omit<FlexProps, 'children'>;
+    /** Handler for the cancel button click event. */
+    onCancel?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    /** Handler for the apply button click event. */
+    onApply?: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+}
+export declare const ApplyPopupContent: React.FC<React.PropsWithChildren<ApplyPopupContentProps>>;

package/es/components/{organism/DataTable/components/common/ApplyPopupContent/index.js → molecules/ApplyPopupContent/ApplyPopupContent.js}

@@ -11,6 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 // Libraries
 import React from 'react';
+import clsx from 'clsx';
 // Components
 import { Flex, Typography, Icon, Button, } from '@antscorp/antsomi-ui/es/components/atoms';
 // Styled
@@ -21,7 +22,8 @@ import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
 import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
 const { Text } = Typography;
 export const ApplyPopupContent = props => {
-    const { title, children, cancelButtonProps, applyButtonProps, onApply, onCancel } = props, restProps = __rest(props, ["title", "children", "cancelButtonProps", "applyButtonProps", "onApply", "onCancel"]);
+    const { title, children, cancelButtonProps, applyButtonProps, footerProps, onApply, onCancel } = props, restProps = __rest(props, ["title", "children", "cancelButtonProps", "applyButtonProps", "footerProps", "onApply", "onCancel"]);
+    const { align = 'center', justify = 'flex-end' } = footerProps || {};
     const { t } = i18nInstance;
     return (React.createElement(ContentWrapper, Object.assign({}, restProps),
         React.createElement(Flex, { className: "content__body", vertical: true, gap: 20 },
@@ -30,7 +32,7 @@ export const ApplyPopupContent = props => {
                 React.createElement(CloseButton, { align: "center", justify: "center", onClick: onCancel },
                     React.createElement(Icon, { type: "icon-ants-remove-slim" }))),
             children),
-        React.createElement("div", { className: "content__footer" },
+        React.createElement(Flex, Object.assign({}, footerProps, { align: align, justify: justify, className: clsx('content__footer', footerProps === null || footerProps === void 0 ? void 0 : footerProps.className) }),
             React.createElement(Button, Object.assign({ onClick: onCancel }, cancelButtonProps), t(translations.cancel.title).toString()),
             React.createElement(Button, Object.assign({ type: "primary", onClick: onApply }, applyButtonProps), t(translations.apply.title).toString()))));
 };

package/es/components/molecules/ApplyPopupContent/index.d.ts

@@ -0,0 +1,2 @@
+export { ApplyPopupContent } from './ApplyPopupContent';
+export type { ApplyPopupContentProps } from './ApplyPopupContent';

package/es/components/molecules/ApplyPopupContent/index.js

@@ -0,0 +1 @@
+export { ApplyPopupContent } from './ApplyPopupContent';

package/es/components/{organism/DataTable/components/common → molecules}/ApplyPopupContent/styled.js

@@ -17,8 +17,6 @@ export const ContentWrapper = styled.div `
 
     &__footer {
       display: flex;
-      align-items: center;
-      justify-content: flex-end;
       padding: 15px;
       gap: 10px;
       border-top: 1px solid ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};

package/es/components/molecules/CalendarSelection/styled.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const StyledPopover: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").PopoverProps & import("react").RefAttributes<unknown>> & {
+export declare const StyledPopover: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/popover").PopoverProps & import("react").RefAttributes<unknown>> & {
     _InternalPanelDoNotUseOrYouWillBeFired: import("react").FC<import("antd/es/popover/PurePanel").PurePanelProps>;
 }, any, {}, never>;
 export declare const StyledPopoverContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/components/molecules/CalendarSelection/styled.js

@@ -1,5 +1,7 @@
-import { Popover } from '@antscorp/antsomi-ui/es/components/atoms';
+// Libraries
 import styled from 'styled-components';
+// Components
+import { Popover } from '@antscorp/antsomi-ui/es/components/atoms/Popover';
 export const StyledPopover = styled(Popover) `
   font-size: 12px;
 `;

package/es/components/molecules/DatePicker/DatePicker.js

@@ -1,8 +1,14 @@
 // Libraries
+import React from 'react';
 import { DatePicker as AntdDatePicker } from 'antd';
 // Components
 import { AdvancedPicker } from './components/AdvancedPicker';
 import { AdvancedRangePicker } from './components/AdvancedRangePicker';
+import { EventIcon } from '../../icons';
+import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 export const DatePicker = AntdDatePicker;
+DatePicker.defaultProps = {
+    suffixIcon: React.createElement(EventIcon, { width: 20, height: 20, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 }),
+};
 DatePicker.AdvancedPicker = AdvancedPicker;
 DatePicker.AdvancedRangePicker = AdvancedRangePicker;

package/es/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.d.ts

@@ -15,6 +15,7 @@ export interface AdvancedPickerProps {
     format?: string;
     formatInputDisplay?: string;
     inputStyle?: React.CSSProperties;
+    popupStyle?: React.CSSProperties;
     disableAfterDate?: string;
     disableBeforeDate?: string;
     errorMessage?: string;

package/es/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.js

@@ -1,3 +1,4 @@
+var _a, _b;
 /* eslint-disable react/no-unused-prop-types */
 // Libraries
 import React, { useEffect, useMemo, useCallback, useState } from 'react';
@@ -29,7 +30,7 @@ const { Text } = Typography;
 export const AdvancedPicker = props => {
     var _a, _b;
     // Props
-    const { label, inputStyle, dateTypeKeysShow, calculationTypeKeysShow, showCalculationTypeCondition, defaultDateTypeKey, valueType, option: propsOption, operatorKey, type, date: propsDate, format, formatInputDisplay, errorMessage, disableAfterDate, disableBeforeDate, showTime, disabled, timezone, isViewMode, onUpdatedNewDate, onApply, } = props;
+    const { label, inputStyle, popupStyle, dateTypeKeysShow, calculationTypeKeysShow, showCalculationTypeCondition, defaultDateTypeKey, valueType, option: propsOption, operatorKey, type, date: propsDate, format, formatInputDisplay, errorMessage, disableAfterDate, disableBeforeDate, showTime, disabled, timezone, isViewMode, onUpdatedNewDate, onApply, } = props;
     // Memo
     const newDateTypes = useMemo(() => {
         if (dateTypeKeysShow && dateTypeKeysShow.length) {
@@ -386,7 +387,7 @@ export const AdvancedPicker = props => {
         !!label && typeof label === 'string' ? (React.createElement(Text, { style: { color: '#666666' } }, label)) : (label),
         option.dateType.value === 'fixed' &&
             !['WEEK', 'DAY_OF_WEEK', 'MONTH_DAY', 'DAY'].includes(valueType) ? (React.createElement(Tooltip, { title: selectedDateTitle },
-            React.createElement(DatePicker, { disabled: disabled, open: !disabled && isOpen, allowClear: false, inputReadOnly: true, style: Object.assign({ textOverflow: 'ellipsis' }, inputStyle), status: errorMessage ? 'error' : '', inputRender: () => (React.createElement(DatePickerCustomInput, { readOnly: true, placeholder: "Select Date", value: selectedDateTitle, onClick: () => toggleOpenDropdown() })), value: currDate, 
+            React.createElement(DatePicker, { disabled: disabled, open: !disabled && isOpen, popupStyle: popupStyle, allowClear: false, inputReadOnly: true, style: Object.assign({ textOverflow: 'ellipsis' }, inputStyle), status: errorMessage ? 'error' : '', inputRender: () => (React.createElement(DatePickerCustomInput, { readOnly: true, placeholder: "Select Date", value: selectedDateTitle, onClick: () => toggleOpenDropdown() })), value: currDate, 
                 // style={{
                 //   width: 120,
                 // }}
@@ -433,6 +434,7 @@ export const AdvancedPicker = props => {
 AdvancedPicker.defaultProps = {
     label: '',
     type: ADVANCED_PICKER_TYPE.START_DATE.value,
+    popupStyle: { borderRadius: (_b = (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.borderRadiusLG) !== null && _b !== void 0 ? _b : 10 },
     operatorKey: 'after',
     dateTypeKeysShow: [],
     date: dayjs().format(DEFAULT_DATE_FORMAT),

package/es/components/molecules/DatePicker/components/AdvancedRangePicker/AdvancedRangePicker.d.ts

@@ -19,6 +19,7 @@ export interface AdvancedRangePickerProps {
     timezone?: string;
     separator?: ReactNode;
     inputStyle?: React.CSSProperties;
+    popupStyle?: React.CSSProperties;
     isViewMode?: boolean;
     onChange?: ({ timeRange, mode }: TOnChangePayload) => void;
 }