Le plugin officiel FormKit Inputs. Ce package contient le code source pour tous les types d'entrée HTML natifs. Lisez la documentation des entrées pour les instructions d'utilisation.
Applique des attributs à une section de schéma donnée en appliquant une fonction d'ordre supérieur qui fusionne un ensemble donné d'attributs dans le nœud.
$attrs(attrs: FormKitSchemaAttributes | (() => FormKitSchemaAttributes), section: FormKitSchemaExtendableSection): FormKitSchemaExtendableSection;
attrs
— Attributs à appliquer à une FormKitSchemaExtendableSection.section
— Une section à laquelle appliquer des attributs.FormKitSchemaExtendableSection
Étend un nœud de schéma avec un ensemble donné d'extensions.
$extend(section: FormKitSchemaExtendableSection, extendWith: Partial<FormKitSchemaNode>): FormKitSchemaExtendableSection;
section
— Une section à laquelle appliquer une extension.extendWith
— Un extrait de schéma partiel à appliquer à la section.FormKitSchemaExtendableSection
Applique une condition à une section de schéma donnée.
$for(varName: string, inName: string, section: FormKitSchemaExtendableSection): (extensions: Record<string, Partial<FormKitSchemaNode>>) => FormKitSchemaNode;
varName
— Le nom de la variable qui contient l'instance actuelle.inName
— La variable sur laquelle nous itérons.section
— Une section à répéter.FormKitSchemaExtendableSection
Applique une condition à une section de schéma donnée.
$if(condition: string, then: FormKitSchemaExtendableSection, otherwise?: FormKitSchemaExtendableSection): FormKitSchemaExtendableSection;
condition
— Une condition de schéma à appliquer à une section.then
— La section qui s'applique si la condition est vraie.otherwise
optionnel — (sinon) La section qui s'applique si la condition est fausse.FormKitSchemaExtendableSection
Crée une section racine du schéma.
$root(section: FormKitSchemaExtendableSection): FormKitExtendableSchemaRoot;
section
— Une section à transformer en racine.FormKitSchemaExtendableSection
Une fonctionnalité qui ajoute le support de la sélection par cases à cocher.
checkboxes(node: FormKitNode): void;
node
— Un FormKitNode.Ajoute une définition de propriétés d'icône.
defaultIcon(sectionKey: string, defaultIcon: string): (node: FormKitNode) => void;
sectionKey
— l'emplacement où l'icône doit être chargée.defaultIcon
— l'icône qui doit être chargée si une correspondance est trouvée dans le CSS de l'utilisateur.Un FormKitPlugin.
Une fonctionnalité pour ajouter le support de la gestion des fichiers à une entrée.
files(node: FormKitNode): void;
node
— Un FormKitNode.Une fonctionnalité qui garantit que l'entrée a une propriété initialValue
.
initialValue(node: FormKitNode): void;
node
— Un FormKitNode.Crée une nouvelle fonctionnalité qui génère un message de localisation de type ui pour utilisation sur un composant donné.
localize(key: string, value?: string): (node: FormKitNode) => void;
key
— La clé du message.value
* facultatif * — La valeur du message.Un FormKitPlugin.
Une fonctionnalité qui normalise les types de boîtes (cases à cocher, radios).
normalizeBoxes(node: FormKitNode): FormKitMiddleware<{
prop: string | symbol;
value: any;
}>;
node
— Un FormKitNode.Une fonctionnalité qui convertit la propriété options en valeurs utilisables, à utiliser par une fonctionnalité ou un plugin.
options(node: FormKitNode): void;
node
— Un FormKitNode.Une fonctionnalité pour vérifier si la valeur vérifiée est la valeur actuelle.
radios(node: FormKitNode): void;
node
— Un FormKitNode.Une fonctionnalité qui permet de convertir en nombres.
casts(node: FormKitNode): void;
node
— Un FormKitNode.Crée un plugin basé sur une liste de FormKitLibrary.
createLibraryPlugin(...libraries: FormKitLibrary[]): FormKitPlugin;
libraries
— Une ou plusieurs FormKitLibrary.Crée une nouvelle section réutilisable.
createSection(section: string, el: string | null | (() => FormKitSchemaNode), fragment: true): FormKitSection<FormKitExtendableSchemaRoot>;
createSection(section: string, el: string | null | (() => FormKitSchemaNode)): FormKitSection<FormKitSchemaExtendableSection>;
createSection(section: string, el: string | (() => FormKitSchemaNode), fragment: false): FormKitSection<FormKitSchemaExtendableSection>;
section
— Une seule section de schémael
— L'élément ou une fonction qui retourne un nœud de schéma.fragment
Retourne un FormKitExtendableSchemaRoot ou un FormKitSchemaExtendableSection.
Une fonctionnalité qui permet de désactiver les enfants de ce nœud.
disables(node: FormKitNode): void;
node
— Un FormKitNode.Exécute un rappel sur chaque section d'un schéma. Si stopOnCallbackReturn est vrai et que le rappel retourne une valeur, la boucle s'arrêtera et retournera cette valeur.
eachSection<T>(schema: FormKitSchemaDefinition, callback: (section: FormKitSchemaComponent | FormKitSchemaDOMNode, schemaParent: FormKitSchemaNode[], schema: FormKitSchemaCondition) => T, stopOnCallbackReturn?: boolean, schemaParent?: FormKitSchemaNode[]): T | void;
schema
— Un tableau FormKitSchemaNode.callback
— Un callback à exécuter sur chaque section.stopOnCallbackReturn
* facultatif * — Si vrai, la boucle s'arrêtera si le callback renvoie une valeur.schemaParent
* facultatif * — Le parent du nœud de schéma actuel.Étend un seul nœud de schéma avec une extension. L'extension peut être n'importe quel nœud partiel, y compris les chaînes.
extendSchema(schema: FormKitSchemaNode, extension?: Partial<FormKitSchemaNode>): FormKitSchemaNode;
schema
— Le nœud de schéma de base.extension
* facultatif * — Les valeurs à étendre sur le nœud de schéma de base.Trouve une section par nom dans un schéma.
findSection(schema: FormKitSchemaDefinition, target: string): [false, false] | [FormKitSchemaNode[] | false, FormKitSchemaCondition];
schema
— Un tableau FormKitSchemaDefinition.target
— Le nom de la section à trouver.un tuple du schéma et de la section ou un tuple de false
et false
si non trouvé.
Une fonctionnalité pour ajouter un gestionnaire de soumission et une section d'actions.
form(node: FormKitNode): void;
node
— Un FormKitNode.Une fonctionnalité qui applique ignore="true"
par défaut.
ignore(node: FormKitNode): void;
node
— Un FormKitNode.Un helper pour déterminer si une option est un groupe ou une option.
isGroupOption(option: FormKitOptionsItem | FormKitOptionsGroupItem | FormKitOptionsGroupItemProp): option is FormKitOptionsGroupItem;
option
— Une optionGarde de type pour les objets de schéma.
isSchemaObject(schema: Partial<FormKitSchemaNode>): schema is FormKitSchemaDOMNode | FormKitSchemaComponent | FormKitSchemaFormKit;
schema
— renvoie true
si le nœud est un nœud de schéma mais pas une chaîne ou conditionnelle.boolean
Vérifie si le nœud de schéma actuel est une condition de slot.
isSlotCondition(node: FormKitSchemaNode): node is {
if: string;
then: string;
else: FormKitSchemaNode | FormKitSchemaNode[];
};
node
— Un FormKitSchemaNode.boolean
{
if: '$slot.name',
then: '$slot.name',
else: []
} // ce nœud de schéma renverrait vrai.
Une fonction pour normaliser un tableau d'objets, un tableau de chaînes de caractères, ou un objet de clés-valeurs pour utiliser un tableau d'objets avec des propriétés de valeur et d'étiquette.
normalizeOptions<T extends FormKitOptionsPropWithGroups>(options: T): T extends FormKitOptionsProp ? FormKitOptionsList : FormKitOptionsListWithGroups;
options
— Un FormKitOptionsProp non normalisé.Une liste de FormKitOptionsList.
Renomme automatiquement toutes les entrées radio.
renamesRadios(node: FormKitNode): void;
node
— Un nœud formkit.Convertit la propriété options en valeurs utilisables.
select(node: FormKitNode): void;
node
— Un nœud formkit.Crée un schéma d'entrée avec tout le schéma de base enveloppant.
useSchema(inputSection: FormKitSection): FormKitSchemaExtendableSection;
inputSection
— Contenu à stocker dans la clé de section d'entrée.Événements d'entrée généraux disponibles pour toutes les entrées FormKit.
interface FormKitBaseEvents<Props extends FormKitInputs<Props>> {
(event:'input', value: PropType<Props, 'value'>, node: FormKitNode): any;
(event:'inputRaw', value: PropType<Props, 'value'>, node: FormKitNode): any;
(event:'input-raw', value: PropType<Props, 'value'>, node: FormKitNode): any;
(event:'update: modelValue', value: PropType<Props, 'value'>): any;
(event:'update: model-value', value: PropType<Props, 'value'>): any;
(event:'node', node: FormKitNode): any;
}
Props de base qui devraient être appliquées à toutes les entrées FormKit. Ce ne sont pas de véritables props d'exécution et sont extraites de l'objet context.attrs. Beaucoup de ces éléments sont simplement des attributs html qui sont transmis à l'élément d'entrée.
interface FormKitBaseProps {
accept: string;
action: string;
actions:'true' | 'false' | boolean;
dirtyBehavior:'touched' | 'compare';
disabled:'true' | 'false' | boolean;
enctype: string;
help: string;
ignore:'true' | 'false' | boolean;
label: string;
max: string | number;
method: string;
min: string | number;
multiple:'true' | 'false' | boolean;
placeholder: string;
preserve:'true' | 'false' | boolean;
preserveErrors:'true' | 'false' | boolean;
step: string | number;
}
Presque toutes les entrées dans FormKit ont un ensemble de slots "de base". C'est le "sandwich" autour de l'entrée elle-même, comme les wrappers, le texte d'aide, les messages d'erreur, etc. Plusieurs autres slots d'entrée étendent cette interface de base.
interface FormKitBaseSlots<Props extends FormKitInputs<Props>> {
help: FormKitSlotData<Props>;
inner: FormKitSlotData<Props>;
input: FormKitSlotData<Props>;
label: FormKitSlotData<Props>;
message: FormKitSlotData<Props, {
message: FormKitMessage;
}>;
messages: FormKitSlotData<Props>;
outer: FormKitSlotData<Props>;
prefix: FormKitSlotData<Props>;
prefixIcon: FormKitSlotData<Props>;
suffix: FormKitSlotData<Props>;
suffixIcon: FormKitSlotData<Props>;
wrapper: FormKitSlotData<Props>;
}
Les slots disponibles pour les entrées radio et checkbox lorsque des options sont fournies.
interface FormKitBoxSlots<Props extends FormKitInputs<Props>> {
box: FormKitSlotData<Props, OptionSlotData<Props>>;
decorator: FormKitSlotData<Props, OptionSlotData<Props>>;
decoratorIcon: FormKitSlotData<Props, OptionSlotData<Props>>;
fieldset: FormKitSlotData<Props>;
help: FormKitSlotData<Props>;
icon: FormKitSlotData<Props, OptionSlotData<Props>>;
inner: FormKitSlotData<Props, OptionSlotData<Props>>;
input: FormKitSlotData<Props, OptionSlotData<Props>>;
label: FormKitSlotData<Props, OptionSlotData<Props>>;
legend: FormKitSlotData<Props>;
message: FormKitSlotData<Props, {
message: FormKitMessage;
}>;
messages: FormKitSlotData<Props>;
option: FormKitSlotData<Props, OptionSlotData<Props>>;
optionHelp: FormKitSlotData<Props, OptionSlotData<Props>>;
options: FormKitSlotData<Props>;
prefix: FormKitSlotData<Props, OptionSlotData<Props>>;
suffix: FormKitSlotData<Props, OptionSlotData<Props>>;
wrapper: FormKitSlotData<Props, OptionSlotData<Props>>;
}
Ce sont des props qui sont utilisées comme conditionnelles dans une ou plusieurs entrées, et à ce titre, elles doivent être définies sur tous les types d'entrée. Celles-ci devraient toutes être définies explicitement comme "undefined" ici, puis définies comme leur type spécifique dans l'interface FormKitInputProps uniquement sur les entrées qui les utilisent.
interface FormKitConditionalProps {
number: undefined;
offValue: undefined;
onValue: undefined;
options: undefined;
}
Dans un monde parfait, cette interface ne serait pas du tout nécessaire. Cependant, Vue s'attend à ce que les interfaces soient définies comme des surcharges de méthodes. Malheureusement, comme notre interface d'événements utilise des génériques, UnionToIntersection n'est pas capable d'être utilisé, ce qui signifie que nous perdons des données d'événement si nous stockons les événements comme une interface standard avec des clés de propriété. La seule façon que nous avons trouvée pour obtenir de manière fiable que Volar (en juin 2023) reconnaisse correctement tous les événements définis est d'utiliser l'approche de surcharge de méthode "standard" (voir FormKitBaseEvents).
(En gros, nous ne pouvons pas utiliser les événements de cette interface pour produire automatiquement les FormKitBaseEvents sans que Volar ne perde des données d'événement)
Cela signifie que nous n'avons aucun moyen d'obtenir les noms d'événements de l'interface, donc nous ne pouvons pas les utiliser correctement dans nos props. Cela compte pour des choses comme le support TSX où les noms d'événements doivent être disponibles en tant que props onEventName
.
Cette interface est utilisée pour combler manuellement cette lacune dans le système de type. Ces types devraient correspondre 1-1 avec les événements définis dans FormKitBaseEvents ainsi que FormKitInputEvents.
interface FormKitEventsAsProps {
'onUpdate: modelValue': (value: unknown, node: FormKitNode) => any;
onInput: (value: unknown, node: FormKitNode) => any;
onInputRaw: (value: unknown, node: FormKitNode) => any;
onNode: (node: FormKitNode) => any;
}
Un seul objet de fichier dans la "FileList" synthétique de FormKit.
interface FormKitFile {
file?: File;
name: string;
}
Les slots disponibles pour l'entrée de fichier, celles-ci étendent les slots de base.
interface FormKitFileSlots<Props extends FormKitInputs<Props>> extends FormKitBaseSlots<Props> {
fileItem: FormKitSlotData<Props>;
fileItemIcon: FormKitSlotData<Props, {
file: FormKitFile;
}>;
fileList: FormKitSlotData<Props>;
fileName: FormKitSlotData<Props, {
file: FormKitFile;
}>;
fileRemove: FormKitSlotData<Props, {
file: FormKitFile;
}>;
fileRemoveIcon: FormKitSlotData<Props, {
file: FormKitFile;
}>;
noFiles: FormKitSlotData<Props>;
}
Événements uniques émis par chaque entrée FormKit. La forme de cette interface est :
interface FormKitInputEvents<Props extends Inputs> {
typeString: { customEvent: (value: PropType<Props, 'value'>) => any } // <-- Tous les événements uniques
}
Toutes les entrées hériteront également de tous les événements de FormKitBaseInputEvents.
interface FormKitInputEvents<Props extends FormKitInputs<Props>> {
form:{
(event:'submit-raw', e: Event, node: FormKitNode): any;
(event:'submit-invalid', node: FormKitNode): any;
(event:'submit', data: any, node: FormKitNode): any;
};
}
Voir le commentaire tome sur pourquoi ce type est nécessaire.
interface FormKitInputEventsAsProps<Props extends FormKitInputs<Props>> {
form:{
onSubmitRaw: (e: Event, node: FormKitNode) => any;
onSubmitInvalid: (node: FormKitNode) => any;
onSubmit: (data: any, node: FormKitNode) => any;
};
}
Ceci est l'interface de base pour fournir des définitions de props au composant FormKit. Il est utilisé pour définir les props qui sont disponibles pour chaque composant de la bibliothèque FormKit en utilisant un type d'union discriminé. La structure de cette interface est :
interface FormKitInputProps {
typeString: { type: 'string'; value?: string } // <-- Toutes les props uniques
}
Toutes les entrées hériteront également de toutes les props de FormKitBaseInputProps.
Note : Il est important que toutes les entrées fournissent une prop de type et de valeur.
interface FormKitInputProps<Props extends FormKitInputs<Props>> {
_:{
type?: Props['type']extendskeyofFormKitInputProps<Props>?never: Props['type'];
value?: string;
};
button:{
type:'button';
value?: undefined;
};
checkbox:{
type:'checkbox';
options?: FormKitOptionsProp;
onValue?: any;
offValue?: any;
value?: Props['options']extendsRecord<inferT, string>?T[]: Props['options']extendsFormKitOptionsItem[]?Array<Props['options'][number]['value']>: Props['options']extendsArray<inferT>?T[]: (Props['onValue']extendsAllReals?Props['onValue']: true) | (Props['offValue']extendsAllReals?Props['offValue']: false);
};
color:{
type:'color';
value?: string;
};
date:{
type:'date';
value?: string;
};
datetimeLocal:{
type:'datetimeLocal';
value?: string;
};
email:{
type:'email';
value?: string;
};
file:{
type:'file';
value?: FormKitFile[];
};
form:{
type:'form';
value?: FormKitGroupValue;
actions?: boolean | string;
submitAttrs?: Record<string, any>;
submitBehavior?:'disabled' | 'live';
incompleteMessage?: false | string;
};
group:{
type:'group';
value?: FormKitGroupValue;
};
hidden:{
type:'hidden';
value?: Props['number']extendsAllReals?number: string;
number?:'integer' | 'float' | 'true' | true;
};
list:{
type:'list';
value?: unknown[];
dynamic?: boolean | 'true' | 'false';
sync?: boolean | 'true' | 'false';
};
meta:{
type:'meta';
value?: any;
};
month:{
type:'month';
value?: string;
};
number:{
type:'number';
value?: Props['number']extendsAllReals?number: string;
number?:'integer' | 'float' | 'true' | true;
};
password:{
type:'password';
value?: string;
};
radio:{
type:'radio';
options: FormKitOptionsProp;
value?: FormKitOptionsValue<Props['options']>;
};
range:{
type:'range';
value?: Props['number']extendsAllReals?number: string;
number?:'integer' | 'float' | 'true' | true;
};
search:{
type:'search';
value?: Props['number']extendsAllReals?number | string: string;
number?:'integer' | 'float' | 'true' | true;
};
select:{
type:'select';
options?: FormKitOptionsPropWithGroups;
value?: FormKitOptionsValue<Props['options']>;
};
submit:{
type:'submit';
value?: string;
};
tel:{
type:'tel';
value?: Props['number']extendsAllReals?number | string: string;
number?:'integer' | 'float' | 'true' | true;
};
text:{
type:'text';
value?: Props['number']extendsAllReals?number | string: string;
number?:'integer' | 'float' | 'true' | true;
};
textarea:{
type:'textarea';
value?: string;
};
time:{
type:'time';
value?: string;
};
url:{
type:'url';
value?: string;
};
week:{
type:'week';
value?: string;
};
}
Slots fournis par chaque entrée FormKit. La forme de cette interface est :
interface FormKitInputSlots<Props extends Inputs> {
typeString: { default: (value: PropType<Props, 'value'>) => any } // <-- Tous les slots uniques
}
Il n'y a pas d'héritage automatique des slots — chaque slot doit être explicitement défini pour chaque entrée.
interface FormKitInputSlots<Props extends FormKitInputs<Props>> {
'datetime-local': FormKitTextSlots<Props>;
button: FormKitButtonSlots<Props>;
checkbox: Props['options']extendsAllReals?FormKitBoxSlots<Props>: FormKitBaseSlots<Props>;
color: FormKitTextSlots<Props>;
date: FormKitTextSlots<Props>;
email: FormKitTextSlots<Props>;
file: FormKitFileSlots<Props>;
form:{
form: FormKitSlotData<Props>;
default: FormKitSlotData<Props>;
message: FormKitSlotData<Props, {
message: FormKitMessage;
}>;
messages: FormKitSlotData<Props>;
actions: FormKitSlotData<Props>;
submit: FormKitSlotData<Props>;
};
group:{
default: FormKitSlotData<Props>;
};
hidden:{
input: FormKitSlotData<Props>;
};
list:{
default: FormKitSlotData<Props>;
};
meta:{
wrapper: FormKitSlotData<Props>;
};
month: FormKitTextSlots<Props>;
number: FormKitTextSlots<Props>;
password: FormKitTextSlots<Props>;
radio: Props['options']extendsAllReals?FormKitBoxSlots<Props>: FormKitBaseSlots<Props>;
range: FormKitTextSlots<Props>;
search: FormKitTextSlots<Props>;
select: FormKitSelectSlots<Props>;
submit: FormKitButtonSlots<Props>;
tel: FormKitTextSlots<Props>;
text: FormKitTextSlots<Props>;
textarea: FormKitTextSlots<Props>;
time: FormKitTextSlots<Props>;
url: FormKitTextSlots<Props>;
week: FormKitTextSlots<Props>;
}
Les groupes d'options doivent toujours être formatés sous forme de tableau d'objets avec un groupe et des options imbriquées
interface FormKitOptionsGroupItem {
attrs?: Record<string, any>;
group: string;
options: FormKitOptionsList;
}
Les groupes d'options doivent toujours être formatés sous forme de tableau d'objets avec un groupe et des options imbriquées
interface FormKitOptionsGroupItemProp {
attrs?: Record<string, any>;
group: string;
options: FormKitOptionsProp;
}
Les options doivent toujours être formatées sous forme de tableau d'objets avec des propriétés label et value.
interface FormKitOptionsItem<V = unknown> {
__original?: any;
[index: string]: any;
attrs?:{
disabled?: boolean;
}&Record<string, any>;
label: string;
value: V;
}
Permet de définir des extensions de prop en utilisant une interface dont les clés sont ignorées, mais les valeurs sont appliquées à un type d'union. Cela permet à tout code tiers d'étendre la prop options en utilisant l'augmentation de module pour ajouter de nouvelles valeurs au type d'union.
interface FormKitOptionsPropExtensions {
arrayOfNumbers: number[];
arrayOfStrings: string[];
optionsList: FormKitOptionsList;
valueLabelPojo: Record<string | number, string>;
}
Typages pour toutes les props de runtime intégrées.
Avertissement : Au moment de la rédaction, ceux-ci sont uniquement spécifiques aux exigences de prop de runtime de Vue et ne doivent pas être utilisés comme une sorte d'API externe car ils sont susceptibles de changer.
interface FormKitRuntimeProps<Props extends FormKitInputs<Props>> {
classes: Record<string, string | Record<string, boolean> | FormKitClasses>;
config: Record<string, any>;
delay: number;
errors: string[];
id: string;
index: number;
inputErrors: Record<string, string[]>;
modelValue: PropType<Props, 'value'>;
name: string;
parent: FormKitNode;
plugins: FormKitPlugin[];
sectionsSchema: Record<string, Partial<FormKitSchemaNode> | FormKitSchemaCondition>;
sync: boolean | undefined;
type: string | FormKitTypeDefinition;
validation: string | Array<[rule: string, ...args: any]>;
validationLabel: string | ((node: FormKitNode) => string);
validationMessages: Record<string, string | ((ctx:{
node: FormKitNode;
name: string;
args: any[];
}) => string)>;
validationRules: Record<string, (node: FormKitNode) => boolean | Promise<boolean>>;
}
Une fonction qui est appelée avec un argument d'extensions et qui renvoie un nœud de schéma valide.
interface FormKitSchemaExtendableSection {
_s?: string;
(extensions: Record<string, Partial<FormKitSchemaNode>>): FormKitSchemaNode;
}
Une fonction qui, lorsqu'elle est appelée, renvoie une fonction qui peut à son tour être appelée avec un paramètre d'extension.
interface FormKitSection<T = FormKitSchemaExtendableSection> {
(...children: Array<FormKitSchemaExtendableSection | string | FormKitSchemaCondition>): T;
}
Les emplacements disponibles pour l'entrée de sélection, ceux-ci étendent les emplacements de base.
interface FormKitSelectSlots<Props extends FormKitInputs<Props>> extends FormKitBaseSlots<Props> {
default: FormKitSlotData<Props>;
option: FormKitSlotData<Props, OptionSlotData<Props>>;
selectIcon: FormKitSlotData<Props>;
}
La forme de l'objet de contexte qui est passé à chaque emplacement.
interface FormKitSlotData<Props extends FormKitInputs<Props>, E extends Record<string, any> = {}> {
(context: FormKitFrameworkContext<PropType<Props, 'value'>>&E): any;
}
Les emplacements disponibles pour l'entrée de texte FormKit, ceux-ci étendent les emplacements de base.
interface FormKitTextSlots<Props extends FormKitInputs<Props>> extends FormKitBaseSlots<Props> {
}
Les données disponibles pour les emplacements qui ont une option dans leur portée.
interface OptionSlotData<Props extends FormKitInputs<Props>> {
option: FormKitOptionsItem<PropType<Props, 'value'>>;
}
Une tentative de capturer toutes les valeurs non indéfinies. Ceci est utilisé pour définir divers conditionnels où indéfini n'est pas un type concret, mais toutes les autres valeurs doivent prendre une branche logique.
export type AllReals = number | string | boolean | CallableFunction | Array<any> | null | Record<any, any>;
Les emplacements disponibles pour l'entrée du bouton, ceux-ci étendent les emplacements de base.
export type FormKitButtonSlots<Props extends FormKitInputs<Props>> = Omit<FormKitBaseSlots<Props>, 'inner'> & {
default: FormKitSlotData<Props>;
};
Tous les événements FormKit devraient être inclus pour un ensemble donné de props.
export type FormKitEvents<Props extends FormKitInputs<Props>> = MergedEvents<Props>;
Un "FileList" basé sur un tableau synthétique.
export type FormKitFileValue = FormKitFile[];
Toutes les entrées FormKit devraient être incluses pour ce type.
export type FormKitInputs<Props extends FormKitInputs<Props>> = MergedProps<Props>[keyof MergedProps<Props>];
Soit un nœud de schéma, soit une fonction qui renvoie un nœud de schéma.
export type FormKitInputSchema = ((children?: FormKitSchemaDefinition) => FormKitSchemaNode) | FormKitSchemaNode;
Un tableau d'éléments d'option.
export type FormKitOptionsList = FormKitOptionsItem[];
Un tableau d'éléments d'option avec un groupe.
export type FormKitOptionsListWithGroups = Array<FormKitOptionsItem | FormKitOptionsGroupItem>;
Un tableau d'éléments d'option avec un support de groupe — où l'option
des groupes peut être de n'importe quel type FormKitOptionsProp valide.
export type FormKitOptionsListWithGroupsProp = Array<FormKitOptionsItem | FormKitOptionsGroupItemProp>;
Les types d'options qui peuvent être passés à la prop options.
export type FormKitOptionsProp = FormKitOptionsPropExtensions[keyof FormKitOptionsPropExtensions];
Les types d'options qui peuvent être passés à la prop options.
export type FormKitOptionsPropWithGroups = FormKitOptionsProp | FormKitOptionsListWithGroupsProp;
La forme correcte des données à passer à la prop options.
export type FormKitOptionsValue<Options> = Options extends FormKitOptionsProp ? Options extends Record<infer T, string> ? T : Options extends FormKitOptionsItem[] ? Options[number]['value'] : Options extends Array<infer T> ? T : unknown : unknown;
Sélectionne le "type" à partir des props s'il existe, sinon il est par défaut à "text".
export type InputType<Props extends FormKitInputs<Props>> = Props['type'] extends string ? Props['type'] : 'text';
Fusionne tous les événements en un seul type. Ceci est ensuite utilisé comme structure pour
export type MergedEvents<Props extends FormKitInputs<Props>> = InputType<Props> extends keyof FormKitInputEvents<Props> ? FormKitBaseEvents<Props> & FormKitInputEvents<Props>[InputType<Props>] : FormKitBaseEvents<Props>;
Une fusion des props d'entrée, des props de base et des props conditionnels. Ceci est ensuite utilisé comme structure pour le type FormKitInputs.
export type MergedProps<Props extends FormKitInputs<Props>> = {
[K in keyof FormKitInputProps<Props>]: Omit<Partial<FormKitBaseProps>, keyof FormKitInputProps<Props>[K]> & Omit<Partial<FormKitRuntimeProps<Props>>, keyof FormKitInputProps<Props>[K]> & Omit<Partial<FormKitConditionalProps>, keyof FormKitInputProps<Props>[K]> & Partial<K extends keyof FormKitInputEventsAsProps<Props> ? Omit<FormKitEventsAsProps, keyof FormKitInputEventsAsProps<Props>[K]> & FormKitInputEventsAsProps<Props>[K] : FormKitEventsAsProps> & FormKitInputProps<Props>[K];
};
Extrait le type d'une prop donnée.
export type PropType<Props extends FormKitInputs<Props>, T extends keyof FormKitInputs<Props>> = Extract<FormKitInputs<Props>, {
type: Props['type'] extends string ? Props['type'] : 'text';
}>[T];