playbook_ui_docs 14.1.0.pre.alpha.PBNTR417addcolorsupdatedefaultcolor3608 → 14.1.0.pre.alpha.PBNTR449rtepreviewerrails3605

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 (21) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_form_pill/docs/example.yml +0 -2
  3. data/app/pb_kits/playbook/pb_form_pill/docs/index.js +0 -1
  4. data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +0 -2
  5. data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +0 -1
  6. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.html.erb +21 -11
  7. data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +0 -2
  8. data/app/pb_kits/playbook/pb_typeahead/docs/index.js +0 -1
  9. data/dist/playbook-doc.js +1 -1
  10. metadata +2 -13
  11. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.html.erb +0 -117
  12. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.jsx +0 -227
  13. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.md +0 -1
  14. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.html.erb +0 -72
  15. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.jsx +0 -91
  16. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_rails.md +0 -1
  17. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_react.md +0 -1
  18. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.html.erb +0 -31
  19. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.jsx +0 -26
  20. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_rails.md +0 -1
  21. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_react.md +0 -1
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 03003e7a5730643b9389fcb6a713c2904707265b33e7dc2ec70ee8f6c4cf92da
4
- data.tar.gz: 3f626f86fbacd8850ad2bece6ced718bb80a7eed53bed0633acd7dde78ef0abf
3
+ metadata.gz: 3676b191a74b77086758143b0ccf8471796f8c026d532da14db2a30bebe83390
4
+ data.tar.gz: 720aa1cca6181a3d7f0dad51270f8a9d4fec6b89bd992ae0897d596c09fac65a
5
5
  SHA512:
6
- metadata.gz: b500436c1333f7f4b944b55d522beb6ceb19b87bfa985281aad0ede5dc0678851663536164c727833e29c6fad129229d1f8af103fffba6e470440b1a42f40122
7
- data.tar.gz: 2df17ac6cbd8c42efd4b62fd789b2935d3fb06178e06e0c8ae0e65a10419648bc455ecc2d2bfe7e5b68cf021695b8f5f8ff65fa484d2b4914eb176c3a1bd1931
6
+ metadata.gz: b9484a54906adc8e1554399110aebf64c380b4595ad8922b21e0d5ab92028954ca9004196ffbf7efef38029ee005c1396b579f07badb87611291dc2483af426f
7
+ data.tar.gz: 5e7291b02efbdad1c9b4daeee7e8b5ce592ae23e448fdc90e91ae8a31a6e8ca8f0156b0257989a9f979b7897599ab0fb4c7132ea6285327d8fb40029bd053e8f
@@ -6,7 +6,6 @@ examples:
6
6
  - form_pill_tag: Form Pill Tag
7
7
  - form_pill_example: Example
8
8
  - form_pill_icon: Form Pill Icon
9
- - form_pill_colors: Form Pill Colors
10
9
 
11
10
  react:
12
11
  - form_pill_user: Form Pill User
@@ -14,4 +13,3 @@ examples:
14
13
  - form_pill_tag: Form Pill Tag
15
14
  - form_pill_example: Example
16
15
  - form_pill_icon: Form Pill Icon
17
- - form_pill_colors: Form Pill Colors
@@ -3,4 +3,3 @@ export { default as FormPillSize } from './_form_pill_size.jsx'
3
3
  export { default as FormPillTag } from './_form_pill_tag.jsx'
4
4
  export { default as FormPillExample } from './_form_pill_example.jsx'
5
5
  export { default as FormPillIcon } from './_form_pill_icon.jsx'
6
- export { default as FormPillColors } from './_form_pill_colors.jsx'
@@ -6,7 +6,6 @@ examples:
6
6
  - multi_level_select_return_all_selected: Return All Selected
7
7
  - multi_level_select_selected_ids: Selected Ids
8
8
  - multi_level_select_with_form: With Form
9
- - multi_level_select_color: Color
10
9
 
11
10
  react:
12
11
  - multi_level_select_default: Default
@@ -14,4 +13,3 @@ examples:
14
13
  - multi_level_select_single_children_only: Single Select w/ Hidden Radios
