playbook_ui 16.3.0.pre.alpha.PLAY2867nokogiriupdate14992 → 16.3.0.pre.alpha.fixdatepickermonthsdropdownreset14888

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7a934453945ff787fbf234ba65a31029dbe4da3a477ec76381c1a38cd5871099
-  data.tar.gz: 31b0328f60f47e8d8ffb886cfb6ddf227b70c78e5260a86f4eedc0e5d8fe05ab
+  metadata.gz: 3f5c3e22d3872b4b287c759a888ebc1b7d3ee7b9eeeb50d1262033cdb041231b
+  data.tar.gz: 7e6dca0282b5a4cb6faf9b9e30916259cf976d44b2bd283d689c0378738e881a
 SHA512:
-  metadata.gz: 42301e788730fd6ae8c36e8bfab0dc9d9713bb4686da1db56daf8b49dabda5ea3a548737caff0a87d1baf3756ceb8f1c63b4fa795af6ea800446978734c32aae
-  data.tar.gz: dd09282c15324927796fd1b25fa1b25db0c73ee7e26df22f9aa450dac6ebf1aef83d50a5620e470f132b732537674a1d26d6be19bba96102176501f78d70b113
+  metadata.gz: e6d79cf66190fe54c8d4c53d72b7afbc5cc37ffde9212d51ad9492c0d1ee52e294aeb9f7386f701d34f5a63a1a97282cbcaf56a65e1e0543ee7968fbd47b8487
+  data.tar.gz: 33fdb0d49f3577c1d2002b104e4df03e64c7ebe032e8b7f5c511c438e6fb1b9dec79c4fa3ee51c65638930ea5a2e98ee6af99d49c32c4def1d7c98f352454a69

data/app/pb_kits/playbook/pb_advanced_table/Hooks/useTableState.ts

