@aircall/blocks 0.10.0 → 0.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/globals.css +1 -1
- package/dist/index.d.ts +96 -12
- package/dist/index.js +52 -5
- package/package.json +2 -2
package/dist/index.d.ts
CHANGED
|
@@ -1327,6 +1327,18 @@ declare const withForm: <TFormData, TOnMount extends _tanstack_react_form0.FormV
|
|
|
1327
1327
|
declare const fieldContext: React$1.Context<_tanstack_react_form0.AnyFieldApi>, formContext: React$1.Context<_tanstack_react_form0.AnyFormApi>, useFieldContext: <TData>() => _tanstack_react_form0.FieldApi<any, string, TData, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any>, useFormContext: () => _tanstack_react_form0.ReactFormExtendedApi<Record<string, never>, any, any, any, any, any, any, any, any, any, any, any>;
|
|
1328
1328
|
//#endregion
|
|
1329
1329
|
//#region src/components/form-field.d.ts
|
|
1330
|
+
type FormFieldShellProps = {
|
|
1331
|
+
label?: string;
|
|
1332
|
+
description?: string;
|
|
1333
|
+
necessityIndicator?: 'required' | 'optional';
|
|
1334
|
+
children: React$1.ReactNode;
|
|
1335
|
+
};
|
|
1336
|
+
declare function FormFieldShell({
|
|
1337
|
+
label,
|
|
1338
|
+
description,
|
|
1339
|
+
necessityIndicator,
|
|
1340
|
+
children
|
|
1341
|
+
}: FormFieldShellProps): react_jsx_runtime0.JSX.Element;
|
|
1330
1342
|
/**
|
|
1331
1343
|
* Precisely-typed view of the bound field handed to a wrapper's `children`.
|
|
1332
1344
|
* `TData` is `DeepValue<TFormData, TName>` — so `value` and `handleChange` are the field's
|
|
@@ -1380,12 +1392,11 @@ type FormFieldValidators<TFormData, TName> = TName extends DeepKeys<TFormData> ?
|
|
|
1380
1392
|
* The full `AppField` binding surface every wrapper forwards, typed against the field's value.
|
|
1381
1393
|
*
|
|
1382
1394
|
* This is the **single source of truth** for which `form.AppField` props the `Form*Field` wrappers
|
|
1383
|
-
* pass through — spread it into each wrapper's props so the set can't drift per-wrapper.
|
|
1384
|
-
* `app-field-coverage` type test asserts this stays in sync with `AppField`'s real prop surface:
|
|
1385
|
-
* every `AppField` prop must be forwarded here or appear in that test's explicit omission list.
|
|
1395
|
+
* pass through — spread it into each wrapper's props so the set can't drift per-wrapper.
|
|
1386
1396
|
*
|
|
1387
1397
|
* Forwarded: `validators`, `listeners`, `defaultValue`, `asyncDebounceMs`, `asyncAlways`.
|
|
1388
|
-
* Deliberately omitted
|
|
1398
|
+
* Deliberately omitted: `name`/`children` (owned by the wrapper), `mode` (owned by `FormArrayField`,
|
|
1399
|
+
* which is the only wrapper that drives an `AppField` in `mode="array"`), and
|
|
1389
1400
|
* `defaultMeta`/`disableErrorFlat` (advanced escape hatches that fight the shared shell).
|
|
1390
1401
|
*/
|
|
1391
1402
|
type FieldBindingProps<TFormData, TName> = TName extends DeepKeys<TFormData> ? {
|
|
@@ -1396,13 +1407,13 @@ type FieldBindingProps<TFormData, TName> = TName extends DeepKeys<TFormData> ? {
|
|
|
1396
1407
|
asyncAlways?: boolean;
|
|
1397
1408
|
} : never;
|
|
1398
1409
|
/**
|
|
1399
|
-
* Presentational necessity
|
|
1400
|
-
*
|
|
1401
|
-
*
|
|
1410
|
+
* Presentational necessity prop every wrapper exposes, forwarded to the DS `FieldLabel`. Follows
|
|
1411
|
+
* the "mark the exceptions" convention: tag only the minority necessity in a form (`'optional'` in
|
|
1412
|
+
* a mostly-mandatory form, `'required'` in a mostly-optional one), never both. Label-only —
|
|
1413
|
+
* enforcement stays in `validators`. Shared so the set can't drift per-wrapper.
|
|
1402
1414
|
*/
|
|
1403
1415
|
type NecessityProps = {
|
|
1404
|
-
|
|
1405
|
-
necessityIndicator?: 'icon' | 'label';
|
|
1416
|
+
necessityIndicator?: 'required' | 'optional';
|
|
1406
1417
|
};
|
|
1407
1418
|
type FormFieldBaseProps<TData, TControl> = {
|
|
1408
1419
|
form: Pick<BoundForm, 'AppField'>;
|
|
@@ -1414,8 +1425,7 @@ type FormFieldBaseProps<TData, TControl> = {
|
|
|
1414
1425
|
asyncAlways?: boolean;
|
|
1415
1426
|
label?: string;
|
|
1416
1427
|
description?: string;
|
|
1417
|
-
|
|
1418
|
-
necessityIndicator?: 'icon' | 'label'; /** Builds the primitive-specific wiring bundle handed to `children`. */
|
|
1428
|
+
necessityIndicator?: 'required' | 'optional'; /** Builds the primitive-specific wiring bundle handed to `children`. */
|
|
1419
1429
|
buildControl: (field: TypedField<TData>) => TControl;
|
|
1420
1430
|
children: (field: TypedField<TData>, control: TControl) => React$1.ReactNode;
|
|
1421
1431
|
};
|
|
@@ -1584,6 +1594,80 @@ type FormMultiComboboxFieldProps<TForm extends BoundForm, TName extends DeepKeys
|
|
|
1584
1594
|
*/
|
|
1585
1595
|
declare function FormMultiComboboxField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], string[]>>(props: FormMultiComboboxFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
|
|
1586
1596
|
//#endregion
|
|
1597
|
+
//#region src/components/form-array-field.d.ts
|
|
1598
|
+
/**
|
|
1599
|
+
* The element type of the bound array field — `DeepValue<TFormData, TName>` unwrapped one level.
|
|
1600
|
+
* `contacts: { label: string; value: string }[]` ⇒ `{ label: string; value: string }`.
|
|
1601
|
+
*/
|
|
1602
|
+
type ArrayItem<TFormData, TName> = DeepValue<TFormData, TName> extends ReadonlyArray<infer TItem> ? TItem : never;
|
|
1603
|
+
/**
|
|
1604
|
+
* Precisely-typed view of an array-mode field handed to a `FormArrayField` child.
|
|
1605
|
+
*
|
|
1606
|
+
* Unlike the single-control `TypedField`, this exposes TanStack's array mutators (kept under their
|
|
1607
|
+
* native names so it's a transparent pass-through of `form.AppField` in `mode="array"`). The
|
|
1608
|
+
* `options?` argument each mutator also accepts upstream is intentionally elided — the common path
|
|
1609
|
+
* is index/value only; reach for `form.AppField` directly if you need it.
|
|
1610
|
+
*
|
|
1611
|
+
* Children read `state.value` to map over the rows and render nested `Form*Field`s with **indexed**
|
|
1612
|
+
* names (`contacts[${i}].label`), and call the mutators from add/remove/reorder controls.
|
|
1613
|
+
*/
|
|
1614
|
+
type ArrayField<TItem> = {
|
|
1615
|
+
state: {
|
|
1616
|
+
value: TItem[];
|
|
1617
|
+
meta: {
|
|
1618
|
+
errors: readonly unknown[];
|
|
1619
|
+
isTouched: boolean;
|
|
1620
|
+
};
|
|
1621
|
+
}; /** Append `value` to the end of the array. */
|
|
1622
|
+
pushValue: (value: TItem) => void; /** Insert `value` at `index`, shifting later items right. */
|
|
1623
|
+
insertValue: (index: number, value: TItem) => void; /** Replace the item at `index` in place. */
|
|
1624
|
+
replaceValue: (index: number, value: TItem) => void; /** Remove the item at `index`, shifting later items left. */
|
|
1625
|
+
removeValue: (index: number) => void; /** Swap the items at `aIndex` and `bIndex`. */
|
|
1626
|
+
swapValues: (aIndex: number, bIndex: number) => void; /** Move the item at `aIndex` to `bIndex`, shifting the rest to fill. */
|
|
1627
|
+
moveValue: (aIndex: number, bIndex: number) => void; /** Remove every item. */
|
|
1628
|
+
clearValues: () => void; /** Mark the array field touched (e.g. on blur of the whole group). */
|
|
1629
|
+
handleBlur: () => void;
|
|
1630
|
+
};
|
|
1631
|
+
type FormArrayFieldProps<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], unknown[]>> = {
|
|
1632
|
+
/** The form instance from `useForm()` — threaded as a prop so `name`/`validators` are typed. */form: TForm;
|
|
1633
|
+
name: TName;
|
|
1634
|
+
label?: string;
|
|
1635
|
+
description?: string;
|
|
1636
|
+
/**
|
|
1637
|
+
* Render the list. Map over `field.state.value`, render a nested `Form*Field` per row (same
|
|
1638
|
+
* `form`, indexed `name`), and wire add/remove/reorder controls to the array mutators.
|
|
1639
|
+
*/
|
|
1640
|
+
children: (field: ArrayField<ArrayItem<TForm['state']['values'], TName>>) => React$1.ReactNode;
|
|
1641
|
+
} & FieldBindingProps<TForm['state']['values'], TName> & NecessityProps;
|
|
1642
|
+
/**
|
|
1643
|
+
* Array field wrapper — drives a `form.AppField` in `mode="array"` and owns the shared
|
|
1644
|
+
* `Field/Label/Description/Error` shell, so an array-level validator (e.g. "add at least one")
|
|
1645
|
+
* surfaces under the list. `name` is restricted to the form's **array** fields, and the child's
|
|
1646
|
+
* `field` is typed to the element type, with TanStack's array mutators (`pushValue`, `removeValue`,
|
|
1647
|
+
* `moveValue`, …) exposed for add/remove/reorder.
|
|
1648
|
+
*
|
|
1649
|
+
* It deliberately has **no control bundle**: an array is a container of rows, not a single input.
|
|
1650
|
+
* Each row is composed from the existing single-control wrappers with an indexed `name`.
|
|
1651
|
+
*
|
|
1652
|
+
* @example
|
|
1653
|
+
* <FormArrayField form={form} name="webhooks" label="Webhooks" description="Endpoints to notify">
|
|
1654
|
+
* {field => (
|
|
1655
|
+
* <>
|
|
1656
|
+
* {field.state.value.map((_row, i) => (
|
|
1657
|
+
* <div key={i} className="flex items-end gap-2">
|
|
1658
|
+
* <FormInputField form={form} name={`webhooks[${i}].url`} label="URL">
|
|
1659
|
+
* {(_f, { inputProps }) => <Input {...inputProps} placeholder="https://…" />}
|
|
1660
|
+
* </FormInputField>
|
|
1661
|
+
* <Button variant="ghost" onClick={() => field.removeValue(i)}>Remove</Button>
|
|
1662
|
+
* </div>
|
|
1663
|
+
* ))}
|
|
1664
|
+
* <Button variant="outline" onClick={() => field.pushValue({ url: '' })}>Add webhook</Button>
|
|
1665
|
+
* </>
|
|
1666
|
+
* )}
|
|
1667
|
+
* </FormArrayField>
|
|
1668
|
+
*/
|
|
1669
|
+
declare function FormArrayField<TForm extends BoundForm, TName extends DeepKeysOfType<TForm['state']['values'], unknown[]>>(props: FormArrayFieldProps<TForm, TName>): react_jsx_runtime0.JSX.Element;
|
|
1670
|
+
//#endregion
|
|
1587
1671
|
//#region src/components/form-textarea-field.d.ts
|
|
1588
1672
|
/**
|
|
1589
1673
|
* Wiring bundle handed to a `FormTextareaField` child. Spread `textareaProps` onto a DS
|
|
@@ -2047,4 +2131,4 @@ declare namespace DashboardSidebarSubmenuSeparator {
|
|
|
2047
2131
|
type Props = DashboardSidebarSubmenuSeparatorProps;
|
|
2048
2132
|
}
|
|
2049
2133
|
//#endregion
|
|
2050
|
-
export { BetaBadge, type BoundForm, CardSaveBar, type CardSaveBarProps, ChatbotExpandSuggestion, type ChatbotExpandSuggestionProps, ChatbotInput, type ChatbotInputProps, ChatbotPage, ChatbotPageBody, type ChatbotPageBodyProps, ChatbotPageContent, type ChatbotPageContentProps, ChatbotPageConversation, type ChatbotPageConversationProps, ChatbotPageFooter, type ChatbotPageFooterProps, ChatbotPageHeading, type ChatbotPageHeadingProps, ChatbotPageInputBar, type ChatbotPageInputBarProps, type ChatbotPageProps, ChatbotPanel, ChatbotPanelHeader, type ChatbotPanelHeaderProps, type ChatbotPanelProps, ChatbotPanelSuggestion, type ChatbotPanelSuggestionItem, type ChatbotPanelSuggestionProps, ChatbotPanelTrigger, type ChatbotPanelTriggerProps, ChatbotResponseBlock, type ChatbotResponseBlockFeedback, type ChatbotResponseBlockProps, ChatbotSidebar, type ChatbotSidebarConversation, ChatbotUserMessage, type ChatbotUserMessageProps, type ComboboxControl, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, type DashboardSidebarNavGroup, type DashboardSidebarNavItem, type DashboardSidebarNavItemAction, type DashboardSidebarNavItemLink, type DashboardSidebarNavItemSubmenu, type DashboardSidebarNavSubmenuItem, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, type FieldBindingProps, FormComboboxField, type FormComboboxFieldProps, FormFieldBase, type FormFieldValidators, FormInputField, type FormInputFieldProps, FormMultiComboboxField, type FormMultiComboboxFieldProps, FormNumericField, type FormNumericFieldProps, FormOTPField, type FormOTPFieldProps, FormRadioGroupField, type FormRadioGroupFieldProps, FormSelectField, type FormSelectFieldProps, FormSliderField, type FormSliderFieldProps, FormSwitchField, type FormSwitchFieldProps, FormTextareaField, type FormTextareaFieldProps, FormToggleGroupField, type FormToggleGroupFieldProps, type InputControl, type MultiComboboxControl, type NecessityProps, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, type NumericControl, type OTPControl, ProfessionalBadge, type RadioGroupControl, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, type RoleBadgeRole, SaveBar, type SaveBarProps, type SelectControl, type SliderControl, SubmitButton, type SubmitButtonProps, type SwitchControl, type TextareaControl, type ToggleGroupControl, TrialBadge, type TypedField, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withFieldGroup, withForm };
|
|
2134
|
+
export { type ArrayField, type ArrayItem, BetaBadge, type BoundForm, CardSaveBar, type CardSaveBarProps, ChatbotExpandSuggestion, type ChatbotExpandSuggestionProps, ChatbotInput, type ChatbotInputProps, ChatbotPage, ChatbotPageBody, type ChatbotPageBodyProps, ChatbotPageContent, type ChatbotPageContentProps, ChatbotPageConversation, type ChatbotPageConversationProps, ChatbotPageFooter, type ChatbotPageFooterProps, ChatbotPageHeading, type ChatbotPageHeadingProps, ChatbotPageInputBar, type ChatbotPageInputBarProps, type ChatbotPageProps, ChatbotPanel, ChatbotPanelHeader, type ChatbotPanelHeaderProps, type ChatbotPanelProps, ChatbotPanelSuggestion, type ChatbotPanelSuggestionItem, type ChatbotPanelSuggestionProps, ChatbotPanelTrigger, type ChatbotPanelTriggerProps, ChatbotResponseBlock, type ChatbotResponseBlockFeedback, type ChatbotResponseBlockProps, ChatbotSidebar, type ChatbotSidebarConversation, ChatbotUserMessage, type ChatbotUserMessageProps, type ComboboxControl, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, type DashboardSidebarNavGroup, type DashboardSidebarNavItem, type DashboardSidebarNavItemAction, type DashboardSidebarNavItemLink, type DashboardSidebarNavItemSubmenu, type DashboardSidebarNavSubmenuItem, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, type FieldBindingProps, FormArrayField, type FormArrayFieldProps, FormComboboxField, type FormComboboxFieldProps, FormFieldBase, FormFieldShell, type FormFieldShellProps, type FormFieldValidators, FormInputField, type FormInputFieldProps, FormMultiComboboxField, type FormMultiComboboxFieldProps, FormNumericField, type FormNumericFieldProps, FormOTPField, type FormOTPFieldProps, FormRadioGroupField, type FormRadioGroupFieldProps, FormSelectField, type FormSelectFieldProps, FormSliderField, type FormSliderFieldProps, FormSwitchField, type FormSwitchFieldProps, FormTextareaField, type FormTextareaFieldProps, FormToggleGroupField, type FormToggleGroupFieldProps, type InputControl, type MultiComboboxControl, type NecessityProps, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, type NumericControl, type OTPControl, ProfessionalBadge, type RadioGroupControl, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, type RoleBadgeRole, SaveBar, type SaveBarProps, type SelectControl, type SliderControl, SubmitButton, type SubmitButtonProps, type SwitchControl, type TextareaControl, type ToggleGroupControl, TrialBadge, type TypedField, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withFieldGroup, withForm };
|
package/dist/index.js
CHANGED
|
@@ -1950,13 +1950,12 @@ function toFieldErrors(errors) {
|
|
|
1950
1950
|
|
|
1951
1951
|
//#endregion
|
|
1952
1952
|
//#region src/components/form-field.tsx
|
|
1953
|
-
function FormFieldShell({ label, description,
|
|
1953
|
+
function FormFieldShell({ label, description, necessityIndicator, children }) {
|
|
1954
1954
|
const errors = useFieldContext().state.meta.errors;
|
|
1955
1955
|
return /* @__PURE__ */ jsxs(Field, {
|
|
1956
1956
|
"data-invalid": errors.length > 0 ? true : void 0,
|
|
1957
1957
|
children: [
|
|
1958
1958
|
label && /* @__PURE__ */ jsx(FieldLabel, {
|
|
1959
|
-
required,
|
|
1960
1959
|
necessityIndicator,
|
|
1961
1960
|
children: label
|
|
1962
1961
|
}),
|
|
@@ -1972,7 +1971,7 @@ function FormFieldShell({ label, description, required, necessityIndicator, chil
|
|
|
1972
1971
|
* the AppField + shared shell. `TData`/`TControl` carry the precise field + bundle shapes through.
|
|
1973
1972
|
*/
|
|
1974
1973
|
function FormFieldBase(props) {
|
|
1975
|
-
const { form, name, validators, listeners, defaultValue, asyncDebounceMs, asyncAlways, label, description,
|
|
1974
|
+
const { form, name, validators, listeners, defaultValue, asyncDebounceMs, asyncAlways, label, description, necessityIndicator, buildControl, children } = props;
|
|
1976
1975
|
const AppField = form.AppField;
|
|
1977
1976
|
return /* @__PURE__ */ jsx(AppField, {
|
|
1978
1977
|
name,
|
|
@@ -1984,7 +1983,6 @@ function FormFieldBase(props) {
|
|
|
1984
1983
|
children: (field) => /* @__PURE__ */ jsx(FormFieldShell, {
|
|
1985
1984
|
label,
|
|
1986
1985
|
description,
|
|
1987
|
-
required,
|
|
1988
1986
|
necessityIndicator,
|
|
1989
1987
|
children: children(field, buildControl(field))
|
|
1990
1988
|
})
|
|
@@ -2132,6 +2130,55 @@ function FormMultiComboboxField(props) {
|
|
|
2132
2130
|
});
|
|
2133
2131
|
}
|
|
2134
2132
|
|
|
2133
|
+
//#endregion
|
|
2134
|
+
//#region src/components/form-array-field.tsx
|
|
2135
|
+
/**
|
|
2136
|
+
* Array field wrapper — drives a `form.AppField` in `mode="array"` and owns the shared
|
|
2137
|
+
* `Field/Label/Description/Error` shell, so an array-level validator (e.g. "add at least one")
|
|
2138
|
+
* surfaces under the list. `name` is restricted to the form's **array** fields, and the child's
|
|
2139
|
+
* `field` is typed to the element type, with TanStack's array mutators (`pushValue`, `removeValue`,
|
|
2140
|
+
* `moveValue`, …) exposed for add/remove/reorder.
|
|
2141
|
+
*
|
|
2142
|
+
* It deliberately has **no control bundle**: an array is a container of rows, not a single input.
|
|
2143
|
+
* Each row is composed from the existing single-control wrappers with an indexed `name`.
|
|
2144
|
+
*
|
|
2145
|
+
* @example
|
|
2146
|
+
* <FormArrayField form={form} name="webhooks" label="Webhooks" description="Endpoints to notify">
|
|
2147
|
+
* {field => (
|
|
2148
|
+
* <>
|
|
2149
|
+
* {field.state.value.map((_row, i) => (
|
|
2150
|
+
* <div key={i} className="flex items-end gap-2">
|
|
2151
|
+
* <FormInputField form={form} name={`webhooks[${i}].url`} label="URL">
|
|
2152
|
+
* {(_f, { inputProps }) => <Input {...inputProps} placeholder="https://…" />}
|
|
2153
|
+
* </FormInputField>
|
|
2154
|
+
* <Button variant="ghost" onClick={() => field.removeValue(i)}>Remove</Button>
|
|
2155
|
+
* </div>
|
|
2156
|
+
* ))}
|
|
2157
|
+
* <Button variant="outline" onClick={() => field.pushValue({ url: '' })}>Add webhook</Button>
|
|
2158
|
+
* </>
|
|
2159
|
+
* )}
|
|
2160
|
+
* </FormArrayField>
|
|
2161
|
+
*/
|
|
2162
|
+
function FormArrayField(props) {
|
|
2163
|
+
const { form, name, validators, listeners, defaultValue, asyncDebounceMs, asyncAlways, label, description, necessityIndicator, children } = props;
|
|
2164
|
+
const AppField = form.AppField;
|
|
2165
|
+
return /* @__PURE__ */ jsx(AppField, {
|
|
2166
|
+
name,
|
|
2167
|
+
mode: "array",
|
|
2168
|
+
validators,
|
|
2169
|
+
listeners,
|
|
2170
|
+
defaultValue,
|
|
2171
|
+
asyncDebounceMs,
|
|
2172
|
+
asyncAlways,
|
|
2173
|
+
children: (field) => /* @__PURE__ */ jsx(FormFieldShell, {
|
|
2174
|
+
label,
|
|
2175
|
+
description,
|
|
2176
|
+
necessityIndicator,
|
|
2177
|
+
children: children(field)
|
|
2178
|
+
})
|
|
2179
|
+
});
|
|
2180
|
+
}
|
|
2181
|
+
|
|
2135
2182
|
//#endregion
|
|
2136
2183
|
//#region src/components/form-textarea-field.tsx
|
|
2137
2184
|
function textareaControl(field) {
|
|
@@ -2661,4 +2708,4 @@ function DashboardSidebarNav({ groups, renderLink }) {
|
|
|
2661
2708
|
}
|
|
2662
2709
|
|
|
2663
2710
|
//#endregion
|
|
2664
|
-
export { BetaBadge, CardSaveBar, ChatbotExpandSuggestion, ChatbotInput, ChatbotPage, ChatbotPageBody, ChatbotPageContent, ChatbotPageConversation, ChatbotPageFooter, ChatbotPageHeading, ChatbotPageInputBar, ChatbotPanel, ChatbotPanelHeader, ChatbotPanelSuggestion, ChatbotPanelTrigger, ChatbotResponseBlock, ChatbotSidebar, ChatbotUserMessage, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, FormComboboxField, FormFieldBase, FormInputField, FormMultiComboboxField, FormNumericField, FormOTPField, FormRadioGroupField, FormSelectField, FormSliderField, FormSwitchField, FormTextareaField, FormToggleGroupField, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, ProfessionalBadge, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, SaveBar, SubmitButton, TrialBadge, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withFieldGroup, withForm };
|
|
2711
|
+
export { BetaBadge, CardSaveBar, ChatbotExpandSuggestion, ChatbotInput, ChatbotPage, ChatbotPageBody, ChatbotPageContent, ChatbotPageConversation, ChatbotPageFooter, ChatbotPageHeading, ChatbotPageInputBar, ChatbotPanel, ChatbotPanelHeader, ChatbotPanelSuggestion, ChatbotPanelTrigger, ChatbotResponseBlock, ChatbotSidebar, ChatbotUserMessage, ComingSoonDescription, ComingSoonEmptyState, ComingSoonMedia, ComingSoonTitle, CommonForm, CopyButton, CopyButtonIcon, CopyButtonLabel, DashboardPage, DashboardPageBanner, DashboardPageContent, DashboardPageHeader, DashboardPageHeaderAction, DashboardPageHeaderActions, DashboardPageHeaderDescription, DashboardPageHeaderNav, DashboardPageHeaderNavBack, DashboardPageHeaderPrefix, DashboardPageHeaderSubtitle, DashboardPageHeaderTitle, DashboardPageHeaderTitleGroup, DashboardPageMain, DashboardPageTabs, DashboardSidebar, DashboardSidebarContent, DashboardSidebarFooter, DashboardSidebarGroup, DashboardSidebarGroupLabel, DashboardSidebarHeader, DashboardSidebarMenu, DashboardSidebarMenuBadge, DashboardSidebarMenuButton, DashboardSidebarMenuItem, DashboardSidebarNav, DashboardSidebarProvider, DashboardSidebarSubmenu, DashboardSidebarSubmenuItem, DashboardSidebarSubmenuSeparator, DashboardSidebarTrigger, DashboardStandalonePage, DashboardStandalonePageAction, DashboardStandalonePageActions, DashboardStandalonePageContent, DashboardStandalonePageHeader, DashboardStandalonePageTitle, DeprecatedBadge, EmptyState, EmptyStateActions, EmptyStateButton, EmptyStateDescription, EmptyStateExternalLink, EmptyStateHeader, EmptyStateMedia, EmptyStateTitle, FormArrayField, FormComboboxField, FormFieldBase, FormFieldShell, FormInputField, FormMultiComboboxField, FormNumericField, FormOTPField, FormRadioGroupField, FormSelectField, FormSliderField, FormSwitchField, FormTextareaField, FormToggleGroupField, NewBadge, NoDataDescription, NoDataEmptyState, NoDataMedia, NoDataTitle, NoSupportDescription, NoSupportEmptyState, NoSupportMedia, NoSupportTitle, NotFoundDescription, NotFoundEmptyState, NotFoundMedia, NotFoundTitle, ProfessionalBadge, RestrictedAccessDescription, RestrictedAccessEmptyState, RestrictedAccessMedia, RestrictedAccessTitle, RoleBadge, SaveBar, SubmitButton, TrialBadge, UnknownErrorDescription, UnknownErrorEmptyState, UnknownErrorMedia, UnknownErrorTitle, fieldContext, formContext, toFieldErrors, useCopyToClipboard, useSidebar as useDashboardSidebar, useFieldContext, useForm, useFormContext, withFieldGroup, withForm };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aircall/blocks",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"private": false,
|
|
6
6
|
"sideEffects": [
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"vite": "7.3.1",
|
|
82
82
|
"vitest": "4.0.17",
|
|
83
83
|
"zod": "4.4.3",
|
|
84
|
-
"@aircall/ds": "0.17.
|
|
84
|
+
"@aircall/ds": "0.17.1",
|
|
85
85
|
"@aircall/hooks": "0.5.1"
|
|
86
86
|
},
|
|
87
87
|
"keywords": [
|