@antscorp/antsomi-ui 1.3.7-beta.7 → 1.3.7-beta.70

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

@@ -2,38 +2,38 @@ import { THEME } from '@antscorp/antsomi-ui/es/constants';
 import { Button } from 'antd';
 import styled from 'styled-components';
 import { CLS } from './utils';
-export const StyledListFont = styled.ul `
-  &.${CLS.PopoverList} {
-    margin: 0;
-    padding: 0;
-    list-style-type: none;
-  }
+export const StyledListFont = styled.ul `
+  &.${CLS.PopoverList} {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+  }
 `;
-export const StyledListItemFont = styled.li `
-  &.${CLS.PopoverListItem} {
-    padding: 6px 10px;
-    cursor: pointer;
-    text-align: center;
-
-    &:hover,
-    &:focus,
-    &:focus-visible,
-    &.${CLS.PopoverListItemSelected} {
-      outline: none;
-      background-color: ${THEME.components?.Menu?.itemHoverBg};
-    }
-  }
+export const StyledListItemFont = styled.li `
+  &.${CLS.PopoverListItem} {
+    padding: 6px 10px;
+    cursor: pointer;
+    text-align: center;
+
+    &:hover,
+    &:focus,
+    &:focus-visible,
+    &.${CLS.PopoverListItemSelected} {
+      outline: none;
+      background-color: ${THEME.components?.Menu?.itemHoverBg};
+    }
+  }
 `;
-export const InputRoot = styled.div `
-  display: flex;
-  align-items: center;
-  width: fit-content;
+export const InputRoot = styled.div `
+  display: flex;
+  align-items: center;
+  width: fit-content;
 `;
-export const ControlButton = styled(Button) `
-  &.antsomi-btn {
-    width: 24px;
-    height: 24px;
-    border-radius: 4px;
-    padding: 0px;
-  }
+export const ControlButton = styled(Button) `
+  &.antsomi-btn {
+    width: 24px;
+    height: 24px;
+    border-radius: 4px;
+    padding: 0px;
+  }
 `;

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

@@ -1,59 +1,59 @@
 import styled from 'styled-components';
-export const GradientSettingWrapper = styled.div `
-  .setting-container {
-    margin-top: 15px;
-
-    & .antsomi-select {
-      width: 112px;
-    }
-  }
-
-  & > button {
-    margin-top: 15px;
-  }
-
-  .color-setting__controller {
-    & > i {
-      align-self: flex-end;
-      margin-bottom: 10px;
-      font-size: 16px;
-      color: var(--primary-color);
-      cursor: pointer;
-    }
-
-    display: flex;
-    gap: 10px;
-
-    width: 100%;
-    margin-top: 15px;
-
-    /* Slider css selector */
-    & > div:first-child ~ div {
-      flex: 1;
-    }
-
-    /* Color picker select */
-    & > div:first-child {
-      flex-direction: column;
-      align-items: flex-start;
-
-      & .color-picker__label {
-        color: var(--text-base-color) !important;
-      }
-
-      & .antsomi-color-picker,
-      & .antsomi-popover-button {
-        margin: 0 !important;
-      }
-
-      & .antsomi-color-picker {
-        align-items: center;
-        gap: 10px;
-
-        input {
-          padding: 5px 6px;
-        }
-      }
-    }
-  }
+export const GradientSettingWrapper = styled.div `
+  .setting-container {
+    margin-top: 15px;
+
+    & .antsomi-select {
+      width: 112px;
+    }
+  }
+
+  & > button {
+    margin-top: 15px;
+  }
+
+  .color-setting__controller {
+    & > i {
+      align-self: flex-end;
+      margin-bottom: 10px;
+      font-size: 16px;
+      color: var(--primary-color);
+      cursor: pointer;
+    }
+
+    display: flex;
+    gap: 10px;
+
+    width: 100%;
+    margin-top: 15px;
+
+    /* Slider css selector */
+    & > div:first-child ~ div {
+      flex: 1;
+    }
+
+    /* Color picker select */
+    & > div:first-child {
+      flex-direction: column;
+      align-items: flex-start;
+
+      & .color-picker__label {
+        color: var(--text-base-color) !important;
+      }
+
+      & .antsomi-color-picker,
+      & .antsomi-popover-button {
+        margin: 0 !important;
+      }
+
+      & .antsomi-color-picker {
+        align-items: center;
+        gap: 10px;
+
+        input {
+          padding: 5px 6px;
+        }
+      }
+    }
+  }
 `;

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

@@ -26,7 +26,7 @@ export interface HeaderV2Props {
     notificationConfig?: {
         show?: boolean;
     };
-    accountSharingConfig: Pick<AccountSharingProps, 'isShowSharing' | 'isShareAccountAccess' | 'u_ogs' | 'appCode' | 'callbackLogout' | 'callbackGetInfoAccount'> & {
+    accountSharingConfig: Pick<AccountSharingProps, 'isShowSharing' | 'isShareAccountAccess' | 'u_ogs' | 'appCode' | 'callbackLogout' | 'callbackGetInfoAccount' | 'portalRedirectUrl'> & {
         show?: boolean;
     };
     useURLParam?: boolean;

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

@@ -2,75 +2,75 @@
 import styled from 'styled-components';
 // Constants
 import { THEME, globalToken } from '@antscorp/antsomi-ui/es/constants';
-export const LogoWrapper = styled.div `
-  height: 30px;
-  width: 30px;
-  cursor: pointer;
-
-  img {
-    height: 100%;
-    width: 100%;
-  }
+export const LogoWrapper = styled.div `
+  height: 30px;
+  width: 30px;
+  cursor: pointer;
+
+  img {
+    height: 100%;
+    width: 100%;
+  }
 `;
