@cere/cere-design-system 0.0.45 → 0.2.0

package/dist/chunk-2EBCST6X.js

@@ -0,0 +1,25 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/components/icons/CereIcon.tsx
+var _react = require('react'); var React = _interopRequireWildcard(_react);
+var _SvgIcon = require('@mui/material/SvgIcon'); var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
+var _jsxruntime = require('react/jsx-runtime');
+var CereIcon = React.forwardRef(
+  function CereIcon2(props, ref) {
+    const reactId = React.useId();
+    const clipId = `cere-icon-clip-${reactId}`;
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _SvgIcon2.default, { ref, ...props, viewBox: "0 0 24 28", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "g", { clipPath: `url(#${clipId})`, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "path",
+        {
+          d: "M12.77 26.848c-5.95 0-10.572-2.88-12.063-7.515l-.334-1.037.978-.471c.103-.051 2.668-1.35 2.509-3.901-.169-2.695-2.339-3.96-2.431-4.012L.475 9.37l.412-1.025C2.838 3.601 7.28.77 12.77.77c4.314 0 8.095 1.698 10.37 4.658l.575.748-4.535 6.146-1.013-.984c-.02-.019-2.175-2.069-4.678-2.08-2.411-.012-3.362.902-3.401.941L8.3 8.473c.164-.175 1.695-1.733 5.199-1.707 2.232.01 4.161 1.084 5.3 1.896l1.778-2.41c-1.845-1.91-4.636-2.99-7.808-2.99-4.095 0-7.459 1.91-9.182 5.155 1.042.879 2.57 2.62 2.742 5.35.185 2.95-1.692 4.806-2.913 5.692 1.445 3.043 4.932 4.895 9.354 4.895 3.063 0 6.198-1.2 8.134-3.053l-2.023-2.55c-1.077.768-2.917 1.764-5.323 1.89-3.416.177-5.436-1.404-5.52-1.471l1.536-1.954c.047.035 1.42 1.065 3.855.936 2.884-.15 4.734-2.012 4.75-2.032l.98-1.002.874 1.094 4.088 5.155-.627.779c-2.3 2.856-6.508 4.702-10.726 4.702Z",
+          fill: "currentColor"
+        }
+      ) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "defs", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "clipPath", { id: clipId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { fill: "currentColor", transform: "translate(.373 .77)", d: "M0 0h23.615v26.36H0z" }) }) })
+    ] });
+  }
+);
+
+
+
+exports.CereIcon = CereIcon;
+//# sourceMappingURL=chunk-2EBCST6X.js.map

