@fernir2/saas-kit-cli 0.1.4 → 0.1.5

package/packages/level2/fd-component-toolbox/list/list-item/FdListItem.jsx

@@ -1,46 +0,0 @@
-"use client";
-import { cn } from "@fd-toolbox/lib/utils";
-import { scrollListItemIntoView, setListItemTextOverflowing, } from "@fd-component-toolbox/list/list-item/FdListItem.funcs";
-import * as Tooltip from "@radix-ui/react-tooltip";
-import React, { useEffect, useLayoutEffect, useRef, useState } from "react";
-import { FdTooltip, FdTooltipContent, FdTooltipProvider, FdTooltipTrigger, } from "@fd-component-toolbox/tooltip/FdTooltip";
-/**
- * List item component with built-in tooltip
- *
- * @param IFdListItemProps {@link IFdListItemProps}
- *
- * @example
- * ```tsx
- *  <FdListItem showTooltip={true} isActive={...} onNavigate={...}>
- *      itemName
- *  </FdListItem>
- * ```
- */
-export function FdListItem({ className, showTooltip, children, onNavigate, isActive }) {
-    const [isTextOverflowing, setIsTextOverflowing] = useState(false);
-    const textRef = useRef(null);
-    const containerRef = useRef(null);
-    useEffect(() => {
-        if (containerRef?.current && isActive)
-            scrollListItemIntoView(containerRef?.current);
-    }, [isActive]);
-    useLayoutEffect(() => {
-        if (textRef.current && containerRef.current) {
-            setListItemTextOverflowing(textRef.current.scrollWidth, containerRef.current.clientWidth, setIsTextOverflowing, showTooltip);
-        }
-    }, [showTooltip, textRef, containerRef]);
-    return (<FdTooltipProvider>
-            <FdTooltip>
-                <FdTooltipTrigger asChild>
-                    <li className={cn("z-1 relative w-full rounded-md p-2 hover:bg-muted-foreground", className, isActive && "bg-fd-tertiary-700 text-white")} ref={containerRef} onClick={onNavigate ?? undefined}>
-                        <span ref={textRef}>{children}</span>
-                        {isTextOverflowing && (<span className={"absolute right-0 top-1/2 z-0 h-full w-10 -translate-y-1/2"}></span>)}
-                    </li>
-                </FdTooltipTrigger>
-                {isTextOverflowing && (<FdTooltipContent side={"right"} className="ml-2 max-w-60 text-pretty rounded p-2 text-popover shadow">
-                        {children}
-                        <Tooltip.Arrow />
-                    </FdTooltipContent>)}
-            </FdTooltip>
-        </FdTooltipProvider>);
-}

package/packages/level2/fd-component-toolbox/loading/FdLoadingIndicator.jsx

@@ -1,7 +0,0 @@
-/**
- * Simple loading indicator component that displays loading text
- */
-function FdLoadingIndicator() {
-    return <div>Loading ...</div>;
-}
-export default FdLoadingIndicator;

package/packages/level2/fd-component-toolbox/logos/FacebookLogo.jsx

@@ -1,11 +0,0 @@
-/**
- * Facebook logo SVG icon component that uses currentColor for styling
- *
- * {@link FacebookLogo}
- */
-function FacebookLogo() {
-    return (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="20px" height="20px" fill="currentColor" className="text-foreground">
-            <path d="M25,3C12.85,3,3,12.85,3,25c0,11.03,8.125,20.137,18.712,21.728V30.831h-5.443v-5.783h5.443v-3.848 c0-6.371,3.104-9.168,8.399-9.168c2.536,0,3.877,0.188,4.512,0.274v5.048h-3.612c-2.248,0-3.033,2.131-3.033,4.533v3.161h6.588 l-0.894,5.783h-5.694v15.944C38.716,45.318,47,36.137,47,25C47,12.85,37.15,3,25,3z"/>
-        </svg>);
-}
-export default FacebookLogo;

package/packages/level2/fd-component-toolbox/logos/GoogleLogo.jsx

