@fernir2/saas-kit-cli 0.1.4 → 0.1.5

package/packages/level2/meta/edit-resource/edit-resource-property-field/FdEditResourcePropertyField.jsx

@@ -1,105 +0,0 @@
-"use client";
-import React, { useCallback, useState } from "react";
-import { crudActions, propertyTypes } from "@fd-toolbox/enums/enums";
-import { FdMarkdown } from "@fd-component-toolbox/markdown/FdMarkdown";
-import { FdSwitch } from "@fd-component-toolbox/switch/FdSwitch";
-import { FdEditResourceEnumField } from "@meta/edit-resource/edit-resource-property-block/FdEditResourceEnumField";
-import { FdEditResourceFlagsEnumField } from "@meta/edit-resource/edit-resource-property-block/FdEditResourceFlagsEnumField";
-import { FdInput } from "@fd-component-toolbox/input/FdInput";
-import { FdDatePicker } from "@fd-component-toolbox/datepicker/FdDatePicker";
-import { FdTextarea } from "@fd-component-toolbox/textarea/FdTextArea";
-import { FdFormControl, FdFormField, FdFormItem, FdFormMessage } from "@fd-component-toolbox/form/FdForm";
-import { isMarkdown, isEnum, isFlagsEnum, isRichText, isDateOnly, isDateTime, isBigText, isBlobList, } from "@meta/core/property-types";
-import { getRelationResourceId, getRequiredLabel, isManyToOneBrowserField, isIdProperty, isManyToManyBrowserField, isOneToManyBrowserField, isRelationField, onBrowserChange, onEditorChange, onMultiBrowserChange, } from "@meta/edit-resource/edit-resource-property-block/FdEditResourcePropertyBlock.funcs";
-import { parseStringStartDate } from "@fd-toolbox/dates/date-times";
-import { fdBrowserField, fdManyToManyBrowserField, fdMultiBrowserField, } from "@meta/edit-resource/edit-resource-property-block/edit-resource-fields";
-import { isDefaultInputField } from "@meta/edit-resource/services/edit-resource-components";
-import { FdEditResourceBlobField } from "@meta/edit-resource/edit-resource-property-block/FdEditResourceBlobField";
-import { FdEditResourceRichTextField } from "@meta/edit-resource/edit-resource-property-block/FdEditResourceRichTextField";
-import { editFormElementSuffixes } from "@fd-toolbox/constants/element-suffixes";
-import { cn } from "@fd-toolbox/lib/utils";
-import { hasPropertyPermission } from "@meta/auth/permissions/permission-checker";
-export function FdEditResourcePropertyField({ uiPropertyMeta, propertyMeta, form, formFieldOption, resource, propertyConfig, readOnlyResource, loadComplete, excludeResourceIds, isNew, onChange, onItemClick, parentContextName, }) {
-    let result;
-    const displayName = propertyMeta.displayName;
-    const defaultValue = form.getValues(propertyMeta.name);
-    const relatedResourceId = getRelationResourceId(propertyMeta, resource);
-    const hasPermission = hasPropertyPermission(propertyMeta.id, crudActions.update);
-    const [editorContent, setEditorContent] = useState("");
-    const [isChecked, setIsChecked] = useState(!!resource[uiPropertyMeta.name]);
-    const onTextFieldChange = useCallback((name) => {
-        onChange?.(form.getValues(name), name);
-    }, [onChange, form]);
-    const handleEditorChange = (content, propertyName) => {
-        onEditorChange(form, propertyName, content, setEditorContent);
-    };
-    const onMultiBrowserValueChange = useCallback((selected, propertyMetaValue) => {
-        onMultiBrowserChange(form.setValue, selected, propertyMetaValue, onChange);
-    }, [form, onChange]);
-    const onBrowserValueChange = useCallback((propertyMetaValue, value) => {
-        onBrowserChange(form.setValue, value, propertyMetaValue, onChange);
-    }, [form, onChange]);
-    if (!hasPermission)
-        return result;
-    if (isRelationField(propertyMeta)) {
-        return isBlobList(propertyMeta) ? (<FdEditResourceBlobField isNew={isNew} label={getRequiredLabel(propertyMeta.required, displayName)} form={form} relatedResourceId={resource.id} propertyMeta={propertyMeta}/>) : (<>
-                {isManyToOneBrowserField(propertyMeta) &&
-                fdBrowserField(parentContextName, uiPropertyMeta, readOnlyResource, onBrowserValueChange, excludeResourceIds, relatedResourceId, form, onItemClick, isNew, propertyMeta)}
-                {isOneToManyBrowserField(propertyMeta) &&
-                fdMultiBrowserField(parentContextName, readOnlyResource, onMultiBrowserValueChange, resource.id, form, onItemClick, isNew, propertyMeta)}
-                {isManyToManyBrowserField(propertyMeta) &&
-                fdManyToManyBrowserField(parentContextName, readOnlyResource, relatedResourceId, form, onItemClick, isNew, propertyMeta, onMultiBrowserValueChange)}
-            </>);
-    }
-    else {
-        return (<>
-                {isMarkdown(propertyMeta.type, propertyMeta.typeFormat) && (<FdMarkdown elementId={uiPropertyMeta.name + editFormElementSuffixes.markdown} label={getRequiredLabel(propertyMeta.required, displayName)} required={propertyMeta.required} value={defaultValue} name={uiPropertyMeta.name} form={form} readOnly={readOnlyResource} skipAnimationOnce={!loadComplete} onChange={(val) => {
-                    form.setValue(propertyMeta.name, val);
-                }} onBlur={() => onTextFieldChange(propertyMeta.name)}/>)}
-                {propertyMeta.type === propertyTypes.boolean && (<FdFormField control={form.control} name={uiPropertyMeta.name} render={({ field }) => (<FdFormItem>
-                                <FdFormControl>
-                                    <FdSwitch id={uiPropertyMeta.name + editFormElementSuffixes.checkbox} text={displayName} form={form} name={uiPropertyMeta.name} checked={isChecked} isDisabled={propertyConfig?.isDisabled ?? false} readOnly={readOnlyResource} skipAnimationOnce={!loadComplete} onCheckedChange={(checked) => {
-                        field.onChange(checked);
-                        setIsChecked(!isChecked);
-                        onTextFieldChange(uiPropertyMeta.name);
-                    }}/>
-                                </FdFormControl>
-                                <FdFormMessage />
-                            </FdFormItem>)}/>)}
-                {isEnum(propertyMeta.type, propertyMeta.typeFormat) && (<FdEditResourceEnumField uiPropertyMeta={uiPropertyMeta} form={form} readOnly={readOnlyResource} skipAnimationOnce={!loadComplete} onChange={onChange} propertyMeta={propertyMeta}/>)}
-                {isFlagsEnum(propertyMeta.type, propertyMeta.typeFormat) && (<FdEditResourceFlagsEnumField uiPropertyMeta={uiPropertyMeta} form={form} skipAnimationOnce={!loadComplete} readOnly={readOnlyResource} onChange={onChange} propertyMeta={propertyMeta}/>)}
-                {isRichText(propertyMeta.type, propertyMeta.typeFormat) && (<FdFormItem>
-                        <FdFormField control={form.control} name={uiPropertyMeta.name} render={() => (<FdEditResourceRichTextField id={uiPropertyMeta.name + editFormElementSuffixes.richText} value={editorContent} onChange={(content) => handleEditorChange(content, propertyMeta.name)} placeholder="Start typing..." debounceTime={500} defaultValue={defaultValue ? String(defaultValue) : ""} label={getRequiredLabel(propertyMeta.required, displayName)} onBlur={() => onTextFieldChange(propertyMeta.name)}/>)}/>
-                    </FdFormItem>)}
-                {isDefaultInputField(propertyMeta) && (<div className={cn("w-full", isIdProperty(propertyMeta) && "opacity-0")}>
-                        <FdFormField control={form.control} name={uiPropertyMeta.name} render={({ field }) => (<FdFormItem>
-                                    <FdFormControl>
-                                        <FdInput style={{
-                        cursor: isIdProperty(propertyMeta) ? "default" : "text",
-                    }} showClearIcon={!readOnlyResource} {...form.register(propertyMeta.name, formFieldOption)} {...field} readOnly={readOnlyResource} placeholder={displayName} inputId={uiPropertyMeta.name + editFormElementSuffixes.input} required={propertyMeta.required} label={getRequiredLabel(propertyMeta.required, displayName)} onBlur={() => onTextFieldChange(propertyMeta.name)} skipAnimationOnce={!loadComplete} onChange={(event) => {
-                        field.onChange(event);
-                    }} disabled={propertyConfig?.isDisabled ?? false}/>
-                                    </FdFormControl>
-                                    <FdFormMessage />
-                                </FdFormItem>)}/>
-                        {propertyConfig?.description && (<p className="mt-2 pl-1 text-xs opacity-60">{propertyConfig.description}</p>)}
-                    </div>)}
-                {(isDateOnly(propertyMeta.type, propertyMeta.typeFormat) ||
-                isDateTime(propertyMeta.type, propertyMeta.typeFormat)) && (<FdDatePicker label={displayName} date={defaultValue} form={form} name={propertyMeta.name} inputId={propertyMeta.name + editFormElementSuffixes.datePicker} enableTime={isDateTime(propertyMeta.type, propertyMeta.typeFormat)} readOnly={readOnlyResource} skipAnimationOnce={!loadComplete} onDateValueChange={(val) => {
-                    if (val) {
-                        onChange?.(parseStringStartDate(val), uiPropertyMeta.name);
-                    }
-                }}/>)}
-                {isBigText(propertyMeta.type, propertyMeta.typeFormat) && (<div className="w-full">
-                        <FdFormField control={form.control} name={uiPropertyMeta.name} render={({ field }) => (<FdFormItem>
-                                    <FdFormControl>
-                                        <FdTextarea placeholder={propertyConfig?.placeholder} required={propertyMeta.required} id={propertyMeta.name + editFormElementSuffixes.textarea} {...field} {...form.register(propertyMeta.name, formFieldOption)} readOnly={readOnlyResource} onChange={(event) => {
-                        field.onChange(event);
-                    }} label={getRequiredLabel(propertyMeta.required, displayName)} onBlur={() => onTextFieldChange(propertyMeta.name)}/>
-                                    </FdFormControl>
-                                    <FdFormMessage />
-                                </FdFormItem>)}/>
-                    </div>)}
-            </>);
-    }
-}

