@mackin.com/styleguide 8.6.2 → 8.7.0

package/index.d.ts

@@ -709,11 +709,14 @@ interface SearchBoxProps {
     id?: string;
     placeholder?: string;
     round?: boolean;
-    className?: string;
     onSubmit?: () => Promise<void>;
     /** Defaults to 250ms */
     debounceMs?: number;
     autoFocus?: boolean;
+    /** This will be applied to the containing element (Form). */
+    className?: string;
+    buttonClassName?: string;
+    inputClassName?: string;
 }
 declare const SearchBox: (props: SearchBoxProps) => JSX.Element;
 

package/index.js

@@ -3772,14 +3772,14 @@ const SearchBox = (props) => {
         return (_c = props.onSubmit) === null || _c === void 0 ? void 0 : _c.call(props);
     });
     const theme = useThemeSafely();
-    const submitButton = (React__namespace.createElement(Button, { tabIndex: -1, disabled: waiting, readOnly: !props.onSubmit, type: "submit", className: css.css({
+    const submitButton = (React__namespace.createElement(Button, { tabIndex: -1, disabled: waiting, readOnly: !props.onSubmit, type: "submit", className: css.cx(css.css({
             color: `${theme.colors.font} !important;`,
             fontSize: '1rem'
-        }), variant: "icon", small: true },
+        }), props.buttonClassName), variant: "icon", small: true },
         React__namespace.createElement(Icon, { id: waiting ? 'waiting' : 'search', spin: waiting })));
     //TB: FUTURE replace with new inputs
     return (React__namespace.createElement(Form, { role: "search", className: css.cx('searchBox', props.className), onSubmit: onSubmit },
-        React__namespace.createElement(Input, { autoFocus: props.autoFocus, id: props.id, debounceMs: props.debounceMs, disabled: waiting, type: "text", value: props.value, placeholder: props.placeholder, round: props.round, onChange: props.onChange, rightControl: submitButton })));
+        React__namespace.createElement(Input, { inputClassName: props.inputClassName, autoFocus: props.autoFocus, id: props.id, debounceMs: props.debounceMs, disabled: waiting, type: "text", value: props.value, placeholder: props.placeholder, round: props.round, onChange: props.onChange, rightControl: submitButton })));
 };
 
 const GlobalStyles = (p) => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mackin.com/styleguide",
-    "version": "8.6.2",
+    "version": "8.7.0",
     "description": "",
     "main": "./index.js",
     "types": "./index.d.ts",