@antscorp/antsomi-ui 2.0.109 → 2.0.110

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

@@ -5,120 +5,120 @@ import { Flex } from '@antscorp/antsomi-ui/es/components/atoms/Flex';
 // Drawer
 import { Drawer } from '../Drawer';
 import { globalToken } from '@antscorp/antsomi-ui/es/constants';
-export const StyledDrawer = styled(Drawer) `
-  &.antsomi-drawer-content {
-    overflow: visible !important;
-
-    .drawer-detail-body {
-      display: flex;
-      width: 100%;
-      padding: 0px;
-      overflow: visible;
-    }
-
-    .close-btn {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      width: 24px;
-      height: 24px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: ${globalToken?.bw8};
-      transition: all 0.3s;
-      z-index: 100;
-      cursor: pointer;
-
-      &:hover {
-        color: #000;
-      }
-    }
-  }
+export const StyledDrawer = styled(Drawer) `
+  &.antsomi-drawer-content {
+    overflow: visible !important;
+
+    .drawer-detail-body {
+      display: flex;
+      width: 100%;
+      padding: 0px;
+      overflow: visible;
+    }
+
+    .close-btn {
+      position: absolute;
+      top: 20px;
+      right: 20px;
+      width: 24px;
+      height: 24px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: ${globalToken?.bw8};
+      transition: all 0.3s;
+      z-index: 100;
+      cursor: pointer;
+
+      &:hover {
+        color: #000;
+      }
+    }
+  }
 `;
-export const Content = styled.div `
-  display: flex;
-  flex-direction: column;
-  position: relative;
-  overflow: auto;
-  flex: 1 1 0%;
+export const Content = styled.div `
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  overflow: auto;
+  flex: 1 1 0%;
 `;
-export const LeftMenu = styled.div `
-  width: 46px;
-  height: 100%;
-  background-color: ${globalToken?.blue1_2};
-  padding: 8px 5px;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
-  flex-shrink: 0;
-  gap: 5px;
+export const LeftMenu = styled.div `
+  width: 46px;
+  height: 100%;
+  background-color: ${globalToken?.blue1_2};
+  padding: 8px 5px;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  flex-shrink: 0;
+  gap: 5px;
 `;
-export const CloseBtn = styled.div `
-  width: 36px;
-  height: 36px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: ${globalToken?.bw8};
-  transition: all 0.3s;
-  cursor: pointer;
-
-  &:hover {
-    color: #000;
-  }
+export const CloseBtn = styled.div `
+  width: 36px;
+  height: 36px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: ${globalToken?.bw8};
+  transition: all 0.3s;
+  cursor: pointer;
+
+  &:hover {
+    color: #000;
+  }
 `;
-export const MenuItem = styled.div `
-  height: 36px;
-  width: 36px;
-  border-radius: ${globalToken?.borderRadiusXL}px;
-  background-color: transparent;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  transition: all 0.2s;
-
-  * {
-    color: ${globalToken?.bw8};
-  }
-
-  i {
-    font-size: 24px;
-    height: 24px;
-    width: 24px;
-  }
-
-  &:hover {
-    background-color: ${globalToken?.bw0};
-
-    * {
-      color: ${globalToken?.colorPrimary};
-    }
-  }
-
-  &.active {
-    background-color: #d3e3fd;
-
-    * {
-      color: ${globalToken?.colorPrimary};
-    }
-  }
+export const MenuItem = styled.div `
+  height: 36px;
+  width: 36px;
+  border-radius: ${globalToken?.borderRadiusXL}px;
+  background-color: transparent;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s;
+
+  * {
+    color: ${globalToken?.bw8};
+  }
+
+  i {
+    font-size: 24px;
+    height: 24px;
+    width: 24px;
+  }
+
+  &:hover {
+    background-color: ${globalToken?.bw0};
+
+    * {
+      color: ${globalToken?.colorPrimary};
+    }
+  }
+
+  &.active {
+    background-color: #d3e3fd;
+
+    * {
+      color: ${globalToken?.colorPrimary};
+    }
+  }
 `;
-export const DrawerHeader = styled(Flex) `
-  position: sticky;
-  top: 0px;
-  height: 50px;
-  padding: 0px 15px;
-  box-sizing: border-box;
-  background-color: ${globalToken?.bw0};
-  flex-shrink: 0;
-  z-index: 20;
-
+export const DrawerHeader = styled(Flex) `
+  position: sticky;
+  top: 0px;
+  height: 50px;
+  padding: 0px 15px;
+  box-sizing: border-box;
+  background-color: ${globalToken?.bw0};
+  flex-shrink: 0;
+  z-index: 20;
+
   ${props => props.height &&
-    `height: ${typeof props.height === 'string' ? props.height : `${props.height}px`};`}
-  ${props => props.showBorderBottom && `border-bottom: 1px solid ${globalToken?.bw3};`}
+    `height: ${typeof props.height === 'string' ? props.height : `${props.height}px`};`}
+  ${props => props.showBorderBottom && `border-bottom: 1px solid ${globalToken?.bw3};`}
 `;
 export const MenuFooter = styled.div ``;