package/packages/level2/meta/filtering/filter/FdEnumFlagFilter.jsx

@@ -1,40 +0,0 @@
-import { FdSelect, FdSelectContent, FdSelectGroup, FdSelectItem, FdSelectTrigger, FdSelectValue, } from "@fd-component-toolbox/select/FdSelect";
-import { enumFilterTypes } from "@meta/filtering/filter/FdFilter.funcs";
-import { elementSuffixes } from "@fd-toolbox/constants/element-suffixes";
-/**
- * Filter component for enum flag properties with operator selection and single-value selection.
- *
- * @param props - {@link FdEnumFlagFilterProps}
- */
-export function FdEnumFlagFilter({ rightHandResult, displayName, propertyMeta, onOperatorTypeChangeCallback, onRightHandChangeCallback, inputId, onOpenChangeCallback, buttonRef, }) {
-    return (<div className="flex min-w-full items-center">
-            <div className="mr-1 w-10">
-                <FdSelect value={rightHandResult} onValueChange={onOperatorTypeChangeCallback}>
-                    <FdSelectTrigger id={propertyMeta.name + elementSuffixes.filterOperator} variant="float">
-                        <FdSelectValue />
-                    </FdSelectTrigger>
-                    <FdSelectContent>
-                        <FdSelectGroup>
-                            {enumFilterTypes.map((item) => (<FdSelectItem key={`${item.text}_${item.type}`} value={item.type}>
-                                    {item.text}
-                                </FdSelectItem>))}
-                        </FdSelectGroup>
-                    </FdSelectContent>
-                </FdSelect>
-            </div>
-            <div className="inline-block flex-1">
-                <FdSelect value={displayName} onValueChange={onRightHandChangeCallback} onOpenChange={onOpenChangeCallback}>
-                    <FdSelectTrigger ref={buttonRef} id={inputId} label={propertyMeta.displayName} shouldAnimate={!!rightHandResult && rightHandResult !== "None"} value={rightHandResult} variant="float">
-                        <FdSelectValue className="mt-0 w-full" placeholder={displayName}/>
-                    </FdSelectTrigger>
-                    <FdSelectContent>
-                        <FdSelectGroup>
-                            {propertyMeta.enumerationValues?.map((value, index) => (<FdSelectItem className="min-h-6 whitespace-nowrap" key={value} value={propertyMeta.enumerationDisplayName[index]}>
-                                    {propertyMeta.enumerationDisplayName[index]}
-                                </FdSelectItem>))}
-                        </FdSelectGroup>
-                    </FdSelectContent>
-                </FdSelect>
-            </div>
-        </div>);
-}

