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

package/dist/esm/components/selectable-card/selectableCard.variant.d.ts

@@ -1,35 +0,0 @@
-export declare const selectableCard: import('tailwind-variants').TVReturnType<{
-    isFocusVisible: {
-        true: string;
-    };
-}, {
-    base: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    isFocusVisible: {
-        true: string;
-    };
-}, {
-    isFocusVisible: {
-        true: string;
-    };
-}>, {
-    isFocusVisible: {
-        true: string;
-    };
-}, {
-    base: string[];
-}, import('tailwind-variants').TVReturnType<{
-    isFocusVisible: {
-        true: string;
-    };
-}, {
-    base: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    isFocusVisible: {
-        true: string;
-    };
-}, {
-    isFocusVisible: {
-        true: string;
-    };
-}>, unknown, unknown, undefined>>;

package/dist/esm/components/selectable-card/selectableCard.variant.js

@@ -1,24 +0,0 @@
-import { tv as r } from "tailwind-variants";
-const o = r({
-  slots: {
-    base: [
-      "uy-group",
-      "uy-flex uy-flex-row uy-items-start uy-basis-0 uy-grow uy-cursor-pointer",
-      "uy-border uy-border-solid uy-rounded-200 uy-border-border-form-enabled",
-      "uy-text-content-form-enabled",
-      "uy-bg-surface-form-enabled",
-      "hover:uy-border-border-form-hover",
-      "data-[selected]:uy-border-border-form-active",
-      "data-[invalid]:uy-border-border-form-error data-[invalid]:uy-bg-surface-form-error",
-      "focus-visible:uy-outline-2 focus-visible:uy-outline focus-visible:uy-outline-offset-2 focus-visible:uy-outline-utility-focus-ring"
-    ]
-  },
-  variants: {
-    isFocusVisible: {
-      true: "uy-outline-none uy-ring-2 uy-ring-offset-2 uy-ring-utility-focus-ring"
-    }
-  }
-});
-export {
-  o as selectableCard
-};

package/dist/esm/components/selectable-card-checkbox-group-field/SelectableCardCheckboxGroupField.d.ts

@@ -1,31 +0,0 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { LabelProps } from '../label/Label.js';
-export interface SelectableCardCheckboxGroupFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends PropsWithChildren<Pick<LabelProps, 'isRequired' | 'requiredVariant'>> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the radio button group. */
-    label: string;
-    /** Helper text to display below the radio button group. */
-    helperText?: ReactNode;
-    /** Feedback text to display, typically used for error messages. */
-    feedbackText?: ReactNode;
-}
-/**
- * The `SelectableCardCheckboxGroupField` component renders a group of selectable card checkboxes within a form field.
- * Use it to collect multiple selections from users in a visually appealing and accessible manner.
- * @example
- * ```tsx
- * import { SelectableCardCheckboxGroupField, SelectableCardCheckbox } from '@payfit/unity-components'
- *
- * <SelectableCardCheckboxGroupField name="options" label="Choose options">
- *   <SelectableCardCheckbox value="option1">Option 1</SelectableCardCheckbox>
- *   <SelectableCardCheckbox value="option2">Option 2</SelectableCardCheckbox>
- *   <SelectableCardCheckbox value="option3">Option 3</SelectableCardCheckbox>
- * </SelectableCardCheckboxGroupField>
- * ```
- * @see {@link SelectableCardCheckboxGroupFieldProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/forms-selectablecard-selectablecardradiogroupfield--docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardCheckboxGroupField: import('react').ForwardRefExoticComponent<SelectableCardCheckboxGroupFieldProps<FieldValues, string> & import('react').RefAttributes<HTMLDivElement>>;
-export { SelectableCardCheckboxGroupField };

package/dist/esm/components/selectable-card-checkbox-group-field/SelectableCardCheckboxGroupField.js

@@ -1,46 +0,0 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { useFormContext as f } from "react-hook-form";
-import { FormField as x } from "../form-field/FormField.js";
-import { FormControl as F } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as h } from "../form-field/parts/FormFeedbackText.js";
-import { FormHelperText as b } from "../form-field/parts/FormHelperText.js";
-import { FormLabel as u } from "../form-field/parts/FormLabel.js";
-import { SelectableCardCheckboxGroup as C } from "../selectable-card/selectable-card-checkbox-group/SelectableCardCheckboxGroup.js";
-const k = s(
-  ({
-    children: m,
-    name: r,
-    isRequired: l,
-    requiredVariant: t,
-    label: c,
-    helperText: i,
-    feedbackText: p,
-    ...a
-  }, d) => {
-    const { control: n } = f();
-    return /* @__PURE__ */ e(
-      x,
-      {
-        ...{
-          isRequired: l
-        },
-        control: n,
-        name: r,
-        className: "uy-gap-150",
-        children: [
-          /* @__PURE__ */ e("div", { className: "uy-flex-col uy-gap-50", children: [
-            /* @__PURE__ */ o(u, { requiredVariant: t, children: c }),
-            /* @__PURE__ */ o(b, { children: i })
-          ] }),
-          /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o(C, { ref: d, name: r, ...a, children: m }) }),
-          /* @__PURE__ */ o(h, { children: p })
-        ]
-      }
-    );
-  }
-);
-k.displayName = "SelectableCardCheckboxGroupField";
-export {
-  k as SelectableCardCheckboxGroupField
-};

