@payfit/unity-components 0.0.0-alpha.11 → 0.0.0-alpha.6

package/dist/esm/components/toast/parts/ToastAction.js

@@ -1,12 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { Button as i } from "../../button/Button.js";
-function a({
-  children: t,
-  onPress: r
-}) {
-  return /* @__PURE__ */ o("div", { className: "uy-self-end", children: /* @__PURE__ */ o(i, { variant: "ghost", color: "primary", onPress: r, children: t }) });
-}
-a.displayName = "ToastAction";
-export {
-  a as ToastAction
-};

package/dist/esm/components/toast/parts/ToastContent.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithChildren } from 'react';
-declare function ToastContent({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element | null;
-declare namespace ToastContent {
-    var displayName: string;
-}
-export { ToastContent };

package/dist/esm/components/toast/parts/ToastContent.js

@@ -1,11 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import { Text as r } from "../../text/Text.js";
-import { useToastContext as e } from "../Toast.context.js";
-function a({ children: t }) {
-  const { inline: o } = e();
-  return o ? /* @__PURE__ */ n(r, { variant: "body", className: "uy-mb-100", children: t }) : null;
-}
-a.displayName = "ToastContent";
-export {
-  a as ToastContent
-};

package/dist/esm/components/toast/parts/ToastTitle.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithChildren } from 'react';
-declare function ToastTitle({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
-declare namespace ToastTitle {
-    var displayName: string;
-}
-export { ToastTitle };

package/dist/esm/components/toast/parts/ToastTitle.js

@@ -1,9 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { Text as a } from "../../text/Text.js";
-function e({ children: t }) {
-  return /* @__PURE__ */ o(a, { asElement: "h4", variant: "bodyStrong", className: "uy-mt-100", children: t });
-}
-e.displayName = "ToastTitle";
-export {
-  e as ToastTitle
-};

package/dist/esm/components/toast/toast.d.ts

@@ -1,44 +0,0 @@
-import { ReactNode } from 'react';
-import { ToastActionProps } from './parts/ToastAction.js';
-import { UnityToastProps } from './UnityToast.js';
-interface Base {
-    title: ReactNode;
-    content?: ReactNode;
-    datadogPrivacy?: 'allow' | 'mask' | 'hidden';
-}
-interface WithAction {
-    action: ReactNode;
-    actionOnPress: ToastActionProps['onPress'];
-}
-interface SuccessParams extends Base {
-    variant: Extract<UnityToastProps['variant'], 'success'>;
-    duration?: number;
-    action?: never;
-    actionOnPress?: never;
-}
-interface ErrorParams extends Base {
-    variant: Extract<UnityToastProps['variant'], 'error'>;
-    duration?: never;
-    action?: never;
-    actionOnPress?: never;
-}
-interface SuccessParamsWithAction extends Base, WithAction {
-    variant: Extract<UnityToastProps['variant'], 'success'>;
-    duration?: number;
-}
-interface ErrorParamsWithAction extends Base, WithAction {
-    variant: Extract<UnityToastProps['variant'], 'error'>;
-    duration?: never;
-}
-/**
- * creates a toast
- * @param prop the object which contains all the properties
- * @param prop.title the toast title
- * @param prop.content (optional) the content of the toast
- * @param prop.variant the toast type
- * @param prop.action (optional) the label of the action
- * @param prop.actionOnPress (optional) the function to trigger when click on the action
- * @param prop.duration (optional) to override the toast duration
- */
-declare function toast({ title, content, variant, action, actionOnPress, duration, datadogPrivacy, }: SuccessParams | ErrorParams | SuccessParamsWithAction | ErrorParamsWithAction): string;
-export { toast };

package/dist/esm/components/toast/toast.js

@@ -1,39 +0,0 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import m from "react-hot-toast";
-import { ToastAction as p } from "./parts/ToastAction.js";
-import { ToastContent as f } from "./parts/ToastContent.js";
-import { ToastTitle as T } from "./parts/ToastTitle.js";
-import { TOAST_CONFIG as u } from "./ToastManager.js";
-import { UnityToast as c } from "./UnityToast.js";
-function k({
-  title: s,
-  content: o,
-  variant: i,
-  action: t,
-  actionOnPress: n,
-  duration: d,
-  datadogPrivacy: l = "mask"
-}) {
-  return m.custom(
-    (a) => /* @__PURE__ */ e(
-      c,
-      {
-        onClose: () => {
-          m.dismiss(a.id);
-        },
-        variant: i,
-        inline: !!o,
-        "data-dd-privacy": l,
-        children: [
-          /* @__PURE__ */ r(T, { children: s }),
-          o ? /* @__PURE__ */ r(f, { children: o }) : null,
-          t ? /* @__PURE__ */ r(p, { onPress: n, children: t }) : null
-        ]
-      }
-    ),
-    { duration: d ?? u[i].duration }
-  );
-}
-export {
-  k as toast
-};

package/dist/esm/components/toggle-switch/ToggleSwitch.d.ts

@@ -1,111 +0,0 @@
-import { SwitchProps as AriaSwitchProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-export declare const toggleSwitch: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            indicator?: import('tailwind-merge').ClassNameValue;
-            label?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
-            textWrapper?: import('tailwind-merge').ClassNameValue;
-            hintText?: import('tailwind-merge').ClassNameValue;
-            knob?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            indicator?: import('tailwind-merge').ClassNameValue;
-            label?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
-            textWrapper?: import('tailwind-merge').ClassNameValue;
-            hintText?: import('tailwind-merge').ClassNameValue;
-            knob?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    container: string[];
-    textWrapper: string[];
-    label: string[];
-    hintText: string[];
-    indicator: string[];
-    knob: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            indicator?: import('tailwind-merge').ClassNameValue;
-            label?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
-            textWrapper?: import('tailwind-merge').ClassNameValue;
-            hintText?: import('tailwind-merge').ClassNameValue;
-            knob?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            indicator?: import('tailwind-merge').ClassNameValue;
-            label?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
-            textWrapper?: import('tailwind-merge').ClassNameValue;
-            hintText?: import('tailwind-merge').ClassNameValue;
-            knob?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    container: string[];
-    textWrapper: string[];
-    label: string[];
-    hintText: string[];
-    indicator: string[];
-    knob: string[];
-}, import('tailwind-variants').TVReturnType<unknown, {
-    container: string[];
-    textWrapper: string[];
-    label: string[];
-    hintText: string[];
-    indicator: string[];
-    knob: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            indicator?: import('tailwind-merge').ClassNameValue;
-            label?: import('tailwind-merge').ClassNameValue;
-            container?: import('tailwind-merge').ClassNameValue;
-            textWrapper?: import('tailwind-merge').ClassNameValue;
-            hintText?: import('tailwind-merge').ClassNameValue;
-            knob?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-interface ToggleSwitchProps extends Omit<AriaSwitchProps, 'children' | 'className' | 'style'>, VariantProps<typeof toggleSwitch> {
-    /** The label for the toggle switch. */
-    label: string;
-    /** Whether the label is visually hidden and accessible only to screen readers. */
-    isLabelSrOnly?: boolean;
-    /** A helper text to display below the toggle switch's label. */
-    helperText?: string;
-}
-/**
- * The `ToggleSwitch` component provides a binary choice input that allows users to toggle between two states.c
- * The component includes a sliding knob animation and supports various states like disabled, selected, and pressed.
- * It can be used standalone or within a form context using the ToggleSwitchField component.
- * @param {ToggleSwitchProps} props - Props for the ToggleSwitch component
- * @example
- * ```tsx
- * import { ToggleSwitch } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <ToggleSwitch
- *       label="Enable notifications"
- *       helperText="Receive updates about your account"
- *     />
- *   )
- * }
- * ```
- * @see {@link ToggleSwitchProps} for all available props
- * @remarks
- * [API](/?path=/docs/inputs-toggleswitch--docs) • [Demo](/?path=/story/inputs-toggleswitch--primary)
- */
-export declare const ToggleSwitch: import('react').ForwardRefExoticComponent<ToggleSwitchProps & import('react').RefAttributes<HTMLLabelElement>>;
-export {};

package/dist/esm/components/toggle-switch/ToggleSwitch.js

@@ -1,60 +0,0 @@
-import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
-import { Switch as g } from "react-aria-components";
-import { tv as f } from "tailwind-variants";
-const m = f({
-  slots: {
-    container: ["uy-flex uy-gap-100 uy-group"],
-    textWrapper: ["uy-flex uy-flex-col uy-gap-50"],
-    label: ["uy-typography-body uy-text-content-form-enabled"],
-    hintText: ["uy-typography-body-small uy-text-content-neutral-low"],
-    indicator: [
-      "uy-p-50 uy-w-500 uy-h-300 uy-flex uy-items-center",
-      "uy-rounded-pill",
-      "uy-border uy-border-solid uy-border-border-form-disabled uy-bg-surface-form-disabled",
-      "uy-cursor-pointer uy-transition-colors uy-duration-200 uy-ease-in-out",
-      "group-data-[pressed]:uy-bg-surface-form-pressed group-data-[pressed]:uy-border-border-form-pressed",
-      'group-data-[selected="true"]:uy-bg-surface-form-active group-data-[selected="true"]:uy-border-border-form-active group-data-[selected="true"]:group-data-[pressed]:uy-bg-surface-form-active group-data-[selected="true"]:group-data-[pressed]:uy-border-border-form-active',
-      "group-data-[disabled]:uy-bg-surface-form-disabled group-data-[disabled]:uy-border-border-form-disabled group-data-[disabled]:uy-cursor-not-allowed",
-      "group-data-[focus-visible]:uy-outline-2 group-data-[focus-visible]:uy-outline group-data-[focus-visible]:uy-outline-offset-2 group-data-[focus-visible]:uy-outline-utility-focus-ring"
-    ],
-    knob: [
-      "uy-w-200 uy-h-200 uy-rounded-circle",
-      "uy-border uy-border-solid uy-border-border-form-enabled uy-bg-surface-form-enabled",
-      "uy-transition-all uy-duration-200 uy-ease-in-out",
-      "group-data-[pressed]:uy-bg-surface-form-pressed group-data-[pressed]:uy-border-border-form-pressed",
-      'group-data-[selected="true"]:uy-translate-x-[90%] group-data-[selected="true"]:uy-border-border-inverted-enabled group-data-[selected="true"]:group-data-[pressed]:uy-bg-surface-form-pressed group-data-[selected="true"]:group-data-[pressed]:uy-border-border-inverted-pressed',
-      "group-data-[disabled]:uy-bg-surface-form-disabled group-data-[disabled]:uy-border-border-form-disabled"
-    ]
-  }
-}), h = n(
-  ({
-    label: o,
-    helperText: r,
-    isLabelSrOnly: d = !1,
-    ...u
-  }, t) => {
-    const { container: s, indicator: l, knob: i, textWrapper: y, label: p, hintText: c } = m(), b = { ...u, role: "switch" };
-    return /* @__PURE__ */ a(g, { ...b, ref: t, className: s(), children: [
-      /* @__PURE__ */ e("div", { className: l(), "data-dd-privacy": "mask", children: /* @__PURE__ */ e("div", { className: i() }) }),
-      /* @__PURE__ */ a(
-        "div",
-        {
-          className: y({
-            className: d ? "uy-sr-only" : ""
-          }),
-          "data-dd-privacy": "allow",
-          children: [
-            /* @__PURE__ */ e("span", { className: p(), children: o }),
-            r && /* @__PURE__ */ e("span", { className: c(), children: r })
-          ]
-        }
-      )
-    ] });
-  }
-);
-h.displayName = "ToggleSwitch";
-export {
-  h as ToggleSwitch,
-  m as toggleSwitch
-};

package/dist/esm/components/toggle-switch-field/ToggleSwitchField.d.ts

@@ -1,73 +0,0 @@
-import { ForwardedRef, JSX, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { infer as ZodInfer } from 'zod';
-import { Schema } from '../../hooks/use-form.types.js';
-import { LabelProps } from '../label/Label.js';
-interface FieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Pick<LabelProps, 'isRequired' | 'requiredVariant'> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the toggle switch. */
-    label: string;
-    /** Helper text to display below form field. */
-    helperText?: ReactNode;
-    /** Helper text to display below the toggle switch. */
-    switchHelperText?: string;
-    /** A contextual link to display below the toggle switch. */
-    contextualLink?: ReactNode;
-    /** The default selected value of the toggle switch. */
-    defaultSelected?: boolean;
-    /** Whether the toggle switch is disabled. */
-    isDisabled?: boolean;
-    /** Whether the toggle switch is read-only. */
-    isReadOnly?: boolean;
-    /** Whether the toggle switch is invalid. */
-    isInvalid?: boolean;
-    /** Whether the toggle switch is loading. */
-    isLoading?: boolean;
-    /** Whether the label is visually hidden and accessible only to screen readers. */
-    isLabelSrOnly?: boolean;
-}
-export type ToggleSwitchFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FieldProps<TFieldValues, TName>;
-type ToggleSwitchFieldComponent = (<TSchema extends Schema>(props: ToggleSwitchFieldProps<ZodInfer<TSchema>> & {
-    ref?: ForwardedRef<HTMLLabelElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `ToggleSwitchField` component enhances the base ToggleSwitch with form integration capabilities.
- * It automatically integrates with Unity's form context and handles value updates through the form's state management.
- *
- * The component provides form validation, helper text, and error feedback while maintaining the same
- * API as the base ToggleSwitch component. It's the recommended way to use toggle switches within forms.
- * @param {ToggleSwitchFieldProps} props - Props for the ToggleSwitchField component
- * @example
- * ```tsx
- * import { useUnityForm, ToggleSwitchField } from '@payfit/unity-components'
- * import * as z from 'zod'
- *
- * function Example() {
- *   const schema = z.object({
- *     enableFeature: z.boolean(),
- *   })
- *
- *   const { Form } = useUnityForm(schema)
- *
- *   return (
- *     <Form action={handleSubmit}>
- *       <ToggleSwitchField<typeof schema>
- *         name="enableFeature"
- *         label="Enable feature"
- *         helperText="Turn this on to enable the feature."
- *       />
- *     </Form>
- *   )
- * }
- * ```
- * @see {@link ToggleSwitchFieldProps} for all available props
- * @remarks
- * [API](/?path=/docs/forms-toggleswitchfield--docs) • [Demo](/?path=/story/forms-toggleswitchfield--primary)
- * @note The schema type parameter is needed to ensure type safety with the form's schema.
- * If you omit it, the `name` prop will not be type-safe.
- */
-declare const ToggleSwitchField: ToggleSwitchFieldComponent;
-export { ToggleSwitchField };

package/dist/esm/components/toggle-switch-field/ToggleSwitchField.js

@@ -1,67 +0,0 @@
-import { jsxs as T, jsx as o } from "react/jsx-runtime";
-import { forwardRef as w } from "react";
-import { useFormContext as S } from "react-hook-form";
-import { FormField as y } from "../form-field/FormField.js";
-import { FormControl as j } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as C } from "../form-field/parts/FormFeedbackText.js";
-import { FormHelperText as N } from "../form-field/parts/FormHelperText.js";
-import { FormLabel as P } from "../form-field/parts/FormLabel.js";
-import { ToggleSwitch as b } from "../toggle-switch/ToggleSwitch.js";
-function k({
-  name: e,
-  label: r,
-  defaultSelected: t,
-  helperText: m,
-  switchHelperText: i,
-  contextualLink: l,
-  isRequired: c,
-  isInvalid: n,
-  isLoading: p,
-  isDisabled: f,
-  isReadOnly: s,
-  requiredVariant: d,
-  isLabelSrOnly: F,
-  ...g
-}, h) {
-  const { control: u, watch: x } = S(), a = x(e);
-  return /* @__PURE__ */ T(
-    y,
-    {
-      control: u,
-      name: e,
-      className: "uy-flex uy-flex-col uy-gap-100",
-      ...{
-        isRequired: c,
-        isInvalid: n,
-        isLoading: p,
-        isDisabled: f,
-        isReadOnly: s
-      },
-      children: [
-        /* @__PURE__ */ o(P, { requiredVariant: d, children: r }),
-        /* @__PURE__ */ o(N, { children: m }),
-        /* @__PURE__ */ o(j, { children: /* @__PURE__ */ o(
-          b,
-          {
-            ref: h,
-            defaultSelected: t,
-            isSelected: a,
-            label: r,
-            isLabelSrOnly: F,
-            helperText: i,
-            ...g
-          }
-        ) }),
-        /* @__PURE__ */ o(C, {}),
-        l
-      ]
-    }
-  );
-}
-const v = w(function(r, t) {
-  return k(r, t);
-});
-v.displayName = "ToggleSwitchField";
-export {
-  v as ToggleSwitchField
-};

package/dist/esm/components/toggle-switch-group/ToggleSwitchGroup.d.ts

@@ -1,71 +0,0 @@
-import { ReactNode } from 'react';
-import { VariantProps } from 'tailwind-variants';
-export declare const toggleSwitchGroup: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy-flex uy-flex-col uy-gap-50", import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "uy-flex uy-flex-col uy-gap-50", import('tailwind-variants/dist/config.js').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export interface ToggleSwitchGroupProps extends VariantProps<typeof toggleSwitchGroup> {
-    /** The label for the group. */
-    label: string;
-    /** Helper text to display below the group. */
-    helperText?: ReactNode;
-    /** Feedback text to display below the group. */
-    feedbackText?: ReactNode;
-    /** The default selected values of the group. */
-    defaultValue?: string[];
-    /** The current selected values of the group (controlled). */
-    value?: string[];
-    /** Whether the group is disabled. */
-    isDisabled?: boolean;
-    /** Whether the group is read-only. */
-    isReadOnly?: boolean;
-    /** Whether the group is invalid. */
-    isInvalid?: boolean;
-    /** Whether the group is required. */
-    isRequired?: boolean;
-    /** The variant of the required indicator. */
-    requiredVariant?: 'required' | 'optional';
-    /** Callback when the selection changes. */
-    onChange?: (value: string[]) => void;
-    /**
-     * Handler called when the group receives focus.
-     */
-    onFocus?: (e: React.FocusEvent<HTMLFieldSetElement>) => void;
-    /**
-     * Handler called when the group loses focus.
-     */
-    onBlur?: (e: React.FocusEvent<HTMLFieldSetElement>) => void;
-    /**
-     * Handler that is called when the element's focus status changes.
-     * @param isFocused
-     */
-    onFocusChange?: (isFocused: boolean) => void;
-    children: ReactNode;
-}
-/**
- * The `ToggleSwitchGroup` component manages a collection of related toggle switches as a single unit.
- * It provides a way to select multiple options from a list of choices, with proper form field semantics
- * and accessibility features.
- *
- * The component handles the selection state internally and can be used in both controlled and uncontrolled modes.
- * It's particularly useful for settings pages, preference forms, or any scenario requiring multiple binary choices.
- * @param {ToggleSwitchGroupProps} props - Props for the ToggleSwitchGroup component
- * @example
- * ```tsx
- * import { ToggleSwitchGroup, ToggleSwitch } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <ToggleSwitchGroup
- *       label="Notification preferences"
- *       helperText="Choose how you want to receive notifications"
- *     >
- *       <ToggleSwitch value="email" label="Email notifications" />
- *       <ToggleSwitch value="sms" label="SMS notifications" />
- *       <ToggleSwitch value="push" label="Push notifications" />
- *     </ToggleSwitchGroup>
- *   )
- * }
- * ```
- * @see {@link ToggleSwitchGroupProps} for all available props
- * @remarks
- * [API](/?path=/docs/forms-toggleswitchgroup--docs) • [Demo](/?path=/story/forms-toggleswitchgroup--primary)
- */
-export declare const ToggleSwitchGroup: import('react').ForwardRefExoticComponent<ToggleSwitchGroupProps & import('react').RefAttributes<HTMLFieldSetElement>>;

package/dist/esm/components/toggle-switch-group/ToggleSwitchGroup.js

@@ -1,109 +0,0 @@
-import { jsxs as A, jsx as d } from "react/jsx-runtime";
-import { forwardRef as B, useState as H, useId as J, useRef as K, useCallback as Q, isValidElement as V, cloneElement as N, Children as U } from "react";
-import { tv as W } from "tailwind-variants";
-import { Label as X } from "../label/Label.js";
-import { Text as R } from "../text/Text.js";
-const Y = W({
-  base: "uy-flex uy-flex-col uy-gap-50"
-});
-function Z(n) {
-  if (!V(n)) return !1;
-  const r = n.props;
-  return typeof r == "object" && r !== null && "value" in r && typeof r.value == "string";
-}
-const _ = B(
-  ({
-    label: n,
-    helperText: r,
-    feedbackText: l,
-    isDisabled: b,
-    isReadOnly: G,
-    isInvalid: c,
-    isRequired: S,
-    children: I,
-    requiredVariant: h,
-    value: g,
-    defaultValue: M,
-    onChange: a,
-    onFocus: p,
-    onBlur: u,
-    onFocusChange: t,
-    ...O
-  }, $) => {
-    const f = g !== void 0, [x, D] = H(
-      M ?? []
-    ), s = f ? g : x, w = J(), j = r ? `${w}-helper` : void 0, y = c && l ? `${w}-feedback` : void 0, L = [j, y].filter(Boolean).join(" ") || void 0, E = K(!1), P = (e) => {
-      E.current = !0, p == null || p(e), t == null || t(!0);
-    }, k = (e) => {
-      E.current = !1, u == null || u(e), t == null || t(!1);
-    }, q = Q(
-      (e) => {
-        let i;
-        s.includes(e) ? i = s.filter((o) => o !== e) : i = [...s, e], f || D(i), a == null || a(i);
-      },
-      [s, f, a]
-    ), z = () => U.map(I, (e, i) => {
-      if (!Z(e)) return e;
-      const o = e, m = o.props, v = m.value;
-      return N(o, {
-        key: o.key ?? i,
-        isSelected: s.includes(v),
-        isDisabled: b ?? m.isDisabled,
-        isReadOnly: G ?? m.isReadOnly,
-        value: v,
-        onChange: () => {
-          q(v);
-        }
-      });
-    });
-    return /* @__PURE__ */ A(
-      "fieldset",
-      {
-        ...O,
-        ref: $,
-        className: Y(),
-        "aria-describedby": L,
-        "aria-invalid": c || void 0,
-        "aria-required": S || void 0,
-        disabled: b,
-        onFocus: P,
-        onBlur: k,
-        children: [
-          /* @__PURE__ */ d("legend", { className: "uy-mb-50", children: /* @__PURE__ */ d(X, { isRequired: S, requiredVariant: h, children: n }) }),
-          r && /* @__PURE__ */ d(
-            R,
-            {
-              id: j,
-              variant: "bodySmall",
-              color: "content.neutral.low",
-              slot: "description",
-              children: r
-            }
-          ),
-          /* @__PURE__ */ d("div", { className: "uy-mt-100 uy-flex uy-flex-col uy-gap-150 uy-py-25", children: z() }),
-          c && l && (typeof l == "string" ? /* @__PURE__ */ d(
-            R,
-            {
-              id: y,
-              variant: "bodySmallStrong",
-              color: "content.form.invalid",
-              slot: "errorMessage",
-              children: l
-            }
-          ) : V(l) && N(
-            l,
-            {
-              id: y,
-              slot: "errorMessage"
-            }
-          ))
-        ]
-      }
-    );
-  }
-);
-_.displayName = "ToggleSwitchGroup";
-export {
-  _ as ToggleSwitchGroup,
-  Y as toggleSwitchGroup
-};