package/packages/level2/meta/filtering/filter/FdFilter.jsx

@@ -1,123 +0,0 @@
-"use client";
-import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { onInitFilter, onBrowserChanged, disableFilterInput, getFilterRightHand, isIntegerField, onFilterChange, onDateChange, onOperatorTypeChange, getFilterDisplayValues, filterTypes, onInputBlur, } from "@meta/filtering/filter/FdFilter.funcs";
-import { isDefaultInputField } from "@meta/edit-resource/services/edit-resource-components";
-import { isFlagsEnum, isGuid, isEnum, isDateTime, isDateOnly, isBooleanField, } from "@meta/core/property-types";
-import { filterOperatorTypes } from "@fd-toolbox/enums/enums";
-import { useForm, FormProvider } from "react-hook-form";
-import { FdEnumFlagFilter } from "@meta/filtering/filter/FdEnumFlagFilter";
-import { EnumFilter } from "@meta/filtering/filter/filters/EnumFilter";
-import { IntegerFilter } from "@meta/filtering/filter/filters/IntegerFilter";
-import { BooleanFilter } from "@meta/filtering/filter/filters/BooleanFilter";
-import { DateFilter } from "@meta/filtering/filter/filters/DateFilter";
-import { TextFilter } from "@meta/filtering/filter/filters/TextFilter";
-import { GuidFilter } from "@meta/filtering/filter/filters/GuidFilter";
-import { cn } from "@fd-toolbox/lib/utils";
-import { elementSuffixes } from "@fd-toolbox/constants/element-suffixes";
-/**
- * Сomponent for filtering data.
- *
- * @param props - {@link FdFilterProps}
- */
-export function FdFilter({ propertyMeta, onChange, className, state, onStateChange, relatedUiResourceMetas, type, resetCounter, ...props }) {
-    const form = useForm({
-        defaultValues: { [propertyMeta.name]: "" },
-    });
-    const [filterOperatorType, setFilterOperatorType] = useState(filterOperatorTypes.none);
-    const [inputId, setInputId] = useState("");
-    const [disableEnumFilter, setDisableEnumFilter] = useState(false);
-    const [disabled, setDisabled] = useState(props.disabled ?? false);
-    const [selectedResourceIds, setSelectedResourceIds] = useState([]);
-    const [displayName, setDisplayName] = useState(propertyMeta.displayName);
-    const [displayDate, setDisplayDate] = useState("");
-    const rightHandResult = useMemo(() => {
-        return getFilterRightHand(state, filterOperatorType);
-    }, [state, filterOperatorType]);
-    const [isInputShowed, setIsInputShowed] = useState(false);
-    const inputRef = useRef(null);
-    const buttonRef = useRef(null);
-    const openTriggerRef = useRef(null);
-    const rightHandResultForFdMultiselect = useMemo(() => {
-        if (rightHandResult) {
-            return rightHandResult.split(",");
-        }
-        else {
-            return [...rightHandResult];
-        }
-    }, [rightHandResult]);
-    const displayValues = useMemo(() => {
-        return getFilterDisplayValues(state, propertyMeta);
-    }, [propertyMeta, state]);
-    useEffect(() => {
-        onInitFilter(state, displayName, setDisplayName, propertyMeta, setFilterOperatorType, setSelectedResourceIds, setDisplayDate, setInputId);
-    }, [displayName, propertyMeta, state]);
-    useEffect(() => {
-        if (resetCounter !== undefined) {
-            setIsInputShowed(false);
-        }
-    }, [resetCounter]);
-    const onDateChangeCallback = useCallback(async (date) => {
-        onDateChange(state, onStateChange, filterOperatorType, setDisabled, setDisableEnumFilter, date, onChange);
-        if (!date)
-            setIsInputShowed(false);
-    }, [filterOperatorType, onChange, onStateChange, state]);
-    const onRightHandChangeCallback = useCallback(async (value) => {
-        await onFilterChange({
-            ...state,
-            rightSide: value,
-        }, onStateChange, filterOperatorType, setDisabled, setDisableEnumFilter, setFilterOperatorType, onChange);
-        if (value === "none" || value === "" || (Array.isArray(value) && value.length === 0)) {
-            setIsInputShowed?.(false);
-        }
-    }, [state, onStateChange, filterOperatorType, onChange]);
-    const onOperatorTypeChangeCallback = useCallback(async (value) => {
-        await onOperatorTypeChange(value, state, onStateChange, setFilterOperatorType, setDisabled, setDisabled, onChange);
-    }, [state, onStateChange, onChange]);
-    const onBrowserChangeCallback = useCallback(async (selectedResources, resourceMeta) => {
-        await onBrowserChanged(selectedResources, propertyMeta, state, filterOperatorType, onStateChange, setDisabled, setDisableEnumFilter, setSelectedResourceIds, form, resourceMeta, onChange, setIsInputShowed);
-    }, [filterOperatorType, onStateChange, propertyMeta, state, form, onChange]);
-    const onOpenChangeCallback = useCallback((open) => {
-        if (!open && (rightHandResult === "" || rightHandResult === "none")) {
-            setIsInputShowed?.(false);
-        }
-        else {
-            setIsInputShowed?.(true);
-        }
-    }, [rightHandResult, setIsInputShowed]);
-    const onGuidFilterClose = useCallback(() => {
-        setIsInputShowed?.(false);
-    }, []);
-    const hendleOnHoverClick = useCallback(() => {
-        setIsInputShowed(true);
-        requestAnimationFrame(() => {
-            inputRef?.current?.focus();
-            buttonRef?.current?.click();
-            openTriggerRef.current?.open();
-        });
-    }, []);
-    const handleOnBlur = useCallback((val) => {
-        onInputBlur(val, setIsInputShowed);
-    }, [setIsInputShowed]);
-    return (<FormProvider {...form}>
-            <div className={className}>
-                {state && (<>
-                        {type === filterTypes.default && !isInputShowed && (<div className="flex h-8 w-fit cursor-pointer items-center justify-center bg-popover px-8" onClick={hendleOnHoverClick} id={inputId + elementSuffixes.button}>
-                                <p className="text-sm font-semibold text-fd-accent">{displayName}</p>
-                            </div>)}
-                        <div className={cn("hidden", isInputShowed && "block max-w-36")}>
-                            {isEnum(propertyMeta.type, propertyMeta.typeFormat) && (<EnumFilter filterOperatorType={filterOperatorType} onOperatorTypeChange={onOperatorTypeChangeCallback} rightHandResult={rightHandResultForFdMultiselect} onRightHandChange={onRightHandChangeCallback} displayValues={displayValues} disableEnumFilter={disableEnumFilter} displayName={displayName} propertyMeta={propertyMeta} inputId={inputId} onOpenChangeCallback={onOpenChangeCallback} ref={openTriggerRef}/>)}
-                            {isDefaultInputField(propertyMeta) && isIntegerField(propertyMeta) && (<IntegerFilter filterOperatorType={filterOperatorType} onOperatorTypeChange={onOperatorTypeChangeCallback} rightHandResult={rightHandResult} onRightHandChange={onRightHandChangeCallback} displayName={displayName} disableFilterInput={disableFilterInput} inputId={inputId} inputRef={inputRef} onBlur={handleOnBlur}/>)}
-                            {isBooleanField(propertyMeta) && (<BooleanFilter rightHandResult={rightHandResult} onRightHandChange={onRightHandChangeCallback} displayName={propertyMeta.displayName} state={state} filterOperatorType={filterOperatorType} inputId={inputId} buttonRef={buttonRef} onOpenChangeCallback={onOpenChangeCallback}/>)}
-                            {(isDateOnly(propertyMeta.type, propertyMeta.typeFormat) ||
-                isDateTime(propertyMeta.type, propertyMeta.typeFormat)) && (<DateFilter displayName={propertyMeta.displayName} displayDate={displayDate} onDateChange={onDateChangeCallback} onOpenChangeCallback={onOpenChangeCallback} ref={openTriggerRef}/>)}
-                            {!isGuid(propertyMeta) &&
-                isDefaultInputField(propertyMeta) &&
-                !isIntegerField(propertyMeta) &&
-                !isDateOnly(propertyMeta.type, propertyMeta.typeFormat) && (<TextFilter displayName={displayName} rightHandResult={rightHandResult} onRightHandChange={onRightHandChangeCallback} inputId={inputId} inputRef={inputRef} onBlur={handleOnBlur}/>)}
-                            {isGuid(propertyMeta) && (<GuidFilter onClose={onGuidFilterClose} filterOperatorType={filterOperatorType} onOperatorTypeChange={onOperatorTypeChangeCallback} selectedResourceIds={selectedResourceIds} setSelectedResourceIds={setSelectedResourceIds} propertyMeta={propertyMeta} onBrowserChange={onBrowserChangeCallback} disabled={disabled} form={form} inputId={inputId} relatedUiResourceMetas={relatedUiResourceMetas} ref={openTriggerRef}/>)}
-                            {isFlagsEnum(propertyMeta.type, propertyMeta.typeFormat) && (<FdEnumFlagFilter rightHandResult={rightHandResult} displayName={displayName} propertyMeta={propertyMeta} onOperatorTypeChangeCallback={onOperatorTypeChangeCallback} onRightHandChangeCallback={onRightHandChangeCallback} inputId={inputId} buttonRef={buttonRef} onOpenChangeCallback={onOpenChangeCallback}/>)}
-                        </div>
-                    </>)}
-            </div>
-        </FormProvider>);
-}

