@genesislcap/grid-pro 15.25.0 → 15.26.0

package/dist/custom-elements.json

@@ -129,6 +129,17 @@
               "default": "false",
               "description": "If true, will enable row flashing for all rows for `add` async transactions"
             },
+            {
+              "kind": "field",
+              "name": "columnDragBridge",
+              "type": {
+                "text": "GridProColumnDragBridge"
+              },
+              "privacy": "private",
+              "readonly": true,
+              "default": "{}",
+              "description": "Wired to `gridOptions.context` for columns picker → grid drag (see bridge module)."
+            },
             {
               "kind": "field",
               "name": "persistColumnStateKey",
@@ -263,6 +274,20 @@
               "default": "false",
               "description": "Enables or disables the grid status bar."
             },
+            {
+              "kind": "field",
+              "name": "enableColumnSelection",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Shows a Column Selection button above the grid.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "enableColumnSelectionChanged"
+            },
             {
               "kind": "field",
               "name": "customErrorHandlerTemplate",
@@ -552,6 +577,16 @@
               "readonly": true,
               "default": "{\n    handleChange: (record: any) => this.handleLuminanceChange(record),\n  }"
             },
+            {
+              "kind": "method",
+              "name": "syncColumnSelectionHostLayout",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
             {
               "kind": "method",
               "name": "performDisconnectCleanup",
@@ -1248,6 +1283,15 @@
               "default": "false",
               "description": "Enables or disables the grid status bar.",
               "fieldName": "withStatusBar"
+            },
+            {
+              "name": "enable-column-selection",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Shows a Column Selection button above the grid.",
+              "fieldName": "enableColumnSelection"
             }
           ],
           "mixins": [
@@ -1493,7 +1537,7 @@
           "type": {
             "text": "ElementStyles"
           },
-          "default": "css`\n  ${agExternalStockStyles}\n  ${errorHandlerDialogStyles}\n  ${agDragGhostShadowDomStyles}\n  ${rowMatchAlertStyles}\n  :host {\n    --datasource-error-background-color: var(--neutral-layer-4);\n    --datasource-error-background-opacity: 0.5;\n    --datasource-error-dialog-max-width: 50%;\n    --datasource-error-dialog-min-width: auto;\n    --ag-status-bar-height: 32.5px;\n\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  :host([ds-disconnected]) {\n    display: block;\n  }\n\n  :host([ds-disconnected])::part(grid) {\n    cursor: not-allowed;\n    opacity: 40%;\n    pointer-events: none;\n  }\n\n  .ag-side-bar,\n  .ag-menu {\n    --ag-subheader-background-color: var(--ag-background-color);\n    --ag-control-panel-background-color: var(--ag-background-color);\n  }\n\n  .ag-cell-inline-editing {\n    height: inherit !important;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .error {\n    border-color: var(--error-color) !important;\n  }\n\n  .ag-status-bar {\n    height: var(--ag-status-bar-height);\n  }\n\n  .ag-status-name-value {\n    padding-top: var(--ag-grid-size);\n    padding-bottom: var(--ag-grid-size);\n  }\n\n  /* Custom styling for the unsort icon (sortNone) - only for sortable columns */\n  .ag-header-cell.ag-header-cell-sortable .ag-icon-none {\n    opacity: 100%;\n    color: var(--rapid-ag-header-foreground-color, var(--ag-foreground-color, #fff));\n    font-size: calc(var(--ag-icon-size, 12px) * 1.2);\n    font-weight: bold;\n  }\n\n  .ag-header-cell.ag-header-cell-sortable:hover .ag-icon-none {\n    opacity: 100%;\n    color: var(--rapid-ag-header-foreground-color, var(--ag-foreground-color, #fff));\n    transform: scale(1.1);\n    transition: transform 0.2s ease;\n  }\n`",
+          "default": "css`\n  ${agExternalStockStyles}\n  ${errorHandlerDialogStyles}\n  ${agDragGhostShadowDomStyles}\n  ${gridProColumnSelectionHostStyles}\n  ${rowMatchAlertStyles}\n  :host {\n    --datasource-error-background-color: var(--neutral-layer-4);\n    --datasource-error-background-opacity: 0.5;\n    --datasource-error-dialog-max-width: 50%;\n    --datasource-error-dialog-min-width: auto;\n    --ag-status-bar-height: 32.5px;\n\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  :host([ds-disconnected]) {\n    display: block;\n  }\n\n  :host([ds-disconnected])::part(grid) {\n    cursor: not-allowed;\n    opacity: 40%;\n    pointer-events: none;\n  }\n\n  .ag-side-bar,\n  .ag-menu {\n    --ag-subheader-background-color: var(--ag-background-color);\n    --ag-control-panel-background-color: var(--ag-background-color);\n  }\n\n  .ag-cell-inline-editing {\n    height: inherit !important;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .error {\n    border-color: var(--error-color) !important;\n  }\n\n  .ag-status-bar {\n    height: var(--ag-status-bar-height);\n  }\n\n  .ag-status-name-value {\n    padding-top: var(--ag-grid-size);\n    padding-bottom: var(--ag-grid-size);\n  }\n\n  /* Custom styling for the unsort icon (sortNone) - only for sortable columns */\n  .ag-header-cell.ag-header-cell-sortable .ag-icon-none {\n    opacity: 100%;\n    color: var(--rapid-ag-header-foreground-color, var(--ag-foreground-color, #fff));\n    font-size: calc(var(--ag-icon-size, 12px) * 1.2);\n    font-weight: bold;\n  }\n\n  .ag-header-cell.ag-header-cell-sortable:hover .ag-icon-none {\n    opacity: 100%;\n    color: var(--rapid-ag-header-foreground-color, var(--ag-foreground-color, #fff));\n    transform: scale(1.1);\n    transition: transform 0.2s ease;\n  }\n`",
           "description": "The Grid Pro styles.",
           "privacy": "public"
         }