15
14
  - multi_level_select_return_all_selected: Return All Selected
16
15
  - multi_level_select_selected_ids_react: Selected Ids
17
- - multi_level_select_color: Color
@@ -3,4 +3,3 @@ export { default as MultiLevelSelectSingle } from './_multi_level_select_single.
3
3
  export { default as MultiLevelSelectSingleChildrenOnly } from './_multi_level_select_single_children_only.jsx'
4
4
  export { default as MultiLevelSelectReturnAllSelected } from './_multi_level_select_return_all_selected.jsx'
5
5
  export { default as MultiLevelSelectSelectedIdsReact } from "./_multi_level_select_selected_ids_react.jsx"
6
- export { default as MultiLevelSelectColor } from './_multi_level_select_color.jsx'
@@ -1,7 +1,7 @@
1
1
 
2
2
  <%= pb_rails("rich_text_editor", props: { id: "content-preview-editor" }) %>
3
3
  <div id="card-obfuscation" style="display:none">
4
- <%= pb_rails("card", props: { margin_top: "md" }) do %>
4
+ <%= pb_rails("card", props: { margin_top: "md", max_width: "md", padding: "sm" }) do %>
5
5
  <div id="content-preview" class="trix-content">
6
6
  </div>
7
7
  <% end %>
@@ -11,15 +11,25 @@
11
11
  <% end %>
12
12
 
13
13
  <script>
14
- // Button event handler
15
- const button = document.getElementById('preview-button');
16
- button.addEventListener('click', function() {
17
- const content = document.getElementById('content-preview-editor');
18
- const previewArea = document.getElementById('content-preview');
19
- const cardDiv = document.getElementById('card-obfuscation');
14
+ document.addEventListener('DOMContentLoaded', () => {
15
+ function handleButtonClick() {
16
+ const editorContainer = [...document.querySelectorAll('[data-react-props]')]
17
+ .find(element => element.getAttribute('data-react-props')?.includes('"id":"content-preview-editor"'))
20
18
 
21
- previewArea.innerHTML = content.value;
22
- cardDiv.classList.add('mt_md');
23
- cardDiv.style.display = 'block';
24
- });
19
+ const editorElement = editorContainer?.querySelector('trix-editor')
20
+ const inputId = editorElement?.getAttribute('input')
21
+ const inputElement = inputId && document.getElementById(inputId)
22
+
23
+ const editorContent = inputElement?.value || ''
24
+ const previewArea = document.getElementById('content-preview')
25
+ const cardDiv = document.getElementById('card-obfuscation')
26
+
27
+ if (previewArea && cardDiv) {
28
+ previewArea.innerHTML = editorContent
29
+ cardDiv.style.display = 'block'
30
+ }
31
+ }
32
+
33
+ document.getElementById('preview-button')?.addEventListener('click', handleButtonClick)
34
+ })
25
35
  </script>
@@ -9,7 +9,6 @@ examples:
9
9
  - typeahead_inline: Inline
10
10
  - typeahead_multi_kit: Multi Kit Options
11
11
  - typeahead_error_state: Error State
12
- - typeahead_with_pills_color: With Pills (Custom Color)
13
12
 
14
13
  react:
15
14
  - typeahead_default: Default
@@ -24,4 +23,3 @@ examples:
24
23
  - typeahead_async_createable: Createable (+ Async Data)
25
24
  - typeahead_error_state: Error State
26
25
  - typeahead_custom_menu_list: Custom MenuList
27
- - typeahead_with_pills_color: With Pills (Custom Color)
@@ -10,4 +10,3 @@ export { default as TypeaheadCreateable } from './_typeahead_createable.jsx'
10
10
  export { default as TypeaheadAsyncCreateable } from './_typeahead_async_createable.jsx'
11
11
  export { default as TypeaheadErrorState } from './_typeahead_error_state.jsx'
12
12
  export { default as TypeaheadCustomMenuList } from './_typeahead_custom_menu_list.jsx'
13
- export { default as TypeaheadWithPillsColor } from './_typeahead_with_pills_color.jsx'