package/packages/level2/meta/filtering/filter/filters/BooleanFilter.jsx

@@ -1,25 +0,0 @@
-import { FdSelect, FdSelectContent, FdSelectGroup, FdSelectItem, FdSelectTrigger, } from "@fd-component-toolbox/select/FdSelect";
-import { capitalizeString } from "@fd-toolbox/strings/case-converters";
-import { getFilterRightHandValue } from "@meta/filtering/filter/FdFilter.funcs";
-import { elementPrefixes } from "@meta/constants/element-prefixes";
-export const booleanFilterSelectOptions = [
-    { value: "none", label: "None" },
-    { value: "true", label: "Yes" },
-    { value: "false", label: "No" },
-];
-export function BooleanFilter({ rightHandResult, onRightHandChange, displayName, state, filterOperatorType, inputId, onOpenChangeCallback, buttonRef, }) {
-    return (<div className="relative min-w-full">
-            <FdSelect value={rightHandResult} onValueChange={onRightHandChange} onOpenChange={onOpenChangeCallback}>
-                <FdSelectTrigger ref={buttonRef} id={inputId} label={displayName} shouldAnimate={!!rightHandResult && rightHandResult !== "none"} variant="float">
-                    {capitalizeString(getFilterRightHandValue(state, filterOperatorType))}
-                </FdSelectTrigger>
-                <FdSelectContent>
-                    <FdSelectGroup>
-                        {booleanFilterSelectOptions.map((option) => (<FdSelectItem id={elementPrefixes.selectItem + option.label} key={option.value} value={option.value}>
-                                {option.label}
-                            </FdSelectItem>))}
-                    </FdSelectGroup>
-                </FdSelectContent>
-            </FdSelect>
-        </div>);
-}

