@lerianstudio/sindarian-ui 1.2.0 → 1.3.0-beta.2

package/dist/esm/components/ui/autocomplete/index.js

@@ -0,0 +1,312 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import { ChevronDown, Loader2, X } from 'lucide-react';
+import { Badge } from '../badge/index.js';
+import { cn } from '../../../lib/utils.js';
+import { Separator } from '../separator/index.js';
+import { Command as CommandPrimitive, useCommandState } from 'cmdk';
+import { useClickAway } from '../../../hooks/use-click-away.js';
+import isNil from 'lodash/isNil.js';
+const AutocompleteContext = React.createContext({
+    value: [],
+    onValueChange: (values) => values,
+    handleChange: (value) => value,
+    handleClear: () => { },
+    setOpen: () => { },
+    setOnScrollbar: () => { },
+    options: {},
+    addOption: (option) => option,
+    inputRef: React.createRef()
+});
+const useAutocomplete = () => {
+    const context = React.useContext(AutocompleteContext);
+    if (!context) {
+        throw new Error('useAutocomplete must be used within a AutocompleteProvider');
+    }
+    return context;
+};
+export function AutocompleteTrigger({ ref, className, onClear, children }) {
+    const _ref = React.useRef(null);
+    const { open, readOnly, setOpen, disabled, value, inputRef, handleClear } = useAutocomplete();
+    React.useImperativeHandle(ref, () => _ref.current);
+    const isNoSelection = disabled || readOnly || value.length < 1;
+    return (_jsxs("div", { ref: _ref, className: cn('bg-background ring-offset-background placeholder:text-shadcn-400 data-[disabled=true]:bg-shadcn-100 data-[read-only=true]:bg-shadcn-100 border-input flex rounded-md border text-sm focus:outline-hidden focus-visible:outline-hidden data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50 data-[read-only=true]:opacity-50 md:text-sm [&>span]:line-clamp-1', {
+            'h-9': value.length === 0,
+            'min-h-9': value.length > 0,
+            'cursor-text': !disabled && value.length !== 0
+        }, className), onClick: () => {
+            // Redirect focus to the input field when clicking on the container
+            if (readOnly || disabled) {
+                return;
+            }
+            if (open) {
+                inputRef?.current?.blur();
+            }
+            else {
+                inputRef?.current?.focus();
+            }
+            setOpen(!open);
+        }, "data-disabled": disabled, "data-read-only": readOnly, children: [_jsx("div", { className: "flex grow flex-wrap gap-1 px-3 py-2", children: children }), _jsxs("div", { className: "flex shrink-0 items-center justify-end", children: [_jsx("button", { type: "button", className: cn(isNoSelection && 'hidden'), children: _jsx(X, { className: "text-muted-foreground mx-2 h-4 cursor-pointer", onClick: (event) => {
+                                event.stopPropagation();
+                                handleClear();
+                                onClear?.();
+                            } }) }), _jsx(Separator, { orientation: "vertical", className: cn(isNoSelection && 'hidden') }), _jsx(SelectPrimitive.Icon, { className: "cursor-pointer data-[disabled=true]:cursor-not-allowed data-[read-only=true]:cursor-default", "data-disabled": disabled, "data-read-only": readOnly, children: _jsx(ChevronDown, { className: "mx-3 my-2 h-4 w-4 opacity-50" }) })] })] }));
+}
+export function AutocompleteValue({ ref, className, value: valueProp, onValueChange, onBlur, ...props }) {
+    const [search, setSearch] = React.useState(valueProp);
+    const { value, showValue, options, readOnly, disabled, inputRef } = useAutocomplete();
+    React.useImperativeHandle(ref, () => inputRef.current);
+    const updateSearch = (value) => {
+        if (isNil(value)) {
+            return;
+        }
+        const v = typeof value === 'string' ? value : value[0];
+        if (v === '') {
+            handleValueChange('');
+            return;
+        }
+        handleValueChange(showValue ? v : options[v]);
+    };
+    const handleValueChange = (value) => {
+        setSearch(value);
+        onValueChange?.(value);
+    };
+    const handleBlur = (event) => {
+        updateSearch(value);
+        onBlur?.(event);
+    };
+    // If options changes, update only the internal value
+    React.useEffect(() => {
+        if (isNil(value)) {
+            return;
+        }
+        const v = typeof value === 'string' ? value : value[0];
+        if (v === '') {
+            return;
+        }
+        setSearch(showValue ? v : options[v]);
+    }, [options]);
+    React.useEffect(() => {
+        updateSearch(value);
+    }, [value]);
+    return (_jsx(CommandPrimitive.Input, { ...props, ref: inputRef, value: search, onValueChange: handleValueChange, disabled: disabled, readOnly: readOnly, className: cn('placeholder:text-muted-foreground w-full bg-transparent outline-hidden read-only:opacity-50 read-only:placeholder:opacity-0 focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 disabled:placeholder:opacity-0', className), onBlur: handleBlur }));
+}
+export function AutocompleteMultipleValue({ ref, className, ...props }) {
+    const { value, disabled, handleChange, options, showValue, inputRef } = useAutocomplete();
+    React.useImperativeHandle(ref, () => inputRef.current);
+    return (_jsxs(_Fragment, { children: [options &&
+                value?.map((value) => (_jsxs(Badge, { variant: "secondary", className: cn('data-disabled:bg-muted-foreground data-fixed:bg-muted-foreground data-disabled:text-muted data-fixed:text-muted data-disabled:hover:bg-muted-foreground data-fixed:hover:bg-muted-foreground'), children: [showValue ? value : options[value], _jsx("button", { type: "button", className: cn('ring-offset-background focus:ring-ring ml-1 rounded-full outline-hidden focus:ring-2 focus:ring-offset-2', disabled && 'hidden'), children: _jsx(X, { className: "text-muted-foreground hover:text-foreground h-3 w-3", onClick: (event) => {
+                                    event.stopPropagation();
+                                    handleChange(value);
+                                } }) })] }, value))), _jsx(CommandPrimitive.Input, { ...props, ref: inputRef, disabled: disabled, className: cn('placeholder:text-muted-foreground w-full bg-transparent outline-hidden focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 disabled:placeholder:opacity-0', className) })] }));
+}
+export function AutocompleteEmpty({ className, ...props }) {
+    const render = useCommandState((state) => state.filtered.count === 0);
+    if (!render)
+        return null;
+    return (_jsx("div", { "data-slot": "autocomplete-empty", className: cn('py-6 text-center text-sm', className), "cmdk-empty": "", role: "presentation", ...props }));
+}
+export function AutocompleteLoading({ className, ref, ...props }) {
+    return (_jsx(CommandPrimitive.Loading, { ref: ref, "data-slot": "autocomplete-loading", className: cn('flex items-center justify-center py-6 text-center text-sm', className), ...props, children: _jsx(Loader2, { className: "text-muted-foreground h-5 w-5 animate-spin" }) }));
+}
+export const SIDE_OPTIONS = ['top', 'right', 'bottom', 'left'];
+export function AutocompleteContent({ className, position = 'popper', side = 'bottom', ref, children, onMouseEnter, onMouseLeave, onPointerDownOutside, ...props }) {
+    const _ref = React.useRef(null);
+    const { open, addOption, setOpen, onScrollbar, setOnScrollbar, inputRef } = useAutocomplete();
+    React.useImperativeHandle(ref, () => _ref.current);
+    useClickAway(_ref, (event) => {
+        /**
+         * ⛔ THE `open` GUARD IS LOAD-BEARING SINCE THIS LIST STOPPED UNMOUNTING.
+         * While the panel returned `null` this handler was inert by accident: its
+         * ref pointed at nothing. Now that the list stays in the DOM (see the return
+         * below), every click anywhere on the page reaches here — and without this
+         * line each one would call `setOpen(false)` and blur the input. A consumer
+         * form carrying ten of these would run ten handlers per click.
+         */
+        if (!open) {
+            return;
+        }
+        // Should not close when clicking on the scrollbar
+        if (onScrollbar) {
+            return;
+        }
+        setOpen(false);
+        inputRef.current?.blur();
+        onPointerDownOutside?.(event);
+    });
+    /**
+     * Iterates recursively into react children to find valid items options
+     * Adds the valid ones into the options object
+     * @param children
+     */
+    const _searchChildren = (children) => {
+        React.Children.forEach(React.Children.toArray(children), (child) => {
+            // If child is already invalid, like pure string, dismiss
+            if (!React.isValidElement(child)) {
+                return;
+            }
+            // If child is recognized as an AutocompleteItem
+            if (child.type &&
+                child.type.displayName === 'AutocompleteItem') {
+                // Check if the item was proper filled with a value prop
+                if (child.props.value) {
+                    addOption({
+                        [child.props.value]: child.props.children
+                    });
+                }
+                return;
+            }
+            // If not, search recursively into the childrens
+            if (child.props.children) {
+                _searchChildren(child.props.children);
+            }
+        });
+    };
+    // Since this component is not going to be rendered in the DOM until open is true,
+    // we need to register the options when the component mounts
+    // and when the children changes.
+    React.useEffect(() => {
+        _searchChildren(children);
+    }, [children]);
+    /**
+     * ⛔ THE LIST STAYS IN THE DOM, THE OPTIONS DO NOT — and the split is the whole
+     * fix (#150).
+     *
+     * cmdk puts `aria-controls={listId}` on the input it renders and `id={listId}`
+     * on this list. Returning `null` while closed therefore left the input naming
+     * an element that did not exist, which axe-core reports as a CRITICAL
+     * `aria-valid-attr-value` violation — measured as 10 failing cases across five
+     * forms in a consumer, in both the populated and the empty state. A screen
+     * reader following the reference resolved it to nothing.
+     *
+     * ⛔ AND NOT "KEEP EVERYTHING MOUNTED", which is the obvious reading of the
+     * fix and is too expensive. Only the LIST carries the id; the options carry
+     * the cost. One consumer form puts up to ten of these on screen, each holding
+     * a page of up to a hundred options — roughly a thousand permanently present
+     * nodes for an id that is one element. `{open ? children : null}` keeps the
+     * reference resolvable and the DOM the size it was.
+     *
+     * ⚠️ `hidden` AND NOT A CLASS. It removes the subtree from the accessibility
+     * tree as well as from view, so a closed panel is not an empty `listbox` that
+     * a screen reader can reach into.
+     *
+     * ⚠️ THE ENTRY ANIMATION IS NOT LOST, because there was none to lose: the
+     * className carries `animate-in` with no `fade-in-*` / `zoom-in-*` / `slide-in-*`
+     * companion, so every `--tw-enter-*` variable sits at its default and the
+     * keyframe is a no-op today. Should a real one be added later, it belongs on a
+     * wrapper INSIDE this list — that subtree still mounts with the children.
+     */
+    return (_jsx("div", { className: "relative", hidden: !open, children: _jsx(CommandPrimitive.List, { ref: _ref, className: cn('bg-popover text-popover-foreground animate-in absolute top-1 z-50 max-h-96 w-full min-w-32 overflow-x-hidden overflow-y-auto rounded-md border shadow-md outline-hidden', position === 'popper' &&
+                'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className), "data-side": side, ...props, onMouseEnter: (e) => {
+                onMouseEnter?.(e);
+                setOnScrollbar(true);
+            }, onMouseLeave: (e) => {
+                onMouseLeave?.(e);
+                setOnScrollbar(false);
+            }, children: open ? children : null }) }));
+}
+export function AutocompleteGroup({ className, ...props }) {
+    return (_jsx(CommandPrimitive.Group, { "data-slot": "autocomplete-group", className: cn('text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium', className), ...props }));
+}
+export function AutocompleteItem({ className, value, onSelect, ...props }) {
+    const { handleChange } = useAutocomplete();
+    return (_jsx(CommandPrimitive.Item, { "data-slot": "autocomplete-item", value: value, className: cn("data-[selected='true']:bg-accent data-[selected=true]:text-accent-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", className), ...props, onMouseDown: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+        }, onSelect: (value) => {
+            handleChange(value);
+            onSelect?.(value);
+        } }));
+}
+export function Autocomplete({ ref, value, defaultValue, onValueChange, onClear, className, open: openProp, onOpenChange, showValue, readOnly, disabled, multiple, onKeyDown, children, ...props }) {
+    const _ref = React.useRef(null);
+    const [open, _setOpen] = React.useState(openProp);
+    const inputRef = React.useRef(null);
+    const [onScrollbar, setOnScrollbar] = React.useState(false);
+    const [selected, setSelected] = React.useState(defaultValue ?? value ?? (multiple ? [] : ''));
+    const [options, addOption] = React.useReducer((prev, state) => ({
+        ...prev,
+        ...state
+    }), {});
+    React.useImperativeHandle(ref, () => _ref.current);
+    const setOpen = (open) => {
+        _setOpen(open);
+        onOpenChange?.(open);
+    };
+    const handleClear = () => {
+        onClear?.();
+        if (!multiple) {
+            setSelected('');
+            onValueChange?.('');
+            return;
+        }
+        setSelected([]);
+        onValueChange?.([]);
+    };
+    const handleChange = React.useCallback((value) => {
+        if (!value) {
+            return;
+        }
+        if (!multiple) {
+            setSelected(value);
+            onValueChange?.(value);
+            setOpen(false);
+            return;
+        }
+        const newSelected = selected.includes(value)
+            ? selected.filter((item) => item !== value)
+            : [...selected, value];
+        setSelected(newSelected);
+        onValueChange?.(newSelected);
+    }, [selected, onValueChange]);
+    const handleKeyDown = React.useCallback((e) => {
+        const input = inputRef.current;
+        if (input) {
+            if (e.key === 'Delete' || e.key === 'Backspace') {
+                if (multiple) {
+                    if (input.value === '' && selected.length > 0) {
+                        handleChange(selected[selected.length - 1]);
+                    }
+                }
+            }
+            // This is not a default behavior of the <input /> field
+            if (e.key === 'Escape') {
+                e.stopPropagation();
+                input.blur();
+            }
+        }
+    }, [selected, handleChange]);
+    // Keeps the selected value in sync with the value prop
+    React.useEffect(() => {
+        if (!isNil(value)) {
+            setSelected(value);
+        }
+    }, [value]);
+    // Keeps the open state in sync with the open prop
+    React.useEffect(() => {
+        if (openProp !== undefined) {
+            setOpen(openProp);
+        }
+    }, [openProp]);
+    return (_jsx(AutocompleteContext.Provider, { value: {
+            value: selected,
+            onValueChange: setSelected,
+            showValue,
+            readOnly,
+            disabled,
+            handleChange,
+            handleClear,
+            onScrollbar,
+            setOnScrollbar,
+            open,
+            setOpen,
+            options,
+            addOption,
+            inputRef
+        }, children: _jsx(CommandPrimitive, { ref: _ref, className: cn('text-foreground flex h-auto w-full flex-col overflow-visible rounded-md bg-transparent', className), "data-disabled": disabled, "aria-disabled": disabled, "data-read-only": readOnly, "aria-readonly": readOnly, ...props, onKeyDown: (e) => {
+                handleKeyDown(e);
+                onKeyDown?.(e);
+            }, children: children }) }));
+}

