playbook_ui 14.9.0.pre.alpha.PBNTR686advancedtablepaginationpoc4747 → 14.9.0.pre.alpha.PBNTR702stickyleftcolrails4806

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7b4ff9738d72ef7d8d82f6094b14f24ee0bbca5527331350fd798e027ef0b5e2
-  data.tar.gz: b00dba97003a486b78e3077c6bd401daa16ca6def0facb9402c4cc5d6aa3fe04
+  metadata.gz: d89f4517dd122bc15bf46cece276b7623372b18e9c168bda22529f464e335b52
+  data.tar.gz: f4627b91aeb56d610c20341ffdf10f0d4d56df24889ce87e56c01f1878b3959a
 SHA512:
-  metadata.gz: 323900e7b5f600c456c7ad6ecc392618710e7edd86e3d4e3db36bc02c5300b9e969e63be408342ece5a706d5ae7999a3dbbf351afacc3f9e40fb476188a0071c
-  data.tar.gz: f7aadfa3e07c508f56584578cf74bf01c98f127fd411900118ffe91e66aba0a88dea4e09beb9e4ea34d10f709580500dd9bab32bc92b77ea07ed42dcc658dc51
+  metadata.gz: 00b7e5e785ad232a9e119eb3ad5911b540354cf83b50c69a25e16f928fee3f87819ae9b433be0a5d9ac6027d5e7a1e048dc1b0cd2db0362bf28b59e4e756fe30
+  data.tar.gz: 23c75179a18b0f6eb118e581e056deb65fd85c3d78f4316ba57d939f3a92452d62d3770a98c40a2b16efcaf52f49eb55647c443f672c1c9caf1c056184ce205e

data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.html.erb

@@ -0,0 +1,95 @@
+<%= pb_rails("table", props: { size: "md", responsive: "scroll", sticky_left_column: ["1", "2", "3"] }) do %>
+  <thead>
+    <tr>
+      <th id="1">Column 1</th>
+      <th id="2">Column 2</th>
+      <th id="3">Column 3</th>
+      <th>Column 4</th>
+      <th>Column 5</th>
+      <th>Column 6</th>
+      <th>Column 7</th>
+      <th>Column 8</th>
+      <th>Column 9</th>
+      <th>Column 10</th>
+      <th>Column 11</th>
+      <th>Column 12</th>
+      <th>Column 13</th>
+      <th>Column 14</th>
+      <th>Column 15</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td id="1">Value 1</td>
+      <td id="2">Value 2</td>
+      <td id="3">Value 3</td>
+      <td>Value 4</td>
+      <td>Value 5</td>
+      <td>Column 6</td>
+      <td>Column 7</td>
+      <td>Column 8</td>
+      <td>Column 9</td>
+      <td>Column 10</td>
+      <td>Column 11</td>
+      <td>Column 12</td>
+      <td>Column 13</td>
+      <td>Column 14</td>
+      <td>Column 15</td>
+
+    </tr>
+    <tr>
+      <td id="1">Value 1</td>
+      <td id="2">Value 2</td>
+      <td id="3">Value 3</td>
+      <td>Value 4</td>
+      <td>Value 5</td>
+      <td>Column 6</td>
+      <td>Column 7</td>
+      <td>Column 8</td>
+      <td>Column 9</td>
+      <td>Column 10</td>
+      <td>Column 11</td>
+      <td>Column 12</td>
+      <td>Column 13</td>
+      <td>Column 14</td>
+      <td>Column 15</td>
+
+    </tr>
+    <tr>
+      <td id="1">Value 1</td>
+      <td id="2">Value 2</td>
+      <td id="3">Value 3</td>
+      <td>Value 4</td>
+      <td>Value 5</td>
+      <td>Column 6</td>
+      <td>Column 7</td>
+      <td>Column 8</td>
+      <td>Column 9</td>
+      <td>Column 10</td>
+      <td>Column 11</td>
+      <td>Column 12</td>
+      <td>Column 13</td>
+      <td>Column 14</td>
+      <td>Column 15</td>
+
+    </tr>
+    <tr>
+      <td id="1">Value 1</td>
+      <td id="2">Value 2</td>
+      <td id="3">Value 3</td>
+      <td>Value 4</td>
+      <td>Value 5</td>
+      <td>Column 6</td>
+      <td>Column 7</td>
+      <td>Column 8</td>
+      <td>Column 9</td>
+      <td>Column 10</td>
+      <td>Column 11</td>
+      <td>Column 12</td>
+      <td>Column 13</td>
+      <td>Column 14</td>
+      <td>Column 15</td>
+
+    </tr>
+  </tbody>
+<% end %>