package/es/components/molecules/Dropdown/style.scss

@@ -1,11 +1,11 @@
-.antsomi-input-dropdown-overlay {
-  &.antsomi-dropdown {
-    .antsomi-dropdown-menu {
-      overflow: hidden;
-
-      &:hover {
-        overflow: auto;
-      }
-    }
-  }
-}
+.antsomi-input-dropdown-overlay {
+  &.antsomi-dropdown {
+    .antsomi-dropdown-menu {
+      overflow: hidden;
+
+      &:hover {
+        overflow: auto;
+      }
+    }
+  }
+}

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

@@ -1,32 +1,32 @@
 import styled from 'styled-components';
 import { Dropdown } from 'antd';
 import { THEME, globalToken } from '@antscorp/antsomi-ui/es/constants';
-export const StyledInputDropdownRoot = styled(Dropdown) `
-  color: ${THEME.token?.colorText};
-  min-height: ${THEME.token?.controlHeight}px;
-  border-bottom: 1px solid ${THEME.components?.Input?.colorBorder};
-  cursor: pointer;
-  padding: 0 5px;
-
-  .antsomi-space-item:nth-child(1) {
-    overflow: hidden;
-    flex: 1;
-  }
-
-  .antsomi-space-item:nth-child(2) {
-    display: flex;
-    align-items: center;
-
-    > i {
-      color: ${globalToken?.bw8};
-      font-size: 20px;
-    }
-  }
-
-  &.disabled {
-    cursor: not-allowed;
-    border-color: ${globalToken?.bw4};
-    background-color: ${THEME.components?.Input?.colorBgContainerDisabled};
-    color: ${THEME.components?.Input?.colorTextDisabled};
-  }
+export const StyledInputDropdownRoot = styled(Dropdown) `
+  color: ${THEME.token?.colorText};
+  min-height: ${THEME.token?.controlHeight}px;
+  border-bottom: 1px solid ${THEME.components?.Input?.colorBorder};
+  cursor: pointer;
+  padding: 0 5px;
+
+  .antsomi-space-item:nth-child(1) {
+    overflow: hidden;
+    flex: 1;
+  }
+
+  .antsomi-space-item:nth-child(2) {
+    display: flex;
+    align-items: center;
+
+    > i {
+      color: ${globalToken?.bw8};
+      font-size: 20px;
+    }
+  }
+
+  &.disabled {
+    cursor: not-allowed;
+    border-color: ${globalToken?.bw4};
+    background-color: ${THEME.components?.Input?.colorBgContainerDisabled};
+    color: ${THEME.components?.Input?.colorTextDisabled};
+  }
 `;

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

@@ -2,16 +2,16 @@
 import styled from 'styled-components';
 // Constant
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const EdgeSettingWrapper = styled.div `
-  color: ${THEME.token?.colorIcon} !important;
+export const EdgeSettingWrapper = styled.div `
+  color: ${THEME.token?.colorIcon} !important;
 `;
