@sth87/shadcn-design-system 0.1.6 → 0.1.8

package/dist/cjs/components/ImageViewer/ImageViewer.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),F=require("lucide-react");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const I=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");typeof window<"u"&&Promise.resolve().then(()=>require("../../_virtual/index.cjs")).then(t=>t.index).then(t=>{t.default});const v=({images:t,visible:c=!1,onClose:i,activeIndex:o=0,onIndexChange:l,zoomSpeed:h=.1,disableKeyboardSupport:u=!1,noNavbar:d=!1,noToolbar:f=!1,rotatable:b=!0,scalable:g=!0,changeable:V=!0,noClose:N=!1,minScale:x=.1,maxScale:q=50,defaultScale:p=1,className:j,downloadable:P=!1,noImgDetails:C=!1,noResetZoomAfterChange:L=!1,drag:S=!1})=>{const[m,k]=r.useState(o),[w,U]=r.useState(null);r.useEffect(()=>{typeof window<"u"&&!w&&Promise.resolve().then(()=>require("../../_virtual/index.cjs")).then(s=>s.index).then(s=>{U(()=>s.default)})},[w]),r.useEffect(()=>{k(o)},[o]);const y=r.useCallback(()=>{i?.()},[i]),R=r.useCallback((s,n)=>{k(n),l?.(n)},[l]),T=r.useCallback(()=>{const s=t[m],n=s.downloadUrl||s.src,a=document.createElement("a");a.href=n,a.download=s.alt||`image-${m+1}`,fetch(n).then(E=>E.blob()).then(E=>{const O=window.URL.createObjectURL(E);a.href=O,document.body.appendChild(a),a.click(),document.body.removeChild(a),window.URL.revokeObjectURL(O)}).catch(()=>{})},[t,m]),D=t.map(s=>({src:s.src,alt:s.alt||"",downloadUrl:s.downloadUrl||s.src}));return w?e.jsx(w,{visible:c,onClose:y,onMaskClick:y,images:D,activeIndex:m,onChange:R,zoomSpeed:h,disableKeyboardSupport:u,noNavbar:d,noToolbar:f,rotatable:b,scalable:g,changeable:V,noClose:N,minScale:x,maxScale:q,defaultScale:p,className:I.cn("ds:image-viewer-antd-style",j),downloadable:P,noImgDetails:C,noResetZoomAfterChange:L,showTotal:!0,drag:S,customToolbar:s=>s.map(n=>n.key==="download"?{...n,actionType:void 0,onClick:void 0,render:e.jsx("button",{type:"button",className:"ds:react-viewer-icon ds:react-viewer-download",title:"Download",style:{background:"none",border:"none",cursor:"pointer",padding:0},onClick:a=>{a.preventDefault(),a.stopPropagation(),T()},children:e.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("path",{d:"M10 3v10m0 0l-4-4m4 4l4-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e.jsx("rect",{x:"4",y:"17",width:"12",height:"2",rx:"1",fill:"currentColor"})]})})}:n)}):null};v.displayName="ImageViewer";const G=({src:t,alt:c="",width:i,height:o,preview:l=!0,previewSrc:h,fallback:u,placeholder:d,className:f,wrapperClassName:b,onPreviewClick:g,onError:V,...N})=>{const[x,q]=r.useState(!0),[p,j]=r.useState(!1),[P,C]=r.useState(!1),L=()=>{q(!1),j(!1)},S=R=>{q(!1),j(!0),V?.(R)},m=()=>{l&&(C(!0),g?.())},k=()=>{C(!1)},w=x&&d,U=p&&u,y=l&&!x&&!p;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:I.cn("ds:ds-image-viewer-root ds:relative ds:inline-block",b),children:e.jsxs("div",{className:"ds:relative ds:inline-block",children:[w&&e.jsx("div",{className:"ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:bg-muted ds:animate-pulse",style:{width:i,height:o},children:d===!0?e.jsx("div",{className:"ds:w-8 ds:h-8 ds:border-2 ds:border-primary ds:border-t-transparent ds:rounded-full ds:animate-spin"}):d}),e.jsx("img",{src:U?u:t,alt:c,width:i,height:o,className:I.cn("ds:ds-image-viewer-img ds:max-w-full ds:h-auto ds:align-middle",x&&"ds:opacity-0",f),onLoad:L,onError:S,...N}),y&&e.jsx("div",{onClick:m,className:I.cn("ds:ds-image-viewer-mask ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:opacity-0 ds:hover:opacity-100 ds:transition-opacity ds:cursor-pointer","ds:bg-black/50 ds:backdrop-blur-sm"),children:e.jsxs("div",{className:"ds:text-white ds:text-sm ds:flex ds:items-center ds:gap-2",children:[e.jsx(F.ZoomIn,{className:"ds:w-5 ds:h-5"}),e.jsx("span",{children:"Preview"})]})})]})}),e.jsx(v,{images:[{src:h||t,alt:c}],visible:P,onClose:k,rotatable:!0,scalable:!0,downloadable:!0})]})};G.displayName="ImageViewer.Image";const M=({children:t,images:c,preview:i=!0})=>{const[o,l]=r.useState(!1),[h,u]=r.useState(0),d=r.useCallback(g=>{u(g),l(!0)},[]),f=r.useCallback(()=>{l(!1)},[]),b=r.useMemo(()=>({handlePreview:d,preview:i}),[d,i]);return e.jsxs(e.Fragment,{children:[e.jsx(B.Provider,{value:b,children:t}),e.jsx(v,{images:c,visible:o,onClose:f,activeIndex:h,onIndexChange:u,rotatable:!0,scalable:!0,downloadable:!0})]})};M.displayName="ImageViewer.Group";const B=r.createContext(null);Object.assign(v,{Image:G,Group:M});exports.ImageViewer=v;exports.ImageViewerGroup=M;exports.ImageViewerImage=G;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),F=require("lucide-react");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const I=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");typeof window<"u"&&Promise.resolve().then(()=>require("../../_virtual/index.cjs")).then(t=>t.index).then(t=>{t.default});const v=({images:t,visible:c=!1,onClose:i,activeIndex:o=0,onIndexChange:l,zoomSpeed:h=.1,disableKeyboardSupport:u=!1,noNavbar:d=!1,noToolbar:f=!1,rotatable:b=!0,scalable:g=!0,changeable:V=!0,noClose:N=!1,minScale:x=.1,maxScale:q=50,defaultScale:p=1,className:j,downloadable:P=!1,noImgDetails:C=!1,noResetZoomAfterChange:L=!1,drag:S=!1})=>{const[m,k]=r.useState(o),[w,U]=r.useState(null);r.useEffect(()=>{typeof window<"u"&&!w&&Promise.resolve().then(()=>require("../../_virtual/index.cjs")).then(s=>s.index).then(s=>{U(()=>s.default)})},[w]),r.useEffect(()=>{k(o)},[o]);const y=r.useCallback(()=>{i?.()},[i]),R=r.useCallback((s,n)=>{k(n),l?.(n)},[l]),T=r.useCallback(()=>{const s=t[m],n=s.downloadUrl||s.src,a=document.createElement("a");a.href=n,a.download=s.alt||`image-${m+1}`,fetch(n).then(E=>E.blob()).then(E=>{const O=window.URL.createObjectURL(E);a.href=O,document.body.appendChild(a),a.click(),document.body.removeChild(a),window.URL.revokeObjectURL(O)}).catch(()=>{})},[t,m]),D=t.map(s=>({src:s.src,alt:s.alt||"",downloadUrl:s.downloadUrl||s.src}));return w?e.jsx(w,{visible:c,onClose:y,onMaskClick:y,images:D,activeIndex:m,onChange:R,zoomSpeed:h,disableKeyboardSupport:u,noNavbar:d,noToolbar:f,rotatable:b,scalable:g,changeable:V,noClose:N,minScale:x,maxScale:q,defaultScale:p,className:I.cn("ds:image-viewer-antd-style",j),downloadable:P,noImgDetails:C,noResetZoomAfterChange:L,showTotal:!0,drag:S,customToolbar:s=>s.map(n=>n.key==="download"?{...n,actionType:void 0,onClick:void 0,render:e.jsx("button",{type:"button",className:"ds:react-viewer-icon ds:react-viewer-download",title:"Download",style:{background:"none",border:"none",cursor:"pointer",padding:0},onClick:a=>{a.preventDefault(),a.stopPropagation(),T()},children:e.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("path",{d:"M10 3v10m0 0l-4-4m4 4l4-4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e.jsx("rect",{x:"4",y:"17",width:"12",height:"2",rx:"1",fill:"currentColor"})]})})}:n)}):null};v.displayName="ImageViewer";const G=({src:t,alt:c="",width:i,height:o,preview:l=!0,previewSrc:h,fallback:u,placeholder:d,className:f,wrapperClassName:b,onPreviewClick:g,onError:V,...N})=>{const[x,q]=r.useState(!0),[p,j]=r.useState(!1),[P,C]=r.useState(!1),L=()=>{q(!1),j(!1)},S=R=>{q(!1),j(!0),V?.(R)},m=()=>{l&&(C(!0),g?.())},k=()=>{C(!1)},w=x&&d,U=p&&u,y=l&&!x&&!p;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:I.cn("ds:image-viewer-root ds:relative ds:inline-block",b),children:e.jsxs("div",{className:"ds:relative ds:inline-block",children:[w&&e.jsx("div",{className:"ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:bg-muted ds:animate-pulse",style:{width:i,height:o},children:d===!0?e.jsx("div",{className:"ds:w-8 ds:h-8 ds:border-2 ds:border-primary ds:border-t-transparent ds:rounded-full ds:animate-spin"}):d}),e.jsx("img",{src:U?u:t,alt:c,width:i,height:o,className:I.cn("ds:image-viewer-img ds:max-w-full ds:h-auto ds:align-middle",x&&"ds:opacity-0",f),onLoad:L,onError:S,...N}),y&&e.jsx("div",{onClick:m,className:I.cn("ds:image-viewer-mask ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:opacity-0 ds:hover:opacity-100 ds:transition-opacity ds:cursor-pointer","ds:bg-black/50 ds:backdrop-blur-sm"),children:e.jsxs("div",{className:"ds:text-white ds:text-sm ds:flex ds:items-center ds:gap-2",children:[e.jsx(F.ZoomIn,{className:"ds:w-5 ds:h-5"}),e.jsx("span",{children:"Preview"})]})})]})}),e.jsx(v,{images:[{src:h||t,alt:c}],visible:P,onClose:k,rotatable:!0,scalable:!0,downloadable:!0})]})};G.displayName="ImageViewer.Image";const M=({children:t,images:c,preview:i=!0})=>{const[o,l]=r.useState(!1),[h,u]=r.useState(0),d=r.useCallback(g=>{u(g),l(!0)},[]),f=r.useCallback(()=>{l(!1)},[]),b=r.useMemo(()=>({handlePreview:d,preview:i}),[d,i]);return e.jsxs(e.Fragment,{children:[e.jsx(B.Provider,{value:b,children:t}),e.jsx(v,{images:c,visible:o,onClose:f,activeIndex:h,onIndexChange:u,rotatable:!0,scalable:!0,downloadable:!0})]})};M.displayName="ImageViewer.Group";const B=r.createContext(null);Object.assign(v,{Image:G,Group:M});exports.ImageViewer=v;exports.ImageViewerGroup=M;exports.ImageViewerImage=G;
 //# sourceMappingURL=ImageViewer.cjs.map