package/dist/esm/components/ui/autosize-textarea/index.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+type UseAutosizeTextAreaProps = {
+    textAreaRef: React.RefObject<HTMLTextAreaElement | null>;
+    minHeight?: number;
+    maxHeight?: number;
+    triggerAutoSize: string;
+};
+export declare const useAutosizeTextArea: ({ textAreaRef, triggerAutoSize, maxHeight, minHeight }: UseAutosizeTextAreaProps) => void;
+export type AutosizeTextAreaProps = React.ComponentProps<'textarea'> & {
+    maxHeight?: number;
+    minHeight?: number;
+};
+export declare function AutosizeTextarea({ maxHeight, minHeight, className, onChange, value, ref, ...props }: AutosizeTextAreaProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/autosize-textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/autosize-textarea/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,KAAK,wBAAwB,GAAG;IAC9B,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAA;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,mBAAmB,GAAI,wDAKjC,wBAAwB,SA4B1B,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,GAAG;IACrE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,SAAmC,EACnC,SAAc,EACd,SAAS,EACT,QAAQ,EACR,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,qBAAqB,qBAkCvB"}

package/dist/esm/components/ui/autosize-textarea/index.js

@@ -0,0 +1,51 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../../../lib/utils.js';
+import { useImperativeHandle } from 'react';
+export const useAutosizeTextArea = ({ textAreaRef, triggerAutoSize, maxHeight = Number.MAX_SAFE_INTEGER, minHeight = 0 }) => {
+    const [init, setInit] = React.useState(true);
+    React.useEffect(() => {
+        // We need to reset the height momentarily to get the correct scrollHeight for the textarea
+        const textAreaElement = textAreaRef.current;
+        if (textAreaElement) {
+            if (init) {
+                textAreaElement.style.minHeight = `${minHeight}px`;
+                if (maxHeight > minHeight) {
+                    textAreaElement.style.maxHeight = `${maxHeight}px`;
+                }
+                setInit(false);
+            }
+            textAreaElement.style.height = `${minHeight}px`;
+            const scrollHeight = textAreaElement.scrollHeight;
+            // We then set the height directly, outside of the render loop
+            // Trying to set this with state or a ref will segment an incorrect value.
+            if (scrollHeight > maxHeight) {
+                textAreaElement.style.height = `${maxHeight}px`;
+                textAreaElement.style.overflowY = 'auto';
+            }
+            else {
+                textAreaElement.style.height = `${scrollHeight}px`;
+                textAreaElement.style.overflowY = 'hidden';
+            }
+        }
+    }, [textAreaRef.current, triggerAutoSize]);
+};
+export function AutosizeTextarea({ maxHeight = Number.MAX_SAFE_INTEGER, minHeight = 36, className, onChange, value, ref, ...props }) {
+    const textAreaRef = React.useRef(null);
+    const [triggerAutoSize, setTriggerAutoSize] = React.useState('');
+    useAutosizeTextArea({
+        textAreaRef,
+        triggerAutoSize: triggerAutoSize,
+        maxHeight,
+        minHeight
+    });
+    useImperativeHandle(ref, () => textAreaRef.current);
+    React.useEffect(() => {
+        setTriggerAutoSize(value);
+    }, [props?.defaultValue, value]);
+    return (_jsx("textarea", { ...props, value: value, ref: textAreaRef, className: cn('border-input-border ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full overflow-y-hidden rounded-md border bg-transparent px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden', 'read-only:bg-muted read-only:cursor-default read-only:caret-transparent read-only:opacity-50 read-only:select-text read-only:focus:ring-0 read-only:focus:ring-offset-0 read-only:focus:outline-hidden', 'disabled:cursor-not-allowed disabled:opacity-50', className), onChange: (e) => {
+            setTriggerAutoSize(e.target.value);
+            onChange?.(e);
+        } }));
+}

package/dist/esm/components/ui/avatar/index.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+declare function Avatar({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Root>): React.JSX.Element;
+declare function AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>): React.JSX.Element;
+declare function AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): React.JSX.Element;
+export { Avatar, AvatarImage, AvatarFallback };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/avatar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/avatar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAIzD,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,qBAWnD;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAQpD;AAED,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,QAAQ,CAAC,qBAWvD;AAED,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}

