@classytic/fluid 0.2.4 → 0.3.2

package/package.json

@@ -1,30 +1,63 @@
 {
   "name": "@classytic/fluid",
-  "version": "0.2.4",
+  "version": "0.3.2",
   "type": "module",
   "description": "Fluid UI - Custom components built on shadcn/ui and base ui by Classytic",
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "types": "./dist/index.d.mts",
+      "default": "./dist/index.mjs"
     },
-    "./layout": {
-      "types": "./dist/layout.d.ts",
-      "import": "./dist/layout.js"
+    "./client/hooks": {
+      "types": "./dist/client/hooks.d.mts",
+      "default": "./dist/client/hooks.mjs"
+    },
+    "./client/core": {
+      "types": "./dist/client/core.d.mts",
+      "default": "./dist/client/core.mjs"
+    },
+    "./client/table": {
+      "types": "./dist/client/table.d.mts",
+      "default": "./dist/client/table.mjs"
+    },
+    "./client/theme": {
+      "types": "./dist/client/theme.d.mts",
+      "default": "./dist/client/theme.mjs"
+    },
+    "./client/error": {
+      "types": "./dist/client/error.d.mts",
+      "default": "./dist/client/error.mjs"
+    },
+    "./client/calendar": {
+      "types": "./dist/client/calendar.d.mts",
+      "default": "./dist/client/calendar.mjs"
+    },
+    "./forms": {
+      "types": "./dist/forms.d.mts",
+      "default": "./dist/forms.mjs"
     },
     "./dashboard": {
-      "types": "./dist/dashboard.d.ts",
-      "import": "./dist/dashboard.js"
+      "types": "./dist/dashboard.d.mts",
+      "default": "./dist/dashboard.mjs"
     },
     "./compact": {
-      "types": "./dist/compact.d.ts",
-      "import": "./dist/compact.js"
+      "types": "./dist/compact.d.mts",
+      "default": "./dist/compact.mjs"
     },
     "./search": {
-      "types": "./dist/search.d.ts",
-      "import": "./dist/search.js"
+      "types": "./dist/search.d.mts",
+      "default": "./dist/search.mjs"
+    },
+    "./command": {
+      "types": "./dist/command.d.mts",
+      "default": "./dist/command.mjs"
+    },
+    "./layouts": {
+      "types": "./dist/layouts.d.mts",
+      "default": "./dist/layouts.mjs"
     },
     "./styles.css": "./styles.css",
     "./animations.css": "./animations.css"
@@ -32,35 +65,36 @@
   "files": [
     "dist",
     "styles.css",
-    "animations.css"
+    "animations.css",
+    "LICENSE"
   ],
   "scripts": {
-    "build": "tsup && node scripts/add-use-client.js",
-    "dev": "tsup --watch",
+    "build": "tsdown",
+    "dev": "tsdown --watch",
     "typecheck": "tsc --noEmit",
+    "lint": "tsc --noEmit",
     "clean": "rimraf dist",
-    "prepublishOnly": "npm run build"
+    "prepublishOnly": "npm run clean && npm run build"
   },
   "peerDependencies": {
-    "react": ">=19.0.0",
-    "react-dom": ">=19.0.0",
-    "lucide-react": ">=0.560.0",
-    "class-variance-authority": ">=0.7.0",
-    "clsx": ">=2.1.0",
-    "tailwind-merge": ">=2.2.0",
-    "@tanstack/react-table": ">=8.21.0",
-    "next": ">=15.0.0",
-    "next-themes": ">=0.4.0",
-    "react-hook-form": ">=7.54.0",
-    "date-fns": ">=4.1.0"
+    "@tanstack/react-table": "^8.21.0",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.0",
+    "date-fns": "^4.1.0",
+    "lucide-react": ">=0.460.0",
+    "next": "^15.0.0 || ^16.0.0",
+    "next-themes": "^0.4.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-error-boundary": "^4.0.0 || ^5.0.0 || ^6.0.0",
+    "react-hook-form": "^7.54.0",
+    "tailwind-merge": "^2.2.0 || ^3.0.0",
+    "vaul": "^1.0.0"
   },
   "peerDependenciesMeta": {
     "@tanstack/react-table": {
       "optional": true
     },
-    "next": {
-      "optional": true
-    },
     "next-themes": {
       "optional": true
     },
@@ -69,26 +103,32 @@
     },
     "date-fns": {
       "optional": true
+    },
+    "react-error-boundary": {
+      "optional": true
+    },
+    "vaul": {
+      "optional": true
     }
   },
   "devDependencies": {
+    "@tanstack/react-table": "^8.21.0",
     "@types/node": "^22.0.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "react": ">=19.0.0",
-    "react-dom": ">=19.0.0",
-    "tsup": "^8.5.0",
-    "typescript": "^5.7.0",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.0",
+    "date-fns": "^4.1.0",
+    "lucide-react": "^0.460.0",
+    "next-themes": "^0.4.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-error-boundary": "^6.1.1",
+    "react-hook-form": "^7.54.0",
     "rimraf": "^5.0.0",
-    "lucide-react": ">=0.560.0",
-    "class-variance-authority": ">=0.7.0",
-    "clsx": ">=2.1.0",
-    "tailwind-merge": ">=2.2.0",
-    "@tanstack/react-table": ">=8.21.0",
-    "next": ">=15.0.0",
-    "next-themes": ">=0.4.0",
-    "react-hook-form": ">=7.54.0",
-    "date-fns": ">=4.1.0"
+    "tailwind-merge": "^3.5.0",
+    "tsdown": "^0.21.0-beta.2",
+    "typescript": "^5.7.0"
   },
   "publishConfig": {
     "access": "public"

package/styles.css

@@ -8,8 +8,8 @@
  * @import "@classytic/fluid/styles.css";
  */
 
-/* Scan fluid dist folder for Tailwind classes */
-@source "./dist";
+/* Scan only compiled JS for Tailwind classes (skip .d.mts type defs) */
+@source "./dist/**/*.mjs";
 
 /* Animation tokens, keyframes & reduced-motion */
 @import "./animations.css";

package/dist/chunk-GUHK2DTW.js

@@ -1,15 +0,0 @@
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-
-var __defProp = Object.defineProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-export { __export, cn };
-//# sourceMappingURL=chunk-GUHK2DTW.js.map
-//# sourceMappingURL=chunk-GUHK2DTW.js.map

package/dist/chunk-GUHK2DTW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/utils.ts"],"names":[],"mappings":";;;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC7B","file":"chunk-GUHK2DTW.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n"]}

package/dist/chunk-H3NFL3GJ.js

@@ -1,57 +0,0 @@
-import { cn } from './chunk-GUHK2DTW.js';
-import { jsx } from 'react/jsx-runtime';
-
-var backgrounds = {
-  default: "bg-background",
-  muted: "bg-muted",
-  primary: "bg-primary text-primary-foreground",
-  transparent: "bg-transparent"
-};
-var paddings = {
-  none: "",
-  sm: "py-8 md:py-12",
-  md: "py-12 md:py-16",
-  lg: "py-16 md:py-24",
-  xl: "py-24 md:py-32"
-};
-function Section({
-  id,
-  children,
-  className,
-  background = "default",
-  padding = "sm"
-}) {
-  return /* @__PURE__ */ jsx(
-    "section",
-    {
-      id,
-      className: cn(backgrounds[background], paddings[padding], className),
-      children
-    }
-  );
-}
-var maxWidthClasses = {
-  sm: "max-w-screen-sm",
-  md: "max-w-screen-md",
-  lg: "max-w-screen-lg",
-  xl: "max-w-screen-xl",
-  "2xl": "max-w-screen-2xl",
-  "4xl": "max-w-4xl",
-  "5xl": "max-w-5xl",
-  "6xl": "max-w-6xl",
-  "7xl": "max-w-7xl",
-  full: "max-w-full"
-};
-function Container({
-  children,
-  className,
-  maxWidth = "7xl"
-}) {
-  const isFullWidth = maxWidth === "full";
-  const baseClass = isFullWidth ? "w-full px-4 sm:px-6 lg:px-10" : "mx-auto px-4 sm:px-6 lg:px-8";
-  return /* @__PURE__ */ jsx("div", { className: cn(baseClass, !isFullWidth && maxWidthClasses[maxWidth], className), children });
-}
-
-export { Container, Section };
-//# sourceMappingURL=chunk-H3NFL3GJ.js.map
-//# sourceMappingURL=chunk-H3NFL3GJ.js.map

package/dist/chunk-H3NFL3GJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/layout/section.tsx","../src/layout/container.tsx"],"names":["jsx"],"mappings":";;;AAcA,IAAM,WAAA,GAA0C;AAAA,EAC9C,OAAA,EAAS,eAAA;AAAA,EACT,KAAA,EAAO,UAAA;AAAA,EACP,OAAA,EAAS,oCAAA;AAAA,EACT,WAAA,EAAa;AACf,CAAA;AAEA,IAAM,QAAA,GAAoC;AAAA,EACxC,IAAA,EAAM,EAAA;AAAA,EACN,EAAA,EAAI,eAAA;AAAA,EACJ,EAAA,EAAI,gBAAA;AAAA,EACJ,EAAA,EAAI,gBAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEO,SAAS,OAAA,CAAQ;AAAA,EACtB,EAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA,GAAa,SAAA;AAAA,EACb,OAAA,GAAU;AACZ,CAAA,EAAiB;AACf,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,SAAA,EAAW,GAAG,WAAA,CAAY,UAAU,GAAG,QAAA,CAAS,OAAO,GAAG,SAAS,CAAA;AAAA,MAElE;AAAA;AAAA,GACH;AAEJ;ACjCA,IAAM,eAAA,GAA4C;AAAA,EAChD,EAAA,EAAI,iBAAA;AAAA,EACJ,EAAA,EAAI,iBAAA;AAAA,EACJ,EAAA,EAAI,iBAAA;AAAA,EACJ,EAAA,EAAI,iBAAA;AAAA,EACJ,KAAA,EAAO,kBAAA;AAAA,EACP,KAAA,EAAO,WAAA;AAAA,EACP,KAAA,EAAO,WAAA;AAAA,EACP,KAAA,EAAO,WAAA;AAAA,EACP,KAAA,EAAO,WAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;AAEO,SAAS,SAAA,CAAU;AAAA,EACxB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,GAAW;AACb,CAAA,EAAmB;AACjB,EAAA,MAAM,cAAc,QAAA,KAAa,MAAA;AACjC,EAAA,MAAM,SAAA,GAAY,cACd,8BAAA,GACA,8BAAA;AAEJ,EAAA,uBACEA,GAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,SAAA,EAAW,CAAC,WAAA,IAAe,eAAA,CAAgB,QAAQ,CAAA,EAAG,SAAS,GAC/E,QAAA,EACH,CAAA;AAEJ","file":"chunk-H3NFL3GJ.js","sourcesContent":["import { cn } from \"../utils\";\r\nimport type { ReactNode } from \"react\";\r\n\r\ntype Background = \"default\" | \"muted\" | \"primary\" | \"transparent\";\r\ntype Padding = \"none\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\r\n\r\nexport interface SectionProps {\r\n  id?: string;\r\n  children: ReactNode;\r\n  className?: string;\r\n  background?: Background;\r\n  padding?: Padding;\r\n}\r\n\r\nconst backgrounds: Record<Background, string> = {\r\n  default: \"bg-background\",\r\n  muted: \"bg-muted\",\r\n  primary: \"bg-primary text-primary-foreground\",\r\n  transparent: \"bg-transparent\",\r\n};\r\n\r\nconst paddings: Record<Padding, string> = {\r\n  none: \"\",\r\n  sm: \"py-8 md:py-12\",\r\n  md: \"py-12 md:py-16\",\r\n  lg: \"py-16 md:py-24\",\r\n  xl: \"py-24 md:py-32\",\r\n};\r\n\r\nexport function Section({\r\n  id,\r\n  children,\r\n  className,\r\n  background = \"default\",\r\n  padding = \"sm\",\r\n}: SectionProps) {\r\n  return (\r\n    <section\r\n      id={id}\r\n      className={cn(backgrounds[background], paddings[padding], className)}\r\n    >\r\n      {children}\r\n    </section>\r\n  );\r\n}\r\n","import { cn } from \"../utils\";\r\nimport type { ReactNode } from \"react\";\r\n\r\ntype MaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"4xl\" | \"5xl\" | \"6xl\" | \"7xl\" | \"full\";\r\n\r\nexport interface ContainerProps {\r\n  children: ReactNode;\r\n  className?: string;\r\n  maxWidth?: MaxWidth;\r\n}\r\n\r\nconst maxWidthClasses: Record<MaxWidth, string> = {\r\n  sm: \"max-w-screen-sm\",\r\n  md: \"max-w-screen-md\",\r\n  lg: \"max-w-screen-lg\",\r\n  xl: \"max-w-screen-xl\",\r\n  \"2xl\": \"max-w-screen-2xl\",\r\n  \"4xl\": \"max-w-4xl\",\r\n  \"5xl\": \"max-w-5xl\",\r\n  \"6xl\": \"max-w-6xl\",\r\n  \"7xl\": \"max-w-7xl\",\r\n  full: \"max-w-full\",\r\n};\r\n\r\nexport function Container({\r\n  children,\r\n  className,\r\n  maxWidth = \"7xl\",\r\n}: ContainerProps) {\r\n  const isFullWidth = maxWidth === \"full\";\r\n  const baseClass = isFullWidth\r\n    ? \"w-full px-4 sm:px-6 lg:px-10\"\r\n    : \"mx-auto px-4 sm:px-6 lg:px-8\";\r\n\r\n  return (\r\n    <div className={cn(baseClass, !isFullWidth && maxWidthClasses[maxWidth], className)}>\r\n      {children}\r\n    </div>\r\n  );\r\n}\r\n"]}

