{command.name}
diff --git a/components/elements/commands/elements/command/styles.module.css b/components/elements/commands/elements/command/styles.module.css
index 84f4151..e69de29 100644
--- a/components/elements/commands/elements/command/styles.module.css
+++ b/components/elements/commands/elements/command/styles.module.css
@@ -1,4 +0,0 @@
-.task {
- display: grid;
- grid-template-columns: 11fr 1fr;
-}
\ No newline at end of file
diff --git a/components/elements/commands/elements/option/index.tsx b/components/elements/commands/elements/option/index.tsx
index 9482095..6454ea3 100644
--- a/components/elements/commands/elements/option/index.tsx
+++ b/components/elements/commands/elements/option/index.tsx
@@ -1,6 +1,7 @@
import styles from './styles.module.css'
import {useContext} from "react";
import Context, {ContextInterface} from "../command/context";
+import {TextField} from "@mui/material";
export interface OptionInterface {
name: string,
@@ -27,7 +28,14 @@ export default function Option(option: OptionInterface) {
}
return (
- {option.shortcut ? '-' : '--'}{option.shortcut || option.name} {option.acceptValue && }
+ {option.shortcut ? '-' : '--'}
+ {option.acceptValue ? '' : (option.shortcut || option.name)}
+ {option.acceptValue &&
+ }
)
}
diff --git a/components/elements/commands/elements/options/index.tsx b/components/elements/commands/elements/options/index.tsx
index 0803928..c2b6e49 100644
--- a/components/elements/commands/elements/options/index.tsx
+++ b/components/elements/commands/elements/options/index.tsx
@@ -2,6 +2,7 @@ import styles from './styles.module.css'
import Option, {OptionInterface} from '../option'
import {useContext, useEffect, useState} from "react";
import Context, {ContextInterface} from "../command/context";
+import {Select, MenuItem, Checkbox, ListItemText} from "@mui/material";
interface OptionsInterface {
optionList: OptionInterface[]
@@ -9,46 +10,58 @@ interface OptionsInterface {
export default function Options({optionList}: OptionsInterface) {
let {optionList: ol, setOptionList} = useContext(Context)
- let [availableOptions, setAvailableOptions] = useState(optionList);
+ let [selectedOptions, setSelectedOptions] = useState([]);
let [values, setValues] = useState([]);
+ let [selectedValues, setSelectedValues] = useState([]);
useEffect(() => {
let result: OptionInterface[] = [];
optionList.forEach((value, index, array) => {
- let check = values.find(item => item === value)
- !check && result.push(value)
+ let check = selectedValues.find(item => item === value.name)
+ check && result.push(value)
})
- setAvailableOptions(result)
- }, [values]);
+ setSelectedOptions(result)
+
+ let temp: any = {}
+ optionList.forEach((value, index, array) => {
+ let check = selectedValues.find(item => item === value.name)
+ check && (temp[value.name] = value.acceptValue ? '' : null)
+ })
+ setOptionList(temp)
+ }, [selectedValues]);
if (!optionList.length) {
return <>>
}
- let onChange = (event: any) => {
- let selectedValue = event.target.value
- let selectedOption = availableOptions.find(item => item.name === selectedValue)
- selectedOption && values.push(selectedOption)
- setValues([ ...values ])
- event.target.value = '';
+ const handleChange = (event: any) => {
+ const { target: { value }} = event
+ setSelectedValues(typeof value === 'string' ? value.split(',') : value)
+ };
- let temp = {
- ...ol
- }
- if (selectedOption) {
- temp[selectedOption.name] = selectedOption.acceptValue ? '' : null;
- }
- setOptionList(temp)
- }
return (
<>
- {availableOptions.length > 0 && <> >}
- {values.map((option: OptionInterface, index: number) => (
+ {optionList.length > 0 &&
+ <>
+
+
+ >}
+ {selectedOptions.map((option: OptionInterface, index: number) => (
))}
>
diff --git a/components/elements/commands/styles.module.css b/components/elements/commands/styles.module.css
index 84f4151..e69de29 100644
--- a/components/elements/commands/styles.module.css
+++ b/components/elements/commands/styles.module.css
@@ -1,4 +0,0 @@
-.task {
- display: grid;
- grid-template-columns: 11fr 1fr;
-}
\ No newline at end of file