@deenruv/admin-dashboard 1.0.16 → 1.0.17-dev.4

package/dist/pages/products/_components/AssetsCard.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { DropdownMenuItem, Label, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuTrigger, apiClient, cn, CustomCard, CardIcons, AssetsModalInput, useTranslation, createDialogFromComponent, } from '@deenruv/react-ui-devkit';
+import { DropdownMenuItem, Label, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuTrigger, apiClient, cn, CustomCard, CardIcons, AssetsModalInput, AssetUploadButton, useTranslation, createDialogFromComponent, } from '@deenruv/react-ui-devkit';
 import { assetsSelector } from "../../../graphql/base";
 import { ImageOff } from 'lucide-react';
 import { useCallback, useEffect, useState } from 'react';
@@ -31,5 +31,18 @@ export const AssetsCard = ({ featuredAssetId, assetsIds, onAddAsset, onFeaturedA
         const newAssets = assetsIds?.filter((aId) => aId !== id);
         onAssetsChange(newAssets || []);
     }, [assetsIds, onAssetsChange]);
-    return (_jsx(CustomCard, { title: t('assets'), color: "green", icon: _jsx(CardIcons.asset, {}), children: _jsx("div", { className: "flex flex-col gap-6", children: _jsxs("div", { className: "flex gap-6", children: [_jsxs("div", { children: [_jsx(Label, { children: t('details.featuredAsset') }), _jsxs("div", { className: "flex flex-col pt-3", children: [_jsx("div", { className: "mb-4 flex h-36 min-w-36 items-center justify-center border border-solid border-gray-300 p-2 shadow", children: featureAsset?.preview ? (_jsx("img", { src: featureAsset.preview, className: "h-32", alt: "Main image preview" })) : (_jsxs("div", { className: "flex size-full flex-col items-center justify-center gap-2 bg-gray-200 p-3", children: [_jsx(ImageOff, { size: 32 }), t('details.noFeaturedAsset')] })) }), _jsx(AssetsModalInput, { setValue: (a) => onAddAsset(a?.id) })] })] }), _jsxs("div", { children: [_jsx(Label, { children: t('details.otherAssets') }), _jsx("div", { className: "flex gap-3 pt-3", children: assets?.length ? (assets.map((asset) => (_jsxs(DropdownMenu, { modal: false, children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("div", { className: cn('flex h-20 min-w-20 cursor-pointer items-center justify-center border border-solid border-gray-300 p-2 shadow', asset.id === featuredAssetId && 'border-2 border-blue-500'), children: asset?.preview && _jsx("img", { src: asset.preview, className: "h-16" }) }) }), _jsx(DropdownMenuContent, { className: "w-56", side: "bottom", align: "end", children: _jsxs(DropdownMenuGroup, { children: [_jsx(DropdownMenuItem, { onClick: () => createDialogFromComponent(EditAssetDialog, asset, { className: 'max-w-4xl' }), children: t('details.editAsset') }), _jsx(DropdownMenuItem, { onClick: () => onFeaturedAssetChange(asset.id), children: t('details.setAsFeatured') }), _jsx(DropdownMenuItem, { onClick: () => handleRemoveAsset(asset.id), children: t('details.removeAsset') })] }) })] }, asset.id)))) : (_jsx("p", { children: t('details.noAssets') })) })] })] }) }) }));
+    const handleAssetAdded = useCallback((id) => {
+        if (!id)
+            return;
+        if (!assetsIds?.includes(id)) {
+            onAddAsset(id);
+        }
+        if (!featuredAssetId) {
+            onFeaturedAssetChange(id);
+        }
+    }, [assetsIds, featuredAssetId, onAddAsset, onFeaturedAssetChange]);
+    return (_jsx(CustomCard, { title: t('assets'), color: "green", icon: _jsx(CardIcons.asset, {}), children: _jsx("div", { className: "flex flex-col gap-6", children: _jsxs("div", { className: "flex gap-6", children: [_jsxs("div", { children: [_jsx(Label, { children: t('details.featuredAsset') }), _jsxs("div", { className: "flex flex-col pt-3", children: [_jsx("div", { className: "mb-4 flex h-36 min-w-36 items-center justify-center border border-solid border-gray-300 p-2 shadow", children: featureAsset?.preview ? (_jsx("img", { src: featureAsset.preview, className: "h-32", alt: "Main image preview" })) : (_jsxs("div", { className: "flex size-full flex-col items-center justify-center gap-2 bg-gray-200 p-3", children: [_jsx(ImageOff, { size: 32 }), t('details.noFeaturedAsset')] })) }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(AssetsModalInput, { setValue: (a) => handleAssetAdded(a?.id) }), _jsx(AssetUploadButton, { buttonProps: { size: 'sm' }, cb: (asset) => {
+                                                    handleAssetAdded(asset.id);
+                                                    return {};
+                                                }, children: t('details.uploadAsset') })] })] })] }), _jsxs("div", { children: [_jsx(Label, { children: t('details.otherAssets') }), _jsx("div", { className: "flex gap-3 pt-3", children: assets?.length ? (assets.map((asset) => (_jsxs(DropdownMenu, { modal: false, children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("div", { className: cn('flex h-20 min-w-20 cursor-pointer items-center justify-center border border-solid border-gray-300 p-2 shadow', asset.id === featuredAssetId && 'border-2 border-blue-500'), children: asset?.preview && _jsx("img", { src: asset.preview, className: "h-16" }) }) }), _jsx(DropdownMenuContent, { className: "w-56", side: "bottom", align: "end", children: _jsxs(DropdownMenuGroup, { children: [_jsx(DropdownMenuItem, { onClick: () => createDialogFromComponent(EditAssetDialog, asset, { className: 'max-w-4xl' }), children: t('details.editAsset') }), _jsx(DropdownMenuItem, { onClick: () => onFeaturedAssetChange(asset.id), children: t('details.setAsFeatured') }), _jsx(DropdownMenuItem, { onClick: () => handleRemoveAsset(asset.id), children: t('details.removeAsset') })] }) })] }, asset.id)))) : (_jsx("p", { children: t('details.noAssets') })) })] })] }) }) }));
 };

package/dist/pages/products/_components/OptionsCard.js

@@ -1,10 +1,12 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from 'react';
-import { Table, TableBody, TableCell, TableRow, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, apiClient, CustomCard, CardIcons, useTranslation, } from '@deenruv/react-ui-devkit';
+import { Table, TableBody, TableCell, TableRow, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, apiClient, CustomCard, CardIcons, useTranslation, useSettings, } from '@deenruv/react-ui-devkit';
 import { OptionGroupSelector } from "../../../graphql/products";
 import { toast } from 'sonner';