package/dist/chunk-J2YRTQE4.js

@@ -1,293 +0,0 @@
-import { cn } from './chunk-GUHK2DTW.js';
-import * as React from 'react';
-import { memo, useMemo, useCallback } from 'react';
-import { LoaderIcon } from 'lucide-react';
-import { Button } from '@/components/ui/button';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription, SheetFooter } from '@/components/ui/sheet';
-
-var MOBILE_BREAKPOINT = 768;
-function useIsMobile() {
-  const [isMobile, setIsMobile] = React.useState(void 0);
-  React.useEffect(() => {
-    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
-    const onChange = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    };
-    mql.addEventListener("change", onChange);
-    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    return () => mql.removeEventListener("change", onChange);
-  }, []);
-  return !!isMobile;
-}
-function ClientSubmitButton({
-  children,
-  disabled,
-  loading = false,
-  loadingText,
-  className,
-  variant,
-  size,
-  form,
-  ...props
-}) {
-  const isDisabled = loading || disabled;
-  const content = loading && loadingText ? loadingText : children;
-  return /* @__PURE__ */ jsxs(
-    Button,
-    {
-      type: "submit",
-      form,
-      "aria-disabled": isDisabled,
-      "aria-busy": loading,
-      className: cn("relative", className),
-      disabled: isDisabled,
-      variant,
-      size,
-      ...props,
-      children: [
-        content,
-        loading && /* @__PURE__ */ jsx("span", { className: "animate-spin absolute right-4", children: /* @__PURE__ */ jsx(LoaderIcon, {}) }),
-        /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "sr-only", role: "status", children: loading ? "Loading" : "Submit form" })
-      ]
-    }
-  );
-}
-var SIZE_VARIANTS = {
-  sm: "sm:!max-w-md",
-  default: "w-full sm:!max-w-md md:!max-w-lg",
-  lg: "w-full sm:!max-w-lg md:!max-w-2xl lg:!max-w-4xl",
-  xl: "w-full sm:!max-w-2xl md:!max-w-4xl lg:!max-w-5xl",
-  full: "w-full !max-w-full",
-  mobile: "w-[85%] !max-w-sm",
-  "mobile-nav": "!w-[300px] sm:!w-[350px]"
-};
-var getPadding = (size, type = "default") => {
-  const isFullSize = size === "full";
-  if (type === "header" || type === "footer") {
-    return isFullSize ? "px-6 lg:px-8" : "px-4";
-  }
-  return isFullSize ? "p-6 lg:p-8" : "p-4";
-};
-var SheetWrapper = memo(function SheetWrapper2({
-  open,
-  onOpenChange,
-  title,
-  description,
-  children,
-  footer,
-  header,
-  side = "right",
-  size = "default",
-  modal = true,
-  className,
-  headerClassName,
-  contentClassName,
-  footerClassName,
-  innerClassName,
-  hideHeader = false,
-  hideTitle = false,
-  hideDescription = false,
-  hideCloseButton = false,
-  disableContentPadding = false
-}) {
-  const computedClasses = useMemo(
-    () => ({
-      header: cn(
-        "border-b pb-4 pt-6",
-        getPadding(size, "header"),
-        headerClassName
-      ),
-      inner: cn(
-        "flex-1 overflow-y-auto",
-        !disableContentPadding && getPadding(size),
-        innerClassName
-      ),
-      footer: cn(
-        "border-t bg-muted/30 pt-4 pb-6 mt-auto",
-        getPadding(size, "footer"),
-        footerClassName
-      )
-    }),
-    [
-      size,
-      headerClassName,
-      innerClassName,
-      footerClassName,
-      disableContentPadding
-    ]
-  );
-  const shouldHideTitle = !!header || hideTitle;
-  const shouldHideDescription = !!header || hideDescription;
-  return /* @__PURE__ */ jsx(Sheet, { open, onOpenChange, modal, children: /* @__PURE__ */ jsxs(
-    SheetContent,
-    {
-      side,
-      showCloseButton: !hideCloseButton,
-      className: cn(
-        SIZE_VARIANTS[size],
-        "flex flex-col p-0",
-        contentClassName,
-        className
-      ),
-      children: [
-        !hideHeader && /* @__PURE__ */ jsxs(SheetHeader, { className: computedClasses.header, children: [
-          /* @__PURE__ */ jsx(SheetTitle, { className: shouldHideTitle ? "sr-only" : "", children: title || "Sheet" }),
-          description && /* @__PURE__ */ jsx(
-            SheetDescription,
-            {
-              className: shouldHideDescription ? "sr-only" : "",
-              children: description
-            }
-          ),
-          header
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: computedClasses.inner, children }),
-        footer && /* @__PURE__ */ jsx(SheetFooter, { className: computedClasses.footer, children: footer })
-      ]
-    }
-  ) });
-});
-var FormSheet = memo(function FormSheet2({
-  open,
-  onOpenChange,
-  title,
-  description,
-  children,
-  onSubmit,
-  onCancel,
-  submitLabel = "Submit",
-  cancelLabel = "Cancel",
-  submitDisabled = false,
-  submitLoading = false,
-  formId,
-  size = "lg",
-  ...props
-}) {
-  const handleCancel = useCallback(() => {
-    onCancel?.();
-    onOpenChange?.(false);
-  }, [onCancel, onOpenChange]);
-  const footer = useMemo(
-    () => /* @__PURE__ */ jsxs("div", { className: "flex flex-col sm:flex-row gap-2 w-full", children: [
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "button",
-          variant: "outline",
-          className: "flex-1",
-          onClick: handleCancel,
-          disabled: submitDisabled || submitLoading,
-          children: cancelLabel
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        ClientSubmitButton,
-        {
-          form: formId,
-          className: "flex-1",
-          disabled: submitDisabled,
-          loading: submitLoading,
-          loadingText: "Saving...",
-          children: submitLabel
-        }
-      )
-    ] }),
-    [
-      cancelLabel,
-      submitLabel,
-      submitDisabled,
-      submitLoading,
-      formId,
-      handleCancel
-    ]
-  );
-  return /* @__PURE__ */ jsx(
-    SheetWrapper,
-    {
-      open,
-      onOpenChange,
-      title,
-      description,
-      size,
-      footer,
-      ...props,
-      children
-    }
-  );
-});
-var ConfirmSheet = memo(function ConfirmSheet2({
-  open,
-  onOpenChange,
-  title = "Confirm Action",
-  description,
-  children,
-  onConfirm,
-  onCancel,
-  confirmLabel = "Confirm",
-  cancelLabel = "Cancel",
-  confirmVariant = "default",
-  confirmDisabled = false,
-  confirmLoading = false,
-  size = "sm",
-  ...props
-}) {
-  const handleConfirm = useCallback(() => {
-    onConfirm?.();
-  }, [onConfirm]);
-  const handleCancel = useCallback(() => {
-    onCancel?.();
-    onOpenChange?.(false);
-  }, [onCancel, onOpenChange]);
-  const footer = useMemo(
-    () => /* @__PURE__ */ jsxs("div", { className: "flex gap-2 w-full", children: [
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "button",
-          variant: "outline",
-          className: "flex-1",
-          onClick: handleCancel,
-          children: cancelLabel
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "button",
-          variant: confirmVariant,
-          className: "flex-1",
-          onClick: handleConfirm,
-          disabled: confirmDisabled || confirmLoading,
-          children: confirmLoading ? "Loading..." : confirmLabel
-        }
-      )
-    ] }),
-    [
-      cancelLabel,
-      confirmLabel,
-      confirmVariant,
-      confirmDisabled,
-      confirmLoading,
-      handleConfirm,
-      handleCancel
-    ]
-  );
-  return /* @__PURE__ */ jsx(
-    SheetWrapper,
-    {
-      open,
-      onOpenChange,
-      title,
-      description,
-      size,
-      footer,
-      ...props,
-      children
-    }
-  );
-});
-
-export { ClientSubmitButton, ConfirmSheet, FormSheet, SheetWrapper, useIsMobile };
-//# sourceMappingURL=chunk-J2YRTQE4.js.map
-//# sourceMappingURL=chunk-J2YRTQE4.js.map

