ywana-core8 0.1.79 → 0.1.81

package/src/html/tree.js

@@ -240,6 +240,7 @@ export const TreeNode = (props) => {
         if (disabled || !expandable) return
 
         event.preventDefault()
+        event.stopPropagation()
         setIsOpen(prev => !prev)
     }, [disabled, expandable])
 
@@ -337,14 +338,26 @@ export const TreeNode = (props) => {
         >
             <summary
                 className="tree-item"
-                onClick={handleToggle}
+                onClick={(event) => {
+                    // Si se hace click en el área general del nodo (no en el label), toggle
+                    if (event.target === event.currentTarget ||
+                        event.target.closest('.tree-node__toggle')) {
+                        handleToggle(event)
+                    }
+                }}
                 onKeyDown={handleKeyDown}
                 {...ariaAttributes}
                 title={tooltip}
             >
                 {/* Expand/collapse indicator */}
                 {hasChildren && expandable && (
-                    <div className="tree-node__toggle">
+                    <div
+                        className="tree-node__toggle"
+                        onClick={(event) => {
+                            event.stopPropagation()
+                            handleToggle(event)
+                        }}
+                    >
                         <Icon
                             icon={isOpen ? 'expand_less' : 'expand_more'}
                             size="small"
@@ -374,7 +387,10 @@ export const TreeNode = (props) => {
                 {/* Label with badge */}
                 <div
                     className={`label ${clickable}`}
-                    onClick={handleSelect}
+                    onClick={(event) => {
+                        event.stopPropagation()
+                        handleSelect(event)
+                    }}
                 >
                     <span className="tree-node__label-text">
                         {labelTxt}

package/src/widgets/login/LoginBox.css

@@ -6,6 +6,7 @@
   padding: 1rem 1rem 0 1rem;
   display: flex;
   flex-direction: column;
+  gap: 1rem
 }
 
 .login-box .message {

package/src/widgets/login/LoginBox.js

@@ -1,5 +1,5 @@
 import React, { useState } from 'react'
-import { Icon , Button, Text, TextField } from '../../html'
+import { Icon , Button, Text, TextField2 as TextField } from '../../html'
 import './LoginBox.css'
 
 /**
@@ -24,23 +24,46 @@ export const LoginBox = ({
         if (onOK && canOK()) onOK(user, forcedPwd || password)
     }
 
+    // Helper function for backward compatibility
+    // TextField2 now supports both strings and React elements
     function tx(txt) {
+        // For TextField2, we can pass strings directly for better performance
+        // But keep this function for backward compatibility with other components
         return <Text>{txt}</Text>
     }
 
-    function changeUser(id, value) {
+    function changeUser(_, value) {
         setUser(value)
     }
-    
-    function changePassword(id, value) {
+
+    function changePassword(_, value) {
         setPassword(value)
     }
 
     return (
         <div className="login-box">
             <main>
-                <TextField label={tx(userLabel)} value={user} onChange={changeUser} onEnter={ok} outlined autoComplete="on" />
-                <TextField id="loginbox-password" label={tx(passwordLabel)} value={password} onChange={changePassword} onEnter={ok} type="password" outlined autoComplete="on" />
+                <TextField
+                    id="loginbox-user"
+                    label={tx(userLabel)}
+                    value={user}
+                    onChange={changeUser}
+                    onEnter={ok}
+                    outlined
+                    autoComplete="username"
+                    required
+                />
+                <TextField
+                    id="loginbox-password"
+                    label={tx(passwordLabel)}
+                    value={password}
+                    onChange={changePassword}
+                    onEnter={ok}
+                    type="password"
+                    outlined
+                    autoComplete="current-password"
+                    required
+                />
             </main>
             <footer>
                 { loading ? <div className="load-box"><Icon icon="refresh" /></div> : null }