package/dist/cjs/components/ImageViewer/ImageViewer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ImageViewer.cjs","sources":["../../../../src/components/ImageViewer/ImageViewer.tsx"],"sourcesContent":["import React, { useState, useCallback, useEffect } from \"react\";\nimport { ZoomIn } from \"lucide-react\";\nimport { cn } from \"@dsui/ui/index\";\n\n// Dynamic import for react-viewer to avoid SSR issues\nlet Viewer: any = null;\nif (typeof window !== \"undefined\") {\n  import(\"react-viewer\").then((module) => {\n    Viewer = module.default;\n  });\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ImageInfo {\n  src: string;\n  alt?: string;\n  downloadUrl?: string;\n}\n\nexport interface ImageViewerProps {\n  images: ImageInfo[];\n  visible?: boolean;\n  onClose?: () => void;\n  activeIndex?: number;\n  onIndexChange?: (_index: number) => void;\n  zoomSpeed?: number;\n  disableKeyboardSupport?: boolean;\n  noNavbar?: boolean;\n  noToolbar?: boolean;\n  rotatable?: boolean;\n  scalable?: boolean;\n  changeable?: boolean;\n  noClose?: boolean;\n  minScale?: number;\n  maxScale?: number;\n  defaultScale?: number;\n  className?: string;\n  downloadable?: boolean;\n  noImgDetails?: boolean;\n  noResetZoomAfterChange?: boolean;\n  drag?: boolean;\n}\n\nexport interface ImageViewerImageProps\n  extends React.ImgHTMLAttributes<HTMLImageElement> {\n  src: string;\n  alt?: string;\n  width?: string | number;\n  height?: string | number;\n  preview?: boolean;\n  previewSrc?: string;\n  fallback?: string;\n  placeholder?: React.ReactNode | boolean;\n  className?: string;\n  wrapperClassName?: string;\n  onPreviewClick?: () => void;\n}\n\n// ============================================================================\n// ImageViewer Component\n// ============================================================================\n\nexport const ImageViewer: React.FC<ImageViewerProps> = ({\n  images,\n  visible = false,\n  onClose,\n  activeIndex = 0,\n  onIndexChange,\n  zoomSpeed = 0.1,\n  disableKeyboardSupport = false,\n  noNavbar = false,\n  noToolbar = false,\n  rotatable = true,\n  scalable = true,\n  changeable = true,\n  noClose = false,\n  minScale = 0.1,\n  maxScale = 50,\n  defaultScale = 1,\n  className,\n  downloadable = false,\n  noImgDetails = false,\n  noResetZoomAfterChange = false,\n  drag = false,\n}) => {\n  const [currentIndex, setCurrentIndex] = useState(activeIndex);\n  const [ViewerComponent, setViewerComponent] = useState<any>(null);\n\n  // Load Viewer dynamically on client-side only\n  useEffect(() => {\n    if (typeof window !== \"undefined\" && !ViewerComponent) {\n      import(\"react-viewer\").then((module) => {\n        setViewerComponent(() => module.default);\n      });\n    }\n  }, [ViewerComponent]);\n\n  useEffect(() => {\n    setCurrentIndex(activeIndex);\n  }, [activeIndex]);\n\n  const handleClose = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const handleIndexChange = useCallback(\n    (_activeImage: any, index: number) => {\n      setCurrentIndex(index);\n      onIndexChange?.(index);\n    },\n    [onIndexChange]\n  );\n\n  // Handle download to save file locally\n  const handleDownload = useCallback(() => {\n    const currentImage = images[currentIndex];\n    const downloadUrl = currentImage.downloadUrl || currentImage.src;\n\n    // Create a temporary anchor element to trigger download\n    const link = document.createElement(\"a\");\n    link.href = downloadUrl;\n    link.download = currentImage.alt || `image-${currentIndex + 1}`;\n\n    // For cross-origin images, try to download via fetch\n    fetch(downloadUrl)\n      .then((response) => response.blob())\n      .then((blob) => {\n        const url = window.URL.createObjectURL(blob);\n        link.href = url;\n        document.body.appendChild(link);\n        link.click();\n        document.body.removeChild(link);\n        window.URL.revokeObjectURL(url);\n      })\n      .catch(() => {\n        // Fallback: do nothing if fetch fails\n      });\n  }, [images, currentIndex]);\n\n  // Transform images to include downloadUrl\n  const viewerImages = images.map((img) => ({\n    src: img.src,\n    alt: img.alt || \"\",\n    downloadUrl: img.downloadUrl || img.src,\n  }));\n\n  // Don't render until Viewer is loaded\n  if (!ViewerComponent) {\n    return null;\n  }\n\n  return (\n    <ViewerComponent\n      visible={visible}\n      onClose={handleClose}\n      onMaskClick={handleClose}\n      images={viewerImages}\n      activeIndex={currentIndex}\n      onChange={handleIndexChange}\n      zoomSpeed={zoomSpeed}\n      disableKeyboardSupport={disableKeyboardSupport}\n      noNavbar={noNavbar}\n      noToolbar={noToolbar}\n      rotatable={rotatable}\n      scalable={scalable}\n      changeable={changeable}\n      noClose={noClose}\n      minScale={minScale}\n      maxScale={maxScale}\n      defaultScale={defaultScale}\n      className={cn(\"ds:image-viewer-antd-style\", className)}\n      downloadable={downloadable}\n      noImgDetails={noImgDetails}\n      noResetZoomAfterChange={noResetZoomAfterChange}\n      showTotal={true}\n      drag={drag}\n      customToolbar={(toolbars: any) => {\n        // Replace download button with a custom-rendered button to prevent viewer state change\n        return toolbars.map((toolbar: any) => {\n          if (toolbar.key === \"download\") {\n            return {\n              ...toolbar,\n              actionType: undefined, // Remove default action\n              onClick: undefined,\n              render: (\n                <button\n                  type=\"button\"\n                  className=\"ds:react-viewer-icon ds:react-viewer-download\"\n                  title=\"Download\"\n                  style={{\n                    background: \"none\",\n                    border: \"none\",\n                    cursor: \"pointer\",\n                    padding: 0,\n                  }}\n                  onClick={(e) => {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    handleDownload();\n                  }}\n                >\n                  {/* SVG icon for download (Ant Design style) */}\n                  <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    fill=\"none\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                  >\n                    <path\n                      d=\"M10 3v10m0 0l-4-4m4 4l4-4\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"1.5\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                    />\n                    <rect\n                      x=\"4\"\n                      y=\"17\"\n                      width=\"12\"\n                      height=\"2\"\n                      rx=\"1\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </button>\n              ),\n            };\n          }\n          return toolbar;\n        });\n      }}\n    />\n  );\n};\n\nImageViewer.displayName = \"ImageViewer\";\n\n// ============================================================================\n// ImageViewerImage Component (Wrapper for single image with preview)\n// ============================================================================\n\nexport const ImageViewerImage: React.FC<ImageViewerImageProps> = ({\n  src,\n  alt = \"\",\n  width,\n  height,\n  preview = true,\n  previewSrc,\n  fallback,\n  placeholder,\n  className,\n  wrapperClassName,\n  onPreviewClick,\n  onError,\n  ...props\n}) => {\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState(false);\n  const [viewerVisible, setViewerVisible] = useState(false);\n\n  const handleLoad = () => {\n    setLoading(false);\n    setError(false);\n  };\n\n  const handleError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    setLoading(false);\n    setError(true);\n    onError?.(e);\n  };\n\n  const handlePreview = () => {\n    if (!preview) return;\n    setViewerVisible(true);\n    onPreviewClick?.();\n  };\n\n  const handleCloseViewer = () => {\n    setViewerVisible(false);\n  };\n\n  const showPlaceholder = loading && placeholder;\n  const showFallback = error && fallback;\n  const showPreviewMask = preview && !loading && !error;\n\n  return (\n    <>\n      <div\n        className={cn(\n          \"ds:ds-image-viewer-root ds:relative ds:inline-block\",\n          wrapperClassName\n        )}\n      >\n        <div className=\"ds:relative ds:inline-block\">\n          {showPlaceholder && (\n            <div\n              className=\"ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:bg-muted ds:animate-pulse\"\n              style={{ width, height }}\n            >\n              {placeholder === true ? (\n                <div className=\"ds:w-8 ds:h-8 ds:border-2 ds:border-primary ds:border-t-transparent ds:rounded-full ds:animate-spin\" />\n              ) : (\n                placeholder\n              )}\n            </div>\n          )}\n\n          <img\n            src={showFallback ? fallback : src}\n            alt={alt}\n            width={width}\n            height={height}\n            className={cn(\n              \"ds:ds-image-viewer-img ds:max-w-full ds:h-auto ds:align-middle\",\n              loading && \"ds:opacity-0\",\n              className\n            )}\n            onLoad={handleLoad}\n            onError={handleError}\n            {...props}\n          />\n\n          {showPreviewMask && (\n            <div\n              onClick={handlePreview}\n              className={cn(\n                \"ds:ds-image-viewer-mask ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:opacity-0 ds:hover:opacity-100 ds:transition-opacity ds:cursor-pointer\",\n                \"ds:bg-black/50 ds:backdrop-blur-sm\"\n              )}\n            >\n              <div className=\"ds:text-white ds:text-sm ds:flex ds:items-center ds:gap-2\">\n                <ZoomIn className=\"ds:w-5 ds:h-5\" />\n                <span>Preview</span>\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Viewer Modal */}\n      <ImageViewer\n        images={[{ src: previewSrc || src, alt }]}\n        visible={viewerVisible}\n        onClose={handleCloseViewer}\n        rotatable\n        scalable\n        downloadable\n      />\n    </>\n  );\n};\n\nImageViewerImage.displayName = \"ImageViewer.Image\";\n\n// ============================================================================\n// ImageViewerGroup Component\n// ============================================================================\n\ninterface ImageViewerGroupProps {\n  children: React.ReactNode;\n  images: ImageInfo[];\n  preview?: boolean;\n}\n\nexport const ImageViewerGroup: React.FC<ImageViewerGroupProps> = ({\n  children,\n  images,\n  preview = true,\n}) => {\n  const [viewerVisible, setViewerVisible] = useState(false);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const handlePreview = useCallback((index: number) => {\n    setCurrentIndex(index);\n    setViewerVisible(true);\n  }, []);\n\n  const handleClose = useCallback(() => {\n    setViewerVisible(false);\n  }, []);\n\n  const contextValue = React.useMemo(\n    () => ({\n      handlePreview,\n      preview,\n    }),\n    [handlePreview, preview]\n  );\n\n  return (\n    <>\n      <ImageViewerGroupContext.Provider value={contextValue}>\n        {children}\n      </ImageViewerGroupContext.Provider>\n\n      <ImageViewer\n        images={images}\n        visible={viewerVisible}\n        onClose={handleClose}\n        activeIndex={currentIndex}\n        onIndexChange={setCurrentIndex}\n        rotatable\n        scalable\n        downloadable\n      />\n    </>\n  );\n};\n\nImageViewerGroup.displayName = \"ImageViewer.Group\";\n\n// Context for Group\nconst ImageViewerGroupContext = React.createContext<{\n  handlePreview?: (_index: number) => void;\n  preview?: boolean;\n} | null>(null);\n\n// Export with namespace\nconst ImageViewerNamespace = Object.assign(ImageViewer, {\n  Image: ImageViewerImage,\n  Group: ImageViewerGroup,\n});\n\nexport default ImageViewerNamespace;\n"],"names":["n","module","ImageViewer","images","visible","onClose","activeIndex","onIndexChange","zoomSpeed","disableKeyboardSupport","noNavbar","noToolbar","rotatable","scalable","changeable","noClose","minScale","maxScale","defaultScale","className","downloadable","noImgDetails","noResetZoomAfterChange","drag","currentIndex","setCurrentIndex","useState","ViewerComponent","setViewerComponent","useEffect","handleClose","useCallback","handleIndexChange","_activeImage","index","handleDownload","currentImage","downloadUrl","link","response","blob","url","viewerImages","img","jsx","cn","toolbars","toolbar","e","jsxs","ImageViewerImage","src","alt","width","height","preview","previewSrc","fallback","placeholder","wrapperClassName","onPreviewClick","onError","props","loading","setLoading","error","setError","viewerVisible","setViewerVisible","handleLoad","handleError","handlePreview","handleCloseViewer","showPlaceholder","showFallback","showPreviewMask","Fragment","ZoomIn","ImageViewerGroup","children","contextValue","React","ImageViewerGroupContext"],"mappings":"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"}
+{"version":3,"file":"ImageViewer.cjs","sources":["../../../../src/components/ImageViewer/ImageViewer.tsx"],"sourcesContent":["import React, { useState, useCallback, useEffect } from \"react\";\nimport { ZoomIn } from \"lucide-react\";\nimport { cn } from \"@dsui/ui/index\";\n\n// Dynamic import for react-viewer to avoid SSR issues\nlet Viewer: any = null;\nif (typeof window !== \"undefined\") {\n  import(\"react-viewer\").then((module) => {\n    Viewer = module.default;\n  });\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface ImageInfo {\n  src: string;\n  alt?: string;\n  downloadUrl?: string;\n}\n\nexport interface ImageViewerProps {\n  images: ImageInfo[];\n  visible?: boolean;\n  onClose?: () => void;\n  activeIndex?: number;\n  onIndexChange?: (_index: number) => void;\n  zoomSpeed?: number;\n  disableKeyboardSupport?: boolean;\n  noNavbar?: boolean;\n  noToolbar?: boolean;\n  rotatable?: boolean;\n  scalable?: boolean;\n  changeable?: boolean;\n  noClose?: boolean;\n  minScale?: number;\n  maxScale?: number;\n  defaultScale?: number;\n  className?: string;\n  downloadable?: boolean;\n  noImgDetails?: boolean;\n  noResetZoomAfterChange?: boolean;\n  drag?: boolean;\n}\n\nexport interface ImageViewerImageProps\n  extends React.ImgHTMLAttributes<HTMLImageElement> {\n  src: string;\n  alt?: string;\n  width?: string | number;\n  height?: string | number;\n  preview?: boolean;\n  previewSrc?: string;\n  fallback?: string;\n  placeholder?: React.ReactNode | boolean;\n  className?: string;\n  wrapperClassName?: string;\n  onPreviewClick?: () => void;\n}\n\n// ============================================================================\n// ImageViewer Component\n// ============================================================================\n\nexport const ImageViewer: React.FC<ImageViewerProps> = ({\n  images,\n  visible = false,\n  onClose,\n  activeIndex = 0,\n  onIndexChange,\n  zoomSpeed = 0.1,\n  disableKeyboardSupport = false,\n  noNavbar = false,\n  noToolbar = false,\n  rotatable = true,\n  scalable = true,\n  changeable = true,\n  noClose = false,\n  minScale = 0.1,\n  maxScale = 50,\n  defaultScale = 1,\n  className,\n  downloadable = false,\n  noImgDetails = false,\n  noResetZoomAfterChange = false,\n  drag = false,\n}) => {\n  const [currentIndex, setCurrentIndex] = useState(activeIndex);\n  const [ViewerComponent, setViewerComponent] = useState<any>(null);\n\n  // Load Viewer dynamically on client-side only\n  useEffect(() => {\n    if (typeof window !== \"undefined\" && !ViewerComponent) {\n      import(\"react-viewer\").then((module) => {\n        setViewerComponent(() => module.default);\n      });\n    }\n  }, [ViewerComponent]);\n\n  useEffect(() => {\n    setCurrentIndex(activeIndex);\n  }, [activeIndex]);\n\n  const handleClose = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const handleIndexChange = useCallback(\n    (_activeImage: any, index: number) => {\n      setCurrentIndex(index);\n      onIndexChange?.(index);\n    },\n    [onIndexChange]\n  );\n\n  // Handle download to save file locally\n  const handleDownload = useCallback(() => {\n    const currentImage = images[currentIndex];\n    const downloadUrl = currentImage.downloadUrl || currentImage.src;\n\n    // Create a temporary anchor element to trigger download\n    const link = document.createElement(\"a\");\n    link.href = downloadUrl;\n    link.download = currentImage.alt || `image-${currentIndex + 1}`;\n\n    // For cross-origin images, try to download via fetch\n    fetch(downloadUrl)\n      .then((response) => response.blob())\n      .then((blob) => {\n        const url = window.URL.createObjectURL(blob);\n        link.href = url;\n        document.body.appendChild(link);\n        link.click();\n        document.body.removeChild(link);\n        window.URL.revokeObjectURL(url);\n      })\n      .catch(() => {\n        // Fallback: do nothing if fetch fails\n      });\n  }, [images, currentIndex]);\n\n  // Transform images to include downloadUrl\n  const viewerImages = images.map((img) => ({\n    src: img.src,\n    alt: img.alt || \"\",\n    downloadUrl: img.downloadUrl || img.src,\n  }));\n\n  // Don't render until Viewer is loaded\n  if (!ViewerComponent) {\n    return null;\n  }\n\n  return (\n    <ViewerComponent\n      visible={visible}\n      onClose={handleClose}\n      onMaskClick={handleClose}\n      images={viewerImages}\n      activeIndex={currentIndex}\n      onChange={handleIndexChange}\n      zoomSpeed={zoomSpeed}\n      disableKeyboardSupport={disableKeyboardSupport}\n      noNavbar={noNavbar}\n      noToolbar={noToolbar}\n      rotatable={rotatable}\n      scalable={scalable}\n      changeable={changeable}\n      noClose={noClose}\n      minScale={minScale}\n      maxScale={maxScale}\n      defaultScale={defaultScale}\n      className={cn(\"ds:image-viewer-antd-style\", className)}\n      downloadable={downloadable}\n      noImgDetails={noImgDetails}\n      noResetZoomAfterChange={noResetZoomAfterChange}\n      showTotal={true}\n      drag={drag}\n      customToolbar={(toolbars: any) => {\n        // Replace download button with a custom-rendered button to prevent viewer state change\n        return toolbars.map((toolbar: any) => {\n          if (toolbar.key === \"download\") {\n            return {\n              ...toolbar,\n              actionType: undefined, // Remove default action\n              onClick: undefined,\n              render: (\n                <button\n                  type=\"button\"\n                  className=\"ds:react-viewer-icon ds:react-viewer-download\"\n                  title=\"Download\"\n                  style={{\n                    background: \"none\",\n                    border: \"none\",\n                    cursor: \"pointer\",\n                    padding: 0,\n                  }}\n                  onClick={(e) => {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    handleDownload();\n                  }}\n                >\n                  {/* SVG icon for download (Ant Design style) */}\n                  <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    fill=\"none\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                  >\n                    <path\n                      d=\"M10 3v10m0 0l-4-4m4 4l4-4\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"1.5\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                    />\n                    <rect\n                      x=\"4\"\n                      y=\"17\"\n                      width=\"12\"\n                      height=\"2\"\n                      rx=\"1\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </button>\n              ),\n            };\n          }\n          return toolbar;\n        });\n      }}\n    />\n  );\n};\n\nImageViewer.displayName = \"ImageViewer\";\n\n// ============================================================================\n// ImageViewerImage Component (Wrapper for single image with preview)\n// ============================================================================\n\nexport const ImageViewerImage: React.FC<ImageViewerImageProps> = ({\n  src,\n  alt = \"\",\n  width,\n  height,\n  preview = true,\n  previewSrc,\n  fallback,\n  placeholder,\n  className,\n  wrapperClassName,\n  onPreviewClick,\n  onError,\n  ...props\n}) => {\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState(false);\n  const [viewerVisible, setViewerVisible] = useState(false);\n\n  const handleLoad = () => {\n    setLoading(false);\n    setError(false);\n  };\n\n  const handleError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    setLoading(false);\n    setError(true);\n    onError?.(e);\n  };\n\n  const handlePreview = () => {\n    if (!preview) return;\n    setViewerVisible(true);\n    onPreviewClick?.();\n  };\n\n  const handleCloseViewer = () => {\n    setViewerVisible(false);\n  };\n\n  const showPlaceholder = loading && placeholder;\n  const showFallback = error && fallback;\n  const showPreviewMask = preview && !loading && !error;\n\n  return (\n    <>\n      <div\n        className={cn(\n          \"ds:image-viewer-root ds:relative ds:inline-block\",\n          wrapperClassName\n        )}\n      >\n        <div className=\"ds:relative ds:inline-block\">\n          {showPlaceholder && (\n            <div\n              className=\"ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:bg-muted ds:animate-pulse\"\n              style={{ width, height }}\n            >\n              {placeholder === true ? (\n                <div className=\"ds:w-8 ds:h-8 ds:border-2 ds:border-primary ds:border-t-transparent ds:rounded-full ds:animate-spin\" />\n              ) : (\n                placeholder\n              )}\n            </div>\n          )}\n\n          <img\n            src={showFallback ? fallback : src}\n            alt={alt}\n            width={width}\n            height={height}\n            className={cn(\n              \"ds:image-viewer-img ds:max-w-full ds:h-auto ds:align-middle\",\n              loading && \"ds:opacity-0\",\n              className\n            )}\n            onLoad={handleLoad}\n            onError={handleError}\n            {...props}\n          />\n\n          {showPreviewMask && (\n            <div\n              onClick={handlePreview}\n              className={cn(\n                \"ds:image-viewer-mask ds:absolute ds:inset-0 ds:flex ds:items-center ds:justify-center ds:opacity-0 ds:hover:opacity-100 ds:transition-opacity ds:cursor-pointer\",\n                \"ds:bg-black/50 ds:backdrop-blur-sm\"\n              )}\n            >\n              <div className=\"ds:text-white ds:text-sm ds:flex ds:items-center ds:gap-2\">\n                <ZoomIn className=\"ds:w-5 ds:h-5\" />\n                <span>Preview</span>\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Viewer Modal */}\n      <ImageViewer\n        images={[{ src: previewSrc || src, alt }]}\n        visible={viewerVisible}\n        onClose={handleCloseViewer}\n        rotatable\n        scalable\n        downloadable\n      />\n    </>\n  );\n};\n\nImageViewerImage.displayName = \"ImageViewer.Image\";\n\n// ============================================================================\n// ImageViewerGroup Component\n// ============================================================================\n\ninterface ImageViewerGroupProps {\n  children: React.ReactNode;\n  images: ImageInfo[];\n  preview?: boolean;\n}\n\nexport const ImageViewerGroup: React.FC<ImageViewerGroupProps> = ({\n  children,\n  images,\n  preview = true,\n}) => {\n  const [viewerVisible, setViewerVisible] = useState(false);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const handlePreview = useCallback((index: number) => {\n    setCurrentIndex(index);\n    setViewerVisible(true);\n  }, []);\n\n  const handleClose = useCallback(() => {\n    setViewerVisible(false);\n  }, []);\n\n  const contextValue = React.useMemo(\n    () => ({\n      handlePreview,\n      preview,\n    }),\n    [handlePreview, preview]\n  );\n\n  return (\n    <>\n      <ImageViewerGroupContext.Provider value={contextValue}>\n        {children}\n      </ImageViewerGroupContext.Provider>\n\n      <ImageViewer\n        images={images}\n        visible={viewerVisible}\n        onClose={handleClose}\n        activeIndex={currentIndex}\n        onIndexChange={setCurrentIndex}\n        rotatable\n        scalable\n        downloadable\n      />\n    </>\n  );\n};\n\nImageViewerGroup.displayName = \"ImageViewer.Group\";\n\n// Context for Group\nconst ImageViewerGroupContext = React.createContext<{\n  handlePreview?: (_index: number) => void;\n  preview?: boolean;\n} | null>(null);\n\n// Export with namespace\nconst ImageViewerNamespace = Object.assign(ImageViewer, {\n  Image: ImageViewerImage,\n  Group: ImageViewerGroup,\n});\n\nexport default ImageViewerNamespace;\n"],"names":["n","module","ImageViewer","images","visible","onClose","activeIndex","onIndexChange","zoomSpeed","disableKeyboardSupport","noNavbar","noToolbar","rotatable","scalable","changeable","noClose","minScale","maxScale","defaultScale","className","downloadable","noImgDetails","noResetZoomAfterChange","drag","currentIndex","setCurrentIndex","useState","ViewerComponent","setViewerComponent","useEffect","handleClose","useCallback","handleIndexChange","_activeImage","index","handleDownload","currentImage","downloadUrl","link","response","blob","url","viewerImages","img","jsx","cn","toolbars","toolbar","e","jsxs","ImageViewerImage","src","alt","width","height","preview","previewSrc","fallback","placeholder","wrapperClassName","onPreviewClick","onError","props","loading","setLoading","error","setError","viewerVisible","setViewerVisible","handleLoad","handleError","handlePreview","handleCloseViewer","showPlaceholder","showFallback","showPreviewMask","Fragment","ZoomIn","ImageViewerGroup","children","contextValue","React","ImageViewerGroupContext"],"mappings":"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"}

