@fernir2/saas-kit-cli 0.1.4 → 0.1.6

package/packages/level2/fd-component-toolbox/calendar/FdCalendar.jsx

@@ -1,68 +0,0 @@
-import { cn } from "@fd-toolbox/lib/utils";
-import { DayPicker } from "react-day-picker";
-import React from "react";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-const chevronMap = {
-    left: {
-        name: iconNames.chevronLeft,
-        className: "absolute left-1 top-[0.1rem]",
-    },
-    right: {
-        name: iconNames.chevronRight,
-        className: "absolute right-1 top-[0.1rem]",
-    },
-};
-function CalendarChevron({ orientation, className }) {
-    if (!orientation || !(orientation in chevronMap)) {
-        return <span className="hidden"/>;
-    }
-    const { name, className: baseClass } = chevronMap[orientation];
-    return <FdIcon name={name} color="text-fd-accent" className={cn(baseClass, className)}/>;
-}
-/**
- * Calendar component with customizable date selection and navigation
- *
- * @param props - {@link CalendarProps}
- *
- * Based on [DayPicker](https://react-day-picker.js.org/)
- *
- * @example
-* ```tsx
-function MyComponent() {
-    const [date, setDate] = useState<Date>(new Date());
-
-    return (
-        <FdCalendar mode="single" selected={date} onSelect={setDate} initialFocus/>
-    );
-}
-* ```
- */
-export function FdCalendar({ className, classNames, showOutsideDays, ...props }) {
-    return (<DayPicker showOutsideDays={showOutsideDays ?? true} className={cn("p-3", className)} classNames={{
-            months: "flex !flex-col sm:flex-row",
-            month: "space-y-4",
-            caption: "flex justify-center pt-1 relative items-center",
-            caption_label: "flex text-sm font-medium justify-center",
-            nav: "relative flex space-x-1 items-center",
-            nav_button: "size-7 bg-transparent p-0 opacity-50 hover:opacity-100",
-            table: "w-full border-collapse space-y-1",
-            head_row: "flex",
-            head_cell: "text-muted-foreground rounded-md w-8 font-normal text-3.5",
-            row: "flex w-full mt-2",
-            day: cn("relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].outside)]:bg-accent/50 [&:has([aria-selected].range_end)]:rounded-r-md", props.mode === "range"
-                ? "[&:has(>.range_end)]:rounded-r-md [&:has(>.range_start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md"
-                : "[&:has([aria-selected])]:rounded-md"),
-            day_button: cn("size-8 p-0 font-normal aria-selected:opacity-100"),
-            range_start: "range_start",
-            range_end: "range_end",
-            selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground rounded-md",
-            today: "bg-accent text-accent-foreground rounded-md",
-            outside: "outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
-            disabled: "text-muted-foreground opacity-50",
-            range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
-            hidden: "invisible",
-            ...classNames,
-        }} components={{
-            Chevron: CalendarChevron,
-        }} {...props}/>);
-}

package/packages/level2/fd-component-toolbox/card/FdCard.jsx

@@ -1,56 +0,0 @@
-import * as React from "react";
-import { cn } from "@fd-toolbox/lib/utils";
-/**
- * Main card container component
- *
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCard({ className, ref, ...props }) {
-    return (<div ref={ref} className={cn("rounded-xl border bg-card text-card-foreground shadow", className)} {...props}/>);
-}
-FdCard.displayName = "FdCard";
-/**
- * Header section of the card component for organizing title and description elements
- *
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCardHeader({ className, ref, ...props }) {
-    return (<div ref={ref} className={cn("flex flex-col space-y-1.5 text-nowrap p-6", className)} {...props}/>);
-}
-FdCardHeader.displayName = "FdCardHeader";
-/**
- * Title component for displaying the main heading of the card
- *
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCardTitle({ className, ref, ...props }) {
-    return <h3 ref={ref} className={cn("font-semibold leading-none tracking-tight", className)} {...props}/>;
-}
-FdCardTitle.displayName = "FdCardTitle";
-/**
- * Description component for displaying secondary text content below the card title
- *
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCardDescription({ className, ref, ...props }) {
-    return <p ref={ref} className={cn("text-sm text-muted-foreground", className)} {...props}/>;
-}
-FdCardDescription.displayName = "FdCardDescription";
-/**
- * Content section of the card
- *
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCardContent({ className, ref, ...props }) {
-    return <div ref={ref} className={cn("p-3 pt-0", className)} {...props}/>;
-}
-FdCardContent.displayName = "FdCardContent";
-/**
- * Footer section of the card
- * Based on {@link https://ui.shadcn.com/docs/components/card Card}
- */
-function FdCardFooter({ className, ref, ...props }) {
-    return <div ref={ref} className={cn("flex items-center p-6 pt-0", className)} {...props}/>;
-}
-FdCardFooter.displayName = "FdCardFooter";
-export { FdCard, FdCardHeader, FdCardFooter, FdCardTitle, FdCardDescription, FdCardContent };

