playbook_ui_docs 16.5.0.pre.rc.4 → 16.5.0.pre.rc.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_grouped_headers_composition.jsx +235 -0
  3. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_grouped_headers_composition.md +17 -0
  4. data/app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_grouped_headers_composition_mock_data.json +98 -0
  5. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +1 -0
  6. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +1 -0
  7. data/app/pb_kits/playbook/pb_select/docs/_select_attributes.html.erb +1 -0
  8. data/app/pb_kits/playbook/pb_select/docs/_select_blank.html.erb +1 -0
  9. data/app/pb_kits/playbook/pb_select/docs/_select_custom_select.html.erb +1 -1
  10. data/app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.html.erb +1 -1
  11. data/app/pb_kits/playbook/pb_select/docs/_select_default.html.erb +1 -0
  12. data/app/pb_kits/playbook/pb_select/docs/_select_disabled.html.erb +1 -0
  13. data/app/pb_kits/playbook/pb_select/docs/_select_disabled_options.html.erb +1 -0
  14. data/app/pb_kits/playbook/pb_select/docs/_select_error.html.erb +1 -0
  15. data/app/pb_kits/playbook/pb_select/docs/_select_inline.html.erb +1 -0
  16. data/app/pb_kits/playbook/pb_select/docs/_select_inline_compact.html.erb +1 -0
  17. data/app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.html.erb +1 -0
  18. data/app/pb_kits/playbook/pb_select/docs/_select_multiple.html.erb +1 -0
  19. data/app/pb_kits/playbook/pb_select/docs/_select_required.html.erb +1 -0
  20. data/app/pb_kits/playbook/pb_select/docs/_select_required_indicator.html.erb +1 -0
  21. data/app/pb_kits/playbook/pb_select/docs/_select_value_text_same.html.erb +1 -0
  22. metadata +5 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 45de576ce63556a57494e9830fc7568337ba39346e479bf493f6e16932692e96
4
- data.tar.gz: 30381cdce5cc5e32e6bccb8b7872f9041cf1a12f6995583e03b2eaef77722236
3
+ metadata.gz: 14ee4cf626c396a0645dd7991233183003e6c8008873abe1803d0695f909ef97
4
+ data.tar.gz: 1c4506b341d3b03078861a16a5e7c452e53c9d6bb4875ccf4fcc920561f5572e
5
5
  SHA512:
