@freightos/freightwind 1.0.0 → 1.1.1

package/dist/esm/components/country-select.js

@@ -1,118 +0,0 @@
-'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '../lib/utils';
-import { getCountryFlag } from '../lib/countryUtils';
-import { IconCaretDown, IconCheck } from '@freightos/icons';
-import * as React from 'react';
-// Common countries list - can be extended or replaced via props
-export const COUNTRIES = [
-    { code: 'US', name: 'United States' },
-    { code: 'CN', name: 'China' },
-    { code: 'GB', name: 'United Kingdom' },
-    { code: 'CA', name: 'Canada' },
-    { code: 'DE', name: 'Germany' },
-    { code: 'FR', name: 'France' },
-    { code: 'IT', name: 'Italy' },
-    { code: 'ES', name: 'Spain' },
-    { code: 'NL', name: 'Netherlands' },
-    { code: 'BE', name: 'Belgium' },
-    { code: 'CH', name: 'Switzerland' },
-    { code: 'AT', name: 'Austria' },
-    { code: 'SE', name: 'Sweden' },
-    { code: 'NO', name: 'Norway' },
-    { code: 'DK', name: 'Denmark' },
-    { code: 'FI', name: 'Finland' },
-    { code: 'PL', name: 'Poland' },
-    { code: 'CZ', name: 'Czech Republic' },
-    { code: 'IE', name: 'Ireland' },
-    { code: 'PT', name: 'Portugal' },
-    { code: 'GR', name: 'Greece' },
-    { code: 'JP', name: 'Japan' },
-    { code: 'KR', name: 'South Korea' },
-    { code: 'IN', name: 'India' },
-    { code: 'AU', name: 'Australia' },
-    { code: 'NZ', name: 'New Zealand' },
-    { code: 'SG', name: 'Singapore' },
-    { code: 'HK', name: 'Hong Kong' },
-    { code: 'TW', name: 'Taiwan' },
-    { code: 'TH', name: 'Thailand' },
-    { code: 'MY', name: 'Malaysia' },
-    { code: 'ID', name: 'Indonesia' },
-    { code: 'PH', name: 'Philippines' },
-    { code: 'VN', name: 'Vietnam' },
-    { code: 'BR', name: 'Brazil' },
-    { code: 'MX', name: 'Mexico' },
-    { code: 'AR', name: 'Argentina' },
-    { code: 'CL', name: 'Chile' },
-    { code: 'CO', name: 'Colombia' },
-    { code: 'PE', name: 'Peru' },
-    { code: 'ZA', name: 'South Africa' },
-    { code: 'EG', name: 'Egypt' },
-    { code: 'IL', name: 'Israel' },
-    { code: 'AE', name: 'United Arab Emirates' },
-    { code: 'SA', name: 'Saudi Arabia' },
-    { code: 'TR', name: 'Turkey' },
-    { code: 'RU', name: 'Russia' },
-    { code: 'UA', name: 'Ukraine' },
-];
-export const CountrySelect = ({ value, onChange, placeholder = 'Select country', mostUsedCountries = ['US', 'CN'], countries = COUNTRIES, className, disabled = false, }) => {
-    const [open, setOpen] = React.useState(false);
-    const [search, setSearch] = React.useState('');
-    const containerRef = React.useRef(null);
-    const inputRef = React.useRef(null);
-    // Get selected country
-    const selectedCountry = countries.find((c) => c.code === value);
-    // Filter countries based on search
-    const filteredCountries = React.useMemo(() => {
-        const searchLower = search.toLowerCase();
-        const filtered = countries.filter((country) => country.name.toLowerCase().includes(searchLower) ||
-            country.code.toLowerCase().includes(searchLower));
-        // Sort: most used first, then alphabetically
-        return filtered.sort((a, b) => {
-            const aIsMostUsed = mostUsedCountries.includes(a.code);
-            const bIsMostUsed = mostUsedCountries.includes(b.code);
-            if (aIsMostUsed && !bIsMostUsed)
-                return -1;
-            if (!aIsMostUsed && bIsMostUsed)
-                return 1;
-            return a.name.localeCompare(b.name);
-        });
-    }, [countries, search, mostUsedCountries]);
-    // Close on click outside
-    React.useEffect(() => {
-        const handleClickOutside = (e) => {
-            if (containerRef.current &&
-                !containerRef.current.contains(e.target)) {
-                setOpen(false);
-                setSearch('');
-            }
-        };
-        if (open) {
-            document.addEventListener('mousedown', handleClickOutside);
-        }
-        return () => document.removeEventListener('mousedown', handleClickOutside);
-    }, [open]);
-    const handleSelect = (country) => {
-        onChange?.(country.code);
-        setOpen(false);
-        setSearch('');
-    };
-    const handleTriggerClick = () => {
-        if (!disabled) {
-            setOpen(!open);
-            if (!open) {
-                setTimeout(() => inputRef.current?.focus(), 0);
-            }
-        }
-    };
-    return (_jsxs("div", { ref: containerRef, className: cn('relative', className), children: [_jsxs("button", { type: "button", onClick: handleTriggerClick, disabled: disabled, className: cn('flex h-[32px] w-full items-center gap-fds-sm rounded-fds-md border border-input-border bg-input px-fds-sm text-fds-base outline-none transition-[color,box-shadow]', open &&
-                    'border-[#2075bd] shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)]', disabled && 'cursor-not-allowed opacity-50'), children: [selectedCountry ? (_jsxs(_Fragment, { children: [_jsx("img", { src: getCountryFlag(selectedCountry.code), alt: selectedCountry.code, className: "h-4 w-4 shrink-0 rounded-full object-cover" }), _jsx("span", { className: "flex-1 truncate text-left", children: selectedCountry.name })] })) : (_jsx("span", { className: "flex-1 text-left text-muted-foreground", children: placeholder })), _jsx(IconCaretDown, { size: 16, className: cn('shrink-0 text-fds-gray-60 transition-transform', open && 'rotate-180') })] }), open && (_jsxs("div", { className: "absolute top-full z-50 mt-fds-xs w-full rounded-fds-md border border-border bg-popover shadow-lg", children: [_jsx("div", { className: "border-b border-border p-fds-xs", children: _jsx("input", { ref: inputRef, type: "text", value: search, onChange: (e) => setSearch(e.target.value), placeholder: "Search country...", className: "h-[28px] w-full rounded-fds-sm border border-input-border bg-input px-fds-sm text-fds-sm outline-none focus:border-[#2075bd] focus:shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)]" }) }), _jsx("div", { className: "max-h-[210px] overflow-y-auto p-fds-xs", children: filteredCountries.length === 0 ? (_jsx("div", { className: "px-fds-sm py-fds-md text-center text-fds-sm text-muted-foreground", children: "No countries found" })) : (filteredCountries.map((country, index) => {
-                            const isSelected = country.code === value;
-                            const isMostUsed = mostUsedCountries.includes(country.code);
-                            const isLastMostUsed = isMostUsed &&
-                                !search &&
-                                index === mostUsedCountries.length - 1 &&
-                                filteredCountries.length > mostUsedCountries.length;
-                            return (_jsxs(React.Fragment, { children: [_jsxs("div", { onClick: () => handleSelect(country), className: cn('flex cursor-pointer items-center gap-fds-sm rounded-fds-sm px-fds-sm py-fds-xs hover:bg-accent', isSelected && 'bg-accent'), children: [_jsx("img", { src: getCountryFlag(country.code), alt: country.code, className: "h-6 w-6 shrink-0 rounded-full object-cover" }), _jsx("span", { className: "flex-1 truncate text-fds-base", children: country.name }), isSelected && (_jsx(IconCheck, { size: 16, className: "shrink-0 text-fds-blue" }))] }), isLastMostUsed && (_jsx("div", { className: "my-fds-xs h-px bg-border" }))] }, country.code));
-                        })) })] }))] }));
-};