@@ -1,12 +0,0 @@
-/**
- * Google logo SVG icon component that uses currentColor for styling
- *
- * {@link GoogleLogo}
- */
-function GoogleLogo() {
-    return (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="20px" height="20px" fill="currentColor" className="text-foreground">
-            <path d="M 32.521484 6 C 18.158484 6 6.515625 17.642 6.515625 32 C 6.515625 46.358 18.158484 58 32.521484 58 C 54.209484 58 59.098453
-    37.865969 57.064453 27.667969 L 51.181641 27.667969 L 49.269531 27.667969 L 32.515625 27.667969 L 32.515625 36.333984 L 49.279297 36.333984 C 47.351759 43.804816 40.588119 49.332031 32.515625 49.332031 C 22.943625 49.332031 15.181641 41.572 15.181641 32 C 15.181641 22.428 22.943625 14.667969 32.515625 14.667969 C 36.868625 14.667969 40.834906 16.283594 43.878906 18.933594 L 50.033203 12.779297 C 45.410203 8.5672969 39.266484 6 32.521484 6 z"/>
-        </svg>);
-}
-export default GoogleLogo;

package/packages/level2/fd-component-toolbox/logos/MicrosoftLogo.jsx

@@ -1,11 +0,0 @@
-/**
- * Microsoft logo SVG icon component that uses currentColor for styling
- *
- * {@link MicrosoftLogo}
- */
-function MicrosoftLogo() {
-    return (<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="20px" height="20px" fill="currentColor" className="text-foreground">
-            <path d="M 5 4 C 4.448 4 4 4.447 4 5 L 4 24 L 24 24 L 24 4 L 5 4 z M 26 4 L 26 24 L 46 24 L 46 5 C 46 4.447 45.552 4 45 4 L 26 4 z M 4 26 L 4 45 C 4 45.553 4.448 46 5 46 L 24 46 L 24 26 L 4 26 z M 26 26 L 26 46 L 45 46 C 45.552 46 46 45.553 46 45 L 46 26 L 26 26 z"/>
-        </svg>);
-}
-export default MicrosoftLogo;

package/packages/level2/fd-component-toolbox/markdown/FdMarkdown.jsx

