@shepai/cli 1.76.0-pr243.b5a1065 → 1.76.0-pr245.808d0f5

package/dist/src/presentation/web/components/features/settings/ModelPicker/index.d.ts

@@ -1,18 +0,0 @@
-export interface ModelPickerProps {
-    /** Current model identifier shown as the initial selection */
-    initialModel: string;
-    /** Optional callback notified when the model is successfully persisted */
-    onModelChange?: (model: string) => void;
-    disabled?: boolean;
-    className?: string;
-}
-/**
- * ModelPicker
- *
- * A combobox that lets the user choose the default LLM model. On mount it
- * calls the `getSupportedModels` server action to populate suggestions for
- * the currently configured agent; the user may also type any free-text model
- * identifier. On selection the new value is persisted via `updateModel`.
- */
-export declare function ModelPicker({ initialModel, onModelChange, disabled, className, }: ModelPickerProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/src/presentation/web/components/features/settings/ModelPicker/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../src/presentation/web/components/features/settings/ModelPicker/index.tsx"],"names":[],"mappings":"AAkBA,MAAM,WAAW,gBAAgB;IAC/B,8DAA8D;IAC9D,YAAY,EAAE,MAAM,CAAC;IACrB,0EAA0E;IAC1E,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,SAAS,GACV,EAAE,gBAAgB,2CA8HlB"}

package/dist/src/presentation/web/components/features/settings/ModelPicker/index.js

@@ -1,84 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { Check, ChevronsUpDown } from 'lucide-react';
-import { getSupportedModels } from '../../../../app/actions/get-supported-models.js';
-import { updateModel } from '../../../../app/actions/update-model.js';
-import { Button } from '../../../ui/button.js';
-import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from '../../../ui/command.js';
-import { Popover, PopoverContent, PopoverTrigger } from '../../../ui/popover.js';
-import { cn } from '../../../../lib/utils.js';
-/**
- * ModelPicker
- *
- * A combobox that lets the user choose the default LLM model. On mount it
- * calls the `getSupportedModels` server action to populate suggestions for
- * the currently configured agent; the user may also type any free-text model
- * identifier. On selection the new value is persisted via `updateModel`.
- */
-export function ModelPicker({ initialModel, onModelChange, disabled, className, }) {
-    const [open, setOpen] = React.useState(false);
-    const [models, setModels] = React.useState([]);
-    const [loading, setLoading] = React.useState(true);
-    const [saving, setSaving] = React.useState(false);
-    const [value, setValue] = React.useState(initialModel);
-    const [inputValue, setInputValue] = React.useState(initialModel);
-    const [error, setError] = React.useState(null);
-    // Load advertised models on mount
-    React.useEffect(() => {
-        getSupportedModels()
-            .then(setModels)
-            .finally(() => setLoading(false));
-    }, []);
-    // Keep local state in sync when initialModel prop changes
-    React.useEffect(() => {
-        setValue(initialModel);
-        setInputValue(initialModel);
-    }, [initialModel]);
-    const filteredModels = models.filter((m) => m.toLowerCase().includes(inputValue.toLowerCase()));
-    const handleSelect = async (model) => {
-        setOpen(false);
-        await persist(model);
-    };
-    const handleInputChange = (e) => {
-        setInputValue(e.target.value);
-        if (!open)
-            setOpen(true);
-    };
-    const handleInputKeyDown = async (e) => {
-        if (e.key === 'Enter') {
-            e.preventDefault();
-            setOpen(false);
-            await persist(inputValue);
-        }
-        if (e.key === 'Escape') {
-            setOpen(false);
-            // Revert input to last saved value
-            setInputValue(value);
-        }
-    };
-    const persist = async (model) => {
-        if (!model.trim() || model === value)
-            return;
-        setSaving(true);
-        setError(null);
-        try {
-            const result = await updateModel(model);
-            if (result.ok) {
-                setValue(model);
-                onModelChange?.(model);
-            }
-            else {
-                setError(result.error ?? 'Failed to save model');
-                setInputValue(value); // revert
-            }
-        }
-        finally {
-            setSaving(false);
-        }
-    };
-    const isDisabled = (disabled ?? false) || loading || saving;
-    return (_jsxs("div", { className: cn('flex flex-col gap-1', className), children: [_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", role: "combobox", "aria-expanded": open, disabled: isDisabled, className: "w-full justify-between font-normal", children: [_jsx("span", { className: "truncate", children: loading ? 'Loading models…' : saving ? 'Saving…' : (value ?? 'Select model…') }), _jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })] }) }), _jsx(PopoverContent, { className: "w-[var(--radix-popover-trigger-width)] p-0", align: "start", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: "Search or type a model ID\u2026", value: inputValue, onChange: handleInputChange, onKeyDown: handleInputKeyDown }), _jsxs(CommandList, { children: [!loading && filteredModels.length === 0 && (_jsx(CommandEmpty, { children: models.length === 0
-                                                ? 'No models advertised for this agent.'
-                                                : 'No match — press Enter to use this value.' })), filteredModels.length > 0 && (_jsx(CommandGroup, { children: filteredModels.map((model) => (_jsxs(CommandItem, { selected: model === value, onClick: () => handleSelect(model), children: [_jsx(Check, { className: cn('mr-2 h-4 w-4', model === value ? 'opacity-100' : 'opacity-0') }), model] }, model))) }))] })] }) })] }), Boolean(error) && _jsx("p", { className: "text-destructive text-sm", children: error })] }));
-}

