@osdk/react-components 0.2.0-beta.21 → 0.2.0-beta.22

package/build/esm/filter-list/base/FilterIcons.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterIcons.js","names":["ChevronDown","Cross","DoubleChevronLeft","DoubleChevronRight","More","Search","Tick","Undo","React","IncludeIcon","createElement","width","height","viewBox","fill","stroke","strokeWidth","d","strokeLinecap","ExcludeIcon","RemoveIcon","color","size","SearchIcon","OverflowMenuIcon","ChevronDownIcon","CollapseIcon","ExpandIcon","ResetIcon","CheckIcon"],"sources":["FilterIcons.tsx"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ChevronDown,\n  Cross,\n  DoubleChevronLeft,\n  DoubleChevronRight,\n  More,\n  Search,\n  Tick,\n  Undo,\n} from \"@blueprintjs/icons\";\nimport React from \"react\";\n\nexport function IncludeIcon(): React.ReactElement {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 16 16\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M2 3h12M5 8h6M7 13h2\" strokeLinecap=\"round\" />\n    </svg>\n  );\n}\n\nexport function ExcludeIcon(): React.ReactElement {\n  return (\n    <svg\n      width=\"14\"\n      height=\"14\"\n      viewBox=\"0 0 16 16\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"M2 3h12M5 8h6M7 13h2\" strokeLinecap=\"round\" />\n      <path d=\"M3 14L13 2\" strokeLinecap=\"round\" />\n    </svg>\n  );\n}\n\nexport function RemoveIcon(): React.ReactElement {\n  return <Cross color=\"currentColor\" size={14} />;\n}\n\nexport function SearchIcon(): React.ReactElement {\n  return <Search color=\"currentColor\" size={14} />;\n}\n\nexport function OverflowMenuIcon(): React.ReactElement {\n  return <More color=\"currentColor\" size={14} />;\n}\n\nexport function ChevronDownIcon(): React.ReactElement {\n  return <ChevronDown color=\"currentColor\" size={10} />;\n}\n\nexport function CollapseIcon(): React.ReactElement {\n  return <DoubleChevronLeft color=\"currentColor\" size={14} />;\n}\n\nexport function ExpandIcon(): React.ReactElement {\n  return <DoubleChevronRight color=\"currentColor\" size={14} />;\n}\n\nexport function ResetIcon(): React.ReactElement {\n  return <Undo color=\"currentColor\" size={14} />;\n}\n\nexport function CheckIcon(): React.ReactElement {\n  return <Tick color=\"currentColor\" size={12} />;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,WAAW,EACXC,KAAK,EACLC,iBAAiB,EACjBC,kBAAkB,EAClBC,IAAI,EACJC,MAAM,EACNC,IAAI,EACJC,IAAI,QACC,oBAAoB;AAC3B,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAO,SAASC,WAAWA,CAAA,EAAuB;EAChD,oBACED,KAAA,CAAAE,aAAA;IACEC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,MAAM;IACXC,MAAM,EAAC,cAAc;IACrBC,WAAW,EAAC,KAAK;IACjB,eAAY;EAAM,gBAElBR,KAAA,CAAAE,aAAA;IAAMO,CAAC,EAAC,sBAAsB;IAACC,aAAa,EAAC;EAAO,CAAE,CACnD,CAAC;AAEV;AAEA,OAAO,SAASC,WAAWA,CAAA,EAAuB;EAChD,oBACEX,KAAA,CAAAE,aAAA;IACEC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC,IAAI;IACXC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,MAAM;IACXC,MAAM,EAAC,cAAc;IACrBC,WAAW,EAAC,KAAK;IACjB,eAAY;EAAM,gBAElBR,KAAA,CAAAE,aAAA;IAAMO,CAAC,EAAC,sBAAsB;IAACC,aAAa,EAAC;EAAO,CAAE,CAAC,eACvDV,KAAA,CAAAE,aAAA;IAAMO,CAAC,EAAC,YAAY;IAACC,aAAa,EAAC;EAAO,CAAE,CACzC,CAAC;AAEV;AAEA,OAAO,SAASE,UAAUA,CAAA,EAAuB;EAC/C,oBAAOZ,KAAA,CAAAE,aAAA,CAACT,KAAK;IAACoB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AACjD;AAEA,OAAO,SAASC,UAAUA,CAAA,EAAuB;EAC/C,oBAAOf,KAAA,CAAAE,aAAA,CAACL,MAAM;IAACgB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAClD;AAEA,OAAO,SAASE,gBAAgBA,CAAA,EAAuB;EACrD,oBAAOhB,KAAA,CAAAE,aAAA,CAACN,IAAI;IAACiB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAChD;AAEA,OAAO,SAASG,eAAeA,CAAA,EAAuB;EACpD,oBAAOjB,KAAA,CAAAE,aAAA,CAACV,WAAW;IAACqB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AACvD;AAEA,OAAO,SAASI,YAAYA,CAAA,EAAuB;EACjD,oBAAOlB,KAAA,CAAAE,aAAA,CAACR,iBAAiB;IAACmB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAC7D;AAEA,OAAO,SAASK,UAAUA,CAAA,EAAuB;EAC/C,oBAAOnB,KAAA,CAAAE,aAAA,CAACP,kBAAkB;IAACkB,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAC9D;AAEA,OAAO,SAASM,SAASA,CAAA,EAAuB;EAC9C,oBAAOpB,KAAA,CAAAE,aAAA,CAACH,IAAI;IAACc,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAChD;AAEA,OAAO,SAASO,SAASA,CAAA,EAAuB;EAC9C,oBAAOrB,KAAA,CAAAE,aAAA,CAACJ,IAAI;IAACe,KAAK,EAAC,cAAc;IAACC,IAAI,EAAE;EAAG,CAAE,CAAC;AAChD","ignoreList":[]}
+{"version":3,"file":"FilterIcons.js","names":["ChevronDown","Cross","DoubleChevronLeft","DoubleChevronRight","More","Search","Tick","Undo","React","RemoveIcon","createElement","size","SearchIcon","OverflowMenuIcon","ChevronDownIcon","CollapseIcon","ExpandIcon","ResetIcon","CheckIcon"],"sources":["FilterIcons.tsx"],"sourcesContent":["/*\n * Copyright 2026 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ChevronDown,\n  Cross,\n  DoubleChevronLeft,\n  DoubleChevronRight,\n  More,\n  Search,\n  Tick,\n  Undo,\n} from \"@blueprintjs/icons\";\nimport React from \"react\";\n\nexport function RemoveIcon(): React.ReactElement {\n  return <Cross size={14} />;\n}\n\nexport function SearchIcon(): React.ReactElement {\n  return <Search size={14} />;\n}\n\nexport function OverflowMenuIcon(): React.ReactElement {\n  return <More size={14} />;\n}\n\nexport function ChevronDownIcon(): React.ReactElement {\n  return <ChevronDown size={10} />;\n}\n\nexport function CollapseIcon(): React.ReactElement {\n  return <DoubleChevronLeft size={14} />;\n}\n\nexport function ExpandIcon(): React.ReactElement {\n  return <DoubleChevronRight size={14} />;\n}\n\nexport function ResetIcon(): React.ReactElement {\n  return <Undo size={14} />;\n}\n\nexport function CheckIcon(): React.ReactElement {\n  return <Tick size={12} />;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,WAAW,EACXC,KAAK,EACLC,iBAAiB,EACjBC,kBAAkB,EAClBC,IAAI,EACJC,MAAM,EACNC,IAAI,EACJC,IAAI,QACC,oBAAoB;AAC3B,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAO,SAASC,UAAUA,CAAA,EAAuB;EAC/C,oBAAOD,KAAA,CAAAE,aAAA,CAACT,KAAK;IAACU,IAAI,EAAE;EAAG,CAAE,CAAC;AAC5B;AAEA,OAAO,SAASC,UAAUA,CAAA,EAAuB;EAC/C,oBAAOJ,KAAA,CAAAE,aAAA,CAACL,MAAM;IAACM,IAAI,EAAE;EAAG,CAAE,CAAC;AAC7B;AAEA,OAAO,SAASE,gBAAgBA,CAAA,EAAuB;EACrD,oBAAOL,KAAA,CAAAE,aAAA,CAACN,IAAI;IAACO,IAAI,EAAE;EAAG,CAAE,CAAC;AAC3B;AAEA,OAAO,SAASG,eAAeA,CAAA,EAAuB;EACpD,oBAAON,KAAA,CAAAE,aAAA,CAACV,WAAW;IAACW,IAAI,EAAE;EAAG,CAAE,CAAC;AAClC;AAEA,OAAO,SAASI,YAAYA,CAAA,EAAuB;EACjD,oBAAOP,KAAA,CAAAE,aAAA,CAACR,iBAAiB;IAACS,IAAI,EAAE;EAAG,CAAE,CAAC;AACxC;AAEA,OAAO,SAASK,UAAUA,CAAA,EAAuB;EAC/C,oBAAOR,KAAA,CAAAE,aAAA,CAACP,kBAAkB;IAACQ,IAAI,EAAE;EAAG,CAAE,CAAC;AACzC;AAEA,OAAO,SAASM,SAASA,CAAA,EAAuB;EAC9C,oBAAOT,KAAA,CAAAE,aAAA,CAACH,IAAI;IAACI,IAAI,EAAE;EAAG,CAAE,CAAC;AAC3B;AAEA,OAAO,SAASO,SAASA,CAAA,EAAuB;EAC9C,oBAAOV,KAAA,CAAAE,aAAA,CAACJ,IAAI;IAACK,IAAI,EAAE;EAAG,CAAE,CAAC;AAC3B","ignoreList":[]}

package/build/esm/filter-list/base/FilterInputExcludeRow.js

@@ -0,0 +1,55 @@
+/*
+ * Copyright 2025 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import classnames from "classnames";
+import React, { memo, useCallback } from "react";
+import { supportsExcluding } from "../utils/filterValues.js";
+import { ExcludeDropdown } from "./ExcludeDropdown.js";
+import styles from "./FilterListItem.module.css";
+function FilterInputExcludeRowInner({
+  excludeRowOpen,
+  filterState,
+  onFilterStateChanged,
+  totalValueCount,
+  children
+}) {
+  const handleToggleExclude = useCallback(() => {
+    if (filterState) {
+      onFilterStateChanged({
+        ...filterState,
+        isExcluding: !filterState.isExcluding
+      });
+    }
+  }, [filterState, onFilterStateChanged]);
+  const isExcluding = filterState?.isExcluding ?? false;
+  if (!supportsExcluding(filterState)) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    "data-exclude-row": true,
+    className: classnames(styles.excludeRow, {
+      [styles.excludeRowVisible]: excludeRowOpen ?? false
+    })
+  }, /*#__PURE__*/React.createElement(ExcludeDropdown, {
+    isExcluding: isExcluding,
+    onToggleExclude: handleToggleExclude
+  }), totalValueCount != null && totalValueCount > 0 && /*#__PURE__*/React.createElement("span", {
+    className: styles.excludeCountLabel,
+    title: "Approximate count of unique values"
+  }, totalValueCount.toLocaleString(), " values")), children);
+}
+export const FilterInputExcludeRow = /*#__PURE__*/memo(FilterInputExcludeRowInner);
+//# sourceMappingURL=FilterInputExcludeRow.js.map

