automoby-kit 1.0.70 → 1.0.72

package/dist/cjs/Button.js

@@ -1 +1 @@
-"use client";"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("./utils.js"),a=require("./Typography.js");const i={sm:"px-4 py-2",md:"px-4 py-2.5",lg:"px-4 py-3",xl:"px-5 py-3"},n={sm:"body-s-bold",md:"body-m-bold",lg:"body-l-bold",xl:"body-xl-heavy"},l={primary:"\n    bg-primary text-white\n    hover:bg-primary-dark\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",secondary:"\n    bg-primary-lightest text-primary-dark\n    hover:bg-primary-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",tertiary:"\n    bg-white border border-primary-light text-primary\n    hover:bg-neutral-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",ghost:"\n    bg-transparent text-primary\n    hover:bg-primary-lightest\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  "},s=r.forwardRef(({className:r,variant:s="primary",size:d="md",icon:o,iconPosition:b="right",children:g,loading:p=!1,disabled:y,textVariant:m,...h},u)=>{const x=m||n[d];return e.jsxs("button",{ref:u,type:"button",className:t("inline-flex items-center justify-center rounded-lg transition-colors duration-200",i[d],l[s],a.getTypographyClasses(x),y&&"opacity-50 pointer-events-none",r),disabled:y||p,...h,children:[o&&"left"===b&&e.jsx("span",{className:"mr-2 flex items-center",children:o}),p?"...":g,o&&"right"===b&&e.jsx("span",{className:"ml-2 flex items-center",children:o})]})});s.displayName="Button",exports.Button=s;
+"use client";"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("./utils.js"),a=require("./Typography.js");const i={sm:"px-4 py-2",md:"px-4 py-2.5",lg:"px-4 py-3",xl:"px-5 py-3"},n={sm:"body-s-bold",md:"body-m-bold",lg:"body-l-bold",xl:"body-xl-heavy"},l={primary:"\n    bg-primary text-white\n    hover:bg-primary-dark\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",secondary:"\n    bg-primary-lightest text-primary-dark\n    hover:bg-primary-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",tertiary:"\n    bg-white border border-primary-light text-primary\n    hover:bg-neutral-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",ghost:"\n    bg-transparent text-primary\n    hover:bg-primary-lightest\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  "},s=r.forwardRef(({className:r,variant:s="primary",size:d="md",icon:o,iconPosition:b="right",children:p,loading:g=!1,disabled:y,textVariant:m,type:h="button",...u},x)=>{const c=m||n[d];return e.jsxs("button",{ref:x,type:h,className:t("inline-flex items-center justify-center rounded-lg transition-colors duration-200",i[d],l[s],a.getTypographyClasses(c),y&&"opacity-50 pointer-events-none",r),disabled:y||g,...u,children:[o&&"left"===b&&e.jsx("span",{className:"mr-2 flex items-center",children:o}),g?"...":p,o&&"right"===b&&e.jsx("span",{className:"ml-2 flex items-center",children:o})]})});s.displayName="Button",exports.Button=s;

package/dist/cjs/Drawer.js

