@aloudata/aloudata-design 2.5.2 → 2.6.0

package/dist/Icon/components/CancelledCircleFill.d.ts

@@ -0,0 +1,11 @@
+import type { SVGProps } from 'react';
+import * as React from 'react';
+interface SVGRProps {
+    size?: number | string;
+    title?: string;
+    titleId?: string;
+    desc?: string;
+    descId?: string;
+}
+declare const Memo: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>>;
+export default Memo;

package/dist/Icon/components/CancelledCircleFill.js

@@ -0,0 +1,35 @@
+var _excluded = ["title", "titleId", "desc", "descId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import * as React from 'react';
+import { forwardRef, memo } from 'react';
+var CancelledCircleFill = function CancelledCircleFill(_ref, ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    desc = _ref.desc,
+    descId = _ref.descId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: props.width || props.size || 16,
+    height: props.height || props.size || 16,
+    fill: "none",
+    viewBox: "0 0 20 20",
+    ref: ref,
+    "aria-labelledby": titleId,
+    "aria-describedby": descId
+  }, props), desc ? /*#__PURE__*/React.createElement("desc", {
+    id: descId
+  }, desc) : null, title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, /*#__PURE__*/React.createElement("path", {
+    fill: "#6B7280",
+    fillRule: "evenodd",
+    d: "M1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Zm5.976-.833a.833.833 0 1 0 0 1.666h4.714a.833.833 0 0 0 0-1.666H7.643Z",
+    clipRule: "evenodd"
+  }));
+};
+var ForwardRef = /*#__PURE__*/forwardRef(CancelledCircleFill);
+var Memo = /*#__PURE__*/memo(ForwardRef);
+export default Memo;

package/dist/Icon/components/InProgressFill.d.ts

@@ -0,0 +1,11 @@
+import type { SVGProps } from 'react';
+import * as React from 'react';
+interface SVGRProps {
+    size?: number | string;
+    title?: string;
+    titleId?: string;
+    desc?: string;
+    descId?: string;
+}
+declare const Memo: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>>;
+export default Memo;

package/dist/Icon/components/InProgressFill.js

@@ -0,0 +1,38 @@
+var _excluded = ["title", "titleId", "desc", "descId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import * as React from 'react';
+import { forwardRef, memo } from 'react';
+var InProgressFill = function InProgressFill(_ref, ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    desc = _ref.desc,
+    descId = _ref.descId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: props.width || props.size || 16,
+    height: props.height || props.size || 16,
+    fill: "none",
+    viewBox: "0 0 20 20",
+    ref: ref,
+    "aria-labelledby": titleId,
+    "aria-describedby": descId
+  }, props), desc ? /*#__PURE__*/React.createElement("desc", {
+    id: descId
+  }, desc) : null, title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, /*#__PURE__*/React.createElement("g", {
+    fill: "#2986F4"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M15 10a5 5 0 0 1-5 5V5a5 5 0 0 1 5 5Z"
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    d: "M18.333 10a8.333 8.333 0 1 1-16.666 0 8.333 8.333 0 0 1 16.666 0Zm-1.666 0a6.667 6.667 0 1 1-13.334 0 6.667 6.667 0 0 1 13.334 0Z",
+    clipRule: "evenodd"
+  })));
+};
+var ForwardRef = /*#__PURE__*/forwardRef(InProgressFill);
+var Memo = /*#__PURE__*/memo(ForwardRef);
+export default Memo;

package/dist/Icon/index.d.ts

@@ -6,6 +6,7 @@ export { default as AttentionCircleFill } from './components/AttentionCircleFill
 export { default as AttentionTriangleFill } from './components/AttentionTriangleFill';
 export { default as AttentionTriangleLightLine } from './components/AttentionTriangleLightLine';
 export { default as CancelCircleDuotone } from './components/CancelCircleDuotone';
+export { default as CancelledCircleFill } from './components/CancelledCircleFill';
 export { default as CheckCircleDuotone } from './components/CheckCircleDuotone';
 export { default as CheckCircleFill } from './components/CheckCircleFill';
 export { default as CheckCircleLightLine } from './components/CheckCircleLightLine';
@@ -25,6 +26,7 @@ export { default as EyeOffLine } from './components/EyeOffLine';
 export { default as EyeOnLine } from './components/EyeOnLine';
 export { default as FoldDownFill } from './components/FoldDownFill';
 export { default as FoldUpFill } from './components/FoldUpFill';
+export { default as InProgressFill } from './components/InProgressFill';
 export { default as InfoCircleDuotone } from './components/InfoCircleDuotone';
 export { default as InfoCircleLine } from './components/InfoCircleLine';
 export { default as InformationCircleFill } from './components/InformationCircleFill';

