playbook_ui_docs 15.3.0.pre.alpha.play2464flexitemcantusehtmloptions12226 → 15.3.0.pre.alpha.play2541phonenumberkitvalidation12084

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 90482e25d1e32d6a5951ca34256bf8b6ed228ade5dc8fffc0ffc6932d2d0f48e
-  data.tar.gz: 41a870cf19b0100b14a0eb80f10476a980d3a588a934094db9f521cb1551b221
+  metadata.gz: cc7ca64deece6d11de81ccfd4bc84dc7c74bea836ff5e0d62e0310fcc44e26f7
+  data.tar.gz: 3602b3989699b9765151802dbcc9990d6263d27958530c7911916dfd4c5e9670
 SHA512:
-  metadata.gz: 27cb549f5b64dbdd24f5032cc31d3f4ff3e414497b3b6aeb716642557957b47556eeac8046e05877164b874352f690de2b626046981407f3681570806f2ee9a7
-  data.tar.gz: a25f87b6986a42e1836ed2c989f4500df7785db8181ccc6efc092675ef03234f63977bf2e600d1c7c565c51a60eae851e4d5c9e07b7b5a4cb1656db775e0af96
+  metadata.gz: 6a00b08f1b293e7431fa44d6552b4c870ddf9f0cf7dc60e1ef834e65a792332c28ad33c91674b59b0091f8a9b1b53a05d85ddb7d637b0f02ca59d1e6d2154930
+  data.tar.gz: 014c83fdbe1c187bbf5bad9aa9ed2e0d370abb08a7b8ff7b8047dc60f676c63e4490ff84509a0d39dbe035e370dc75b0feb09471aa8f943d4ac42c0e3a7a9f1d

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_multi_header.jsx