package/packages/level2/meta/filtering/filter/filters/DateFilter.jsx

@@ -1,10 +0,0 @@
-import { FdDatePicker } from "@fd-component-toolbox/datepicker/FdDatePicker";
-/**
- * Date filter component based on {@link FdDatePicker}.
- * Designed to be used in filters, forms or dashboards where selecting a date is required.
- *
- * @see {@link DateFilterProps} for component props
- */
-export function DateFilter({ displayName, displayDate, onDateChange, onOpenChangeCallback, ref, }) {
-    return (<FdDatePicker variant="float" label={displayName} date={displayDate} onDateValueChange={onDateChange} onOpenChange={onOpenChangeCallback} ref={ref}/>);
-}

package/packages/level2/meta/filtering/filter/filters/EnumFilter.jsx

@@ -1,44 +0,0 @@
-import { FdSelect, FdSelectContent, FdSelectGroup, FdSelectItem, FdSelectTrigger, FdSelectValue, } from "@fd-component-toolbox/select/FdSelect";
-import { FdMultiselect, FdMultiselectContent, FdMultiselectInput, FdMultiselectItem, FdMultiselectList, FdMultiselectTrigger, } from "@fd-component-toolbox/multiselect/FdMultiselect";
-import { cn } from "@fd-toolbox/lib/utils";
-import { enumFilterTypes, getFilterShortValue } from "@meta/filtering/filter/FdFilter.funcs";
-import { elementSuffixes } from "@fd-toolbox/constants/element-suffixes";
-/**
- * Filter component for enumeration properties with operator selection and multi-value selection
- *
- * @param props - {@link EnumFilterProps}
- */
-export function EnumFilter({ filterOperatorType, onOperatorTypeChange, rightHandResult, onRightHandChange, displayValues, disableEnumFilter, displayName, propertyMeta, inputId, onOpenChangeCallback, ref, }) {
-    return (<div className="flex min-w-full items-center">
-            <div className="mr-1 w-full max-w-9">
-                <FdSelect value={filterOperatorType} onValueChange={onOperatorTypeChange}>
-                    <FdSelectTrigger id={propertyMeta.name + elementSuffixes.filterOperator} variant="float" className="flex justify-center gap-px" size="short">
-                        <FdSelectValue>
-                            {getFilterShortValue(enumFilterTypes, filterOperatorType)}
-                        </FdSelectValue>
-                    </FdSelectTrigger>
-                    <FdSelectContent>
-                        <FdSelectGroup>
-                            {enumFilterTypes.map((item, index) => (<FdSelectItem index={index} key={item.type} value={item.type} className="min-h-6">
-                                    {item.text}
-                                </FdSelectItem>))}
-                        </FdSelectGroup>
-                    </FdSelectContent>
-                </FdSelect>
-            </div>
-            <div className="inline-block flex-1">
-                <FdMultiselect id={inputId} values={rightHandResult} onValuesChange={onRightHandChange} displayValues={displayValues} disabled={disableEnumFilter} variant="float" onOpenChange={onOpenChangeCallback} ref={ref}>
-                    <FdMultiselectTrigger>
-                        <FdMultiselectInput id={inputId} className="mt-0 w-full" animatedPlaceholder={displayName}/>
-                    </FdMultiselectTrigger>
-                    <FdMultiselectContent>
-                        <FdMultiselectList className="z-20">
-                            {propertyMeta.enumerationValues?.map((value) => (<FdMultiselectItem className={cn("min-h-6 whitespace-nowrap")} key={value.toString()} value={value.toString()}>
-                                    {propertyMeta.enumerationDisplayName?.[Number(value)]}
-                                </FdMultiselectItem>))}
-                        </FdMultiselectList>
-                    </FdMultiselectContent>
-                </FdMultiselect>
-            </div>
-        </div>);
-}

package/packages/level2/meta/filtering/filter/filters/GuidFilter.jsx