package/packages/level2/fd-component-toolbox/card/FdCardBigDigits.jsx

@@ -1,25 +0,0 @@
-import { FdCard, FdCardHeader, FdCardTitle, FdCardContent } from "@fd-component-toolbox/card/FdCard";
-import { cn } from "@fd-toolbox/lib/utils";
-/**
- * Card component for displaying large numerical values with title and subtitle
- *
- * @param props - {@link FdCardBigDigitsProps}
- *
- * @example
- * ```tsx
- * <FdCardBigDigits title="Some metric" value="85.7%" subtitle="+12% increase"/>
- * ```
- */
-export function FdCardBigDigits({ title, value, subtitle, className }) {
-    const headerVariation = subtitle ? "" : "mb-2";
-    const contentVariation = subtitle ? "" : "text-center text-3xl";
-    return (<FdCard className={cn("size-full", className)}>
-            <FdCardHeader className={cn("flex flex-row items-center justify-between py-2", headerVariation)}>
-                <FdCardTitle className="text-sm font-medium">{title}</FdCardTitle>
-            </FdCardHeader>
-            <FdCardContent>
-                <div className={cn("text-2xl font-bold", contentVariation)}>{value}</div>
-                {subtitle && <p className="text-xs text-subtle-500">{subtitle}</p>}
-            </FdCardContent>
-        </FdCard>);
-}

package/packages/level2/fd-component-toolbox/chart/FdChart.jsx

