@copilotkit/react-textarea 0.25.0 → 0.26.0-alpha.1

package/dist/chunk-ZEHF3AXH.mjs

@@ -1,45 +0,0 @@
-import { Label } from './chunk-FK2XUDQQ.mjs';
-import Chip from '@mui/material/Chip/Chip.js';
-import Avatar from '@mui/material/Avatar/Avatar.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var IncludedFilesPreview = ({
-  includedFiles,
-  setIncludedFiles
-}) => {
-  return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-2 mt-2",
-    children: [
-      /* @__PURE__ */ jsx(Label, {
-        className: "",
-        children: "Included context:"
-      }),
-      /* @__PURE__ */ jsx("div", {
-        className: "flex flex-wrap gap-2",
-        children: includedFiles.map((filePointer, index) => {
-          return /* @__PURE__ */ jsx(FileChipPreview, {
-            filePointer,
-            onDelete: () => {
-              setIncludedFiles((prev) => prev.filter((fp) => fp !== filePointer));
-            }
-          }, `file-${filePointer.sourceApplication}.${filePointer.name}`);
-        })
-      })
-    ]
-  });
-};
-var FileChipPreview = ({ filePointer, onDelete }) => {
-  return /* @__PURE__ */ jsx(Chip, {
-    label: filePointer.name,
-    onDelete,
-    avatar: /* @__PURE__ */ jsx(Avatar, {
-      src: filePointer.iconImageUri,
-      alt: filePointer.sourceApplication,
-      sx: { backgroundColor: "transparent" }
-    })
-  });
-};
-
-export { FileChipPreview, IncludedFilesPreview };
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-ZEHF3AXH.mjs.map

package/dist/chunk-ZEHF3AXH.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/hovering-toolbar/text-insertion-prompt-box/included-files-preview.tsx"],"names":[],"mappings":";;;;;AAGA,OAAO,UAAU;AACjB,OAAO,YAAY;AAYf,SACE,KADF;AALG,IAAM,uBAA4D,CAAC;AAAA,EACxE;AAAA,EACA;AACF,MAAM;AACJ,SACE,qBAAC;AAAA,IAAI,WAAU;AAAA,IACb;AAAA,0BAAC;AAAA,QAAM,WAAU;AAAA,QAAG;AAAA,OAAiB;AAAA,MACrC,oBAAC;AAAA,QAAI,WAAU;AAAA,QACZ,wBAAc,IAAI,CAAC,aAAa,UAAU;AACzC,iBACE,oBAAC;AAAA,YAEC;AAAA,YACA,UAAU,MAAM;AACd,+BAAiB,CAAC,SAAS,KAAK,OAAO,CAAC,OAAO,OAAO,WAAW,CAAC;AAAA,YACpE;AAAA,aAJK,QAAQ,YAAY,qBAAqB,YAAY,MAK5D;AAAA,QAEJ,CAAC;AAAA,OACH;AAAA;AAAA,GACF;AAEJ;AAOO,IAAM,kBAAiD,CAAC,EAAE,aAAa,SAAS,MAAM;AAC3F,SACE,oBAAC;AAAA,IACC,OAAO,YAAY;AAAA,IACnB;AAAA,IACA,QACE,oBAAC;AAAA,MACC,KAAK,YAAY;AAAA,MACjB,KAAK,YAAY;AAAA,MACjB,IAAI,EAAE,iBAAiB,cAAc;AAAA,KACtC;AAAA,GAEL;AAEJ","sourcesContent":["import { DocumentPointer } from \"@copilotkit/react-core\";\nimport { Label } from \"../../ui/label\";\nimport React from \"react\";\nimport Chip from \"@mui/material/Chip/Chip.js\";\nimport Avatar from \"@mui/material/Avatar/Avatar.js\";\n\nexport interface IncludedFilesPreviewProps {\n  includedFiles: DocumentPointer[];\n  setIncludedFiles: React.Dispatch<React.SetStateAction<DocumentPointer[]>>;\n}\n\nexport const IncludedFilesPreview: React.FC<IncludedFilesPreviewProps> = ({\n  includedFiles,\n  setIncludedFiles,\n}) => {\n  return (\n    <div className=\"flex flex-col gap-2 mt-2\">\n      <Label className=\"\">Included context:</Label>\n      <div className=\"flex flex-wrap gap-2\">\n        {includedFiles.map((filePointer, index) => {\n          return (\n            <FileChipPreview\n              key={`file-${filePointer.sourceApplication}.${filePointer.name}`}\n              filePointer={filePointer}\n              onDelete={() => {\n                setIncludedFiles((prev) => prev.filter((fp) => fp !== filePointer));\n              }}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport interface FileChipPreviewProp {\n  filePointer: DocumentPointer;\n  onDelete: () => void;\n}\n\nexport const FileChipPreview: React.FC<FileChipPreviewProp> = ({ filePointer, onDelete }) => {\n  return (\n    <Chip\n      label={filePointer.name}\n      onDelete={onDelete}\n      avatar={\n        <Avatar\n          src={filePointer.iconImageUri}\n          alt={filePointer.sourceApplication}\n          sx={{ backgroundColor: \"transparent\" }}\n        ></Avatar>\n      }\n    />\n  );\n};\n"]}

