@expcat/tigercat-react 1.2.47 → 1.2.52

package/dist/{chunk-UVWLYRAC.js → chunk-I373B74W.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkPR3PQUKMjs = require('./chunk-PR3PQUKM.js');
+var _chunkZZAR4IDSjs = require('./chunk-ZZAR4IDS.js');
 
 
 var _chunk3MRP3XYIjs = require('./chunk-3MRP3XYI.js');
@@ -9,13 +9,13 @@ var _chunk3MRP3XYIjs = require('./chunk-3MRP3XYI.js');
 var _chunkQYYAXM5Fjs = require('./chunk-QYYAXM5F.js');
 
 
-var _chunkVCULFIZ5js = require('./chunk-VCULFIZ5.js');
+var _chunkZJI2VLILjs = require('./chunk-ZJI2VLIL.js');
 
 
 var _chunkUF3DXKCIjs = require('./chunk-UF3DXKCI.js');
 
 
-var _chunkUIO6O4MIjs = require('./chunk-UIO6O4MI.js');
+var _chunkFQO7BKXWjs = require('./chunk-FQO7BKXW.js');
 
 
 var _chunk4MQCUKICjs = require('./chunk-4MQCUKIC.js');
@@ -105,7 +105,7 @@ var ActivityFeed = ({
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.activityItemTitleGroupClasses, children: [
             titleText ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkUF3DXKCIjs.Text, { tag: "div", size: "sm", weight: "semibold", className: "text-gray-900 dark:text-gray-100 hover:text-blue-600 dark:hover:text-blue-400 transition-colors cursor-pointer truncate", children: titleText }) : null,
             item.status ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkVCULFIZ5js.Tag,
+              _chunkZJI2VLILjs.Tag,
               {
                 variant: _nullishCoalesce(item.status.variant, () => ( "default")),
                 size: "sm",
@@ -141,7 +141,7 @@ var ActivityFeed = ({
         ...props,
         "data-tiger-activity-feed": true,
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkUIO6O4MIjs.Card,
+          _chunkFQO7BKXWjs.Card,
           {
             variant: "bordered",
             size: "sm",
@@ -162,7 +162,7 @@ var ActivityFeed = ({
         ...props,
         "data-tiger-activity-feed": true,
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkUIO6O4MIjs.Card,
+          _chunkFQO7BKXWjs.Card,
           {
             variant: "bordered",
             size: "sm",
@@ -194,7 +194,7 @@ var ActivityFeed = ({
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkUF3DXKCIjs.Text, { tag: "span", size: "sm", weight: "bold", className: "text-gray-900 dark:text-gray-100 uppercase tracking-wider", children: groupTitle })
           ] }))) : null,
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunkPR3PQUKMjs.Timeline,
+            _chunkZZAR4IDSjs.Timeline,
             {
               items: timelineItems,
               style: {

package/dist/{chunk-NF3OF7S5.mjs → chunk-IGAMV6ML.mjs}

@@ -1,6 +1,6 @@
 import {
   useFormContext
-} from "./chunk-Y5E4XH6H.mjs";
+} from "./chunk-F6IXIH6B.mjs";
 
 // src/components/FormItem.tsx
 import React, { useMemo, useEffect, useState, useCallback, useId, useRef } from "react";

package/dist/{chunk-P6E3DILH.mjs → chunk-IXV5YBCZ.mjs}

@@ -3,7 +3,7 @@ import React from "react";
 import {
   classNames,
   getCardClasses,
-  cardSizeClasses,
+  resolveCardPadding,
   cardHeaderClasses,
   cardFooterClasses,
   cardCoverWrapperClasses,
@@ -21,6 +21,7 @@ var Card = React.memo(
     hoverable = false,
     cover,
     coverAlt = "Card cover image",
+    padding,
     header,
     footer,
     actions,
@@ -29,11 +30,12 @@ var Card = React.memo(
     ...props
   }) => {
     const isHorizontal = direction === "horizontal";
-    const sectionSizeClass = cover ? cardSizeClasses[size] : void 0;
+    const paddingClass = resolveCardPadding(size, padding);
+    const sectionSizeClass = cover ? paddingClass : void 0;
     const cardClasses = classNames(
       getCardClasses(variant, hoverable),
       cardDirectionClasses[direction],
-      !cover && cardSizeClasses[size],
+      !cover && paddingClass,
       className
     );
     const getSectionClasses = (baseClasses) => classNames(baseClasses, sectionSizeClass);

package/dist/{chunk-AE2QE2C6.js → chunk-JJUJRILK.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkJLQBG5XUjs = require('./chunk-JLQBG5XU.js');
+var _chunkAKUAI5FGjs = require('./chunk-AKUAI5FG.js');
 
 // src/components/DropdownItem.tsx
 var _react = require('react');
@@ -17,7 +17,7 @@ var DropdownItem = ({
   children,
   ...buttonProps
 }) => {
-  const context = _react.useContext.call(void 0, _chunkJLQBG5XUjs.DropdownContext);
+  const context = _react.useContext.call(void 0, _chunkAKUAI5FGjs.DropdownContext);
   const handleClick = (event) => {
     if (disabled) {
       event.preventDefault();

package/dist/{chunk-7E24KEVK.mjs → chunk-KGSDDVRC.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-QAIBQHIO.mjs";
 import {
   Button
-} from "./chunk-USWK2S3Y.mjs";
+} from "./chunk-5TE7KLE5.mjs";
 
 // src/components/FormWizard.tsx
 import { useCallback, useEffect, useMemo, useState } from "react";

package/dist/{chunk-PKWHSCFK.mjs → chunk-L5AMVEQL.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-A42OLED6.mjs";
 import {
   Button
-} from "./chunk-USWK2S3Y.mjs";
+} from "./chunk-5TE7KLE5.mjs";
 import {
   Loading
 } from "./chunk-FNJDBFKM.mjs";
@@ -16,7 +16,7 @@ import {
 } from "./chunk-HLS4CHWX.mjs";
 import {
   Card
-} from "./chunk-P6E3DILH.mjs";
+} from "./chunk-IXV5YBCZ.mjs";
 
 // src/components/NotificationCenter.tsx
 import { useMemo, useEffect, useState, useCallback } from "react";

package/dist/{chunk-BCQQYERG.js → chunk-N4PP3ENO.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkUPPHGL64js = require('./chunk-UPPHGL64.js');
+var _chunkCY5GRTAXjs = require('./chunk-CY5GRTAX.js');
 
 // src/components/FormItem.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
@@ -43,7 +43,7 @@ var FormItem = ({
   className,
   condition
 }) => {
-  const formContext = _chunkUPPHGL64js.useFormContext.call(void 0, );
+  const formContext = _chunkCY5GRTAXjs.useFormContext.call(void 0, );
   const [errorMessage, setErrorMessage] = _react.useState.call(void 0, "");
   const [shakeTrigger, setShakeTrigger] = _react.useState.call(void 0, 0);
   const prevFormErrorRef = _react.useRef.call(void 0, "");

package/dist/{chunk-56DP32W7.mjs → chunk-NVEIVIAW.mjs}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-7QZ4XT2P.mjs";
 import {
   Button
-} from "./chunk-USWK2S3Y.mjs";
+} from "./chunk-5TE7KLE5.mjs";
 import {
   Tag
-} from "./chunk-TGKNEMD4.mjs";
+} from "./chunk-WMPCN7OF.mjs";
 import {
   Text
 } from "./chunk-HLS4CHWX.mjs";

package/dist/{chunk-KVZE7UGH.mjs → chunk-OEZ3CSEM.mjs}

@@ -1,6 +1,6 @@
 import {
   Table
-} from "./chunk-AGHGG73I.mjs";
+} from "./chunk-DLJZMMD7.mjs";
 import {
   Select
 } from "./chunk-T4OVGM4X.mjs";
@@ -18,7 +18,7 @@ import {
 } from "./chunk-MSHCPJIJ.mjs";
 import {
   Button
-} from "./chunk-USWK2S3Y.mjs";
+} from "./chunk-5TE7KLE5.mjs";
 
 // src/components/DataTableWithToolbar.tsx
 import { useEffect, useMemo, useRef, useState } from "react";
@@ -30,7 +30,7 @@ import {
   mergeTigerLocale,
   resolveTigerLocale
 } from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var DataTableWithToolbar = ({
   toolbar,
   locale,
@@ -266,6 +266,20 @@ var DataTableWithToolbar = ({
     );
   };
   const renderToolbar = () => {
+    if (toolbar?.render !== void 0) {
+      const toolbarContext = {
+        searchValue: searchValue ?? "",
+        setSearch: handleSearchChange,
+        submitSearch: handleSearchSubmit,
+        filters: resolvedFilters,
+        setFilter: (key, value) => setFilterValue(key, value),
+        selectedKeys,
+        selectedCount,
+        hiddenColumnKeys: resolvedHiddenKeys,
+        setHiddenColumnKeys: handleHiddenColumnsChange
+      };
+      return /* @__PURE__ */ jsx(Fragment, { children: typeof toolbar.render === "function" ? toolbar.render(toolbarContext) : toolbar.render });
+    }
     if (!hasSearch && !hasFilters && !hasFiltersExtra && !hasBulkActions && !hasColumnSettings) {
       return null;
     }
@@ -279,75 +293,95 @@ var DataTableWithToolbar = ({
       {
         className: classNames(
           "tiger-data-table-toolbar flex flex-wrap items-center gap-3",
-          bordered ? "bg-[var(--tiger-surface-muted,#f9fafb)] dark:bg-gray-800/10 px-4 py-3.5 border-b border-[var(--tiger-border,#e5e7eb)]" : "bg-[var(--tiger-surface-muted,#f9fafb)]/80 dark:bg-gray-800/30 px-4 py-3.5 border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] shadow-sm"
+          bordered ? "bg-[var(--tiger-surface-muted,#f9fafb)] dark:bg-gray-800/10 px-4 py-3.5 border-b border-[var(--tiger-border,#e5e7eb)]" : "bg-[var(--tiger-surface-muted,#f9fafb)]/80 dark:bg-gray-800/30 px-4 py-3.5 border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] shadow-sm",
+          toolbar?.className
         ),
+        style: toolbar?.style,
         role: "toolbar",
         "aria-label": tableLabels.toolbarAriaLabel,
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 flex-wrap flex-1 min-w-0", children: [
-            hasSearch ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 w-full sm:w-auto sm:min-w-[220px] sm:max-w-[320px]", children: [
-              /* @__PURE__ */ jsx(
-                Input,
-                {
-                  type: "search",
-                  size: "sm",
-                  value: searchValue,
-                  placeholder: toolbar?.searchPlaceholder ?? tableLabels.searchPlaceholder,
-                  prefix: /* @__PURE__ */ jsx(
-                    "svg",
+            hasSearch ? /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: classNames(
+                  "flex items-center gap-2",
+                  toolbar?.searchClassName ?? "w-full sm:w-auto sm:min-w-[220px] sm:max-w-[320px]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    Input,
                     {
-                      className: "w-3.5 h-3.5 text-[var(--tiger-text-secondary,#6b7280)] shrink-0",
-                      fill: "none",
-                      stroke: "currentColor",
-                      strokeWidth: "2",
-                      viewBox: "0 0 24 24",
-                      "aria-hidden": "true",
-                      children: /* @__PURE__ */ jsx(
-                        "path",
+                      type: "search",
+                      size: "sm",
+                      value: searchValue,
+                      placeholder: toolbar?.searchPlaceholder ?? tableLabels.searchPlaceholder,
+                      prefix: /* @__PURE__ */ jsx(
+                        "svg",
                         {
-                          strokeLinecap: "round",
-                          strokeLinejoin: "round",
-                          d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+                          className: "w-3.5 h-3.5 text-[var(--tiger-text-secondary,#6b7280)] shrink-0",
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: "2",
+                          viewBox: "0 0 24 24",
+                          "aria-hidden": "true",
+                          children: /* @__PURE__ */ jsx(
+                            "path",
+                            {
+                              strokeLinecap: "round",
+                              strokeLinejoin: "round",
+                              d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+                            }
+                          )
+                        }
+                      ),
+                      onChange: (event) => handleSearchChange(String(event.currentTarget.value)),
+                      onKeyDown: (event) => {
+                        if (event.key === "Enter") {
+                          handleSearchSubmit();
                         }
-                      )
+                      }
                     }
                   ),
-                  onChange: (event) => handleSearchChange(String(event.currentTarget.value)),
-                  onKeyDown: (event) => {
-                    if (event.key === "Enter") {
-                      handleSearchSubmit();
+                  toolbar?.showSearchButton ?? true ? /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      size: "sm",
+                      variant: "primary",
+                      className: "whitespace-nowrap shrink-0 rounded-[var(--tiger-radius-md,0.5rem)] px-3",
+                      onClick: handleSearchSubmit,
+                      disabled: !onSearch && !toolbar?.onSearch,
+                      children: toolbar?.searchButtonText ?? tableLabels.searchButtonText
                     }
-                  }
-                }
-              ),
-              toolbar?.showSearchButton ?? true ? /* @__PURE__ */ jsx(
-                Button,
-                {
-                  size: "sm",
-                  variant: "primary",
-                  className: "whitespace-nowrap shrink-0 rounded-[var(--tiger-radius-md,0.5rem)] px-3",
-                  onClick: handleSearchSubmit,
-                  disabled: !onSearch && !toolbar?.onSearch,
-                  children: toolbar?.searchButtonText ?? tableLabels.searchButtonText
-                }
-              ) : null
-            ] }) : null,
+                  ) : null
+                ]
+              }
+            ) : null,
             hasFilters ? toolbar?.filters?.map((filter) => {
               const currentValue = resolvedFilters[filter.key];
               const clearable = filter.clearable !== false;
               if (filter.render) {
-                return /* @__PURE__ */ jsx("div", { className: "w-full sm:w-auto", children: filter.render({
-                  filter,
-                  value: currentValue,
-                  filters: resolvedFilters,
-                  setValue: (value) => setFilterValue(filter.key, value, filter),
-                  setFilter: (key, value) => setFilterValue(key, value)
-                }) }, filter.key);
+                return /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: filter.itemClass ?? "w-full sm:w-auto",
+                    style: filter.itemStyle,
+                    children: filter.render({
+                      filter,
+                      value: currentValue,
+                      filters: resolvedFilters,
+                      setValue: (value) => setFilterValue(filter.key, value, filter),
+                      setFilter: (key, value) => setFilterValue(key, value)
+                    })
+                  },
+                  filter.key
+                );
               }
               return /* @__PURE__ */ jsx(
                 "div",
                 {
-                  className: "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]",
+                  className: filter.itemClass ?? "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]",
+                  style: filter.itemStyle,
                   children: /* @__PURE__ */ jsx(
                     Select,
                     {

package/dist/{chunk-IFVIPIAA.js → chunk-OREZJC6O.js}

@@ -996,6 +996,9 @@ function Table({
   cardClassName,
   renderCard,
   cardLayout,
+  cardSelectionPosition = "controls-row",
+  cardPadding,
+  cardFieldGap = "gap-3",
   // v0.6.0 props
   virtual = false,
   autoVirtual = true,
@@ -1291,7 +1294,7 @@ function Table({
                   }
                 }
               ) }) : null,
-              ctx.paginatedData.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardClasses, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZRHDNGWOjs.Empty, { showImage: false, description: tableLabels.emptyText }) }) : ctx.paginatedData.map((record, index) => {
+              ctx.paginatedData.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.getTableResponsiveCardClasses.call(void 0, cardPadding), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZRHDNGWOjs.Empty, { showImage: false, description: tableLabels.emptyText }) }) : ctx.paginatedData.map((record, index) => {
                 const key = ctx.pageRowKeys[index];
                 const isExpanded = ctx.expandedRowKeySet.has(key);
                 const isSelected = ctx.selectedRowKeySet.has(key);
@@ -1309,54 +1312,57 @@ function Table({
                 };
                 const customCard = _optionalChain([renderCard, 'optionalCall', _72 => _72(renderContext)]);
                 const resolvedCardClassName = typeof cardClassName === "function" ? cardClassName(record, index) : cardClassName;
+                const controlsNode = _optionalChain([internalRowSelection, 'optionalAccess', _73 => _73.showCheckbox]) !== false && internalRowSelection || internalExpandable && isRowExpandable ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+                  internalRowSelection && internalRowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { onClick: (event) => event.stopPropagation(), children: internalRowSelection.type === "radio" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    _chunkTMON4MPOjs.Radio,
+                    {
+                      value: key,
+                      checked: isSelected,
+                      disabled: _optionalChain([internalRowSelection, 'access', _74 => _74.getCheckboxProps, 'optionalCall', _75 => _75(record), 'optionalAccess', _76 => _76.disabled]),
+                      "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
+                        tableLabels.selectRowAriaLabel,
+                        index + 1,
+                        _optionalChain([tableLocale, 'optionalAccess', _77 => _77.locale])
+                      ),
+                      onChange: () => ctx.handleSelectRow(key, true)
+                    }
+                  ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    _chunkF7H4ALKNjs.Checkbox,
+                    {
+                      size: "sm",
+                      checked: isSelected,
+                      disabled: _optionalChain([internalRowSelection, 'access', _78 => _78.getCheckboxProps, 'optionalCall', _79 => _79(record), 'optionalAccess', _80 => _80.disabled]),
+                      "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
+                        tableLabels.selectRowAriaLabel,
+                        index + 1,
+                        _optionalChain([tableLocale, 'optionalAccess', _81 => _81.locale])
+                      ),
+                      onChange: (checked) => ctx.handleSelectRow(key, checked)
+                    }
+                  ) }),
+                  internalExpandable && isRowExpandable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                    "button",
+                    {
+                      type: "button",
+                      className: "text-sm text-[var(--tiger-primary,#2563eb)]",
+                      "aria-expanded": isExpanded,
+                      onClick: (event) => {
+                        event.stopPropagation();
+                        ctx.handleToggleExpand(key, record);
+                      },
+                      children: isExpanded ? tableLabels.collapseText : tableLabels.expandText
+                    }
+                  )
+                ] }) : null;
                 return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                   "div",
                   {
-                    className: _tigercatcore.classNames.call(void 0, _tigercatcore.tableResponsiveCardClasses, resolvedCardClassName),
+                    className: _tigercatcore.classNames.call(void 0, 
+                      _tigercatcore.getTableResponsiveCardClasses.call(void 0, cardPadding),
+                      resolvedCardClassName
+                    ),
                     onClick: () => ctx.handleRowClick(record, index, key),
                     children: customCard !== void 0 && customCard !== null ? customCard : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-                      _optionalChain([internalRowSelection, 'optionalAccess', _73 => _73.showCheckbox]) !== false && internalRowSelection || internalExpandable && isRowExpandable ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-2 flex items-center gap-3", children: [
-                        internalRowSelection && internalRowSelection.showCheckbox !== false && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { onClick: (event) => event.stopPropagation(), children: internalRowSelection.type === "radio" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                          _chunkTMON4MPOjs.Radio,
-                          {
-                            value: key,
-                            checked: isSelected,
-                            disabled: _optionalChain([internalRowSelection, 'access', _74 => _74.getCheckboxProps, 'optionalCall', _75 => _75(record), 'optionalAccess', _76 => _76.disabled]),
-                            "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
-                              tableLabels.selectRowAriaLabel,
-                              index + 1,
-                              _optionalChain([tableLocale, 'optionalAccess', _77 => _77.locale])
-                            ),
-                            onChange: () => ctx.handleSelectRow(key, true)
-                          }
-                        ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                          _chunkF7H4ALKNjs.Checkbox,
-                          {
-                            size: "sm",
-                            checked: isSelected,
-                            disabled: _optionalChain([internalRowSelection, 'access', _78 => _78.getCheckboxProps, 'optionalCall', _79 => _79(record), 'optionalAccess', _80 => _80.disabled]),
-                            "aria-label": _tigercatcore.formatTableSelectRowAriaLabel.call(void 0, 
-                              tableLabels.selectRowAriaLabel,
-                              index + 1,
-                              _optionalChain([tableLocale, 'optionalAccess', _81 => _81.locale])
-                            ),
-                            onChange: (checked) => ctx.handleSelectRow(key, checked)
-                          }
-                        ) }),
-                        internalExpandable && isRowExpandable && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                          "button",
-                          {
-                            type: "button",
-                            className: "text-sm text-[var(--tiger-primary,#2563eb)]",
-                            "aria-expanded": isExpanded,
-                            onClick: (event) => {
-                              event.stopPropagation();
-                              ctx.handleToggleExpand(key, record);
-                            },
-                            children: isExpanded ? tableLabels.collapseText : tableLabels.expandText
-                          }
-                        )
-                      ] }) : null,
                       (() => {
                         const { titleColumn, bodyColumns } = _tigercatcore.getCardColumns.call(void 0, ctx.displayColumns);
                         const renderCellContent = (column) => {
@@ -1365,29 +1371,99 @@ function Table({
                         };
                         if (hasCustomCardLayout) {
                           return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-                            titleColumn && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardTitleClasses, children: renderCellContent(titleColumn) }),
-                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grid grid-cols-12 gap-3 mt-2", children: bodyColumns.map((column) => {
+                            titleColumn && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                              "div",
+                              {
+                                className: _tigercatcore.classNames.call(void 0, 
+                                  _tigercatcore.tableResponsiveCardTitleClasses,
+                                  cardSelectionPosition === "title-inline" && controlsNode && "flex items-center gap-3"
+                                ),
+                                children: [
+                                  cardSelectionPosition === "title-inline" && controlsNode,
+                                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "min-w-0 flex-1", children: renderCellContent(titleColumn) })
+                                ]
+                              }
+                            ),
+                            (!titleColumn || cardSelectionPosition !== "title-inline") && controlsNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mb-2 flex items-center gap-3", children: controlsNode }),
+                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.classNames.call(void 0, "grid grid-cols-12 mt-2", cardFieldGap), children: bodyColumns.map((column) => {
                               const layoutItem = cardLayoutMap.get(column.key);
                               const gridInfo = _tigercatcore.getCardGridInfo.call(void 0, column, layoutItem);
                               if (gridInfo.hideLabel) {
-                                return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: gridInfo.className, children: renderCellContent(column) }, column.key);
+                                return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                                  "div",
+                                  {
+                                    className: _tigercatcore.classNames.call(void 0, 
+                                      gridInfo.className,
+                                      gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
+                                    ),
+                                    children: renderCellContent(column)
+                                  },
+                                  column.key
+                                );
                               }
                               if (gridInfo.labelPosition === "top") {
-                                return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: gridInfo.className, children: [
-                                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] mb-1", children: column.title }),
-                                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words", children: renderCellContent(column) })
-                                ] }, column.key);
+                                return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                                  "div",
+                                  {
+                                    className: _tigercatcore.classNames.call(void 0, 
+                                      gridInfo.className,
+                                      gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
+                                    ),
+                                    children: [
+                                      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                                        "div",
+                                        {
+                                          className: _tigercatcore.classNames.call(void 0, 
+                                            "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] mb-1",
+                                            gridInfo.labelClassName
+                                          ),
+                                          children: column.title
+                                        }
+                                      ),
+                                      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                                        "div",
+                                        {
+                                          className: _tigercatcore.classNames.call(void 0, 
+                                            "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words",
+                                            gridInfo.valueClassName
+                                          ),
+                                          children: renderCellContent(column)
+                                        }
+                                      )
+                                    ]
+                                  },
+                                  column.key
+                                );
                               }
                               return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
                                 "div",
                                 {
                                   className: _tigercatcore.classNames.call(void 0, 
                                     gridInfo.className,
-                                    "grid grid-cols-[auto_1fr] gap-2 items-baseline"
+                                    "grid grid-cols-[auto_1fr] gap-2 items-baseline",
+                                    gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
                                   ),
                                   children: [
-                                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] shrink-0", children: column.title }),
-                                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words", children: renderCellContent(column) })
+                                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                                      "div",
+                                      {
+                                        className: _tigercatcore.classNames.call(void 0, 
+                                          "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] shrink-0",
+                                          gridInfo.labelClassName
+                                        ),
+                                        children: column.title
+                                      }
+                                    ),
+                                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                                      "div",
+                                      {
+                                        className: _tigercatcore.classNames.call(void 0, 
+                                          "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words",
+                                          gridInfo.valueClassName
+                                        ),
+                                        children: renderCellContent(column)
+                                      }
+                                    )
                                   ]
                                 },
                                 column.key
@@ -1396,7 +1472,20 @@ function Table({
                           ] });
                         }
                         return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-                          titleColumn && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardTitleClasses, children: renderCellContent(titleColumn) }),
+                          titleColumn && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                            "div",
+                            {
+                              className: _tigercatcore.classNames.call(void 0, 
+                                _tigercatcore.tableResponsiveCardTitleClasses,
+                                cardSelectionPosition === "title-inline" && controlsNode && "flex items-center gap-3"
+                              ),
+                              children: [
+                                cardSelectionPosition === "title-inline" && controlsNode,
+                                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "min-w-0 flex-1", children: renderCellContent(titleColumn) })
+                              ]
+                            }
+                          ),
+                          (!titleColumn || cardSelectionPosition !== "title-inline") && controlsNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mb-2 flex items-center gap-3", children: controlsNode }),
                           bodyColumns.map((column) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardRowClasses, children: [
                             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardLabelClasses, children: column.title }),
                             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _tigercatcore.tableResponsiveCardValueClasses, children: renderCellContent(column) })