package/dist/cjs/components/Table/TableFilter/data-table-date-filter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-date-filter.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-date-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport { formatDate } from \"@/utils/datetime\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { CalendarIcon, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport type { DateRange } from \"react-day-picker\";\nimport { Separator } from \"../../Separator\";\nimport { Popover } from \"../../Popover\";\nimport { Button } from \"../../Button\";\nimport { Calendar } from \"../../Calendar\";\n\ntype DateSelection = Date[] | DateRange;\n\nfunction getIsDateRange(value: DateSelection): value is DateRange {\n  return value && typeof value === \"object\" && !Array.isArray(value);\n}\n\nfunction parseAsDate(timestamp: number | string | undefined): Date | undefined {\n  if (!timestamp) return undefined;\n  const numericTimestamp =\n    typeof timestamp === \"string\" ? Number(timestamp) : timestamp;\n  const date = new Date(numericTimestamp);\n  return !Number.isNaN(date.getTime()) ? date : undefined;\n}\n\nfunction parseColumnFilterValue(value: unknown) {\n  if (value === null || value === undefined) {\n    return [];\n  }\n\n  if (Array.isArray(value)) {\n    return value.map((item) => {\n      if (typeof item === \"number\" || typeof item === \"string\") {\n        return item;\n      }\n      return undefined;\n    });\n  }\n\n  if (typeof value === \"string\" || typeof value === \"number\") {\n    return [value];\n  }\n\n  return [];\n}\n\ninterface DataTableDateFilterProps<TData> {\n  column: Column<TData, unknown>;\n  title?: string;\n  multiple?: boolean;\n}\n\nexport function DataTableDateFilter<TData>({\n  column,\n  title,\n  multiple,\n}: DataTableDateFilterProps<TData>) {\n  const columnFilterValue = column.getFilterValue();\n\n  const selectedDates = React.useMemo<DateSelection>(() => {\n    if (!columnFilterValue) {\n      return multiple ? { from: undefined, to: undefined } : [];\n    }\n\n    if (multiple) {\n      const timestamps = parseColumnFilterValue(columnFilterValue);\n      return {\n        from: parseAsDate(timestamps[0]),\n        to: parseAsDate(timestamps[1]),\n      };\n    }\n\n    const timestamps = parseColumnFilterValue(columnFilterValue);\n    const date = parseAsDate(timestamps[0]);\n    return date ? [date] : [];\n  }, [columnFilterValue, multiple]);\n\n  const onSelect = React.useCallback(\n    (date: Date | DateRange | undefined) => {\n      if (!date) {\n        column.setFilterValue(undefined);\n        return;\n      }\n\n      if (multiple && !(\"getTime\" in date)) {\n        const from = date.from?.getTime();\n        const to = date.to?.getTime();\n        column.setFilterValue(from || to ? [from, to] : undefined);\n      } else if (!multiple && \"getTime\" in date) {\n        column.setFilterValue(date.getTime());\n      }\n    },\n    [column, multiple]\n  );\n\n  const onReset = React.useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      column.setFilterValue(undefined);\n    },\n    [column]\n  );\n\n  const hasValue = React.useMemo(() => {\n    if (multiple) {\n      if (!getIsDateRange(selectedDates)) return false;\n      return selectedDates.from || selectedDates.to;\n    }\n    if (!Array.isArray(selectedDates)) return false;\n    return selectedDates.length > 0;\n  }, [multiple, selectedDates]);\n\n  const formatDateRange = React.useCallback((range: DateRange) => {\n    if (!range.from && !range.to) return \"\";\n    if (range.from && range.to) {\n      return `${formatDate(range.from)} - ${formatDate(range.to)}`;\n    }\n    return formatDate(range.from ?? range.to);\n  }, []);\n\n  const label = React.useMemo(() => {\n    if (multiple) {\n      if (!getIsDateRange(selectedDates)) return null;\n\n      const hasSelectedDates = selectedDates.from || selectedDates.to;\n      const dateText = hasSelectedDates\n        ? formatDateRange(selectedDates)\n        : \"Select date range\";\n\n      return (\n        <span className=\"ds:flex ds:items-center ds:gap-2\">\n          <span>{title}</span>\n          {hasSelectedDates && (\n            <>\n              <Separator\n                orientation=\"vertical\"\n                className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n              />\n              <span>{dateText}</span>\n            </>\n          )}\n        </span>\n      );\n    }\n\n    if (getIsDateRange(selectedDates)) return null;\n\n    const hasSelectedDate = selectedDates.length > 0;\n    const dateText = hasSelectedDate\n      ? formatDate(selectedDates[0])\n      : \"Select date\";\n\n    return (\n      <span className=\"ds:flex ds:items-center ds:gap-2\">\n        <span>{title}</span>\n        {hasSelectedDate && (\n          <>\n            <Separator\n              orientation=\"vertical\"\n              className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n            />\n            <span>{dateText}</span>\n          </>\n        )}\n      </span>\n    );\n  }, [selectedDates, multiple, formatDateRange, title]);\n\n  const PopContent = (\n    <div className=\"ds:w-auto ds:p-0\">\n      {multiple ? (\n        <Calendar\n          autoFocus\n          captionLayout=\"dropdown\"\n          mode=\"range\"\n          selected={\n            getIsDateRange(selectedDates)\n              ? selectedDates\n              : { from: undefined, to: undefined }\n          }\n          onSelect={onSelect}\n        />\n      ) : (\n        <Calendar\n          captionLayout=\"dropdown\"\n          mode=\"single\"\n          selected={\n            !getIsDateRange(selectedDates) ? selectedDates[0] : undefined\n          }\n          onSelect={onSelect}\n        />\n      )}\n    </div>\n  );\n\n  return (\n    <Popover content={PopContent}>\n      <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n        {hasValue ? (\n          <div\n            role=\"button\"\n            aria-label={`Clear ${title} filter`}\n            tabIndex={0}\n            onClick={onReset}\n            className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n          >\n            <XCircle />\n          </div>\n        ) : (\n          <CalendarIcon />\n        )}\n        {label}\n      </Button>\n    </Popover>\n  );\n}\n"],"names":["getIsDateRange","value","parseAsDate","timestamp","numericTimestamp","date","parseColumnFilterValue","item","DataTableDateFilter","column","title","multiple","columnFilterValue","selectedDates","React","timestamps","onSelect","from","to","onReset","event","hasValue","formatDateRange","range","formatDate","label","hasSelectedDates","dateText","jsxs","jsx","Fragment","Separator","hasSelectedDate","PopContent","Calendar","Popover","Button","XCircle","CalendarIcon"],"mappings":"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"}
+{"version":3,"file":"data-table-date-filter.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-date-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport { formatDate } from \"@/utils/datetime\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { CalendarIcon, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport type { DateRange } from \"react-day-picker\";\nimport { Separator } from \"../../Separator\";\nimport { Popover } from \"../../Popover\";\nimport { Button } from \"../../Button\";\nimport { Calendar } from \"../../Calendar\";\n\ntype DateSelection = Date[] | DateRange;\n\nfunction getIsDateRange(value: DateSelection): value is DateRange {\n  return value && typeof value === \"object\" && !Array.isArray(value);\n}\n\nfunction parseAsDate(timestamp: number | string | undefined): Date | undefined {\n  if (!timestamp) return undefined;\n  const numericTimestamp =\n    typeof timestamp === \"string\" ? Number(timestamp) : timestamp;\n  const date = new Date(numericTimestamp);\n  return !Number.isNaN(date.getTime()) ? date : undefined;\n}\n\nfunction parseColumnFilterValue(value: unknown) {\n  if (value === null || value === undefined) {\n    return [];\n  }\n\n  if (Array.isArray(value)) {\n    return value.map((item) => {\n      if (typeof item === \"number\" || typeof item === \"string\") {\n        return item;\n      }\n      return undefined;\n    });\n  }\n\n  if (typeof value === \"string\" || typeof value === \"number\") {\n    return [value];\n  }\n\n  return [];\n}\n\nexport interface DataTableDateFilterProps<TData> {\n  column: Column<TData, unknown>;\n  title?: string;\n  multiple?: boolean;\n}\n\nexport function DataTableDateFilter<TData>({\n  column,\n  title,\n  multiple,\n}: DataTableDateFilterProps<TData>) {\n  const columnFilterValue = column.getFilterValue();\n\n  const selectedDates = React.useMemo<DateSelection>(() => {\n    if (!columnFilterValue) {\n      return multiple ? { from: undefined, to: undefined } : [];\n    }\n\n    if (multiple) {\n      const timestamps = parseColumnFilterValue(columnFilterValue);\n      return {\n        from: parseAsDate(timestamps[0]),\n        to: parseAsDate(timestamps[1]),\n      };\n    }\n\n    const timestamps = parseColumnFilterValue(columnFilterValue);\n    const date = parseAsDate(timestamps[0]);\n    return date ? [date] : [];\n  }, [columnFilterValue, multiple]);\n\n  const onSelect = React.useCallback(\n    (date: Date | DateRange | undefined) => {\n      if (!date) {\n        column.setFilterValue(undefined);\n        return;\n      }\n\n      if (multiple && !(\"getTime\" in date)) {\n        const from = date.from?.getTime();\n        const to = date.to?.getTime();\n        column.setFilterValue(from || to ? [from, to] : undefined);\n      } else if (!multiple && \"getTime\" in date) {\n        column.setFilterValue(date.getTime());\n      }\n    },\n    [column, multiple]\n  );\n\n  const onReset = React.useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      column.setFilterValue(undefined);\n    },\n    [column]\n  );\n\n  const hasValue = React.useMemo(() => {\n    if (multiple) {\n      if (!getIsDateRange(selectedDates)) return false;\n      return selectedDates.from || selectedDates.to;\n    }\n    if (!Array.isArray(selectedDates)) return false;\n    return selectedDates.length > 0;\n  }, [multiple, selectedDates]);\n\n  const formatDateRange = React.useCallback((range: DateRange) => {\n    if (!range.from && !range.to) return \"\";\n    if (range.from && range.to) {\n      return `${formatDate(range.from)} - ${formatDate(range.to)}`;\n    }\n    return formatDate(range.from ?? range.to);\n  }, []);\n\n  const label = React.useMemo(() => {\n    if (multiple) {\n      if (!getIsDateRange(selectedDates)) return null;\n\n      const hasSelectedDates = selectedDates.from || selectedDates.to;\n      const dateText = hasSelectedDates\n        ? formatDateRange(selectedDates)\n        : \"Select date range\";\n\n      return (\n        <span className=\"ds:flex ds:items-center ds:gap-2\">\n          <span>{title}</span>\n          {hasSelectedDates && (\n            <>\n              <Separator\n                orientation=\"vertical\"\n                className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n              />\n              <span>{dateText}</span>\n            </>\n          )}\n        </span>\n      );\n    }\n\n    if (getIsDateRange(selectedDates)) return null;\n\n    const hasSelectedDate = selectedDates.length > 0;\n    const dateText = hasSelectedDate\n      ? formatDate(selectedDates[0])\n      : \"Select date\";\n\n    return (\n      <span className=\"ds:flex ds:items-center ds:gap-2\">\n        <span>{title}</span>\n        {hasSelectedDate && (\n          <>\n            <Separator\n              orientation=\"vertical\"\n              className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n            />\n            <span>{dateText}</span>\n          </>\n        )}\n      </span>\n    );\n  }, [selectedDates, multiple, formatDateRange, title]);\n\n  const PopContent = (\n    <div className=\"ds:w-auto ds:p-0\">\n      {multiple ? (\n        <Calendar\n          autoFocus\n          captionLayout=\"dropdown\"\n          mode=\"range\"\n          selected={\n            getIsDateRange(selectedDates)\n              ? selectedDates\n              : { from: undefined, to: undefined }\n          }\n          onSelect={onSelect}\n        />\n      ) : (\n        <Calendar\n          captionLayout=\"dropdown\"\n          mode=\"single\"\n          selected={\n            !getIsDateRange(selectedDates) ? selectedDates[0] : undefined\n          }\n          onSelect={onSelect}\n        />\n      )}\n    </div>\n  );\n\n  return (\n    <Popover content={PopContent}>\n      <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n        {hasValue ? (\n          <div\n            role=\"button\"\n            aria-label={`Clear ${title} filter`}\n            tabIndex={0}\n            onClick={onReset}\n            className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n          >\n            <XCircle />\n          </div>\n        ) : (\n          <CalendarIcon />\n        )}\n        {label}\n      </Button>\n    </Popover>\n  );\n}\n"],"names":["getIsDateRange","value","parseAsDate","timestamp","numericTimestamp","date","parseColumnFilterValue","item","DataTableDateFilter","column","title","multiple","columnFilterValue","selectedDates","React","timestamps","onSelect","from","to","onReset","event","hasValue","formatDateRange","range","formatDate","label","hasSelectedDates","dateText","jsxs","jsx","Fragment","Separator","hasSelectedDate","PopContent","Calendar","Popover","Button","XCircle","CalendarIcon"],"mappings":"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"}

package/dist/cjs/components/Table/TableFilter/data-table-filter-popover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-filter-popover.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-filter-popover.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Popover } from \"../../Popover\";\nimport { Input } from \"../../Input\";\nimport { Checkbox } from \"../../Checkbox\";\nimport { Radio } from \"../../Radio\";\nimport { DataTableSliderFilter } from \"./data-table-slider-filter\";\nimport { DataTableDateFilter } from \"./data-table-date-filter\";\nimport { Separator } from \"@/components/Separator\";\nimport { Button } from \"@/components/Button\";\n\ninterface DataTableFilterPopoverProps<TData> {\n  column: Column<TData>;\n  trigger: React.ReactNode;\n  open?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DataTableFilterPopover<TData>({\n  column,\n  trigger,\n  open,\n  onOpenChange,\n}: DataTableFilterPopoverProps<TData>) {\n  const [internalOpen, setInternalOpen] = React.useState(false);\n\n  const isOpen = open !== undefined ? open : internalOpen;\n  const setIsOpen = onOpenChange || setInternalOpen;\n\n  const columnMeta = column.columnDef.meta;\n\n  const renderFilterContent = () => {\n    if (!columnMeta?.variant) return <div>No filter available</div>;\n\n    switch (columnMeta.variant) {\n      case \"text\":\n        return (\n          <Input\n            placeholder={columnMeta.placeholder ?? columnMeta.label}\n            value={(column.getFilterValue() as string) ?? \"\"}\n            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n              column.setFilterValue(event.target.value)\n            }\n            className=\"ds:h-8 ds:w-full\"\n          />\n        );\n\n      case \"number\":\n        return (\n          <Input\n            type=\"number\"\n            placeholder={columnMeta.placeholder ?? columnMeta.label}\n            value={(column.getFilterValue() as string) ?? \"\"}\n            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n              column.setFilterValue(event.target.value)\n            }\n            className=\"ds:h-8 ds:w-full\"\n          />\n        );\n\n      case \"date\":\n      case \"dateRange\":\n        return (\n          <DataTableDateFilter\n            column={column}\n            title={columnMeta.label ?? column.id}\n            multiple={columnMeta.variant === \"dateRange\"}\n          />\n        );\n\n      case \"range\":\n        return (\n          <DataTableSliderFilter\n            column={column}\n            title={columnMeta.label ?? column.id}\n          />\n        );\n\n      case \"select\":\n      case \"multiSelect\": {\n        const options = columnMeta.options || [];\n        const multiple = columnMeta.variant === \"multiSelect\";\n\n        if (multiple) {\n          const currentValues = (column.getFilterValue() as string[]) || [];\n          return (\n            <>\n              <div className=\"ds:space-y-2 ds:max-h-48 ds:overflow-y-auto ds:text-sm\">\n                {options.map((option) => (\n                  <div\n                    key={option.value}\n                    className=\"ds:flex ds:items-center ds:space-x-2\"\n                  >\n                    <Checkbox\n                      checked={currentValues.includes(option.value)}\n                      onCheckedChange={(checked) => {\n                        if (checked) {\n                          column.setFilterValue([\n                            ...currentValues,\n                            option.value,\n                          ]);\n                        } else {\n                          column.setFilterValue(\n                            currentValues.filter((v) => v !== option.value)\n                          );\n                        }\n                      }}\n                      label={option.label}\n                    />\n                  </div>\n                ))}\n              </div>\n              {/* <Separator className=\"my-2\" /> */}\n              {/* <div className=\"flex justify-center gap-0 mt-2\">\n                <Button\n                  variant=\"ghost\"\n                  onClick={() =>\n                    column.setFilterValue(options.map((o) => o.value))\n                  }\n                >\n                  Check All\n                </Button>\n                <Button\n                  variant=\"ghost\"\n                  onClick={() => column.setFilterValue(undefined)}\n                >\n                  <X className=\"size-3\" />\n                  Clear Filter\n                </Button>\n              </div> */}\n            </>\n          );\n        } else {\n          const currentValue = column.getFilterValue() as string;\n          return (\n            <Radio\n              value={currentValue}\n              onValueChange={(value) => column.setFilterValue(value)}\n              options={options.map((option) => ({\n                label: option.label,\n                value: option.value,\n              }))}\n              className=\"ds:p-1\"\n            />\n          );\n        }\n      }\n\n      default:\n        return <div>No filter available</div>;\n    }\n  };\n\n  const hasFilterValue = column.getFilterValue() != null;\n\n  return (\n    <Popover\n      open={isOpen}\n      onOpenChange={setIsOpen}\n      trigger={trigger}\n      content={\n        <div className=\"ds:p-2 ds:min-w-32\">\n          {renderFilterContent()}\n          {hasFilterValue && (\n            <>\n              <Separator className=\"ds:mt-3 ds:mb-1\" />\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => column.setFilterValue(undefined)}\n              >\n                <X className=\"ds:size-3\" />\n                Clear Filter\n              </Button>\n            </>\n          )}\n        </div>\n      }\n      contentClassName=\"ds:p-0\"\n    />\n  );\n}\n"],"names":["DataTableFilterPopover","column","trigger","open","onOpenChange","internalOpen","setInternalOpen","React","isOpen","setIsOpen","columnMeta","renderFilterContent","jsx","Input","event","DataTableDateFilter","DataTableSliderFilter","options","currentValues","Fragment","option","Checkbox","checked","v","currentValue","Radio","value","hasFilterValue","Popover","jsxs","Separator","Button","X"],"mappings":"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"}
+{"version":3,"file":"data-table-filter-popover.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-filter-popover.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Popover } from \"../../Popover\";\nimport { Input } from \"../../Input\";\nimport { Checkbox } from \"../../Checkbox\";\nimport { Radio } from \"../../Radio\";\nimport { DataTableSliderFilter } from \"./data-table-slider-filter\";\nimport { DataTableDateFilter } from \"./data-table-date-filter\";\nimport { Separator } from \"@/components/Separator\";\nimport { Button } from \"@/components/Button\";\n\nexport interface DataTableFilterPopoverProps<TData> {\n  column: Column<TData>;\n  trigger: React.ReactNode;\n  open?: boolean;\n  onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DataTableFilterPopover<TData>({\n  column,\n  trigger,\n  open,\n  onOpenChange,\n}: DataTableFilterPopoverProps<TData>) {\n  const [internalOpen, setInternalOpen] = React.useState(false);\n\n  const isOpen = open !== undefined ? open : internalOpen;\n  const setIsOpen = onOpenChange || setInternalOpen;\n\n  const columnMeta = column.columnDef.meta;\n\n  const renderFilterContent = () => {\n    if (!columnMeta?.variant) return <div>No filter available</div>;\n\n    switch (columnMeta.variant) {\n      case \"text\":\n        return (\n          <Input\n            placeholder={columnMeta.placeholder ?? columnMeta.label}\n            value={(column.getFilterValue() as string) ?? \"\"}\n            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n              column.setFilterValue(event.target.value)\n            }\n            className=\"ds:h-8 ds:w-full\"\n          />\n        );\n\n      case \"number\":\n        return (\n          <Input\n            type=\"number\"\n            placeholder={columnMeta.placeholder ?? columnMeta.label}\n            value={(column.getFilterValue() as string) ?? \"\"}\n            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n              column.setFilterValue(event.target.value)\n            }\n            className=\"ds:h-8 ds:w-full\"\n          />\n        );\n\n      case \"date\":\n      case \"dateRange\":\n        return (\n          <DataTableDateFilter\n            column={column}\n            title={columnMeta.label ?? column.id}\n            multiple={columnMeta.variant === \"dateRange\"}\n          />\n        );\n\n      case \"range\":\n        return (\n          <DataTableSliderFilter\n            column={column}\n            title={columnMeta.label ?? column.id}\n          />\n        );\n\n      case \"select\":\n      case \"multiSelect\": {\n        const options = columnMeta.options || [];\n        const multiple = columnMeta.variant === \"multiSelect\";\n\n        if (multiple) {\n          const currentValues = (column.getFilterValue() as string[]) || [];\n          return (\n            <>\n              <div className=\"ds:space-y-2 ds:max-h-48 ds:overflow-y-auto ds:text-sm\">\n                {options.map((option) => (\n                  <div\n                    key={option.value}\n                    className=\"ds:flex ds:items-center ds:space-x-2\"\n                  >\n                    <Checkbox\n                      checked={currentValues.includes(option.value)}\n                      onCheckedChange={(checked) => {\n                        if (checked) {\n                          column.setFilterValue([\n                            ...currentValues,\n                            option.value,\n                          ]);\n                        } else {\n                          column.setFilterValue(\n                            currentValues.filter((v) => v !== option.value)\n                          );\n                        }\n                      }}\n                      label={option.label}\n                    />\n                  </div>\n                ))}\n              </div>\n              {/* <Separator className=\"my-2\" /> */}\n              {/* <div className=\"flex justify-center gap-0 mt-2\">\n                <Button\n                  variant=\"ghost\"\n                  onClick={() =>\n                    column.setFilterValue(options.map((o) => o.value))\n                  }\n                >\n                  Check All\n                </Button>\n                <Button\n                  variant=\"ghost\"\n                  onClick={() => column.setFilterValue(undefined)}\n                >\n                  <X className=\"size-3\" />\n                  Clear Filter\n                </Button>\n              </div> */}\n            </>\n          );\n        } else {\n          const currentValue = column.getFilterValue() as string;\n          return (\n            <Radio\n              value={currentValue}\n              onValueChange={(value) => column.setFilterValue(value)}\n              options={options.map((option) => ({\n                label: option.label,\n                value: option.value,\n              }))}\n              className=\"ds:p-1\"\n            />\n          );\n        }\n      }\n\n      default:\n        return <div>No filter available</div>;\n    }\n  };\n\n  const hasFilterValue = column.getFilterValue() != null;\n\n  return (\n    <Popover\n      open={isOpen}\n      onOpenChange={setIsOpen}\n      trigger={trigger}\n      content={\n        <div className=\"ds:p-2 ds:min-w-32\">\n          {renderFilterContent()}\n          {hasFilterValue && (\n            <>\n              <Separator className=\"ds:mt-3 ds:mb-1\" />\n              <Button\n                variant=\"ghost\"\n                size=\"sm\"\n                onClick={() => column.setFilterValue(undefined)}\n              >\n                <X className=\"ds:size-3\" />\n                Clear Filter\n              </Button>\n            </>\n          )}\n        </div>\n      }\n      contentClassName=\"ds:p-0\"\n    />\n  );\n}\n"],"names":["DataTableFilterPopover","column","trigger","open","onOpenChange","internalOpen","setInternalOpen","React","isOpen","setIsOpen","columnMeta","renderFilterContent","jsx","Input","event","DataTableDateFilter","DataTableSliderFilter","options","currentValues","Fragment","option","Checkbox","checked","v","currentValue","Radio","value","hasFilterValue","Popover","jsxs","Separator","Button","X"],"mappings":"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"}

