design-zystem 1.0.436 → 1.0.437

package/dist/ui/index.d.mts

@@ -954,6 +954,7 @@ interface TableGroupBandProps extends TableGroupLabelProps {
 
 interface TableSectionRowProps extends TableGroupBandProps {
     endContent?: ReactNode;
+    onBandClick?: () => void;
 }
 declare const TableSectionRow: (props: TableSectionRowProps) => react.JSX.Element;
 

package/dist/ui/index.d.ts

@@ -954,6 +954,7 @@ interface TableGroupBandProps extends TableGroupLabelProps {
 
 interface TableSectionRowProps extends TableGroupBandProps {
     endContent?: ReactNode;
+    onBandClick?: () => void;
 }
 declare const TableSectionRow: (props: TableSectionRowProps) => react.JSX.Element;
 

package/dist/ui/index.js

@@ -4385,6 +4385,15 @@ var TableFooterCell = ({
   }
 );
 
+// src/ui/components/ui/table/activateFromKeyboard.ts
+var ACTIVATION_KEYS = ["Enter", " "];
+var activateFromKeyboard = (activate) => (event) => {
+  if (event.target !== event.currentTarget) return;
+  if (!ACTIVATION_KEYS.includes(event.key)) return;
+  event.preventDefault();
+  activate();
+};
+
 // src/ui/components/ui/table/TableGroupLabel.tsx
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var TableGroupLabel = ({
@@ -4420,31 +4429,38 @@ var TableGroupLabel = ({
 
 // src/ui/components/ui/table/TableGroupBand.tsx
 var import_jsx_runtime54 = require("react/jsx-runtime");
-var isFromControl = (event) => event.target.closest("button, a, input") !== null;
+var isFromControl = (event) => event.target.closest(
+  'button, a, input, select, textarea, label, [role="button"]'
+) !== null;
 var TableGroupBand = (_a) => {
   var _b = _a, {
     colSpan,
     canCollapseFromBand = false,
+    onBandClick,
     endContent,
     className
   } = _b, label = __objRest(_b, [
     "colSpan",
     "canCollapseFromBand",
+    "onBandClick",
     "endContent",
     "className"
   ]);
   const { onToggleCollapse } = label;
-  const isBandCollapsible = canCollapseFromBand && onToggleCollapse;
-  const collapseFromBand = (event) => {
+  const collapseFromBand = canCollapseFromBand ? onToggleCollapse : void 0;
+  const bandAction = onBandClick != null ? onBandClick : collapseFromBand;
+  const runBandAction = (event) => {
     if (isFromControl(event)) return;
-    onToggleCollapse == null ? void 0 : onToggleCollapse();
+    bandAction == null ? void 0 : bandAction();
   };
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     "td",
     {
       colSpan,
-      onClick: isBandCollapsible ? collapseFromBand : void 0,
-      className: cn(className, isBandCollapsible && "cursor-pointer"),
+      onClick: bandAction && runBandAction,
+      onKeyDown: onBandClick && activateFromKeyboard(onBandClick),
+      tabIndex: onBandClick ? 0 : void 0,
+      className: cn(className, bandAction && "cursor-pointer"),
       children: endContent ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Layout, { row: true, gap: 2, align: "center", justify: "between", children: [
         /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(TableGroupLabel, __spreadValues({}, label)),
         endContent
@@ -4517,31 +4533,22 @@ var TableAlertRow = ({
 
 // src/ui/components/ui/table/TableExpandedRow.tsx
 var import_jsx_runtime58 = require("react/jsx-runtime");
-var ACTIVATION_KEYS = ["Enter", " "];
 var TableExpandedRow = ({
   children,
   onClick
-}) => {
-  const activateFromKeyboard = (event) => {
-    if (event.target !== event.currentTarget) return;
-    if (!ACTIVATION_KEYS.includes(event.key)) return;
-    event.preventDefault();
-    onClick == null ? void 0 : onClick();
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
-    "tr",
-    {
-      onClick,
-      onKeyDown: onClick && activateFromKeyboard,
-      tabIndex: onClick ? 0 : void 0,
-      className: cn(
-        "animate-[fade-in_150ms_ease-out] bg-grey-100 transition-colors hover:bg-grey-100",
-        onClick && "cursor-pointer"
-      ),
-      children
-    }
-  );
-};
+}) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  "tr",
+  {
+    onClick,
+    onKeyDown: onClick && activateFromKeyboard(onClick),
+    tabIndex: onClick ? 0 : void 0,
+    className: cn(
+      "animate-[fade-in_150ms_ease-out] bg-grey-100 transition-colors hover:bg-grey-100",
+      onClick && "cursor-pointer"
+    ),
+    children
+  }
+);
 
 // src/utils/string/capitalizeFirstLetter.ts
 var capitalizeFirstLetter = (str) => {

package/dist/ui/index.mjs

@@ -4181,6 +4181,15 @@ var TableFooterCell = ({
   }
 );
 
+// src/ui/components/ui/table/activateFromKeyboard.ts
+var ACTIVATION_KEYS = ["Enter", " "];
+var activateFromKeyboard = (activate) => (event) => {
+  if (event.target !== event.currentTarget) return;
+  if (!ACTIVATION_KEYS.includes(event.key)) return;
+  event.preventDefault();
+  activate();
+};
+
 // src/ui/components/ui/table/TableGroupLabel.tsx
 import { jsx as jsx53, jsxs as jsxs26 } from "react/jsx-runtime";
 var TableGroupLabel = ({
@@ -4216,31 +4225,38 @@ var TableGroupLabel = ({
 
 // src/ui/components/ui/table/TableGroupBand.tsx
 import { jsx as jsx54, jsxs as jsxs27 } from "react/jsx-runtime";
-var isFromControl = (event) => event.target.closest("button, a, input") !== null;
+var isFromControl = (event) => event.target.closest(
+  'button, a, input, select, textarea, label, [role="button"]'
+) !== null;
 var TableGroupBand = (_a) => {
   var _b = _a, {
     colSpan,
     canCollapseFromBand = false,
+    onBandClick,
     endContent,
     className
   } = _b, label = __objRest(_b, [
     "colSpan",
     "canCollapseFromBand",
+    "onBandClick",
     "endContent",
     "className"
   ]);
   const { onToggleCollapse } = label;
-  const isBandCollapsible = canCollapseFromBand && onToggleCollapse;
-  const collapseFromBand = (event) => {
+  const collapseFromBand = canCollapseFromBand ? onToggleCollapse : void 0;
+  const bandAction = onBandClick != null ? onBandClick : collapseFromBand;
+  const runBandAction = (event) => {
     if (isFromControl(event)) return;
-    onToggleCollapse == null ? void 0 : onToggleCollapse();
+    bandAction == null ? void 0 : bandAction();
   };
   return /* @__PURE__ */ jsx54(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ jsx54(
     "td",
     {
       colSpan,
-      onClick: isBandCollapsible ? collapseFromBand : void 0,
-      className: cn(className, isBandCollapsible && "cursor-pointer"),
+      onClick: bandAction && runBandAction,
+      onKeyDown: onBandClick && activateFromKeyboard(onBandClick),
+      tabIndex: onBandClick ? 0 : void 0,
+      className: cn(className, bandAction && "cursor-pointer"),
       children: endContent ? /* @__PURE__ */ jsxs27(Layout, { row: true, gap: 2, align: "center", justify: "between", children: [
         /* @__PURE__ */ jsx54(TableGroupLabel, __spreadValues({}, label)),
         endContent
@@ -4313,31 +4329,22 @@ var TableAlertRow = ({
 
 // src/ui/components/ui/table/TableExpandedRow.tsx
 import { jsx as jsx58 } from "react/jsx-runtime";
-var ACTIVATION_KEYS = ["Enter", " "];
 var TableExpandedRow = ({
   children,
   onClick
-}) => {
-  const activateFromKeyboard = (event) => {
-    if (event.target !== event.currentTarget) return;
-    if (!ACTIVATION_KEYS.includes(event.key)) return;
-    event.preventDefault();
-    onClick == null ? void 0 : onClick();
-  };
-  return /* @__PURE__ */ jsx58(
-    "tr",
-    {
-      onClick,
-      onKeyDown: onClick && activateFromKeyboard,
-      tabIndex: onClick ? 0 : void 0,
-      className: cn(
-        "animate-[fade-in_150ms_ease-out] bg-grey-100 transition-colors hover:bg-grey-100",
-        onClick && "cursor-pointer"
-      ),
-      children
-    }
-  );
-};
+}) => /* @__PURE__ */ jsx58(
+  "tr",
+  {
+    onClick,
+    onKeyDown: onClick && activateFromKeyboard(onClick),
+    tabIndex: onClick ? 0 : void 0,
+    className: cn(
+      "animate-[fade-in_150ms_ease-out] bg-grey-100 transition-colors hover:bg-grey-100",
+      onClick && "cursor-pointer"
+    ),
+    children
+  }
+);
 
 // src/utils/string/capitalizeFirstLetter.ts
 var capitalizeFirstLetter = (str) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "design-zystem",
-  "version": "1.0.436",
+  "version": "1.0.437",
   "description": "A React design system of importable components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",