@genesislcap/foundation-zero 14.488.2 → 14.489.0-canary.FUI-2574-1

package/dist/custom-elements.json

@@ -31599,8 +31599,8 @@
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "disabled",
               "description": "The disabled state of the listbox.",
+              "fieldName": "disabled",
               "inheritedFrom": {
                 "name": "Combobox",
                 "module": "src/combobox/combobox.ts"
@@ -32336,6 +32336,7 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "Enables server-side filtering: typed input refetches from the server with a criteria\ninstead of filtering the already-loaded options client-side.",
               "inheritedFrom": {
                 "name": "Combobox",
                 "module": "src/combobox/combobox.ts"
@@ -32474,6 +32475,20 @@
                 "module": "src/combobox/combobox.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "scrollableListbox",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "privacy": "public",
+              "description": "The scrollable element hosting the dropdown options. Part of the public contract for\nslotted datasources (e.g. options-datasource infinite scroll) to observe scrolling.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "Combobox",
+                "module": "src/combobox/combobox.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "slottedOptionsChanged",
@@ -32502,6 +32517,21 @@
                 "module": "src/combobox/combobox.ts"
               }
             },
+            {
+              "kind": "method",
+              "name": "enableAsyncForInfiniteScrollDatasource",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "When the slotted datasource pages its options (infinite scroll), only a page of the\nresource is loaded client-side, so filtering typed input locally is meaningless.\nSwitch to async mode so input refetches from the server with a criteria instead;\nfurther pages honour that criteria. This overrides an explicit `async=\"false\"` on\nthe combobox — infinite-scroll datasources cannot support client-side filtering.",
+              "inheritedFrom": {
+                "name": "Combobox",
+                "module": "src/combobox/combobox.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "indicator",
@@ -32572,6 +32602,14 @@
                 "name": "Combobox",
                 "module": "src/combobox/combobox.ts"
               }
+            },
+            {
+              "description": "Fired when the dropdown opens or closes. detail: `OpenChangeEventDetail`",
+              "name": "open-change",
+              "inheritedFrom": {
+                "name": "Combobox",
+                "module": "src/combobox/combobox.ts"
+              }
             }
           ]
         },