package/dist/esm/components/date-picker.js

@@ -1,23 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { CalendarIcon } from 'lucide-react';
-import { IconClearCircledSolid } from '@freightos/icons';
-import { format } from 'date-fns';
-import { cn } from '../lib/utils';
-import { Calendar } from './calendar';
-import { Popover, PopoverContent, PopoverTrigger, } from './popover';
-export function DatePicker({ value, onChange, placeholder = 'Pick a date', disabled = false, className, }) {
-    const [open, setOpen] = React.useState(false);
-    const [isHovered, setIsHovered] = React.useState(false);
-    const handleSelect = (date) => {
-        onChange?.(date);
-        setOpen(false);
-    };
-    const handleClear = (e) => {
-        e.stopPropagation();
-        onChange?.(undefined);
-    };
-    const showClearIcon = isHovered && value;
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", disabled: disabled, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), className: cn('flex h-[var(--fds-size-xl)] w-full items-center justify-between gap-3 rounded-[var(--fds-border-radius-md)] border border-input-border bg-input py-1 pl-3 pr-2 text-sm', 'focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', 'disabled:cursor-not-allowed disabled:opacity-50', !value && 'text-muted-foreground', className), children: [_jsx("span", { className: "truncate", children: value ? format(value, 'dd/MM/yyyy') : placeholder }), showClearIcon ? (_jsx(IconClearCircledSolid, { size: 16, className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground", onClick: handleClear })) : (_jsx(CalendarIcon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }))] }) }), _jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: _jsx(Calendar, { mode: "single", selected: value, onSelect: handleSelect }) })] }));
-}