@@ -3385,6 +3429,14 @@
             "package": "./column"
           }
         },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-selection"
+          }
+        },
         {
           "kind": "js",
           "name": "*",
@@ -8907,6 +8959,1334 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/column-picker-ag-drag.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "bindAgColumnPickerDrag",
+          "return": {
+            "type": {
+              "text": "ColumnPickerAgDragBinding | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "bridge",
+              "type": {
+                "text": "GridProColumnDragBridge"
+              }
+            },
+            {
+              "name": "api",
+              "type": {
+                "text": "GridApi"
+              }
+            },
+            {
+              "name": "handle",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "colId",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "dragItemName",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Registers an AG Grid `ToolPanel` drag source on a picker row handle so drops on\nthe grid header use AG column-move (visibility + exact index).",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "bindAgColumnPickerDrag",
+          "declaration": {
+            "name": "bindAgColumnPickerDrag",
+            "module": "src/column-selection/column-picker-ag-drag.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/column-picker.utils.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "COLUMN_PICKER_SORT_DEFAULT",
+          "type": {
+            "text": "ColumnPickerSort"
+          },
+          "default": "'selected-first'",
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "resolveColumnPickerSort",
+          "return": {
+            "type": {
+              "text": "ColumnPickerSort"
+            }
+          },
+          "parameters": [
+            {
+              "name": "sort",
+              "optional": true,
+              "type": {
+                "text": "ColumnPickerSort | null"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "toPickerItem",
+          "return": {
+            "type": {
+              "text": "ColumnPickerItem | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "col",
+              "type": {
+                "text": "Column"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "getPickerItems",
+          "return": {
+            "type": {
+              "text": "ColumnPickerItem[]"
+            }
+          },
+          "parameters": [
+            {
+              "name": "columns",
+              "type": {
+                "text": "Column[]"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "orderColumnsForPicker",
+          "return": {
+            "type": {
+              "text": "Column[]"
+            }
+          },
+          "parameters": [
+            {
+              "name": "displayed",
+              "type": {
+                "text": "Column[]"
+              }
+            },
+            {
+              "name": "all",
+              "type": {
+                "text": "Column[]"
+              }
+            },
+            {
+              "name": "sort",
+              "default": "COLUMN_PICKER_SORT_DEFAULT",
+              "type": {
+                "text": "ColumnPickerSort"
+              }
+            },
+            {
+              "name": "columnState",
+              "optional": true,
+              "type": {
+                "text": "ReadonlyArray<{ colId?: string | null }>"
+              }
+            }
+          ],
+          "description": "Column order for the picker list.\n\n- `selected-first` (default): displayed columns first, then non-displayed.\n- `ag-grid`: column-state order (visible/hidden interleaved).",
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "partitionPickerItems",
+          "return": {
+            "type": {
+              "text": "{ selected: ColumnPickerItem[]; unselected: ColumnPickerItem[] }"
+            }
+          },
+          "parameters": [
+            {
+              "name": "items",
+              "type": {
+                "text": "ColumnPickerItem[]"
+              }
+            },
+            {
+              "name": "search",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "sort",
+              "default": "COLUMN_PICKER_SORT_DEFAULT",
+              "type": {
+                "text": "ColumnPickerSort"
+              }
+            }
+          ],
+          "description": "Splits / filters picker items for the template sections.",
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "reorderVisibleIds",
+          "return": {
+            "type": {
+              "text": "string[] | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "allVisibleIds",
+              "type": {
+                "text": "string[]"
+              }
+            },
+            {
+              "name": "shownIds",
+              "type": {
+                "text": "string[]"
+              }
+            },
+            {
+              "name": "fromId",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "toId",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "applyVisibleOrder",
+          "return": {
+            "type": {
+              "text": "T[]"
+            }
+          },
+          "parameters": [
+            {
+              "name": "columnState",
+              "type": {
+                "text": "T[]"
+              }
+            },
+            {
+              "name": "visibleOrder",
+              "type": {
+                "text": "string[]"
+              }
+            }
+          ],
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "COLUMN_PICKER_SORT_DEFAULT",
+          "declaration": {
+            "name": "COLUMN_PICKER_SORT_DEFAULT",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "resolveColumnPickerSort",
+          "declaration": {
+            "name": "resolveColumnPickerSort",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "toPickerItem",
+          "declaration": {
+            "name": "toPickerItem",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getPickerItems",
+          "declaration": {
+            "name": "getPickerItems",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "orderColumnsForPicker",
+          "declaration": {
+            "name": "orderColumnsForPicker",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "partitionPickerItems",
+          "declaration": {
+            "name": "partitionPickerItems",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "reorderVisibleIds",
+          "declaration": {
+            "name": "reorderVisibleIds",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "applyVisibleOrder",
+          "declaration": {
+            "name": "applyVisibleOrder",
+            "module": "src/column-selection/column-picker.utils.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/column-selection.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "columnSelectionStyles",
+          "default": "css`\n  :host {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .column-selection {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  .column-selection-button[data-state='hover'] {\n    background: var(--neutral-fill-hover);\n  }\n\n  .column-selection-panel,\n  .column-selection-panel *,\n  .column-selection-panel *::before,\n  .column-selection-panel *::after {\n    box-sizing: border-box;\n  }\n\n  .column-selection-panel {\n    inset: unset;\n    margin: 0;\n    box-sizing: border-box;\n    width: 280px;\n    max-width: min(280px, 90vw);\n    max-height: 80dvh;\n    overflow-y: auto;\n    border: 1px solid var(--neutral-stroke-divider-rest, var(--neutral-stroke-rest));\n    border-radius: calc(var(--control-corner-radius, 4) * 1px);\n    background: var(--neutral-layer-floating, var(--neutral-layer-2, #fff));\n    box-shadow: 0 8px 24px rgb(0 0 0 / 18%);\n    padding: 0;\n\n    position-area: block-end span-inline-start;\n    position-try-fallbacks: flip-block, flip-inline;\n    margin-block-start: calc(var(--design-unit, 4) * 1px);\n\n    min-width: 200px;\n    color: var(--ag-foreground-color, var(--neutral-foreground-rest));\n    font-family: var(--ag-font-family, var(--body-font));\n    font-size: var(--ag-data-font-size, var(--type-ramp-minus-1-font-size));\n  }\n\n  .column-selection-panel:popover-open {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .grid-pro-columns-toolbar {\n    display: flex;\n    align-items: center;\n    gap: calc(var(--design-unit) * 2px);\n    flex: none;\n    width: 100%;\n    height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);\n    min-height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);\n    margin: 0;\n    padding: 0 calc(var(--design-unit) * 2px);\n    border-bottom: var(--ag-borders-secondary, 1px solid)\n      var(--ag-secondary-border-color, var(--ag-border-color, var(--neutral-stroke-divider-rest)));\n  }\n\n  .grid-pro-columns-toolbar .grid-pro-columns-search {\n    flex: 1 1 auto;\n    min-width: 0;\n    width: auto;\n    display: block;\n\n    --design-unit: 3;\n  }\n\n  .grid-pro-columns-toolbar > .grid-pro-columns-search {\n    flex: 1 1 auto !important;\n    height: auto !important;\n    min-height: 0 !important;\n  }\n\n  .grid-pro-columns-select-all {\n    flex: 0 0 auto;\n    margin: 0;\n\n    --design-unit: 3;\n  }\n\n  .grid-pro-columns-select-all.indeterminate::part(control),\n  .grid-pro-columns-select-all[aria-checked='mixed']::part(control) {\n    background: var(--neutral-fill-strong-rest, var(--neutral-stroke-rest, #9aa0a6));\n    border-color: var(--neutral-fill-strong-rest, var(--neutral-stroke-rest, #9aa0a6));\n  }\n\n  .grid-pro-columns-select-all.indeterminate:not([disabled]):hover::part(control),\n  .grid-pro-columns-select-all[aria-checked='mixed']:not([disabled]):hover::part(control) {\n    background: var(--neutral-fill-strong-hover, var(--neutral-stroke-hover, #7d848c));\n    border-color: var(--neutral-fill-strong-hover, var(--neutral-stroke-hover, #7d848c));\n  }\n\n  .grid-pro-columns-select-all.indeterminate::part(checked-indicator),\n  .grid-pro-columns-select-all[aria-checked='mixed']::part(checked-indicator) {\n    opacity: 0%;\n  }\n\n  .grid-pro-columns-select-all.indeterminate::part(indeterminate-indicator),\n  .grid-pro-columns-select-all[aria-checked='mixed']::part(indeterminate-indicator) {\n    width: 10px;\n    height: 2px;\n    border-radius: 1px;\n    background: var(--neutral-fill-input-rest, #fff);\n    opacity: 100%;\n  }\n\n  .grid-pro-columns-select-all.indeterminate:not([disabled]):hover::part(indeterminate-indicator),\n  .grid-pro-columns-select-all[aria-checked='mixed']:not([disabled]):hover::part(\n      indeterminate-indicator\n    ) {\n    background: var(--neutral-fill-input-rest, #fff);\n  }\n\n  .grid-pro-columns-list {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    flex: 1 1 0;\n    min-height: 250px;\n    max-height: 400px;\n    padding: 8px;\n  }\n\n  .grid-pro-columns-section {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    flex: 0 0 auto;\n  }\n\n  .grid-pro-columns-item {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 2px 0;\n    border-radius: 4px;\n    cursor: default;\n    user-select: none;\n  }\n\n  .grid-pro-columns-item.dragging {\n    opacity: 50%;\n  }\n\n  .grid-pro-columns-item.drag-over {\n    background: var(--ag-row-hover-color, var(--neutral-fill-hover));\n  }\n\n  .grid-pro-columns-handle {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-width: 20px;\n    min-height: 24px;\n    margin: -4px 0;\n    padding: 4px 6px;\n    box-sizing: border-box;\n    opacity: 45%;\n    letter-spacing: -1px;\n    font-size: 12px;\n    line-height: 1;\n    touch-action: none;\n  }\n\n  .grid-pro-columns-handle[draggable='true'],\n  .grid-pro-columns-handle.grid-pro-columns-handle-grid-drag,\n  .grid-pro-columns-handle.grid-pro-columns-handle-panel-drag {\n    cursor: grab;\n    opacity: 65%;\n  }\n\n  .grid-pro-columns-handle[draggable='true']:active,\n  .grid-pro-columns-handle.grid-pro-columns-handle-grid-drag:active,\n  .grid-pro-columns-handle.grid-pro-columns-handle-panel-drag:active {\n    cursor: grabbing;\n  }\n\n  .grid-pro-columns-checkbox {\n    flex: 0 0 auto;\n    margin: 0;\n\n    --design-unit: 3;\n  }\n\n  .grid-pro-columns-checkbox[aria-checked='true']:not([disabled]):hover::part(checked-indicator) {\n    fill: var(--foreground-on-accent-hover);\n  }\n\n  .grid-pro-columns-label {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n`",
+          "description": "Styles for ColumnSelection.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "gridProColumnSelectionHostStyles",
+          "default": "css`\n  :host(.has-column-selection) {\n    display: flex;\n    flex-direction: column;\n    min-height: 0;\n  }\n\n  :host(.has-column-selection) [part='grid'] {\n    flex: 1 1 auto;\n    min-height: 0;\n  }\n\n  .grid-pro-column-selection-toolbar {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    gap: calc(var(--design-unit, 4) * 2px);\n    width: 100%;\n    box-sizing: border-box;\n    flex-shrink: 0;\n    padding: calc(var(--design-unit, 4) * 2px);\n    border-bottom: 1px solid var(--neutral-stroke-divider-rest, var(--neutral-stroke-rest));\n    background: var(--neutral-layer-1, transparent);\n  }\n`",
+          "description": "Host layout when the Grid Pro column-selection toolbar is shown.",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "columnSelectionStyles",
+          "declaration": {
+            "name": "columnSelectionStyles",
+            "module": "src/column-selection/column-selection.styles.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "gridProColumnSelectionHostStyles",
+          "declaration": {
+            "name": "gridProColumnSelectionHostStyles",
+            "module": "src/column-selection/column-selection.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/column-selection.template.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "getColumnSelectionTemplate",
+          "parameters": [
+            {
+              "name": "prefix",
+              "default": "'foundation'",
+              "description": "Design-system prefix for button/icon/checkbox/text-field."
+            }
+          ],
+          "description": "Column Selection button + popover with embedded picker UI.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "columnSelectionTemplate",
+          "description": "Default column selection template (`foundation-*` components).",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "getColumnSelectionTemplate",
+          "declaration": {
+            "name": "getColumnSelectionTemplate",
+            "module": "src/column-selection/column-selection.template.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "columnSelectionTemplate",
+          "declaration": {
+            "name": "columnSelectionTemplate",
+            "module": "src/column-selection/column-selection.template.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/column-selection.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Button + popover column picker for Grid Pro (Community).",
+          "name": "ColumnSelection",
+          "members": [
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Column Selection'",
+              "description": "Button label."
+            },
+            {
+              "kind": "field",
+              "name": "sort",
+              "type": {
+                "text": "ColumnPickerSort"
+              },
+              "default": "COLUMN_PICKER_SORT_DEFAULT",
+              "description": "Column list ordering.\n- `selected-first` (default): visible first (grid display order), then hidden A–Z.\n- `ag-grid`: `api.getColumnState()` order (visible/hidden interleaved)."
+            },
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the popover is open."
+            },
+            {
+              "kind": "field",
+              "name": "gridApi",
+              "type": {
+                "text": "GridApi | null"
+              },
+              "default": "null",
+              "description": "Optional explicit AG grid API (v36)."
+            },
+            {
+              "kind": "field",
+              "name": "gridHost",
+              "type": {
+                "text": "ColumnSelectionHost | null"
+              },
+              "default": "null",
+              "description": "Grid Pro host element; column API is bridged when needed."
+            },
+            {
+              "kind": "field",
+              "name": "search",
+              "type": {
+                "text": "string"
+              },
+              "default": "''"
+            },
+            {
+              "kind": "field",
+              "name": "selectedItems",
+              "type": {
+                "text": "ColumnPickerItem[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "unselectedItems",
+              "type": {
+                "text": "ColumnPickerItem[]"
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "selectAllChecked",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Master checkbox checked when every toggleable column is visible."
+            },
+            {
+              "kind": "field",
+              "name": "selectAllIndeterminate",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Master checkbox mixed when some (but not all) toggleable columns are visible."
+            },
+            {
+              "kind": "field",
+              "name": "resolvedSort",
+              "type": {
+                "text": "ColumnPickerSort"
+              },
+              "privacy": "private",
+              "default": "COLUMN_PICKER_SORT_DEFAULT",
+              "description": "Resolved sort; kept in sync with `@attr sort`."
+            },
+            {
+              "kind": "field",
+              "name": "dragColId",
+              "type": {
+                "text": "string | null"
+              },
+              "privacy": "private",
+              "default": "null",
+              "description": "Source colId while a visible-row drag is in progress."
+            },
+            {
+              "kind": "field",
+              "name": "dragOverElement",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "privacy": "private",
+              "default": "null",
+              "description": "Row currently showing drag-over highlight (avoid observable updates mid-drag)."
+            },
+            {
+              "kind": "field",
+              "name": "dragBindingAbort",
+              "type": {
+                "text": "AbortController | null"
+              },
+              "privacy": "private",
+              "default": "null",
+              "description": "Cancels row drag listeners when the selected list re-renders."
+            },
+            {
+              "kind": "field",
+              "name": "agDragBindings",
+              "type": {
+                "text": "ColumnPickerAgDragBinding[]"
+              },
+              "privacy": "private",
+              "default": "[]",
+              "description": "AG ToolPanel drag sources registered on hidden-row handles (grid drop)."
+            },
+            {
+              "kind": "field",
+              "name": "columnDragBridge",
+              "type": {
+                "text": "GridProColumnDragBridge | null"
+              },
+              "privacy": "private",
+              "default": "null",
+              "description": "Shared DnD bridge from Grid Pro."
+            },
+            {
+              "kind": "field",
+              "name": "dragBridgeRetryId",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "0",
+              "description": "Retries `bindRowDrag` until the DnD bridge is populated."
+            },
+            {
+              "kind": "field",
+              "name": "pendingVisibility",
+              "privacy": "private",
+              "default": "new Map<string, boolean>()",
+              "description": "Optimistic visibility while the grid applies setColumnsVisible."
+            },
+            {
+              "kind": "field",
+              "name": "boundRefresh",
+              "privacy": "private",
+              "readonly": true,
+              "description": "Stable listener refs so close/disconnect can remove the same functions."
+            },
+            {
+              "kind": "field",
+              "name": "pickerApi",
+              "type": {
+                "text": "GridApi | null"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "pickerRoot",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "privacy": "private",
+              "description": "Query root for picker DOM (shadow panel).",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "canDrag",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Drag reorder / grid drop disabled while search filter is active.",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "canDragToGrid",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "item",
+                  "type": {
+                    "text": "ColumnPickerItem"
+                  }
+                }
+              ],
+              "description": "Handle is draggable onto the grid (hidden columns, or all when using ag-grid sort)."
+            },
+            {
+              "kind": "field",
+              "name": "toggleableItems",
+              "type": {
+                "text": "ColumnPickerItem[]"
+              },
+              "privacy": "private",
+              "description": "Columns in the current (search-filtered) picker lists that can be toggled.",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "openChanged",
+              "parameters": [
+                {
+                  "name": "oldValue",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "sortChanged"
+            },
+            {
+              "kind": "method",
+              "name": "gridApiChanged"
+            },
+            {
+              "kind": "method",
+              "name": "gridHostChanged"
+            },
+            {
+              "kind": "method",
+              "name": "panelElChanged"
+            },
+            {
+              "kind": "method",
+              "name": "toggle",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Opens or closes the popover.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "close",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Closes the popover.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "refresh",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Rebuilds picker lists from current grid column state."
+            },
+            {
+              "kind": "field",
+              "name": "handleClickOutside",
+              "privacy": "private",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "showPanel",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "hidePanel",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "subscribePicker",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "resubscribePicker",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "unsubscribePicker",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "syncSelectAllState",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "applyPendingVisibility",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "ColumnPickerItem[]"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "ColumnPickerItem[]"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "resolveDragBridge",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "GridProColumnDragBridge | null"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "bindRowDrag",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Visible rows: HTML5 reorder inside the picker.\nHidden rows (or all rows when `sort=ag-grid`): AG ToolPanel drag onto the grid header."
+            },
+            {
+              "kind": "method",
+              "name": "scheduleDragBridgeRetry",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "attempt",
+                  "default": "0"
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "clearDragOverHighlight",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "reorderSelected",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "fromId",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "toId",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Applies a new visible-column order via `applyColumnState({ applyOrder: true })`.\nHidden columns keep their relative positions; only the visible slice is permuted."
+            },
+            {
+              "kind": "method",
+              "name": "cloneNode",
+              "return": {
+                "type": {
+                  "text": "Node"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "deep",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "LifecycleMixin",
+                "module": "src/mixins/lifecycle/lifecycle.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "deepClone",
+              "return": {
+                "type": {
+                  "text": "Node"
+                }
+              },
+              "inheritedFrom": {
+                "name": "LifecycleMixin",
+                "module": "src/mixins/lifecycle/lifecycle.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "shouldRunDisconnect",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "LifecycleMixin",
+                "module": "src/mixins/lifecycle/lifecycle.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "shouldRunConnect",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "LifecycleMixin",
+                "module": "src/mixins/lifecycle/lifecycle.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#_blockLifecycleDueToTokenChange",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "lifecycleType",
+                  "type": {
+                    "text": "Lifecycletype"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "LifecycleMixin",
+                "module": "src/mixins/lifecycle/lifecycle.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "_presentation",
+              "type": {
+                "text": "ComponentPresentation | null | undefined"
+              },
+              "privacy": "private",
+              "default": "void 0",
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "$presentation",
+              "type": {
+                "text": "ComponentPresentation | null"
+              },
+              "privacy": "public",
+              "description": "A property which resolves the ComponentPresentation instance\nfor the current component.",
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "template",
+              "type": {
+                "text": "ElementViewTemplate | void | null"
+              },
+              "privacy": "public",
+              "description": "Sets the template of the element instance. When undefined,\nthe element will attempt to resolve the template from\nthe associated presentation or custom element definition.",
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "templateChanged",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "styles",
+              "type": {
+                "text": "ElementStyles | void | null"
+              },
+              "privacy": "public",
+              "description": "Sets the default styles for the element instance. When undefined,\nthe element will attempt to resolve default styles from\nthe associated presentation or custom element definition.",
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "stylesChanged",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "compose",
+              "privacy": "public",
+              "static": true,
+              "return": {
+                "type": {
+                  "text": "(\n        overrideDefinition?: OverrideFoundationElementDefinition<T>\n    ) => FoundationElementRegistry<T, K>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "this",
+                  "type": {
+                    "text": "K"
+                  }
+                },
+                {
+                  "name": "elementDefinition",
+                  "type": {
+                    "text": "T"
+                  },
+                  "description": "The definition of the element to create the registry\nfunction for."
+                }
+              ],
+              "description": "Defines an element registry function with a set of element definition defaults.",
+              "inheritedFrom": {
+                "name": "FoundationElement",
+                "module": "src/foundation-element/foundation-element.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Column Selection'",
+              "description": "Button label.",
+              "fieldName": "label"
+            },
+            {
+              "name": "sort",
+              "type": {
+                "text": "ColumnPickerSort"
+              },
+              "default": "COLUMN_PICKER_SORT_DEFAULT",
+              "description": "Column list ordering.\n- `selected-first` (default): visible first (grid display order), then hidden A–Z.\n- `ag-grid`: `api.getColumnState()` order (visible/hidden interleaved).",
+              "resolveInitializer": {
+                "module": "/src/column-selection/column-picker.utils"
+              },
+              "fieldName": "sort"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "LifecycleMixin",
+              "package": "@genesislcap/foundation-utils"
+            }
+          ],
+          "superclass": {
+            "name": "FoundationElement",
+            "package": "@microsoft/fast-foundation"
+          },
+          "tagName": "%%prefix%%-column-selection",
+          "customElement": true
+        },
+        {
+          "kind": "variable",
+          "name": "foundationColumnSelection",
+          "description": "Foundation Column Selection registration.",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "ColumnSelection",
+          "declaration": {
+            "name": "ColumnSelection",
+            "module": "src/column-selection/column-selection.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "foundationColumnSelection",
+          "declaration": {
+            "name": "foundationColumnSelection",
+            "module": "src/column-selection/column-selection.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/grid-pro-column-drag-bridge.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "GRID_PRO_COLUMN_DRAG_BRIDGE_CONTEXT_KEY",
+          "type": {
+            "text": "'gridProColumnDragBridge'"
+          },
+          "default": "'gridProColumnDragBridge'",
+          "description": "Context key on `gridOptions.context` for AG column drag integration.",
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "resolveColumnDragBridge",
+          "return": {
+            "type": {
+              "text": "GridProColumnDragBridge | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "context",
+              "type": {
+                "text": "unknown"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "resolveColumnDragBridgeDirect",
+          "return": {
+            "type": {
+              "text": "GridProColumnDragBridge | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "bridge",
+              "optional": true,
+              "type": {
+                "text": "GridProColumnDragBridge | null"
+              }
+            }
+          ],
+          "privacy": "public"
+        },
+        {
+          "kind": "function",
+          "name": "resolveColumnDragBridgeFromApi",
+          "return": {
+            "type": {
+              "text": "GridProColumnDragBridge | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "api",
+              "type": {
+                "text": "{ getGridOption?: (key: string) => unknown } | null | undefined"
+              }
+            }
+          ],
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "GRID_PRO_COLUMN_DRAG_BRIDGE_CONTEXT_KEY",
+          "declaration": {
+            "name": "GRID_PRO_COLUMN_DRAG_BRIDGE_CONTEXT_KEY",
+            "module": "src/column-selection/grid-pro-column-drag-bridge.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "resolveColumnDragBridge",
+          "declaration": {
+            "name": "resolveColumnDragBridge",
+            "module": "src/column-selection/grid-pro-column-drag-bridge.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "resolveColumnDragBridgeDirect",
+          "declaration": {
+            "name": "resolveColumnDragBridgeDirect",
+            "module": "src/column-selection/grid-pro-column-drag-bridge.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "resolveColumnDragBridgeFromApi",
+          "declaration": {
+            "name": "resolveColumnDragBridgeFromApi",
+            "module": "src/column-selection/grid-pro-column-drag-bridge.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-selection"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-selection.styles"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-selection.template"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./resolve-columns-picker-api"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-picker.utils"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./grid-pro-column-drag-bridge"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./column-picker-ag-drag"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/column-selection/resolve-columns-picker-api.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "resolveColumnsPickerApi",
+          "return": {
+            "type": {
+              "text": "GridApi | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "gridHost",
+              "optional": true,
+              "type": {
+                "text": "ColumnSelectionHost | null"
+              }
+            },
+            {
+              "name": "gridApi",
+              "optional": true,
+              "type": {
+                "text": "GridApi | null"
+              }
+            }
+          ],
+          "description": "Resolves an AG `gridApi` suitable for ColumnSelection.\nClassic Grid Pro (v29) exposes column helpers on `columnApi` — bridge when needed.",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "resolveColumnsPickerApi",
+          "declaration": {
+            "name": "resolveColumnsPickerApi",
+            "module": "src/column-selection/resolve-columns-picker-api.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/datasource/base.datasource.ts",