@antscorp/antsomi-ui 1.3.5-beta.964 → 1.3.5-beta.966

package/es/components/atoms/SelectAssociatedTag/SelectAssociatedTag.js

@@ -8,8 +8,8 @@ import SelectTag from './SelectTag';
 import { defaultProps } from './constants';
 export const SelectAssociatedTag = (props) => {
     // Props
-    const { tagConfigs, style, selected, options, children, onSelect } = props;
+    const { tagConfigs, style, selected, disabled, options, children, onSelect } = props;
     const { tag, value } = selected || {};
-    return (_jsxs(StyledSpace, { className: "select-associated-tag", style: style, children: [_jsx(SelectTag, { ...tagConfigs, selectedTag: tag }), _jsx(Divider, { type: "vertical", style: { margin: '0px 1px 0px 6px' } }), children ?? (_jsx(Select, { style: { width: '100%', height: '100%' }, value: value, options: options, onChange: onSelect }))] }));
+    return (_jsxs(StyledSpace, { className: "select-associated-tag", style: style, children: [_jsx(SelectTag, { ...tagConfigs, selectedTag: tag }), _jsx(Divider, { type: "vertical", style: { margin: '0px 1px 0px 6px' }, className: "antsomi-divider-between-select" }), children ?? (_jsx(Select, { style: { width: '100%', height: '100%' }, value: value, disabled: disabled, options: options, onChange: onSelect }))] }));
 };
 SelectAssociatedTag.defaultProps = defaultProps;

package/es/components/atoms/SelectAssociatedTag/SelectTag.js

@@ -8,7 +8,7 @@ import { Popover } from '../Popover';
 import { SelectedTag } from './styled';
 const SelectTag = (props) => {
     // Props
-    const { selectedTag, title, options, onSelect } = props;
+    const { selectedTag, disabled, title, options, onSelect } = props;
     // State
     const [open, setOpen] = useState(false);
     // Memoized
@@ -21,6 +21,6 @@ const SelectTag = (props) => {
         setOpen(false);
         onSelect(item);
     };
-    return (_jsx(Popover, { open: open, title: _jsx(Typography.Text, { style: { fontWeight: '400', maxWidth: 130 }, ellipsis: { tooltip: title }, children: title }), content: _jsx(Flex, { wrap: "wrap", gap: 6, style: { padding: '10px 0px' }, children: options?.map(item => (_jsx(SelectedTag, { "$color": item.color, "$background": item.background, ellipsis: { tooltip: item.label }, onClick: () => handleClick(item), children: item.label }, item.value))) }), placement: "bottomLeft", trigger: "click", overlayInnerStyle: { padding: 10, maxWidth: 150 }, onOpenChange: handleOpenChange, children: _jsx(SelectedTag, { "$color": selectedItem?.color, "$background": selectedItem?.background, ellipsis: { tooltip: selectedItem?.label }, children: selectedItem?.label }) }));
+    return (_jsx(Popover, { open: open && !disabled, title: _jsx(Typography.Text, { style: { fontWeight: '400', maxWidth: 130 }, ellipsis: { tooltip: title }, children: title }), content: _jsx(Flex, { wrap: "wrap", gap: 6, style: { padding: '10px 0px' }, children: options?.map(item => (_jsx(SelectedTag, { "$color": item.color, "$background": item.background, ellipsis: { tooltip: item.label }, onClick: () => handleClick(item), children: item.label }, item.value))) }), placement: "bottomLeft", trigger: "click", overlayInnerStyle: { padding: 10, maxWidth: 150 }, onOpenChange: handleOpenChange, children: _jsx(SelectedTag, { "$color": selectedItem?.color, "$background": selectedItem?.background, ellipsis: { tooltip: selectedItem?.label }, children: selectedItem?.label }) }));
 };
 export default memo(SelectTag);

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

@@ -40,7 +40,7 @@ export const SelectedTag = styled(Typography.Text) `
     color: ${props => props.$color};
 
     &.antsomi-typography-ellipsis {
-      max-width: 60px;
+      max-width: 70px;
     }
   }
 `;

package/es/components/atoms/SelectAssociatedTag/types.d.ts

@@ -9,6 +9,7 @@ export type TagItem = {
 export interface TagConfigProps {
     selectedTag: TagItem['value'];
     title?: string;
+    disabled?: boolean;
     options: TagItem[];
     onSelect: (newItem: TagItem) => void;
 }
@@ -41,6 +42,11 @@ export interface SelectAssociatedTagProps {
          */
         value: Dictionary<SelectOption>;
     };
+    /**
+     * Whether the SelectAssociatedTag is disabled.
+     * @type {boolean}
+     */
+    disabled?: boolean;
     /**
      * A list of selectable options.
      * @type {SelectOption[]}

package/package.json

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