-export const HeaderV2Styled = styled.div `
-  height: ${THEME.token?.headerHeight};
-  background-color: #f6f8fc;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 10px 20px;
-  box-sizing: border-box;
-
-  ${props => !props.$show && 'display: none;'}
-
-  .left-side,
-  .right-side {
-    display: flex;
-    align-items: center;
-    gap: 15px;
-  }
-
-  .left-side {
-    flex: 1;
-    overflow: hidden;
-
-    .logo-wrapper {
-      flex-shrink: 0;
-    }
-
-    .title-container {
-      flex: 1;
-      min-width: 0;
-      /* &:has(.header-breadcrumbs) {
-        height: 37px;
-      } */
-      input.antsomi-input {
-        height: 23px;
-      }
-    }
-  }
-
-  .header-breadcrumbs,
-  .header-breadcrumbs__item {
-    font-size: 12px;
-    line-height: 14px;
-    font-weight: bold;
-    color: ${THEME.token?.bw7};
-    user-select: none;
-  }
-
-  .header-breadcrumbs__item {
-    cursor: pointer;
-    &:hover {
-      color: ${THEME.token?.colorText};
-    }
-  }
-
-  .page-title {
-    font-size: 20px;
-    line-height: 23px;
-    height: 23px;
-    font-weight: bold;
-    color: ${globalToken?.colorTextBase};
-  }
+export const HeaderV2Styled = styled.div `
+  height: ${THEME.token?.headerHeight};
+  background-color: #f6f8fc;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 20px;
+  box-sizing: border-box;
+
+  ${props => !props.$show && 'display: none;'}
+
+  .left-side,
+  .right-side {
+    display: flex;
+    align-items: center;
+    gap: 15px;
+  }
+
+  .left-side {
+    flex: 1;
+    overflow: hidden;
+
+    .logo-wrapper {
+      flex-shrink: 0;
+    }
+
+    .title-container {
+      flex: 1;
+      min-width: 0;
+      /* &:has(.header-breadcrumbs) {
+        height: 37px;
+      } */
+      input.antsomi-input {
+        height: 23px;
+      }
+    }
+  }
+
+  .header-breadcrumbs,
+  .header-breadcrumbs__item {
+    font-size: 12px;
+    line-height: 14px;
+    font-weight: bold;
+    color: ${THEME.token?.bw7};
+    user-select: none;
+  }
+
+  .header-breadcrumbs__item {
+    cursor: pointer;
+    &:hover {
+      color: ${THEME.token?.colorText};
+    }
+  }
+
+  .page-title {
+    font-size: 20px;
+    line-height: 23px;
+    height: 23px;
+    font-weight: bold;
+    color: ${globalToken?.colorTextBase};
+  }
 `;

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

@@ -3,77 +3,77 @@ import styled from 'styled-components';
 import { Button } from '@antscorp/antsomi-ui/es/components/atoms/Button';
 // Constants
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const IconSelectionWrapper = styled.div `
-  width: 100%;
-  padding: 5px;
-  aspect-ratio: 1.74;
-  border: 1px solid #f0f0f0;
-  box-sizing: border-box;
-
-  .transparent-wrapper {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: 100%;
-    gap: 15px;
-    aspect-ratio: 1.74;
-    background: url('data:image/svg+xml;base64, PHN2ZyBoZWlnaHQ9IjEwIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iMTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMCAyNTZoMjU2djI1NkgweiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMjUiIGQ9Ik0yNTYgMjU2aDI1NnYyNTZIMjU2eiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMjU2IDBoMjU2djI1NkgyNTZ6Ij48L3BhdGg+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTAgMGgyNTZ2MjU2SDB6Ij48L3BhdGg+PC9zdmc+')
-      repeat rgb(249, 251, 255);
-  }
+export const IconSelectionWrapper = styled.div `
+  width: 100%;
+  padding: 5px;
+  aspect-ratio: 1.74;
+  border: 1px solid #f0f0f0;
+  box-sizing: border-box;
+
+  .transparent-wrapper {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    gap: 15px;
+    aspect-ratio: 1.74;
+    background: url('data:image/svg+xml;base64, PHN2ZyBoZWlnaHQ9IjEwIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iMTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMCAyNTZoMjU2djI1NkgweiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMjUiIGQ9Ik0yNTYgMjU2aDI1NnYyNTZIMjU2eiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMjU2IDBoMjU2djI1NkgyNTZ6Ij48L3BhdGg+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTAgMGgyNTZ2MjU2SDB6Ij48L3BhdGg+PC9zdmc+')
+      repeat rgb(249, 251, 255);
+  }
 `;