package/dist/chunk-ZKRM3DIR.mjs

@@ -1,91 +0,0 @@
-import { __objRest, __spreadProps, __spreadValues } from './chunk-MRXNTQOX.mjs';
-import { cx, css } from '@emotion/css';
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { jsx } from 'react/jsx-runtime';
-
-var Button = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, {
-      className,
-      active,
-      reversed
-    } = _b, props = __objRest(_b, [
-      "className",
-      "active",
-      "reversed"
-    ]);
-    return /* @__PURE__ */ jsx("span", __spreadProps(__spreadValues({}, props), {
-      ref,
-      className: cx(
-        className,
-        css`
-          cursor: pointer;
-          color: ${reversed ? active ? "white" : "#aaa" : active ? "black" : "#ccc"};
-        `
-      )
-    }));
-  }
-);
-var Icon = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ jsx("span", __spreadProps(__spreadValues({}, props), {
-      ref,
-      className: cx(
-        "material-icons",
-        className,
-        css`
-          font-size: 18px;
-          vertical-align: text-bottom;
-        `
-      )
-    }));
-  }
-);
-var Menu = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({}, props), {
-      "data-test-id": "menu",
-      ref,
-      className: cx(
-        className,
-        css`
-          & > * {
-            display: inline-block;
-          }
-
-          & > * + * {
-            margin-left: 15px;
-          }
-        `
-      )
-    }));
-  }
-);
-var Portal = ({ children }) => {
-  return typeof document === "object" ? ReactDOM.createPortal(children, document.body) : null;
-};
-var Toolbar = React.forwardRef(
-  (_a, ref) => {
-    var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-    return /* @__PURE__ */ jsx(Menu, __spreadProps(__spreadValues({}, props), {
-      ref,
-      className: cx(
-        className,
-        css`
-          position: relative;
-          padding: 1px 18px 17px;
-          margin: 0 -20px;
-          border-bottom: 2px solid #eee;
-          margin-bottom: 20px;
-        `
-      )
-    }));
-  }
-);
-
-export { Button, Icon, Menu, Portal, Toolbar };
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-ZKRM3DIR.mjs.map