@@ -1,28 +0,0 @@
-"use client";
-import { FdSelect, FdSelectContent, FdSelectGroup, FdSelectItem, FdSelectTrigger, FdSelectValue, } from "@fd-component-toolbox/select/FdSelect";
-import { FdMultiBrowser } from "@meta/browsers/multi-browser/FdMultiBrowser";
-import { browserFilterTypes, getFilterShortValue } from "@meta/filtering/filter/FdFilter.funcs";
-export function GuidFilter({ filterOperatorType, onOperatorTypeChange, selectedResourceIds, setSelectedResourceIds, propertyMeta, onBrowserChange, disabled, form, inputId, onClose, relatedUiResourceMetas, ref, }) {
-    return (<div className="flex min-w-9 flex-row items-center gap-1">
-            <div className="w-full max-w-9">
-                <FdSelect value={filterOperatorType} onValueChange={onOperatorTypeChange}>
-                    <FdSelectTrigger id={inputId} variant="float" className="flex justify-center gap-px" size="short">
-                        <FdSelectValue>
-                            {getFilterShortValue(browserFilterTypes, filterOperatorType)}
-                        </FdSelectValue>
-                    </FdSelectTrigger>
-                    <FdSelectContent>
-                        <FdSelectGroup>
-                            {browserFilterTypes.map((item, index) => (<FdSelectItem index={index} key={item.type} value={item.type} className="min-h-6">
-                                    {item.text}
-                                </FdSelectItem>))}
-                        </FdSelectGroup>
-                    </FdSelectContent>
-                </FdSelect>
-            </div>
-            <FdMultiBrowser selectedResourceIds={selectedResourceIds} setSelectedResourceIds={setSelectedResourceIds} getSelectedResourcesFromApi={false} propertyMeta={propertyMeta} required={false} onChange={onBrowserChange} onClose={onClose} disabled={disabled} form={form} variant="float" relatedUiResourceMeta={relatedUiResourceMetas?.find((uiResourceMeta) => {
-            return (propertyMeta.relation?.relatedResourceName ===
-                uiResourceMeta.resourceMeta.resourceName);
-        })} ref={ref}/>
-        </div>);
-}

package/packages/level2/meta/filtering/filter/filters/IntegerFilter.jsx

@@ -1,28 +0,0 @@
-import { FdSelect, FdSelectContent, FdSelectGroup, FdSelectItem, FdSelectTrigger, FdSelectValue, } from "@fd-component-toolbox/select/FdSelect";
-import { FdInput } from "@fd-component-toolbox/input/FdInput";
-import { numberFilterTypes, getFilterShortValue } from "@meta/filtering/filter/FdFilter.funcs";
-import { filterOperatorTypes } from "@fd-toolbox/enums/enums";
-import { oDataNullValue } from "@fd-toolbox/odata/odata-constants";
-export function IntegerFilter({ filterOperatorType, onOperatorTypeChange, rightHandResult, onRightHandChange, displayName, disableFilterInput, inputId, inputRef, onBlur, }) {
-    return (<div className="flex min-w-full">
-            <div className="mr-1 inline-block w-full max-w-9">
-                <FdSelect value={filterOperatorType} onValueChange={onOperatorTypeChange}>
-                    <FdSelectTrigger variant="float" className="flex justify-center gap-px" size="short">
-                        {filterOperatorType !== filterOperatorTypes.none && (<FdSelectValue>
-                                {getFilterShortValue(numberFilterTypes, filterOperatorType)}
-                            </FdSelectValue>)}
-                    </FdSelectTrigger>
-                    <FdSelectContent>
-                        <FdSelectGroup>
-                            {numberFilterTypes.map((item, index) => (<FdSelectItem index={index} key={item.type} value={item.type} className="min-h-6">
-                                    {item.text}
-                                </FdSelectItem>))}
-                        </FdSelectGroup>
-                    </FdSelectContent>
-                </FdSelect>
-            </div>
-            <div className="inline-block w-64">
-                <FdInput inputId={inputId} showClearIcon={true} value={rightHandResult !== oDataNullValue ? rightHandResult : ""} onChange={onRightHandChange} disabled={disableFilterInput(filterOperatorType)} label={displayName} variant="float" ref={inputRef} onBlur={onBlur}/>
-            </div>
-        </div>);
-}

package/packages/level2/meta/filtering/filter/filters/TextFilter.jsx

@@ -1,11 +0,0 @@
-import { FdInput } from "@fd-component-toolbox/input/FdInput";
-/**
- * Text filter component for filtering data by text input
- *
- * @param props - {@link TextFilterProps}
- */
-export function TextFilter({ displayName, rightHandResult, onRightHandChange, inputId, inputRef, onBlur, }) {
-    return (<div className="min-w-full">
-            <FdInput inputId={inputId} label={displayName} showClearIcon={true} value={rightHandResult} onChange={onRightHandChange} variant="float" ref={inputRef} onBlur={onBlur}/>
-        </div>);
-}

package/packages/level2/meta/filtering/resource-filter-list/FdResourceFilterList.jsx

