@traefik-labs/faency 12.0.7

package/dist/components/DateTimePicker/DateTimePicker.cjs

@@ -0,0 +1,283 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const reactIcons = require("@radix-ui/react-icons");
+const datepicker = require("@rehookify/datepicker");
+const dateFns = require("date-fns");
+const React = require("react");
+const stitches_config = require("../../stitches.config.cjs");
+const Box = require("../Box/Box.cjs");
+const Button = require("../Button/Button.cjs");
+const Flex = require("../Flex/Flex.cjs");
+const Text = require("../Text/Text.cjs");
+const CalendarGrid = stitches_config.styled("div", {
+  display: "grid",
+  alignItems: "center",
+  gap: "$1",
+  px: "$2",
+  borderLeft: "2px solid $buttonSecondaryBorder",
+  borderRight: "2px solid $buttonSecondaryBorder"
+});
+const SevenColGrid = stitches_config.styled(CalendarGrid, {
+  gridTemplateColumns: "repeat(7, 1fr)"
+});
+const ThreeColGrid = stitches_config.styled(CalendarGrid, {
+  gridTemplateColumns: "repeat(3, 1fr)",
+  height: "100%"
+});
+const StyledDiv = stitches_config.styled("div");
+function Header({
+  centerButtonLabel,
+  centerButtonOnClick,
+  leftButtonProps,
+  rightButtonProps
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Flex.Flex, { align: "center", gap: "2", css: { px: "$2" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "button", ghost: true, variant: "secondary", ...leftButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.ChevronLeftIcon, {}) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Button.Button,
+      {
+        type: "button",
+        role: "button",
+        tabIndex: 0,
+        css: { flexGrow: 1, textAlign: "center" },
+        ghost: true,
+        onClick: centerButtonOnClick,
+        variant: "secondary",
+        children: centerButtonLabel
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "button", ghost: true, variant: "secondary", ...rightButtonProps, children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.ChevronRightIcon, {}) })
+  ] });
+}
+const DateTimePicker = React.forwardRef(
+  ({ css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config }, fowardedRef) => {
+    const {
+      data: { calendars, months, time, weekDays, years },
+      propGetters: {
+        addOffset,
+        dayButton,
+        monthButton,
+        nextYearsButton,
+        previousYearsButton,
+        subtractOffset,
+        timeButton,
+        yearButton
+      }
+    } = datepicker.useDatePicker(config);
+    const [page, setPage] = React.useState(0);
+    const { days, month, year } = calendars[0];
+    return /* @__PURE__ */ jsxRuntime.jsx(StyledDiv, { css, ref: fowardedRef, children: /* @__PURE__ */ jsxRuntime.jsxs(Flex.Flex, { direction: "column", gap: "2", css: { display: "inline-flex" }, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(Flex.Flex, { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          Box.Box,
+          {
+            css: {
+              flex: 1,
+              minHeight: config.calendar?.mode === "fluid" ? "244px" : "280px",
+              minWidth: "268px"
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                Flex.Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 0 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Header,
+                      {
+                        centerButtonLabel: month,
+                        centerButtonOnClick: () => setPage(1),
+                        leftButtonProps: subtractOffset({ months: 1 }),
+                        rightButtonProps: addOffset({ months: 1 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsxs(SevenColGrid, { children: [
+                      weekDays.map((weekDay, index) => /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { css: { lineHeight: "$sizes$6", textAlign: "center" }, children: weekDay }, index)),
+                      days.map((d) => /* @__PURE__ */ jsxRuntime.jsx(
+                        Button.Button,
+                        {
+                          type: "button",
+                          css: {
+                            width: "32px",
+                            px: 0,
+                            color: !d.disabled && !d.inCurrentMonth && !d.selected ? "$textSubtle" : void 0,
+                            fontWeight: d.now && !d.selected ? "$bold" : void 0,
+                            textAlign: "center"
+                          },
+                          ghost: !d.selected,
+                          variant: d.now || d.selected ? "primary" : "secondary",
+                          ...dayButton(d),
+                          tabIndex: dayButton(d).disabled ? dayButton(d).tabIndex : 0,
+                          children: d.day
+                        },
+                        d.$date.toString()
+                      ))
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                Flex.Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 1 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Header,
+                      {
+                        centerButtonLabel: year,
+                        centerButtonOnClick: () => setPage(2),
+                        leftButtonProps: subtractOffset({ years: 1 }),
+                        rightButtonProps: addOffset({ years: 1 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(ThreeColGrid, { children: months.map((m) => /* @__PURE__ */ jsxRuntime.jsx(
+                      Button.Button,
+                      {
+                        type: "button",
+                        css: {
+                          px: 0,
+                          fontWeight: m.now && !m.selected ? "$bold" : void 0,
+                          textAlign: "center"
+                        },
+                        ghost: !m.selected,
+                        variant: m.now || m.selected ? "primary" : "secondary",
+                        ...monthButton(m),
+                        onClick: (evt) => {
+                          setPage(0);
+                          const fn = monthButton(m).onClick;
+                          if (typeof fn !== "undefined") fn(evt);
+                        },
+                        tabIndex: monthButton(m).disabled ? monthButton(m).tabIndex : 0,
+                        children: m.month
+                      },
+                      m.$date.toString()
+                    )) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                Flex.Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 2 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Header,
+                      {
+                        centerButtonLabel: `${years[0].year} - ${years[years.length - 1].year}`,
+                        centerButtonOnClick: () => setPage(0),
+                        leftButtonProps: previousYearsButton(),
+                        rightButtonProps: nextYearsButton()
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(ThreeColGrid, { children: years.map((y) => /* @__PURE__ */ jsxRuntime.jsx(
+                      Button.Button,
+                      {
+                        type: "button",
+                        css: {
+                          px: 0,
+                          fontWeight: y.now && !y.selected ? "$bold" : void 0,
+                          textAlign: "center"
+                        },
+                        ghost: !y.selected,
+                        variant: y.now || y.selected ? "primary" : "secondary",
+                        ...yearButton(y),
+                        onClick: (evt) => {
+                          setPage(0);
+                          const fn = yearButton(y).onClick;
+                          if (typeof fn !== "undefined") fn(evt);
+                        },
+                        tabIndex: yearButton(y).disabled ? yearButton(y).tabIndex : 0,
+                        children: y.year
+                      },
+                      y.$date.toString()
+                    )) })
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        showTimePicker ? /* @__PURE__ */ jsxRuntime.jsx(Box.Box, { css: { flex: 1, width: "90px", position: "relative", overflow: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          Flex.Flex,
+          {
+            direction: "column",
+            gap: "1",
+            css: { position: "absolute", top: 0, left: 0, height: "100%", width: "100%" },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { css: { mt: "32px", ml: "8px", lineHeight: "$sizes$6" }, children: "Time" }),
+              /* @__PURE__ */ jsxRuntime.jsx(Flex.Flex, { direction: "column", gap: "1", css: { overflow: "auto", px: "$2" }, children: time.map((t) => /* @__PURE__ */ jsxRuntime.jsx(
+                Button.Button,
+                {
+                  type: "button",
+                  css: {
+                    px: "$2",
+                    fontWeight: t.now && !t.selected ? "$bold" : void 0,
+                    textAlign: "center"
+                  },
+                  ghost: !t.selected,
+                  variant: t.now || t.selected ? "primary" : "secondary",
+                  ...timeButton(t),
+                  onClick: (evt) => {
+                    const fn = timeButton(t).onClick;
+                    if (typeof fn !== "undefined") fn(evt);
+                    if (typeof onTimeButtonClick !== "undefined") onTimeButtonClick();
+                  },
+                  tabIndex: timeButton(t).disabled ? timeButton(t).tabIndex : 0,
+                  children: t.time
+                },
+                t.$date.toString()
+              )) })
+            ]
+          }
+        ) }) : void 0
+      ] }),
+      showDatePresets ? /* @__PURE__ */ jsxRuntime.jsxs(Flex.Flex, { gap: "2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button.Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([dateFns.addMonths(/* @__PURE__ */ new Date(), 1)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 1 M"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button.Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([dateFns.addMonths(/* @__PURE__ */ new Date(), 3)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 3 M"
+          }
+        ),
+        showTimePicker ? /* @__PURE__ */ jsxRuntime.jsx(
+          Button.Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([dateFns.addYears(/* @__PURE__ */ new Date(), 1)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 1 Y"
+          }
+        ) : void 0
+      ] }) : void 0
+    ] }) });
+  }
+);
+exports.DateTimePicker = DateTimePicker;
+//# sourceMappingURL=DateTimePicker.cjs.map

package/dist/components/DateTimePicker/DateTimePicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.cjs","sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"names":["styled","jsxs","Flex","jsx","Button","ChevronLeftIcon","ChevronRightIcon","useDatePicker","useState","Box","Text","addMonths","addYears"],"mappings":"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"}

package/dist/components/DateTimePicker/DateTimePicker.js

@@ -0,0 +1,283 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons";
+import { useDatePicker } from "@rehookify/datepicker";
+import { addMonths, addYears } from "date-fns";
+import React, { useState } from "react";
+import { styled } from "../../stitches.config.js";
+import { Box } from "../Box/Box.js";
+import { Button } from "../Button/Button.js";
+import { Flex } from "../Flex/Flex.js";
+import { Text } from "../Text/Text.js";
+const CalendarGrid = styled("div", {
+  display: "grid",
+  alignItems: "center",
+  gap: "$1",
+  px: "$2",
+  borderLeft: "2px solid $buttonSecondaryBorder",
+  borderRight: "2px solid $buttonSecondaryBorder"
+});
+const SevenColGrid = styled(CalendarGrid, {
+  gridTemplateColumns: "repeat(7, 1fr)"
+});
+const ThreeColGrid = styled(CalendarGrid, {
+  gridTemplateColumns: "repeat(3, 1fr)",
+  height: "100%"
+});
+const StyledDiv = styled("div");
+function Header({
+  centerButtonLabel,
+  centerButtonOnClick,
+  leftButtonProps,
+  rightButtonProps
+}) {
+  return /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", css: { px: "$2" }, children: [
+    /* @__PURE__ */ jsx(Button, { type: "button", ghost: true, variant: "secondary", ...leftButtonProps, children: /* @__PURE__ */ jsx(ChevronLeftIcon, {}) }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        role: "button",
+        tabIndex: 0,
+        css: { flexGrow: 1, textAlign: "center" },
+        ghost: true,
+        onClick: centerButtonOnClick,
+        variant: "secondary",
+        children: centerButtonLabel
+      }
+    ),
+    /* @__PURE__ */ jsx(Button, { type: "button", ghost: true, variant: "secondary", ...rightButtonProps, children: /* @__PURE__ */ jsx(ChevronRightIcon, {}) })
+  ] });
+}
+const DateTimePicker = React.forwardRef(
+  ({ css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config }, fowardedRef) => {
+    const {
+      data: { calendars, months, time, weekDays, years },
+      propGetters: {
+        addOffset,
+        dayButton,
+        monthButton,
+        nextYearsButton,
+        previousYearsButton,
+        subtractOffset,
+        timeButton,
+        yearButton
+      }
+    } = useDatePicker(config);
+    const [page, setPage] = useState(0);
+    const { days, month, year } = calendars[0];
+    return /* @__PURE__ */ jsx(StyledDiv, { css, ref: fowardedRef, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", css: { display: "inline-flex" }, children: [
+      /* @__PURE__ */ jsxs(Flex, { children: [
+        /* @__PURE__ */ jsxs(
+          Box,
+          {
+            css: {
+              flex: 1,
+              minHeight: config.calendar?.mode === "fluid" ? "244px" : "280px",
+              minWidth: "268px"
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 0 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Header,
+                      {
+                        centerButtonLabel: month,
+                        centerButtonOnClick: () => setPage(1),
+                        leftButtonProps: subtractOffset({ months: 1 }),
+                        rightButtonProps: addOffset({ months: 1 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(SevenColGrid, { children: [
+                      weekDays.map((weekDay, index) => /* @__PURE__ */ jsx(Text, { css: { lineHeight: "$sizes$6", textAlign: "center" }, children: weekDay }, index)),
+                      days.map((d) => /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          type: "button",
+                          css: {
+                            width: "32px",
+                            px: 0,
+                            color: !d.disabled && !d.inCurrentMonth && !d.selected ? "$textSubtle" : void 0,
+                            fontWeight: d.now && !d.selected ? "$bold" : void 0,
+                            textAlign: "center"
+                          },
+                          ghost: !d.selected,
+                          variant: d.now || d.selected ? "primary" : "secondary",
+                          ...dayButton(d),
+                          tabIndex: dayButton(d).disabled ? dayButton(d).tabIndex : 0,
+                          children: d.day
+                        },
+                        d.$date.toString()
+                      ))
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 1 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Header,
+                      {
+                        centerButtonLabel: year,
+                        centerButtonOnClick: () => setPage(2),
+                        leftButtonProps: subtractOffset({ years: 1 }),
+                        rightButtonProps: addOffset({ years: 1 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(ThreeColGrid, { children: months.map((m) => /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        type: "button",
+                        css: {
+                          px: 0,
+                          fontWeight: m.now && !m.selected ? "$bold" : void 0,
+                          textAlign: "center"
+                        },
+                        ghost: !m.selected,
+                        variant: m.now || m.selected ? "primary" : "secondary",
+                        ...monthButton(m),
+                        onClick: (evt) => {
+                          setPage(0);
+                          const fn = monthButton(m).onClick;
+                          if (typeof fn !== "undefined") fn(evt);
+                        },
+                        tabIndex: monthButton(m).disabled ? monthButton(m).tabIndex : 0,
+                        children: m.month
+                      },
+                      m.$date.toString()
+                    )) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Flex,
+                {
+                  direction: "column",
+                  css: { display: page === 2 ? "flex" : "none", height: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      Header,
+                      {
+                        centerButtonLabel: `${years[0].year} - ${years[years.length - 1].year}`,
+                        centerButtonOnClick: () => setPage(0),
+                        leftButtonProps: previousYearsButton(),
+                        rightButtonProps: nextYearsButton()
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(ThreeColGrid, { children: years.map((y) => /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        type: "button",
+                        css: {
+                          px: 0,
+                          fontWeight: y.now && !y.selected ? "$bold" : void 0,
+                          textAlign: "center"
+                        },
+                        ghost: !y.selected,
+                        variant: y.now || y.selected ? "primary" : "secondary",
+                        ...yearButton(y),
+                        onClick: (evt) => {
+                          setPage(0);
+                          const fn = yearButton(y).onClick;
+                          if (typeof fn !== "undefined") fn(evt);
+                        },
+                        tabIndex: yearButton(y).disabled ? yearButton(y).tabIndex : 0,
+                        children: y.year
+                      },
+                      y.$date.toString()
+                    )) })
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        showTimePicker ? /* @__PURE__ */ jsx(Box, { css: { flex: 1, width: "90px", position: "relative", overflow: "auto" }, children: /* @__PURE__ */ jsxs(
+          Flex,
+          {
+            direction: "column",
+            gap: "1",
+            css: { position: "absolute", top: 0, left: 0, height: "100%", width: "100%" },
+            children: [
+              /* @__PURE__ */ jsx(Text, { css: { mt: "32px", ml: "8px", lineHeight: "$sizes$6" }, children: "Time" }),
+              /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "1", css: { overflow: "auto", px: "$2" }, children: time.map((t) => /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  css: {
+                    px: "$2",
+                    fontWeight: t.now && !t.selected ? "$bold" : void 0,
+                    textAlign: "center"
+                  },
+                  ghost: !t.selected,
+                  variant: t.now || t.selected ? "primary" : "secondary",
+                  ...timeButton(t),
+                  onClick: (evt) => {
+                    const fn = timeButton(t).onClick;
+                    if (typeof fn !== "undefined") fn(evt);
+                    if (typeof onTimeButtonClick !== "undefined") onTimeButtonClick();
+                  },
+                  tabIndex: timeButton(t).disabled ? timeButton(t).tabIndex : 0,
+                  children: t.time
+                },
+                t.$date.toString()
+              )) })
+            ]
+          }
+        ) }) : void 0
+      ] }),
+      showDatePresets ? /* @__PURE__ */ jsxs(Flex, { gap: "2", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([addMonths(/* @__PURE__ */ new Date(), 1)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 1 M"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([addMonths(/* @__PURE__ */ new Date(), 3)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 3 M"
+          }
+        ),
+        showTimePicker ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            css: { flex: "1 1 0" },
+            variant: "secondary",
+            onClick: () => {
+              config.onDatesChange([addYears(/* @__PURE__ */ new Date(), 1)]);
+              if (typeof onFastTravelClick !== "undefined") onFastTravelClick();
+            },
+            children: "Now + 1 Y"
+          }
+        ) : void 0
+      ] }) : void 0
+    ] }) });
+  }
+);
+export {
+  DateTimePicker
+};
+//# sourceMappingURL=DateTimePicker.js.map

package/dist/components/DateTimePicker/DateTimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.js","sources":["../../../components/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@radix-ui/react-icons';\nimport { DPDatesConfig, DPPropGetter, DPUserConfig, useDatePicker } from '@rehookify/datepicker';\nimport { addMonths, addYears } from 'date-fns';\nimport React, { useState } from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Button } from '../Button';\nimport { Flex } from '../Flex';\nimport { Text } from '../Text';\n\nconst CalendarGrid = styled('div', {\n  display: 'grid',\n  alignItems: 'center',\n  gap: '$1',\n  px: '$2',\n  borderLeft: '2px solid $buttonSecondaryBorder',\n  borderRight: '2px solid $buttonSecondaryBorder',\n});\n\nconst SevenColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(7, 1fr)',\n});\n\nconst ThreeColGrid = styled(CalendarGrid, {\n  gridTemplateColumns: 'repeat(3, 1fr)',\n  height: '100%',\n});\n\nconst StyledDiv = styled('div');\n\ntype HeaderProps = {\n  centerButtonLabel: string;\n  centerButtonOnClick: () => void;\n  leftButtonProps: DPPropGetter;\n  rightButtonProps: DPPropGetter;\n};\n\nfunction Header({\n  centerButtonLabel,\n  centerButtonOnClick,\n  leftButtonProps,\n  rightButtonProps,\n}: HeaderProps) {\n  return (\n    <Flex align=\"center\" gap=\"2\" css={{ px: '$2' }}>\n      <Button type=\"button\" ghost variant=\"secondary\" {...leftButtonProps}>\n        <ChevronLeftIcon />\n      </Button>\n      <Button\n        type=\"button\"\n        role=\"button\"\n        tabIndex={0}\n        css={{ flexGrow: 1, textAlign: 'center' }}\n        ghost\n        onClick={centerButtonOnClick}\n        variant=\"secondary\"\n      >\n        {centerButtonLabel}\n      </Button>\n      <Button type=\"button\" ghost variant=\"secondary\" {...rightButtonProps}>\n        <ChevronRightIcon />\n      </Button>\n    </Flex>\n  );\n}\n\ntype CustomDPDatesConfig = Omit<DPDatesConfig, 'mode'>;\n\ntype CustomDPUserConfig = Omit<DPUserConfig, 'dates'> & {\n  dates?: Partial<CustomDPDatesConfig>;\n};\n\nexport type DateTimePickerProps = CustomDPUserConfig & {\n  css?: CSS;\n  onFastTravelClick?: () => void;\n  onTimeButtonClick?: () => void;\n  showDatePresets?: boolean;\n  showTimePicker?: boolean;\n};\n\nexport type DateTimePickerVariants = VariantProps<DateTimePickerProps>;\n\nexport const DateTimePicker = React.forwardRef<\n  React.ElementRef<typeof StyledDiv>,\n  DateTimePickerProps\n>(\n  (\n    { css, onFastTravelClick, onTimeButtonClick, showDatePresets, showTimePicker, ...config },\n    fowardedRef,\n  ) => {\n    const {\n      data: { calendars, months, time, weekDays, years },\n      propGetters: {\n        addOffset,\n        dayButton,\n        monthButton,\n        nextYearsButton,\n        previousYearsButton,\n        subtractOffset,\n        timeButton,\n        yearButton,\n      },\n    } = useDatePicker(config);\n\n    const [page, setPage] = useState<number>(0);\n\n    const { days, month, year } = calendars[0];\n\n    return (\n      <StyledDiv css={css} ref={fowardedRef}>\n        <Flex direction=\"column\" gap=\"2\" css={{ display: 'inline-flex' }}>\n          <Flex>\n            <Box\n              css={{\n                flex: 1,\n                minHeight: config.calendar?.mode === 'fluid' ? '244px' : '280px',\n                minWidth: '268px',\n              }}\n            >\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 0 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={month}\n                  centerButtonOnClick={() => setPage(1)}\n                  leftButtonProps={subtractOffset({ months: 1 })}\n                  rightButtonProps={addOffset({ months: 1 })}\n                />\n                <SevenColGrid>\n                  {weekDays.map((weekDay, index) => (\n                    <Text key={index} css={{ lineHeight: '$sizes$6', textAlign: 'center' }}>\n                      {weekDay}\n                    </Text>\n                  ))}\n                  {days.map((d) => (\n                    <Button\n                      key={d.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        width: '32px',\n                        px: 0,\n                        color:\n                          !d.disabled && !d.inCurrentMonth && !d.selected\n                            ? '$textSubtle'\n                            : undefined,\n                        fontWeight: d.now && !d.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!d.selected}\n                      variant={d.now || d.selected ? 'primary' : 'secondary'}\n                      {...dayButton(d)}\n                      tabIndex={dayButton(d).disabled ? dayButton(d).tabIndex : 0}\n                    >\n                      {d.day}\n                    </Button>\n                  ))}\n                </SevenColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 1 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={year}\n                  centerButtonOnClick={() => setPage(2)}\n                  leftButtonProps={subtractOffset({ years: 1 })}\n                  rightButtonProps={addOffset({ years: 1 })}\n                />\n                <ThreeColGrid>\n                  {months.map((m) => (\n                    <Button\n                      key={m.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: m.now && !m.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!m.selected}\n                      variant={m.now || m.selected ? 'primary' : 'secondary'}\n                      {...monthButton(m)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = monthButton(m).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={monthButton(m).disabled ? monthButton(m).tabIndex : 0}\n                    >\n                      {m.month}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n\n              <Flex\n                direction=\"column\"\n                css={{ display: page === 2 ? 'flex' : 'none', height: '100%' }}\n              >\n                <Header\n                  centerButtonLabel={`${years[0].year} - ${years[years.length - 1].year}`}\n                  centerButtonOnClick={() => setPage(0)}\n                  leftButtonProps={previousYearsButton()}\n                  rightButtonProps={nextYearsButton()}\n                />\n                <ThreeColGrid>\n                  {years.map((y) => (\n                    <Button\n                      key={y.$date.toString()}\n                      type=\"button\"\n                      css={{\n                        px: 0,\n                        fontWeight: y.now && !y.selected ? '$bold' : undefined,\n                        textAlign: 'center',\n                      }}\n                      ghost={!y.selected}\n                      variant={y.now || y.selected ? 'primary' : 'secondary'}\n                      {...yearButton(y)}\n                      onClick={(evt) => {\n                        setPage(0);\n                        const fn = yearButton(y).onClick;\n                        if (typeof fn !== 'undefined') fn(evt);\n                      }}\n                      tabIndex={yearButton(y).disabled ? yearButton(y).tabIndex : 0}\n                    >\n                      {y.year}\n                    </Button>\n                  ))}\n                </ThreeColGrid>\n              </Flex>\n            </Box>\n\n            {showTimePicker ? (\n              <Box css={{ flex: 1, width: '90px', position: 'relative', overflow: 'auto' }}>\n                <Flex\n                  direction=\"column\"\n                  gap=\"1\"\n                  css={{ position: 'absolute', top: 0, left: 0, height: '100%', width: '100%' }}\n                >\n                  <Text css={{ mt: '32px', ml: '8px', lineHeight: '$sizes$6' }}>Time</Text>\n                  <Flex direction=\"column\" gap=\"1\" css={{ overflow: 'auto', px: '$2' }}>\n                    {time.map((t) => (\n                      <Button\n                        key={t.$date.toString()}\n                        type=\"button\"\n                        css={{\n                          px: '$2',\n                          fontWeight: t.now && !t.selected ? '$bold' : undefined,\n                          textAlign: 'center',\n                        }}\n                        ghost={!t.selected}\n                        variant={t.now || t.selected ? 'primary' : 'secondary'}\n                        {...timeButton(t)}\n                        onClick={(evt) => {\n                          const fn = timeButton(t).onClick;\n                          if (typeof fn !== 'undefined') fn(evt);\n                          if (typeof onTimeButtonClick !== 'undefined') onTimeButtonClick();\n                        }}\n                        tabIndex={timeButton(t).disabled ? timeButton(t).tabIndex : 0}\n                      >\n                        {t.time}\n                      </Button>\n                    ))}\n                  </Flex>\n                </Flex>\n              </Box>\n            ) : undefined}\n          </Flex>\n\n          {showDatePresets ? (\n            <Flex gap=\"2\">\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 1)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 1 M\n              </Button>\n              <Button\n                type=\"button\"\n                css={{ flex: '1 1 0' }}\n                variant=\"secondary\"\n                onClick={() => {\n                  config.onDatesChange([addMonths(new Date(), 3)]);\n                  if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                }}\n              >\n                Now + 3 M\n              </Button>\n              {showTimePicker ? (\n                <Button\n                  type=\"button\"\n                  css={{ flex: '1 1 0' }}\n                  variant=\"secondary\"\n                  onClick={() => {\n                    config.onDatesChange([addYears(new Date(), 1)]);\n                    if (typeof onFastTravelClick !== 'undefined') onFastTravelClick();\n                  }}\n                >\n                  Now + 1 Y\n                </Button>\n              ) : undefined}\n            </Flex>\n          ) : undefined}\n        </Flex>\n      </StyledDiv>\n    );\n  },\n);\n"],"names":[],"mappings":"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"}