package/dist/esm/components/ui/avatar/index.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { cn } from '../../../lib/utils.js';
+function Avatar({ className, ...props }) {
+    return (_jsx(AvatarPrimitive.Root, { "data-slot": "avatar", className: cn('relative flex size-10 shrink-0 overflow-hidden rounded-full', className), ...props }));
+}
+function AvatarImage({ className, ...props }) {
+    return (_jsx(AvatarPrimitive.Image, { "data-slot": "avatar-image", className: cn('aspect-square size-full', className), ...props }));
+}
+function AvatarFallback({ className, ...props }) {
+    return (_jsx(AvatarPrimitive.Fallback, { "data-slot": "avatar-fallback", className: cn('bg-muted flex size-full items-center justify-center rounded-full', className), ...props }));
+}
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/esm/components/ui/badge/index.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "secondary" | "outline" | "alert" | "destructive" | "success" | "active" | "inactive" | "error" | "info" | "purple" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type BadgeProps = React.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
+    asChild?: boolean;
+};
+declare function Badge({ className, variant, asChild, ...props }: BadgeProps): React.JSX.Element;
+export { Badge, badgeVariants };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/badge/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,aAAa;;8EA+BlB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,GACnD,YAAY,CAAC,OAAO,aAAa,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAE5D,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAUnE;AAED,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA"}