@@ -1,269 +0,0 @@
-"use client";
-import * as React from "react";
-import * as RechartsPrimitive from "recharts";
-import { cn } from "@fd-toolbox/lib/utils";
-import { createError } from "@fd-toolbox/errors/errors";
-/**
- * Format: { THEME_NAME: CSS_SELECTOR }
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- */
-export const THEMES = { light: "", dark: ".dark" };
-/**
- * Context of FdChart elements with {@link ChartContextProps} config
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- */
-export const ChartContext = React.createContext(null);
-/**
- * Hook for accessing chart context config - {@link ChartContext}
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- */
-export function useChart() {
-    const context = React.useContext(ChartContext);
-    if (!context) {
-        throw createError("useChart must be used within a <ChartContainer />");
-    }
-    return context;
-}
-/**
- * Custom tooltip content component with formatted values and indicators
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- * @example
- * ```tsx
- * <FdChartContainer
- *     config={{
- *         "Sales": { label: "Sales" },
- *         "Revenue": { label: "Revenue" },
- *         "Users": { label: "Users" }
- *     }}
- * >
- *     ...
- * </FdChartContainer>
- * ```
- */
-export function FdChartContainer({ id, className, children, config, ref, ...props }) {
-    const uniqueId = React.useId();
-    const chartId = `chart-${id ?? uniqueId.replace(/:/g, "")}`;
-    const contextValue = React.useMemo(() => ({ config }), [config]);
-    return (<ChartContext.Provider value={contextValue}>
-            <div data-chart={chartId} ref={ref} className={cn("flex aspect-video justify-center text-xs " +
-            "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground" +
-            "[&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50" +
-            "[&_.recharts-curve.recharts-tooltip-cursor]:stroke-border" +
-            "[&_.recharts-dot[stroke='#fff']]:stroke-transparent" +
-            "[&_.recharts-layer]:outline-none" +
-            "[&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border" +
-            "[&_.recharts-radial-bar-background-sector]:fill-muted" +
-            "[&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted" +
-            "[&_.recharts-reference-line_[stroke='#ccc']]:stroke-border" +
-            "[&_.recharts-sector[stroke='#fff']]:stroke-transparent" +
-            "[&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none", className)} {...props}>
-                <FdChartStyle id={chartId} config={config}/>
-                <RechartsPrimitive.ResponsiveContainer>{children}</RechartsPrimitive.ResponsiveContainer>
-            </div>
-        </ChartContext.Provider>);
-}
-FdChartContainer.displayName = "Chart";
-/**
- * Component for managing chart theme-based styling
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- * @param props - {@link FdChartStyleProps}
- *
- * @example
- * ```tsx
- * <FdChartStyle
- *     config={{
- *         "Sales": { label: "Sales" },
- *         "Revenue": { label: "Revenue" },
- *         "Users": { label: "Users" }
- *     }}
- * />
- * ```
- */
-export function FdChartStyle({ id, config }) {
-    const colorConfig = Object.entries(config).filter((entry) => entry[1].theme ?? entry[1].color);
-    if (!colorConfig.length) {
-        return null;
-    }
-    return (<style dangerouslySetInnerHTML={{
-            __html: Object.entries(THEMES)
-                .map(([theme, prefix]) => `
-${prefix} [data-chart=${id}] {
-${colorConfig
-                .map(([key, itemConfig]) => {
-                const color = itemConfig.theme?.[theme] ?? itemConfig.color;
-                return color ? `  --color-${key}: ${color};` : null;
-            })
-                .join("\n")}
-}
-`)
-                .join("\n"),
-        }}/>);
-}
-/**
- * Original Tooltip component from Recharts library
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- * @example
- * ```tsx
-    <FdChartTooltip cursor={false} content={<FdChartTooltipContent />} />
- * ```
- */
-export const FdChartTooltip = RechartsPrimitive.Tooltip;
-/**
- * Custom tooltip content component with formatted values and indicators
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- * @example
- * ```tsx
-    <FdChartTooltip
-        cursor={false}
-        content={
-            <FdChartTooltipContent
-                indicator="dashed"
-                hideLabel={false}
-                hideIndicator={false}
-                labelKey="category"
-            />
-        }
-    />
- * ```
- */
-export function FdChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, ref, }) {
-    const { config } = useChart();
-    const effectiveIndicator = indicator ?? "dot";
-    const tooltipLabel = React.useMemo(() => {
-        if (hideLabel || !payload?.length) {
-            return null;
-        }
-        const [item] = payload;
-        const key = `${labelKey ?? item.dataKey ?? item.name ?? "value"}`;
-        const itemConfig = getPayloadConfigFromPayload(config, item, key);
-        const value = !labelKey && typeof label === "string"
-            ? (config[label]?.label ?? label)
-            : itemConfig?.label;
-        if (labelFormatter) {
-            return <div className={cn("font-medium", labelClassName)}>{labelFormatter(value, payload)}</div>;
-        }
-        if (!value) {
-            return null;
-        }
-        return <div className={cn("font-medium", labelClassName)}>{value}</div>;
-    }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
-    if (!active || !payload?.length) {
-        return null;
-    }
-    const nestLabel = payload.length === 1 && effectiveIndicator !== "dot";
-    return (<div ref={ref} className={cn("grid min-w-32 items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl", className)}>
-            {!nestLabel ? tooltipLabel : null}
-            <div className="grid gap-1.5">
-                {payload.map((item, index) => {
-            const key = `${nameKey ?? item.name ?? item.dataKey ?? "value"}`;
-            const itemConfig = getPayloadConfigFromPayload(config, item, key);
-            const indicatorColor = color ?? item.payload.fill ?? item.color;
-            return (<div key={item.dataKey} className={cn("flex w-full flex-wrap items-stretch gap-2 [&>svg]:size-2.5 [&>svg]:text-muted-foreground", effectiveIndicator === "dot" && "items-center")}>
-                            {formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index, item.payload)) : (<>
-                                    {itemConfig?.icon ? (<itemConfig.icon />) : (!hideIndicator && (<div className={cn("shrink-0 rounded-sm border-[--color-border] bg-[--color-bg]", {
-                            "h-2.5 w-2.5": effectiveIndicator === "dot",
-                            "w-1": effectiveIndicator === "line",
-                            "w-0 border border-dashed bg-transparent": effectiveIndicator === "dashed",
-                            "my-0.5": nestLabel && effectiveIndicator === "dashed",
-                        })} style={{
-                            "--color-bg": indicatorColor,
-                            "--color-border": indicatorColor,
-                        }}/>))}
-                                    <div className={cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center")}>
-                                        <div className="grid gap-1.5">
-                                            {nestLabel ? tooltipLabel : null}
-                                            <span className="text-muted-foreground">
-                                                {itemConfig?.label ?? item.name}
-                                            </span>
-                                        </div>
-                                        {item.value && (<span className="font-mono font-medium tabular-nums text-foreground">
-                                                {item.value.toLocaleString()}
-                                            </span>)}
-                                    </div>
-                                </>)}
-                        </div>);
-        })}
-            </div>
-        </div>);
-}
-FdChartTooltipContent.displayName = "ChartTooltip";
-/**
- * Original Legend component from Recharts library
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- *
- * @example
- * ```tsx
-    <ChartLegend content={<ChartLegendContent />} />
- * ```
- */
-export const FdChartLegend = RechartsPrimitive.Legend;
-/**
- * Custom legend content component with support for icons and custom labels
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- *
- *
- * @example
- * ```tsx
- * <FdChartLegend content={<FdChartLegendContent hideIcon={false} verticalAlign="bottom" nameKey="category"/>}/>
- * ```
- */
-export function FdChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, ref, }) {
-    const { config } = useChart();
-    if (!payload?.length) {
-        return null;
-    }
-    return (<div ref={ref} className={cn("flex items-center justify-center gap-4", (verticalAlign ?? "bottom") === "top" ? "pb-3" : "pt-3", className)}>
-            {payload.map((item) => {
-            const key = `${nameKey ?? item.dataKey ?? "value"}`;
-            const itemConfig = getPayloadConfigFromPayload(config, item, key);
-            return (<div key={item.value} className={cn("flex items-center gap-1.5 [&>svg]:size-3 [&>svg]:text-muted-foreground")}>
-                        {itemConfig?.icon && !hideIcon ? (<itemConfig.icon />) : (<div className="size-2 shrink-0 rounded-sm" style={{
-                        backgroundColor: item.color,
-                    }}/>)}
-                        {itemConfig?.label}
-                    </div>);
-        })}
-        </div>);
-}
-FdChartLegendContent.displayName = "ChartLegend";
-/**
- * Gets chart element configuration from payload data.
- * @param config Chart configuration object - {@link FdChartConfig}
- * @param payload Chart data payload
- * @param key Key to look up in config
- * @returns FdChartConfigValue or undefined if no match found.
- *
- * Based on {@link https://ui.shadcn.com/docs/components/chart Chart}
- */
-export function getPayloadConfigFromPayload(config, payload, key) {
-    if (typeof payload !== "object" || payload === null) {
-        return undefined;
-    }
-    const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null
-        ? payload.payload
-        : undefined;
-    let configLabelKey = key;
-    if (key in payload && typeof payload[key] === "string") {
-        configLabelKey = payload[key];
-    }
-    else if (payloadPayload &&
-        key in payloadPayload &&
-        typeof payloadPayload[key] === "string") {
-        configLabelKey = payloadPayload[key];
-    }
-    return configLabelKey in config ? config[configLabelKey] : config[key];
-}

