automoby-kit 1.0.13 → 1.0.15

package/dist/esm/Menu.js

@@ -1,120 +1 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import React, { useState, useRef, useEffect } from 'react';
-import cn from './utils.js';
-import { Typography } from './Typography.js';
-
-const Menu = React.forwardRef(({ buttonText, items, disabled = false, className, onOpenChange, isOpen: controlledIsOpen, 'aria-label': ariaLabel, ...props }, ref) => {
-    const [internalIsOpen, setInternalIsOpen] = useState(false);
-    const menuRef = useRef(null);
-    const buttonRef = useRef(null);
-    // Use controlled or uncontrolled state
-    const isOpen = controlledIsOpen !== undefined ? controlledIsOpen : internalIsOpen;
-    const handleToggle = () => {
-        if (disabled)
-            return;
-        const newIsOpen = !isOpen;
-        if (controlledIsOpen === undefined) {
-            setInternalIsOpen(newIsOpen);
-        }
-        onOpenChange?.(newIsOpen);
-    };
-    const handleItemClick = (item) => {
-        if (item.disabled)
-            return;
-        // Close menu after item click
-        if (controlledIsOpen === undefined) {
-            setInternalIsOpen(false);
-        }
-        onOpenChange?.(false);
-        // Execute item's onClick if provided
-        item.onClick?.();
-    };
-    // Close menu when clicking outside
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (menuRef.current &&
-                !menuRef.current.contains(event.target)) {
-                if (controlledIsOpen === undefined) {
-                    setInternalIsOpen(false);
-                }
-                onOpenChange?.(false);
-            }
-        };
-        if (isOpen) {
-            document.addEventListener('mousedown', handleClickOutside);
-            return () => {
-                document.removeEventListener('mousedown', handleClickOutside);
-            };
-        }
-        return undefined;
-    }, [isOpen, controlledIsOpen, onOpenChange]);
-    // Handle keyboard navigation
-    const handleKeyDown = (event) => {
-        if (disabled)
-            return;
-        switch (event.key) {
-            case 'Escape':
-                if (isOpen) {
-                    event.preventDefault();
-                    if (controlledIsOpen === undefined) {
-                        setInternalIsOpen(false);
-                    }
-                    onOpenChange?.(false);
-                    buttonRef.current?.focus();
-                }
-                break;
-            case 'ArrowDown':
-                if (!isOpen) {
-                    event.preventDefault();
-                    handleToggle();
-                }
-                break;
-            case 'Enter':
-            case ' ':
-                event.preventDefault();
-                handleToggle();
-                break;
-        }
-    };
-    const buttonClasses = cn(
-    // Base button styles matching Figma design
-    'inline-flex items-center justify-center', 'bg-white border border-[var(--color-neutral-light)]', 'rounded-[6px] px-[16px] py-[13px]', 'transition-colors duration-200', 
-    // Interactive states
-    'hover:bg-[var(--color-neutral-lighter)]', 'focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] focus:ring-offset-2', 
-    // Disabled state
-    {
-        'opacity-50 cursor-not-allowed': disabled,
-        'cursor-pointer': !disabled,
-    });
-    const dropdownClasses = cn(
-    // Base dropdown styles
-    'absolute top-full left-0 right-0 z-10 mt-[4px]', 'bg-white border border-[var(--color-neutral-light)]', 'rounded-[6px] py-[13px] px-[16px]', 'shadow-lg', 
-    // Animation
-    'transition-all duration-200', {
-        'opacity-100 translate-y-0 pointer-events-auto': isOpen,
-        'opacity-0 -translate-y-2 pointer-events-none': !isOpen,
-    });
-    const itemClasses = cn('block w-full text-right', 'transition-colors duration-200', 'hover:bg-[var(--color-neutral-lighter)] rounded-[4px] px-[8px] py-[4px] -mx-[8px]', 'focus:outline-none focus:bg-[var(--color-neutral-lighter)]');
-    return (jsx("div", { ref: ref, className: cn('relative inline-block', className), ...props, children: jsxs("div", { ref: menuRef, children: [jsx("button", { ref: buttonRef, type: "button", className: buttonClasses, onClick: handleToggle, onKeyDown: handleKeyDown, disabled: disabled, "aria-expanded": isOpen, "aria-haspopup": "true", "aria-label": ariaLabel || `منوی ${buttonText}`, children: jsx(Typography, { variant: "body-s-heavy", color: "neutral-darker", className: "text-right", children: buttonText }) }), jsx("div", { className: dropdownClasses, children: jsx("div", { className: "flex flex-col gap-[16px]", children: items.map((item) => {
-                            const content = (jsx(Typography, { variant: "body-s-heavy", color: item.disabled ? 'neutral-main' : 'neutral-darker', className: "text-right", children: item.label }));
-                            const commonProps = {
-                                className: cn(itemClasses, {
-                                    'opacity-50 cursor-not-allowed': item.disabled,
-                                    'cursor-pointer': !item.disabled,
-                                }),
-                                onClick: item.disabled
-                                    ? undefined
-                                    : () => handleItemClick(item),
-                                'aria-label': `منوی ${item.label}`,
-                            };
-                            // Render as link if href is provided
-                            if (item.href && !item.disabled) {
-                                return (jsx("a", { ...commonProps, href: item.href, role: "menuitem", tabIndex: isOpen ? 0 : -1, children: content }, item.id));
-                            }
-                            // Render as button
-                            return (jsx("button", { ...commonProps, type: "button", role: "menuitem", tabIndex: isOpen ? 0 : -1, disabled: item.disabled, children: content }, item.id));
-                        }) }) })] }) }));
-});
-Menu.displayName = 'Menu';
-
-export { Menu };
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import t,{useState as o,useRef as a,useEffect as n}from"react";import i from"./utils.js";import{Typography as l}from"./Typography.js";const s=t.forwardRef(({buttonText:t,items:s,disabled:d=!1,className:c,onOpenChange:u,isOpen:p,"aria-label":b,...f},m)=>{const[h,v]=o(!1),x=a(null),g=a(null),y=void 0!==p?p:h,handleToggle=()=>{if(d)return;const e=!y;void 0===p&&v(e),u?.(e)};n(()=>{const handleClickOutside=e=>{x.current&&!x.current.contains(e.target)&&(void 0===p&&v(!1),u?.(!1))};if(y)return document.addEventListener("mousedown",handleClickOutside),()=>{document.removeEventListener("mousedown",handleClickOutside)}},[y,p,u]);const w=i("inline-flex items-center justify-center","bg-white border border-[var(--color-neutral-light)]","rounded-[6px] px-[16px] py-[13px]","transition-colors duration-200","hover:bg-[var(--color-neutral-lighter)]","focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] focus:ring-offset-2",{"opacity-50 cursor-not-allowed":d,"cursor-pointer":!d}),k=i("absolute top-full left-0 right-0 z-10 mt-[4px]","bg-white border border-[var(--color-neutral-light)]","rounded-[6px] py-[13px] px-[16px]","shadow-lg","transition-all duration-200",{"opacity-100 translate-y-0 pointer-events-auto":y,"opacity-0 -translate-y-2 pointer-events-none":!y}),N=i("block w-full text-right","transition-colors duration-200","hover:bg-[var(--color-neutral-lighter)] rounded-[4px] px-[8px] py-[4px] -mx-[8px]","focus:outline-none focus:bg-[var(--color-neutral-lighter)]");return e("div",{ref:m,className:i("relative inline-block",c),...f,children:r("div",{ref:x,children:[e("button",{ref:g,type:"button",className:w,onClick:handleToggle,onKeyDown:e=>{if(!d)switch(e.key){case"Escape":y&&(e.preventDefault(),void 0===p&&v(!1),u?.(!1),g.current?.focus());break;case"ArrowDown":y||(e.preventDefault(),handleToggle());break;case"Enter":case" ":e.preventDefault(),handleToggle()}},disabled:d,"aria-expanded":y,"aria-haspopup":"true","aria-label":b||`منوی ${t}`,children:e(l,{variant:"body-s-heavy",color:"neutral-darker",className:"text-right",children:t})}),e("div",{className:k,children:e("div",{className:"flex flex-col gap-[16px]",children:s.map(r=>{const t=e(l,{variant:"body-s-heavy",color:r.disabled?"neutral-main":"neutral-darker",className:"text-right",children:r.label}),o={className:i(N,{"opacity-50 cursor-not-allowed":r.disabled,"cursor-pointer":!r.disabled}),onClick:r.disabled?void 0:()=>(e=>{e.disabled||(void 0===p&&v(!1),u?.(!1),e.onClick?.())})(r),"aria-label":`منوی ${r.label}`};return r.href&&!r.disabled?e("a",{...o,href:r.href,role:"menuitem",tabIndex:y?0:-1,children:t},r.id):e("button",{...o,type:"button",role:"menuitem",tabIndex:y?0:-1,disabled:r.disabled,children:t},r.id)})})})]})})});s.displayName="Menu";export{s as Menu};