-export const WrapperListRender = styled.div `
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: 100px;
-  height: auto;
-  text-align: center;
-
-  &:hover .ants-hover {
-    border-width: 2px;
-  }
-
-  &.ants-group:hover .group-hover {
-    opacity: 1;
-  }
+export const WrapperListRender = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100px;
+  height: auto;
+  text-align: center;
+
+  &:hover .ants-hover {
+    border-width: 2px;
+  }
+
+  &.ants-group:hover .group-hover {
+    opacity: 1;
+  }
 `;
-export const WrapperListItemRender = styled.div `
-  position: relative;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100px;
-  height: 100px;
-  border-width: 1px;
-  --tw-border-opacity: 1;
-  border-color: rgb(224 224 224 / var(--tw-border-opacity));
-  border-style: solid;
-  box-sizing: border-box;
+export const WrapperListItemRender = styled.div `
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100px;
+  height: 100px;
+  border-width: 1px;
+  --tw-border-opacity: 1;
+  border-color: rgb(224 224 224 / var(--tw-border-opacity));
+  border-style: solid;
+  box-sizing: border-box;
 `;
-export const CustomButton = styled(Button) `
-  position: absolute !important;
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
-  z-index: 3;
-  opacity: 0;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-duration: 200ms;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+export const CustomButton = styled(Button) `
+  position: absolute !important;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  z-index: 3;
+  opacity: 0;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
+    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-duration: 200ms;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 `;
-export const Overlay = styled.div `
-  position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
-  z-index: 2;
-  background-color: ${THEME.token?.bgLightTransparent};
-  opacity: 0;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 200ms;
+export const Overlay = styled.div `
+  position: absolute;
+  top: 0px;
+  right: 0px;
+  bottom: 0px;
+  left: 0px;
+  z-index: 2;
+  background-color: ${THEME.token?.bgLightTransparent};
+  opacity: 0;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
+    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 200ms;
 `;

package/es/components/molecules/ImageEditor/components/ModalShortcut.js

@@ -3,27 +3,27 @@ import { ModalV2 } from '../../ModalV2';
 import { Flex } from 'antd';
 import { Text } from '../../../atoms';
 import styled from 'styled-components';
-const RowStyled = styled(Flex) `
-  border-bottom: 1px solid #ccc;
-  padding: 6px 0;
-
-  &:last-child {
-    border-bottom: none;
-  }
-
-  .row-text {
-    font-size: 14px;
-  }
-  .header {
-    font-weight: bold;
-  }
-  .shortcut {
-    border: 1px solid #ccc;
-    padding: 4px 0;
-    width: 120px;
-    text-align: center;
-    border-radius: 4px;
-  }
+const RowStyled = styled(Flex) `
+  border-bottom: 1px solid #ccc;
+  padding: 6px 0;
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  .row-text {
+    font-size: 14px;
+  }
+  .header {
+    font-weight: bold;
+  }
+  .shortcut {
+    border: 1px solid #ccc;
+    padding: 4px 0;
+    width: 120px;
+    text-align: center;
+    border-radius: 4px;
+  }
 `;
 const SHORTCUT_LIST = [
     { command: 'Delete', shortcut: 'Delete/Del' },

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

@@ -6,9 +6,9 @@ import { Flex } from '@antscorp/antsomi-ui/es/components/atoms/Flex';
 //     height: 30px !important;
 //   }
 // `;
-export const StageWrapperStyled = styled(Flex) `
-  width: ${props => `${props.$width}px`};
-  height: ${props => `${props.$height}px`};
-  border: 1px solid #666;
-  margin-top: 16px;
+export const StageWrapperStyled = styled(Flex) `
+  width: ${props => `${props.$width}px`};
+  height: ${props => `${props.$height}px`};
+  border: 1px solid #666;
+  margin-top: 16px;
 `;

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

@@ -1,5 +1,5 @@
 import styled from 'styled-components';
-export const ImagePreviews = styled.img `
-  width: 100%;
-  height: 100%;
+export const ImagePreviews = styled.img `
+  width: 100%;
+  height: 100%;
 `;

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

@@ -2,18 +2,18 @@
 import styled from 'styled-components';
 // Constants
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const InputNumberWithUnitWrapper = styled.div `
-  display: flex;
-  align-items: center;
-
-  .unit-label {
-    cursor: pointer;
-    margin-left: 10px;
-    color: ${THEME.token?.colorIcon};
-
-    &.selected {
-      color: ${THEME.token?.colorPrimary};
-      font-weight: bold;
-    }
-  }
+export const InputNumberWithUnitWrapper = styled.div `
+  display: flex;
+  align-items: center;
+
+  .unit-label {
+    cursor: pointer;
+    margin-left: 10px;
+    color: ${THEME.token?.colorIcon};
+
+    &.selected {
+      color: ${THEME.token?.colorPrimary};
+      font-weight: bold;
+    }
+  }
 `;