@antscorp/antsomi-ui 1.3.5-beta.978 → 1.3.5-beta.979

package/es/components/molecules/InputSelectAttribute/index.d.ts

@@ -12,6 +12,7 @@ type Option = {
 export interface InputSelectAttributeProps {
     sourceOptions: Option[];
     codeOptions: Option[];
+    listSourceInit: Option[];
     label?: string;
     errorMsg?: string;
     value: Value;

package/es/components/molecules/InputSelectAttribute/index.js

@@ -13,7 +13,7 @@ import { StyledSelect } from './styled';
 // Constants
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
 const InputSelectAttribute = (props) => {
-    const { value, errorMsg, label, sourceOptions = [], codeOptions = [], onChange, onChangeSelectSource, } = props;
+    const { value, errorMsg, label, listSourceInit = [], sourceOptions = [], codeOptions = [], onChange, onChangeSelectSource, } = props;
     const [form] = Form.useForm();
     // States
     const [openModal, setOpenModal] = useState(false);
@@ -34,6 +34,7 @@ const InputSelectAttribute = (props) => {
     }, [attributeState, codeOptions, form]);
     // Memoized
     const mapCodeOpts = useMemo(() => keyBy(codeOptions, 'value'), [codeOptions]);
+    const listSourceInitOpts = useMemo(() => keyBy(listSourceInit, 'value'), [listSourceInit]);
     const onOpenModal = useCallback(() => {
         setOpenModal(true);
     }, []);
@@ -72,7 +73,7 @@ const InputSelectAttribute = (props) => {
                     height: 32,
                     padding: '4px 12px 4px 4px',
                     borderBottom: `1px solid ${errorMsg ? THEME.token?.colorError : THEME.token?.blue1}`,
-                }, children: [_jsx("div", { style: { width: '100%', cursor: 'pointer' }, onClick: onOpenModal, children: isObjValue && _jsx(Tag, { children: get(mapCodeOpts, [value.code, 'label'], value.code) }) }), _jsx(Icon, { type: "icon-ants-remove", style: { fontSize: 10, color: '#222', cursor: 'pointer' }, onClick: onDeselect })] }));
+                }, children: [_jsx("div", { style: { width: '100%', cursor: 'pointer' }, onClick: onOpenModal, children: isObjValue && (_jsx(Tag, { children: get(mapCodeOpts, [value.code, 'label'], get(listSourceInitOpts, [value.code, 'label'])) })) }), _jsx(Icon, { type: "icon-ants-remove", style: { fontSize: 10, color: '#222', cursor: 'pointer' }, onClick: onDeselect })] }));
         }
         else {
             element = (_jsx(StyledSelect, { mode: "multiple", options: [{ value: '', label: translate(translations.orSelectAField.title) }], notFoundContent: null, onSelect: onOpenModal, style: { width: '100%', borderTop: 'none', borderLeft: 'none', borderRight: 'none' }, onDeselect: onDeselect, autoClearSearchValue: false, searchValue: typeof value === 'string' ? value : '', onSearch: onChangeInput, status: errorMsg ? 'error' : undefined, placeholder: typeof value === 'string' ? value : translate(translations.inputYourValue.title), "$isPlaceholder": !value, "$isError": !!errorMsg, dropdownStyle: {
@@ -87,8 +88,6 @@ const InputSelectAttribute = (props) => {
                     }, children: [_jsx(Form.Item, { label: translate(translations._TITL_PERSONALIZATION_TYPE, 'Content Source'), name: "sources", required: true, labelCol: { span: 6 }, labelAlign: "left", rules: [{ required: true, message: 'Please select field!' }], children: _jsx(Select, { suffixIcon: _jsx(Icon, { type: "icon-ants-expand-more", style: { fontSize: '20px', color: THEME.token?.colorIcon } }), options: sourceOptions, value: attributeState.source, onChange: newValue => {
                                     setAttributeState(state => ({ ...state, code: '', source: newValue }));
                                     onChangeSelectSource(newValue);
-                                } }) }), _jsx(Form.Item, { label: label || 'Allocated Code', required: true, labelCol: { span: 6 }, labelAlign: "left", name: "code", rules: [{ required: true, message: 'Please select field!' }], children: _jsx(Select, { suffixIcon: _jsx(Icon, { type: "icon-ants-expand-more", style: { fontSize: '20px', color: THEME.token?.colorIcon } }), value: attributeState.code, options: codeOptions, onChange: newValue => {
-                                    setAttributeState(state => ({ ...state, source: newValue }));
-                                } }) })] }) })] }));
+                                } }) }), _jsx(Form.Item, { label: label || 'Allocated Code', required: true, labelCol: { span: 6 }, labelAlign: "left", name: "code", rules: [{ required: true, message: 'Please select field!' }], children: _jsx(Select, { suffixIcon: _jsx(Icon, { type: "icon-ants-expand-more", style: { fontSize: '20px', color: THEME.token?.colorIcon } }), value: attributeState.code, options: codeOptions }) })] }) })] }));
 };
 export default memo(InputSelectAttribute);

package/package.json

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