6
- metadata.gz: 5688aa72696becc0f044cb00f2d194dec6585d727fe619d7a09bb5ae169397c9df691d7125a9b62c6901c35af07ee5f1b53236bc565ddc9b80469d1cb8ba2a36
7
- data.tar.gz: 87c4a31d77c513c1d6a0082743c430a3c76ac57a9d2cdb47a2822372728a2f5acb7aaf880ee17eb7516fefaa06b862ebb63ba845579dd08c1c57f9c5bd8992bb
6
+ metadata.gz: d0cc1729abe5dcdccf6ced75afeaf948f3a314b04b336a8c306291299ad3c44e84eb40ab77ce52d3a0f084006a19bbaee10eb3159112447770eeba0444941c19
7
+ data.tar.gz: 7eccb6967a0a00b25b170147db83c8222eca93d78b4b41cf5eada37ba84b77884ba0e74d37f2c66cd42b6fb153941d4b94f2933977b331f11e6456e4ba78ee57
@@ -0,0 +1,235 @@
1
+ /* eslint-disable react/no-multi-comp, react/prop-types */
2
+ import React, { useCallback, useState } from "react"
3
+
4
+ import AdvancedTable from "../_advanced_table"
5
+ import Flex from "../../pb_flex/_flex"
6
+ import Icon from "../../pb_icon/_icon"
7
+ import List from "../../pb_list/_list"
8
+ import ListItem from "../../pb_list/_list_item"
9
+ import PbReactPopover from "../../pb_popover/_popover"
10
+ import SectionSeparator from "../../pb_section_separator/_section_separator"
11
+ import StarRating from "../../pb_star_rating/_star_rating"
12
+ import COMPOSITION_MOCK_DATA from "./advanced_table_grouped_headers_composition_mock_data.json"
13
+
14
+ const LEAF_COUNT = "newEnrollments"
15
+ const LEAF_SCHEDULED = "scheduledMeetings"
16
+
17
+ const ICON_UNSORTED = "arrow-up-arrow-down"
18
+ const iconSorted = (desc) => (desc ? "arrow-up-wide-short" : "arrow-down-short-wide")
19
+
20
+ const STAR_MENU = [
21
+ { id: LEAF_COUNT, label: "Count" },
22
+ { id: LEAF_SCHEDULED, label: "Scheduled" },
23
+ ]
24
+
25
+ const MENU_BTN = {
26
+ alignItems: "center",
27
+ background: "transparent",
28
+ border: "none",
29
+ cursor: "pointer",
30
+ display: "flex",
31
+ font: "inherit",
32
+ gap: 12,
33
+ justifyContent: "space-between",
34
+ padding: "8px 14px",
35
+ textAlign: "left",
36
+ width: "100%",
37
+ }
38
+
39
+ const labelStyle = (active) => ({
40
+ color: active ? "#0056cf" : "#242930",
41
+ flex: 1,
42
+ fontSize: 14,
43
+ fontWeight: active ? 600 : 400,
44
+ })
45
+
46
+ /** Hooks + popover; `header` callback cannot use hooks directly. */
47
+ const StarMetricGroupHeader = ({ table }) => {
48
+ const [open, setOpen] = useState(false)
49
+ const menuId = "playbook-star-metric-sort-menu"
50
+
51
+ const sort0 = table.getState().sorting[0]
52
+ const groupActive =
53
+ sort0?.id === LEAF_COUNT || sort0?.id === LEAF_SCHEDULED
54
+
55
+ const close = useCallback((shouldClose) => setOpen(!shouldClose), [])
56
+ const toggle = useCallback((e) => {
57
+ e.stopPropagation()
58
+ setOpen((v) => !v)
59
+ }, [])
60
+
61
+ const applySort = useCallback(
62
+ (columnId, e) => {
63
+ e.stopPropagation()
64
+ const cur = table.getState().sorting[0]
65
+ const nextDesc = cur?.id === columnId ? !cur.desc : true
66
+ table.setSorting([{ desc: nextDesc, id: columnId }])
67
+ setOpen(false)
68
+ },
69
+ [table]
70
+ )
71
+
72
+ return (
73
+ <PbReactPopover
74
+ closeOnClick="outside"
75
+ offset
76
+ padding="none"
77
+ placement="bottom-start"
78
+ reference={
79
+ <button
80
+ aria-controls={menuId}
81
+ aria-expanded={open}
82
+ aria-haspopup="menu"
83
+ aria-label="Sort by Count or Scheduled"
84
+ onClick={toggle}
85
+ style={{
86
+ background: open ? "rgba(115, 134, 169, 0.14)" : "transparent",
87
+ border: "none",
88
+ borderRadius: 6,
89
+ cursor: "pointer",
90
+ font: "inherit",
91
+ margin: 0,
92
+ padding: "2px 4px",
93
+ }}
94
+ title="Open menu to sort by Count or Scheduled"
95
+ type="button"
96
+ >
97
+ <Flex alignItems="center"
98
+ gap="xs"
99
+ justifyContent="center"
100
+ >
101
+ <StarRating
102
+ backgroundType="outline"
103
+ colorOption="primary"
104
+ justifyContent="center"
105
+ maxWidth="102px"
106
+ rating={5}
107
+ />
108
+ <Icon
109
+ color={groupActive ? "primary" : "default"}
110
+ fixedWidth
111
+ icon={
112
+ groupActive
113
+ ? iconSorted(Boolean(sort0?.desc))
114
+ : ICON_UNSORTED
115
+ }
116
+ size="md"
117
+ />
118
+ </Flex>
119
+ </button>
120
+ }
121
+ shouldClosePopover={close}
122
+ show={open}
123
+ zIndex={1200}
124
+ >
125
+ <Flex id={menuId}
126
+ minWidth="220px"
127
+ orientation="column"
128
+ >
129
+ <List borderless
130
+ padding="none"
131
+ >
132
+ {STAR_MENU.map(({ id, label }, i) => {
133
+ const active = sort0?.id === id
134
+ return (
135
+ <React.Fragment key={id}>
136
+ {i > 0 ? <SectionSeparator margin="none" /> : null}
137
+ <ListItem padding="none">
138
+ <button
139
+ onClick={(e) => applySort(id, e)}
140
+ style={MENU_BTN}
141
+ type="button"
142
+ >
143
+ <span style={labelStyle(active)}>{label}</span>
144
+ <Icon
145
+ color={active ? "primary" : "default"}
146
+ fixedWidth
147
+ icon={
148
+ active
149
+ ? iconSorted(Boolean(sort0?.desc))
150
+ : ICON_UNSORTED
151
+ }
152
+ size="md"
153
+ />
154
+ </button>
155
+ </ListItem>
156
+ </React.Fragment>
157
+ )
158
+ })}
159
+ </List>
160
+ </Flex>
161
+ </PbReactPopover>
162
+ )
163
+ }
164
+
165
+ const AdvancedTableGroupedHeadersComposition = (props) => {
166
+ const [pinnedRows, setPinnedRows] = useState({ top: ["12"] })
167
+
168
+ const columnDefinitions = [
169
+ {
170
+ accessor: "year",
171
+ cellAccessors: ["quarter", "month", "day"],
172
+ label: "Year",
173
+ },
174
+ {
175
+ columns: [
176
+ {
177
+ columns: [
178
+ {
179
+ accessor: "newEnrollments",
180
+ enableSort: true,
181
+ id: LEAF_COUNT,
182
+ label: "Count",
183
+ },
184
+ {
185
+ accessor: "scheduledMeetings",
186
+ enableSort: true,
187
+ id: LEAF_SCHEDULED,
188
+ label: "Scheduled",
189
+ },
190
+ ],
191
+ id: "starLeafPair",
192
+ label: "Metrics",
193
+ },
194
+ ],
195
+ header: ({ table }) => (
196
+ <Flex justify="center">
197
+ <StarMetricGroupHeader table={table} />
198
+ </Flex>
199
+ ),
200
+ id: "starMetricGroup",
201
+ label: "Rating group (custom header)",
202
+ },
203
+ {
204
+ columns: [
205
+ { accessor: "attendanceRate", label: "Attendance" },
206
+ {
207
+ accessor: "classCompletionRate",
208
+ enableSort: true,
209
+ id: "classCompletionRate",
210
+ label: "Completion %",
211
+ },
212
+ ],
213
+ label: "Performance",
214
+ },
215
+ ]
216
+
217
+ return (
218
+ <div>
219
+ <AdvancedTable
220
+ columnDefinitions={columnDefinitions}
221
+ enableSortingRemoval
222
+ maxHeight="md"
223
+ pinnedRows={{ onChange: setPinnedRows, value: pinnedRows }}
224
+ tableData={COMPOSITION_MOCK_DATA}
225
+ tableProps={{ sticky: true }}
226
+ {...props}
227
+ >
228
+ <AdvancedTable.Header enableSorting />
229
+ <AdvancedTable.Body />
230
+ </AdvancedTable>
231
+ </div>
232
+ )
233
+ }
234
+
235
+ export default AdvancedTableGroupedHeadersComposition
@@ -0,0 +1,17 @@
1
+ ### Grouped headers, custom UI, sort, and pinned rows
2
+
3
+ This example combines patterns that often show up together in product tables:
4
+
5
+ 1. **Multi-level headers** — nested `columns` in `columnDefinitions`.
6
+ 2. **Custom group header** — a `header` function returning React (here: `StarRating`, sort icon, `PbReactPopover` menu). Parent groups are not sort targets; **only leaf columns** use `enableSort: true` (see **Enable Sort By Column (Multi-Column)**).
7
+ 3. **Programmatic sort** — the group `header` receives TanStack’s **`table`**. Call **`table.setSorting([{ id: "<leafColumnId>", desc: boolean }])`** using the same **`id`** values as your leaf columns. Match **direction icons** to the built-in kit (`arrow-up-arrow-down` unsorted; `arrow-up-wide-short` / `arrow-down-short-wide` when sorted).
8
+ 4. **Pinned row + sticky header** — `pinnedRows` with row **`id`**s and `tableProps={{ sticky: true }}` (see **Pinned Rows**).
9
+
10
+ **Implementation notes**
11
+
12
+ - **`header` must be a child component** if you need hooks (e.g. popover open state). Render it from `header: ({ table }) => <YourHeader table={table} />`.
13
+ - **Avoid wrapping the primary control in `Tooltip`** — it can steal the first tap/click. Use a **`title`** on the button or copy in the doc instead.
14
+ - **Popover rows:** use a plain **`<button>`** as `reference`, `closeOnClick="outside"`. Picking the **same** metric again should **toggle** `desc`; switching to another leaf column often defaults to **`desc: true`** to align with **`sortDescFirst`**.
15
+ - **Data:** **`advanced_table_grouped_headers_composition_mock_data.json`** — twelve flat rows (2015–2026) with **varied** Count / Scheduled / % values so sorting is obvious; **`id` `"12"`** is **2026** and is pinned by default.
16
+
17
+ Other building blocks on this kit: **Custom Header with Multiple Headers**, **Sticky Header**.
@@ -0,0 +1,98 @@
1
+ [
2
+ {
3
+ "id": "1",
4
+ "year": "2015",
5
+ "newEnrollments": "12",
6
+ "scheduledMeetings": "40",
7
+ "attendanceRate": "62%",
8
+ "classCompletionRate": "28%"
9
+ },
10
+ {
11
+ "id": "2",
12
+ "year": "2016",
13
+ "newEnrollments": "88",
14
+ "scheduledMeetings": "12",
15
+ "attendanceRate": "71%",
16
+ "classCompletionRate": "55%"
17
+ },
18
+ {
19
+ "id": "3",
20
+ "year": "2017",
21
+ "newEnrollments": "34",
22
+ "scheduledMeetings": "67",
23
+ "attendanceRate": "58%",
24
+ "classCompletionRate": "41%"
25
+ },
26
+ {
27
+ "id": "4",
28
+ "year": "2018",
29
+ "newEnrollments": "05",
30
+ "scheduledMeetings": "91",
31
+ "attendanceRate": "44%",
32
+ "classCompletionRate": "73%"
33
+ },
34
+ {
35
+ "id": "5",
36
+ "year": "2019",
37
+ "newEnrollments": "61",
38
+ "scheduledMeetings": "19",
39
+ "attendanceRate": "83%",
40
+ "classCompletionRate": "36%"
41
+ },
42
+ {
43
+ "id": "6",
44
+ "year": "2020",
45
+ "newEnrollments": "19",
46
+ "scheduledMeetings": "54",
47
+ "attendanceRate": "67%",
48
+ "classCompletionRate": "62%"
49
+ },
50
+ {
51
+ "id": "7",
52
+ "year": "2021",
53
+ "newEnrollments": "73",
54
+ "scheduledMeetings": "08",
55
+ "attendanceRate": "52%",
56
+ "classCompletionRate": "49%"
57
+ },
58
+ {
59
+ "id": "8",
60
+ "year": "2022",
61
+ "newEnrollments": "50",
62
+ "scheduledMeetings": "50",
63
+ "attendanceRate": "75%",
64
+ "classCompletionRate": "45%"
65
+ },
66
+ {
67
+ "id": "9",
68
+ "year": "2023",
69
+ "newEnrollments": "95",
70
+ "scheduledMeetings": "03",
71
+ "attendanceRate": "69%",
72
+ "classCompletionRate": "81%"
73
+ },
74
+ {
75
+ "id": "10",
76
+ "year": "2024",
77
+ "newEnrollments": "27",
78
+ "scheduledMeetings": "76",
79
+ "attendanceRate": "91%",
80
+ "classCompletionRate": "22%"
81
+ },
82
+ {
83
+ "id": "11",
84
+ "year": "2025",
85
+ "newEnrollments": "41",
86
+ "scheduledMeetings": "33",
87
+ "attendanceRate": "48%",
88
+ "classCompletionRate": "94%"
89
+ },
90
+ {
91
+ "id": "12",
92
+ "year": "2026",
93
+ "newEnrollments": "66",
94
+ "scheduledMeetings": "66",
95
+ "attendanceRate": "55%",
96
+ "classCompletionRate": "58%"
97
+ }
98
+ ]
@@ -75,6 +75,7 @@ examples:
75
75
  - advanced_table_column_visibility_with_state: Column Visibility Control With State
