First Commit

src/Input.tsx

@@ -0,0 +1,81 @@
+import { h, JSX } from "preact";
+
+export function Input({
+   className,
+   children,
+   ...props
+}: JSX.HTMLAttributes<HTMLInputElement>) {
+   return (
+      <input className={"ht-inp " + className} {...props}>
+         {children}
+      </input>
+   );
+}
+
+export function TextArea({
+   className,
+   children,
+   ...props
+}: JSX.HTMLAttributes<HTMLTextAreaElement>) {
+   return (
+      <textarea className={"ht-inp " + className} {...props}>
+         {children}
+      </textarea>
+   );
+}
+
+export function InputGroup({
+   className,
+   children,
+   ...props
+}: JSX.HTMLAttributes<HTMLDivElement>) {
+   return (
+      <div className={"ht-input-group " + className} {...props}>
+         {children}
+      </div>
+   );
+}
+
+export interface IInputCheckboxProps {
+   label: string;
+}
+export function InputCheckbox({
+   label,
+   ...props
+}: IInputCheckboxProps & JSX.HTMLAttributes<HTMLInputElement>) {
+   return (
+      <label class="ht-input-checkbox">
+         {label}
+         <input type="checkbox" {...props} />
+         <span></span>
+      </label>
+   );
+}
+
+export interface IInputRadioProps {
+   label: string;
+}
+export function InputRadio({
+   label,
+   ...props
+}: IInputCheckboxProps & JSX.HTMLAttributes<HTMLInputElement>) {
+   return (
+      <label class="ht-input-checkbox">
+         {label}
+         <input type="radio" {...props} />
+         <span></span>
+      </label>
+   );
+}
+
+export function InputSelect({
+   className,
+   children,
+   ...props
+}: JSX.HTMLAttributes<HTMLSelectElement>) {
+   return (
+      <select className={"ht-inp " + className} {...props}>
+         {children}
+      </select>
+   );
+}