package/dist/esm/components/date-range-picker.js

@@ -1,23 +0,0 @@
-'use client';
-import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { CalendarIcon } from 'lucide-react';
-import { IconClearCircledSolid } from '@freightos/icons';
-import { format } from 'date-fns';
-import { cn } from '../lib/utils';
-import { Calendar } from './calendar';
-import { Popover, PopoverContent, PopoverTrigger, } from './popover';
-export function DateRangePicker({ value, onChange, placeholder = 'Start date - End date', disabled = false, className, }) {
-    const [open, setOpen] = React.useState(false);
-    const [isHovered, setIsHovered] = React.useState(false);
-    const handleSelect = (range) => {
-        onChange?.(range);
-    };
-    const handleClear = (e) => {
-        e.stopPropagation();
-        onChange?.(undefined);
-    };
-    const hasValue = value?.from;
-    const showClearIcon = isHovered && hasValue;
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", disabled: disabled, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), className: cn('flex h-[var(--fds-size-xl)] w-full items-center justify-between gap-3 rounded-[var(--fds-border-radius-md)] border border-input-border bg-input py-1 pl-3 pr-2 text-sm', 'focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', 'disabled:cursor-not-allowed disabled:opacity-50', !hasValue && 'text-muted-foreground', className), children: [_jsx("span", { className: "truncate", children: value?.from ? (value.to ? (_jsxs(_Fragment, { children: [format(value.from, 'dd/MM/yyyy'), " - ", format(value.to, 'dd/MM/yyyy')] })) : (format(value.from, 'dd/MM/yyyy'))) : (placeholder) }), showClearIcon ? (_jsx(IconClearCircledSolid, { size: 16, className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground", onClick: handleClear })) : (_jsx(CalendarIcon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }))] }) }), _jsx(PopoverContent, { className: "w-auto p-0", align: "end", children: _jsx(Calendar, { mode: "range", defaultMonth: value?.from, selected: value, onSelect: handleSelect, numberOfMonths: 2, showOutsideDays: false }) })] }));
-}

package/dist/esm/components/date-time-picker.js