76
76
  - advanced_table_column_visibility_custom: Column Visibility Control with Custom Dropdown
77
77
  - advanced_table_column_visibility_multi: Column Visibility Control with Multi-Header Columns
78
+ - advanced_table_grouped_headers_composition: Grouped headers, custom headers, sort, and pinned rows
78
79
  - advanced_table_scrollbar_none: Advanced Table Scrollbar None
79
80
  - advanced_table_row_styling: Row Styling
80
81
  - advanced_table_padding_control_per_row: Padding Control using Row Styling
@@ -42,6 +42,7 @@ export { default as AdvancedTableInfiniteScroll} from './_advanced_table_infinit
42
42
  export {default as AdvancedTableWithCustomHeader} from './_advanced_table_with_custom_header.jsx'
43
43
  export { default as AdvancedTableCustomSort } from './_advanced_table_custom_sort.jsx'
44
44
  export { default as AdvancedTableWithCustomHeaderMultiHeader } from './_advanced_table_with_custom_header_multi_header.jsx'
45
+ export { default as AdvancedTableGroupedHeadersComposition } from './_advanced_table_grouped_headers_composition.jsx'
45
46
  export { default as AdvancedTableSortPerColumn } from './_advanced_table_sort_per_column.jsx'
46
47
  export { default as AdvancedTableSortPerColumnForMultiColumn } from './_advanced_table_sort_per_column_for_multi_column.jsx'
