@payfit/unity-components 3.1.14 → 3.1.16

package/dist/esm/modules/tanstack-form/components/toggle-switch-group/TanstackToggleSwitchGroup.d.ts

@@ -0,0 +1,57 @@
+import { ToggleSwitchGroupProps } from '../../../../core/components/toggle-switch-group/ToggleSwitchGroup.js';
+export type TanstackToggleSwitchGroupProps = Omit<ToggleSwitchGroupProps, 'value' | 'defaultValue' | 'isInvalid' | 'feedbackText'>;
+/**
+ * TanStack‑controlled group component for multiple `ToggleSwitch` children.
+ *
+ * `TanstackToggleSwitchGroup` wraps `ToggleSwitchGroup` and binds its value
+ * (a `string[]`) to the TanStack field context via `useFieldContext`. The
+ * selection state is fully driven by the form — do not pass `value` or
+ * `defaultValue` directly.
+ *
+ * Behavior:
+ * - The value comes from `field.state.value` (string[]), defaulting to `[]`.
+ * - Changes are propagated via `field.handleChange` and forwarded to `onChange`.
+ * - The invalid state (`isInvalid`) is derived from `field.state.meta`
+ *   (`isTouched` && `!isValid`).
+ *
+ * Accessibility:
+ * - The group handles its own label and `helperText`.
+ * - For error feedback coming from the form, use the dedicated Field variant
+ *   (`TanstackToggleSwitchGroupField`).
+ *
+ * Usage constraints:
+ * - Must be rendered inside `<form.AppField name="…">`.
+ * - Pre‑fill via `useTanstackUnityForm({ defaultValues: { … } })`.
+ *
+ * Example:
+ * ```tsx
+ * const form = useTanstackUnityForm({
+ *   validators: { onBlur: z.object({ pref: z.array(z.string()).optional() }) },
+ *   defaultValues: { pref: ['email'] },
+ * })
+ *
+ * return (
+ *   <form.AppForm>
+ *     <form.Form>
+ *       <form.AppField name="pref">
+ *         {() => (
+ *           <TanstackToggleSwitchGroup label="Notifications">
+ *             <ToggleSwitch value="email" label="Email" />
+ *             <ToggleSwitch value="sms" label="SMS" />
+ *             <ToggleSwitch value="push" label="Push" />
+ *           </TanstackToggleSwitchGroup>
+ *         )}
+ *       </form.AppField>
+ *     </form.Form>
+ *   </form.AppForm>
+ * )
+ * ```
+ * @public
+ * @see ToggleSwitchGroup
+ * @see useFieldContext
+ * @remarks The `value`, `defaultValue`, `isInvalid`, and `feedbackText` props are handled by the TanStack integration and therefore omitted.
+ * @param props Group props (excluding `value`, `defaultValue`, `isInvalid`, `feedbackText`).
+ * @returns A form‑controlled `fieldset` containing the child switches.
+ */
+declare const TanstackToggleSwitchGroup: import('react').ForwardRefExoticComponent<TanstackToggleSwitchGroupProps & import('react').RefAttributes<HTMLFieldSetElement>>;
+export { TanstackToggleSwitchGroup };

package/dist/esm/modules/tanstack-form/components/toggle-switch-group/TanstackToggleSwitchGroup.js

@@ -0,0 +1,20 @@
+import { ToggleSwitchGroup as e } from "../../../../core/components/toggle-switch-group/ToggleSwitchGroup.js";
+import { useFieldContext as t } from "../../hooks/tanstack-form-context.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/modules/tanstack-form/components/toggle-switch-group/TanstackToggleSwitchGroup.tsx
+var i = n(function({ onChange: n, ...i }, a) {
+	let o = t(), s = Array.isArray(o.state.value) ? o.state.value : [], c = o.state.meta.isTouched && !o.state.meta.isValid;
+	return /* @__PURE__ */ r(e, {
+		...i,
+		ref: a,
+		value: s,
+		isInvalid: c,
+		onChange: (e) => {
+			o.handleChange(e), n?.(e);
+		}
+	});
+});
+i.displayName = "TanstackToggleSwitchGroup";
+//#endregion
+export { i as TanstackToggleSwitchGroup };

package/dist/esm/modules/tanstack-form/components/toggle-switch-group-field/TanstackToggleSwitchGroupField.js

@@ -0,0 +1,31 @@
+import { TanstackFormFeedbackText as e } from "../form-field/parts/TanstackFormFeedbackText.js";
+import { TanstackFormField as t } from "../form-field/TanstackFormField.js";
+import { TanstackToggleSwitchGroup as n } from "../toggle-switch-group/TanstackToggleSwitchGroup.js";
+import { forwardRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/modules/tanstack-form/components/toggle-switch-group-field/TanstackToggleSwitchGroupField.tsx
+function o({ label: r, helperText: o, isDisabled: s, isReadOnly: c, isRequired: l, requiredVariant: u, contextualLink: d, children: f, onFocus: p, onBlur: m, onFocusChange: h, onChange: g, ..._ }, v) {
+	return /* @__PURE__ */ a(t, { children: [
+		/* @__PURE__ */ i(n, {
+			ref: v,
+			label: r,
+			helperText: o,
+			isRequired: l,
+			requiredVariant: u,
+			onFocus: p,
+			onBlur: m,
+			onFocusChange: h,
+			onChange: g,
+			isDisabled: s,
+			isReadOnly: c,
+			..._,
+			children: f
+		}),
+		/* @__PURE__ */ i(e, {}),
+		d
+	] });
+}
+var s = r(o);
+s.displayName = "TanstackToggleSwitchGroupField";
+//#endregion
+export { s as TanstackToggleSwitchGroupField };

package/dist/esm/modules/tanstack-form/hooks/tanstack-form-context.js

@@ -0,0 +1,5 @@
+import { createFormHookContexts as e } from "@tanstack/react-form";
+//#region src/modules/tanstack-form/hooks/tanstack-form-context.tsx
+var { fieldContext: t, formContext: n, useFieldContext: r, useFormContext: i } = e();
+//#endregion
+export { t as fieldContext, n as formContext, r as useFieldContext, i as useFormContext };

package/dist/esm/modules/tanstack-form/hooks/tanstack-form-default-values.js

@@ -0,0 +1,6 @@
+//#region src/modules/tanstack-form/hooks/tanstack-form-default-values.ts
+function e(e) {
+	return e;
+}
+//#endregion
+export { e as tanstackFormDefaultValues };