@@ -35165,6 +35203,20 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "scrollableListbox",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "privacy": "public",
+              "description": "The scrollable element hosting the dropdown options. Part of the public contract for\nslotted datasources (e.g. options-datasource infinite scroll) to observe scrolling.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "Select",
+                "module": "src/select/select.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "openChanged",
@@ -35610,6 +35662,14 @@
             }
           ],
           "events": [
+            {
+              "description": "Fired when the dropdown opens or closes. detail: `OpenChangeEventDetail`",
+              "name": "open-change",
+              "inheritedFrom": {
+                "name": "Select",
+                "module": "src/select/select.ts"
+              }
+            },
             {
               "description": "Fires a custom 'input' event when the value updates",
               "name": "input",

package/dist/dts/react.d.ts

@@ -91,7 +91,7 @@ import type { TreeItem as TreeItemWC } from './tree-item/tree-item';
 import type { TreeView as TreeViewWC } from './tree-view/tree-view';
 import type { UrlInput as UrlInputWC } from './url-input/url-input';
 import type { AddGroupEventDetail, AddRuleEventDetail, DelGroupEventDetail, DelRuleEventDetail, UpdateGroupEventDetail, UpdateRuleEventDetail } from '@genesislcap/expression-builder';
-import type { ClearOptions, FileSelectedEventDetail, FilterChangedEventDetail, FilterClearedEventDetail, MultiselectOption, SelectedOption, StepClickEventDetail, ValidationError, ValidationFailureEventDetail } from '@genesislcap/foundation-ui';
+import type { ClearOptions, FileSelectedEventDetail, FilterChangedEventDetail, FilterClearedEventDetail, MultiselectOption, OpenChangeEventDetail, SelectedOption, StepClickEventDetail, ValidationError, ValidationFailureEventDetail } from '@genesislcap/foundation-ui';
 
 /** @internal Maps a web component class to its public props only.
  * keyof T skips private/protected members, so this avoids the TS error
@@ -285,6 +285,7 @@ export declare const Combobox: React.ForwardRefExoticComponent<
   React.PropsWithChildren<
     Omit<PublicOf<ComboboxWC>, 'children' | 'style'> &
     HTMLWCProps & {
+      onOpenChange?: (event: CustomEvent<OpenChangeEventDetail>) => void;
     }
   > & React.RefAttributes<ComboboxWC>
 >;
@@ -716,6 +717,7 @@ export declare const SearchBarCombobox: React.ForwardRefExoticComponent<
   React.PropsWithChildren<
     Omit<PublicOf<SearchBarComboboxWC>, 'children' | 'style'> &
     HTMLWCProps & {
+      onOpenChange?: (event: CustomEvent<OpenChangeEventDetail>) => void;
     }
   > & React.RefAttributes<SearchBarComboboxWC>
 >;
@@ -766,6 +768,7 @@ export declare const Select: React.ForwardRefExoticComponent<
   React.PropsWithChildren<
     Omit<PublicOf<SelectWC>, 'children' | 'style'> &
     HTMLWCProps & {
+      onOpenChange?: (event: CustomEvent<OpenChangeEventDetail>) => void;
     }
   > & React.RefAttributes<SelectWC>
 >;

package/dist/react.cjs

@@ -246,8 +246,20 @@ const Checkbox = React.forwardRef(function Checkbox(props, ref) {
 });
 
 const Combobox = React.forwardRef(function Combobox(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(ComboboxWC) ?? '%%prefix%%-combobox', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(ComboboxWC) ?? '%%prefix%%-combobox', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 const ConnectionIndicator = React.forwardRef(function ConnectionIndicator(props, ref) {
@@ -732,8 +744,20 @@ const SchedulerTimezone = React.forwardRef(function SchedulerTimezone(props, ref
 });
 
 const SearchBarCombobox = React.forwardRef(function SearchBarCombobox(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(SearchBarComboboxWC) ?? '%%prefix%%-search-bar-combobox', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(SearchBarComboboxWC) ?? '%%prefix%%-search-bar-combobox', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 const SearchBar = React.forwardRef(function SearchBar(props, ref) {
@@ -796,8 +820,20 @@ const SegmentedItem = React.forwardRef(function SegmentedItem(props, ref) {
 });
 
 const Select = React.forwardRef(function Select(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(SelectWC) ?? '%%prefix%%-select', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(SelectWC) ?? '%%prefix%%-select', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 const Skeleton = React.forwardRef(function Skeleton(props, ref) {

package/dist/react.mjs

@@ -244,8 +244,20 @@ export const Checkbox = React.forwardRef(function Checkbox(props, ref) {
 });
 
 export const Combobox = React.forwardRef(function Combobox(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(ComboboxWC) ?? '%%prefix%%-combobox', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(ComboboxWC) ?? '%%prefix%%-combobox', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 export const ConnectionIndicator = React.forwardRef(function ConnectionIndicator(props, ref) {
@@ -730,8 +742,20 @@ export const SchedulerTimezone = React.forwardRef(function SchedulerTimezone(pro
 });
 
 export const SearchBarCombobox = React.forwardRef(function SearchBarCombobox(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(SearchBarComboboxWC) ?? '%%prefix%%-search-bar-combobox', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(SearchBarComboboxWC) ?? '%%prefix%%-search-bar-combobox', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 export const SearchBar = React.forwardRef(function SearchBar(props, ref) {
@@ -794,8 +818,20 @@ export const SegmentedItem = React.forwardRef(function SegmentedItem(props, ref)
 });
 
 export const Select = React.forwardRef(function Select(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(SelectWC) ?? '%%prefix%%-select', { ...rest, ref }, children);
+  const { onOpenChange, children, ...rest } = props;
+  const _innerRef = React.useRef(null);
+  const _onOpenChangeRef = React.useRef(onOpenChange);
+  _onOpenChangeRef.current = onOpenChange;
+  React.useLayoutEffect(() => {
+    const el = _innerRef.current;
+    if (!el) return;
+    const _onOpenChangeFn = (e) => _onOpenChangeRef.current?.(e);
+    el.addEventListener('open-change', _onOpenChangeFn);
+    return () => {
+      el.removeEventListener('open-change', _onOpenChangeFn);
+    };
+  }, []);
+  return React.createElement(customElements.getName(SelectWC) ?? '%%prefix%%-select', { ...rest, ref: _mergeRefs(_innerRef, ref) }, children);
 });
 
 export const Skeleton = React.forwardRef(function Skeleton(props, ref) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-zero",
   "description": "Genesis Foundation Zero Design System",
-  "version": "14.488.2",
+  "version": "14.489.0-canary.FUI-2574-1",
   "sideEffects": false,
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
@@ -73,18 +73,18 @@
   },
   "devDependencies": {
     "@genesiscommunitysuccess/analyzer-import-alias-plugin": "^5.0.3",
-    "@genesislcap/genx": "14.488.2",
-    "@genesislcap/rollup-builder": "14.488.2",
-    "@genesislcap/ts-builder": "14.488.2",
-    "@genesislcap/uvu-playwright-builder": "14.488.2",
-    "@genesislcap/vite-builder": "14.488.2",
-    "@genesislcap/webpack-builder": "14.488.2"
+    "@genesislcap/genx": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/rollup-builder": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/ts-builder": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/uvu-playwright-builder": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/vite-builder": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/webpack-builder": "14.489.0-canary.FUI-2574-1"
   },
   "dependencies": {
-    "@genesislcap/foundation-comms": "14.488.2",
-    "@genesislcap/foundation-logger": "14.488.2",
-    "@genesislcap/foundation-ui": "14.488.2",
-    "@genesislcap/foundation-utils": "14.488.2",
+    "@genesislcap/foundation-comms": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/foundation-logger": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/foundation-ui": "14.489.0-canary.FUI-2574-1",
+    "@genesislcap/foundation-utils": "14.489.0-canary.FUI-2574-1",
     "@microsoft/fast-colors": "5.3.1",
     "@microsoft/fast-components": "2.30.6",
     "@microsoft/fast-element": "1.14.0",
@@ -111,5 +111,5 @@
       "require": "./dist/react.cjs"
     }
   },
-  "gitHead": "babd82759de2896aaec4b630259c716b59afb1b3"
+  "gitHead": "6dbab0f331e0fa7a280534d5cf111f09138c31e4"
 }