@altiore/form
Advanced tools
Comparing version 0.2.1 to 0.2.2
@@ -10,7 +10,7 @@ import React from 'react'; | ||
} | ||
export interface FieldProps { | ||
export declare type FieldProps<T extends Record<string, unknown> = Record<string, unknown>> = T & { | ||
name: string; | ||
component?: React.ComponentType<InputProps>; | ||
component?: React.ComponentType<InputProps & T>; | ||
validate?: (value: unknown) => string | undefined; | ||
} | ||
export declare const Field: React.FC<FieldProps>; | ||
}; | ||
export declare const Field: <T extends Record<string, unknown> = Record<string, unknown>>({ name, component, validate, ...props }: FieldProps<T>) => JSX.Element; |
@@ -0,5 +1,27 @@ | ||
var __assign = (this && this.__assign) || function () { | ||
__assign = Object.assign || function(t) { | ||
for (var s, i = 1, n = arguments.length; i < n; i++) { | ||
s = arguments[i]; | ||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) | ||
t[p] = s[p]; | ||
} | ||
return t; | ||
}; | ||
return __assign.apply(this, arguments); | ||
}; | ||
var __rest = (this && this.__rest) || function (s, e) { | ||
var t = {}; | ||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) | ||
t[p] = s[p]; | ||
if (s != null && typeof Object.getOwnPropertySymbols === "function") | ||
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { | ||
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) | ||
t[p[i]] = s[p[i]]; | ||
} | ||
return t; | ||
}; | ||
import React, { useCallback, useEffect, useState } from 'react'; | ||
import _debounce from 'lodash/debounce'; | ||
export var Field = function (_a) { | ||
var name = _a.name, Input = _a.component, validate = _a.validate; | ||
var name = _a.name, component = _a.component, validate = _a.validate, props = __rest(_a, ["name", "component", "validate"]); | ||
var _b = useState({ | ||
@@ -26,3 +48,3 @@ valid: true, | ||
if (input) { | ||
input.addEventListener('keyup', handleKeyUp); | ||
validate && input.addEventListener('keyup', handleKeyUp); | ||
} | ||
@@ -34,7 +56,8 @@ else { | ||
if (input) { | ||
input.removeEventListener('keyup', handleKeyUp); | ||
validate && input.removeEventListener('keyup', handleKeyUp); | ||
} | ||
}; | ||
}, []); | ||
return (React.createElement(React.Fragment, null, Input ? React.createElement(Input, { name: name, meta: meta }) : React.createElement("input", { name: name }))); | ||
}, [validate]); | ||
var Input = component; | ||
return (React.createElement(React.Fragment, null, Input ? (React.createElement(Input, __assign({ name: name, meta: meta }, props))) : (React.createElement("input", { name: name })))); | ||
}; |
{ | ||
"name": "@altiore/form", | ||
"version": "0.2.1", | ||
"version": "0.2.2", | ||
"description": "Form helper for building powerful forms", | ||
@@ -18,3 +18,3 @@ "main": "dist/index.js", | ||
"lint": "tsc --noEmit && prettier --write \"**/*.{js,jsx,ts,tsx,json,md,yml}\" && eslint . --fix --ext .js,.jsx,.ts,.tsx --max-warnings=0", | ||
"lint:ci": "tsc --noEmit && prettier \"**/*.{js,jsx,ts,tsx,json,md,yml}\" && eslint . --ext .js,.jsx,.ts,.tsx --max-warnings=0", | ||
"lint:ci": "tsc --noEmit && prettier --check \"**/*.{js,jsx,ts,tsx,json,md,yml}\" && eslint . --ext .js,.jsx,.ts,.tsx --max-warnings=0", | ||
"prepublish": "npm run build", | ||
@@ -58,3 +58,3 @@ "prepare": "husky install", | ||
"@storybook/storybook-deployer": "^2.8.10", | ||
"@types/lodash": "4.14.173", | ||
"@types/lodash": "^4.14.173", | ||
"@types/node": "16.4.9", | ||
@@ -61,0 +61,0 @@ "@typescript-eslint/eslint-plugin": "4.28.5", |
7100
103