package/dist/src/presentation/web/components/ui/command.d.ts

@@ -1,19 +0,0 @@
-import * as React from 'react';
-/**
- * Command — minimal combobox primitives for model/item selection.
- *
- * Intentionally avoids the `cmdk` dependency and builds on native React +
- * Tailwind instead. Filtering logic lives in the consumer component.
- */
-declare const Command: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandInput: React.ForwardRefExoticComponent<React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>>;
-declare const CommandList: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandEmpty: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandGroup: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-interface CommandItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    selected?: boolean;
-}
-declare const CommandItem: React.ForwardRefExoticComponent<CommandItemProps & React.RefAttributes<HTMLButtonElement>>;
-declare const CommandSeparator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, };
-//# sourceMappingURL=command.d.ts.map

package/dist/src/presentation/web/components/ui/command.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"command.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/ui/command.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B;;;;;GAKG;AAEH,QAAA,MAAM,OAAO,6GAWZ,CAAC;AAGF,QAAA,MAAM,YAAY,sHAehB,CAAC;AAGH,QAAA,MAAM,WAAW,6GAQhB,CAAC;AAGF,QAAA,MAAM,YAAY,6GAQjB,CAAC;AAGF,QAAA,MAAM,YAAY,6GAIjB,CAAC;AAGF,UAAU,gBAAiB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAC9E,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,WAAW,4FAgBhB,CAAC;AAGF,QAAA,MAAM,gBAAgB,6GAIrB,CAAC;AAGF,OAAO,EACL,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,WAAW,EACX,gBAAgB,GACjB,CAAC"}

package/dist/src/presentation/web/components/ui/command.js

@@ -1,26 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { Search } from 'lucide-react';
-import { cn } from '../../lib/utils.js';
-/**
- * Command — minimal combobox primitives for model/item selection.
- *
- * Intentionally avoids the `cmdk` dependency and builds on native React +
- * Tailwind instead. Filtering logic lives in the consumer component.
- */
-const Command = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md', className), ...props })));
-Command.displayName = 'Command';
-const CommandInput = React.forwardRef(({ className, ...props }, ref) => (_jsxs("div", { className: "flex items-center border-b px-3", children: [_jsx(Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }), _jsx("input", { ref: ref, className: cn('placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50', className), ...props })] })));
-CommandInput.displayName = 'CommandInput';
-const CommandList = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('max-h-[300px] overflow-x-hidden overflow-y-auto', className), ...props })));
-CommandList.displayName = 'CommandList';
-const CommandEmpty = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('text-muted-foreground py-6 text-center text-sm', className), ...props })));
-CommandEmpty.displayName = 'CommandEmpty';
-const CommandGroup = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('text-foreground overflow-hidden p-1', className), ...props })));
-CommandGroup.displayName = 'CommandGroup';
-const CommandItem = React.forwardRef(({ className, selected, ...props }, ref) => (_jsx("button", { ref: ref, type: "button", "data-selected": selected, className: cn('relative flex w-full cursor-default items-center rounded-sm px-2 py-1.5 text-sm transition-colors outline-none select-none', 'hover:bg-accent hover:text-accent-foreground', 'data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground', 'disabled:pointer-events-none disabled:opacity-50', className), ...props })));
-CommandItem.displayName = 'CommandItem';
-const CommandSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('bg-border -mx-1 h-px', className), ...props })));
-CommandSeparator.displayName = 'CommandSeparator';
-export { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, };