@@ -1,70 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { CalendarIcon } from 'lucide-react';
-import { IconClearCircledSolid } from '@freightos/icons';
-import { format } from 'date-fns';
-import { cn } from '../lib/utils';
-import { Button } from './button';
-import { Calendar } from './calendar';
-import { Popover, PopoverContent, PopoverTrigger, } from './popover';
-import { ScrollArea, ScrollBar, } from './scroll-area';
-export function DateTimePicker({ value, onChange, placeholder = 'Pick date and time', disabled = false, className, use24Hour = false, }) {
-    const [open, setOpen] = React.useState(false);
-    const [isHovered, setIsHovered] = React.useState(false);
-    const hours = use24Hour
-        ? Array.from({ length: 24 }, (_, i) => i)
-        : Array.from({ length: 12 }, (_, i) => i + 1);
-    const handleDateSelect = (selectedDate) => {
-        if (selectedDate) {
-            const newDate = new Date(selectedDate);
-            if (value) {
-                newDate.setHours(value.getHours());
-                newDate.setMinutes(value.getMinutes());
-            }
-            onChange?.(newDate);
-        }
-    };
-    const handleTimeChange = (type, val) => {
-        const newDate = value ? new Date(value) : new Date();
-        if (type === 'hour') {
-            if (use24Hour) {
-                newDate.setHours(parseInt(val));
-            }
-            else {
-                newDate.setHours((parseInt(val) % 12) + (newDate.getHours() >= 12 ? 12 : 0));
-            }
-        }
-        else if (type === 'minute') {
-            newDate.setMinutes(parseInt(val));
-        }
-        else if (type === 'ampm') {
-            const currentHours = newDate.getHours();
-            if (val === 'PM' && currentHours < 12) {
-                newDate.setHours(currentHours + 12);
-            }
-            else if (val === 'AM' && currentHours >= 12) {
-                newDate.setHours(currentHours - 12);
-            }
-        }
-        onChange?.(newDate);
-    };
-    const handleClear = (e) => {
-        e.stopPropagation();
-        onChange?.(undefined);
-    };
-    const formatString = use24Hour ? 'dd/MM/yyyy HH:mm' : 'dd/MM/yyyy hh:mm aa';
-    const showClearIcon = isHovered && value;
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", disabled: disabled, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), className: cn('flex h-[var(--fds-size-xl)] w-full items-center justify-between gap-3 rounded-[var(--fds-border-radius-md)] border border-input-border bg-input py-1 pl-3 pr-2 text-sm', 'focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', 'disabled:cursor-not-allowed disabled:opacity-50', !value && 'text-muted-foreground', className), children: [_jsx("span", { className: "truncate", children: value ? format(value, formatString) : placeholder }), showClearIcon ? (_jsx(IconClearCircledSolid, { size: 16, className: "shrink-0 cursor-pointer text-muted-foreground hover:text-foreground", onClick: handleClear })) : (_jsx(CalendarIcon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }))] }) }), _jsx(PopoverContent, { className: "w-auto p-0", children: _jsxs("div", { className: "sm:flex", children: [_jsx(Calendar, { mode: "single", selected: value, onSelect: handleDateSelect }), _jsxs("div", { className: "flex flex-col divide-y sm:h-[300px] sm:flex-row sm:divide-x sm:divide-y-0", children: [_jsxs(ScrollArea, { className: "w-64 sm:w-auto", children: [_jsx("div", { className: "flex p-2 sm:flex-col", children: hours.map((hour) => (_jsx(Button, { size: "small", htmlType: "button", type: value &&
-                                                    (use24Hour
-                                                        ? value.getHours() === hour
-                                                        : value.getHours() % 12 === hour % 12)
-                                                    ? 'default'
-                                                    : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('hour', hour.toString()), children: use24Hour ? hour.toString().padStart(2, '0') : hour }, hour))) }), _jsx(ScrollBar, { orientation: "horizontal", className: "sm:hidden" })] }), _jsxs(ScrollArea, { className: "w-64 sm:w-auto", children: [_jsx("div", { className: "flex p-2 sm:flex-col", children: Array.from({ length: 12 }, (_, i) => i * 5).map((minute) => (_jsx(Button, { size: "small", htmlType: "button", type: value && value.getMinutes() === minute
-                                                    ? 'default'
-                                                    : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('minute', minute.toString()), children: minute.toString().padStart(2, '0') }, minute))) }), _jsx(ScrollBar, { orientation: "horizontal", className: "sm:hidden" })] }), !use24Hour && (_jsx(ScrollArea, { className: "", children: _jsx("div", { className: "flex p-2 sm:flex-col", children: ['AM', 'PM'].map((ampm) => (_jsx(Button, { size: "small", htmlType: "button", type: value &&
-                                                ((ampm === 'AM' && value.getHours() < 12) ||
-                                                    (ampm === 'PM' && value.getHours() >= 12))
-                                                ? 'default'
-                                                : 'text', className: "aspect-square shrink-0 sm:w-full", onClick: () => handleTimeChange('ampm', ampm), children: ampm }, ampm))) }) }))] })] }) })] }));
-}