package/dist/esm/components/ui/badge/index.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils.js';
+import { Slot } from '@radix-ui/react-slot';
+const badgeVariants = cva('inline-flex items-center rounded-full border border-border px-2.5 py-0.5 text-sm font-medium transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2', {
+    variants: {
+        variant: {
+            default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
+            active: 'bg-system-success-surface text-system-success-h1a border-system-success-border py-[2px] px-3',
+            inactive: 'bg-muted text-foreground border-muted-foreground/40 py-[2px] px-3',
+            secondary: 'border-transparent bg-muted-foreground text-white dark:text-black',
+            destructive: 'border-transparent bg-red-500 text-primary-foreground hover:bg-red-500/80',
+            error: 'border-system-error-border bg-system-error-surface text-system-error-text px-[10px] py-1',
+            success: 'border-system-success-border bg-system-success-surface text-system-success-text px-[10px] py-1',
+            info: 'border-system-info-border bg-system-info-surface text-system-info-text px-[10px] py-1',
+            alert: 'border-system-alert-border bg-system-alert-surface text-system-alert-text px-[10px] py-1',
+            purple: 'border-system-purple-border bg-system-purple-surface text-system-purple-text px-[10px] py-1',
+            outline: 'text-foreground'
+        }
+    },
+    defaultVariants: {
+        variant: 'default'
+    }
+});
+function Badge({ className, variant, asChild, ...props }) {
+    const Comp = asChild ? Slot : 'span';
+    return (_jsx(Comp, { "data-slot": "badge", className: cn(badgeVariants({ variant }), className), ...props }));
+}
+export { Badge, badgeVariants };

