@reservoir0x/relay-kit-ui/_esm/src/components/primitives/AccessibleList.js

Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.

import { jsx as _jsx } from "react/jsx-runtime";
import React, { forwardRef } from 'react';
import * as ToggleGroup from '@radix-ui/react-toggle-group';
import { cva, css as designCss } from '@reservoir0x/relay-design-system/css';
const AccessibleListContainerCss = cva({
    base: {
        display: 'flex',
        flexDirection: 'column'
    }
});
const AccessibleListItemCss = cva({
    base: {
        display: 'flex',
        alignItems: 'center',
        position: 'relative',
        userSelect: 'none',
        cursor: 'pointer',
        '&[data-state=on]': {}
    }
});
export const AccessibleList = ({ children, onSelect, css }) => {
    return (_jsx(ToggleGroup.Root, { type: "single", loop: false, onValueChange: onSelect, className: designCss(AccessibleListContainerCss.raw(), designCss.raw(css)), children: children }));
};
export const AccessibleListItem = forwardRef(({ children, value, css, asChild, ...props }, forwardedRef) => {
    return (_jsx(ToggleGroup.Item, { value: value, className: designCss(AccessibleListItemCss.raw(), designCss.raw(css)), asChild: asChild, ...props, ref: forwardedRef, children: children }));
});
AccessibleListItem.displayName = 'AccessibleListItem';
//# sourceMappingURL=AccessibleList.js.map