-export const EdgeSettingHeader = styled.div `
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+export const EdgeSettingHeader = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 `;
-export const EdgeSettingContent = styled.div `
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  margin-top: 8px;
+export const EdgeSettingContent = styled.div `
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  margin-top: 8px;
 `;

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

@@ -1,73 +1,73 @@
 import styled from 'styled-components';
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const InputWrapperStyled = styled.div `
-  display: inline-block;
-  position: relative;
-  background-color: #fff;
-  border-bottom: 1px solid transparent;
-  max-width: 100%;
-  overflow: hidden;
-
-  display: inline-flex;
-  align-items: baseline;
-
-  &:has(input:focus) {
-    border-bottom: 1px solid ${THEME.token?.blue1};
-  }
-  &:has(input[readonly]:focus) {
-    border-bottom: none;
-  }
-
-  input {
-    font-size: 20px !important;
-    font-weight: 700;
-    min-width: 23px !important;
-    height: 30px;
-    transition: none !important;
-    padding: 5px 0 !important;
-    border: none !important;
-    text-overflow: ellipsis;
-  }
-
-  .suffix-icon-error,
-  .suffix-icon {
-    display: flex;
-    align-self: stretch;
-    align-items: center;
-    padding: 0 5px;
-    padding-left: 15px;
-  }
-
-  .suffix-icon {
-    display: none;
-    &:hover {
-      display: flex;
-    }
-  }
-
-  input:hover {
-    background-color: transparent;
-
-    & + .suffix-icon {
-      display: flex;
-    }
-  }
-
-  input:focus + .suffix-icon {
-    display: none;
-  }
-
-  .hidden-span {
-    box-sizing: border-box;
-    visibility: hidden;
-    white-space: pre;
-    position: absolute;
-    top: 0;
-    left: 0;
-    height: 30px;
-    font-family: inherit;
-    font-size: 20px;
-    font-weight: 700;
-    padding: 5px 0; /* Match the padding of the Input component */
-  }
+export const InputWrapperStyled = styled.div `
+  display: inline-block;
+  position: relative;
+  background-color: #fff;
+  border-bottom: 1px solid transparent;
+  max-width: 100%;
+  overflow: hidden;
+
+  display: inline-flex;
+  align-items: baseline;
+
+  &:has(input:focus) {
+    border-bottom: 1px solid ${THEME.token?.blue1};
+  }
+  &:has(input[readonly]:focus) {
+    border-bottom: none;
+  }
+
+  input {
+    font-size: 20px !important;
+    font-weight: 700;
+    min-width: 23px !important;
+    height: 30px;
+    transition: none !important;
+    padding: 5px 0 !important;
+    border: none !important;
+    text-overflow: ellipsis;
+  }
+
+  .suffix-icon-error,
+  .suffix-icon {
+    display: flex;
+    align-self: stretch;
+    align-items: center;
+    padding: 0 5px;
+    padding-left: 15px;
+  }
+
+  .suffix-icon {
+    display: none;
+    &:hover {
+      display: flex;
+    }
+  }
+
+  input:hover {
+    background-color: transparent;
+
+    & + .suffix-icon {
+      display: flex;
+    }
+  }
+
+  input:focus + .suffix-icon {
+    display: none;
+  }
+
+  .hidden-span {
+    box-sizing: border-box;
+    visibility: hidden;
+    white-space: pre;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 30px;
+    font-family: inherit;
+    font-size: 20px;
+    font-weight: 700;
+    padding: 5px 0; /* Match the padding of the Input component */
+  }
 `;

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

@@ -2,36 +2,36 @@ import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 import { Flex, Typography } from 'antd';
 import styled from 'styled-components';
 import { CLS } from './utils';
-export const EditingListRoot = styled(Flex) `
-  height: 100%;
+export const EditingListRoot = styled(Flex) `
+  height: 100%;
 `;
-export const StyledListWrapper = styled.div `
-  flex: 1;
-
-  .${CLS.ListItem.default} {
-    .${CLS.RemoveButton.default} {
-      flex-shrink: 0;
-      display: none;
-    }
-
-    &:hover {
-      .${CLS.RemoveButton.default} {
-        display: block;
-      }
-    }
-  }
+export const StyledListWrapper = styled.div `
+  flex: 1;
+
+  .${CLS.ListItem.default} {
+    .${CLS.RemoveButton.default} {
+      flex-shrink: 0;
+      display: none;
+    }
+
+    &:hover {
+      .${CLS.RemoveButton.default} {
+        display: block;
+      }
+    }
+  }
 `;
-export const StyledAddBtn = styled(Flex) `
-  color: ${globalToken?.colorPrimary};
-  cursor: pointer;
-  font-weight: bold;
-  align-items: center;
-  justify-content: space-between;
-  gap: 4px;
-  width: fit-content;
+export const StyledAddBtn = styled(Flex) `
+  color: ${globalToken?.colorPrimary};
+  cursor: pointer;
+  font-weight: bold;
+  align-items: center;
+  justify-content: space-between;
+  gap: 4px;
+  width: fit-content;
 `;
-export const AmountSelected = styled(Typography.Text) `
-  &.antsomi-typography {
-    font-size: 11px;
-  }
+export const AmountSelected = styled(Typography.Text) `
+  &.antsomi-typography {
+    font-size: 11px;
+  }
 `;

package/es/components/molecules/EditingListV2/components/List/List.js

@@ -9,15 +9,15 @@ import { CloseIcon, WarningIcon } from '@antscorp/antsomi-ui/es/components/icons
 import { CLS } from '../../utils';
 // Constants
 import { globalToken } from '@antscorp/antsomi-ui/es/constants';
-const ListItemStyled = styled(List.Item) `
-  .close-icon {
-    display: none;
-  }
-
-  &:hover .close-icon {
-    display: flex;
-  }
-
+const ListItemStyled = styled(List.Item) `
+  .close-icon {
+    display: none;
+  }
+
+  &:hover .close-icon {
+    display: flex;
+  }
+
 `;
 export const ListItem = (props) => {
     const { isLoading, selectOptions, onClickRemove, removable } = props;