package/dist/Icon/index.js

@@ -6,6 +6,7 @@ export { default as AttentionCircleFill } from "./components/AttentionCircleFill
 export { default as AttentionTriangleFill } from "./components/AttentionTriangleFill";
 export { default as AttentionTriangleLightLine } from "./components/AttentionTriangleLightLine";
 export { default as CancelCircleDuotone } from "./components/CancelCircleDuotone";
+export { default as CancelledCircleFill } from "./components/CancelledCircleFill";
 export { default as CheckCircleDuotone } from "./components/CheckCircleDuotone";
 export { default as CheckCircleFill } from "./components/CheckCircleFill";
 export { default as CheckCircleLightLine } from "./components/CheckCircleLightLine";
@@ -25,6 +26,7 @@ export { default as EyeOffLine } from "./components/EyeOffLine";
 export { default as EyeOnLine } from "./components/EyeOnLine";
 export { default as FoldDownFill } from "./components/FoldDownFill";
 export { default as FoldUpFill } from "./components/FoldUpFill";
+export { default as InProgressFill } from "./components/InProgressFill";
 export { default as InfoCircleDuotone } from "./components/InfoCircleDuotone";
 export { default as InfoCircleLine } from "./components/InfoCircleLine";
 export { default as InformationCircleFill } from "./components/InformationCircleFill";

package/dist/Icon/svg/Cancelled-Circle-fill.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id=" Icon / Fill / Interface /Cancelled-Circle-fill">
+<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M1.66675 9.9999C1.66675 5.39753 5.39771 1.66656 10.0001 1.66656C14.6025 1.66656 18.3334 5.39753 18.3334 9.9999C18.3334 14.6023 14.6025 18.3332 10.0001 18.3332C5.39771 18.3332 1.66675 14.6023 1.66675 9.9999ZM7.64295 9.16667C7.18271 9.16667 6.80961 9.53976 6.80961 10C6.80961 10.4602 7.18271 10.8333 7.64295 10.8333H12.357C12.8172 10.8333 13.1903 10.4602 13.1903 10C13.1903 9.53976 12.8172 9.16667 12.357 9.16667H7.64295Z" fill="#6B7280"/>
+</g>
+</svg>

package/dist/Icon/svg/In-Progress-fill.svg

@@ -0,0 +1,8 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id=" Icon / Fill / Interface / In-Progress-fill">
+<g id="Icon">
+<path d="M15.0001 10C15.0001 12.7614 12.7615 15 10.0001 15V5.00001C12.7615 5.00001 15.0001 7.23858 15.0001 10Z" fill="#2986F4"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.3334 10C18.3334 14.6024 14.6025 18.3333 10.0001 18.3333C5.39771 18.3333 1.66675 14.6024 1.66675 10C1.66675 5.39763 5.39771 1.66667 10.0001 1.66667C14.6025 1.66667 18.3334 5.39763 18.3334 10ZM16.6667 10C16.6667 13.6819 13.682 16.6667 10.0001 16.6667C6.31818 16.6667 3.33341 13.6819 3.33341 10C3.33341 6.31811 6.31818 3.33334 10.0001 3.33334C13.682 3.33334 16.6667 6.31811 16.6667 10Z" fill="#2986F4"/>
+</g>
+</g>
+</svg>

package/dist/Radio/components/Radio/index.js

@@ -1,4 +1,10 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -6,7 +12,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import classNames from 'classnames';
 import _ from 'lodash';