package/dist/cjs/components/Table/TableFilter/data-table-slider-filter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-slider-filter.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-slider-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { PlusCircle, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../../Button\";\nimport { Input } from \"../../Input\";\nimport { Popover } from \"../../Popover\";\nimport { Separator } from \"../../Separator\";\nimport { Slider } from \"../../Slider\";\nimport { cn } from \"@dsui/ui/index\";\n\ninterface Range {\n  min: number;\n  max: number;\n}\n\ntype RangeValue = [number, number];\n\nfunction getIsValidRange(value: unknown): value is RangeValue {\n  return (\n    Array.isArray(value) &&\n    value.length === 2 &&\n    typeof value[0] === \"number\" &&\n    typeof value[1] === \"number\"\n  );\n}\n\nfunction parseValuesAsNumbers(value: unknown): RangeValue | undefined {\n  if (\n    Array.isArray(value) &&\n    value.length === 2 &&\n    value.every(\n      (v) =>\n        (typeof v === \"string\" || typeof v === \"number\") && !Number.isNaN(v)\n    )\n  ) {\n    return [Number(value[0]), Number(value[1])];\n  }\n\n  return undefined;\n}\n\ninterface DataTableSliderFilterProps<TData> {\n  column: Column<TData, unknown>;\n  title?: string;\n}\n\nexport function DataTableSliderFilter<TData>({\n  column,\n  title,\n}: DataTableSliderFilterProps<TData>) {\n  const id = React.useId();\n\n  const columnFilterValue = parseValuesAsNumbers(column.getFilterValue());\n\n  const defaultRange = column.columnDef.meta?.range;\n  const unit = column.columnDef.meta?.unit;\n\n  const { min, max, step } = React.useMemo<Range & { step: number }>(() => {\n    let minValue = 0;\n    let maxValue = 100;\n\n    if (defaultRange && getIsValidRange(defaultRange)) {\n      [minValue, maxValue] = defaultRange;\n    } else {\n      const values = column.getFacetedMinMaxValues();\n      if (values && Array.isArray(values) && values.length === 2) {\n        const [facetMinValue, facetMaxValue] = values;\n        if (\n          typeof facetMinValue === \"number\" &&\n          typeof facetMaxValue === \"number\"\n        ) {\n          minValue = facetMinValue;\n          maxValue = facetMaxValue;\n        }\n      }\n    }\n\n    const rangeSize = maxValue - minValue;\n    const step =\n      rangeSize <= 20\n        ? 1\n        : rangeSize <= 100\n          ? Math.ceil(rangeSize / 20)\n          : Math.ceil(rangeSize / 50);\n\n    return { min: minValue, max: maxValue, step };\n  }, [column, defaultRange]);\n\n  const range = React.useMemo((): RangeValue => {\n    return columnFilterValue ?? [min, max];\n  }, [columnFilterValue, min, max]);\n\n  const formatValue = React.useCallback((value: number) => {\n    return value.toLocaleString(undefined, { maximumFractionDigits: 0 });\n  }, []);\n\n  const onFromInputChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const numValue = Number(event.target.value);\n      if (!Number.isNaN(numValue) && numValue >= min && numValue <= range[1]) {\n        column.setFilterValue([numValue, range[1]]);\n      }\n    },\n    [column, min, range]\n  );\n\n  const onToInputChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const numValue = Number(event.target.value);\n      if (!Number.isNaN(numValue) && numValue <= max && numValue >= range[0]) {\n        column.setFilterValue([range[0], numValue]);\n      }\n    },\n    [column, max, range]\n  );\n\n  const onSliderValueChange = React.useCallback(\n    (value: RangeValue) => {\n      if (Array.isArray(value) && value.length === 2) {\n        column.setFilterValue(value);\n      }\n    },\n    [column]\n  );\n\n  const onReset = React.useCallback(\n    (event: React.MouseEvent) => {\n      if (event.target instanceof HTMLDivElement) {\n        event.stopPropagation();\n      }\n      column.setFilterValue(undefined);\n    },\n    [column]\n  );\n\n  const PopContent = (\n    <div className=\"ds:flex ds:w-auto ds:flex-col ds:gap-4\">\n      <div className=\"ds:flex ds:flex-col ds:gap-3\">\n        <p className=\"ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\">\n          {title}\n        </p>\n        <div className=\"ds:flex ds:items-center ds:gap-4\">\n          <label htmlFor={`${id}-from`} className=\"ds:sr-only\">\n            From\n          </label>\n          <div className=\"ds:relative\">\n            <Input\n              id={`${id}-from`}\n              type=\"number\"\n              aria-valuemin={min}\n              aria-valuemax={max}\n              inputMode=\"numeric\"\n              pattern=\"[0-9]*\"\n              placeholder={min.toString()}\n              min={min}\n              max={max}\n              value={range[0]?.toString()}\n              onChange={onFromInputChange}\n              className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n            />\n            {unit && (\n              <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n                {unit}\n              </span>\n            )}\n          </div>\n          <label htmlFor={`${id}-to`} className=\"ds:sr-only\">\n            to\n          </label>\n          <div className=\"ds:relative\">\n            <Input\n              id={`${id}-to`}\n              type=\"number\"\n              aria-valuemin={min}\n              aria-valuemax={max}\n              inputMode=\"numeric\"\n              pattern=\"[0-9]*\"\n              placeholder={max.toString()}\n              min={min}\n              max={max}\n              value={range[1]?.toString()}\n              onChange={onToInputChange}\n              className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n            />\n            {unit && (\n              <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n                {unit}\n              </span>\n            )}\n          </div>\n        </div>\n        <label htmlFor={`${id}-slider`} className=\"ds:sr-only\">\n          {title} slider\n        </label>\n        <Slider\n          id={`${id}-slider`}\n          min={min}\n          max={max}\n          step={step}\n          value={range}\n          onValueChange={onSliderValueChange}\n        />\n      </div>\n      <Button\n        aria-label={`Clear ${title} filter`}\n        variant=\"outline\"\n        size=\"sm\"\n        onClick={onReset}\n      >\n        Clear\n      </Button>\n    </div>\n  );\n\n  return (\n    <Popover content={PopContent}>\n      <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n        {columnFilterValue ? (\n          <div\n            role=\"button\"\n            aria-label={`Clear ${title} filter`}\n            tabIndex={0}\n            className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n            onClick={onReset}\n          >\n            <XCircle />\n          </div>\n        ) : (\n          <PlusCircle />\n        )}\n        <span>{title}</span>\n        {columnFilterValue ? (\n          <>\n            <Separator\n              orientation=\"vertical\"\n              className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n            />\n            {formatValue(columnFilterValue[0])} -{\" \"}\n            {formatValue(columnFilterValue[1])}\n            {unit ? ` ${unit}` : \"\"}\n          </>\n        ) : null}\n      </Button>\n    </Popover>\n  );\n}\n"],"names":["getIsValidRange","value","parseValuesAsNumbers","v","DataTableSliderFilter","column","title","id","React","columnFilterValue","defaultRange","unit","min","max","step","minValue","maxValue","values","facetMinValue","facetMaxValue","rangeSize","range","formatValue","onFromInputChange","event","numValue","onToInputChange","onSliderValueChange","onReset","PopContent","jsxs","jsx","Input","cn","Slider","Button","Popover","XCircle","PlusCircle","Fragment","Separator"],"mappings":"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"}
+{"version":3,"file":"data-table-slider-filter.cjs","sources":["../../../../../src/components/Table/TableFilter/data-table-slider-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { PlusCircle, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../../Button\";\nimport { Input } from \"../../Input\";\nimport { Popover } from \"../../Popover\";\nimport { Separator } from \"../../Separator\";\nimport { Slider } from \"../../Slider\";\nimport { cn } from \"@dsui/ui/index\";\n\ninterface Range {\n  min: number;\n  max: number;\n}\n\ntype RangeValue = [number, number];\n\nfunction getIsValidRange(value: unknown): value is RangeValue {\n  return (\n    Array.isArray(value) &&\n    value.length === 2 &&\n    typeof value[0] === \"number\" &&\n    typeof value[1] === \"number\"\n  );\n}\n\nfunction parseValuesAsNumbers(value: unknown): RangeValue | undefined {\n  if (\n    Array.isArray(value) &&\n    value.length === 2 &&\n    value.every(\n      (v) =>\n        (typeof v === \"string\" || typeof v === \"number\") && !Number.isNaN(v)\n    )\n  ) {\n    return [Number(value[0]), Number(value[1])];\n  }\n\n  return undefined;\n}\n\nexport interface DataTableSliderFilterProps<TData> {\n  column: Column<TData, unknown>;\n  title?: string;\n}\n\nexport function DataTableSliderFilter<TData>({\n  column,\n  title,\n}: DataTableSliderFilterProps<TData>) {\n  const id = React.useId();\n\n  const columnFilterValue = parseValuesAsNumbers(column.getFilterValue());\n\n  const defaultRange = column.columnDef.meta?.range;\n  const unit = column.columnDef.meta?.unit;\n\n  const { min, max, step } = React.useMemo<Range & { step: number }>(() => {\n    let minValue = 0;\n    let maxValue = 100;\n\n    if (defaultRange && getIsValidRange(defaultRange)) {\n      [minValue, maxValue] = defaultRange;\n    } else {\n      const values = column.getFacetedMinMaxValues();\n      if (values && Array.isArray(values) && values.length === 2) {\n        const [facetMinValue, facetMaxValue] = values;\n        if (\n          typeof facetMinValue === \"number\" &&\n          typeof facetMaxValue === \"number\"\n        ) {\n          minValue = facetMinValue;\n          maxValue = facetMaxValue;\n        }\n      }\n    }\n\n    const rangeSize = maxValue - minValue;\n    const step =\n      rangeSize <= 20\n        ? 1\n        : rangeSize <= 100\n          ? Math.ceil(rangeSize / 20)\n          : Math.ceil(rangeSize / 50);\n\n    return { min: minValue, max: maxValue, step };\n  }, [column, defaultRange]);\n\n  const range = React.useMemo((): RangeValue => {\n    return columnFilterValue ?? [min, max];\n  }, [columnFilterValue, min, max]);\n\n  const formatValue = React.useCallback((value: number) => {\n    return value.toLocaleString(undefined, { maximumFractionDigits: 0 });\n  }, []);\n\n  const onFromInputChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const numValue = Number(event.target.value);\n      if (!Number.isNaN(numValue) && numValue >= min && numValue <= range[1]) {\n        column.setFilterValue([numValue, range[1]]);\n      }\n    },\n    [column, min, range]\n  );\n\n  const onToInputChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      const numValue = Number(event.target.value);\n      if (!Number.isNaN(numValue) && numValue <= max && numValue >= range[0]) {\n        column.setFilterValue([range[0], numValue]);\n      }\n    },\n    [column, max, range]\n  );\n\n  const onSliderValueChange = React.useCallback(\n    (value: RangeValue) => {\n      if (Array.isArray(value) && value.length === 2) {\n        column.setFilterValue(value);\n      }\n    },\n    [column]\n  );\n\n  const onReset = React.useCallback(\n    (event: React.MouseEvent) => {\n      if (event.target instanceof HTMLDivElement) {\n        event.stopPropagation();\n      }\n      column.setFilterValue(undefined);\n    },\n    [column]\n  );\n\n  const PopContent = (\n    <div className=\"ds:flex ds:w-auto ds:flex-col ds:gap-4\">\n      <div className=\"ds:flex ds:flex-col ds:gap-3\">\n        <p className=\"ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\">\n          {title}\n        </p>\n        <div className=\"ds:flex ds:items-center ds:gap-4\">\n          <label htmlFor={`${id}-from`} className=\"ds:sr-only\">\n            From\n          </label>\n          <div className=\"ds:relative\">\n            <Input\n              id={`${id}-from`}\n              type=\"number\"\n              aria-valuemin={min}\n              aria-valuemax={max}\n              inputMode=\"numeric\"\n              pattern=\"[0-9]*\"\n              placeholder={min.toString()}\n              min={min}\n              max={max}\n              value={range[0]?.toString()}\n              onChange={onFromInputChange}\n              className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n            />\n            {unit && (\n              <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n                {unit}\n              </span>\n            )}\n          </div>\n          <label htmlFor={`${id}-to`} className=\"ds:sr-only\">\n            to\n          </label>\n          <div className=\"ds:relative\">\n            <Input\n              id={`${id}-to`}\n              type=\"number\"\n              aria-valuemin={min}\n              aria-valuemax={max}\n              inputMode=\"numeric\"\n              pattern=\"[0-9]*\"\n              placeholder={max.toString()}\n              min={min}\n              max={max}\n              value={range[1]?.toString()}\n              onChange={onToInputChange}\n              className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n            />\n            {unit && (\n              <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n                {unit}\n              </span>\n            )}\n          </div>\n        </div>\n        <label htmlFor={`${id}-slider`} className=\"ds:sr-only\">\n          {title} slider\n        </label>\n        <Slider\n          id={`${id}-slider`}\n          min={min}\n          max={max}\n          step={step}\n          value={range}\n          onValueChange={onSliderValueChange}\n        />\n      </div>\n      <Button\n        aria-label={`Clear ${title} filter`}\n        variant=\"outline\"\n        size=\"sm\"\n        onClick={onReset}\n      >\n        Clear\n      </Button>\n    </div>\n  );\n\n  return (\n    <Popover content={PopContent}>\n      <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n        {columnFilterValue ? (\n          <div\n            role=\"button\"\n            aria-label={`Clear ${title} filter`}\n            tabIndex={0}\n            className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n            onClick={onReset}\n          >\n            <XCircle />\n          </div>\n        ) : (\n          <PlusCircle />\n        )}\n        <span>{title}</span>\n        {columnFilterValue ? (\n          <>\n            <Separator\n              orientation=\"vertical\"\n              className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n            />\n            {formatValue(columnFilterValue[0])} -{\" \"}\n            {formatValue(columnFilterValue[1])}\n            {unit ? ` ${unit}` : \"\"}\n          </>\n        ) : null}\n      </Button>\n    </Popover>\n  );\n}\n"],"names":["getIsValidRange","value","parseValuesAsNumbers","v","DataTableSliderFilter","column","title","id","React","columnFilterValue","defaultRange","unit","min","max","step","minValue","maxValue","values","facetMinValue","facetMaxValue","rangeSize","range","formatValue","onFromInputChange","event","numValue","onToInputChange","onSliderValueChange","onReset","PopContent","jsxs","jsx","Input","cn","Slider","Button","Popover","XCircle","PlusCircle","Fragment","Separator"],"mappings":"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"}

