shiyue/kan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update workspace slug

Browse Source
This commit is contained in:
Henry
2025-01-01 14:42:16 +00:00
parent d05655ac9e
commit b5dc9433db
6 changed files with 144 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
apps/web/src/components/Input.tsx
View File

@@ -1,8 +1,10 @@
import React, { forwardRef } from "react";
import ContentEditable from "react-contenteditable";
import { twMerge } from "tailwind-merge";
interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
contentEditable?: boolean;
prefix?: string;
value?: string;
errorMessage?: string;
onChange?: (
@@ -11,26 +13,39 @@ interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
}
const Input = forwardRef<HTMLInputElement, InputProps>(
({ contentEditable, errorMessage, value, onChange, ...props }, ref) => {
(
{ contentEditable, errorMessage, prefix, value, onChange, ...props },
ref,
) => {
if (contentEditable) {
return (
<ContentEditable
placeholder={props.placeholder}
html={value ?? ""}
onChange={onChange}
className="block min-h-[70px] w-full cursor-text rounded-md border-0 bg-dark-300 bg-white/5 px-3 py-1.5 text-light-900 text-neutral-900 shadow-sm ring-1 ring-inset ring-light-600 focus:ring-2 focus:ring-inset focus:ring-light-600 focus-visible:outline-none dark:text-dark-1000 dark:ring-dark-700 dark:focus:ring-dark-700 sm:text-sm sm:leading-6"
className="block min-h-[70px] w-full cursor-text rounded-md border-0 bg-dark-300 bg-white/5 px-3 py-1.5 text-light-900 shadow-sm ring-1 ring-inset ring-light-600 focus:ring-2 focus:ring-inset focus:ring-light-600 focus-visible:outline-none dark:text-dark-1000 dark:ring-dark-700 dark:focus:ring-dark-700 sm:text-sm sm:leading-6"
/>
);
}
return (
<div className="flex w-full flex-col gap-1">
<input
ref={ref}
onChange={onChange}
className="block w-full rounded-md border-0 bg-dark-300 bg-white/5 py-1.5 shadow-sm ring-1 ring-inset ring-light-600 placeholder:text-dark-800 focus:ring-2 focus:ring-inset focus:ring-light-700 dark:text-dark-1000 dark:ring-dark-700 dark:focus:ring-dark-700 sm:text-sm sm:leading-6"
{...props}
/>
<div className="flex">
{prefix && (
<div className="flex shrink-0 items-center rounded-l-md border border-r-0 border-light-600 px-3 text-base dark:border-dark-700 sm:text-sm/6">
{prefix}
</div>
)}
<input
ref={ref}
onChange={onChange}
className={twMerge(
"block w-full rounded-md border-0 bg-dark-300 bg-white/5 py-1.5 shadow-sm ring-1 ring-inset ring-light-600 placeholder:text-dark-800 focus:ring-2 focus:ring-inset focus:ring-light-700 dark:text-dark-1000 dark:ring-dark-700 dark:focus:ring-dark-700 sm:text-sm sm:leading-6",
prefix && "rounded-l-none",
)}
{...props}
/>
</div>
{errorMessage && (
<div className="text-xs text-red-500">{errorMessage}</div>
)}