package/dist/chunk-2EBCST6X.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/cere-design-system/cere-design-system/dist/chunk-2EBCST6X.js","../src/components/icons/CereIcon.tsx"],"names":["CereIcon"],"mappings":"AAAA;ACAA,2EAAuB;AACvB,kGAA2C;AAOrC,+CAAA;AALC,IAAM,SAAA,EAAiB,KAAA,CAAA,UAAA;AAAA,EAC5B,SAASA,SAAAA,CAAS,KAAA,EAAO,GAAA,EAAK;AAC5B,IAAA,MAAM,QAAA,EAAgB,KAAA,CAAA,KAAA,CAAM,CAAA;AAC5B,IAAA,MAAM,OAAA,EAAS,CAAA,eAAA,EAAkB,OAAO,CAAA,CAAA;AAE7B,IAAA;AACM,sBAAA;AACV,QAAA;AAAA,QAAA;AACG,UAAA;AACG,UAAA;AAAA,QAAA;AAET,MAAA;AAEE,sBAAA;AAIJ,IAAA;AAEJ,EAAA;AACF;ADH6C;AACA;AACA;AACA","file":"/home/runner/work/cere-design-system/cere-design-system/dist/chunk-2EBCST6X.js","sourcesContent":[null,"import * as React from 'react';\nimport SvgIcon, { type SvgIconProps } from '@mui/material/SvgIcon';\n\nexport const CereIcon = React.forwardRef<SVGSVGElement, SvgIconProps>(\n  function CereIcon(props, ref) {\n    const reactId = React.useId();\n    const clipId = `cere-icon-clip-${reactId}`;\n    return (\n      <SvgIcon ref={ref} {...props} viewBox=\"0 0 24 28\">\n        <g clipPath={`url(#${clipId})`}>\n          <path\n            d=\"M12.77 26.848c-5.95 0-10.572-2.88-12.063-7.515l-.334-1.037.978-.471c.103-.051 2.668-1.35 2.509-3.901-.169-2.695-2.339-3.96-2.431-4.012L.475 9.37l.412-1.025C2.838 3.601 7.28.77 12.77.77c4.314 0 8.095 1.698 10.37 4.658l.575.748-4.535 6.146-1.013-.984c-.02-.019-2.175-2.069-4.678-2.08-2.411-.012-3.362.902-3.401.941L8.3 8.473c.164-.175 1.695-1.733 5.199-1.707 2.232.01 4.161 1.084 5.3 1.896l1.778-2.41c-1.845-1.91-4.636-2.99-7.808-2.99-4.095 0-7.459 1.91-9.182 5.155 1.042.879 2.57 2.62 2.742 5.35.185 2.95-1.692 4.806-2.913 5.692 1.445 3.043 4.932 4.895 9.354 4.895 3.063 0 6.198-1.2 8.134-3.053l-2.023-2.55c-1.077.768-2.917 1.764-5.323 1.89-3.416.177-5.436-1.404-5.52-1.471l1.536-1.954c.047.035 1.42 1.065 3.855.936 2.884-.15 4.734-2.012 4.75-2.032l.98-1.002.874 1.094 4.088 5.155-.627.779c-2.3 2.856-6.508 4.702-10.726 4.702Z\"\n            fill=\"currentColor\"\n          />\n        </g>\n        <defs>\n          <clipPath id={clipId}>\n            <path fill=\"currentColor\" transform=\"translate(.373 .77)\" d=\"M0 0h23.615v26.36H0z\" />\n          </clipPath>\n        </defs>\n      </SvgIcon>\n    );\n  },\n);\n"]}

package/dist/chunk-2KDN37PQ.js

@@ -0,0 +1,486 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+var _chunkARSCL4ZZjs = require('./chunk-ARSCL4ZZ.js'); var _chunkARSCL4ZZjs2 = _interopRequireDefault(_chunkARSCL4ZZjs);
+
+
+var _chunkJBHRAAN3js = require('./chunk-JBHRAAN3.js');
+
+
+
+
+var _chunkXZZZ4MZVjs = require('./chunk-XZZZ4MZV.js');
+
+// src/components/inputs/CopyableField.tsx
+var _react = require('react'); var _react2 = _interopRequireDefault(_react);
+var _Box = require('@mui/material/Box'); var _Box2 = _interopRequireDefault(_Box);
+var _styles = require('@mui/material/styles');
+var _jsxruntime = require('react/jsx-runtime');
+var ValueButton = _styles.styled.call(void 0, "button")({
+  fontFamily: _chunkXZZZ4MZVjs.fontFamilyMono,
+  fontSize: "11.5px",
+  fontWeight: 400,
+  lineHeight: 1.45,
+  padding: "8px 10px",
+  borderRadius: "8px",
+  backgroundColor: _chunkXZZZ4MZVjs.webSurfaceTokens.surfaceMid,
+  border: `1px solid ${_chunkXZZZ4MZVjs.webSurfaceTokens.strokeOnLow}`,
+  color: _chunkXZZZ4MZVjs.webSurfaceTokens.textSecondary,
+  wordBreak: "break-all",
+  display: "block",
+  width: "100%",
+  textAlign: "left",
+  cursor: "pointer",
+  appearance: "none",
+  transition: `background ${_chunkXZZZ4MZVjs.motion.dur.fast} ${_chunkXZZZ4MZVjs.motion.ease.standard},
+               border-color ${_chunkXZZZ4MZVjs.motion.dur.fast} ${_chunkXZZZ4MZVjs.motion.ease.standard},
+               color ${_chunkXZZZ4MZVjs.motion.dur.fast} ${_chunkXZZZ4MZVjs.motion.ease.standard}`,
+  "&:hover": {
+    backgroundColor: _chunkXZZZ4MZVjs.webSurfaceTokens.surfaceContrast,
+    borderColor: _chunkXZZZ4MZVjs.webSurfaceTokens.strokeOnMed,
+    color: _chunkXZZZ4MZVjs.webSurfaceTokens.textPrimary
+  },
+  "&:active": {
+    transform: "translateY(1px)"
+  },
+  "&:focus-visible": {
+    outline: "none",
+    boxShadow: _chunkXZZZ4MZVjs.webSurfaceTokens.shadowFocus
+  }
+});
+var FlashLabel = _styles.styled.call(void 0, "span")({
+  fontSize: "11px",
+  fontWeight: 600,
+  color: _chunkXZZZ4MZVjs.webSurfaceTokens.cVioletDark,
+  letterSpacing: "0.04em",
+  "@media (prefers-reduced-motion: no-preference)": {
+    animation: "cere-copyable-flash 180ms ease-out"
+  },
+  "@keyframes cere-copyable-flash": {
+    from: { opacity: 0, transform: "translateY(-2px)" },
+    to: { opacity: 1, transform: "translateY(0)" }
+  }
+});
+var CopyableField = _react2.default.forwardRef(
+  function CopyableField2({ value, label, ariaLabel, flashDurationMs = 1400, flashLabel = "Copied", onCopy }, ref) {
+    const [copied, setCopied] = _react.useState.call(void 0, false);
+    const timerRef = _react.useRef.call(void 0, null);
+    _react.useEffect.call(void 0, 
+      () => () => {
+        if (timerRef.current) clearTimeout(timerRef.current);
+      },
+      []
+    );
+    const handleCopy = _react.useCallback.call(void 0, async () => {
+      try {
+        await navigator.clipboard.writeText(value);
+        setCopied(true);
+        _optionalChain([onCopy, 'optionalCall', _ => _(value)]);
+        if (timerRef.current) clearTimeout(timerRef.current);
+        timerRef.current = setTimeout(() => setCopied(false), flashDurationMs);
+      } catch (e2) {
+      }
+    }, [value, onCopy, flashDurationMs]);
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkARSCL4ZZjs.Card, { ref, variant: "tinted", sx: { p: 1.75 }, children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        _Box2.default,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "space-between",
+            gap: 1,
+            mb: label || copied ? "6px" : 0,
+            minHeight: label || copied ? void 0 : 0
+          },
+          children: [
+            label ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkARSCL4ZZjs2.default, { variant: "overline", children: label }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", {}),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FlashLabel, { role: "status", "aria-live": "polite", "aria-atomic": "true", children: copied ? flashLabel : "" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        ValueButton,
+        {
+          type: "button",
+          onClick: handleCopy,
+          "aria-label": _nullishCoalesce(ariaLabel, () => ( `Copy ${value}`)),
+          children: value
+        }
+      )
+    ] });
+  }
+);
+
+// src/components/inputs/SearchField.tsx
+
+var _Search = require('@mui/icons-material/Search'); var _Search2 = _interopRequireDefault(_Search);
+var _InputAdornment = require('@mui/material/InputAdornment'); var _InputAdornment2 = _interopRequireDefault(_InputAdornment);
+
+
+
+// src/components/inputs/useSearchHotkeys.ts
+
+function isMacPlatform() {
+  if (typeof navigator === "undefined") return false;
+  const uaDataPlatform = _optionalChain([navigator, 'access', _2 => _2.userAgentData, 'optionalAccess', _3 => _3.platform]);
+  if (typeof uaDataPlatform === "string") return /mac/i.test(uaDataPlatform);
+  return /Mac|iPhone|iPad|iPod/i.test(navigator.platform);
+}
+function useSearchHotkeys(inputRef, options = {}) {
+  const { k: enableK = true, slash: enableSlash = true } = options;
+  _react.useEffect.call(void 0, () => {
+    if (!enableK && !enableSlash) return;
+    const mac = isMacPlatform();
+    function onKeyDown(event) {
+      if (enableK && event.key.toLowerCase() === "k") {
+        const correctMod = mac ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;
+        if (correctMod && !event.shiftKey && !event.altKey) {
+          event.preventDefault();
+          _optionalChain([inputRef, 'access', _4 => _4.current, 'optionalAccess', _5 => _5.focus, 'call', _6 => _6()]);
+          return;
+        }
+      }
+      if (enableSlash && event.key === "/") {
+        const target = event.target;
+        const typingInField = target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement || (_nullishCoalesce(_optionalChain([target, 'optionalAccess', _7 => _7.isContentEditable]), () => ( false)));
+        if (!typingInField) {
+          event.preventDefault();
+          _optionalChain([inputRef, 'access', _8 => _8.current, 'optionalAccess', _9 => _9.focus, 'call', _10 => _10()]);
+        }
+      }
+    }
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [inputRef, enableK, enableSlash]);
+}
+
+// src/components/inputs/SearchField.tsx
+
+var ShortcutHint = () => {
+  const [mounted, setMounted] = _react.useState.call(void 0, false);
+  _react.useEffect.call(void 0, () => {
+    setMounted(true);
+  }, []);
+  if (!mounted) return null;
+  const isMac = isMacPlatform();
+  const label = isMac ? "\u2318\u2009K" : "Ctrl + K";
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _Box2.default,
+    {
+      component: "span",
+      "aria-hidden": true,
+      sx: {
+        fontFamily: "monospace",
+        fontSize: 11,
+        letterSpacing: 0.4,
+        px: 0.75,
+        py: 0.25,
+        borderRadius: 1,
+        border: "1px solid",
+        borderColor: "divider",
+        color: "text.secondary",
+        lineHeight: 1
+      },
+      children: label
+    }
+  );
+};
+var SearchField = _react2.default.forwardRef(
+  function SearchField2({
+    placeholder = "Search...",
+    onSearch,
+    onChange,
+    variant = "standard",
+    shortcutHint = false,
+    sx,
+    ...props
+  }, ref) {
+    const theme = _styles.useTheme.call(void 0, );
+    const handleChange = (e) => {
+      _optionalChain([onChange, 'optionalCall', _11 => _11(e)]);
+      _optionalChain([onSearch, 'optionalCall', _12 => _12(e.target.value)]);
+    };
+    const pillInputSx = variant === "pill" ? { borderRadius: "999px", paddingRight: "6px" } : void 0;
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkJBHRAAN3js.TextField,
+      {
+        ref,
+        placeholder,
+        onChange: handleChange,
+        sx,
+        slotProps: {
+          input: {
+            ...pillInputSx ? { sx: pillInputSx } : {},
+            startAdornment: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _InputAdornment2.default, { position: "start", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Search2.default, { style: { fontSize: 18, color: theme.palette.text.disabled } }) }),
+            endAdornment: shortcutHint ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _InputAdornment2.default, { position: "end", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ShortcutHint, {}) }) : void 0
+          }
+        },
+        ...props
+      }
+    );
+  }
+);
+
+// src/components/inputs/FormControl.tsx
+var _FormControl = require('@mui/material/FormControl'); var _FormControl2 = _interopRequireDefault(_FormControl);
+var _FormLabel = require('@mui/material/FormLabel'); var _FormLabel2 = _interopRequireDefault(_FormLabel);
+var _FormHelperText = require('@mui/material/FormHelperText'); var _FormHelperText2 = _interopRequireDefault(_FormHelperText);
+var _FormControlLabel = require('@mui/material/FormControlLabel'); var _FormControlLabel2 = _interopRequireDefault(_FormControlLabel);
+var _InputLabel = require('@mui/material/InputLabel'); var _InputLabel2 = _interopRequireDefault(_InputLabel);
+
+
+// src/components/inputs/ToggleButton.tsx
+var _ToggleButton = require('@mui/material/ToggleButton'); var _ToggleButton2 = _interopRequireDefault(_ToggleButton);
+var _ToggleButtonGroup = require('@mui/material/ToggleButtonGroup'); var _ToggleButtonGroup2 = _interopRequireDefault(_ToggleButtonGroup);
+
+
+var ToggleButton = (props) => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ToggleButton2.default, { ...props });
+};
+var StyledToggleButtonGroup = _styles.styled.call(void 0, (0, _ToggleButtonGroup2.default))(({ theme }) => ({
+  "& .MuiToggleButton-root": {
+    border: `1px solid ${theme.palette.grey[300]}`,
+    "&.Mui-selected": {
+      backgroundColor: theme.palette.primary.main,
+      color: theme.palette.primary.contrastText,
+      "&:hover": {
+        backgroundColor: theme.palette.primary.light
+      }
+    },
+    "&:hover": {
+      backgroundColor: theme.palette.grey[50]
+    }
+  }
+}));
+var ToggleButtonGroup = (props) => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledToggleButtonGroup, { ...props });
+};
+
+// src/components/inputs/Switch.tsx
+var _Switch = require('@mui/material/Switch'); var _Switch2 = _interopRequireDefault(_Switch);
+
+
+var StyledSwitch = _styles.styled.call(void 0, (0, _Switch2.default))(({ theme }) => ({
+  width: 44,
+  height: 24,
+  padding: 0,
+  "& .MuiSwitch-switchBase": {
+    padding: 0,
+    margin: 2,
+    transitionDuration: "300ms",
+    "&.Mui-checked": {
+      transform: "translateX(20px)",
+      color: theme.palette.common.white,
+      "& + .MuiSwitch-track": {
+        backgroundColor: theme.palette.success.main,
+        opacity: 1,
+        border: 0
+      },
+      "&.Mui-disabled + .MuiSwitch-track": {
+        opacity: 0.5
+      }
+    },
+    "&.Mui-focusVisible .MuiSwitch-thumb": {
+      color: theme.palette.success.main,
+      border: `6px solid ${theme.palette.common.white}`
+    },
+    "&.Mui-disabled .MuiSwitch-thumb": {
+      color: theme.palette.grey[300]
+    },
+    "&.Mui-disabled + .MuiSwitch-track": {
+      opacity: 0.5,
+      backgroundColor: theme.palette.grey[300]
+    }
+  },
+  "& .MuiSwitch-thumb": {
+    boxSizing: "border-box",
+    width: 20,
+    height: 20
+  },
+  "& .MuiSwitch-track": {
+    borderRadius: 24 / 2,
+    backgroundColor: theme.palette.grey[300],
+    opacity: 1,
+    transition: theme.transitions.create(["background-color"], {
+      duration: 500
+    })
+  }
+}));
+var Switch = ({
+  label,
+  labelPosition = "right",
+  ...props
+}) => {
+  const switchComponent = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledSwitch, { ...props });
+  if (!label) {
+    return switchComponent;
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
+    labelPosition === "left" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: label }),
+    switchComponent,
+    labelPosition === "right" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: label })
+  ] });
+};
+
+// src/components/inputs/Checkbox.tsx
+var _Checkbox = require('@mui/material/Checkbox'); var _Checkbox2 = _interopRequireDefault(_Checkbox);
+
+
+
+var StyledCheckbox = _styles.styled.call(void 0, (0, _Checkbox2.default))(({ theme }) => ({
+  color: theme.palette.grey[400],
+  "&.Mui-checked": {
+    color: theme.palette.primary.main
+  },
+  "&.MuiCheckbox-indeterminate": {
+    color: theme.palette.primary.main
+  },
+  "&.Mui-disabled": {
+    color: theme.palette.grey[300]
+  },
+  "&:hover": {
+    backgroundColor: theme.palette.background.selected
+  },
+  "&.Mui-focusVisible": {
+    outline: `2px solid ${theme.palette.primary.main}`,
+    outlineOffset: 2
+  }
+}));
+var Checkbox = ({
+  label,
+  labelPosition = "right",
+  ...props
+}) => {
+  const checkboxComponent = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledCheckbox, { ...props });
+  if (!label) {
+    return checkboxComponent;
+  }
+  const labelPlacementMap = {
+    left: "start",
+    right: "end"
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _FormControlLabel2.default,
+    {
+      control: checkboxComponent,
+      label,
+      labelPlacement: labelPlacementMap[labelPosition] || "end"
+    }
+  );
+};
+
+// src/components/inputs/Radio.tsx
+var _Radio = require('@mui/material/Radio'); var _Radio2 = _interopRequireDefault(_Radio);
+
+
+var _RadioGroup = require('@mui/material/RadioGroup'); var _RadioGroup2 = _interopRequireDefault(_RadioGroup);
+
+var StyledRadio = _styles.styled.call(void 0, (0, _Radio2.default))(({ theme }) => ({
+  color: theme.palette.grey[400],
+  "&.Mui-checked": {
+    color: theme.palette.primary.main
+  },
+  "&.Mui-disabled": {
+    color: theme.palette.grey[300]
+  },
+  "&:hover": {
+    backgroundColor: theme.palette.background.selected
+  },
+  "&.Mui-focusVisible": {
+    outline: `2px solid ${theme.palette.primary.main}`,
+    outlineOffset: 2
+  }
+}));
+var Radio = ({
+  label,
+  labelPosition = "right",
+  ...props
+}) => {
+  const radioComponent = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledRadio, { ...props });
+  if (!label) {
+    return radioComponent;
+  }
+  const labelPlacementMap = {
+    left: "start",
+    right: "end"
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _FormControlLabel2.default,
+    {
+      control: radioComponent,
+      label,
+      labelPlacement: labelPlacementMap[labelPosition] || "end"
+    }
+  );
+};
+
+// src/components/inputs/DateRangePicker/DateRangePicker.tsx
+var _Stack = require('@mui/material/Stack'); var _Stack2 = _interopRequireDefault(_Stack);
+var _Typography = require('@mui/material/Typography'); var _Typography2 = _interopRequireDefault(_Typography);
+var _DatePicker = require('@mui/x-date-pickers/DatePicker');
+var _LocalizationProvider = require('@mui/x-date-pickers/LocalizationProvider');
+var _AdapterDateFnsV3 = require('@mui/x-date-pickers/AdapterDateFnsV3');
+
+var DateRangePicker = ({
+  startDate,
+  endDate,
+  onStartDateChange,
+  onEndDateChange,
+  minDate,
+  maxDate,
+  disabled = false,
+  size = "small"
+}) => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _LocalizationProvider.LocalizationProvider, { dateAdapter: _AdapterDateFnsV3.AdapterDateFns, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Stack2.default, { direction: "row", spacing: 1, alignItems: "center", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _DatePicker.DatePicker,
+      {
+        label: "Start date",
+        value: startDate,
+        onChange: onStartDateChange,
+        minDate,
+        maxDate: _nullishCoalesce(endDate, () => ( maxDate)),
+        disabled,
+        slotProps: {
+          textField: { size }
+        }
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "body2", color: "text.secondary", children: "\u2013" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _DatePicker.DatePicker,
+      {
+        label: "End date",
+        value: endDate,
+        onChange: onEndDateChange,
+        minDate: _nullishCoalesce(startDate, () => ( minDate)),
+        maxDate,
+        disabled,
+        slotProps: {
+          textField: { size }
+        }
+      }
+    )
+  ] }) });
+};
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.CopyableField = CopyableField; exports.useSearchHotkeys = useSearchHotkeys; exports.SearchField = SearchField; exports.default = _FormControl2.default; exports.default2 = _FormLabel2.default; exports.default3 = _FormHelperText2.default; exports.default4 = _FormControlLabel2.default; exports.default5 = _InputLabel2.default; exports.default6 = _InputAdornment2.default; exports.ToggleButton = ToggleButton; exports.ToggleButtonGroup = ToggleButtonGroup; exports.Switch = Switch; exports.Checkbox = Checkbox; exports.RadioGroup = _RadioGroup2.default; exports.Radio = Radio; exports.DateRangePicker = DateRangePicker;
+//# sourceMappingURL=chunk-2KDN37PQ.js.map