package/dist/cjs/components/Table/data-table-column-header.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table-column-header.cjs","sources":["../../../../src/components/Table/data-table-column-header.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport {\n  ChevronDown,\n  ChevronsUpDown,\n  ChevronUp,\n  EyeOff,\n  Filter,\n  X,\n} from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui\";\nimport DropdownMenu, {\n  type DropdownMenuItem,\n} from \"../DropdownMenu/DropdownMenu\";\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport { Button } from \"../Button\";\n\ninterface DataTableColumnHeaderProps<TData, TValue> {\n  column: Column<TData, TValue>;\n  label?: string;\n  className?: string;\n}\n\nexport function DataTableColumnHeader<TData, TValue>({\n  column,\n  label,\n  className,\n}: DataTableColumnHeaderProps<TData, TValue>) {\n  const displayLabel =\n    label ||\n    (typeof column.columnDef.header === \"string\"\n      ? column.columnDef.header\n      : null);\n\n  const hasActions =\n    column.getCanSort() || column.getCanHide() || column.getCanFilter();\n\n  if (!hasActions) {\n    return <div className={cn(className)}>{displayLabel}</div>;\n  }\n\n  const sortTrigger = (\n    <button className=\"ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground\">\n      {displayLabel}\n      {column.getCanSort() &&\n        (column.getIsSorted() === \"desc\" ? (\n          <ChevronDown />\n        ) : column.getIsSorted() === \"asc\" ? (\n          <ChevronUp />\n        ) : (\n          <ChevronsUpDown />\n        ))}\n    </button>\n  );\n\n  const filterButton =\n    column.getCanFilter() && column.columnDef.meta?.variant ? (\n      <DataTableFilterPopover\n        column={column}\n        trigger={\n          <Button\n            variant=\"ghost\"\n            className={cn(\n              \"ds:hover:bg-accent ds:rounded ds:p-1\",\n              column.getFilterValue() ? \"ds:text-primary\" : \"\"\n            )}\n          >\n            <Filter className=\"ds:size-4\" />\n          </Button>\n        }\n      />\n    ) : null;\n\n  const items: DropdownMenuItem[] = [];\n\n  if (column.getCanSort()) {\n    items.push({\n      key: \"asc\",\n      type: \"checkbox\",\n      label: \"Asc\",\n      icon: <ChevronUp />,\n      checked: column.getIsSorted() === \"asc\",\n      onClick: () => column.toggleSorting(false),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n    items.push({\n      key: \"desc\",\n      type: \"checkbox\",\n      label: \"Desc\",\n      icon: <ChevronDown />,\n      checked: column.getIsSorted() === \"desc\",\n      onClick: () => column.toggleSorting(true),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n    if (column.getIsSorted()) {\n      items.push({\n        key: \"reset\",\n        type: \"item\",\n        label: \"Reset\",\n        icon: <X />,\n        onClick: () => column.clearSorting(),\n        className: \"ds:pl-2 ds:[&_svg]:text-muted-foreground\",\n      });\n    }\n  }\n\n  if (column.getCanHide()) {\n    items.push({\n      key: \"hide\",\n      type: \"checkbox\",\n      label: \"Hide\",\n      icon: <EyeOff />,\n      checked: !column.getIsVisible(),\n      onClick: () => column.toggleVisibility(false),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n  }\n\n  return (\n    <div className={cn(\"ds:flex ds:items-center ds:gap-1.5\", className)}>\n      <DropdownMenu\n        trigger={sortTrigger}\n        items={items}\n        align=\"start\"\n        contentClassName=\"ds:w-28\"\n      />\n      {filterButton}\n    </div>\n  );\n}\n"],"names":["DataTableColumnHeader","column","label","className","displayLabel","cn","sortTrigger","jsxs","jsx","ChevronDown","ChevronUp","ChevronsUpDown","filterButton","DataTableFilterPopover","Button","Filter","items","X","EyeOff","DropdownMenu"],"mappings":"qrDAyBO,SAASA,EAAqC,CACnD,OAAAC,EACA,MAAAC,EACA,UAAAC,CACF,EAA8C,CAC5C,MAAMC,EACJF,IACC,OAAOD,EAAO,UAAU,QAAW,SAChCA,EAAO,UAAU,OACjB,MAKN,GAAI,EAFFA,EAAO,WAAA,GAAgBA,EAAO,WAAA,GAAgBA,EAAO,aAAA,GAGrD,aAAQ,MAAA,CAAI,UAAWI,EAAAA,GAAGF,CAAS,EAAI,SAAAC,EAAa,EAGtD,MAAME,EACJC,EAAAA,KAAC,SAAA,CAAO,UAAU,yQACf,SAAA,CAAAH,EACAH,EAAO,WAAA,IACLA,EAAO,YAAA,IAAkB,OACxBO,EAAAA,IAACC,EAAAA,YAAA,EAAY,EACXR,EAAO,gBAAkB,YAC1BS,EAAAA,UAAA,CAAA,CAAU,QAEVC,EAAAA,eAAA,EAAe,EAAA,EAEtB,EAGIC,EACJX,EAAO,aAAA,GAAkBA,EAAO,UAAU,MAAM,QAC9CO,EAAAA,IAACK,EAAAA,uBAAA,CACC,OAAAZ,EACA,QACEO,EAAAA,IAACM,EAAAA,QAAA,CACC,QAAQ,QACR,UAAWT,EAAAA,GACT,uCACAJ,EAAO,eAAA,EAAmB,kBAAoB,EAAA,EAGhD,SAAAO,EAAAA,IAACO,EAAAA,OAAA,CAAO,UAAU,WAAA,CAAY,CAAA,CAAA,CAChC,CAAA,EAGF,KAEAC,EAA4B,CAAA,EAElC,OAAIf,EAAO,eACTe,EAAM,KAAK,CACT,IAAK,MACL,KAAM,WACN,MAAO,MACP,WAAON,EAAAA,UAAA,EAAU,EACjB,QAAST,EAAO,YAAA,IAAkB,MAClC,QAAS,IAAMA,EAAO,cAAc,EAAK,EACzC,UACE,gIAAA,CACH,EACDe,EAAM,KAAK,CACT,IAAK,OACL,KAAM,WACN,MAAO,OACP,WAAOP,EAAAA,YAAA,EAAY,EACnB,QAASR,EAAO,YAAA,IAAkB,OAClC,QAAS,IAAMA,EAAO,cAAc,EAAI,EACxC,UACE,gIAAA,CACH,EACGA,EAAO,eACTe,EAAM,KAAK,CACT,IAAK,QACL,KAAM,OACN,MAAO,QACP,WAAOC,EAAAA,EAAA,EAAE,EACT,QAAS,IAAMhB,EAAO,aAAA,EACtB,UAAW,0CAAA,CACZ,GAIDA,EAAO,cACTe,EAAM,KAAK,CACT,IAAK,OACL,KAAM,WACN,MAAO,OACP,WAAOE,EAAAA,OAAA,EAAO,EACd,QAAS,CAACjB,EAAO,aAAA,EACjB,QAAS,IAAMA,EAAO,iBAAiB,EAAK,EAC5C,UACE,gIAAA,CACH,SAIA,MAAA,CAAI,UAAWI,EAAAA,GAAG,qCAAsCF,CAAS,EAChE,SAAA,CAAAK,EAAAA,IAACW,EAAAA,QAAA,CACC,QAASb,EACT,MAAAU,EACA,MAAM,QACN,iBAAiB,SAAA,CAAA,EAElBJ,CAAA,EACH,CAEJ"}
+{"version":3,"file":"data-table-column-header.cjs","sources":["../../../../src/components/Table/data-table-column-header.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport {\n  ChevronDown,\n  ChevronsUpDown,\n  ChevronUp,\n  EyeOff,\n  Filter,\n  X,\n} from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui\";\nimport DropdownMenu, {\n  type DropdownMenuItem,\n} from \"../DropdownMenu/DropdownMenu\";\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport { Button } from \"../Button\";\n\nexport interface DataTableColumnHeaderProps<TData, TValue> {\n  column: Column<TData, TValue>;\n  label?: string;\n  className?: string;\n}\n\nexport function DataTableColumnHeader<TData, TValue>({\n  column,\n  label,\n  className,\n}: DataTableColumnHeaderProps<TData, TValue>) {\n  const displayLabel =\n    label ||\n    (typeof column.columnDef.header === \"string\"\n      ? column.columnDef.header\n      : null);\n\n  const hasActions =\n    column.getCanSort() || column.getCanHide() || column.getCanFilter();\n\n  if (!hasActions) {\n    return <div className={cn(className)}>{displayLabel}</div>;\n  }\n\n  const sortTrigger = (\n    <button className=\"ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground\">\n      {displayLabel}\n      {column.getCanSort() &&\n        (column.getIsSorted() === \"desc\" ? (\n          <ChevronDown />\n        ) : column.getIsSorted() === \"asc\" ? (\n          <ChevronUp />\n        ) : (\n          <ChevronsUpDown />\n        ))}\n    </button>\n  );\n\n  const filterButton =\n    column.getCanFilter() && column.columnDef.meta?.variant ? (\n      <DataTableFilterPopover\n        column={column}\n        trigger={\n          <Button\n            variant=\"ghost\"\n            className={cn(\n              \"ds:hover:bg-accent ds:rounded ds:p-1\",\n              column.getFilterValue() ? \"ds:text-primary\" : \"\"\n            )}\n          >\n            <Filter className=\"ds:size-4\" />\n          </Button>\n        }\n      />\n    ) : null;\n\n  const items: DropdownMenuItem[] = [];\n\n  if (column.getCanSort()) {\n    items.push({\n      key: \"asc\",\n      type: \"checkbox\",\n      label: \"Asc\",\n      icon: <ChevronUp />,\n      checked: column.getIsSorted() === \"asc\",\n      onClick: () => column.toggleSorting(false),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n    items.push({\n      key: \"desc\",\n      type: \"checkbox\",\n      label: \"Desc\",\n      icon: <ChevronDown />,\n      checked: column.getIsSorted() === \"desc\",\n      onClick: () => column.toggleSorting(true),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n    if (column.getIsSorted()) {\n      items.push({\n        key: \"reset\",\n        type: \"item\",\n        label: \"Reset\",\n        icon: <X />,\n        onClick: () => column.clearSorting(),\n        className: \"ds:pl-2 ds:[&_svg]:text-muted-foreground\",\n      });\n    }\n  }\n\n  if (column.getCanHide()) {\n    items.push({\n      key: \"hide\",\n      type: \"checkbox\",\n      label: \"Hide\",\n      icon: <EyeOff />,\n      checked: !column.getIsVisible(),\n      onClick: () => column.toggleVisibility(false),\n      className:\n        \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n    });\n  }\n\n  return (\n    <div className={cn(\"ds:flex ds:items-center ds:gap-1.5\", className)}>\n      <DropdownMenu\n        trigger={sortTrigger}\n        items={items}\n        align=\"start\"\n        contentClassName=\"ds:w-28\"\n      />\n      {filterButton}\n    </div>\n  );\n}\n"],"names":["DataTableColumnHeader","column","label","className","displayLabel","cn","sortTrigger","jsxs","jsx","ChevronDown","ChevronUp","ChevronsUpDown","filterButton","DataTableFilterPopover","Button","Filter","items","X","EyeOff","DropdownMenu"],"mappings":"qrDAyBO,SAASA,EAAqC,CACnD,OAAAC,EACA,MAAAC,EACA,UAAAC,CACF,EAA8C,CAC5C,MAAMC,EACJF,IACC,OAAOD,EAAO,UAAU,QAAW,SAChCA,EAAO,UAAU,OACjB,MAKN,GAAI,EAFFA,EAAO,WAAA,GAAgBA,EAAO,WAAA,GAAgBA,EAAO,aAAA,GAGrD,aAAQ,MAAA,CAAI,UAAWI,EAAAA,GAAGF,CAAS,EAAI,SAAAC,EAAa,EAGtD,MAAME,EACJC,EAAAA,KAAC,SAAA,CAAO,UAAU,yQACf,SAAA,CAAAH,EACAH,EAAO,WAAA,IACLA,EAAO,YAAA,IAAkB,OACxBO,EAAAA,IAACC,EAAAA,YAAA,EAAY,EACXR,EAAO,gBAAkB,YAC1BS,EAAAA,UAAA,CAAA,CAAU,QAEVC,EAAAA,eAAA,EAAe,EAAA,EAEtB,EAGIC,EACJX,EAAO,aAAA,GAAkBA,EAAO,UAAU,MAAM,QAC9CO,EAAAA,IAACK,EAAAA,uBAAA,CACC,OAAAZ,EACA,QACEO,EAAAA,IAACM,EAAAA,QAAA,CACC,QAAQ,QACR,UAAWT,EAAAA,GACT,uCACAJ,EAAO,eAAA,EAAmB,kBAAoB,EAAA,EAGhD,SAAAO,EAAAA,IAACO,EAAAA,OAAA,CAAO,UAAU,WAAA,CAAY,CAAA,CAAA,CAChC,CAAA,EAGF,KAEAC,EAA4B,CAAA,EAElC,OAAIf,EAAO,eACTe,EAAM,KAAK,CACT,IAAK,MACL,KAAM,WACN,MAAO,MACP,WAAON,EAAAA,UAAA,EAAU,EACjB,QAAST,EAAO,YAAA,IAAkB,MAClC,QAAS,IAAMA,EAAO,cAAc,EAAK,EACzC,UACE,gIAAA,CACH,EACDe,EAAM,KAAK,CACT,IAAK,OACL,KAAM,WACN,MAAO,OACP,WAAOP,EAAAA,YAAA,EAAY,EACnB,QAASR,EAAO,YAAA,IAAkB,OAClC,QAAS,IAAMA,EAAO,cAAc,EAAI,EACxC,UACE,gIAAA,CACH,EACGA,EAAO,eACTe,EAAM,KAAK,CACT,IAAK,QACL,KAAM,OACN,MAAO,QACP,WAAOC,EAAAA,EAAA,EAAE,EACT,QAAS,IAAMhB,EAAO,aAAA,EACtB,UAAW,0CAAA,CACZ,GAIDA,EAAO,cACTe,EAAM,KAAK,CACT,IAAK,OACL,KAAM,WACN,MAAO,OACP,WAAOE,EAAAA,OAAA,EAAO,EACd,QAAS,CAACjB,EAAO,aAAA,EACjB,QAAS,IAAMA,EAAO,iBAAiB,EAAK,EAC5C,UACE,gIAAA,CACH,SAIA,MAAA,CAAI,UAAWI,EAAAA,GAAG,qCAAsCF,CAAS,EAChE,SAAA,CAAAK,EAAAA,IAACW,EAAAA,QAAA,CACC,QAASb,EACT,MAAAU,EACA,MAAM,QACN,iBAAiB,SAAA,CAAA,EAElBJ,CAAA,EACH,CAEJ"}

package/dist/cjs/components/Table/data-table-toolbar.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("lucide-react"),g=require("react"),m=require("./TableFilter/data-table-filter-popover.cjs"),j=require("./data-table-view-options.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const x=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const o=require("../Button/Button.cjs");function p(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const i in e)if(i!=="default"){const s=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(t,i,s.get?s:{enumerable:!0,get:()=>e[i]})}}return t.default=e,Object.freeze(t)}const n=p(g);function T({table:e,children:t,className:i,showColumnFilters:s=!1,showColumnVisibilityToggle:l=!1,columnVisibilityOptions:c,...d}){const q=e.getState().columnFilters.length>0,f=n.useMemo(()=>e.getAllColumns().filter(a=>a.getCanFilter()),[e]),b=n.useCallback(()=>{e.resetColumnFilters()},[e]);return r.jsxs("div",{role:"toolbar","aria-orientation":"horizontal",className:x.cn("ds:flex ds:w-full ds:items-start ds:justify-between ds:gap-2 ds:p-1",i),...d,children:[s?r.jsxs("div",{className:"ds:flex ds:flex-1 ds:flex-wrap ds:items-center ds:justify-start ds:gap-2",children:[f.map(a=>r.jsx(h,{column:a},a.id)),q&&r.jsxs(o.default,{"aria-label":"Reset filters",variant:"outline",size:"sm",className:"ds:border-dashed",onClick:b,children:[r.jsx(u.X,{}),"Reset"]})]}):r.jsx("div",{}),r.jsxs("div",{className:"ds:flex ds:items-center ds:gap-2",children:[t,l&&r.jsx(j.DataTableViewOptions,{table:e,align:"end",...c})]})]})}function h({column:e}){const t=e.columnDef.meta;if(!t?.variant)return null;const s=e.getFilterValue()!=null?r.jsx(u.XCircle,{}):r.jsx(u.PlusCircle,{}),l=()=>t.label??e.id;return r.jsx(m.DataTableFilterPopover,{column:e,trigger:r.jsxs(o.default,{variant:"outline",size:"sm",className:"ds:border-dashed",children:[s,l()]})})}exports.DataTableToolbar=T;
+//# sourceMappingURL=data-table-toolbar.cjs.map

package/dist/cjs/components/Table/data-table-toolbar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-toolbar.cjs","sources":["../../../../src/components/Table/data-table-toolbar.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column, Table } from \"@tanstack/react-table\";\nimport { PlusCircle, X, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport {\n  DataTableViewOptions,\n  type DataTableViewOptionsProps,\n} from \"./data-table-view-options\";\nimport { Button } from \"../Button\";\nimport { cn } from \"@dsui/ui\";\n\nexport interface DataTableToolbarProps<TData>\n  extends React.ComponentProps<\"div\"> {\n  table: Table<TData>;\n  showColumnFilters?: boolean;\n  showColumnVisibilityToggle?: boolean;\n  columnVisibilityOptions?: Omit<\n    DataTableViewOptionsProps<TData>,\n    \"table\" | \"align\"\n  >;\n}\n\nexport function DataTableToolbar<TData>({\n  table,\n  children,\n  className,\n  showColumnFilters = false,\n  showColumnVisibilityToggle = false,\n  columnVisibilityOptions,\n  ...props\n}: DataTableToolbarProps<TData>) {\n  const isFiltered = table.getState().columnFilters.length > 0;\n\n  const columns = React.useMemo(\n    () => table.getAllColumns().filter((column) => column.getCanFilter()),\n    [table]\n  );\n\n  const onReset = React.useCallback(() => {\n    table.resetColumnFilters();\n  }, [table]);\n\n  return (\n    <div\n      role=\"toolbar\"\n      aria-orientation=\"horizontal\"\n      className={cn(\n        \"ds:flex ds:w-full ds:items-start ds:justify-between ds:gap-2 ds:p-1\",\n        className\n      )}\n      {...props}\n    >\n      {showColumnFilters ? (\n        <div className=\"ds:flex ds:flex-1 ds:flex-wrap ds:items-center ds:justify-start ds:gap-2\">\n          {columns.map((column) => (\n            <DataTableToolbarFilter key={column.id} column={column} />\n          ))}\n          {isFiltered && (\n            <Button\n              aria-label=\"Reset filters\"\n              variant=\"outline\"\n              size=\"sm\"\n              className=\"ds:border-dashed\"\n              onClick={onReset}\n            >\n              <X />\n              Reset\n            </Button>\n          )}\n        </div>\n      ) : (\n        <div />\n      )}\n      <div className=\"ds:flex ds:items-center ds:gap-2\">\n        {children}\n        {showColumnVisibilityToggle && (\n          <DataTableViewOptions\n            table={table}\n            align=\"end\"\n            {...columnVisibilityOptions}\n          />\n        )}\n      </div>\n    </div>\n  );\n}\ninterface DataTableToolbarFilterProps<TData> {\n  column: Column<TData>;\n}\n\nfunction DataTableToolbarFilter<TData>({\n  column,\n}: DataTableToolbarFilterProps<TData>) {\n  const columnMeta = column.columnDef.meta;\n\n  if (!columnMeta?.variant) return null;\n\n  const hasFilterValue = column.getFilterValue() != null;\n  const icon = hasFilterValue ? <XCircle /> : <PlusCircle />;\n\n  const getTriggerLabel = () => {\n    return columnMeta.label ?? column.id;\n  };\n\n  return (\n    <DataTableFilterPopover\n      column={column}\n      trigger={\n        <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed\">\n          {icon}\n          {getTriggerLabel()}\n        </Button>\n      }\n    />\n  );\n}\n"],"names":["DataTableToolbar","table","children","className","showColumnFilters","showColumnVisibilityToggle","columnVisibilityOptions","props","isFiltered","columns","React","column","onReset","jsxs","cn","jsx","DataTableToolbarFilter","Button","X","DataTableViewOptions","columnMeta","icon","XCircle","PlusCircle","getTriggerLabel","DataTableFilterPopover"],"mappings":"88DAyBO,SAASA,EAAwB,CACtC,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,kBAAAC,EAAoB,GACpB,2BAAAC,EAA6B,GAC7B,wBAAAC,EACA,GAAGC,CACL,EAAiC,CAC/B,MAAMC,EAAaP,EAAM,SAAA,EAAW,cAAc,OAAS,EAErDQ,EAAUC,EAAM,QACpB,IAAMT,EAAM,gBAAgB,OAAQU,GAAWA,EAAO,cAAc,EACpE,CAACV,CAAK,CAAA,EAGFW,EAAUF,EAAM,YAAY,IAAM,CACtCT,EAAM,mBAAA,CACR,EAAG,CAACA,CAAK,CAAC,EAEV,OACEY,EAAAA,KAAC,MAAA,CACC,KAAK,UACL,mBAAiB,aACjB,UAAWC,EAAAA,GACT,sEACAX,CAAA,EAED,GAAGI,EAEH,SAAA,CAAAH,EACCS,EAAAA,KAAC,MAAA,CAAI,UAAU,2EACZ,SAAA,CAAAJ,EAAQ,IAAKE,GACZI,EAAAA,IAACC,GAAuC,OAAAL,CAAA,EAAXA,EAAO,EAAoB,CACzD,EACAH,GACCK,EAAAA,KAACI,EAAAA,QAAA,CACC,aAAW,gBACX,QAAQ,UACR,KAAK,KACL,UAAU,mBACV,QAASL,EAET,SAAA,CAAAG,EAAAA,IAACG,EAAAA,EAAA,EAAE,EAAE,OAAA,CAAA,CAAA,CAEP,CAAA,CAEJ,QAEC,MAAA,EAAI,EAEPL,EAAAA,KAAC,MAAA,CAAI,UAAU,mCACZ,SAAA,CAAAX,EACAG,GACCU,EAAAA,IAACI,EAAAA,qBAAA,CACC,MAAAlB,EACA,MAAM,MACL,GAAGK,CAAA,CAAA,CACN,CAAA,CAEJ,CAAA,CAAA,CAAA,CAGN,CAKA,SAASU,EAA8B,CACrC,OAAAL,CACF,EAAuC,CACrC,MAAMS,EAAaT,EAAO,UAAU,KAEpC,GAAI,CAACS,GAAY,QAAS,OAAO,KAGjC,MAAMC,EADiBV,EAAO,eAAA,GAAoB,KACpBI,MAACO,EAAAA,QAAA,CAAA,CAAQ,QAAMC,EAAAA,WAAA,EAAW,EAElDC,EAAkB,IACfJ,EAAW,OAAST,EAAO,GAGpC,OACEI,EAAAA,IAACU,EAAAA,uBAAA,CACC,OAAAd,EACA,eACGM,UAAA,CAAO,QAAQ,UAAU,KAAK,KAAK,UAAU,mBAC3C,SAAA,CAAAI,EACAG,EAAA,CAAgB,CAAA,CACnB,CAAA,CAAA,CAIR"}