@@ -1,105 +0,0 @@
-"use client";
-import * as React from "react";
-import { useState, useEffect, useCallback, useMemo } from "react";
-import { cn } from "@fd-toolbox/lib/utils";
-import { getPreviewContentId, onValueChange } from "@fd-component-toolbox/markdown/FdMarkdown.funcs";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-import { FdFormControl, FdFormField, FdFormItem, FdFormMessage } from "@fd-component-toolbox/form/FdForm";
-import FdLabelAnimation from "@fd-component-toolbox/animation/FdLabelAnimation";
-import { cva } from "class-variance-authority";
-import { parseMarkdown } from "@fd-component-toolbox/markdown/markdown-parser";
-import { markdownSuffixes } from "@fd-toolbox/constants/element-suffixes";
-import { onTextAreaBlur } from "@fd-component-toolbox/textarea/FdTextArea.funcs";
-import debounce from "lodash.debounce";
-/**
- * Using {@link https://cva.style/docs/getting-started/variants class-variance-authority}
- */
-export const markdownVariants = cva("relative z-0 border-b", {
-    variants: {
-        variant: {
-            bordered: "",
-            float: "border-background transition-colors focus-within:border-fd-accent hover:border-fd-accent",
-        },
-    },
-    defaultVariants: {
-        variant: "float",
-    },
-});
-/**
- * Markdown input component with preview functionality and form integration
- *
- * @param IFdMarkdownProps {@link IFdMarkdownProps}
- *
- * @example
- * ```tsx
-    function MyComponent() {
-        const form = useForm({...});
-
-        return (
-            <FdMarkdown
-                label="Description"
-                name="description"
-                form={form}
-                showContentPreview={true}
-                onChange={...}
-                onBlur={...}
-                variant="float"
-            />
-        );
-    }
- * ```
- */
-export function FdMarkdown({ elementId, label, showContentPreview, value: defaultValue, form, name, disabled, readOnly, skipAnimationOnce, variant, onChange, onBlur, }) {
-    const [value, setValue] = useState(defaultValue ?? "");
-    const [previewContent, setPreviewContent] = useState([]);
-    const [isPreview, setIsPreview] = useState(showContentPreview ?? false);
-    const [isInFocus, setIsInFocus] = useState(false);
-    const debouncedParseMarkdown = useMemo(() => debounce(async (val) => {
-        const result = await parseMarkdown(val);
-        setPreviewContent(result);
-    }, 500), []);
-    useEffect(() => {
-        if (value) {
-            debouncedParseMarkdown(value);
-        }
-    }, [value, debouncedParseMarkdown]);
-    useEffect(() => {
-        setValue(defaultValue ?? "");
-    }, [defaultValue]);
-    const onChangeCallback = useCallback((e) => {
-        onValueChange(e.target.value, setValue, onChange);
-    }, [onChange]);
-    const onTextAreaBlurCallback = useCallback((e) => {
-        onTextAreaBlur(e, setIsInFocus, onBlur);
-    }, [onBlur]);
-    useEffect(() => {
-        return () => {
-            debouncedParseMarkdown.cancel();
-        };
-    }, [debouncedParseMarkdown]);
-    return (<FdFormField control={form.control} name={name} render={({ field, fieldState }) => (<FdFormItem>
-                    <FdFormControl>
-                        <div>
-                            {isPreview && (<>
-                                    <p className="mb-2">{label} Preview:</p>
-                                    <div className="mb-5 w-full overflow-auto">
-                                        <div id={getPreviewContentId(elementId)}>{previewContent}</div>
-                                    </div>
-                                </>)}
-                            <div className={cn(markdownVariants({ variant }))}>
-                                <textarea id={elementId} rows={5} placeholder="" {...field} disabled={disabled} readOnly={readOnly} value={value} onChange={onChangeCallback} onFocus={() => setIsInFocus(true)} onBlur={onTextAreaBlurCallback} className={cn("peer block w-full appearance-none border-0 bg-transparent px-0 py-2.5 text-sm text-muted-foreground focus:outline-none focus:ring-0 disabled:cursor-not-allowed", disabled || readOnly ? "resize-none" : "")}/>
-                                <FdLabelAnimation label={label} shouldAnimate={!!field.value || isInFocus} skipAnimationOnce={skipAnimationOnce} className={cn("left-0 top-4 max-w-full truncate px-0 transition-transform", variant === "bordered"
-                ? (!!field.value || isInFocus) && "!-translate-y-6"
-                : "top-2")} variant={variant ?? "float"}/>
-                                <div className="absolute right-0 top-2" onClick={() => setIsPreview((prev) => !prev)}>
-                                    {isPreview ? (<FdIcon id={elementId + markdownSuffixes.previewIcon} name={iconNames.visibility}/>) : (<FdIcon id={elementId + markdownSuffixes.previewIcon} name={iconNames.visibilityOff}/>)}
-                                </div>
-                                <div className={cn("w-full pt-2", fieldState.invalid
-                ? "border-destructive focus:border-destructive"
-                : "")}></div>
-                            </div>
-                        </div>
-                    </FdFormControl>
-                    <FdFormMessage />
-                </FdFormItem>)}/>);
-}

package/packages/level2/fd-component-toolbox/markdown/markdown-parser.jsx

@@ -1,72 +0,0 @@
-import React from "react";
-import { apiPost } from "@fd-toolbox/api/api-client";
-import { apiPathNames } from "@fd-toolbox/api/api-path-names";
-import { logStringError } from "@fd-toolbox/logging/loggers";
-import { isNullOrUndefined } from "@fd-toolbox/functions/value-checking-functions";
-import { apiErrorMessages } from "@fd-toolbox/constants/api-error-constants";
-export async function markdownToHtml(markdown) {
-    const response = await apiPost(apiPathNames.markdown, {
-        markdown: markdown,
-    });
-    const responseIsSuccessful = !isNullOrUndefined(response.data?.html);
-    if (responseIsSuccessful) {
-        return response.data?.html;
-    }
-    else {
-        logStringError(response.message ?? apiErrorMessages.invalidResponseFromApi);
-        return undefined;
-    }
-}
-export async function parseMarkdown(md) {
-    const htmlOutput = await markdownToHtml(md);
-    return parseText(htmlOutput);
-}
-const allowedTags = new Set([
-    "p",
-    "strong",
-    "em",
-    "del",
-    "code",
-    "h1",
-    "h2",
-    "h3",
-    "h4",
-    "h5",
-    "h6",
-    "li",
-    "ol",
-    "ul",
-    "a",
-    "blockquote",
-    "pre",
-    "code",
-    "hr",
-]);
-export function parseText(htmlString) {
-    const doc = new DOMParser().parseFromString(htmlString ?? "", "text/html");
-    return validateHtml(doc.body.childNodes);
-}
-function validateHtml(nodes) {
-    const result = [];
-    for (const node of Array.from(nodes)) {
-        if (node instanceof Text)
-            result.push(node.wholeText);
-        else if (node instanceof HTMLElement && allowedTags.has(node.tagName.toLowerCase())) {
-            const AllowedTag = node.tagName.toLowerCase();
-            if (node.childNodes.length > 0) {
-                const childNodes = validateHtml(node.childNodes);
-                if (childNodes.length) {
-                    result.push(React.createElement(AllowedTag, { key: result.length }, ...childNodes));
-                }
-            }
-            else
-                result.push(<AllowedTag></AllowedTag>);
-        }
-        else if (node instanceof HTMLElement) {
-            const dummy = document.createElement("div");
-            dummy.appendChild(node);
-            result.push(dummy.textContent);
-        }
-    }
-    return result;
-}