@@ -76,22 +76,6 @@ const columnDefinitions = [
         {
           label: "Attendance",
           id: "attendance",
-          header: () => (
-            <Flex alignItems="center" 
-                justifyContent="center"
-            >
-              <Caption marginRight="xs">Attendance</Caption>
-              <Tooltip placement="top" 
-                  text="Whoa. I'm a Tooltip Too!" 
-                  zIndex={10}
-              >
-                <Icon cursor="pointer" 
-                    icon="info"
-                    size="xs" 
-                />
-              </Tooltip>
-            </Flex>
-          ),  
           columns: [
             {
               accessor: "attendanceRate",

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.html.erb

@@ -12,7 +12,7 @@
         capture do
           pb_rails("flex", props: { align_items: "center", justify_content: "center" }) do
             pb_rails("caption", props: { margin_right: "xs", text: "New Enrollments" }) +
-            pb_rails("icon", props: { id: "tooltip-interact", icon: "info", size: "xs", cursor: "pointer" }) +
+            pb_rails("icon", props: { id: "tooltip-interact", icon: "info", size: "xs" }) +
             pb_rails("tooltip", props: {
               trigger_element_id: "tooltip-interact",
               tooltip_id: "example-custom-tooltip",

data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml

@@ -11,7 +11,6 @@ examples:
   - advanced_table_responsive: Responsive Tables
   - advanced_table_custom_cell_rails: Custom Components for Cells
   - advanced_table_with_custom_header_rails: Custom Header Cell
-  - advanced_table_with_custom_header_multi_header_rails: Custom Header with Multiple Headers
   - advanced_table_column_headers: Multi-Header Columns
   - advanced_table_column_headers_multiple: Multi-Header Columns (Multiple Levels)
   - advanced_table_column_headers_vertical_border: Multi-Header Columns with Vertical Borders

data/app/pb_kits/playbook/pb_date_picker/docs/example.yml

@@ -48,8 +48,7 @@ examples:
   - date_picker_quick_pick_custom: Custom Quick Pick Dates
   - date_picker_quick_pick_custom_override: Custom Quick Pick Dates (append to defaults)
   - date_picker_quick_pick_default_date: Range (Quick Pick w/ Default Date)
-  # - date_picker_range_pattern: Range with 2 Date Pickers and a Quick Pick
-  - date_picker_and_dropdown_range: Range with Dropdown and 2 Date Pickers
+  - date_picker_range_pattern: Range with 2 Date Pickers and a Quick Pick
   - date_picker_format: Format
   - date_picker_disabled: Disabled Dates
   - date_picker_min_max: Min Max

data/app/pb_kits/playbook/pb_date_picker/docs/index.js

@@ -26,5 +26,4 @@ export { default as DatePickerOnClose } from './_date_picker_on_close.jsx'
 export { default as DatePickerQuickPickCustom } from './_date_picker_quick_pick_custom'
 export { default as DatePickerQuickPickCustomOverride } from './_date_picker_quick_pick_custom_override'
 export { default as DatePickerQuickPickDefaultDate } from './_date_picker_quick_pick_default_date'
-export { default as DatePickerRangePattern } from './_date_picker_range_pattern'
-export { default as DatePickerAndDropdownRange } from './_date_picker_and_dropdown_range.jsx'
+export { default as DatePickerRangePattern } from './_date_picker_range_pattern'

data/app/pb_kits/playbook/pb_dropdown/docs/example.yml

@@ -49,9 +49,4 @@ examples:
   - dropdown_clear_selection: Clear Selection
   - dropdown_separators_hidden: Separators Hidden
   - dropdown_with_external_control: useDropdown Hook
-  - dropdown_quickpick: Quick Pick Variant
-  - dropdown_quickpick_range_end: Quick Pick Variant (Range Ends Today)
-  - dropdown_quickpick_default_dates: Quick Pick Variant (Default Dates)
-  - dropdown_quickpick_with_date_pickers: Quick Pick Variant with Date Pickers
-
 

data/app/pb_kits/playbook/pb_dropdown/docs/index.js

@@ -22,8 +22,4 @@ export { default as DropdownMultiSelectWithDefault } from './_dropdown_multi_sel
 export { default as DropdownMultiSelectWithCustomOptions } from './_dropdown_multi_select_with_custom_options.jsx'
 export {default as DropdownWithCustomIconOptions} from './_dropdown_with_custom_icon_options.jsx'
 export {default as DropdownWithCustomRadioOptions} from './_dropdown_with_custom_radio_options.jsx'
-export {default as DropdownWithCustomActiveStyleOptions} from './_dropdown_with_custom_active_style_options.jsx'
-export { default as DropdownQuickpick } from './_dropdown_quickpick.jsx'
-export { default as DropdownQuickpickRangeEnd } from './_dropdown_quickpick_range_end.jsx'
-export { default as DropdownQuickpickDefaultDates } from './_dropdown_quickpick_default_dates.jsx'
-export { default as DropdownQuickpickWithDatePickers } from './_dropdown_quickpick_with_date_pickers.jsx'
+export {default as DropdownWithCustomActiveStyleOptions} from './_dropdown_with_custom_active_style_options.jsx'

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb

@@ -22,27 +22,13 @@
 }) %>
 
 <script>
-// Hide toasts immediately
-const hideAutoToasts = () => {
-  const toastAuto = document.getElementById('toast-auto-close');
-  const toastAutoCloseable = document.getElementById('toast-auto-close-closeable');
-  if (toastAuto) toastAuto.style.display = 'none';
-  if (toastAutoCloseable) toastAutoCloseable.style.display = 'none';
-}
-hideAutoToasts();
-
-// Handle various page load/restore events
-window.addEventListener('pageshow', hideAutoToasts)
-document.addEventListener('turbolinks:load', hideAutoToasts)
-document.addEventListener('turbo:load', hideAutoToasts)
-
 document.addEventListener('DOMContentLoaded', () => {
   // Initialize toast elements and buttons
   const toasts = {
     '#toast-auto-close': document.querySelector("#toast-auto-close"),
     '#toast-auto-close-closeable': document.querySelector("#toast-auto-close-closeable")
   }
-
+  
   const buttons = {
     '#toast-auto-close': document.querySelector("button[data-toast='#toast-auto-close']"),
     '#toast-auto-close-closeable': document.querySelector("button[data-toast='#toast-auto-close-closeable']")

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_multi_line.html.erb

@@ -24,6 +24,7 @@
   horizontal: "center"
 }) %>
 
+
 <script type="text/javascript">
   const multitoasts = document.querySelectorAll(".multitoast-to-hide")
   const multibuttons = document.querySelectorAll("button[data-multitoast]")
@@ -34,15 +35,6 @@
     })
   }
 
-  // Hide toasts immediately
-  hideMultiToasts()
-
-  // Handle various page load/restore events
-  window.addEventListener('pageshow', hideMultiToasts)
-  document.addEventListener('DOMContentLoaded', hideMultiToasts)
-  document.addEventListener('turbolinks:load', hideMultiToasts)
-  document.addEventListener('turbo:load', hideMultiToasts)
-
   multibuttons.forEach((button) => {
     button.onclick = () => {
       hideMultiToasts()
@@ -54,3 +46,10 @@
     }
   })
 </script>
+
+<!-- hiding toast on page load -->
+<style>
+  #toast-long, #toast-short {
+    display: none;
+  }
+</style>

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_positions.html.erb

@@ -69,28 +69,27 @@
   const toasts = document.querySelectorAll(".toast-to-hide")
   const buttons = document.querySelectorAll("button[data-toast]")
 
-  const hidePositionToasts = () => {
+  const hideToasts = () => {
     toasts.forEach((toast) => {
       toast.style.display = "none"
     })
   }
 
-  // Hide toasts immediately
-  hidePositionToasts()
-
-  // Handle various page load/restore events
-  window.addEventListener('pageshow', hidePositionToasts)
-  document.addEventListener('DOMContentLoaded', hidePositionToasts)
-  document.addEventListener('turbolinks:load', hidePositionToasts)
-  document.addEventListener('turbo:load', hidePositionToasts)
-
   buttons.forEach((button) => {
     button.onclick = () => {
-      hidePositionToasts()
+      hideToasts()
       let toast = document.querySelector(button.getAttribute("data-toast"))
+
       if (toast) {
         toast.style.display = "flex"
       }
     }
   })
 </script>
+
+<!-- hiding toast on page load -->
+<style>
+  #toast-top-center, #toast-top-right, #toast-top-left, #toast-bottom-center, #toast-bottom-right, #toast-bottom-left {
+    display: none;
+  }
+</style>

data/app/pb_kits/playbook/pb_flex/docs/_flex_item_example.jsx

@@ -15,7 +15,6 @@ const FlexItemExample = (props) => {
         <FlexItem
             displayFlex
             gap="xs"
-            htmlOptions={{style: {padding:"2px"}}}
             {...props}
         >
           <FlexItem>