@bioturing/components 0.15.4 → 0.16.0

package/dist/components/PopupPanel/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/PopupPanel/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  useCls,\n  clsx,\n  useAntdCssVarClassname,\n  parseAntdPlacement,\n} from \"../utils\";\nimport { Popover } from \"@base-ui-components/react/popover\";\n\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\nimport Flex from \"antd/es/flex\";\nimport { IconButton } from \"../IconButton\";\nimport { X } from \"@bioturing/assets\";\nimport { PopupPanelSize } from \"./constants\";\nimport { useControlledState } from \"../hooks\";\nimport { useResizable, type MoveValues } from \"react-use-resizable\";\nimport mergeRefs from \"merge-refs\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport interface PopupPanelProps\n  extends Omit<\n    React.ComponentPropsWithRef<\"div\">,\n    \"title\" | \"content\" | \"children\"\n  > {\n  /** The trigger element that opens the popup panel */\n  children?: React.ComponentProps<typeof Popover.Trigger>[\"render\"];\n  /** Placement of the popup panel relative to its trigger */\n  placement?: PopoverProps[\"placement\"];\n  /** Whether to open the popup panel on hover */\n  openOnHover?: boolean;\n  /** Controls the open state of the popup panel */\n  open?: boolean;\n  /** Callback fired when the open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Content to display inside the popup panel */\n  content?: React.ReactNode;\n  /** Title text or element to display in the panel header */\n  title?: React.ReactNode;\n  /** The event that triggers the popup panel */\n  /**\n   * @default \"click\"\n   */\n  trigger?: \"click\" | \"hover\";\n  /** Custom anchor element for positioning the panel */\n  anchor?: Popover.Positioner.Props[\"anchor\"];\n  /** Content to display before the close button */\n  beforeCloseButton?: React.ReactNode;\n  /** Content to display after the close button */\n  afterCloseButton?: React.ReactNode;\n  /** Content to display after the title */\n  afterTitle?: React.ReactNode;\n  /**\n   * Predefined sizes for the popup panel\n   * - xsmall: 320px\n   * - small: 400px\n   * - medium: 480px (default)\n   * - large: 640px\n   * - xlarge: 840px\n   * @default \"medium\" for default type, \"xsmall\" for other types\n   */\n  size?: keyof typeof PopupPanelSize;\n  /**\n   * Footer content for the popup panel\n   * Can be a React node or a function that returns a React node\n   */\n  footer?:\n    | React.ReactNode\n    | ((props: { close: () => void }) => React.ReactNode);\n  /**\n   * Whether the panel should be open by default when uncontrolled\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Whether the panel should be resizable\n   * @default false\n   */\n  resizable?: boolean;\n  /**\n   * Custom class names for different parts of the popup panel\n   * @default {}\n   */\n  classNames?: {\n    root?: string;\n    trigger?: string;\n    popup?: string;\n    header?: string;\n    title?: string;\n    content?: string;\n    footer?: string;\n    resizeHandle?: string;\n  };\n}\n\nexport const PopupPanel = ({\n  children,\n  placement,\n  openOnHover = false,\n  open: outsideOpen,\n  onOpenChange: outsideOnOpenChange,\n  content,\n  title,\n  trigger = \"click\",\n  className,\n  anchor,\n  beforeCloseButton,\n  afterCloseButton,\n  afterTitle,\n  size = \"medium\",\n  footer,\n  defaultOpen,\n  resizable = false,\n  classNames,\n}: PopupPanelProps) => {\n  // Use controlled state with proper initialization to prevent switching between controlled/uncontrolled\n  const [open, setOpen] = useControlledState(\n    outsideOpen,\n    outsideOnOpenChange,\n    defaultOpen ?? false // Always provide a default value to prevent undefined\n  );\n\n  const cls = useCls();\n  const antdCssVarClassname = useAntdCssVarClassname();\n  const headlessUIPlacement = parseAntdPlacement(placement);\n  // We don't need triggerRef since we're using callbackRef for the popup\n  const [popupRef, setPopupRef] = useState<HTMLDivElement | null>(null);\n  const [width, setWidth] = useState<number>();\n  const [height, setHeight] = useState<number>();\n  const callbackRef = useCallback((node: HTMLDivElement) => {\n    setPopupRef(node);\n  }, []);\n  useEffect(() => {\n    if (!popupRef) return;\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setWidth(entry.contentRect.width);\n        setHeight(entry.contentRect.height);\n      }\n    });\n    observer.observe(popupRef);\n    return () => {\n      observer.disconnect();\n    };\n  }, [popupRef]);\n\n  const defaultCloseIcon = useMemo(() => <X size={16} />, []);\n  const renderTitle = useCallback(() => {\n    return (\n      <div className={clsx(cls(\"popup-panel-header\"), classNames?.header)}>\n        <Flex\n          align=\"center\"\n          gap={8}\n          className={cls(\"popup-panel-title-wrapper\")}\n        >\n          <Popover.Title\n            render={\n              <div className={clsx(cls(\"grow\", \"truncate\"), classNames?.title)}>\n                {title}\n              </div>\n            }\n          ></Popover.Title>\n          <div className=\"flex items-center gap-2\">\n            {beforeCloseButton}\n            <Popover.Close\n              render={<IconButton>{defaultCloseIcon}</IconButton>}\n            />\n            {afterCloseButton}\n          </div>\n        </Flex>\n        {afterTitle ? afterTitle : null}\n      </div>\n    );\n  }, [\n    afterCloseButton,\n    afterTitle,\n    beforeCloseButton,\n    cls,\n    classNames?.header,\n    classNames?.title,\n    defaultCloseIcon,\n    title,\n  ]);\n  const [resizing, setResizing] = useState(false);\n  const { getRootProps, getHandleProps, rootRef } = useResizable({\n    initialWidth: width,\n    initialHeight: height,\n    onDragStart: () => setResizing(true),\n    onDragEnd: () => setResizing(false),\n  });\n  useEffect(() => {\n    if (resizing) {\n      document.body.style.userSelect = \"none\";\n    } else {\n      document.body.style.userSelect = \"\";\n    }\n  }, [resizing]);\n  const { ref: rootRefProp, ...rootPropsWithoutRef } = getRootProps();\n  // Handle reverse handle change for vertical resizing\n  // Currently not used but kept for future implementation\n  const _onReverseHandleChangeVertical = (\n    parent: React.RefObject<HTMLDivElement>,\n    values: MoveValues\n  ) => {\n    if (!parent.current) return;\n    const { heightDiff } = values;\n    parent.current.style.top = `${\n      parseInt(parent.current.style.top || \"0\") - heightDiff\n    }px`;\n  };\n\n  // Handle reverse handle change\n  const onReverseHandleChangeHorizontal = (\n    parent: React.RefObject<HTMLDivElement>,\n    values: MoveValues\n  ) => {\n    if (!parent.current) return;\n    const { widthDiff } = values;\n    parent.current.style.left = `${\n      parseInt(parent.current.style.left || \"0\") - widthDiff\n    }px`;\n  };\n\n  return (\n    <Popover.Root\n      openOnHover={trigger === \"hover\" ? true : openOnHover}\n      open={open}\n      onOpenChange={setOpen}\n    >\n      <Popover.Trigger\n        render={children}\n        className={clsx(cls(\"popup-panel-trigger\"), classNames?.trigger)}\n      ></Popover.Trigger>\n      <Popover.Portal>\n        <Popover.Positioner\n          className={clsx(\n            cls(\"popup-panel-root\"),\n            classNames?.root,\n            antdCssVarClassname\n          )}\n          side={headlessUIPlacement.placement}\n          align={headlessUIPlacement.align}\n          sideOffset={4}\n          anchor={anchor}\n          style={\n            {\n              \"--size-width\": size ? PopupPanelSize[size] : undefined,\n            } as React.CSSProperties\n          }\n        >\n          <Popover.Popup\n            className={clsx(\n              cls(\"popup-panel\"),\n              cls(`popup-panel-size-${size}`),\n              className,\n              classNames?.popup,\n              antdCssVarClassname\n            )}\n            ref={mergeRefs(rootRefProp, callbackRef)}\n            {...rootPropsWithoutRef}\n            {...(resizing ? { \"data-resizing\": true } : {})}\n          >\n            {/* <div ref={popupRef}> */}\n            {title && renderTitle()}\n            <div\n              className={clsx(cls(\"popup-panel-content\"), classNames?.content)}\n            >\n              <div className={cls(\"popup-panel-content-inner\")}>{content}</div>\n            </div>\n            {footer && (\n              <div\n                className={clsx(cls(\"popup-panel-footer\"), classNames?.footer)}\n              >\n                {typeof footer === \"function\"\n                  ? footer({ close: () => setOpen(false) })\n                  : footer}\n              </div>\n            )}\n            {resizable && (\n              <>\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"bottom-left\"\n                  {...getHandleProps({\n                    lockHorizontal: true,\n                  })}\n                />\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"top-left\"\n                  {...getHandleProps({\n                    reverse: true,\n                    lockVertical: true,\n                    onResize: (values) =>\n                      onReverseHandleChangeHorizontal(rootRef, values),\n                  })}\n                />\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"top-right\"\n                  {...getHandleProps({\n                    lockVertical: true,\n                  })}\n                />\n              </>\n            )}\n          </Popover.Popup>\n        </Popover.Positioner>\n      </Popover.Portal>\n    </Popover.Root>\n  );\n};\n"],"names":["PopupPanel","children","placement","openOnHover","outsideOpen","outsideOnOpenChange","content","title","trigger","className","anchor","beforeCloseButton","afterCloseButton","afterTitle","size","footer","defaultOpen","resizable","classNames","open","setOpen","useControlledState","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","headlessUIPlacement","parseAntdPlacement","popupRef","setPopupRef","useState","width","setWidth","height","setHeight","callbackRef","useCallback","node","useEffect","observer","entries","entry","defaultCloseIcon","useMemo","jsx","X","renderTitle","jsxs","clsx","Flex","Popover","IconButton","resizing","setResizing","getRootProps","getHandleProps","rootRef","useResizable","rootRefProp","rootPropsWithoutRef","onReverseHandleChangeHorizontal","parent","values","widthDiff","PopupPanelSize","mergeRefs","Fragment"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/PopupPanel/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  useCls,\n  clsx,\n  useAntdCssVarClassname,\n  parseAntdPlacement,\n} from \"../utils\";\nimport { Popover } from \"@base-ui-components/react/popover\";\n\nimport { type PopoverProps } from \"antd/es/popover\";\nimport { useCallback, useEffect, useMemo, useState } from \"react\";\nimport Flex from \"antd/es/flex\";\nimport { IconButton } from \"../IconButton\";\nimport { X } from \"@bioturing/assets\";\nimport { PopupPanelSize } from \"./constants\";\nimport { useControlledState } from \"../hooks\";\nimport { useResizable, type MoveValues } from \"react-use-resizable\";\nimport mergeRefs from \"merge-refs\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport interface PopupPanelProps\n  extends Omit<\n    React.ComponentPropsWithRef<\"div\">,\n    \"title\" | \"content\" | \"children\"\n  > {\n  /** The trigger element that opens the popup panel */\n  children?: React.ComponentProps<typeof Popover.Trigger>[\"render\"];\n  /** Placement of the popup panel relative to its trigger */\n  placement?: PopoverProps[\"placement\"];\n  /** Whether to open the popup panel on hover */\n  openOnHover?: boolean;\n  /** Controls the open state of the popup panel */\n  open?: boolean;\n  /** Callback fired when the open state changes */\n  onOpenChange?: Popover.Root.Props[\"onOpenChange\"];\n  /** Content to display inside the popup panel */\n  content?: React.ReactNode;\n  /** Title text or element to display in the panel header */\n  title?: React.ReactNode;\n  /** The event that triggers the popup panel */\n  /**\n   * @default \"click\"\n   */\n  trigger?: \"click\" | \"hover\";\n  /** Custom anchor element for positioning the panel */\n  anchor?: Popover.Positioner.Props[\"anchor\"];\n  /** Content to display before the close button */\n  beforeCloseButton?: React.ReactNode;\n  /** Content to display after the close button */\n  afterCloseButton?: React.ReactNode;\n  /** Content to display after the title */\n  afterTitle?: React.ReactNode;\n  /**\n   * Predefined sizes for the popup panel\n   * - xsmall: 320px\n   * - small: 400px\n   * - medium: 480px (default)\n   * - large: 640px\n   * - xlarge: 840px\n   * @default \"medium\" for default type, \"xsmall\" for other types\n   */\n  size?: keyof typeof PopupPanelSize;\n  /**\n   * Footer content for the popup panel\n   * Can be a React node or a function that returns a React node\n   */\n  footer?:\n    | React.ReactNode\n    | ((props: { close: () => void }) => React.ReactNode);\n  /**\n   * Whether the panel should be open by default when uncontrolled\n   * @default false\n   */\n  defaultOpen?: boolean;\n  /**\n   * Whether the panel should be resizable\n   * @default false\n   */\n  resizable?: boolean;\n  /**\n   * Custom class names for different parts of the popup panel\n   * @default {}\n   */\n  classNames?: {\n    root?: string;\n    trigger?: string;\n    popup?: string;\n    header?: string;\n    title?: string;\n    content?: string;\n    footer?: string;\n    resizeHandle?: string;\n  };\n  /**\n   * Whether to close the panel when clicking outside\n   * @default true\n   */\n  closeOnClickOutside?: boolean;\n  /**\n   * Whether to use modal mode\n   * @default false\n   */\n  modal?: Popover.Root.Props[\"modal\"];\n}\n\nexport const PopupPanel = ({\n  children,\n  placement,\n  openOnHover = false,\n  open: outsideOpen,\n  onOpenChange: outsideOnOpenChange,\n  content,\n  title,\n  trigger = \"click\",\n  className,\n  anchor,\n  beforeCloseButton,\n  afterCloseButton,\n  afterTitle,\n  size = \"medium\",\n  footer,\n  defaultOpen,\n  resizable = false,\n  classNames,\n  modal = false,\n  closeOnClickOutside = true,\n}: PopupPanelProps) => {\n  // Use controlled state with proper initialization to prevent switching between controlled/uncontrolled\n  const [open, setOpen] = useControlledState(\n    outsideOpen,\n    outsideOnOpenChange,\n    defaultOpen ?? false // Always provide a default value to prevent undefined\n  );\n\n  const cls = useCls();\n  const antdCssVarClassname = useAntdCssVarClassname();\n  const headlessUIPlacement = parseAntdPlacement(placement);\n  // We don't need triggerRef since we're using callbackRef for the popup\n  const [popupRef, setPopupRef] = useState<HTMLDivElement | null>(null);\n  const [width, setWidth] = useState<number>();\n  const [height, setHeight] = useState<number>();\n  const callbackRef = useCallback((node: HTMLDivElement) => {\n    setPopupRef(node);\n  }, []);\n  useEffect(() => {\n    if (!popupRef) return;\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        setWidth(entry.contentRect.width);\n        setHeight(entry.contentRect.height);\n      }\n    });\n    observer.observe(popupRef);\n    return () => {\n      observer.disconnect();\n    };\n  }, [popupRef]);\n\n  const defaultCloseIcon = useMemo(() => <X size={16} />, []);\n  const renderTitle = useCallback(() => {\n    return (\n      <div className={clsx(cls(\"popup-panel-header\"), classNames?.header)}>\n        <Flex\n          align=\"center\"\n          gap={8}\n          className={cls(\"popup-panel-title-wrapper\")}\n        >\n          <Popover.Title\n            render={\n              <div className={clsx(cls(\"grow\", \"truncate\"), classNames?.title)}>\n                {title}\n              </div>\n            }\n          ></Popover.Title>\n          <div className=\"flex items-center gap-2\">\n            {beforeCloseButton}\n            <Popover.Close\n              render={<IconButton>{defaultCloseIcon}</IconButton>}\n            />\n            {afterCloseButton}\n          </div>\n        </Flex>\n        {afterTitle ? afterTitle : null}\n      </div>\n    );\n  }, [\n    afterCloseButton,\n    afterTitle,\n    beforeCloseButton,\n    cls,\n    classNames?.header,\n    classNames?.title,\n    defaultCloseIcon,\n    title,\n  ]);\n  const [resizing, setResizing] = useState(false);\n  const { getRootProps, getHandleProps, rootRef } = useResizable({\n    initialWidth: width,\n    initialHeight: height,\n    onDragStart: () => setResizing(true),\n    onDragEnd: () => setResizing(false),\n  });\n  useEffect(() => {\n    if (resizing) {\n      document.body.style.userSelect = \"none\";\n    } else {\n      document.body.style.userSelect = \"\";\n    }\n  }, [resizing]);\n  const { ref: rootRefProp, ...rootPropsWithoutRef } = getRootProps();\n  // Handle reverse handle change for vertical resizing\n  // Currently not used but kept for future implementation\n  // const _onReverseHandleChangeVertical = (\n  //   parent: React.RefObject<HTMLDivElement>,\n  //   values: MoveValues\n  // ) => {\n  //   if (!parent.current) return;\n  //   const { heightDiff } = values;\n  //   parent.current.style.top = `${\n  //     parseInt(parent.current.style.top || \"0\") - heightDiff\n  //   }px`;\n  // };\n\n  // Handle reverse handle change\n  const onReverseHandleChangeHorizontal = (\n    parent: React.RefObject<HTMLDivElement>,\n    values: MoveValues\n  ) => {\n    if (!parent.current) return;\n    const { widthDiff } = values;\n    parent.current.style.left = `${\n      parseInt(parent.current.style.left || \"0\") - widthDiff\n    }px`;\n  };\n\n  return (\n    <Popover.Root\n      openOnHover={trigger === \"hover\" ? true : openOnHover}\n      open={open}\n      onOpenChange={(open, event, reason) => {\n        if (reason === \"outside-press\" && !closeOnClickOutside) return;\n        setOpen(open, event, reason);\n      }}\n      modal={modal}\n    >\n      <Popover.Trigger\n        render={children}\n        className={clsx(cls(\"popup-panel-trigger\"), classNames?.trigger)}\n      ></Popover.Trigger>\n      <Popover.Portal>\n        <Popover.Positioner\n          className={clsx(\n            cls(\"popup-panel-root\"),\n            classNames?.root,\n            antdCssVarClassname\n          )}\n          side={headlessUIPlacement.placement}\n          align={headlessUIPlacement.align}\n          sideOffset={4}\n          anchor={anchor}\n          style={\n            {\n              \"--size-width\": size ? PopupPanelSize[size] : undefined,\n            } as React.CSSProperties\n          }\n        >\n          <Popover.Popup\n            className={clsx(\n              cls(\"popup-panel\"),\n              cls(`popup-panel-size-${size}`),\n              className,\n              classNames?.popup,\n              antdCssVarClassname\n            )}\n            ref={mergeRefs(rootRefProp, callbackRef)}\n            {...rootPropsWithoutRef}\n            {...(resizing ? { \"data-resizing\": true } : {})}\n          >\n            {/* <div ref={popupRef}> */}\n            {title && renderTitle()}\n            <div\n              className={clsx(cls(\"popup-panel-content\"), classNames?.content)}\n            >\n              <div className={cls(\"popup-panel-content-inner\")}>{content}</div>\n            </div>\n            {footer && (\n              <div\n                className={clsx(cls(\"popup-panel-footer\"), classNames?.footer)}\n              >\n                {typeof footer === \"function\"\n                  ? footer({ close: () => setOpen(false) })\n                  : footer}\n              </div>\n            )}\n            {resizable && (\n              <>\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"bottom-left\"\n                  {...getHandleProps({\n                    lockHorizontal: true,\n                  })}\n                />\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"top-left\"\n                  {...getHandleProps({\n                    reverse: true,\n                    lockVertical: true,\n                    onResize: (values) =>\n                      onReverseHandleChangeHorizontal(rootRef, values),\n                  })}\n                />\n                <div\n                  className={clsx(\n                    cls(\"popup-panel-resize-handle\"),\n                    classNames?.resizeHandle\n                  )}\n                  data-placement=\"top-right\"\n                  {...getHandleProps({\n                    lockVertical: true,\n                  })}\n                />\n              </>\n            )}\n          </Popover.Popup>\n        </Popover.Positioner>\n      </Popover.Portal>\n    </Popover.Root>\n  );\n};\n"],"names":["PopupPanel","children","placement","openOnHover","outsideOpen","outsideOnOpenChange","content","title","trigger","className","anchor","beforeCloseButton","afterCloseButton","afterTitle","size","footer","defaultOpen","resizable","classNames","modal","closeOnClickOutside","open","setOpen","useControlledState","cls","useCls","antdCssVarClassname","useAntdCssVarClassname","headlessUIPlacement","parseAntdPlacement","popupRef","setPopupRef","useState","width","setWidth","height","setHeight","callbackRef","useCallback","node","useEffect","observer","entries","entry","defaultCloseIcon","useMemo","jsx","X","renderTitle","jsxs","clsx","Flex","Popover","IconButton","resizing","setResizing","getRootProps","getHandleProps","rootRef","useResizable","rootRefProp","rootPropsWithoutRef","onReverseHandleChangeHorizontal","parent","values","widthDiff","event","reason","PopupPanelSize","mergeRefs","Fragment"],"mappings":"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"}