package/dist/esm/components/dialog.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import * as React from 'react';
-import { cn } from '../lib/utils';
-import { IconClose } from '@freightos/icons';
-const Dialog = DialogPrimitive.Root;
-const DialogTrigger = DialogPrimitive.Trigger;
-const DialogPortal = DialogPrimitive.Portal;
-const DialogClose = DialogPrimitive.Close;
-const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: cn('fixed inset-0 z-[9999] bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', className), ...props })));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-const DialogContent = React.forwardRef(({ className, children, closable = true, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: cn('fixed left-[50%] top-[50%] z-[9999] flex w-full max-w-lg translate-x-[-50%] translate-y-[-50%] flex-col bg-card shadow-lg duration-150 ease-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:rounded-lg', className), ...props, children: [children, closable && (_jsx(DialogPrimitive.Close, { asChild: true, children: _jsxs("button", { className: "hover:text-fds-gray-90 absolute end-fds-xl top-fds-lg text-fds-gray-60 dark:text-fds-gray-40 dark:hover:text-fds-gray-10", children: [_jsx(IconClose, { size: 24 }), _jsx("span", { className: "sr-only", children: "Close" })] }) }))] })] })));
-DialogContent.displayName = DialogPrimitive.Content.displayName;
-const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn('flex flex-col space-y-1.5 border-b px-fds-xl py-fds-lg text-center sm:text-left', className), ...props }));
-DialogHeader.displayName = 'DialogHeader';
-const DialogBody = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('flex-1 overflow-y-auto p-6', className), ...props })));
-DialogBody.displayName = 'DialogBody';
-const DialogFooter = ({ className, ...props }) => (_jsx("div", { className: cn('flex flex-col-reverse border-t p-6 sm:flex-row sm:justify-end sm:space-x-2', className), ...props }));
-DialogFooter.displayName = 'DialogFooter';
-const DialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold leading-none tracking-tight', className), ...props })));
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
-const DialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
-export { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/esm/components/drawer.js

@@ -1,23 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { Drawer as DrawerPrimitive } from 'vaul';
-import { cn } from '../lib/utils';
-const Drawer = ({ shouldScaleBackground = true, ...props }) => (_jsx(DrawerPrimitive.Root, { shouldScaleBackground: shouldScaleBackground, ...props }));
-Drawer.displayName = 'Drawer';
-const DrawerTrigger = DrawerPrimitive.Trigger;
-const DrawerPortal = DrawerPrimitive.Portal;
-const DrawerClose = DrawerPrimitive.Close;
-const DrawerOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Overlay, { ref: ref, className: cn('fixed inset-0 z-50 bg-black/80', className), ...props })));
-DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
-const DrawerContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DrawerPortal, { children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { ref: ref, className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background', className), ...props, children: [_jsx("div", { className: "mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" }), children] })] })));
-DrawerContent.displayName = 'DrawerContent';
-const DrawerHeader = ({ className, ...props }) => (_jsx("div", { className: cn('grid gap-1.5 p-4 text-center sm:text-left', className), ...props }));
-DrawerHeader.displayName = 'DrawerHeader';
-const DrawerFooter = ({ className, ...props }) => (_jsx("div", { className: cn('mt-auto flex flex-col gap-2 p-4', className), ...props }));
-DrawerFooter.displayName = 'DrawerFooter';
-const DrawerTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold leading-none tracking-tight', className), ...props })));
-DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
-const DrawerDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
-DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
-export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, };

package/dist/esm/components/dropdown-menu.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import { Check, ChevronRight, Circle } from 'lucide-react';
-import * as React from 'react';
-import { cn } from '../lib/utils';
-const DropdownMenu = DropdownMenuPrimitive.Root;
-const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-const DropdownMenuGroup = DropdownMenuPrimitive.Group;
-const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
-const DropdownMenuSub = DropdownMenuPrimitive.Sub;
-const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.SubTrigger, { ref: ref, className: cn('flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0', inset && 'pl-8', className), ...props, children: [children, _jsx(ChevronRight, { className: "ml-auto" })] })));
-DropdownMenuSubTrigger.displayName =
-    DropdownMenuPrimitive.SubTrigger.displayName;
-const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.SubContent, { ref: ref, className: cn('z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2', className), ...props })));
-DropdownMenuSubContent.displayName =
-    DropdownMenuPrimitive.SubContent.displayName;
-const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn('z-[1010] max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-md bg-popover py-1 text-popover-foreground shadow-fds-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2', className), ...props }) })));
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Item, { ref: ref, className: cn('relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-fds-xs text-sm outline-none transition-colors hover:bg-fds-blue-10 focus:bg-fds-blue-10 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0', inset && 'pl-8', className), ...props })));
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-const DropdownMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.CheckboxItem, { ref: ref, className: cn('relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className), checked: checked, ...props, children: [_jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(Check, { className: "h-4 w-4" }) }) }), children] })));
-DropdownMenuCheckboxItem.displayName =
-    DropdownMenuPrimitive.CheckboxItem.displayName;
-const DropdownMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.RadioItem, { ref: ref, className: cn('relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className), ...props, children: [_jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }), children] })));
-DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Label, { ref: ref, className: cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className), ...props })));
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Separator, { ref: ref, className: cn('-mx-1 my-1 h-px bg-muted', className), ...props })));
-DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
-const DropdownMenuShortcut = ({ className, ...props }) => {
-    return (_jsx("span", { className: cn('ml-auto text-xs tracking-widest opacity-60', className), ...props }));
-};
-DropdownMenuShortcut.displayName = 'DropdownMenuShortcut';
-export { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, };

