@wordpress/dataviews 13.1.1-next.v.202603161435.0 → 14.1.0

package/build/components/dataform-layouts/card/index.cjs

@@ -33,10 +33,8 @@ __export(card_exports, {
   default: () => FormCardField
 });
 module.exports = __toCommonJS(card_exports);
-var import_components = require("@wordpress/components");
-var import_compose = require("@wordpress/compose");
 var import_element = require("@wordpress/element");
-var import_icons = require("@wordpress/icons");
+var import_ui = require("@wordpress/ui");
 var import__ = require("../index.cjs");
 var import_dataform_context = __toESM(require("../../dataform-context/index.cjs"));
 var import_data_form_layout = require("../data-form-layout.cjs");
@@ -70,6 +68,84 @@ function isSummaryFieldVisible(summaryField, summaryConfig, isOpen) {
   }
   return true;
 }
+function HeaderContent({
+  data,
+  fields,
+  label,
+  layout,
+  isOpen,
+  touched,
+  validity
+}) {
+  const summaryFields = (0, import_get_summary_fields.getSummaryFields)(layout.summary, fields);
+  const visibleSummaryFields = summaryFields.filter(
+    (summaryField) => isSummaryFieldVisible(summaryField, layout.summary, isOpen)
+  );
+  const hasBadge = touched && layout.isCollapsible;
+  const hasSummary = visibleSummaryFields.length > 0 && layout.withHeader;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_ui.Stack,
+    {
+      align: "center",
+      justify: "space-between",
+      className: "dataforms-layouts-card__field-header-content",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Card.Title, { children: label }),
+        (hasBadge || hasSummary) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.CollapsibleCard.HeaderDescription, { className: "dataforms-layouts-card__field-header-content-description", children: [
+          hasBadge && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_validation_badge.default, { validity }),
+          hasSummary && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataforms-layouts-card__field-summary", children: visibleSummaryFields.map((summaryField) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            summaryField.render,
+            {
+              item: data,
+              field: summaryField
+            },
+            summaryField.id
+          )) })
+        ] })
+      ]
+    }
+  );
+}
+function BodyContent({
+  data,
+  field,
+  form,
+  onChange,
+  hideLabelFromVision,
+  markWhenOptional,
+  validity,
+  withHeader
+}) {
+  if (field.children) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      field.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataforms-layouts-card__field-description", children: field.description }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_data_form_layout.DataFormLayout,
+        {
+          data,
+          form,
+          onChange,
+          validity: validity?.children
+        }
+      )
+    ] });
+  }
+  const SingleFieldLayout = (0, import__.getFormFieldLayout)("regular")?.component;
+  if (!SingleFieldLayout) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    SingleFieldLayout,
+    {
+      data,
+      field,
+      onChange,
+      hideLabelFromVision: hideLabelFromVision || withHeader,
+      markWhenOptional,
+      validity
+    }
+  );
+}
 function FormCardField({
   data,
   field,
@@ -80,10 +156,7 @@ function FormCardField({
 }) {
   const { fields } = (0, import_element.useContext)(import_dataform_context.default);
   const layout = field.layout;
-  const cardBodyRef = (0, import_element.useRef)(null);
-  const instanceId = (0, import_compose.useInstanceId)(FormCardField);
-  const bodyId = `dataforms-layouts-card-card-body-${instanceId}`;
-  const titleId = `dataforms-layouts-card-card-title-${instanceId}`;
+  const contentRef = (0, import_element.useRef)(null);
   const form = (0, import_element.useMemo)(
     () => ({
       layout: import_normalize_form.DEFAULT_LAYOUT,
@@ -92,52 +165,28 @@ function FormCardField({
     [field]
   );
   const { isOpened, isCollapsible } = layout;
-  const [internalIsOpen, setIsOpen] = (0, import_element.useState)(isOpened);
+  const [isOpen, setIsOpen] = (0, import_element.useState)(isOpened);
   const [touched, setTouched] = (0, import_element.useState)(false);
   (0, import_element.useEffect)(() => {
     setIsOpen(isOpened);
   }, [isOpened]);
-  const toggle = (0, import_element.useCallback)(() => {
-    setIsOpen((prev) => {
-      if (prev) {
-        setTouched(true);
-      }
-      return !prev;
-    });
+  const handleOpenChange = (0, import_element.useCallback)((open) => {
+    if (!open) {
+      setTouched(true);
+    }
+    setIsOpen(open);
   }, []);
-  const isOpen = isCollapsible ? internalIsOpen : true;
   const handleBlur = (0, import_element.useCallback)(() => {
     setTouched(true);
-  }, [setTouched]);
-  (0, import_use_report_validity.default)(cardBodyRef, isOpen && touched);
-  const summaryFields = (0, import_get_summary_fields.getSummaryFields)(layout.summary, fields);
-  const visibleSummaryFields = summaryFields.filter(
-    (summaryField) => isSummaryFieldVisible(summaryField, layout.summary, isOpen)
+  }, []);
+  (0, import_use_report_validity.default)(
+    contentRef,
+    (isCollapsible ? isOpen : true) && touched
   );
-  const validationBadge = touched && layout.isCollapsible ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_validation_badge.default, { validity }) : null;
-  const sizeCard = {
-    blockStart: "medium",
-    blockEnd: "medium",
-    inlineStart: "medium",
-    inlineEnd: "medium"
-  };
   let label = field.label;
   let withHeader;
-  let bodyContent;
   if (field.children) {
     withHeader = !!label && layout.withHeader;
-    bodyContent = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-      field.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataforms-layouts-card__field-description", children: field.description }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_data_form_layout.DataFormLayout,
-        {
-          data,
-          form,
-          onChange,
-          validity: validity?.children
-        }
-      )
-    ] });
   } else {
     const fieldDefinition = fields.find(
       (fieldDef) => fieldDef.id === field.id
@@ -145,103 +194,58 @@ function FormCardField({
     if (!fieldDefinition || !fieldDefinition.Edit) {
       return null;
     }
-    const SingleFieldLayout = (0, import__.getFormFieldLayout)("regular")?.component;
-    if (!SingleFieldLayout) {
-      return null;
-    }
     label = fieldDefinition.label;
     withHeader = !!label && layout.withHeader;
-    bodyContent = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      SingleFieldLayout,
-      {
-        data,
-        field,
-        onChange,
-        hideLabelFromVision: hideLabelFromVision || withHeader,
-        markWhenOptional,
-        validity
-      }
-    );
   }
-  const sizeCardBody = {
-    blockStart: withHeader ? "none" : "medium",
-    blockEnd: "medium",
-    inlineStart: "medium",
-    inlineEnd: "medium"
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.Card, { className: "dataforms-layouts-card__field", size: sizeCard, children: [
-    withHeader && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      import_components.CardHeader,
+  const bodyContent = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    BodyContent,
+    {
+      data,
+      field,
+      form,
+      onChange,
+      hideLabelFromVision,
+      markWhenOptional,
+      validity,
+      withHeader
+    }
+  );
+  const headerContent = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    HeaderContent,
+    {
+      data,
+      fields,
+      label,
+      layout,
+      isOpen: isCollapsible ? !!isOpen : true,
+      touched,
+      validity
+    }
+  );
+  if (withHeader && isCollapsible) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      import_ui.CollapsibleCard.Root,
       {
-        className: "dataforms-layouts-card__field-header",
-        onClick: isCollapsible ? toggle : void 0,
-        style: {
-          cursor: isCollapsible ? "pointer" : void 0
-        },
-        isBorderless: true,
+        className: "dataforms-layouts-card__field",
+        open: isOpen,
+        onOpenChange: handleOpenChange,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-            "div",
-            {
-              style: {
-                // Match the expand/collapse button's height to avoid layout
-                // differences when that button is not displayed.
-                height: isCollapsible ? void 0 : "40px",
-                width: "100%",
-                display: "flex",
-                justifyContent: "space-between",
-                alignItems: "center"
-              },
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                  "span",
-                  {
-                    id: titleId,
-                    className: "dataforms-layouts-card__field-header-label",
-                    children: label
-                  }
-                ),
-                validationBadge,
-                visibleSummaryFields.length > 0 && layout.withHeader && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataforms-layouts-card__field-summary", children: visibleSummaryFields.map(
-                  (summaryField) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                    summaryField.render,
-                    {
-                      item: data,
-                      field: summaryField
-                    },
-                    summaryField.id
-                  )
-                ) })
-              ]
-            }
-          ),
-          isCollapsible && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_components.Button,
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.CollapsibleCard.Header, { children: headerContent }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_ui.CollapsibleCard.Content,
             {
-              __next40pxDefaultSize: true,
-              variant: "tertiary",
-              icon: isOpen ? import_icons.chevronUp : import_icons.chevronDown,
-              "aria-expanded": isOpen,
-              "aria-controls": bodyId,
-              "aria-labelledby": titleId
+              ref: contentRef,
+              onBlur: handleBlur,
+              children: bodyContent
             }
           )
         ]
       }