data/app/pb_kits/playbook/pb_table/index.ts

@@ -1,32 +1,106 @@
 import PbEnhancedElement from '../pb_enhanced_element'
 
 export default class PbTable extends PbEnhancedElement {
-  static get selector(): string {
-    return '.table-responsive-collapse'
-  }
-
-  connect(): void {
-    const tables = document.querySelectorAll('.table-responsive-collapse');
-
-    // Each Table
-    [].forEach.call(tables, (table: HTMLTableElement) => {
-      // Header Titles
-      const headers: string[] = [];
-      [].forEach.call(table.querySelectorAll('th'), (header: HTMLTableCellElement) => {
-        const colSpan = header.colSpan
-        for (let i = 0; i < colSpan; i++) {
-          headers.push(header.textContent.replace(/\r?\n|\r/, ''));
+    private stickyLeftColumns: string[] = [];
+    private handleStickyColumnsRef: () => void;
+
+    static get selector(): string {
+      return '.table-responsive-collapse'
+    }
+
+    connect(): void {
+      const tables = document.querySelectorAll('.table-responsive-collapse');
+      // Each Table
+      [].forEach.call(tables, (table: HTMLTableElement) => {
+        // Header Titles
+        const headers: string[] = [];
+        [].forEach.call(table.querySelectorAll('th'), (header: HTMLTableCellElement) => {
+            const colSpan = header.colSpan
+            for (let i = 0; i < colSpan; i++) {
+              headers.push(header.textContent.replace(/\r?\n|\r/, ''));
+            }
+        });
+        // for each row in tbody
+        [].forEach.call(table.querySelectorAll('tbody tr'), (row: HTMLTableRowElement) => {
+          // for each cell
+          [].forEach.call(row.cells, (cell: HTMLTableCellElement, headerIndex: number) => {
+            // apply the attribute
+            cell.setAttribute('data-title', headers[headerIndex])
+          })
+        })
+      });
+
+      // New sticky columns logic
+      this.initStickyColumns();
+    }
+
+    private initStickyColumns(): void {
+      // Find tables with sticky-left-column class
+      const tables = document.querySelectorAll('.sticky-left-column');
+
+      tables.forEach((table) => {
+        // Extract sticky left column IDs by looking at the component's class
+        const classList = Array.from(table.classList);
+
+        // Look for classes in the format sticky-left-column-{ids}
+        const stickyColumnClass = classList.find(cls => cls.startsWith('sticky-columns-'));
+        if (stickyColumnClass) {
+          // Extract the IDs from the class name
+          this.stickyLeftColumns = stickyColumnClass
+              .replace('sticky-columns-', '')
+              .split('-');
+
+          if (this.stickyLeftColumns.length > 0) {
+            this.handleStickyColumnsRef = this.handleStickyColumns.bind(this);
+            this.handleStickyColumns();
+            window.addEventListener('resize', this.handleStickyColumnsRef);
+          }
         }
       });
+    }
 
-      // for each row in tbody
-      [].forEach.call(table.querySelectorAll('tbody tr'), (row: HTMLTableRowElement) => {
-        // for each cell
-        [].forEach.call(row.cells, (cell: HTMLTableCellElement, headerIndex: number) => {
-          // apply the attribute
-          cell.setAttribute('data-title', headers[headerIndex])
-        })
-      })
-    })
-  }
-}
+    private handleStickyColumns(): void {
+      let accumulatedWidth = 0;
+
+      this.stickyLeftColumns.forEach((colId, index) => {
+        const isLastColumn = index === this.stickyLeftColumns.length - 1;
+        const header = document.querySelector(`th[id="${colId}"]`);
+        const cells = document.querySelectorAll(`td[id="${colId}"]`);
+
+        if (header) {
+          header.classList.add('sticky');
+          (header as HTMLElement).style.left = `${accumulatedWidth}px`;
+
+          if (!isLastColumn) {
+            header.classList.add('with-border');
+            header.classList.remove('sticky-shadow');
+          } else {
+            header.classList.remove('with-border');
+            header.classList.add('sticky-shadow');
+          }
+
+          accumulatedWidth += (header as HTMLElement).offsetWidth;
+        }
+
+        cells.forEach((cell) => {
+          cell.classList.add('sticky');
+          (cell as HTMLElement).style.left = `${accumulatedWidth - (header as HTMLElement).offsetWidth}px`;
+
+          if (!isLastColumn) {
+            cell.classList.add('with-border');
+            cell.classList.remove('sticky-shadow');
+          } else {
+            cell.classList.remove('with-border');
+            cell.classList.add('sticky-shadow');
+          }
+        });
+      });
+    }
+
+    // Cleanup method to remove event listener
+    disconnect(): void {
+      if (this.handleStickyColumnsRef) {
+        window.removeEventListener('resize', this.handleStickyColumnsRef);
+      }
+    }
+}

data/app/pb_kits/playbook/pb_table/table.html.erb

@@ -18,4 +18,4 @@
       <%= content.presence %>
     <% end %>
   <% end %>
-<% end %>
+<% end %>

data/app/pb_kits/playbook/pb_table/table.rb

@@ -23,6 +23,8 @@ module Playbook
       prop :text
       prop :sticky, type: Playbook::Props::Boolean,
                     default: false
+      prop :sticky_left_column, type: Playbook::Props::Array,
+                                default: []
       prop :vertical_border, type: Playbook::Props::Boolean,
                              default: false
       prop :striped, type: Playbook::Props::Boolean,
@@ -37,8 +39,8 @@ module Playbook
       def classname
         generate_classname(
           "pb_table", "table-#{size}", single_line_class, dark_class,
-          disable_hover_class, container_class, data_table_class, sticky_class, collapse_class,
-          vertical_border_class, striped_class, outer_padding_class,
+          disable_hover_class, container_class, data_table_class, sticky_class, sticky_left_column_class,
+          collapse_class, vertical_border_class, striped_class, outer_padding_class,
           "table-responsive-#{responsive}", separator: " "
         )
       end
@@ -73,6 +75,19 @@ module Playbook
         sticky ? "sticky-header" : nil
       end
 
+      def sticky_left_column_class
+        if sticky_left_column.empty?
+          nil
+        else
+          sticky_col_classname = "sticky-left-column sticky-columns"
+          sticky_left_column.each do |id|
+            sticky_col_classname += "-#{id}"
+          end
+
+          sticky_col_classname
+        end
+      end
+
       def striped_class
         striped ? "striped" : nil
       end

data/dist/chunks/{_typeahead-B8fkIeXA.js → _typeahead-CCDoUmRR.js}

@@ -1,4 +1,4 @@
-import{jsx as jsx$1,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useReducer,useEffect,useMemo,useContext,createElement,useState,useRef,forwardRef,useLayoutEffect,useCallback,useImperativeHandle,Component,Fragment as Fragment$1}from"react";import{q as getDefaultExportFromCjs,w as filter,x as omit,j as getAllIcons,y as get,n as commonjsGlobal,v as colors$1,s as highchartsTheme,z as merge,r as highchartsDarkTheme,A as useCollapsible,B as getAugmentedNamespace,C as createPopper,E as uniqueId,F as typography,G as cloneDeep,H as isString}from"./lib-SyD3buPZ.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";import{TrixEditor}from"react-trix";import Trix from"trix";import require$$0 from"react-is";const initialState={items:[],dragData:{id:"",initialGroup:""},isDragging:"",activeContainer:""};const reducer=(state,action)=>{switch(action.type){case"SET_ITEMS":return Object.assign(Object.assign({},state),{items:action.payload});case"SET_DRAG_DATA":return Object.assign(Object.assign({},state),{dragData:action.payload});case"SET_IS_DRAGGING":return Object.assign(Object.assign({},state),{isDragging:action.payload});case"SET_ACTIVE_CONTAINER":return Object.assign(Object.assign({},state),{activeContainer:action.payload});case"CHANGE_CATEGORY":return Object.assign(Object.assign({},state),{items:state.items.map((item=>item.id===action.payload.itemId?Object.assign(Object.assign({},item),{container:action.payload.container}):item))});case"REORDER_ITEMS":{const{dragId:dragId,targetId:targetId}=action.payload;const newItems=[...state.items];const draggedItem=newItems.find((item=>item.id===dragId));const draggedIndex=newItems.indexOf(draggedItem);const targetIndex=newItems.findIndex((item=>item.id===targetId));newItems.splice(draggedIndex,1);newItems.splice(targetIndex,0,draggedItem);return Object.assign(Object.assign({},state),{items:newItems})}default:return state}};const DragContext=createContext({});const DraggableContext=()=>useContext(DragContext);const DraggableProvider=({children:children,initialItems:initialItems,onReorder:onReorder,onDragStart:onDragStart,onDragEnter:onDragEnter,onDragEnd:onDragEnd,onDrop:onDrop,onDragOver:onDragOver})=>{const[state,dispatch]=useReducer(reducer,initialState);useEffect((()=>{dispatch({type:"SET_ITEMS",payload:initialItems})}),[initialItems]);useEffect((()=>{onReorder(state.items)}),[state.items]);const handleDragStart=(id,container)=>{dispatch({type:"SET_DRAG_DATA",payload:{id:id,initialGroup:container}});dispatch({type:"SET_IS_DRAGGING",payload:id});if(onDragStart)onDragStart(id,container)};const handleDragEnter=(id,container)=>{if(state.dragData.id!==id){dispatch({type:"REORDER_ITEMS",payload:{dragId:state.dragData.id,targetId:id}});dispatch({type:"SET_DRAG_DATA",payload:{id:state.dragData.id,initialGroup:container}})}if(onDragEnter)onDragEnter(id,container)};const handleDragEnd=()=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});if(onDragEnd)onDragEnd()};const changeCategory=(itemId,container)=>{dispatch({type:"CHANGE_CATEGORY",payload:{itemId:itemId,container:container}})};const handleDrop=container=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});changeCategory(state.dragData.id,container);if(onDrop)onDrop(container)};const handleDragOver=(e,container)=>{e.preventDefault();dispatch({type:"SET_ACTIVE_CONTAINER",payload:container});if(onDragOver)onDragOver(e,container)};const contextValue=useMemo((()=>({items:state.items,dragData:state.dragData,isDragging:state.isDragging,activeContainer:state.activeContainer,handleDragStart:handleDragStart,handleDragEnter:handleDragEnter,handleDragEnd:handleDragEnd,handleDrop:handleDrop,handleDragOver:handleDragOver})),[state]);return jsx$1(DragContext.Provider,Object.assign({value:contextValue},{children:children}),void 0)};var classnames$1={exports:{}};
+import{jsx as jsx$1,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{createContext,useReducer,useEffect,useMemo,useContext,createElement,useState,useRef,forwardRef,useLayoutEffect,useCallback,useImperativeHandle,Component,Fragment as Fragment$1}from"react";import{q as getDefaultExportFromCjs,w as filter,x as omit,j as getAllIcons,y as get,n as commonjsGlobal,v as colors$1,s as highchartsTheme,z as merge,r as highchartsDarkTheme,A as useCollapsible,B as getAugmentedNamespace,C as createPopper,E as uniqueId,F as typography,G as cloneDeep,H as isString}from"./lib-CVPInSs5.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";import{TrixEditor}from"react-trix";import Trix from"trix";import require$$0 from"react-is";const initialState={items:[],dragData:{id:"",initialGroup:""},isDragging:"",activeContainer:""};const reducer=(state,action)=>{switch(action.type){case"SET_ITEMS":return Object.assign(Object.assign({},state),{items:action.payload});case"SET_DRAG_DATA":return Object.assign(Object.assign({},state),{dragData:action.payload});case"SET_IS_DRAGGING":return Object.assign(Object.assign({},state),{isDragging:action.payload});case"SET_ACTIVE_CONTAINER":return Object.assign(Object.assign({},state),{activeContainer:action.payload});case"CHANGE_CATEGORY":return Object.assign(Object.assign({},state),{items:state.items.map((item=>item.id===action.payload.itemId?Object.assign(Object.assign({},item),{container:action.payload.container}):item))});case"REORDER_ITEMS":{const{dragId:dragId,targetId:targetId}=action.payload;const newItems=[...state.items];const draggedItem=newItems.find((item=>item.id===dragId));const draggedIndex=newItems.indexOf(draggedItem);const targetIndex=newItems.findIndex((item=>item.id===targetId));newItems.splice(draggedIndex,1);newItems.splice(targetIndex,0,draggedItem);return Object.assign(Object.assign({},state),{items:newItems})}default:return state}};const DragContext=createContext({});const DraggableContext=()=>useContext(DragContext);const DraggableProvider=({children:children,initialItems:initialItems,onReorder:onReorder,onDragStart:onDragStart,onDragEnter:onDragEnter,onDragEnd:onDragEnd,onDrop:onDrop,onDragOver:onDragOver})=>{const[state,dispatch]=useReducer(reducer,initialState);useEffect((()=>{dispatch({type:"SET_ITEMS",payload:initialItems})}),[initialItems]);useEffect((()=>{onReorder(state.items)}),[state.items]);const handleDragStart=(id,container)=>{dispatch({type:"SET_DRAG_DATA",payload:{id:id,initialGroup:container}});dispatch({type:"SET_IS_DRAGGING",payload:id});if(onDragStart)onDragStart(id,container)};const handleDragEnter=(id,container)=>{if(state.dragData.id!==id){dispatch({type:"REORDER_ITEMS",payload:{dragId:state.dragData.id,targetId:id}});dispatch({type:"SET_DRAG_DATA",payload:{id:state.dragData.id,initialGroup:container}})}if(onDragEnter)onDragEnter(id,container)};const handleDragEnd=()=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});if(onDragEnd)onDragEnd()};const changeCategory=(itemId,container)=>{dispatch({type:"CHANGE_CATEGORY",payload:{itemId:itemId,container:container}})};const handleDrop=container=>{dispatch({type:"SET_IS_DRAGGING",payload:""});dispatch({type:"SET_ACTIVE_CONTAINER",payload:""});changeCategory(state.dragData.id,container);if(onDrop)onDrop(container)};const handleDragOver=(e,container)=>{e.preventDefault();dispatch({type:"SET_ACTIVE_CONTAINER",payload:container});if(onDragOver)onDragOver(e,container)};const contextValue=useMemo((()=>({items:state.items,dragData:state.dragData,isDragging:state.isDragging,activeContainer:state.activeContainer,handleDragStart:handleDragStart,handleDragEnter:handleDragEnter,handleDragEnd:handleDragEnd,handleDrop:handleDrop,handleDragOver:handleDragOver})),[state]);return jsx$1(DragContext.Provider,Object.assign({value:contextValue},{children:children}),void 0)};var classnames$1={exports:{}};
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see