package/dist/chunk-ZKRM3DIR.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/hovering-toolbar/hovering-toolbar-components.tsx"],"names":[],"mappings":";;;;;;;AAAA,SAAS,KAAK,UAAU;AACxB,OAAO,WAAuC;AAC9C,OAAO,cAAc;AAsBjB;AAfG,IAAM,SAAS,MAAM;AAAA,EAC1B,CACE,IAWA,QACA;AAZA,iBACE;AAAA;AAAA,MACA;AAAA,MACA;AAAA,IAdN,IAWI,IAIK,kBAJL,IAIK;AAAA,MAHH;AAAA,MACA;AAAA,MACA;AAAA;AAUF,+BAAC,yCACK,QADL;AAAA,MAEC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA;AAAA,mBAEW,WAAY,SAAS,UAAU,SAAU,SAAS,UAAU;AAAA;AAAA,MAEzE;AAAA,MACF;AAAA;AAEJ;AAEO,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,IAAuD,QAAkC;AAAzF,iBAAE,YAvCL,IAuCG,IAAgB,kBAAhB,IAAgB,CAAd;AACD,+BAAC,yCACK,QADL;AAAA,MAEC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA;AAAA;AAAA;AAAA,MAIF;AAAA,MACF;AAAA;AAEJ;AAEO,IAAM,OAAO,MAAM;AAAA,EACxB,CAAC,IAAuD,QAAiC;AAAxF,iBAAE,YAxDL,IAwDG,IAAgB,kBAAhB,IAAgB,CAAd;AACD,+BAAC,wCACK,QADL;AAAA,MAEC,gBAAa;AAAA,MACb;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASF;AAAA,MACF;AAAA;AAEJ;AACO,IAAM,SAAS,CAAC,EAAE,SAAS,MAAqC;AACrE,SAAO,OAAO,aAAa,WAAW,SAAS,aAAa,UAAU,SAAS,IAAI,IAAI;AACzF;AAEO,IAAM,UAAU,MAAM;AAAA,EAC3B,CAAC,IAAuD,QAA2B;AAAlF,iBAAE,YAjFL,IAiFG,IAAgB,kBAAhB,IAAgB,CAAd;AACD,+BAAC,uCACK,QADL;AAAA,MAEC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOF;AAAA,MACF;AAAA;AAEJ","sourcesContent":["import { css, cx } from \"@emotion/css\";\nimport React, { PropsWithChildren, Ref } from \"react\";\nimport ReactDOM from \"react-dom\";\n\ninterface BaseProps {\n  className: string;\n  [key: string]: unknown;\n}\n\nexport const Button = React.forwardRef(\n  (\n    {\n      className,\n      active,\n      reversed,\n      ...props\n    }: PropsWithChildren<\n      {\n        active: boolean;\n        reversed: boolean;\n      } & BaseProps\n    >,\n    ref: Ref<HTMLSpanElement | null>,\n  ) => (\n    <span\n      {...props}\n      ref={ref as Ref<HTMLSpanElement>}\n      className={cx(\n        className,\n        css`\n          cursor: pointer;\n          color: ${reversed ? (active ? \"white\" : \"#aaa\") : active ? \"black\" : \"#ccc\"};\n        `,\n      )}\n    />\n  ),\n);\n\nexport const Icon = React.forwardRef(\n  ({ className, ...props }: PropsWithChildren<BaseProps>, ref: Ref<HTMLSpanElement | null>) => (\n    <span\n      {...props}\n      ref={ref as Ref<HTMLSpanElement>}\n      className={cx(\n        \"material-icons\",\n        className,\n        css`\n          font-size: 18px;\n          vertical-align: text-bottom;\n        `,\n      )}\n    />\n  ),\n);\n\nexport const Menu = React.forwardRef(\n  ({ className, ...props }: PropsWithChildren<BaseProps>, ref: Ref<HTMLDivElement | null>) => (\n    <div\n      {...props}\n      data-test-id=\"menu\"\n      ref={ref as Ref<HTMLDivElement>}\n      className={cx(\n        className,\n        css`\n          & > * {\n            display: inline-block;\n          }\n\n          & > * + * {\n            margin-left: 15px;\n          }\n        `,\n      )}\n    />\n  ),\n);\nexport const Portal = ({ children }: { children: React.ReactNode }) => {\n  return typeof document === \"object\" ? ReactDOM.createPortal(children, document.body) : null;\n};\n\nexport const Toolbar = React.forwardRef(\n  ({ className, ...props }: PropsWithChildren<BaseProps>, ref?: Ref<HTMLDivElement>) => (\n    <Menu\n      {...props}\n      ref={ref}\n      className={cx(\n        className,\n        css`\n          position: relative;\n          padding: 1px 18px 17px;\n          margin: 0 -20px;\n          border-bottom: 2px solid #eee;\n          margin-bottom: 20px;\n        `,\n      )}\n    />\n  ),\n);\n"]}

