playbook_ui 13.16.0.pre.alpha.PLAY12002127 → 13.16.0.pre.alpha.fonttest1972

Sign up to get free protection for your applications and to get access to all the features.
Files changed (83) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +12 -14
  3. data/app/pb_kits/playbook/index.js +1 -2
  4. data/app/pb_kits/playbook/pb_flex/_flex.tsx +1 -1
  5. data/app/pb_kits/playbook/pb_label_value/_label_value.tsx +1 -1
  6. data/app/pb_kits/playbook/pb_layout/_layout.tsx +1 -2
  7. data/app/pb_kits/playbook/pb_layout/layout.test.js +4 -8
  8. data/app/pb_kits/playbook/pb_legend/_legend.tsx +6 -6
  9. data/app/pb_kits/playbook/pb_lightbox/Carousel/Slides.tsx +4 -4
  10. data/app/pb_kits/playbook/pb_lightbox/Carousel/Thumbnail.tsx +1 -1
  11. data/app/pb_kits/playbook/pb_lightbox/Carousel/index.tsx +3 -3
  12. data/app/pb_kits/playbook/pb_lightbox/Header/_lightbox_header.tsx +22 -30
  13. data/app/pb_kits/playbook/pb_lightbox/_lightbox.tsx +5 -5
  14. data/app/pb_kits/playbook/pb_line_graph/_line_graph.tsx +4 -4
  15. data/app/pb_kits/playbook/pb_list/_list.tsx +15 -15
  16. data/app/pb_kits/playbook/pb_list/_list_item.tsx +1 -1
  17. data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx +9 -9
  18. data/app/pb_kits/playbook/pb_map/_map.tsx +8 -8
  19. data/app/pb_kits/playbook/pb_map/_map_controls.tsx +7 -15
  20. data/app/pb_kits/playbook/pb_map/_map_custom_button.tsx +2 -4
  21. data/app/pb_kits/playbook/pb_message/_message.tsx +1 -1
  22. data/app/pb_kits/playbook/pb_message/_message_mention.tsx +6 -6
  23. data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +42 -46
  24. data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.tsx +20 -20
  25. data/app/pb_kits/playbook/pb_nav/_item.tsx +47 -56
  26. data/app/pb_kits/playbook/pb_nav/_nav.tsx +15 -15
  27. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb +7 -5
  28. data/app/pb_kits/playbook/pb_popover/_popover.tsx +14 -12
  29. data/app/pb_kits/playbook/pb_popover/docs/example.yml +1 -2
  30. data/app/pb_kits/playbook/pb_popover/docs/index.js +0 -1
  31. data/app/pb_kits/playbook/pb_table/_table.tsx +29 -29
  32. data/app/pb_kits/playbook/pb_typeahead/_typeahead.scss +1 -1
  33. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_highlight.jsx +2 -4
  34. data/app/pb_kits/playbook/playbook-doc.js +0 -2
  35. data/app/pb_kits/playbook/utilities/globalProps.ts +1 -1
  36. data/dist/menu.yml +1 -4
  37. data/dist/playbook-rails.js +6 -14
  38. data/lib/playbook/version.rb +1 -1
  39. metadata +2 -46
  40. data/app/pb_kits/playbook/pb_advanced_table/Components/CollapsibleTrail.tsx +0 -30
  41. data/app/pb_kits/playbook/pb_advanced_table/Components/CustomCell.tsx +0 -62
  42. data/app/pb_kits/playbook/pb_advanced_table/Components/LoadingCell.tsx +0 -5
  43. data/app/pb_kits/playbook/pb_advanced_table/Components/SortIconButton.tsx +0 -30
  44. data/app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx +0 -61
  45. data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx +0 -127
  46. data/app/pb_kits/playbook/pb_advanced_table/Components/ToggleIconButton.tsx +0 -28
  47. data/app/pb_kits/playbook/pb_advanced_table/Context/AdvancedTableContext.tsx +0 -5
  48. data/app/pb_kits/playbook/pb_advanced_table/README.md +0 -288
  49. data/app/pb_kits/playbook/pb_advanced_table/SubKits/TableBody.tsx +0 -95
  50. data/app/pb_kits/playbook/pb_advanced_table/SubKits/TableHeader.tsx +0 -51
  51. data/app/pb_kits/playbook/pb_advanced_table/Utilities/BrowserCheck.tsx +0 -5
  52. data/app/pb_kits/playbook/pb_advanced_table/Utilities/ExpansionControlHelpers.tsx +0 -63
  53. data/app/pb_kits/playbook/pb_advanced_table/Utilities/IconHelpers.tsx +0 -8
  54. data/app/pb_kits/playbook/pb_advanced_table/Utilities/types.ts +0 -8
  55. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +0 -98
  56. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +0 -246
  57. data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx +0 -56
  58. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.jsx +0 -52
  59. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.md +0 -1
  60. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx +0 -49
  61. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md +0 -18
  62. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.jsx +0 -59
  63. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.md +0 -18
  64. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.jsx +0 -60
  65. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.md +0 -3
  66. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.jsx +0 -52
  67. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.md +0 -5
  68. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.jsx +0 -63
  69. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.md +0 -3
  70. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.jsx +0 -57
  71. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.md +0 -3
  72. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.jsx +0 -61
  73. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.md +0 -3
  74. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx +0 -55
  75. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.md +0 -1
  76. data/app/pb_kits/playbook/pb_advanced_table/docs/_description.md +0 -1
  77. data/app/pb_kits/playbook/pb_advanced_table/docs/_mock_data.js +0 -278
  78. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -12
  79. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +0 -9
  80. data/app/pb_kits/playbook/pb_advanced_table/scss_partials/_loading.scss +0 -72
  81. data/app/pb_kits/playbook/pb_advanced_table/scss_partials/_pseudo_states.scss +0 -12
  82. data/app/pb_kits/playbook/pb_popover/docs/_popover_actionable_content.html.erb +0 -30
  83. data/app/pb_kits/playbook/pb_popover/docs/_popover_actionable_content.jsx +0 -57