package/packages/level2/fd-component-toolbox/multiselect/FdMultiselect.jsx

@@ -1,240 +0,0 @@
-"use client";
-import React, { useCallback, useState, useLayoutEffect, useEffect, useMemo, useImperativeHandle, useRef, } from "react";
-import { FdCommand, FdCommandItem, FdCommandEmpty, FdCommandList, } from "@fd-component-toolbox/command/FdCommand";
-import { Command as CommandPrimitive } from "cmdk";
-import { Check } from "lucide-react";
-import { cn } from "@fd-toolbox/lib/utils";
-import { onMultiSelectKeyDown, onMultiSelectValueChange, getMultiSelectStatusesById, resetOnClick, inputOnClick, mousePreventDefault, onItemSelect, handleOpenChange, registerClickOutsideMultiselectHandler, multiSelectVariants, } from "@fd-component-toolbox/multiselect/FdMultiselect.funcs";
-import FdLabelAnimation from "@fd-component-toolbox/animation/FdLabelAnimation";
-import { FdButton } from "@fd-component-toolbox/button/FdButton";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-import { selectAllValue, selectAllDescription, } from "@fd-component-toolbox/multiselect/fd-multi-select-constants";
-import { FdFadeOutText } from "@fd-component-toolbox/fade-out-text/FdFadeOutText";
-import { FdMultiselectContext, useFdMultiselect, } from "@fd-component-toolbox/multiselect/hooks/use-multi-select";
-/**
- * Root container component for the multiselect dropdown functionality
- *
- * @param FdMultiselectProps {@link FdMultiselectProps}
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *     const [selectedValues, setSelectedValues] = useState<string[]>([]);
- *
- *     return (
- *         <FdMultiselect
- *             values={selectedValues}
- *             onValuesChange={setSelectedValues}
- *             displayValues={new Map([["option1", "Option 1"], ["option2", "Option 2"]])}
- *             disabled={false}
- *             withSelectAll
- *             variant="float"
- *         >
- *             ...
- *         </FdMultiselect>
- *     );
- * }
- * ```
- */
-function FdMultiselect({ values: value, onValuesChange: onValueChange, displayValues, loop, className, children, dir, disabled, variant, withSelectAll, onOpenChange, ref, ...props }) {
-    const [inputValue, setInputValue] = useState("");
-    const [open, setOpen] = useState(false);
-    const [activeIndex, setActiveIndex] = useState(-1);
-    const [description, setDescription] = useState("");
-    const [isHovered, setIsHovered] = useState(false);
-    const containerRef = useRef(null);
-    const isAllSelected = value.length === displayValues?.size;
-    const onOpenChangeCallback = useCallback((isOpen) => {
-        handleOpenChange(isOpen, setOpen, onOpenChange);
-    }, [onOpenChange]);
-    useImperativeHandle(ref, () => ({
-        open: () => {
-            onOpenChangeCallback(true);
-        },
-    }), [onOpenChangeCallback]);
-    const onValueChangeCallback = useCallback((val) => {
-        onMultiSelectValueChange(val, value, onValueChange, setDescription, withSelectAll, isAllSelected, displayValues);
-    }, [value, onValueChange, withSelectAll, isAllSelected, displayValues]);
-    const onFilterReset = useCallback(() => {
-        onValueChange([]);
-    }, [onValueChange]);
-    const contextValue = useMemo(() => ({
-        value,
-        onValueChange: onValueChangeCallback,
-        description,
-        open,
-        onOpenChangeCallback,
-        inputValue,
-        setInputValue,
-        activeIndex,
-        setActiveIndex,
-        disabled,
-        onReset: onFilterReset,
-        isHovered,
-        setIsHovered,
-        variant: variant ?? "float",
-        withSelectAll,
-        isAllSelected,
-    }), [
-        value,
-        onValueChangeCallback,
-        description,
-        open,
-        onOpenChangeCallback,
-        inputValue,
-        setInputValue,
-        activeIndex,
-        setActiveIndex,
-        disabled,
-        onFilterReset,
-        isHovered,
-        setIsHovered,
-        variant,
-        withSelectAll,
-        isAllSelected,
-    ]);
-    useLayoutEffect(() => {
-        if (!value || value.length === 0) {
-            setDescription("");
-        }
-    }, [value]);
-    useEffect(() => {
-        if (withSelectAll && isAllSelected) {
-            setDescription(selectAllDescription);
-        }
-        else if (value && displayValues) {
-            const statuses = getMultiSelectStatusesById(value, displayValues);
-            setDescription(statuses);
-        }
-    }, [value, displayValues, withSelectAll, isAllSelected]);
-    useEffect(() => {
-        if (!open)
-            return undefined;
-        return registerClickOutsideMultiselectHandler(containerRef, onOpenChangeCallback);
-    }, [open, onOpenChangeCallback, containerRef]);
-    const onKeyDownCallback = useCallback((e) => {
-        onMultiSelectKeyDown(value, e.key, inputValue, activeIndex, setActiveIndex, onValueChange, setOpen, loop, dir);
-    }, [loop, value, inputValue, activeIndex, onValueChange, dir]);
-    return (<FdMultiselectContext.Provider value={contextValue}>
-            <FdCommand ref={containerRef} onKeyDown={onKeyDownCallback} className={cn("flex flex-col overflow-visible bg-transparent", className)} dir={dir} {...props}>
-                {children}
-            </FdCommand>
-        </FdMultiselectContext.Provider>);
-}
-/**
- * Container component for the multiselect trigger
- *
- * {@link FdMultiselectTrigger}
- */
-function FdMultiselectTrigger({ className, children, ref, ...props }) {
-    const { disabled, setIsHovered, variant } = useFdMultiselect();
-    return (<div ref={ref} className={cn(multiSelectVariants({ variant }), disabled && "cursor-not-allowed opacity-50", className)} onMouseOver={() => setIsHovered(true)} onMouseOut={() => setIsHovered(false)} {...props}>
-            {children}
-        </div>);
-}
-FdMultiselectTrigger.displayName = "MultiselectTrigger";
-/**
- * Button component that clears all currently selected values
- *
- * {@link FdMultiselectReset}
- */
-function FdMultiselectReset() {
-    const { onReset, onOpenChangeCallback } = useFdMultiselect();
-    const onResetCallback = useCallback((e) => {
-        resetOnClick(e, onReset, onOpenChangeCallback);
-    }, [onReset, onOpenChangeCallback]);
-    return (<div className="flex items-center">
-            <FdButton variant="icon" size="icon" onClick={onResetCallback} className="size-2.5">
-                <FdIcon name={iconNames.cross1} className="bg-background"/>
-            </FdButton>
-        </div>);
-}
-FdMultiselectReset.displayName = "MultiselectReset";
-/**
- * Input component that displays selected values and handles user text input for filtering options
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command.Input}
- *
- * @example
- * ```tsx
- * <FdMultiselectInput placeholder="Select options" animatedPlaceholder="Status"
- * />
- * ```
- */
-function FdMultiselectInput({ className, placeholder, animatedPlaceholder, ref, ...props }) {
-    const { onOpenChangeCallback, description, open, inputValue, setInputValue, activeIndex, setActiveIndex, disabled, isHovered, variant, } = useFdMultiselect();
-    const onInputClickCallback = useCallback(() => {
-        inputOnClick(setActiveIndex, open, onOpenChangeCallback);
-    }, [setActiveIndex, open, onOpenChangeCallback]);
-    return (<div className="flex w-full cursor-pointer items-center justify-between" onClick={onInputClickCallback} tabIndex={0}>
-            <div className="relative w-full">
-                <FdFadeOutText>
-                    <CommandPrimitive.Input {...props} ref={ref} placeholder={description || (placeholder ?? "")} value={inputValue} onValueChange={activeIndex === -1 ? setInputValue : undefined} disabled={disabled} className={cn("w-full flex-1 bg-transparent pl-2 caret-transparent outline-none", description ? "placeholder:text-primary" : "placeholder:text-muted-foreground", className)}/>
-                </FdFadeOutText>
-                {animatedPlaceholder && (<FdLabelAnimation label={animatedPlaceholder} shouldAnimate={!!description} className="top-0 max-w-full" variant={variant}/>)}
-            </div>
-            <div className="flex size-4 shrink-0 items-center justify-center">
-                {description ? (<div className={cn(isHovered ? "animate-fade-in" : "animate-fade-out")}>
-                        <FdMultiselectReset />
-                    </div>) : (<div className="focus:outline-none">
-                        <FdIcon name="caretSort" className="pointer-events-none text-foreground opacity-50"/>
-                    </div>)}
-            </div>
-        </div>);
-}
-FdMultiselectInput.displayName = "MultiselectInput";
-/**
- * Container component that wraps the dropdown content when the multiselect is open
- *
- * {@link FdMultiselectContent}
- */
-function FdMultiselectContent({ children, className, ref, ...props }) {
-    const { open } = useFdMultiselect();
-    return (<div ref={ref} className={cn("relative top-1", className)} {...props}>
-            {open && children}
-        </div>);
-}
-FdMultiselectContent.displayName = "MultiselectContent";
-/**
- * Component that displays the list of selectable options in the dropdown
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command.List}
- */
-function FdMultiselectList({ className, children, ref, ...props }) {
-    const { withSelectAll } = useFdMultiselect();
-    return (<FdCommandList ref={ref} className={cn("absolute top-0 z-10 flex w-auto min-w-full flex-col gap-2 rounded-md border bg-background p-2 shadow-md transition-colors", className)} {...props}>
-            {withSelectAll && (<FdMultiselectItem value={selectAllValue} isSelectAll={false}>
-                    {selectAllDescription}
-                </FdMultiselectItem>)}
-            {children}
-            <FdCommandEmpty>
-                <span className="text-muted-foreground">No results found</span>
-            </FdCommandEmpty>
-        </FdCommandList>);
-}
-FdMultiselectList.displayName = "MultiselectList";
-/**
- * Individual selectable option within the multiselect dropdown list
- *
- * Based on {@link https://ui.shadcn.com/docs/components/command Command.Item}
- *
- * @example
- * ```tsx
- * <FdMultiselectItem value="selectAll" isSelectAll>
- *   All
- * </FdMultiselectItem>
- * ```
- */
-function FdMultiselectItem({ className, value, children, isSelectAll, ref, ...props }) {
-    const { value: Options, onValueChange, setInputValue, isAllSelected } = useFdMultiselect();
-    const isIncluded = isSelectAll ? isAllSelected : Options.includes(value);
-    const onSelect = useCallback(() => {
-        onItemSelect(value, onValueChange, setInputValue);
-    }, [value, onValueChange, setInputValue]);
-    return (<FdCommandItem ref={ref} {...props} onSelect={onSelect} className={cn("flex cursor-pointer justify-between rounded-md px-2 py-1 transition-colors", className, isIncluded && "cursor-default bg-accent text-accent-foreground", props.disabled && "cursor-not-allowed opacity-50")} onMouseDown={mousePreventDefault}>
-            {children}
-            <Check className={cn("ml-2 size-4 opacity-0", isIncluded && "opacity-50")}/>
-        </FdCommandItem>);
-}
-FdMultiselectItem.displayName = "MultiselectItem";
-export { FdMultiselect, FdMultiselectTrigger, FdMultiselectInput, FdMultiselectContent, FdMultiselectList, FdMultiselectItem, multiSelectVariants, };

