@canonical/react-components 0.54.0 → 0.56.0

package/dist/components/Accordion/AccordionSection/AccordionSection.d.ts

@@ -20,11 +20,11 @@ export type Props = {
      * An optional key to be used to track which section is selected.
      */
     sectionKey?: string;
-    setExpanded?: (key: string | null, title: string | null) => void;
+    setExpanded?: (key: string | null, title: ReactNode | null) => void;
     /**
      * The title of the section.
      */
-    title?: string;
+    title?: ReactNode;
     /**
      * Optional string describing heading element that should be used for the section titles.
      */

package/dist/components/Textarea/Textarea.d.ts

@@ -56,6 +56,10 @@ export type Props = PropsWithSpread<{
      * Optional class(es) to pass to the wrapping Field component
      */
     wrapperClassName?: string;
+    /**
+     * Function to occur on keyboard event, 'CTRL + Enter'
+     */
+    onControlEnter?: () => void;
 }, TextareaHTMLAttributes<HTMLTextAreaElement>>;
-declare const Textarea: ({ caution, className, error, grow, help, id, label, labelClassName, onKeyUp, required, stacked, style, success, takeFocus, wrapperClassName, ...props }: Props) => JSX.Element;
+declare const Textarea: ({ caution, className, error, grow, help, id, label, labelClassName, onKeyUp, onControlEnter, required, stacked, style, success, takeFocus, wrapperClassName, ...props }: Props) => JSX.Element;
 export default Textarea;

package/dist/components/Textarea/Textarea.js

@@ -27,6 +27,7 @@ const Textarea = _ref => {
     label,
     labelClassName,
     onKeyUp,
+    onControlEnter,
     required,
     stacked,
     style,
@@ -42,6 +43,17 @@ const Textarea = _ref => {
   const [innerValue, setInnervalue] = (0, _react.useState)(props.defaultValue);
   const defaultTextAreaId = (0, _react.useId)();
   const textAreaId = id || defaultTextAreaId;
+  const handleKeyDown = (0, _react.useCallback)(event => {
+    if (event.key === "Enter" && (event.ctrlKey || event.metaKey) && document.activeElement === textareaRef.current) {
+      onControlEnter();
+    }
+  }, [onControlEnter]);
+  (0, _react.useEffect)(() => {
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [handleKeyDown]);
   (0, _react.useEffect)(() => {
     if (takeFocus) {
       textareaRef.current.focus();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canonical/react-components",
-  "version": "0.54.0",
+  "version": "0.56.0",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "author": "Huw Wilkins <huw.wilkins@canonical.com>",