Add min and max heights to Autosize Code editor

.github/workflows/ci.yml

@@ -32,3 +32,11 @@ jobs:
 
       - name: Run tests
         run: npm run test:ci
+
+      - name: Upload coverage to Codecov
+        uses: codecov/codecov-action@v4
+        with:
+          directory: ./packages
+          env_vars: OS,PYTHON
+          token: ${{ secrets.CODECOV_TOKEN }}
+          fail_ci_if_error: false

packages/components/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## 1.6.1 (2024-03-13)
+
+### Features
+
+- Add min and max heights to Autosize Code editor (#34)
+
 ## 1.6.0 (2024-02-29)
 
 ### Features

packages/components/package.json

@@ -83,5 +83,5 @@
     "typecheck": "tsc --emitDeclarationOnly false --noEmit"
   },
   "types": "dist/index.d.ts",
-  "version": "1.6.0"
+  "version": "1.6.1"
 }

packages/components/src/components/AutosizeCodeEditor/AutosizeCodeEditor.tsx

@@ -6,21 +6,29 @@ import { CODE_EDITOR_CONFIG } from '../../constants';
 /**
  * Properties
  */
-type Props = React.ComponentProps<typeof CodeEditor>;
+type Props = React.ComponentProps<typeof CodeEditor> & {
+  minHeight?: number;
+  maxHeight?: number;
+};
 
 /**
  * Get Height By Value
  * @param value
+ * @param minHeight
+ * @param maxHeight
  */
-const getHeightByValue = (value: string) => {
+const getHeightByValue = (value: string, minHeight?: number, maxHeight?: number) => {
   const height = value.split('\n').length * CODE_EDITOR_CONFIG.lineHeight;
 
-  if (height < CODE_EDITOR_CONFIG.height.min) {
-    return CODE_EDITOR_CONFIG.height.min;
+  const minCurrentHeight = minHeight || CODE_EDITOR_CONFIG.height.min;
+  const maxCurrentHeight = maxHeight || CODE_EDITOR_CONFIG.height.max;
+
+  if (height < minCurrentHeight) {
+    return minCurrentHeight;
   }
 
-  if (height > CODE_EDITOR_CONFIG.height.max) {
-    return CODE_EDITOR_CONFIG.height.max;
+  if (height > maxCurrentHeight) {
+    return maxCurrentHeight;
   }
 
   return height;
@@ -30,25 +38,32 @@ const getHeightByValue = (value: string) => {
  * Autosize Code Editor
  * @constructor
  */
-export const AutosizeCodeEditor: React.FC<Props> = ({ value, onChange, height: staticHeight, ...restProps }) => {
+export const AutosizeCodeEditor: React.FC<Props> = ({
+  value,
+  onChange,
+  minHeight,
+  maxHeight,
+  height: staticHeight,
+  ...restProps
+}) => {
   /**
    * Height
    */
-  const [height, setHeight] = useState(getHeightByValue(value));
+  const [height, setHeight] = useState(getHeightByValue(value, minHeight, maxHeight));
 
   /**
    * Update Height on value change
    */
   useEffect(() => {
-    setHeight(getHeightByValue(value));
-  }, [value]);
+    setHeight(getHeightByValue(value, minHeight, maxHeight));
+  }, [value, minHeight, maxHeight]);
 
   return (
     <CodeEditor
       value={value}
       onChange={(value) => {
         onChange?.(value);
-        setHeight(getHeightByValue(value));
+        setHeight(getHeightByValue(value, minHeight, maxHeight));
       }}
       height={staticHeight ?? height}
       {...restProps}