#117 - Added single line support

assets/media/styles.css

@@ -437,6 +437,7 @@ input:checked + .field__toggle__slider:before {
   margin-right: .5rem;
 }
 
+.metadata_field__input, .metadata_field__input:focus,
 .metadata_field__textarea, .metadata_field__textarea:focus {
   outline: none;
 }

package.json

@@ -270,6 +270,10 @@
                       "items": {
                         "type": "string"
                       }
+                    },
+                    "single": {
+                      "type": "string",
+                      "description": "Is a single line field"
                     }
                   },
                   "additionalProperties": false,

src/extension.ts

@@ -167,6 +167,12 @@ export async function activate(context: vscode.ExtensionContext) {
 	// Inserting an image in Markdown
 	subscriptions.push(vscode.commands.registerCommand(COMMAND_NAME.insertImage, Article.insertImage));
 
+	vscode.workspace.onDidRenameFiles(async (e) => {
+		if (e.files.length > 0) {
+			console.log('Renamed files: ', e.files);
+		}
+	});
+
 	// Subscribe all commands
 	subscriptions.push(
 		insertTags,

src/models/PanelSettings.ts

@@ -28,6 +28,7 @@ export interface Field {
   name: string;
   type: "string" | "number" | "datetime" | "boolean" | "image" | "choice" | "tags" | "categories";
   choices?: string[];
+  single?: boolean;
 }
 
 export interface DateInfo {

src/panelWebView/components/Fields/TextField.tsx

@@ -5,12 +5,13 @@ import { VsLabel } from '../VscodeComponents';
 export interface ITextFieldProps {
   label: string;
   value: string | null;
+  singleLine: boolean | undefined;
   limit: number | undefined;
   rows?: number;
   onChange: (txtValue: string) => void;
 }
 
-export const TextField: React.FunctionComponent<ITextFieldProps> = ({limit, label, value, rows, onChange}: React.PropsWithChildren<ITextFieldProps>) => {
+export const TextField: React.FunctionComponent<ITextFieldProps> = ({singleLine, limit, label, value, rows, onChange}: React.PropsWithChildren<ITextFieldProps>) => {
   const [ text, setText ] = React.useState<string | null>(value);
   
   const onTextChange = (txtValue: string) => {
@@ -37,13 +38,28 @@ export const TextField: React.FunctionComponent<ITextFieldProps> = ({limit, labe
         </div>
       </VsLabel>
       
-      <textarea
-        className={`metadata_field__textarea`}
-        rows={rows || 2}
-        value={text || ""}  
-        onChange={(e) => onTextChange(e.currentTarget.value)} style={{
-        border: isValid ? "1px solid var(--vscode-inputValidation-infoBorder)" : "1px solid var(--vscode-inputValidation-warningBorder)"
-      }} />
+      {
+        singleLine ? (
+          <input 
+            className={`metadata_field__input`}
+            value={text || ""}
+            onChange={(e) => onTextChange(e.currentTarget.value)} 
+            style={{
+              border: isValid ? "1px solid var(--vscode-inputValidation-infoBorder)" : "1px solid var(--vscode-inputValidation-warningBorder)"
+            }} />
+        ) : (
+          <textarea
+            className={`metadata_field__textarea`}
+            rows={rows || 2}
+            value={text || ""}  
+            onChange={(e) => onTextChange(e.currentTarget.value)} 
+            style={{
+              border: isValid ? "1px solid var(--vscode-inputValidation-infoBorder)" : "1px solid var(--vscode-inputValidation-warningBorder)"
+            }} />
+        )
+      }
+
+      
 
       {
         limit && limit > 0 && (text || "").length > limit && (

src/panelWebView/components/Metadata.tsx

@@ -99,6 +99,7 @@ export const Metadata: React.FunctionComponent<IMetadataProps> = ({settings, met
           <TextField 
             key={field.name}
             label={field.title || field.name}
+            singleLine={field.single}
             limit={limit}
             rows={3}
             onChange={(value) => sendUpdate(field.name, value)}