-    ),
-    (isOpen || !withHeader) && // If it doesn't have a header, keep it open.
-    // Otherwise, the card will not be visible.
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_components.CardBody,
-      {
-        id: bodyId,
-        size: sizeCardBody,
-        className: "dataforms-layouts-card__field-control",
-        ref: cardBodyRef,
-        onBlur: handleBlur,
-        children: bodyContent
-      }
-    )
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Card.Root, { className: "dataforms-layouts-card__field", children: [
+    withHeader && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Card.Header, { children: headerContent }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Card.Content, { ref: contentRef, onBlur: handleBlur, children: bodyContent })
   ] });
 }
 //# sourceMappingURL=index.cjs.map

package/build/components/dataform-layouts/card/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/dataform-layouts/card/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tCard,\n\tCardBody,\n\tCardHeader as OriginalCardHeader,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport {\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { chevronDown, chevronUp } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { getFormFieldLayout } from '..';\nimport DataFormContext from '../../dataform-context';\nimport type {\n\tFieldLayoutProps,\n\tNormalizedCardLayout,\n\tNormalizedField,\n\tNormalizedForm,\n\tNormalizedLayout,\n} from '../../../types';\nimport { DataFormLayout } from '../data-form-layout';\nimport { DEFAULT_LAYOUT } from '../normalize-form';\nimport { getSummaryFields } from '../get-summary-fields';\nimport useReportValidity from '../../../hooks/use-report-validity';\nimport ValidationBadge from '../validation-badge';\n\nfunction isSummaryFieldVisible< Item >(\n\tsummaryField: NormalizedField< Item >,\n\tsummaryConfig: NormalizedCardLayout[ 'summary' ],\n\tisOpen: boolean\n) {\n\t// If no summary config, dont't show any fields\n\tif (\n\t\t! summaryConfig ||\n\t\t( Array.isArray( summaryConfig ) && summaryConfig.length === 0 )\n\t) {\n\t\treturn false;\n\t}\n\n\t// Convert to array for consistent handling\n\tconst summaryConfigArray = Array.isArray( summaryConfig )\n\t\t? summaryConfig\n\t\t: [ summaryConfig ];\n\n\t// Find the config for this specific field\n\tconst fieldConfig = summaryConfigArray.find( ( config ) => {\n\t\tif ( typeof config === 'string' ) {\n\t\t\treturn config === summaryField.id;\n\t\t}\n\t\tif ( typeof config === 'object' && 'id' in config ) {\n\t\t\treturn config.id === summaryField.id;\n\t\t}\n\t\treturn false;\n\t} );\n\n\t// If field is not in summary config, don't show it\n\tif ( ! fieldConfig ) {\n\t\treturn false;\n\t}\n\n\t// If it's a string, always show it\n\tif ( typeof fieldConfig === 'string' ) {\n\t\treturn true;\n\t}\n\n\t// If it has visibility rules, respect them\n\tif ( typeof fieldConfig === 'object' && 'visibility' in fieldConfig ) {\n\t\treturn (\n\t\t\tfieldConfig.visibility === 'always' ||\n\t\t\t( fieldConfig.visibility === 'when-collapsed' && ! isOpen )\n\t\t);\n\t}\n\n\t// Default to always show\n\treturn true;\n}\n\nexport default function FormCardField< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: FieldLayoutProps< Item > ) {\n\tconst { fields } = useContext( DataFormContext );\n\tconst layout = field.layout as NormalizedCardLayout;\n\tconst cardBodyRef = useRef< HTMLDivElement >( null );\n\tconst instanceId = useInstanceId( FormCardField );\n\tconst bodyId = `dataforms-layouts-card-card-body-${ instanceId }`;\n\tconst titleId = `dataforms-layouts-card-card-title-${ instanceId }`;\n\n\tconst form: NormalizedForm = useMemo(\n\t\t() => ( {\n\t\t\tlayout: DEFAULT_LAYOUT as NormalizedLayout,\n\t\t\tfields: field.children ?? [],\n\t\t} ),\n\t\t[ field ]\n\t);\n\n\tconst { isOpened, isCollapsible } = layout;\n\tconst [ internalIsOpen, setIsOpen ] = useState( isOpened );\n\tconst [ touched, setTouched ] = useState( false );\n\n\t// Sync internal state when the isOpened prop changes.\n\t// This is unlikely to happen in production, but it helps with storybook controls.\n\tuseEffect( () => {\n\t\tsetIsOpen( isOpened );\n\t}, [ isOpened ] );\n\n\tconst toggle = useCallback( () => {\n\t\tsetIsOpen( ( prev ) => {\n\t\t\t// Mark as touched when collapsing (going from open to closed)\n\t\t\tif ( prev ) {\n\t\t\t\tsetTouched( true );\n\t\t\t}\n\t\t\treturn ! prev;\n\t\t} );\n\t}, [] );\n\n\tconst isOpen = isCollapsible ? internalIsOpen : true;\n\n\t// Mark the card as touched when any field inside it is blurred.\n\t// This aligns with how validated controls show errors on blur.\n\tconst handleBlur = useCallback( () => {\n\t\tsetTouched( true );\n\t}, [ setTouched ] );\n\n\t// When the card is expanded after being touched (collapsed with errors),\n\t// trigger reportValidity to show field-level errors.\n\tuseReportValidity( cardBodyRef, isOpen && touched );\n\n\tconst summaryFields = getSummaryFields< Item >( layout.summary, fields );\n\n\tconst visibleSummaryFields = summaryFields.filter( ( summaryField ) =>\n\t\tisSummaryFieldVisible( summaryField, layout.summary, isOpen )\n\t);\n\n\tconst validationBadge =\n\t\ttouched && layout.isCollapsible ? (\n\t\t\t<ValidationBadge validity={ validity } />\n\t\t) : null;\n\n\tconst sizeCard = {\n\t\tblockStart: 'medium' as const,\n\t\tblockEnd: 'medium' as const,\n\t\tinlineStart: 'medium' as const,\n\t\tinlineEnd: 'medium' as const,\n\t};\n\n\tlet label = field.label;\n\tlet withHeader: boolean;\n\tlet bodyContent: React.ReactNode;\n\n\tif ( field.children ) {\n\t\twithHeader = !! label && layout.withHeader;\n\t\tbodyContent = (\n\t\t\t<>\n\t\t\t\t{ field.description && (\n\t\t\t\t\t<div className=\"dataforms-layouts-card__field-description\">\n\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<DataFormLayout\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tform={ form }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalidity={ validity?.children }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t} else {\n\t\tconst fieldDefinition = fields.find(\n\t\t\t( fieldDef ) => fieldDef.id === field.id\n\t\t);\n\n\t\tif ( ! fieldDefinition || ! fieldDefinition.Edit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst SingleFieldLayout = getFormFieldLayout( 'regular' )?.component;\n\t\tif ( ! SingleFieldLayout ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tlabel = fieldDefinition.label;\n\t\twithHeader = !! label && layout.withHeader;\n\t\tbodyContent = (\n\t\t\t<SingleFieldLayout\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision || withHeader }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tvalidity={ validity }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst sizeCardBody = {\n\t\tblockStart: withHeader ? ( 'none' as const ) : ( 'medium' as const ),\n\t\tblockEnd: 'medium' as const,\n\t\tinlineStart: 'medium' as const,\n\t\tinlineEnd: 'medium' as const,\n\t};\n\n\treturn (\n\t\t<Card className=\"dataforms-layouts-card__field\" size={ sizeCard }>\n\t\t\t{ withHeader && (\n\t\t\t\t<OriginalCardHeader\n\t\t\t\t\tclassName=\"dataforms-layouts-card__field-header\"\n\t\t\t\t\tonClick={ isCollapsible ? toggle : undefined }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tcursor: isCollapsible ? 'pointer' : undefined,\n\t\t\t\t\t} }\n\t\t\t\t\tisBorderless\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t// Match the expand/collapse button's height to avoid layout\n\t\t\t\t\t\t\t// differences when that button is not displayed.\n\t\t\t\t\t\t\theight: isCollapsible ? undefined : '40px',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tid={ titleId }\n\t\t\t\t\t\t\tclassName=\"dataforms-layouts-card__field-header-label\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{ validationBadge }\n\t\t\t\t\t\t{ visibleSummaryFields.length > 0 &&\n\t\t\t\t\t\t\tlayout.withHeader && (\n\t\t\t\t\t\t\t\t<div className=\"dataforms-layouts-card__field-summary\">\n\t\t\t\t\t\t\t\t\t{ visibleSummaryFields.map(\n\t\t\t\t\t\t\t\t\t\t( summaryField ) => (\n\t\t\t\t\t\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t{ isCollapsible && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\ticon={ isOpen ? chevronUp : chevronDown }\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-controls={ bodyId }\n\t\t\t\t\t\t\taria-labelledby={ titleId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</OriginalCardHeader>\n\t\t\t) }\n\t\t\t{ ( isOpen || ! withHeader ) && (\n\t\t\t\t// If it doesn't have a header, keep it open.\n\t\t\t\t// Otherwise, the card will not be visible.\n\t\t\t\t<CardBody\n\t\t\t\t\tid={ bodyId }\n\t\t\t\t\tsize={ sizeCardBody }\n\t\t\t\t\tclassName=\"dataforms-layouts-card__field-control\"\n\t\t\t\t\tref={ cardBodyRef }\n\t\t\t\t\tonBlur={ handleBlur }\n\t\t\t\t>\n\t\t\t\t\t{ bodyContent }\n\t\t\t\t</CardBody>\n\t\t\t) }\n\t\t</Card>\n\t);\n}\n"],
-  "mappings": "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",
-  "names": ["DataFormContext", "useReportValidity", "ValidationBadge", "OriginalCardHeader"]
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n// TODO: enable in the ESlint rule once we complete\n// https://github.com/WordPress/gutenberg/issues/76135.\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, CollapsibleCard, Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { getFormFieldLayout } from '..';\nimport DataFormContext from '../../dataform-context';\nimport type {\n\tFieldLayoutProps,\n\tNormalizedCardLayout,\n\tNormalizedField,\n\tNormalizedForm,\n\tNormalizedLayout,\n} from '../../../types';\nimport { DataFormLayout } from '../data-form-layout';\nimport { DEFAULT_LAYOUT } from '../normalize-form';\nimport { getSummaryFields } from '../get-summary-fields';\nimport useReportValidity from '../../../hooks/use-report-validity';\nimport ValidationBadge from '../validation-badge';\n\nfunction isSummaryFieldVisible< Item >(\n\tsummaryField: NormalizedField< Item >,\n\tsummaryConfig: NormalizedCardLayout[ 'summary' ],\n\tisOpen: boolean\n) {\n\t// If no summary config, dont't show any fields\n\tif (\n\t\t! summaryConfig ||\n\t\t( Array.isArray( summaryConfig ) && summaryConfig.length === 0 )\n\t) {\n\t\treturn false;\n\t}\n\n\t// Convert to array for consistent handling\n\tconst summaryConfigArray = Array.isArray( summaryConfig )\n\t\t? summaryConfig\n\t\t: [ summaryConfig ];\n\n\t// Find the config for this specific field\n\tconst fieldConfig = summaryConfigArray.find( ( config ) => {\n\t\tif ( typeof config === 'string' ) {\n\t\t\treturn config === summaryField.id;\n\t\t}\n\t\tif ( typeof config === 'object' && 'id' in config ) {\n\t\t\treturn config.id === summaryField.id;\n\t\t}\n\t\treturn false;\n\t} );\n\n\t// If field is not in summary config, don't show it\n\tif ( ! fieldConfig ) {\n\t\treturn false;\n\t}\n\n\t// If it's a string, always show it\n\tif ( typeof fieldConfig === 'string' ) {\n\t\treturn true;\n\t}\n\n\t// If it has visibility rules, respect them\n\tif ( typeof fieldConfig === 'object' && 'visibility' in fieldConfig ) {\n\t\treturn (\n\t\t\tfieldConfig.visibility === 'always' ||\n\t\t\t( fieldConfig.visibility === 'when-collapsed' && ! isOpen )\n\t\t);\n\t}\n\n\t// Default to always show\n\treturn true;\n}\n\nfunction HeaderContent< Item >( {\n\tdata,\n\tfields,\n\tlabel,\n\tlayout,\n\tisOpen,\n\ttouched,\n\tvalidity,\n}: {\n\tdata: Item;\n\tfields: NormalizedField< Item >[];\n\tlabel: string | undefined;\n\tlayout: NormalizedCardLayout;\n\tisOpen: boolean;\n\ttouched: boolean;\n\tvalidity: FieldLayoutProps< Item >[ 'validity' ];\n} ) {\n\tconst summaryFields = getSummaryFields< Item >( layout.summary, fields );\n\n\tconst visibleSummaryFields = summaryFields.filter( ( summaryField ) =>\n\t\tisSummaryFieldVisible( summaryField, layout.summary, isOpen )\n\t);\n\n\tconst hasBadge = touched && layout.isCollapsible;\n\tconst hasSummary = visibleSummaryFields.length > 0 && layout.withHeader;\n\n\treturn (\n\t\t<Stack\n\t\t\talign=\"center\"\n\t\t\tjustify=\"space-between\"\n\t\t\tclassName=\"dataforms-layouts-card__field-header-content\"\n\t\t>\n\t\t\t<Card.Title>{ label }</Card.Title>\n\t\t\t{ ( hasBadge || hasSummary ) && (\n\t\t\t\t<CollapsibleCard.HeaderDescription className=\"dataforms-layouts-card__field-header-content-description\">\n\t\t\t\t\t{ hasBadge && <ValidationBadge validity={ validity } /> }\n\t\t\t\t\t{ hasSummary && (\n\t\t\t\t\t\t<div className=\"dataforms-layouts-card__field-summary\">\n\t\t\t\t\t\t\t{ visibleSummaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</CollapsibleCard.HeaderDescription>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n\nfunction BodyContent< Item >( {\n\tdata,\n\tfield,\n\tform,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n\twithHeader,\n}: {\n\tdata: Item;\n\tfield: FieldLayoutProps< Item >[ 'field' ];\n\tform: NormalizedForm;\n\tonChange: FieldLayoutProps< Item >[ 'onChange' ];\n\thideLabelFromVision?: boolean;\n\tmarkWhenOptional?: boolean;\n\tvalidity: FieldLayoutProps< Item >[ 'validity' ];\n\twithHeader: boolean;\n} ) {\n\tif ( field.children ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ field.description && (\n\t\t\t\t\t<div className=\"dataforms-layouts-card__field-description\">\n\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<DataFormLayout\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tform={ form }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalidity={ validity?.children }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t}\n\n\tconst SingleFieldLayout = getFormFieldLayout( 'regular' )?.component;\n\tif ( ! SingleFieldLayout ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SingleFieldLayout\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision || withHeader }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n}\n\nexport default function FormCardField< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: FieldLayoutProps< Item > ) {\n\tconst { fields } = useContext( DataFormContext );\n\tconst layout = field.layout as NormalizedCardLayout;\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\n\tconst form: NormalizedForm = useMemo(\n\t\t() => ( {\n\t\t\tlayout: DEFAULT_LAYOUT as NormalizedLayout,\n\t\t\tfields: field.children ?? [],\n\t\t} ),\n\t\t[ field ]\n\t);\n\n\tconst { isOpened, isCollapsible } = layout;\n\tconst [ isOpen, setIsOpen ] = useState( isOpened );\n\tconst [ touched, setTouched ] = useState( false );\n\n\t// Sync internal state when the isOpened prop changes.\n\t// This is unlikely to happen in production, but it helps with storybook controls.\n\tuseEffect( () => {\n\t\tsetIsOpen( isOpened );\n\t}, [ isOpened ] );\n\n\tconst handleOpenChange = useCallback( ( open: boolean ) => {\n\t\t// Mark as touched when collapsing (going from open to closed)\n\t\tif ( ! open ) {\n\t\t\tsetTouched( true );\n\t\t}\n\t\tsetIsOpen( open );\n\t}, [] );\n\n\t// Mark the card as touched when any field inside it is blurred.\n\t// This aligns with how validated controls show errors on blur.\n\tconst handleBlur = useCallback( () => {\n\t\tsetTouched( true );\n\t}, [] );\n\n\t// When the card is expanded after being touched (collapsed with errors),\n\t// trigger reportValidity to show field-level errors.\n\tuseReportValidity(\n\t\tcontentRef,\n\t\t( isCollapsible ? isOpen : true ) && touched\n\t);\n\n\tlet label = field.label;\n\tlet withHeader: boolean;\n\n\tif ( field.children ) {\n\t\twithHeader = !! label && layout.withHeader;\n\t} else {\n\t\tconst fieldDefinition = fields.find(\n\t\t\t( fieldDef ) => fieldDef.id === field.id\n\t\t);\n\n\t\tif ( ! fieldDefinition || ! fieldDefinition.Edit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tlabel = fieldDefinition.label;\n\t\twithHeader = !! label && layout.withHeader;\n\t}\n\n\tconst bodyContent = (\n\t\t<BodyContent\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tform={ form }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t\twithHeader={ withHeader }\n\t\t/>\n\t);\n\n\tconst headerContent = (\n\t\t<HeaderContent\n\t\t\tdata={ data }\n\t\t\tfields={ fields }\n\t\t\tlabel={ label }\n\t\t\tlayout={ layout }\n\t\t\tisOpen={ isCollapsible ? !! isOpen : true }\n\t\t\ttouched={ touched }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n\n\tif ( withHeader && isCollapsible ) {\n\t\treturn (\n\t\t\t<CollapsibleCard.Root\n\t\t\t\tclassName=\"dataforms-layouts-card__field\"\n\t\t\t\topen={ isOpen }\n\t\t\t\tonOpenChange={ handleOpenChange }\n\t\t\t>\n\t\t\t\t<CollapsibleCard.Header>\n\t\t\t\t\t{ headerContent }\n\t\t\t\t</CollapsibleCard.Header>\n\t\t\t\t<CollapsibleCard.Content\n\t\t\t\t\tref={ contentRef }\n\t\t\t\t\tonBlur={ handleBlur }\n\t\t\t\t>\n\t\t\t\t\t{ bodyContent }\n\t\t\t\t</CollapsibleCard.Content>\n\t\t\t</CollapsibleCard.Root>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Card.Root className=\"dataforms-layouts-card__field\">\n\t\t\t{ withHeader && <Card.Header>{ headerContent }</Card.Header> }\n\t\t\t<Card.Content ref={ contentRef } onBlur={ handleBlur }>\n\t\t\t\t{ bodyContent }\n\t\t\t</Card.Content>\n\t\t</Card.Root>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["ValidationBadge", "DataFormContext", "useReportValidity"]
 }

package/build/components/dataform-layouts/panel/summary-button.cjs

@@ -149,7 +149,6 @@ function SummaryButton({
           {
             className: "dataforms-layouts-panel__field-trigger-icon",
             label: ariaLabel,
-            showTooltip: false,
             icon: import_icons.pencil,
             size: "small",
             "aria-expanded": ariaExpanded,

package/build/components/dataform-layouts/panel/summary-button.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/dataform-layouts/panel/summary-button.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Icon, Tooltip } from '@wordpress/components';\nimport { sprintf, _x } from '@wordpress/i18n';\nimport { error as errorIcon, pencil } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tFieldValidity,\n\tNormalizedField,\n\tNormalizedFormField,\n\tNormalizedPanelLayout,\n} from '../../../types';\nimport getLabelClassName from './utils/get-label-classname';\nimport getLabelContent from './utils/get-label-content';\nimport getFirstValidationError from './utils/get-first-validation-error';\n\nexport default function SummaryButton< Item >( {\n\tdata,\n\tfield,\n\tfieldLabel,\n\tsummaryFields,\n\tvalidity,\n\ttouched,\n\tdisabled,\n\tonClick,\n\t'aria-expanded': ariaExpanded,\n}: {\n\tdata: Item;\n\tfield: NormalizedFormField;\n\tfieldLabel?: string;\n\tsummaryFields: NormalizedField< Item >[];\n\tvalidity?: FieldValidity;\n\ttouched: boolean;\n\tdisabled?: boolean;\n\tonClick: () => void;\n\t'aria-expanded'?: boolean;\n} ) {\n\tconst { labelPosition, editVisibility } =\n\t\tfield.layout as NormalizedPanelLayout;\n\tconst errorMessage = getFirstValidationError( validity );\n\tconst showError = touched && !! errorMessage;\n\tconst labelClassName = getLabelClassName( labelPosition, showError );\n\tconst labelContent = getLabelContent( showError, errorMessage, fieldLabel );\n\tconst className = clsx(\n\t\t'dataforms-layouts-panel__field-trigger',\n\t\t`dataforms-layouts-panel__field-trigger--label-${ labelPosition }`,\n\t\t{\n\t\t\t'is-disabled': disabled,\n\t\t\t'dataforms-layouts-panel__field-trigger--edit-always':\n\t\t\t\teditVisibility === 'always',\n\t\t}\n\t);\n\n\tconst controlId = useInstanceId(\n\t\tSummaryButton,\n\t\t'dataforms-layouts-panel__field-control'\n\t);\n\n\tconst ariaLabel = showError\n\t\t? sprintf(\n\t\t\t\t// translators: %s: Field name.\n\t\t\t\t_x( 'Edit %s (has errors)', 'field' ),\n\t\t\t\tfieldLabel || ''\n\t\t  )\n\t\t: sprintf(\n\t\t\t\t// translators: %s: Field name.\n\t\t\t\t_x( 'Edit %s', 'field' ),\n\t\t\t\tfieldLabel || ''\n\t\t  );\n\n\tconst rowRef = useRef< HTMLDivElement >( null );\n\n\tconst handleRowClick = () => {\n\t\tconst selection =\n\t\t\trowRef.current?.ownerDocument.defaultView?.getSelection();\n\t\tif ( selection && selection.toString().length > 0 ) {\n\t\t\treturn;\n\t\t}\n\t\tonClick();\n\t};\n\n\tconst handleKeyDown = ( event: React.KeyboardEvent ) => {\n\t\tif (\n\t\t\tevent.target === event.currentTarget &&\n\t\t\t( event.key === 'Enter' || event.key === ' ' )\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tonClick();\n\t\t}\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tref={ rowRef }\n\t\t\tclassName={ className }\n\t\t\tonClick={ ! disabled ? handleRowClick : undefined }\n\t\t\tonKeyDown={ ! disabled ? handleKeyDown : undefined }\n\t\t>\n\t\t\t{ labelPosition !== 'none' && (\n\t\t\t\t<span className={ labelClassName }>{ labelContent }</span>\n\t\t\t) }\n\t\t\t{ labelPosition === 'none' && showError && (\n\t\t\t\t<Tooltip text={ errorMessage } placement=\"top\">\n\t\t\t\t\t<span className=\"dataforms-layouts-panel__field-label-error-content\">\n\t\t\t\t\t\t<Icon icon={ errorIcon } size={ 16 } />\n\t\t\t\t\t</span>\n\t\t\t\t</Tooltip>\n\t\t\t) }\n\t\t\t<span\n\t\t\t\tid={ `${ controlId }` }\n\t\t\t\tclassName=\"dataforms-layouts-panel__field-control\"\n\t\t\t>\n\t\t\t\t{ summaryFields.length > 1 ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\talignItems: 'flex-start',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tgap: '2px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ summaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\tsummaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) )\n\t\t\t\t) }\n\t\t\t</span>\n\t\t\t{ ! disabled && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"dataforms-layouts-panel__field-trigger-icon\"\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\tshowTooltip={ false }\n\t\t\t\t\ticon={ pencil }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\taria-expanded={ ariaExpanded }\n\t\t\t\t\taria-haspopup=\"dialog\"\n\t\t\t\t\taria-describedby={ `${ controlId }` }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Icon, Tooltip } from '@wordpress/components';\nimport { sprintf, _x } from '@wordpress/i18n';\nimport { error as errorIcon, pencil } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tFieldValidity,\n\tNormalizedField,\n\tNormalizedFormField,\n\tNormalizedPanelLayout,\n} from '../../../types';\nimport getLabelClassName from './utils/get-label-classname';\nimport getLabelContent from './utils/get-label-content';\nimport getFirstValidationError from './utils/get-first-validation-error';\n\nexport default function SummaryButton< Item >( {\n\tdata,\n\tfield,\n\tfieldLabel,\n\tsummaryFields,\n\tvalidity,\n\ttouched,\n\tdisabled,\n\tonClick,\n\t'aria-expanded': ariaExpanded,\n}: {\n\tdata: Item;\n\tfield: NormalizedFormField;\n\tfieldLabel?: string;\n\tsummaryFields: NormalizedField< Item >[];\n\tvalidity?: FieldValidity;\n\ttouched: boolean;\n\tdisabled?: boolean;\n\tonClick: () => void;\n\t'aria-expanded'?: boolean;\n} ) {\n\tconst { labelPosition, editVisibility } =\n\t\tfield.layout as NormalizedPanelLayout;\n\tconst errorMessage = getFirstValidationError( validity );\n\tconst showError = touched && !! errorMessage;\n\tconst labelClassName = getLabelClassName( labelPosition, showError );\n\tconst labelContent = getLabelContent( showError, errorMessage, fieldLabel );\n\tconst className = clsx(\n\t\t'dataforms-layouts-panel__field-trigger',\n\t\t`dataforms-layouts-panel__field-trigger--label-${ labelPosition }`,\n\t\t{\n\t\t\t'is-disabled': disabled,\n\t\t\t'dataforms-layouts-panel__field-trigger--edit-always':\n\t\t\t\teditVisibility === 'always',\n\t\t}\n\t);\n\n\tconst controlId = useInstanceId(\n\t\tSummaryButton,\n\t\t'dataforms-layouts-panel__field-control'\n\t);\n\n\tconst ariaLabel = showError\n\t\t? sprintf(\n\t\t\t\t// translators: %s: Field name.\n\t\t\t\t_x( 'Edit %s (has errors)', 'field' ),\n\t\t\t\tfieldLabel || ''\n\t\t  )\n\t\t: sprintf(\n\t\t\t\t// translators: %s: Field name.\n\t\t\t\t_x( 'Edit %s', 'field' ),\n\t\t\t\tfieldLabel || ''\n\t\t  );\n\n\tconst rowRef = useRef< HTMLDivElement >( null );\n\n\tconst handleRowClick = () => {\n\t\tconst selection =\n\t\t\trowRef.current?.ownerDocument.defaultView?.getSelection();\n\t\tif ( selection && selection.toString().length > 0 ) {\n\t\t\treturn;\n\t\t}\n\t\tonClick();\n\t};\n\n\tconst handleKeyDown = ( event: React.KeyboardEvent ) => {\n\t\tif (\n\t\t\tevent.target === event.currentTarget &&\n\t\t\t( event.key === 'Enter' || event.key === ' ' )\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tonClick();\n\t\t}\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tref={ rowRef }\n\t\t\tclassName={ className }\n\t\t\tonClick={ ! disabled ? handleRowClick : undefined }\n\t\t\tonKeyDown={ ! disabled ? handleKeyDown : undefined }\n\t\t>\n\t\t\t{ labelPosition !== 'none' && (\n\t\t\t\t<span className={ labelClassName }>{ labelContent }</span>\n\t\t\t) }\n\t\t\t{ labelPosition === 'none' && showError && (\n\t\t\t\t<Tooltip text={ errorMessage } placement=\"top\">\n\t\t\t\t\t<span className=\"dataforms-layouts-panel__field-label-error-content\">\n\t\t\t\t\t\t<Icon icon={ errorIcon } size={ 16 } />\n\t\t\t\t\t</span>\n\t\t\t\t</Tooltip>\n\t\t\t) }\n\t\t\t<span\n\t\t\t\tid={ `${ controlId }` }\n\t\t\t\tclassName=\"dataforms-layouts-panel__field-control\"\n\t\t\t>\n\t\t\t\t{ summaryFields.length > 1 ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\talignItems: 'flex-start',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tgap: '2px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ summaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</span>\n\t\t\t\t) : (\n\t\t\t\t\tsummaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) )\n\t\t\t\t) }\n\t\t\t</span>\n\t\t\t{ ! disabled && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"dataforms-layouts-panel__field-trigger-icon\"\n\t\t\t\t\tlabel={ ariaLabel }\n\t\t\t\t\ticon={ pencil }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\taria-expanded={ ariaExpanded }\n\t\t\t\t\taria-haspopup=\"dialog\"\n\t\t\t\t\taria-describedby={ `${ controlId }` }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
+  "mappings": "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",
   "names": ["getFirstValidationError", "getLabelClassName", "getLabelContent", "clsx", "errorIcon"]
 }

package/build/components/dataviews-bulk-actions/index.cjs

@@ -93,7 +93,8 @@ function BulkSelectionCheckbox({
   onChangeSelection,
   data,
   actions,
-  getItemId
+  getItemId,
+  disableSelectAll = false
 }) {
   const selectableItems = (0, import_element.useMemo)(() => {
     return data.filter((item) => {
@@ -105,7 +106,22 @@ function BulkSelectionCheckbox({
   const selectedItems = data.filter(
     (item) => selection.includes(getItemId(item)) && selectableItems.includes(item)
   );
+  const hasSelection = selection.length > 0;
   const areAllSelected = selectedItems.length === selectableItems.length;
+  if (disableSelectAll) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_components.CheckboxControl,
+      {
+        className: "dataviews-view-table-selection-checkbox",
+        checked: hasSelection,
+        disabled: !hasSelection,
+        onChange: () => {
+          onChangeSelection([]);
+        },
+        "aria-label": (0, import_i18n.__)("Deselect all")
+      }
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_components.CheckboxControl,
     {
@@ -200,11 +216,12 @@ function ActionButton({
     action.id
   );
 }
-function renderFooterContent(data, actions, getItemId, selection, actionsToShow, selectedItems, actionInProgress, setActionInProgress, onChangeSelection, paginationInfo) {
+function renderFooterContent(data, actions, getItemId, isInfiniteScroll, selection, actionsToShow, selectedItems, actionInProgress, setActionInProgress, onChangeSelection, paginationInfo) {
   const message = (0, import_get_footer_message.default)(
     selection.length,
     data.length,
-    paginationInfo.totalItems
+    paginationInfo.totalItems,
+    isInfiniteScroll
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_ui.Stack,
@@ -221,7 +238,8 @@ function renderFooterContent(data, actions, getItemId, selection, actionsToShow,
             onChangeSelection,
             data,
             actions,
-            getItemId
+            getItemId,
+            disableSelectAll: isInfiniteScroll
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dataviews-bulk-actions-footer__item-count", children: message }),
@@ -272,6 +290,7 @@ function FooterContent({
   onChangeSelection,
   data,
   getItemId,
+  isInfiniteScroll,
   paginationInfo
 }) {
   const [actionInProgress, setActionInProgress] = (0, import_element.useState)(
@@ -311,6 +330,7 @@ function FooterContent({
       data,
       actions,
       getItemId,
+      isInfiniteScroll,
       selection,
       actionsToShow,
       selectedItems,
@@ -324,6 +344,7 @@ function FooterContent({
       data,
       actions,
       getItemId,
+      isInfiniteScroll,
       selection,
       actionsToShow,
       selectedItems,
@@ -342,7 +363,8 @@ function BulkActionsFooter() {
     actions = EMPTY_ARRAY,
     onChangeSelection,
     getItemId,
-    paginationInfo
+    paginationInfo,
+    view
   } = (0, import_element.useContext)(import_dataviews_context.default);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     FooterContent,
@@ -352,6 +374,7 @@ function BulkActionsFooter() {
       data,
       actions,
       getItemId,
+      isInfiniteScroll: !!view.infiniteScrollEnabled,
       paginationInfo
     }
   );