wassname/stampy-chat
1
0
Fork 0
mirror of https://github.com/wassname/stampy-chat.git synced 2026-09-10 12:40:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

multiline text input support

Browse Source
This commit is contained in:
Fraser
2023-03-28 22:47:25 -04:00
parent 825fa40fc3
commit 7e18467b2a
3 changed files with 73 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/package-lock.json
Generated
+61 -3
View File
@@ -8,9 +8,11 @@
"name": "alignment_search",
"version": "0.1.0",
"dependencies": {
"autosize": "^6.0.1",
"next": "^13.2.4",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-textarea-autosize": "^8.4.1",
"zod": "^3.20.6"
},
"devDependencies": {
@@ -35,7 +37,6 @@
"version": "7.21.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.0.tgz",
"integrity": "sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==",
"dev": true,
"dependencies": {
"regenerator-runtime": "^0.13.11"
},
@@ -932,6 +933,11 @@
"postcss": "^8.1.0"
}
},
"node_modules/autosize": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/autosize/-/autosize-6.0.1.tgz",
"integrity": "sha512-f86EjiUKE6Xvczc4ioP1JBlWG7FKrE13qe/DxBCpe8GCipCq2nFw73aO8QEBKHfSbYGDN5eB9jXWKen7tspDqQ=="
},
"node_modules/available-typed-arrays": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
@@ -3695,6 +3701,22 @@
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
"dev": true
},
"node_modules/react-textarea-autosize": {
"version": "8.4.1",
"resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.4.1.tgz",
"integrity": "sha512-aD2C+qK6QypknC+lCMzteOdIjoMbNlgSFmJjCV+DrfTPwp59i/it9mMNf2HDzvRjQgKAyBDPyLJhcrzElf2U4Q==",
"dependencies": {
"@babel/runtime": "^7.20.13",
"use-composed-ref": "^1.3.0",
"use-latest": "^1.2.1"
},
"engines": {
"node": ">=10"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -3719,8 +3741,7 @@
"node_modules/regenerator-runtime": {
"version": "0.13.11",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
"integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==",
"dev": true
"integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="
},
"node_modules/regexp.prototype.flags": {
"version": "1.4.3",
@@ -4290,6 +4311,43 @@
"punycode": "^2.1.0"
}
},
"node_modules/use-composed-ref": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/use-composed-ref/-/use-composed-ref-1.3.0.tgz",
"integrity": "sha512-GLMG0Jc/jiKov/3Ulid1wbv3r54K9HlMW29IWcDFPEqFkSO2nS0MuefWgMJpeHQ9YJeXDL3ZUF+P3jdXlZX/cQ==",
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/use-isomorphic-layout-effect": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz",
"integrity": "sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==",
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/use-latest": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/use-latest/-/use-latest-1.2.1.tgz",
"integrity": "sha512-xA+AVm/Wlg3e2P/JiItTziwS7FK92LWrDB0p+hgXloIMuVCeJJ8v6f0eeHyPZaJrM+usM1FkFfbNCrJGs8A/zw==",
"dependencies": {
"use-isomorphic-layout-effect": "^1.1.1"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/util-deprecate": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
web/package.json
+2
View File
@@ -9,9 +9,11 @@
"start": "next start"
},
"dependencies": {
"autosize": "^6.0.1",
"next": "^13.2.4",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-textarea-autosize": "^8.4.1",
"zod": "^3.20.6"
},
"devDependencies": {
web/src/pages/index.tsx
+10 -4
View File
@@ -1,6 +1,7 @@
import { type NextPage } from "next";
import React from "react";
import { useState, useEffect } from "react";
import TextareaAutosize from 'react-textarea-autosize';
import Head from "next/head";
type Entry = {
@@ -36,7 +37,7 @@ const Home: NextPage = () => {
const [ query, setQuery ] = useState("");
const [ loading, setLoading ] = useState(false);
const inputRef = React.useRef<HTMLInputElement>(null);
const inputRef = React.useRef<HTMLTextAreaElement>(null);
const search = async (query: string) => {
@@ -113,14 +114,19 @@ const Home: NextPage = () => {
await search(query);
}}>
<input
type="text"
className="border border-gray-300 px-1 flex-1"
<TextareaAutosize
className="border border-gray-300 px-1 flex-1 resize-none"
ref={inputRef}
value={query}
onChange={(e) => setQuery(e.target.value)}
onKeyDown={(e) => {
// if <esc>, blur the input box
if (e.key === "Escape") e.currentTarget.blur();
// if <enter> without <shift>, submit the form (if it's not empty)
if (e.key === "Enter" && !e.shiftKey) {
e.preventDefault();
if (query.trim() !== "") search(query);
}
}}
/>
<button className="ml-2" type="submit" disabled={loading}>