data/dist/chunks/{_weekday_stacked-DSEuqOLN.js → _weekday_stacked-CxjKLoMr.js}

@@ -1,4 +1,4 @@
-import{r as requireLazysizes}from"./lazysizes-B7xYodB-.js";import{jsx,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{useEffect,createContext,useContext,useState,useCallback,createElement,forwardRef,useRef,useImperativeHandle,Fragment as Fragment$1,useReducer,useMemo,useLayoutEffect,isValidElement}from"react";import{h as buildAriaProps,i as buildDataProps,j as buildHtmlProps,k as classnames,l as globalProps,m as buildCss,n as globalInlineProps,F as Flex,I as Icon,o as FlexItem,p as Body$1,q as Caption,A as Avatar,r as domSafeProps,s as Title,S as SectionSeparator,t as DialogContext,u as Draggable,v as TextInput,_ as __awaiter,w as __generator,x as __spread,y as PropTypes,z as Card,E as noop$3,H as PbReactPopover,J as CircleIconButton,K as Button,N as HighchartsReact,O as Badge,Q as joinPresent,U as titleize,V as IconCircle,W as Image,X as Checkbox,Y as Radio}from"./_typeahead-B8fkIeXA.js";import{h as PbTable,j as getAllIcons,D as DateTime$1,a as datePickerHelper,u as useDropdown,o as omitBy,k as isEmpty,m as map,p as partial,l as find$1,n as commonjsGlobal,q as getDefaultExportFromCjs,r as highchartsDarkTheme,s as highchartsTheme,t as noop$4,v as colors,i as PbTextarea}from"./lib-SyD3buPZ.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";var ls_attrchange={exports:{}};(function(module){(function(window2,factory){if(!window2){return}var globalInstall=function(){factory(window2.lazySizes);window2.removeEventListener("lazyunveilread",globalInstall,true)};factory=factory.bind(null,window2,window2.document);if(module.exports){factory(requireLazysizes())}else if(window2.lazySizes){globalInstall()}else{window2.addEventListener("lazyunveilread",globalInstall,true)}})(typeof window!="undefined"?window:0,(function(window2,document2,lazySizes){var addObserver=function(){var connect,disconnect,observer,connected;var lsCfg=lazySizes.cfg;var attributes={"data-bgset":1,"data-include":1,"data-poster":1,"data-bg":1,"data-script":1};var regClassTest="(\\s|^)("+lsCfg.loadedClass;var docElem=document2.documentElement;var setClass=function(target){lazySizes.rAF((function(){lazySizes.rC(target,lsCfg.loadedClass);if(lsCfg.unloadedClass){lazySizes.rC(target,lsCfg.unloadedClass)}lazySizes.aC(target,lsCfg.lazyClass);if(target.style.display=="none"||target.parentNode&&target.parentNode.style.display=="none"){setTimeout((function(){lazySizes.loader.unveil(target)}),0)}}))};var onMutation=function(mutations){var i,len,mutation,target;for(i=0,len=mutations.length;i<len;i++){mutation=mutations[i];target=mutation.target;if(!target.getAttribute(mutation.attributeName)){continue}if(target.localName=="source"&&target.parentNode){target=target.parentNode.querySelector("img")}if(target&&regClassTest.test(target.className)){setClass(target)}}};if(lsCfg.unloadedClass){regClassTest+="|"+lsCfg.unloadedClass}regClassTest+="|"+lsCfg.loadingClass+")(\\s|$)";regClassTest=new RegExp(regClassTest);attributes[lsCfg.srcAttr]=1;attributes[lsCfg.srcsetAttr]=1;if(window2.MutationObserver){observer=new MutationObserver(onMutation);connect=function(){if(!connected){connected=true;observer.observe(docElem,{subtree:true,attributes:true,attributeFilter:Object.keys(attributes)})}};disconnect=function(){if(connected){connected=false;observer.disconnect()}}}else{docElem.addEventListener("DOMAttrModified",function(){var runs;var modifications=[];var callMutations=function(){onMutation(modifications);modifications=[];runs=false};return function(e){if(connected&&attributes[e.attrName]&&e.newValue){modifications.push({target:e.target,attributeName:e.attrName});if(!runs){setTimeout(callMutations);runs=true}}}}(),true);connect=function(){connected=true};disconnect=function(){connected=false}}addEventListener("lazybeforeunveil",disconnect,true);addEventListener("lazybeforeunveil",connect);addEventListener("lazybeforesizes",disconnect,true);addEventListener("lazybeforesizes",connect);connect();removeEventListener("lazybeforeunveil",addObserver)};addEventListener("lazybeforeunveil",addObserver)}))})(ls_attrchange);
+import{r as requireLazysizes}from"./lazysizes-B7xYodB-.js";import{jsx,Fragment,jsxs}from"react/jsx-runtime";import*as React from"react";import React__default,{useEffect,createContext,useContext,useState,useCallback,createElement,forwardRef,useRef,useImperativeHandle,Fragment as Fragment$1,useReducer,useMemo,useLayoutEffect,isValidElement}from"react";import{h as buildAriaProps,i as buildDataProps,j as buildHtmlProps,k as classnames,l as globalProps,m as buildCss,n as globalInlineProps,F as Flex,I as Icon,o as FlexItem,p as Body$1,q as Caption,A as Avatar,r as domSafeProps,s as Title,S as SectionSeparator,t as DialogContext,u as Draggable,v as TextInput,_ as __awaiter,w as __generator,x as __spread,y as PropTypes,z as Card,E as noop$3,H as PbReactPopover,J as CircleIconButton,K as Button,N as HighchartsReact,O as Badge,Q as joinPresent,U as titleize,V as IconCircle,W as Image,X as Checkbox,Y as Radio}from"./_typeahead-CCDoUmRR.js";import{h as PbTable,j as getAllIcons,D as DateTime$1,a as datePickerHelper,u as useDropdown,o as omitBy,k as isEmpty,m as map,p as partial,l as find$1,n as commonjsGlobal,q as getDefaultExportFromCjs,r as highchartsDarkTheme,s as highchartsTheme,t as noop$4,v as colors,i as PbTextarea}from"./lib-CVPInSs5.js";import*as ReactDOM from"react-dom";import ReactDOM__default,{createPortal}from"react-dom";var ls_attrchange={exports:{}};(function(module){(function(window2,factory){if(!window2){return}var globalInstall=function(){factory(window2.lazySizes);window2.removeEventListener("lazyunveilread",globalInstall,true)};factory=factory.bind(null,window2,window2.document);if(module.exports){factory(requireLazysizes())}else if(window2.lazySizes){globalInstall()}else{window2.addEventListener("lazyunveilread",globalInstall,true)}})(typeof window!="undefined"?window:0,(function(window2,document2,lazySizes){var addObserver=function(){var connect,disconnect,observer,connected;var lsCfg=lazySizes.cfg;var attributes={"data-bgset":1,"data-include":1,"data-poster":1,"data-bg":1,"data-script":1};var regClassTest="(\\s|^)("+lsCfg.loadedClass;var docElem=document2.documentElement;var setClass=function(target){lazySizes.rAF((function(){lazySizes.rC(target,lsCfg.loadedClass);if(lsCfg.unloadedClass){lazySizes.rC(target,lsCfg.unloadedClass)}lazySizes.aC(target,lsCfg.lazyClass);if(target.style.display=="none"||target.parentNode&&target.parentNode.style.display=="none"){setTimeout((function(){lazySizes.loader.unveil(target)}),0)}}))};var onMutation=function(mutations){var i,len,mutation,target;for(i=0,len=mutations.length;i<len;i++){mutation=mutations[i];target=mutation.target;if(!target.getAttribute(mutation.attributeName)){continue}if(target.localName=="source"&&target.parentNode){target=target.parentNode.querySelector("img")}if(target&&regClassTest.test(target.className)){setClass(target)}}};if(lsCfg.unloadedClass){regClassTest+="|"+lsCfg.unloadedClass}regClassTest+="|"+lsCfg.loadingClass+")(\\s|$)";regClassTest=new RegExp(regClassTest);attributes[lsCfg.srcAttr]=1;attributes[lsCfg.srcsetAttr]=1;if(window2.MutationObserver){observer=new MutationObserver(onMutation);connect=function(){if(!connected){connected=true;observer.observe(docElem,{subtree:true,attributes:true,attributeFilter:Object.keys(attributes)})}};disconnect=function(){if(connected){connected=false;observer.disconnect()}}}else{docElem.addEventListener("DOMAttrModified",function(){var runs;var modifications=[];var callMutations=function(){onMutation(modifications);modifications=[];runs=false};return function(e){if(connected&&attributes[e.attrName]&&e.newValue){modifications.push({target:e.target,attributeName:e.attrName});if(!runs){setTimeout(callMutations);runs=true}}}}(),true);connect=function(){connected=true};disconnect=function(){connected=false}}addEventListener("lazybeforeunveil",disconnect,true);addEventListener("lazybeforeunveil",connect);addEventListener("lazybeforesizes",disconnect,true);addEventListener("lazybeforesizes",connect);connect();removeEventListener("lazybeforeunveil",addObserver)};addEventListener("lazybeforeunveil",addObserver)}))})(ls_attrchange);
 /**
    * table-core
    *