47
48
  export { default as AdvancedTablePaddingControl } from './_advanced_table_padding_control.jsx'
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-food-attributes",
2
3
  attributes: {
3
4
  data: { options: "data_attribute" },
4
5
  },
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-location",
2
3
  label: "Where do you live",
3
4
  name: "location",
4
5
  blank_selection: "Select One...",
@@ -1,4 +1,4 @@
1
- <%= pb_rails("select", props: { label: "Favorite Holiday" }) do %>
1
+ <%= pb_rails("select", props: { id: "holiday", label: "Favorite Holiday" }) do %>
2
2
  <select name="holiday" id="holiday">
3
3
  <option value="1">Christmas</option>
4
4
  <option value="2">Thanksgiving</option>
@@ -1,4 +1,4 @@
1
- <%= pb_rails("select", props: { label: "Favorite Animal" }) do %>
1
+ <%= pb_rails("select", props: { id: "animal", label: "Favorite Animal" }) do %>
2
2
  <select name="animal" id="animal">
3
3
  <optgroup label="Mammal">
4
4
  <option value="1">Cat</option>
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-favorite-food",
2
3
  label: "Favorite Food",
3
4
  name: "food",
4
5
  options: [
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-dessert-disabled",
2
3
  label: "Favorite Dessert",
3
4
  disabled: true,
4
5
  name: "dessert",
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-coffee",
2
3
  label: "Favorite Coffee",
3
4
  name: "coffee",
4
5
  options: [
@@ -1,5 +1,6 @@
1
1
  <%= pb_rails("select", props: {
2
2
  error: raw(pb_rails("icon", props: { icon: "warning" }) + " Please make a valid selection"),
3
+ id: "select-food-error",
3
4
  label: "Favorite Food",
4
5
  name: "food",
5
6
  options: [
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-food-inline",
2
3
  label: "Favorite Food",
3
4
  name: "food",
4
5
  inline: true,
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-food-inline-compact",
2
3
  label: "Favorite Food",
3
4
  name: "food",
4
5
  inline: true,
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-food-inline-arrow",
2
3
  label: "Favorite Food",
3
4
  name: "food",
4
5
  inline: true,
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-food-multiple",
2
3
  label: "Favorite Food",
3
4
  name: "food",
4
5
  multiple: true,
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-shoe-required",
2
3
  label: "Which shoe do you tie first?",
3
4
  required: true,
4
5
  name: "shoe",
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-snacks-required-indicator",
2
3
  label: "Favorite Snacks",
3
4
  name: "food",
4
5
  required_indicator: true,
@@ -1,4 +1,5 @@
1
1
  <%= pb_rails("select", props: {
2
+ id: "select-sport",
2
3
  label: "Favorite Sport",
3
4
  name: "sports",
4
5
  options: [
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui_docs
3
3
  version: !ruby/object:Gem::Version
4
- version: 16.5.0.pre.rc.4
4
+ version: 16.5.0.pre.rc.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2026-04-01 00:00:00.000000000 Z
12
+ date: 2026-04-02 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: playbook_ui
@@ -98,6 +98,8 @@ files:
98
98
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.md
99
99
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_fullscreen.jsx
100
100
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_fullscreen.md
101
+ - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_grouped_headers_composition.jsx
102
+ - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_grouped_headers_composition.md
101
103
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_infinite_scroll.jsx
102
104
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_infinite_scroll.md
103
105
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_editing.jsx
@@ -193,6 +195,7 @@ files:
193
195
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.md
194
196
  - app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
195
197
  - app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading_empty_children.js
198
+ - app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_grouped_headers_composition_mock_data.json
196
199
  - app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data.json
197
200
  - app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data_infinite_scroll.json
198
201
  - app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data_no_subrows.json