-import React, { useContext, useRef } from 'react';
+import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { getUUID } from "../../../_utils/hooks/useId";
 import { RadioGroupContext } from "../Group";
 export default function Radio(props) {
@@ -14,15 +20,26 @@ export default function Radio(props) {
   var labelRef = useRef(null);
   var id = getUUID().toString();
   var radioProps = _objectSpread({}, props);
+  var initChecked = useCallback(function () {
+    if (!_.isEmpty(groupContext)) {
+      return !props.disabled && groupContext.value === props.value;
+    } else {
+      return !('checked' in props) ? props.defaultChecked : radioProps.checked;
+    }
+  }, [groupContext, props, radioProps.checked]);
+  var _useState = useState(initChecked),
+    _useState2 = _slicedToArray(_useState, 2),
+    checked = _useState2[0],
+    setChecked = _useState2[1];
+  useEffect(function () {
+    setChecked(initChecked);
+  }, [initChecked, groupContext.value, props.value, props.disabled]);
   if (!_.isEmpty(groupContext)) {
     radioProps.disabled = groupContext.disabled || props.disabled;
-    radioProps.checked = !props.disabled && groupContext.value === props.value;
-  } else {
-    radioProps.checked = !('checked' in props) ? props.defaultChecked : radioProps.checked;
   }
   // 设置input外层盒子的class
   var aldRadioClass = classNames('ald-radio', {
-    'ald-radio-checked': radioProps.checked,
+    'ald-radio-checked': checked,
     'ald-radio-disabled': radioProps.disabled
   });
   // 根据属性设置最外层的class
@@ -51,17 +68,25 @@ export default function Radio(props) {
     } else {
       // 当type未设置或者是radio时
       otherClass = 'ald-radio-wrapper';
+      if (props.indeterminate) {
+        otherClass = otherClass + ' ald-radio-wrapper-indeterminate';
+      }
     }
     return classNames('ald-radio-label', otherClass, {
-      'ald-radio-wrapper-checked': radioProps.checked,
+      'ald-radio-wrapper-checked': checked,
       'ald-radio-wrapper-disabled': radioProps.disabled
     });
   };
-  var onChange = function onChange() {
+  var onChange = function onChange(e) {
+    var _props$onChange;
     if (groupContext !== null && groupContext !== void 0 && groupContext.onChange) {
       // input事件的value会被toString，所以此处进行一个覆盖
       groupContext.onChange(props.value);
     }
+    (_props$onChange = props.onChange) === null || _props$onChange === void 0 ? void 0 : _props$onChange.call(props, e);
+    if (_.isEmpty(groupContext)) {
+      setChecked(e.target.checked);
+    }
   };
   return /*#__PURE__*/React.createElement("label", {
     className: getWrapperClass(),
@@ -73,10 +98,21 @@ export default function Radio(props) {
     id: id,
     type: "radio",
     className: "ald-radio-input",
-    checked: radioProps.checked,
+    defaultChecked: checked,
     disabled: radioProps.disabled,
     value: props.value,
-    onChange: onChange
+    onChange: onChange,
+    onClick: function onClick(e) {
+      var _props$onClick;
+      (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props, e);
+      if (!_.isEmpty(groupContext)) {
+        if (groupContext !== null && groupContext !== void 0 && groupContext.onChange) {
+          // input事件的value会被toString，所以此处进行一个覆盖
+          groupContext.onChange(props.value);
+        }
+        setChecked(!checked);
+      }
+    }
   }), /*#__PURE__*/React.createElement("span", {
     className: "ald-radio-inner"
   })), /*#__PURE__*/React.createElement("span", {

package/dist/Radio/interface/radio.d.ts

@@ -21,4 +21,7 @@ export interface IRadioProps {
      */
     value?: any;
     children?: ReactNode[] | ReactNode;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    onClick?: (e: React.MouseEvent<HTMLInputElement>) => void;
+    indeterminate?: boolean;
 }

package/dist/Radio/style/index.less

@@ -79,8 +79,9 @@
   user-select: none;
   white-space: nowrap;
 }
+
 // 绘制选中时的圆圈样式
-.ald-radio-checked > .ald-radio-inner {
+:not(.ald-radio-wrapper-indeterminate) > .ald-radio-checked > .ald-radio-inner {
   background-color: var(--alias-colors-bg-selected-strong-default, #126fdd);
   border: 0;
   transform: background 0.5s ease;
@@ -105,10 +106,39 @@
     background-color: var(--alias-colors-bg-selected-strong-press, #0b4385);
   }
 }
+// 半选的样式
+.ald-radio-wrapper-indeterminate > .ald-radio > .ald-radio-inner[class] {
+  background-color: var(--alias-colors-bg-selected-strong-default, #126fdd);
+  border: 0;
+  transform: background 0.5s ease;
+
+  &::after {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 8.5px;
+    height: 2px;
+    background-color: var(--alias-colors-icon-inverse-default, #fff);
+    border-radius: 2px;
+    transform: translate(-50%, -50%);
+    content: '';
+  }
+
+  &:hover {
+    background-color: var(--alias-colors-bg-selected-strong-hover, #0f59b1);
+  }
+
+  &:active {
+    background-color: var(--alias-colors-bg-selected-strong-press, #0b4385);
+  }
+}
 
 // 禁用状态下的样式
 .ald-radio-disabled > .ald-radio-inner {
-  background-color: var(--alias-colors-bg-disabled, rgba(0, 0, 0, 0.05));
+  background-color: var(
+    --alias-colors-bg-disabled,
+    rgba(0, 0, 0, 0.05)
+  ) !important;
   border: 1px solid var(--alias-colors-border-disabled, rgba(0, 0, 0, 0.1));
 
   &::after {

package/dist/Spin/CustomIcon/index.js

@@ -1,6 +1,7 @@
 import classNames from 'classnames';
 import React from 'react';
 import { LoadingDuotone } from "../../Icon";
+import { getUUID } from "../../_utils/hooks/useId";
 var Icon = function Icon(props) {
   var size = props.size,
     tip = props.tip,
@@ -10,7 +11,9 @@ var Icon = function Icon(props) {
     className = props.className,
     inContainer = props.inContainer;
   if (!spinning) return null;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, inContainer && /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, {
+    key: getUUID().toString()
+  }, inContainer && /*#__PURE__*/React.createElement("div", {
     className: "spinner-mask"
   }), /*#__PURE__*/React.createElement("div", {
     className: classNames('spinner', className, {

package/dist/StatusLight/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface IProps {
+    size?: 'middle' | 'small';
+    style?: 'dot' | 'icon';
+    dotColor?: string;
+    icon?: React.ReactNode;
+    text: string;
+    status?: 'info' | 'neutral' | 'danger' | 'success' | 'warning';
+    className?: string;
+}
+declare function StatusLight({ size, style, dotColor, icon, text, status, className, }: IProps): React.JSX.Element;
+export default StatusLight;

package/dist/StatusLight/index.js

@@ -0,0 +1,74 @@
+import classNames from 'classnames';
+import React from 'react';
+import { AttentionCircleFill, CancelledCircleFill, CheckCircleFill, CloseCircleFill, InProgressFill } from "../Icon";
+function StatusLight(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    _ref$style = _ref.style,
+    style = _ref$style === void 0 ? 'dot' : _ref$style,
+    dotColor = _ref.dotColor,
+    icon = _ref.icon,
+    text = _ref.text,
+    _ref$status = _ref.status,
+    status = _ref$status === void 0 ? 'info' : _ref$status,
+    className = _ref.className;
+  var getIcon = function getIcon() {
+    if (icon) return icon;
+    var iconSize = size === 'middle' ? 20 : 16;
+    switch (status) {
+      case 'info':
+        return /*#__PURE__*/React.createElement(InProgressFill, {
+          color: "#2986F4",
+          size: iconSize
+        });
+      case 'neutral':
+        return /*#__PURE__*/React.createElement(CancelledCircleFill, {
+          color: "#6B7280",
+          size: iconSize
+        });
+      case 'danger':
+        return /*#__PURE__*/React.createElement(CloseCircleFill, {
+          color: "#EF4444",
+          size: iconSize
+        });
+      case 'success':
+        return /*#__PURE__*/React.createElement(CheckCircleFill, {
+          color: "#22C55E",
+          size: iconSize
+        });
+      case 'warning':
+        return /*#__PURE__*/React.createElement(AttentionCircleFill, {
+          color: "#EAB308",
+          size: iconSize
+        });
+    }
+  };
+  var getDotColor = function getDotColor() {
+    if (dotColor) return dotColor;
+    switch (status) {
+      case 'info':
+        return '#2986F4';
+      case 'neutral':
+        return '#6B7280';
+      case 'danger':
+        return '#EF4444';
+      case 'success':
+        return '#22C55E';
+      case 'warning':
+        return '#EAB308';
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('ald-status-light', "ald-status-light-".concat(size), className)
+  }, style === 'dot' && /*#__PURE__*/React.createElement("div", {
+    className: "ald-prefix-dot",
+    style: {
+      backgroundColor: getDotColor()
+    }
+  }), style === 'icon' && /*#__PURE__*/React.createElement("div", {
+    className: "ald-prefix-icon"
+  }, getIcon()), /*#__PURE__*/React.createElement("div", {
+    className: "ald-text"
+  }, text));
+}
+export default StatusLight;

package/dist/StatusLight/style/index.d.ts

@@ -0,0 +1,2 @@
+import '../../style';
+import './index.less';

package/dist/StatusLight/style/index.js

@@ -0,0 +1,2 @@
+import "../../style";
+import "./index.less";

package/dist/StatusLight/style/index.less

@@ -0,0 +1,47 @@
+@import '../../style/index.less';
+
+.ald-status-light {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+
+  .ald-prefix-icon {
+    height: 100%;
+    display: flex;
+    align-items: center;
+  }
+}
+
+.ald-status-light-small {
+  gap: 4px;
+
+  .ald-prefix-dot {
+    width: var(--global-grid-75, 6px);
+    height: var(--global-grid-75, 6px);
+    border-radius: 100%;
+  }
+
+  .ald-text {
+    color: var(--alias-colors-text-default, #1f2937);
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 16px; /* 133.333% */
+  }
+}
+
+.ald-status-light-middle {
+  gap: 6px;
+
+  .ald-prefix-dot {
+    width: var(--global-grid-100, 8px);
+    height: var(--global-grid-100, 8px);
+    border-radius: 100%;
+  }
+
+  .ald-text {
+    color: var(--alias-colors-text-default, #1f2937);
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 20px; /* 142.857% */
+  }
+}