Merge pull request #3 from phorward/api-improvements

select API and component improvements

src/assets/scriptor/dialog.py

@@ -12,9 +12,8 @@
 from .utils import is_pyodide_context
 
 if is_pyodide_context():
-    from js import eval as js_eval, self as _self, Blob
-    from js import console
-
+    import js, pyodide
+    from js import self as _self
     import manager
 else:
     import asyncio
@@ -82,7 +81,7 @@ async def input(text: str, *, title: str = "Input", type: str = "input", use_tim
         manager.resultValue = None
 
         if type == "date":
-            console.error(tmp)
+            js.console.error(tmp)
             return datetime.datetime.fromtimestamp(math.floor(tmp/1000.0))
 
         return tmp
@@ -160,70 +159,52 @@ async def input_text(*args, **kwargs):
 input.text = input_text
 input.string = input_string
 
-if is_pyodide_context():
-    from pyodide.ffi import to_js
 
+async def select(text: str, choices: tuple[str] | list[str] | dict[str, str], *,
+                 title: str = "Select", multiple: bool = False):
+    if isinstance(choices, (list, tuple)):
+        choices = {str(k): str(k) for k in choices}
 
-async def select(title: str, text: str, choices: list[int], multiple: bool = False):
+    if not isinstance(choices, dict):
+        raise ValueError("'choices' must be either a list or a dict.")
 
-    _choices = choices
+    # Browser-mode
     if is_pyodide_context():
-        _choices = to_js(_choices)
+        choices = pyodide.ffi.to_js(choices, dict_converter=js.Object.fromEntries)
 
-        _self.postMessage(type="select", title=title, text=text, choices=_choices, multiple=multiple)
+        _self.postMessage(type="select", title=title, text=text, choices=choices, multiple=multiple)
         await wait()
 
-        tmp = manager.resultValue
+        ret = manager.resultValue
         if multiple:
-            tmp = list(tmp)
+            ret = ret.to_py()
+
         manager.reset()
         manager.resultValue = None
 
-        return tmp
+        return ret
+
+    # CLI-mode
+    maxkey = max([len(k) for k in choices])
+    menu = [f"{k: <{maxkey}} - {v}" if k != v else str(v) for k, v in choices.items()]
+
+    if not multiple:
+        ret = click.prompt(
+            "\n".join(menu) + "\n" + text,
+            type=click.Choice(list(choices.keys()))
+        )
     else:
-        # click.echo(title)  # not required
-        text += "\n\n"
-        for i, _ in enumerate(choices):
-            text += str(choices[i]) + (", " if i != len(choices)-1 else "")
-            if i > 0 and i % 3 == 0:
-                text += "\n"
-
-        lower_choices = [e.lower() for e in choices]
-        result_value = -1
+        options = list(choices.keys())
+
         while True:
-            _ret = click.prompt(text)
-            if not multiple:
-                if _ret.lower() in lower_choices:
-                    result_value = lower_choices.index(_ret.lower())
-                    break
-                else:
-                    click.echo("You entered a invalid input!")
-            else:
-                if _ret.find(",") == -1:
-                    if _ret.lower() in lower_choices:
-                        result_value = [lower_choices.index(_ret.lower()), ]
-                        break
-                    else:
-                        click.echo("You entered a invalid input!")
+            ret = click.prompt("\n".join(menu) + "\n" + text + f" ({', '.join(options)})", type=str)
+            ret = [c.strip() for c in ret.split(",")]
+            if all([v in options for v in ret]):
+                break
 
-                else:
-                    result = _ret.split(",")
-                    valid = True
-                    result_value = []
-                    for res in result:
-                        _tmp = res.lower().lstrip()
-                        if not (_tmp in lower_choices):
-                            valid = False
-                            break
-                        result_value.append(lower_choices.index(_tmp))
-
-                    if not valid:
-                        click.echo("You entered a invalid input!")
-                        continue
-                    break
+            click.echo(f"Invalid input entered. Allowed values: {options}")
 
-        return result_value
+    return ret
 
-    return None
 
 

src/components/Interaction/Select.vue

@@ -9,11 +9,15 @@
 		</p>
 
         <div v-if="!props.multiple" class="data-grid" label="Alignment">
-            <sl-button  :disabled="!render" size="medium" v-for="(option, index) in props.options" :key="index" @click="() => selectOption(index)"> {{ option }}</sl-button>
+            <sl-button  :disabled="!render" size="medium" v-for="option in Object.keys(props.options)" :key="option" @click="() => selectOption(option)">
+                {{ props.options[option] }}
+            </sl-button>
         </div>
 
 		<div class="checkbox-container" v-else>
-			<sl-checkbox class="checkbox" :disabled="!render" v-for="(option, index) in props.options" :key="index" @sl-change="(event) => selectRadioButton(event, index)"> {{  option }}</sl-checkbox>
+			<sl-checkbox class="checkbox" :disabled="!render" v-for="option in Object.keys(props.options)" :key="option" @sl-change="(event) => selectRadioButton(event, option)">
+                {{ props.options[option] }}
+            </sl-checkbox>
 		</div>
 
 		<div slot="footer" v-if="props.multiple">
@@ -56,7 +60,7 @@ function selectOption(index: number) {
   props.select(index);
 }
 
-function selectRadioButton(event: UIEvent, index: number) {
+function selectRadioButton(event: UIEvent, index: string) {
   if (!props.multiple)
     return;