package/packages/level2/fd-component-toolbox/checkbox/FdCheckbox.jsx

@@ -1,39 +0,0 @@
-"use client";
-import * as React from "react";
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-import { cn } from "@fd-toolbox/lib/utils";
-import { FdIcon } from "@fd-component-toolbox/icon/FdIcon";
-/**
- * Checkbox component with optional label text
- *
- * @param props - {@link CheckboxProps}
- *
- * Based on [Checkbox](https://ui.shadcn.com/docs/components/checkbox)
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *   const [isChecked, setIsChecked] = useState(false);
- *
- *   return (
- *     <FdCheckbox text="Accept terms and conditions" checked={isChecked} onCheckedChange={setIsChecked}/>
- *   );
- * }
- * ```
- */
-function FdCheckbox({ className, text, ...props }) {
-    return (<div className="flex items-center">
-            <CheckboxPrimitive.Root className={cn("peer size-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary", "disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground", className)} {...props}>
-                <CheckboxPrimitive.Indicator className={cn("flex items-center justify-center text-current")}>
-                    <FdIcon name="check" color="text-fd-tertiary-200"/>
-                </CheckboxPrimitive.Indicator>
-            </CheckboxPrimitive.Root>
-            {text && (<div className="ml-2 grid gap-1.5 leading-none">
-                    <label className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
-                        {text}
-                    </label>
-                </div>)}
-        </div>);
-}
-FdCheckbox.displayName = CheckboxPrimitive.Root.displayName;
-export { FdCheckbox };