package/dist/esm/components/empty.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { cn } from '../lib/utils';
-const Empty = React.forwardRef(({ className, message = 'No data', ...props }, ref) => (_jsxs("div", { ref: ref, className: cn('flex flex-col items-center justify-center py-fds-xl', className), ...props, children: [_jsx("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: _jsxs("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [_jsx("ellipse", { className: "fill-fds-gray-10 dark:fill-fds-gray-80", cx: "32", cy: "33", rx: "32", ry: "7" }), _jsxs("g", { fillRule: "nonzero", className: "stroke-fds-gray-30 dark:stroke-fds-gray-60", children: [_jsx("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }), _jsx("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", className: "fill-fds-gray-5 dark:fill-fds-gray-90" })] })] }) }), _jsx("span", { className: "mt-fds-sm text-fds-sm text-fds-gray-50", children: message })] })));
-Empty.displayName = 'Empty';
-export { Empty };

package/dist/esm/components/file-preview.js

@@ -1,69 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button } from './button';
-import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle, } from './dialog';
-import { IconDownload, IconPrint } from '@freightos/icons';
-const IMAGE_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.gif', '.webp', '.svg', '.bmp'];
-function isImageFile(fileName) {
-    const lowerName = fileName.toLowerCase();
-    return IMAGE_EXTENSIONS.some(ext => lowerName.endsWith(ext));
-}
-export const FilePreview = ({ fileName, fileUrl, open, onOpenChange, }) => {
-    const isImage = isImageFile(fileName);
-    const handlePrint = () => {
-        if (isImage) {
-            // For images, create a printable HTML page
-            const printWindow = window.open('', '_blank');
-            if (printWindow) {
-                printWindow.document.write(`
-          <!DOCTYPE html>
-          <html>
-            <head>
-              <title>${fileName}</title>
-              <style>
-                body { margin: 0; display: flex; justify-content: center; align-items: center; min-height: 100vh; }
-                img { max-width: 100%; max-height: 100vh; object-fit: contain; }
-                @media print { body { margin: 0; } img { max-width: 100%; max-height: 100%; } }
-              </style>
-            </head>
-            <body>
-              <img src="${fileUrl}" alt="${fileName}" onload="window.print(); window.close();" />
-            </body>
-          </html>
-        `);
-                printWindow.document.close();
-            }
-        }
-        else {
-            // For PDFs and other documents
-            const printWindow = window.open(fileUrl, '_blank');
-            if (printWindow) {
-                printWindow.onload = () => {
-                    printWindow.print();
-                };
-            }
-        }
-    };
-    const handleDownload = async () => {
-        try {
-            const response = await fetch(fileUrl);
-            const blob = await response.blob();
-            const url = window.URL.createObjectURL(blob);
-            const link = document.createElement('a');
-            link.href = url;
-            link.download = fileName;
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-            window.URL.revokeObjectURL(url);
-            onOpenChange(false);
-        }
-        catch (error) {
-            console.error('Download failed:', error);
-            // Fallback: open in new tab
-            window.open(fileUrl, '_blank');
-            onOpenChange(false);
-        }
-    };
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "h-[90vh] max-w-4xl", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: fileName }) }), _jsx("div", { className: "flex flex-1 items-center justify-center overflow-auto p-fds-xl", children: isImage ? (_jsx("img", { src: fileUrl, alt: fileName, className: "max-h-full max-w-full object-contain" })) : (_jsx("iframe", { src: fileUrl, title: fileName, className: "h-full w-full border-0" })) }), _jsxs(DialogFooter, { className: "flex justify-end gap-2 py-fds-lg", children: [_jsxs(Button, { type: "secondary", size: "medium", onClick: handlePrint, children: [_jsx(IconPrint, {}), "Print"] }), _jsxs(Button, { type: "default", size: "medium", onClick: handleDownload, children: [_jsx(IconDownload, {}), "Download"] })] })] }) }));
-};

package/dist/esm/components/form.js