package/dist/esm/components/selectable-card-radio-group-field/SelectableCardRadioGroupField.d.ts

@@ -1,31 +0,0 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { LabelProps } from '../label/Label.js';
-export interface SelectableCardRadioGroupFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends PropsWithChildren<Pick<LabelProps, 'isRequired' | 'requiredVariant'>> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the radio button group. */
-    label: string;
-    /** Helper text to display below the radio button group. */
-    helperText?: ReactNode;
-    /** Feedback text to display, typically used for error messages. */
-    feedbackText?: ReactNode;
-}
-/**
- * The `SelectableCardRadioGroupField` component renders a group of mutually exclusive selectable card options within a form field.
- * Use it to collect a single selection from users in a visually appealing and accessible manner.
- * @example
- * ```tsx
- * import { SelectableCardRadioGroupField, SelectableCardRadio } from '@payfit/unity-components'
- *
- * <SelectableCardRadioGroupField name="option" label="Choose an option">
- *   <SelectableCardRadio value="option1">Option 1</SelectableCardRadio>
- *   <SelectableCardRadio value="option2">Option 2</SelectableCardRadio>
- *   <SelectableCardRadio value="option3">Option 3</SelectableCardRadio>
- * </SelectableCardRadioGroupField>
- * ```
- * @see {@link SelectableCardRadioGroupFieldProps} for all available props
- * @remarks [API Docs](https://unity-components.payfit.io/?path=/docs/forms-selectablecard-selectablecardcheckboxgroupfield--docs) • [Design Docs](https://www.payfit.design/24f360409/p/05fc26-selectable-card)
- */
-declare const SelectableCardRadioGroupField: import('react').ForwardRefExoticComponent<SelectableCardRadioGroupFieldProps<FieldValues, string> & import('react').RefAttributes<HTMLDivElement>>;
-export { SelectableCardRadioGroupField };

package/dist/esm/components/selectable-card-radio-group-field/SelectableCardRadioGroupField.js

@@ -1,46 +0,0 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { useFormContext as f } from "react-hook-form";
-import { FormField as F } from "../form-field/FormField.js";
-import { FormControl as u } from "../form-field/parts/FormControl.js";
-import { FormFeedbackText as x } from "../form-field/parts/FormFeedbackText.js";
-import { FormHelperText as h } from "../form-field/parts/FormHelperText.js";
-import { FormLabel as b } from "../form-field/parts/FormLabel.js";
-import { SelectableCardRadioGroup as C } from "../selectable-card/selectable-card-radio-group/SelectableCardRadioGroup.js";
-const y = s(
-  ({
-    children: m,
-    name: r,
-    isRequired: l,
-    requiredVariant: i,
-    label: t,
-    helperText: a,
-    feedbackText: c,
-    ...d
-  }, p) => {
-    const { control: n } = f();
-    return /* @__PURE__ */ e(
-      F,
-      {
-        ...{
-          isRequired: l
-        },
-        control: n,
-        name: r,
-        className: "uy-gap-150",
-        children: [
-          /* @__PURE__ */ e("div", { className: "uy-flex-col uy-gap-50", children: [
-            /* @__PURE__ */ o(b, { requiredVariant: i, children: t }),
-            /* @__PURE__ */ o(h, { children: a })
-          ] }),
-          /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(C, { ref: p, name: r, ...d, children: m }) }),
-          /* @__PURE__ */ o(x, { children: c })
-        ]
-      }
-    );
-  }
-);
-y.displayName = "SelectableCardRadioGroupField";
-export {
-  y as SelectableCardRadioGroupField
-};

