@navinc/base-react-components
Version:
Nav's Pattern Library
31 lines • 2.21 kB
JavaScript
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
import { Button } from '../button/button.js';
import { Divider } from '../divider/divider.js';
import { Icon } from '../icon/icon.js';
export const DropdownMenuButtonsRoot = DropdownMenu.Root;
const BaseDropdownMenuButtonsItem = DropdownMenu.Item;
const DropdownMenuPortal = DropdownMenu.Portal;
const DropdownMenuContent = DropdownMenu.Content;
export const DropdownMenuButtonsTrigger = (props) => (_jsx(DropdownMenu.Trigger, Object.assign({ className: "outline-none" }, props)));
export const DropdownMenuButtonsSeparator = (props) => (_jsx(Divider, Object.assign({ className: "my-25 h-25 w-full" }, props)));
export const DropdownMenuButtonsItem = (_a) => {
var { children, iconName = 'arrow_forward', disabled = false, showIcon = true } = _a, props = __rest(_a, ["children", "iconName", "disabled", "showIcon"]);
return (_jsx(BaseDropdownMenuButtonsItem, Object.assign({ className: "w-full outline-none" }, props, { children: children && (_jsxs(Button, { className: "w-full py-100 px-150 text-left gap-75 justify-between rounded-400 shadow-elevation2", disabled: disabled, children: [children, showIcon && iconName.trim() && _jsx(Icon, { name: iconName })] })) })));
};
export const DropdownMenuButtonsPortalContent = (_a) => {
var { children, sideOffset = 5 } = _a, props = __rest(_a, ["children", "sideOffset"]);
return (_jsx(DropdownMenuPortal, { children: _jsx(DropdownMenuContent, Object.assign({ className: "flex w-[288px] flex-col items-start gap-100", sideOffset: sideOffset }, props, { children: children })) }));
};
//# sourceMappingURL=dropdown-buttons.js.map