@@ -1,120 +0,0 @@
-"use client";
-import { useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState, } from "react";
-import * as Collapsible from "@radix-ui/react-collapsible";
-import { getFilteredKeys, getFilters, onResize, onStateChange, setObserver, resetResourceFilterListState, } from "@meta/filtering/resource-filter-list/FdResourceFilterList.funcs";
-import { FdButton } from "@fd-component-toolbox/button/FdButton";
-import { FdFilter } from "@meta/filtering/filter/FdFilter";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-import { initResourceFilterList } from "@meta/filtering/resource-filter-list/resource-filter-lists";
-import { useAsyncEffect } from "@fd-toolbox/hooks/use-async-effect";
-import { cn } from "@fd-toolbox/lib/utils";
-import { fdFilterListPositions } from "@meta/filtering/filter-list-positions";
-import { FdBackButton } from "@fd-component-toolbox/back-button/FdBackButton";
-import { useFdRouter } from "@meta/client/framework/hooks";
-import { elementSuffixes } from "@fd-toolbox/constants/element-suffixes";
-import { FdTooltip, FdTooltipContent, FdTooltipProvider, FdTooltipTrigger, } from "@fd-component-toolbox/tooltip/FdTooltip";
-import { getManyToManyRelatedPropertyMetas } from "@meta/meta-providers";
-import { filterTypes } from "@meta/filtering/filter/FdFilter.funcs";
-export const resourceFilterListId = "resource-filter-list";
-/**
- * Resource filter list component with collapsible filters, action buttons, and responsive layout.
- *
- * @see {@link FdResourceFilterListProps} for component props
- * @see {@link FdResourceFilterListComponent} for available ref methods
- * @see {@link ResourceFilterListConfig} for configuration options
- */
-export function FdResourceFilterList({ ref, uiResourceMeta, stateKey, onFilterChange, queryODataFilters, onRefreshResources, showRefreshButton, showResetButton, position, showBackButton, relatedUiResourceMetas, type, ...props }) {
-    const router = useFdRouter();
-    const [state, setState] = useState({});
-    const [filterKeys, setFilterKeys] = useState([]);
-    const [filteredAndOtherPropertyMetas, setFilteredAndOtherPropertyMetas] = useState({});
-    const [filteredPropertyMetas, setFilteredPropertyMetas] = useState({});
-    const [isFiltersCollapsible, setIsFiltersCollapsible] = useState(true);
-    const [open, setOpen] = useState(false);
-    const [elementsShown, setElementsShown] = useState(1);
-    const [relationInfo, setRelationInfo] = useState();
-    const [resetCounter, setResetCounter] = useState(0);
-    const containerRef = useRef(null);
-    const btnsWrapperRef = useRef(null);
-    const filtersType = type ?? filterTypes.default;
-    const config = useMemo(() => props.config, [props.config]);
-    const filterActionButtonRef = useRef(null);
-    useImperativeHandle(ref, () => ({
-        getFilters: () => getFilters(state, filteredPropertyMetas, config),
-    }), [config, filteredPropertyMetas, state]);
-    const reset = useCallback(() => {
-        resetResourceFilterListState(stateKey, setState, setResetCounter, onFilterChange);
-    }, [stateKey, setState, onFilterChange]);
-    useAsyncEffect(async () => {
-        setRelationInfo(await getManyToManyRelatedPropertyMetas(uiResourceMeta, relatedUiResourceMetas));
-    }, [uiResourceMeta, relatedUiResourceMetas]);
-    useAsyncEffect(async () => {
-        await initResourceFilterList(stateKey, setState, setFilteredPropertyMetas, setFilteredAndOtherPropertyMetas, queryODataFilters ?? [], setFilterKeys, state, uiResourceMeta.resourceMeta, relationInfo, onFilterChange);
-    }, [stateKey, relationInfo, uiResourceMeta]);
-    const onStateChangeCallback = useCallback((item) => {
-        return (filter) => {
-            onStateChange(item, state, filter, stateKey, setState);
-        };
-    }, [state, stateKey]);
-    const filteredKeys = useMemo(() => getFilteredKeys(filterKeys, uiResourceMeta.properties, filteredAndOtherPropertyMetas, relationInfo), [filterKeys, filteredAndOtherPropertyMetas, uiResourceMeta.properties, relationInfo]);
-    useEffect(() => {
-        return setObserver(setElementsShown, filteredKeys, setIsFiltersCollapsible, elementsShown, containerRef?.current ?? undefined, btnsWrapperRef?.current ?? undefined, position);
-    }, [containerRef, setElementsShown, filteredKeys, setIsFiltersCollapsible, position, elementsShown]);
-    useLayoutEffect(() => {
-        onResize(setElementsShown, filteredKeys, setIsFiltersCollapsible, elementsShown, containerRef?.current ?? undefined, btnsWrapperRef?.current ?? undefined, position);
-    }, [containerRef, filteredKeys, position, elementsShown]);
-    return (<div className={cn("w-full pb-4 pr-4 pt-0", position === fdFilterListPositions.left && "md:pl-6 md:pt-0")}>
-            <Collapsible.Root ref={containerRef} open={open} onOpenChange={setOpen}>
-                <div className="relative flex flex-col items-start gap-2">
-                    <div id={resourceFilterListId} className={cn(type === filterTypes.input
-            ? "mt-10 flex w-full grid-cols-[auto_repeat(6,minmax(0,1fr))] flex-col gap-2 md:mt-0 md:grid md:items-center"
-            : "mt-10 flex w-fit flex-wrap gap-2 md:mt-0 md:items-center", position === fdFilterListPositions.left &&
-            "grid w-full grid-cols-2 md:flex md:w-48 md:flex-col md:pb-2")}>
-                        <div className="absolute top-0 flex items-center gap-2 md:relative">
-                            {showBackButton && (<FdBackButton className="size-7 shrink-0" onClick={() => router.back()}/>)}
-                            {isFiltersCollapsible && (<Collapsible.Trigger asChild>
-                                    <FilterActionButton ref={filterActionButtonRef} iconName={iconNames.filter} variant="ghost" className="size-7 shrink-0" tooltipText="Collapse"/>
-                                </Collapsible.Trigger>)}
-                            {(showRefreshButton ?? true) && (<FdTooltipProvider>
-                                    <FdTooltip>
-                                        <FdTooltipTrigger asChild>
-                                            <FilterActionButton ref={filterActionButtonRef} onClick={onRefreshResources} iconName={iconNames.refresh} variant="ghost" className="size-7 shrink-0"/>
-                                        </FdTooltipTrigger>
-                                        <FdTooltipContent className="mb-1">Refresh</FdTooltipContent>
-                                    </FdTooltip>
-                                </FdTooltipProvider>)}
-                            {(showResetButton ?? true) && (open || elementsShown > 0) && (<FdTooltipProvider>
-                                    <FdTooltip>
-                                        <FdTooltipTrigger asChild>
-                                            <FilterActionButton ref={filterActionButtonRef} onClick={reset} iconName={iconNames.eraser} variant="ghost" className="size-7 shrink-0"/>
-                                        </FdTooltipTrigger>
-                                        <FdTooltipContent className="mb-1">Reset</FdTooltipContent>
-                                    </FdTooltip>
-                                </FdTooltipProvider>)}
-                            {/*{isViewModeChanged && onViewModeChanged && (*/}
-                            {/*    <ResourceListDropdownMenu*/}
-                            {/*        onViewModeChanged={onViewModeChanged}*/}
-                            {/*        viewMode={viewMode}*/}
-                            {/*    />*/}
-                            {/*)}*/}
-                        </div>
-                        {Object.keys(state).length > 0 &&
-            filteredKeys.map((item, num) => (<div ref={btnsWrapperRef} className={cn("w-fit", type === filterTypes.input &&
-                    num >= elementsShown &&
-                    !open &&
-                    isFiltersCollapsible &&
-                    "hidden")} key={item}>
-                                    {filteredAndOtherPropertyMetas[item] && (<FdFilter state={state[item].filter} onStateChange={onStateChangeCallback(item)} propertyMeta={filteredAndOtherPropertyMetas[item]} disabled={state[item].disabled} onChange={onFilterChange} position={position ?? fdFilterListPositions.top} relatedUiResourceMetas={relatedUiResourceMetas} type={filtersType} resetCounter={resetCounter}/>)}
-                                </div>))}
-                    </div>
-                </div>
-            </Collapsible.Root>
-        </div>);
-}
-FdResourceFilterList.displayName = "FdResourceFilterList";
-function FilterActionButton({ ref, onClick, iconName, iconSize, variant, className, tooltipText, }) {
-    return (<FdButton id={iconName + elementSuffixes.filterActionButton} ref={ref} variant={variant ?? "icon"} size="icon" onClick={onClick} className={className ?? ""} tooltipText={tooltipText} tooltipClassName="mb-1" tooltipSide="top">
-            <FdIcon name={iconName} size={iconSize}/>
-        </FdButton>);
-}
-FilterActionButton.displayName = "FilterActionButton";