package/dist/esm/components/side-panel/SidePanel.d.ts

@@ -1,152 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { VariantProps } from 'tailwind-variants';
-export declare const sidePanel: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            content?: import('tailwind-merge').ClassNameValue;
-            overlay?: import('tailwind-merge').ClassNameValue;
-            wrapper?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            content?: import('tailwind-merge').ClassNameValue;
-            overlay?: import('tailwind-merge').ClassNameValue;
-            wrapper?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    overlay: string[];
-    wrapper: string[];
-    content: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            content?: import('tailwind-merge').ClassNameValue;
-            overlay?: import('tailwind-merge').ClassNameValue;
-            wrapper?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            content?: import('tailwind-merge').ClassNameValue;
-            overlay?: import('tailwind-merge').ClassNameValue;
-            wrapper?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    overlay: string[];
-    wrapper: string[];
-    content: string[];
-}, import('tailwind-variants').TVReturnType<unknown, {
-    overlay: string[];
-    wrapper: string[];
-    content: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            content?: import('tailwind-merge').ClassNameValue;
-            overlay?: import('tailwind-merge').ClassNameValue;
-            wrapper?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-export interface SidePanelProps extends PropsWithChildren<VariantProps<typeof sidePanel>> {
-    /**
-     * Controls whether the panel can be dismissed by clicking outside or using escape key.
-     * @default true
-     */
-    isDismissable?: boolean;
-    /**
-     * When true, pressing the Escape key will not close the panel.
-     * This is useful when you need to prevent accidental dismissal.
-     * @default false
-     */
-    isKeyboardDismissDisabled?: boolean;
-    /**
-     * Controls the open state of the panel in controlled mode.
-     * Must be used together with `onOpenChange`.
-     */
-    isOpen?: boolean;
-    /**
-     * Sets the initial open state in uncontrolled mode.
-     * @default false
-     */
-    defaultOpen?: boolean;
-    /**
-     * Callback fired when the open state changes.
-     * Required when using controlled mode with `isOpen`.
-     */
-    onOpenChange?: (isOpen: boolean) => void;
-}
-/**
- * The SidePanel component provides contextual space for supplementary content without fully
- * interrupting the user's workflow. It slides in from the right on desktop and from the bottom on mobile.
- *
- * You can use SidePanel to display detailed information, forms, or secondary actions while keeping
- * the main interface visible and accessible. It's ideal for multi-step processes, editing items in a list,
- * or displaying contextual details.
- *
- * Control the panel using either uncontrolled mode with `defaultOpen` or controlled mode with
- * `isOpen`/`onOpenChange` props. Customize dismissal behavior with `isDismissable` and
- * `isKeyboardDismissDisabled` props.
- * @param {SidePanelProps} props - The props for the SidePanel component
- * @see {@link SidePanelProps} for all available props
- * @example
- * ```tsx
- * import {
- *   SidePanel,
- *   SidePanelHeader,
- *   SidePanelContent,
- *   SidePanelFooter,
- *   Button
- * } from '@payfit/unity-components'
- *
- * // Uncontrolled example
- * function BasicExample() {
- *   return (
- *     <DialogTrigger>
- *       <Button>Open panel</Button>
- *       <SidePanel>
- *         <SidePanelHeader>Panel title</SidePanelHeader>
- *         <SidePanelContent>Your content here</SidePanelContent>
- *         <SidePanelFooter>
- *           <Button variant="secondary">Cancel</Button>
- *           <Button variant="primary">Save</Button>
- *         </SidePanelFooter>
- *       </SidePanel>
- *     </DialogTrigger>
- *   )
- * }
- *
- * // Controlled example
- * function ControlledExample() {
- *   const [isOpen, setIsOpen] = useState(false)
- *
- *   return (
- *     <>
- *       <Button onPress={() => setIsOpen(true)}>Open panel</Button>
- *
- *       <SidePanel isOpen={isOpen} onOpenChange={setIsOpen}>
- *         <SidePanelHeader>Panel title</SidePanelHeader>
- *         <SidePanelContent>Your content here</SidePanelContent>
- *         <SidePanelFooter>
- *           <Button
- *             variant="primary"
- *             onPress={() => setIsOpen(false)}
- *           >
- *             Close
- *           </Button>
- *         </SidePanelFooter>
- *       </SidePanel>
- *     </>
- *   )
- * }
- * ```
- * @remarks
- * [API Docs](https://unity-components.payfit.io/?path=/docs/feedback-sidepanel--docs) • [Design Docs](https://www.payfit.design/24f360409/p/21bfe4-side-panel)
- */
-declare const SidePanel: import('react').ForwardRefExoticComponent<SidePanelProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SidePanel };

