@antscorp/antsomi-ui 1.3.5-beta.447 → 1.3.5-beta.449

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/molecules/EditorTab/EditorTab.d.ts

@@ -3,12 +3,16 @@ import { ModalFuncProps } from 'antd';
 interface EditorTabItem {
     showIcon?: boolean;
     closeable?: boolean;
+    showDropdown?: boolean;
     id: string;
     name: string;
     type: 'query' | 'table-detail';
 }
 interface EditorTabProps {
     showArrow?: boolean;
+    /**
+     * @deprecated pass showDropdown key to each item in `listTab` props
+     */
     showDropdown?: boolean;
     editNameOnConfigure?: boolean;
     newTabText?: string;

package/es/components/molecules/EditorTab/EditorTab.js

@@ -157,8 +157,7 @@ export const EditorTab = props => {
             React.createElement(Icon, { type: "icon-ants-angle-left" }))),
         React.createElement("div", { ref: leftBlockRef, className: classnames('left-block', leftBlockClassName), onWheel: onWheelLeftBlock }, arrTabs && arrTabs.length
             ? arrTabs.map((tab, idx) => {
-                const { showIcon = true, closeable = true } = tab;
-                // const { showIcon = true, showDropdown = true, closeable = true } = tab;
+                const { showIcon = true, showDropdown = true, closeable = true } = tab;
                 return (React.createElement("div", { key: tab.id, onClick: () => handleActiveTab(tab.id), className: classnames('tab-item', tabItemClassName, {
                         active: tab.id === activeTabId,
                     }) },

package/es/constants/theme.js

@@ -14,6 +14,7 @@ export const THEME = {
         colorTextPlaceholder: '#BEBEBE',
         colorTextDisabled: '#999999',
         colorError: '#EF3340',
+        colorSuccess: '#12B800',
         colorWarning: '#faad14',
         colorPrimary: '#005fb8',
         colorTextHover: '#3a72b6',
@@ -55,6 +56,7 @@ export const THEME = {
         red6: '#EF3340',
         red7: '#CF1825',
         red8: '#FF0000',
+        orange6: '#F29100',
         bw0: '#FFFFFF',
         bw1_1: '#f8f8fc',
         bw1: '#f0f6fa',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.5-beta.447",
+  "version": "1.3.5-beta.449",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",