package/dist/chunk-J2YRTQE4.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hooks/use-mobile.ts","../src/components/client-submit-button.tsx","../src/components/sheet-wrapper.tsx"],"names":["SheetWrapper","jsx","jsxs","FormSheet","Button","ConfirmSheet"],"mappings":"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","file":"chunk-J2YRTQE4.js","sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\n\r\nconst MOBILE_BREAKPOINT = 768;\r\n\r\nexport function useIsMobile() {\r\n  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);\r\n\r\n  React.useEffect(() => {\r\n    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);\r\n    const onChange = () => {\r\n      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\r\n    };\r\n    mql.addEventListener(\"change\", onChange);\r\n    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);\r\n    return () => mql.removeEventListener(\"change\", onChange);\r\n  }, []);\r\n\r\n  return !!isMobile;\r\n}\r\n","\"use client\";\r\n\r\nimport { ReactNode } from \"react\";\r\nimport { LoaderIcon } from \"lucide-react\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { cn } from \"../utils\";\r\n\r\nexport interface ClientSubmitButtonProps {\r\n  children: ReactNode;\r\n  disabled?: boolean;\r\n  loading?: boolean;\r\n  loadingText?: string;\r\n  className?: string;\r\n  variant?: \"default\" | \"destructive\" | \"outline\" | \"secondary\" | \"ghost\" | \"link\";\r\n  size?: \"default\" | \"sm\" | \"lg\" | \"icon\";\r\n  form?: string;\r\n}\r\n\r\nexport function ClientSubmitButton({\r\n  children,\r\n  disabled,\r\n  loading = false,\r\n  loadingText,\r\n  className,\r\n  variant,\r\n  size,\r\n  form,\r\n  ...props\r\n}: ClientSubmitButtonProps) {\r\n  const isDisabled = loading || disabled;\r\n  const content = loading && loadingText ? loadingText : children;\r\n\r\n  return (\r\n    <Button\r\n      type=\"submit\"\r\n      form={form}\r\n      aria-disabled={isDisabled}\r\n      aria-busy={loading}\r\n      className={cn(\"relative\", className)}\r\n      disabled={isDisabled}\r\n      variant={variant}\r\n      size={size}\r\n      {...props}\r\n    >\r\n      {content}\r\n      {loading && (\r\n        <span className=\"animate-spin absolute right-4\">\r\n          <LoaderIcon />\r\n        </span>\r\n      )}\r\n      <span aria-live=\"polite\" className=\"sr-only\" role=\"status\">\r\n        {loading ? \"Loading\" : \"Submit form\"}\r\n      </span>\r\n    </Button>\r\n  );\r\n}\r\n","\"use client\";\r\n\r\nimport { memo, useMemo, useCallback, type ReactNode } from \"react\";\r\nimport {\r\n  Sheet,\r\n  SheetContent,\r\n  SheetHeader,\r\n  SheetTitle,\r\n  SheetDescription,\r\n  SheetFooter,\r\n} from \"@/components/ui/sheet\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { ClientSubmitButton } from \"./client-submit-button\";\r\nimport { cn } from \"../utils\";\r\n\r\n// Size variants configuration\r\n// !important is required here because the base SheetContent uses data-attribute\r\n// selectors (data-[side=right]:sm:max-w-sm) which add CSS specificity that plain\r\n// utility classes cannot override via tailwind-merge.\r\nconst SIZE_VARIANTS = {\r\n  sm: \"sm:!max-w-md\",\r\n  default: \"w-full sm:!max-w-md md:!max-w-lg\",\r\n  lg: \"w-full sm:!max-w-lg md:!max-w-2xl lg:!max-w-4xl\",\r\n  xl: \"w-full sm:!max-w-2xl md:!max-w-4xl lg:!max-w-5xl\",\r\n  full: \"w-full !max-w-full\",\r\n  mobile: \"w-[85%] !max-w-sm\",\r\n  \"mobile-nav\": \"!w-[300px] sm:!w-[350px]\",\r\n} as const;\r\n\r\ntype SizeVariant = keyof typeof SIZE_VARIANTS;\r\n\r\nconst getPadding = (\r\n  size: SizeVariant,\r\n  type: \"default\" | \"header\" | \"footer\" = \"default\",\r\n) => {\r\n  const isFullSize = size === \"full\";\r\n\r\n  if (type === \"header\" || type === \"footer\") {\r\n    return isFullSize ? \"px-6 lg:px-8\" : \"px-4\";\r\n  }\r\n\r\n  return isFullSize ? \"p-6 lg:p-8\" : \"p-4\";\r\n};\r\n\r\nexport interface SheetWrapperProps {\r\n  open: boolean;\r\n  onOpenChange: (open: boolean) => void;\r\n  title?: string;\r\n  description?: string;\r\n  children?: ReactNode;\r\n  footer?: ReactNode;\r\n  header?: ReactNode;\r\n  side?: \"top\" | \"bottom\" | \"left\" | \"right\";\r\n  size?: SizeVariant;\r\n  modal?: boolean;\r\n  className?: string;\r\n  headerClassName?: string;\r\n  contentClassName?: string;\r\n  footerClassName?: string;\r\n  innerClassName?: string;\r\n  hideHeader?: boolean;\r\n  hideTitle?: boolean;\r\n  hideDescription?: boolean;\r\n  hideCloseButton?: boolean;\r\n  disableContentPadding?: boolean;\r\n}\r\n\r\nexport const SheetWrapper = memo(function SheetWrapper({\r\n  open,\r\n  onOpenChange,\r\n  title,\r\n  description,\r\n  children,\r\n  footer,\r\n  header,\r\n  side = \"right\",\r\n  size = \"default\",\r\n  modal = true,\r\n  className,\r\n  headerClassName,\r\n  contentClassName,\r\n  footerClassName,\r\n  innerClassName,\r\n  hideHeader = false,\r\n  hideTitle = false,\r\n  hideDescription = false,\r\n  hideCloseButton = false,\r\n  disableContentPadding = false,\r\n}: SheetWrapperProps) {\r\n  const computedClasses = useMemo(\r\n    () => ({\r\n      header: cn(\r\n        \"border-b pb-4 pt-6\",\r\n        getPadding(size, \"header\"),\r\n        headerClassName,\r\n      ),\r\n      inner: cn(\r\n        \"flex-1 overflow-y-auto\",\r\n        !disableContentPadding && getPadding(size),\r\n        innerClassName,\r\n      ),\r\n      footer: cn(\r\n        \"border-t bg-muted/30 pt-4 pb-6 mt-auto\",\r\n        getPadding(size, \"footer\"),\r\n        footerClassName,\r\n      ),\r\n    }),\r\n    [\r\n      size,\r\n      headerClassName,\r\n      innerClassName,\r\n      footerClassName,\r\n      disableContentPadding,\r\n    ],\r\n  );\r\n\r\n  const shouldHideTitle = !!header || hideTitle;\r\n  const shouldHideDescription = !!header || hideDescription;\r\n\r\n  return (\r\n    <Sheet open={open} onOpenChange={onOpenChange} modal={modal}>\r\n      <SheetContent\r\n        side={side}\r\n        showCloseButton={!hideCloseButton}\r\n        className={cn(\r\n          SIZE_VARIANTS[size],\r\n          \"flex flex-col p-0\",\r\n          contentClassName,\r\n          className,\r\n        )}\r\n      >\r\n        {!hideHeader && (\r\n          <SheetHeader className={computedClasses.header}>\r\n            <SheetTitle className={shouldHideTitle ? \"sr-only\" : \"\"}>\r\n              {title || \"Sheet\"}\r\n            </SheetTitle>\r\n            {description && (\r\n              <SheetDescription\r\n                className={shouldHideDescription ? \"sr-only\" : \"\"}\r\n              >\r\n                {description}\r\n              </SheetDescription>\r\n            )}\r\n            {header}\r\n          </SheetHeader>\r\n        )}\r\n\r\n        <div className={computedClasses.inner}>{children}</div>\r\n\r\n        {footer && (\r\n          <SheetFooter className={computedClasses.footer}>{footer}</SheetFooter>\r\n        )}\r\n      </SheetContent>\r\n    </Sheet>\r\n  );\r\n});\r\n\r\nexport interface FormSheetProps extends Omit<SheetWrapperProps, \"footer\"> {\r\n  onSubmit?: () => void;\r\n  onCancel?: () => void;\r\n  submitLabel?: string;\r\n  cancelLabel?: string;\r\n  submitDisabled?: boolean;\r\n  submitLoading?: boolean;\r\n  formId?: string;\r\n}\r\n\r\nexport const FormSheet = memo(function FormSheet({\r\n  open,\r\n  onOpenChange,\r\n  title,\r\n  description,\r\n  children,\r\n  onSubmit,\r\n  onCancel,\r\n  submitLabel = \"Submit\",\r\n  cancelLabel = \"Cancel\",\r\n  submitDisabled = false,\r\n  submitLoading = false,\r\n  formId,\r\n  size = \"lg\",\r\n  ...props\r\n}: FormSheetProps) {\r\n  const handleCancel = useCallback(() => {\r\n    onCancel?.();\r\n    onOpenChange?.(false);\r\n  }, [onCancel, onOpenChange]);\r\n\r\n  const footer = useMemo(\r\n    () => (\r\n      <div className=\"flex flex-col sm:flex-row gap-2 w-full\">\r\n        <Button\r\n          type=\"button\"\r\n          variant=\"outline\"\r\n          className=\"flex-1\"\r\n          onClick={handleCancel}\r\n          disabled={submitDisabled || submitLoading}\r\n        >\r\n          {cancelLabel}\r\n        </Button>\r\n        <ClientSubmitButton\r\n          form={formId}\r\n          className=\"flex-1\"\r\n          disabled={submitDisabled}\r\n          loading={submitLoading}\r\n          loadingText=\"Saving...\"\r\n        >\r\n          {submitLabel}\r\n        </ClientSubmitButton>\r\n      </div>\r\n    ),\r\n    [\r\n      cancelLabel,\r\n      submitLabel,\r\n      submitDisabled,\r\n      submitLoading,\r\n      formId,\r\n      handleCancel,\r\n    ],\r\n  );\r\n\r\n  return (\r\n    <SheetWrapper\r\n      open={open}\r\n      onOpenChange={onOpenChange}\r\n      title={title}\r\n      description={description}\r\n      size={size}\r\n      footer={footer}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </SheetWrapper>\r\n  );\r\n});\r\n\r\nexport interface ConfirmSheetProps extends Omit<SheetWrapperProps, \"footer\"> {\r\n  onConfirm?: () => void;\r\n  onCancel?: () => void;\r\n  confirmLabel?: string;\r\n  cancelLabel?: string;\r\n  confirmVariant?:\r\n    | \"default\"\r\n    | \"destructive\"\r\n    | \"outline\"\r\n    | \"secondary\"\r\n    | \"ghost\"\r\n    | \"link\";\r\n  confirmDisabled?: boolean;\r\n  confirmLoading?: boolean;\r\n}\r\n\r\nexport const ConfirmSheet = memo(function ConfirmSheet({\r\n  open,\r\n  onOpenChange,\r\n  title = \"Confirm Action\",\r\n  description,\r\n  children,\r\n  onConfirm,\r\n  onCancel,\r\n  confirmLabel = \"Confirm\",\r\n  cancelLabel = \"Cancel\",\r\n  confirmVariant = \"default\",\r\n  confirmDisabled = false,\r\n  confirmLoading = false,\r\n  size = \"sm\",\r\n  ...props\r\n}: ConfirmSheetProps) {\r\n  const handleConfirm = useCallback(() => {\r\n    onConfirm?.();\r\n  }, [onConfirm]);\r\n\r\n  const handleCancel = useCallback(() => {\r\n    onCancel?.();\r\n    onOpenChange?.(false);\r\n  }, [onCancel, onOpenChange]);\r\n\r\n  const footer = useMemo(\r\n    () => (\r\n      <div className=\"flex gap-2 w-full\">\r\n        <Button\r\n          type=\"button\"\r\n          variant=\"outline\"\r\n          className=\"flex-1\"\r\n          onClick={handleCancel}\r\n        >\r\n          {cancelLabel}\r\n        </Button>\r\n        <Button\r\n          type=\"button\"\r\n          variant={confirmVariant}\r\n          className=\"flex-1\"\r\n          onClick={handleConfirm}\r\n          disabled={confirmDisabled || confirmLoading}\r\n        >\r\n          {confirmLoading ? \"Loading...\" : confirmLabel}\r\n        </Button>\r\n      </div>\r\n    ),\r\n    [\r\n      cancelLabel,\r\n      confirmLabel,\r\n      confirmVariant,\r\n      confirmDisabled,\r\n      confirmLoading,\r\n      handleConfirm,\r\n      handleCancel,\r\n    ],\r\n  );\r\n\r\n  return (\r\n    <SheetWrapper\r\n      open={open}\r\n      onOpenChange={onOpenChange}\r\n      title={title}\r\n      description={description}\r\n      size={size}\r\n      footer={footer}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </SheetWrapper>\r\n  );\r\n});\r\n"]}