ywana-core8 0.1.80 → 0.1.81

package/dist/index.modern.js

@@ -1686,12 +1686,30 @@ var Tooltip = function Tooltip(props) {
     top: top,
     left: left
   };
+
+  // Text element - support both string and React components
+  var textElement = useMemo(function () {
+    if (!text) return null;
+
+    // If text is already a React element, use it directly
+    if (React.isValidElement(text)) {
+      return text;
+    }
+
+    // If text is a string, wrap it in Text component
+    if (typeof text === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, text);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(text));
+  }, [text]);
   return /*#__PURE__*/React.createElement("div", {
     className: "tooltip"
   }, /*#__PURE__*/React.createElement("span", {
     className: "tooltip-text",
     style: style
-  }, /*#__PURE__*/React.createElement(Text, null, text)), props.children);
+  }, textElement), props.children);
 };
 
 /**
@@ -2158,6 +2176,24 @@ var Button = function Button(props) {
     'aria-describedby': tooltip ? id + "-tooltip" : undefined
   };
 
+  // Label text - support both string and React components
+  var labelElement = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
+
   // Icon configuration
   var iconProps = {
     icon: loading ? 'hourglass_empty' : icon,
@@ -2175,7 +2211,7 @@ var Button = function Button(props) {
     onBlur: handleBlur,
     onKeyDown: handleKeyDown,
     disabled: disabled || loading
-  }, ariaAttributes, restProps), (icon || loading) && /*#__PURE__*/React.createElement(Icon, iconProps), label && /*#__PURE__*/React.createElement(Text, null, label), loading && !icon && /*#__PURE__*/React.createElement("span", {
+  }, ariaAttributes, restProps), (icon || loading) && /*#__PURE__*/React.createElement(Icon, iconProps), labelElement, loading && !icon && /*#__PURE__*/React.createElement("span", {
     className: "loading-text"
   }, "Loading..."));
 };