package/dist/esm/Pagination.js

@@ -1,186 +1 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
-import cn from './utils.js';
-import { useMobile } from './contexts.js';
-import { c as createLucideIcon } from './createLucideIcon-D-q73LTT.js';
-import { C as ChevronLeft } from './chevron-left-Ck6O99eF.js';
-
-/**
- * @license lucide-react v0.522.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-const __iconNode$3 = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$3);
-
-/**
- * @license lucide-react v0.522.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-const __iconNode$2 = [
-  ["path", { d: "m11 17-5-5 5-5", key: "13zhaf" }],
-  ["path", { d: "m18 17-5-5 5-5", key: "h8a8et" }]
-];
-const ChevronsLeft = createLucideIcon("chevrons-left", __iconNode$2);
-
-/**
- * @license lucide-react v0.522.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-const __iconNode$1 = [
-  ["path", { d: "m6 17 5-5-5-5", key: "xnjwq" }],
-  ["path", { d: "m13 17 5-5-5-5", key: "17xmmf" }]
-];
-const ChevronsRight = createLucideIcon("chevrons-right", __iconNode$1);
-
-/**
- * @license lucide-react v0.522.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-
-
-const __iconNode = [
-  ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }],
-  ["circle", { cx: "19", cy: "12", r: "1", key: "1wjl8i" }],
-  ["circle", { cx: "5", cy: "12", r: "1", key: "1pcz8c" }]
-];
-const Ellipsis = createLucideIcon("ellipsis", __iconNode);
-
-function PaginationRoot({ className, ...props }) {
-    return (jsx("nav", { role: "navigation", "aria-label": "pagination", "data-slot": "pagination", className: cn('mx-auto flex w-full justify-center', className), ...props }));
-}
-function PaginationContent({ className, device, ...props }) {
-    return (jsx("ul", { "data-slot": "pagination-content", className: cn('flex flex-row items-center', device === 'mobile' ? 'gap-[6px]' : 'gap-2', className), ...props }));
-}
-function PaginationItem({ ...props }) {
-    return jsx("li", { "data-slot": "pagination-item", ...props });
-}
-function PaginationLink({ className, device, variant, isActive, ...props }) {
-    return (jsx("a", { "aria-current": isActive ? 'page' : undefined, "data-slot": "pagination-link", "data-active": isActive, className: cn(buttonVariants({
-            variant: variant === 'nextPrev' ? variant : isActive ? 'active' : 'outline',
-            device,
-        }), className), tabIndex: props['aria-disabled'] ? -1 : 0, ...props }));
-}
-function PaginationPrevious({ className, device, variant, ...props }) {
-    const isMobile = device === 'mobile';
-    const content = {
-        mobile: jsx(ChevronRight, { size: 18 }),
-        desktop: (jsxs(Fragment, { children: [jsx(ChevronsRight, { size: 20 }), " ", jsx("span", { children: "\u0642\u0628\u0644\u06CC" })] })),
-    };
-    return (jsx(PaginationLink, { "aria-label": "Go to previous page", className: !isMobile
-            ? 'flex justify-center items-center gap-2 w-[89px] h-[48px] ml-4'
-            : 'ml-2.5', device: device, variant: "nextPrev", ...props, children: device === 'mobile' ? content.mobile : content.desktop }));
-}
-function PaginationNext({ className, device, variant, ...props }) {
-    const isMobile = device === 'mobile';
-    const content = {
-        mobile: jsx(ChevronLeft, { size: 18 }),
-        desktop: (jsxs(Fragment, { children: [jsx("span", { children: "\u0628\u0639\u062F\u06CC" }), jsx(ChevronsLeft, { size: 20 })] })),
-    };
-    return (jsx(PaginationLink, { "aria-label": "Go to next page", className: !isMobile
-            ? 'flex justify-center items-center gap-2 w-[89px] h-[48px] mr-4'
-            : 'mr-2.5', device: device, variant: "nextPrev", ...props, children: device === 'mobile' ? content.mobile : content.desktop }));
-}
-function PaginationEllipsis({ className, ...props }) {
-    return (jsx("span", { "aria-hidden": true, "data-slot": "pagination-ellipsis", className: cn('flex size-9 items-center justify-center', className), ...props, children: jsx(Ellipsis, { className: "size-4" }) }));
-}
-function buttonVariants({ variant, device, }) {
-    const isMobile = device === 'mobile';
-    const base = cn({
-        'flex items-center justify-center rounded-[6px]': true,
-        'w-[40px] h-[40px] text-s font-heavy': isMobile,
-        'w-[48px] h-[48px] text-l font-heavy': !isMobile,
-    });
-    const variants = {
-        outline: 'border border-neutral-light bg-white text-neutral-darker',
-        active: 'bg-primary text-white',
-        nextPrev: 'border border-neutral-light bg-white text-neutral-darker',
-    };
-    return [base, variants[variant]].join(' ');
-}
-const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageChange, className, isMobile, ...navProps }) => {
-    const detectedIsMobile = useMobile();
-    const actualIsMobile = isMobile ?? detectedIsMobile;
-    const isControlled = controlledPage !== undefined;
-    const [internalPage, setInternalPage] = useState(defaultPage);
-    const page = isControlled ? controlledPage : internalPage;
-    const device = actualIsMobile ? 'mobile' : 'desktop';
-    useEffect(() => {
-        if (!isControlled)
-            setInternalPage(defaultPage);
-    }, [defaultPage, isControlled]);
-    const changePage = (newPage) => {
-        if (!isControlled)
-            setInternalPage(newPage);
-        onPageChange?.(newPage);
-    };
-    function renderPages() {
-        const items = [];
-        if (pageCount <= 5) {
-            for (let i = 1; i <= pageCount; i++) {
-                items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: "#", isActive: page === i, variant: "main", device: device, onClick: (e) => {
-                            e.preventDefault();
-                            if (page !== i)
-                                changePage(i);
-                        }, "aria-disabled": page === i, tabIndex: page === i ? -1 : 0, children: i }) }, i));
-            }
-        }
-        else {
-            // First page
-            items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: "#", isActive: page === 1, device: device, variant: "main", onClick: (e) => {
-                        e.preventDefault();
-                        if (page !== 1)
-                            changePage(1);
-                    }, "aria-disabled": page === 1, tabIndex: page === 1 ? -1 : 0, children: "1" }) }, 1));
-            // Ellipsis start
-            if (page > 3) {
-                items.push(jsx(PaginationItem, { children: jsx(PaginationEllipsis, {}) }, "start-ellipsis"));
-            }
-            // Middle pages
-            const start = Math.max(2, page - 1);
-            const end = Math.min(pageCount - 1, page + 1);
-            for (let i = start; i <= end; i++) {
-                items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: "#", isActive: page === i, device: device, variant: "main", onClick: (e) => {
-                            e.preventDefault();
-                            if (page !== i)
-                                changePage(i);
-                        }, "aria-disabled": page === i, tabIndex: page === i ? -1 : 0, children: i }) }, i));
-            }
-            // Ellipsis end
-            if (page < pageCount - 2) {
-                items.push(jsx(PaginationItem, { children: jsx(PaginationEllipsis, {}) }, "end-ellipsis"));
-            }
-            // Last page
-            items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: "#", isActive: page === pageCount, device: device, variant: "main", onClick: (e) => {
-                        e.preventDefault();
-                        if (page !== pageCount)
-                            changePage(pageCount);
-                    }, "aria-disabled": page === pageCount, tabIndex: page === pageCount ? -1 : 0, children: pageCount }) }, pageCount));
-        }
-        return items;
-    }
-    return (jsx(PaginationRoot, { className: className, ...navProps, children: jsxs(PaginationContent, { device: "mobile", children: [jsx(PaginationItem, { children: jsx(PaginationPrevious, { href: "#", onClick: (e) => {
-                            e.preventDefault();
-                            if (page > 1)
-                                changePage(page - 1);
-                        }, variant: "nextPrev", device: device, "aria-disabled": page === 1, tabIndex: page === 1 ? -1 : 0 }) }), renderPages(), jsx(PaginationItem, { children: jsx(PaginationNext, { href: "#", onClick: (e) => {
-                            e.preventDefault();
-                            if (page < pageCount)
-                                changePage(page + 1);
-                        }, variant: "nextPrev", device: device, "aria-disabled": page === pageCount, tabIndex: page === pageCount ? -1 : 0 }) })] }) }));
-};
-
-export { Pagination };
+"use client";import{jsx as e,jsxs as i,Fragment as a}from"react/jsx-runtime";import{useState as t,useEffect as n}from"react";import r from"./utils.js";import{useMobile as o}from"./contexts.js";import{c as l}from"./chunks/createLucideIcon-DGp0SoUT.js";import{C as c}from"./chunks/chevron-left-4HSuTes3.js";const s=l("chevron-right",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]]),d=l("chevrons-left",[["path",{d:"m11 17-5-5 5-5",key:"13zhaf"}],["path",{d:"m18 17-5-5 5-5",key:"h8a8et"}]]),m=l("chevrons-right",[["path",{d:"m6 17 5-5-5-5",key:"xnjwq"}],["path",{d:"m13 17 5-5-5-5",key:"17xmmf"}]]),p=l("ellipsis",[["circle",{cx:"12",cy:"12",r:"1",key:"41hilf"}],["circle",{cx:"19",cy:"12",r:"1",key:"1wjl8i"}],["circle",{cx:"5",cy:"12",r:"1",key:"1pcz8c"}]]);function PaginationRoot({className:i,...a}){return e("nav",{role:"navigation","aria-label":"pagination","data-slot":"pagination",className:r("mx-auto flex w-full justify-center",i),...a})}function PaginationContent({className:i,device:a,...t}){return e("ul",{"data-slot":"pagination-content",className:r("flex flex-row items-center","mobile"===a?"gap-[6px]":"gap-2",i),...t})}function PaginationItem({...i}){return e("li",{"data-slot":"pagination-item",...i})}function PaginationLink({className:i,device:a,variant:t,isActive:n,...o}){return e("a",{"aria-current":n?"page":void 0,"data-slot":"pagination-link","data-active":n,className:r(buttonVariants({variant:"nextPrev"===t?t:n?"active":"outline",device:a}),i),tabIndex:o["aria-disabled"]?-1:0,...o})}function PaginationPrevious({className:t,device:n,variant:r,...o}){const l="mobile"===n,c={mobile:e(s,{size:18}),desktop:i(a,{children:[e(m,{size:20})," ",e("span",{children:"قبلی"})]})};return e(PaginationLink,{"aria-label":"Go to previous page",className:l?"ml-2.5":"flex justify-center items-center gap-2 w-[89px] h-[48px] ml-4",device:n,variant:"nextPrev",...o,children:"mobile"===n?c.mobile:c.desktop})}function PaginationNext({className:t,device:n,variant:r,...o}){const l="mobile"===n,s={mobile:e(c,{size:18}),desktop:i(a,{children:[e("span",{children:"بعدی"}),e(d,{size:20})]})};return e(PaginationLink,{"aria-label":"Go to next page",className:l?"mr-2.5":"flex justify-center items-center gap-2 w-[89px] h-[48px] mr-4",device:n,variant:"nextPrev",...o,children:"mobile"===n?s.mobile:s.desktop})}function PaginationEllipsis({className:i,...a}){return e("span",{"aria-hidden":!0,"data-slot":"pagination-ellipsis",className:r("flex size-9 items-center justify-center",i),...a,children:e(p,{className:"size-4"})})}function buttonVariants({variant:e,device:i}){const a="mobile"===i;return[r({"flex items-center justify-center rounded-[6px]":!0,"w-[40px] h-[40px] text-s font-heavy":a,"w-[48px] h-[48px] text-l font-heavy":!a}),{outline:"border border-neutral-light bg-white text-neutral-darker",active:"bg-primary text-white",nextPrev:"border border-neutral-light bg-white text-neutral-darker"}[e]].join(" ")}const Pagination=({pageCount:a,page:r,defaultPage:l=1,onPageChange:c,className:s,isMobile:d,...m})=>{const p=o(),h=d??p,v=void 0!==r,[u,g]=t(l),f=v?r:u,x=h?"mobile":"desktop";n(()=>{v||g(l)},[l,v]);const changePage=e=>{v||g(e),c?.(e)};return e(PaginationRoot,{className:s,...m,children:i(PaginationContent,{device:"mobile",children:[e(PaginationItem,{children:e(PaginationPrevious,{href:"#",onClick:e=>{e.preventDefault(),f>1&&changePage(f-1)},variant:"nextPrev",device:x,"aria-disabled":1===f,tabIndex:1===f?-1:0})}),function(){const i=[];if(a<=5)for(let t=1;t<=a;t++)i.push(e(PaginationItem,{children:e(PaginationLink,{href:"#",isActive:f===t,variant:"main",device:x,onClick:e=>{e.preventDefault(),f!==t&&changePage(t)},"aria-disabled":f===t,tabIndex:f===t?-1:0,children:t})},t));else{i.push(e(PaginationItem,{children:e(PaginationLink,{href:"#",isActive:1===f,device:x,variant:"main",onClick:e=>{e.preventDefault(),1!==f&&changePage(1)},"aria-disabled":1===f,tabIndex:1===f?-1:0,children:"1"})},1)),f>3&&i.push(e(PaginationItem,{children:e(PaginationEllipsis,{})},"start-ellipsis"));const t=Math.max(2,f-1),n=Math.min(a-1,f+1);for(let a=t;a<=n;a++)i.push(e(PaginationItem,{children:e(PaginationLink,{href:"#",isActive:f===a,device:x,variant:"main",onClick:e=>{e.preventDefault(),f!==a&&changePage(a)},"aria-disabled":f===a,tabIndex:f===a?-1:0,children:a})},a));f<a-2&&i.push(e(PaginationItem,{children:e(PaginationEllipsis,{})},"end-ellipsis")),i.push(e(PaginationItem,{children:e(PaginationLink,{href:"#",isActive:f===a,device:x,variant:"main",onClick:e=>{e.preventDefault(),f!==a&&changePage(a)},"aria-disabled":f===a,tabIndex:f===a?-1:0,children:a})},a))}return i}(),e(PaginationItem,{children:e(PaginationNext,{href:"#",onClick:e=>{e.preventDefault(),f<a&&changePage(f+1)},variant:"nextPrev",device:x,"aria-disabled":f===a,tabIndex:f===a?-1:0})})]})})};export{Pagination};

package/dist/esm/RadioGroup.js

@@ -1,71 +1 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import React from 'react';
-import cn from './utils.js';
-import { useMobile } from './contexts.js';
-
-const RadioButton = ({ selected, disabled, isMobile, }) => {
-    const size = isMobile ? 'size-5' : 'size-6';
-    if (selected) {
-        return (jsxs("div", { className: cn('relative flex items-center justify-center', size), children: [jsx("div", { className: cn('absolute inset-0 rounded-full border-2', disabled
-                        ? 'bg-neutral-light border-neutral-light'
-                        : 'bg-primary border-primary') }), jsx("div", { className: cn('absolute rounded-full bg-white', isMobile ? 'inset-[5px]' : 'inset-1.5') })] }));
-    }
-    return (jsx("div", { className: cn('relative flex items-center justify-center', size), children: jsx("div", { className: cn('absolute inset-0 rounded-full border', isMobile ? 'border' : 'border-[1.5px]', disabled ? 'border-neutral-light' : 'border-midnight') }) }));
-};
-const RadioOptionComponent = ({ option, selected, disabled, onClick, name, isMobile = false, }) => {
-    const [isHovered, setIsHovered] = React.useState(false);
-    const handleKeyDown = (e) => {
-        if ((e.key === 'Enter' || e.key === ' ') && !disabled) {
-            e.preventDefault();
-            onClick();
-        }
-    };
-    const getBackgroundColor = () => {
-        if (disabled)
-            return 'bg-neutral-lighter';
-        if (selected)
-            return 'bg-primary-lightest';
-        if (isHovered)
-            return 'bg-primary-lightest/20';
-        return 'bg-white';
-    };
-    const getBorderColor = () => {
-        if (selected)
-            return 'border-primary';
-        return 'border-transparent';
-    };
-    const getTextColor = () => {
-        if (disabled)
-            return 'text-midnight';
-        if (selected)
-            return 'text-primary';
-        return 'text-neutral-dark';
-    };
-    const getShadow = () => {
-        if (disabled)
-            return '';
-        return 'shadow-[0px_2px_4px_0px_rgba(0,0,0,0.08)]';
-    };
-    return (jsx("div", { className: cn('relative rounded-lg border-[1.5px] cursor-pointer transition-all duration-200', getBackgroundColor(), getBorderColor(), getShadow(), disabled && 'cursor-not-allowed'), onClick: disabled ? undefined : onClick, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onKeyDown: handleKeyDown, tabIndex: disabled ? -1 : 0, role: "radio", "aria-checked": selected, "aria-disabled": disabled, children: jsx("div", { className: "flex flex-row items-center justify-end relative w-full", children: jsx("div", { className: cn('box-border flex flex-row items-center justify-end relative w-full', isMobile ? 'gap-2 px-4 py-3' : 'gap-4 px-6 py-4'), children: jsxs("div", { className: cn('flex flex-row items-center justify-end p-0 relative shrink-0', isMobile ? 'gap-2' : 'gap-3'), children: [jsx("input", { type: "radio", name: name, value: option.id, checked: selected, disabled: disabled, onChange: onClick, className: "sr-only", "aria-label": option.label }), jsx("div", { className: "flex flex-col gap-0.5 items-end justify-start p-0 relative shrink-0", children: jsx("div", { className: cn('font-sans font-bold text-nowrap text-right transition-colors duration-200', isMobile
-                                    ? 'text-[14px] leading-[24px]'
-                                    : 'text-[16px] leading-normal', getTextColor()), children: jsx("p", { className: "whitespace-pre", dir: "auto", children: option.label }) }) }), option.icon && (jsx("div", { className: cn('flex items-center justify-center shrink-0 transition-colors duration-200', isMobile ? 'size-6' : 'size-7', getTextColor()), children: option.icon })), jsx("div", { className: "flex flex-col items-start justify-start p-0 relative shrink-0", children: jsx(RadioButton, { selected: selected, disabled: disabled, isMobile: isMobile }) })] }) }) }) }));
-};
-const RadioGroup = React.forwardRef(({ options, value, onChange, name, disabled = false, className, isMobile, direction = 'vertical', ...props }, ref) => {
-    const detectedIsMobile = useMobile();
-    const actualIsMobile = isMobile ?? detectedIsMobile;
-    const handleOptionClick = (optionId) => {
-        if (!disabled && onChange) {
-            onChange(optionId);
-        }
-    };
-    const getContainerClasses = () => {
-        if (direction === 'horizontal') {
-            return cn('flex flex-row gap-2', actualIsMobile ? 'flex-wrap' : 'flex-nowrap', className);
-        }
-        return cn('flex flex-col gap-2', className);
-    };
-    return (jsx("div", { ref: ref, className: getContainerClasses(), role: "radiogroup", ...props, children: options.map((option) => (jsx(RadioOptionComponent, { option: option, selected: value === option.id, disabled: disabled || option.disabled, onClick: () => handleOptionClick(option.id), name: name, isMobile: actualIsMobile }, option.id))) }));
-});
-RadioGroup.displayName = 'RadioGroup';
-
-export { RadioGroup };
+"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import i from"react";import t from"./utils.js";import{useMobile as l}from"./contexts.js";const RadioButton=({selected:i,disabled:l,isMobile:a})=>{const s=a?"size-5":"size-6";return i?r("div",{className:t("relative flex items-center justify-center",s),children:[e("div",{className:t("absolute inset-0 rounded-full border-2",l?"bg-neutral-light border-neutral-light":"bg-primary border-primary")}),e("div",{className:t("absolute rounded-full bg-white",a?"inset-[5px]":"inset-1.5")})]}):e("div",{className:t("relative flex items-center justify-center",s),children:e("div",{className:t("absolute inset-0 rounded-full border",a?"border":"border-[1.5px]",l?"border-neutral-light":"border-midnight")})})},RadioOptionComponent=({option:l,selected:a,disabled:s,onClick:n,name:o,isMobile:d=!1})=>{const[c,p]=i.useState(!1),getTextColor=()=>s?"text-midnight":a?"text-primary":"text-neutral-dark";return e("div",{className:t("relative rounded-lg border-[1.5px] cursor-pointer transition-all duration-200",s?"bg-neutral-lighter":a?"bg-primary-lightest":c?"bg-primary-lightest/20":"bg-white",a?"border-primary":"border-transparent",s?"":"shadow-[0px_2px_4px_0px_rgba(0,0,0,0.08)]",s&&"cursor-not-allowed"),onClick:s?void 0:n,onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||s||(e.preventDefault(),n())},tabIndex:s?-1:0,role:"radio","aria-checked":a,"aria-disabled":s,children:e("div",{className:"flex flex-row items-center justify-end relative w-full",children:e("div",{className:t("box-border flex flex-row items-center justify-end relative w-full",d?"gap-2 px-4 py-3":"gap-4 px-6 py-4"),children:r("div",{className:t("flex flex-row items-center justify-end p-0 relative shrink-0",d?"gap-2":"gap-3"),children:[e("input",{type:"radio",name:o,value:l.id,checked:a,disabled:s,onChange:n,className:"sr-only","aria-label":l.label}),e("div",{className:"flex flex-col gap-0.5 items-end justify-start p-0 relative shrink-0",children:e("div",{className:t("font-sans font-bold text-nowrap text-right transition-colors duration-200",d?"text-[14px] leading-[24px]":"text-[16px] leading-normal",getTextColor()),children:e("p",{className:"whitespace-pre",dir:"auto",children:l.label})})}),l.icon&&e("div",{className:t("flex items-center justify-center shrink-0 transition-colors duration-200",d?"size-6":"size-7",getTextColor()),children:l.icon}),e("div",{className:"flex flex-col items-start justify-start p-0 relative shrink-0",children:e(RadioButton,{selected:a,disabled:s,isMobile:d})})]})})})})},a=i.forwardRef(({options:r,value:i,onChange:a,name:s,disabled:n=!1,className:o,isMobile:d,direction:c="vertical",...p},m)=>{const u=l(),x=d??u;return e("div",{ref:m,className:"horizontal"===c?t("flex flex-row gap-2",x?"flex-wrap":"flex-nowrap",o):t("flex flex-col gap-2",o),role:"radiogroup",...p,children:r.map(r=>e(RadioOptionComponent,{option:r,selected:i===r.id,disabled:n||r.disabled,onClick:()=>{return e=r.id,void(!n&&a&&a(e));var e},name:s,isMobile:x},r.id))})});a.displayName="RadioGroup";export{a as RadioGroup};

package/dist/esm/Tabs.js

@@ -1,52 +1 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import React from 'react';
-import cn from './utils.js';
-import { useMobile } from './contexts.js';
-
-// Helper functions moved outside component
-const handleTabClick = (tabId, disabled, onTabChange) => {
-    if (!disabled) {
-        onTabChange(tabId);
-    }
-};
-const handleKeyDown = (e, tabId, disabled, onTabChange) => {
-    if ((e.key === 'Enter' || e.key === ' ') && !disabled) {
-        e.preventDefault();
-        onTabChange(tabId);
-    }
-};
-const renderBadge = (count, isActive, disabled, isMobile) => {
-    if (count === undefined)
-        return null;
-    return (jsx("div", { className: cn('flex items-center justify-center rounded-[5px] font-sans font-bold text-white', 'transition-colors duration-200', isMobile
-            ? 'size-6 text-[14px] pt-0.5'
-            : 'size-[25px] text-[14px] pt-[3px]', disabled ? 'bg-midnight' : isActive ? 'bg-primary' : 'bg-neutral-main'), children: jsx("p", { className: "leading-[24px] whitespace-pre", dir: "auto", children: count }) }));
-};
-const renderTabContent = (item, isActive, isMobile) => {
-    const hasCount = item.count !== undefined;
-    return (jsxs("div", { className: cn('flex flex-row items-center justify-start transition-colors duration-200', isMobile ? 'gap-1.5' : 'gap-1.5'), children: [hasCount && renderBadge(item.count, isActive, item.disabled, isMobile), jsx("div", { className: cn('font-sans text-nowrap text-right transition-colors duration-200', isMobile ? 'text-[14px]' : isActive ? 'text-[16px]' : 'text-[18px]', item.disabled
-                    ? 'font-normal text-midnight'
-                    : isActive
-                        ? 'font-bold text-primary'
-                        : 'font-normal text-neutral-main', isMobile
-                    ? 'leading-[24px]'
-                    : isActive
-                        ? 'leading-normal'
-                        : 'leading-[1.9]'), children: jsx("p", { className: "whitespace-pre", dir: "auto", children: item.label }) })] }));
-};
-const renderTab = (item, activeTab, isMobile, onTabChange) => {
-    const isActive = item.id === activeTab;
-    return (jsxs("div", { className: cn('box-border flex flex-col items-center justify-between relative shrink-0', 'cursor-pointer transition-all duration-200', isMobile ? 'h-12 px-3' : 'h-14 px-4', isActive
-            ? isMobile
-                ? 'pt-[11px] pb-0'
-                : 'pt-3.5 pb-0'
-            : 'py-0 justify-center', item.disabled && 'cursor-not-allowed opacity-50', !item.disabled && 'hover:opacity-80'), onClick: () => handleTabClick(item.id, item.disabled, onTabChange), onKeyDown: (e) => handleKeyDown(e, item.id, item.disabled, onTabChange), tabIndex: item.disabled ? -1 : 0, role: "tab", "aria-selected": isActive, "aria-disabled": item.disabled, children: [renderTabContent(item, isActive, isMobile), isActive && (jsx("div", { className: "bg-primary h-1 rounded-tl-[8px] rounded-tr-[8px] shrink-0 w-full" }))] }, item.id));
-};
-const Tabs = React.forwardRef(({ items, activeTab, onTabChange, className, isMobile, ...props }, ref) => {
-    const detectedIsMobile = useMobile();
-    const actualIsMobile = isMobile ?? detectedIsMobile;
-    return (jsxs("div", { ref: ref, className: cn('relative w-full', className), ...props, children: [jsx("div", { className: "box-border flex flex-row items-center justify-end p-0 relative w-full", children: items.map((item) => renderTab(item, activeTab, actualIsMobile, onTabChange)) }), jsx("div", { className: "absolute border-midnight-light border-[0px_0px_1px] border-solid bottom-[-0.5px] left-0 right-0 top-0 pointer-events-none" })] }));
-});
-Tabs.displayName = 'Tabs';
-
-export { Tabs };
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import i from"react";import r from"./utils.js";import{useMobile as a}from"./contexts.js";const renderBadge=(e,i,a,n)=>void 0===e?null:t("div",{className:r("flex items-center justify-center rounded-[5px] font-sans font-bold text-white","transition-colors duration-200",n?"size-6 text-[14px] pt-0.5":"size-[25px] text-[14px] pt-[3px]",a?"bg-midnight":i?"bg-primary":"bg-neutral-main"),children:t("p",{className:"leading-[24px] whitespace-pre",dir:"auto",children:e})}),renderTabContent=(i,a,n)=>{const o=void 0!==i.count;return e("div",{className:r("flex flex-row items-center justify-start transition-colors duration-200","gap-1.5"),children:[o&&renderBadge(i.count,a,i.disabled,n),t("div",{className:r("font-sans text-nowrap text-right transition-colors duration-200",n?"text-[14px]":a?"text-[16px]":"text-[18px]",i.disabled?"font-normal text-midnight":a?"font-bold text-primary":"font-normal text-neutral-main",n?"leading-[24px]":a?"leading-normal":"leading-[1.9]"),children:t("p",{className:"whitespace-pre",dir:"auto",children:i.label})})]})},n=i.forwardRef(({items:i,activeTab:n,onTabChange:o,className:l,isMobile:s,...d},p)=>{const c=a(),x=s??c;return e("div",{ref:p,className:r("relative w-full",l),...d,children:[t("div",{className:"box-border flex flex-row items-center justify-end p-0 relative w-full",children:i.map(i=>((i,a,n,o)=>{const l=i.id===a;return e("div",{className:r("box-border flex flex-col items-center justify-between relative shrink-0","cursor-pointer transition-all duration-200",n?"h-12 px-3":"h-14 px-4",l?n?"pt-[11px] pb-0":"pt-3.5 pb-0":"py-0 justify-center",i.disabled&&"cursor-not-allowed opacity-50",!i.disabled&&"hover:opacity-80"),onClick:()=>((e,t,i)=>{t||i(e)})(i.id,i.disabled,o),onKeyDown:e=>((e,t,i,r)=>{"Enter"!==e.key&&" "!==e.key||i||(e.preventDefault(),r(t))})(e,i.id,i.disabled,o),tabIndex:i.disabled?-1:0,role:"tab","aria-selected":l,"aria-disabled":i.disabled,children:[renderTabContent(i,l,n),l&&t("div",{className:"bg-primary h-1 rounded-tl-[8px] rounded-tr-[8px] shrink-0 w-full"})]},i.id)})(i,n,x,o))}),t("div",{className:"absolute border-midnight-light border-[0px_0px_1px] border-solid bottom-[-0.5px] left-0 right-0 top-0 pointer-events-none"})]})});n.displayName="Tabs";export{n as Tabs};

package/dist/esm/Typography.js

@@ -1,60 +1 @@
-import React from 'react';
-import cn from './utils.js';
-
-const variantClasses = {
-    // Headings with Fat weight (900)
-    h1: 'text-[36px] font-[var(--font-weight-fat)]',
-    h2: 'text-[32px] font-[var(--font-weight-fat)]',
-    h3: 'text-[28px] font-[var(--font-weight-fat)]',
-    h4: 'text-[24px] font-[var(--font-weight-heavy)]',
-    h5: 'text-[22px] font-[var(--font-weight-heavy)]',
-    h6: 'text-[20px] font-[var(--font-weight-heavy)]',
-    // Body Copy with specific weight variants
-    'body-xl-heavy': 'text-[20px] font-[var(--font-weight-heavy)]',
-    'body-l-heavy': 'text-[18px] font-[var(--font-weight-heavy)]',
-    'body-l-bold': 'text-[18px] font-[var(--font-weight-bold)]',
-    'body-l-medium': 'text-[18px] font-[var(--font-weight-medium)]',
-    'body-m-heavy': 'text-[16px] font-[var(--font-weight-heavy)]',
-    'body-m-bold': 'text-[16px] font-[var(--font-weight-bold)]',
-    'body-m-medium': 'text-[16px] font-[var(--font-weight-medium)]',
-    'body-s-heavy': 'text-[14px] font-[var(--font-weight-heavy)]',
-    'body-s-bold': 'text-[14px] font-[var(--font-weight-bold)]',
-    'body-s-medium': 'text-[14px] font-[var(--font-weight-medium)]',
-    'body-ms-bold': 'text-[13px] font-[var(--font-weight-bold)]',
-    'body-ms-medium': 'text-[13px] font-[var(--font-weight-medium)]',
-    'body-xs-bold': 'text-[12px] font-[var(--font-weight-bold)]',
-    'body-xs-medium': 'text-[12px] font-[var(--font-weight-medium)]',
-    'body-t-bold': 'text-[10px] font-[var(--font-weight-bold)]',
-    'body-t-medium': 'text-[10px] font-[var(--font-weight-medium)]',
-    'body-ss-medium': 'text-[9px] font-[var(--font-weight-medium)]',
-};
-// Export for reuse in other components
-const getTypographyClasses = (variant) => {
-    return variantClasses[variant];
-};
-const colorClasses = {
-    primary: 'text-[var(--color-primary)]',
-    secondary: 'text-[var(--color-secondary)]',
-    'neutral-darker': 'text-[var(--color-neutral-darker)]',
-    'neutral-dark': 'text-[var(--color-neutral-dark)]',
-    'neutral-main': 'text-[var(--color-neutral-main)]',
-    white: 'text-[var(--color-white)]',
-    inherit: 'text-inherit',
-};
-const getDefaultElement = (variant) => {
-    if (variant.startsWith('h'))
-        return variant.split('-')[0]; // h1, h2, etc.
-    return 'p';
-};
-const Typography = React.forwardRef(({ variant = 'body-m-medium', color = 'inherit', as, className, children, ...props }, ref) => {
-    const Element = as || getDefaultElement(variant);
-    return React.createElement(Element, {
-        ref,
-        className: cn(variantClasses[variant], colorClasses[color], 'leading-[var(--leading-default)]', // 180% line height
-        className),
-        ...props,
-    }, children);
-});
-Typography.displayName = 'Typography';
-
-export { Typography, getTypographyClasses };
+import t from"react";import e from"./utils.js";const o={h1:"text-[36px] font-[var(--font-weight-fat)]",h2:"text-[32px] font-[var(--font-weight-fat)]",h3:"text-[28px] font-[var(--font-weight-fat)]",h4:"text-[24px] font-[var(--font-weight-heavy)]",h5:"text-[22px] font-[var(--font-weight-heavy)]",h6:"text-[20px] font-[var(--font-weight-heavy)]","body-xl-heavy":"text-[20px] font-[var(--font-weight-heavy)]","body-l-heavy":"text-[18px] font-[var(--font-weight-heavy)]","body-l-bold":"text-[18px] font-[var(--font-weight-bold)]","body-l-medium":"text-[18px] font-[var(--font-weight-medium)]","body-m-heavy":"text-[16px] font-[var(--font-weight-heavy)]","body-m-bold":"text-[16px] font-[var(--font-weight-bold)]","body-m-medium":"text-[16px] font-[var(--font-weight-medium)]","body-s-heavy":"text-[14px] font-[var(--font-weight-heavy)]","body-s-bold":"text-[14px] font-[var(--font-weight-bold)]","body-s-medium":"text-[14px] font-[var(--font-weight-medium)]","body-ms-bold":"text-[13px] font-[var(--font-weight-bold)]","body-ms-medium":"text-[13px] font-[var(--font-weight-medium)]","body-xs-bold":"text-[12px] font-[var(--font-weight-bold)]","body-xs-medium":"text-[12px] font-[var(--font-weight-medium)]","body-t-bold":"text-[10px] font-[var(--font-weight-bold)]","body-t-medium":"text-[10px] font-[var(--font-weight-medium)]","body-ss-medium":"text-[9px] font-[var(--font-weight-medium)]"},getTypographyClasses=t=>o[t],a={primary:"text-[var(--color-primary)]",secondary:"text-[var(--color-secondary)]","neutral-darker":"text-[var(--color-neutral-darker)]","neutral-dark":"text-[var(--color-neutral-dark)]","neutral-main":"text-[var(--color-neutral-main)]",white:"text-[var(--color-white)]",inherit:"text-inherit"},r=t.forwardRef(({variant:r="body-m-medium",color:n="inherit",as:i,className:d,children:x,...f},h)=>{const m=i||(t=>t.startsWith("h")?t.split("-")[0]:"p")(r);return t.createElement(m,{ref:h,className:e(o[r],a[n],"leading-[var(--leading-default)]",d),...f},x)});r.displayName="Typography";export{r as Typography,getTypographyClasses};