ywana-core8 0.1.82 → 0.1.83

package/dist/index.cjs

@@ -4442,8 +4442,8 @@ var List = function List(props) {
     if (onSort) onSort(newConfig);
   }, [sortable, sortConfig, onSort]);
 
-  // Search component
-  var SearchComponent = function SearchComponent() {
+  // Search component JSX - memoized to prevent focus loss
+  var searchComponent = React.useMemo(function () {
     return searchable && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "list__search"
     }, /*#__PURE__*/React__default["default"].createElement(TextField, {
@@ -4455,7 +4455,7 @@ var List = function List(props) {
       outlined: true,
       size: "small"
     }));
-  };
+  }, [searchable, searchPlaceholder, searchTerm, handleSearch]);
 
   // Generate CSS classes
   var cssClasses = ['list', dense && 'list--dense', outlined && 'list--outlined', disabled && 'list--disabled', animated && 'list--animated', loading && 'list--loading', className].filter(Boolean).join(' ');
@@ -4485,12 +4485,12 @@ var List = function List(props) {
     return /*#__PURE__*/React__default["default"].createElement("div", _extends({
       className: cssClasses,
       style: style
-    }, ariaAttributes, restProps), searchPosition === 'top' && /*#__PURE__*/React__default["default"].createElement(SearchComponent, null), /*#__PURE__*/React__default["default"].createElement("div", {
+    }, ariaAttributes, restProps), searchPosition === 'top' && searchComponent, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "list__empty"
     }, /*#__PURE__*/React__default["default"].createElement(Icon, {
       icon: emptyIcon,
       size: "large"
-    }), /*#__PURE__*/React__default["default"].createElement(Text, null, emptyMessage)), searchPosition === 'bottom' && /*#__PURE__*/React__default["default"].createElement(SearchComponent, null), children);
+    }), /*#__PURE__*/React__default["default"].createElement(Text, null, emptyMessage)), searchPosition === 'bottom' && searchComponent, children);
   }
 
   // Render grouped or normal list
@@ -4507,7 +4507,7 @@ var List = function List(props) {
     className: cssClasses,
     style: style,
     ref: listRef
-  }, ariaAttributes, restProps), searchPosition === 'top' && /*#__PURE__*/React__default["default"].createElement(SearchComponent, null), sortable && sortBy && /*#__PURE__*/React__default["default"].createElement("div", {
+  }, ariaAttributes, restProps), searchPosition === 'top' && searchComponent, sortable && sortBy && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "list__sort"
   }, /*#__PURE__*/React__default["default"].createElement("button", {
     className: "list__sort-button",
@@ -4536,7 +4536,7 @@ var List = function List(props) {
       disabled: disabled,
       animated: animated
     });
-  })), searchPosition === 'bottom' && /*#__PURE__*/React__default["default"].createElement(SearchComponent, null), children);
+  })), searchPosition === 'bottom' && searchComponent, children);
 };
 
 /**
@@ -4605,8 +4605,8 @@ var GroupedList = function GroupedList(props) {
     });
   }, []);
 
-  // Search component for grouped list
-  var GroupedSearchComponent = function GroupedSearchComponent() {
+  // Search component for grouped list - memoized to prevent focus loss
+  var groupedSearchComponent = React.useMemo(function () {
     return searchable && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "list__search"
     }, /*#__PURE__*/React__default["default"].createElement(TextField, {
@@ -4618,11 +4618,11 @@ var GroupedList = function GroupedList(props) {
       outlined: true,
       size: "small"
     }));
-  };
+  }, [searchable, searchPlaceholder, searchTerm, onSearch]);
   return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     className: cssClasses + " grouped",
     style: style
-  }, ariaAttributes, restProps), searchPosition === 'top' && /*#__PURE__*/React__default["default"].createElement(GroupedSearchComponent, null), groups.map(function (group) {
+  }, ariaAttributes, restProps), searchPosition === 'top' && groupedSearchComponent, groups.map(function (group) {
     var isCollapsed = collapsedGroups.has(group.name);
     var groupTitle = groupRenderer ? groupRenderer(group) : /*#__PURE__*/React__default["default"].createElement(Text, null, group.name);
     return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
@@ -4665,7 +4665,7 @@ var GroupedList = function GroupedList(props) {
         animated: animated
       });
     })));
-  }), searchPosition === 'bottom' && /*#__PURE__*/React__default["default"].createElement(GroupedSearchComponent, null), children);
+  }), searchPosition === 'bottom' && groupedSearchComponent, children);
 };
 
 /**