@@ -2271,8 +2307,8 @@ var ActionButton = function ActionButton(props) {
 Button.propTypes = {
   /** Unique identifier for the button */
   id: PropTypes.string,
-  /** Button text label */
-  label: PropTypes.string,
+  /** Button text label - can be string or React element */
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
   /** Icon name for Material Icons */
   icon: PropTypes.string,
   /** Click handler function */
@@ -3103,11 +3139,28 @@ var Header = function Header(props) {
   var style = props.img ? {
     backgroundImage: "url(" + props.img + ")"
   } : {};
-  var title = /*#__PURE__*/React.createElement(Text, null, props.title);
+
+  // Title element - support both string and React components
+  var titleElement = useMemo(function () {
+    if (!props.title) return null;
+
+    // If title is already a React element, use it directly
+    if (React.isValidElement(props.title)) {
+      return props.title;
+    }
+
+    // If title is a string, wrap it in Text component
+    if (typeof props.title === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, props.title);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(props.title));
+  }, [props.title]);
   return /*#__PURE__*/React.createElement("header", {
     className: "header " + caption + " " + prominent + " " + dense + " " + theme + " " + props.className,
     style: style
-  }, icon, props.title ? /*#__PURE__*/React.createElement("label", null, title) : null, /*#__PURE__*/React.createElement("span", {
+  }, icon, props.title ? /*#__PURE__*/React.createElement("label", null, titleElement) : null, /*#__PURE__*/React.createElement("span", {
     className: "actions"
   }, props.children));
 };
@@ -3886,7 +3939,24 @@ var TextField = function TextField(props) {
   var labelStyle = label ? "" : "no-label";
   var labelPositionStyle = labelPosition == 'left' ? "label-left" : "label-top";
   var style = labelStyle + " " + labelPositionStyle + " " + borderStyle + " textfield-" + type;
-  var labelTxt = /*#__PURE__*/React.createElement(Text, null, label);
+
+  // Label text - support both string and React components
+  var labelTxt = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
   var placeholderTxt = site.translate ? site.translate(placeholder) : placeholder;
   return /*#__PURE__*/React.createElement("div", {
     className: style + " " + id + " " + className,
@@ -3964,7 +4034,24 @@ var TextArea = function TextArea(props) {
   }
   var labelStyle = label ? "" : "no-label";
   var style = "textarea " + labelStyle + " textarea-" + type;
-  var labelTxt = /*#__PURE__*/React.createElement(Text, null, label);
+
+  // Label text - support both string and React components
+  var labelTxt = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
   var placeholderTxt = site.translate ? site.translate(placeholder) : placeholder;
   return /*#__PURE__*/React.createElement("div", {
     className: "" + style,
@@ -4135,7 +4222,24 @@ var DateRange = function DateRange(props) {
     var next = Object.assign({}, form, (_Object$assign = {}, _Object$assign[id] = value, _Object$assign));
     setForm(next);
   }
-  var labelTxt = label ? /*#__PURE__*/React.createElement(Text, null, label) : null;
+
+  // Label text - support both string and React components
+  var labelTxt = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
   return /*#__PURE__*/React.createElement("div", {
     className: "date-range"
   }, label ? /*#__PURE__*/React.createElement("label", null, labelTxt) : null, /*#__PURE__*/React.createElement(TextField, {
@@ -4163,7 +4267,24 @@ var PasswordField = function PasswordField(props) {
   function toggle() {
     setShow(!show);
   }
-  var labelTxt = label ? /*#__PURE__*/React.createElement(Text, null, label) : null;
+
+  // Label text - support both string and React components
+  var labelTxt = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
   return /*#__PURE__*/React.createElement("div", {
     className: "password-field"
   }, /*#__PURE__*/React.createElement(TextField, {
@@ -9793,8 +9914,23 @@ var TextField2 = function TextField2(props) {
     autoComplete: autoComplete
   }, ariaAttributes, restProps);
 
-  // Label text
-  var labelTxt = label ? /*#__PURE__*/React.createElement(Text, null, label) : null;
+  // Label text - support both string and React components
+  var labelTxt = useMemo(function () {
+    if (!label) return null;
+
+    // If label is already a React element, use it directly
+    if (React.isValidElement(label)) {
+      return label;
+    }
+
+    // If label is a string, wrap it in Text component
+    if (typeof label === 'string') {
+      return /*#__PURE__*/React.createElement(Text, null, label);
+    }
+
+    // Fallback for other types (convert to string)
+    return /*#__PURE__*/React.createElement(Text, null, String(label));
+  }, [label]);
   var placeholderTxt = site != null && site.translate ? site.translate(placeholder) : placeholder;
 
   // Error/helper text
@@ -9872,8 +10008,8 @@ TextField2.propTypes = {
   type: PropTypes.oneOf(['text', 'email', 'password', 'number', 'tel', 'url', 'search', 'date', 'time', 'datetime-local', 'month', 'week', 'textarea']),
   /** Additional CSS classes */
   className: PropTypes.string,
-  /** Field label */
-  label: PropTypes.string,
+  /** Field label - can be string or React element */
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
   /** Label position */
   labelPosition: PropTypes.oneOf(['top', 'left']),
   /** Placeholder text */
@@ -13003,25 +13139,32 @@ var LoginBox = function LoginBox(_ref) {
   function ok(forcedPwd) {
     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 /*#__PURE__*/React.createElement(Text, null, txt);
   }
-  function changeUser(id, value) {
+  function changeUser(_, value) {
     setUser(value);
   }
-  function changePassword(id, value) {
+  function changePassword(_, value) {
     setPassword(value);
   }
   return /*#__PURE__*/React.createElement("div", {
     className: "login-box"
-  }, /*#__PURE__*/React.createElement("main", null, /*#__PURE__*/React.createElement(TextField, {
+  }, /*#__PURE__*/React.createElement("main", null, /*#__PURE__*/React.createElement(TextField2, {
+    id: "loginbox-user",
     label: tx(userLabel),
     value: user,
     onChange: changeUser,
     onEnter: ok,
     outlined: true,
-    autoComplete: "on"
-  }), /*#__PURE__*/React.createElement(TextField, {
+    autoComplete: "username",
+    required: true
+  }), /*#__PURE__*/React.createElement(TextField2, {
     id: "loginbox-password",
     label: tx(passwordLabel),
     value: password,
@@ -13029,7 +13172,8 @@ var LoginBox = function LoginBox(_ref) {
     onEnter: ok,
     type: "password",
     outlined: true,
-    autoComplete: "on"
+    autoComplete: "current-password",
+    required: true
   })), /*#__PURE__*/React.createElement("footer", null, loading ? /*#__PURE__*/React.createElement("div", {
     className: "load-box"
   }, /*#__PURE__*/React.createElement(Icon, {