package/dist/cjs/components/Table/data-table-view-options.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),g=require("../../node_modules/.pnpm/@dnd-kit_core@6.3.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@dnd-kit/core/dist/core.esm.cjs"),b=require("../../node_modules/.pnpm/@dnd-kit_sortable@10.0.0_@dnd-kit_core@6.3.1_react-dom@19.1.1_react@19.1.1__react@19.1.1__react@19.1.1/node_modules/@dnd-kit/sortable/dist/sortable.esm.cjs"),F=require("../../node_modules/.pnpm/@dnd-kit_utilities@3.2.2_react@19.1.1/node_modules/@dnd-kit/utilities/dist/utilities.esm.cjs"),v=require("lucide-react"),G=require("react"),K=require("../Command/Command.cjs"),$=require("../Popover/index.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const I=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const D=require("../Checkbox/Checkbox.cjs"),V=require("../Button/Button.cjs");function H(r){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const n in r)if(n!=="default"){const d=Object.getOwnPropertyDescriptor(r,n);Object.defineProperty(i,n,d.get?d:{enumerable:!0,get:()=>r[n]})}}return i.default=r,Object.freeze(i)}const p=H(G);function J({table:r,variant:i="command",labels:n,triggerIcon:d=t.jsx(v.Settings2,{className:"ds:text-muted-foreground"}),trigger:l,content:x,contentClassName:m,...h}){const a=r.getState().columnOrder,c=r.getState().columnPinning,o=p.useMemo(()=>k(r,a,c).filter(e=>typeof e.accessorFn<"u"&&e.getCanHide()),[r,a,c]),q=p.useCallback(e=>e.columnDef.meta?.label??(typeof e.columnDef.header=="string"?e.columnDef.header:e.id),[]),y=g.useSensors(g.useSensor(g.PointerSensor),g.useSensor(g.KeyboardSensor,{coordinateGetter:b.sortableKeyboardCoordinates})),s=p.useMemo(()=>o.map(e=>e.id),[o]),w=o.every(e=>e.getIsVisible()),T=o.some(e=>e.getIsVisible()),z=p.useCallback(e=>{o.forEach(f=>f.toggleVisibility(e))},[o]),M=p.useCallback(e=>{const{active:f,over:j}=e;if(!j||f.id===j.id)return;const N=s.indexOf(String(f.id)),P=s.indexOf(String(j.id));if(N===-1||P===-1)return;const A=b.arrayMove(s,N,P),S=new Set(s),L=[...A],B=k(r).map(u=>S.has(u.id)?L.shift()??u.id:u.id),O=r.getState().columnPinning,E={...O,left:O?.left?.filter(u=>!S.has(u)),right:O?.right?.filter(u=>!S.has(u))};r.setColumnOrder(B),r.setColumnPinning(E)},[s,r]),R=[{type:"group",heading:"",items:o.map(e=>({type:"item",onClick:()=>e.toggleVisibility(!e.getIsVisible()),children:t.jsxs(t.Fragment,{children:[t.jsx("span",{className:"ds:truncate",children:q(e)}),t.jsx(v.Check,{className:I.cn("ds:ml-auto ds:size-4 ds:shrink-0",e.getIsVisible()?"ds:opacity-100":"ds:opacity-0")})]})}))}],C={trigger:n?.trigger??"View",searchPlaceholder:n?.searchPlaceholder??"Search columns...",selectAll:n?.selectAll??"Chọn tất cả",reset:n?.reset??"Đặt lại"},_=t.jsxs("div",{className:"ds:flex ds:w-full ds:flex-col",children:[t.jsxs("div",{className:"ds:flex ds:items-center ds:gap-3 ds:px-3 ds:py-3",children:[t.jsx(D.default,{"aria-label":"Toggle all columns",checked:w?!0:T?"indeterminate":!1,onCheckedChange:e=>z(e===!0)}),t.jsx("span",{className:"ds:text-sm ds:font-medium ds:text-foreground",children:C.selectAll})]}),t.jsx("div",{className:"ds:mx-3 ds:h-px ds:bg-border"}),t.jsx(g.DndContext,{sensors:y,collisionDetection:g.closestCenter,onDragEnd:M,children:t.jsx(b.SortableContext,{items:s,strategy:b.verticalListSortingStrategy,children:t.jsx("div",{className:"ds:flex ds:max-h-80 ds:flex-col ds:overflow-y-auto ds:py-2",children:o.map(e=>t.jsx(Q,{id:e.id,label:q(e),checked:e.getIsVisible(),onCheckedChange:f=>e.toggleVisibility(f===!0)},e.id))})})}),t.jsx("div",{className:"ds:mx-3 ds:h-px ds:bg-border"}),t.jsx(V.default,{type:"button",variant:"ghost",size:"sm",className:"ds:mx-3 ds:my-2 ds:text-primary hover:ds:text-primary",onClick:()=>{r.resetColumnVisibility(),r.resetColumnOrder(),r.resetColumnPinning()},children:C.reset})]});return t.jsx($.Popover,{trigger:l??t.jsxs(V.default,{"aria-label":"Toggle columns",role:"combobox",variant:"outline",size:"sm",className:"ds:ml-auto ds:h-8 ds:font-normal ds:lg:flex",children:[d,C.trigger]}),content:x??(i==="draggable"?_:t.jsx(K.default,{items:R,search:C.searchPlaceholder})),contentClassName:I.cn("ds:p-0",i==="draggable"?"ds:w-72":"ds:w-44",m),...h})}function k(r,i=r.getState().columnOrder,n=r.getState().columnPinning){const d=r.getAllLeafColumns(),l=new Map(d.map(s=>[s.id,s])),x=d.map(s=>s.id),m=i??[],h=[...m.filter(s=>l.has(s)),...x.filter(s=>!m.includes(s))],a=n??{},c=(a.left??[]).filter(s=>l.has(s)),o=(a.right??[]).filter(s=>l.has(s)),q=new Set([...c,...o]),y=h.filter(s=>!q.has(s));return[...c,...y,...o].map(s=>l.get(s)).filter(s=>!!s)}function Q({id:r,label:i,checked:n,onCheckedChange:d}){const{attributes:l,listeners:x,setNodeRef:m,transform:h,transition:a,isDragging:c}=b.useSortable({id:r});return t.jsxs("div",{ref:m,className:I.cn("ds:flex ds:min-h-11 ds:items-center ds:gap-3 ds:px-3 ds:text-sm ds:text-foreground",c&&"ds:bg-accent"),style:{transform:F.CSS.Transform.toString(h),transition:a},children:[t.jsx("button",{type:"button",className:"ds:flex ds:size-5 ds:shrink-0 ds:cursor-grab ds:items-center ds:justify-center ds:text-muted-foreground active:ds:cursor-grabbing","aria-label":`Reorder ${i}`,...l,...x,children:t.jsx(v.GripVertical,{className:"ds:size-4"})}),t.jsx(D.default,{"aria-label":`Toggle ${i}`,checked:n,onCheckedChange:d}),t.jsx("span",{className:"ds:min-w-0 ds:flex-1 ds:truncate ds:font-medium",children:i})]})}exports.DataTableViewOptions=J;
+//# sourceMappingURL=data-table-view-options.cjs.map

package/dist/cjs/components/Table/data-table-view-options.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table-view-options.cjs","sources":["../../../../src/components/Table/data-table-view-options.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  closestCenter,\n  DndContext,\n  type DragEndEvent,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport {\n  arrayMove,\n  SortableContext,\n  sortableKeyboardCoordinates,\n  useSortable,\n  verticalListSortingStrategy,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport type {\n  Column,\n  ColumnOrderState,\n  ColumnPinningState,\n  Table,\n} from \"@tanstack/react-table\";\nimport { Check, GripVertical, Settings2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../Button\";\nimport { Checkbox } from \"../Checkbox\";\nimport Command, { type CommandItemType } from \"../Command/Command\";\nimport { Popover } from \"../Popover\";\nimport { cn } from \"@dsui/ui\";\n\nexport type DataTableViewOptionsVariant = \"command\" | \"draggable\";\n\nexport interface DataTableViewOptionsLabels {\n  trigger?: React.ReactNode;\n  searchPlaceholder?: string;\n  selectAll?: React.ReactNode;\n  reset?: React.ReactNode;\n}\n\nexport interface DataTableViewOptionsProps<TData> extends React.ComponentProps<\n  typeof Popover\n> {\n  table: Table<TData>;\n  variant?: DataTableViewOptionsVariant;\n  labels?: DataTableViewOptionsLabels;\n  triggerIcon?: React.ReactNode;\n}\n\nexport function DataTableViewOptions<TData>({\n  table,\n  variant = \"command\",\n  labels,\n  triggerIcon = <Settings2 className=\"ds:text-muted-foreground\" />,\n  trigger,\n  content,\n  contentClassName,\n  ...props\n}: DataTableViewOptionsProps<TData>) {\n  const columnOrder = table.getState().columnOrder;\n  const columnPinning = table.getState().columnPinning;\n\n  const columns = React.useMemo(\n    () =>\n      getOrderedTableColumns(table, columnOrder, columnPinning).filter(\n        (column) =>\n          typeof column.accessorFn !== \"undefined\" && column.getCanHide()\n      ),\n    [table, columnOrder, columnPinning]\n  );\n\n  const getColumnLabel = React.useCallback(\n    (column: (typeof columns)[number]) =>\n      column.columnDef.meta?.label ??\n      (typeof column.columnDef.header === \"string\"\n        ? column.columnDef.header\n        : column.id),\n    []\n  );\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    })\n  );\n\n  const columnIds = React.useMemo(\n    () => columns.map((column) => column.id),\n    [columns]\n  );\n\n  const allColumnsVisible = columns.every((column) => column.getIsVisible());\n  const someColumnsVisible = columns.some((column) => column.getIsVisible());\n\n  const onToggleAll = React.useCallback(\n    (checked: boolean) => {\n      columns.forEach((column) => column.toggleVisibility(checked));\n    },\n    [columns]\n  );\n\n  const onDragEnd = React.useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event;\n\n      if (!over || active.id === over.id) return;\n\n      const oldIndex = columnIds.indexOf(String(active.id));\n      const newIndex = columnIds.indexOf(String(over.id));\n\n      if (oldIndex === -1 || newIndex === -1) return;\n\n      const orderedOptionIds = arrayMove(columnIds, oldIndex, newIndex);\n      const optionIdSet = new Set(columnIds);\n      const pendingOptionIds = [...orderedOptionIds];\n      const nextColumnOrder = getOrderedTableColumns(table).map((column) =>\n        optionIdSet.has(column.id)\n          ? (pendingOptionIds.shift() ?? column.id)\n          : column.id\n      );\n      const currentColumnPinning = table.getState().columnPinning;\n      const nextColumnPinning = {\n        ...currentColumnPinning,\n        left: currentColumnPinning?.left?.filter((id) => !optionIdSet.has(id)),\n        right: currentColumnPinning?.right?.filter(\n          (id) => !optionIdSet.has(id)\n        ),\n      };\n\n      table.setColumnOrder(nextColumnOrder);\n      table.setColumnPinning(nextColumnPinning);\n    },\n    [columnIds, table]\n  );\n\n  const items: CommandItemType[] = [\n    {\n      type: \"group\",\n      heading: \"\",\n      items: columns.map((column) => ({\n        type: \"item\" as const,\n        onClick: () => column.toggleVisibility(!column.getIsVisible()),\n        children: (\n          <>\n            <span className=\"ds:truncate\">{getColumnLabel(column)}</span>\n            <Check\n              className={cn(\n                \"ds:ml-auto ds:size-4 ds:shrink-0\",\n                column.getIsVisible() ? \"ds:opacity-100\" : \"ds:opacity-0\"\n              )}\n            />\n          </>\n        ),\n      })),\n    },\n  ];\n\n  const resolvedLabels = {\n    trigger: labels?.trigger ?? \"View\",\n    searchPlaceholder: labels?.searchPlaceholder ?? \"Search columns...\",\n    selectAll: labels?.selectAll ?? \"Chọn tất cả\",\n    reset: labels?.reset ?? \"Đặt lại\",\n  };\n\n  const defaultDraggableContent = (\n    <div className=\"ds:flex ds:w-full ds:flex-col\">\n      <div className=\"ds:flex ds:items-center ds:gap-3 ds:px-3 ds:py-3\">\n        <Checkbox\n          aria-label=\"Toggle all columns\"\n          checked={\n            allColumnsVisible\n              ? true\n              : someColumnsVisible\n                ? \"indeterminate\"\n                : false\n          }\n          onCheckedChange={(checked) => onToggleAll(checked === true)}\n        />\n        <span className=\"ds:text-sm ds:font-medium ds:text-foreground\">\n          {resolvedLabels.selectAll}\n        </span>\n      </div>\n      <div className=\"ds:mx-3 ds:h-px ds:bg-border\" />\n      <DndContext\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        onDragEnd={onDragEnd}\n      >\n        <SortableContext\n          items={columnIds}\n          strategy={verticalListSortingStrategy}\n        >\n          <div className=\"ds:flex ds:max-h-80 ds:flex-col ds:overflow-y-auto ds:py-2\">\n            {columns.map((column) => (\n              <DataTableDraggableColumnOption\n                key={column.id}\n                id={column.id}\n                label={getColumnLabel(column)}\n                checked={column.getIsVisible()}\n                onCheckedChange={(checked) =>\n                  column.toggleVisibility(checked === true)\n                }\n              />\n            ))}\n          </div>\n        </SortableContext>\n      </DndContext>\n      <div className=\"ds:mx-3 ds:h-px ds:bg-border\" />\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        className=\"ds:mx-3 ds:my-2 ds:text-primary hover:ds:text-primary\"\n        onClick={() => {\n          table.resetColumnVisibility();\n          table.resetColumnOrder();\n          table.resetColumnPinning();\n        }}\n      >\n        {resolvedLabels.reset}\n      </Button>\n    </div>\n  );\n\n  return (\n    <Popover\n      trigger={\n        trigger ?? (\n          <Button\n            aria-label=\"Toggle columns\"\n            role=\"combobox\"\n            variant=\"outline\"\n            size=\"sm\"\n            className=\"ds:ml-auto ds:h-8 ds:font-normal ds:lg:flex\"\n          >\n            {triggerIcon}\n            {resolvedLabels.trigger}\n          </Button>\n        )\n      }\n      content={\n        content ??\n        (variant === \"draggable\" ? (\n          defaultDraggableContent\n        ) : (\n          <Command items={items} search={resolvedLabels.searchPlaceholder} />\n        ))\n      }\n      contentClassName={cn(\n        \"ds:p-0\",\n        variant === \"draggable\" ? \"ds:w-72\" : \"ds:w-44\",\n        contentClassName\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction getOrderedTableColumns<TData>(\n  table: Table<TData>,\n  columnOrder: ColumnOrderState = table.getState().columnOrder,\n  columnPinning: ColumnPinningState = table.getState().columnPinning\n) {\n  const allColumns = table.getAllLeafColumns();\n  const columnById = new Map(allColumns.map((column) => [column.id, column]));\n  const columnIds = allColumns.map((column) => column.id);\n  const order = columnOrder ?? [];\n  const orderedIds = [\n    ...order.filter((id) => columnById.has(id)),\n    ...columnIds.filter((id) => !order.includes(id)),\n  ];\n  const pinning = columnPinning ?? {};\n  const leftIds = (pinning.left ?? []).filter((id) => columnById.has(id));\n  const rightIds = (pinning.right ?? []).filter((id) => columnById.has(id));\n  const pinnedIds = new Set([...leftIds, ...rightIds]);\n  const centerIds = orderedIds.filter((id) => !pinnedIds.has(id));\n\n  return [...leftIds, ...centerIds, ...rightIds]\n    .map((id) => columnById.get(id))\n    .filter((column): column is Column<TData, unknown> => Boolean(column));\n}\n\ninterface DataTableDraggableColumnOptionProps {\n  id: string;\n  label: React.ReactNode;\n  checked: boolean;\n  onCheckedChange: React.ComponentProps<typeof Checkbox>[\"onCheckedChange\"];\n}\n\nfunction DataTableDraggableColumnOption({\n  id,\n  label,\n  checked,\n  onCheckedChange,\n}: DataTableDraggableColumnOptionProps) {\n  const {\n    attributes,\n    listeners,\n    setNodeRef,\n    transform,\n    transition,\n    isDragging,\n  } = useSortable({ id });\n\n  return (\n    <div\n      ref={setNodeRef}\n      className={cn(\n        \"ds:flex ds:min-h-11 ds:items-center ds:gap-3 ds:px-3 ds:text-sm ds:text-foreground\",\n        isDragging && \"ds:bg-accent\"\n      )}\n      style={{\n        transform: CSS.Transform.toString(transform),\n        transition,\n      }}\n    >\n      <button\n        type=\"button\"\n        className=\"ds:flex ds:size-5 ds:shrink-0 ds:cursor-grab ds:items-center ds:justify-center ds:text-muted-foreground active:ds:cursor-grabbing\"\n        aria-label={`Reorder ${label}`}\n        {...attributes}\n        {...listeners}\n      >\n        <GripVertical className=\"ds:size-4\" />\n      </button>\n      <Checkbox\n        aria-label={`Toggle ${label}`}\n        checked={checked}\n        onCheckedChange={onCheckedChange}\n      />\n      <span className=\"ds:min-w-0 ds:flex-1 ds:truncate ds:font-medium\">\n        {label}\n      </span>\n    </div>\n  );\n}\n"],"names":["DataTableViewOptions","table","variant","labels","triggerIcon","jsx","Settings2","trigger","content","contentClassName","props","columnOrder","columnPinning","columns","React","getOrderedTableColumns","column","getColumnLabel","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","columnIds","allColumnsVisible","someColumnsVisible","onToggleAll","checked","onDragEnd","event","active","over","oldIndex","newIndex","orderedOptionIds","arrayMove","optionIdSet","pendingOptionIds","nextColumnOrder","currentColumnPinning","nextColumnPinning","id","items","jsxs","Fragment","Check","cn","resolvedLabels","defaultDraggableContent","Checkbox","DndContext","closestCenter","SortableContext","verticalListSortingStrategy","DataTableDraggableColumnOption","Button","Popover","Command","allColumns","columnById","order","orderedIds","pinning","leftIds","rightIds","pinnedIds","centerIds","label","onCheckedChange","attributes","listeners","setNodeRef","transform","transition","isDragging","useSortable","CSS","GripVertical"],"mappings":"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"}