@@ -12,7 +12,6 @@ import {
 import { GenericObject } from "../../types";
 import { createColumnHelper } from "@tanstack/react-table";
 import { createCellFunction } from "../Utilities/CellRendererUtils";
-import { getParentOnlySortedRowModel } from "../Utilities/RowModelUtils";
 
 interface UseTableStateProps {
   tableData: GenericObject[];
@@ -37,7 +36,6 @@ interface UseTableStateProps {
   columnVisibilityControl?: GenericObject;
   rowStyling?: GenericObject;
   inlineRowLoading?: boolean;
-  sortParentOnly?: boolean;
 }
 
 export function useTableState({
@@ -57,8 +55,7 @@ export function useTableState({
   columnVisibilityControl,
   pinnedRows,
   rowStyling,
-  inlineRowLoading = false,
-  sortParentOnly = false
+  inlineRowLoading = false
 }: UseTableStateProps) {
 
   // Create a local state for expanded and setExpanded if expandedControl not used
@@ -193,7 +190,7 @@ export function useTableState({
     getSubRows: (row: GenericObject) => row.children,
     getCoreRowModel: getCoreRowModel(),
     getExpandedRowModel: getExpandedRowModel(),
-    getSortedRowModel: sortParentOnly ? getParentOnlySortedRowModel() : getSortedRowModel(),
+    getSortedRowModel: getSortedRowModel(),
     enableSortingRemoval: enableSortingRemoval,
     sortDescFirst: true,
     onRowSelectionChange: setRowSelection,

data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx

@@ -66,7 +66,6 @@ type AdvancedTableProps = {
   showActionsBar?: boolean,
   persistToggleExpansionButton?: boolean,
   sortControl?: GenericObject
-  sortParentOnly?: boolean
   tableData: GenericObject[]
   tableOptions?: GenericObject
   tableProps?: GenericObject
@@ -115,7 +114,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
     selectableRows,
     persistToggleExpansionButton = false,
     sortControl,
-    sortParentOnly = false,
     stickyLeftColumn,
     tableData,
     tableOptions,
@@ -161,8 +159,7 @@ const AdvancedTable = (props: AdvancedTableProps) => {
     columnVisibilityControl,
     pinnedRows,
     rowStyling,
-    inlineRowLoading,
-    sortParentOnly
+    inlineRowLoading
   });
 
   // Initialize table actions

data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx

@@ -495,41 +495,7 @@ test("sort button exists and sorts column data", () => {
 
   const row2 = kit.getElementsByTagName('tr')[2]
   expect(row2.id).toBe("0-0-0-row")
-})
-
-test("sortParentOnly sorts only parent rows and keeps children grouped under parent", () => {
-  render(
-    <AdvancedTable
-        columnDefinitions={columnDefinitions}
-        data={{ testid: testId }}
-        sortParentOnly
-        tableData={MOCK_DATA}
-    >
-      <AdvancedTable.Header enableSorting />
-      <AdvancedTable.Body />
-    </AdvancedTable>
-  )
-
-  const kit = screen.getByTestId(testId)
-  const sortButton = kit.querySelector(".header-sort-button.pb_th_link")
-  expect(sortButton).toBeInTheDocument()
-
-  const tbody = kit.querySelector('tbody')
-  const rowsBefore = tbody.getElementsByTagName('tr')
-  expect(rowsBefore[0]).toHaveTextContent('2021')
-
-  sortButton.click()
-
-  const rowsAfter = tbody.getElementsByTagName('tr')
-  expect(rowsAfter[0]).toHaveTextContent('2022')
-
-  const expandButton = kit.querySelector(".gray-icon.expand-toggle-icon")
-  expandButton.click()
-
-  const rowsExpanded = tbody.getElementsByTagName('tr')
-  expect(rowsExpanded.length).toBeGreaterThan(1)
-  expect(rowsExpanded[1]).toHaveTextContent('Q1')
-})
+}) 
 
 test("Generates Table.Header default + custom classname", () => {
   render(

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

@@ -39,7 +39,6 @@ examples:
   - advanced_table_sort_per_column: Enable Sort By Column
   - advanced_table_sort_per_column_for_multi_column: Enable Sort By Column (Multi-Column)
   - advanced_table_custom_sort: Custom Sort
-  - advanced_table_sort_parent_only: Sort Parent Only
   - advanced_table_expanded_control: Expanded Control
   - advanced_table_expand_by_depth: Expand by Depth
   - advanced_table_subrow_headers: SubRow Headers

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

@@ -49,5 +49,4 @@ export { default as AdvancedTablePaddingControlPerRow } from './_advanced_table_
 export { default as AdvancedTableColumnStylingBackground } from './_advanced_table_column_styling_background.jsx'
 export { default as AdvancedTableColumnStylingBackgroundMulti } from './_advanced_table_column_styling_background_multi.jsx'
 export { default as AdvancedTableColumnStylingBackgroundCustom } from './_advanced_table_column_styling_background_custom.jsx'
-export { default as AdvancedTableCascadeCollapse } from './_advanced_table_cascade_collapse.jsx'
-export { default as AdvancedTableSortParentOnly } from './_advanced_table_sort_parent_only.jsx'
+export { default as AdvancedTableCascadeCollapse } from './_advanced_table_cascade_collapse.jsx'

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

@@ -33,7 +33,6 @@ examples:
   - dropdown_quickpick_with_date_pickers_rails: Quick Pick with Date Pickers
   - dropdown_quickpick_with_date_pickers_default_rails: Quick Pick with Date Pickers (Default Value)
   - dropdown_required_indicator: Required Indicator
-  - dropdown_custom_event_type: Custom Event Type
 
   react:
   - dropdown_default: Default

data/app/pb_kits/playbook/pb_dropdown/dropdown.rb

@@ -55,8 +55,6 @@ module Playbook
                               default: false
       prop :required_indicator, type: Playbook::Props::Boolean,
                                 default: false
-      prop :custom_event_type, type: Playbook::Props::String,
-                               default: ""
 
       def data
         Hash(prop(:data)).merge(
@@ -69,8 +67,7 @@ module Playbook
           start_date_id: variant == "quickpick" ? start_date_id : nil,
           end_date_id: variant == "quickpick" ? end_date_id : nil,
           controls_start_id: variant == "quickpick" && controls_start_id.present? ? controls_start_id : nil,
-          controls_end_id: variant == "quickpick" && controls_end_id.present? ? controls_end_id : nil,
-          custom_event_type: custom_event_type.presence
+          controls_end_id: variant == "quickpick" && controls_end_id.present? ? controls_end_id : nil
         ).compact
       end
 

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

@@ -95,25 +95,6 @@ export default class PbDropdown extends PbEnhancedElement {
       this.clearBtn.addEventListener("click", this.clearBtnHandler);
     }
     this.updateClearButton();
-
-    // Listen for clear and select events from external source
-    this.handleClearEventBound = this.handleClearEvent.bind(this);
-    document.addEventListener("pb:dropdown:clear", this.handleClearEventBound);
-    this.handleSelectEventBound = this.handleSelectEvent.bind(this);
-    document.addEventListener("pb:dropdown:select", this.handleSelectEventBound);
-
-    // Listen for custom_event_type to clear on custom events
-    const customEventTypeString = this.element.dataset.customEventType;
-    if (customEventTypeString) {
-      this.customClearEventTypes = customEventTypeString
-        .split(",")
-        .map((e) => e.trim())
-        .filter(Boolean);
-      this.handleCustomClearBound = this.handleCustomClearEvent.bind(this);
-      this.customClearEventTypes.forEach((eventType) => {
-        document.addEventListener(eventType, this.handleCustomClearBound);
-      });
-    }
   }
 
   disconnect() {
@@ -165,19 +146,6 @@ export default class PbDropdown extends PbEnhancedElement {
     if (this.clearBtn && this.clearBtnHandler) {
       this.clearBtn.removeEventListener('click', this.clearBtnHandler)
     }
-
-    // Clean up external clear/select listeners
-    if (this.handleClearEventBound) {
-      document.removeEventListener("pb:dropdown:clear", this.handleClearEventBound)
-    }
-    if (this.handleSelectEventBound) {
-      document.removeEventListener("pb:dropdown:select", this.handleSelectEventBound)
-    }
-    if (this.customClearEventTypes && this.handleCustomClearBound) {
-      this.customClearEventTypes.forEach((eventType) => {
-        document.removeEventListener(eventType, this.handleCustomClearBound)
-      })
-    }
   }
 
   updateClearButton() {
@@ -386,135 +354,6 @@ export default class PbDropdown extends PbEnhancedElement {
     }
   }
 
-  // ----- External events handling section -----
-  // Handles pb:dropdown:clear - clear this dropdown when event.detail.dropdownId matches.
-  handleClearEvent(event) {
-    const targetId = event.detail?.dropdownId;
-    if (targetId && this.element.id === targetId) {
-      this.clearSelection();
-    }
-  }
-
-  // Handles custom_event_type events (e.g. turbo:submit-end) - clear when detail.dropdownId matches or is omitted.
-  handleCustomClearEvent(event) {
-    const targetId = event.detail?.dropdownId;
-    if (targetId == null || this.element.id === targetId) {
-      this.clearSelection();
-    }
-  }
-
-  // Handles pb:dropdown:select - set dropdown selection by option id(s).
-  // Single: detail: { dropdownId, optionId }. Multi: detail: { dropdownId, optionIds: ['id1', 'id2'] }.
-  handleSelectEvent(event) {
-    const targetId = event.detail?.dropdownId;
-    if (!targetId || this.element.id !== targetId) return;
-
-    const optionId = event.detail?.optionId;
-    const optionIds = event.detail?.optionIds;
-    if (optionId != null) {
-      this.setSelectionByOptionId(optionId);
-    } else if (Array.isArray(optionIds)) {
-      this.setSelectionByOptionIds(optionIds);
-    }
-  }
-
-  // Set single-select dropdown to the option with the given id. No-op if id not found.
-  setSelectionByOptionId(optionId) {
-    if (this.isMultiSelect) return;
-    const hiddenInput = this.baseInput;
-    const optionEls = Array.from(this.element.querySelectorAll(OPTION_SELECTOR));
-    const selectedOption = optionEls.find((opt) => {
-      try {
-        return JSON.parse(opt.dataset.dropdownOptionLabel).id === optionId;
-      } catch {
-        return false;
-      }
-    });
-    if (!selectedOption) return;
-
-    optionEls.forEach((opt) => opt.classList.remove("pb_dropdown_option_selected"));
-    selectedOption.classList.add("pb_dropdown_option_selected");
-    if (hiddenInput) hiddenInput.value = optionId;
-    const optionData = JSON.parse(selectedOption.dataset.dropdownOptionLabel);
-    const customDisplayElement = this.element.querySelector(
-      '[data-dropdown-trigger-custom-display]',
-    );
-    if (customDisplayElement) {
-      this.setTriggerElementText("");
-      customDisplayElement.style.display = "block";
-      customDisplayElement.style.paddingRight = "8px";
-    } else {
-      this.setTriggerElementText(optionData.label);
-    }
-    if (this.searchInput) {
-      this.searchInput.value = optionData.label;
-    }
-
-    if (optionData.formatted_start_date && optionData.formatted_end_date) {
-      const startDateId = this.element.dataset.startDateId;
-      const endDateId = this.element.dataset.endDateId;
-      const controlsStartId = this.element.dataset.controlsStartId;
-      const controlsEndId = this.element.dataset.controlsEndId;
-      if (startDateId) {
-        const startDateInput = document.getElementById(startDateId);
-        if (startDateInput) startDateInput.value = optionData.formatted_start_date;
-      }
-      if (endDateId) {
-        const endDateInput = document.getElementById(endDateId);
-        if (endDateInput) endDateInput.value = optionData.formatted_end_date;
-      }
-      const syncDatePickers = () => {
-        if (controlsStartId) {
-          const startPicker = document.querySelector(`#${CSS.escape(controlsStartId)}`)?._flatpickr;
-          if (startPicker) startPicker.setDate(optionData.formatted_start_date, true, "m/d/Y");
-        }
-        if (controlsEndId) {
-          const endPicker = document.querySelector(`#${CSS.escape(controlsEndId)}`)?._flatpickr;
-          if (endPicker) endPicker.setDate(optionData.formatted_end_date, true, "m/d/Y");
-        }
-      };
-      syncDatePickers();
-      setTimeout(syncDatePickers, 100);
-      setTimeout(syncDatePickers, 300);
-    }
-
-    this.updateClearButton();
-    this.emitSelectionChange();
-  }
-
-  // Set multi-select dropdown to the options with the given ids. Invalid ids are skipped.
-  setSelectionByOptionIds(optionIds) {
-    if (!this.isMultiSelect || !optionIds.length) return;
-    const optionEls = Array.from(this.element.querySelectorAll(OPTION_SELECTOR));
-    this.selectedOptions.clear();
-    optionEls.forEach((opt) => {
-      opt.classList.remove("pb_dropdown_option_selected");
-      opt.style.display = "";
-    });
-
-    optionIds.forEach((id) => {
-      const opt = optionEls.find((o) => {
-        try {
-          return JSON.parse(o.dataset.dropdownOptionLabel).id === id;
-        } catch {
-          return false;
-        }
-      });
-      if (opt) {
-        const raw = opt.dataset.dropdownOptionLabel;
-        this.selectedOptions.add(raw);
-        opt.style.display = "none";
-      }
-    });
-
-    this.updatePills();
-    this.updateClearButton();
-    this.adjustDropdownHeight();
-    this.syncHiddenInputs();
-    this.emitSelectionChange();
-  }
-  // ----- End External events handling section -----
-
   isClickOutside(event) {
     const label = event.target.closest(LABEL_SELECTOR);
     if (label && this.element.contains(label)) return false;

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.scss

@@ -71,10 +71,6 @@ $confirmation_toast_colors: (
   }
 }
 
-.nav_margin_top {
-  margin-top: 49px;
-}
-
 .pb_fixed_confirmation_toast_kit_neutral,
 .pb_fixed_confirmation_toast_kit_neutral_multi_line {
   background: $text_lt_light;

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.tsx

@@ -26,7 +26,6 @@ type FixedConfirmationToastProps = {
   icon?: string,
   id?: string;
   multiLine?: boolean;
-  navMarginTop?: boolean;
   onClose?: VoidCallback;
   open?: boolean;
   status?: "success" | "error" | "neutral" | "tip";
@@ -48,7 +47,6 @@ const FixedConfirmationToast = (props: FixedConfirmationToastProps): React.React
     htmlOptions = {},
     icon,
     multiLine = false,
-    navMarginTop = false,
     onClose = () => undefined,
     open = true,
     status = "neutral",
@@ -63,7 +61,6 @@ const FixedConfirmationToast = (props: FixedConfirmationToastProps): React.React
   const css = classnames(
     `pb_fixed_confirmation_toast_kit_${status}${multiLine ? '_multi_line' : ''}`,
     { [`positioned_toast ${vertical} ${horizontal}`]: vertical && horizontal },
-    { [`nav_margin_top`]: navMarginTop },
     `${iconClass}`,
     globalProps(props, { zIndex }),
     className

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

@@ -2,7 +2,6 @@ examples:
   
   rails:
   - fixed_confirmation_toast_default: Default
-  - fixed_confirmation_toast_nav_margin: Nav Margin Top
   - fixed_confirmation_toast_multi_line: Multi Line
   - fixed_confirmation_toast_close: Click to Close
   - fixed_confirmation_toast_positions: Click to Show Positions
@@ -13,7 +12,6 @@ examples:
   
   react:
   - fixed_confirmation_toast_default: Default
-  - fixed_confirmation_toast_nav_margin: Nav Margin Top
   - fixed_confirmation_toast_multi_line: Multi Line
   - fixed_confirmation_toast_close: Click to Close
   - fixed_confirmation_toast_positions: Click to Show Positions

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

@@ -5,5 +5,4 @@ export { default as FixedConfirmationToastPositions } from './_fixed_confirmatio
 export { default as FixedConfirmationToastAutoClose } from './_fixed_confirmation_toast_auto_close.jsx'
 export { default as FixedConfirmationToastChildren } from './_fixed_confirmation_toast_children.jsx'
 export { default as FixedConfirmationToastCustomIcon } from './_fixed_confirmation_toast_custom_icon.jsx'
-export { default as FixedConfirmationToastNoIcon } from './_fixed_confirmation_toast_no_icon.jsx'
-export { default as FixedConfirmationToastNavMargin } from './_fixed_confirmation_toast_nav_margin.jsx'
+export { default as FixedConfirmationToastNoIcon } from './_fixed_confirmation_toast_no_icon.jsx'

data/app/pb_kits/playbook/pb_fixed_confirmation_toast/fixed_confirmation_toast.rb

@@ -21,8 +21,6 @@ module Playbook
                       default: nil
       prop :auto_close, type: Playbook::Props::Number
       prop :icon, type: Playbook::Props::String
-      prop :nav_margin_top, type: Playbook::Props::Boolean,
-                            default: false
 
       def show_text?
         text.present?
@@ -48,10 +46,6 @@ module Playbook
         Hash(prop(:data)).merge(auto_close_attribute)
       end
 
-      def nav_margin_top_class
-        nav_margin_top.present? ? " nav_margin_top" : ""
-      end
-
       def icon_value
         icon || case status
                 when "success"
@@ -71,7 +65,7 @@ module Playbook
 
       def classname
         default_z_index = z_index.present? ? "" : " z_index_max"
-        generate_classname("pb_fixed_confirmation_toast_kit", status, multi_line_class) + close_class + position_class + icon_class + nav_margin_top_class + default_z_index
+        generate_classname("pb_fixed_confirmation_toast_kit", status, multi_line_class) + close_class + position_class + icon_class + default_z_index
       end
     end
   end

data/app/pb_kits/playbook/pb_icon/icon.rb

@@ -112,13 +112,7 @@ module Playbook
       end
 
       def render_svg
-        source = asset_path || icon || custom_icon
-        content = if source.to_s.include?("://")
-                    URI.open(source, "User-Agent" => "Playbook-Icon-Kit/1.0 (https://github.com/powerhome/playbook)", &:read) # rubocop:disable Security/Open
-                  else
-                    URI.open(source, &:read) # rubocop:disable Security/Open
-                  end
-        doc = Nokogiri::XML(content)
+        doc = Nokogiri::XML(URI.open(asset_path || icon || custom_icon)) # rubocop:disable Security/Open
         svg = doc.at_css("svg")
         return "" unless svg