@@ -1 +1 @@
-"use client";"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("react-dom"),l=require("./utils.js"),n=require("./contexts.js");const o=t.forwardRef(({children:o,direction:a="bottom",fullScreen:u=!1,isOpen:s=!1,onClose:i,className:d,isMobile:c,keepMounted:f,...b},m)=>{const[h,w]=t.useState(!1),x=n.useMobile(),p=c??x,y=t.useRef(null),v=t.useRef(null);t.useEffect(()=>{w(!0)},[]),t.useEffect(()=>{const handleEscape=e=>{"Escape"===e.key&&s&&i&&i()};return s&&(document.addEventListener("keydown",handleEscape),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",handleEscape),document.body.style.overflow="auto"}},[s,i]);const g=l("fixed inset-0 z-[10000000001] transition-all duration-300",{"bg-neutral-darker/50 backdrop-blur-sm":s,"bg-transparent pointer-events-none":!s,"hidden invisible absolute inset-0":f&&!h}),k=l("fixed bg-white shadow-2xl transition-all duration-300 ease-out overflow-auto",(()=>{switch(a){case"top":return"top-0 left-0 right-0";case"bottom":default:return"bottom-0 left-0 right-0";case"left":return"top-0 left-0 bottom-0";case"right":return"top-0 right-0 bottom-0"}})(),(()=>{const e="top"===a||"bottom"===a;return u?"w-full h-full":e?"w-full max-h-[90vh]":"h-full max-w-[90vw]"})(),(()=>{if(!s)switch(a){case"top":return"-translate-y-full";case"bottom":default:return"translate-y-full";case"left":return"-translate-x-full";case"right":return"translate-x-full"}return"translate-x-0 translate-y-0"})(),{"rounded-t-2xl":"bottom"===a&&!u,"rounded-b-2xl":"top"===a&&!u,"rounded-r-2xl":"left"===a&&!u,"rounded-l-2xl":"right"===a&&!u,"p-6":!p,"p-4":p},d),E=e.jsx("div",{ref:y,className:g,onClick:e=>{!u&&i&&y.current&&e.target===y.current&&i()},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||!u&&i&&y.current&&e.target===y.current&&i()},tabIndex:-1,role:"button","aria-label":"Close drawer","aria-hidden":!s,children:e.jsx("div",{ref:m||v,className:k,role:"dialog","aria-modal":"true","aria-label":"Drawer",...b,children:o})});return f||h?f&&!h?E:s?r.createPortal(E,document.body):null:null});o.displayName="Drawer",exports.Drawer=o;
+"use client";"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("react-dom"),n=require("./utils.js"),l=require("./contexts.js");const o=t.forwardRef(({children:o,direction:a="bottom",fullScreen:u=!1,isOpen:s=!1,onClose:i,className:d,isMobile:c,keepMounted:f,zIndex:b,...m},h)=>{const[w,x]=t.useState(!1),p=l.useMobile(),y=c??p,v=t.useRef(null),g=t.useRef(null);t.useEffect(()=>{x(!0)},[]),t.useEffect(()=>{const handleEscape=e=>{"Escape"===e.key&&s&&i&&i()};return s&&(document.addEventListener("keydown",handleEscape),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",handleEscape),document.body.style.overflow="auto"}},[s,i]);const k=n("fixed inset-0 transition-all duration-300",`z-[${b??"10000000001"}]`),E=n(k,{"bg-neutral-darker/50 backdrop-blur-sm":s,"bg-transparent pointer-events-none":!s,"hidden invisible absolute inset-0":f&&!w}),j=n("fixed bg-white shadow-2xl transition-all duration-300 ease-out overflow-auto",(()=>{switch(a){case"top":return"top-0 left-0 right-0";case"bottom":default:return"bottom-0 left-0 right-0";case"left":return"top-0 left-0 bottom-0";case"right":return"top-0 right-0 bottom-0"}})(),(()=>{const e="top"===a||"bottom"===a;return u?"w-full h-full":e?"w-full max-h-[90vh]":"h-full max-w-[90vw]"})(),(()=>{if(!s)switch(a){case"top":return"-translate-y-full";case"bottom":default:return"translate-y-full";case"left":return"-translate-x-full";case"right":return"translate-x-full"}return"translate-x-0 translate-y-0"})(),{"rounded-t-2xl":"bottom"===a&&!u,"rounded-b-2xl":"top"===a&&!u,"rounded-r-2xl":"left"===a&&!u,"rounded-l-2xl":"right"===a&&!u,"p-6":!y,"p-4":y},d),q=e.jsx("div",{ref:v,className:E,onClick:e=>{!u&&i&&v.current&&e.target===v.current&&i()},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||!u&&i&&v.current&&e.target===v.current&&i()},tabIndex:-1,role:"button","aria-label":"Close drawer","aria-hidden":!s,children:e.jsx("div",{ref:h||g,className:j,role:"dialog","aria-modal":"true","aria-label":"Drawer",...m,children:o})});return f||w?f&&!w?q:s?r.createPortal(q,document.body):null:null});o.displayName="Drawer",exports.Drawer=o;

package/dist/esm/Button.js

