From c39ce54014592ab866d7fed31b431ff1c96bc836 Mon Sep 17 00:00:00 2001
From: Lukas Lohoff <lohoff@terrestris.de>
Date: Mon, 18 Nov 2024 11:53:33 +0100
Subject: [PATCH] fix: enable drawbutton autofocus on text area
---
src/FeatureLabelModal/FeatureLabelModal.tsx | 10 ++++++++--
1 file changed, 8 insertions(+), 2 deletions(-)
diff --git a/src/FeatureLabelModal/FeatureLabelModal.tsx b/src/FeatureLabelModal/FeatureLabelModal.tsx
index 2f68c8314a..af9ff89ec8 100644
--- a/src/FeatureLabelModal/FeatureLabelModal.tsx
+++ b/src/FeatureLabelModal/FeatureLabelModal.tsx
@@ -1,10 +1,10 @@
import StringUtil from '@terrestris/base-util/dist/StringUtil/StringUtil';
-import { Modal, ModalProps } from 'antd';
+import { InputRef, Modal, ModalProps } from 'antd';
import TextArea from 'antd/lib/input/TextArea';
import Feature from 'ol/Feature';
import Geometry from 'ol/geom/Geometry';
import * as React from 'react';
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
type OwnProps = {
feature: Feature<Geometry>;
@@ -29,6 +29,8 @@ export const FeatureLabelModal: React.FC<FeatureLabelModalProps> = ({
const [label, setLabel] = useState<string>('');
const [showPrompt, setShowPrompt] = useState<boolean>(false);
+ const inputRef = useRef<InputRef>(null);
+
useEffect(() => {
if (feature) {
setLabel(feature.get('label') ?? '');
@@ -55,12 +57,16 @@ export const FeatureLabelModal: React.FC<FeatureLabelModalProps> = ({
closable={false}
onOk={onOkInternal}
onCancel={onCancel}
+ afterOpenChange={(open) => {
+ open && inputRef.current?.focus();
+ }}
{...passThroughProps}
>
<TextArea
value={label}
onChange={e => setLabel(e.target.value)}
autoSize
+ ref={inputRef}
/>
</Modal>;
};