+import { AddOptionGroupDialog } from "./AddOptionGroupDialog";
 export const OptionsCard = ({ optionGroups: options, productId, onChange, optionIds, createMode, }) => {
     const { t } = useTranslation('products');
+    const contentLng = useSettings((p) => p.translationsLanguage);
     const [optionGroups, setOptionGroups] = useState();
     const fetchOptionGroups = useCallback(async () => {
         if (productId) {
@@ -23,7 +25,7 @@ export const OptionsCard = ({ optionGroups: options, productId, onChange, option
                 toast.error(t('toasts.fetchProductErrorToast'));
             }
         }
-    }, [productId]);
+    }, [productId, t]);
     useEffect(() => {
         fetchOptionGroups();
     }, [fetchOptionGroups]);
@@ -32,7 +34,7 @@ export const OptionsCard = ({ optionGroups: options, productId, onChange, option
         newState[groupIdx] = optionId;
         onChange(newState);
     }, [optionIds, onChange]);
-    return (_jsx(CustomCard, { title: t('options'), icon: _jsx(CardIcons.options, {}), color: "orange", children: !createMode ? (_jsx(Table, { children: _jsx(TableBody, { children: options?.map((o) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { className: "font-semibold capitalize", children: [o.group.name, ":"] }), _jsx(TableCell, { className: "capitalize", children: o.name })] }, o.name))) }) })) : (optionGroups?.map((group, i) => (_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "w-1/3 font-semibold", children: [group.name, ":"] }), _jsx("div", { className: "w-2/3", children: _jsxs(Select, { value: optionIds?.[i] || '', onValueChange: (e) => {
-                            handleOptionChange(e, i);
-                        }, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: t('addVariantDialog.selectOption') }) }), _jsx(SelectContent, { children: group.options.map((o) => (_jsx(SelectItem, { value: o.id, className: "capitalize", children: o.name }, o.id))) })] }) })] }, group.name)))) }));
+    return (_jsx(CustomCard, { title: t('options'), icon: _jsx(CardIcons.options, {}), color: "orange", upperRight: createMode ? (_jsx(AddOptionGroupDialog, { currentTranslationLng: contentLng, onSuccess: fetchOptionGroups, productId: productId })) : undefined, children: !createMode ? (_jsx(Table, { children: _jsx(TableBody, { children: options?.map((o) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { className: "font-semibold capitalize", children: [o.group.name, ":"] }), _jsx(TableCell, { className: "capitalize", children: o.name })] }, o.name))) }) })) : optionGroups === undefined ? null : optionGroups.length ? (_jsx("div", { className: "flex flex-col gap-3", children: optionGroups.map((group, i) => (_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("div", { className: "w-1/3 font-semibold", children: [group.name, ":"] }), _jsx("div", { className: "w-2/3", children: _jsxs(Select, { value: optionIds?.[i] || '', onValueChange: (e) => {
+                                handleOptionChange(e, i);
+                            }, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: t('addVariantDialog.selectOption') }) }), _jsx(SelectContent, { children: group.options.map((o) => (_jsx(SelectItem, { value: o.id, className: "capitalize", children: o.name }, o.id))) })] }) })] }, group.name))) })) : (_jsx("p", { className: "text-sm text-muted-foreground", children: t('addVariantDialog.createOptionsHint') })) }));
 };

package/dist/pages/products/_components/PriceCard.js