package/packages/level2/fd-component-toolbox/navigation/FdNavigation.jsx

@@ -1,43 +0,0 @@
-import FdNavigationItemComponent from "@fd-component-toolbox/navigation/navigation-item/FdNavigationItem";
-import { FdList } from "@fd-component-toolbox/list/FdList";
-import { FdButton } from "@fd-component-toolbox/button/FdButton";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-/**
- * In-page navigation component that scrolls to target elements when items are clicked
- *
- * @param FdNavigationProps {@link FdNavigationProps}
- *
- * @example
- * ```tsx
-    function MyComponent() {
-        const [isOpen, setIsOpen] = useState(true);
-    
-        return (
-            <FdNavigation
-                config={{
-                    name: "Page Sections",
-                    items: [
-                        { name: "Introduction", targetHtmlElementId: "intro-section" },
-                        { name: "Features", targetHtmlElementId: "features-section" },
-                    ],
-                }}
-                isOpen={isOpen}
-                onOpenClick={() => setIsOpen(!isOpen)}
-            />;
-        );
-    }
- * ```
- */
-function FdNavigation({ config, isOpen, onOpenClick }) {
-    return (<FdList className={`w-48 bg-background text-sm transition duration-300 ease-in-out ${isOpen ? "translate-x-0" : "-translate-x-56"}`}>
-            <div className="flex items-center justify-start">
-                {onOpenClick && (<FdButton variant={"icon"} onClick={onOpenClick} className="absolute -left-2">
-                        <FdIcon name={iconNames.caretLeftIcon}/>
-                    </FdButton>)}
-                {config.name !== "" && (<p className="m-2 cursor-pointer p-2 font-bold text-muted-foreground">{config.name}</p>)}
-            </div>
-
-            {config.items.map((item) => (<FdNavigationItemComponent item={item} key={item.targetHtmlElementId}/>))}
-        </FdList>);
-}
-export default FdNavigation;