package/packages/level2/fd-component-toolbox/command/FdCommand.jsx

@@ -1,123 +0,0 @@
-"use client";
-import * as React from "react";
-import { FdDialog, FdDialogContent } from "@fd-component-toolbox/dialog/FdDialog";
-import { Command as CommandPrimitive } from "cmdk";
-import { cn } from "@fd-toolbox/lib/utils";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-/**
- * Root component that provides functionality and styling
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommand({ className, ref, ...props }) {
-    return (<CommandPrimitive ref={ref} className={cn("flex size-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground", className)} {...props}/>);
-}
-FdCommand.displayName = CommandPrimitive.displayName;
-/**
- * Modal dialog wrapper with custom styling
- *
- * @param props - {@link CommandDialogProps}
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- *
- * @example
- * ```tsx
- *  function MyComponent() {
- *      const [open, setOpen] = useState(false);
- *
-        return (
-            <FdCommandDialog open={open} onOpenChange={setOpen}>
-                ...
-            </FdCommandDialog>
-        );
-    }
- * ```
- */
-function FdCommandDialog({ children, ...props }) {
-    return (<FdDialog {...props}>
-            <FdDialogContent className="overflow-hidden p-0">
-                <FdCommand 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]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:size-5">
-                    {children}
-                </FdCommand>
-            </FdDialogContent>
-        </FdDialog>);
-}
-/**
- * Search input field with magnifying glass icon
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- *
- * @example
- * ```tsx
- * <FdCommandInput placeholder="Type a command or search..." />
- * ```
- */
-function FdCommandInput({ className, ref, ...props }) {
-    return (<div className="flex items-center border-b px-3" cmdk-input-wrapper="">
-            <FdIcon name={iconNames.magnifyingGlass} className="mr-2 shrink-0 opacity-50"/>
-            <CommandPrimitive.Input ref={ref} className={cn("flex h-9 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}/>
-        </div>);
-}
-FdCommandInput.displayName = CommandPrimitive.Input.displayName;
-/**
- * Scrollable container for list items
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommandList({ className, ref, ...props }) {
-    return (<CommandPrimitive.List ref={ref} className={cn("max-h-72 overflow-y-auto overflow-x-hidden", className)} {...props}/>);
-}
-FdCommandList.displayName = CommandPrimitive.List.displayName;
-/**
- * Empty state component when no items match search
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommandEmpty({ className, ref, ...props }) {
-    return (<CommandPrimitive.Empty ref={ref} className={cn("py-6 text-center text-sm", className)} {...props}/>);
-}
-FdCommandEmpty.displayName = CommandPrimitive.Empty.displayName;
-/**
- * Container for grouping related items
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- *
- * @example
- * ```tsx
- *  <FdCommandGroup heading="Settings">
- *      ...
- *  </FdCommandGroup>
- * ```
- */
-function FdCommandGroup({ className, ref, ...props }) {
-    return (<CommandPrimitive.Group ref={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}/>);
-}
-FdCommandGroup.displayName = CommandPrimitive.Group.displayName;
-/**
- * Visual separator line between groups or items
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommandSeparator({ className, ref, ...props }) {
-    return (<CommandPrimitive.Separator ref={ref} className={cn("-mx-1 h-px bg-border", className)} {...props}/>);
-}
-FdCommandSeparator.displayName = CommandPrimitive.Separator.displayName;
-/**
- * Interactive item with selection states
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommandItem({ className, ref, ...props }) {
-    return (<CommandPrimitive.Item ref={ref} className={cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50", className)} {...props}/>);
-}
-FdCommandItem.displayName = CommandPrimitive.Item.displayName;
-/**
- * Display component for keyboard shortcuts
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command}
- */
-function FdCommandShortcut({ className, ...props }) {
-    return (<span className={cn("ml-auto text-xs tracking-widest text-muted-foreground", className)} {...props}/>);
-}
-FdCommandShortcut.displayName = "CommandShortcut";
-export { FdCommand, FdCommandDialog, FdCommandInput, FdCommandList, FdCommandEmpty, FdCommandGroup, FdCommandItem, FdCommandShortcut, FdCommandSeparator, };