package/dist/chunk-ZMNOLW5V.mjs

@@ -1,99 +0,0 @@
-import { Dialog, DialogContent } from './chunk-PDCIGRCE.mjs';
-import { cn } from './chunk-F626GQCD.mjs';
-import { __objRest, __spreadValues, __spreadProps } from './chunk-MRXNTQOX.mjs';
-import * as React from 'react';
-import { Command as Command$1 } from 'cmdk';
-import { jsx } from 'react/jsx-runtime';
-
-var Command = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx(Command$1, __spreadValues({
-    ref,
-    className: cn(
-      "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
-      className
-    )
-  }, props));
-});
-Command.displayName = Command$1.displayName;
-var CommandDialog = (_a) => {
-  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
-  return /* @__PURE__ */ jsx(Dialog, __spreadProps(__spreadValues({}, props), {
-    children: /* @__PURE__ */ jsx(DialogContent, {
-      className: "overflow-hidden p-0 shadow-lg",
-      children: /* @__PURE__ */ jsx(Command, {
-        className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5",
-        children
-      })
-    })
-  }));
-};
-var CommandInput = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx("div", {
-    className: "flex items-center border-b px-3",
-    "cmdk-input-wrapper": "",
-    children: /* @__PURE__ */ jsx(Command$1.Input, __spreadValues({
-      ref,
-      className: cn(
-        "flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      )
-    }, props))
-  });
-});
-CommandInput.displayName = Command$1.Input.displayName;
-var CommandList = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx(Command$1.List, __spreadValues({
-    ref,
-    className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden pb-2", className)
-  }, props));
-});
-CommandList.displayName = Command$1.List.displayName;
-var CommandEmpty = React.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, __spreadValues({
-  ref,
-  className: "py-6 text-center text-sm"
-}, props)));
-CommandEmpty.displayName = Command$1.Empty.displayName;
-var CommandGroup = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx(Command$1.Group, __spreadValues({
-    ref,
-    className: cn(
-      "overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
-      className
-    )
-  }, props));
-});
-CommandGroup.displayName = Command$1.Group.displayName;
-var CommandSeparator = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx(Command$1.Separator, __spreadValues({
-    ref,
-    className: cn("-mx-1 h-px bg-border", className)
-  }, props));
-});
-CommandSeparator.displayName = Command$1.Separator.displayName;
-var CommandItem = React.forwardRef((_a, ref) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx(Command$1.Item, __spreadValues({
-    ref,
-    className: cn(
-      "relative flex cursor-default select-none items-center rounded-sm text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
-    )
-  }, props));
-});
-CommandItem.displayName = Command$1.Item.displayName;
-var CommandShortcut = (_a) => {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx("span", __spreadValues({
-    className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className)
-  }, props));
-};
-CommandShortcut.displayName = "CommandShortcut";
-
-export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-ZMNOLW5V.mjs.map