package/packages/level2/meta/filtering/resource-filter-list/resource-list-dropdown-menu/ResourceListDropdownMenu.funcs.jsx

@@ -1,4 +0,0 @@
-export const textButton = {
-    showCard: "Switch to card view",
-    showTable: "Switch to table view",
-};

package/packages/level2/meta/filtering/resource-filter-list/resource-list-dropdown-menu/ResourceListDropdownMenu.jsx

@@ -1,43 +0,0 @@
-import { FdDropdownMenu, FdDropdownMenuContent, FdDropdownMenuItem, FdDropdownMenuTrigger, } from "@fd-component-toolbox/dropdown-menu/FdDropdownMenu";
-import { FdIcon, iconNames } from "@fd-component-toolbox/icon/FdIcon";
-import { FdButton } from "@fd-component-toolbox/button/FdButton";
-import { resourceListViewModes } from "@fd-toolbox/enums/enums";
-import { textButton } from "@meta/filtering/resource-filter-list/resource-list-dropdown-menu/ResourceListDropdownMenu.funcs";
-/**
- * A dropdown menu component for switching between different resource list view modes.
- *
- * @param props - {@link ResourceListDropdownMenuProps}
- */
-export function ResourceListDropdownMenu({ onViewModeChanged, viewMode }) {
-    return (<FdDropdownMenu>
-            <FdDropdownMenuTrigger asChild>
-                <FdButton variant="ghost" size="icon">
-                    <FdIcon name={iconNames.dotsVerticalIcon}/>
-                </FdButton>
-            </FdDropdownMenuTrigger>
-            <FdDropdownMenuContent className="z-10 min-w-32 rounded-md border bg-background shadow" align="end">
-                {viewMode === undefined && (<>
-                        <FdDropdownMenuItem className="outline-none" asChild>
-                            <FdButton variant="secondary" className="w-full hover:bg-muted/50" onClick={() => onViewModeChanged(resourceListViewModes.table)}>
-                                Switch to table view
-                            </FdButton>
-                        </FdDropdownMenuItem>
-                        <FdDropdownMenuItem className="outline-none" asChild>
-                            <FdButton variant="secondary" className="w-full hover:bg-muted/50" onClick={() => onViewModeChanged(resourceListViewModes.cards)}>
-                                Switch to card view
-                            </FdButton>
-                        </FdDropdownMenuItem>
-                    </>)}
-
-                {viewMode !== undefined && (<FdDropdownMenuItem className="outline-none" asChild>
-                        <FdButton variant="secondary" className="w-full hover:bg-muted/50" onClick={() => onViewModeChanged(viewMode === resourceListViewModes.table
-                ? resourceListViewModes.cards
-                : resourceListViewModes.table)}>
-                            {viewMode === resourceListViewModes.table
-                ? textButton.showCard
-                : textButton.showTable}
-                        </FdButton>
-                    </FdDropdownMenuItem>)}
-            </FdDropdownMenuContent>
-        </FdDropdownMenu>);
-}

package/packages/level2/meta/providers/global-provider/FdGlobalContext.jsx

@@ -1,17 +0,0 @@
-"use client";
-import React, { createContext, useContext, useMemo, useState } from "react";
-import { createError } from "@fd-toolbox/errors/errors";
-import { metaErrorMessages } from "@meta/constants/meta-error-messages-constants";
-const FdGlobalContext = createContext(undefined);
-export function FdGlobalContextProvider({ config, children, }) {
-    const [globalConfig, setGlobalConfig] = useState(config);
-    const contextValue = useMemo(() => ({ globalConfig: globalConfig, setGlobalConfig: setGlobalConfig }), [globalConfig, setGlobalConfig]);
-    return <FdGlobalContext.Provider value={contextValue}>{children}</FdGlobalContext.Provider>;
-}
-export const useGlobalConfig = () => {
-    const context = useContext(FdGlobalContext);
-    if (!context) {
-        throw createError(metaErrorMessages.globalContextUsedOutside);
-    }
-    return context;
-};