@cerberus-design/react
Version:
The Cerberus Design React component library.
32 lines (29 loc) • 1.36 kB
JavaScript
'use client';
import { jsxs, jsx } from 'react/jsx-runtime';
import { css } from 'styled-system/css';
import { useCerberusContext } from '../../context/cerberus.js';
import { Button } from '../button/button.js';
import { DatePickerParts } from './parts.js';
import { IconButton } from '../icon-button/button.js';
function DatePickerViewControlGroup(props) {
const { icons } = useCerberusContext();
const { calendarPrev: PrevIcon, calendarNext: NextIcon } = icons;
return /* @__PURE__ */ jsxs(DatePickerParts.ViewControl, { ...props, children: [
/* @__PURE__ */ jsx(DatePickerParts.PrevTrigger, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { ariaLabel: "Previous", size: "sm", children: /* @__PURE__ */ jsx(PrevIcon, {}) }) }),
/* @__PURE__ */ jsx(DatePickerParts.ViewTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
Button,
{
className: css({
h: "2rem",
paddingInline: "md"
}),
shape: "rounded",
size: "sm",
usage: "ghost",
children: /* @__PURE__ */ jsx(DatePickerParts.RangeText, {})
}
) }),
/* @__PURE__ */ jsx(DatePickerParts.NextTrigger, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { ariaLabel: "Next", size: "sm", children: /* @__PURE__ */ jsx(NextIcon, {}) }) })
] });
}
export { DatePickerViewControlGroup };