package/dist/cjs/components/Table/data-table.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("@tanstack/react-table"),b=require("./data-table-pagination.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const c=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react");require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const l=require("../../packages/ui/src/components/table.cjs"),a=require("../../utils/data-table.cjs"),g=require("./data-table-column-header.cjs");function j({table:s,actionBar:u,children:q,className:m,pagination:n=!0,sticky:T,bordered:f,loading:d,footer:o,...x}){return e.jsxs("div",{className:c.cn("ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative",m),...x,children:[q,d&&e.jsx("div",{className:"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20",children:"Loading..."}),e.jsx("div",{className:c.cn("ds:overflow-auto ds:rounded-md ds:border ds-border-border",d&&"ds:blur-sm"),children:e.jsxs(l.Table,{children:[e.jsx(l.TableHeader,{children:s.getHeaderGroups().map(i=>e.jsx(l.TableRow,{children:i.headers.map(r=>e.jsx(l.TableHead,{colSpan:r.colSpan,style:{...a.getCommonPinningStyles({column:r.column})},children:r.isPlaceholder?null:r.column.columnDef.header?typeof r.column.columnDef.header=="function"?t.flexRender(r.column.columnDef.header,r.getContext()):e.jsx(g.DataTableColumnHeader,{column:r.column}):null},r.id))},i.id))}),e.jsx(l.TableBody,{children:s.getRowModel().rows?.length?s.getRowModel().rows.map(i=>e.jsx(l.TableRow,{"data-state":i.getIsSelected()&&"selected",children:i.getVisibleCells().map(r=>e.jsx(l.TableCell,{style:{...a.getCommonPinningStyles({column:r.column})},children:t.flexRender(r.column.columnDef.cell,r.getContext())},r.id))},i.id)):e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,className:"ds:h-24 ds:text-center",children:"No results."})})}),o&&e.jsx("tfoot",{children:e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,children:o(s.getRowModel().rows.map(i=>i.original))})})})]})}),e.jsxs("div",{className:"ds:flex ds:flex-col ds:gap-2.5",children:[n&&e.jsx(b.DataTablePagination,{table:s,...n===!0?{}:n}),u&&s.getFilteredSelectedRowModel().rows.length>0&&u]})]})}exports.DataTable=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("@tanstack/react-table"),b=require("./data-table-pagination.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const c=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react");require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const l=require("../../packages/ui/src/components/table.cjs"),a=require("../../utils/data-table.cjs"),g=require("./data-table-column-header.cjs");function j({table:s,actionBar:u,children:q,className:m,pagination:n=!0,sticky:T,bordered:f,loading:d,footer:o,...x}){return e.jsxs("div",{className:c.cn("ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative",m),...x,children:[q,d&&e.jsx("div",{className:"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20",children:"Loading..."}),e.jsx("div",{className:c.cn("ds:overflow-auto ds:rounded-md ds:border ds:border-border",d&&"ds:blur-sm"),children:e.jsxs(l.Table,{children:[e.jsx(l.TableHeader,{children:s.getHeaderGroups().map(i=>e.jsx(l.TableRow,{children:i.headers.map(r=>e.jsx(l.TableHead,{colSpan:r.colSpan,style:{...a.getCommonPinningStyles({column:r.column})},children:r.isPlaceholder?null:r.column.columnDef.header?typeof r.column.columnDef.header=="function"?t.flexRender(r.column.columnDef.header,r.getContext()):e.jsx(g.DataTableColumnHeader,{column:r.column}):null},r.id))},i.id))}),e.jsx(l.TableBody,{children:s.getRowModel().rows?.length?s.getRowModel().rows.map(i=>e.jsx(l.TableRow,{"data-state":i.getIsSelected()&&"selected",children:i.getVisibleCells().map(r=>e.jsx(l.TableCell,{style:{...a.getCommonPinningStyles({column:r.column})},children:t.flexRender(r.column.columnDef.cell,r.getContext())},r.id))},i.id)):e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,className:"ds:h-24 ds:text-center",children:"No results."})})}),o&&e.jsx("tfoot",{children:e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,children:o(s.getRowModel().rows.map(i=>i.original))})})})]})}),e.jsxs("div",{className:"ds:flex ds:flex-col ds:gap-2.5",children:[n&&e.jsx(b.DataTablePagination,{table:s,...n===!0?{}:n}),u&&s.getFilteredSelectedRowModel().rows.length>0&&u]})]})}exports.DataTable=j;
 //# sourceMappingURL=data-table.cjs.map

package/dist/cjs/components/Table/data-table.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.cjs","sources":["../../../../src/components/Table/data-table.tsx"],"sourcesContent":["import { flexRender, type Table as TanstackTable } from \"@tanstack/react-table\";\nimport type * as React from \"react\";\n\nimport { DataTablePagination } from \"./data-table-pagination\";\nimport {\n  cn,\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@dsui/ui\";\nimport { getCommonPinningStyles } from \"@/utils/data-table\";\nimport { DataTableColumnHeader } from \"./data-table-column-header\";\n\nexport interface DataTableProps<TData> extends React.ComponentProps<\"div\"> {\n  table: TanstackTable<TData>;\n  actionBar?: React.ReactNode;\n  pagination?:\n    | boolean\n    | Omit<React.ComponentProps<typeof DataTablePagination<TData>>, \"table\">;\n  sticky?: boolean | { offsetHeader?: number; offsetScroll?: number };\n  bordered?: boolean;\n  loading?: boolean;\n  footer?: (currentPageData: TData[]) => React.ReactNode;\n}\n\nexport function DataTable<TData>({\n  table,\n  actionBar,\n  children,\n  className,\n  pagination = true,\n  sticky,\n  bordered,\n  loading,\n  footer,\n  ...props\n}: DataTableProps<TData>) {\n  return (\n    <div\n      className={cn(\n        \"ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {loading && (\n        <div className=\"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20\">\n          Loading...\n        </div>\n      )}\n      <div\n        className={cn(\n          \"ds:overflow-auto ds:rounded-md ds:border ds-border-border\",\n          loading && \"ds:blur-sm\"\n        )}\n      >\n        <Table>\n          <TableHeader>\n            {table.getHeaderGroups().map((headerGroup) => (\n              <TableRow key={headerGroup.id}>\n                {headerGroup.headers.map((header) => (\n                  <TableHead\n                    key={header.id}\n                    colSpan={header.colSpan}\n                    style={{\n                      ...getCommonPinningStyles({ column: header.column }),\n                    }}\n                  >\n                    {header.isPlaceholder ? null : header.column.columnDef\n                        .header ? (\n                      typeof header.column.columnDef.header === \"function\" ? (\n                        flexRender(\n                          header.column.columnDef.header,\n                          header.getContext()\n                        )\n                      ) : (\n                        <DataTableColumnHeader column={header.column} />\n                      )\n                    ) : null}\n                  </TableHead>\n                ))}\n              </TableRow>\n            ))}\n          </TableHeader>\n          <TableBody>\n            {table.getRowModel().rows?.length ? (\n              table.getRowModel().rows.map((row) => (\n                <TableRow\n                  key={row.id}\n                  data-state={row.getIsSelected() && \"selected\"}\n                >\n                  {row.getVisibleCells().map((cell) => (\n                    <TableCell\n                      key={cell.id}\n                      style={{\n                        ...getCommonPinningStyles({ column: cell.column }),\n                      }}\n                    >\n                      {flexRender(\n                        cell.column.columnDef.cell,\n                        cell.getContext()\n                      )}\n                    </TableCell>\n                  ))}\n                </TableRow>\n              ))\n            ) : (\n              <TableRow>\n                <TableCell\n                  colSpan={table.getAllColumns().length}\n                  className=\"ds:h-24 ds:text-center\"\n                >\n                  No results.\n                </TableCell>\n              </TableRow>\n            )}\n          </TableBody>\n          {footer && (\n            <tfoot>\n              <TableRow>\n                <TableCell colSpan={table.getAllColumns().length}>\n                  {footer(table.getRowModel().rows.map((row) => row.original))}\n                </TableCell>\n              </TableRow>\n            </tfoot>\n          )}\n        </Table>\n      </div>\n      <div className=\"ds:flex ds:flex-col ds:gap-2.5\">\n        {pagination && (\n          <DataTablePagination\n            table={table}\n            {...(pagination === true ? {} : pagination)}\n          />\n        )}\n        {actionBar &&\n          table.getFilteredSelectedRowModel().rows.length > 0 &&\n          actionBar}\n      </div>\n    </div>\n  );\n}\n"],"names":["DataTable","table","actionBar","children","className","pagination","sticky","bordered","loading","footer","props","jsxs","cn","jsx","Table","TableHeader","headerGroup","TableRow","header","TableHead","getCommonPinningStyles","flexRender","DataTableColumnHeader","TableBody","row","cell","TableCell","DataTablePagination"],"mappings":"kwDA4BO,SAASA,EAAiB,CAAA,MAC/BC,EACA,UAAAC,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,GACb,OAAAC,EACA,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EAA0B,CACxB,OACEC,EAAAA,KAAC,MAAA,CACC,UAAWC,EAAAA,GACT,uDACAR,CAAA,EAED,GAAGM,EAEH,SAAA,CAAAP,EACAK,GACCK,EAAAA,IAAC,MAAA,CAAI,UAAU,+FAA+F,SAAA,aAE9G,EAEFA,EAAAA,IAAC,MAAA,CACC,UAAWD,EAAAA,GACT,4DACAJ,GAAW,YAAA,EAGb,gBAACM,QAAA,CACC,SAAA,CAAAD,EAAAA,IAACE,EAAAA,YAAA,CACE,SAAAd,EAAM,gBAAA,EAAkB,IAAKe,GAC5BH,EAAAA,IAACI,EAAAA,SAAA,CACE,SAAAD,EAAY,QAAQ,IAAKE,GACxBL,EAAAA,IAACM,EAAAA,UAAA,CAEC,QAASD,EAAO,QAChB,MAAO,CACL,GAAGE,yBAAuB,CAAE,OAAQF,EAAO,OAAQ,CAAA,EAGpD,SAAAA,EAAO,cAAgB,KAAOA,EAAO,OAAO,UACxC,OACH,OAAOA,EAAO,OAAO,UAAU,QAAW,WACxCG,EAAAA,WACEH,EAAO,OAAO,UAAU,OACxBA,EAAO,WAAA,CAAW,EAGpBL,EAAAA,IAACS,EAAAA,sBAAA,CAAsB,OAAQJ,EAAO,OAAQ,EAE9C,IAAA,EAhBCA,EAAO,EAAA,CAkBf,GArBYF,EAAY,EAsB3B,CACD,CAAA,CACH,EACAH,EAAAA,IAACU,EAAAA,UAAA,CACE,SAAAtB,EAAM,YAAA,EAAc,MAAM,OACzBA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAC5BX,EAAAA,IAACI,EAAAA,SAAA,CAEC,aAAYO,EAAI,cAAA,GAAmB,WAElC,SAAAA,EAAI,gBAAA,EAAkB,IAAKC,GAC1BZ,EAAAA,IAACa,EAAAA,UAAA,CAEC,MAAO,CACL,GAAGN,yBAAuB,CAAE,OAAQK,EAAK,OAAQ,CAAA,EAGlD,SAAAJ,EAAAA,WACCI,EAAK,OAAO,UAAU,KACtBA,EAAK,WAAA,CAAW,CAClB,EARKA,EAAK,EAAA,CAUb,CAAA,EAfID,EAAI,EAAA,CAiBZ,EAEDX,EAAAA,IAACI,WAAA,CACC,SAAAJ,EAAAA,IAACa,EAAAA,UAAA,CACC,QAASzB,EAAM,cAAA,EAAgB,OAC/B,UAAU,yBACX,SAAA,aAAA,CAAA,EAGH,CAAA,CAEJ,EACCQ,GACCI,EAAAA,IAAC,QAAA,CACC,SAAAA,EAAAA,IAACI,EAAAA,SAAA,CACC,eAACS,EAAAA,UAAA,CAAU,QAASzB,EAAM,cAAA,EAAgB,OACvC,WAAOA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAAQA,EAAI,QAAQ,CAAC,CAAA,CAC7D,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAEJ,CAAA,CAAA,EAEFb,EAAAA,KAAC,MAAA,CAAI,UAAU,iCACZ,SAAA,CAAAN,GACCQ,EAAAA,IAACc,EAAAA,oBAAA,CAAA,MACC1B,EACC,GAAII,IAAe,GAAO,GAAKA,CAAA,CAAA,EAGnCH,GACCD,EAAM,4BAAA,EAA8B,KAAK,OAAS,GAClDC,CAAA,CAAA,CACJ,CAAA,CAAA,CAAA,CAGN"}
+{"version":3,"file":"data-table.cjs","sources":["../../../../src/components/Table/data-table.tsx"],"sourcesContent":["import { flexRender, type Table as TanstackTable } from \"@tanstack/react-table\";\nimport type * as React from \"react\";\n\nimport { DataTablePagination } from \"./data-table-pagination\";\nimport {\n  cn,\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@dsui/ui\";\nimport { getCommonPinningStyles } from \"@/utils/data-table\";\nimport { DataTableColumnHeader } from \"./data-table-column-header\";\n\nexport interface DataTableProps<TData> extends React.ComponentProps<\"div\"> {\n  table: TanstackTable<TData>;\n  actionBar?: React.ReactNode;\n  pagination?:\n    | boolean\n    | Omit<React.ComponentProps<typeof DataTablePagination<TData>>, \"table\">;\n  sticky?: boolean | { offsetHeader?: number; offsetScroll?: number };\n  bordered?: boolean;\n  loading?: boolean;\n  footer?: (currentPageData: TData[]) => React.ReactNode;\n}\n\nexport function DataTable<TData>({\n  table,\n  actionBar,\n  children,\n  className,\n  pagination = true,\n  sticky,\n  bordered,\n  loading,\n  footer,\n  ...props\n}: DataTableProps<TData>) {\n  return (\n    <div\n      className={cn(\n        \"ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {loading && (\n        <div className=\"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20\">\n          Loading...\n        </div>\n      )}\n      <div\n        className={cn(\n          \"ds:overflow-auto ds:rounded-md ds:border ds:border-border\",\n          loading && \"ds:blur-sm\"\n        )}\n      >\n        <Table>\n          <TableHeader>\n            {table.getHeaderGroups().map((headerGroup) => (\n              <TableRow key={headerGroup.id}>\n                {headerGroup.headers.map((header) => (\n                  <TableHead\n                    key={header.id}\n                    colSpan={header.colSpan}\n                    style={{\n                      ...getCommonPinningStyles({ column: header.column }),\n                    }}\n                  >\n                    {header.isPlaceholder ? null : header.column.columnDef\n                        .header ? (\n                      typeof header.column.columnDef.header === \"function\" ? (\n                        flexRender(\n                          header.column.columnDef.header,\n                          header.getContext()\n                        )\n                      ) : (\n                        <DataTableColumnHeader column={header.column} />\n                      )\n                    ) : null}\n                  </TableHead>\n                ))}\n              </TableRow>\n            ))}\n          </TableHeader>\n          <TableBody>\n            {table.getRowModel().rows?.length ? (\n              table.getRowModel().rows.map((row) => (\n                <TableRow\n                  key={row.id}\n                  data-state={row.getIsSelected() && \"selected\"}\n                >\n                  {row.getVisibleCells().map((cell) => (\n                    <TableCell\n                      key={cell.id}\n                      style={{\n                        ...getCommonPinningStyles({ column: cell.column }),\n                      }}\n                    >\n                      {flexRender(\n                        cell.column.columnDef.cell,\n                        cell.getContext()\n                      )}\n                    </TableCell>\n                  ))}\n                </TableRow>\n              ))\n            ) : (\n              <TableRow>\n                <TableCell\n                  colSpan={table.getAllColumns().length}\n                  className=\"ds:h-24 ds:text-center\"\n                >\n                  No results.\n                </TableCell>\n              </TableRow>\n            )}\n          </TableBody>\n          {footer && (\n            <tfoot>\n              <TableRow>\n                <TableCell colSpan={table.getAllColumns().length}>\n                  {footer(table.getRowModel().rows.map((row) => row.original))}\n                </TableCell>\n              </TableRow>\n            </tfoot>\n          )}\n        </Table>\n      </div>\n      <div className=\"ds:flex ds:flex-col ds:gap-2.5\">\n        {pagination && (\n          <DataTablePagination\n            table={table}\n            {...(pagination === true ? {} : pagination)}\n          />\n        )}\n        {actionBar &&\n          table.getFilteredSelectedRowModel().rows.length > 0 &&\n          actionBar}\n      </div>\n    </div>\n  );\n}\n"],"names":["DataTable","table","actionBar","children","className","pagination","sticky","bordered","loading","footer","props","jsxs","cn","jsx","Table","TableHeader","headerGroup","TableRow","header","TableHead","getCommonPinningStyles","flexRender","DataTableColumnHeader","TableBody","row","cell","TableCell","DataTablePagination"],"mappings":"kwDA4BO,SAASA,EAAiB,CAAA,MAC/BC,EACA,UAAAC,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,GACb,OAAAC,EACA,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EAA0B,CACxB,OACEC,EAAAA,KAAC,MAAA,CACC,UAAWC,EAAAA,GACT,uDACAR,CAAA,EAED,GAAGM,EAEH,SAAA,CAAAP,EACAK,GACCK,EAAAA,IAAC,MAAA,CAAI,UAAU,+FAA+F,SAAA,aAE9G,EAEFA,EAAAA,IAAC,MAAA,CACC,UAAWD,EAAAA,GACT,4DACAJ,GAAW,YAAA,EAGb,gBAACM,QAAA,CACC,SAAA,CAAAD,EAAAA,IAACE,EAAAA,YAAA,CACE,SAAAd,EAAM,gBAAA,EAAkB,IAAKe,GAC5BH,EAAAA,IAACI,EAAAA,SAAA,CACE,SAAAD,EAAY,QAAQ,IAAKE,GACxBL,EAAAA,IAACM,EAAAA,UAAA,CAEC,QAASD,EAAO,QAChB,MAAO,CACL,GAAGE,yBAAuB,CAAE,OAAQF,EAAO,OAAQ,CAAA,EAGpD,SAAAA,EAAO,cAAgB,KAAOA,EAAO,OAAO,UACxC,OACH,OAAOA,EAAO,OAAO,UAAU,QAAW,WACxCG,EAAAA,WACEH,EAAO,OAAO,UAAU,OACxBA,EAAO,WAAA,CAAW,EAGpBL,EAAAA,IAACS,EAAAA,sBAAA,CAAsB,OAAQJ,EAAO,OAAQ,EAE9C,IAAA,EAhBCA,EAAO,EAAA,CAkBf,GArBYF,EAAY,EAsB3B,CACD,CAAA,CACH,EACAH,EAAAA,IAACU,EAAAA,UAAA,CACE,SAAAtB,EAAM,YAAA,EAAc,MAAM,OACzBA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAC5BX,EAAAA,IAACI,EAAAA,SAAA,CAEC,aAAYO,EAAI,cAAA,GAAmB,WAElC,SAAAA,EAAI,gBAAA,EAAkB,IAAKC,GAC1BZ,EAAAA,IAACa,EAAAA,UAAA,CAEC,MAAO,CACL,GAAGN,yBAAuB,CAAE,OAAQK,EAAK,OAAQ,CAAA,EAGlD,SAAAJ,EAAAA,WACCI,EAAK,OAAO,UAAU,KACtBA,EAAK,WAAA,CAAW,CAClB,EARKA,EAAK,EAAA,CAUb,CAAA,EAfID,EAAI,EAAA,CAiBZ,EAEDX,EAAAA,IAACI,WAAA,CACC,SAAAJ,EAAAA,IAACa,EAAAA,UAAA,CACC,QAASzB,EAAM,cAAA,EAAgB,OAC/B,UAAU,yBACX,SAAA,aAAA,CAAA,EAGH,CAAA,CAEJ,EACCQ,GACCI,EAAAA,IAAC,QAAA,CACC,SAAAA,EAAAA,IAACI,EAAAA,SAAA,CACC,eAACS,EAAAA,UAAA,CAAU,QAASzB,EAAM,cAAA,EAAgB,OACvC,WAAOA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAAQA,EAAI,QAAQ,CAAC,CAAA,CAC7D,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAEJ,CAAA,CAAA,EAEFb,EAAAA,KAAC,MAAA,CAAI,UAAU,iCACZ,SAAA,CAAAN,GACCQ,EAAAA,IAACc,EAAAA,oBAAA,CAAA,MACC1B,EACC,GAAII,IAAe,GAAO,GAAKA,CAAA,CAAA,EAGnCH,GACCD,EAAM,4BAAA,EAA8B,KAAK,OAAS,GAClDC,CAAA,CAAA,CACJ,CAAA,CAAA,CAAA,CAGN"}