@@ -1 +1 @@
-"use client";import{jsxs as r,jsx as e}from"react/jsx-runtime";import t from"react";import i from"./utils.js";import{getTypographyClasses as a}from"./Typography.js";const n={sm:"px-4 py-2",md:"px-4 py-2.5",lg:"px-4 py-3",xl:"px-5 py-3"},l={sm:"body-s-bold",md:"body-m-bold",lg:"body-l-bold",xl:"body-xl-heavy"},d={primary:"\n    bg-primary text-white\n    hover:bg-primary-dark\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",secondary:"\n    bg-primary-lightest text-primary-dark\n    hover:bg-primary-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",tertiary:"\n    bg-white border border-primary-light text-primary\n    hover:bg-neutral-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",ghost:"\n    bg-transparent text-primary\n    hover:bg-primary-lightest\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  "},s=t.forwardRef(({className:t,variant:s="primary",size:o="md",icon:m,iconPosition:b="right",children:p,loading:g=!1,disabled:y,textVariant:h,...c},x)=>r("button",{ref:x,type:"button",className:i("inline-flex items-center justify-center rounded-lg transition-colors duration-200",n[o],d[s],a(h||l[o]),y&&"opacity-50 pointer-events-none",t),disabled:y||g,...c,children:[m&&"left"===b&&e("span",{className:"mr-2 flex items-center",children:m}),g?"...":p,m&&"right"===b&&e("span",{className:"ml-2 flex items-center",children:m})]}));s.displayName="Button";export{s as Button};
+"use client";import{jsxs as r,jsx as e}from"react/jsx-runtime";import t from"react";import i from"./utils.js";import{getTypographyClasses as a}from"./Typography.js";const n={sm:"px-4 py-2",md:"px-4 py-2.5",lg:"px-4 py-3",xl:"px-5 py-3"},l={sm:"body-s-bold",md:"body-m-bold",lg:"body-l-bold",xl:"body-xl-heavy"},d={primary:"\n    bg-primary text-white\n    hover:bg-primary-dark\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",secondary:"\n    bg-primary-lightest text-primary-dark\n    hover:bg-primary-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",tertiary:"\n    bg-white border border-primary-light text-primary\n    hover:bg-neutral-lighter\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  ",ghost:"\n    bg-transparent text-primary\n    hover:bg-primary-lightest\n    disabled:bg-neutral-light disabled:text-neutral-darker\n  "},s=t.forwardRef(({className:t,variant:s="primary",size:o="md",icon:m,iconPosition:p="right",children:b,loading:g=!1,disabled:y,textVariant:h,type:c="button",...x},u)=>r("button",{ref:u,type:c,className:i("inline-flex items-center justify-center rounded-lg transition-colors duration-200",n[o],d[s],a(h||l[o]),y&&"opacity-50 pointer-events-none",t),disabled:y||g,...x,children:[m&&"left"===p&&e("span",{className:"mr-2 flex items-center",children:m}),g?"...":b,m&&"right"===p&&e("span",{className:"ml-2 flex items-center",children:m})]}));s.displayName="Button";export{s as Button};

package/dist/esm/Drawer.js

