Adds controls for defining custom faceting behavior for numerical fea…

…tures.

Consumers can now configure the `contextName` (the name of the module in which
this control is used), the `choiceLimit` (the number of features that can be
selected concurrently), and the `binLimit` (the number of bins created from all
feature permutations).

The `@facets-change` action sends the currently selected `features` and
numerical `bins` to the consumer. You can find examples of use in the Slice,
Metrics, and Threshold modules.

PiperOrigin-RevId: 424334109

lit_nlp/client/core/faceting_control.css

@@ -25,12 +25,15 @@
 
   min-width: 250px;
   max-height: 150px;
-  overflow-y: scroll;
+
+  flex-direction: column;
+  overflow-y: hidden;
 
   z-index: 9000;
 }
 
 .panel-header {
+  flex: 0 0 auto;
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -45,3 +48,43 @@
   margin-right: 12px;
   flex-grow: 1;
 }
+
+.choice-limit {
+  color: var(--lit-neutral-600);
+  margin-right: 8px;
+}
+
+.panel-options {
+  flex: 1 1 auto;
+  overflow-y: auto;
+}
+
+.feature-options-row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding-left: 2px;
+  padding-right: 8px;
+}
+
+.feature-options-row.excess-bins {
+  background-color: var(--google-red-50);
+  color: var(--google-red-500);
+}
+
+.feature-options-row .aligner {
+  flex-grow: 1;
+}
+
+.feature-options-row select.dropdown {
+  max-width: 135px;
+}
+
+.feature-options-row input[type='number'] {
+  width: 64px;
+}
+
+.feature-options-row .no-input {
+  min-width: 72px;
+}