diff --git a/docs/images/inputs/Tabs_Output.png b/docs/images/inputs/Tabs_Output.png index b67fb1911..29802f4c3 100644 Binary files a/docs/images/inputs/Tabs_Output.png and b/docs/images/inputs/Tabs_Output.png differ diff --git a/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-input-page-view-chromium.png b/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-input-page-view-chromium.png index 8c9d0ffff..5c0467b08 100644 --- a/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-input-page-view-chromium.png +++ b/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-input-page-view-chromium.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:ba82abe77bd2a19627d3ca369ea967d124df0587a0c4975e471a567863a1fc11 -size 35401 +oid sha256:c45e224b046e77516c4c66a3fa283162e2dfee1ae07501cb32f4ac10814697ef +size 35327 diff --git a/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-required-view-chromium.png b/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-required-view-chromium.png index 29fc7a258..7e57bca03 100644 --- a/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-required-view-chromium.png +++ b/ui/src/components/CheckboxGroup/stories/__images__/CheckboxGroup-required-view-chromium.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:75dcf61492b5842f47d360c4a8e40641c9f84a4ad3a147d69c6ea4abf89f1ef8 -size 42188 +oid sha256:f6b617ade1d7e335afc51794a2e59613bf57787a888c574dc90597507bf6ad56 +size 42123 diff --git a/ui/src/components/table/TableHeader.jsx b/ui/src/components/table/TableHeader.jsx index 1e41906ee..ff3daf6c0 100644 --- a/ui/src/components/table/TableHeader.jsx +++ b/ui/src/components/table/TableHeader.jsx @@ -2,6 +2,8 @@ import React from 'react'; import PropTypes from 'prop-types'; import Select from '@splunk/react-ui/Select'; import Paginator from '@splunk/react-ui/Paginator'; +import { Typography } from '@splunk/react-ui/Typography'; + import styled from 'styled-components'; import { _ } from '@splunk/ui-utils/i18n'; @@ -71,13 +73,24 @@ function TableHeader({ ); }; + const getInputCountStatus = () => { + const enabledRowCount = allFilteredData.filter((item) => !item.disabled).length; + const showCountStatus = `(${enabledRowCount} of ${totalElement} enabled)`; + + return ( + + {totalElement} + {totalElement > 1 ? _(` ${itemLabel}s`) : _(` ${itemLabel}`)} +   + {page === PAGE_INPUT && totalElement >= pageSize ? showCountStatus : null} + + ); + }; + return (
- - {totalElement} - {totalElement > 1 ? _(` ${itemLabel}s`) : _(` ${itemLabel}`)} - + {getInputCountStatus()} {page === PAGE_INPUT ? (