@llmnative/react 1.22.1 → 1.23.0

package/dist/types/src/components/index.d.ts

@@ -59,7 +59,7 @@ export type { ListCardProps } from './blocks/ListCard';
 export { default as SideNav } from './blocks/SideNav';
 export type { SideNavProps, SideNavItemDef } from './blocks/SideNav';
 export { default as Form, useFormContext } from './widgets/Form';
-export type { FormProps, FormDeleteArgs, FormDeleteHandler, FormFinallyArgs, FormFinallyHandler, FormSaveArgs, FormSaveHandler, ChangeHandler, FieldOnChange } from './widgets/Form';
+export type { FieldLabel, FormFieldProps, FormProps, FormDeleteArgs, FormDeleteHandler, FormFinallyArgs, FormFinallyHandler, FormSaveArgs, FormSaveHandler, ChangeHandler, FieldOnChange } from './widgets/Form';
 export { FormControllerContext, useFormActions, useFormController } from './widgets/form-controller';
 export type { FormActionEvent, FormController, FormControllerActions, FormControllerState, FormDraftStatus } from './widgets/form-controller';
 export { default as Grid } from './widgets/Grid';

package/dist/types/src/components/ui/fields/CodeEditor.d.ts

@@ -36,7 +36,7 @@ export interface CodeEditorProps extends FormFieldProps {
      * for `'fill'` to have any effect. */
     minHeight?: EditorHeight;
     maxHeight?: number;
-    label?: string;
+    label?: FormFieldProps['label'];
     required?: boolean;
     disabled?: boolean;
     feedback?: string;

package/dist/types/src/components/ui/fields/ImageField.d.ts

@@ -21,7 +21,7 @@ export interface ImageFieldProps extends FormFieldProps {
      * Example: "/content/posts/images"
      */
     uploadPath?: string;
-    label?: string;
+    label?: FormFieldProps['label'];
     required?: boolean;
     disabled?: boolean;
     feedback?: string;

package/dist/types/src/components/ui/fields/Input.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { UIProps } from '../../..';
-import { FormFieldProps, InputType } from '../../widgets/Form';
+import { FieldLabel, FormFieldProps, InputType } from '../../widgets/Form';
 import type { FieldValue } from '../../../providers/data/DataProvider';
 interface BaseInputProps extends FormFieldProps {
     placeholder?: string;
@@ -19,7 +19,8 @@ interface BaseInputProps extends FormFieldProps {
     afterInset?: React.ReactNode;
 }
 interface LabelProps {
-    label: string;
+    /** A text or a React node, drawn inside the `<label>` before the required mark. */
+    label: FieldLabel;
     required?: boolean;
     htmlFor?: string;
     className?: string;

package/dist/types/src/components/ui/fields/UploadCSV.d.ts

@@ -17,7 +17,8 @@ interface UploadCSVProps extends UIProps {
     onDataLoaded: UploadCSVDataLoadedHandler;
     onClear?: () => void;
     onParseField?: UploadCSVParseFieldHandler;
-    label?: string;
+    /** A text or a React node, as the label of the other fields. */
+    label?: React.ReactNode;
     icon?: string;
     delimiter?: string;
     normalizeKeys?: boolean;

package/dist/types/src/components/widgets/Form.d.ts

@@ -41,9 +41,12 @@ interface FormContextResult {
     formWrapClass?: string;
     record: RecordProps;
 }
+/** Label of a field: a text, or a React node (e.g. the text with an info button next to it). */
+export type FieldLabel = React.ReactNode;
 export interface FormFieldProps extends UIProps {
     name: string;
-    label?: string;
+    /** A text or a React node; where a text is needed (messages, `aria-label`) its text is used. */
+    label?: FieldLabel;
     labelMode?: LabelMode;
     value?: FieldValue;
     required?: boolean;
@@ -59,7 +62,7 @@ interface SetFormFieldsNameProps {
 }
 interface FieldValidationConstraints {
     required?: boolean;
-    label?: string;
+    label?: FieldLabel;
     validator?: (value: FieldValue) => string | undefined | Promise<string | undefined>;
 }
 interface FormValidationContextValue {

package/dist/types/src/components/widgets/Prompt.d.ts

@@ -50,7 +50,7 @@ type RenderAIUnavailable = (props: {
 }) => React.ReactNode;
 interface PromptFieldBase {
     name: string;
-    label?: string;
+    label?: FormFieldProps["label"];
     required?: boolean;
     onChange?: FormFieldProps["onChange"];
     before?: React.ReactNode;

package/dist/types/src/libs/index.d.ts

@@ -8,5 +8,6 @@ export * from './csv';
 export * from './utils';
 export * from './order';
 export { cn } from './cn';
+export { labelText } from './labelText';
 export { useImage } from './imageBuilder';
 export type { UseImageResult, ImageBuilderConfig, SrcsetConfig, SrcsetDensityConfig, SrcsetWidthConfig, ImageParams, ImgFit } from './imageBuilder';

package/dist/types/src/libs/labelText.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+/**
+ * The plain text of a label that may be a React node (`FieldLabel`): the strings and numbers it
+ * contains, in order, with whitespace collapsed. Used where a label must be text, such as the
+ * "required" message of a form or an `aria-label`.
+ *
+ * ```ts
+ * labelText(<>Skill <InfoButton /></>) // "Skill"
+ * ```
+ */
+export declare function labelText(node: React.ReactNode): string;

package/llms-full.txt

@@ -326,6 +326,11 @@ Azioni: `save()`, `delete()`, `reset()`, `restoreDraft()`, `discardDraft()`.
 
 **NOTA**: il tipo HTML si passa con `type`. `inputType` e i sotto-componenti `Input.Number`/`Input.Email`/`Input.Date` non esistono.
 
+**Label come nodo**: `label` di tutti i campi di inserimento (`Input`, `TextArea`, `Checkbox`, `Select`, `Autocomplete`, `Checklist`, `Upload*`, `ImageField`, `CodeEditor`, `RichText`, `AddressAutocomplete`, `UploadCSV`, `Prompt`) accetta una stringa o un nodo React (tipo `FieldLabel`), disegnato dentro la `<label>` prima dell'asterisco di obbligatorio. Dove serve un testo (messaggio "obbligatorio", `aria-label`) si usa il testo del nodo, ricavabile anche con `labelText(node)`.
+```tsx
+<Select name="skill" required options={skills} label={<>Skill <ActionButton icon="info" ariaLabel="Apri la skill" variant="link" onClick={openSkill} /></>} />
+```
+
 ### Select / Autocomplete / Checklist
 ```tsx
 <Select name="role" options={[{ label: 'Admin', value: 'admin' }]} />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llmnative/react",
-  "version": "1.22.1",
+  "version": "1.23.0",
   "description": "LLM-native React framework for deterministic UI generation. Data-driven by default, schema-driven optional. Ultra-low token consumption — built for AI agents, not just humans.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",