package/dist/components/ScrollArea/component.js

@@ -1,30 +1,31 @@
-import { jsxs as p, jsx as i } from "react/jsx-runtime";
+"use client";
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
 import { ScrollArea as t } from "@base-ui-components/react";
 import './style.css';/* empty css          */
 import { useCls as b } from "../utils/antdUtils.js";
 import { clsx as l } from "../utils/cn.js";
 const S = ({
-  children: e,
+  children: c,
   className: n,
   classNames: r = {},
-  orientation: c = "vertical"
+  orientation: i = "vertical"
 }) => {
   const o = b();
   return /* @__PURE__ */ p(t.Root, { className: l(o("scroll-area"), n), children: [
-    /* @__PURE__ */ i(
+    /* @__PURE__ */ e(
       t.Viewport,
       {
         className: l(o("scroll-area-viewport"), r == null ? void 0 : r.viewport),
-        children: /* @__PURE__ */ i(t.Content, { className: l(o("scroll-area-content")), children: e })
+        children: /* @__PURE__ */ e(t.Content, { className: l(o("scroll-area-content")), children: c })
       }
     ),
-    /* @__PURE__ */ i(
+    /* @__PURE__ */ e(
       t.Scrollbar,
       {
         className: l(o("scroll-area-scrollbar"), r == null ? void 0 : r.scrollbar),
-        orientation: c,
-        "data-orientation": c,
-        children: /* @__PURE__ */ i(
+        orientation: i,
+        "data-orientation": i,
+        children: /* @__PURE__ */ e(
           t.Thumb,
           {
             className: l(o("scroll-area-thumb"), r == null ? void 0 : r.thumb)

package/dist/components/ScrollArea/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/ScrollArea/component.tsx"],"sourcesContent":["\"use client\";\nimport { type ReactNode } from \"react\";\nimport { ScrollArea as BaseScrollArea } from \"@base-ui-components/react\";\nimport { clsx, useCls } from \"../utils\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport interface ScrollAreaProps {\n  children: ReactNode;\n  /**\n   * Additional class name for the root component\n   */\n  className?: string;\n  /**\n   * Custom class names for each part of the scroll area\n   */\n  classNames?: {\n    /**\n     * Class name for the viewport element\n     */\n    viewport?: string;\n    /**\n     * Class name for the scrollbar element\n     */\n    scrollbar?: string;\n    /**\n     * Class name for the thumb element\n     */\n    thumb?: string;\n  };\n  /**\n   * Orientation of the scrollbar\n   * @default \"vertical\"\n   */\n  orientation?: \"vertical\" | \"horizontal\";\n}\n\nexport const ScrollArea = ({\n  children,\n  className,\n  classNames = {},\n  orientation = \"vertical\",\n}: ScrollAreaProps) => {\n  const cls = useCls();\n  return (\n    <BaseScrollArea.Root className={clsx(cls(\"scroll-area\"), className)}>\n      <BaseScrollArea.Viewport\n        className={clsx(cls(\"scroll-area-viewport\"), classNames?.viewport)}\n      >\n        <BaseScrollArea.Content className={clsx(cls(\"scroll-area-content\"))}>\n          {children}\n        </BaseScrollArea.Content>\n      </BaseScrollArea.Viewport>\n      <BaseScrollArea.Scrollbar\n        className={clsx(cls(\"scroll-area-scrollbar\"), classNames?.scrollbar)}\n        orientation={orientation}\n        data-orientation={orientation}\n      >\n        <BaseScrollArea.Thumb\n          className={clsx(cls(\"scroll-area-thumb\"), classNames?.thumb)}\n        />\n      </BaseScrollArea.Scrollbar>\n    </BaseScrollArea.Root>\n  );\n};\n"],"names":["ScrollArea","children","className","classNames","orientation","cls","useCls","jsxs","BaseScrollArea","clsx","jsx"],"mappings":";;;;;AAsCO,MAAMA,IAAa,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC,IAAa,CAAC;AAAA,EACd,aAAAC,IAAc;AAChB,MAAuB;AACrB,QAAMC,IAAMC,EAAO;AAEjB,SAAA,gBAAAC,EAACC,EAAe,MAAf,EAAoB,WAAWC,EAAKJ,EAAI,aAAa,GAAGH,CAAS,GAChE,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACF,EAAe;AAAA,MAAf;AAAA,QACC,WAAWC,EAAKJ,EAAI,sBAAsB,GAAGF,KAAA,gBAAAA,EAAY,QAAQ;AAAA,QAEjE,UAAA,gBAAAO,EAACF,EAAe,SAAf,EAAuB,WAAWC,EAAKJ,EAAI,qBAAqB,CAAC,GAC/D,UAAAJ,EACH,CAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAS;AAAA,MAACF,EAAe;AAAA,MAAf;AAAA,QACC,WAAWC,EAAKJ,EAAI,uBAAuB,GAAGF,KAAA,gBAAAA,EAAY,SAAS;AAAA,QACnE,aAAAC;AAAA,QACA,oBAAkBA;AAAA,QAElB,UAAA,gBAAAM;AAAA,UAACF,EAAe;AAAA,UAAf;AAAA,YACC,WAAWC,EAAKJ,EAAI,mBAAmB,GAAGF,KAAA,gBAAAA,EAAY,KAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MAC7D;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}
+{"version":3,"file":"component.js","sources":["../../../src/components/ScrollArea/component.tsx"],"sourcesContent":["\"use client\";\nimport { type ReactNode } from \"react\";\nimport { ScrollArea as BaseScrollArea } from \"@base-ui-components/react\";\nimport { clsx, useCls } from \"../utils\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport interface ScrollAreaProps {\n  children: ReactNode;\n  /**\n   * Additional class name for the root component\n   */\n  className?: string;\n  /**\n   * Custom class names for each part of the scroll area\n   */\n  classNames?: {\n    /**\n     * Class name for the viewport element\n     */\n    viewport?: string;\n    /**\n     * Class name for the scrollbar element\n     */\n    scrollbar?: string;\n    /**\n     * Class name for the thumb element\n     */\n    thumb?: string;\n  };\n  /**\n   * Orientation of the scrollbar\n   * @default \"vertical\"\n   */\n  orientation?: \"vertical\" | \"horizontal\";\n}\n\nexport const ScrollArea = ({\n  children,\n  className,\n  classNames = {},\n  orientation = \"vertical\",\n}: ScrollAreaProps) => {\n  const cls = useCls();\n  return (\n    <BaseScrollArea.Root className={clsx(cls(\"scroll-area\"), className)}>\n      <BaseScrollArea.Viewport\n        className={clsx(cls(\"scroll-area-viewport\"), classNames?.viewport)}\n      >\n        <BaseScrollArea.Content className={clsx(cls(\"scroll-area-content\"))}>\n          {children}\n        </BaseScrollArea.Content>\n      </BaseScrollArea.Viewport>\n      <BaseScrollArea.Scrollbar\n        className={clsx(cls(\"scroll-area-scrollbar\"), classNames?.scrollbar)}\n        orientation={orientation}\n        data-orientation={orientation}\n      >\n        <BaseScrollArea.Thumb\n          className={clsx(cls(\"scroll-area-thumb\"), classNames?.thumb)}\n        />\n      </BaseScrollArea.Scrollbar>\n    </BaseScrollArea.Root>\n  );\n};\n"],"names":["ScrollArea","children","className","classNames","orientation","cls","useCls","jsxs","BaseScrollArea","clsx","jsx"],"mappings":";;;;;;AAsCO,MAAMA,IAAa,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC,IAAa,CAAC;AAAA,EACd,aAAAC,IAAc;AAChB,MAAuB;AACrB,QAAMC,IAAMC,EAAO;AAEjB,SAAA,gBAAAC,EAACC,EAAe,MAAf,EAAoB,WAAWC,EAAKJ,EAAI,aAAa,GAAGH,CAAS,GAChE,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACF,EAAe;AAAA,MAAf;AAAA,QACC,WAAWC,EAAKJ,EAAI,sBAAsB,GAAGF,KAAA,gBAAAA,EAAY,QAAQ;AAAA,QAEjE,UAAA,gBAAAO,EAACF,EAAe,SAAf,EAAuB,WAAWC,EAAKJ,EAAI,qBAAqB,CAAC,GAC/D,UAAAJ,EACH,CAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAS;AAAA,MAACF,EAAe;AAAA,MAAf;AAAA,QACC,WAAWC,EAAKJ,EAAI,uBAAuB,GAAGF,KAAA,gBAAAA,EAAY,SAAS;AAAA,QACnE,aAAAC;AAAA,QACA,oBAAkBA;AAAA,QAElB,UAAA,gBAAAM;AAAA,UAACF,EAAe;AAAA,UAAf;AAAA,YACC,WAAWC,EAAKJ,EAAI,mBAAmB,GAAGF,KAAA,gBAAAA,EAAY,KAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MAC7D;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/dist/components/Slider/component.js

@@ -1,13 +1,14 @@
-import { jsx as m } from "react/jsx-runtime";
-import e from "antd/es/slider";
-import { useCls as i } from "../utils/antdUtils.js";
-import { clsx as p } from "../utils/cn.js";
+"use client";
+import { jsx as l } from "react/jsx-runtime";
+import i from "antd/es/slider";
+import { useCls as m } from "../utils/antdUtils.js";
+import { clsx as c } from "../utils/cn.js";
 const d = ({ className: r, tooltip: o = {}, style: s, ...t }) => {
-  const l = i();
-  return /* @__PURE__ */ m(
-    e,
+  const e = m();
+  return /* @__PURE__ */ l(
+    i,
     {
-      className: p(l("slider"), r),
+      className: c(e("slider"), r),
       style: s,
       ...t,
       tooltip: {

package/dist/components/Slider/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/Slider/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntSlider,\n  type SliderSingleProps,\n  type SliderRangeProps,\n} from \"antd/es/slider\";\nimport { useCls, clsx } from \"../utils\";\n\n// Define props interface extending Ant Design's SliderProps\nexport type SliderProps = SliderSingleProps | SliderRangeProps;\n\nexport type { SliderSingleProps, SliderRangeProps };\n\n// Create Slider component\nconst Slider = ({ className, tooltip = {}, style, ...rest }: SliderProps) => {\n  const cls = useCls();\n  return (\n    <AntSlider\n      className={clsx(cls(\"slider\"), className)}\n      style={style}\n      {...rest}\n      tooltip={{\n        arrow: false,\n        ...tooltip,\n      }}\n    />\n  );\n};\n\nexport { Slider };\n"],"names":["Slider","className","tooltip","style","rest","cls","useCls","jsx","AntSlider","clsx"],"mappings":";;;;AAcM,MAAAA,IAAS,CAAC,EAAE,WAAAC,GAAW,SAAAC,IAAU,CAAA,GAAI,OAAAC,GAAO,GAAGC,QAAwB;AAC3E,QAAMC,IAAMC,EAAO;AAEjB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKJ,EAAI,QAAQ,GAAGJ,CAAS;AAAA,MACxC,OAAAE;AAAA,MACC,GAAGC;AAAA,MACJ,SAAS;AAAA,QACP,OAAO;AAAA,QACP,GAAGF;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"component.js","sources":["../../../src/components/Slider/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntSlider,\n  type SliderSingleProps,\n  type SliderRangeProps,\n} from \"antd/es/slider\";\nimport { useCls, clsx } from \"../utils\";\n\n// Define props interface extending Ant Design's SliderProps\nexport type SliderProps = SliderSingleProps | SliderRangeProps;\n\nexport type { SliderSingleProps, SliderRangeProps };\n\n// Create Slider component\nconst Slider = ({ className, tooltip = {}, style, ...rest }: SliderProps) => {\n  const cls = useCls();\n  return (\n    <AntSlider\n      className={clsx(cls(\"slider\"), className)}\n      style={style}\n      {...rest}\n      tooltip={{\n        arrow: false,\n        ...tooltip,\n      }}\n    />\n  );\n};\n\nexport { Slider };\n"],"names":["Slider","className","tooltip","style","rest","cls","useCls","jsx","AntSlider","clsx"],"mappings":";;;;;AAcM,MAAAA,IAAS,CAAC,EAAE,WAAAC,GAAW,SAAAC,IAAU,CAAA,GAAI,OAAAC,GAAO,GAAGC,QAAwB;AAC3E,QAAMC,IAAMC,EAAO;AAEjB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKJ,EAAI,QAAQ,GAAGJ,CAAS;AAAA,MACxC,OAAAE;AAAA,MACC,GAAGC;AAAA,MACJ,SAAS;AAAA,QACP,OAAO;AAAA,QACP,GAAGF;AAAA,MAAA;AAAA,IACL;AAAA,EACF;AAEJ;"}

package/dist/components/Splitter/component.js

@@ -1,6 +1,7 @@
-import { jsx as s } from "react/jsx-runtime";
-import p from "antd/es/splitter/Splitter";
-import n from "antd/es/splitter/Panel";
+"use client";
+import { jsx as l } from "react/jsx-runtime";
+import n from "antd/es/splitter/Splitter";
+import p from "antd/es/splitter/Panel";
 import './style.css';/* empty css          */
 import { useCls as m } from "../utils/antdUtils.js";
 import { clsx as c } from "../utils/cn.js";
@@ -9,24 +10,24 @@ const a = ({
   className: r,
   style: e,
   ...i
-}) => /* @__PURE__ */ s(n, { className: r, style: e, ...i, children: t }), S = ({
+}) => /* @__PURE__ */ l(p, { className: r, style: e, ...i, children: t }), S = ({
   children: t,
   className: r = "",
   style: e = {},
   showSplitBar: i = !0,
-  ...l
+  ...o
 }) => {
-  const o = m();
-  return /* @__PURE__ */ s(
-    p,
+  const s = m();
+  return /* @__PURE__ */ l(
+    n,
     {
       className: c(
-        o("splitter"),
-        !i && o("splitter-hidden-split-bar"),
+        s("splitter"),
+        !i && s("splitter-hidden-split-bar"),
         r
       ),
       style: e,
-      ...l,
+      ...o,
       children: t
     }
   );

package/dist/components/Splitter/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/Splitter/component.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport { default as AntdSplitter } from \"antd/es/splitter/Splitter\";\nimport { default as AntdSplitterPanel } from \"antd/es/splitter/Panel\";\nimport type {\n  SplitterProps as AntdSplitterProps,\n  PanelProps as AntdSplitterPanelProps,\n} from \"antd/es/splitter/interface\";\nimport { useCls, clsx } from \"../utils\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport type SplitterProps = React.PropsWithChildren<AntdSplitterProps> & {\n  showSplitBar?: boolean;\n};\n\nexport type SplitterPanelProps =\n  React.PropsWithChildren<AntdSplitterPanelProps>;\n\nconst SplitterPanel: React.FC<SplitterPanelProps> = ({\n  children,\n  className,\n  style,\n  ...rest\n}) => {\n  return (\n    <AntdSplitterPanel className={className} style={style} {...rest}>\n      {children}\n    </AntdSplitterPanel>\n  );\n};\n\nconst MainSplitter: React.FC<SplitterProps> = ({\n  children,\n  className = \"\",\n  style = {},\n  showSplitBar = true,\n  ...rest\n}) => {\n  const cls = useCls();\n  return (\n    <AntdSplitter\n      className={clsx(\n        cls(\"splitter\"),\n        !showSplitBar && cls(\"splitter-hidden-split-bar\"),\n        className\n      )}\n      style={style}\n      {...rest}\n    >\n      {children}\n    </AntdSplitter>\n  );\n};\n\nexport const Splitter = Object.assign(MainSplitter, {\n  Panel: SplitterPanel,\n});\n\n// For backward compatibility\nexport const Split = Splitter;\n"],"names":["SplitterPanel","children","className","style","rest","AntdSplitterPanel","MainSplitter","showSplitBar","cls","useCls","jsx","AntdSplitter","clsx","Splitter","Split"],"mappings":";;;;;;AAoBA,MAAMA,IAA8C,CAAC;AAAA,EACnD,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,wBAEKC,GAAkB,EAAA,WAAAH,GAAsB,OAAAC,GAAe,GAAGC,GACxD,UAAAH,GACH,GAIEK,IAAwC,CAAC;AAAA,EAC7C,UAAAL;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC,IAAQ,CAAC;AAAA,EACT,cAAAI,IAAe;AAAA,EACf,GAAGH;AACL,MAAM;AACJ,QAAMI,IAAMC,EAAO;AAEjB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTJ,EAAI,UAAU;AAAA,QACd,CAACD,KAAgBC,EAAI,2BAA2B;AAAA,QAChDN;AAAA,MACF;AAAA,MACA,OAAAC;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EACH;AAEJ,GAEaY,IAAW,OAAO,OAAOP,GAAc;AAAA,EAClD,OAAON;AACT,CAAC,GAGYc,IAAQD;"}
+{"version":3,"file":"component.js","sources":["../../../src/components/Splitter/component.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport { default as AntdSplitter } from \"antd/es/splitter/Splitter\";\nimport { default as AntdSplitterPanel } from \"antd/es/splitter/Panel\";\nimport type {\n  SplitterProps as AntdSplitterProps,\n  PanelProps as AntdSplitterPanelProps,\n} from \"antd/es/splitter/interface\";\nimport { useCls, clsx } from \"../utils\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\nexport type SplitterProps = React.PropsWithChildren<AntdSplitterProps> & {\n  showSplitBar?: boolean;\n};\n\nexport type SplitterPanelProps =\n  React.PropsWithChildren<AntdSplitterPanelProps>;\n\nconst SplitterPanel: React.FC<SplitterPanelProps> = ({\n  children,\n  className,\n  style,\n  ...rest\n}) => {\n  return (\n    <AntdSplitterPanel className={className} style={style} {...rest}>\n      {children}\n    </AntdSplitterPanel>\n  );\n};\n\nconst MainSplitter: React.FC<SplitterProps> = ({\n  children,\n  className = \"\",\n  style = {},\n  showSplitBar = true,\n  ...rest\n}) => {\n  const cls = useCls();\n  return (\n    <AntdSplitter\n      className={clsx(\n        cls(\"splitter\"),\n        !showSplitBar && cls(\"splitter-hidden-split-bar\"),\n        className\n      )}\n      style={style}\n      {...rest}\n    >\n      {children}\n    </AntdSplitter>\n  );\n};\n\nexport const Splitter = Object.assign(MainSplitter, {\n  Panel: SplitterPanel,\n});\n\n// For backward compatibility\nexport const Split = Splitter;\n"],"names":["SplitterPanel","children","className","style","rest","AntdSplitterPanel","MainSplitter","showSplitBar","cls","useCls","jsx","AntdSplitter","clsx","Splitter","Split"],"mappings":";;;;;;;AAoBA,MAAMA,IAA8C,CAAC;AAAA,EACnD,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,wBAEKC,GAAkB,EAAA,WAAAH,GAAsB,OAAAC,GAAe,GAAGC,GACxD,UAAAH,GACH,GAIEK,IAAwC,CAAC;AAAA,EAC7C,UAAAL;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,OAAAC,IAAQ,CAAC;AAAA,EACT,cAAAI,IAAe;AAAA,EACf,GAAGH;AACL,MAAM;AACJ,QAAMI,IAAMC,EAAO;AAEjB,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTJ,EAAI,UAAU;AAAA,QACd,CAACD,KAAgBC,EAAI,2BAA2B;AAAA,QAChDN;AAAA,MACF;AAAA,MACA,OAAAC;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EACH;AAEJ,GAEaY,IAAW,OAAO,OAAOP,GAAc;AAAA,EAClD,OAAON;AACT,CAAC,GAGYc,IAAQD;"}

package/dist/components/Stack/Stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.js","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, useCls } from \"../utils\";\n\nexport type StackGap = 0 | 1 | 2 | 4 | 8 | 12 | 16 | 24;\n\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Whether the stack should hug its content (inline-flex) instead of filling available space\n   * @default false\n   */\n  hug?: boolean;\n\n  /**\n   * Vertical alignment of items within the stack\n   * @default \"flex-start\"\n   */\n  align?: \"flex-start\" | \"flex-end\" | \"center\" | \"stretch\" | \"baseline\";\n\n  /**\n   * Horizontal alignment of items within the stack\n   * @default \"flex-start\"\n   */\n  justify?:\n    | \"flex-start\"\n    | \"flex-end\"\n    | \"center\"\n    | \"space-between\"\n    | \"space-around\"\n    | \"space-evenly\";\n\n  /**\n   * Whether the stack should render items vertically\n   * @default false\n   */\n  vertical?: boolean;\n\n  /**\n   * Gap between stack items in pixels\n   * @default 0\n   */\n  gap?: StackGap;\n\n  /**\n   * Wrap items to multiple lines if needed\n   * @default false\n   */\n  wrap?: boolean;\n\n  /**\n   * Children of the stack\n   */\n  children?: React.ReactNode;\n}\n\nexport const Stack: React.FC<StackProps> = ({\n  hug = false,\n  align = \"flex-start\",\n  justify = \"flex-start\",\n  vertical = false,\n  gap = 0,\n  wrap = false,\n  className,\n  children,\n  ...rest\n}) => {\n  const cls = useCls();\n\n  return (\n    <div\n      className={cn(\n        cls(\"stack\"),\n        hug ? cls(\"stack-hug\") : cls(\"stack-fill\"),\n        cls(`stack-gap-${gap}`),\n        vertical ? cls(\"stack-vertical\") : cls(\"stack-horizontal\"),\n        wrap && cls(\"stack-wrap\"),\n        cls(`stack-align-${align}`),\n        cls(`stack-justify-${justify}`),\n        className\n      )}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Stack","hug","align","justify","vertical","gap","wrap","className","children","rest","cls","useCls","jsx","cn"],"mappings":";;;AAsDO,MAAMA,IAA8B,CAAC;AAAA,EAC1C,KAAAC,IAAM;AAAA,EACN,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAO;AAGjB,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTH,EAAI,OAAO;AAAA,QACLA,EAANT,IAAU,cAAmB,YAAR;AAAA,QACrBS,EAAI,aAAaL,CAAG,EAAE;AAAA,QACXK,EAAXN,IAAe,mBAAwB,kBAAR;AAAA,QAC/BE,KAAQI,EAAI,YAAY;AAAA,QACxBA,EAAI,eAAeR,CAAK,EAAE;AAAA,QAC1BQ,EAAI,iBAAiBP,CAAO,EAAE;AAAA,QAC9BI;AAAA,MACF;AAAA,MACC,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"Stack.js","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, useCls } from \"../utils\";\n\nexport type StackGap = 0 | 1 | 2 | 4 | 8 | 12 | 16 | 24 | 28 | 32 | 40 | 48;\n\nexport interface StackProps extends React.HTMLAttributes<HTMLDivElement> {\n  /**\n   * Whether the stack should hug its content (inline-flex) instead of filling available space\n   * @default false\n   */\n  hug?: boolean;\n\n  /**\n   * Vertical alignment of items within the stack\n   * @default \"flex-start\"\n   */\n  align?: \"flex-start\" | \"flex-end\" | \"center\" | \"stretch\" | \"baseline\";\n\n  /**\n   * Horizontal alignment of items within the stack\n   * @default \"flex-start\"\n   */\n  justify?:\n    | \"flex-start\"\n    | \"flex-end\"\n    | \"center\"\n    | \"space-between\"\n    | \"space-around\"\n    | \"space-evenly\";\n\n  /**\n   * Whether the stack should render items vertically\n   * @default false\n   */\n  vertical?: boolean;\n\n  /**\n   * Gap between stack items in pixels\n   * @default 0\n   */\n  gap?: StackGap;\n\n  /**\n   * Wrap items to multiple lines if needed\n   * @default false\n   */\n  wrap?: boolean;\n\n  /**\n   * Children of the stack\n   */\n  children?: React.ReactNode;\n}\n\nexport const Stack: React.FC<StackProps> = ({\n  hug = false,\n  align = \"flex-start\",\n  justify = \"flex-start\",\n  vertical = false,\n  gap = 0,\n  wrap = false,\n  className,\n  children,\n  ...rest\n}) => {\n  const cls = useCls();\n\n  return (\n    <div\n      className={cn(\n        cls(\"stack\"),\n        hug ? cls(\"stack-hug\") : cls(\"stack-fill\"),\n        cls(`stack-gap-${gap}`),\n        vertical ? cls(\"stack-vertical\") : cls(\"stack-horizontal\"),\n        wrap && cls(\"stack-wrap\"),\n        cls(`stack-align-${align}`),\n        cls(`stack-justify-${justify}`),\n        className\n      )}\n      {...rest}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Stack","hug","align","justify","vertical","gap","wrap","className","children","rest","cls","useCls","jsx","cn"],"mappings":";;;AAsDO,MAAMA,IAA8B,CAAC;AAAA,EAC1C,KAAAC,IAAM;AAAA,EACN,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAO;AAGjB,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTH,EAAI,OAAO;AAAA,QACLA,EAANT,IAAU,cAAmB,YAAR;AAAA,QACrBS,EAAI,aAAaL,CAAG,EAAE;AAAA,QACXK,EAAXN,IAAe,mBAAwB,kBAAR;AAAA,QAC/BE,KAAQI,EAAI,YAAY;AAAA,QACxBA,EAAI,eAAeR,CAAK,EAAE;AAAA,QAC1BQ,EAAI,iBAAiBP,CAAO,EAAE;AAAA,QAC9BI;AAAA,MACF;AAAA,MACC,GAAGE;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/components/Stack/StackChild.js

@@ -1,15 +1,15 @@
 import { jsx as a } from "react/jsx-runtime";
-import g from "react";
-import { useRender as N } from "@base-ui-components/react/use-render";
-import { mergeProps as v } from "@base-ui-components/react/merge-props";
-import { Stack as E } from "./Stack.js";
-import { useCls as P } from "../utils/antdUtils.js";
-import { cn as R } from "../utils/cn.js";
+import b from "react";
+import { useRender as g } from "@base-ui-components/react/use-render";
+import { mergeProps as N } from "@base-ui-components/react/merge-props";
+import { Stack as V } from "./Stack.js";
+import { useCls as v } from "../utils/antdUtils.js";
+import { cn as E } from "../utils/cn.js";
 const B = ({
   flex: s,
   grow: l = !1,
   shrink: c = !1,
-  children: e,
+  children: t,
   style: m,
   stack: f = !1,
   // stack props
@@ -22,7 +22,7 @@ const B = ({
   className: x,
   ...h
 }) => {
-  const t = P(), y = {
+  const e = v(), y = {
     hug: i,
     align: n,
     justify: p,
@@ -31,25 +31,28 @@ const B = ({
     wrap: u
   };
   let o = "";
-  typeof s == "boolean" && (o = t(s ? "stack-child-flex-1" : "stack-child-flex-0"));
-  const r = R(
-    t("stack-child"),
-    l && t("stack-child-grow"),
-    c && t("stack-child-shrink"),
+  typeof s == "boolean" && (o = e(s ? "stack-child-flex-1" : "stack-child-flex-0"));
+  const r = E(
+    e("stack-child"),
+    l && e("stack-child-grow"),
+    c && e("stack-child-shrink"),
     o,
     x
-  ), C = typeof s == "string" || typeof s == "number" ? s : void 0, { renderElement: b } = N({
-    render: () => g.isValidElement(e) ? e : /* @__PURE__ */ a("div", { children: e }),
-    props: v({
-      className: r,
-      style: {
-        ...m,
-        flex: C
+  ), C = g({
+    render: () => b.isValidElement(t) ? t : /* @__PURE__ */ a("div", { children: t }),
+    props: N(
+      {
+        className: r,
+        style: {
+          ...m,
+          flex: typeof s == "string" || typeof s == "number" ? s : void 0
+        },
+        ...h
       },
-      ...h
-    })
+      {}
+    )
   });
-  return f ? /* @__PURE__ */ a(E, { ...y, className: r, children: e }) : b();
+  return f ? /* @__PURE__ */ a(V, { ...y, className: r, children: t }) : C;
 };
 export {
   B as StackChild

package/dist/components/Stack/StackChild.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackChild.js","sources":["../../../src/components/Stack/StackChild.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n  /**\n   * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n   * When boolean: true = 1, false = 0\n   * @default undefined\n   */\n  flex?: string | number | boolean;\n\n  /**\n   * Whether this child should grow to fill available space\n   * @default false\n   */\n  grow?: boolean;\n\n  /**\n   * Whether this child should shrink if necessary\n   * @default false\n   */\n  shrink?: boolean;\n\n  /**\n   * Children of the stack child\n   */\n  children?: React.ReactNode;\n  /**\n   * Whether to render the child with a stack wrapper\n   * @default false\n   */\n  stack?: boolean;\n}\n\nexport const StackChild: React.FC<StackChildProps> = ({\n  flex,\n  grow = false,\n  shrink = false,\n  children,\n  style,\n  stack = false,\n  // stack props\n  hug = false,\n  align = \"flex-start\",\n  justify = \"flex-start\",\n  vertical = false,\n  gap = 0,\n  wrap = false,\n\n  className,\n  ...rest\n}) => {\n  const cls = useCls();\n  const stackProps = {\n    hug,\n    align,\n    justify,\n    vertical,\n    gap,\n    wrap,\n  };\n\n  // Determine flex class based on flex prop type\n  let flexClass = \"\";\n  if (typeof flex === \"boolean\") {\n    flexClass = flex ? cls(\"stack-child-flex-1\") : cls(\"stack-child-flex-0\");\n  }\n\n  // Calculate the combined className\n  const combinedClassName = cn(\n    cls(\"stack-child\"),\n    grow && cls(\"stack-child-grow\"),\n    shrink && cls(\"stack-child-shrink\"),\n    flexClass,\n    className\n  );\n\n  // Calculate the flex style value\n  const flexValue =\n    typeof flex === \"string\" || typeof flex === \"number\" ? flex : undefined;\n\n  // Use useRender to apply props directly to the child without creating a wrapper\n  const { renderElement } = useRender({\n    render: () =>\n      React.isValidElement(children) ? children : <div>{children}</div>,\n    props: mergeProps<\"div\">({\n      className: combinedClassName,\n      style: {\n        ...style,\n        flex: flexValue,\n      },\n      ...rest,\n    }),\n  });\n\n  return stack ? (\n    <Stack {...stackProps} className={combinedClassName}>\n      {children}\n    </Stack>\n  ) : (\n    renderElement()\n  );\n};\n"],"names":["StackChild","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","cls","useCls","stackProps","flexClass","combinedClassName","cn","flexValue","renderElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;AAqCO,MAAMA,IAAwC,CAAC;AAAA,EACpD,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA;AAAA,EAER,KAAAC,IAAM;AAAA,EACN,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EAEP,WAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,IACjB,KAAAV;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,KAAAC;AAAA,IACA,MAAAC;AAAA,EACF;AAGA,MAAIM,IAAY;AACZ,EAAA,OAAOjB,KAAS,cAClBiB,IAAmBH,EAAPd,IAAW,uBAA4B,oBAAR;AAI7C,QAAMkB,IAAoBC;AAAA,IACxBL,EAAI,aAAa;AAAA,IACjBb,KAAQa,EAAI,kBAAkB;AAAA,IAC9BZ,KAAUY,EAAI,oBAAoB;AAAA,IAClCG;AAAA,IACAL;AAAA,EACF,GAGMQ,IACJ,OAAOpB,KAAS,YAAY,OAAOA,KAAS,WAAWA,IAAO,QAG1D,EAAE,eAAAqB,EAAc,IAAIC,EAAU;AAAA,IAClC,QAAQ,MACNC,EAAM,eAAepB,CAAQ,IAAIA,IAAY,gBAAAqB,EAAA,OAAA,EAAK,UAAArB,GAAS;AAAA,IAC7D,OAAOsB,EAAkB;AAAA,MACvB,WAAWP;AAAA,MACX,OAAO;AAAA,QACL,GAAGd;AAAA,QACH,MAAMgB;AAAA,MACR;AAAA,MACA,GAAGP;AAAA,IACJ,CAAA;AAAA,EAAA,CACF;AAEM,SAAAR,sBACJqB,GAAO,EAAA,GAAGV,GAAY,WAAWE,GAC/B,UAAAf,GACH,IAEAkB,EAAc;AAElB;"}
+{"version":3,"file":"StackChild.js","sources":["../../../src/components/Stack/StackChild.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, useCls } from \"../utils\";\nimport { useRender } from \"@base-ui-components/react/use-render\";\nimport { mergeProps } from \"@base-ui-components/react/merge-props\";\nimport { Stack, StackProps } from \"./Stack\";\n\nexport interface StackChildProps extends StackProps {\n  /**\n   * CSS flex property value (e.g. \"1\", \"1 0 auto\", \"0 1 auto\")\n   * When boolean: true = 1, false = 0\n   * @default undefined\n   */\n  flex?: string | number | boolean;\n\n  /**\n   * Whether this child should grow to fill available space\n   * @default false\n   */\n  grow?: boolean;\n\n  /**\n   * Whether this child should shrink if necessary\n   * @default false\n   */\n  shrink?: boolean;\n\n  /**\n   * Children of the stack child\n   */\n  children?: React.ReactNode;\n  /**\n   * Whether to render the child with a stack wrapper\n   * @default false\n   */\n  stack?: boolean;\n}\n\nexport const StackChild: React.FC<StackChildProps> = ({\n  flex,\n  grow = false,\n  shrink = false,\n  children,\n  style,\n  stack = false,\n  // stack props\n  hug = false,\n  align = \"flex-start\",\n  justify = \"flex-start\",\n  vertical = false,\n  gap = 0,\n  wrap = false,\n\n  className,\n  ...rest\n}) => {\n  const cls = useCls();\n  const stackProps = {\n    hug,\n    align,\n    justify,\n    vertical,\n    gap,\n    wrap,\n  };\n\n  // Determine flex class based on flex prop type\n  let flexClass = \"\";\n  if (typeof flex === \"boolean\") {\n    flexClass = flex ? cls(\"stack-child-flex-1\") : cls(\"stack-child-flex-0\");\n  }\n\n  // Calculate the combined className\n  const combinedClassName = cn(\n    cls(\"stack-child\"),\n    grow && cls(\"stack-child-grow\"),\n    shrink && cls(\"stack-child-shrink\"),\n    flexClass,\n    className\n  );\n\n  // Calculate the flex style value\n  const flexValue =\n    typeof flex === \"string\" || typeof flex === \"number\" ? flex : undefined;\n\n  // Use useRender to apply props directly to the child without creating a wrapper\n  const renderedElement = useRender({\n    render: () =>\n      React.isValidElement(children) ? children : <div>{children}</div>,\n    props: mergeProps<\"div\">(\n      {\n        className: combinedClassName,\n        style: {\n          ...style,\n          flex: flexValue,\n        },\n        ...rest,\n      },\n      {}\n    ),\n  });\n\n  return stack ? (\n    <Stack {...stackProps} className={combinedClassName}>\n      {children}\n    </Stack>\n  ) : (\n    renderedElement\n  );\n};\n"],"names":["StackChild","flex","grow","shrink","children","style","stack","hug","align","justify","vertical","gap","wrap","className","rest","cls","useCls","stackProps","flexClass","combinedClassName","cn","renderedElement","useRender","React","jsx","mergeProps","Stack"],"mappings":";;;;;;;AAqCO,MAAMA,IAAwC,CAAC;AAAA,EACpD,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA;AAAA,EAER,KAAAC,IAAM;AAAA,EACN,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EAEP,WAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAMC,EAAO,GACbC,IAAa;AAAA,IACjB,KAAAV;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,KAAAC;AAAA,IACA,MAAAC;AAAA,EACF;AAGA,MAAIM,IAAY;AACZ,EAAA,OAAOjB,KAAS,cAClBiB,IAAmBH,EAAPd,IAAW,uBAA4B,oBAAR;AAI7C,QAAMkB,IAAoBC;AAAA,IACxBL,EAAI,aAAa;AAAA,IACjBb,KAAQa,EAAI,kBAAkB;AAAA,IAC9BZ,KAAUY,EAAI,oBAAoB;AAAA,IAClCG;AAAA,IACAL;AAAA,EACF,GAOMQ,IAAkBC,EAAU;AAAA,IAChC,QAAQ,MACNC,EAAM,eAAenB,CAAQ,IAAIA,IAAY,gBAAAoB,EAAA,OAAA,EAAK,UAAApB,GAAS;AAAA,IAC7D,OAAOqB;AAAA,MACL;AAAA,QACE,WAAWN;AAAA,QACX,OAAO;AAAA,UACL,GAAGd;AAAA,UACH,MAXN,OAAOJ,KAAS,YAAY,OAAOA,KAAS,WAAWA,IAAO;AAAA,QAY1D;AAAA,QACA,GAAGa;AAAA,MACL;AAAA,MACA,CAAA;AAAA,IAAC;AAAA,EACH,CACD;AAEM,SAAAR,sBACJoB,GAAO,EAAA,GAAGT,GAAY,WAAWE,GAC/B,UAAAf,EACH,CAAA,IAEAiB;AAEJ;"}

package/dist/components/Stack/style.css

@@ -1 +1 @@
-@layer components{.ds-stack{display:flex}.ds-stack-hug{display:inline-flex}.ds-stack-horizontal{flex-direction:row}.ds-stack-vertical{flex-direction:column}.ds-stack-fill.ds-stack-vertical{height:100%}.ds-stack-fill.ds-stack-horizontal{width:100%}.ds-stack-wrap{flex-wrap:wrap}.ds-stack-gap-0{gap:0}.ds-stack-gap-1{gap:1px}.ds-stack-gap-2{gap:2px}.ds-stack-gap-4{gap:4px}.ds-stack-gap-8{gap:8px}.ds-stack-gap-12{gap:12px}.ds-stack-gap-16{gap:16px}.ds-stack-gap-24,.ds-stack-gap-32{gap:24px}.ds-stack-align-flex-start{align-items:flex-start}.ds-stack-align-flex-end{align-items:flex-end}.ds-stack-align-center{align-items:center}.ds-stack-align-stretch{align-items:stretch}.ds-stack-align-baseline{align-items:baseline}.ds-stack-justify-flex-start{justify-content:flex-start}.ds-stack-justify-flex-end{justify-content:flex-end}.ds-stack-justify-center{justify-content:center}.ds-stack-justify-space-between{justify-content:space-between}.ds-stack-justify-space-around{justify-content:space-around}.ds-stack-justify-space-evenly{justify-content:space-evenly}.ds-stack-child{min-width:0;min-height:0}.ds-stack-child-flex-0{flex:0}.ds-stack-child-flex-1{flex:1}.ds-stack-child-grow{flex-grow:1}.ds-stack-child-shrink{flex-shrink:1}}
+@layer components{.ds-stack{display:flex}.ds-stack-hug{display:inline-flex}.ds-stack-horizontal{flex-direction:row}.ds-stack-vertical{flex-direction:column}.ds-stack-fill.ds-stack-vertical{height:100%}.ds-stack-fill.ds-stack-horizontal{width:100%}.ds-stack-wrap{flex-wrap:wrap}.ds-stack-gap-0{gap:0}.ds-stack-gap-1{gap:1px}.ds-stack-gap-2{gap:2px}.ds-stack-gap-4{gap:4px}.ds-stack-gap-8{gap:8px}.ds-stack-gap-12{gap:12px}.ds-stack-gap-16{gap:16px}.ds-stack-gap-24{gap:24px}.ds-stack-gap-28{gap:28px}.ds-stack-gap-32{gap:32px}.ds-stack-gap-40{gap:40px}.ds-stack-gap-48{gap:48px}.ds-stack-align-flex-start{align-items:flex-start}.ds-stack-align-flex-end{align-items:flex-end}.ds-stack-align-center{align-items:center}.ds-stack-align-stretch{align-items:stretch}.ds-stack-align-baseline{align-items:baseline}.ds-stack-justify-flex-start{justify-content:flex-start}.ds-stack-justify-flex-end{justify-content:flex-end}.ds-stack-justify-center{justify-content:center}.ds-stack-justify-space-between{justify-content:space-between}.ds-stack-justify-space-around{justify-content:space-around}.ds-stack-justify-space-evenly{justify-content:space-evenly}.ds-stack-child{min-width:0;min-height:0}.ds-stack-child-flex-0{flex:0}.ds-stack-child-flex-1{flex:1}.ds-stack-child-grow{flex-grow:1}.ds-stack-child-shrink{flex-shrink:1}}

package/dist/components/Table/component.js

@@ -1,100 +1,112 @@
-import { jsx as e, jsxs as g, Fragment as _ } from "react/jsx-runtime";
-import t from "antd/es/table";
-import { FunnelIcon as h, CaretUpIcon as p, CaretDownIcon as E } from "@bioturing/assets";
-import { Empty as w } from "../Empty/component.js";
-import { forwardRef as x, useState as j, useRef as A, useEffect as U, useCallback as M } from "react";
+"use client";
+import { jsx as t, jsxs as U, Fragment as z } from "react/jsx-runtime";
+import o from "antd/es/table";
+import { FunnelIcon as H, CaretUpIcon as g, CaretDownIcon as L } from "@bioturing/assets";
+import { Empty as M } from "../Empty/component.js";
+import { forwardRef as P, useState as R, useRef as b, useEffect as D, useCallback as $ } from "react";
 import './style.css';/* empty css          */
-import { useCls as R } from "../utils/antdUtils.js";
-const D = ({
-  columns: f,
-  locale: N,
-  emptyDescription: C,
-  loading: l,
+import { useCls as k } from "../utils/antdUtils.js";
+import { clsx as q } from "../utils/cn.js";
+const F = ({
+  columns: N,
+  locale: S,
+  emptyDescription: T,
+  loading: s,
   virtual: i,
-  scroll: I = {},
-  ...b
-}, r) => {
-  const c = R(), [L, d] = j(
+  scroll: d = {},
+  className: y,
+  variant: O,
+  ...h
+}, c) => {
+  const r = k(), [_, w] = R(
     i ? {} : {
-      x: "fit-content",
-      y: "fit-content"
+      x: "fit-content"
     }
-  ), s = A(null);
-  U(() => {
-    var u;
-    if (!s.current) return;
-    const n = (u = s.current) == null ? void 0 : u.nativeElement.querySelector(
-      "." + c("table-tbody")
-    ), o = new ResizeObserver((S) => {
-      for (const m of S)
-        m.target && d({
-          y: m.target.clientHeight,
-          x: m.target.clientWidth
+  ), m = b(null), C = b(0);
+  D(() => {
+    var I;
+    if (!m.current || !i) return;
+    const e = (I = m.current) == null ? void 0 : I.nativeElement, n = e == null ? void 0 : e.parentElement;
+    if (!n) return;
+    const l = e == null ? void 0 : e.querySelector(
+      `.${r("table-thead")}`
+    ), a = e == null ? void 0 : e.querySelector(
+      `.${r("table-pagination")}`
+    );
+    if (a) {
+      const p = getComputedStyle(a).marginTop, u = getComputedStyle(a).marginBottom;
+      C.current = a.offsetHeight + parseInt(p) + parseInt(u);
+    }
+    const E = new ResizeObserver((p) => {
+      for (const u of p)
+        u.target && w({
+          y: n.offsetHeight - (l ? l == null ? void 0 : l.offsetHeight : 0) - C.current
         });
     });
-    return n && i && o.observe(n), () => {
-      n && i && o.disconnect();
+    return n && i && E.observe(n), () => {
+      n && i && E.disconnect();
     };
-  }, [i, c]);
-  const T = f ? f.map((n) => ({
-    sortIcon: ({ sortOrder: o }) => /* @__PURE__ */ e(
+  }, [i, r]);
+  const x = N ? N.map((e) => ({
+    sortIcon: ({ sortOrder: n }) => /* @__PURE__ */ t(
       "span",
       {
-        className: c(
+        className: r(
           "table-column-sort-icon",
-          o ? `table-column-sort-icon-${o}` : "table-column-sort-icon-none"
+          n ? `table-column-sort-icon-${n}` : "table-column-sort-icon-none"
         ),
-        children: o ? o === "ascend" ? /* @__PURE__ */ e(p, { weight: "fill" }) : /* @__PURE__ */ e(E, { weight: "fill" }) : /* @__PURE__ */ g(_, { children: [
-          /* @__PURE__ */ e(p, { weight: "fill" }),
+        children: n ? n === "ascend" ? /* @__PURE__ */ t(g, { weight: "fill" }) : /* @__PURE__ */ t(L, { weight: "fill" }) : /* @__PURE__ */ U(z, { children: [
+          /* @__PURE__ */ t(g, { weight: "fill" }),
           " ",
-          /* @__PURE__ */ e(E, { weight: "fill" })
+          /* @__PURE__ */ t(L, { weight: "fill" })
         ] })
       }
     ),
-    filterIcon: (o) => /* @__PURE__ */ e("span", { className: c("table-column-filter-icon"), children: /* @__PURE__ */ e(h, { weight: "fill" }) }),
-    ...n
-  })) : void 0, y = {
-    emptyText: /* @__PURE__ */ e(w, { description: C }),
-    ...N
+    filterIcon: (n) => /* @__PURE__ */ t("span", { className: r("table-column-filter-icon"), children: /* @__PURE__ */ t(H, { weight: "fill" }) }),
+    ...e
+  })) : void 0, j = {
+    emptyText: /* @__PURE__ */ t(M, { description: T }),
+    ...S
   };
-  let a;
-  typeof l == "boolean" ? a = {
-    spinning: l,
-    indicator: /* @__PURE__ */ e("span", { className: c("spin-loader") })
-  } : typeof l == "object" && (a = {
+  let f;
+  typeof s == "boolean" ? f = {
+    spinning: s,
+    indicator: /* @__PURE__ */ t("span", { className: r("spin-loader") })
+  } : typeof s == "object" && (f = {
     spinning: !0,
-    indicator: /* @__PURE__ */ e("span", { className: c("spin-loader") }),
-    ...l
+    indicator: /* @__PURE__ */ t("span", { className: r("spin-loader") }),
+    ...s
   });
-  const O = M(
-    (n) => {
-      n && (typeof r == "function" && r(n), r && typeof r == "object" && "current" in r && (r.current = n), s.current = n);
+  const A = $(
+    (e) => {
+      e && (typeof c == "function" && c(e), c && typeof c == "object" && "current" in c && (c.current = e), m.current = e);
     },
-    [r]
+    [c]
   );
-  return /* @__PURE__ */ e(
-    t,
+  return /* @__PURE__ */ t(
+    o,
     {
-      ref: O,
-      columns: T,
-      loading: a,
-      locale: y,
+      ref: A,
+      columns: x,
+      loading: f,
+      locale: j,
       virtual: i,
-      scroll: { ...L, ...I },
-      ...b
+      scroll: { ..._, ...d },
+      className: q(O === "zebra" ? r("table-zebra") : "", y),
+      ...h
     }
   );
-}, P = x(D), v = Object.assign(P, {
-  Column: t.Column,
-  ColumnGroup: t.ColumnGroup,
-  SELECTION_COLUMN: t.SELECTION_COLUMN,
-  EXPAND_COLUMN: t.EXPAND_COLUMN,
-  SELECTION_ALL: t.SELECTION_ALL,
-  SELECTION_INVERT: t.SELECTION_INVERT,
-  SELECTION_NONE: t.SELECTION_NONE,
-  Summary: t.Summary
+}, G = P(F), Y = Object.assign(G, {
+  Column: o.Column,
+  ColumnGroup: o.ColumnGroup,
+  SELECTION_COLUMN: o.SELECTION_COLUMN,
+  EXPAND_COLUMN: o.EXPAND_COLUMN,
+  SELECTION_ALL: o.SELECTION_ALL,
+  SELECTION_INVERT: o.SELECTION_INVERT,
+  SELECTION_NONE: o.SELECTION_NONE,
+  Summary: o.Summary
 });
 export {
-  v as Table
+  Y as Table
 };
 //# sourceMappingURL=component.js.map

package/dist/components/Table/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/Table/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntTable,\n  type ColumnType,\n  type TableProps as AntTableProps,\n  type TableRef,\n} from \"antd/es/table\";\nimport { CaretDownIcon, CaretUpIcon, FunnelIcon } from \"@bioturing/assets\";\nimport { useCls } from \"../utils\";\nimport Empty from \"../Empty/component\";\nimport { SpinProps } from \"antd/es/spin\";\nimport {\n  useState,\n  useEffect,\n  forwardRef,\n  Ref,\n  ForwardedRef,\n  useCallback,\n  useRef,\n} from \"react\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\n// Define interface with all the generic type parameters from AntTable without any\nexport interface TableProps<RecordType extends object = object>\n  extends AntTableProps<RecordType> {\n  /**\n   * Add empty description for the table\n   */\n  emptyDescription?: React.ReactNode;\n  /**\n   * Table ref\n   */\n  tableRef?: React.Ref<HTMLDivElement>;\n}\n\n// Simple wrapper component with proper generics\nconst InnerInternalTable = <RecordType extends object = object>(\n  {\n    columns,\n    locale,\n    emptyDescription,\n    loading,\n    virtual,\n    scroll: scrollProp = {},\n    ...rest\n  }: TableProps<RecordType>,\n  ref: Ref<TableRef>\n) => {\n  const cls = useCls();\n  const [scroll, setScroll] = useState<TableProps[\"scroll\"]>(\n    virtual\n      ? {}\n      : {\n          x: \"fit-content\",\n          y: \"fit-content\",\n        }\n  );\n\n  const innerRef = useRef<TableRef>(null);\n\n  useEffect(() => {\n    if (!innerRef.current) return;\n    const tbody = innerRef.current?.nativeElement.querySelector(\n      \".\" + cls(\"table-tbody\")\n    ) as HTMLElement;\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.target) {\n          setScroll({\n            y: entry.target.clientHeight,\n            x: entry.target.clientWidth,\n          });\n        }\n      }\n    });\n    if (tbody && virtual) {\n      resizeObserver.observe(tbody);\n    }\n\n    return () => {\n      if (tbody && virtual) {\n        resizeObserver.disconnect();\n      }\n    };\n  }, [virtual, cls]);\n  const modifiedColumns = columns\n    ? columns.map((column: ColumnType<RecordType>): ColumnType<RecordType> => {\n        return {\n          sortIcon: ({ sortOrder }) => {\n            return (\n              <span\n                className={cls(\n                  \"table-column-sort-icon\",\n                  sortOrder\n                    ? `table-column-sort-icon-${sortOrder}`\n                    : `table-column-sort-icon-none`\n                )}\n              >\n                {!sortOrder ? (\n                  <>\n                    <CaretUpIcon weight=\"fill\" />{\" \"}\n                    <CaretDownIcon weight=\"fill\" />\n                  </>\n                ) : sortOrder === \"ascend\" ? (\n                  <CaretUpIcon weight=\"fill\" />\n                ) : (\n                  <CaretDownIcon weight=\"fill\" />\n                )}\n              </span>\n            );\n          },\n          filterIcon: (_filtered) => {\n            return (\n              <span className={cls(\"table-column-filter-icon\")}>\n                <FunnelIcon weight=\"fill\" />\n              </span>\n            );\n          },\n          ...column,\n        };\n      })\n    : undefined;\n  const modifiedLocale = {\n    emptyText: <Empty description={emptyDescription} />,\n    ...locale,\n  };\n  let spinProps: SpinProps | undefined;\n  if (typeof loading === \"boolean\") {\n    spinProps = {\n      spinning: loading,\n      indicator: <span className={cls(\"spin-loader\")} />,\n    };\n  } else if (typeof loading === \"object\") {\n    spinProps = {\n      spinning: true,\n      indicator: <span className={cls(\"spin-loader\")} />,\n      ...loading,\n    };\n  }\n  const callbackRef = useCallback(\n    (tableRef: TableRef) => {\n      if (tableRef) {\n        if (typeof ref === \"function\") {\n          ref(tableRef);\n        }\n        if (ref && typeof ref === \"object\" && \"current\" in ref) {\n          ref.current = tableRef;\n        }\n        innerRef.current = tableRef;\n      }\n    },\n    [ref]\n  );\n\n  return (\n    <AntTable\n      ref={callbackRef}\n      columns={modifiedColumns}\n      loading={spinProps}\n      locale={modifiedLocale}\n      virtual={virtual}\n      scroll={{ ...scroll, ...scrollProp }}\n      {...rest}\n    />\n  );\n};\n\nconst InternalTable = forwardRef(InnerInternalTable) as <\n  RecordType extends object = object\n>(\n  props: TableProps<RecordType> & { ref?: ForwardedRef<TableRef> }\n) => ReturnType<typeof InnerInternalTable>;\n\n// Create the final component with all static properties\nexport const Table = Object.assign(InternalTable, {\n  Column: AntTable.Column,\n  ColumnGroup: AntTable.ColumnGroup,\n  SELECTION_COLUMN: AntTable.SELECTION_COLUMN,\n  EXPAND_COLUMN: AntTable.EXPAND_COLUMN,\n  SELECTION_ALL: AntTable.SELECTION_ALL,\n  SELECTION_INVERT: AntTable.SELECTION_INVERT,\n  SELECTION_NONE: AntTable.SELECTION_NONE,\n  Summary: AntTable.Summary,\n}) as typeof InternalTable & {\n  Column: typeof AntTable.Column;\n  ColumnGroup: typeof AntTable.ColumnGroup;\n  SELECTION_COLUMN: typeof AntTable.SELECTION_COLUMN;\n  EXPAND_COLUMN: typeof AntTable.EXPAND_COLUMN;\n  SELECTION_ALL: typeof AntTable.SELECTION_ALL;\n  SELECTION_INVERT: typeof AntTable.SELECTION_INVERT;\n  SELECTION_NONE: typeof AntTable.SELECTION_NONE;\n  Summary: typeof AntTable.Summary;\n};\n"],"names":["InnerInternalTable","columns","locale","emptyDescription","loading","virtual","scrollProp","rest","ref","cls","useCls","scroll","setScroll","useState","innerRef","useRef","useEffect","tbody","_a","resizeObserver","entries","entry","modifiedColumns","column","sortOrder","jsx","CaretUpIcon","CaretDownIcon","jsxs","Fragment","_filtered","FunnelIcon","modifiedLocale","Empty","spinProps","callbackRef","useCallback","tableRef","AntTable","InternalTable","forwardRef","Table"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/Table/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntTable,\n  type ColumnType,\n  type TableProps as AntTableProps,\n  type TableRef,\n} from \"antd/es/table\";\nimport { CaretDownIcon, CaretUpIcon, FunnelIcon } from \"@bioturing/assets\";\nimport { clsx, useCls } from \"../utils\";\nimport Empty from \"../Empty/component\";\nimport { SpinProps } from \"antd/es/spin\";\nimport {\n  useState,\n  useEffect,\n  forwardRef,\n  Ref,\n  ForwardedRef,\n  useCallback,\n  useRef,\n} from \"react\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\n// Define interface with all the generic type parameters from AntTable without any\nexport interface TableProps<RecordType extends object = object>\n  extends AntTableProps<RecordType> {\n  /**\n   * Add empty description for the table\n   */\n  emptyDescription?: React.ReactNode;\n  /**\n   * Table ref\n   */\n  tableRef?: React.Ref<HTMLDivElement>;\n  /**\n   * Table style\n   */\n  variant?: \"default\" | \"zebra\";\n}\n\n// Simple wrapper component with proper generics\nconst InnerInternalTable = <RecordType extends object = object>(\n  {\n    columns,\n    locale,\n    emptyDescription,\n    loading,\n    virtual,\n    scroll: scrollProp = {},\n    className,\n    variant,\n    ...rest\n  }: TableProps<RecordType>,\n  ref: Ref<TableRef>\n) => {\n  const cls = useCls();\n  const [scroll, setScroll] = useState<TableProps[\"scroll\"]>(\n    virtual\n      ? {}\n      : {\n          x: \"fit-content\",\n        }\n  );\n\n  const innerRef = useRef<TableRef>(null);\n  const tablePaginationHeight = useRef<number>(0);\n\n  useEffect(() => {\n    if (!innerRef.current || !virtual) return;\n    const tableEl = innerRef.current?.nativeElement;\n    const parentEl = tableEl?.parentElement;\n    if (!parentEl) return;\n    const thead = tableEl?.querySelector(\n      `.${cls(\"table-thead\")}`\n    ) as HTMLElement;\n    const tpagination = tableEl?.querySelector(\n      `.${cls(\"table-pagination\")}`\n    ) as HTMLElement;\n    if (tpagination) {\n      const mt = getComputedStyle(tpagination).marginTop;\n      const mb = getComputedStyle(tpagination).marginBottom;\n      tablePaginationHeight.current =\n        tpagination.offsetHeight + parseInt(mt) + parseInt(mb);\n    }\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.target) {\n          setScroll({\n            y:\n              parentEl.offsetHeight -\n              (thead ? thead?.offsetHeight : 0) -\n              tablePaginationHeight.current,\n          });\n        }\n      }\n    });\n    if (parentEl && virtual) {\n      resizeObserver.observe(parentEl);\n    }\n    return () => {\n      if (parentEl && virtual) {\n        resizeObserver.disconnect();\n      }\n    };\n  }, [virtual, cls]);\n\n  const modifiedColumns = columns\n    ? columns.map((column: ColumnType<RecordType>): ColumnType<RecordType> => {\n        return {\n          sortIcon: ({ sortOrder }) => {\n            return (\n              <span\n                className={cls(\n                  \"table-column-sort-icon\",\n                  sortOrder\n                    ? `table-column-sort-icon-${sortOrder}`\n                    : `table-column-sort-icon-none`\n                )}\n              >\n                {!sortOrder ? (\n                  <>\n                    <CaretUpIcon weight=\"fill\" />{\" \"}\n                    <CaretDownIcon weight=\"fill\" />\n                  </>\n                ) : sortOrder === \"ascend\" ? (\n                  <CaretUpIcon weight=\"fill\" />\n                ) : (\n                  <CaretDownIcon weight=\"fill\" />\n                )}\n              </span>\n            );\n          },\n          filterIcon: (_filtered) => {\n            return (\n              <span className={cls(\"table-column-filter-icon\")}>\n                <FunnelIcon weight=\"fill\" />\n              </span>\n            );\n          },\n          ...column,\n        };\n      })\n    : undefined;\n  const modifiedLocale = {\n    emptyText: <Empty description={emptyDescription} />,\n    ...locale,\n  };\n  let spinProps: SpinProps | undefined;\n  if (typeof loading === \"boolean\") {\n    spinProps = {\n      spinning: loading,\n      indicator: <span className={cls(\"spin-loader\")} />,\n    };\n  } else if (typeof loading === \"object\") {\n    spinProps = {\n      spinning: true,\n      indicator: <span className={cls(\"spin-loader\")} />,\n      ...loading,\n    };\n  }\n  const callbackRef = useCallback(\n    (tableRef: TableRef) => {\n      if (tableRef) {\n        if (typeof ref === \"function\") {\n          ref(tableRef);\n        }\n        if (ref && typeof ref === \"object\" && \"current\" in ref) {\n          ref.current = tableRef;\n        }\n        innerRef.current = tableRef;\n      }\n    },\n    [ref]\n  );\n\n  return (\n    <AntTable\n      ref={callbackRef}\n      columns={modifiedColumns}\n      loading={spinProps}\n      locale={modifiedLocale}\n      virtual={virtual}\n      scroll={{ ...scroll, ...scrollProp }}\n      className={clsx(variant === \"zebra\" ? cls(\"table-zebra\") : \"\", className)}\n      {...rest}\n    />\n  );\n};\n\nconst InternalTable = forwardRef(InnerInternalTable) as <\n  RecordType extends object = object\n>(\n  props: TableProps<RecordType> & { ref?: ForwardedRef<TableRef> }\n) => ReturnType<typeof InnerInternalTable>;\n\n// Create the final component with all static properties\nexport const Table = Object.assign(InternalTable, {\n  Column: AntTable.Column,\n  ColumnGroup: AntTable.ColumnGroup,\n  SELECTION_COLUMN: AntTable.SELECTION_COLUMN,\n  EXPAND_COLUMN: AntTable.EXPAND_COLUMN,\n  SELECTION_ALL: AntTable.SELECTION_ALL,\n  SELECTION_INVERT: AntTable.SELECTION_INVERT,\n  SELECTION_NONE: AntTable.SELECTION_NONE,\n  Summary: AntTable.Summary,\n}) as typeof InternalTable & {\n  Column: typeof AntTable.Column;\n  ColumnGroup: typeof AntTable.ColumnGroup;\n  SELECTION_COLUMN: typeof AntTable.SELECTION_COLUMN;\n  EXPAND_COLUMN: typeof AntTable.EXPAND_COLUMN;\n  SELECTION_ALL: typeof AntTable.SELECTION_ALL;\n  SELECTION_INVERT: typeof AntTable.SELECTION_INVERT;\n  SELECTION_NONE: typeof AntTable.SELECTION_NONE;\n  Summary: typeof AntTable.Summary;\n};\n"],"names":["InnerInternalTable","columns","locale","emptyDescription","loading","virtual","scrollProp","className","variant","rest","ref","cls","useCls","scroll","setScroll","useState","innerRef","useRef","tablePaginationHeight","useEffect","tableEl","_a","parentEl","thead","tpagination","mt","mb","resizeObserver","entries","entry","modifiedColumns","column","sortOrder","jsx","CaretUpIcon","CaretDownIcon","jsxs","Fragment","_filtered","FunnelIcon","modifiedLocale","Empty","spinProps","callbackRef","useCallback","tableRef","AntTable","clsx","InternalTable","forwardRef","Table"],"mappings":";;;;;;;;;AA0CA,MAAMA,IAAqB,CACzB;AAAA,EACE,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAQC,IAAa,CAAC;AAAA,EACtB,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GACAC,MACG;AACH,QAAMC,IAAMC,EAAO,GACb,CAACC,GAAQC,CAAS,IAAIC;AAAA,IAC1BV,IACI,CAAA,IACA;AAAA,MACE,GAAG;AAAA,IAAA;AAAA,EAEX,GAEMW,IAAWC,EAAiB,IAAI,GAChCC,IAAwBD,EAAe,CAAC;AAE9C,EAAAE,EAAU,MAAM;;AACd,QAAI,CAACH,EAAS,WAAW,CAACX,EAAS;AAC7B,UAAAe,KAAUC,IAAAL,EAAS,YAAT,gBAAAK,EAAkB,eAC5BC,IAAWF,KAAA,gBAAAA,EAAS;AAC1B,QAAI,CAACE,EAAU;AACf,UAAMC,IAAQH,KAAA,gBAAAA,EAAS;AAAA,MACrB,IAAIT,EAAI,aAAa,CAAC;AAAA,OAElBa,IAAcJ,KAAA,gBAAAA,EAAS;AAAA,MAC3B,IAAIT,EAAI,kBAAkB,CAAC;AAAA;AAE7B,QAAIa,GAAa;AACT,YAAAC,IAAK,iBAAiBD,CAAW,EAAE,WACnCE,IAAK,iBAAiBF,CAAW,EAAE;AACzC,MAAAN,EAAsB,UACpBM,EAAY,eAAe,SAASC,CAAE,IAAI,SAASC,CAAE;AAAA,IAAA;AAEzD,UAAMC,IAAiB,IAAI,eAAe,CAACC,MAAY;AACrD,iBAAWC,KAASD;AAClB,QAAIC,EAAM,UACEf,EAAA;AAAA,UACR,GACEQ,EAAS,gBACRC,IAAQA,KAAA,gBAAAA,EAAO,eAAe,KAC/BL,EAAsB;AAAA,QAAA,CACzB;AAAA,IAEL,CACD;AACD,WAAII,KAAYjB,KACdsB,EAAe,QAAQL,CAAQ,GAE1B,MAAM;AACX,MAAIA,KAAYjB,KACdsB,EAAe,WAAW;AAAA,IAE9B;AAAA,EAAA,GACC,CAACtB,GAASM,CAAG,CAAC;AAEjB,QAAMmB,IAAkB7B,IACpBA,EAAQ,IAAI,CAAC8B,OACJ;AAAA,IACL,UAAU,CAAC,EAAE,WAAAC,QAET,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWtB;AAAA,UACT;AAAA,UACAqB,IACI,0BAA0BA,CAAS,KACnC;AAAA,QACN;AAAA,QAEC,UAACA,IAKEA,MAAc,WACf,gBAAAC,EAAAC,GAAA,EAAY,QAAO,OAAA,CAAO,IAE3B,gBAAAD,EAACE,GAAc,EAAA,QAAO,OAAO,CAAA,IAN3B,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,UAAC,gBAAAJ,EAAAC,GAAA,EAAY,QAAO,OAAO,CAAA;AAAA,UAAG;AAAA,UAC9B,gBAAAD,EAACE,GAAc,EAAA,QAAO,OAAO,CAAA;AAAA,QAC/B,EAAA,CAAA;AAAA,MAI6B;AAAA,IAEjC;AAAA,IAGJ,YAAY,CAACG,MAET,gBAAAL,EAAC,QAAK,EAAA,WAAWtB,EAAI,0BAA0B,GAC7C,UAAC,gBAAAsB,EAAAM,GAAA,EAAW,QAAO,OAAA,CAAO,EAC5B,CAAA;AAAA,IAGJ,GAAGR;AAAA,EACL,EACD,IACD,QACES,IAAiB;AAAA,IACrB,WAAW,gBAAAP,EAACQ,GAAM,EAAA,aAAatC,EAAkB,CAAA;AAAA,IACjD,GAAGD;AAAA,EACL;AACI,MAAAwC;AACA,EAAA,OAAOtC,KAAY,YACTsC,IAAA;AAAA,IACV,UAAUtC;AAAA,IACV,WAAY,gBAAA6B,EAAA,QAAA,EAAK,WAAWtB,EAAI,aAAa,EAAG,CAAA;AAAA,EAClD,IACS,OAAOP,KAAY,aAChBsC,IAAA;AAAA,IACV,UAAU;AAAA,IACV,WAAY,gBAAAT,EAAA,QAAA,EAAK,WAAWtB,EAAI,aAAa,GAAG;AAAA,IAChD,GAAGP;AAAA,EACL;AAEF,QAAMuC,IAAcC;AAAA,IAClB,CAACC,MAAuB;AACtB,MAAIA,MACE,OAAOnC,KAAQ,cACjBA,EAAImC,CAAQ,GAEVnC,KAAO,OAAOA,KAAQ,YAAY,aAAaA,MACjDA,EAAI,UAAUmC,IAEhB7B,EAAS,UAAU6B;AAAA,IAEvB;AAAA,IACA,CAACnC,CAAG;AAAA,EACN;AAGE,SAAA,gBAAAuB;AAAA,IAACa;AAAA,IAAA;AAAA,MACC,KAAKH;AAAA,MACL,SAASb;AAAA,MACT,SAASY;AAAA,MACT,QAAQF;AAAA,MACR,SAAAnC;AAAA,MACA,QAAQ,EAAE,GAAGQ,GAAQ,GAAGP,EAAW;AAAA,MACnC,WAAWyC,EAAKvC,MAAY,UAAUG,EAAI,aAAa,IAAI,IAAIJ,CAAS;AAAA,MACvE,GAAGE;AAAA,IAAA;AAAA,EACN;AAEJ,GAEMuC,IAAgBC,EAAWjD,CAAkB,GAOtCkD,IAAQ,OAAO,OAAOF,GAAe;AAAA,EAChD,QAAQF,EAAS;AAAA,EACjB,aAAaA,EAAS;AAAA,EACtB,kBAAkBA,EAAS;AAAA,EAC3B,eAAeA,EAAS;AAAA,EACxB,eAAeA,EAAS;AAAA,EACxB,kBAAkBA,EAAS;AAAA,EAC3B,gBAAgBA,EAAS;AAAA,EACzB,SAASA,EAAS;AACpB,CAAC;"}