@bouko/react 2.7.7 → 2.7.9

package/dist/components/input.d.ts

@@ -4,13 +4,14 @@ type FieldProps<T> = {
     label?: string;
     style?: string;
     value?: T;
-    update: (x: T) => void;
+    update?: (x: T) => void;
+    updateForm?: (id: string, x: T) => void;
     required?: boolean;
     disabled?: boolean;
     note?: ReactNode;
 };
 type Variant = "normal" | "ghost";
-type Props = Omit<FieldProps<string>, "id"> & {
+type Props<T> = FieldProps<T> & {
     type?: "text" | "number" | "email" | "password";
     variant?: Variant;
     style?: string;
@@ -34,5 +35,5 @@ type Props = Omit<FieldProps<string>, "id"> & {
  * @param {string} placeholder - Placeholder text for the input. (optional)
  * @param {Function} onEnter - Callback when `Enter` key is pressed. (optional)
 **/
-export default function Input({ type, variant, style, value, update, onEnter, disabled, placeholder, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export default function Input<T>({ id, type, variant, style, value, update, updateForm, onEnter, disabled, placeholder, ...props }: Props<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/input.js

@@ -25,8 +25,14 @@ const fieldStyles = {
  * @param {string} placeholder - Placeholder text for the input. (optional)
  * @param {Function} onEnter - Callback when `Enter` key is pressed. (optional)
 **/
-export default function Input({ type = "text", variant, style, value, update, onEnter, disabled, placeholder, ...props }) {
-    return (_jsx(Field, { ...props, children: _jsx("input", { type: type, className: cn(styles({ variant }), style), placeholder: placeholder, value: value, onChange: ({ target: { value } }) => update?.(value), onKeyUp: ({ key }) => key === "Enter" && value ? onEnter?.(value) : null, disabled: disabled }) }));
+export default function Input({ id, type = "text", variant, style, value, update, updateForm, onEnter, disabled, placeholder, ...props }) {
+    const handleUpdate = (value) => {
+        if (id && updateForm)
+            updateForm(id, value);
+        else if (update)
+            update(value);
+    };
+    return (_jsx(Field, { ...props, children: _jsx("input", { type: type, className: cn(styles({ variant }), style), placeholder: placeholder, value: value, onChange: ({ target: { value } }) => handleUpdate(value), onKeyUp: ({ key }) => key === "Enter" && value ? onEnter?.(value) : null, disabled: disabled }) }));
 }
 const styles = tv({
     base: "px-3 py-2 duration-200 rounded text-xs sm:text-sm placeholder:text-primary-darker text-primary disabled:brightness-90 disabled:cursor-not-allowed",

package/dist/components/progress.d.ts

@@ -0,0 +1,6 @@
+type Props = {
+    style?: string;
+    progress: number;
+};
+declare const ProgressBar: ({ style, progress }: Props) => import("react/jsx-runtime").JSX.Element;
+export default ProgressBar;

package/dist/components/progress.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "@bouko/style";
+const ProgressBar = ({ style, progress }) => (_jsx("div", { className: cn(styles.container, style), children: _jsx("div", { className: styles.filled, style: { width: (progress * 100) + "%" } }) }));
+const styles = {
+    container: "flex grow h-1 rounded-full bg-gray-800/70 overflow-hidden",
+    filled: "h-full bg-accent"
+};
+export default ProgressBar;

package/dist/index.d.ts

@@ -5,6 +5,7 @@ export { default as MultipleChoice } from "./components/multiple-choice";
 export { default as Attachment } from "./components/attachment";
 export { default as CheckBox } from "./components/checkbox";
 export { default as FadeCarousel } from "./components/fade-carousel";
+export { default as ProgressBar } from "./components/progress";
 export * from "./components";
 export * from "./components/search-bar";
 export * from "./core/types";

package/dist/index.js

@@ -5,6 +5,7 @@ export { default as MultipleChoice } from "./components/multiple-choice";
 export { default as Attachment } from "./components/attachment";
 export { default as CheckBox } from "./components/checkbox";
 export { default as FadeCarousel } from "./components/fade-carousel";
+export { default as ProgressBar } from "./components/progress";
 export * from "./components";
 export * from "./components/search-bar";
 export * from "./core/types";

package/package.json

@@ -1,7 +1,7 @@
 {
 
   "name": "@bouko/react",
-  "version": "2.7.7",
+  "version": "2.7.9",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",