package/dist/chunk-ZMNOLW5V.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ui/command.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAEA,YAAY,WAAW;AAEvB,SAAS,WAAW,wBAAwB;AAU1C;AAdF;AAUA,IAAM,UAAgB,iBAGpB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAbL,IAaG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,KACI,MACN;AAAA,CACD;AACD,QAAQ,cAAc,iBAAiB;AAIvC,IAAM,gBAAgB,CAAC,OAA+C;AAA/C,eAAE,WA3BzB,IA2BuB,IAAe,kBAAf,IAAe,CAAb;AACvB,SACE,oBAAC,yCAAW,QAAX;AAAA,IACC,8BAAC;AAAA,MAAc,WAAU;AAAA,MACvB,8BAAC;AAAA,QAAQ,WAAU;AAAA,QAChB;AAAA,OACH;AAAA,KACF;AAAA,IACF;AAEJ;AAEA,IAAM,eAAqB,iBAGzB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YA1CL,IA0CG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC;AAAA,IAAI,WAAU;AAAA,IAAkC,sBAAmB;AAAA,IAElE,8BAAC,iBAAiB,OAAjB;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,OACI,MACN;AAAA,GACF;AAAA,CACD;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,IAAM,cAAoB,iBAGxB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YA7DL,IA6DG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC,iBAAiB,MAAjB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,wDAAwD,SAAS;AAAA,KAC3E,MACN;AAAA,CACD;AAED,YAAY,cAAc,iBAAiB,KAAK;AAEhD,IAAM,eAAqB,iBAGzB,CAAC,OAAO,QACR,oBAAC,iBAAiB,OAAjB;AAAA,EAAuB;AAAA,EAAU,WAAU;AAAA,GAA+B,MAAO,CACnF;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,IAAM,eAAqB,iBAGzB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAnFL,IAmFG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC,iBAAiB,OAAjB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,KACI,MACN;AAAA,CACD;AAED,aAAa,cAAc,iBAAiB,MAAM;AAElD,IAAM,mBAAyB,iBAG7B,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAnGL,IAmGG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC,iBAAiB,WAAjB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,wBAAwB,SAAS;AAAA,KAC3C,MACN;AAAA,CACD;AACD,iBAAiB,cAAc,iBAAiB,UAAU;AAE1D,IAAM,cAAoB,iBAGxB,CAAC,IAAyB,QAAK;AAA9B,eAAE,YA/GL,IA+GG,IAAgB,kBAAhB,IAAgB,CAAd;AACH,6BAAC,iBAAiB,MAAjB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,KACI,MACN;AAAA,CACD;AAED,YAAY,cAAc,iBAAiB,KAAK;AAEhD,IAAM,kBAAkB,CAAC,OAAmE;AAAnE,eAAE,YA5H3B,IA4HyB,IAAgB,kBAAhB,IAAgB,CAAd;AACzB,SACE,oBAAC;AAAA,IACC,WAAW,GAAG,yDAAyD,SAAS;AAAA,KAC5E,MACN;AAEJ;AACA,gBAAgB,cAAc","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { DialogProps } from \"@radix-ui/react-dialog\";\nimport { Command as CommandPrimitive } from \"cmdk\";\nimport { Search } from \"lucide-react\";\n\nimport { cn } from \"../../lib/utils\";\nimport { Dialog, DialogContent } from \"./dialog\";\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      \"flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground\",\n      className,\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\ninterface CommandDialogProps extends DialogProps {}\n\nconst CommandDialog = ({ children, ...props }: CommandDialogProps) => {\n  return (\n    <Dialog {...props}>\n      <DialogContent className=\"overflow-hidden p-0 shadow-lg\">\n        <Command className=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n  <div className=\"flex items-center border-b px-3\" cmdk-input-wrapper=\"\">\n    {/* <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" /> */}\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        \"flex h-11 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\n\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn(\"max-h-[300px] overflow-y-auto overflow-x-hidden pb-2\", className)}\n    {...props}\n  />\n));\n\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => (\n  <CommandPrimitive.Empty ref={ref} className=\"py-6 text-center text-sm\" {...props} />\n));\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      \"overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground\",\n      className,\n    )}\n    {...props}\n  />\n));\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator\n    ref={ref}\n    className={cn(\"-mx-1 h-px bg-border\", className)}\n    {...props}\n  />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-default select-none items-center rounded-sm text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  />\n));\n\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span\n      className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n};\nCommandShortcut.displayName = \"CommandShortcut\";\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandShortcut,\n  CommandSeparator,\n};\n"]}