package/dist/chunk-2KDN37PQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/cere-design-system/cere-design-system/dist/chunk-2KDN37PQ.js","../src/components/inputs/CopyableField.tsx","../src/components/inputs/SearchField.tsx","../src/components/inputs/useSearchHotkeys.ts","../src/components/inputs/FormControl.tsx","../src/components/inputs/ToggleButton.tsx","../src/components/inputs/Switch.tsx","../src/components/inputs/Checkbox.tsx","../src/components/inputs/Radio.tsx","../src/components/inputs/DateRangePicker/DateRangePicker.tsx"],"names":["jsx","Box","FormControlLabel"],"mappings":"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","file":"/home/runner/work/cere-design-system/cere-design-system/dist/chunk-2KDN37PQ.js","sourcesContent":[null,"import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport { Card } from '../layout/Card';\nimport { Typography } from '../layout/Typography';\nimport {\n  fontFamilyMono,\n} from '../../theme/typography';\nimport { motion } from '../../theme/motion';\nimport { webSurfaceTokens } from '../../theme/webSurfaceTokens';\n\nexport interface CopyableFieldProps {\n  /** The string copied to the clipboard. Also rendered as the button label. */\n  value: string;\n  /** Small label rendered above the value (overline-styled). */\n  label?: React.ReactNode;\n  /** Custom aria-label; defaults to \"Copy {value}\". */\n  ariaLabel?: string;\n  /** How long the \"Copied\" flash stays visible, in ms. @default 1400 */\n  flashDurationMs?: number;\n  /** Text shown during the flash. @default \"Copied\" */\n  flashLabel?: string;\n  /** Optional callback invoked after a successful copy. */\n  onCopy?: (value: string) => void;\n}\n\nconst ValueButton = styled('button')({\n  fontFamily: fontFamilyMono,\n  fontSize: '11.5px',\n  fontWeight: 400,\n  lineHeight: 1.45,\n  padding: '8px 10px',\n  borderRadius: '8px',\n  backgroundColor: webSurfaceTokens.surfaceMid,\n  border: `1px solid ${webSurfaceTokens.strokeOnLow}`,\n  color: webSurfaceTokens.textSecondary,\n  wordBreak: 'break-all',\n  display: 'block',\n  width: '100%',\n  textAlign: 'left',\n  cursor: 'pointer',\n  appearance: 'none',\n  transition: `background ${motion.dur.fast} ${motion.ease.standard},\n               border-color ${motion.dur.fast} ${motion.ease.standard},\n               color ${motion.dur.fast} ${motion.ease.standard}`,\n  '&:hover': {\n    backgroundColor: webSurfaceTokens.surfaceContrast,\n    borderColor: webSurfaceTokens.strokeOnMed,\n    color: webSurfaceTokens.textPrimary,\n  },\n  '&:active': {\n    transform: 'translateY(1px)',\n  },\n  '&:focus-visible': {\n    outline: 'none',\n    boxShadow: webSurfaceTokens.shadowFocus,\n  },\n});\n\nconst FlashLabel = styled('span')({\n  fontSize: '11px',\n  fontWeight: 600,\n  color: webSurfaceTokens.cVioletDark,\n  letterSpacing: '0.04em',\n  '@media (prefers-reduced-motion: no-preference)': {\n    animation: 'cere-copyable-flash 180ms ease-out',\n  },\n  '@keyframes cere-copyable-flash': {\n    from: { opacity: 0, transform: 'translateY(-2px)' },\n    to: { opacity: 1, transform: 'translateY(0)' },\n  },\n});\n\n/**\n * Tinted card with a label row and a monospace, click-to-copy value button.\n * Replaces ad-hoc `.share-card / .url / .share-card__flash` markup.\n */\nexport const CopyableField = React.forwardRef<HTMLDivElement, CopyableFieldProps>(\n  function CopyableField(\n    { value, label, ariaLabel, flashDurationMs = 1400, flashLabel = 'Copied', onCopy },\n    ref,\n  ) {\n  const [copied, setCopied] = useState(false);\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(\n    () => () => {\n      if (timerRef.current) clearTimeout(timerRef.current);\n    },\n    [],\n  );\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setCopied(true);\n      onCopy?.(value);\n      if (timerRef.current) clearTimeout(timerRef.current);\n      timerRef.current = setTimeout(() => setCopied(false), flashDurationMs);\n    } catch {\n      // Clipboard blocked (insecure context / permissions). The value is\n      // still visible as plain text — silently no-op.\n    }\n  }, [value, onCopy, flashDurationMs]);\n\n  return (\n    <Card ref={ref} variant=\"tinted\" sx={{ p: 1.75 }}>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          gap: 1,\n          mb: label || copied ? '6px' : 0,\n          minHeight: label || copied ? undefined : 0,\n        }}\n      >\n        {label ? <Typography variant=\"overline\">{label}</Typography> : <span />}\n        {/*\n         * Live region stays mounted (even when empty) so SRs reliably\n         * announce the swap to flashLabel after a copy. The visual flash\n         * uses the same node, so we don't double-render the text.\n         */}\n        <FlashLabel role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n          {copied ? flashLabel : ''}\n        </FlashLabel>\n      </Box>\n      <ValueButton\n        type=\"button\"\n        onClick={handleCopy}\n        aria-label={ariaLabel ?? `Copy ${value}`}\n      >\n        {value}\n      </ValueButton>\n    </Card>\n  );\n  },\n);\n","import React, { useEffect, useState } from 'react';\nimport { TextField, TextFieldProps } from './TextField';\nimport SearchIcon from '@mui/icons-material/Search';\nimport InputAdornment from '@mui/material/InputAdornment';\nimport Box from '@mui/material/Box';\nimport { useTheme } from '@mui/material/styles';\nimport { isMacPlatform } from './useSearchHotkeys';\n\nexport type SearchFieldVariant = 'standard' | 'pill';\n\nexport interface SearchFieldProps extends Omit<TextFieldProps, 'InputProps' | 'variant'> {\n  placeholder?: string;\n  /** Fires with the next input value on every change. */\n  onSearch?: (value: string) => void;\n  /** Visual treatment. `pill` renders a fully-rounded input. @default 'standard' */\n  variant?: SearchFieldVariant;\n  /**\n   * Show a keyboard-shortcut hint adornment (⌘ K on Mac, Ctrl + K elsewhere) at\n   * the right edge. Pair with `useSearchHotkeys` to wire the key handler.\n   */\n  shortcutHint?: boolean;\n}\n\nconst ShortcutHint = () => {\n  // We render nothing on the server (and on the first client render) because\n  // we have no reliable SSR signal for platform — `navigator.platform` is only\n  // available after hydration. Rendering either default (⌘ or Ctrl) would be\n  // wrong roughly half the time, so we accept a one-frame flash and swap to\n  // the correct glyph in a post-mount effect. The hint is decorative.\n  const [mounted, setMounted] = useState(false);\n  useEffect(() => {\n    setMounted(true);\n  }, []);\n  if (!mounted) return null;\n  const isMac = isMacPlatform();\n  // Mac convention is the cmd glyph + a thin gap before the letter; on other\n  // platforms the explicit \"Ctrl + K\" form reads better than \"CtrlK\".\n  const label = isMac ? '⌘ K' : 'Ctrl + K';\n  return (\n    <Box\n      component=\"span\"\n      aria-hidden\n      sx={{\n        fontFamily: 'monospace',\n        fontSize: 11,\n        letterSpacing: 0.4,\n        px: 0.75,\n        py: 0.25,\n        borderRadius: 1,\n        border: '1px solid',\n        borderColor: 'divider',\n        color: 'text.secondary',\n        lineHeight: 1,\n      }}\n    >\n      {label}\n    </Box>\n  );\n};\n\nexport const SearchField = React.forwardRef<HTMLDivElement, SearchFieldProps>(\n  function SearchField(\n    {\n      placeholder = 'Search...',\n      onSearch,\n      onChange,\n      variant = 'standard',\n      shortcutHint = false,\n      sx,\n      ...props\n    },\n    ref,\n  ) {\n  const theme = useTheme();\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    onChange?.(e);\n    onSearch?.(e.target.value);\n  };\n\n  const pillInputSx =\n    variant === 'pill'\n      ? { borderRadius: '999px', paddingRight: '6px' }\n      : undefined;\n\n  return (\n    <TextField\n      ref={ref}\n      placeholder={placeholder}\n      onChange={handleChange}\n      sx={sx}\n      slotProps={{\n        input: {\n          ...(pillInputSx ? { sx: pillInputSx } : {}),\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <SearchIcon style={{ fontSize: 18, color: theme.palette.text.disabled }} />\n            </InputAdornment>\n          ),\n          endAdornment: shortcutHint ? (\n            <InputAdornment position=\"end\">\n              <ShortcutHint />\n            </InputAdornment>\n          ) : undefined,\n        },\n      }}\n      {...props}\n    />\n  );\n  },\n);\n","import { RefObject, useEffect } from 'react';\n\nexport interface UseSearchHotkeysOptions {\n  /** Cmd/Ctrl + K focuses the ref. @default true */\n  k?: boolean;\n  /** `/` (when not already typing in another field) focuses the ref. @default true */\n  slash?: boolean;\n}\n\n/** Detect Mac via the modern `userAgentData.platform`, falling back to `navigator.platform`. */\nexport function isMacPlatform(): boolean {\n  if (typeof navigator === 'undefined') return false;\n  const uaDataPlatform = (navigator as Navigator & { userAgentData?: { platform?: string } })\n    .userAgentData?.platform;\n  if (typeof uaDataPlatform === 'string') return /mac/i.test(uaDataPlatform);\n  return /Mac|iPhone|iPad|iPod/i.test(navigator.platform);\n}\n\n/**\n * Wire global Cmd+K (Mac) / Ctrl+K (everywhere else) and `/` hotkeys to focus\n * the input pointed to by `inputRef`. The `/` hotkey is suppressed while the\n * user is typing in another input, textarea or contentEditable element so it\n * doesn't hijack normal typing. Either hotkey can be disabled via options.\n */\nexport function useSearchHotkeys(\n  inputRef: RefObject<HTMLInputElement | null>,\n  options: UseSearchHotkeysOptions = {},\n) {\n  const { k: enableK = true, slash: enableSlash = true } = options;\n\n  useEffect(() => {\n    if (!enableK && !enableSlash) return;\n    const mac = isMacPlatform();\n    function onKeyDown(event: KeyboardEvent) {\n      if (enableK && event.key.toLowerCase() === 'k') {\n        // Mac users press Cmd-K (metaKey); Ctrl-K is reserved for kill-to-end-of-line.\n        // Everyone else uses Ctrl-K. Exclude Shift/Alt so we don't hijack browser\n        // shortcuts like Cmd+Shift+K (Chrome dev tools tab).\n        const correctMod = mac ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;\n        if (correctMod && !event.shiftKey && !event.altKey) {\n          event.preventDefault();\n          inputRef.current?.focus();\n          return;\n        }\n      }\n      if (enableSlash && event.key === '/') {\n        const target = event.target as HTMLElement | null;\n        const typingInField =\n          target instanceof HTMLInputElement ||\n          target instanceof HTMLTextAreaElement ||\n          (target?.isContentEditable ?? false);\n        if (!typingInField) {\n          event.preventDefault();\n          inputRef.current?.focus();\n        }\n      }\n    }\n    window.addEventListener('keydown', onKeyDown);\n    return () => window.removeEventListener('keydown', onKeyDown);\n  }, [inputRef, enableK, enableSlash]);\n}\n","export { default as FormControl } from '@mui/material/FormControl';\nexport type { FormControlProps } from '@mui/material/FormControl';\nexport { default as FormLabel } from '@mui/material/FormLabel';\nexport type { FormLabelProps } from '@mui/material/FormLabel';\nexport { default as FormHelperText } from '@mui/material/FormHelperText';\nexport type { FormHelperTextProps } from '@mui/material/FormHelperText';\nexport { default as FormControlLabel } from '@mui/material/FormControlLabel';\nexport type { FormControlLabelProps } from '@mui/material/FormControlLabel';\nexport { default as InputLabel } from '@mui/material/InputLabel';\nexport type { InputLabelProps } from '@mui/material/InputLabel';\nexport { default as InputAdornment } from '@mui/material/InputAdornment';\nexport type { InputAdornmentProps } from '@mui/material/InputAdornment';\n\n","import React from 'react';\nimport MuiToggleButton from '@mui/material/ToggleButton';\nimport type { ToggleButtonProps as MuiToggleButtonProps } from '@mui/material/ToggleButton';\nimport MuiToggleButtonGroup from '@mui/material/ToggleButtonGroup';\nimport type { ToggleButtonGroupProps as MuiToggleButtonGroupProps } from '@mui/material/ToggleButtonGroup';\nimport { styled } from '@mui/material/styles';\n\nexport type ToggleButtonProps = MuiToggleButtonProps\n\nexport const ToggleButton: React.FC<ToggleButtonProps> = (props) => {\n  return <MuiToggleButton {...props} />;\n};\n\nexport type ToggleButtonGroupProps = MuiToggleButtonGroupProps\n\nconst StyledToggleButtonGroup = styled(MuiToggleButtonGroup)(({ theme }) => ({\n  '& .MuiToggleButton-root': {\n    border: `1px solid ${theme.palette.grey[300]}`,\n    '&.Mui-selected': {\n      backgroundColor: theme.palette.primary.main,\n      color: theme.palette.primary.contrastText,\n      '&:hover': {\n        backgroundColor: theme.palette.primary.light,\n      },\n    },\n    '&:hover': {\n      backgroundColor: theme.palette.grey[50],\n    },\n  },\n}));\n\nexport const ToggleButtonGroup: React.FC<ToggleButtonGroupProps> = (props) => {\n  return <StyledToggleButtonGroup {...props} />;\n};\n\n","import React from 'react';\nimport MuiSwitch, { SwitchProps as MuiSwitchProps } from '@mui/material/Switch';\nimport { styled } from '@mui/material/styles';\n\nexport interface SwitchProps extends MuiSwitchProps {\n  label?: string;\n  labelPosition?: 'left' | 'right';\n}\n\nconst StyledSwitch = styled(MuiSwitch)(({ theme }) => ({\n  width: 44,\n  height: 24,\n  padding: 0,\n  '& .MuiSwitch-switchBase': {\n    padding: 0,\n    margin: 2,\n    transitionDuration: '300ms',\n    '&.Mui-checked': {\n      transform: 'translateX(20px)',\n      color: theme.palette.common.white,\n      '& + .MuiSwitch-track': {\n        backgroundColor: theme.palette.success.main,\n        opacity: 1,\n        border: 0,\n      },\n      '&.Mui-disabled + .MuiSwitch-track': {\n        opacity: 0.5,\n      },\n    },\n    '&.Mui-focusVisible .MuiSwitch-thumb': {\n      color: theme.palette.success.main,\n      border: `6px solid ${theme.palette.common.white}`,\n    },\n    '&.Mui-disabled .MuiSwitch-thumb': {\n      color: theme.palette.grey[300],\n    },\n    '&.Mui-disabled + .MuiSwitch-track': {\n      opacity: 0.5,\n      backgroundColor: theme.palette.grey[300],\n    },\n  },\n  '& .MuiSwitch-thumb': {\n    boxSizing: 'border-box',\n    width: 20,\n    height: 20,\n  },\n  '& .MuiSwitch-track': {\n    borderRadius: 24 / 2,\n    backgroundColor: theme.palette.grey[300],\n    opacity: 1,\n    transition: theme.transitions.create(['background-color'], {\n      duration: 500,\n    }),\n  },\n}));\n\nexport const Switch: React.FC<SwitchProps> = ({\n  label,\n  labelPosition = 'right',\n  ...props\n}) => {\n  const switchComponent = <StyledSwitch {...props} />;\n\n  if (!label) {\n    return switchComponent;\n  }\n\n  return (\n    <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n      {labelPosition === 'left' && <span>{label}</span>}\n      {switchComponent}\n      {labelPosition === 'right' && <span>{label}</span>}\n    </div>\n  );\n};\n\n","import React from 'react';\nimport MuiCheckbox, { CheckboxProps as MuiCheckboxProps } from '@mui/material/Checkbox';\nimport { styled } from '@mui/material/styles';\nimport FormControlLabel from '@mui/material/FormControlLabel';\n\n/**\n * **Prop-forwarding note.**\n *\n * When `label` is absent, all props (including `sx` and `className`) are\n * forwarded directly to the inner `<Checkbox>` element.\n *\n * When `label` is provided, the component renders:\n * ```\n * <FormControlLabel control={<Checkbox {...props} />} label={label} />\n * ```\n * `sx` and `className` from the spread go to the inner `<Checkbox>`, NOT to\n * the outer `<FormControlLabel>`. If you need to style the label wrapper,\n * use MUI's `FormControlLabel` directly and pass `<Checkbox />` as `control`.\n */\nexport interface CheckboxProps extends Omit<MuiCheckboxProps, 'color'> {\n  label?: string;\n  labelPosition?: 'left' | 'right';\n}\n\nconst StyledCheckbox = styled(MuiCheckbox)(({ theme }) => ({\n  color: theme.palette.grey[400],\n  '&.Mui-checked': {\n    color: theme.palette.primary.main,\n  },\n  '&.MuiCheckbox-indeterminate': {\n    color: theme.palette.primary.main,\n  },\n  '&.Mui-disabled': {\n    color: theme.palette.grey[300],\n  },\n  '&:hover': {\n    backgroundColor: theme.palette.background.selected,\n  },\n  '&.Mui-focusVisible': {\n    outline: `2px solid ${theme.palette.primary.main}`,\n    outlineOffset: 2,\n  },\n}));\n\nexport const Checkbox: React.FC<CheckboxProps> = ({\n  label,\n  labelPosition = 'right',\n  ...props\n}) => {\n  const checkboxComponent = <StyledCheckbox {...props} />;\n\n  if (!label) {\n    return checkboxComponent;\n  }\n\n  const labelPlacementMap: Record<string, 'start' | 'end' | 'top' | 'bottom'> = {\n    left: 'start',\n    right: 'end',\n  };\n\n  return (\n    <FormControlLabel\n      control={checkboxComponent}\n      label={label}\n      labelPlacement={labelPlacementMap[labelPosition] || 'end'}\n    />\n  );\n};\n\n","import React from 'react';\nimport MuiRadio, { RadioProps as MuiRadioProps } from '@mui/material/Radio';\nimport { styled } from '@mui/material/styles';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport RadioGroup from '@mui/material/RadioGroup';\n\nexport interface RadioProps extends Omit<MuiRadioProps, 'color'> {\n  label?: string;\n  labelPosition?: 'left' | 'right';\n}\n\nconst StyledRadio = styled(MuiRadio)(({ theme }) => ({\n  color: theme.palette.grey[400],\n  '&.Mui-checked': {\n    color: theme.palette.primary.main,\n  },\n  '&.Mui-disabled': {\n    color: theme.palette.grey[300],\n  },\n  '&:hover': {\n    backgroundColor: theme.palette.background.selected,\n  },\n  '&.Mui-focusVisible': {\n    outline: `2px solid ${theme.palette.primary.main}`,\n    outlineOffset: 2,\n  },\n}));\n\nexport const Radio: React.FC<RadioProps> = ({\n  label,\n  labelPosition = 'right',\n  ...props\n}) => {\n  const radioComponent = <StyledRadio {...props} />;\n\n  if (!label) {\n    return radioComponent;\n  }\n\n  const labelPlacementMap: Record<string, 'start' | 'end' | 'top' | 'bottom'> = {\n    left: 'start',\n    right: 'end',\n  };\n\n  return (\n    <FormControlLabel\n      control={radioComponent}\n      label={label}\n      labelPlacement={labelPlacementMap[labelPosition] || 'end'}\n    />\n  );\n};\n\nexport { RadioGroup };\n\n","import React from 'react';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\nimport { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV3';\n\n/** Props for the DateRangePicker component. */\nexport interface DateRangePickerProps {\n  /** The selected start date, or null if unset. */\n  startDate: Date | null;\n  /** The selected end date, or null if unset. */\n  endDate: Date | null;\n  /** Callback fired when the start date changes. */\n  onStartDateChange: (date: Date | null) => void;\n  /** Callback fired when the end date changes. */\n  onEndDateChange: (date: Date | null) => void;\n  /** Earliest selectable date for both pickers. */\n  minDate?: Date;\n  /** Latest selectable date for both pickers. */\n  maxDate?: Date;\n  /** If true, both date pickers are disabled. @default false */\n  disabled?: boolean;\n  /** Size of the text field inputs. @default 'small' */\n  size?: 'small' | 'medium';\n}\n\nexport const DateRangePicker: React.FC<DateRangePickerProps> = ({\n  startDate,\n  endDate,\n  onStartDateChange,\n  onEndDateChange,\n  minDate,\n  maxDate,\n  disabled = false,\n  size = 'small',\n}) => {\n  return (\n    <LocalizationProvider dateAdapter={AdapterDateFns}>\n      <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n        <DatePicker\n          label=\"Start date\"\n          value={startDate}\n          onChange={onStartDateChange}\n          minDate={minDate}\n          maxDate={endDate ?? maxDate}\n          disabled={disabled}\n          slotProps={{\n            textField: { size },\n          }}\n        />\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          –\n        </Typography>\n        <DatePicker\n          label=\"End date\"\n          value={endDate}\n          onChange={onEndDateChange}\n          minDate={startDate ?? minDate}\n          maxDate={maxDate}\n          disabled={disabled}\n          slotProps={{\n            textField: { size },\n          }}\n        />\n      </Stack>\n    </LocalizationProvider>\n  );\n};\n"]}