@@ -1 +1 @@
-"use client";import{jsx as t}from"react/jsx-runtime";import e,{useState as r,useRef as o,useEffect as n}from"react";import{createPortal as l}from"react-dom";import a from"./utils.js";import{useMobile as i}from"./contexts.js";const s=e.forwardRef(({children:e,direction:s="bottom",fullScreen:u=!1,isOpen:d=!1,onClose:c,className:m,isMobile:f,keepMounted:b,...p},h)=>{const[w,x]=r(!1),y=i(),g=f??y,v=o(null),k=o(null);n(()=>{x(!0)},[]),n(()=>{const handleEscape=t=>{"Escape"===t.key&&d&&c&&c()};return d&&(document.addEventListener("keydown",handleEscape),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",handleEscape),document.body.style.overflow="auto"}},[d,c]);const E=a("fixed inset-0 z-[10000000001] transition-all duration-300",{"bg-neutral-darker/50 backdrop-blur-sm":d,"bg-transparent pointer-events-none":!d,"hidden invisible absolute inset-0":b&&!w}),N=a("fixed bg-white shadow-2xl transition-all duration-300 ease-out overflow-auto",(()=>{switch(s){case"top":return"top-0 left-0 right-0";case"bottom":default:return"bottom-0 left-0 right-0";case"left":return"top-0 left-0 bottom-0";case"right":return"top-0 right-0 bottom-0"}})(),(()=>{const t="top"===s||"bottom"===s;return u?"w-full h-full":t?"w-full max-h-[90vh]":"h-full max-w-[90vw]"})(),(()=>{if(!d)switch(s){case"top":return"-translate-y-full";case"bottom":default:return"translate-y-full";case"left":return"-translate-x-full";case"right":return"translate-x-full"}return"translate-x-0 translate-y-0"})(),{"rounded-t-2xl":"bottom"===s&&!u,"rounded-b-2xl":"top"===s&&!u,"rounded-r-2xl":"left"===s&&!u,"rounded-l-2xl":"right"===s&&!u,"p-6":!g,"p-4":g},m),j=t("div",{ref:v,className:E,onClick:t=>{!u&&c&&v.current&&t.target===v.current&&c()},onKeyDown:t=>{"Enter"!==t.key&&" "!==t.key||!u&&c&&v.current&&t.target===v.current&&c()},tabIndex:-1,role:"button","aria-label":"Close drawer","aria-hidden":!d,children:t("div",{ref:h||k,className:N,role:"dialog","aria-modal":"true","aria-label":"Drawer",...p,children:e})});return b||w?b&&!w?j:d?l(j,document.body):null:null});s.displayName="Drawer";export{s as Drawer};
+"use client";import{jsx as e}from"react/jsx-runtime";import t,{useState as r,useRef as o,useEffect as n}from"react";import{createPortal as l}from"react-dom";import a from"./utils.js";import{useMobile as i}from"./contexts.js";const s=t.forwardRef(({children:t,direction:s="bottom",fullScreen:u=!1,isOpen:d=!1,onClose:c,className:m,isMobile:f,keepMounted:b,zIndex:p,...h},w)=>{const[x,y]=r(!1),g=i(),v=f??g,k=o(null),E=o(null);n(()=>{y(!0)},[]),n(()=>{const handleEscape=e=>{"Escape"===e.key&&d&&c&&c()};return d&&(document.addEventListener("keydown",handleEscape),document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",handleEscape),document.body.style.overflow="auto"}},[d,c]);const N=a("fixed inset-0 transition-all duration-300",`z-[${p??"10000000001"}]`),j=a(N,{"bg-neutral-darker/50 backdrop-blur-sm":d,"bg-transparent pointer-events-none":!d,"hidden invisible absolute inset-0":b&&!x}),C=a("fixed bg-white shadow-2xl transition-all duration-300 ease-out overflow-auto",(()=>{switch(s){case"top":return"top-0 left-0 right-0";case"bottom":default:return"bottom-0 left-0 right-0";case"left":return"top-0 left-0 bottom-0";case"right":return"top-0 right-0 bottom-0"}})(),(()=>{const e="top"===s||"bottom"===s;return u?"w-full h-full":e?"w-full max-h-[90vh]":"h-full max-w-[90vw]"})(),(()=>{if(!d)switch(s){case"top":return"-translate-y-full";case"bottom":default:return"translate-y-full";case"left":return"-translate-x-full";case"right":return"translate-x-full"}return"translate-x-0 translate-y-0"})(),{"rounded-t-2xl":"bottom"===s&&!u,"rounded-b-2xl":"top"===s&&!u,"rounded-r-2xl":"left"===s&&!u,"rounded-l-2xl":"right"===s&&!u,"p-6":!v,"p-4":v},m),D=e("div",{ref:k,className:j,onClick:e=>{!u&&c&&k.current&&e.target===k.current&&c()},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||!u&&c&&k.current&&e.target===k.current&&c()},tabIndex:-1,role:"button","aria-label":"Close drawer","aria-hidden":!d,children:e("div",{ref:w||E,className:C,role:"dialog","aria-modal":"true","aria-label":"Drawer",...h,children:t})});return b||x?b&&!x?D:d?l(D,document.body):null:null});s.displayName="Drawer";export{s as Drawer};

package/dist/types/Button.js

@@ -37,9 +37,11 @@ const variantClasses = {
     disabled:bg-neutral-light disabled:text-neutral-darker
   `,
 };
-const Button = React.forwardRef(({ className, variant = 'primary', size = 'md', icon, iconPosition = 'right', children, loading = false, disabled, textVariant, ...props }, ref) => {
+const Button = React.forwardRef(({ className, variant = 'primary', size = 'md', icon, iconPosition = 'right', children, loading = false, disabled, textVariant, type = 'button', ...props }, ref) => {
     const finalTextVariant = textVariant || defaultTextVariants[size];
-    return (jsxs("button", { ref: ref, type: "button", className: cn('inline-flex items-center justify-center rounded-lg transition-colors duration-200', sizeClasses[size], variantClasses[variant], getTypographyClasses(finalTextVariant), disabled && 'opacity-50 pointer-events-none', className), disabled: disabled || loading, ...props, children: [icon && iconPosition === 'left' && (jsx("span", { className: "mr-2 flex items-center", children: icon })), loading ? '...' : children, icon && iconPosition === 'right' && (jsx("span", { className: "ml-2 flex items-center", children: icon }))] }));
+    return (jsxs("button", { ref: ref, 
+        // eslint-disable-next-line react/button-has-type
+        type: type, className: cn('inline-flex items-center justify-center rounded-lg transition-colors duration-200', sizeClasses[size], variantClasses[variant], getTypographyClasses(finalTextVariant), disabled && 'opacity-50 pointer-events-none', className), disabled: disabled || loading, ...props, children: [icon && iconPosition === 'left' && (jsx("span", { className: "mr-2 flex items-center", children: icon })), loading ? '...' : children, icon && iconPosition === 'right' && (jsx("span", { className: "ml-2 flex items-center", children: icon }))] }));
 });
 Button.displayName = 'Button';
 

package/dist/types/Drawer.js

@@ -4,7 +4,7 @@ import { createPortal } from 'react-dom';
 import cn from './utils.js';
 import { useMobile } from './contexts.js';
 
-const Drawer = React.forwardRef(({ children, direction = 'bottom', fullScreen = false, isOpen = false, onClose, className, isMobile, keepMounted, ...props }, ref) => {
+const Drawer = React.forwardRef(({ children, direction = 'bottom', fullScreen = false, isOpen = false, onClose, className, isMobile, keepMounted, zIndex, ...props }, ref) => {
     const [isClient, setIsClient] = useState(false);
     const detectedIsMobile = useMobile();
     const actualIsMobile = isMobile ?? detectedIsMobile;
@@ -91,7 +91,10 @@ const Drawer = React.forwardRef(({ children, direction = 'bottom', fullScreen =
         }
         return 'h-full max-w-[90vw]';
     };
-    const baseOverlayClasses = 'fixed inset-0 z-[10000000001] transition-all duration-300';
+    const defaultZIndex = '10000000001';
+    const zIndexValue = zIndex ?? defaultZIndex;
+    const zIndexClass = `z-[${zIndexValue}]`;
+    const baseOverlayClasses = cn('fixed inset-0 transition-all duration-300', zIndexClass);
     const baseDrawerClasses = 'fixed bg-white shadow-2xl transition-all duration-300 ease-out overflow-auto';
     const overlayClasses = cn(baseOverlayClasses, {
         'bg-neutral-darker/50 backdrop-blur-sm': isOpen,

package/dist/types/components/Button/Button.d.ts

@@ -12,6 +12,7 @@ export interface ButtonProps {
     loading?: boolean;
     disabled?: boolean;
     children?: React.ReactNode;
-    onClick?: () => void;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    type?: 'button' | 'submit' | 'reset';
 }
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/types/components/Drawer/Drawer.d.ts

@@ -16,6 +16,10 @@ export type DrawerProps = {
      * This allows SSR rendering but keeps it visually hidden until opened.
      */
     keepMounted?: boolean;
+    /**
+     * Custom z-index value for the overlay. Defaults to 10000000001.
+     */
+    zIndex?: number | string;
 };
 declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<HTMLDivElement>>;
 export { Drawer };

package/dist/types/components/Drawer/Drawer.stories.d.ts

@@ -47,6 +47,13 @@ declare const _default: {
             };
             description: string;
         };
+        zIndex: {
+            name: string;
+            control: {
+                type: string;
+            };
+            description: string;
+        };
         children: {
             table: {
                 disable: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "automoby-kit",
-  "version": "1.0.70",
+  "version": "1.0.72",
   "description": "A comprehensive React UI component library - created in war 2025",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",