package/dist/esm/components/side-panel/SidePanel.js

@@ -1,67 +0,0 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { forwardRef as f } from "react";
-import { ModalOverlay as c, Modal as g, Dialog as p } from "react-aria-components";
-import { tv as x } from "tailwind-variants";
-import { SidePanelDragIndicator as h } from "./parts/SidePanelDragIndicator.js";
-const v = x({
-  slots: {
-    overlay: [
-      "md:uy-bg-gradient-to-r md:uy-from-grayscale-L12/0 md:uy-to-grayscale-L12/10 md:uy-from-70% md:uy-via-100%",
-      "uy-fixed uy-inset-0 uy-isolate",
-      "data-[entering]:uy-animate-fade-in data-[exiting]:uy-animate-fade-out"
-    ],
-    wrapper: [
-      "uy-w-full md:uy-w-[400px]",
-      "uy-fixed uy-bottom-0 md:uy-inset-y-200 md:uy-right-200 uy-z-[100]",
-      "uy-bg-surface-neutral uy-rounded-t-200 md:uy-rounded-200 uy-shadow-flying",
-      "uy-flex uy-flex-col uy-h-[95svh] md:uy-max-h-[calc(100vh-2rem)]",
-      "uy-overflow-hidden",
-      "data-[entering]:uy-animate-slide-up-fade-in data-[exiting]:uy-animate-slide-down-fade-out md:data-[entering]:uy-animate-slide-right-fade-in md:data-[exiting]:uy-animate-slide-right-fade-out"
-    ],
-    content: [
-      "uy-flex uy-flex-col uy-h-full uy-overflow-hidden uy-outline-none"
-    ]
-  }
-}), w = f(
-  ({
-    children: a,
-    isOpen: d,
-    onOpenChange: t,
-    defaultOpen: i,
-    isDismissable: u = !0,
-    isKeyboardDismissDisabled: n = !1,
-    ...r
-  }, o) => {
-    const { overlay: y, wrapper: l, content: m } = v();
-    return /* @__PURE__ */ e(
-      c,
-      {
-        className: y(),
-        isOpen: d,
-        onOpenChange: t,
-        defaultOpen: i,
-        isDismissable: u,
-        isKeyboardDismissDisabled: n,
-        children: /* @__PURE__ */ s(
-          g,
-          {
-            "data-dd-privacy": "allow",
-            ...r,
-            ref: o,
-            className: l(),
-            "data-unity-side-panel": !0,
-            children: [
-              /* @__PURE__ */ e(h, {}),
-              /* @__PURE__ */ e(p, { className: m(), children: a })
-            ]
-          }
-        )
-      }
-    );
-  }
-);
-w.displayName = "SidePanel";
-export {
-  w as SidePanel,
-  v as sidePanel
-};

package/dist/esm/components/side-panel/parts/SidePanelContent.d.ts

@@ -1,71 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { VariantProps } from 'tailwind-variants';
-export declare const sidePanelContent: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            scroller?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            scroller?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    scroller: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            scroller?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            scroller?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    scroller: string[];
-}, import('tailwind-variants').TVReturnType<unknown, {
-    base: string[];
-    scroller: string[];
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            scroller?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-export interface SidePanelContentProps extends PropsWithChildren<VariantProps<typeof sidePanelContent>> {
-    className?: string;
-}
-/**
- * The `SidePanelContent` component renders the main content area of a side panel.
- * It takes up the majority of the space between the header and footer components
- * and adjusts for both mobile (bottom sheet) and desktop (side panel) views.
- * The content is scrollable when it exceeds the available space.
- * @component
- * @param {SidePanelContentProps} props - The props for the `SidePanelContent` component
- * @example
- * ```tsx
- * import { SidePanelContent } from '@payfit/unity-components'
- *
- * <SidePanelContent>
- *   Your panel content here
- * </SidePanelContent>
- * ```
- * @see {@link SidePanelContentProps} for all available props
- * @remarks
- * [API Docs](https://unity-components.payfit.io/?path=/docs/feedback-sidepanel--docs) • [Design Docs](https://www.payfit.design/24f360409/p/21bfe4-side-panel)
- */
-declare const SidePanelContent: import('react').ForwardRefExoticComponent<SidePanelContentProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SidePanelContent };