@@ -2,5 +2,5 @@
2
2
 
3
3
  module Playbook
4
4
  PREVIOUS_VERSION = "13.16.0"
5
- VERSION = "13.16.0.pre.alpha.PLAY12002127"
5
+ VERSION = "13.16.0.pre.alpha.fonttest1972"
6
6
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 13.16.0.pre.alpha.PLAY12002127
4
+ version: 13.16.0.pre.alpha.fonttest1972
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: 2024-02-13 00:00:00.000000000 Z
12
+ date: 2024-01-23 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -269,48 +269,6 @@ files:
269
269
  - app/pb_kits/playbook/_playbook.scss
270
270
  - app/pb_kits/playbook/_reset.scss
271
271
  - app/pb_kits/playbook/index.js
272
- - app/pb_kits/playbook/pb_advanced_table/Components/CollapsibleTrail.tsx
273
- - app/pb_kits/playbook/pb_advanced_table/Components/CustomCell.tsx
274
- - app/pb_kits/playbook/pb_advanced_table/Components/LoadingCell.tsx
275
- - app/pb_kits/playbook/pb_advanced_table/Components/SortIconButton.tsx
276
- - app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
277
- - app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx
278
- - app/pb_kits/playbook/pb_advanced_table/Components/ToggleIconButton.tsx
279
- - app/pb_kits/playbook/pb_advanced_table/Context/AdvancedTableContext.tsx
280
- - app/pb_kits/playbook/pb_advanced_table/README.md
281
- - app/pb_kits/playbook/pb_advanced_table/SubKits/TableBody.tsx
282
- - app/pb_kits/playbook/pb_advanced_table/SubKits/TableHeader.tsx
283
- - app/pb_kits/playbook/pb_advanced_table/Utilities/BrowserCheck.tsx
284
- - app/pb_kits/playbook/pb_advanced_table/Utilities/ExpansionControlHelpers.tsx
285
- - app/pb_kits/playbook/pb_advanced_table/Utilities/IconHelpers.tsx
286
- - app/pb_kits/playbook/pb_advanced_table/Utilities/types.ts
287
- - app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss
288
- - app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx
289
- - app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx
290
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.jsx
291
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.md
292
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx
293
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md
294
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.jsx
295
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.md
296
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.jsx
297
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.md
298
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.jsx
299
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.md
300
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.jsx
301
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.md
302
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.jsx
303
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.md
304
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.jsx
305
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.md
306
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx
307
- - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.md
308
- - app/pb_kits/playbook/pb_advanced_table/docs/_description.md
309
- - app/pb_kits/playbook/pb_advanced_table/docs/_mock_data.js
310
- - app/pb_kits/playbook/pb_advanced_table/docs/example.yml
311
- - app/pb_kits/playbook/pb_advanced_table/docs/index.js
312
- - app/pb_kits/playbook/pb_advanced_table/scss_partials/_loading.scss
313
- - app/pb_kits/playbook/pb_advanced_table/scss_partials/_pseudo_states.scss
314
272
  - app/pb_kits/playbook/pb_avatar/_avatar.scss
315
273
  - app/pb_kits/playbook/pb_avatar/_avatar.tsx
