playbook_ui 16.8.0.pre.alpha.PLAY2945selectformblankselection16424 → 16.8.0.pre.alpha.tablewidths16466

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 051d8585a19ec6dbe0ad7a956006391f137fab3699a87ecdd8a72a31d064b581
-  data.tar.gz: 3abce6f7201b7db708d4fac79487a115f66827daa30a4cea1a0af61575309229
+  metadata.gz: 0f46fd7de41487efa37647c36cc3d1d55e2260ccda34ff0f094dc4f3c21608c4
+  data.tar.gz: 60e1b0388423c2a75088ba9210b0e9456c27fb7a7b5822b5753f1c46f1abfa53
 SHA512:
-  metadata.gz: c0974744f65ce5e1ec6baa822ed4adc1e763eedfc85c470e8ba7181c3651a4a685d45c4cfb93082558de059d7744438f2ce82929ebc5a9c04023b1105c0935d0
-  data.tar.gz: 44d6e614f5dcc91a0e7bbfd1a2e85a28e98c8e14994aac336d2cb3b3efccbed609706057455888cc4ad36fa76fbe11c6c4e06121cc8f35b4725b77b1f90a2a11
+  metadata.gz: 236bb6ec1f254c88d37bfa99aa2bb530aba234550a5635bfd19c9bb76fe0240bf818ccd4f2b859424662c2e15d1f31cae47d0831e172a9c2926e1eaa4cf3ade7
+  data.tar.gz: 63776f5d3b77b41da7a95ad4d67e89d244a0981fb8cc2220c3fc8996f5506eb2b4f94cf30989d848afc83d2104dbe17092e00851e4b4cd46ebd5a63985ddb543

data/app/pb_kits/playbook/pb_advanced_table/Components/RegularTableView.tsx

@@ -5,6 +5,7 @@ import { flexRender, Row, Cell } from "@tanstack/react-table"
 import { GenericObject } from "../../types"
 import { isChrome } from "../Utilities/BrowserCheck"
 import { findColumnDefByAccessor } from "../Utilities/ColumnStylingHelper"
+import { playbookColumnLayoutStylesFromMeta } from "../Utilities/ColumnLayoutHelper"
 import { getRowColorClass, shouldShowLoadingIndicator } from "../Utilities/RowUtils"
 
 import LoadingInline from "../../pb_loading_inline/_loading_inline"