package/build/esm/filter-list/base/FilterInputExcludeRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterInputExcludeRow.js","names":["classnames","React","memo","useCallback","supportsExcluding","ExcludeDropdown","styles","FilterInputExcludeRowInner","excludeRowOpen","filterState","onFilterStateChanged","totalValueCount","children","handleToggleExclude","isExcluding","createElement","Fragment","className","excludeRow","excludeRowVisible","onToggleExclude","excludeCountLabel","title","toLocaleString","FilterInputExcludeRow"],"sources":["FilterInputExcludeRow.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classnames from \"classnames\";\nimport React, { memo, useCallback } from \"react\";\nimport type { FilterState } from \"../FilterListItemApi.js\";\nimport { supportsExcluding } from \"../utils/filterValues.js\";\nimport { ExcludeDropdown } from \"./ExcludeDropdown.js\";\nimport styles from \"./FilterListItem.module.css\";\n\ninterface FilterInputExcludeRowProps {\n  excludeRowOpen?: boolean;\n  filterState: FilterState | undefined;\n  onFilterStateChanged: (state: FilterState) => void;\n  totalValueCount?: number;\n  children: React.ReactNode;\n}\n\nfunction FilterInputExcludeRowInner({\n  excludeRowOpen,\n  filterState,\n  onFilterStateChanged,\n  totalValueCount,\n  children,\n}: FilterInputExcludeRowProps): React.ReactElement {\n  const handleToggleExclude = useCallback(() => {\n    if (filterState) {\n      onFilterStateChanged({\n        ...filterState,\n        isExcluding: !filterState.isExcluding,\n      });\n    }\n  }, [filterState, onFilterStateChanged]);\n\n  const isExcluding = filterState?.isExcluding ?? false;\n  const isOpen = excludeRowOpen ?? false;\n\n  if (!supportsExcluding(filterState)) {\n    return <>{children}</>;\n  }\n\n  return (\n    <>\n      <div\n        data-exclude-row\n        className={classnames(styles.excludeRow, {\n          [styles.excludeRowVisible]: isOpen,\n        })}\n      >\n        <ExcludeDropdown\n          isExcluding={isExcluding}\n          onToggleExclude={handleToggleExclude}\n        />\n        {totalValueCount != null && totalValueCount > 0 && (\n          <span\n            className={styles.excludeCountLabel}\n            title=\"Approximate count of unique values\"\n          >\n            {totalValueCount.toLocaleString()} values\n          </span>\n        )}\n      </div>\n      {children}\n    </>\n  );\n}\n\nexport const FilterInputExcludeRow: React.MemoExoticComponent<\n  typeof FilterInputExcludeRowInner\n> = memo(FilterInputExcludeRowInner);\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,IAAIC,IAAI,EAAEC,WAAW,QAAQ,OAAO;AAEhD,SAASC,iBAAiB,QAAQ,0BAA0B;AAC5D,SAASC,eAAe,QAAQ,sBAAsB;AACtD,OAAOC,MAAM,MAAM,6BAA6B;AAUhD,SAASC,0BAA0BA,CAAC;EAClCC,cAAc;EACdC,WAAW;EACXC,oBAAoB;EACpBC,eAAe;EACfC;AAC0B,CAAC,EAAsB;EACjD,MAAMC,mBAAmB,GAAGV,WAAW,CAAC,MAAM;IAC5C,IAAIM,WAAW,EAAE;MACfC,oBAAoB,CAAC;QACnB,GAAGD,WAAW;QACdK,WAAW,EAAE,CAACL,WAAW,CAACK;MAC5B,CAAC,CAAC;IACJ;EACF,CAAC,EAAE,CAACL,WAAW,EAAEC,oBAAoB,CAAC,CAAC;EAEvC,MAAMI,WAAW,GAAGL,WAAW,EAAEK,WAAW,IAAI,KAAK;EAGrD,IAAI,CAACV,iBAAiB,CAACK,WAAW,CAAC,EAAE;IACnC,oBAAOR,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,QAAGJ,QAAW,CAAC;EACxB;EAEA,oBACEX,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,qBACEf,KAAA,CAAAc,aAAA;IACE,wBAAgB;IAChBE,SAAS,EAAEjB,UAAU,CAACM,MAAM,CAACY,UAAU,EAAE;MACvC,CAACZ,MAAM,CAACa,iBAAiB,GAXlBX,cAAc,IAAI;IAY3B,CAAC;EAAE,gBAEHP,KAAA,CAAAc,aAAA,CAACV,eAAe;IACdS,WAAW,EAAEA,WAAY;IACzBM,eAAe,EAAEP;EAAoB,CACtC,CAAC,EACDF,eAAe,IAAI,IAAI,IAAIA,eAAe,GAAG,CAAC,iBAC7CV,KAAA,CAAAc,aAAA;IACEE,SAAS,EAAEX,MAAM,CAACe,iBAAkB;IACpCC,KAAK,EAAC;EAAoC,GAEzCX,eAAe,CAACY,cAAc,CAAC,CAAC,EAAC,SAC9B,CAEL,CAAC,EACLX,QACD,CAAC;AAEP;AAEA,OAAO,MAAMY,qBAEZ,gBAAGtB,IAAI,CAACK,0BAA0B,CAAC","ignoreList":[]}

