diff options
author | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2025-03-11 17:43:05 +0100 |
---|---|---|
committer | Nathan-SR <144961007+Nathan-SR@users.noreply.github.com> | 2025-03-11 17:43:05 +0100 |
commit | fa937182bc93aa2c6faadda80ea998cdfd479b4e (patch) | |
tree | cba8e16edcccc6fd2932173484ac444cb79abea2 /src/client/views/newlightbox/components/EditableText/EditableText.tsx | |
parent | cf91c46cfec6e3e36b9184764016f9c1b5c997d4 (diff) | |
parent | 04669ffeb163688c7aefd7b5face7998252abdca (diff) |
Merge branch 'master' of https://github.com/brown-dash/Dash-Web into DocCreatorMenu-work
Diffstat (limited to 'src/client/views/newlightbox/components/EditableText/EditableText.tsx')
-rw-r--r-- | src/client/views/newlightbox/components/EditableText/EditableText.tsx | 73 |
1 files changed, 21 insertions, 52 deletions
diff --git a/src/client/views/newlightbox/components/EditableText/EditableText.tsx b/src/client/views/newlightbox/components/EditableText/EditableText.tsx index e9e7ca264..cff84e990 100644 --- a/src/client/views/newlightbox/components/EditableText/EditableText.tsx +++ b/src/client/views/newlightbox/components/EditableText/EditableText.tsx @@ -1,16 +1,16 @@ -import * as React from 'react' -import './EditableText.scss' -import { Size } from 'browndash-components' +import * as React from 'react'; +import './EditableText.scss'; +import { Size } from '@dash/components'; export interface IEditableTextProps { - text: string - placeholder?: string - editing: boolean - onEdit: (newText: string) => void - setEditing: (editing: boolean) => void - backgroundColor?: string - size?: Size - height?: number + text: string; + placeholder?: string; + editing: boolean; + onEdit: (newText: string) => void; + setEditing: (editing: boolean) => void; + backgroundColor?: string; + size?: Size; + height?: number; } /** @@ -20,46 +20,15 @@ export interface IEditableTextProps { * @returns */ export const EditableText = (props: IEditableTextProps) => { - const { - editing, - height, - size, - text, - onEdit, - setEditing, - backgroundColor, - placeholder, - } = props + const { editing, height, text, onEdit, setEditing, backgroundColor, placeholder } = props; - const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => { - onEdit(event.target.value) - } + const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => { + onEdit(event.target.value); + }; - return editing ? ( - <input - style={{ background: backgroundColor, height: height }} - placeholder={placeholder} - size={1} - className="lb-editableText" - autoFocus - onChange={handleOnChange} - onBlur={() => setEditing(false)} - defaultValue={text} - ></input> - ) : ( - <input - style={{ background: backgroundColor, height: height }} - placeholder={placeholder} - size={1} - className="lb-editableText" - autoFocus - onChange={handleOnChange} - onBlur={() => setEditing(false)} - defaultValue={text} - ></input> - // <div className="lb-displayText" onClick={(e) => { - // e.stopPropagation() - // setEditing(true) - // }}>{text}</div> - ) -} + return editing ? ( + <input style={{ background: backgroundColor, height: height }} placeholder={placeholder} size={1} className="lb-editableText" autoFocus onChange={handleOnChange} onBlur={() => setEditing(false)} defaultValue={text}></input> + ) : ( + <input style={{ background: backgroundColor, height: height }} placeholder={placeholder} size={1} className="lb-editableText" autoFocus onChange={handleOnChange} onBlur={() => setEditing(false)} defaultValue={text}></input> + ); +}; |