@camped-ui/command 1.0.0 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,47 @@
1
+ import * as React from "react";
2
+ import { type DialogProps } from "@radix-ui/react-dialog";
3
+ declare const Command: React.ForwardRefExoticComponent<Omit<{
4
+ children?: React.ReactNode;
5
+ } & React.HTMLAttributes<HTMLDivElement> & {
6
+ label?: string;
7
+ shouldFilter?: boolean;
8
+ filter?: (value: string, search: string) => number;
9
+ value?: string;
10
+ onValueChange?: (value: string) => void;
11
+ loop?: boolean;
12
+ } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
13
+ interface CommandDialogProps extends DialogProps {
14
+ }
15
+ declare const CommandDialog: ({ children, ...props }: CommandDialogProps) => import("react/jsx-runtime").JSX.Element;
16
+ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "type"> & {
17
+ value?: string;
18
+ onValueChange?: (search: string) => void;
19
+ } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
20
+ declare const CommandList: React.ForwardRefExoticComponent<Omit<{
21
+ children?: React.ReactNode;
22
+ } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
23
+ declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
24
+ children?: React.ReactNode;
25
+ } & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
26
+ declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
27
+ children?: React.ReactNode;
28
+ } & Omit<React.HTMLAttributes<HTMLDivElement>, "value" | "heading"> & {
29
+ heading?: React.ReactNode;
30
+ value?: string;
31
+ } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
32
+ declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement> & {
33
+ alwaysRender?: boolean;
34
+ } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
35
+ declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
36
+ children?: React.ReactNode;
37
+ } & Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect" | "value" | "disabled"> & {
38
+ disabled?: boolean;
39
+ onSelect?: (value: string) => void;
40
+ value?: string;
41
+ } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
42
+ declare const CommandShortcut: {
43
+ ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
44
+ displayName: string;
45
+ };
46
+ export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };
47
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAO1D,QAAA,MAAM,OAAO;;;;;;;;;sFAYX,CAAC;AAGH,UAAU,kBAAmB,SAAQ,WAAW;CAAG;AAEnD,QAAA,MAAM,aAAa,2BAA4B,kBAAkB,4CAUhE,CAAC;AAEF,QAAA,MAAM,YAAY;;;0FAehB,CAAC;AAIH,QAAA,MAAM,WAAW;;6HASf,CAAC;AAIH,QAAA,MAAM,YAAY;;6HAShB,CAAC;AAIH,QAAA,MAAM,YAAY;;;;;sFAYhB,CAAC;AAIH,QAAA,MAAM,gBAAgB;;sFASpB,CAAC;AAGH,QAAA,MAAM,WAAW;;;;;;sFAYf,CAAC;AAIH,QAAA,MAAM,eAAe;8BAGlB,MAAM,cAAc,CAAC,eAAe,CAAC;;CAUvC,CAAC;AAGF,OAAO,EACL,OAAO,EACP,aAAa,EACb,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACjB,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,95 @@
1
+ "use client";
2
+ "use strict";
3
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
4
+ if (k2 === undefined) k2 = k;
5
+ var desc = Object.getOwnPropertyDescriptor(m, k);
6
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
7
+ desc = { enumerable: true, get: function() { return m[k]; } };
8
+ }
9
+ Object.defineProperty(o, k2, desc);
10
+ }) : (function(o, m, k, k2) {
11
+ if (k2 === undefined) k2 = k;
12
+ o[k2] = m[k];
13
+ }));
14
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
15
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
16
+ }) : function(o, v) {
17
+ o["default"] = v;
18
+ });
19
+ var __importStar = (this && this.__importStar) || function (mod) {
20
+ if (mod && mod.__esModule) return mod;
21
+ var result = {};
22
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
23
+ __setModuleDefault(result, mod);
24
+ return result;
25
+ };
26
+ var __rest = (this && this.__rest) || function (s, e) {
27
+ var t = {};
28
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
29
+ t[p] = s[p];
30
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
31
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
32
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
33
+ t[p[i]] = s[p[i]];
34
+ }
35
+ return t;
36
+ };
37
+ Object.defineProperty(exports, "__esModule", { value: true });
38
+ exports.CommandSeparator = exports.CommandShortcut = exports.CommandItem = exports.CommandGroup = exports.CommandEmpty = exports.CommandList = exports.CommandInput = exports.CommandDialog = exports.Command = void 0;
39
+ const jsx_runtime_1 = require("react/jsx-runtime");
40
+ const React = __importStar(require("react"));
41
+ const cmdk_1 = require("cmdk");
42
+ const lucide_react_1 = require("lucide-react");
43
+ const lib_1 = require("../../lib");
44
+ const dialog_1 = require("@camped-ui/dialog");
45
+ const Command = React.forwardRef((_a, ref) => {
46
+ var { className } = _a, props = __rest(_a, ["className"]);
47
+ return ((0, jsx_runtime_1.jsx)(cmdk_1.Command, Object.assign({ ref: ref, className: (0, lib_1.cn)("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground", className) }, props)));
48
+ });
49
+ exports.Command = Command;
50
+ Command.displayName = cmdk_1.Command.displayName;
51
+ const CommandDialog = (_a) => {
52
+ var { children } = _a, props = __rest(_a, ["children"]);
53
+ return ((0, jsx_runtime_1.jsx)(dialog_1.Dialog, Object.assign({}, props, { children: (0, jsx_runtime_1.jsx)(dialog_1.DialogContent, { className: "overflow-hidden p-0 shadow-lg", children: (0, jsx_runtime_1.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: children }) }) })));
54
+ };
55
+ exports.CommandDialog = CommandDialog;
56
+ const CommandInput = React.forwardRef((_a, ref) => {
57
+ var { className } = _a, props = __rest(_a, ["className"]);
58
+ return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }), (0, jsx_runtime_1.jsx)(cmdk_1.Command.Input, Object.assign({ ref: ref, className: (0, lib_1.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))] }));
59
+ });
60
+ exports.CommandInput = CommandInput;
61
+ CommandInput.displayName = cmdk_1.Command.Input.displayName;
62
+ const CommandList = React.forwardRef((_a, ref) => {
63
+ var { className } = _a, props = __rest(_a, ["className"]);
64
+ return ((0, jsx_runtime_1.jsx)(cmdk_1.Command.List, Object.assign({ ref: ref, className: (0, lib_1.cn)("max-h-[300px] overflow-y-auto overflow-x-hidden", className) }, props)));
65
+ });
66
+ exports.CommandList = CommandList;
67
+ CommandList.displayName = cmdk_1.Command.List.displayName;
68
+ const CommandEmpty = React.forwardRef((props, ref) => ((0, jsx_runtime_1.jsx)(cmdk_1.Command.Empty, Object.assign({ ref: ref, className: "py-6 text-center text-sm" }, props))));
69
+ exports.CommandEmpty = CommandEmpty;
70
+ CommandEmpty.displayName = cmdk_1.Command.Empty.displayName;
71
+ const CommandGroup = React.forwardRef((_a, ref) => {
72
+ var { className } = _a, props = __rest(_a, ["className"]);
73
+ return ((0, jsx_runtime_1.jsx)(cmdk_1.Command.Group, Object.assign({ ref: ref, className: (0, lib_1.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)));
74
+ });
75
+ exports.CommandGroup = CommandGroup;
76
+ CommandGroup.displayName = cmdk_1.Command.Group.displayName;
77
+ const CommandSeparator = React.forwardRef((_a, ref) => {
78
+ var { className } = _a, props = __rest(_a, ["className"]);
79
+ return ((0, jsx_runtime_1.jsx)(cmdk_1.Command.Separator, Object.assign({ ref: ref, className: (0, lib_1.cn)("-mx-1 h-px bg-border", className) }, props)));
80
+ });
81
+ exports.CommandSeparator = CommandSeparator;
82
+ CommandSeparator.displayName = cmdk_1.Command.Separator.displayName;
83
+ const CommandItem = React.forwardRef((_a, ref) => {
84
+ var { className } = _a, props = __rest(_a, ["className"]);
85
+ return ((0, jsx_runtime_1.jsx)(cmdk_1.Command.Item, Object.assign({ ref: ref, className: (0, lib_1.cn)("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className) }, props)));
86
+ });
87
+ exports.CommandItem = CommandItem;
88
+ CommandItem.displayName = cmdk_1.Command.Item.displayName;
89
+ const CommandShortcut = (_a) => {
90
+ var { className } = _a, props = __rest(_a, ["className"]);
91
+ return ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: (0, lib_1.cn)("ml-auto text-xs tracking-widest text-muted-foreground", className) }, props)));
92
+ };
93
+ exports.CommandShortcut = CommandShortcut;
94
+ CommandShortcut.displayName = "CommandShortcut";
95
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEb,6CAA+B;AAE/B,+BAAmD;AACnD,+CAAsC;AAEtC,mCAA+B;AAC/B,8CAA0D;AAE1D,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAG9B,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,uBAAC,cAAgB,kBACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EACX,2FAA2F,EAC3F,SAAS,CACV,IACG,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AA2HD,0BAAO;AA1HT,OAAO,CAAC,WAAW,GAAG,cAAgB,CAAC,WAAW,CAAC;AAInD,MAAM,aAAa,GAAG,CAAC,EAA0C,EAAE,EAAE;QAA9C,EAAE,QAAQ,OAAgC,EAA3B,KAAK,cAApB,YAAsB,CAAF;IACzC,OAAO,CACL,uBAAC,eAAM,oBAAK,KAAK,cACf,uBAAC,sBAAa,IAAC,SAAS,EAAC,+BAA+B,YACtD,uBAAC,OAAO,IAAC,SAAS,EAAC,6WAA6W,YAC7X,QAAQ,GACD,GACI,IACT,CACV,CAAC;AACJ,CAAC,CAAC;AA6GA,sCAAa;AA3Gf,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAGnC,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,iCAAK,SAAS,EAAC,iCAAiC,wBAAoB,EAAE,aACpE,uBAAC,qBAAM,IAAC,SAAS,EAAC,kCAAkC,GAAG,EACvD,uBAAC,cAAgB,CAAC,KAAK,kBACrB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EACX,wJAAwJ,EACxJ,SAAS,CACV,IACG,KAAK,EACT,IACE,CACP,CAAA;CAAA,CAAC,CAAC;AA6FD,oCAAY;AA3Fd,YAAY,CAAC,WAAW,GAAG,cAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;AAE9D,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,uBAAC,cAAgB,CAAC,IAAI,kBACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EAAC,iDAAiD,EAAE,SAAS,CAAC,IACvE,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AAiFD,kCAAW;AA/Eb,WAAW,CAAC,WAAW,GAAG,cAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;AAE5D,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAGnC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CAChB,uBAAC,cAAgB,CAAC,KAAK,kBACrB,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,0BAA0B,IAChC,KAAK,EACT,CACH,CAAC,CAAC;AAqED,oCAAY;AAnEd,YAAY,CAAC,WAAW,GAAG,cAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;AAE9D,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAGnC,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,uBAAC,cAAgB,CAAC,KAAK,kBACrB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EACX,wNAAwN,EACxN,SAAS,CACV,IACG,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AAsDD,oCAAY;AApDd,YAAY,CAAC,WAAW,GAAG,cAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;AAE9D,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAGvC,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,uBAAC,cAAgB,CAAC,SAAS,kBACzB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EAAC,sBAAsB,EAAE,SAAS,CAAC,IAC5C,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AA4CD,4CAAgB;AA3ClB,gBAAgB,CAAC,WAAW,GAAG,cAAgB,CAAC,SAAS,CAAC,WAAW,CAAC;AAEtE,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAuB,EAAE,GAAG,EAAE,EAAE;QAAhC,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;IAAY,OAAA,CAClC,uBAAC,cAAgB,CAAC,IAAI,kBACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,QAAE,EACX,+NAA+N,EAC/N,SAAS,CACV,IACG,KAAK,EACT,CACH,CAAA;CAAA,CAAC,CAAC;AA2BD,kCAAW;AAzBb,WAAW,CAAC,WAAW,GAAG,cAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;AAE5D,MAAM,eAAe,GAAG,CAAC,EAGe,EAAE,EAAE;QAHnB,EACvB,SAAS,OAE6B,EADnC,KAAK,cAFe,aAGxB,CADS;IAER,OAAO,CACL,+CACE,SAAS,EAAE,IAAA,QAAE,EACX,uDAAuD,EACvD,SAAS,CACV,IACG,KAAK,EACT,CACH,CAAC;AACJ,CAAC,CAAC;AAWA,0CAAe;AAVjB,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC"}
package/package.json CHANGED
@@ -1,17 +1,19 @@
1
1
  {
2
2
  "name": "@camped-ui/command",
3
- "version": "1.0.0",
4
- "main": "src/index.tsx",
3
+ "version": "1.0.5",
4
+ "main": "dist/index.js",
5
5
  "scripts": {
6
6
  "publish-package": "npm publish --access public",
7
7
  "build": "rimraf dist && tsc"
8
8
  },
9
9
  "dependencies": {
10
- "@camped-ui/lib": "1.0.0",
11
10
  "@radix-ui/react-dialog": "^1.0.2",
12
11
  "cmdk": "^0.2.0",
13
- "lucide-react": "0.105.0-alpha.4",
14
- "@camped-ui/dialog": "1.0.0"
12
+ "@camped-ui/dialog": "1.0.5"
13
+ },
14
+ "peerDependencies": {
15
+ "lucide-react": "*",
16
+ "react": "*"
15
17
  },
16
18
  "publishConfig": {
17
19
  "registry": "https://registry.npmjs.org/",
package/src/index.tsx DELETED
@@ -1,155 +0,0 @@
1
- "use client"
2
-
3
- import * as React from "react"
4
- import { type DialogProps } from "@radix-ui/react-dialog"
5
- import { Command as CommandPrimitive } from "cmdk"
6
- import { Search } from "lucide-react"
7
-
8
- import { cn } from "@camped-ui/lib"
9
- import { Dialog, DialogContent } from "@camped-ui/dialog"
10
-
11
- const Command = React.forwardRef<
12
- React.ElementRef<typeof CommandPrimitive>,
13
- React.ComponentPropsWithoutRef<typeof CommandPrimitive>
14
- >(({ className, ...props }, ref) => (
15
- <CommandPrimitive
16
- ref={ref}
17
- className={cn(
18
- "flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground",
19
- className
20
- )}
21
- {...props}
22
- />
23
- ))
24
- Command.displayName = CommandPrimitive.displayName
25
-
26
- interface CommandDialogProps extends DialogProps {}
27
-
28
- const CommandDialog = ({ children, ...props }: CommandDialogProps) => {
29
- return (
30
- <Dialog {...props}>
31
- <DialogContent className="overflow-hidden p-0 shadow-lg">
32
- <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">
33
- {children}
34
- </Command>
35
- </DialogContent>
36
- </Dialog>
37
- )
38
- }
39
-
40
- const CommandInput = React.forwardRef<
41
- React.ElementRef<typeof CommandPrimitive.Input>,
42
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
43
- >(({ className, ...props }, ref) => (
44
- <div className="flex items-center border-b px-3" cmdk-input-wrapper="">
45
- <Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
46
- <CommandPrimitive.Input
47
- ref={ref}
48
- className={cn(
49
- "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",
50
- className
51
- )}
52
- {...props}
53
- />
54
- </div>
55
- ))
56
-
57
- CommandInput.displayName = CommandPrimitive.Input.displayName
58
-
59
- const CommandList = React.forwardRef<
60
- React.ElementRef<typeof CommandPrimitive.List>,
61
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>
62
- >(({ className, ...props }, ref) => (
63
- <CommandPrimitive.List
64
- ref={ref}
65
- className={cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)}
66
- {...props}
67
- />
68
- ))
69
-
70
- CommandList.displayName = CommandPrimitive.List.displayName
71
-
72
- const CommandEmpty = React.forwardRef<
73
- React.ElementRef<typeof CommandPrimitive.Empty>,
74
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>
75
- >((props, ref) => (
76
- <CommandPrimitive.Empty
77
- ref={ref}
78
- className="py-6 text-center text-sm"
79
- {...props}
80
- />
81
- ))
82
-
83
- CommandEmpty.displayName = CommandPrimitive.Empty.displayName
84
-
85
- const CommandGroup = React.forwardRef<
86
- React.ElementRef<typeof CommandPrimitive.Group>,
87
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>
88
- >(({ className, ...props }, ref) => (
89
- <CommandPrimitive.Group
90
- ref={ref}
91
- className={cn(
92
- "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",
93
- className
94
- )}
95
- {...props}
96
- />
97
- ))
98
-
99
- CommandGroup.displayName = CommandPrimitive.Group.displayName
100
-
101
- const CommandSeparator = React.forwardRef<
102
- React.ElementRef<typeof CommandPrimitive.Separator>,
103
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>
104
- >(({ className, ...props }, ref) => (
105
- <CommandPrimitive.Separator
106
- ref={ref}
107
- className={cn("-mx-1 h-px bg-border", className)}
108
- {...props}
109
- />
110
- ))
111
- CommandSeparator.displayName = CommandPrimitive.Separator.displayName
112
-
113
- const CommandItem = React.forwardRef<
114
- React.ElementRef<typeof CommandPrimitive.Item>,
115
- React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>
116
- >(({ className, ...props }, ref) => (
117
- <CommandPrimitive.Item
118
- ref={ref}
119
- className={cn(
120
- "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
121
- className
122
- )}
123
- {...props}
124
- />
125
- ))
126
-
127
- CommandItem.displayName = CommandPrimitive.Item.displayName
128
-
129
- const CommandShortcut = ({
130
- className,
131
- ...props
132
- }: React.HTMLAttributes<HTMLSpanElement>) => {
133
- return (
134
- <span
135
- className={cn(
136
- "ml-auto text-xs tracking-widest text-muted-foreground",
137
- className
138
- )}
139
- {...props}
140
- />
141
- )
142
- }
143
- CommandShortcut.displayName = "CommandShortcut"
144
-
145
- export {
146
- Command,
147
- CommandDialog,
148
- CommandInput,
149
- CommandList,
150
- CommandEmpty,
151
- CommandGroup,
152
- CommandItem,
153
- CommandShortcut,
154
- CommandSeparator,
155
- }