@@ -1,63 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { Slot } from '@radix-ui/react-slot';
-import { Controller, FormProvider, useFormContext, } from 'react-hook-form';
-import { cn } from '../lib/utils';
-import { Label } from './label';
-const Form = FormProvider;
-const FormFieldContext = React.createContext({});
-const FormField = ({ ...props }) => {
-    return (_jsx(FormFieldContext.Provider, { value: { name: props.name }, children: _jsx(Controller, { ...props }) }));
-};
-const useFormField = () => {
-    const fieldContext = React.useContext(FormFieldContext);
-    const itemContext = React.useContext(FormItemContext);
-    const { getFieldState, formState } = useFormContext();
-    const fieldState = getFieldState(fieldContext.name, formState);
-    if (!fieldContext) {
-        throw new Error('useFormField should be used within <FormField>');
-    }
-    const { id } = itemContext;
-    return {
-        id,
-        name: fieldContext.name,
-        formItemId: `${id}-form-item`,
-        formDescriptionId: `${id}-form-item-description`,
-        formMessageId: `${id}-form-item-message`,
-        ...fieldState,
-    };
-};
-const FormItemContext = React.createContext({});
-const FormItem = React.forwardRef(({ className, ...props }, ref) => {
-    const id = React.useId();
-    return (_jsx(FormItemContext.Provider, { value: { id }, children: _jsx("div", { ref: ref, className: cn('space-y-fds-xs', className), ...props }) }));
-});
-FormItem.displayName = 'FormItem';
-const FormLabel = React.forwardRef(({ className, ...props }, ref) => {
-    const { error, formItemId } = useFormField();
-    return (_jsx(Label, { ref: ref, className: cn(error && 'text-destructive', className), htmlFor: formItemId, ...props }));
-});
-FormLabel.displayName = 'FormLabel';
-const FormControl = React.forwardRef(({ ...props }, ref) => {
-    const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
-    return (_jsx(Slot, { ref: ref, id: formItemId, "aria-describedby": !error
-            ? `${formDescriptionId}`
-            : `${formDescriptionId} ${formMessageId}`, "aria-invalid": !!error, ...props }));
-});
-FormControl.displayName = 'FormControl';
-const FormDescription = React.forwardRef(({ className, ...props }, ref) => {
-    const { formDescriptionId } = useFormField();
-    return (_jsx("p", { ref: ref, id: formDescriptionId, className: cn('text-sm text-muted-foreground', className), ...props }));
-});
-FormDescription.displayName = 'FormDescription';
-const FormMessage = React.forwardRef(({ className, children, ...props }, ref) => {
-    const { error, formMessageId } = useFormField();
-    const body = error ? String(error?.message ?? '') : children;
-    if (!body) {
-        return null;
-    }
-    return (_jsx("p", { ref: ref, id: formMessageId, className: cn('text-sm font-medium text-destructive', className), ...props, children: body }));
-});
-FormMessage.displayName = 'FormMessage';
-export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };

package/dist/esm/components/inline-edit.js

@@ -1,47 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { cn } from '../lib/utils';
-import { IconEdit } from '@freightos/icons';
-import { Input } from './input';
-const InlineEdit = React.forwardRef(({ value, onChange, placeholder = 'Click to edit', className, hideIcon = false }, ref) => {
-    const [isEditing, setIsEditing] = React.useState(false);
-    const [editValue, setEditValue] = React.useState(value);
-    const inputRef = React.useRef(null);
-    React.useEffect(() => {
-        setEditValue(value);
-    }, [value]);
-    React.useEffect(() => {
-        if (isEditing && inputRef.current) {
-            inputRef.current.focus();
-            inputRef.current.select();
-        }
-    }, [isEditing]);
-    const handleSave = () => {
-        setIsEditing(false);
-        if (editValue.trim() !== value) {
-            onChange(editValue.trim());
-        }
-        else {
-            setEditValue(value);
-        }
-    };
-    const handleCancel = () => {
-        setIsEditing(false);
-        setEditValue(value);
-    };
-    const handleKeyDown = (e) => {
-        if (e.key === 'Enter') {
-            handleSave();
-        }
-        else if (e.key === 'Escape') {
-            handleCancel();
-        }
-    };
-    if (isEditing) {
-        return (_jsx(Input, { ref: inputRef, type: "text", value: editValue, onChange: (e) => setEditValue(e.target.value), onBlur: handleSave, onKeyDown: handleKeyDown, className: cn('w-auto', className), placeholder: placeholder, inputSize: "small" }));
-    }
-    return (_jsxs("div", { ref: ref, onClick: () => setIsEditing(true), className: cn('group inline-flex h-[24px] cursor-pointer items-center gap-fds-xs rounded px-fds-xs font-fds-semibold hover:bg-fds-blue-10 dark:hover:bg-fds-gray-80', className), children: [_jsx("span", { className: cn(!value && 'text-fds-gray-60'), children: value || placeholder }), !hideIcon && _jsx(IconEdit, { size: 14, className: "text-fds-gray-60" })] }));
-});
-InlineEdit.displayName = 'InlineEdit';
-export { InlineEdit };

package/dist/esm/components/input-group.js