@@ -1,13 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Input, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, apiClient, CustomCard, CardIcons, useTranslation, } from '@deenruv/react-ui-devkit';
-import { useCallback, useEffect, useState } from 'react';
-export const PriceCard = ({ priceValue, onPriceChange, currencyCode, taxRateValue, onTaxRateChange, }) => {
+import { useCallback, useEffect, useMemo, useState } from 'react';
+export const PriceCard = ({ priceValue, onPriceChange, currencyCode, taxRateValue, onTaxRateChange, showDefaultPriceWhenEmpty = false, }) => {
     const { t } = useTranslation('products');
     const [taxCategories, setTaxCategories] = useState([]);
     const [currentTaxCategory, setCurrentTaxCategory] = useState();
+    const defaultPrice = useMemo(() => ({
+        currencyCode,
+        price: 0,
+    }), [currencyCode]);
+    const pricesToRender = useMemo(() => (priceValue?.length ? priceValue : showDefaultPriceWhenEmpty ? [defaultPrice] : []), [defaultPrice, priceValue, showDefaultPriceWhenEmpty]);
     useEffect(() => {
-        fetchTaxRates();
-    }, []);
+        if (showDefaultPriceWhenEmpty && !priceValue?.length) {
+            onPriceChange([defaultPrice]);
+        }
+    }, [defaultPrice, onPriceChange, priceValue?.length, showDefaultPriceWhenEmpty]);
     const fetchTaxRates = useCallback(async () => {
         const response = await apiClient('query')({
             taxCategories: [{}, { items: { id: true, name: true } }],
@@ -19,9 +26,15 @@ export const PriceCard = ({ priceValue, onPriceChange, currencyCode, taxRateValu
         }));
         setTaxCategories(categoriesWithRates);
     }, []);
+    useEffect(() => {
+        fetchTaxRates();
+    }, [fetchTaxRates]);
+    useEffect(() => {
+        setCurrentTaxCategory(taxCategories.find((category) => category.id === taxRateValue));
+    }, [taxCategories, taxRateValue]);
     const handlePriceChange = useCallback((currencyCode, value) => {
-        const newPrices = priceValue?.map((p) => (p.currencyCode === currencyCode ? { ...p, price: value } : p));
-        onPriceChange(newPrices || []);
-    }, [priceValue, onPriceChange]);
-    return (_jsx(CustomCard, { title: t('details.price'), color: "rose", icon: _jsx(CardIcons.calc, {}), children: _jsxs("div", { className: "flex flex-col gap-y-4", children: [priceValue?.map((price) => (_jsx("div", { className: "flex items-center gap-x-2", children: _jsx(Input, { type: "currency", placeholder: t('price'), value: price.price, onChange: (e) => handlePriceChange(price.currencyCode, +e.target.value), step: 0.01, startAdornment: price.currencyCode }) }, price.currencyCode))), _jsxs(Select, { value: taxRateValue, onValueChange: onTaxRateChange, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Tax rate" }) }), _jsx(SelectContent, { children: taxCategories.map((tR) => (_jsx(SelectItem, { value: tR.id.toString(), children: tR.name }, tR.id))) })] }), currentTaxCategory?.value !== undefined && `${t('details.taxRateDescription')} ${currentTaxCategory?.value}%`] }) }));
+        const newPrices = pricesToRender.map((p) => (p.currencyCode === currencyCode ? { ...p, price: value } : p));
+        onPriceChange(newPrices);
+    }, [onPriceChange, pricesToRender]);
+    return (_jsx(CustomCard, { title: t('details.price'), color: "rose", icon: _jsx(CardIcons.calc, {}), children: _jsxs("div", { className: "flex flex-col gap-y-4", children: [pricesToRender.map((price) => (_jsx("div", { className: "flex items-center gap-x-2", children: _jsx(Input, { type: "currency", placeholder: t('price'), value: price.price, onChange: (e) => handlePriceChange(price.currencyCode, +e.target.value), step: 0.01, startAdornment: price.currencyCode }) }, price.currencyCode))), _jsxs(Select, { value: taxRateValue, onValueChange: onTaxRateChange, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Tax rate" }) }), _jsx(SelectContent, { children: taxCategories.map((tR) => (_jsx(SelectItem, { value: tR.id.toString(), children: tR.name }, tR.id))) })] }), currentTaxCategory?.value !== undefined && `${t('details.taxRateDescription')} ${currentTaxCategory?.value}%`] }) }));
 };

package/dist/pages/products/_components/ProductDetailView.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useDetailView, DetailViewMarker, useSettings, setInArrayBy, EntityCustomFields, normalizeString, } from '@deenruv/react-ui-devkit';
+import { useDetailView, DetailViewMarker, useSettings, setInArrayBy, EntityCustomFields, normalizeString, CustomCard, CardIcons, Input, useTranslation, } from '@deenruv/react-ui-devkit';
 import { useCallback, useEffect, useMemo, useRef } from 'react';
 import { BasicFieldsCard } from './BasicFieldsCard';
 import { AssetsCard } from './AssetsCard';
@@ -13,9 +13,10 @@ export const PRODUCT_FORM_KEYS = [
     'customFields',
 ];
 export const ProductDetailView = () => {
+    const { t } = useTranslation('products');
     const contentLng = useSettings((p) => p.translationsLanguage);
     const selectedChannel = useSettings((p) => p.selectedChannel);
-    const { entity, id, form, loading, fetchEntity } = useDetailView('products-detail-view', ...PRODUCT_FORM_KEYS);
+    const { entity, id, form, fetchEntity } = useDetailView('products-detail-view', ...PRODUCT_FORM_KEYS);
     const { base } = form;
     // --- Slug auto-generation ---
     // Track whether the user has manually edited the slug for the current language.
@@ -42,6 +43,7 @@ export const ProductDetailView = () => {
         })();
     }, [selectedChannel?.id, contentLng]);
     const translations = base.watch('translations') || [];
+    const initialVariantPrice = base.watch('initialVariantPrice') ?? 0;
     const currentTranslationValue = useMemo(() => {
         return translations.find((v) => v.languageCode === contentLng);
     }, [translations, contentLng]);
@@ -78,7 +80,9 @@ export const ProductDetailView = () => {
     }, [base, base.setField]);
     return (_jsx("div", { children: _jsxs("div", { className: "flex w-full flex-col gap-4", children: [_jsx(BasicFieldsCard, { currentTranslationValue: currentTranslationValue, onChange: setTranslationField, onSlugManualEdit: handleSlugManualEdit, errors: base.formState.errors?.translations?.message
                         ? [base.formState.errors.translations.message]
-                        : undefined }), _jsx(DetailViewMarker, { position: 'products-detail-view' }), _jsx(EntityCustomFields, { id: id, entityName: "product", hideButton: true, onChange: (customFields, translations) => {
+                        : undefined }), !id && (_jsx(CustomCard, { title: t('initialVariant.title'), icon: _jsx(CardIcons.tag, {}), color: "rose", children: _jsxs("div", { className: "flex flex-col gap-4 pt-4", children: [_jsx("p", { className: "text-sm text-muted-foreground", children: t('initialVariant.description') }), _jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [_jsx(Input, { label: t('initialVariant.sku'), value: base.watch('initialVariantSku') ?? '', onChange: (e) => base.setField('initialVariantSku', e.target.value), errors: base.formState.errors?.initialVariantSku?.message
+                                            ? [base.formState.errors.initialVariantSku.message]
+                                            : undefined, required: true }), _jsx(Input, { type: "currency", label: t('initialVariant.price'), value: initialVariantPrice, onChange: (e) => base.setField('initialVariantPrice', +e.target.value), startAdornment: selectedChannel?.currencyCode, step: 0.01 }), _jsx(Input, { label: t('initialVariant.name'), placeholder: t('initialVariant.namePlaceholder'), value: base.watch('initialVariantName') ?? '', onChange: (e) => base.setField('initialVariantName', e.target.value) })] })] }) })), _jsx(DetailViewMarker, { position: 'products-detail-view' }), _jsx(EntityCustomFields, { id: id, entityName: "product", hideButton: true, onChange: (customFields, translations) => {
                         base.setField('customFields', customFields);
                         if (translations)
                             base.setField('translations', translations);

package/dist/pages/products/_components/Variant.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, CardIcons, ConfirmationDialog, CustomCard, Input, apiClient, setInArrayBy, useDeenruvForm, z, EntityCustomFields, useTranslation, EntityChannelManager, } from '@deenruv/react-ui-devkit';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Button, CardIcons, ConfirmationDialog, CustomCard, Input, apiClient, setInArrayBy, useDeenruvForm, z, EntityCustomFields, useTranslation, useSettings, EntityChannelManager, DEFAULT_CHANNEL_CODE, } from '@deenruv/react-ui-devkit';
 import { CurrencyCode } from '@deenruv/admin-types';
 import { useCallback, useEffect } from 'react';
 import { toast } from 'sonner';
@@ -10,6 +10,7 @@ import { OptionsCard } from "./OptionsCard";
 import { FacetValuesCard } from "./FacetValuesCard";
 export const Variant = ({ variant, currentTranslationLng, onActionCompleted, productId }) => {
     const { t } = useTranslation('products');
+    const selectedChannel = useSettings((p) => p.selectedChannel);
     const variantSchema = z.object({
         translations: z.array(z.any()).default([]),
         price: z.any().optional(),
@@ -50,6 +51,8 @@ export const Variant = ({ variant, currentTranslationLng, onActionCompleted, pro
     const formValues = form.watch();
     const translations = formValues.translations || [];
     const currentTranslationValue = translations.find((v) => v.languageCode === currentTranslationLng);
+    const variantDisplayName = currentTranslationValue?.name || variant?.name || t('addVariantDialog.new');
+    const variantDisplaySku = formValues.sku || variant?.sku;
     useEffect(() => {
         if (!variant)
             return;
@@ -67,18 +70,20 @@ export const Variant = ({ variant, currentTranslationLng, onActionCompleted, pro
         form.setField('trackInventory', variant.trackInventory);
         form.setField('facetValueIds', variant.facetValues.map((f) => f.id));
     }, [variant]);
-    const createVariant = useCallback(() => {
+    const createVariant = useCallback(async () => {
         const values = form.getValues();
-        if (productId && values.sku && values.translations)
-            return apiClient('mutation')({
+        const firstPrice = Array.isArray(values.prices) ? values.prices[0]?.price : undefined;
+        if (!productId || !values.sku || !values.translations)
+            return;
+        try {
+            const response = await apiClient('mutation')({
                 createProductVariants: [
                     {
                         input: [
                             {
                                 productId,
                                 translations: values.translations,
-                                // price: +values.price,
-                                prices: values.prices,
+                                price: firstPrice,
                                 sku: values.sku,
                                 assetIds: values.assetIds,
                                 featuredAssetId: values.featuredAssetId,
@@ -100,15 +105,31 @@ export const Variant = ({ variant, currentTranslationLng, onActionCompleted, pro
                         id: true,
                     },
                 ],
-            })
-                .then(() => {
-                toast(t('toasts.createProductVariantSuccessToast'));
-                onActionCompleted();
-            })
-                .catch(() => {
-                toast(t('toasts.createProductVariantErrorToast'));
             });
-    }, [form, productId, onActionCompleted, t]);
+            const createdVariantId = response.createProductVariants?.[0]?.id;
+            if (createdVariantId &&
+                selectedChannel?.id &&
+                selectedChannel.code &&
+                selectedChannel.code !== DEFAULT_CHANNEL_CODE) {
+                await apiClient('mutation')({
+                    assignProductVariantsToChannel: [
+                        {
+                            input: {
+                                productVariantIds: [createdVariantId],
+                                channelId: selectedChannel.id,
+                            },
+                        },
+                        { id: true },
+                    ],
+                });
+            }
+            toast(t('toasts.createProductVariantSuccessToast'));
+            onActionCompleted();
+        }
+        catch {
+            toast(t('toasts.createProductVariantErrorToast'));
+        }
+    }, [form, productId, selectedChannel?.id, selectedChannel?.code, onActionCompleted, t]);
     const updateVariant = useCallback(() => {
         if (!variant)
             return;
@@ -183,15 +204,15 @@ export const Variant = ({ variant, currentTranslationLng, onActionCompleted, pro
             return;
         form.setField('assetIds', [...newIds, id]);
     };
-    return (_jsxs("div", { className: "mt-4 flex flex-col gap-4", children: [_jsx("div", { className: "flex gap-3 self-end", children: variant ? (_jsxs(_Fragment, { children: [_jsx(ConfirmationDialog, { onConfirm: deleteVariant, children: _jsx(Button, { variant: 'destructive', children: t('forms.removeVariant') }) }), _jsx(Button, { onClick: updateVariant, children: t('forms.updateVariant') })] })) : (_jsx(Button, { onClick: createVariant, children: t('addVariantDialog.add') })) }), _jsxs("div", { className: "flex gap-4", children: [_jsxs("div", { className: "flex w-2/3 flex-col gap-4", children: [!!variant && (_jsx(StockCard, { priceValue: formValues.price, taxRateValue: formValues.taxCategoryId, outOfStockThresholdValue: formValues.outOfStockThreshold, stockLevelsValue: formValues.stockLevels, stockOnHandValue: formValues.stockOnHand, useGlobalOutOfStockThresholdValue: formValues.useGlobalOutOfStockThreshold, onThresholdChange: (e) => form.setField('outOfStockThreshold', +e.target.value), onUseGlobalChange: (e) => form.setField('useGlobalOutOfStockThreshold', e), onTrackInventoryChange: (e) => form.setField('trackInventory', e), onStockOnHandChange: (e) => form.setField('stockOnHand', +e.target.value), onStockLocationsChange: (e) => form.setField('stockLevels', e), allStockLocations: variant?.stockLevels, stockAllocated: variant?.stockAllocated, trackInventoryValue: formValues.trackInventory })), _jsx(PriceCard, { currencyCode: variant?.currencyCode || CurrencyCode.PLN, priceValue: formValues.prices, onPriceChange: (e) => form.setField('prices', e), taxRateValue: formValues.taxCategoryId ?? undefined, onTaxRateChange: (id) => form.setField('taxCategoryId', id) }), _jsx(AssetsCard, { onAddAsset: handleAddAsset, featuredAssetId: formValues.featuredAssetId, assetsIds: formValues.assetIds, onFeaturedAssetChange: (id) => form.setField('featuredAssetId', id), onAssetsChange: (ids) => form.setField('assetIds', ids) }), _jsx(EntityCustomFields, { entityName: "productVariant", id: variant?.id, hideButton: true, onChange: (customFields, translations) => {
+    return (_jsxs("div", { className: "mt-4 flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-2 rounded-lg border bg-muted/30 p-4 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "text-xs font-medium tracking-wide text-muted-foreground uppercase", children: t('variants') }), _jsx("h3", { className: "truncate text-lg font-semibold", children: variantDisplayName })] }), _jsxs("div", { className: "text-sm text-muted-foreground sm:text-right", children: [_jsxs("span", { className: "font-medium text-foreground", children: [t('sku'), ":"] }), " ", variantDisplaySku || '—'] })] }), _jsx("div", { className: "flex gap-3 self-end", children: variant ? (_jsxs(_Fragment, { children: [_jsx(ConfirmationDialog, { onConfirm: deleteVariant, children: _jsx(Button, { variant: 'destructive', children: t('forms.removeVariant') }) }), _jsx(Button, { onClick: updateVariant, children: t('forms.updateVariant') })] })) : (_jsx(Button, { onClick: createVariant, children: t('addVariantDialog.add') })) }), _jsxs("div", { className: "flex gap-4", children: [_jsxs("div", { className: "flex w-2/3 flex-col gap-4", children: [!!variant && (_jsx(StockCard, { priceValue: formValues.price, taxRateValue: formValues.taxCategoryId, outOfStockThresholdValue: formValues.outOfStockThreshold, stockLevelsValue: formValues.stockLevels, stockOnHandValue: formValues.stockOnHand, useGlobalOutOfStockThresholdValue: formValues.useGlobalOutOfStockThreshold, onThresholdChange: (e) => form.setField('outOfStockThreshold', +e.target.value), onUseGlobalChange: (e) => form.setField('useGlobalOutOfStockThreshold', e), onTrackInventoryChange: (e) => form.setField('trackInventory', e), onStockOnHandChange: (e) => form.setField('stockOnHand', +e.target.value), onStockLocationsChange: (e) => form.setField('stockLevels', e), allStockLocations: variant?.stockLevels, stockAllocated: variant?.stockAllocated, trackInventoryValue: formValues.trackInventory })), _jsx(PriceCard, { currencyCode: variant?.currencyCode || CurrencyCode.PLN, priceValue: formValues.prices, onPriceChange: (e) => form.setField('prices', e), taxRateValue: formValues.taxCategoryId ?? undefined, onTaxRateChange: (id) => form.setField('taxCategoryId', id), showDefaultPriceWhenEmpty: !variant }), _jsx(AssetsCard, { onAddAsset: handleAddAsset, featuredAssetId: formValues.featuredAssetId, assetsIds: formValues.assetIds, onFeaturedAssetChange: (id) => form.setField('featuredAssetId', id), onAssetsChange: (ids) => form.setField('assetIds', ids) }), _jsx(EntityCustomFields, { entityName: "productVariant", id: variant?.id, hideButton: true, onChange: (customFields, translations) => {
                                     form.setField('customFields', customFields);
                                     if (translations)
                                         form.setField('translations', translations);
                                 }, initialValues: variant && 'customFields' in variant
                                     ? { customFields: variant.customFields, translations: variant.translations }
-                                    : { customFields: {} } })] }), _jsxs("div", { className: "flex w-1/3 flex-col gap-4", children: [_jsx(CustomCard, { title: t('name'), icon: _jsx(CardIcons.basic, {}), color: "purple", children: _jsxs("div", { className: "flex flex-col gap-y-4", children: [_jsx(Input, { label: t('sku'), placeholder: t('sku'), value: formValues.sku ?? undefined, onChange: (e) => form.setField('sku', e.target.value) }), _jsx(Input, { label: t('name'), placeholder: t('name'), value: currentTranslationValue?.name ?? undefined, onChange: (e) => setTranslationField('name', e) })] }) }), _jsx(EntityChannelManager, { entity: "productVariant", entityId: variant?.id, entityChannels: variant?.channels ?? [], onRemoveSuccess: onActionCompleted, entityName: variant?.name, entityVariantList: {
+                                    : { customFields: {} } })] }), _jsxs("div", { className: "flex w-1/3 flex-col gap-4", children: [_jsx(CustomCard, { title: t('name'), icon: _jsx(CardIcons.basic, {}), color: "purple", children: _jsxs("div", { className: "flex flex-col gap-y-4", children: [_jsx(Input, { label: t('sku'), placeholder: t('sku'), value: formValues.sku ?? undefined, onChange: (e) => form.setField('sku', e.target.value) }), _jsx(Input, { label: t('name'), placeholder: t('name'), value: currentTranslationValue?.name ?? undefined, onChange: (e) => setTranslationField('name', e) })] }) }), variant && (_jsx(EntityChannelManager, { entity: "productVariant", entityId: variant.id, entityChannels: variant.channels ?? [], onRemoveSuccess: onActionCompleted, entityName: variant.name, entityVariantList: {
                                     items: [
-                                        { price: variant?.price, priceWithTax: variant?.priceWithTax, currencyCode: variant?.currencyCode },
+                                        { price: variant.price, priceWithTax: variant.priceWithTax, currencyCode: variant.currencyCode },
                                     ],
-                                } }), _jsx(OptionsCard, { optionGroups: variant?.options || [], productId: productId, optionIds: formValues.optionIds ?? undefined, onChange: (e) => form.setField('optionIds', e), createMode: !variant }), !!variant && (_jsx(FacetValuesCard, { facetValuesIds: formValues.facetValueIds ?? undefined, onChange: (e) => form.setField('facetValueIds', e) }))] })] })] }));
+                                } })), _jsx(OptionsCard, { optionGroups: variant?.options || [], productId: productId, optionIds: formValues.optionIds ?? undefined, onChange: (e) => form.setField('optionIds', e), createMode: !variant }), !!variant && (_jsx(FacetValuesCard, { facetValuesIds: formValues.facetValueIds ?? undefined, onChange: (e) => form.setField('facetValueIds', e) }))] })] })] }));
 };

package/dist/pages/products/_components/VariantsTab.js

@@ -42,5 +42,5 @@ export const VariantsTab = () => {
     useEffect(() => {
         fetchData();
     }, [fetchData]);
-    return (_jsxs("div", { className: "flex flex-col", children: [getMarker(), _jsx("div", { className: "flex flex-col items-end gap-4", children: _jsxs(Tabs, { defaultValue: variants?.[0]?.id, className: "w-full", value: activeTab, onValueChange: handleTabChange, children: [_jsxs(TabsList, { className: "h-auto flex-wrap justify-start", children: [_jsxs(TabsTrigger, { value: NEW_VARIANT_TAB_VALUE, className: "text-blue-600", children: [_jsx(PlusCircle, { size: 16, className: "mr-2 translate-y-px" }), t('addVariantDialog.new')] }, 'new-variant'), variants?.map((v) => (_jsx(TabsTrigger, { value: v.id, children: v.name }, v.id + '-trigger')))] }), _jsx(TabsContent, { value: NEW_VARIANT_TAB_VALUE, children: id && _jsx(Variant, { currentTranslationLng: contentLanguage, onActionCompleted: fetchData, productId: id }) }, 'new-variant-content'), id && variants?.length ? (variants?.map((v) => (_jsx(TabsContent, { value: v.id, children: _jsx(Variant, { currentTranslationLng: contentLanguage, variant: v, onActionCompleted: fetchData, productId: id }) }, v.id + '-content')))) : (_jsx("div", { className: "flex w-full items-center justify-center", children: activeTab !== NEW_VARIANT_TAB_VALUE && (_jsx(EmptyState, { columnsLength: 1, title: t('variantsTab.emptyState.title'), description: t('variantsTab.emptyState.description') })) }))] }) })] }));
+    return (_jsxs("div", { className: "flex flex-col", children: [getMarker(), _jsx("div", { className: "flex flex-col items-end gap-4", children: _jsxs(Tabs, { defaultValue: variants?.[0]?.id, className: "w-full", value: activeTab, onValueChange: handleTabChange, children: [_jsxs(TabsList, { className: "h-auto flex-wrap justify-start", children: [_jsxs(TabsTrigger, { value: NEW_VARIANT_TAB_VALUE, className: "text-blue-600", children: [_jsx(PlusCircle, { size: 16, className: "mr-2 translate-y-px" }), t('addVariantDialog.new')] }, 'new-variant'), variants?.map((v) => (_jsx(TabsTrigger, { value: v.id, className: "max-w-xs", children: _jsxs("span", { className: "flex min-w-0 flex-col items-start text-left leading-tight", children: [_jsx("span", { className: "max-w-full truncate", children: v.name?.trim() || t('variantsTab.unnamedVariant') }), v.sku && (_jsx("span", { className: "max-w-full truncate text-xs font-normal text-muted-foreground", children: v.sku }))] }) }, v.id + '-trigger')))] }), _jsx(TabsContent, { value: NEW_VARIANT_TAB_VALUE, children: id && _jsx(Variant, { currentTranslationLng: contentLanguage, onActionCompleted: fetchData, productId: id }) }, 'new-variant-content'), id && variants?.length ? (variants?.map((v) => (_jsx(TabsContent, { value: v.id, children: _jsx(Variant, { currentTranslationLng: contentLanguage, variant: v, onActionCompleted: fetchData, productId: id }) }, v.id + '-content')))) : (_jsx("div", { className: "flex w-full items-center justify-center", children: activeTab !== NEW_VARIANT_TAB_VALUE && (_jsx(EmptyState, { columnsLength: 1, title: t('variantsTab.emptyState.title'), description: t('variantsTab.emptyState.description') })) }))] }) })] }));
 };

package/dist/pages/promotions/Detail.js

@@ -1,9 +1,38 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useParams } from 'react-router';
-import { useTranslation, useValidators, createDeenruvForm, DetailView, useMutation } from '@deenruv/react-ui-devkit';
+import { useTranslation, useValidators, createDeenruvForm, DetailView, useMutation, useSettings, } from '@deenruv/react-ui-devkit';
 import { $, Permission, scalars, typedGql } from '@deenruv/admin-types';
 import { PromotionDetailView } from "./_components/PromotionDetailView";
 import { PromotionDetailSidebar } from "./_components/PromotionDetailSidebar";
+const DEFAULT_PROMOTION_LANGUAGE_CODE = 'en';
+const ensureDefaultPromotionTranslation = (translations, defaultLanguageCode) => {
+    const sourceTranslation = translations.find((translation) => !!translation.name?.trim()) ?? translations[0];
+    if (!sourceTranslation?.name?.trim())
+        return translations;
+    let hasDefaultLanguage = false;
+    const normalizedTranslations = translations.map((translation) => {
+        if (translation.languageCode !== defaultLanguageCode)
+            return translation;
+        hasDefaultLanguage = true;
+        if (translation.name?.trim())
+            return translation;
+        return {
+            ...translation,
+            name: sourceTranslation.name,
+            description: translation.description ?? sourceTranslation.description ?? '',
+        };
+    });
+    if (hasDefaultLanguage)
+        return normalizedTranslations;
+    return [
+        ...normalizedTranslations,
+        {
+            languageCode: defaultLanguageCode,
+            name: sourceTranslation.name,
+            description: sourceTranslation.description ?? '',
+        },
+    ];
+};
 const EditPromotionMutation = typedGql('mutation', { scalars })({
     updatePromotion: [{ input: $('input', 'UpdatePromotionInput!') }, { '...on Promotion': { id: true } }],
 });
@@ -20,6 +49,7 @@ export const PromotionsDetailPage = () => {
     const [create] = useMutation(CreatePromotionMutation);
     const [remove] = useMutation(DeletePromotionMutation);
     const { translationsValidator, configurableOperationArrayValidator } = useValidators();
+    const defaultLanguageCode = useSettings((state) => state.selectedChannel?.defaultLanguageCode ?? DEFAULT_PROMOTION_LANGUAGE_CODE);
     return (_jsx("div", { className: "relative flex flex-col gap-y-4", children: _jsx(DetailView, { id: id, locationId: "promotions-detail-view", main: {
                 name: 'promotion',
                 label: 'Promotion',
@@ -50,9 +80,10 @@ export const PromotionsDetailPage = () => {
                             throw new Error('Fill required fields.');
                         const conditions = data.conditions;
                         const actions = data.actions;
+                        const translations = data.translations;
                         const input = {
-                            translations: data.translations,
-                            enabled: data.enabled || false,
+                            translations: id ? translations : ensureDefaultPromotionTranslation(translations, defaultLanguageCode),
+                            enabled: typeof data.enabled === 'boolean' ? data.enabled : true,
                             actions,
                             conditions: conditions?.map((el) => ({
                                 ...el,

package/dist/pages/promotions/_components/EnabledCard.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslation, Label, Switch, CustomCard, CardIcons } from '@deenruv/react-ui-devkit';
 export const EnabledCard = ({ onEnabledChange, enabledValue }) => {
-    const { t } = useTranslation('products');
-    return (_jsx(CustomCard, { title: t('details.basicInfo'), icon: _jsx(CardIcons.default, {}), color: "teal", children: _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Switch, { id: "product-enabled", checked: enabledValue, onCheckedChange: onEnabledChange }), _jsx(Label, { htmlFor: "product-enabled", children: t('enabled') })] }) }));
+    const { t } = useTranslation('promotions');
+    return (_jsx(CustomCard, { title: t('enabled.header'), icon: _jsx(CardIcons.default, {}), color: "teal", children: _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx(Switch, { id: "promotion-enabled", checked: enabledValue ?? false, onCheckedChange: onEnabledChange }), _jsx(Label, { htmlFor: "promotion-enabled", children: t('enabled.label') })] }) }));
 };

package/dist/pages/promotions/_components/PromotionDetailSidebar.js

@@ -6,6 +6,7 @@ import { useEffect } from 'react';
 export const PromotionDetailSidebar = () => {
     const { id, form } = useDetailView('promotions-detail-view', 'CreatePromotionInput', 'enabled');
     const { base } = form;
+    const enabledValue = base.watch('enabled');
     // Always call useQuery unconditionally to preserve hook order.
     // Pass a placeholder id when none exists; the result will simply be ignored.
     const { data } = useQuery(PromotionQuery, { initialVariables: { id: id ?? '' } });
@@ -14,5 +15,5 @@ export const PromotionDetailSidebar = () => {
             base.setField('enabled', data.promotion.enabled);
         }
     }, [data, id]);
-    return (_jsx("div", { className: "flex w-full flex-col gap-4", children: _jsx(EnabledCard, { enabledValue: base.watch('enabled'), onEnabledChange: (e) => base.setField('enabled', e) }) }));
+    return (_jsx("div", { className: "flex w-full flex-col gap-4", children: _jsx(EnabledCard, { enabledValue: id ? enabledValue : (enabledValue ?? true), onEnabledChange: (e) => base.setField('enabled', e) }) }));
 };

package/dist/pages/roles/_components/PermissionsTable.js

@@ -2,7 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from 'react';
 import { useTranslation, cn, Table, TableBody, TableCell, TableRow, useServer } from '@deenruv/react-ui-devkit';
 import { CircleCheckBig } from 'lucide-react';
-import permissionsJson from "../../../locales/en/permissions.json";
 export const PermissionsTable = ({ currentPermissions, onPermissionsChange }) => {
     const { t } = useTranslation('permissions');
     const [groupedPermissions, setGroupedPermissions] = useState();

package/dist/pages/shipping-methods/Detail.js

@@ -3,6 +3,10 @@ import { useCallback } from 'react';
 import { useParams } from 'react-router';
 import { useTranslation, DetailView, createDeenruvForm, getMutation, useMutation } from '@deenruv/react-ui-devkit';
 import { ShippingMethodDetailView } from "./_components/ShippingMethodDetailView.js";
+const isMissingConfigArgValue = (value) => value == null || value.trim() === '';
+const hasMissingConfigArgs = (operation) => {
+    return !!operation?.arguments?.some((argument) => isMissingConfigArgValue(argument.value));
+};
 const CreateShippingMethodMutation = getMutation('createShippingMethod');
 const EditShippingMethodMutation = getMutation('updateShippingMethod');
 const DeleteShippingMethodMutation = getMutation('deleteShippingMethod');
@@ -63,11 +67,11 @@ export const ShippingMethodsDetailPage = () => {
                         checker: {
                             validate: (v) => {
                                 const hasCode = !!v?.code;
-                                const hasArguments = v?.arguments.filter((a) => a.value).length;
+                                const hasInvalidArguments = hasMissingConfigArgs(v);
                                 const errors = [];
                                 if (!hasCode)
                                     errors.push(t('validation.checkerCodeRequired'));
-                                if (!hasArguments)
+                                if (hasInvalidArguments)
                                     errors.push(t('validation.checkerArgsRequired'));
                                 return errors;
                             },
@@ -75,12 +79,12 @@ export const ShippingMethodsDetailPage = () => {
                         calculator: {
                             validate: (v) => {
                                 const hasCode = !!v?.code;
-                                const hasInvalidArguments = v?.arguments.filter((a) => !a.value || a.value === 'false').length; // args have 'false' value by default
+                                const hasInvalidArguments = hasMissingConfigArgs(v);
                                 const errors = [];
                                 if (!hasCode)
-                                    errors.push(t('validation.checkerCodeRequired'));
+                                    errors.push(t('validation.calculatorCodeRequired'));
                                 if (hasInvalidArguments)
-                                    errors.push(t('validation.checkerArgsRequired'));
+                                    errors.push(t('validation.calculatorArgsRequired'));
                                 return errors;
                             },
                         },

package/dist/pages/shipping-methods/_components/CalculatorCard.js

@@ -1,7 +1,28 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from 'react';
-import { Button, Label, apiClient, ErrorMessage, generateInputComponents, usePluginStore, CustomFieldsProvider, CardIcons, CustomCard, SimpleSelect, useTranslation, PaymentMethodHandlerSelector, } from '@deenruv/react-ui-devkit';
+import { Button, apiClient, ErrorMessage, generateInputComponents, usePluginStore, InputFieldComponent, CardIcons, CustomCard, SimpleSelect, useTranslation, PaymentMethodHandlerSelector, } from '@deenruv/react-ui-devkit';
 import { X } from 'lucide-react';
+const decodeConfigArgValue = (value) => {
+    try {
+        const result = JSON.parse(value);
+        if (result && typeof result === 'object' && !Array.isArray(result)) {
+            return JSON.stringify(result);
+        }
+        return result;
+    }
+    catch {
+        return value;
+    }
+};
+const encodeConfigArgValue = (value) => {
+    return Array.isArray(value) ? JSON.stringify(value) : (value ?? '').toString();
+};
+const createInitialArguments = (args) => {
+    return args.map((arg) => ({
+        name: arg.name,
+        value: encodeConfigArgValue(arg.defaultValue),
+    }));
+};
 export const CalculatorCard = ({ currentCalculatorValue, onCalculatorValueChange, errors, }) => {
     const { t } = useTranslation('shippingMethods');
     const [calculators, setCalculators] = useState([]);
@@ -22,21 +43,16 @@ export const CalculatorCard = ({ currentCalculatorValue, onCalculatorValueChange
     }, [fetchOptions]);
     const handleCalculatorValueChange = useCallback((code, args) => {
         const correspondingCalculator = calculators.find((h) => h.code === code);
-        console.log('args', args);
         if (correspondingCalculator)
             onCalculatorValueChange({
                 code: correspondingCalculator.code,
-                arguments: args ||
-                    correspondingCalculator.args.map((a) => ({
-                        name: a.name,
-                        value: 'false',
-                    })),
+                arguments: args ?? createInitialArguments(correspondingCalculator.args),
             });
     }, [calculators, onCalculatorValueChange]);
     const clearInput = useCallback(() => {
         onCalculatorValueChange(undefined);
     }, [onCalculatorValueChange]);
-    return (_jsx(CustomCard, { title: t('details.calculator.title'), icon: _jsx(CardIcons.calc, {}), color: "indigo", children: _jsxs("div", { className: "flex basis-full flex-col gap-3 md:basis-1/2", children: [_jsxs("div", { className: "flex items-end gap-1", children: [_jsx(SimpleSelect, { label: t('details.calculator.type'), value: currentCalculatorValue ? currentCalculatorValue.code : '', onValueChange: handleCalculatorValueChange, options: allCalculatorsOptions }), currentCalculatorValue?.code && (_jsx(Button, { variant: 'secondary', className: "p-2", onClick: clearInput, children: _jsx(X, { size: 20 }) }))] }), _jsx("div", { className: "flex gap-3", children: currentCalculatorValue?.arguments.map((e, i) => {
+    return (_jsx(CustomCard, { title: t('details.calculator.title'), icon: _jsx(CardIcons.calc, {}), color: "indigo", children: _jsxs("div", { className: "flex basis-full flex-col gap-3 md:basis-1/2", children: [_jsxs("div", { className: "flex items-end gap-1", children: [_jsx(SimpleSelect, { label: t('details.calculator.type'), value: currentCalculatorValue ? currentCalculatorValue.code : '', onValueChange: handleCalculatorValueChange, options: allCalculatorsOptions }), currentCalculatorValue?.code && (_jsx(Button, { variant: 'secondary', className: "p-2", onClick: clearInput, children: _jsx(X, { size: 20 }) }))] }), _jsx("div", { className: "flex gap-3", children: currentCalculatorValue?.arguments.map((e) => {
                         const calculator = calculators?.find((ch) => ch.code === currentCalculatorValue.code);
                         const argument = calculator?.args.find((a) => a.name === e.name);
                         if (!argument)
@@ -48,7 +64,7 @@ export const CalculatorCard = ({ currentCalculatorValue, onCalculatorValueChange
                                 description: [{ languageCode: 'en', value: argument.description || '' }],
                             },
                         ], getInputComponent).map((field) => {
-                            const value = e.value;
+                            const value = decodeConfigArgValue(e.value);
                             const setValue = (data) => {
                                 try {
                                     onCalculatorValueChange({
@@ -58,7 +74,7 @@ export const CalculatorCard = ({ currentCalculatorValue, onCalculatorValueChange
                                                 if (a.name === field.name) {
                                                     return {
                                                         name: a.name,
-                                                        value: JSON.stringify(data),
+                                                        value: encodeConfigArgValue(data),
                                                     };
                                                 }
                                             }
@@ -73,7 +89,7 @@ export const CalculatorCard = ({ currentCalculatorValue, onCalculatorValueChange
                                     console.error('Error setting value');
                                 }
                             };
-                            return (_jsx(CustomFieldsProvider, { field: field, value: value, setValue: setValue, additionalData: {}, children: _jsxs("div", { children: [_jsx("div", { children: _jsx(Label, { children: field.name }) }), field.component] }, field.name) }, field.name));
+                            return (_jsx(InputFieldComponent, { field: field, value: value, setValue: setValue, additionalData: {} }, field.name));
                         });
                     }) }), _jsx(ErrorMessage, { errors: errors })] }) }));
 };

package/dist/pages/shipping-methods/_components/CheckerCard.js

@@ -1,7 +1,28 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState } from 'react';
-import { Button, Label, apiClient, ErrorMessage, generateInputComponents, usePluginStore, CustomFieldsProvider, CustomCard, CardIcons, SimpleSelect, useTranslation, PaymentMethodHandlerSelector, } from '@deenruv/react-ui-devkit';
+import { Button, apiClient, ErrorMessage, generateInputComponents, usePluginStore, InputFieldComponent, CustomCard, CardIcons, SimpleSelect, useTranslation, PaymentMethodHandlerSelector, } from '@deenruv/react-ui-devkit';
 import { X } from 'lucide-react';
+const decodeConfigArgValue = (value) => {
+    try {
+        const result = JSON.parse(value);
+        if (result && typeof result === 'object' && !Array.isArray(result)) {
+            return JSON.stringify(result);
+        }
+        return result;
+    }
+    catch {
+        return value;
+    }
+};
+const encodeConfigArgValue = (value) => {
+    return Array.isArray(value) ? JSON.stringify(value) : (value ?? '').toString();
+};
+const createInitialArguments = (args) => {
+    return args.map((arg) => ({
+        name: arg.name,
+        value: encodeConfigArgValue(arg.defaultValue),
+    }));
+};
 export const CheckerCard = ({ currentCheckerValue, onCheckerValueChange, errors }) => {
     const { t } = useTranslation('shippingMethods');
     const [checkers, setCheckers] = useState([]);
@@ -25,20 +46,15 @@ export const CheckerCard = ({ currentCheckerValue, onCheckerValueChange, errors
         if (correspondingChecker)
             onCheckerValueChange({
                 code: correspondingChecker.code,
-                arguments: args ||
-                    correspondingChecker.args.map((a) => ({
-                        name: a.name,
-                        value: 'false',
-                    })),
+                arguments: args ?? createInitialArguments(correspondingChecker.args),
             });
     }, [checkers, onCheckerValueChange]);
     const clearInput = useCallback(() => {
-        console.log('CLICK');
         onCheckerValueChange(undefined);
     }, [onCheckerValueChange]);
-    return (_jsx(CustomCard, { title: t('details.options.title'), icon: _jsx(CardIcons.check, {}), color: "teal", upperRight: _jsx(ErrorMessage, { errors: errors }), children: _jsxs("div", { className: "flex basis-full flex-col gap-3 md:basis-1/2", children: [_jsxs("div", { className: "flex items-end gap-1", children: [_jsx(SimpleSelect, { label: t('details.options.checker'), value: currentCheckerValue ? currentCheckerValue.code : '', onValueChange: handleCheckerValueChange, options: allCheckersOptions }), currentCheckerValue?.code && (_jsx(Button, { variant: 'secondary', className: "p-2", onClick: clearInput, children: _jsx(X, { size: 20 }) }))] }), _jsx("div", { className: "flex", children: currentCheckerValue?.arguments.map((e, i) => {
+    return (_jsx(CustomCard, { title: t('details.options.title'), icon: _jsx(CardIcons.check, {}), color: "teal", upperRight: _jsx(ErrorMessage, { errors: errors }), children: _jsxs("div", { className: "flex basis-full flex-col gap-3 md:basis-1/2", children: [_jsxs("div", { className: "flex items-end gap-1", children: [_jsx(SimpleSelect, { label: t('details.options.checker'), value: currentCheckerValue ? currentCheckerValue.code : '', onValueChange: handleCheckerValueChange, options: allCheckersOptions }), currentCheckerValue?.code && (_jsx(Button, { variant: 'secondary', className: "p-2", onClick: clearInput, children: _jsx(X, { size: 20 }) }))] }), _jsx("div", { className: "flex", children: currentCheckerValue?.arguments.map((e) => {
                         const checker = checkers?.find((ch) => ch.code === currentCheckerValue.code);
-                        const argument = checker?.args.find((a) => a.name === a.name);
+                        const argument = checker?.args.find((a) => a.name === e.name);
                         if (!argument)
                             return null;
                         return generateInputComponents([
@@ -48,7 +64,7 @@ export const CheckerCard = ({ currentCheckerValue, onCheckerValueChange, errors
                                 description: [{ languageCode: 'en', value: argument.description || '' }],
                             },
                         ], getInputComponent).map((field) => {
-                            const value = e.value;
+                            const value = decodeConfigArgValue(e.value);
                             const setValue = (data) => {
                                 try {
                                     onCheckerValueChange({
@@ -56,7 +72,7 @@ export const CheckerCard = ({ currentCheckerValue, onCheckerValueChange, errors
                                         arguments: currentCheckerValue.arguments.map((a) => {
                                             try {
                                                 if (a.name === field.name) {
-                                                    return { name: field.name, value: JSON.stringify(data) };
+                                                    return { name: field.name, value: encodeConfigArgValue(data) };
                                                 }
                                             }
                                             catch {
@@ -70,7 +86,7 @@ export const CheckerCard = ({ currentCheckerValue, onCheckerValueChange, errors
                                     console.error('Error setting value');
                                 }
                             };
-                            return (_jsx(CustomFieldsProvider, { field: field, value: value, setValue: setValue, additionalData: {}, children: _jsxs("div", { children: [_jsx("div", { children: _jsx(Label, { children: field.name }) }), field.component] }, field.name) }, field.name));
+                            return (_jsx(InputFieldComponent, { field: field, value: value, setValue: setValue, additionalData: {} }, field.name));
                         });
                     }) })] }) }));
 };

package/dist/version.js

@@ -1 +1 @@
-export const ADMIN_DASHBOARD_VERSION = '1.0.16';
+export const ADMIN_DASHBOARD_VERSION = '1.0.17-dev.4';