package/web/.next/standalone/src/presentation/web/app/actions/get-supported-models.ts

@@ -1,26 +0,0 @@
-'use server';
-
-import { resolve } from '@/lib/server-container';
-import { getSettings } from '@shepai/core/infrastructure/services/settings.service';
-import type { IAgentExecutorFactory } from '@shepai/core/application/ports/output/agents/agent-executor-factory.interface';
-
-/**
- * Server action that returns the LLM model identifiers supported by the
- * currently configured agent executor.
- *
- * Resolves IAgentExecutorFactory from the DI container and calls
- * getSupportedModels for the agent type stored in settings.
- *
- * @returns Array of model identifier strings, or [] on error.
- */
-export async function getSupportedModels(): Promise<string[]> {
-  try {
-    const settings = getSettings();
-    const agentType = settings.agent.type;
-    const factory = resolve<IAgentExecutorFactory>('IAgentExecutorFactory');
-    return factory.getSupportedModels(agentType);
-  } catch (_error: unknown) {
-    // Settings may not be initialized in some test/preview environments
-    return [];
-  }
-}

package/web/.next/standalone/src/presentation/web/app/actions/update-model.ts

@@ -1,45 +0,0 @@
-'use server';
-
-import { resolve } from '@/lib/server-container';
-import {
-  getSettings,
-  resetSettings,
-  initializeSettings,
-} from '@shepai/core/infrastructure/services/settings.service';
-import type { UpdateSettingsUseCase } from '@shepai/core/application/use-cases/settings/update-settings.use-case';
-
-/**
- * Server action that updates the default LLM model in settings.
- *
- * Persists the new model to the database via UpdateSettingsUseCase and
- * refreshes the in-memory settings singleton so subsequent reads reflect
- * the change within the current server process.
- *
- * @param model - The model identifier to set as the new default
- * @returns `{ ok: true }` on success, or `{ ok: false, error: string }` on failure.
- */
-export async function updateModel(model: string): Promise<{ ok: boolean; error?: string }> {
-  if (!model.trim()) {
-    return { ok: false, error: 'model is required' };
-  }
-
-  try {
-    const currentSettings = getSettings();
-    const updatedSettings = {
-      ...currentSettings,
-      models: { default: model.trim() },
-    };
-
-    const updateUseCase = resolve<UpdateSettingsUseCase>('UpdateSettingsUseCase');
-    await updateUseCase.execute(updatedSettings);
-
-    // Refresh the in-memory singleton so this server process sees the new value
-    resetSettings();
-    initializeSettings(updatedSettings);
-
-    return { ok: true };
-  } catch (error: unknown) {
-    const message = error instanceof Error ? error.message : 'Failed to update model';
-    return { ok: false, error: message };
-  }
-}

package/web/.next/standalone/src/presentation/web/components/features/settings/ModelPicker/ModelPicker.stories.tsx