package/dist/cjs/components/Table/select-column.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),s=require("../Checkbox/Checkbox.cjs");function n(c){return{id:"select",header:({table:e})=>l.jsx("div",{className:"ds:flex ds:items-center ds:justify-center",children:l.jsx(s.default,{checked:e.getIsAllPageRowsSelected()||e.getIsSomePageRowsSelected()&&"indeterminate",onCheckedChange:t=>e.toggleAllPageRowsSelected(!!t),"aria-label":"Select all"})}),cell:({row:e})=>l.jsx("div",{className:"ds:flex ds:items-center ds:justify-center",children:l.jsx(s.default,{checked:e.getIsSelected(),onCheckedChange:t=>e.toggleSelected(!!t),"aria-label":"Select row"})}),size:36,enableSorting:!1,enableHiding:!1,enableColumnFilter:!1,...c}}const a=n;exports.selectColumn=a;
+//# sourceMappingURL=select-column.cjs.map

package/dist/cjs/components/Table/select-column.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-column.cjs","sources":["../../../../src/components/Table/select-column.tsx"],"sourcesContent":["import type {\n  CellContext,\n  ColumnDef,\n  HeaderContext,\n} from \"@tanstack/react-table\";\nimport { Checkbox } from \"@/components/Checkbox\";\n\nfunction createSelectColumn<TData>(\n  props?: Partial<ColumnDef<TData>>\n): ColumnDef<TData> {\n  return {\n    id: \"select\",\n    header: ({ table }: HeaderContext<TData, unknown>) => (\n      <div className=\"ds:flex ds:items-center ds:justify-center\">\n        <Checkbox\n          checked={\n            table.getIsAllPageRowsSelected() ||\n            (table.getIsSomePageRowsSelected() && \"indeterminate\")\n          }\n          onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n          aria-label=\"Select all\"\n        />\n      </div>\n    ),\n    cell: ({ row }: CellContext<TData, unknown>) => (\n      <div className=\"ds:flex ds:items-center ds:justify-center\">\n        <Checkbox\n          checked={row.getIsSelected()}\n          onCheckedChange={(value) => row.toggleSelected(!!value)}\n          aria-label=\"Select row\"\n        />\n      </div>\n    ),\n    size: 36,\n    enableSorting: false,\n    enableHiding: false,\n    enableColumnFilter: false,\n    ...props,\n  };\n}\n\nexport const selectColumn = createSelectColumn;\n"],"names":["createSelectColumn","props","table","jsx","Checkbox","value","row","selectColumn"],"mappings":"2JAOA,SAASA,EACPC,EACkB,CAClB,MAAO,CACL,GAAI,SACJ,OAAQ,CAAC,CAAE,MAAAC,CAAA,IACTC,EAAAA,IAAC,MAAA,CAAI,UAAU,4CACb,SAAAA,EAAAA,IAACC,EAAAA,QAAA,CACC,QACEF,EAAM,yBAAA,GACLA,EAAM,6BAA+B,gBAExC,gBAAkBG,GAAUH,EAAM,0BAA0B,CAAC,CAACG,CAAK,EACnE,aAAW,YAAA,CAAA,EAEf,EAEF,KAAM,CAAC,CAAE,IAAAC,CAAA,IACPH,EAAAA,IAAC,MAAA,CAAI,UAAU,4CACb,SAAAA,EAAAA,IAACC,EAAAA,QAAA,CACC,QAASE,EAAI,cAAA,EACb,gBAAkBD,GAAUC,EAAI,eAAe,CAAC,CAACD,CAAK,EACtD,aAAW,YAAA,CAAA,EAEf,EAEF,KAAM,GACN,cAAe,GACf,aAAc,GACd,mBAAoB,GACpB,GAAGJ,CAAA,CAEP,CAEO,MAAMM,EAAeP"}

package/dist/cjs/hooks/use-data-table.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("@tanstack/react-table"),l=require("nuqs"),te=require("react"),ne=require("./use-debounced-callback.cjs"),oe=require("../utils/parsers.cjs");function se(d){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const f in d)if(f!=="default"){const s=Object.getOwnPropertyDescriptor(d,f);Object.defineProperty(a,f,s.get?s:{enumerable:!0,get:()=>d[f]})}}return a.default=d,Object.freeze(a)}const t=se(te),ie="page",ae="perPage",re="sort",le="filters",ce="joinOperator",ue=",",ge=300,de=50;function fe(d){const{columns:a,pageCount:f,initialState:s,queryKeys:b,history:_="replace",debounceMs:y=ge,throttleMs:M=de,clearOnDefault:q=!1,enableAdvancedFilter:c=!1,scroll:K=!1,shallow:R=!0,startTransition:D,enableNuqs:i=!1,...P}=d,I=b?.page??ie,j=b?.perPage??ae,x=b?.sort??re,k=b?.filters??le,N=b?.joinOperator??ce,p=t.useMemo(()=>({history:_,scroll:K,shallow:R,throttleMs:M,debounceMs:y,clearOnDefault:q,startTransition:D}),[_,K,R,M,y,q,D]),[Q,U]=t.useState(s?.rowSelection??{}),[V,B]=t.useState(s?.columnVisibility??{}),[C,w]=i?l.useQueryState(I,l.parseAsInteger.withOptions(p).withDefault(1)):t.useState(s?.pagination?.pageIndex??0),[v,F]=i?l.useQueryState(j,l.parseAsInteger.withOptions(p).withDefault(s?.pagination?.pageSize??10)):t.useState(s?.pagination?.pageSize??10),A=t.useMemo(()=>({pageIndex:i?C-1:C,pageSize:v}),[C,v,i]),G=t.useCallback(e=>{if(typeof e=="function"){const n=e(A);w(i?n.pageIndex+1:n.pageIndex),F(n.pageSize)}else w(i?e.pageIndex+1:e.pageIndex),F(e.pageSize)},[A,w,F,i]),H=t.useMemo(()=>new Set(a.map(e=>e.id).filter(Boolean)),[a]),[O,h]=i?l.useQueryState(x,oe.getSortingStateParser(H).withOptions(p).withDefault(s?.sorting??[])):t.useState(s?.sorting??[]),L=t.useCallback(e=>{if(typeof e=="function"){const n=e(O);h(n)}else h(e)},[O,h]),S=t.useMemo(()=>c?[]:a.filter(e=>e.enableColumnFilter),[a,c]),Z=t.useMemo(()=>c?{}:S.reduce((e,n)=>(n.meta?.variant==="multiSelect"?e[n.id??""]=l.parseAsArrayOf(l.parseAsString,ue).withOptions(p):e[n.id??""]=l.parseAsString.withOptions(p),e),{}),[S,p,c]),[z,J]=i?l.useQueryStates(Z):t.useState({}),Y=ne.useDebouncedCallback(e=>{w(1),J(e)},y),W=t.useMemo(()=>c?[]:Object.entries(z).reduce((e,[n,o])=>{if(o!==null){const r=S.find(m=>m.id===n)?.meta?.variant==="multiSelect",u=Array.isArray(o)?o:r&&typeof o=="string"&&/[^a-zA-Z0-9]/.test(o)?o.split(/[^a-zA-Z0-9]+/).filter(Boolean):r?[o]:o;e.push({id:n,value:u})}return e},[]),[z,c,S]),[X,$]=t.useState(W),ee=t.useCallback(e=>{c||$(n=>{const o=typeof e=="function"?e(n):e,E=o.reduce((r,u)=>{const m=S.find(T=>T.id===u.id);if(m){const T=m.meta?.variant==="multiSelect";r[u.id]=u.value}return console.log("filterParsers",m,r),r},{});for(const r of n)o.some(u=>u.id===r.id)||(E[r.id]=null);return i&&Y(E),o})},[Y,S,c,i]);return{table:g.useReactTable({initialState:s,pageCount:f,state:{pagination:A,sorting:O,columnVisibility:V,rowSelection:Q,columnFilters:X},defaultColumn:{...P.defaultColumn,enableColumnFilter:!0,enableSorting:!1,enableHiding:!0,enablePinning:!0},enableRowSelection:!0,onRowSelectionChange:U,onPaginationChange:G,onSortingChange:L,onColumnFiltersChange:ee,onColumnVisibilityChange:B,getCoreRowModel:g.getCoreRowModel(),getFilteredRowModel:g.getFilteredRowModel(),getPaginationRowModel:g.getPaginationRowModel(),getSortedRowModel:g.getSortedRowModel(),getFacetedRowModel:g.getFacetedRowModel(),getFacetedUniqueValues:g.getFacetedUniqueValues(),getFacetedMinMaxValues:g.getFacetedMinMaxValues(),meta:{...P.meta,queryKeys:{page:I,perPage:j,sort:x,filters:k,joinOperator:N}},...P,columns:a}),shallow:R,debounceMs:y,throttleMs:M}}exports.useDataTable=fe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("@tanstack/react-table"),l=require("nuqs"),oe=require("react"),se=require("./use-debounced-callback.cjs"),ie=require("../utils/parsers.cjs");function re(d){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const f in d)if(f!=="default"){const o=Object.getOwnPropertyDescriptor(d,f);Object.defineProperty(r,f,o.get?o:{enumerable:!0,get:()=>d[f]})}}return r.default=d,Object.freeze(r)}const t=re(oe),ae="page",le="perPage",ue="sort",ce="filters",ge="joinOperator",de=",",fe=300,pe=50;function Se(d){const{columns:r,pageCount:f,initialState:o,queryKeys:m,history:_="replace",debounceMs:y=fe,throttleMs:M=pe,clearOnDefault:q=!1,enableAdvancedFilter:u=!1,scroll:K=!1,shallow:C=!0,startTransition:D,enableNuqs:i=!1,...R}=d,I=m?.page??ae,j=m?.perPage??le,x=m?.sort??ue,k=m?.filters??ce,N=m?.joinOperator??ge,p=t.useMemo(()=>({history:_,scroll:K,shallow:C,throttleMs:M,debounceMs:y,clearOnDefault:q,startTransition:D}),[_,K,C,M,y,q,D]),[Q,U]=t.useState(o?.rowSelection??{}),[V,B]=t.useState(o?.columnVisibility??{}),[G,H]=t.useState(o?.columnOrder??[]),[P,w]=i?l.useQueryState(I,l.parseAsInteger.withOptions(p).withDefault(1)):t.useState(o?.pagination?.pageIndex??0),[v,O]=i?l.useQueryState(j,l.parseAsInteger.withOptions(p).withDefault(o?.pagination?.pageSize??10)):t.useState(o?.pagination?.pageSize??10),F=t.useMemo(()=>({pageIndex:i?P-1:P,pageSize:v}),[P,v,i]),L=t.useCallback(e=>{if(typeof e=="function"){const n=e(F);w(i?n.pageIndex+1:n.pageIndex),O(n.pageSize)}else w(i?e.pageIndex+1:e.pageIndex),O(e.pageSize)},[F,w,O,i]),Z=t.useMemo(()=>new Set(r.map(e=>e.id).filter(Boolean)),[r]),[h,A]=i?l.useQueryState(x,ie.getSortingStateParser(Z).withOptions(p).withDefault(o?.sorting??[])):t.useState(o?.sorting??[]),J=t.useCallback(e=>{if(typeof e=="function"){const n=e(h);A(n)}else A(e)},[h,A]),S=t.useMemo(()=>u?[]:r.filter(e=>e.enableColumnFilter),[r,u]),W=t.useMemo(()=>u?{}:S.reduce((e,n)=>(n.meta?.variant==="multiSelect"?e[n.id??""]=l.parseAsArrayOf(l.parseAsString,de).withOptions(p):e[n.id??""]=l.parseAsString.withOptions(p),e),{}),[S,p,u]),[z,X]=i?l.useQueryStates(W):t.useState({}),Y=se.useDebouncedCallback(e=>{w(1),X(e)},y),$=t.useMemo(()=>u?[]:Object.entries(z).reduce((e,[n,s])=>{if(s!==null){const a=S.find(b=>b.id===n)?.meta?.variant==="multiSelect",c=Array.isArray(s)?s:a&&typeof s=="string"&&/[^a-zA-Z0-9]/.test(s)?s.split(/[^a-zA-Z0-9]+/).filter(Boolean):a?[s]:s;e.push({id:n,value:c})}return e},[]),[z,u,S]),[ee,te]=t.useState($),ne=t.useCallback(e=>{u||te(n=>{const s=typeof e=="function"?e(n):e,E=s.reduce((a,c)=>{const b=S.find(T=>T.id===c.id);if(b){const T=b.meta?.variant==="multiSelect";a[c.id]=c.value}return console.log("filterParsers",b,a),a},{});for(const a of n)s.some(c=>c.id===a.id)||(E[a.id]=null);return i&&Y(E),s})},[Y,S,u,i]);return{table:g.useReactTable({initialState:o,pageCount:f,state:{pagination:F,sorting:h,columnVisibility:V,columnOrder:G,rowSelection:Q,columnFilters:ee},defaultColumn:{...R.defaultColumn,enableColumnFilter:!0,enableSorting:!1,enableHiding:!0,enablePinning:!0},enableRowSelection:!0,onRowSelectionChange:U,onPaginationChange:L,onSortingChange:J,onColumnFiltersChange:ne,onColumnVisibilityChange:B,onColumnOrderChange:H,getCoreRowModel:g.getCoreRowModel(),getFilteredRowModel:g.getFilteredRowModel(),getPaginationRowModel:g.getPaginationRowModel(),getSortedRowModel:g.getSortedRowModel(),getFacetedRowModel:g.getFacetedRowModel(),getFacetedUniqueValues:g.getFacetedUniqueValues(),getFacetedMinMaxValues:g.getFacetedMinMaxValues(),meta:{...R.meta,queryKeys:{page:I,perPage:j,sort:x,filters:k,joinOperator:N}},...R,columns:r}),shallow:C,debounceMs:y,throttleMs:M}}exports.useDataTable=Se;
 //# sourceMappingURL=use-data-table.cjs.map