package/packages/level2/fd-component-toolbox/navigation/navigation-item/FdNavigationItem.jsx

@@ -1,23 +0,0 @@
-import { useCallback } from "react";
-import { scrollIntoView } from "@fd-component-toolbox/navigation/navigation-item/FdNavigationItem.funcs";
-/**
- * Individual navigation item that scrolls to a target element when clicked
- *
- * @param FdNavigationItemComponentProps {@link FdNavigationItemComponentProps}
- *
- * @example
- * ```tsx
- * <FdNavigationItemComponent item={{ name: "Features", targetHtmlElementId: "features-section"}}/>
- * ```
- */
-function FdNavigationItemComponent({ item }) {
-    const onClick = useCallback(() => {
-        if (item.targetHtmlElementId) {
-            scrollIntoView(item.targetHtmlElementId);
-        }
-    }, [item.targetHtmlElementId]);
-    return (<li className="m-2 cursor-pointer px-4 py-2 text-fd-accent hover:rounded-md hover:bg-muted/50" onClick={onClick}>
-            {item.name}
-        </li>);
-}
-export default FdNavigationItemComponent;

package/packages/level2/fd-component-toolbox/radio-group/FdRadioGroup.jsx

@@ -1,46 +0,0 @@
-"use client";
-import * as React from "react";
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { Circle } from "lucide-react";
-import { cn } from "@fd-toolbox/lib/utils";
-/**
- * Container component for grouping radio button inputs
- *
- * Based on [Radio Group](https://ui.shadcn.com/docs/components/radio-group)
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *     const [value, setValue] = useState("option1");
- *
- *     return (
- *         <FdRadioGroup value={value} onValueChange={setValue}>
- *             ...
- *         </FdRadioGroup>
- *     );
- * }
- * ```
- */
-function FdRadioGroup({ className, ref, ...props }) {
-    return <RadioGroupPrimitive.Root className={cn("grid gap-2", className)} {...props} ref={ref}/>;
-}
-FdRadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
-/**
- * Individual radio button input with circle indicator
- *
- * Based on [Radio Group](https://ui.shadcn.com/docs/components/radio-group)
- *
- * @example
- * ```tsx
- * <FdRadioGroupItem value="option"/>
- * ```
- */
-function FdRadioGroupItem({ className, ref, ...props }) {
-    return (<RadioGroupPrimitive.Item ref={ref} className={cn("aspect-square size-4 rounded-full border border-primary text-primary shadow focus:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:cursor-not-allowed disabled:opacity-50", className)} {...props}>
-            <RadioGroupPrimitive.Indicator className="flex items-center justify-center">
-                <Circle className="size-3.5 fill-primary"/>
-            </RadioGroupPrimitive.Indicator>
-        </RadioGroupPrimitive.Item>);
-}
-FdRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
-export { FdRadioGroup, FdRadioGroupItem };