package/dist/esm/components/ui/breadcrumb/index.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+declare function Breadcrumb({ ...props }: React.ComponentProps<'nav'>): React.JSX.Element;
+declare function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>): React.JSX.Element;
+declare function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare function BreadcrumbLink({ asChild, className, ...props }: React.ComponentProps<'a'> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+declare function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/breadcrumb/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/breadcrumb/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAE5D;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAQ1E;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAQ1E;AAED,iBAAS,cAAc,CAAC,EACtB,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,qBAUA;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAW5E;AAED,iBAAS,mBAAmB,CAAC,EAC3B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,qBAY5B;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,qBAa9B;AAED,OAAO,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EACnB,CAAA"}

package/dist/esm/components/ui/breadcrumb/index.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Slot } from '@radix-ui/react-slot';
+import { MoreHorizontal, Slash } from 'lucide-react';
+import { cn } from '../../../lib/utils.js';
+function Breadcrumb({ ...props }) {
+    return _jsx("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
+}
+function BreadcrumbList({ className, ...props }) {
+    return (_jsx("ol", { "data-slot": "breadcrumb-list", className: cn('breadcrumb-list', className), ...props }));
+}
+function BreadcrumbItem({ className, ...props }) {
+    return (_jsx("li", { "data-slot": "breadcrumb-item", className: cn('breadcrumb-item', className), ...props }));
+}
+function BreadcrumbLink({ asChild, className, ...props }) {
+    const Comp = asChild ? Slot : 'a';
+    return (_jsx(Comp, { "data-slot": "breadcrumb-link", className: cn('breadcrumb-link', className), ...props }));
+}
+function BreadcrumbPage({ className, ...props }) {
+    return (_jsx("span", { "data-slot": "breadcrumb-page", role: "link", "aria-disabled": "true", "aria-current": "page", className: cn('breadcrumb-page', className), ...props }));
+}
+function BreadcrumbSeparator({ children, className, ...props }) {
+    return (_jsx("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: cn('breadcrumb-separator', className), ...props, children: children ?? _jsx(Slash, {}) }));
+}
+function BreadcrumbEllipsis({ className, ...props }) {
+    return (_jsxs("span", { "data-slot": "breadcrumb-ellipsis", role: "presentation", "aria-hidden": "true", className: cn('flex h-9 w-9 items-center justify-center', className), ...props, children: [_jsx(MoreHorizontal, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "More" })] }));
+}
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis };

package/dist/esm/components/ui/button/index.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: ({
+    variant?: "plain" | "hoverLink" | "default" | "primary" | "secondary" | "tertiary" | "outline" | "link" | null | undefined;
+    fullWidth?: boolean | null | undefined;
+    size?: "default" | "small" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const iconVariants: (props?: ({
+    position?: "start" | "end" | "far-end" | null | undefined;
+    size?: "default" | "small" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type ButtonProps = React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+} & {
+    icon?: React.ReactNode;
+    iconPlacement?: 'start' | 'end' | 'far-end';
+    fullWidth?: boolean;
+    readOnly?: boolean;
+};
+declare function Button({ className, variant, size, asChild, icon, iconPlacement, fullWidth, readOnly, onClick, ...props }: ButtonProps): React.JSX.Element;
+export { Button, buttonVariants, iconVariants };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;;8EA0BlB,CAAA;AAEF,QAAA,MAAM,YAAY;;;8EAgBhB,CAAA;AAEF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GACtD,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,GAAG;IACF,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAEH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,IAAI,EACJ,aAAuB,EACvB,SAAiB,EACjB,QAAgB,EAChB,OAAO,EACP,GAAG,KAAK,EACT,EAAE,WAAW,qBAqCb;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,CAAA"}

package/dist/esm/components/ui/button/index.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Slot, Slottable } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils.js';
+const buttonVariants = cva('button-base button-disabled button-read-only', {
+    variants: {
+        variant: {
+            plain: 'button-plain',
+            hoverLink: 'hover:bg-accent text-foreground hover:text-accent-foreground font-normal',
+            default: 'button-primary',
+            primary: 'button-primary',
+            secondary: 'button-secondary',
+            tertiary: 'button-tertiary',
+            outline: 'button-outline',
+            link: 'button-link'
+        },
+        fullWidth: {
+            true: 'w-full',
+            false: 'w-fit'
+        },
+        size: {
+            default: '',
+            small: 'button-small'
+        }
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default'
+    }
+});
+const iconVariants = cva('', {
+    variants: {
+        position: {
+            start: 'mr-2',
+            end: 'ml-2',
+            'far-end': 'absolute right-2'
+        },
+        size: {
+            default: '[&>*]:size-6',
+            small: '[&>*]:size-4'
+        }
+    },
+    defaultVariants: {
+        position: 'start',
+        size: 'default'
+    }
+});
+function Button({ className, variant, size, asChild = false, icon, iconPlacement = 'start', fullWidth = false, readOnly = false, onClick, ...props }) {
+    const Comp = asChild ? Slot : 'button';
+    const handleClick = (e) => {
+        if (readOnly) {
+            e.preventDefault();
+            return;
+        }
+        onClick?.(e);
+    };
+    return (_jsxs(Comp, { className: cn(buttonVariants({ variant, size, fullWidth }), className), "data-read-only": readOnly, "data-slot": "button", ...props, onClick: handleClick, children: [icon && iconPlacement === 'start' && (_jsx("span", { className: cn(iconVariants({ position: iconPlacement, size })), children: icon })), _jsx(Slottable, { children: props.children }), icon && iconPlacement !== 'start' && (_jsx("span", { className: cn(iconVariants({ position: iconPlacement, size })), children: icon }))] }));
+}
+export { Button, buttonVariants, iconVariants };

package/dist/esm/components/ui/calendar/index.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { DayPicker, type DayButton } from 'react-day-picker';
+import { Button } from '../../../components/ui/button/index.js';
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React.ComponentProps<typeof Button>['variant'];
+}): React.JSX.Element;
+declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): React.JSX.Element;
+export { Calendar, CalendarDayButton };
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ui/calendar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/calendar/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EACL,SAAS,EAET,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAA;AAGzB,OAAO,EAAE,MAAM,EAAkB,MAAM,wBAAwB,CAAA;AAO/D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1C,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,SAAS,CAAC,CAAA;CAC/D,qBA0JA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,qBA2CxC;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAA"}