@@ -94,6 +95,7 @@ const TableCellRenderer = ({
               )}
               key={`${cell.id}-data`}
               style={{
+                ...playbookColumnLayoutStylesFromMeta(column.columnDef),
                 left: isPinnedLeft
                   ? i === 1 // Accounting for set min-width for first column
                     ? '180px'

data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx

@@ -16,6 +16,7 @@ import { SortIconButton } from "./SortIconButton"
 import { ToggleIconButton } from "./ToggleIconButton"
 import { displayIcon } from "../Utilities/IconHelpers"
 import { findColumnDefByAccessor } from "../Utilities/ColumnStylingHelper"
+import { playbookColumnLayoutStylesFromMeta } from "../Utilities/ColumnLayoutHelper"
 import { updateExpandAndCollapseState } from "../Utilities/ExpansionControlHelpers"
 
 import { isChrome } from "../Utilities/BrowserCheck"
@@ -198,6 +199,7 @@ const isToggleExpansionEnabled =
         id={cellId}
         key={`${header?.id}-header`}
         style={{
+          ...playbookColumnLayoutStylesFromMeta(header?.column?.columnDef),
           backgroundColor: headerBackgroundColor,
           color: headerFontColor,
           left: isPinnedLeft

data/app/pb_kits/playbook/pb_advanced_table/Components/VirtualizedTableView.tsx

@@ -19,6 +19,7 @@ import { LoadingCell } from "../Components/LoadingCell"
 import { renderCollapsibleTrail } from "../Components/CollapsibleTrail"
 
 import AdvancedTableContext from "../Context/AdvancedTableContext"
+import { playbookColumnLayoutStylesFromMeta } from "../Utilities/ColumnLayoutHelper"
 
 type VirtualizedTableViewProps = {
   collapsibleTrail?: boolean
@@ -224,7 +225,10 @@ export const VirtualizedTableView = ({
                         isLastCell && 'last-cell',
                       )}
                       key={`${cell.id}-data`}
-                      style={{ width: cellWidth }}
+                      style={{
+                        ...playbookColumnLayoutStylesFromMeta(cell.column.columnDef),
+                        width: cellWidth,
+                      }}
                   >
                     {collapsibleTrail && i === 0 && row.depth > 0 && renderCollapsibleTrail(row.depth)}
                     <span id={`${cell.id}-span`}>

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

@@ -12,6 +12,10 @@ import {
 import { GenericObject } from "../../types";
 import { createColumnHelper } from "@tanstack/react-table";
 import { createCellFunction } from "../Utilities/CellRendererUtils";
+import {
+  buildPlaybookColumnLayoutStyles,
+  buildTanStackSizingFromColumn,
+} from "../Utilities/ColumnLayoutHelper";
 import { getParentOnlySortedRowModel } from "../Utilities/RowModelUtils";
 
 interface UseTableStateProps {
@@ -105,11 +109,31 @@ export function useTableState({
           columns: buildColumns(column.columns, false),
         };
       }
+      const tanStackSizing = buildTanStackSizingFromColumn(column);
+      const layoutStyles = buildPlaybookColumnLayoutStyles(column, tanStackSizing);
+      const userMeta =
+        column.meta &&
+        typeof column.meta === "object" &&
+        !Array.isArray(column.meta)
+          ? column.meta
+          : {};
+      const hasLayoutStyles =
+        layoutStyles.width !== undefined ||
+        layoutStyles.minWidth !== undefined ||
+        layoutStyles.maxWidth !== undefined;
+
       // Define the base column structure
       const columnStructure = {
         ...columnHelper.accessor(column.accessor, {
           header: column.header ?? column.label ?? "",
           enableSorting: isFirstColumn || column.enableSort === true,
+          ...tanStackSizing,
+          meta: {
+            ...userMeta,
+            ...(hasLayoutStyles
+              ? { playbookColumnLayoutStyles: layoutStyles }
+              : {}),
+          },
         }),
       };
 

data/app/pb_kits/playbook/pb_advanced_table/Utilities/ColumnLayoutHelper.ts

@@ -0,0 +1,138 @@
+import type { CSSProperties } from "react"
+
+import { GenericObject } from "../../types"
+
+/**
+ * Converts a Playbook column width value to a CSS length string.
+ * Numbers are treated as pixels; strings are passed through (e.g. `"12rem"`, `"200px"`).
+ */
+export function cssLength(
+  value: number | string | undefined | null
+): string | undefined {
+  if (value === undefined || value === null || value === "") return undefined
+  if (typeof value === "number" && Number.isFinite(value)) return `${value}px`
+  return String(value)
+}
+
+const columnStylingKeys = (column: GenericObject) =>
+  (column.columnStyling || column.column_styling || {}) as GenericObject
+
+function readStylingLength(
+  styling: GenericObject,
+  camel: string,
+  snake?: string
+): string | number | undefined {
+  if (snake) return styling[camel] ?? styling[snake]
+  return styling[camel] as string | number | undefined
+}
+
+/**
+ * TanStack Table v8 `ColumnDef` sizing fields we forward from each `columnDefinitions` entry.
+ * See AdvancedTable kit docs for precedence with `columnStyling` width keys.
+ */
+export const PLAYBOOK_FORWARDED_COLUMN_DEF_SIZING_KEYS = [
+  "size",
+  "minSize",
+  "maxSize",
+] as const
+
+export type PlaybookForwardedColumnSizing = Partial<
+  Record<(typeof PLAYBOOK_FORWARDED_COLUMN_DEF_SIZING_KEYS)[number], number>
+>
+
+export function buildTanStackSizingFromColumn(
+  column: GenericObject
+): PlaybookForwardedColumnSizing {
+  const out: PlaybookForwardedColumnSizing = {}
+  PLAYBOOK_FORWARDED_COLUMN_DEF_SIZING_KEYS.forEach((key) => {
+    const v = column[key]
+    if (typeof v === "number" && Number.isFinite(v)) out[key] = v
+  })
+
+  const styling = columnStylingKeys(column)
+
+  if (out.size === undefined && readStylingLength(styling, "width") !== undefined) {
+    const w = readStylingLength(styling, "width")
+    if (typeof w === "number" && Number.isFinite(w)) out.size = w
+  }
+  if (out.minSize === undefined && readStylingLength(styling, "minWidth", "min_width") !== undefined) {
+    const w = readStylingLength(styling, "minWidth", "min_width")
+    if (typeof w === "number" && Number.isFinite(w)) out.minSize = w
+  }
+  if (out.maxSize === undefined && readStylingLength(styling, "maxWidth", "max_width") !== undefined) {
+    const w = readStylingLength(styling, "maxWidth", "max_width")
+    if (typeof w === "number" && Number.isFinite(w)) out.maxSize = w
+  }
+
+  // width/size only → fixed column (min and max match preferred)
+  if (out.size !== undefined && out.minSize === undefined && out.maxSize === undefined) {
+    out.minSize = out.size
+    out.maxSize = out.size
+  }
+
+  return out
+}
+
+/**
+ * Inline width styles for `<th>` / `<td>` so `table-layout: fixed` tables keep stable
+ * columns when row content changes (e.g. expand/collapse). Values mirror TanStack sizing
+ * and/or `columnStyling` width keys; string values in `columnStyling` win over numeric
+ * TanStack fields when both describe the same axis.
+ */
+export function buildPlaybookColumnLayoutStyles(
+  column: GenericObject,
+  tanStackSizing: PlaybookForwardedColumnSizing
+): CSSProperties {
+  const styling = columnStylingKeys(column)
+  const styles: CSSProperties = {}
+
+  const stylingWidth = readStylingLength(styling, "width")
+  const stylingMin = readStylingLength(styling, "minWidth", "min_width")
+  const stylingMax = readStylingLength(styling, "maxWidth", "max_width")
+
+  const hasStylingWidth = stylingWidth !== undefined && stylingWidth !== ""
+  const hasStylingMin = stylingMin !== undefined && stylingMin !== ""
+  const hasStylingMax = stylingMax !== undefined && stylingMax !== ""
+
+  let widthValue: string | number | undefined = hasStylingWidth
+    ? stylingWidth
+    : tanStackSizing.size
+  let minValue: string | number | undefined = hasStylingMin
+    ? stylingMin
+    : tanStackSizing.minSize
+  let maxValue: string | number | undefined = hasStylingMax
+    ? stylingMax
+    : tanStackSizing.maxSize
+
+  const preferredForLock = hasStylingWidth ? stylingWidth : tanStackSizing.size
+  const explicitMin = hasStylingMin || tanStackSizing.minSize !== undefined
+  const explicitMax = hasStylingMax || tanStackSizing.maxSize !== undefined
+
+  if (
+    preferredForLock !== undefined &&
+    preferredForLock !== "" &&
+    !explicitMin &&
+    !explicitMax
+  ) {
+    minValue = preferredForLock
+    maxValue = preferredForLock
+    widthValue = preferredForLock
+  }
+
+  const widthCss = cssLength(widthValue)
+  const minCss = cssLength(minValue)
+  const maxCss = cssLength(maxValue)
+
+  if (widthCss !== undefined) styles.width = widthCss
+  if (minCss !== undefined) styles.minWidth = minCss
+  if (maxCss !== undefined) styles.maxWidth = maxCss
+
+  return styles
+}
+
+export function playbookColumnLayoutStylesFromMeta(
+  columnDef: GenericObject | undefined
+): CSSProperties {
+  const meta = columnDef?.meta as GenericObject | undefined
+  return (meta?.playbookColumnLayoutStyles || {}) as CSSProperties
+}

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

@@ -774,6 +774,150 @@ test("columnStyling.cellPadding sets cell padding", () => {
   expect(firstEnrollmentCell).toHaveClass('p_none')
 });
 
+test("columnStyling minWidth, width, and maxWidth apply to header and body cells", () => {
+  const styledColumnDefs = [
+    {
+      accessor: "year",
+      label: "Year",
+      cellAccessors: ["quarter", "month", "day"],
+      columnStyling: { minWidth: 240, width: 260, maxWidth: 400 },
+    },
+    {
+      accessor: "newEnrollments",
+      label: "New Enrollments",
+    },
+    {
+      accessor: "scheduledMeetings",
+      label: "Scheduled Meetings",
+    },
+  ];
+
+  render(
+    <AdvancedTable
+        columnDefinitions={styledColumnDefs}
+        data={{ testid: testId }}
+        tableData={MOCK_DATA}
+    />
+  );
+
+  const yearHeader = screen.getByText("Year").closest("th");
+  expect(yearHeader).toHaveStyle({ minWidth: "240px", width: "260px", maxWidth: "400px" });
+
+  const yearCell = screen.getAllByText("2021")[0].closest("td");
+  expect(yearCell).toHaveStyle({ minWidth: "240px", width: "260px", maxWidth: "400px" });
+});
+
+test("columnStyling width only locks minWidth and maxWidth to the same value", () => {
+  const styledColumnDefs = [
+    {
+      accessor: "year",
+      label: "Year",
+      cellAccessors: ["quarter", "month", "day"],
+      columnStyling: { width: 128 },
+    },
+    {
+      accessor: "newEnrollments",
+      label: "New Enrollments",
+    },
+    {
+      accessor: "scheduledMeetings",
+      label: "Scheduled Meetings",
+    },
+  ];
+
+  render(
+    <AdvancedTable
+        columnDefinitions={styledColumnDefs}
+        data={{ testid: testId }}
+        tableData={MOCK_DATA}
+    />
+  );
+
+  const yearHeader = screen.getByText("Year").closest("th");
+  expect(yearHeader).toHaveStyle({
+    width: "128px",
+    minWidth: "128px",
+    maxWidth: "128px",
+  });
+});
+
+test("columnDefinitions size only locks minSize and maxSize to the same value", () => {
+  const styledColumnDefs = [
+    {
+      accessor: "year",
+      label: "Year",
+      cellAccessors: ["quarter", "month", "day"],
+    },
+    {
+      accessor: "newEnrollments",
+      label: "New Enrollments",
+      size: 200,
+    },
+    {
+      accessor: "scheduledMeetings",
+      label: "Scheduled Meetings",
+    },
+  ];
+
+  render(
+    <AdvancedTable
+        columnDefinitions={styledColumnDefs}
+        data={{ testid: testId }}
+        tableData={MOCK_DATA}
+    />
+  );
+
+  const enrollmentsHeader = screen.getByText("New Enrollments").closest("th");
+  expect(enrollmentsHeader).toHaveStyle({
+    width: "200px",
+    minWidth: "200px",
+    maxWidth: "200px",
+  });
+});
+
+test("columnDefinitions size, minSize, and maxSize apply layout styles", () => {
+  const styledColumnDefs = [
+    {
+      accessor: "year",
+      label: "Year",
+      cellAccessors: ["quarter", "month", "day"],
+    },
+    {
+      accessor: "newEnrollments",
+      label: "New Enrollments",
+      size: 180,
+      minSize: 160,
+      maxSize: 320,
+    },
+    {
+      accessor: "scheduledMeetings",
+      label: "Scheduled Meetings",
+    },
+  ];
+
+  render(
+    <AdvancedTable
+        columnDefinitions={styledColumnDefs}
+        data={{ testid: testId }}
+        tableData={MOCK_DATA}
+    />
+  );
+
+  const enrollmentsHeader = screen.getByText("New Enrollments").closest("th");
+  expect(enrollmentsHeader).toHaveStyle({
+    width: "180px",
+    minWidth: "160px",
+    maxWidth: "320px",
+  });
+
+  const enrollmentsCell = screen.getAllByText("20")[0].closest("td");
+  expect(enrollmentsCell).toHaveStyle({
+    width: "180px",
+    minWidth: "160px",
+    maxWidth: "320px",
+  });
+});
+
 test("columnStyling.fontColor sets cell font color", () => {
   const styledColumnDefs = [
     {

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

@@ -10,6 +10,7 @@ const AdvancedTableColumnStyling = (props) => {
       accessor: "year",
       label: "Year",
       cellAccessors: ["quarter", "month", "day"],
+      columnStyling: { width: 124 },
     },
     {
       accessor: "newEnrollments",

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.md

@@ -6,4 +6,10 @@ The `columnStyling` prop is an optional item that can be used within `columnDefi
 
 3) `fontColor`: This will allow you to control the font color for a given column.
 
+4) Column width: optional keys on `columnStyling` are `minWidth`, `width`, and `maxWidth` (numbers = pixels; CSS strings allowed). This example sets `width` on Year for a fixed hierarchy column (see the width doc for `minWidth` and bands).
+
+Fixed width: pass `width` only (or TanStack `size` only) and Playbook sets min and max to the same value automatically — you do not need all three for an exact width.
+
+See [Column Styling: Width](https://playbook.powerapp.cloud/kits/advanced_table/react#column-styling-width) for the full guide (Playbook ↔ TanStack mapping, floor-only vs bands, and when to use one vs three values).
+
 `columnStyling` can be used within the columnDefinition of all the columns or some of them, as shown. Each column has its own individual control in this way. 

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

@@ -0,0 +1,57 @@
+import React from "react"
+import AdvancedTable from "../_advanced_table"
+import MOCK_DATA from "./advanced_table_mock_data.json"
+
+/**
+ * Kit doc: compares fixed width, floor-only, TanStack band, and min/preferred/max band.
+ */
+const AdvancedTableColumnStylingWidth = (props) => {
+  const columnDefinitions = [
+    {
+      accessor: "year",
+      label: "Year (fixed)",
+      cellAccessors: ["quarter", "month", "day"],
+      // width alone locks min + max to the same value (128px).
+      columnStyling: { width: 128 },
+    },
+    {
+      accessor: "newEnrollments",
+      label: "Enrollments (floor)",
+      columnStyling: { minWidth: 160 },
+    },
+    {
+      accessor: "scheduledMeetings",
+      label: "Meetings (TanStack band)",
+      size: 200,
+      minSize: 160,
+      maxSize: 240,
+    },
+    {
+      accessor: "attendanceRate",
+      label: "Attendance (min / pref / max)",
+      columnStyling: { minWidth: 108, width: 124, maxWidth: 168 },
+    },
+    {
+      accessor: "completedClasses",
+      label: "Completed",
+    },
+    {
+      accessor: "classCompletionRate",
+      label: "Completion %",
+    },
+    {
+      accessor: "graduatedStudents",
+      label: "Graduated",
+    },
+  ]
+
+  return (
+    <AdvancedTable
+        columnDefinitions={columnDefinitions}
+        tableData={MOCK_DATA}
+        {...props}
+    />
+  )
+}
+
+export default AdvancedTableColumnStylingWidth

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.md

@@ -0,0 +1,66 @@
+AdvancedTable column width is controlled in two equivalent places on each leaf `columnDefinitions` entry. Playbook maps them to inline styles on header and body cells (and forwards numeric values into TanStack Table’s column model).
+
+1) Playbook `columnStyling` and TanStack `ColumnDef` use the same three ideas:
+
+- Preferred / target width: `columnStyling` `width` maps to TanStack `size` on the same column object.
+- Minimum width (floor): `columnStyling` `minWidth` maps to TanStack `minSize`.
+- Maximum width (ceiling): `columnStyling` `maxWidth` maps to TanStack `maxSize`.
+
+Numbers are pixels. You can also pass CSS length strings on `columnStyling` (e.g. `"12rem"`, `"200px"`). TanStack fields accept numbers only.
+
+If both APIs set the same axis, `columnStyling` wins for that axis when Playbook builds cell styles.
+
+2) Fixed width: set `width` only
+
+If you pass only `width` (or only `size`) and do not set `minWidth` / `maxWidth` (or `minSize` / `maxSize`), Playbook treats that as a fixed column: it sets all three to the same value under the hood so you do not have to repeat yourself.
+
+```jsx
+columnStyling: { width: 128 }
+// Applied as width, minWidth, and maxWidth: 128px
+```
+
+```jsx
+size: 200
+// Forwarded as size, minSize, and maxSize: 200
+```
+
+Use this when the column should stay one width (e.g. a hierarchy column with expand controls).
+
+3) Floor only: `minWidth` / `minSize`
+
+Set only a minimum when the column may grow with the table or content but must not shrink below a baseline (common fix for horizontal “jump” when rows expand):
+
+```jsx
+columnStyling: { minWidth: 160 }
+```
+
+4) Flexible band: min + preferred + max
+
+Set two or three values when you want a range. CSS uses preferred `width` clamped between `minWidth` and `maxWidth`:
+
+- `minWidth`: won’t shrink below this.
+- `width`: preferred size when space allows.
+- `maxWidth`: won’t grow above this.
+
+Example from the table below (Attendance): `minWidth: 108`, `width: 124`, `maxWidth: 168` → preferred 124px, allowed between 108 and 168.
+
+You only need all three when you want that band. If min and max are omitted, `width` alone is enough for a fixed column.
+
+5) TanStack band without `columnStyling`
+
+The Meetings column uses only TanStack fields:
+
+```jsx
+{ accessor: "scheduledMeetings", size: 200, minSize: 160, maxSize: 240 }
+```
+
+Playbook applies the same min / preferred / max idea to cell styles. Setting only `size: 200` would lock all three to 200, same as `width: 200` in `columnStyling`.
+
+6) What the example table shows
+
+- Year (fixed): `columnStyling: { width: 128 }` — locked to 128px.
+- Enrollments (floor): `columnStyling: { minWidth: 160 }` — at least 160px; can grow.
+- Meetings (TanStack band): `size` / `minSize` / `maxSize` — preferred 200px, between 160–240.
+- Attendance (min / pref / max): all three in `columnStyling` — preferred 124px, between 108–168.
+
+Grouped columns: put width options on leaf definitions (columns with an `accessor`), not on parent group headers.

data/app/pb_kits/playbook/pb_advanced_table/docs/_playground.json

@@ -313,7 +313,7 @@
     },
     "column_styling_info": {
       "presetName": "Column Styling",
-      "message": "This sample uses columnStyling on column definitions. You can style headers and cells for the whole table or per column.",
+      "message": "This sample uses columnStyling on column definitions. Year uses width for a fixed hierarchy column; other columns show background colors. See the Column Styling Width doc for minWidth and min/pref/max bands.",
       "type": "info"
     }
   },
@@ -2628,7 +2628,10 @@
               "quarter",
               "month",
               "day"
-            ]
+            ],
+            "columnStyling": {
+              "width": 124
+            }
           },
           {
             "accessor": "newEnrollments",

data/app/pb_kits/playbook/pb_advanced_table/docs/_playground.overrides.json

@@ -371,7 +371,7 @@
     },
     "column_styling_info": {
       "presetName": "Column Styling",
-      "message": "This sample uses columnStyling on column definitions. You can style headers and cells for the whole table or per column.",
+      "message": "This sample uses columnStyling on column definitions. Year uses width for a fixed hierarchy column; other columns show background colors. See the Column Styling Width doc for minWidth and min/pref/max bands.",
       "type": "info"
     }
   }

data/app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_column_definitions_styling.json

@@ -2,7 +2,10 @@
   {
     "accessor": "year",
     "label": "Year",
-    "cellAccessors": ["quarter", "month", "day"]
+    "cellAccessors": ["quarter", "month", "day"],
+    "columnStyling": {
+      "width": 124
+    }
   },
   {
     "accessor": "newEnrollments",

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

@@ -80,6 +80,7 @@ examples:
   - advanced_table_row_styling: Row Styling
   - advanced_table_padding_control_per_row: Padding Control using Row Styling
   - advanced_table_column_styling: Column Styling
+  - advanced_table_column_styling_width: Column Styling Width
   - advanced_table_column_styling_column_headers: Column Styling with Multiple Headers
   - advanced_table_column_styling_background: Column Styling Background Color
   - advanced_table_column_styling_background_custom: Column Styling Background Color (Custom)

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

@@ -37,6 +37,7 @@ export { default as AdvancedTablePinnedRows } from './_advanced_table_pinned_row
 export { default as AdvancedTableScrollbarNone} from './_advanced_table_scrollbar_none.jsx'
 export { default as AdvancedTableRowStyling } from './_advanced_table_row_styling.jsx'
 export { default as AdvancedTableColumnStyling } from './_advanced_table_column_styling.jsx'
+export { default as AdvancedTableColumnStylingWidth } from './_advanced_table_column_styling_width.jsx'
 export { default as AdvancedTableColumnStylingColumnHeaders } from './_advanced_table_column_styling_column_headers.jsx'
 export { default as AdvancedTableInfiniteScroll} from './_advanced_table_infinite_scroll.jsx'
 export {default as AdvancedTableWithCustomHeader} from './_advanced_table_with_custom_header.jsx'

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

@@ -1,7 +1,6 @@
 examples:
 
   rails:
-  - form_form_with_select_examples: Select Examples
   - form_form_with: Default
   - form_form_with_validate: Default + Validation
   - form_form_with_validation_msg: Validation + Custom Validation Message

data/dist/chunks/vendor.js

@@ -18,7 +18,7 @@ import{r as requireLazysizes}from"./lazysizes-B7xYodB-.js";import{c as Draggable
    * LICENSE.md file in the root directory of this source tree.
    *
    * @license MIT
-   */function flexRender(Comp,props){return!Comp?null:isReactComponent(Comp)?React.createElement(Comp,props):Comp}function isReactComponent(component){return isClassComponent(component)||typeof component==="function"||isExoticComponent(component)}function isClassComponent(component){return typeof component==="function"&&(()=>{const proto=Object.getPrototypeOf(component);return proto.prototype&&proto.prototype.isReactComponent})()}function isExoticComponent(component){return typeof component==="object"&&typeof component.$$typeof==="symbol"&&["react.memo","react.forward_ref"].includes(component.$$typeof.description)}function useReactTable(options){const resolvedOptions={state:{},onStateChange:()=>{},renderFallbackValue:null,...options};const[tableRef]=React.useState((()=>({current:createTable(resolvedOptions)})));const[state,setState]=React.useState((()=>tableRef.current.initialState));tableRef.current.setOptions((prev=>({...prev,...options,state:{...state,...options.state},onStateChange:updater=>{setState(updater);options.onStateChange==null||options.onStateChange(updater)}})));return tableRef.current}const displayIcon=icon=>{if(typeof icon==="string"){return[icon,icon]}return icon};const SortIconButton=({header:header,sortIcon:sortIcon,enableSortingRemoval:enableSortingRemoval})=>{const firstIcon=displayIcon(sortIcon)[0];const secondIcon=displayIcon(sortIcon)[1];return jsxs(Fragment,{children:[header.column.getIsSorted()==="desc"&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:firstIcon})},firstIcon),header.column.getIsSorted()==="asc"&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:secondIcon})},secondIcon),header.column.getIsSorted()===false&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:enableSortingRemoval?"arrow-up-arrow-down":secondIcon})},enableSortingRemoval?"arrow-up-arrow-down":secondIcon)]})};const ToggleIconButton=({row:row,onClick:onClick})=>{const{toggleExpansionIcon:toggleExpansionIcon}=useContext(AdvancedTableContext);return jsx("button",{className:"gray-icon toggle-all-icon",onClick:()=>onClick(row),children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:displayIcon(toggleExpansionIcon)[0]})},displayIcon(toggleExpansionIcon)[0])};const findColumnDefByAccessor=(defs,targetAccessor)=>{for(const def of defs){if(def.accessor===targetAccessor){return def}if(Array.isArray(def.columns)&&def.columns.length){const found=findColumnDefByAccessor(def.columns,targetAccessor);if(found)return found}}return void 0};const filterExpandableRows=expandedState=>{for(const expandedRow in expandedState){if(expandedState[expandedRow]===false){delete expandedState[expandedRow]}}return expandedState};const getDescendantRowIds=row=>{const ids=[];for(const sub of row.subRows||[]){ids.push(sub.id);ids.push(...getDescendantRowIds(sub))}return ids};const updateExpandAndCollapseState=(tableRows,expanded,targetParent,targetDepth,cascadeCollapse)=>{const updateExpandedRows={};const rows=targetDepth!==void 0?tableRows.flatRows:tableRows.rows;const rowsToToggle=[];for(const row of rows){const shouldBeUpdated=targetDepth!==void 0?row.depth<=targetDepth:targetParent===void 0?row.depth===0:targetParent===row.parentId;if(shouldBeUpdated){rowsToToggle.push(row)}}const anyCollapsed=rowsToToggle.some((row=>!row.getIsExpanded()));const isExpandAction=anyCollapsed;for(const row of rowsToToggle){const shouldUpdate=isExpandAction||targetDepth===void 0?true:row.depth===targetDepth;if(shouldUpdate){updateExpandedRows[row.id]=isExpandAction}}const updatedExpandedState=filterExpandableRows({...expanded,...updateExpandedRows});if(cascadeCollapse&&!isExpandAction){const idsToRemove=new Set;for(const row of rowsToToggle){const shouldUpdate=targetDepth===void 0?true:row.depth===targetDepth;if(shouldUpdate){getDescendantRowIds(row).forEach((id=>idsToRemove.add(id)))}}idsToRemove.forEach((id=>delete updatedExpandedState[id]))}return updatedExpandedState};const isChrome=()=>{const userAgent=navigator.userAgent.toLowerCase();return userAgent.includes("chrome")&&!userAgent.includes("edg")};const TableHeaderCell=({enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:headerChildren,isPinnedLeft:isPinnedLeft=false,loading:loading,sortIcon:sortIcon,table:table})=>{var _a,_b,_c,_d,_e,_f;const{columnDefinitions:columnDefinitions,expanded:expanded,setExpanded:setExpanded,expandByDepth:expandByDepth,enableSortingRemoval:enableSortingRemoval,onExpandByDepthClick:onExpandByDepthClick,toggleExpansionIcon:toggleExpansionIcon,sortControl:sortControl,responsive:responsive,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,showActionsBar:showActionsBar,persistToggleExpansionButton:persistToggleExpansionButton,stickyLeftColumn:stickyLeftColumn,inlineRowLoading:inlineRowLoading,isActionBarVisible:isActionBarVisible,cascadeCollapse:cascadeCollapse}=useContext(AdvancedTableContext);const toggleSortButton=event=>{if(sortControl){const sortIsDesc=(header==null?void 0:header.column.getIsSorted())==="desc";sortIsDesc?sortControl.onChange({desc:true}):sortControl.onChange({desc:false})}else{header==null?void 0:header.column.getToggleSortingHandler()(event)}};const alignmentMap={left:"start",center:"center",right:"end"};const colDef=header?findColumnDefByAccessor(columnDefinitions,header.column.id):void 0;const headerAlignment=((_a=colDef==null?void 0:colDef.columnStyling)==null?void 0:_a.headerAlignment)??((_b=colDef==null?void 0:colDef.columnStyling)==null?void 0:_b.headerAligment);const headerBackgroundColor=(_c=colDef==null?void 0:colDef.columnStyling)==null?void 0:_c.headerBackgroundColor;const headerFontColor=(_d=colDef==null?void 0:colDef.columnStyling)==null?void 0:_d.headerFontColor;const isLeafColumn=(header==null?void 0:header.column.getLeafColumns().length)===1&&(header==null?void 0:header.column.getLeafColumns()[0].id)===header.column.id;const columnHasVisibleLeaf=col=>{var _a2;return((_a2=col.getIsVisible)==null?void 0:_a2.call(col))||Array.isArray(col.columns)&&col.columns.some((child=>columnHasVisibleLeaf(child)))};const isLastHeaderCell=(()=>{var _a2;if(!header)return false;if(header.colSpan>1&&header.column.parent!==void 0)return true;const parent=header.column.parent;if(!parent){const topHeaders=table==null?void 0:table.getHeaderGroups()[0].headers.filter((h2=>columnHasVisibleLeaf(h2.column)));return((_a2=topHeaders==null?void 0:topHeaders.at(-1))==null?void 0:_a2.id)===header.id}const visibleSiblings=parent.columns.filter(columnHasVisibleLeaf);return visibleSiblings.at(-1)===header.column})();const cellClassName=classnames("table-header-cells",`${showActionsBar&&isActionBarVisible&&"header-cells-with-actions"}`,`${isChrome()?"chrome-styles":""}`,`${enableSorting?"table-header-cells-active":""}`,{"pinned-left":responsive==="scroll"&&isPinnedLeft},isLastHeaderCell?"last-header-cell":"",stickyLeftColumn&&stickyLeftColumn.length>0&&isPinnedLeft?"sticky-left":"",((_e=colDef==null?void 0:colDef.columnStyling)==null?void 0:_e.headerPadding)&&`p_${(_f=colDef==null?void 0:colDef.columnStyling)==null?void 0:_f.headerPadding}`);const cellId=`${loading?`loading-${header==null?void 0:header.id}`:`${header==null?void 0:header.id}`}`;const isToggleExpansionEnabledLoading=(header==null?void 0:header.index)===0&&loading&&(enableToggleExpansion==="all"||"header")&&enableToggleExpansion!=="none";const isToggleExpansionEnabled=(header==null?void 0:header.index)===0&&!loading&&(enableToggleExpansion==="all"||"header")&&enableToggleExpansion!=="none";let justifyHeader;if(headerAlignment&&alignmentMap[headerAlignment]){justifyHeader=alignmentMap[headerAlignment]}else if((header==null?void 0:header.index)===0&&hasAnySubRows||(header==null?void 0:header.index)===0&&inlineRowLoading||(header==null?void 0:header.index)===0&&isToggleExpansionEnabled){justifyHeader=enableSorting?"between":"start"}else{justifyHeader=isLeafColumn?"end":"center"}const[showPopover,setShowPopover]=useState(false);const togglePopover=()=>setShowPopover((prev=>!prev));const handleShouldClose=shouldClose=>setShowPopover(!shouldClose);const popoverReference=jsx("div",{className:"gray-icon toggle-all-icon",onClick:togglePopover,children:jsx(Icon,{icon:displayIcon(toggleExpansionIcon)[0]})});const handleExpandDepth=depth=>{if(onExpandByDepthClick){const flatRows=table==null?void 0:table.getRowModel().flatRows;onExpandByDepthClick(depth,flatRows)}const updated=updateExpandAndCollapseState(table.getRowModel(),expanded,void 0,depth,cascadeCollapse);setExpanded(updated)};return jsx("th",{align:headerAlignment?headerAlignment:"right",className:cellClassName,colSpan:header==null?void 0:header.colSpan,id:cellId,style:{backgroundColor:headerBackgroundColor,color:headerFontColor,left:isPinnedLeft?(header==null?void 0:header.index)===1?"180px":`${header==null?void 0:header.column.getStart("left")}px`:void 0},children:(header==null?void 0:header.isPlaceholder)?null:headerChildren&&(header==null?void 0:header.index)===0?jsxs(Flex,{alignItems:"center",children:[headerChildren,jsx("div",{children:flexRender(header.column.columnDef.header,header.getContext())})]}):jsxs(Flex,{alignItems:"center",justify:justifyHeader,children:[selectableRows&&(header==null?void 0:header.index)===0&&hasAnySubRows&&jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()}),isToggleExpansionEnabled&&(hasAnySubRows||inlineRowLoading&&persistToggleExpansionButton)&&!expandByDepth&&jsx(ToggleIconButton,{onClick:handleExpandOrCollapse}),isToggleExpansionEnabled&&hasAnySubRows&&expandByDepth&&jsx(PbReactPopover,{closeOnClick:"any",placement:"bottom-start",reference:popoverReference,shouldClosePopover:handleShouldClose,show:showPopover,zIndex:3,children:expandByDepth.map(((option,index)=>jsxs(Fragment,{children:[jsx(Flex,{alignItems:"center",className:"pb-advanced-table-popover-option",cursor:"pointer",htmlOptions:{onClick:()=>{handleExpandDepth(option.depth)}},paddingX:"sm",paddingY:"xs",children:option.label}),index!==expandByDepth.length-1&&jsx(SectionSeparator,{})]})))}),isToggleExpansionEnabledLoading&&jsx("div",{className:"loading-toggle-icon header-toggle-icon"}),jsxs(Flex,{className:`${(header==null?void 0:header.index)===0&&enableSorting&&"header-sort-button pb_th_link"} ${(header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())&&"header-sort-secondary-columns"}`,cursor:(header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting?"pointer":"default",...((header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting)&&{htmlOptions:{onClick:event=>toggleSortButton(event),onKeyDown:event=>{if(event.key==="Enter"){toggleSortButton(event)}},tabIndex:0}},justify:(header==null?void 0:header.index)===0&&enableSorting?"between":headerAlignment?alignmentMap[headerAlignment]:"none",paddingLeft:(header==null?void 0:header.index)===0?enableSorting?"xxs":"xs":"none",children:[jsx("div",{children:flexRender(header==null?void 0:header.column.columnDef.header,header==null?void 0:header.getContext())}),((header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting)&&(loading?jsx("div",{className:"loading-toggle-icon"}):jsx(SortIconButton,{enableSortingRemoval:enableSortingRemoval,header:header,sortIcon:sortIcon}))]})]})},`${header==null?void 0:header.id}-header`)};const TableHeader=({children:children,className:className,dark:dark=false,enableSorting:enableSorting=false,id:id,sortIcon:sortIcon=["arrow-up-wide-short","arrow-down-short-wide"],...props})=>{const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,loading:loading,table:table,hasAnySubRows:hasAnySubRows,showActionsBar:showActionsBar,selectableRows:selectableRows,persistToggleExpansionButton:persistToggleExpansionButton,responsive:responsive,headerRef:headerRef,virtualizedRows:virtualizedRows,enableVirtualization:enableVirtualization}=useContext(AdvancedTableContext);const isVirtualized=virtualizedRows||enableVirtualization;const classes=classnames(buildCss("pb_advanced_table_header"),globalProps(props),className);const columnPinning=table.getState().columnPinning;const customCellClassnames=classnames("table-header-cells-custom",`${showActionsBar&&"header-cells-with-actions"}`,`${isChrome()?"chrome-styles":""}`,`${responsive==="scroll"&&"pinned-left"}`);const renderRegularTableHeader=()=>jsx("thead",{className:classes,id:id,ref:headerRef,children:table.getHeaderGroups().map((headerGroup=>jsxs("tr",{children:[!hasAnySubRows&&selectableRows&&jsx("th",{className:customCellClassnames,children:jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()})}),headerGroup.headers.map((header=>{const isPinnedLeft=columnPinning.left.includes(header.id);return jsx(TableHeaderCell,{enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:children,isPinnedLeft:isPinnedLeft,loading:loading,persistToggleExpansionButton:persistToggleExpansionButton,sortIcon:sortIcon,table:table},`${header.id}-header`)}))]},`${headerGroup.id}-headerGroup`)))});const renderVirtualizedTableHeader=()=>jsx("thead",{className:classes,"data-virtualized":"true",id:id,ref:headerRef,children:table.getHeaderGroups().map((headerGroup=>jsxs("tr",{className:"virtualized-header-row-header",children:[!hasAnySubRows&&selectableRows&&jsx("th",{className:classnames(customCellClassnames,"virtualized-header-cell"),children:jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()})}),headerGroup.headers.map((header=>{const isPinnedLeft=columnPinning.left.includes(header.id);return jsx(TableHeaderCell,{enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:children,isPinnedLeft:isPinnedLeft,isVirtualized:true,loading:loading,persistToggleExpansionButton:persistToggleExpansionButton,sortIcon:sortIcon,table:table},`${header.id}-header-virtualized`)}))]},`${headerGroup.id}-headerGroup-virtualized`)))});return jsx(Fragment,{children:isVirtualized?renderVirtualizedTableHeader():renderRegularTableHeader()})};const getRowColorClass=(row,inlineRowLoading)=>{var _a;const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a=row.original)==null?void 0:_a.children)&&!row.original.children.length?true:false;const shouldShowExpandedBackground=isExpandable&&(!inlineRowLoading&&row.getCanExpand()||inlineRowLoading&&(rowHasNoChildren||row.getCanExpand()));return row.getIsSelected()?"bg-row-selection":shouldShowExpandedBackground?"bg-silver":"pb-bg-row-white"};const shouldShowLoadingIndicator=(row,inlineRowLoading,cellAccessorsLength)=>{var _a;const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a=row.original)==null?void 0:_a.children)&&!row.original.children.length?true:false;return isExpandable&&(inlineRowLoading&&rowHasNoChildren)&&row.depth<cellAccessorsLength};const LoadingInline=props=>{const{align:align="left",aria:aria={},className:className,data:data={},dark:dark=false,htmlOptions:htmlOptions={},id:id,text:text2=" Loading",variant:variant="dotted"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss(`pb_loading_inline_kit_${align}`),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs(Body$1,{color:"light",dark:dark,children:[jsx(Icon,{aria:{label:"loading icon"},fixedWidth:true,icon:variant==="dotted"?"spinner":variant==="solid"?"circle-notch":void 0,pulse:true}),text2]})})};const CollapsibleTrail=({leftOffset:leftOffset})=>{const style={left:`${leftOffset}em`};return jsx("div",{className:"collapsible-trail",style:style})};const renderCollapsibleTrail=currentDepth=>{const lines=[];for(let i2=1;i2<=currentDepth;i2++){const additionalOffset=i2>1?(i2-1)*.25:0;const leftOffset=i2*1+additionalOffset;lines.push(jsx(CollapsibleTrail,{leftOffset:leftOffset},i2))}return lines};const SubRowHeaderRow=({collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:onClick,row:row,subRowHeaders:subRowHeaders,table:table})=>{var _a;const{inlineRowLoading:inlineRowLoading,customSort:customSort,onCustomSortClick:onCustomSortClick}=useContext(AdvancedTableContext);const numberOfColumns=table.getAllFlatColumns().length;const rowHasChildren=row.original.children?true:false;const canExpand=inlineRowLoading?rowHasChildren:row.getCanExpand();const hasSubrowsToSort=(_a=row.getParentRow())==null?void 0:_a.subRows;return jsxs("tr",{className:"custom-row bg-silver",children:[jsxs("td",{className:`custom-row-first-column ${isChrome()?"chrome-styles":""}`,colSpan:1,children:[collapsibleTrail&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("div",{style:{paddingLeft:`${row.depth*1.25}em`},children:jsxs(Flex,{align:"center",columnGap:"xs",justifyContent:customSort&&hasSubrowsToSort&&hasSubrowsToSort.length>1?"between":void 0,children:[jsxs(Flex,{columnGap:"xs",children:[enableToggleExpansion==="all"&&canExpand?jsx(ToggleIconButton,{onClick:onClick,row:row}):null,jsx(Caption,{marginLeft:canExpand?"none":"xs",text:subRowHeaders[row.depth-1]})]}),customSort&&hasSubrowsToSort&&hasSubrowsToSort.length>1&&jsx("button",{"aria-label":"Sort this group",className:"sort-button-icon gray-icon",onClick:()=>{var _a2;onCustomSortClick&&onCustomSortClick((_a2=row.getParentRow())==null?void 0:_a2.subRows)},children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:"sort"})})]})})]}),jsx("td",{colSpan:numberOfColumns-1})]})};const LoadingCell=()=>jsx("div",{className:"loading-cell"});const TableCellRenderer=({row:row,collapsibleTrail:collapsibleTrail=true,loading:loading=false,stickyLeftColumn:stickyLeftColumn,columnPinning:columnPinning,customRowStyle:customRowStyle,columnDefinitions:columnDefinitions,isMultiHeaderColumn:isMultiHeaderColumn=false})=>jsx(Fragment,{children:row.getVisibleCells().map(((cell,i2)=>{var _a,_b,_c,_d;const isPinnedLeft=columnPinning.left.includes(cell.column.id);const isLastCell=(()=>{var _a2;if(!isMultiHeaderColumn){return false}const parent=cell.column.parent;if(!parent){const last=row.getVisibleCells().at(-1);return(last==null?void 0:last.column.id)===cell.column.id}const visibleSiblings=parent.columns.filter((col=>col.getIsVisible()));return((_a2=visibleSiblings.at(-1))==null?void 0:_a2.id)===cell.column.id})();const{column:column}=cell;const colDef=findColumnDefByAccessor(columnDefinitions??[],column.id);const cellAlignment=((_a=colDef==null?void 0:colDef.columnStyling)==null?void 0:_a.cellAlignment)??"right";const cellFontColorValue=(_b=colDef==null?void 0:colDef.columnStyling)==null?void 0:_b.fontColor;const cellFontColor=typeof cellFontColorValue==="function"?cellFontColorValue(row):cellFontColorValue;const cellBackgroundColorValue=(_c=colDef==null?void 0:colDef.columnStyling)==null?void 0:_c.cellBackgroundColor;const cellBackgroundColor=typeof cellBackgroundColorValue==="function"?cellBackgroundColorValue(row):cellBackgroundColorValue;const paddingValue=((_d=colDef==null?void 0:colDef.columnStyling)==null?void 0:_d.cellPadding)??(customRowStyle==null?void 0:customRowStyle.cellPadding);const paddingClass=paddingValue?`p_${paddingValue}`:void 0;return jsxs("td",{align:cellAlignment,className:classnames(`${cell.id}-cell position_relative`,isChrome()?"chrome-styles":"",isPinnedLeft&&"pinned-left",stickyLeftColumn&&stickyLeftColumn.length>0&&isPinnedLeft&&"sticky-left",isLastCell&&"last-cell",paddingClass),style:{left:isPinnedLeft?i2===1?"180px":`${column.getStart("left")}px`:void 0,backgroundColor:cellBackgroundColor||i2===0&&(customRowStyle==null?void 0:customRowStyle.backgroundColor),color:cellFontColor||(customRowStyle==null?void 0:customRowStyle.fontColor)},children:[collapsibleTrail&&i2===0&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("span",{id:`${cell.id}-span`,children:loading?jsx(LoadingCell,{}):flexRender(cell.column.columnDef.cell,cell.getContext())})]},`${cell.id}-data`)}))});const RegularTableView=({collapsibleTrail:collapsibleTrail=true,subRowHeaders:subRowHeaders})=>{var _a;const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,inlineRowLoading:inlineRowLoading,loading:loading,table:table,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,stickyLeftColumn:stickyLeftColumn,pinnedRows:pinnedRows,headerHeight:headerHeight,rowHeight:rowHeight,rowStyling:rowStyling=[],sampleRowRef:sampleRowRef}=useContext(AdvancedTableContext);useEffect((()=>{if(stickyLeftColumn&&Array.isArray(stickyLeftColumn)){stickyLeftColumn.forEach((columnId=>{const column=table.getColumn(columnId);if(column&&column.getCanPin()){column.pin("left")}}))}}),[stickyLeftColumn,table]);const columnPinning=table.getState().columnPinning||{left:[]};const columnDefinitions=((_a=table.options.meta)==null?void 0:_a.columnDefinitions)||[];const isMultiHeaderColumn=columnDefinitions.some((obj=>"columns"in obj));function PinnedRow({row:row}){const customRowStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));return jsx("tr",{className:classnames(`pinned-row`),style:{backgroundColor:(customRowStyle==null?void 0:customRowStyle.backgroundColor)?customRowStyle==null?void 0:customRowStyle.backgroundColor:"white",color:customRowStyle==null?void 0:customRowStyle.fontColor,position:"sticky",top:row.getIsPinned()==="top"?`${row.getPinnedIndex()*rowHeight+headerHeight}px`:void 0,zIndex:"3"},children:jsx(TableCellRenderer,{collapsibleTrail:collapsibleTrail,columnDefinitions:columnDefinitions,columnPinning:columnPinning,customRowStyle:customRowStyle,isMultiHeaderColumn:isMultiHeaderColumn,loading:loading,row:row,stickyLeftColumn:stickyLeftColumn})})}const totalRows=pinnedRows?table.getCenterRows():table.getRowModel().rows;return jsxs(Fragment,{children:[pinnedRows&&table.getTopRows().map((row=>jsx(PinnedRow,{row:row},row.id))),totalRows.map(((row,rowIndex)=>{var _a2,_b;const isFirstChildofSubrow=row.depth>0&&row.index===0;const numberOfColumns=table.getAllFlatColumns().length;const isFirstRegularRow=rowIndex===0&&!row.getIsPinned();const customRowStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));const rowColor=getRowColorClass(row,inlineRowLoading||false);const isDataLoading=shouldShowLoadingIndicator(row,inlineRowLoading||false,((_b=(_a2=columnDefinitions[0])==null?void 0:_a2.cellAccessors)==null?void 0:_b.length)||0);return jsxs(React__default.Fragment,{children:[isFirstChildofSubrow&&subRowHeaders&&jsx(SubRowHeaderRow,{collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:handleExpandOrCollapse,row:row,subRowHeaders:subRowHeaders,table:table}),jsxs("tr",{className:`${rowColor} ${row.depth>0?`depth-sub-row-${row.depth}`:""}`,id:`${row.index}-${row.id}-${row.depth}-row`,ref:isFirstRegularRow?sampleRowRef:null,style:{backgroundColor:customRowStyle==null?void 0:customRowStyle.backgroundColor,color:customRowStyle==null?void 0:customRowStyle.fontColor},children:[selectableRows&&!hasAnySubRows&&jsx("td",{className:"checkbox-cell",children:jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()})}),jsx(TableCellRenderer,{collapsibleTrail:collapsibleTrail,columnDefinitions:columnDefinitions,columnPinning:columnPinning,customRowStyle:customRowStyle,isMultiHeaderColumn:isMultiHeaderColumn,loading:loading,row:row,stickyLeftColumn:stickyLeftColumn})]}),isDataLoading&&jsx("tr",{children:jsx("td",{colSpan:numberOfColumns,style:{paddingLeft:`${row.depth===0?.5:row.depth*2}em`},children:jsx(LoadingInline,{})})},`${row.id}-loading-row`)]},`${row.index}-${row.id}-${row.depth}-row`)}))]})};const VirtualizedTableView=({collapsibleTrail:collapsibleTrail=true,subRowHeaders:subRowHeaders,isFetching:isFetching})=>{var _a;const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,inlineRowLoading:inlineRowLoading,loading:loading,table:table,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,virtualizer:virtualizer,flattenedItems:flattenedItems,totalAvailableCount:totalAvailableCount}=useContext(AdvancedTableContext);const columnPinning=table.getState().columnPinning||{left:[]};const sortingState=JSON.stringify(table.getState().sorting||[]);const[columnWidths,setColumnWidths]=useState({});const getHeaderCellWidths=()=>{const widths={};const headerCells=document.querySelectorAll(".table-header-cells, .table-header-cells-custom");if(selectableRows&&!hasAnySubRows&&headerCells.length>0){widths["checkbox"]=`${headerCells[0].getBoundingClientRect().width}px`}table.getFlatHeaders().forEach(((header,index)=>{const headerIndex=selectableRows&&!hasAnySubRows?index+1:index;if(headerCells[headerIndex]){const width=headerCells[headerIndex].getBoundingClientRect().width;widths[header.id]=`${width}px`}}));return widths};const debounce2=(func,wait)=>{let timeout;return function executedFunction(...args){const later=()=>{clearTimeout(timeout);func(...args)};clearTimeout(timeout);timeout=setTimeout(later,wait)}};useLayoutEffect((()=>{const timer=setTimeout((()=>{setColumnWidths(getHeaderCellWidths())}),0);return()=>clearTimeout(timer)}),[table,selectableRows,hasAnySubRows,sortingState]);useEffect((()=>{const handleResize=debounce2((()=>{setColumnWidths(getHeaderCellWidths())}),0);window.addEventListener("resize",handleResize);return()=>{window.removeEventListener("resize",handleResize)}}),[table,selectableRows,hasAnySubRows]);if(!virtualizer||!flattenedItems){return jsx("tr",{children:jsx("td",{colSpan:table.getAllFlatColumns().length||1,children:"No data to display."})})}const virtualItems=((_a=virtualizer.getVirtualItems)==null?void 0:_a.call(virtualizer))||[];if(!virtualItems.length){return jsx("tr",{children:jsx("td",{colSpan:table.getAllFlatColumns().length||1,children:"No items to display."})})}const topLevelRowCount=table.getRowModel().flatRows.filter((row=>row.depth===0)).length;return jsx(Fragment,{children:virtualItems.map((virtualRow=>{const item=flattenedItems[virtualRow.index];if(!item)return null;const virtualItemStyle=getVirtualizedRowStyle(virtualRow.start);if(item.type==="header"){return jsx("tr",{className:"virtualized-table-row virtualized-header-row",style:virtualItemStyle,children:jsx("td",{colSpan:table.getAllFlatColumns().length,children:jsx(SubRowHeaderRow,{collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:handleExpandOrCollapse,row:item.row,subRowHeaders:subRowHeaders,table:table})})},`header-${item.id}-sort-${sortingState}`)}if(item.type==="row"){const row=item.row;const rowColor=getRowColorClass(row,inlineRowLoading||false);return jsxs("tr",{className:`virtualized-table-row ${rowColor} ${row.depth>0?`depth-sub-row-${row.depth}`:""}`,"data-index":virtualRow.index,ref:node=>{if(node){try{virtualizer.measureElement(node)}catch(err){}}},style:virtualItemStyle,children:[selectableRows&&!hasAnySubRows&&jsx("td",{className:"checkbox-cell",style:{width:columnWidths["checkbox"]||"auto"},children:jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()})}),row.getVisibleCells().map(((cell,i2)=>{var _a2,_b,_c;const isPinnedLeft=columnPinning.left.includes(cell.column.id);const isLastCell=((_c=(_b=(_a2=cell.column.parent)==null?void 0:_a2.columns)==null?void 0:_b.at(-1))==null?void 0:_c.id)===cell.column.id;const cellWidth=columnWidths[cell.column.id]||"auto";return jsxs("td",{align:"right",className:classnames(`${cell.id}-cell position_relative`,isChrome()?"chrome-styles":"",isPinnedLeft&&"pinned-left",isLastCell&&"last-cell"),style:{width:cellWidth},children:[collapsibleTrail&&i2===0&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("span",{id:`${cell.id}-span`,children:loading?jsx(LoadingCell,{}):flexRender(cell.column.columnDef.cell,cell.getContext())})]},`${cell.id}-data`)}))]},`row-${item.id}-sort-${sortingState}`)}if(item.type==="loading"){const row=item.row;const numberOfColumns=table.getAllFlatColumns().length;return jsx("tr",{className:"virtualized-table-row virtualized-loading-row",style:virtualItemStyle,children:jsx("td",{colSpan:numberOfColumns,style:{paddingLeft:`${row.depth===0?.5:row.depth*2}em`},children:jsx(LoadingInline,{})})},`loading-${item.id}-sort-${sortingState}`)}if(item.type==="footer"){return jsx("tr",{className:"virtualized-table-row virtualized-footer",style:virtualItemStyle,children:jsx("td",{colSpan:table.getAllFlatColumns().length,children:jsx(Flex,{align:"center",justify:"center",children:isFetching?jsx(LoadingInline,{}):jsx(Detail,{text:`Showing ${topLevelRowCount} of ${totalAvailableCount} rows`})})})},`footer-row`)}return null}))})};const TableBody=({className:className,collapsibleTrail:collapsibleTrail=true,dark:dark=false,id:id,subRowHeaders:subRowHeaders,isFetching:isFetching,...props})=>{const{responsive:responsive,isPinnedLeft:isPinnedLeft=false,virtualizer:virtualizer,virtualizedRows:virtualizedRows,enableVirtualization:enableVirtualization}=useContext(AdvancedTableContext);const isVirtualized=virtualizedRows||enableVirtualization;const classes=classnames(buildCss("pb_advanced_table_body"),{"pinned-left":responsive==="scroll"&&isPinnedLeft},globalProps(props),className);const style=virtualizer?{height:`${virtualizer.getTotalSize()}px`,position:"relative",width:"100%"}:{};return jsx(Fragment,{children:jsxs("tbody",{className:classes,"data-virtualized":isVirtualized?"true":"false",id:id,style:style,children:[isVirtualized&&virtualizer?jsx(VirtualizedTableView,{collapsibleTrail:collapsibleTrail,isFetching:isFetching,subRowHeaders:subRowHeaders}):jsx(RegularTableView,{collapsibleTrail:collapsibleTrail,subRowHeaders:subRowHeaders}),isVirtualized&&!virtualizer&&jsx("tr",{children:jsx("td",{colSpan:999,style:{padding:"10px",textAlign:"center"},children:jsx("div",{children:"No data to display."})})})]})})};const Pagination=props=>{const{aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,current:current=1,onChange:onChange,range:range=5,total:total=1}=props;const[currentPage,setCurrentPage]=useState(current);const[isMobile,setIsMobile]=useState(false);const[isDropdownOpen,setIsDropdownOpen]=useState(false);const[dropdownPosition,setDropdownPosition]=useState("below");const dropdownRef=useRef(null);useEffect((()=>{const checkMobile=()=>{setIsMobile(window.innerWidth<=767)};checkMobile();let timeoutId=null;const throttledCheckMobile=()=>{if(timeoutId===null){timeoutId=setTimeout((()=>{checkMobile();timeoutId=null}),150)}};window.addEventListener("resize",throttledCheckMobile);return()=>{window.removeEventListener("resize",throttledCheckMobile);if(timeoutId)clearTimeout(timeoutId)}}),[]);useEffect((()=>{const handleClickOutside2=event=>{if(dropdownRef.current&&!dropdownRef.current.contains(event.target)){setIsDropdownOpen(false)}};if(isDropdownOpen){document.addEventListener("mousedown",handleClickOutside2)}return()=>{document.removeEventListener("mousedown",handleClickOutside2)}}),[isDropdownOpen]);const checkDropdownPosition=()=>{if(dropdownRef.current){const rect=dropdownRef.current.getBoundingClientRect();const dropdownHeight=200;const spaceBelow=window.innerHeight-rect.bottom;const spaceAbove=rect.top;if(spaceBelow<dropdownHeight&&spaceAbove>spaceBelow){setDropdownPosition("above")}else{setDropdownPosition("below")}}};const handleDropdownToggle=()=>{if(!isDropdownOpen){checkDropdownPosition()}setIsDropdownOpen(!isDropdownOpen)};const handlePageChange=pageNumber=>{if(pageNumber>=1&&pageNumber<=total){setCurrentPage(pageNumber);setIsDropdownOpen(false);if(onChange){onChange(pageNumber)}}};const createPageOptions=()=>{const options=[];for(let pageNumber=1;pageNumber<=total;pageNumber++){options.push({label:String(pageNumber),value:String(pageNumber),id:`page-${pageNumber}`})}return options};const renderPageButtons=()=>{const buttons=[];let rangeStart=Math.max(1,currentPage-Math.floor(range/2));let rangeEnd=Math.min(total,rangeStart+range-1);if(rangeEnd-rangeStart+1<range){if(rangeStart>1){rangeStart=Math.max(1,rangeEnd-range+1)}else{rangeEnd=Math.min(total,rangeStart+range-1)}}if(rangeStart>1){buttons.push(jsx("li",{className:"pagination-number",onClick:()=>handlePageChange(1),children:"1"},1))}if(rangeStart>2){buttons.push(jsx("li",{className:"pagination-number",onClick:()=>handlePageChange(2),children:"2"},2))}for(let i2=rangeStart;i2<=rangeEnd;i2++){buttons.push(jsx("li",{className:`pagination-number ${i2===currentPage?"active":""}`,onClick:()=>handlePageChange(i2),children:i2},i2))}if(rangeEnd<total-1){buttons.push(jsx("li",{className:`pagination-number ${total-1===currentPage?"active":""}`,onClick:()=>handlePageChange(total-1),children:total-1},total-1))}if(rangeEnd<total){buttons.push(jsx("li",{className:`pagination-number ${total===currentPage?"active":""}`,onClick:()=>handlePageChange(total),children:total},total))}return buttons};useEffect((()=>{if(current>=1&&current<=total){setCurrentPage(current)}}),[current,total]);const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_paginate"),globalProps(props),className);if(total<=1){return null}return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsx("div",{className:`pb_pagination ${isMobile?"pb_pagination_mobile":""}`,children:isMobile?jsxs(Flex,{alignItems:"center",children:[jsx("li",{className:`pagination-left ${currentPage===1?"disabled":""}`,onClick:()=>handlePageChange(currentPage-1),children:jsxs(Flex,{alignItems:"center",children:[jsx(Icon,{icon:"chevron-left"}),jsx(Detail,{color:"default",marginLeft:"xxs",children:"Prev"})]})}),jsxs("div",{className:"pagination-dropdown",ref:dropdownRef,children:[jsx("div",{className:"pagination-dropdown-trigger",onClick:handleDropdownToggle,children:jsxs(Flex,{alignItems:"center",gap:"xxs",justify:"between",children:[jsx(Detail,{bold:true,color:"default",children:currentPage}),jsxs(Detail,{color:"default",children:["of ",total]}),jsx(Icon,{color:"primary",icon:isDropdownOpen?"chevron-up":"chevron-down",size:"xs"})]})}),isDropdownOpen&&jsx("div",{className:`pagination-dropdown-menu ${dropdownPosition}`,children:createPageOptions().map((option=>jsx("div",{className:`pagination-dropdown-option ${Number(option.value)===currentPage?"active":""}`,onClick:()=>handlePageChange(Number(option.value)),children:jsxs(Body$1,{children:["Page ",option.label]})},option.id)))})]}),jsx("li",{className:`pagination-right ${currentPage===total?"disabled":""}`,onClick:()=>handlePageChange(currentPage+1),children:jsxs(Flex,{alignItems:"center",children:[jsx(Detail,{color:"default",marginRight:"xxs",children:"Next"}),jsx(Icon,{icon:"chevron-right"})]})})]}):jsxs(Fragment,{children:[jsx("li",{className:`pagination-left ${currentPage===1?"disabled":""}`,onClick:()=>handlePageChange(currentPage-1),children:jsx(Icon,{icon:"chevron-left"})}),renderPageButtons(),jsx("li",{className:`pagination-right ${currentPage===total?"disabled":""}`,onClick:()=>handlePageChange(currentPage+1),children:jsx(Icon,{icon:"chevron-right"})})]})})})};const TablePagination=({table:table,onChange:onChange,position:position,range:range=5})=>{const current=table.getState().pagination.pageIndex+1;const total=table.getPageCount();return jsx(Pagination,{current:current,marginBottom:position==="top"?"xs":void 0,marginTop:position==="bottom"?"xs":void 0,onChange:onChange,range:range,total:total},`pagination-${position}-${current}`)};const buildVisibilityTree=(defs,allowed)=>defs.map((def=>{const isGroup=Array.isArray(def.columns)&&def.columns.length>0;if(!(allowed==null?void 0:allowed.length)){return isGroup?{id:def.id,label:def.label,children:buildVisibilityTree(def.columns,allowed)}:{id:def.id,label:def.label}}if(allowed.includes(def.id)){return isGroup?{id:def.id,label:def.label,children:buildVisibilityTree(def.columns,null)}:{id:def.id,label:def.label}}if(isGroup){const kids=buildVisibilityTree(def.columns,allowed).filter(Boolean);return kids.length?{id:def.id,label:def.label,children:kids}:null}return null})).filter(Boolean);const showActionBar=elem=>{elem.style.display="block";const height=elem.scrollHeight+"px";elem.style.height=height;elem.classList.add("is-visible");elem.style.overflow="hidden";window.setTimeout((()=>{if(elem.classList.contains("is-visible")){elem.style.height="";elem.style.overflow="visible"}}),300)};const hideActionBar=elem=>{elem.style.height=elem.scrollHeight+"px";elem.offsetHeight;window.setTimeout((()=>{elem.style.height="0";elem.style.overflow="hidden"}),10);window.setTimeout((()=>{elem.classList.remove("is-visible")}),300)};const TableActionBar=({isVisible:isVisible,selectedCount:selectedCount,actions:actions,type:type="row-selection"})=>{var _a;const cardRef=useRef(null);const{table:table,columnVisibilityControl:columnVisibilityControl,columnDefinitions:columnDefinitions}=useContext(AdvancedTableContext);const includeIds=columnVisibilityControl==null?void 0:columnVisibilityControl.includeIds;const firstLeafId=(_a=table.getAllLeafColumns()[0])==null?void 0:_a.id;const tree=buildVisibilityTree(columnDefinitions,includeIds).filter((node=>node.id!==firstLeafId));const renderLeaf=(id,label)=>{const col=table.getColumn(id);const show=col.getIsVisible();const handleVisibilityChange=()=>{col.toggleVisibility();if(columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange){const updatedVisibilityState={...table.getAllColumns().reduce(((acc,col2)=>{acc[col2.id]=col2.getIsVisible();return acc}),{})};columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange(updatedVisibilityState)}};return jsx(Checkbox,{checked:show,onChange:handleVisibilityChange,paddingBottom:"xs",text:label},id)};const gatherLeafIds=node=>node.children&&node.children.length?node.children.flatMap(gatherLeafIds):node.id?[node.id]:[];const renderGroup=node=>{var _a2;const leaves=gatherLeafIds(node);const visibleArray=leaves.map((id=>table.getColumn(id).getIsVisible()));const allOn=visibleArray.every(Boolean);const someOn=visibleArray.some(Boolean);const handleGroupVisibilityChange=()=>{leaves.forEach((id=>table.getColumn(id).toggleVisibility(!allOn)));if(columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange){const updatedVisibilityState={...table.getAllColumns().reduce(((acc,col)=>{acc[col.id]=col.getIsVisible();return acc}),{})};columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange(updatedVisibilityState)}};return jsxs(Fragment,{children:[jsx(Checkbox,{checked:allOn,indeterminate:!allOn&&someOn,onChange:handleGroupVisibilityChange,paddingBottom:"xs",text:node.label}),jsx(Flex,{flexDirection:"column",paddingLeft:"lg",children:(_a2=node==null?void 0:node.children)==null?void 0:_a2.map((child=>child.children?renderGroup(child):renderLeaf(child.id,child.label)))})]})};useEffect((()=>{if(cardRef.current&&type==="row-selection"){if(isVisible){showActionBar(cardRef.current)}else{hideActionBar(cardRef.current)}}}),[isVisible,type]);const[showPopover,setShowPopover]=useState(false);const togglePopover=()=>setShowPopover((prev=>!prev));const handleShouldClose=shouldClose=>setShowPopover(!shouldClose);const popoverReference=jsx(Tooltip,{placement:"top",text:"Column Configuration",children:jsx("div",{onClick:togglePopover,children:jsx(Icon,{color:"primary",cursor:"pointer",icon:"sliders-h"})})});return jsx(Card,{borderNone:!isVisible,className:`${isVisible&&"show-action-card row-selection-actions-card"}`,htmlOptions:{ref:cardRef},padding:`${isVisible?"xs":"none"}`,children:jsx(Flex,{alignItems:"center",justify:type==="row-selection"?"between":"end",children:type==="row-selection"?jsxs(Fragment,{children:[jsxs(Caption,{color:"light",paddingLeft:"xs",size:"xs",children:[selectedCount," Selected"]}),jsx(FlexItem,{children:actions})]}):jsx(PbReactPopover,{closeOnClick:"outside",placement:"bottom-end",reference:popoverReference,shouldClosePopover:handleShouldClose,show:showPopover,zIndex:3,children:jsxs(Fragment,{children:[jsx(Caption,{paddingY:"sm",text:"Columns Config",textAlign:"center"}),jsx(SectionSeparator,{paddingBottom:"xs"}),tree.map((node=>jsx(Flex,{cursor:"pointer",flexDirection:"column",paddingX:"xs",children:node.children?renderGroup(node):renderLeaf(node.id,node.label)},node.id)))]})})})})};const CustomCell=({getValue:getValue,onRowToggleClick:onRowToggleClick,row:row,value:value,customRenderer:customRenderer,selectableRows:selectableRows,customStyle:customStyle={}})=>{const{setExpanded:setExpanded,expanded:expanded,expandedControl:expandedControl,inlineRowLoading:inlineRowLoading,hasAnySubRows:hasAnySubRows,cascadeCollapse:cascadeCollapse}=useContext(AdvancedTableContext);const handleOnExpand=row2=>{onRowToggleClick&&onRowToggleClick(row2);const willBeExpanded=!row2.getIsExpanded();if(willBeExpanded){if(!expandedControl){setExpanded({...expanded,[row2.id]:true})}}else{if(cascadeCollapse){const idsToRemove=new Set([row2.id,...getDescendantRowIds(row2)]);const nextExpanded={...expanded};idsToRemove.forEach((id=>delete nextExpanded[id]));setExpanded(nextExpanded)}else if(!expandedControl){setExpanded({...expanded,[row2.id]:false})}}};const RowHasChildren=row.original.children?true:false;const renderButton=inlineRowLoading?RowHasChildren:row.getCanExpand();return jsx("div",{style:{paddingLeft:`${row.depth*1.25}em`},children:jsxs(Flex,{alignItems:"center",columnGap:"xs",justify:"start",orientation:"row",children:[selectableRows&&hasAnySubRows&&jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()}),renderButton?jsx("button",{className:"gray-icon expand-toggle-icon",onClick:()=>handleOnExpand(row),style:{color:customStyle==null?void 0:customStyle.expandButtonColor},children:row.getIsExpanded()?jsx(Icon,{cursor:"pointer",icon:"circle-play",rotation:90}):jsx(Icon,{cursor:"pointer",icon:"circle-play"})}):null,jsx(FlexItem,{paddingLeft:renderButton?"none":"xs",children:row.depth===0?customRenderer?customRenderer(row,getValue()):getValue():customRenderer?customRenderer(row,value):value})]})})};const createCellFunction=(cellAccessors,customRenderer,isFirstColumn,onRowToggleClick,selectableRows,rowStyling)=>{const cellRenderer=({row:row,getValue:getValue})=>{const rowData=row.original;const customStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));if(isFirstColumn){switch(row.depth){case 0:{return jsx(CustomCell,{customRenderer:customRenderer,customStyle:customStyle,getValue:getValue,onRowToggleClick:onRowToggleClick,row:row,selectableRows:selectableRows})}default:{const depthAccessor=cellAccessors[row.depth-1];const accessorValue=rowData[depthAccessor];return accessorValue?jsx(CustomCell,{customRenderer:customRenderer,onRowToggleClick:onRowToggleClick,row:row,selectableRows:selectableRows,value:accessorValue}):"N/A"}}}return customRenderer?customRenderer(row,getValue()):getValue()};cellRenderer.displayName="CellRenderer";return cellRenderer};function getParentOnlySortedRowModel(){return table=>()=>{const sortingState=table.getState().sorting;const rowModel=table.getPreSortedRowModel();if(!rowModel.rows.length||!(sortingState==null?void 0:sortingState.length)){return rowModel}const sortedFlatRows=[];const availableSorting=sortingState.filter((sort=>{var _a;return(_a=table.getColumn(sort.id))==null?void 0:_a.getCanSort()}));const columnInfoById={};availableSorting.forEach((sortEntry=>{const column=table.getColumn(sortEntry.id);if(!column)return;columnInfoById[sortEntry.id]={sortUndefined:column.columnDef.sortUndefined,invertSorting:column.columnDef.invertSorting,sortingFn:column.getSortingFn()}}));const parentRows=rowModel.rows.map((row=>({...row})));parentRows.sort(((rowA,rowB)=>{for(let i2=0;i2<availableSorting.length;i2+=1){const sortEntry=availableSorting[i2];const columnInfo=columnInfoById[sortEntry.id];const sortUndefined=columnInfo.sortUndefined;const isDesc=(sortEntry==null?void 0:sortEntry.desc)??false;let sortInt=0;if(sortUndefined){const aValue=rowA.getValue(sortEntry.id);const bValue=rowB.getValue(sortEntry.id);const aUndefined=aValue===void 0;const bUndefined=bValue===void 0;if(aUndefined||bUndefined){if(sortUndefined==="first")return aUndefined?-1:1;if(sortUndefined==="last")return aUndefined?1:-1;sortInt=aUndefined&&bUndefined?0:aUndefined?sortUndefined:-sortUndefined}}if(sortInt===0){sortInt=columnInfo.sortingFn(rowA,rowB,sortEntry.id)}if(sortInt!==0){if(isDesc)sortInt*=-1;if(columnInfo.invertSorting)sortInt*=-1;return sortInt}}return rowA.index-rowB.index}));function flattenRowsInOrder(rows){rows.forEach((row=>{var _a;sortedFlatRows.push(row);if((_a=row.subRows)==null?void 0:_a.length){flattenRowsInOrder(row.subRows)}}))}flattenRowsInOrder(parentRows);const rowsById={};sortedFlatRows.forEach((row=>{rowsById[row.id]=row}));return{rows:parentRows,flatRows:sortedFlatRows,rowsById:rowsById}}}function useTableState({tableData:tableData,columnDefinitions:columnDefinitions,enableSortingRemoval:enableSortingRemoval,expandedControl:expandedControl,sortControl:sortControl,onRowToggleClick:onRowToggleClick,selectableRows:selectableRows,initialLoadingRowsCount:initialLoadingRowsCount=10,loading:loading,pagination:pagination=false,paginationProps:paginationProps,virtualizedRows:virtualizedRows=false,tableOptions:tableOptions,columnVisibilityControl:columnVisibilityControl,pinnedRows:pinnedRows,rowStyling:rowStyling,inlineRowLoading:inlineRowLoading=false,sortParentOnly:sortParentOnly=false}){var _a,_b;const[localExpanded,setLocalExpanded]=useState({});const[loadingStateRowCount,setLoadingStateRowCount]=useState(initialLoadingRowsCount);const[rowSelection,setRowSelection]=useState({});const[localColumnVisibility,setLocalColumnVisibility]=useState({});const[localRowPinning,setLocalRowPinning]=useState({top:[]});const[localPagination,setLocalPagination]=useState({pageIndex:(paginationProps==null?void 0:paginationProps.pageIndex)??0,pageSize:(paginationProps==null?void 0:paginationProps.pageSize)??20});const expanded=expandedControl?expandedControl.value:localExpanded;const setExpanded=expandedControl?expandedControl.onChange:setLocalExpanded;const columnVisibility=columnVisibilityControl&&columnVisibilityControl.value?columnVisibilityControl.value:localColumnVisibility;const setColumnVisibility=columnVisibilityControl&&columnVisibilityControl.onChange?columnVisibilityControl.onChange:setLocalColumnVisibility;const rowPinning=(pinnedRows==null?void 0:pinnedRows.value)??localRowPinning;const onRowPinningChange=(pinnedRows==null?void 0:pinnedRows.onChange)??setLocalRowPinning;const fetchSize=20;const[fullData]=useState(tableData);const[dataChunk,setDataChunk]=useState(fullData.slice(0,fetchSize));const[totalFetched,setTotalFetched]=useState(fetchSize);const[isFetching,setIsFetching]=useState(false);const columnHelper=createColumnHelper();const buildColumns=useCallback(((columnDefinitions2,isRoot=true)=>(columnDefinitions2==null?void 0:columnDefinitions2.map(((column,index)=>{const isFirstColumn=isRoot&&index===0;if(column.columns&&column.columns.length>0){return{header:column.header??column.label??"",id:column.id??column.label??`group-${index}`,columns:buildColumns(column.columns,false)}}const columnStructure={...columnHelper.accessor(column.accessor,{header:column.header??column.label??"",enableSorting:isFirstColumn||column.enableSort===true})};if(column.cellAccessors||column.customRenderer){columnStructure.cell=createCellFunction(column.cellAccessors||[],column.customRenderer,isFirstColumn,onRowToggleClick,selectableRows,rowStyling)}return columnStructure})))||[]),[columnHelper,onRowToggleClick,selectableRows]);const columns=useMemo((()=>buildColumns(columnDefinitions)),[buildColumns,columnDefinitions]);const sorting=useMemo((()=>[{id:columnDefinitions[0].accessor,desc:sortControl&&sortControl.value!==null?!sortControl.value.desc:false}]),[columnDefinitions,sortControl]);const customState=useCallback((()=>({state:{expanded:expanded,...sortControl&&{sorting:sorting},...selectableRows&&{rowSelection:rowSelection},...columnVisibility&&{columnVisibility:columnVisibility},...pinnedRows&&{rowPinning:rowPinning},...inlineRowLoading&&{pagination:localPagination}}})),[expanded,sortControl,sorting,selectableRows,rowSelection,columnVisibility,rowPinning,inlineRowLoading,localPagination]);const paginationInitializer=useMemo((()=>{if(!pagination)return{};if(inlineRowLoading){return{getPaginationRowModel:getPaginationRowModel(),paginateExpandedRows:false,onPaginationChange:setLocalPagination,autoResetPageIndex:false}}else{return{getPaginationRowModel:getPaginationRowModel(),paginateExpandedRows:false,initialState:{pagination:{pageIndex:(paginationProps==null?void 0:paginationProps.pageIndex)??0,pageSize:(paginationProps==null?void 0:paginationProps.pageSize)??20}}}}}),[pagination,paginationProps,inlineRowLoading]);const table=useReactTable({data:loading?Array(loadingStateRowCount).fill({}):virtualizedRows?dataChunk:tableData,columns:columns,onExpandedChange:setExpanded,getSubRows:row=>row.children,getCoreRowModel:getCoreRowModel(),getExpandedRowModel:getExpandedRowModel(),getSortedRowModel:sortParentOnly?getParentOnlySortedRowModel():getSortedRowModel(),enableSortingRemoval:enableSortingRemoval,sortDescFirst:true,onRowSelectionChange:setRowSelection,onRowPinningChange:onRowPinningChange,getRowId:selectableRows||pinnedRows||rowStyling?row=>row.id:void 0,onColumnVisibilityChange:setColumnVisibility,meta:{columnDefinitions:columnDefinitions},...customState(),...paginationInitializer,...tableOptions});useEffect((()=>{var _a2;const topPins=((_a2=pinnedRows==null?void 0:pinnedRows.value)==null?void 0:_a2.top)??[];if(topPins.length===0){onRowPinningChange({top:[]});return}const rows=table.getRowModel().rows;const collectAllDescendantIds=subs=>subs.flatMap((r2=>[r2.id,...collectAllDescendantIds(r2.subRows)]));const allPinned=[];topPins.forEach((id=>{const parent=rows.find((r2=>r2.id===id&&r2.depth===0));if(parent){allPinned.push(parent.id,...collectAllDescendantIds(parent.subRows))}}));onRowPinningChange({top:allPinned})}),[table,(_b=(_a=pinnedRows==null?void 0:pinnedRows.value)==null?void 0:_a.top)==null?void 0:_b.join(",")]);useEffect((()=>{if(pagination&&(paginationProps==null?void 0:paginationProps.pageSize)){if(inlineRowLoading){setLocalPagination((prev=>({...prev,pageSize:paginationProps.pageSize})))}else{table.setPageSize(paginationProps.pageSize)}}}),[pagination,paginationProps==null?void 0:paginationProps.pageSize,table,inlineRowLoading]);useEffect((()=>{if(pagination&&inlineRowLoading&&paginationProps){setLocalPagination({pageIndex:paginationProps.pageIndex??localPagination.pageIndex,pageSize:paginationProps.pageSize??localPagination.pageSize})}}),[pagination,inlineRowLoading,paginationProps==null?void 0:paginationProps.pageIndex,paginationProps==null?void 0:paginationProps.pageSize]);useEffect((()=>{if(pagination&&inlineRowLoading&&(paginationProps==null?void 0:paginationProps.onPageChange)){paginationProps.onPageChange(localPagination.pageIndex)}}),[localPagination.pageIndex,pagination,inlineRowLoading,paginationProps]);useEffect((()=>{if(pagination&&!inlineRowLoading&&(paginationProps==null?void 0:paginationProps.onPageChange)){const currentPageIndex=table.getState().pagination.pageIndex;paginationProps.onPageChange(currentPageIndex)}}),[table.getState().pagination.pageIndex,pagination,inlineRowLoading,paginationProps]);const hasAnySubRows=table.getRowModel().rows.some((row=>row.subRows&&row.subRows.length>0));const selectedRowsLength=Object.keys(table.getState().rowSelection).length;const fetchNextPage=useCallback((()=>{if(isFetching||totalFetched>=fullData.length)return;setIsFetching(true);setTimeout((()=>{const nextChunk=fullData.slice(totalFetched,totalFetched+fetchSize);setDataChunk((prev=>[...prev,...nextChunk]));setTotalFetched((prev=>prev+nextChunk.length));setIsFetching(false)}),500)}),[isFetching,totalFetched,fullData,fetchSize]);const updateLoadingStateRowCount=useCallback((()=>{const rowsCount=table.getRowModel().rows.length;if(rowsCount!==loadingStateRowCount&&rowsCount!==0){setLoadingStateRowCount(rowsCount)}}),[loadingStateRowCount,table]);return{table:table,expanded:expanded,setExpanded:setExpanded,hasAnySubRows:hasAnySubRows,selectedRowsLength:selectedRowsLength,fetchNextPage:fetchNextPage,updateLoadingStateRowCount:updateLoadingStateRowCount,rowSelection:rowSelection,fullData:fullData,totalFetched:totalFetched,isFetching:isFetching,localPagination:localPagination,setLocalPagination:setLocalPagination}}function useTableActions({table:table,expanded:expanded,setExpanded:setExpanded,onToggleExpansionClick:onToggleExpansionClick,onRowSelectionChange:onRowSelectionChange,inlineRowLoading:inlineRowLoading=false,localPagination:localPagination,setLocalPagination:setLocalPagination,cascadeCollapse:cascadeCollapse=false}){const[bottomReached,setBottomReached]=useState(false);const bottomTimeout=useRef(null);const handleExpandOrCollapse=useCallback((async row=>{if(onToggleExpansionClick)onToggleExpansionClick(row);const anyTopLevelExpanded=table.getRowModel().rows.some((r2=>r2.getIsExpanded()));const isHeaderCollapseAll=row==null&&anyTopLevelExpanded;if(cascadeCollapse&&isHeaderCollapseAll){setExpanded({});return}const updatedExpandedState=await updateExpandAndCollapseState(table.getRowModel(),expanded,row==null?void 0:row.parentId,void 0,cascadeCollapse);setExpanded(updatedExpandedState)}),[expanded,setExpanded,onToggleExpansionClick,table,cascadeCollapse]);const onPageChange=useCallback((page=>{if(inlineRowLoading&&setLocalPagination&&localPagination){setLocalPagination({...localPagination,pageIndex:page-1})}else{table.setPageIndex(page-1)}}),[table,inlineRowLoading,setLocalPagination,localPagination]);const fetchMoreOnBottomReached=useCallback(((containerRef,fetchNextPage,isFetching,totalFetched,totalDBRowCount)=>{if(!containerRef||isFetching||totalFetched>=totalDBRowCount)return;const{scrollTop:scrollTop,scrollHeight:scrollHeight,clientHeight:clientHeight}=containerRef;const distanceFromBottom=scrollHeight-scrollTop-clientHeight;if(distanceFromBottom<50){if(!bottomReached){setBottomReached(true);bottomTimeout.current=setTimeout((()=>{fetchNextPage();setBottomReached(false)}),1e3)}}else{setBottomReached(false);if(bottomTimeout.current){clearTimeout(bottomTimeout.current);bottomTimeout.current=null}}}),[bottomReached]);useEffect((()=>{if(onRowSelectionChange){onRowSelectionChange(table.getState().rowSelection)}}),[table.getState().rowSelection,onRowSelectionChange]);return{handleExpandOrCollapse:handleExpandOrCollapse,onPageChange:onPageChange,fetchMoreOnBottomReached:fetchMoreOnBottomReached}}const AdvancedTable=props=>{const{aria:aria={},actions:actions,cascadeCollapse:cascadeCollapse=false,children:children,className:className,columnDefinitions:columnDefinitions,columnGroupBorderColor:columnGroupBorderColor,columnVisibilityControl:columnVisibilityControl,customSort:customSort,dark:dark=false,data:data={},enableToggleExpansion:enableToggleExpansion="header",enableSortingRemoval:enableSortingRemoval=false,expandedControl:expandedControl,expandByDepth:expandByDepth,onExpandByDepthClick:onExpandByDepthClick,htmlOptions:htmlOptions={},id:id,initialLoadingRowsCount:initialLoadingRowsCount=10,inlineRowLoading:inlineRowLoading=false,loading:loading,maxHeight:maxHeight,onRowToggleClick:onRowToggleClick,onToggleExpansionClick:onToggleExpansionClick,onCustomSortClick:onCustomSortClick,pagination:pagination=false,paginationProps:paginationProps,pinnedRows:pinnedRows,responsive:responsive="scroll",rowStyling:rowStyling,scrollBarNone:scrollBarNone=false,showActionsBar:showActionsBar=true,selectableRows:selectableRows,persistToggleExpansionButton:persistToggleExpansionButton=false,sortControl:sortControl,sortParentOnly:sortParentOnly=false,stickyLeftColumn:stickyLeftColumn,tableData:tableData,tableOptions:tableOptions,tableProps:tableProps,toggleExpansionIcon:toggleExpansionIcon="arrows-from-line",onRowSelectionChange:onRowSelectionChange,virtualizedRows:virtualizedRows=false,allowFullScreen:allowFullScreen=false,fullScreenControl:fullScreenControl}=props;const noTableCardContainer=(tableProps==null?void 0:tableProps.container)===false;const tableWrapperRef=useRef(null);const{table:table,expanded:expanded,setExpanded:setExpanded,hasAnySubRows:hasAnySubRows,selectedRowsLength:selectedRowsLength,fetchNextPage:fetchNextPage,updateLoadingStateRowCount:updateLoadingStateRowCount,fullData:fullData,totalFetched:totalFetched,isFetching:isFetching,localPagination:localPagination,setLocalPagination:setLocalPagination}=useTableState({tableData:tableData,columnDefinitions:columnDefinitions,enableSortingRemoval:enableSortingRemoval,expandedControl:expandedControl,sortControl:sortControl,onRowToggleClick:onRowToggleClick,selectableRows:selectableRows,initialLoadingRowsCount:initialLoadingRowsCount,loading:loading,pagination:pagination,paginationProps:paginationProps,virtualizedRows:virtualizedRows,tableOptions:tableOptions,columnVisibilityControl:columnVisibilityControl,pinnedRows:pinnedRows,rowStyling:rowStyling,inlineRowLoading:inlineRowLoading,sortParentOnly:sortParentOnly});const{handleExpandOrCollapse:handleExpandOrCollapse,onPageChange:onPageChange,fetchMoreOnBottomReached:fetchMoreOnBottomReached}=useTableActions({table:table,expanded:expanded,setExpanded:setExpanded,onToggleExpansionClick:onToggleExpansionClick,onRowSelectionChange:onRowSelectionChange,inlineRowLoading:inlineRowLoading,localPagination:localPagination,setLocalPagination:setLocalPagination,cascadeCollapse:cascadeCollapse});useEffect((()=>{if(!loading){updateLoadingStateRowCount()}}),[loading,updateLoadingStateRowCount]);useEffect((()=>{fetchMoreOnBottomReached(tableWrapperRef.current,fetchNextPage,isFetching,totalFetched,fullData.length)}),[fetchMoreOnBottomReached,fetchNextPage,isFetching,totalFetched,fullData.length]);const[isFullscreen,setIsFullscreen]=useState(false);const toggleFullscreen=useCallback((()=>{setIsFullscreen((prevState=>!prevState))}),[]);useEffect((()=>{if(allowFullScreen&&fullScreenControl){fullScreenControl({toggleFullscreen:toggleFullscreen,isFullscreen:isFullscreen})}}),[allowFullScreen,fullScreenControl,toggleFullscreen,isFullscreen]);const renderFullscreenHeader=()=>{if(!isFullscreen)return null;const defaultMinimizeIcon=jsx("button",{className:"gray-icon fullscreen-icon",onClick:toggleFullscreen,children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:"arrow-down-left-and-arrow-up-right-to-center",...props})});return jsx(Card,{borderNone:true,borderRadius:"none",className:"advanced-table-fullscreen-header",...props,children:jsx(Flex,{justify:"end",children:defaultMinimizeIcon})})};useEffect((()=>{if(!allowFullScreen)return;const handleKeyDown=event=>{if(event.key==="Escape"&&isFullscreen){event.preventDefault();toggleFullscreen()}};document.addEventListener("keydown",handleKeyDown);return()=>{document.removeEventListener("keydown",handleKeyDown)}}),[allowFullScreen,toggleFullscreen,isFullscreen]);const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const isActionBarVisible=selectableRows&&showActionsBar&&selectedRowsLength>0||columnVisibilityControl;const classes=classnames(buildCss("pb_advanced_table"),`advanced-table-responsive-${responsive}`,maxHeight?`advanced-table-max-height-${maxHeight}`:"",{"advanced-table-fullscreen":isFullscreen,"advanced-table-allow-fullscreen":allowFullScreen,"hidden-action-bar":(selectableRows||columnVisibilityControl)&&!isActionBarVisible},{"advanced-table-sticky-left-columns":stickyLeftColumn&&stickyLeftColumn.length>0},{"advanced-table-no-table-container":noTableCardContainer},columnGroupBorderColor?`column-group-border-${columnGroupBorderColor}`:"",scrollBarNone?"advanced-table-hide-scrollbar":"",globalProps(props),className);const tableWrapperStyle=virtualizedRows?getVirtualizedContainerStyles(maxHeight):{};const tableElement=jsx(Table,{className:`${loading?"content-loading":""}`,dark:dark,dataTable:true,numberSpacing:"tabular",responsive:"none",...tableProps,children:children?children:jsxs(Fragment,{children:[jsx(TableHeader,{}),jsx(TableBody,{isFetching:isFetching})]})});return jsxs(Fragment,{children:[pagination&&jsx(TablePagination,{onChange:onPageChange,position:"top",range:paginationProps==null?void 0:paginationProps.range,table:table}),jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,onScroll:virtualizedRows?e2=>fetchMoreOnBottomReached(e2.currentTarget,fetchNextPage,isFetching,totalFetched,fullData.length):void 0,ref:tableWrapperRef,style:tableWrapperStyle,children:[renderFullscreenHeader(),jsx(AdvancedTableProvider,{cascadeCollapse:cascadeCollapse,columnDefinitions:columnDefinitions,columnGroupBorderColor:columnGroupBorderColor,columnVisibilityControl:columnVisibilityControl,customSort:customSort,enableSortingRemoval:enableSortingRemoval,enableToggleExpansion:enableToggleExpansion,enableVirtualization:virtualizedRows,expandByDepth:expandByDepth,expanded:expanded,expandedControl:expandedControl,handleExpandOrCollapse:handleExpandOrCollapse,hasAnySubRows:hasAnySubRows,inlineRowLoading:inlineRowLoading,isActionBarVisible:isActionBarVisible,isFullscreen:isFullscreen,loading:loading,onCustomSortClick:onCustomSortClick,onExpandByDepthClick:onExpandByDepthClick,persistToggleExpansionButton:persistToggleExpansionButton,pinnedRows:pinnedRows,responsive:responsive,rowStyling:rowStyling,selectableRows:selectableRows,setExpanded:setExpanded,showActionsBar:showActionsBar,sortControl:sortControl,stickyLeftColumn:stickyLeftColumn,subRowHeaders:tableOptions==null?void 0:tableOptions.subRowHeaders,table:table,tableContainerRef:tableWrapperRef,toggleExpansionIcon:toggleExpansionIcon,totalAvailableCount:fullData.length,virtualizedRows:virtualizedRows,children:jsxs(React__default.Fragment,{children:[jsx(TableActionBar,{actions:actions,isVisible:isActionBarVisible,selectedCount:selectedRowsLength,type:columnVisibilityControl?"column-visibility":"row-selection"}),virtualizedRows?jsx("div",{style:{overflow:"auto",width:"100%"},children:tableElement}):tableElement]})})]}),pagination&&jsx(TablePagination,{onChange:onPageChange,position:"bottom",range:paginationProps==null?void 0:paginationProps.range,table:table})]})};AdvancedTable.Header=TableHeader;AdvancedTable.Body=TableBody;const breakpoints={xs:"(max-width: 575px)",sm:"(min-width: 576px) and (max-width: 767px)",md:"(min-width: 768px) and (max-width: 991px)",lg:"(min-width: 992px) and (max-width: 1199px)",xl:"(min-width: 1200px)"};const getResponsiveValue=prop=>{if(typeof prop==="string"){return prop}for(const[bp,value]of Object.entries(prop||{})){if(bp!=="default"&&window.matchMedia(breakpoints[bp]).matches){return value}}return(prop==null?void 0:prop.default)||void 0};const Background=props=>{const{alt:alt=void 0,aria:aria={},backgroundColor:backgroundColor="light",backgroundPosition:backgroundPosition="",backgroundRepeat:backgroundRepeat="initial",backgroundSize:backgroundSize="cover",children:children,className:className,customColor:customColor,data:data={},htmlOptions:htmlOptions={},id:id,imageOverlay:imageOverlay,imageUrl:imageUrl="",tag:tag="div",transition:transition=""}=props;const[responsiveProps,setResponsiveProps]=useState({backgroundSize:getResponsiveValue(backgroundSize),backgroundPosition:getResponsiveValue(backgroundPosition),backgroundRepeat:getResponsiveValue(backgroundRepeat),backgroundColor:getResponsiveValue(backgroundColor),imageUrl:getResponsiveValue(imageUrl)});useEffect((()=>{const updateResponsiveProps=()=>{setResponsiveProps({backgroundSize:getResponsiveValue(backgroundSize),backgroundPosition:getResponsiveValue(backgroundPosition),backgroundRepeat:getResponsiveValue(backgroundRepeat),backgroundColor:getResponsiveValue(backgroundColor),imageUrl:getResponsiveValue(imageUrl)})};window.addEventListener("resize",updateResponsiveProps);return()=>window.removeEventListener("resize",updateResponsiveProps)}),[backgroundSize,backgroundPosition,backgroundRepeat,backgroundColor,imageUrl]);const{backgroundColor:resBackgroundColor,backgroundPosition:resBackgroundPosition,backgroundRepeat:resBackgroundRepeat,backgroundSize:resBackgroundSize,imageUrl:resImageUrl}=responsiveProps;const classes=classnames(buildCss("pb_background_kit"),"lazyload",globalProps(props),transition,{[`pb_background_color_${resBackgroundColor}`]:resBackgroundColor&&!customColor,[`pb_background_custom_color`]:!!customColor},imageOverlay?`imageoverlay_${imageOverlay}`:"",className);const backgroundStyle={backgroundColor:customColor||void 0,...resImageUrl!==""?{backgroundImage:resImageUrl?`url(${resImageUrl})`:void 0,backgroundRepeat:resBackgroundRepeat||void 0,backgroundPosition:resBackgroundPosition||void 0,backgroundSize:resBackgroundSize||void 0}:{}};const dynamicInlineProps=globalInlineProps(props);const combinedStyles={...backgroundStyle,...dynamicInlineProps};const Tag=`${tag}`;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx(Tag,{...ariaProps,...dataProps,...htmlProps,alt:alt,className:classes,id:id,style:combinedStyles,children:children})};const BreadCrumbItem=props=>{const{aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,component:component="a",...rest}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const Component=component||"span";const css=classnames(buildCss("pb_bread_crumb_item_kit"),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:css,id:id,children:jsx(Component,{className:"pb_bread_crumb_item",...domSafeProps(rest)})})};const BreadCrumbs=props=>{const{aria:aria={label:"Breadcrumb Navigation"},className:className,data:data={},htmlOptions:htmlOptions={},id:id,children:children}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const css=classnames(buildCss("pb_bread_crumbs_kit"),globalProps(props),className);return jsx("nav",{...ariaProps,...dataProps,...htmlProps,className:css,id:id,children:children})};const ButtonToolbar=props=>{const{aria:aria={},children:children,className:className,data:data={},htmlOptions:htmlOptions={},id:id,orientation:orientation="horizontal",text:text2,variant:variant="primary"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_button_toolbar_kit",orientation,variant),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:children||text2})};const contactTypeMap={cell:"mobile",email:"envelope",extension:"phone-plus",home:"phone",work:"phone-office","work-cell":"phone-laptop","wrong-phone":"phone-slash",international:"globe"};const envelopeIcon=getAllIcons()["envelope"].icon;const formatContact=(contactString,contactType)=>{if(contactType==="email")return contactString;if(contactType==="international")return contactString;const cleaned=contactString.replace(/\D/g,"");const phoneNumber=cleaned.match(/^(1|)?(\d{3})(\d{3})(\d{4})$/);if(contactType==="extension"){return cleaned.match(/^\d{4}$/)}if(phoneNumber){const intlCode=phoneNumber[1]?"+1 ":"";return[intlCode,"(",phoneNumber[2],") ",phoneNumber[3],"-",phoneNumber[4]].join("")}return null};const Contact=props=>{const{aria:aria={},className:className,contactDetail:contactDetail,contactType:contactType,contactValue:contactValue,data:data={},dark:dark=false,htmlOptions:htmlOptions={},iconEnabled:iconEnabled=true,id:id,unstyled:unstyled=false}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_contact_kit"),globalProps(props),className);const formattedValue=formatContact(contactValue,contactType);const content=jsxs(Fragment,{children:[iconEnabled&&(contactType==="email"?jsx(Icon,{className:"svg-inline--fa envelope",customIcon:envelopeIcon,dark:dark,fixedWidth:true}):jsx(Icon,{dark:dark,fixedWidth:true,icon:contactTypeMap[contactType]||"phone"})),iconEnabled?` ${formattedValue} `:formattedValue,contactDetail&&jsx(Caption,{dark:dark,size:"xs",tag:"span",text:contactDetail})]});if(unstyled){return jsx("span",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:content})}return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsx(Body$1,{className:"pb_contact_kit",color:"light",dark:dark,tag:"span",children:content})})};const CopyButton=props=>{const{aria:aria={},className:className,data:data={},from:from="",id:id,text:text2="Copy",timeout:timeout=1e3,tooltipPlacement:tooltipPlacement="bottom",tooltipText:tooltipText="Copied!",value:value="",variant:variant="icon"}=props;const[copied,copy]=usePBCopy({value:value,from:from,timeout:timeout});const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const classes=classnames(buildCss("pb_copy_button_kit"),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,className:classes,id:id,children:jsx(Tooltip,{forceOpenTooltip:copied,placement:tooltipPlacement,showTooltip:false,text:tooltipText,children:variant==="icon"?jsx(CircleIconButton,{icon:"copy",onClick:copy,variant:"link"}):jsx(Button,{icon:"copy",onClick:copy,children:text2})})})};const sizes$1={lg:1,md:3,sm:4};const Currency=props=>{const{abbreviate:abbreviate=false,align:align="left",aria:aria={},amount:amount,data:data={},decimals:decimals="default",emphasized:emphasized=true,htmlOptions:htmlOptions={},id:id,unit:unit,className:className,label:label="",nullDisplay:nullDisplay="",size:size="sm",symbol:symbol="$",variant:variant="default",dark:dark=false,unstyled:unstyled=false,commaSeparator:commaSeparator=false}=props;const convertAmount=input=>{if(typeof input==="number"){if(input===0&&!nullDisplay){return""}return input.toFixed(2)}return input};const currencyAmount=convertAmount(amount);const emphasizedClass=emphasized?"":"_deemphasized";let variantClass;if(variant==="light"){variantClass="_light"}else if(variant==="bold"){variantClass="_bold"}const[whole,decimal="00"]=currencyAmount.split(".");const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_currency_kit",align,size),globalProps(props),className);const getFormattedNumber=input=>new Intl.NumberFormat("en-US",{notation:"compact",maximumFractionDigits:1}).format(input);const getAbbreviatedValue=abbrType=>{const num=`${getFormattedNumber(whole.split(",").join(""))}`,isAmount=abbrType==="amount",isUnit=abbrType==="unit";return isAmount?num.slice(0,-1):isUnit?num.slice(-1):""};const getMatchingDecimalAmount=decimals==="matching"?currencyAmount:whole;const getMatchingDecimalValue=decimals==="matching"?"":`.${decimal}`;const formatAmount=amount2=>{if(!commaSeparator)return amount2;const[wholePart,decimalPart]=amount2.split(".");const formattedWhole=new Intl.NumberFormat("en-US").format(parseInt(wholePart));return decimalPart?`${formattedWhole}.${decimalPart}`:formattedWhole};const swapNegative=size==="sm"&&symbol!=="";const handleNegative=currencyAmount.startsWith("-")&&swapNegative?"-":"";const getAbsoluteAmount=amountString=>amountString.replace(/^-/,"");const getAbbrOrFormatAmount=abbreviate?getAbbreviatedValue("amount"):formatAmount(getMatchingDecimalAmount);const getAmount=swapNegative?getAbsoluteAmount(getAbbrOrFormatAmount):getAbbrOrFormatAmount;const getAbbreviation=abbreviate?getAbbreviatedValue("unit"):null;const getDecimalValue=abbreviate?"":getMatchingDecimalValue;return jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:[jsx(Caption,{dark:dark,children:label}),jsx("div",{className:`pb_currency_wrapper${variantClass||emphasizedClass}`,children:unstyled?nullDisplay&&!amount?jsx("div",{children:nullDisplay}):jsxs(Fragment,{children:[jsxs("div",{children:[handleNegative,symbol]}),jsx("div",{children:getAmount}),jsxs("div",{children:[getAbbreviation,unit?unit:getDecimalValue]})]}):nullDisplay&&!amount?jsx(Title,{className:"pb_currency_value",dark:dark,size:sizes$1[size],children:nullDisplay}):jsxs(Fragment,{children:[jsxs(Body$1,{className:"dollar_sign",color:"light",dark:dark,children:[handleNegative,symbol]}),jsx(Title,{className:"pb_currency_value",dark:dark,size:sizes$1[size],children:getAmount}),jsxs(Body$1,{className:"unit",color:"light",dark:dark,children:[getAbbreviation,unit?unit:getDecimalValue]})]})})]})};const statusMap={increase:"positive",decrease:"negative",neutral:"neutral"};const iconMap$1={increase:"arrow-up",decrease:"arrow-down"};const StatChange=props=>{const{change:change="neutral",className:className,dark:dark=false,htmlOptions:htmlOptions={},icon:icon,id:id,value:value}=props;const status=statusMap[change];let returnedIcon=iconMap$1[change];if(icon){returnedIcon=icon}const htmlProps=buildHtmlProps(htmlOptions);return jsx(Fragment,{children:value&&jsx("div",{className:classnames(buildCss("pb_stat_change_kit",status),globalProps(props),className),id:id,...htmlProps,children:jsxs(Body$1,{dark:dark,status:status,children:[" ",returnedIcon&&jsxs(Fragment,{children:[jsx(Icon,{dark:dark,fixed_width:true,icon:returnedIcon})," "]}),`${value}%`]})})})};const StatValue=props=>{const{className:className,htmlOptions:htmlOptions={},id:id,unit:unit,value:value=0}=props;const htmlProps=buildHtmlProps(htmlOptions);const displayValue=function(value2){if(value2||value2===0){return jsx(Title,{size:1,tag:"span",text:`${value2}`})}};const displayUnit=function(unit2){if(unit2){return jsx(Title,{size:3,tag:"span",text:unit2})}};return jsx("div",{className:classnames("pb_stat_value_kit",globalProps(props),className),id:id,...htmlProps,children:jsxs("div",{className:"pb_stat_value_wrapper",children:[displayValue(value)," ",displayUnit(unit)]})})};const DashboardValue=props=>{const{align:align="left",aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,statChange:statChange={},statLabel:statLabel,statValue:statValue={}}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_dashboard_value_kit",align),globalProps(props),className);return jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:[statLabel&&jsx(Body$1,{color:"light",children:statLabel}),statValue&&jsx(StatValue,{unit:statValue.unit,value:statValue.value}),statChange&&jsx(StatChange,{change:statChange.change,value:statChange.value})]})};const PbDate=props=>{const{aria:aria={},alignment:alignment="left",className:className,dark:dark=false,data:data={},htmlOptions:htmlOptions={},id:id,showDayOfWeek:showDayOfWeek=false,showCurrentYear:showCurrentYear=false,showIcon:showIcon=false,size:size="md",unstyled:unstyled=false,value:value}=props;const weekday=DateTime$1.toWeekday(value);const month=DateTime$1.toMonth(value);const day=DateTime$1.toDay(value);const year=DateTime$1.toYear(value);const currentYear=(new Date).getFullYear();const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_date_kit",alignment),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:unstyled?jsxs(Fragment,{children:[showIcon&&jsx("div",{children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt"})}),showDayOfWeek&&jsxs(Fragment,{children:[jsx("div",{children:weekday}),jsx("div",{children:"•"})]}),jsxs("span",{children:[jsxs("span",{children:[month," ",day]}),(currentYear!==year||showCurrentYear)&&jsx("span",{children:`, ${year}`})]})]}):size=="md"||size=="lg"?jsxs(Title,{dark:dark,size:4,tag:"h4",children:[showIcon&&jsx(Body$1,{className:"pb_icon_kit_container",color:"light",tag:"span",children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt"})}),showDayOfWeek&&jsxs(Fragment,{children:[weekday,jsx(Body$1,{color:"light",tag:"span",text:" • "})]}),jsxs("span",{children:[month," ",day]}),(currentYear!==year||showCurrentYear)&&jsx("span",{children:`, ${year}`})]}):jsxs(Fragment,{children:[showIcon&&jsx(Caption,{className:"pb_icon_kit_container",dark:dark,tag:"span",children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt",size:"sm"})}),showDayOfWeek&&jsxs(Fragment,{children:[jsx(Caption,{dark:dark,tag:"div",children:weekday}),jsx(Caption,{color:"light",dark:dark,tag:"div",text:" • "})]}),jsxs(Caption,{dark:dark,tag:"span",children:[month," ",day,(currentYear!==year||showCurrentYear)&&jsx(Fragment,{children:`, ${year}`})]})]})})};const DatePicker=props=>{if(props.plugins);const{allowInput:allowInput=false,aria:aria={},className:className,customQuickPickDates:customQuickPickDates,dark:dark=false,data:data={},defaultDate:defaultDate="",disableDate:disableDate=null,disableInput:disableInput,disableRange:disableRange=null,disableWeekdays:disableWeekdays=null,enableTime:enableTime=false,error:error,format:format="m/d/Y",hideIcon:hideIcon=false,hideLabel:hideLabel=false,htmlOptions:htmlOptions={},id:id,initializeOnce:initializeOnce=false,inLine:inLine=false,inputAria:inputAria={},inputData:inputData={},inputOnChange:inputOnChange,inputValue:inputValue,label:label="Date Picker",maxDate:maxDate,minDate:minDate,mode:mode="single",name:name,onChange:onChange=()=>{},onClose:onClose,pickerId:pickerId,placeholder:placeholder="Select Date",plugins:plugins=false,position:position,positionElement:positionElement,requiredIndicator:requiredIndicator,scrollContainer:scrollContainer,selectionType:selectionType="",showTimezone:showTimezone=false,staticPosition:staticPosition=true,thisRangesEndToday:thisRangesEndToday=false,yearRange:yearRange=[1900,2100],controlsStartId:controlsStartId,controlsEndId:controlsEndId,syncStartWith:syncStartWith,syncEndWith:syncEndWith}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const inputAriaProps=buildAriaProps(inputAria);const inputDataProps=buildDataProps(inputData);const getCursorStyle=cursor=>{if(disableInput)return"not-allowed";if(cursor){return camelToSnakeCase(cursor).replace(/_/g,"-")}return"pointer"};useEffect((()=>{datePickerHelper({allowInput:allowInput,customQuickPickDates:customQuickPickDates,defaultDate:defaultDate,disableDate:disableDate,disableRange:disableRange,disableWeekdays:disableWeekdays,enableTime:enableTime,format:format,maxDate:maxDate,minDate:minDate,mode:mode,onChange:onChange,onClose:onClose,pickerId:pickerId,plugins:plugins,position:position,positionElement:positionElement,selectionType:selectionType,showTimezone:showTimezone,staticPosition:staticPosition,thisRangesEndToday:thisRangesEndToday,yearRange:yearRange,controlsStartId:controlsStartId,controlsEndId:controlsEndId,syncStartWith:syncStartWith,syncEndWith:syncEndWith,required:false},scrollContainer)}),initializeOnce?[]:void 0);const filteredProps={...props};if(filteredProps.marginBottom===void 0){filteredProps.marginBottom="sm"}filteredProps==null?true:delete filteredProps.position;const classes=classnames(buildCss("pb_date_picker_kit"),globalProps(filteredProps),error?"error":null,inLine&&"inline-date-picker",className);const iconWrapperClass=()=>{let base="cal_icon_wrapper";if(dark){base+=" dark"}if(hideLabel){base+=" no_label_shift"}if(error){base+=" error"}if(disableInput){base+=" disabled"}return base};const angleDown=getAllIcons()["angleDown"].icon;const errorId=error?`${pickerId}-error`:void 0;return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs("div",{...inputAriaProps,...inputDataProps,className:"input_wrapper",children:[!hideLabel&&jsx("label",{htmlFor:pickerId,children:requiredIndicator?jsxs(Caption,{className:"pb_date_picker_kit_label",color:"lighter",children:[label," ",jsx("span",{style:{color:`${colors.error}`},children:"*"})]}):jsx(Caption,{className:"pb_date_picker_kit_label",color:"lighter",text:label})}),jsxs(Fragment,{children:[jsxs("div",{className:"date_picker_input_wrapper",children:[jsx("input",{"aria-describedby":errorId,"aria-invalid":!!error,autoComplete:"off",className:"date_picker_input",disabled:disableInput,id:pickerId,name:name,onChange:inputOnChange,placeholder:placeholder,style:{cursor:getCursorStyle(filteredProps.cursor)},value:inputValue}),error&&jsx(Body$1,{aria:{atomic:"true",live:"polite"},htmlOptions:{role:"alert"},id:errorId,status:"negative",text:error,variant:null})]}),!hideIcon&&!inLine&&jsx("div",{className:iconWrapperClass(),id:`cal-icon-${pickerId}`,children:jsx(Icon,{className:"cal_icon",icon:"calendar-alt"})}),inLine?jsxs("div",{children:[jsx("div",{className:`${iconWrapperClass()} date-picker-inline-icon-plus`,id:`${pickerId}-icon-plus`,children:jsx(Icon,{className:"date-picker-plus-icon",icon:"plus"})}),jsx("div",{className:`${iconWrapperClass()} date-picker-inline-angle-down`,id:`${pickerId}-angle-down`,children:jsx(Icon,{className:"angle_down_icon svg-inline--fa",customIcon:angleDown})})]}):null]})]})})};const dateTimestamp$1=(dateValue,includeYear)=>{if(includeYear){return`${DateTime$1.toMonth(dateValue)} ${DateTime$1.toDay(dateValue)}, ${DateTime$1.toYear(dateValue)}`}else{return`${DateTime$1.toMonth(dateValue)} ${DateTime$1.toDay(dateValue)}`}};const dateTimeIso$1=dateValue=>DateTime$1.toIso(dateValue);const DateRangeInline=props=>{const{align:align="left",className:className,dark:dark=false,data:data={},endDate:endDate,htmlOptions:htmlOptions={},icon:icon=false,size:size="sm",startDate:startDate,showCurrentYear:showCurrentYear=false}=props;const dateInCurrentYear=()=>{const currentDate=new Date;return(startDate==null?void 0:startDate.getFullYear())===(endDate==null?void 0:endDate.getFullYear())&&(startDate==null?void 0:startDate.getFullYear())===currentDate.getFullYear()};const dateRangeClasses=buildCss("pb_date_range_inline_kit",align);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const renderTime=date=>{const includeYear=showCurrentYear||!dateInCurrentYear();return jsx("time",{dateTime:dateTimeIso$1(date),children:` ${dateTimestamp$1(date,includeYear)} `})};return jsx("div",{...dataProps,...htmlProps,className:classnames(dateRangeClasses,globalProps(props),className),children:jsxs("div",{className:"pb_date_range_inline_wrapper",children:[size==="xs"&&jsxs(Fragment,{children:[icon&&jsx(Caption,{dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_icon",dark:dark,fixedWidth:true,icon:"calendar-alt",size:size,tag:"span"})}),jsx(Caption,{dark:dark,tag:"span",children:renderTime(startDate)}),jsx(Caption,{dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_arrow",dark:dark,fixedWidth:true,icon:"long-arrow-right",tag:"span"})}),jsx(Caption,{dark:dark,tag:"span",children:renderTime(endDate)})]}),size==="sm"&&jsxs(Fragment,{children:[icon&&jsx(Body$1,{color:"light",dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_icon",dark:dark,fixedWidth:true,icon:"calendar-alt",size:size,tag:"span"})}),jsx(Body$1,{dark:dark,tag:"span",children:renderTime(startDate)}),jsx(Body$1,{color:"light",dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_arrow",dark:dark,fixedWidth:true,icon:"long-arrow-right",tag:"span"})}),jsx(Body$1,{dark:dark,tag:"span",children:renderTime(endDate)})]})]})})};const DateYearStacked=props=>{const{align:align="left",className:className,dark:dark=false,date:date,data:data={},htmlOptions:htmlOptions={}}=props;const css=classnames(buildCss("pb_date_year_stacked",align),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsxs("div",{...dataProps,...htmlProps,className:css,children:[jsx(Title,{dark:dark,size:4,text:`${DateTime$1.toDay(date)} ${DateTime$1.toMonth(date).toUpperCase()}`}),jsx(Body$1,{color:"light",children:DateTime$1.toYear(date)})]})};const DateRangeStacked=props=>{const{className:className,dark:dark=false,endDate:endDate,htmlOptions:htmlOptions={},startDate:startDate,data:data={}}=props;const css=classnames(buildCss("pb_date_range_stacked"),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx("div",{...dataProps,...htmlProps,className:css,children:jsxs(Flex,{vertical:"center",children:[jsx(FlexItem,{children:jsx(DateYearStacked,{align:"right",dark:dark,date:startDate})}),jsx(FlexItem,{children:jsx("div",{children:jsx(Body$1,{color:"light",tag:"span",children:jsx(Icon,{className:"pb_date_range_stacked_arrow",fixedWidth:true,icon:"long-arrow-right"})})})}),jsx(FlexItem,{children:jsx(DateYearStacked,{dark:dark,date:endDate})})]})})};const sizes={sm:4,md:3};const DateStacked=props=>{const{align:align="left",bold:bold=false,reverse:reverse=false,className:className,dark:dark=false,date:date,data:data={},htmlOptions:htmlOptions={},size:size="sm",showCurrentYear:showCurrentYear=false}=props;const classes=classnames(buildCss("pb_date_stacked_kit",align,size,{dark:dark,reverse:reverse}),globalProps(props),className);const currentYear=(new Date).getFullYear();const inputYear=DateTime$1.toYear(date);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx(Fragment,{children:bold==false?jsxs("div",{...dataProps,...htmlProps,className:classes,children:[jsxs("div",{className:"pb_date_stacked_day_month",children:[jsx(Caption,{text:DateTime$1.toMonth(date).toUpperCase()}),jsx(Title,{dark:dark,size:sizes[size],text:DateTime$1.toDay(date).toString()})]}),(currentYear!=inputYear||showCurrentYear)&&jsx(Caption,{size:"xs",children:inputYear})]}):jsx("div",{...dataProps,...htmlProps,className:classes,children:jsxs("div",{className:"pb_date_stacked_day_month",children:[jsx(Title,{bold:true,dark:dark,size:"4",text:DateTime$1.toMonth(date)}),jsx(Title,{bold:true,dark:dark,size:"4",text:DateTime$1.toDay(date).toString()}),(currentYear!=inputYear||showCurrentYear)&&jsx(Title,{size:"4",children:inputYear})]})})})};const Time=props=>{const{align:align,className:className,date:date,htmlOptions:htmlOptions={},showIcon:showIcon,size:size,timeZone:timeZone,unstyled:unstyled=false,showTimezone:showTimezone=true}=props;const classes=classnames(buildCss("pb_time_kit",align,size),globalProps(props),className);const clockIcon=getAllIcons()["clock"];const htmlProps=buildHtmlProps(htmlOptions);return jsxs("div",{...htmlProps,className:classes,children:[showIcon&&(unstyled?jsxs("span",{children:[jsx(Icon,{className:"svg-inline--fa clock",customIcon:clockIcon.icon})," "]}):jsx(Fragment,{children:jsxs(Body$1,{color:"light",tag:"span",children:[jsx(Icon,{className:"svg-inline--fa clock",customIcon:clockIcon.icon,fixedWidth:true,size:size==="md"?"":"sm"})," "]})})),jsx("time",{dateTime:date.toLocaleString(),children:jsx("span",{children:unstyled?jsxs(Fragment,{children:[jsx("span",{children:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx("span",{children:DateTime$1.toTimeZone(date,timeZone)})]}):size==="md"?jsxs(Fragment,{children:[jsx(Body$1,{className:"pb_time",tag:"span",text:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx(Body$1,{color:"light",tag:"span",text:DateTime$1.toTimeZone(date,timeZone)})]}):jsxs(Fragment,{children:[jsx(Caption,{color:"light",tag:"span",text:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx(Caption,{color:"light",tag:"span",text:DateTime$1.toTimeZone(date,timeZone)})]})})})]})};const DateTime=props=>{const{align:align="left",aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},showDayOfWeek:showDayOfWeek=false,datetime:datetime2,id:id,showCurrentYear:showCurrentYear=false,showIcon:showIcon=false,size:size="md",timeZone:timeZone="America/New_York"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_date_time",size),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs(Flex,{horizontal:align,vertical:"baseline",children:[jsx(PbDate,{showCurrentYear:showCurrentYear,showDayOfWeek:showDayOfWeek,size:size,value:datetime2}),jsx(Time,{date:datetime2,marginLeft:"sm",showIcon:showIcon,size:size,timeZone:timeZone})]})})};const TimeStackedDefault=props=>{if(props.date);const{align:align="left",className:className,dark:dark,data:data={},date:date,htmlOptions:htmlOptions={},time:time,timeZone:timeZone}=props;const classes=classnames(buildCss("pb_time_stacked_kit",align),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx("div",{className:classes,...dataProps,...htmlProps,children:jsx(Body$1,{className:classnames("pb_time_stacked","time-spacing"),color:"light",dark:dark,children:jsxs("time",{children:[DateTime$1.toTimeWithMeridiem(date?date:new Date(time),timeZone),jsx(Caption,{className:"pb_time_stacked",color:"light",dark:dark,tag:"span",text:DateTime$1.toTimeZone(date?date:new Date(time),timeZone)})]})})})};const DateTimeStacked=props=>{if(props.date);const{date:date,datetime:datetime2,dark:dark,htmlOptions:htmlOptions={},timeZone:timeZone="America/New_York",showCurrentYear:showCurrentYear=false}=props;const classes=buildCss("pb_date_time_stacked_kit",globalProps(props));const htmlProps=buildHtmlProps(htmlOptions);return jsxs(Flex,{inline:false,vertical:"stretch",...htmlProps,...props,children:[jsx(FlexItem,{children:jsx(DateStacked,{align:"right",bold:true,dark:dark,date:date||datetime2,showCurrentYear:showCurrentYear})}),jsx(SectionSeparator,{className:"date-time-padding",orientation:"vertical"}),jsx(FlexItem,{children:jsx(TimeStackedDefault,{className:classes,dark:dark,date:date||datetime2,timeZone:timeZone})})]})};var lib={exports:{}};var Modal$1={};var propTypes={exports:{}};var ReactPropTypesSecret_1;var hasRequiredReactPropTypesSecret;function requireReactPropTypesSecret(){if(hasRequiredReactPropTypesSecret)return ReactPropTypesSecret_1;hasRequiredReactPropTypesSecret=1;var ReactPropTypesSecret="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";ReactPropTypesSecret_1=ReactPropTypesSecret;return ReactPropTypesSecret_1}var factoryWithThrowingShims;var hasRequiredFactoryWithThrowingShims;function requireFactoryWithThrowingShims(){if(hasRequiredFactoryWithThrowingShims)return factoryWithThrowingShims;hasRequiredFactoryWithThrowingShims=1;var ReactPropTypesSecret=requireReactPropTypesSecret();function emptyFunction(){}function emptyFunctionWithReset(){}emptyFunctionWithReset.resetWarningCache=emptyFunction;factoryWithThrowingShims=function(){function shim(props,propName,componentName,location,propFullName,secret){if(secret===ReactPropTypesSecret){return}var err=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");err.name="Invariant Violation";throw err}shim.isRequired=shim;function getShim(){return shim}var ReactPropTypes={array:shim,bigint:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,elementType:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim,exact:getShim,checkPropTypes:emptyFunctionWithReset,resetWarningCache:emptyFunction};ReactPropTypes.PropTypes=ReactPropTypes;return ReactPropTypes};return factoryWithThrowingShims}var hasRequiredPropTypes;function requirePropTypes(){if(hasRequiredPropTypes)return propTypes.exports;hasRequiredPropTypes=1;{propTypes.exports=requireFactoryWithThrowingShims()()}return propTypes.exports}var ModalPortal={exports:{}};var focusManager={};var tabbable={exports:{}};var hasRequiredTabbable;function requireTabbable(){if(hasRequiredTabbable)return tabbable.exports;hasRequiredTabbable=1;(function(module,exports){Object.defineProperty(exports,"__esModule",{value:true});exports.default=findTabbableDescendants;
+   */function flexRender(Comp,props){return!Comp?null:isReactComponent(Comp)?React.createElement(Comp,props):Comp}function isReactComponent(component){return isClassComponent(component)||typeof component==="function"||isExoticComponent(component)}function isClassComponent(component){return typeof component==="function"&&(()=>{const proto=Object.getPrototypeOf(component);return proto.prototype&&proto.prototype.isReactComponent})()}function isExoticComponent(component){return typeof component==="object"&&typeof component.$$typeof==="symbol"&&["react.memo","react.forward_ref"].includes(component.$$typeof.description)}function useReactTable(options){const resolvedOptions={state:{},onStateChange:()=>{},renderFallbackValue:null,...options};const[tableRef]=React.useState((()=>({current:createTable(resolvedOptions)})));const[state,setState]=React.useState((()=>tableRef.current.initialState));tableRef.current.setOptions((prev=>({...prev,...options,state:{...state,...options.state},onStateChange:updater=>{setState(updater);options.onStateChange==null||options.onStateChange(updater)}})));return tableRef.current}const displayIcon=icon=>{if(typeof icon==="string"){return[icon,icon]}return icon};const SortIconButton=({header:header,sortIcon:sortIcon,enableSortingRemoval:enableSortingRemoval})=>{const firstIcon=displayIcon(sortIcon)[0];const secondIcon=displayIcon(sortIcon)[1];return jsxs(Fragment,{children:[header.column.getIsSorted()==="desc"&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:firstIcon})},firstIcon),header.column.getIsSorted()==="asc"&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:secondIcon})},secondIcon),header.column.getIsSorted()===false&&jsx("div",{className:"sort-button-icon",style:{paddingLeft:`${(header==null?void 0:header.index)===0?"2px":"4px"}`},children:jsx(Icon,{icon:enableSortingRemoval?"arrow-up-arrow-down":secondIcon})},enableSortingRemoval?"arrow-up-arrow-down":secondIcon)]})};const ToggleIconButton=({row:row,onClick:onClick})=>{const{toggleExpansionIcon:toggleExpansionIcon}=useContext(AdvancedTableContext);return jsx("button",{className:"gray-icon toggle-all-icon",onClick:()=>onClick(row),children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:displayIcon(toggleExpansionIcon)[0]})},displayIcon(toggleExpansionIcon)[0])};const findColumnDefByAccessor=(defs,targetAccessor)=>{for(const def of defs){if(def.accessor===targetAccessor){return def}if(Array.isArray(def.columns)&&def.columns.length){const found=findColumnDefByAccessor(def.columns,targetAccessor);if(found)return found}}return void 0};function cssLength(value){if(value===void 0||value===null||value==="")return void 0;if(typeof value==="number"&&Number.isFinite(value))return`${value}px`;return String(value)}const columnStylingKeys=column=>column.columnStyling||column.column_styling||{};function readStylingLength(styling,camel,snake){if(snake)return styling[camel]??styling[snake];return styling[camel]}const PLAYBOOK_FORWARDED_COLUMN_DEF_SIZING_KEYS=["size","minSize","maxSize"];function buildTanStackSizingFromColumn(column){const out={};PLAYBOOK_FORWARDED_COLUMN_DEF_SIZING_KEYS.forEach((key=>{const v=column[key];if(typeof v==="number"&&Number.isFinite(v))out[key]=v}));const styling=columnStylingKeys(column);if(out.size===void 0&&readStylingLength(styling,"width")!==void 0){const w=readStylingLength(styling,"width");if(typeof w==="number"&&Number.isFinite(w))out.size=w}if(out.minSize===void 0&&readStylingLength(styling,"minWidth","min_width")!==void 0){const w=readStylingLength(styling,"minWidth","min_width");if(typeof w==="number"&&Number.isFinite(w))out.minSize=w}if(out.maxSize===void 0&&readStylingLength(styling,"maxWidth","max_width")!==void 0){const w=readStylingLength(styling,"maxWidth","max_width");if(typeof w==="number"&&Number.isFinite(w))out.maxSize=w}if(out.size!==void 0&&out.minSize===void 0&&out.maxSize===void 0){out.minSize=out.size;out.maxSize=out.size}return out}function buildPlaybookColumnLayoutStyles(column,tanStackSizing){const styling=columnStylingKeys(column);const styles2={};const stylingWidth=readStylingLength(styling,"width");const stylingMin=readStylingLength(styling,"minWidth","min_width");const stylingMax=readStylingLength(styling,"maxWidth","max_width");const hasStylingWidth=stylingWidth!==void 0&&stylingWidth!=="";const hasStylingMin=stylingMin!==void 0&&stylingMin!=="";const hasStylingMax=stylingMax!==void 0&&stylingMax!=="";let widthValue=hasStylingWidth?stylingWidth:tanStackSizing.size;let minValue=hasStylingMin?stylingMin:tanStackSizing.minSize;let maxValue=hasStylingMax?stylingMax:tanStackSizing.maxSize;const preferredForLock=hasStylingWidth?stylingWidth:tanStackSizing.size;const explicitMin=hasStylingMin||tanStackSizing.minSize!==void 0;const explicitMax=hasStylingMax||tanStackSizing.maxSize!==void 0;if(preferredForLock!==void 0&&preferredForLock!==""&&!explicitMin&&!explicitMax){minValue=preferredForLock;maxValue=preferredForLock;widthValue=preferredForLock}const widthCss=cssLength(widthValue);const minCss=cssLength(minValue);const maxCss=cssLength(maxValue);if(widthCss!==void 0)styles2.width=widthCss;if(minCss!==void 0)styles2.minWidth=minCss;if(maxCss!==void 0)styles2.maxWidth=maxCss;return styles2}function playbookColumnLayoutStylesFromMeta(columnDef){const meta=columnDef==null?void 0:columnDef.meta;return(meta==null?void 0:meta.playbookColumnLayoutStyles)||{}}const filterExpandableRows=expandedState=>{for(const expandedRow in expandedState){if(expandedState[expandedRow]===false){delete expandedState[expandedRow]}}return expandedState};const getDescendantRowIds=row=>{const ids=[];for(const sub of row.subRows||[]){ids.push(sub.id);ids.push(...getDescendantRowIds(sub))}return ids};const updateExpandAndCollapseState=(tableRows,expanded,targetParent,targetDepth,cascadeCollapse)=>{const updateExpandedRows={};const rows=targetDepth!==void 0?tableRows.flatRows:tableRows.rows;const rowsToToggle=[];for(const row of rows){const shouldBeUpdated=targetDepth!==void 0?row.depth<=targetDepth:targetParent===void 0?row.depth===0:targetParent===row.parentId;if(shouldBeUpdated){rowsToToggle.push(row)}}const anyCollapsed=rowsToToggle.some((row=>!row.getIsExpanded()));const isExpandAction=anyCollapsed;for(const row of rowsToToggle){const shouldUpdate=isExpandAction||targetDepth===void 0?true:row.depth===targetDepth;if(shouldUpdate){updateExpandedRows[row.id]=isExpandAction}}const updatedExpandedState=filterExpandableRows({...expanded,...updateExpandedRows});if(cascadeCollapse&&!isExpandAction){const idsToRemove=new Set;for(const row of rowsToToggle){const shouldUpdate=targetDepth===void 0?true:row.depth===targetDepth;if(shouldUpdate){getDescendantRowIds(row).forEach((id=>idsToRemove.add(id)))}}idsToRemove.forEach((id=>delete updatedExpandedState[id]))}return updatedExpandedState};const isChrome=()=>{const userAgent=navigator.userAgent.toLowerCase();return userAgent.includes("chrome")&&!userAgent.includes("edg")};const TableHeaderCell=({enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:headerChildren,isPinnedLeft:isPinnedLeft=false,loading:loading,sortIcon:sortIcon,table:table})=>{var _a,_b,_c,_d,_e,_f,_g;const{columnDefinitions:columnDefinitions,expanded:expanded,setExpanded:setExpanded,expandByDepth:expandByDepth,enableSortingRemoval:enableSortingRemoval,onExpandByDepthClick:onExpandByDepthClick,toggleExpansionIcon:toggleExpansionIcon,sortControl:sortControl,responsive:responsive,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,showActionsBar:showActionsBar,persistToggleExpansionButton:persistToggleExpansionButton,stickyLeftColumn:stickyLeftColumn,inlineRowLoading:inlineRowLoading,isActionBarVisible:isActionBarVisible,cascadeCollapse:cascadeCollapse}=useContext(AdvancedTableContext);const toggleSortButton=event=>{if(sortControl){const sortIsDesc=(header==null?void 0:header.column.getIsSorted())==="desc";sortIsDesc?sortControl.onChange({desc:true}):sortControl.onChange({desc:false})}else{header==null?void 0:header.column.getToggleSortingHandler()(event)}};const alignmentMap={left:"start",center:"center",right:"end"};const colDef=header?findColumnDefByAccessor(columnDefinitions,header.column.id):void 0;const headerAlignment=((_a=colDef==null?void 0:colDef.columnStyling)==null?void 0:_a.headerAlignment)??((_b=colDef==null?void 0:colDef.columnStyling)==null?void 0:_b.headerAligment);const headerBackgroundColor=(_c=colDef==null?void 0:colDef.columnStyling)==null?void 0:_c.headerBackgroundColor;const headerFontColor=(_d=colDef==null?void 0:colDef.columnStyling)==null?void 0:_d.headerFontColor;const isLeafColumn=(header==null?void 0:header.column.getLeafColumns().length)===1&&(header==null?void 0:header.column.getLeafColumns()[0].id)===header.column.id;const columnHasVisibleLeaf=col=>{var _a2;return((_a2=col.getIsVisible)==null?void 0:_a2.call(col))||Array.isArray(col.columns)&&col.columns.some((child=>columnHasVisibleLeaf(child)))};const isLastHeaderCell=(()=>{var _a2;if(!header)return false;if(header.colSpan>1&&header.column.parent!==void 0)return true;const parent=header.column.parent;if(!parent){const topHeaders=table==null?void 0:table.getHeaderGroups()[0].headers.filter((h2=>columnHasVisibleLeaf(h2.column)));return((_a2=topHeaders==null?void 0:topHeaders.at(-1))==null?void 0:_a2.id)===header.id}const visibleSiblings=parent.columns.filter(columnHasVisibleLeaf);return visibleSiblings.at(-1)===header.column})();const cellClassName=classnames("table-header-cells",`${showActionsBar&&isActionBarVisible&&"header-cells-with-actions"}`,`${isChrome()?"chrome-styles":""}`,`${enableSorting?"table-header-cells-active":""}`,{"pinned-left":responsive==="scroll"&&isPinnedLeft},isLastHeaderCell?"last-header-cell":"",stickyLeftColumn&&stickyLeftColumn.length>0&&isPinnedLeft?"sticky-left":"",((_e=colDef==null?void 0:colDef.columnStyling)==null?void 0:_e.headerPadding)&&`p_${(_f=colDef==null?void 0:colDef.columnStyling)==null?void 0:_f.headerPadding}`);const cellId=`${loading?`loading-${header==null?void 0:header.id}`:`${header==null?void 0:header.id}`}`;const isToggleExpansionEnabledLoading=(header==null?void 0:header.index)===0&&loading&&(enableToggleExpansion==="all"||"header")&&enableToggleExpansion!=="none";const isToggleExpansionEnabled=(header==null?void 0:header.index)===0&&!loading&&(enableToggleExpansion==="all"||"header")&&enableToggleExpansion!=="none";let justifyHeader;if(headerAlignment&&alignmentMap[headerAlignment]){justifyHeader=alignmentMap[headerAlignment]}else if((header==null?void 0:header.index)===0&&hasAnySubRows||(header==null?void 0:header.index)===0&&inlineRowLoading||(header==null?void 0:header.index)===0&&isToggleExpansionEnabled){justifyHeader=enableSorting?"between":"start"}else{justifyHeader=isLeafColumn?"end":"center"}const[showPopover,setShowPopover]=useState(false);const togglePopover=()=>setShowPopover((prev=>!prev));const handleShouldClose=shouldClose=>setShowPopover(!shouldClose);const popoverReference=jsx("div",{className:"gray-icon toggle-all-icon",onClick:togglePopover,children:jsx(Icon,{icon:displayIcon(toggleExpansionIcon)[0]})});const handleExpandDepth=depth=>{if(onExpandByDepthClick){const flatRows=table==null?void 0:table.getRowModel().flatRows;onExpandByDepthClick(depth,flatRows)}const updated=updateExpandAndCollapseState(table.getRowModel(),expanded,void 0,depth,cascadeCollapse);setExpanded(updated)};return jsx("th",{align:headerAlignment?headerAlignment:"right",className:cellClassName,colSpan:header==null?void 0:header.colSpan,id:cellId,style:{...playbookColumnLayoutStylesFromMeta((_g=header==null?void 0:header.column)==null?void 0:_g.columnDef),backgroundColor:headerBackgroundColor,color:headerFontColor,left:isPinnedLeft?(header==null?void 0:header.index)===1?"180px":`${header==null?void 0:header.column.getStart("left")}px`:void 0},children:(header==null?void 0:header.isPlaceholder)?null:headerChildren&&(header==null?void 0:header.index)===0?jsxs(Flex,{alignItems:"center",children:[headerChildren,jsx("div",{children:flexRender(header.column.columnDef.header,header.getContext())})]}):jsxs(Flex,{alignItems:"center",justify:justifyHeader,children:[selectableRows&&(header==null?void 0:header.index)===0&&hasAnySubRows&&jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()}),isToggleExpansionEnabled&&(hasAnySubRows||inlineRowLoading&&persistToggleExpansionButton)&&!expandByDepth&&jsx(ToggleIconButton,{onClick:handleExpandOrCollapse}),isToggleExpansionEnabled&&hasAnySubRows&&expandByDepth&&jsx(PbReactPopover,{closeOnClick:"any",placement:"bottom-start",reference:popoverReference,shouldClosePopover:handleShouldClose,show:showPopover,zIndex:3,children:expandByDepth.map(((option,index)=>jsxs(Fragment,{children:[jsx(Flex,{alignItems:"center",className:"pb-advanced-table-popover-option",cursor:"pointer",htmlOptions:{onClick:()=>{handleExpandDepth(option.depth)}},paddingX:"sm",paddingY:"xs",children:option.label}),index!==expandByDepth.length-1&&jsx(SectionSeparator,{})]})))}),isToggleExpansionEnabledLoading&&jsx("div",{className:"loading-toggle-icon header-toggle-icon"}),jsxs(Flex,{className:`${(header==null?void 0:header.index)===0&&enableSorting&&"header-sort-button pb_th_link"} ${(header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())&&"header-sort-secondary-columns"}`,cursor:(header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting?"pointer":"default",...((header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting)&&{htmlOptions:{onClick:event=>toggleSortButton(event),onKeyDown:event=>{if(event.key==="Enter"){toggleSortButton(event)}},tabIndex:0}},justify:(header==null?void 0:header.index)===0&&enableSorting?"between":headerAlignment?alignmentMap[headerAlignment]:"none",paddingLeft:(header==null?void 0:header.index)===0?enableSorting?"xxs":"xs":"none",children:[jsx("div",{children:flexRender(header==null?void 0:header.column.columnDef.header,header==null?void 0:header.getContext())}),((header==null?void 0:header.index)!==0&&(header==null?void 0:header.column.getCanSort())||(header==null?void 0:header.index)===0&&enableSorting)&&(loading?jsx("div",{className:"loading-toggle-icon"}):jsx(SortIconButton,{enableSortingRemoval:enableSortingRemoval,header:header,sortIcon:sortIcon}))]})]})},`${header==null?void 0:header.id}-header`)};const TableHeader=({children:children,className:className,dark:dark=false,enableSorting:enableSorting=false,id:id,sortIcon:sortIcon=["arrow-up-wide-short","arrow-down-short-wide"],...props})=>{const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,loading:loading,table:table,hasAnySubRows:hasAnySubRows,showActionsBar:showActionsBar,selectableRows:selectableRows,persistToggleExpansionButton:persistToggleExpansionButton,responsive:responsive,headerRef:headerRef,virtualizedRows:virtualizedRows,enableVirtualization:enableVirtualization}=useContext(AdvancedTableContext);const isVirtualized=virtualizedRows||enableVirtualization;const classes=classnames(buildCss("pb_advanced_table_header"),globalProps(props),className);const columnPinning=table.getState().columnPinning;const customCellClassnames=classnames("table-header-cells-custom",`${showActionsBar&&"header-cells-with-actions"}`,`${isChrome()?"chrome-styles":""}`,`${responsive==="scroll"&&"pinned-left"}`);const renderRegularTableHeader=()=>jsx("thead",{className:classes,id:id,ref:headerRef,children:table.getHeaderGroups().map((headerGroup=>jsxs("tr",{children:[!hasAnySubRows&&selectableRows&&jsx("th",{className:customCellClassnames,children:jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()})}),headerGroup.headers.map((header=>{const isPinnedLeft=columnPinning.left.includes(header.id);return jsx(TableHeaderCell,{enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:children,isPinnedLeft:isPinnedLeft,loading:loading,persistToggleExpansionButton:persistToggleExpansionButton,sortIcon:sortIcon,table:table},`${header.id}-header`)}))]},`${headerGroup.id}-headerGroup`)))});const renderVirtualizedTableHeader=()=>jsx("thead",{className:classes,"data-virtualized":"true",id:id,ref:headerRef,children:table.getHeaderGroups().map((headerGroup=>jsxs("tr",{className:"virtualized-header-row-header",children:[!hasAnySubRows&&selectableRows&&jsx("th",{className:classnames(customCellClassnames,"virtualized-header-cell"),children:jsx(Checkbox,{checked:table==null?void 0:table.getIsAllRowsSelected(),indeterminate:table==null?void 0:table.getIsSomeRowsSelected(),onChange:table==null?void 0:table.getToggleAllRowsSelectedHandler()})}),headerGroup.headers.map((header=>{const isPinnedLeft=columnPinning.left.includes(header.id);return jsx(TableHeaderCell,{enableSorting:enableSorting,enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,header:header,headerChildren:children,isPinnedLeft:isPinnedLeft,isVirtualized:true,loading:loading,persistToggleExpansionButton:persistToggleExpansionButton,sortIcon:sortIcon,table:table},`${header.id}-header-virtualized`)}))]},`${headerGroup.id}-headerGroup-virtualized`)))});return jsx(Fragment,{children:isVirtualized?renderVirtualizedTableHeader():renderRegularTableHeader()})};const getRowColorClass=(row,inlineRowLoading)=>{var _a;const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a=row.original)==null?void 0:_a.children)&&!row.original.children.length?true:false;const shouldShowExpandedBackground=isExpandable&&(!inlineRowLoading&&row.getCanExpand()||inlineRowLoading&&(rowHasNoChildren||row.getCanExpand()));return row.getIsSelected()?"bg-row-selection":shouldShowExpandedBackground?"bg-silver":"pb-bg-row-white"};const shouldShowLoadingIndicator=(row,inlineRowLoading,cellAccessorsLength)=>{var _a;const isExpandable=row.getIsExpanded();const rowHasNoChildren=((_a=row.original)==null?void 0:_a.children)&&!row.original.children.length?true:false;return isExpandable&&(inlineRowLoading&&rowHasNoChildren)&&row.depth<cellAccessorsLength};const LoadingInline=props=>{const{align:align="left",aria:aria={},className:className,data:data={},dark:dark=false,htmlOptions:htmlOptions={},id:id,text:text2=" Loading",variant:variant="dotted"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss(`pb_loading_inline_kit_${align}`),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs(Body$1,{color:"light",dark:dark,children:[jsx(Icon,{aria:{label:"loading icon"},fixedWidth:true,icon:variant==="dotted"?"spinner":variant==="solid"?"circle-notch":void 0,pulse:true}),text2]})})};const CollapsibleTrail=({leftOffset:leftOffset})=>{const style={left:`${leftOffset}em`};return jsx("div",{className:"collapsible-trail",style:style})};const renderCollapsibleTrail=currentDepth=>{const lines=[];for(let i2=1;i2<=currentDepth;i2++){const additionalOffset=i2>1?(i2-1)*.25:0;const leftOffset=i2*1+additionalOffset;lines.push(jsx(CollapsibleTrail,{leftOffset:leftOffset},i2))}return lines};const SubRowHeaderRow=({collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:onClick,row:row,subRowHeaders:subRowHeaders,table:table})=>{var _a;const{inlineRowLoading:inlineRowLoading,customSort:customSort,onCustomSortClick:onCustomSortClick}=useContext(AdvancedTableContext);const numberOfColumns=table.getAllFlatColumns().length;const rowHasChildren=row.original.children?true:false;const canExpand=inlineRowLoading?rowHasChildren:row.getCanExpand();const hasSubrowsToSort=(_a=row.getParentRow())==null?void 0:_a.subRows;return jsxs("tr",{className:"custom-row bg-silver",children:[jsxs("td",{className:`custom-row-first-column ${isChrome()?"chrome-styles":""}`,colSpan:1,children:[collapsibleTrail&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("div",{style:{paddingLeft:`${row.depth*1.25}em`},children:jsxs(Flex,{align:"center",columnGap:"xs",justifyContent:customSort&&hasSubrowsToSort&&hasSubrowsToSort.length>1?"between":void 0,children:[jsxs(Flex,{columnGap:"xs",children:[enableToggleExpansion==="all"&&canExpand?jsx(ToggleIconButton,{onClick:onClick,row:row}):null,jsx(Caption,{marginLeft:canExpand?"none":"xs",text:subRowHeaders[row.depth-1]})]}),customSort&&hasSubrowsToSort&&hasSubrowsToSort.length>1&&jsx("button",{"aria-label":"Sort this group",className:"sort-button-icon gray-icon",onClick:()=>{var _a2;onCustomSortClick&&onCustomSortClick((_a2=row.getParentRow())==null?void 0:_a2.subRows)},children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:"sort"})})]})})]}),jsx("td",{colSpan:numberOfColumns-1})]})};const LoadingCell=()=>jsx("div",{className:"loading-cell"});const TableCellRenderer=({row:row,collapsibleTrail:collapsibleTrail=true,loading:loading=false,stickyLeftColumn:stickyLeftColumn,columnPinning:columnPinning,customRowStyle:customRowStyle,columnDefinitions:columnDefinitions,isMultiHeaderColumn:isMultiHeaderColumn=false})=>jsx(Fragment,{children:row.getVisibleCells().map(((cell,i2)=>{var _a,_b,_c,_d;const isPinnedLeft=columnPinning.left.includes(cell.column.id);const isLastCell=(()=>{var _a2;if(!isMultiHeaderColumn){return false}const parent=cell.column.parent;if(!parent){const last=row.getVisibleCells().at(-1);return(last==null?void 0:last.column.id)===cell.column.id}const visibleSiblings=parent.columns.filter((col=>col.getIsVisible()));return((_a2=visibleSiblings.at(-1))==null?void 0:_a2.id)===cell.column.id})();const{column:column}=cell;const colDef=findColumnDefByAccessor(columnDefinitions??[],column.id);const cellAlignment=((_a=colDef==null?void 0:colDef.columnStyling)==null?void 0:_a.cellAlignment)??"right";const cellFontColorValue=(_b=colDef==null?void 0:colDef.columnStyling)==null?void 0:_b.fontColor;const cellFontColor=typeof cellFontColorValue==="function"?cellFontColorValue(row):cellFontColorValue;const cellBackgroundColorValue=(_c=colDef==null?void 0:colDef.columnStyling)==null?void 0:_c.cellBackgroundColor;const cellBackgroundColor=typeof cellBackgroundColorValue==="function"?cellBackgroundColorValue(row):cellBackgroundColorValue;const paddingValue=((_d=colDef==null?void 0:colDef.columnStyling)==null?void 0:_d.cellPadding)??(customRowStyle==null?void 0:customRowStyle.cellPadding);const paddingClass=paddingValue?`p_${paddingValue}`:void 0;return jsxs("td",{align:cellAlignment,className:classnames(`${cell.id}-cell position_relative`,isChrome()?"chrome-styles":"",isPinnedLeft&&"pinned-left",stickyLeftColumn&&stickyLeftColumn.length>0&&isPinnedLeft&&"sticky-left",isLastCell&&"last-cell",paddingClass),style:{...playbookColumnLayoutStylesFromMeta(column.columnDef),left:isPinnedLeft?i2===1?"180px":`${column.getStart("left")}px`:void 0,backgroundColor:cellBackgroundColor||i2===0&&(customRowStyle==null?void 0:customRowStyle.backgroundColor),color:cellFontColor||(customRowStyle==null?void 0:customRowStyle.fontColor)},children:[collapsibleTrail&&i2===0&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("span",{id:`${cell.id}-span`,children:loading?jsx(LoadingCell,{}):flexRender(cell.column.columnDef.cell,cell.getContext())})]},`${cell.id}-data`)}))});const RegularTableView=({collapsibleTrail:collapsibleTrail=true,subRowHeaders:subRowHeaders})=>{var _a;const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,inlineRowLoading:inlineRowLoading,loading:loading,table:table,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,stickyLeftColumn:stickyLeftColumn,pinnedRows:pinnedRows,headerHeight:headerHeight,rowHeight:rowHeight,rowStyling:rowStyling=[],sampleRowRef:sampleRowRef}=useContext(AdvancedTableContext);useEffect((()=>{if(stickyLeftColumn&&Array.isArray(stickyLeftColumn)){stickyLeftColumn.forEach((columnId=>{const column=table.getColumn(columnId);if(column&&column.getCanPin()){column.pin("left")}}))}}),[stickyLeftColumn,table]);const columnPinning=table.getState().columnPinning||{left:[]};const columnDefinitions=((_a=table.options.meta)==null?void 0:_a.columnDefinitions)||[];const isMultiHeaderColumn=columnDefinitions.some((obj=>"columns"in obj));function PinnedRow({row:row}){const customRowStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));return jsx("tr",{className:classnames(`pinned-row`),style:{backgroundColor:(customRowStyle==null?void 0:customRowStyle.backgroundColor)?customRowStyle==null?void 0:customRowStyle.backgroundColor:"white",color:customRowStyle==null?void 0:customRowStyle.fontColor,position:"sticky",top:row.getIsPinned()==="top"?`${row.getPinnedIndex()*rowHeight+headerHeight}px`:void 0,zIndex:"3"},children:jsx(TableCellRenderer,{collapsibleTrail:collapsibleTrail,columnDefinitions:columnDefinitions,columnPinning:columnPinning,customRowStyle:customRowStyle,isMultiHeaderColumn:isMultiHeaderColumn,loading:loading,row:row,stickyLeftColumn:stickyLeftColumn})})}const totalRows=pinnedRows?table.getCenterRows():table.getRowModel().rows;return jsxs(Fragment,{children:[pinnedRows&&table.getTopRows().map((row=>jsx(PinnedRow,{row:row},row.id))),totalRows.map(((row,rowIndex)=>{var _a2,_b;const isFirstChildofSubrow=row.depth>0&&row.index===0;const numberOfColumns=table.getAllFlatColumns().length;const isFirstRegularRow=rowIndex===0&&!row.getIsPinned();const customRowStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));const rowColor=getRowColorClass(row,inlineRowLoading||false);const isDataLoading=shouldShowLoadingIndicator(row,inlineRowLoading||false,((_b=(_a2=columnDefinitions[0])==null?void 0:_a2.cellAccessors)==null?void 0:_b.length)||0);return jsxs(React__default.Fragment,{children:[isFirstChildofSubrow&&subRowHeaders&&jsx(SubRowHeaderRow,{collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:handleExpandOrCollapse,row:row,subRowHeaders:subRowHeaders,table:table}),jsxs("tr",{className:`${rowColor} ${row.depth>0?`depth-sub-row-${row.depth}`:""}`,id:`${row.index}-${row.id}-${row.depth}-row`,ref:isFirstRegularRow?sampleRowRef:null,style:{backgroundColor:customRowStyle==null?void 0:customRowStyle.backgroundColor,color:customRowStyle==null?void 0:customRowStyle.fontColor},children:[selectableRows&&!hasAnySubRows&&jsx("td",{className:"checkbox-cell",children:jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()})}),jsx(TableCellRenderer,{collapsibleTrail:collapsibleTrail,columnDefinitions:columnDefinitions,columnPinning:columnPinning,customRowStyle:customRowStyle,isMultiHeaderColumn:isMultiHeaderColumn,loading:loading,row:row,stickyLeftColumn:stickyLeftColumn})]}),isDataLoading&&jsx("tr",{children:jsx("td",{colSpan:numberOfColumns,style:{paddingLeft:`${row.depth===0?.5:row.depth*2}em`},children:jsx(LoadingInline,{})})},`${row.id}-loading-row`)]},`${row.index}-${row.id}-${row.depth}-row`)}))]})};const VirtualizedTableView=({collapsibleTrail:collapsibleTrail=true,subRowHeaders:subRowHeaders,isFetching:isFetching})=>{var _a;const{enableToggleExpansion:enableToggleExpansion,handleExpandOrCollapse:handleExpandOrCollapse,inlineRowLoading:inlineRowLoading,loading:loading,table:table,selectableRows:selectableRows,hasAnySubRows:hasAnySubRows,virtualizer:virtualizer,flattenedItems:flattenedItems,totalAvailableCount:totalAvailableCount}=useContext(AdvancedTableContext);const columnPinning=table.getState().columnPinning||{left:[]};const sortingState=JSON.stringify(table.getState().sorting||[]);const[columnWidths,setColumnWidths]=useState({});const getHeaderCellWidths=()=>{const widths={};const headerCells=document.querySelectorAll(".table-header-cells, .table-header-cells-custom");if(selectableRows&&!hasAnySubRows&&headerCells.length>0){widths["checkbox"]=`${headerCells[0].getBoundingClientRect().width}px`}table.getFlatHeaders().forEach(((header,index)=>{const headerIndex=selectableRows&&!hasAnySubRows?index+1:index;if(headerCells[headerIndex]){const width=headerCells[headerIndex].getBoundingClientRect().width;widths[header.id]=`${width}px`}}));return widths};const debounce2=(func,wait)=>{let timeout;return function executedFunction(...args){const later=()=>{clearTimeout(timeout);func(...args)};clearTimeout(timeout);timeout=setTimeout(later,wait)}};useLayoutEffect((()=>{const timer=setTimeout((()=>{setColumnWidths(getHeaderCellWidths())}),0);return()=>clearTimeout(timer)}),[table,selectableRows,hasAnySubRows,sortingState]);useEffect((()=>{const handleResize=debounce2((()=>{setColumnWidths(getHeaderCellWidths())}),0);window.addEventListener("resize",handleResize);return()=>{window.removeEventListener("resize",handleResize)}}),[table,selectableRows,hasAnySubRows]);if(!virtualizer||!flattenedItems){return jsx("tr",{children:jsx("td",{colSpan:table.getAllFlatColumns().length||1,children:"No data to display."})})}const virtualItems=((_a=virtualizer.getVirtualItems)==null?void 0:_a.call(virtualizer))||[];if(!virtualItems.length){return jsx("tr",{children:jsx("td",{colSpan:table.getAllFlatColumns().length||1,children:"No items to display."})})}const topLevelRowCount=table.getRowModel().flatRows.filter((row=>row.depth===0)).length;return jsx(Fragment,{children:virtualItems.map((virtualRow=>{const item=flattenedItems[virtualRow.index];if(!item)return null;const virtualItemStyle=getVirtualizedRowStyle(virtualRow.start);if(item.type==="header"){return jsx("tr",{className:"virtualized-table-row virtualized-header-row",style:virtualItemStyle,children:jsx("td",{colSpan:table.getAllFlatColumns().length,children:jsx(SubRowHeaderRow,{collapsibleTrail:collapsibleTrail,enableToggleExpansion:enableToggleExpansion,onClick:handleExpandOrCollapse,row:item.row,subRowHeaders:subRowHeaders,table:table})})},`header-${item.id}-sort-${sortingState}`)}if(item.type==="row"){const row=item.row;const rowColor=getRowColorClass(row,inlineRowLoading||false);return jsxs("tr",{className:`virtualized-table-row ${rowColor} ${row.depth>0?`depth-sub-row-${row.depth}`:""}`,"data-index":virtualRow.index,ref:node=>{if(node){try{virtualizer.measureElement(node)}catch(err){}}},style:virtualItemStyle,children:[selectableRows&&!hasAnySubRows&&jsx("td",{className:"checkbox-cell",style:{width:columnWidths["checkbox"]||"auto"},children:jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()})}),row.getVisibleCells().map(((cell,i2)=>{var _a2,_b,_c;const isPinnedLeft=columnPinning.left.includes(cell.column.id);const isLastCell=((_c=(_b=(_a2=cell.column.parent)==null?void 0:_a2.columns)==null?void 0:_b.at(-1))==null?void 0:_c.id)===cell.column.id;const cellWidth=columnWidths[cell.column.id]||"auto";return jsxs("td",{align:"right",className:classnames(`${cell.id}-cell position_relative`,isChrome()?"chrome-styles":"",isPinnedLeft&&"pinned-left",isLastCell&&"last-cell"),style:{...playbookColumnLayoutStylesFromMeta(cell.column.columnDef),width:cellWidth},children:[collapsibleTrail&&i2===0&&row.depth>0&&renderCollapsibleTrail(row.depth),jsx("span",{id:`${cell.id}-span`,children:loading?jsx(LoadingCell,{}):flexRender(cell.column.columnDef.cell,cell.getContext())})]},`${cell.id}-data`)}))]},`row-${item.id}-sort-${sortingState}`)}if(item.type==="loading"){const row=item.row;const numberOfColumns=table.getAllFlatColumns().length;return jsx("tr",{className:"virtualized-table-row virtualized-loading-row",style:virtualItemStyle,children:jsx("td",{colSpan:numberOfColumns,style:{paddingLeft:`${row.depth===0?.5:row.depth*2}em`},children:jsx(LoadingInline,{})})},`loading-${item.id}-sort-${sortingState}`)}if(item.type==="footer"){return jsx("tr",{className:"virtualized-table-row virtualized-footer",style:virtualItemStyle,children:jsx("td",{colSpan:table.getAllFlatColumns().length,children:jsx(Flex,{align:"center",justify:"center",children:isFetching?jsx(LoadingInline,{}):jsx(Detail,{text:`Showing ${topLevelRowCount} of ${totalAvailableCount} rows`})})})},`footer-row`)}return null}))})};const TableBody=({className:className,collapsibleTrail:collapsibleTrail=true,dark:dark=false,id:id,subRowHeaders:subRowHeaders,isFetching:isFetching,...props})=>{const{responsive:responsive,isPinnedLeft:isPinnedLeft=false,virtualizer:virtualizer,virtualizedRows:virtualizedRows,enableVirtualization:enableVirtualization}=useContext(AdvancedTableContext);const isVirtualized=virtualizedRows||enableVirtualization;const classes=classnames(buildCss("pb_advanced_table_body"),{"pinned-left":responsive==="scroll"&&isPinnedLeft},globalProps(props),className);const style=virtualizer?{height:`${virtualizer.getTotalSize()}px`,position:"relative",width:"100%"}:{};return jsx(Fragment,{children:jsxs("tbody",{className:classes,"data-virtualized":isVirtualized?"true":"false",id:id,style:style,children:[isVirtualized&&virtualizer?jsx(VirtualizedTableView,{collapsibleTrail:collapsibleTrail,isFetching:isFetching,subRowHeaders:subRowHeaders}):jsx(RegularTableView,{collapsibleTrail:collapsibleTrail,subRowHeaders:subRowHeaders}),isVirtualized&&!virtualizer&&jsx("tr",{children:jsx("td",{colSpan:999,style:{padding:"10px",textAlign:"center"},children:jsx("div",{children:"No data to display."})})})]})})};const Pagination=props=>{const{aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,current:current=1,onChange:onChange,range:range=5,total:total=1}=props;const[currentPage,setCurrentPage]=useState(current);const[isMobile,setIsMobile]=useState(false);const[isDropdownOpen,setIsDropdownOpen]=useState(false);const[dropdownPosition,setDropdownPosition]=useState("below");const dropdownRef=useRef(null);useEffect((()=>{const checkMobile=()=>{setIsMobile(window.innerWidth<=767)};checkMobile();let timeoutId=null;const throttledCheckMobile=()=>{if(timeoutId===null){timeoutId=setTimeout((()=>{checkMobile();timeoutId=null}),150)}};window.addEventListener("resize",throttledCheckMobile);return()=>{window.removeEventListener("resize",throttledCheckMobile);if(timeoutId)clearTimeout(timeoutId)}}),[]);useEffect((()=>{const handleClickOutside2=event=>{if(dropdownRef.current&&!dropdownRef.current.contains(event.target)){setIsDropdownOpen(false)}};if(isDropdownOpen){document.addEventListener("mousedown",handleClickOutside2)}return()=>{document.removeEventListener("mousedown",handleClickOutside2)}}),[isDropdownOpen]);const checkDropdownPosition=()=>{if(dropdownRef.current){const rect=dropdownRef.current.getBoundingClientRect();const dropdownHeight=200;const spaceBelow=window.innerHeight-rect.bottom;const spaceAbove=rect.top;if(spaceBelow<dropdownHeight&&spaceAbove>spaceBelow){setDropdownPosition("above")}else{setDropdownPosition("below")}}};const handleDropdownToggle=()=>{if(!isDropdownOpen){checkDropdownPosition()}setIsDropdownOpen(!isDropdownOpen)};const handlePageChange=pageNumber=>{if(pageNumber>=1&&pageNumber<=total){setCurrentPage(pageNumber);setIsDropdownOpen(false);if(onChange){onChange(pageNumber)}}};const createPageOptions=()=>{const options=[];for(let pageNumber=1;pageNumber<=total;pageNumber++){options.push({label:String(pageNumber),value:String(pageNumber),id:`page-${pageNumber}`})}return options};const renderPageButtons=()=>{const buttons=[];let rangeStart=Math.max(1,currentPage-Math.floor(range/2));let rangeEnd=Math.min(total,rangeStart+range-1);if(rangeEnd-rangeStart+1<range){if(rangeStart>1){rangeStart=Math.max(1,rangeEnd-range+1)}else{rangeEnd=Math.min(total,rangeStart+range-1)}}if(rangeStart>1){buttons.push(jsx("li",{className:"pagination-number",onClick:()=>handlePageChange(1),children:"1"},1))}if(rangeStart>2){buttons.push(jsx("li",{className:"pagination-number",onClick:()=>handlePageChange(2),children:"2"},2))}for(let i2=rangeStart;i2<=rangeEnd;i2++){buttons.push(jsx("li",{className:`pagination-number ${i2===currentPage?"active":""}`,onClick:()=>handlePageChange(i2),children:i2},i2))}if(rangeEnd<total-1){buttons.push(jsx("li",{className:`pagination-number ${total-1===currentPage?"active":""}`,onClick:()=>handlePageChange(total-1),children:total-1},total-1))}if(rangeEnd<total){buttons.push(jsx("li",{className:`pagination-number ${total===currentPage?"active":""}`,onClick:()=>handlePageChange(total),children:total},total))}return buttons};useEffect((()=>{if(current>=1&&current<=total){setCurrentPage(current)}}),[current,total]);const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_paginate"),globalProps(props),className);if(total<=1){return null}return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsx("div",{className:`pb_pagination ${isMobile?"pb_pagination_mobile":""}`,children:isMobile?jsxs(Flex,{alignItems:"center",children:[jsx("li",{className:`pagination-left ${currentPage===1?"disabled":""}`,onClick:()=>handlePageChange(currentPage-1),children:jsxs(Flex,{alignItems:"center",children:[jsx(Icon,{icon:"chevron-left"}),jsx(Detail,{color:"default",marginLeft:"xxs",children:"Prev"})]})}),jsxs("div",{className:"pagination-dropdown",ref:dropdownRef,children:[jsx("div",{className:"pagination-dropdown-trigger",onClick:handleDropdownToggle,children:jsxs(Flex,{alignItems:"center",gap:"xxs",justify:"between",children:[jsx(Detail,{bold:true,color:"default",children:currentPage}),jsxs(Detail,{color:"default",children:["of ",total]}),jsx(Icon,{color:"primary",icon:isDropdownOpen?"chevron-up":"chevron-down",size:"xs"})]})}),isDropdownOpen&&jsx("div",{className:`pagination-dropdown-menu ${dropdownPosition}`,children:createPageOptions().map((option=>jsx("div",{className:`pagination-dropdown-option ${Number(option.value)===currentPage?"active":""}`,onClick:()=>handlePageChange(Number(option.value)),children:jsxs(Body$1,{children:["Page ",option.label]})},option.id)))})]}),jsx("li",{className:`pagination-right ${currentPage===total?"disabled":""}`,onClick:()=>handlePageChange(currentPage+1),children:jsxs(Flex,{alignItems:"center",children:[jsx(Detail,{color:"default",marginRight:"xxs",children:"Next"}),jsx(Icon,{icon:"chevron-right"})]})})]}):jsxs(Fragment,{children:[jsx("li",{className:`pagination-left ${currentPage===1?"disabled":""}`,onClick:()=>handlePageChange(currentPage-1),children:jsx(Icon,{icon:"chevron-left"})}),renderPageButtons(),jsx("li",{className:`pagination-right ${currentPage===total?"disabled":""}`,onClick:()=>handlePageChange(currentPage+1),children:jsx(Icon,{icon:"chevron-right"})})]})})})};const TablePagination=({table:table,onChange:onChange,position:position,range:range=5})=>{const current=table.getState().pagination.pageIndex+1;const total=table.getPageCount();return jsx(Pagination,{current:current,marginBottom:position==="top"?"xs":void 0,marginTop:position==="bottom"?"xs":void 0,onChange:onChange,range:range,total:total},`pagination-${position}-${current}`)};const buildVisibilityTree=(defs,allowed)=>defs.map((def=>{const isGroup=Array.isArray(def.columns)&&def.columns.length>0;if(!(allowed==null?void 0:allowed.length)){return isGroup?{id:def.id,label:def.label,children:buildVisibilityTree(def.columns,allowed)}:{id:def.id,label:def.label}}if(allowed.includes(def.id)){return isGroup?{id:def.id,label:def.label,children:buildVisibilityTree(def.columns,null)}:{id:def.id,label:def.label}}if(isGroup){const kids=buildVisibilityTree(def.columns,allowed).filter(Boolean);return kids.length?{id:def.id,label:def.label,children:kids}:null}return null})).filter(Boolean);const showActionBar=elem=>{elem.style.display="block";const height=elem.scrollHeight+"px";elem.style.height=height;elem.classList.add("is-visible");elem.style.overflow="hidden";window.setTimeout((()=>{if(elem.classList.contains("is-visible")){elem.style.height="";elem.style.overflow="visible"}}),300)};const hideActionBar=elem=>{elem.style.height=elem.scrollHeight+"px";elem.offsetHeight;window.setTimeout((()=>{elem.style.height="0";elem.style.overflow="hidden"}),10);window.setTimeout((()=>{elem.classList.remove("is-visible")}),300)};const TableActionBar=({isVisible:isVisible,selectedCount:selectedCount,actions:actions,type:type="row-selection"})=>{var _a;const cardRef=useRef(null);const{table:table,columnVisibilityControl:columnVisibilityControl,columnDefinitions:columnDefinitions}=useContext(AdvancedTableContext);const includeIds=columnVisibilityControl==null?void 0:columnVisibilityControl.includeIds;const firstLeafId=(_a=table.getAllLeafColumns()[0])==null?void 0:_a.id;const tree=buildVisibilityTree(columnDefinitions,includeIds).filter((node=>node.id!==firstLeafId));const renderLeaf=(id,label)=>{const col=table.getColumn(id);const show=col.getIsVisible();const handleVisibilityChange=()=>{col.toggleVisibility();if(columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange){const updatedVisibilityState={...table.getAllColumns().reduce(((acc,col2)=>{acc[col2.id]=col2.getIsVisible();return acc}),{})};columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange(updatedVisibilityState)}};return jsx(Checkbox,{checked:show,onChange:handleVisibilityChange,paddingBottom:"xs",text:label},id)};const gatherLeafIds=node=>node.children&&node.children.length?node.children.flatMap(gatherLeafIds):node.id?[node.id]:[];const renderGroup=node=>{var _a2;const leaves=gatherLeafIds(node);const visibleArray=leaves.map((id=>table.getColumn(id).getIsVisible()));const allOn=visibleArray.every(Boolean);const someOn=visibleArray.some(Boolean);const handleGroupVisibilityChange=()=>{leaves.forEach((id=>table.getColumn(id).toggleVisibility(!allOn)));if(columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange){const updatedVisibilityState={...table.getAllColumns().reduce(((acc,col)=>{acc[col.id]=col.getIsVisible();return acc}),{})};columnVisibilityControl==null?void 0:columnVisibilityControl.onColumnVisibilityChange(updatedVisibilityState)}};return jsxs(Fragment,{children:[jsx(Checkbox,{checked:allOn,indeterminate:!allOn&&someOn,onChange:handleGroupVisibilityChange,paddingBottom:"xs",text:node.label}),jsx(Flex,{flexDirection:"column",paddingLeft:"lg",children:(_a2=node==null?void 0:node.children)==null?void 0:_a2.map((child=>child.children?renderGroup(child):renderLeaf(child.id,child.label)))})]})};useEffect((()=>{if(cardRef.current&&type==="row-selection"){if(isVisible){showActionBar(cardRef.current)}else{hideActionBar(cardRef.current)}}}),[isVisible,type]);const[showPopover,setShowPopover]=useState(false);const togglePopover=()=>setShowPopover((prev=>!prev));const handleShouldClose=shouldClose=>setShowPopover(!shouldClose);const popoverReference=jsx(Tooltip,{placement:"top",text:"Column Configuration",children:jsx("div",{onClick:togglePopover,children:jsx(Icon,{color:"primary",cursor:"pointer",icon:"sliders-h"})})});return jsx(Card,{borderNone:!isVisible,className:`${isVisible&&"show-action-card row-selection-actions-card"}`,htmlOptions:{ref:cardRef},padding:`${isVisible?"xs":"none"}`,children:jsx(Flex,{alignItems:"center",justify:type==="row-selection"?"between":"end",children:type==="row-selection"?jsxs(Fragment,{children:[jsxs(Caption,{color:"light",paddingLeft:"xs",size:"xs",children:[selectedCount," Selected"]}),jsx(FlexItem,{children:actions})]}):jsx(PbReactPopover,{closeOnClick:"outside",placement:"bottom-end",reference:popoverReference,shouldClosePopover:handleShouldClose,show:showPopover,zIndex:3,children:jsxs(Fragment,{children:[jsx(Caption,{paddingY:"sm",text:"Columns Config",textAlign:"center"}),jsx(SectionSeparator,{paddingBottom:"xs"}),tree.map((node=>jsx(Flex,{cursor:"pointer",flexDirection:"column",paddingX:"xs",children:node.children?renderGroup(node):renderLeaf(node.id,node.label)},node.id)))]})})})})};const CustomCell=({getValue:getValue,onRowToggleClick:onRowToggleClick,row:row,value:value,customRenderer:customRenderer,selectableRows:selectableRows,customStyle:customStyle={}})=>{const{setExpanded:setExpanded,expanded:expanded,expandedControl:expandedControl,inlineRowLoading:inlineRowLoading,hasAnySubRows:hasAnySubRows,cascadeCollapse:cascadeCollapse}=useContext(AdvancedTableContext);const handleOnExpand=row2=>{onRowToggleClick&&onRowToggleClick(row2);const willBeExpanded=!row2.getIsExpanded();if(willBeExpanded){if(!expandedControl){setExpanded({...expanded,[row2.id]:true})}}else{if(cascadeCollapse){const idsToRemove=new Set([row2.id,...getDescendantRowIds(row2)]);const nextExpanded={...expanded};idsToRemove.forEach((id=>delete nextExpanded[id]));setExpanded(nextExpanded)}else if(!expandedControl){setExpanded({...expanded,[row2.id]:false})}}};const RowHasChildren=row.original.children?true:false;const renderButton=inlineRowLoading?RowHasChildren:row.getCanExpand();return jsx("div",{style:{paddingLeft:`${row.depth*1.25}em`},children:jsxs(Flex,{alignItems:"center",columnGap:"xs",justify:"start",orientation:"row",children:[selectableRows&&hasAnySubRows&&jsx(Checkbox,{checked:row.getIsSelected(),disabled:!row.getCanSelect(),indeterminate:row.getIsSomeSelected(),name:row.id,onChange:row.getToggleSelectedHandler()}),renderButton?jsx("button",{className:"gray-icon expand-toggle-icon",onClick:()=>handleOnExpand(row),style:{color:customStyle==null?void 0:customStyle.expandButtonColor},children:row.getIsExpanded()?jsx(Icon,{cursor:"pointer",icon:"circle-play",rotation:90}):jsx(Icon,{cursor:"pointer",icon:"circle-play"})}):null,jsx(FlexItem,{paddingLeft:renderButton?"none":"xs",children:row.depth===0?customRenderer?customRenderer(row,getValue()):getValue():customRenderer?customRenderer(row,value):value})]})})};const createCellFunction=(cellAccessors,customRenderer,isFirstColumn,onRowToggleClick,selectableRows,rowStyling)=>{const cellRenderer=({row:row,getValue:getValue})=>{const rowData=row.original;const customStyle=(rowStyling==null?void 0:rowStyling.length)>0&&(rowStyling==null?void 0:rowStyling.find((s2=>(s2==null?void 0:s2.rowId)===row.id)));if(isFirstColumn){switch(row.depth){case 0:{return jsx(CustomCell,{customRenderer:customRenderer,customStyle:customStyle,getValue:getValue,onRowToggleClick:onRowToggleClick,row:row,selectableRows:selectableRows})}default:{const depthAccessor=cellAccessors[row.depth-1];const accessorValue=rowData[depthAccessor];return accessorValue?jsx(CustomCell,{customRenderer:customRenderer,onRowToggleClick:onRowToggleClick,row:row,selectableRows:selectableRows,value:accessorValue}):"N/A"}}}return customRenderer?customRenderer(row,getValue()):getValue()};cellRenderer.displayName="CellRenderer";return cellRenderer};function getParentOnlySortedRowModel(){return table=>()=>{const sortingState=table.getState().sorting;const rowModel=table.getPreSortedRowModel();if(!rowModel.rows.length||!(sortingState==null?void 0:sortingState.length)){return rowModel}const sortedFlatRows=[];const availableSorting=sortingState.filter((sort=>{var _a;return(_a=table.getColumn(sort.id))==null?void 0:_a.getCanSort()}));const columnInfoById={};availableSorting.forEach((sortEntry=>{const column=table.getColumn(sortEntry.id);if(!column)return;columnInfoById[sortEntry.id]={sortUndefined:column.columnDef.sortUndefined,invertSorting:column.columnDef.invertSorting,sortingFn:column.getSortingFn()}}));const parentRows=rowModel.rows.map((row=>({...row})));parentRows.sort(((rowA,rowB)=>{for(let i2=0;i2<availableSorting.length;i2+=1){const sortEntry=availableSorting[i2];const columnInfo=columnInfoById[sortEntry.id];const sortUndefined=columnInfo.sortUndefined;const isDesc=(sortEntry==null?void 0:sortEntry.desc)??false;let sortInt=0;if(sortUndefined){const aValue=rowA.getValue(sortEntry.id);const bValue=rowB.getValue(sortEntry.id);const aUndefined=aValue===void 0;const bUndefined=bValue===void 0;if(aUndefined||bUndefined){if(sortUndefined==="first")return aUndefined?-1:1;if(sortUndefined==="last")return aUndefined?1:-1;sortInt=aUndefined&&bUndefined?0:aUndefined?sortUndefined:-sortUndefined}}if(sortInt===0){sortInt=columnInfo.sortingFn(rowA,rowB,sortEntry.id)}if(sortInt!==0){if(isDesc)sortInt*=-1;if(columnInfo.invertSorting)sortInt*=-1;return sortInt}}return rowA.index-rowB.index}));function flattenRowsInOrder(rows){rows.forEach((row=>{var _a;sortedFlatRows.push(row);if((_a=row.subRows)==null?void 0:_a.length){flattenRowsInOrder(row.subRows)}}))}flattenRowsInOrder(parentRows);const rowsById={};sortedFlatRows.forEach((row=>{rowsById[row.id]=row}));return{rows:parentRows,flatRows:sortedFlatRows,rowsById:rowsById}}}function useTableState({tableData:tableData,columnDefinitions:columnDefinitions,enableSortingRemoval:enableSortingRemoval,expandedControl:expandedControl,sortControl:sortControl,onRowToggleClick:onRowToggleClick,selectableRows:selectableRows,initialLoadingRowsCount:initialLoadingRowsCount=10,loading:loading,pagination:pagination=false,paginationProps:paginationProps,virtualizedRows:virtualizedRows=false,tableOptions:tableOptions,columnVisibilityControl:columnVisibilityControl,pinnedRows:pinnedRows,rowStyling:rowStyling,inlineRowLoading:inlineRowLoading=false,sortParentOnly:sortParentOnly=false}){var _a,_b;const[localExpanded,setLocalExpanded]=useState({});const[loadingStateRowCount,setLoadingStateRowCount]=useState(initialLoadingRowsCount);const[rowSelection,setRowSelection]=useState({});const[localColumnVisibility,setLocalColumnVisibility]=useState({});const[localRowPinning,setLocalRowPinning]=useState({top:[]});const[localPagination,setLocalPagination]=useState({pageIndex:(paginationProps==null?void 0:paginationProps.pageIndex)??0,pageSize:(paginationProps==null?void 0:paginationProps.pageSize)??20});const expanded=expandedControl?expandedControl.value:localExpanded;const setExpanded=expandedControl?expandedControl.onChange:setLocalExpanded;const columnVisibility=columnVisibilityControl&&columnVisibilityControl.value?columnVisibilityControl.value:localColumnVisibility;const setColumnVisibility=columnVisibilityControl&&columnVisibilityControl.onChange?columnVisibilityControl.onChange:setLocalColumnVisibility;const rowPinning=(pinnedRows==null?void 0:pinnedRows.value)??localRowPinning;const onRowPinningChange=(pinnedRows==null?void 0:pinnedRows.onChange)??setLocalRowPinning;const fetchSize=20;const[fullData]=useState(tableData);const[dataChunk,setDataChunk]=useState(fullData.slice(0,fetchSize));const[totalFetched,setTotalFetched]=useState(fetchSize);const[isFetching,setIsFetching]=useState(false);const columnHelper=createColumnHelper();const buildColumns=useCallback(((columnDefinitions2,isRoot=true)=>(columnDefinitions2==null?void 0:columnDefinitions2.map(((column,index)=>{const isFirstColumn=isRoot&&index===0;if(column.columns&&column.columns.length>0){return{header:column.header??column.label??"",id:column.id??column.label??`group-${index}`,columns:buildColumns(column.columns,false)}}const tanStackSizing=buildTanStackSizingFromColumn(column);const layoutStyles=buildPlaybookColumnLayoutStyles(column,tanStackSizing);const userMeta=column.meta&&typeof column.meta==="object"&&!Array.isArray(column.meta)?column.meta:{};const hasLayoutStyles=layoutStyles.width!==void 0||layoutStyles.minWidth!==void 0||layoutStyles.maxWidth!==void 0;const columnStructure={...columnHelper.accessor(column.accessor,{header:column.header??column.label??"",enableSorting:isFirstColumn||column.enableSort===true,...tanStackSizing,meta:{...userMeta,...hasLayoutStyles?{playbookColumnLayoutStyles:layoutStyles}:{}}})};if(column.cellAccessors||column.customRenderer){columnStructure.cell=createCellFunction(column.cellAccessors||[],column.customRenderer,isFirstColumn,onRowToggleClick,selectableRows,rowStyling)}return columnStructure})))||[]),[columnHelper,onRowToggleClick,selectableRows]);const columns=useMemo((()=>buildColumns(columnDefinitions)),[buildColumns,columnDefinitions]);const sorting=useMemo((()=>[{id:columnDefinitions[0].accessor,desc:sortControl&&sortControl.value!==null?!sortControl.value.desc:false}]),[columnDefinitions,sortControl]);const customState=useCallback((()=>({state:{expanded:expanded,...sortControl&&{sorting:sorting},...selectableRows&&{rowSelection:rowSelection},...columnVisibility&&{columnVisibility:columnVisibility},...pinnedRows&&{rowPinning:rowPinning},...inlineRowLoading&&{pagination:localPagination}}})),[expanded,sortControl,sorting,selectableRows,rowSelection,columnVisibility,rowPinning,inlineRowLoading,localPagination]);const paginationInitializer=useMemo((()=>{if(!pagination)return{};if(inlineRowLoading){return{getPaginationRowModel:getPaginationRowModel(),paginateExpandedRows:false,onPaginationChange:setLocalPagination,autoResetPageIndex:false}}else{return{getPaginationRowModel:getPaginationRowModel(),paginateExpandedRows:false,initialState:{pagination:{pageIndex:(paginationProps==null?void 0:paginationProps.pageIndex)??0,pageSize:(paginationProps==null?void 0:paginationProps.pageSize)??20}}}}}),[pagination,paginationProps,inlineRowLoading]);const table=useReactTable({data:loading?Array(loadingStateRowCount).fill({}):virtualizedRows?dataChunk:tableData,columns:columns,onExpandedChange:setExpanded,getSubRows:row=>row.children,getCoreRowModel:getCoreRowModel(),getExpandedRowModel:getExpandedRowModel(),getSortedRowModel:sortParentOnly?getParentOnlySortedRowModel():getSortedRowModel(),enableSortingRemoval:enableSortingRemoval,sortDescFirst:true,onRowSelectionChange:setRowSelection,onRowPinningChange:onRowPinningChange,getRowId:selectableRows||pinnedRows||rowStyling?row=>row.id:void 0,onColumnVisibilityChange:setColumnVisibility,meta:{columnDefinitions:columnDefinitions},...customState(),...paginationInitializer,...tableOptions});useEffect((()=>{var _a2;const topPins=((_a2=pinnedRows==null?void 0:pinnedRows.value)==null?void 0:_a2.top)??[];if(topPins.length===0){onRowPinningChange({top:[]});return}const rows=table.getRowModel().rows;const collectAllDescendantIds=subs=>subs.flatMap((r2=>[r2.id,...collectAllDescendantIds(r2.subRows)]));const allPinned=[];topPins.forEach((id=>{const parent=rows.find((r2=>r2.id===id&&r2.depth===0));if(parent){allPinned.push(parent.id,...collectAllDescendantIds(parent.subRows))}}));onRowPinningChange({top:allPinned})}),[table,(_b=(_a=pinnedRows==null?void 0:pinnedRows.value)==null?void 0:_a.top)==null?void 0:_b.join(",")]);useEffect((()=>{if(pagination&&(paginationProps==null?void 0:paginationProps.pageSize)){if(inlineRowLoading){setLocalPagination((prev=>({...prev,pageSize:paginationProps.pageSize})))}else{table.setPageSize(paginationProps.pageSize)}}}),[pagination,paginationProps==null?void 0:paginationProps.pageSize,table,inlineRowLoading]);useEffect((()=>{if(pagination&&inlineRowLoading&&paginationProps){setLocalPagination({pageIndex:paginationProps.pageIndex??localPagination.pageIndex,pageSize:paginationProps.pageSize??localPagination.pageSize})}}),[pagination,inlineRowLoading,paginationProps==null?void 0:paginationProps.pageIndex,paginationProps==null?void 0:paginationProps.pageSize]);useEffect((()=>{if(pagination&&inlineRowLoading&&(paginationProps==null?void 0:paginationProps.onPageChange)){paginationProps.onPageChange(localPagination.pageIndex)}}),[localPagination.pageIndex,pagination,inlineRowLoading,paginationProps]);useEffect((()=>{if(pagination&&!inlineRowLoading&&(paginationProps==null?void 0:paginationProps.onPageChange)){const currentPageIndex=table.getState().pagination.pageIndex;paginationProps.onPageChange(currentPageIndex)}}),[table.getState().pagination.pageIndex,pagination,inlineRowLoading,paginationProps]);const hasAnySubRows=table.getRowModel().rows.some((row=>row.subRows&&row.subRows.length>0));const selectedRowsLength=Object.keys(table.getState().rowSelection).length;const fetchNextPage=useCallback((()=>{if(isFetching||totalFetched>=fullData.length)return;setIsFetching(true);setTimeout((()=>{const nextChunk=fullData.slice(totalFetched,totalFetched+fetchSize);setDataChunk((prev=>[...prev,...nextChunk]));setTotalFetched((prev=>prev+nextChunk.length));setIsFetching(false)}),500)}),[isFetching,totalFetched,fullData,fetchSize]);const updateLoadingStateRowCount=useCallback((()=>{const rowsCount=table.getRowModel().rows.length;if(rowsCount!==loadingStateRowCount&&rowsCount!==0){setLoadingStateRowCount(rowsCount)}}),[loadingStateRowCount,table]);return{table:table,expanded:expanded,setExpanded:setExpanded,hasAnySubRows:hasAnySubRows,selectedRowsLength:selectedRowsLength,fetchNextPage:fetchNextPage,updateLoadingStateRowCount:updateLoadingStateRowCount,rowSelection:rowSelection,fullData:fullData,totalFetched:totalFetched,isFetching:isFetching,localPagination:localPagination,setLocalPagination:setLocalPagination}}function useTableActions({table:table,expanded:expanded,setExpanded:setExpanded,onToggleExpansionClick:onToggleExpansionClick,onRowSelectionChange:onRowSelectionChange,inlineRowLoading:inlineRowLoading=false,localPagination:localPagination,setLocalPagination:setLocalPagination,cascadeCollapse:cascadeCollapse=false}){const[bottomReached,setBottomReached]=useState(false);const bottomTimeout=useRef(null);const handleExpandOrCollapse=useCallback((async row=>{if(onToggleExpansionClick)onToggleExpansionClick(row);const anyTopLevelExpanded=table.getRowModel().rows.some((r2=>r2.getIsExpanded()));const isHeaderCollapseAll=row==null&&anyTopLevelExpanded;if(cascadeCollapse&&isHeaderCollapseAll){setExpanded({});return}const updatedExpandedState=await updateExpandAndCollapseState(table.getRowModel(),expanded,row==null?void 0:row.parentId,void 0,cascadeCollapse);setExpanded(updatedExpandedState)}),[expanded,setExpanded,onToggleExpansionClick,table,cascadeCollapse]);const onPageChange=useCallback((page=>{if(inlineRowLoading&&setLocalPagination&&localPagination){setLocalPagination({...localPagination,pageIndex:page-1})}else{table.setPageIndex(page-1)}}),[table,inlineRowLoading,setLocalPagination,localPagination]);const fetchMoreOnBottomReached=useCallback(((containerRef,fetchNextPage,isFetching,totalFetched,totalDBRowCount)=>{if(!containerRef||isFetching||totalFetched>=totalDBRowCount)return;const{scrollTop:scrollTop,scrollHeight:scrollHeight,clientHeight:clientHeight}=containerRef;const distanceFromBottom=scrollHeight-scrollTop-clientHeight;if(distanceFromBottom<50){if(!bottomReached){setBottomReached(true);bottomTimeout.current=setTimeout((()=>{fetchNextPage();setBottomReached(false)}),1e3)}}else{setBottomReached(false);if(bottomTimeout.current){clearTimeout(bottomTimeout.current);bottomTimeout.current=null}}}),[bottomReached]);useEffect((()=>{if(onRowSelectionChange){onRowSelectionChange(table.getState().rowSelection)}}),[table.getState().rowSelection,onRowSelectionChange]);return{handleExpandOrCollapse:handleExpandOrCollapse,onPageChange:onPageChange,fetchMoreOnBottomReached:fetchMoreOnBottomReached}}const AdvancedTable=props=>{const{aria:aria={},actions:actions,cascadeCollapse:cascadeCollapse=false,children:children,className:className,columnDefinitions:columnDefinitions,columnGroupBorderColor:columnGroupBorderColor,columnVisibilityControl:columnVisibilityControl,customSort:customSort,dark:dark=false,data:data={},enableToggleExpansion:enableToggleExpansion="header",enableSortingRemoval:enableSortingRemoval=false,expandedControl:expandedControl,expandByDepth:expandByDepth,onExpandByDepthClick:onExpandByDepthClick,htmlOptions:htmlOptions={},id:id,initialLoadingRowsCount:initialLoadingRowsCount=10,inlineRowLoading:inlineRowLoading=false,loading:loading,maxHeight:maxHeight,onRowToggleClick:onRowToggleClick,onToggleExpansionClick:onToggleExpansionClick,onCustomSortClick:onCustomSortClick,pagination:pagination=false,paginationProps:paginationProps,pinnedRows:pinnedRows,responsive:responsive="scroll",rowStyling:rowStyling,scrollBarNone:scrollBarNone=false,showActionsBar:showActionsBar=true,selectableRows:selectableRows,persistToggleExpansionButton:persistToggleExpansionButton=false,sortControl:sortControl,sortParentOnly:sortParentOnly=false,stickyLeftColumn:stickyLeftColumn,tableData:tableData,tableOptions:tableOptions,tableProps:tableProps,toggleExpansionIcon:toggleExpansionIcon="arrows-from-line",onRowSelectionChange:onRowSelectionChange,virtualizedRows:virtualizedRows=false,allowFullScreen:allowFullScreen=false,fullScreenControl:fullScreenControl}=props;const noTableCardContainer=(tableProps==null?void 0:tableProps.container)===false;const tableWrapperRef=useRef(null);const{table:table,expanded:expanded,setExpanded:setExpanded,hasAnySubRows:hasAnySubRows,selectedRowsLength:selectedRowsLength,fetchNextPage:fetchNextPage,updateLoadingStateRowCount:updateLoadingStateRowCount,fullData:fullData,totalFetched:totalFetched,isFetching:isFetching,localPagination:localPagination,setLocalPagination:setLocalPagination}=useTableState({tableData:tableData,columnDefinitions:columnDefinitions,enableSortingRemoval:enableSortingRemoval,expandedControl:expandedControl,sortControl:sortControl,onRowToggleClick:onRowToggleClick,selectableRows:selectableRows,initialLoadingRowsCount:initialLoadingRowsCount,loading:loading,pagination:pagination,paginationProps:paginationProps,virtualizedRows:virtualizedRows,tableOptions:tableOptions,columnVisibilityControl:columnVisibilityControl,pinnedRows:pinnedRows,rowStyling:rowStyling,inlineRowLoading:inlineRowLoading,sortParentOnly:sortParentOnly});const{handleExpandOrCollapse:handleExpandOrCollapse,onPageChange:onPageChange,fetchMoreOnBottomReached:fetchMoreOnBottomReached}=useTableActions({table:table,expanded:expanded,setExpanded:setExpanded,onToggleExpansionClick:onToggleExpansionClick,onRowSelectionChange:onRowSelectionChange,inlineRowLoading:inlineRowLoading,localPagination:localPagination,setLocalPagination:setLocalPagination,cascadeCollapse:cascadeCollapse});useEffect((()=>{if(!loading){updateLoadingStateRowCount()}}),[loading,updateLoadingStateRowCount]);useEffect((()=>{fetchMoreOnBottomReached(tableWrapperRef.current,fetchNextPage,isFetching,totalFetched,fullData.length)}),[fetchMoreOnBottomReached,fetchNextPage,isFetching,totalFetched,fullData.length]);const[isFullscreen,setIsFullscreen]=useState(false);const toggleFullscreen=useCallback((()=>{setIsFullscreen((prevState=>!prevState))}),[]);useEffect((()=>{if(allowFullScreen&&fullScreenControl){fullScreenControl({toggleFullscreen:toggleFullscreen,isFullscreen:isFullscreen})}}),[allowFullScreen,fullScreenControl,toggleFullscreen,isFullscreen]);const renderFullscreenHeader=()=>{if(!isFullscreen)return null;const defaultMinimizeIcon=jsx("button",{className:"gray-icon fullscreen-icon",onClick:toggleFullscreen,children:jsx(Icon,{cursor:"pointer",fixedWidth:true,icon:"arrow-down-left-and-arrow-up-right-to-center",...props})});return jsx(Card,{borderNone:true,borderRadius:"none",className:"advanced-table-fullscreen-header",...props,children:jsx(Flex,{justify:"end",children:defaultMinimizeIcon})})};useEffect((()=>{if(!allowFullScreen)return;const handleKeyDown=event=>{if(event.key==="Escape"&&isFullscreen){event.preventDefault();toggleFullscreen()}};document.addEventListener("keydown",handleKeyDown);return()=>{document.removeEventListener("keydown",handleKeyDown)}}),[allowFullScreen,toggleFullscreen,isFullscreen]);const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const isActionBarVisible=selectableRows&&showActionsBar&&selectedRowsLength>0||columnVisibilityControl;const classes=classnames(buildCss("pb_advanced_table"),`advanced-table-responsive-${responsive}`,maxHeight?`advanced-table-max-height-${maxHeight}`:"",{"advanced-table-fullscreen":isFullscreen,"advanced-table-allow-fullscreen":allowFullScreen,"hidden-action-bar":(selectableRows||columnVisibilityControl)&&!isActionBarVisible},{"advanced-table-sticky-left-columns":stickyLeftColumn&&stickyLeftColumn.length>0},{"advanced-table-no-table-container":noTableCardContainer},columnGroupBorderColor?`column-group-border-${columnGroupBorderColor}`:"",scrollBarNone?"advanced-table-hide-scrollbar":"",globalProps(props),className);const tableWrapperStyle=virtualizedRows?getVirtualizedContainerStyles(maxHeight):{};const tableElement=jsx(Table,{className:`${loading?"content-loading":""}`,dark:dark,dataTable:true,numberSpacing:"tabular",responsive:"none",...tableProps,children:children?children:jsxs(Fragment,{children:[jsx(TableHeader,{}),jsx(TableBody,{isFetching:isFetching})]})});return jsxs(Fragment,{children:[pagination&&jsx(TablePagination,{onChange:onPageChange,position:"top",range:paginationProps==null?void 0:paginationProps.range,table:table}),jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,onScroll:virtualizedRows?e2=>fetchMoreOnBottomReached(e2.currentTarget,fetchNextPage,isFetching,totalFetched,fullData.length):void 0,ref:tableWrapperRef,style:tableWrapperStyle,children:[renderFullscreenHeader(),jsx(AdvancedTableProvider,{cascadeCollapse:cascadeCollapse,columnDefinitions:columnDefinitions,columnGroupBorderColor:columnGroupBorderColor,columnVisibilityControl:columnVisibilityControl,customSort:customSort,enableSortingRemoval:enableSortingRemoval,enableToggleExpansion:enableToggleExpansion,enableVirtualization:virtualizedRows,expandByDepth:expandByDepth,expanded:expanded,expandedControl:expandedControl,handleExpandOrCollapse:handleExpandOrCollapse,hasAnySubRows:hasAnySubRows,inlineRowLoading:inlineRowLoading,isActionBarVisible:isActionBarVisible,isFullscreen:isFullscreen,loading:loading,onCustomSortClick:onCustomSortClick,onExpandByDepthClick:onExpandByDepthClick,persistToggleExpansionButton:persistToggleExpansionButton,pinnedRows:pinnedRows,responsive:responsive,rowStyling:rowStyling,selectableRows:selectableRows,setExpanded:setExpanded,showActionsBar:showActionsBar,sortControl:sortControl,stickyLeftColumn:stickyLeftColumn,subRowHeaders:tableOptions==null?void 0:tableOptions.subRowHeaders,table:table,tableContainerRef:tableWrapperRef,toggleExpansionIcon:toggleExpansionIcon,totalAvailableCount:fullData.length,virtualizedRows:virtualizedRows,children:jsxs(React__default.Fragment,{children:[jsx(TableActionBar,{actions:actions,isVisible:isActionBarVisible,selectedCount:selectedRowsLength,type:columnVisibilityControl?"column-visibility":"row-selection"}),virtualizedRows?jsx("div",{style:{overflow:"auto",width:"100%"},children:tableElement}):tableElement]})})]}),pagination&&jsx(TablePagination,{onChange:onPageChange,position:"bottom",range:paginationProps==null?void 0:paginationProps.range,table:table})]})};AdvancedTable.Header=TableHeader;AdvancedTable.Body=TableBody;const breakpoints={xs:"(max-width: 575px)",sm:"(min-width: 576px) and (max-width: 767px)",md:"(min-width: 768px) and (max-width: 991px)",lg:"(min-width: 992px) and (max-width: 1199px)",xl:"(min-width: 1200px)"};const getResponsiveValue=prop=>{if(typeof prop==="string"){return prop}for(const[bp,value]of Object.entries(prop||{})){if(bp!=="default"&&window.matchMedia(breakpoints[bp]).matches){return value}}return(prop==null?void 0:prop.default)||void 0};const Background=props=>{const{alt:alt=void 0,aria:aria={},backgroundColor:backgroundColor="light",backgroundPosition:backgroundPosition="",backgroundRepeat:backgroundRepeat="initial",backgroundSize:backgroundSize="cover",children:children,className:className,customColor:customColor,data:data={},htmlOptions:htmlOptions={},id:id,imageOverlay:imageOverlay,imageUrl:imageUrl="",tag:tag="div",transition:transition=""}=props;const[responsiveProps,setResponsiveProps]=useState({backgroundSize:getResponsiveValue(backgroundSize),backgroundPosition:getResponsiveValue(backgroundPosition),backgroundRepeat:getResponsiveValue(backgroundRepeat),backgroundColor:getResponsiveValue(backgroundColor),imageUrl:getResponsiveValue(imageUrl)});useEffect((()=>{const updateResponsiveProps=()=>{setResponsiveProps({backgroundSize:getResponsiveValue(backgroundSize),backgroundPosition:getResponsiveValue(backgroundPosition),backgroundRepeat:getResponsiveValue(backgroundRepeat),backgroundColor:getResponsiveValue(backgroundColor),imageUrl:getResponsiveValue(imageUrl)})};window.addEventListener("resize",updateResponsiveProps);return()=>window.removeEventListener("resize",updateResponsiveProps)}),[backgroundSize,backgroundPosition,backgroundRepeat,backgroundColor,imageUrl]);const{backgroundColor:resBackgroundColor,backgroundPosition:resBackgroundPosition,backgroundRepeat:resBackgroundRepeat,backgroundSize:resBackgroundSize,imageUrl:resImageUrl}=responsiveProps;const classes=classnames(buildCss("pb_background_kit"),"lazyload",globalProps(props),transition,{[`pb_background_color_${resBackgroundColor}`]:resBackgroundColor&&!customColor,[`pb_background_custom_color`]:!!customColor},imageOverlay?`imageoverlay_${imageOverlay}`:"",className);const backgroundStyle={backgroundColor:customColor||void 0,...resImageUrl!==""?{backgroundImage:resImageUrl?`url(${resImageUrl})`:void 0,backgroundRepeat:resBackgroundRepeat||void 0,backgroundPosition:resBackgroundPosition||void 0,backgroundSize:resBackgroundSize||void 0}:{}};const dynamicInlineProps=globalInlineProps(props);const combinedStyles={...backgroundStyle,...dynamicInlineProps};const Tag=`${tag}`;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx(Tag,{...ariaProps,...dataProps,...htmlProps,alt:alt,className:classes,id:id,style:combinedStyles,children:children})};const BreadCrumbItem=props=>{const{aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,component:component="a",...rest}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const Component=component||"span";const css=classnames(buildCss("pb_bread_crumb_item_kit"),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:css,id:id,children:jsx(Component,{className:"pb_bread_crumb_item",...domSafeProps(rest)})})};const BreadCrumbs=props=>{const{aria:aria={label:"Breadcrumb Navigation"},className:className,data:data={},htmlOptions:htmlOptions={},id:id,children:children}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const css=classnames(buildCss("pb_bread_crumbs_kit"),globalProps(props),className);return jsx("nav",{...ariaProps,...dataProps,...htmlProps,className:css,id:id,children:children})};const ButtonToolbar=props=>{const{aria:aria={},children:children,className:className,data:data={},htmlOptions:htmlOptions={},id:id,orientation:orientation="horizontal",text:text2,variant:variant="primary"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_button_toolbar_kit",orientation,variant),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:children||text2})};const contactTypeMap={cell:"mobile",email:"envelope",extension:"phone-plus",home:"phone",work:"phone-office","work-cell":"phone-laptop","wrong-phone":"phone-slash",international:"globe"};const envelopeIcon=getAllIcons()["envelope"].icon;const formatContact=(contactString,contactType)=>{if(contactType==="email")return contactString;if(contactType==="international")return contactString;const cleaned=contactString.replace(/\D/g,"");const phoneNumber=cleaned.match(/^(1|)?(\d{3})(\d{3})(\d{4})$/);if(contactType==="extension"){return cleaned.match(/^\d{4}$/)}if(phoneNumber){const intlCode=phoneNumber[1]?"+1 ":"";return[intlCode,"(",phoneNumber[2],") ",phoneNumber[3],"-",phoneNumber[4]].join("")}return null};const Contact=props=>{const{aria:aria={},className:className,contactDetail:contactDetail,contactType:contactType,contactValue:contactValue,data:data={},dark:dark=false,htmlOptions:htmlOptions={},iconEnabled:iconEnabled=true,id:id,unstyled:unstyled=false}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_contact_kit"),globalProps(props),className);const formattedValue=formatContact(contactValue,contactType);const content=jsxs(Fragment,{children:[iconEnabled&&(contactType==="email"?jsx(Icon,{className:"svg-inline--fa envelope",customIcon:envelopeIcon,dark:dark,fixedWidth:true}):jsx(Icon,{dark:dark,fixedWidth:true,icon:contactTypeMap[contactType]||"phone"})),iconEnabled?` ${formattedValue} `:formattedValue,contactDetail&&jsx(Caption,{dark:dark,size:"xs",tag:"span",text:contactDetail})]});if(unstyled){return jsx("span",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:content})}return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsx(Body$1,{className:"pb_contact_kit",color:"light",dark:dark,tag:"span",children:content})})};const CopyButton=props=>{const{aria:aria={},className:className,data:data={},from:from="",id:id,text:text2="Copy",timeout:timeout=1e3,tooltipPlacement:tooltipPlacement="bottom",tooltipText:tooltipText="Copied!",value:value="",variant:variant="icon"}=props;const[copied,copy]=usePBCopy({value:value,from:from,timeout:timeout});const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const classes=classnames(buildCss("pb_copy_button_kit"),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,className:classes,id:id,children:jsx(Tooltip,{forceOpenTooltip:copied,placement:tooltipPlacement,showTooltip:false,text:tooltipText,children:variant==="icon"?jsx(CircleIconButton,{icon:"copy",onClick:copy,variant:"link"}):jsx(Button,{icon:"copy",onClick:copy,children:text2})})})};const sizes$1={lg:1,md:3,sm:4};const Currency=props=>{const{abbreviate:abbreviate=false,align:align="left",aria:aria={},amount:amount,data:data={},decimals:decimals="default",emphasized:emphasized=true,htmlOptions:htmlOptions={},id:id,unit:unit,className:className,label:label="",nullDisplay:nullDisplay="",size:size="sm",symbol:symbol="$",variant:variant="default",dark:dark=false,unstyled:unstyled=false,commaSeparator:commaSeparator=false}=props;const convertAmount=input=>{if(typeof input==="number"){if(input===0&&!nullDisplay){return""}return input.toFixed(2)}return input};const currencyAmount=convertAmount(amount);const emphasizedClass=emphasized?"":"_deemphasized";let variantClass;if(variant==="light"){variantClass="_light"}else if(variant==="bold"){variantClass="_bold"}const[whole,decimal="00"]=currencyAmount.split(".");const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_currency_kit",align,size),globalProps(props),className);const getFormattedNumber=input=>new Intl.NumberFormat("en-US",{notation:"compact",maximumFractionDigits:1}).format(input);const getAbbreviatedValue=abbrType=>{const num=`${getFormattedNumber(whole.split(",").join(""))}`,isAmount=abbrType==="amount",isUnit=abbrType==="unit";return isAmount?num.slice(0,-1):isUnit?num.slice(-1):""};const getMatchingDecimalAmount=decimals==="matching"?currencyAmount:whole;const getMatchingDecimalValue=decimals==="matching"?"":`.${decimal}`;const formatAmount=amount2=>{if(!commaSeparator)return amount2;const[wholePart,decimalPart]=amount2.split(".");const formattedWhole=new Intl.NumberFormat("en-US").format(parseInt(wholePart));return decimalPart?`${formattedWhole}.${decimalPart}`:formattedWhole};const swapNegative=size==="sm"&&symbol!=="";const handleNegative=currencyAmount.startsWith("-")&&swapNegative?"-":"";const getAbsoluteAmount=amountString=>amountString.replace(/^-/,"");const getAbbrOrFormatAmount=abbreviate?getAbbreviatedValue("amount"):formatAmount(getMatchingDecimalAmount);const getAmount=swapNegative?getAbsoluteAmount(getAbbrOrFormatAmount):getAbbrOrFormatAmount;const getAbbreviation=abbreviate?getAbbreviatedValue("unit"):null;const getDecimalValue=abbreviate?"":getMatchingDecimalValue;return jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:[jsx(Caption,{dark:dark,children:label}),jsx("div",{className:`pb_currency_wrapper${variantClass||emphasizedClass}`,children:unstyled?nullDisplay&&!amount?jsx("div",{children:nullDisplay}):jsxs(Fragment,{children:[jsxs("div",{children:[handleNegative,symbol]}),jsx("div",{children:getAmount}),jsxs("div",{children:[getAbbreviation,unit?unit:getDecimalValue]})]}):nullDisplay&&!amount?jsx(Title,{className:"pb_currency_value",dark:dark,size:sizes$1[size],children:nullDisplay}):jsxs(Fragment,{children:[jsxs(Body$1,{className:"dollar_sign",color:"light",dark:dark,children:[handleNegative,symbol]}),jsx(Title,{className:"pb_currency_value",dark:dark,size:sizes$1[size],children:getAmount}),jsxs(Body$1,{className:"unit",color:"light",dark:dark,children:[getAbbreviation,unit?unit:getDecimalValue]})]})})]})};const statusMap={increase:"positive",decrease:"negative",neutral:"neutral"};const iconMap$1={increase:"arrow-up",decrease:"arrow-down"};const StatChange=props=>{const{change:change="neutral",className:className,dark:dark=false,htmlOptions:htmlOptions={},icon:icon,id:id,value:value}=props;const status=statusMap[change];let returnedIcon=iconMap$1[change];if(icon){returnedIcon=icon}const htmlProps=buildHtmlProps(htmlOptions);return jsx(Fragment,{children:value&&jsx("div",{className:classnames(buildCss("pb_stat_change_kit",status),globalProps(props),className),id:id,...htmlProps,children:jsxs(Body$1,{dark:dark,status:status,children:[" ",returnedIcon&&jsxs(Fragment,{children:[jsx(Icon,{dark:dark,fixed_width:true,icon:returnedIcon})," "]}),`${value}%`]})})})};const StatValue=props=>{const{className:className,htmlOptions:htmlOptions={},id:id,unit:unit,value:value=0}=props;const htmlProps=buildHtmlProps(htmlOptions);const displayValue=function(value2){if(value2||value2===0){return jsx(Title,{size:1,tag:"span",text:`${value2}`})}};const displayUnit=function(unit2){if(unit2){return jsx(Title,{size:3,tag:"span",text:unit2})}};return jsx("div",{className:classnames("pb_stat_value_kit",globalProps(props),className),id:id,...htmlProps,children:jsxs("div",{className:"pb_stat_value_wrapper",children:[displayValue(value)," ",displayUnit(unit)]})})};const DashboardValue=props=>{const{align:align="left",aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},id:id,statChange:statChange={},statLabel:statLabel,statValue:statValue={}}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_dashboard_value_kit",align),globalProps(props),className);return jsxs("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:[statLabel&&jsx(Body$1,{color:"light",children:statLabel}),statValue&&jsx(StatValue,{unit:statValue.unit,value:statValue.value}),statChange&&jsx(StatChange,{change:statChange.change,value:statChange.value})]})};const PbDate=props=>{const{aria:aria={},alignment:alignment="left",className:className,dark:dark=false,data:data={},htmlOptions:htmlOptions={},id:id,showDayOfWeek:showDayOfWeek=false,showCurrentYear:showCurrentYear=false,showIcon:showIcon=false,size:size="md",unstyled:unstyled=false,value:value}=props;const weekday=DateTime$1.toWeekday(value);const month=DateTime$1.toMonth(value);const day=DateTime$1.toDay(value);const year=DateTime$1.toYear(value);const currentYear=(new Date).getFullYear();const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_date_kit",alignment),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:unstyled?jsxs(Fragment,{children:[showIcon&&jsx("div",{children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt"})}),showDayOfWeek&&jsxs(Fragment,{children:[jsx("div",{children:weekday}),jsx("div",{children:"•"})]}),jsxs("span",{children:[jsxs("span",{children:[month," ",day]}),(currentYear!==year||showCurrentYear)&&jsx("span",{children:`, ${year}`})]})]}):size=="md"||size=="lg"?jsxs(Title,{dark:dark,size:4,tag:"h4",children:[showIcon&&jsx(Body$1,{className:"pb_icon_kit_container",color:"light",tag:"span",children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt"})}),showDayOfWeek&&jsxs(Fragment,{children:[weekday,jsx(Body$1,{color:"light",tag:"span",text:" • "})]}),jsxs("span",{children:[month," ",day]}),(currentYear!==year||showCurrentYear)&&jsx("span",{children:`, ${year}`})]}):jsxs(Fragment,{children:[showIcon&&jsx(Caption,{className:"pb_icon_kit_container",dark:dark,tag:"span",children:jsx(Icon,{fixedWidth:true,icon:"calendar-alt",size:"sm"})}),showDayOfWeek&&jsxs(Fragment,{children:[jsx(Caption,{dark:dark,tag:"div",children:weekday}),jsx(Caption,{color:"light",dark:dark,tag:"div",text:" • "})]}),jsxs(Caption,{dark:dark,tag:"span",children:[month," ",day,(currentYear!==year||showCurrentYear)&&jsx(Fragment,{children:`, ${year}`})]})]})})};const DatePicker=props=>{if(props.plugins);const{allowInput:allowInput=false,aria:aria={},className:className,customQuickPickDates:customQuickPickDates,dark:dark=false,data:data={},defaultDate:defaultDate="",disableDate:disableDate=null,disableInput:disableInput,disableRange:disableRange=null,disableWeekdays:disableWeekdays=null,enableTime:enableTime=false,error:error,format:format="m/d/Y",hideIcon:hideIcon=false,hideLabel:hideLabel=false,htmlOptions:htmlOptions={},id:id,initializeOnce:initializeOnce=false,inLine:inLine=false,inputAria:inputAria={},inputData:inputData={},inputOnChange:inputOnChange,inputValue:inputValue,label:label="Date Picker",maxDate:maxDate,minDate:minDate,mode:mode="single",name:name,onChange:onChange=()=>{},onClose:onClose,pickerId:pickerId,placeholder:placeholder="Select Date",plugins:plugins=false,position:position,positionElement:positionElement,requiredIndicator:requiredIndicator,scrollContainer:scrollContainer,selectionType:selectionType="",showTimezone:showTimezone=false,staticPosition:staticPosition=true,thisRangesEndToday:thisRangesEndToday=false,yearRange:yearRange=[1900,2100],controlsStartId:controlsStartId,controlsEndId:controlsEndId,syncStartWith:syncStartWith,syncEndWith:syncEndWith}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const inputAriaProps=buildAriaProps(inputAria);const inputDataProps=buildDataProps(inputData);const getCursorStyle=cursor=>{if(disableInput)return"not-allowed";if(cursor){return camelToSnakeCase(cursor).replace(/_/g,"-")}return"pointer"};useEffect((()=>{datePickerHelper({allowInput:allowInput,customQuickPickDates:customQuickPickDates,defaultDate:defaultDate,disableDate:disableDate,disableRange:disableRange,disableWeekdays:disableWeekdays,enableTime:enableTime,format:format,maxDate:maxDate,minDate:minDate,mode:mode,onChange:onChange,onClose:onClose,pickerId:pickerId,plugins:plugins,position:position,positionElement:positionElement,selectionType:selectionType,showTimezone:showTimezone,staticPosition:staticPosition,thisRangesEndToday:thisRangesEndToday,yearRange:yearRange,controlsStartId:controlsStartId,controlsEndId:controlsEndId,syncStartWith:syncStartWith,syncEndWith:syncEndWith,required:false},scrollContainer)}),initializeOnce?[]:void 0);const filteredProps={...props};if(filteredProps.marginBottom===void 0){filteredProps.marginBottom="sm"}filteredProps==null?true:delete filteredProps.position;const classes=classnames(buildCss("pb_date_picker_kit"),globalProps(filteredProps),error?"error":null,inLine&&"inline-date-picker",className);const iconWrapperClass=()=>{let base="cal_icon_wrapper";if(dark){base+=" dark"}if(hideLabel){base+=" no_label_shift"}if(error){base+=" error"}if(disableInput){base+=" disabled"}return base};const angleDown=getAllIcons()["angleDown"].icon;const errorId=error?`${pickerId}-error`:void 0;return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs("div",{...inputAriaProps,...inputDataProps,className:"input_wrapper",children:[!hideLabel&&jsx("label",{htmlFor:pickerId,children:requiredIndicator?jsxs(Caption,{className:"pb_date_picker_kit_label",color:"lighter",children:[label," ",jsx("span",{style:{color:`${colors.error}`},children:"*"})]}):jsx(Caption,{className:"pb_date_picker_kit_label",color:"lighter",text:label})}),jsxs(Fragment,{children:[jsxs("div",{className:"date_picker_input_wrapper",children:[jsx("input",{"aria-describedby":errorId,"aria-invalid":!!error,autoComplete:"off",className:"date_picker_input",disabled:disableInput,id:pickerId,name:name,onChange:inputOnChange,placeholder:placeholder,style:{cursor:getCursorStyle(filteredProps.cursor)},value:inputValue}),error&&jsx(Body$1,{aria:{atomic:"true",live:"polite"},htmlOptions:{role:"alert"},id:errorId,status:"negative",text:error,variant:null})]}),!hideIcon&&!inLine&&jsx("div",{className:iconWrapperClass(),id:`cal-icon-${pickerId}`,children:jsx(Icon,{className:"cal_icon",icon:"calendar-alt"})}),inLine?jsxs("div",{children:[jsx("div",{className:`${iconWrapperClass()} date-picker-inline-icon-plus`,id:`${pickerId}-icon-plus`,children:jsx(Icon,{className:"date-picker-plus-icon",icon:"plus"})}),jsx("div",{className:`${iconWrapperClass()} date-picker-inline-angle-down`,id:`${pickerId}-angle-down`,children:jsx(Icon,{className:"angle_down_icon svg-inline--fa",customIcon:angleDown})})]}):null]})]})})};const dateTimestamp$1=(dateValue,includeYear)=>{if(includeYear){return`${DateTime$1.toMonth(dateValue)} ${DateTime$1.toDay(dateValue)}, ${DateTime$1.toYear(dateValue)}`}else{return`${DateTime$1.toMonth(dateValue)} ${DateTime$1.toDay(dateValue)}`}};const dateTimeIso$1=dateValue=>DateTime$1.toIso(dateValue);const DateRangeInline=props=>{const{align:align="left",className:className,dark:dark=false,data:data={},endDate:endDate,htmlOptions:htmlOptions={},icon:icon=false,size:size="sm",startDate:startDate,showCurrentYear:showCurrentYear=false}=props;const dateInCurrentYear=()=>{const currentDate=new Date;return(startDate==null?void 0:startDate.getFullYear())===(endDate==null?void 0:endDate.getFullYear())&&(startDate==null?void 0:startDate.getFullYear())===currentDate.getFullYear()};const dateRangeClasses=buildCss("pb_date_range_inline_kit",align);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const renderTime=date=>{const includeYear=showCurrentYear||!dateInCurrentYear();return jsx("time",{dateTime:dateTimeIso$1(date),children:` ${dateTimestamp$1(date,includeYear)} `})};return jsx("div",{...dataProps,...htmlProps,className:classnames(dateRangeClasses,globalProps(props),className),children:jsxs("div",{className:"pb_date_range_inline_wrapper",children:[size==="xs"&&jsxs(Fragment,{children:[icon&&jsx(Caption,{dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_icon",dark:dark,fixedWidth:true,icon:"calendar-alt",size:size,tag:"span"})}),jsx(Caption,{dark:dark,tag:"span",children:renderTime(startDate)}),jsx(Caption,{dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_arrow",dark:dark,fixedWidth:true,icon:"long-arrow-right",tag:"span"})}),jsx(Caption,{dark:dark,tag:"span",children:renderTime(endDate)})]}),size==="sm"&&jsxs(Fragment,{children:[icon&&jsx(Body$1,{color:"light",dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_icon",dark:dark,fixedWidth:true,icon:"calendar-alt",size:size,tag:"span"})}),jsx(Body$1,{dark:dark,tag:"span",children:renderTime(startDate)}),jsx(Body$1,{color:"light",dark:dark,tag:"span",children:jsx(Icon,{className:"pb_date_range_inline_arrow",dark:dark,fixedWidth:true,icon:"long-arrow-right",tag:"span"})}),jsx(Body$1,{dark:dark,tag:"span",children:renderTime(endDate)})]})]})})};const DateYearStacked=props=>{const{align:align="left",className:className,dark:dark=false,date:date,data:data={},htmlOptions:htmlOptions={}}=props;const css=classnames(buildCss("pb_date_year_stacked",align),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsxs("div",{...dataProps,...htmlProps,className:css,children:[jsx(Title,{dark:dark,size:4,text:`${DateTime$1.toDay(date)} ${DateTime$1.toMonth(date).toUpperCase()}`}),jsx(Body$1,{color:"light",children:DateTime$1.toYear(date)})]})};const DateRangeStacked=props=>{const{className:className,dark:dark=false,endDate:endDate,htmlOptions:htmlOptions={},startDate:startDate,data:data={}}=props;const css=classnames(buildCss("pb_date_range_stacked"),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx("div",{...dataProps,...htmlProps,className:css,children:jsxs(Flex,{vertical:"center",children:[jsx(FlexItem,{children:jsx(DateYearStacked,{align:"right",dark:dark,date:startDate})}),jsx(FlexItem,{children:jsx("div",{children:jsx(Body$1,{color:"light",tag:"span",children:jsx(Icon,{className:"pb_date_range_stacked_arrow",fixedWidth:true,icon:"long-arrow-right"})})})}),jsx(FlexItem,{children:jsx(DateYearStacked,{dark:dark,date:endDate})})]})})};const sizes={sm:4,md:3};const DateStacked=props=>{const{align:align="left",bold:bold=false,reverse:reverse=false,className:className,dark:dark=false,date:date,data:data={},htmlOptions:htmlOptions={},size:size="sm",showCurrentYear:showCurrentYear=false}=props;const classes=classnames(buildCss("pb_date_stacked_kit",align,size,{dark:dark,reverse:reverse}),globalProps(props),className);const currentYear=(new Date).getFullYear();const inputYear=DateTime$1.toYear(date);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx(Fragment,{children:bold==false?jsxs("div",{...dataProps,...htmlProps,className:classes,children:[jsxs("div",{className:"pb_date_stacked_day_month",children:[jsx(Caption,{text:DateTime$1.toMonth(date).toUpperCase()}),jsx(Title,{dark:dark,size:sizes[size],text:DateTime$1.toDay(date).toString()})]}),(currentYear!=inputYear||showCurrentYear)&&jsx(Caption,{size:"xs",children:inputYear})]}):jsx("div",{...dataProps,...htmlProps,className:classes,children:jsxs("div",{className:"pb_date_stacked_day_month",children:[jsx(Title,{bold:true,dark:dark,size:"4",text:DateTime$1.toMonth(date)}),jsx(Title,{bold:true,dark:dark,size:"4",text:DateTime$1.toDay(date).toString()}),(currentYear!=inputYear||showCurrentYear)&&jsx(Title,{size:"4",children:inputYear})]})})})};const Time=props=>{const{align:align,className:className,date:date,htmlOptions:htmlOptions={},showIcon:showIcon,size:size,timeZone:timeZone,unstyled:unstyled=false,showTimezone:showTimezone=true}=props;const classes=classnames(buildCss("pb_time_kit",align,size),globalProps(props),className);const clockIcon=getAllIcons()["clock"];const htmlProps=buildHtmlProps(htmlOptions);return jsxs("div",{...htmlProps,className:classes,children:[showIcon&&(unstyled?jsxs("span",{children:[jsx(Icon,{className:"svg-inline--fa clock",customIcon:clockIcon.icon})," "]}):jsx(Fragment,{children:jsxs(Body$1,{color:"light",tag:"span",children:[jsx(Icon,{className:"svg-inline--fa clock",customIcon:clockIcon.icon,fixedWidth:true,size:size==="md"?"":"sm"})," "]})})),jsx("time",{dateTime:date.toLocaleString(),children:jsx("span",{children:unstyled?jsxs(Fragment,{children:[jsx("span",{children:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx("span",{children:DateTime$1.toTimeZone(date,timeZone)})]}):size==="md"?jsxs(Fragment,{children:[jsx(Body$1,{className:"pb_time",tag:"span",text:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx(Body$1,{color:"light",tag:"span",text:DateTime$1.toTimeZone(date,timeZone)})]}):jsxs(Fragment,{children:[jsx(Caption,{color:"light",tag:"span",text:DateTime$1.toTimeWithMeridiem(date,timeZone)})," ",showTimezone&&jsx(Caption,{color:"light",tag:"span",text:DateTime$1.toTimeZone(date,timeZone)})]})})})]})};const DateTime=props=>{const{align:align="left",aria:aria={},className:className,data:data={},htmlOptions:htmlOptions={},showDayOfWeek:showDayOfWeek=false,datetime:datetime2,id:id,showCurrentYear:showCurrentYear=false,showIcon:showIcon=false,size:size="md",timeZone:timeZone="America/New_York"}=props;const ariaProps=buildAriaProps(aria);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);const classes=classnames(buildCss("pb_date_time",size),globalProps(props),className);return jsx("div",{...ariaProps,...dataProps,...htmlProps,className:classes,id:id,children:jsxs(Flex,{horizontal:align,vertical:"baseline",children:[jsx(PbDate,{showCurrentYear:showCurrentYear,showDayOfWeek:showDayOfWeek,size:size,value:datetime2}),jsx(Time,{date:datetime2,marginLeft:"sm",showIcon:showIcon,size:size,timeZone:timeZone})]})})};const TimeStackedDefault=props=>{if(props.date);const{align:align="left",className:className,dark:dark,data:data={},date:date,htmlOptions:htmlOptions={},time:time,timeZone:timeZone}=props;const classes=classnames(buildCss("pb_time_stacked_kit",align),globalProps(props),className);const dataProps=buildDataProps(data);const htmlProps=buildHtmlProps(htmlOptions);return jsx("div",{className:classes,...dataProps,...htmlProps,children:jsx(Body$1,{className:classnames("pb_time_stacked","time-spacing"),color:"light",dark:dark,children:jsxs("time",{children:[DateTime$1.toTimeWithMeridiem(date?date:new Date(time),timeZone),jsx(Caption,{className:"pb_time_stacked",color:"light",dark:dark,tag:"span",text:DateTime$1.toTimeZone(date?date:new Date(time),timeZone)})]})})})};const DateTimeStacked=props=>{if(props.date);const{date:date,datetime:datetime2,dark:dark,htmlOptions:htmlOptions={},timeZone:timeZone="America/New_York",showCurrentYear:showCurrentYear=false}=props;const classes=buildCss("pb_date_time_stacked_kit",globalProps(props));const htmlProps=buildHtmlProps(htmlOptions);return jsxs(Flex,{inline:false,vertical:"stretch",...htmlProps,...props,children:[jsx(FlexItem,{children:jsx(DateStacked,{align:"right",bold:true,dark:dark,date:date||datetime2,showCurrentYear:showCurrentYear})}),jsx(SectionSeparator,{className:"date-time-padding",orientation:"vertical"}),jsx(FlexItem,{children:jsx(TimeStackedDefault,{className:classes,dark:dark,date:date||datetime2,timeZone:timeZone})})]})};var lib={exports:{}};var Modal$1={};var propTypes={exports:{}};var ReactPropTypesSecret_1;var hasRequiredReactPropTypesSecret;function requireReactPropTypesSecret(){if(hasRequiredReactPropTypesSecret)return ReactPropTypesSecret_1;hasRequiredReactPropTypesSecret=1;var ReactPropTypesSecret="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";ReactPropTypesSecret_1=ReactPropTypesSecret;return ReactPropTypesSecret_1}var factoryWithThrowingShims;var hasRequiredFactoryWithThrowingShims;function requireFactoryWithThrowingShims(){if(hasRequiredFactoryWithThrowingShims)return factoryWithThrowingShims;hasRequiredFactoryWithThrowingShims=1;var ReactPropTypesSecret=requireReactPropTypesSecret();function emptyFunction(){}function emptyFunctionWithReset(){}emptyFunctionWithReset.resetWarningCache=emptyFunction;factoryWithThrowingShims=function(){function shim(props,propName,componentName,location,propFullName,secret){if(secret===ReactPropTypesSecret){return}var err=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");err.name="Invariant Violation";throw err}shim.isRequired=shim;function getShim(){return shim}var ReactPropTypes={array:shim,bigint:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,elementType:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim,exact:getShim,checkPropTypes:emptyFunctionWithReset,resetWarningCache:emptyFunction};ReactPropTypes.PropTypes=ReactPropTypes;return ReactPropTypes};return factoryWithThrowingShims}var hasRequiredPropTypes;function requirePropTypes(){if(hasRequiredPropTypes)return propTypes.exports;hasRequiredPropTypes=1;{propTypes.exports=requireFactoryWithThrowingShims()()}return propTypes.exports}var ModalPortal={exports:{}};var focusManager={};var tabbable={exports:{}};var hasRequiredTabbable;function requireTabbable(){if(hasRequiredTabbable)return tabbable.exports;hasRequiredTabbable=1;(function(module,exports){Object.defineProperty(exports,"__esModule",{value:true});exports.default=findTabbableDescendants;
 /*!
      * Adapted from jQuery UI core
      *

data/lib/playbook/forms/builder/collection_select_field.rb

@@ -16,7 +16,7 @@ module Playbook
         end
 
         options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
-        options[:prompt] = props[:blank_selection] if props.key?(:blank_selection)
+        options[:prompt] = props[:blank_selection] || ""
         html_options[:required] = "required" if props[:required]
         html_options[:id] = props[:input_options][:id]
         html_options[:class] = props[:input_options][:class] if props[:input_options][:class]

data/lib/playbook/forms/builder/select_field.rb

@@ -16,7 +16,7 @@ module Playbook
         end
 
         options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
-        options[:prompt] = props[:blank_selection] if props.key?(:blank_selection)
+        options[:prompt] = props[:blank_selection] || ""
         html_options[:required] = "required" if props[:required]
         html_options[:id] = props[:input_options][:id]
         html_options[:class] = props[:input_options][:class] if props[:input_options][:class]

data/lib/playbook/forms/builder/time_zone_select_field.rb

@@ -16,7 +16,7 @@ module Playbook
         end
 
         options[:skip_default_ids] = false unless options.key?(:skip_default_ids)
-        options[:prompt] = props[:blank_selection] if props.key?(:blank_selection)
+        options[:prompt] = props[:blank_selection] || ""
         html_options[:required] = "required" if props[:required]
         html_options[:id] = props[:input_options][:id]
         html_options[:class] = props[:input_options][:class] if props[:input_options][:class]

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "16.8.0"
-  VERSION = "16.8.0.pre.alpha.PLAY2945selectformblankselection16424"
+  VERSION = "16.8.0.pre.alpha.tablewidths16466"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 16.8.0.pre.alpha.PLAY2945selectformblankselection16424
+  version: 16.8.0.pre.alpha.tablewidths16466
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-05-18 00:00:00.000000000 Z
+date: 2026-05-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -260,6 +260,7 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/Utilities/ActionBarAnimationHelper.ts
 - app/pb_kits/playbook/pb_advanced_table/Utilities/BrowserCheck.tsx
 - app/pb_kits/playbook/pb_advanced_table/Utilities/CellRendererUtils.tsx
+- app/pb_kits/playbook/pb_advanced_table/Utilities/ColumnLayoutHelper.ts
 - app/pb_kits/playbook/pb_advanced_table/Utilities/ColumnStylingHelper.ts
 - app/pb_kits/playbook/pb_advanced_table/Utilities/ExpansionControlHelpers.tsx
 - app/pb_kits/playbook/pb_advanced_table/Utilities/IconHelpers.tsx
@@ -317,6 +318,8 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers_rails.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_rails.html.erb
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_rails.md
+- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.jsx
+- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility_custom.jsx
@@ -1763,7 +1766,6 @@ files:
 - app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.md
-- app/pb_kits/playbook/pb_form/docs/_form_form_with_select_examples.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.md
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_validation_msg.html.erb

data/app/pb_kits/playbook/pb_form/docs/_form_form_with_select_examples.html.erb

@@ -1,31 +0,0 @@
-<%
-  example_collection = [
-    OpenStruct.new(name: "Alabama", value: 1),
-    OpenStruct.new(name: "Alaska", value: 2),
-    OpenStruct.new(name: "Arizona", value: 3),
-    OpenStruct.new(name: "Arkansas", value: 4),
-    OpenStruct.new(name: "California", value: 5),
-    OpenStruct.new(name: "Colorado", value: 6),
-    OpenStruct.new(name: "Connecticut", value: 7),
-    OpenStruct.new(name: "Delaware", value: 8),
-    OpenStruct.new(name: "Florida", value: 9),
-    OpenStruct.new(name: "Georgia", value: 10),
-  ]
-%>
-
-<%= pb_form_with(scope: :example, url: "", method: :get) do |form| %>
-  <%= form.select :example_select, [ ["Yes", 1], ["No", 2], ["Maybe", 3] ], props: { label: "Select Default" } %>
-  <%= form.select :example_select_2, [ ["Yes", 1], ["No", 2], ["Maybe", 3] ], props: { label: "Select with Blank Selection", blank_selection: "Blank selection..." } %>
-  <%= form.select :example_select_3, [ ["Yes", 1], ["No", 2], ["Maybe", 3] ], { include_blank: "Include blank..." }, {}, props: { label: "Select with Include Blank" } %>
-  <%= form.collection_select :example_collection_select, example_collection, :value, :name, props: { label: "Collection Select Default" } %>
-  <%= form.collection_select :example_collection_select_2, example_collection, :value, :name, props: { label: "Collection Select with Blank Selection", blank_selection: "Blank selection..." } %>
-  <%= form.collection_select :example_collection_select_3, example_collection, :value, :name, { include_blank: "Include blank..." }, {}, props: { label: "Collection Select with Include Blank" } %>
-  <%= form.time_zone_select_field :example_time_zone_select, ActiveSupport::TimeZone.us_zones, props: { label: "Time Zone Select Default" } %>
-  <%= form.time_zone_select_field :example_time_zone_select_2, ActiveSupport::TimeZone.us_zones, { default: "Eastern Time (US & Canada)" }, props: { label: "Time Zone Select with a Default Selection" } %>
-  <%= form.time_zone_select_field :example_time_zone_select_3, ActiveSupport::TimeZone.us_zones, props: { label: "Time Zone Select with Blank Selection", blank_selection: "Blank selection..." }  %>
-  <%= form.time_zone_select_field :example_time_zone_select_4, ActiveSupport::TimeZone.us_zones, { include_blank: "Include blank..." }, {}, props: { label: "Time Zone Select with Include Blank" } %>
-  <%= form.actions do |action| %>
-    <%= action.submit %>
-    <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary" } %>
-  <% end %>
-<% end %>