package/dist/esm/components/side-panel/parts/SidePanelContent.js

@@ -1,26 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as u } from "react";
-import { tv as s } from "tailwind-variants";
-const a = s({
-  slots: {
-    base: [
-      "uy-bg-surface-neutral",
-      "uy-flex uy-flex-col uy-flex-1 uy-min-h-0 uy-overflow-hidden",
-      "uy-w-full"
-    ],
-    scroller: [
-      "uy-flex-1 uy-overflow-y-auto uy-overflow-x-hidden uy-p-300",
-      "uy-h-full uy-min-h-0"
-    ]
-  }
-}), f = u(
-  ({ children: o, ...l }, r) => {
-    const { base: n, scroller: t } = a();
-    return /* @__PURE__ */ e("section", { ref: r, className: n(), ...l, children: /* @__PURE__ */ e("div", { className: t(), children: o }) });
-  }
-);
-f.displayName = "SidePanelContent";
-export {
-  f as SidePanelContent,
-  a as sidePanelContent
-};

package/dist/esm/components/side-panel/parts/SidePanelDragIndicator.d.ts

@@ -1,54 +0,0 @@
-export declare const sidePanelDragIndicator: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            indicator?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            indicator?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    indicator: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            indicator?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            indicator?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    indicator: string;
-}, import('tailwind-variants').TVReturnType<unknown, {
-    base: string[];
-    indicator: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-            indicator?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-/**
- * A drag indicator component that connects to the overlay state context and
- * provides swipe-to-dismiss functionality for the SidePanel.
- * @internal
- */
-export declare function SidePanelDragIndicator(): import("react/jsx-runtime").JSX.Element;
-export declare namespace SidePanelDragIndicator {
-    var displayName: string;
-}

package/dist/esm/components/side-panel/parts/SidePanelDragIndicator.js

@@ -1,67 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { useRef as x, useContext as D } from "react";
-import { useDrag as b } from "@use-gesture/react";
-import { OverlayTriggerStateContext as h } from "react-aria-components";
-import { tv as v } from "tailwind-variants";
-import { useBreakpointListener as P } from "../../../hooks/use-breakpoint-listener.js";
-const S = v({
-  slots: {
-    base: [
-      "md:uy-hidden uy-mx-auto uy-pt-300 uy-w-500",
-      "uy-cursor-grab uy-touch-action-none"
-    ],
-    indicator: "uy-h-50 uy-rounded-pill uy-bg-content-neutral-lowest"
-  }
-}), I = 100;
-function N() {
-  const r = x(null), n = D(h), s = P(), { base: i, indicator: l } = S(), u = s === "xs" || s === "sm", c = b(
-    (d) => {
-      var o;
-      const {
-        movement: [T, e],
-        direction: [E, m],
-        intentional: f,
-        cancel: y,
-        last: p,
-        event: g
-      } = d;
-      if (!u) {
-        y();
-        return;
-      }
-      g.preventDefault();
-      const t = (o = r.current) == null ? void 0 : o.closest(
-        "[data-unity-side-panel]"
-      );
-      if (t) {
-        if (e < 0) {
-          t.style.transform = "translate3d(0, 0, 0)";
-          return;
-        }
-        t.style.transform = `translate3d(0, ${e}px, 0)`, t.style.transition = "none", p && f && (e > I || m > 0 ? n && setTimeout(() => {
-          n.close();
-        }, 50) : (t.style.transform = "translate3d(0, 0, 0)", t.style.transition = "transform 0.3s ease"));
-      }
-    },
-    {
-      axis: "y",
-      filterTaps: !0,
-      threshold: 5
-    }
-  );
-  return /* @__PURE__ */ a(
-    "div",
-    {
-      className: i(),
-      "aria-hidden": "true",
-      ref: r,
-      ...c(),
-      children: /* @__PURE__ */ a("div", { className: l() })
-    }
-  );
-}
-N.displayName = "SidePanelDragIndicator";
-export {
-  N as SidePanelDragIndicator,
-  S as sidePanelDragIndicator
-};