package/build/esm/filter-list/base/FilterListItem.js

@@ -16,12 +16,13 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
  */
 
 import { Button } from "@base-ui/react/button";
+import { Input } from "@base-ui/react/input";
 import classnames from "classnames";
-import React, { memo, useCallback } from "react";
+import React, { memo, useCallback, useState } from "react";
 import { ErrorBoundary } from "../../shared/ErrorBoundary.js";
-import { supportsExcluding } from "../utils/filterValues.js";
+import { supportsExcluding, supportsSearch } from "../utils/filterValues.js";
 import { DragHandleIcon } from "./DragHandleIcon.js";
-import { ExcludeIcon, IncludeIcon, RemoveIcon } from "./FilterIcons.js";
+import { OverflowMenuIcon, RemoveIcon, SearchIcon } from "./FilterIcons.js";
 import styles from "./FilterListItem.module.css";
 function FilterListItemInner({
   definition,
@@ -36,26 +37,52 @@ function FilterListItemInner({
   className,
   style
 }) {
+  const [searchState, setSearchState] = useState({
+    type: "closed"
+  });
+  const [excludeRowOpen, setExcludeRowOpen] = useState(false);
   const handleFilterStateChanged = useCallback(newState => {
     onFilterStateChanged(filterKey, newState);
   }, [filterKey, onFilterStateChanged]);
-  const handleToggleExclude = useCallback(() => {
-    if (filterState) {
-      onFilterStateChanged(filterKey, {
-        ...filterState,
-        isExcluding: !filterState.isExcluding
-      });
-    }
-  }, [filterKey, filterState, onFilterStateChanged]);
+  const handleToggleSearch = useCallback(() => {
+    setSearchState(prev => prev.type === "closed" ? {
+      type: "open",
+      query: ""
+    } : {
+      type: "closed"
+    });
+  }, []);
+  const handleSearchChange = useCallback(e => {
+    setSearchState({
+      type: "open",
+      query: e.target.value
+    });
+  }, []);
+  const handleSearchClear = useCallback(() => {
+    setSearchState({
+      type: "open",
+      query: ""
+    });
+  }, []);
   const handleRemove = useCallback(() => {
     onFilterRemoved?.(filterKey);
   }, [filterKey, onFilterRemoved]);
-  const isExcluding = filterState?.isExcluding ?? false;
-  const showExcludeToggle = supportsExcluding(filterState);
+  const handleToggleExcludeRow = useCallback(() => {
+    setExcludeRowOpen(prev => !prev);
+  }, []);
+  const searchInputRef = useCallback(element => {
+    element?.focus({
+      preventScroll: true
+    });
+  }, []);
+  const showExcludeDropdown = supportsExcluding(filterState);
+  const showSearch = supportsSearch(filterState);
+  const searchOpen = searchState.type === "open";
+  const searchQuery = searchState.type === "open" ? searchState.query : "";
+  const searchQueryForInput = searchState.type === "open" ? searchState.query : undefined;
   return /*#__PURE__*/React.createElement("div", {
     className: classnames(styles.filterItem, className),
-    style: style,
-    "data-excluding": isExcluding || undefined
+    style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: styles.itemHeader
   }, dragHandleAttributes && /*#__PURE__*/React.createElement(Button, _extends({
@@ -63,15 +90,35 @@ function FilterListItemInner({
     "aria-label": `Reorder ${label}`
   }, dragHandleAttributes, dragHandleListeners), /*#__PURE__*/React.createElement(DragHandleIcon, null)), /*#__PURE__*/React.createElement("span", {
     className: styles.itemLabel
-  }, label), showExcludeToggle && /*#__PURE__*/React.createElement(Button, {
-    className: styles.excludeToggle,
-    onClick: handleToggleExclude,
-    "aria-pressed": isExcluding,
-    "aria-label": isExcluding ? "Switch to include mode" : "Switch to exclude mode"
-  }, isExcluding ? /*#__PURE__*/React.createElement(ExcludeIcon, null) : /*#__PURE__*/React.createElement(IncludeIcon, null)), onFilterRemoved && /*#__PURE__*/React.createElement(Button, {
-    className: styles.removeButton,
+  }, label), showSearch && /*#__PURE__*/React.createElement(Button, {
+    className: styles.headerActionButton,
+    onClick: handleToggleSearch,
+    "aria-label": "Search values",
+    "aria-pressed": searchOpen
+  }, /*#__PURE__*/React.createElement(SearchIcon, null)), onFilterRemoved && /*#__PURE__*/React.createElement(Button, {
+    className: styles.headerActionButton,
     onClick: handleRemove,
     "aria-label": `Remove ${label} filter`
+  }, /*#__PURE__*/React.createElement(RemoveIcon, null)), showExcludeDropdown && /*#__PURE__*/React.createElement(Button, {
+    className: styles.headerActionButton,
+    onClick: handleToggleExcludeRow,
+    "aria-label": "More actions",
+    "aria-pressed": excludeRowOpen
+  }, /*#__PURE__*/React.createElement(OverflowMenuIcon, null))), searchOpen && /*#__PURE__*/React.createElement("div", {
+    className: styles.searchRow
+  }, /*#__PURE__*/React.createElement(Input, {
+    type: "text",
+    className: styles.searchInput,
+    value: searchQuery,
+    onChange: handleSearchChange,
+    placeholder: "Search property values...",
+    "aria-label": "Search property values",
+    ref: searchInputRef
+  }), searchQuery && /*#__PURE__*/React.createElement(Button, {
+    type: "button",
+    className: styles.searchClearButton,
+    onClick: handleSearchClear,
+    "aria-label": "Clear search"
   }, /*#__PURE__*/React.createElement(RemoveIcon, null))), /*#__PURE__*/React.createElement("div", {
     className: styles.itemContent
   }, /*#__PURE__*/React.createElement(ErrorBoundary, {
@@ -80,7 +127,9 @@ function FilterListItemInner({
     definition,
     filterKey,
     filterState,
-    onFilterStateChanged: handleFilterStateChanged
+    onFilterStateChanged: handleFilterStateChanged,
+    searchQuery: searchQueryForInput,
+    excludeRowOpen
   }))));
 }
 export const FilterListItem = /*#__PURE__*/memo(FilterListItemInner);

package/build/esm/filter-list/base/FilterListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterListItem.js","names":["Button","classnames","React","memo","useCallback","ErrorBoundary","supportsExcluding","DragHandleIcon","ExcludeIcon","IncludeIcon","RemoveIcon","styles","FilterListItemInner","definition","filterKey","label","filterState","onFilterStateChanged","onFilterRemoved","renderInput","dragHandleAttributes","dragHandleListeners","className","style","handleFilterStateChanged","newState","handleToggleExclude","isExcluding","handleRemove","showExcludeToggle","createElement","filterItem","undefined","itemHeader","_extends","dragHandle","itemLabel","excludeToggle","onClick","removeButton","itemContent","errorMessage","FilterListItem"],"sources":["FilterListItem.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@base-ui/react/button\";\nimport type {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core\";\nimport classnames from \"classnames\";\nimport React, { memo, useCallback } from \"react\";\nimport { ErrorBoundary } from \"../../shared/ErrorBoundary.js\";\nimport type { FilterState } from \"../FilterListItemApi.js\";\nimport { supportsExcluding } from \"../utils/filterValues.js\";\nimport type { RenderFilterInput } from \"./BaseFilterListApi.js\";\nimport { DragHandleIcon } from \"./DragHandleIcon.js\";\nimport { ExcludeIcon, IncludeIcon, RemoveIcon } from \"./FilterIcons.js\";\nimport styles from \"./FilterListItem.module.css\";\n\ninterface FilterListItemProps<D> {\n  definition: D;\n  filterKey: string;\n  label: string;\n  filterState: FilterState | undefined;\n  onFilterStateChanged: (\n    filterKey: string,\n    state: FilterState,\n  ) => void;\n  onFilterRemoved?: (filterKey: string) => void;\n  renderInput: RenderFilterInput<D>;\n  dragHandleAttributes?: DraggableAttributes;\n  dragHandleListeners?: DraggableSyntheticListeners;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction FilterListItemInner<D>({\n  definition,\n  filterKey,\n  label,\n  filterState,\n  onFilterStateChanged,\n  onFilterRemoved,\n  renderInput,\n  dragHandleAttributes,\n  dragHandleListeners,\n  className,\n  style,\n}: FilterListItemProps<D>): React.ReactElement {\n  const handleFilterStateChanged = useCallback(\n    (newState: FilterState) => {\n      onFilterStateChanged(filterKey, newState);\n    },\n    [filterKey, onFilterStateChanged],\n  );\n\n  const handleToggleExclude = useCallback(\n    () => {\n      if (filterState) {\n        onFilterStateChanged(filterKey, {\n          ...filterState,\n          isExcluding: !filterState.isExcluding,\n        });\n      }\n    },\n    [filterKey, filterState, onFilterStateChanged],\n  );\n\n  const handleRemove = useCallback(\n    () => {\n      onFilterRemoved?.(filterKey);\n    },\n    [filterKey, onFilterRemoved],\n  );\n\n  const isExcluding = filterState?.isExcluding ?? false;\n  const showExcludeToggle = supportsExcluding(filterState);\n\n  return (\n    <div\n      className={classnames(styles.filterItem, className)}\n      style={style}\n      data-excluding={isExcluding || undefined}\n    >\n      <div className={styles.itemHeader}>\n        {dragHandleAttributes && (\n          <Button\n            className={styles.dragHandle}\n            aria-label={`Reorder ${label}`}\n            {...dragHandleAttributes}\n            {...dragHandleListeners}\n          >\n            <DragHandleIcon />\n          </Button>\n        )}\n        <span className={styles.itemLabel}>{label}</span>\n        {showExcludeToggle && (\n          <Button\n            className={styles.excludeToggle}\n            onClick={handleToggleExclude}\n            aria-pressed={isExcluding}\n            aria-label={isExcluding\n              ? \"Switch to include mode\"\n              : \"Switch to exclude mode\"}\n          >\n            {isExcluding ? <ExcludeIcon /> : <IncludeIcon />}\n          </Button>\n        )}\n        {onFilterRemoved && (\n          <Button\n            className={styles.removeButton}\n            onClick={handleRemove}\n            aria-label={`Remove ${label} filter`}\n          >\n            <RemoveIcon />\n          </Button>\n        )}\n      </div>\n\n      <div className={styles.itemContent}>\n        <ErrorBoundary errorMessage=\"Error loading filter\">\n          {renderInput({\n            definition,\n            filterKey,\n            filterState,\n            onFilterStateChanged: handleFilterStateChanged,\n          })}\n        </ErrorBoundary>\n      </div>\n    </div>\n  );\n}\n\nexport const FilterListItem = memo(\n  FilterListItemInner,\n) as typeof FilterListItemInner;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FilterListItem.js","names":["Button","Input","classnames","React","memo","useCallback","useState","ErrorBoundary","supportsExcluding","supportsSearch","DragHandleIcon","OverflowMenuIcon","RemoveIcon","SearchIcon","styles","FilterListItemInner","definition","filterKey","label","filterState","onFilterStateChanged","onFilterRemoved","renderInput","dragHandleAttributes","dragHandleListeners","className","style","searchState","setSearchState","type","excludeRowOpen","setExcludeRowOpen","handleFilterStateChanged","newState","handleToggleSearch","prev","query","handleSearchChange","e","target","value","handleSearchClear","handleRemove","handleToggleExcludeRow","searchInputRef","element","focus","preventScroll","showExcludeDropdown","showSearch","searchOpen","searchQuery","searchQueryForInput","undefined","createElement","filterItem","itemHeader","_extends","dragHandle","itemLabel","headerActionButton","onClick","searchRow","searchInput","onChange","placeholder","ref","searchClearButton","itemContent","errorMessage","FilterListItem"],"sources":["FilterListItem.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@base-ui/react/button\";\nimport { Input } from \"@base-ui/react/input\";\nimport type {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core\";\nimport classnames from \"classnames\";\nimport React, { memo, useCallback, useState } from \"react\";\nimport { ErrorBoundary } from \"../../shared/ErrorBoundary.js\";\nimport type { FilterState } from \"../FilterListItemApi.js\";\nimport { supportsExcluding, supportsSearch } from \"../utils/filterValues.js\";\nimport type { RenderFilterInput } from \"./BaseFilterListApi.js\";\nimport { DragHandleIcon } from \"./DragHandleIcon.js\";\nimport { OverflowMenuIcon, RemoveIcon, SearchIcon } from \"./FilterIcons.js\";\nimport styles from \"./FilterListItem.module.css\";\n\ninterface FilterListItemProps<D> {\n  definition: D;\n  filterKey: string;\n  label: string;\n  filterState: FilterState | undefined;\n  onFilterStateChanged: (\n    filterKey: string,\n    state: FilterState,\n  ) => void;\n  onFilterRemoved?: (filterKey: string) => void;\n  renderInput: RenderFilterInput<D>;\n  dragHandleAttributes?: DraggableAttributes;\n  dragHandleListeners?: DraggableSyntheticListeners;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction FilterListItemInner<D>({\n  definition,\n  filterKey,\n  label,\n  filterState,\n  onFilterStateChanged,\n  onFilterRemoved,\n  renderInput,\n  dragHandleAttributes,\n  dragHandleListeners,\n  className,\n  style,\n}: FilterListItemProps<D>): React.ReactElement {\n  const [searchState, setSearchState] = useState<\n    { type: \"closed\" } | { type: \"open\"; query: string }\n  >({ type: \"closed\" });\n  const [excludeRowOpen, setExcludeRowOpen] = useState(false);\n\n  const handleFilterStateChanged = useCallback(\n    (newState: FilterState) => {\n      onFilterStateChanged(filterKey, newState);\n    },\n    [filterKey, onFilterStateChanged],\n  );\n\n  const handleToggleSearch = useCallback(() => {\n    setSearchState((prev) =>\n      prev.type === \"closed\" ? { type: \"open\", query: \"\" } : { type: \"closed\" }\n    );\n  }, []);\n\n  const handleSearchChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setSearchState({ type: \"open\", query: e.target.value });\n    },\n    [],\n  );\n\n  const handleSearchClear = useCallback(() => {\n    setSearchState({ type: \"open\", query: \"\" });\n  }, []);\n\n  const handleRemove = useCallback(() => {\n    onFilterRemoved?.(filterKey);\n  }, [filterKey, onFilterRemoved]);\n\n  const handleToggleExcludeRow = useCallback(() => {\n    setExcludeRowOpen((prev) => !prev);\n  }, []);\n\n  const searchInputRef = useCallback((element: HTMLInputElement | null) => {\n    element?.focus({ preventScroll: true });\n  }, []);\n\n  const showExcludeDropdown = supportsExcluding(filterState);\n  const showSearch = supportsSearch(filterState);\n  const hasOverflowActions = showExcludeDropdown;\n\n  const searchOpen = searchState.type === \"open\";\n  const searchQuery = searchState.type === \"open\" ? searchState.query : \"\";\n  const searchQueryForInput = searchState.type === \"open\"\n    ? searchState.query\n    : undefined;\n\n  return (\n    <div\n      className={classnames(styles.filterItem, className)}\n      style={style}\n    >\n      <div className={styles.itemHeader}>\n        {dragHandleAttributes && (\n          <Button\n            className={styles.dragHandle}\n            aria-label={`Reorder ${label}`}\n            {...dragHandleAttributes}\n            {...dragHandleListeners}\n          >\n            <DragHandleIcon />\n          </Button>\n        )}\n        <span className={styles.itemLabel}>{label}</span>\n        {showSearch && (\n          <Button\n            className={styles.headerActionButton}\n            onClick={handleToggleSearch}\n            aria-label=\"Search values\"\n            aria-pressed={searchOpen}\n          >\n            <SearchIcon />\n          </Button>\n        )}\n        {onFilterRemoved && (\n          <Button\n            className={styles.headerActionButton}\n            onClick={handleRemove}\n            aria-label={`Remove ${label} filter`}\n          >\n            <RemoveIcon />\n          </Button>\n        )}\n        {hasOverflowActions && (\n          <Button\n            className={styles.headerActionButton}\n            onClick={handleToggleExcludeRow}\n            aria-label=\"More actions\"\n            aria-pressed={excludeRowOpen}\n          >\n            <OverflowMenuIcon />\n          </Button>\n        )}\n      </div>\n\n      {searchOpen && (\n        <div className={styles.searchRow}>\n          <Input\n            type=\"text\"\n            className={styles.searchInput}\n            value={searchQuery}\n            onChange={handleSearchChange}\n            placeholder=\"Search property values...\"\n            aria-label=\"Search property values\"\n            ref={searchInputRef}\n          />\n          {searchQuery && (\n            <Button\n              type=\"button\"\n              className={styles.searchClearButton}\n              onClick={handleSearchClear}\n              aria-label=\"Clear search\"\n            >\n              <RemoveIcon />\n            </Button>\n          )}\n        </div>\n      )}\n\n      <div className={styles.itemContent}>\n        <ErrorBoundary errorMessage=\"Error loading filter\">\n          {renderInput({\n            definition,\n            filterKey,\n            filterState,\n            onFilterStateChanged: handleFilterStateChanged,\n            searchQuery: searchQueryForInput,\n            excludeRowOpen,\n          })}\n        </ErrorBoundary>\n      </div>\n    </div>\n  );\n}\n\nexport const FilterListItem = memo(\n  FilterListItemInner,\n) as typeof FilterListItemInner;\n"],"mappings":"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","ignoreList":[]}

package/build/esm/filter-list/base/FilterListItem.module.css

@@ -18,6 +18,8 @@
   display: flex;
   flex-direction: column;
   gap: var(--osdk-filter-item-gap);
+  border-radius: var(--osdk-filter-item-border-radius);
+  padding: var(--osdk-filter-item-padding);
 }
 
 .itemHeader {
@@ -36,6 +38,8 @@
 .itemContent {
   display: flex;
   flex-direction: column;
+  min-width: 0;
+  overflow: hidden;
 }
 
 .dragHandle {
@@ -66,59 +70,131 @@
   }
 }
 
-.excludeToggle {
+.headerActionButton {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: var(--osdk-filter-item-exclude-toggle-padding);
-  margin-left: auto;
+  padding: var(--osdk-filter-item-header-action-padding);
+  margin-left: calc(var(--osdk-surface-spacing) * 0.5);
   border: none;
   background: transparent;
   cursor: pointer;
-  border-radius: var(--osdk-filter-item-exclude-toggle-border-radius);
-  color: var(--osdk-filter-item-exclude-toggle-color);
+  border-radius: var(--osdk-filter-item-header-action-border-radius);
+  color: var(--osdk-filter-item-header-action-color);
+  opacity: 0;
+  transition: opacity var(--osdk-filter-header-button-transition),
+    background-color var(--osdk-filter-header-button-transition);
 
   &:hover {
-    color: var(--osdk-filter-item-exclude-toggle-color-hover);
-    background: var(--osdk-filter-item-exclude-toggle-bg-hover);
+    color: var(--osdk-typography-color-default-rest);
+    background: var(--osdk-filter-item-header-action-bg-hover);
   }
 
   &:focus-visible {
+    opacity: 1;
     outline: var(--osdk-filter-input-focus-outline-width) solid var(--osdk-filter-input-focus-outline-color);
     outline-offset: var(--osdk-filter-input-focus-outline-offset);
   }
+
+  @media (prefers-reduced-motion: reduce) {
+    transition: none;
+  }
+}
+
+.filterItem:hover .headerActionButton {
+  opacity: 1;
 }
 
-.excludeToggle[aria-pressed="true"] {
-  color: var(--osdk-filter-item-exclude-toggle-color-active);
+.headerActionButton[data-popup-open],
+.headerActionButton[aria-pressed="true"] {
+  opacity: 1;
 }
 
-.removeButton {
+.searchRow {
   display: flex;
   align-items: center;
-  justify-content: center;
-  padding: var(--osdk-filter-item-exclude-toggle-padding);
-  margin-left: var(--osdk-surface-spacing);
+  background: var(--osdk-filter-input-bg);
+  border: var(--osdk-filter-input-border);
+  border-radius: var(--osdk-filter-input-border-radius);
+  padding: var(--osdk-filter-input-padding);
+  gap: var(--osdk-filter-input-gap);
+
+  &:focus-within {
+    outline: var(--osdk-filter-input-focus-outline-width) solid var(--osdk-filter-input-focus-outline-color);
+    outline-offset: var(--osdk-filter-input-focus-outline-offset);
+  }
+}
+
+.searchInput {
+  flex: 1;
   border: none;
   background: transparent;
+  font-family: var(--osdk-filter-input-font-family);
+  font-size: var(--osdk-filter-input-font-size);
+  color: var(--osdk-filter-input-color);
+  outline: none;
+
+  &::placeholder {
+    color: var(--osdk-filter-input-placeholder-color);
+  }
+}
+
+.searchClearButton {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--osdk-filter-input-clear-padding);
+  border: none;
+  background: var(--osdk-filter-input-clear-bg);
+  color: var(--osdk-filter-input-icon-color);
   cursor: pointer;
-  border-radius: var(--osdk-filter-item-exclude-toggle-border-radius);
-  color: var(--osdk-filter-item-exclude-toggle-color);
+  border-radius: var(--osdk-filter-input-clear-border-radius);
+  transition: background-color var(--osdk-filter-input-transition);
 
   &:hover {
-    color: var(--osdk-filter-item-exclude-toggle-color-hover);
-    background: var(--osdk-filter-item-exclude-toggle-bg-hover);
+    background: var(--osdk-filter-input-clear-bg-hover);
+  }
+
+  &:active {
+    background: var(--osdk-filter-input-clear-bg-active);
   }
 
   &:focus-visible {
     outline: var(--osdk-filter-input-focus-outline-width) solid var(--osdk-filter-input-focus-outline-color);
     outline-offset: var(--osdk-filter-input-focus-outline-offset);
   }
+
+  @media (prefers-reduced-motion: reduce) {
+    transition: none;
+  }
+}
+
+.excludeRow {
+  display: flex;
+  align-items: center;
+  opacity: 0;
+  height: 0;
+  overflow: hidden;
+  transition: opacity var(--osdk-filter-header-button-transition),
+    height var(--osdk-filter-header-button-transition);
+
+  @media (prefers-reduced-motion: reduce) {
+    transition: none;
+  }
+}
+
+.filterItem:hover [data-exclude-row],
+.excludeRowVisible {
+  opacity: 1;
+  height: auto;
+  overflow: visible;
 }
 
-.filterItem[data-excluding] {
-  border-left: var(--osdk-filter-item-exclude-border-width) solid var(--osdk-filter-item-exclude-border-color);
-  padding-left: var(--osdk-filter-item-gap);
+.excludeCountLabel {
+  font-family: var(--osdk-filter-item-exclude-dropdown-font-family);
+  font-size: var(--osdk-filter-item-exclude-dropdown-font-size);
+  color: var(--osdk-filter-item-exclude-dropdown-color);
+  margin-left: calc(var(--osdk-surface-spacing) * 0.5);
 }
 
 .dragging {

package/build/esm/filter-list/base/inputs/CheckboxListInput.js

@@ -21,7 +21,7 @@ import { filterValuesBySearch } from "../../utils/filterValues.js";
 import styles from "./CheckboxListInput.module.css";
 import { CheckboxListSkeleton } from "./CheckboxListSkeleton.js";
 import sharedStyles from "./shared.module.css";
-import { useStaleData } from "./useStaleData.js";
+import { useStableData } from "./useStableData.js";
 function CheckboxListInputInner({
   values,
   isLoading,
@@ -33,7 +33,7 @@ function CheckboxListInputInner({
   className,
   style
 }) {
-  const stableValues = useStaleData(values, isLoading);
+  const stableValues = useStableData(values, isLoading);
   const displayValues = useMemo(() => {
     const allValues = stableValues.map(item => item.value);
     if (searchQuery) {

package/build/esm/filter-list/base/inputs/CheckboxListInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxListInput.js","names":["classnames","React","memo","useCallback","useMemo","Checkbox","filterValuesBySearch","styles","CheckboxListSkeleton","sharedStyles","useStaleData","CheckboxListInputInner","values","isLoading","error","selectedValues","onChange","colorMap","searchQuery","className","style","stableValues","displayValues","allValues","map","item","value","v","selectedSet","Set","toggleValue","has","filter","createElement","checkboxList","length","errorMessage","message","emptyMessage","isSelected","color","key","checkboxRow","checkboxLabel","checked","onCheckedChange","colorDot","backgroundColor","valueText","CheckboxListInput"],"sources":["CheckboxListInput.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classnames from \"classnames\";\nimport React, { memo, useCallback, useMemo } from \"react\";\nimport { Checkbox } from \"../../../base-components/checkbox/Checkbox.js\";\nimport type { PropertyAggregationValue } from \"../../types/AggregationTypes.js\";\nimport { filterValuesBySearch } from \"../../utils/filterValues.js\";\nimport styles from \"./CheckboxListInput.module.css\";\nimport { CheckboxListSkeleton } from \"./CheckboxListSkeleton.js\";\nimport sharedStyles from \"./shared.module.css\";\nimport { useStaleData } from \"./useStaleData.js\";\n\ninterface CheckboxListInputProps {\n  values: PropertyAggregationValue[];\n  isLoading: boolean;\n  error: Error | null;\n  selectedValues: string[];\n  onChange: (selectedValues: string[]) => void;\n  colorMap?: Record<string, string>;\n  searchQuery?: string;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction CheckboxListInputInner({\n  values,\n  isLoading,\n  error,\n  selectedValues,\n  onChange,\n  colorMap,\n  searchQuery,\n  className,\n  style,\n}: CheckboxListInputProps): React.ReactElement {\n  const stableValues = useStaleData(values, isLoading);\n\n  const displayValues = useMemo(\n    () => {\n      const allValues = stableValues.map((item) => item.value);\n      if (searchQuery) {\n        return filterValuesBySearch(allValues, searchQuery, (v) => v);\n      }\n      return allValues;\n    },\n    [stableValues, searchQuery],\n  );\n\n  const selectedSet = useMemo(\n    () => new Set(selectedValues),\n    [selectedValues],\n  );\n\n  const toggleValue = useCallback(\n    (value: string) => {\n      if (selectedSet.has(value)) {\n        onChange(selectedValues.filter((v) => v !== value));\n      } else {\n        onChange([...selectedValues, value]);\n      }\n    },\n    [selectedValues, selectedSet, onChange],\n  );\n\n  return (\n    <div\n      className={classnames(styles.checkboxList, className)}\n      style={style}\n      data-loading={isLoading && displayValues.length > 0}\n    >\n      {error && (\n        <div className={sharedStyles.errorMessage}>\n          Error loading values: {error.message}\n        </div>\n      )}\n\n      {!error && displayValues.length === 0 && isLoading && (\n        <CheckboxListSkeleton />\n      )}\n      {!error && displayValues.length === 0 && !isLoading && (\n        <div className={sharedStyles.emptyMessage}>\n          No values available\n        </div>\n      )}\n\n      {displayValues.map((value) => {\n        const isSelected = selectedSet.has(value);\n        const color = colorMap?.[value];\n\n        return (\n          <div\n            key={value}\n            className={styles.checkboxRow}\n            data-selected={isSelected}\n          >\n            <label className={styles.checkboxLabel}>\n              <Checkbox\n                checked={isSelected}\n                onCheckedChange={() => toggleValue(value)}\n              />\n              {color && (\n                <span\n                  className={styles.colorDot}\n                  style={{ backgroundColor: color }}\n                />\n              )}\n              <span className={styles.valueText}>\n                {value}\n              </span>\n            </label>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\nexport const CheckboxListInput = memo(\n  CheckboxListInputInner,\n) as typeof CheckboxListInputInner;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CheckboxListInput.js","names":["classnames","React","memo","useCallback","useMemo","Checkbox","filterValuesBySearch","styles","CheckboxListSkeleton","sharedStyles","useStableData","CheckboxListInputInner","values","isLoading","error","selectedValues","onChange","colorMap","searchQuery","className","style","stableValues","displayValues","allValues","map","item","value","v","selectedSet","Set","toggleValue","has","filter","createElement","checkboxList","length","errorMessage","message","emptyMessage","isSelected","color","key","checkboxRow","checkboxLabel","checked","onCheckedChange","colorDot","backgroundColor","valueText","CheckboxListInput"],"sources":["CheckboxListInput.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classnames from \"classnames\";\nimport React, { memo, useCallback, useMemo } from \"react\";\nimport { Checkbox } from \"../../../base-components/checkbox/Checkbox.js\";\nimport type { PropertyAggregationValue } from \"../../types/AggregationTypes.js\";\nimport { filterValuesBySearch } from \"../../utils/filterValues.js\";\nimport styles from \"./CheckboxListInput.module.css\";\nimport { CheckboxListSkeleton } from \"./CheckboxListSkeleton.js\";\nimport sharedStyles from \"./shared.module.css\";\nimport { useStableData } from \"./useStableData.js\";\n\ninterface CheckboxListInputProps {\n  values: PropertyAggregationValue[];\n  isLoading: boolean;\n  error: Error | null;\n  selectedValues: string[];\n  onChange: (selectedValues: string[]) => void;\n  colorMap?: Record<string, string>;\n  searchQuery?: string;\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nfunction CheckboxListInputInner({\n  values,\n  isLoading,\n  error,\n  selectedValues,\n  onChange,\n  colorMap,\n  searchQuery,\n  className,\n  style,\n}: CheckboxListInputProps): React.ReactElement {\n  const stableValues = useStableData(values, isLoading);\n\n  const displayValues = useMemo(\n    () => {\n      const allValues = stableValues.map((item) => item.value);\n      if (searchQuery) {\n        return filterValuesBySearch(allValues, searchQuery, (v) => v);\n      }\n      return allValues;\n    },\n    [stableValues, searchQuery],\n  );\n\n  const selectedSet = useMemo(\n    () => new Set(selectedValues),\n    [selectedValues],\n  );\n\n  const toggleValue = useCallback(\n    (value: string) => {\n      if (selectedSet.has(value)) {\n        onChange(selectedValues.filter((v) => v !== value));\n      } else {\n        onChange([...selectedValues, value]);\n      }\n    },\n    [selectedValues, selectedSet, onChange],\n  );\n\n  return (\n    <div\n      className={classnames(styles.checkboxList, className)}\n      style={style}\n      data-loading={isLoading && displayValues.length > 0}\n    >\n      {error && (\n        <div className={sharedStyles.errorMessage}>\n          Error loading values: {error.message}\n        </div>\n      )}\n\n      {!error && displayValues.length === 0 && isLoading && (\n        <CheckboxListSkeleton />\n      )}\n      {!error && displayValues.length === 0 && !isLoading && (\n        <div className={sharedStyles.emptyMessage}>\n          No values available\n        </div>\n      )}\n\n      {displayValues.map((value) => {\n        const isSelected = selectedSet.has(value);\n        const color = colorMap?.[value];\n\n        return (\n          <div\n            key={value}\n            className={styles.checkboxRow}\n            data-selected={isSelected}\n          >\n            <label className={styles.checkboxLabel}>\n              <Checkbox\n                checked={isSelected}\n                onCheckedChange={() => toggleValue(value)}\n              />\n              {color && (\n                <span\n                  className={styles.colorDot}\n                  style={{ backgroundColor: color }}\n                />\n              )}\n              <span className={styles.valueText}>\n                {value}\n              </span>\n            </label>\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n\nexport const CheckboxListInput = memo(\n  CheckboxListInputInner,\n) as typeof CheckboxListInputInner;\n"],"mappings":"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","ignoreList":[]}

package/build/esm/filter-list/base/inputs/ContainsTextInput.js

@@ -63,9 +63,7 @@ function ContainsTextInputInner({
     className: styles.inputGroup
   }, renderSearchIcon ? renderSearchIcon() : /*#__PURE__*/React.createElement("span", {
     className: styles.searchIcon
-  }, /*#__PURE__*/React.createElement(Search, {
-    color: "currentColor"
-  })), /*#__PURE__*/React.createElement(Input, {
+  }, /*#__PURE__*/React.createElement(Search, null)), /*#__PURE__*/React.createElement(Input, {
     type: "text",
     className: styles.input,
     value: localValue,
@@ -77,9 +75,7 @@ function ContainsTextInputInner({
     className: styles.clearButton,
     onClick: handleClear,
     "aria-label": "Clear search"
-  }, renderClearIcon ? renderClearIcon() : /*#__PURE__*/React.createElement(Cross, {
-    color: "currentColor"
-  }))));
+  }, renderClearIcon ? renderClearIcon() : /*#__PURE__*/React.createElement(Cross, null))));
 }
 export const ContainsTextInput = /*#__PURE__*/memo(ContainsTextInputInner);
 //# sourceMappingURL=ContainsTextInput.js.map

package/build/esm/filter-list/base/inputs/ContainsTextInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContainsTextInput.js","names":["Button","Input","Cross","Search","classnames","debounce","React","memo","useCallback","useEffect","useMemo","useRef","useState","styles","ContainsTextInputInner","value","onChange","placeholder","debounceMs","className","style","renderSearchIcon","renderClearIcon","localValue","setLocalValue","onChangeRef","current","debouncedOnChange","newValue","length","undefined","cancel","handleInputChange","e","target","handleClear","createElement","textInput","inputGroup","searchIcon","color","type","input","clearButton","onClick","ContainsTextInput"],"sources":["ContainsTextInput.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@base-ui/react/button\";\nimport { Input } from \"@base-ui/react/input\";\nimport { Cross, Search } from \"@blueprintjs/icons\";\nimport classnames from \"classnames\";\nimport { debounce } from \"lodash-es\";\nimport React, {\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport styles from \"./ContainsTextInput.module.css\";\n\ninterface ContainsTextInputProps {\n  value: string | undefined;\n  onChange: (value: string | undefined) => void;\n  placeholder?: string;\n  debounceMs?: number;\n  className?: string;\n  style?: React.CSSProperties;\n  renderSearchIcon?: () => React.ReactNode;\n  renderClearIcon?: () => React.ReactNode;\n}\n\nfunction ContainsTextInputInner({\n  value,\n  onChange,\n  placeholder = \"Search...\",\n  debounceMs = 300,\n  className,\n  style,\n  renderSearchIcon,\n  renderClearIcon,\n}: ContainsTextInputProps): React.ReactElement {\n  const [localValue, setLocalValue] = useState(value ?? \"\");\n\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const debouncedOnChange = useMemo(\n    () =>\n      debounce((newValue: string) => {\n        onChangeRef.current(newValue.length > 0 ? newValue : undefined);\n      }, debounceMs),\n    [debounceMs],\n  );\n\n  useEffect(() => {\n    return () => {\n      debouncedOnChange.cancel();\n    };\n  }, [debouncedOnChange]);\n\n  useEffect(() => {\n    setLocalValue(value ?? \"\");\n    debouncedOnChange.cancel();\n  }, [value, debouncedOnChange]);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setLocalValue(e.target.value);\n      debouncedOnChange(e.target.value);\n    },\n    [debouncedOnChange],\n  );\n\n  const handleClear = useCallback(() => {\n    setLocalValue(\"\");\n    debouncedOnChange.cancel();\n    onChangeRef.current(undefined);\n  }, [debouncedOnChange]);\n\n  return (\n    <div\n      className={classnames(styles.textInput, className)}\n      style={style}\n      data-has-value={!!localValue}\n    >\n      <div className={styles.inputGroup}>\n        {renderSearchIcon\n          ? renderSearchIcon()\n          : (\n            <span className={styles.searchIcon}>\n              <Search color=\"currentColor\" />\n            </span>\n          )}\n        <Input\n          type=\"text\"\n          className={styles.input}\n          value={localValue}\n          onChange={handleInputChange}\n          placeholder={placeholder}\n          aria-label={placeholder}\n        />\n        {localValue && (\n          <Button\n            type=\"button\"\n            className={styles.clearButton}\n            onClick={handleClear}\n            aria-label=\"Clear search\"\n          >\n            {renderClearIcon\n              ? renderClearIcon()\n              : <Cross color=\"currentColor\" />}\n          </Button>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport const ContainsTextInput: React.NamedExoticComponent<\n  ContainsTextInputProps\n> = memo(ContainsTextInputInner);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ContainsTextInput.js","names":["Button","Input","Cross","Search","classnames","debounce","React","memo","useCallback","useEffect","useMemo","useRef","useState","styles","ContainsTextInputInner","value","onChange","placeholder","debounceMs","className","style","renderSearchIcon","renderClearIcon","localValue","setLocalValue","onChangeRef","current","debouncedOnChange","newValue","length","undefined","cancel","handleInputChange","e","target","handleClear","createElement","textInput","inputGroup","searchIcon","type","input","clearButton","onClick","ContainsTextInput"],"sources":["ContainsTextInput.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@base-ui/react/button\";\nimport { Input } from \"@base-ui/react/input\";\nimport { Cross, Search } from \"@blueprintjs/icons\";\nimport classnames from \"classnames\";\nimport { debounce } from \"lodash-es\";\nimport React, {\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport styles from \"./ContainsTextInput.module.css\";\n\ninterface ContainsTextInputProps {\n  value: string | undefined;\n  onChange: (value: string | undefined) => void;\n  placeholder?: string;\n  debounceMs?: number;\n  className?: string;\n  style?: React.CSSProperties;\n  renderSearchIcon?: () => React.ReactNode;\n  renderClearIcon?: () => React.ReactNode;\n}\n\nfunction ContainsTextInputInner({\n  value,\n  onChange,\n  placeholder = \"Search...\",\n  debounceMs = 300,\n  className,\n  style,\n  renderSearchIcon,\n  renderClearIcon,\n}: ContainsTextInputProps): React.ReactElement {\n  const [localValue, setLocalValue] = useState(value ?? \"\");\n\n  const onChangeRef = useRef(onChange);\n  onChangeRef.current = onChange;\n\n  const debouncedOnChange = useMemo(\n    () =>\n      debounce((newValue: string) => {\n        onChangeRef.current(newValue.length > 0 ? newValue : undefined);\n      }, debounceMs),\n    [debounceMs],\n  );\n\n  useEffect(() => {\n    return () => {\n      debouncedOnChange.cancel();\n    };\n  }, [debouncedOnChange]);\n\n  useEffect(() => {\n    setLocalValue(value ?? \"\");\n    debouncedOnChange.cancel();\n  }, [value, debouncedOnChange]);\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      setLocalValue(e.target.value);\n      debouncedOnChange(e.target.value);\n    },\n    [debouncedOnChange],\n  );\n\n  const handleClear = useCallback(() => {\n    setLocalValue(\"\");\n    debouncedOnChange.cancel();\n    onChangeRef.current(undefined);\n  }, [debouncedOnChange]);\n\n  return (\n    <div\n      className={classnames(styles.textInput, className)}\n      style={style}\n      data-has-value={!!localValue}\n    >\n      <div className={styles.inputGroup}>\n        {renderSearchIcon\n          ? renderSearchIcon()\n          : (\n            <span className={styles.searchIcon}>\n              <Search />\n            </span>\n          )}\n        <Input\n          type=\"text\"\n          className={styles.input}\n          value={localValue}\n          onChange={handleInputChange}\n          placeholder={placeholder}\n          aria-label={placeholder}\n        />\n        {localValue && (\n          <Button\n            type=\"button\"\n            className={styles.clearButton}\n            onClick={handleClear}\n            aria-label=\"Clear search\"\n          >\n            {renderClearIcon\n              ? renderClearIcon()\n              : <Cross />}\n          </Button>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport const ContainsTextInput: React.NamedExoticComponent<\n  ContainsTextInputProps\n> = memo(ContainsTextInputInner);\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,KAAK,QAAQ,sBAAsB;AAC5C,SAASC,KAAK,EAAEC,MAAM,QAAQ,oBAAoB;AAClD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,QAAQ,QAAQ,WAAW;AACpC,OAAOC,KAAK,IACVC,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,OAAOC,MAAM,MAAM,gCAAgC;AAanD,SAASC,sBAAsBA,CAAC;EAC9BC,KAAK;EACLC,QAAQ;EACRC,WAAW,GAAG,WAAW;EACzBC,UAAU,GAAG,GAAG;EAChBC,SAAS;EACTC,KAAK;EACLC,gBAAgB;EAChBC;AACsB,CAAC,EAAsB;EAC7C,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGZ,QAAQ,CAACG,KAAK,IAAI,EAAE,CAAC;EAEzD,MAAMU,WAAW,GAAGd,MAAM,CAACK,QAAQ,CAAC;EACpCS,WAAW,CAACC,OAAO,GAAGV,QAAQ;EAE9B,MAAMW,iBAAiB,GAAGjB,OAAO,CAC/B,MACEL,QAAQ,CAAEuB,QAAgB,IAAK;IAC7BH,WAAW,CAACC,OAAO,CAACE,QAAQ,CAACC,MAAM,GAAG,CAAC,GAAGD,QAAQ,GAAGE,SAAS,CAAC;EACjE,CAAC,EAAEZ,UAAU,CAAC,EAChB,CAACA,UAAU,CACb,CAAC;EAEDT,SAAS,CAAC,MAAM;IACd,OAAO,MAAM;MACXkB,iBAAiB,CAACI,MAAM,CAAC,CAAC;IAC5B,CAAC;EACH,CAAC,EAAE,CAACJ,iBAAiB,CAAC,CAAC;EAEvBlB,SAAS,CAAC,MAAM;IACde,aAAa,CAACT,KAAK,IAAI,EAAE,CAAC;IAC1BY,iBAAiB,CAACI,MAAM,CAAC,CAAC;EAC5B,CAAC,EAAE,CAAChB,KAAK,EAAEY,iBAAiB,CAAC,CAAC;EAE9B,MAAMK,iBAAiB,GAAGxB,WAAW,CAClCyB,CAAsC,IAAK;IAC1CT,aAAa,CAACS,CAAC,CAACC,MAAM,CAACnB,KAAK,CAAC;IAC7BY,iBAAiB,CAACM,CAAC,CAACC,MAAM,CAACnB,KAAK,CAAC;EACnC,CAAC,EACD,CAACY,iBAAiB,CACpB,CAAC;EAED,MAAMQ,WAAW,GAAG3B,WAAW,CAAC,MAAM;IACpCgB,aAAa,CAAC,EAAE,CAAC;IACjBG,iBAAiB,CAACI,MAAM,CAAC,CAAC;IAC1BN,WAAW,CAACC,OAAO,CAACI,SAAS,CAAC;EAChC,CAAC,EAAE,CAACH,iBAAiB,CAAC,CAAC;EAEvB,oBACErB,KAAA,CAAA8B,aAAA;IACEjB,SAAS,EAAEf,UAAU,CAACS,MAAM,CAACwB,SAAS,EAAElB,SAAS,CAAE;IACnDC,KAAK,EAAEA,KAAM;IACb,kBAAgB,CAAC,CAACG;EAAW,gBAE7BjB,KAAA,CAAA8B,aAAA;IAAKjB,SAAS,EAAEN,MAAM,CAACyB;EAAW,GAC/BjB,gBAAgB,GACbA,gBAAgB,CAAC,CAAC,gBAElBf,KAAA,CAAA8B,aAAA;IAAMjB,SAAS,EAAEN,MAAM,CAAC0B;EAAW,gBACjCjC,KAAA,CAAA8B,aAAA,CAACjC,MAAM,MAAE,CACL,CACP,eACHG,KAAA,CAAA8B,aAAA,CAACnC,KAAK;IACJuC,IAAI,EAAC,MAAM;IACXrB,SAAS,EAAEN,MAAM,CAAC4B,KAAM;IACxB1B,KAAK,EAAEQ,UAAW;IAClBP,QAAQ,EAAEgB,iBAAkB;IAC5Bf,WAAW,EAAEA,WAAY;IACzB,cAAYA;EAAY,CACzB,CAAC,EACDM,UAAU,iBACTjB,KAAA,CAAA8B,aAAA,CAACpC,MAAM;IACLwC,IAAI,EAAC,QAAQ;IACbrB,SAAS,EAAEN,MAAM,CAAC6B,WAAY;IAC9BC,OAAO,EAAER,WAAY;IACrB,cAAW;EAAc,GAExBb,eAAe,GACZA,eAAe,CAAC,CAAC,gBACjBhB,KAAA,CAAA8B,aAAA,CAAClC,KAAK,MAAE,CACN,CAEP,CACF,CAAC;AAEV;AAEA,OAAO,MAAM0C,iBAEZ,gBAAGrC,IAAI,CAACO,sBAAsB,CAAC","ignoreList":[]}

package/build/esm/filter-list/base/inputs/ListogramInput.js

@@ -21,7 +21,7 @@ import { filterValuesBySearch } from "../../utils/filterValues.js";
 import styles from "./ListogramInput.module.css";
 import { ListogramSkeleton } from "./ListogramSkeleton.js";
 import sharedStyles from "./shared.module.css";
-import { useStaleData } from "./useStaleData.js";
+import { useStableData } from "./useStableData.js";
 function ListogramInputInner({
   values,
   maxCount,
@@ -37,7 +37,7 @@ function ListogramInputInner({
   searchQuery
 }) {
   const [isExpanded, setIsExpanded] = useState(false);
-  const stableValues = useStaleData(values, isLoading);
+  const stableValues = useStableData(values, isLoading);
   const selectedSet = useMemo(() => new Set(selectedValues), [selectedValues]);
   const toggleValue = useCallback(value => {
     if (selectedSet.has(value)) {