316
274
  - app/pb_kits/playbook/pb_avatar/avatar.html.erb
@@ -1860,8 +1818,6 @@ files:
1860
1818
  - app/pb_kits/playbook/pb_popover/_popover.scss
1861
1819
  - app/pb_kits/playbook/pb_popover/_popover.tsx
1862
1820
  - app/pb_kits/playbook/pb_popover/docs/_description.md
1863
- - app/pb_kits/playbook/pb_popover/docs/_popover_actionable_content.html.erb
1864
- - app/pb_kits/playbook/pb_popover/docs/_popover_actionable_content.jsx
1865
1821
  - app/pb_kits/playbook/pb_popover/docs/_popover_close.html.erb
1866
1822
  - app/pb_kits/playbook/pb_popover/docs/_popover_close.jsx
1867
1823
  - app/pb_kits/playbook/pb_popover/docs/_popover_default.html.erb
@@ -1,30 +0,0 @@
1
- import React from "react"
2
-
3
- //CollapsibleTrail component
4
- const CollapsibleTrail = ({ leftOffset }: { leftOffset: number }) => {
5
- const style: { [key: string]: string | number } = {
6
- position: "absolute",
7
- left: `${leftOffset}em`,
8
- top: 0,
9
- bottom: 0,
10
- width: "2px",
11
- backgroundColor: "#E4E8F0",
12
- }
13
-
14
- return <div style={style} />
15
- }
16
-
17
- // Updated function to render multiple trails depending on depth
18
- export const renderCollapsibleTrail = (currentDepth: number) => {
19
- const lines = []
20
- for (let i = 1; i <= currentDepth; i++) {
21
- // Calculate leftOffset with additional 0.4rem for each depth level above 1
22
- const additionalOffset = i > 1 ? (i - 1) * 0.25 : 0
23
- const leftOffset = i * 1.0 + additionalOffset
24
- lines.push(<CollapsibleTrail key={i}
25
- leftOffset={leftOffset}
26
- />
27
- )
28
- }
29
- return lines
30
- }
@@ -1,62 +0,0 @@
1
- import React, { useContext } from "react";
2
-
3
- import Flex from "../../pb_flex/_flex";
4
- import FlexItem from "../../pb_flex/_flex_item";
5
- import Icon from "../../pb_icon/_icon";
6
- import { GlobalProps } from "../../utilities/globalProps";
7
-
8
- import { Getter, Row } from "@tanstack/react-table";
9
- import { DataType } from "../Utilities/types";
10
- import AdvancedTableContext from "../Context/AdvancedTableContext";
11
-
12
- interface CustomCellProps {
13
- getValue?: Getter<string>;
14
- onRowToggleClick?: (arg: Row<DataType>) => void;
15
- row: Row<DataType>;
16
- value?: string;
17
- }
18
-
19
- export const CustomCell = ({
20
- getValue,
21
- onRowToggleClick,
22
- row,
23
- value,
24
- }: CustomCellProps & GlobalProps) => {
25
- const { setExpanded, expanded } = useContext(AdvancedTableContext);
26
- const RowWithoutChildren = row.originalSubRows === undefined;
27
-
28
- const handleOnExpand = (row: Row<DataType>) => {
29
- onRowToggleClick && onRowToggleClick(row);
30
- setExpanded({ ...expanded, [row.id]: !row.getIsExpanded() });
31
- };
32
-
33
- return (
34
- <div style={{ paddingLeft: `${row.depth * 1.25}em` }}>
35
- <Flex alignItems="center"
36
- columnGap="xs"
37
- orientation="row"
38
- >
39
- {!RowWithoutChildren ? (
40
- <button
41
- className="gray-icon expand-toggle-icon"
42
- onClick={() => handleOnExpand(row)}
43
- >
44
- {row.getIsExpanded() ? (
45
- <Icon cursor="pointer"
46
- icon="circle-play"
47
- rotation={90}
48
- />
49
- ) : (
50
- <Icon cursor="pointer"
51
- icon="circle-play"
52
- />
53
- )}
54
- </button>
55
- ) : null}
56
- <FlexItem paddingLeft={!RowWithoutChildren ? "none" : "xs"}>
57
- {row.depth === 0 ? getValue() : value}
58
- </FlexItem>
59
- </Flex>
60
- </div>
61
- );
62
- };
@@ -1,5 +0,0 @@
1
- import React from "react"
2
-
3
- export const LoadingCell = () => {
4
- return <div className="loading-cell" />
5
- }
@@ -1,30 +0,0 @@
1
- import React from "react"
2
- import Icon from "../../pb_icon/_icon"
3
- import { Header } from "@tanstack/react-table"
4
- import { DataType } from "../Utilities/types"
5
- import { displayIcon } from "../Utilities/IconHelpers"
6
-
7
- type SortIconButtonProps = {
8
- header: Header<DataType, unknown>
9
- sortIcon?: string | string[]
10
- }
11
- export const SortIconButton = ({ header, sortIcon }: SortIconButtonProps) => {
12
-
13
- return (
14
- <>
15
- {header.column.getIsSorted() === "desc" ? (
16
- <div className="sort-button-icon"
17
- key={displayIcon(sortIcon)[0]}
18
- >
19
- <Icon icon={displayIcon(sortIcon)[0]} />
20
- </div>
21
- ) : (
22
- <div className="sort-button-icon"
23
- key={displayIcon(sortIcon)[1]}
24
- >
25
- <Icon icon={displayIcon(sortIcon)[1]} />
26
- </div>
27
- )}
28
- </>
29
- )
30
- }
@@ -1,61 +0,0 @@
1
- import React from "react"
2
- import Flex from "../../pb_flex/_flex"
3
- import Caption from "../../pb_caption/_caption"
4
- import { Row, Table } from "@tanstack/react-table"
5
-
6
- import { ToggleIconButton } from "./ToggleIconButton"
7
- import { renderCollapsibleTrail } from "./CollapsibleTrail"
8
-
9
- import { isChrome } from "../Utilities/BrowserCheck"
10
- import { DataType } from "../Utilities/types"
11
- import { GlobalProps } from "../../utilities/globalProps"
12
-
13
- interface SubRowHeaderRowProps {
14
- collapsibleTrail?: boolean
15
- enableToggleExpansion?: "all" | "header"
16
- onClick: (row: Row<DataType>) => void
17
- row: Row<DataType>
18
- subRowHeaders?: string[]
19
- table: Table<DataType>
20
- }
21
-
22
- export const SubRowHeaderRow = ({
23
- collapsibleTrail,
24
- enableToggleExpansion,
25
- onClick,
26
- row,
27
- subRowHeaders,
28
- table,
29
- }: SubRowHeaderRowProps & GlobalProps) => {
30
- const numberOfColumns = table.getAllFlatColumns().length
31
-
32
- return (
33
- <tr className="custom-row bg-silver">
34
- <td
35
- className={`custom-row-first-column ${
36
- isChrome() ? "chrome-styles" : ""
37
- }`}
38
- colSpan={1}
39
- >
40
- {collapsibleTrail && row.depth > 0 && renderCollapsibleTrail(row.depth)}
41
- <div style={{ paddingLeft: `${row.depth * 1.25}em` }}>
42
- <Flex align="center"
43
- columnGap="xs"
44
- >
45
- {enableToggleExpansion === "all" && row.getCanExpand() ? (
46
- <ToggleIconButton onClick={onClick}
47
- row={row}
48
- />
49
- ) : null}
50
- <Caption
51
- marginLeft={row.getCanExpand() ? "none" : "xs"}
52
- text={subRowHeaders[row.depth - 1]}
53
- />
54
- </Flex>
55
- </div>
56
- </td>
57
-
58
- <td colSpan={numberOfColumns - 1} />
59
- </tr>
60
- )
61
- }
@@ -1,127 +0,0 @@
1
- import React, { useContext } from "react"
2
- import classnames from "classnames";
3
- import Flex from "../../pb_flex/_flex"
4
- import { flexRender, Header } from "@tanstack/react-table"
5
-
6
- import { SortIconButton } from "./SortIconButton"
7
- import { ToggleIconButton } from "./ToggleIconButton"
8
- import { isChrome } from "../Utilities/BrowserCheck"
9
- import { DataType } from "../Utilities/types"
10
- import AdvancedTableContext from "../Context/AdvancedTableContext"
11
- import { GlobalProps } from "../../utilities/globalProps"
12
-
13
- type TableHeaderCellProps = {
14
- enableSorting?: boolean
15
- enableToggleExpansion?: "all" | "header"
16
- handleExpandOrCollapse?: () => void
17
- header?: Header<DataType, unknown>
18
- headerChildren?: React.ReactNode | React.ReactNode[]
19
- headerId?: string
20
- loading?: boolean
21
- sortIcon?: string | string[]
22
- } & GlobalProps
23
-
24
- export const TableHeaderCell = ({
25
- enableSorting,
26
- enableToggleExpansion,
27
- handleExpandOrCollapse,
28
- header,
29
- headerChildren,
30
- headerId,
31
- loading,
32
- sortIcon,
33
- }: TableHeaderCellProps) => {
34
- const { sortControl } = useContext(AdvancedTableContext)
35
-
36
- const toggleSortButton = (event: React.SyntheticEvent) => {
37
- if (sortControl) {
38
- const sortIsDesc = header.column.getIsSorted() === "desc"
39
- sortIsDesc
40
- ? sortControl.onChange({ desc: true })
41
- : sortControl.onChange({ desc: false })
42
- } else {
43
- header.column.getToggleSortingHandler()(event)
44
- }
45
- }
46
-
47
- const cellClassName = classnames("table-header-cells",
48
- `${isChrome() ? "chrome-styles" : ""}`,
49
- `${enableSorting ? "table-header-cells-active" : ""}`
50
- );
51
-
52
- const cellId = `${loading ?
53
- `loading-${header.id}${headerId ? `-${headerId}` : ""}`
54
- : `${header.id}${headerId ? `-${headerId}` : ""}`
55
- }`;
56
-
57
- return (
58
- <th
59
- align="right"
60
- className={cellClassName}
61
- id={cellId}
62
- key={`${header.id}-header`}
63
- >
64
- {header.isPlaceholder ? null : headerChildren && header.index === 0 ? (
65
- <Flex alignItems="center">
66
- {headerChildren}
67
- <div>
68
- {flexRender(header.column.columnDef.header, header.getContext())}
69
- </div>
70
- </Flex>
71
- ) : (
72
- <Flex
73
- alignItems="center"
74
- justify={header.index === 0 && enableSorting ? "between" : header.index === 0 && !enableSorting ? "start" : "end"}
75
- >
76
- {header.index === 0 &&
77
- !loading &&
78
- (enableToggleExpansion === "all" || "header") && (
79
- <ToggleIconButton onClick={handleExpandOrCollapse} />
80
- )}
81
-
82
- {header.index === 0 &&
83
- loading &&
84
- (enableToggleExpansion === "all" || "header") && (
85
- <div className="loading-toggle-icon header-toggle-icon" />
86
- )}
87
-
88
- <Flex
89
- className={`${header.index === 0 &&
90
- enableSorting &&
91
- "header-sort-button pb_th_link"}`}
92
- cursor={header.index === 0 && enableSorting ? "pointer" : "default"}
93
- {...(header.index === 0 &&
94
- enableSorting && {
95
- htmlOptions: {
96
- onClick: (event: React.MouseEvent) => toggleSortButton(event),
97
- onKeyDown: (event: React.KeyboardEvent) => {
98
- if (event.key === "Enter") {
99
- toggleSortButton(event)
100
- }
101
- },
102
- tabIndex: 0,
103
- },
104
- })}
105
- justify={header.index === 0 && enableSorting ? "between" : "none"}
106
- paddingLeft={enableSorting ? "xxs" : "xs"}
107
- >
108
- <div>
109
- {flexRender(header.column.columnDef.header, header.getContext())}
110
- </div>
111
-
112
- {header.index === 0 &&
113
- header.column.getCanSort() &&
114
- enableSorting &&
115
- (loading ? (
116
- <div className="loading-toggle-icon" />
117
- ) : (
118
- <SortIconButton header={header}
119
- sortIcon={sortIcon}
120
- />
121
- ))}
122
- </Flex>
123
- </Flex>
124
- )}
125
- </th>
126
- )
127
- }
@@ -1,28 +0,0 @@
1
- import React, { useContext } from "react"
2
- import Icon from "../../pb_icon/_icon"
3
- import { Row } from "@tanstack/react-table"
4
- import AdvancedTableContext from "../Context/AdvancedTableContext"
5
- import { DataType } from "../Utilities/types"
6
- import { displayIcon } from "../Utilities/IconHelpers"
7
-
8
- interface ToggleIconButtonProps {
9
- onClick: (row: Row<DataType>) => void
10
- row?: Row<DataType>
11
- }
12
-
13
- export const ToggleIconButton = ({ row, onClick }: ToggleIconButtonProps) => {
14
- const { toggleExpansionIcon } = useContext(AdvancedTableContext)
15
- return (
16
- <button
17
- className="gray-icon toggle-all-icon"
18
- key={displayIcon(toggleExpansionIcon)[0]}
19
- onClick={() => onClick(row)}
20
- >
21
- <Icon
22
- cursor="pointer"
23
- fixedWidth
24
- icon={displayIcon(toggleExpansionIcon)[0]}
25
- />
26
- </button>
27
- )
28
- }
@@ -1,5 +0,0 @@
1
- import { createContext } from "react"
2
-
3
- const AdvancedTableContext = createContext<any>({})
4
-
5
- export default AdvancedTableContext