@@ -1,64 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { fn } from '@storybook/test';
-import { ModelPicker } from './index';
-
-const meta: Meta<typeof ModelPicker> = {
-  title: 'Features/Settings/ModelPicker',
-  component: ModelPicker,
-  parameters: {
-    layout: 'centered',
-  },
-  tags: ['autodocs'],
-  decorators: [
-    (Story) => (
-      <div className="w-80">
-        <Story />
-      </div>
-    ),
-  ],
-  args: {
-    onModelChange: fn(),
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-/**
- * Default state — current model is claude-sonnet-4-6, the advertised list
- * for claude-code is populated from the mock server action.
- */
-export const Default: Story = {
-  args: {
-    initialModel: 'claude-sonnet-4-6',
-  },
-};
-
-/**
- * Custom model — a free-text identifier not present in the advertised list.
- * Demonstrates that the combobox accepts arbitrary strings.
- */
-export const CustomModel: Story = {
-  args: {
-    initialModel: 'claude-opus-4-7-experimental',
-  },
-};
-
-/**
- * Disabled state — picker is non-interactive (e.g. during form submission).
- */
-export const Disabled: Story = {
-  args: {
-    initialModel: 'claude-sonnet-4-6',
-    disabled: true,
-  },
-};
-
-/**
- * Opus selected — verifies the checkmark appears on the right item.
- */
-export const OpusSelected: Story = {
-  args: {
-    initialModel: 'claude-opus-4-6',
-  },
-};

package/web/.next/standalone/src/presentation/web/components/features/settings/ModelPicker/index.tsx

@@ -1,167 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { Check, ChevronsUpDown } from 'lucide-react';
-import { getSupportedModels } from '@/app/actions/get-supported-models';
-import { updateModel } from '@/app/actions/update-model';
-import { Button } from '@/components/ui/button';
-import {
-  Command,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-} from '@/components/ui/command';
-import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
-import { cn } from '@/lib/utils';
-
-export interface ModelPickerProps {
-  /** Current model identifier shown as the initial selection */
-  initialModel: string;
-  /** Optional callback notified when the model is successfully persisted */
-  onModelChange?: (model: string) => void;
-  disabled?: boolean;
-  className?: string;
-}
-
-/**
- * ModelPicker
- *
- * A combobox that lets the user choose the default LLM model. On mount it
- * calls the `getSupportedModels` server action to populate suggestions for
- * the currently configured agent; the user may also type any free-text model
- * identifier. On selection the new value is persisted via `updateModel`.
- */
-export function ModelPicker({
-  initialModel,
-  onModelChange,
-  disabled,
-  className,
-}: ModelPickerProps) {
-  const [open, setOpen] = React.useState(false);
-  const [models, setModels] = React.useState<string[]>([]);
-  const [loading, setLoading] = React.useState(true);
-  const [saving, setSaving] = React.useState(false);
-  const [value, setValue] = React.useState(initialModel);
-  const [inputValue, setInputValue] = React.useState(initialModel);
-  const [error, setError] = React.useState<string | null>(null);
-
-  // Load advertised models on mount
-  React.useEffect(() => {
-    getSupportedModels()
-      .then(setModels)
-      .finally(() => setLoading(false));
-  }, []);
-
-  // Keep local state in sync when initialModel prop changes
-  React.useEffect(() => {
-    setValue(initialModel);
-    setInputValue(initialModel);
-  }, [initialModel]);
-
-  const filteredModels = models.filter((m) => m.toLowerCase().includes(inputValue.toLowerCase()));
-
-  const handleSelect = async (model: string) => {
-    setOpen(false);
-    await persist(model);
-  };
-
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setInputValue(e.target.value);
-    if (!open) setOpen(true);
-  };
-
-  const handleInputKeyDown = async (e: React.KeyboardEvent<HTMLInputElement>) => {
-    if (e.key === 'Enter') {
-      e.preventDefault();
-      setOpen(false);
-      await persist(inputValue);
-    }
-    if (e.key === 'Escape') {
-      setOpen(false);
-      // Revert input to last saved value
-      setInputValue(value);
-    }
-  };
-
-  const persist = async (model: string) => {
-    if (!model.trim() || model === value) return;
-    setSaving(true);
-    setError(null);
-    try {
-      const result = await updateModel(model);
-      if (result.ok) {
-        setValue(model);
-        onModelChange?.(model);
-      } else {
-        setError(result.error ?? 'Failed to save model');
-        setInputValue(value); // revert
-      }
-    } finally {
-      setSaving(false);
-    }
-  };
-
-  const isDisabled = (disabled ?? false) || loading || saving;
-
-  return (
-    <div className={cn('flex flex-col gap-1', className)}>
-      <Popover open={open} onOpenChange={setOpen}>
-        <PopoverTrigger asChild>
-          <Button
-            variant="outline"
-            role="combobox"
-            aria-expanded={open}
-            disabled={isDisabled}
-            className="w-full justify-between font-normal"
-          >
-            <span className="truncate">
-              {loading ? 'Loading models…' : saving ? 'Saving…' : (value ?? 'Select model…')}
-            </span>
-            <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-          </Button>
-        </PopoverTrigger>
-        <PopoverContent className="w-[var(--radix-popover-trigger-width)] p-0" align="start">
-          <Command>
-            <CommandInput
-              placeholder="Search or type a model ID…"
-              value={inputValue}
-              onChange={handleInputChange}
-              onKeyDown={handleInputKeyDown}
-            />
-            <CommandList>
-              {!loading && filteredModels.length === 0 && (
-                <CommandEmpty>
-                  {models.length === 0
-                    ? 'No models advertised for this agent.'
-                    : 'No match — press Enter to use this value.'}
-                </CommandEmpty>
-              )}
-              {filteredModels.length > 0 && (
-                <CommandGroup>
-                  {filteredModels.map((model) => (
-                    <CommandItem
-                      key={model}
-                      selected={model === value}
-                      onClick={() => handleSelect(model)}
-                    >
-                      <Check
-                        className={cn(
-                          'mr-2 h-4 w-4',
-                          model === value ? 'opacity-100' : 'opacity-0'
-                        )}
-                      />
-                      {model}
-                    </CommandItem>
-                  ))}
-                </CommandGroup>
-              )}
-            </CommandList>
-          </Command>
-        </PopoverContent>
-      </Popover>
-      {Boolean(error) && <p className="text-destructive text-sm">{error}</p>}
-    </div>
-  );
-}

package/web/.next/standalone/src/presentation/web/components/ui/command.tsx

@@ -1,114 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { Search } from 'lucide-react';
-
-import { cn } from '@/lib/utils';
-
-/**
- * Command — minimal combobox primitives for model/item selection.
- *
- * Intentionally avoids the `cmdk` dependency and builds on native React +
- * Tailwind instead. Filtering logic lives in the consumer component.
- */
-
-const Command = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div
-      ref={ref}
-      className={cn(
-        'bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md',
-        className
-      )}
-      {...props}
-    />
-  )
-);
-Command.displayName = 'Command';
-
-const CommandInput = React.forwardRef<
-  HTMLInputElement,
-  React.InputHTMLAttributes<HTMLInputElement>
->(({ className, ...props }, ref) => (
-  <div className="flex items-center border-b px-3">
-    <Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
-    <input
-      ref={ref}
-      className={cn(
-        'placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none disabled:cursor-not-allowed disabled:opacity-50',
-        className
-      )}
-      {...props}
-    />
-  </div>
-));
-CommandInput.displayName = 'CommandInput';
-
-const CommandList = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div
-      ref={ref}
-      className={cn('max-h-[300px] overflow-x-hidden overflow-y-auto', className)}
-      {...props}
-    />
-  )
-);
-CommandList.displayName = 'CommandList';
-
-const CommandEmpty = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div
-      ref={ref}
-      className={cn('text-muted-foreground py-6 text-center text-sm', className)}
-      {...props}
-    />
-  )
-);
-CommandEmpty.displayName = 'CommandEmpty';
-
-const CommandGroup = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div ref={ref} className={cn('text-foreground overflow-hidden p-1', className)} {...props} />
-  )
-);
-CommandGroup.displayName = 'CommandGroup';
-
-interface CommandItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-  selected?: boolean;
-}
-
-const CommandItem = React.forwardRef<HTMLButtonElement, CommandItemProps>(
-  ({ className, selected, ...props }, ref) => (
-    <button
-      ref={ref}
-      type="button"
-      data-selected={selected}
-      className={cn(
-        'relative flex w-full cursor-default items-center rounded-sm px-2 py-1.5 text-sm transition-colors outline-none select-none',
-        'hover:bg-accent hover:text-accent-foreground',
-        'data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground',
-        'disabled:pointer-events-none disabled:opacity-50',
-        className
-      )}
-      {...props}
-    />
-  )
-);
-CommandItem.displayName = 'CommandItem';
-
-const CommandSeparator = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div ref={ref} className={cn('bg-border -mx-1 h-px', className)} {...props} />
-  )
-);
-CommandSeparator.displayName = 'CommandSeparator';
-
-export {
-  Command,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-  CommandSeparator,
-};