playbook_ui 14.11.1.pre.alpha.PLAY1751pbcontenttagpt25529 → 14.11.1.pre.alpha.hfhbrakemanplaybook5370
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.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.md +2 -2
- data/app/pb_kits/playbook/pb_button/button.html.erb +3 -2
- data/app/pb_kits/playbook/pb_checkbox/checkbox.html.erb +6 -1
- data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +6 -2
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.md +1 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.html.erb +9 -3
- data/app/pb_kits/playbook/pb_draggable/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.md +1 -1
- data/app/pb_kits/playbook/pb_dropdown/dropdown.html.erb +12 -7
- data/app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb +14 -9
- data/app/pb_kits/playbook/pb_dropdown/dropdown_option.html.erb +11 -6
- data/app/pb_kits/playbook/pb_dropdown/dropdown_trigger.html.erb +14 -8
- data/app/pb_kits/playbook/pb_file_upload/file_upload.html.erb +6 -1
- data/app/pb_kits/playbook/pb_filter/filter.html.erb +5 -1
- data/app/pb_kits/playbook/pb_form_group/form_group.html.erb +6 -1
- data/app/pb_kits/playbook/pb_form_pill/form_pill.html.erb +1 -1
- data/app/pb_kits/playbook/pb_list/item.html.erb +8 -30
- data/app/pb_kits/playbook/pb_list/item.rb +0 -7
- data/app/pb_kits/playbook/pb_list/list.html.erb +11 -31
- data/app/pb_kits/playbook/pb_list/list.rb +0 -4
- data/app/pb_kits/playbook/pb_loading_inline/_loading_inline.tsx +1 -6
- data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +12 -30
- data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_phone_number_input/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb +0 -3
- data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.test.js +1 -20
- data/app/pb_kits/playbook/pb_radio/_radio.scss +8 -12
- data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.jsx +3 -8
- data/app/pb_kits/playbook/pb_selectable_list/selectable_list.html.erb +3 -17
- data/app/pb_kits/playbook/pb_selectable_list/selectable_list.rb +0 -3
- data/app/pb_kits/playbook/pb_selectable_list/selectable_list_item.html.erb +4 -11
- data/app/pb_kits/playbook/pb_selectable_list/selectable_list_item.rb +0 -3
- data/app/pb_kits/playbook/pb_table/_table.tsx +3 -2
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_rails.md +2 -2
- data/app/pb_kits/playbook/pb_table/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_table/index.ts +34 -93
- data/app/pb_kits/playbook/pb_table/styles/_scroll.scss +5 -6
- data/app/pb_kits/playbook/pb_table/table.html.erb +1 -1
- data/app/pb_kits/playbook/pb_table/table.rb +2 -17
- data/app/pb_kits/playbook/pb_timeline/_timeline.scss +30 -30
- data/dist/chunks/{_typeahead-TN5aDUj9.js → _typeahead-BNULwihE.js} +2 -2
- data/dist/chunks/_weekday_stacked-BKWemDAe.js +45 -0
- data/dist/chunks/{lib-OFT985dg.js → lib-B7sgJtGS.js} +2 -2
- data/dist/chunks/{pb_form_validation-CrsXd1-Y.js → pb_form_validation-C5Cc0-1v.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/playbook-doc.js +1 -1
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +6 -17
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.md +0 -5
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.html.erb +0 -38
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md +0 -3
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.html.erb +0 -15
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.jsx +0 -24
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.md +0 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns.html.erb +0 -74
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns_rails.md +0 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns.html.erb +0 -74
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns_rails.md +0 -3
- data/app/pb_kits/playbook/pb_table/utilities/addDataTitle.ts +0 -22
- data/dist/chunks/_weekday_stacked-BcnpLG66.js +0 -45
data/lib/playbook/version.rb
CHANGED
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: 14.11.1.pre.alpha.
|
4
|
+
version: 14.11.1.pre.alpha.hfhbrakemanplaybook5370
|
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: 2025-01-
|
12
|
+
date: 2025-01-14 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -1146,11 +1146,8 @@ files:
|
|
1146
1146
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx
|
1147
1147
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.md
|
1148
1148
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.html.erb
|
1149
|
-
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.md
|
1150
1149
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list.jsx
|
1151
1150
|
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list.md
|
1152
|
-
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.html.erb
|
1153
|
-
- app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md
|
1154
1151
|
- app/pb_kits/playbook/pb_draggable/docs/example.yml
|
1155
1152
|
- app/pb_kits/playbook/pb_draggable/docs/index.js
|
1156
1153
|
- app/pb_kits/playbook/pb_draggable/draggable.html.erb
|
@@ -2157,9 +2154,6 @@ files:
|
|
2157
2154
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.html.erb
|
2158
2155
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.jsx
|
2159
2156
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.md
|
2160
|
-
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.html.erb
|
2161
|
-
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.jsx
|
2162
|
-
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.md
|
2163
2157
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.html.erb
|
2164
2158
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.jsx
|
2165
2159
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.md
|
@@ -2665,17 +2659,13 @@ files:
|
|
2665
2659
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky.html.erb
|
2666
2660
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky.jsx
|
2667
2661
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky.md
|
2668
|
-
- app/pb_kits/playbook/pb_table/docs/_table_sticky_columns.html.erb
|
2669
2662
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_columns.jsx
|
2670
|
-
- app/pb_kits/playbook/pb_table/docs/_table_sticky_columns_rails.md
|
2671
2663
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_columns_react.md
|
2672
2664
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.html.erb
|
2673
2665
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.jsx
|
2674
2666
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_rails.md
|
2675
2667
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_react.md
|
2676
|
-
- app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns.html.erb
|
2677
2668
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns.jsx
|
2678
|
-
- app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns_rails.md
|
2679
2669
|
- app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns_react.md
|
2680
2670
|
- app/pb_kits/playbook/pb_table/docs/_table_striped.html.erb
|
2681
2671
|
- app/pb_kits/playbook/pb_table/docs/_table_striped.jsx
|
@@ -2753,7 +2743,6 @@ files:
|
|
2753
2743
|
- app/pb_kits/playbook/pb_table/table_header.rb
|
2754
2744
|
- app/pb_kits/playbook/pb_table/table_row.html.erb
|
2755
2745
|
- app/pb_kits/playbook/pb_table/table_row.rb
|
2756
|
-
- app/pb_kits/playbook/pb_table/utilities/addDataTitle.ts
|
2757
2746
|
- app/pb_kits/playbook/pb_text_input/_text_input.scss
|
2758
2747
|
- app/pb_kits/playbook/pb_text_input/_text_input.tsx
|
2759
2748
|
- app/pb_kits/playbook/pb_text_input/add_on.html.erb
|
@@ -3262,11 +3251,11 @@ files:
|
|
3262
3251
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3263
3252
|
- app/pb_kits/playbook/utilities/text.ts
|
3264
3253
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3265
|
-
- dist/chunks/_typeahead-
|
3266
|
-
- dist/chunks/_weekday_stacked-
|
3254
|
+
- dist/chunks/_typeahead-BNULwihE.js
|
3255
|
+
- dist/chunks/_weekday_stacked-BKWemDAe.js
|
3267
3256
|
- dist/chunks/lazysizes-B7xYodB-.js
|
3268
|
-
- dist/chunks/lib-
|
3269
|
-
- dist/chunks/pb_form_validation-
|
3257
|
+
- dist/chunks/lib-B7sgJtGS.js
|
3258
|
+
- dist/chunks/pb_form_validation-C5Cc0-1v.js
|
3270
3259
|
- dist/chunks/vendor.js
|
3271
3260
|
- dist/menu.yml
|
3272
3261
|
- dist/playbook-doc.js
|
@@ -1,5 +0,0 @@
|
|
1
|
-
For a simplified version of the Draggable API for the List kit, you can do the following:
|
2
|
-
|
3
|
-
The List kit is optimized to work with the draggable kit. To enable drag, use the `enable_drag` prop on List kit with an array of the included items AND `drag_id` prop on ListItems. You will also need to include the `items` prop containing your array of listed items for the Draggable API.
|
4
|
-
|
5
|
-
An additional optional boolean prop (set to true by default) of `drag_handle` is also available on ListItem kit to show the drag handle icon.
|
@@ -1,38 +0,0 @@
|
|
1
|
-
<%= pb_rails("selectable_list",
|
2
|
-
props: {
|
3
|
-
enable_drag: true,
|
4
|
-
variant: "radio",
|
5
|
-
items: [
|
6
|
-
{ drag_id: "41",
|
7
|
-
text: "Task 1",
|
8
|
-
input_options: {
|
9
|
-
value: "1",
|
10
|
-
name: "radio-name",
|
11
|
-
}
|
12
|
-
},
|
13
|
-
{ drag_id: "42",
|
14
|
-
text: "Task 2",
|
15
|
-
checked: true,
|
16
|
-
input_options: {
|
17
|
-
value: "2",
|
18
|
-
name: "radio-name",
|
19
|
-
}
|
20
|
-
},
|
21
|
-
{ drag_id: "43",
|
22
|
-
text: "Task 3",
|
23
|
-
input_options: {
|
24
|
-
value: "3",
|
25
|
-
name: "radio-name",
|
26
|
-
}
|
27
|
-
},
|
28
|
-
{ drag_id: "44",
|
29
|
-
text: "Task 4",
|
30
|
-
input_options: {
|
31
|
-
value: "4",
|
32
|
-
name: "radio-name",
|
33
|
-
}
|
34
|
-
}
|
35
|
-
]
|
36
|
-
}
|
37
|
-
)
|
38
|
-
%>
|
@@ -1,3 +0,0 @@
|
|
1
|
-
For a simplified version of the Draggable API for the SelectableList kit, you can do the following:
|
2
|
-
|
3
|
-
The SelectableList kit is optimized to work with the draggable kit. To enable drag, use the `enable_drag` prop on SelectableList kit AND `drag_id` prop within the SelectableList kit prop. An additional optional boolean prop (set to true by default) of `drag_handle` is also available on SelectableList kit to show the drag handle icon.
|
@@ -1,15 +0,0 @@
|
|
1
|
-
<%= pb_rails("phone_number_input", props: {
|
2
|
-
id: "phone_number_input",
|
3
|
-
format_as_you_type: true
|
4
|
-
}) %>
|
5
|
-
|
6
|
-
<%= pb_rails("button", props: {id: "clickable", text: "Save Phone Number"}) %>
|
7
|
-
|
8
|
-
<%= javascript_tag do %>
|
9
|
-
document.querySelector('#clickable').addEventListener('click', () => {
|
10
|
-
const formattedPhoneNumber = document.querySelector('#phone_number_input').value
|
11
|
-
const unformattedPhoneNumber = formattedPhoneNumber.replace(/\D/g, "")
|
12
|
-
|
13
|
-
alert(`Formatted: ${formattedPhoneNumber}. Unformatted: ${unformattedPhoneNumber}`)
|
14
|
-
})
|
15
|
-
<% end %>
|
@@ -1,24 +0,0 @@
|
|
1
|
-
import React, { useState } from "react";
|
2
|
-
import { PhoneNumberInput, Body } from "playbook-ui";
|
3
|
-
|
4
|
-
const PhoneNumberInputFormat = (props) => {
|
5
|
-
const [phoneNumber, setPhoneNumber] = useState("");
|
6
|
-
|
7
|
-
const handleOnChange = ({ number }) => {
|
8
|
-
setPhoneNumber(number);
|
9
|
-
};
|
10
|
-
|
11
|
-
return (
|
12
|
-
<>
|
13
|
-
<PhoneNumberInput
|
14
|
-
formatAsYouType
|
15
|
-
id="format"
|
16
|
-
onChange={handleOnChange}
|
17
|
-
{...props}
|
18
|
-
/>
|
19
|
-
{phoneNumber && <Body>Unformatted number: {phoneNumber}</Body>}
|
20
|
-
</>
|
21
|
-
);
|
22
|
-
};
|
23
|
-
|
24
|
-
export default PhoneNumberInputFormat;
|
@@ -1 +0,0 @@
|
|
1
|
-
NOTE: the `number` in the React `onChange` event will not include formatting (no spaces, dashes, and parentheses). For Rails, the `value` will include formatting and its value must be sanitized manually.
|
@@ -1,74 +0,0 @@
|
|
1
|
-
<%= pb_rails("table", props: { size: "md", responsive: "scroll", sticky_left_column: ["a"], sticky_right_column: ["b"] }) do %>
|
2
|
-
<thead>
|
3
|
-
<tr>
|
4
|
-
<th id="a">Column 1</th>
|
5
|
-
<th>Column 2</th>
|
6
|
-
<th>Column 3</th>
|
7
|
-
<th>Column 4</th>
|
8
|
-
<th>Column 5</th>
|
9
|
-
<th>Column 6</th>
|
10
|
-
<th>Column 7</th>
|
11
|
-
<th>Column 8</th>
|
12
|
-
<th>Column 9</th>
|
13
|
-
<th>Column 10</th>
|
14
|
-
<th>Column 11</th>
|
15
|
-
<th>Column 12</th>
|
16
|
-
<th>Column 13</th>
|
17
|
-
<th>Column 14</th>
|
18
|
-
<th id="b">Column 15</th>
|
19
|
-
</tr>
|
20
|
-
</thead>
|
21
|
-
<tbody>
|
22
|
-
<tr>
|
23
|
-
<td id="a">Value 1</td>
|
24
|
-
<td>Value 2</td>
|
25
|
-
<td>Value 3</td>
|
26
|
-
<td>Value 4</td>
|
27
|
-
<td>Value 5</td>
|
28
|
-
<td>Value 6</td>
|
29
|
-
<td>Value 7</td>
|
30
|
-
<td>Value 8</td>
|
31
|
-
<td>Value 9</td>
|
32
|
-
<td>Value 10</td>
|
33
|
-
<td>Value 11</td>
|
34
|
-
<td>Value 12</td>
|
35
|
-
<td>Value 13</td>
|
36
|
-
<td>Value 14</td>
|
37
|
-
<td id="b">Value 15</td>
|
38
|
-
</tr>
|
39
|
-
<tr>
|
40
|
-
<td id="a">Value 1</td>
|
41
|
-
<td>Value 2</td>
|
42
|
-
<td>Value 3</td>
|
43
|
-
<td>Value 4</td>
|
44
|
-
<td>Value 5</td>
|
45
|
-
<td>Value 6</td>
|
46
|
-
<td>Value 7</td>
|
47
|
-
<td>Value 8</td>
|
48
|
-
<td>Value 9</td>
|
49
|
-
<td>Value 10</td>
|
50
|
-
<td>Value 11</td>
|
51
|
-
<td>Value 12</td>
|
52
|
-
<td>Value 13</td>
|
53
|
-
<td>Value 14</td>
|
54
|
-
<td id="b">Value 15</td>
|
55
|
-
</tr>
|
56
|
-
<tr>
|
57
|
-
<td id="a">Value 1</td>
|
58
|
-
<td>Value 2</td>
|
59
|
-
<td>Value 3</td>
|
60
|
-
<td>Value 4</td>
|
61
|
-
<td>Value 5</td>
|
62
|
-
<td>Value 6</td>
|
63
|
-
<td>Value 7</td>
|
64
|
-
<td>Value 8</td>
|
65
|
-
<td>Value 9</td>
|
66
|
-
<td>Value 10</td>
|
67
|
-
<td>Value 11</td>
|
68
|
-
<td>Value 12</td>
|
69
|
-
<td>Value 13</td>
|
70
|
-
<td>Value 14</td>
|
71
|
-
<td id="b">Value 15</td>
|
72
|
-
</tr>
|
73
|
-
</tbody>
|
74
|
-
<% end %>
|
@@ -1,74 +0,0 @@
|
|
1
|
-
<%= pb_rails("table", props: { size: "md", responsive: "scroll", sticky_right_column: ["13", "14", "15"] }) do %>
|
2
|
-
<thead>
|
3
|
-
<tr>
|
4
|
-
<th>Column 1</th>
|
5
|
-
<th>Column 2</th>
|
6
|
-
<th>Column 3</th>
|
7
|
-
<th>Column 4</th>
|
8
|
-
<th>Column 5</th>
|
9
|
-
<th>Column 6</th>
|
10
|
-
<th>Column 7</th>
|
11
|
-
<th>Column 8</th>
|
12
|
-
<th>Column 9</th>
|
13
|
-
<th>Column 10</th>
|
14
|
-
<th>Column 11</th>
|
15
|
-
<th>Column 12</th>
|
16
|
-
<th id="13">Column 13</th>
|
17
|
-
<th id="14">Column 14</th>
|
18
|
-
<th id="15">Column 15</th>
|
19
|
-
</tr>
|
20
|
-
</thead>
|
21
|
-
<tbody>
|
22
|
-
<tr>
|
23
|
-
<td>Value 1</td>
|
24
|
-
<td>Value 2</td>
|
25
|
-
<td>Value 3</td>
|
26
|
-
<td>Value 4</td>
|
27
|
-
<td>Value 5</td>
|
28
|
-
<td>Value 6</td>
|
29
|
-
<td>Value 7</td>
|
30
|
-
<td>Value 8</td>
|
31
|
-
<td>Value 9</td>
|
32
|
-
<td>Value 10</td>
|
33
|
-
<td>Value 11</td>
|
34
|
-
<td>Value 12</td>
|
35
|
-
<td id="13">Value 13</td>
|
36
|
-
<td id="14">Value 14</td>
|
37
|
-
<td id="15">Value 15</td>
|
38
|
-
</tr>
|
39
|
-
<tr>
|
40
|
-
<td>Value 1</td>
|
41
|
-
<td>Value 2</td>
|
42
|
-
<td>Value 3</td>
|
43
|
-
<td>Value 4</td>
|
44
|
-
<td>Value 5</td>
|
45
|
-
<td>Value 6</td>
|
46
|
-
<td>Value 7</td>
|
47
|
-
<td>Value 8</td>
|
48
|
-
<td>Value 9</td>
|
49
|
-
<td>Value 10</td>
|
50
|
-
<td>Value 11</td>
|
51
|
-
<td>Value 12</td>
|
52
|
-
<td id="13">Value 13</td>
|
53
|
-
<td id="14">Value 14</td>
|
54
|
-
<td id="15">Value 15</td>
|
55
|
-
</tr>
|
56
|
-
<tr>
|
57
|
-
<td>Value 1</td>
|
58
|
-
<td>Value 2</td>
|
59
|
-
<td>Value 3</td>
|
60
|
-
<td>Value 4</td>
|
61
|
-
<td>Value 5</td>
|
62
|
-
<td>Value 6</td>
|
63
|
-
<td>Value 7</td>
|
64
|
-
<td>Value 8</td>
|
65
|
-
<td>Value 9</td>
|
66
|
-
<td>Value 10</td>
|
67
|
-
<td>Value 11</td>
|
68
|
-
<td>Value 12</td>
|
69
|
-
<td id="13">Value 13</td>
|
70
|
-
<td id="14">Value 14</td>
|
71
|
-
<td id="15">Value 15</td>
|
72
|
-
</tr>
|
73
|
-
</tbody>
|
74
|
-
<% end %>
|
@@ -1,3 +0,0 @@
|
|
1
|
-
The `sticky_right_column` prop works in the same way as the above `sticky_left_column` prop. It expects an array of the column ids you want to be sticky. Make sure to add the corresponding id to the `<th>` and `<td>`.
|
2
|
-
|
3
|
-
Please ensure that unique ids are used for all columns across multiple tables. Using the same columns ids on multiple tables can lead to issues when using the `sticky_right_column` prop.
|
@@ -1,22 +0,0 @@
|
|
1
|
-
export const addDataTitle = () => {
|
2
|
-
const tables = document.querySelectorAll('.table-responsive-collapse');
|
3
|
-
// Each Table
|
4
|
-
[].forEach.call(tables, (table: HTMLTableElement) => {
|
5
|
-
// Header Titles
|
6
|
-
const headers: string[] = [];
|
7
|
-
[].forEach.call(table.querySelectorAll('th'), (header: HTMLTableCellElement) => {
|
8
|
-
const colSpan = header.colSpan
|
9
|
-
for (let i = 0; i < colSpan; i++) {
|
10
|
-
headers.push(header.textContent.replace(/\r?\n|\r/, ''));
|
11
|
-
}
|
12
|
-
});
|
13
|
-
// for each row in tbody
|
14
|
-
[].forEach.call(table.querySelectorAll('tbody tr'), (row: HTMLTableRowElement) => {
|
15
|
-
// for each cell
|
16
|
-
[].forEach.call(row.cells, (cell: HTMLTableCellElement, headerIndex: number) => {
|
17
|
-
// apply the attribute
|
18
|
-
cell.setAttribute('data-title', headers[headerIndex])
|
19
|
-
})
|
20
|
-
})
|
21
|
-
});
|
22
|
-
}
|