@@ -1,63 +0,0 @@
-"use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { cva } from 'class-variance-authority';
-import { cn } from '../lib/utils';
-import { Button } from './button';
-import { Input } from './input';
-import { Textarea } from './textarea';
-function InputGroup({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "input-group", role: "group", className: cn('group/input-group relative flex w-full items-center rounded-fds-md border border-input-border bg-input outline-none transition-[color,box-shadow]', 'h-[32px] has-[>textarea]:h-auto', 
-        // Variants based on alignment.
-        'has-[>[data-align=inline-start]]:[&>input]:pl-2', 'has-[>[data-align=inline-end]]:[&>input]:pr-2', 'has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3', 'has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3', 
-        // Focus state.
-        'focus-within:border-[#2075bd] focus-within:shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)]', 
-        // Error state.
-        'has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40', className), ...props }));
-}
-const inputGroupAddonVariants = cva("text-muted-foreground flex h-full cursor-text select-none items-center justify-center gap-2 bg-fds-gray-10 px-3 text-xs font-medium group-data-[disabled=true]/input-group:opacity-50 dark:bg-background [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
-    variants: {
-        align: {
-            'inline-start': 'order-first rounded-l-[3px] border-r border-input-border',
-            'inline-end': 'order-last rounded-r-[3px] border-l border-input-border',
-            'block-start': '[.border-b]:pb-3 order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5',
-            'block-end': '[.border-t]:pt-3 order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5',
-        },
-    },
-    defaultVariants: {
-        align: 'inline-start',
-    },
-});
-function InputGroupAddon({ className, align = 'inline-start', ...props }) {
-    return (_jsx("div", { role: "group", "data-slot": "input-group-addon", "data-align": align, className: cn(inputGroupAddonVariants({ align }), className), onClick: (e) => {
-            if (e.target.closest('button')) {
-                return;
-            }
-            e.currentTarget.parentElement?.querySelector('input')?.focus();
-        }, ...props }));
-}
-const inputGroupButtonVariants = cva('flex items-center gap-2 text-sm shadow-none', {
-    variants: {
-        size: {
-            xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5",
-            sm: 'h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5',
-            'icon-xs': 'size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0',
-            'icon-sm': 'size-8 p-0 has-[>svg]:p-0',
-        },
-    },
-    defaultVariants: {
-        size: 'xs',
-    },
-});
-function InputGroupButton({ className, htmlType = 'button', type = 'text', size = 'xs', ...props }) {
-    return (_jsx(Button, { htmlType: htmlType, type: type, "data-size": size, className: cn(inputGroupButtonVariants({ size }), className), ...props }));
-}
-function InputGroupText({ className, ...props }) {
-    return (_jsx("span", { className: cn("flex items-center gap-2 text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none", className), ...props }));
-}
-function InputGroupInput({ className, ...props }) {
-    return (_jsx(Input, { "data-slot": "input-group-control", className: cn('flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent', className), ...props }));
-}
-function InputGroupTextarea({ className, ...props }) {
-    return (_jsx(Textarea, { "data-slot": "input-group-control", className: cn('flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent', className), ...props }));
-}
-export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, };

package/dist/esm/components/input-otp.js

@@ -1,19 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { OTPInput, OTPInputContext } from "input-otp";
-import { Dot } from "lucide-react";
-import { cn } from "../lib/utils";
-const InputOTP = React.forwardRef(({ className, containerClassName, ...props }, ref) => (_jsx(OTPInput, { ref: ref, containerClassName: cn("flex items-center gap-2 has-[:disabled]:opacity-50", containerClassName), className: cn("disabled:cursor-not-allowed", className), ...props })));
-InputOTP.displayName = "InputOTP";
-const InputOTPGroup = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex items-center", className), ...props })));
-InputOTPGroup.displayName = "InputOTPGroup";
-const InputOTPSlot = React.forwardRef(({ index, className, ...props }, ref) => {
-    const inputOTPContext = React.useContext(OTPInputContext);
-    const { char, hasFakeCaret, isActive } = inputOTPContext.slots[index];
-    return (_jsxs("div", { ref: ref, className: cn("relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md", isActive && "z-10 ring-2 ring-ring ring-offset-background", className), ...props, children: [char, hasFakeCaret && (_jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: _jsx("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }) }))] }));
-});
-InputOTPSlot.displayName = "InputOTPSlot";
-const InputOTPSeparator = React.forwardRef(({ ...props }, ref) => (_jsx("div", { ref: ref, role: "separator", ...props, children: _jsx(Dot, {}) })));
-InputOTPSeparator.displayName = "InputOTPSeparator";
-export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };