@reopt-ai/opt-ui 1.10.0 → 1.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (73) hide show
  1. package/COMPONENT_CATALOG.md +522 -218
  2. package/README.md +61 -7
  3. package/dist/core/index.cjs +10 -8
  4. package/dist/core/index.d.cts +3 -3
  5. package/dist/core/index.d.ts +3 -3
  6. package/dist/core/index.js +3 -3
  7. package/dist/docs/02-components/01-core.md +213 -96
  8. package/dist/docs/02-components/02-visuals.md +1 -1
  9. package/dist/docs/02-components/03-shells.md +334 -123
  10. package/dist/docs/02-components/04-surfaces.md +1 -1
  11. package/dist/docs/02-components/index.md +5 -5
  12. package/dist/docs/03-recipes/02-dashboards.md +126 -10
  13. package/dist/{field-sidebar-B6Ndr8HE.cjs → field-sidebar-BYgEmdy0.cjs} +2128 -1558
  14. package/dist/{field-sidebar-BXjvV7Cz.js → field-sidebar-BuO37l4c.js} +2111 -1561
  15. package/dist/{field-sidebar-nwcE9LC4.d.cts → field-sidebar-CrYlRZew.d.ts} +375 -154
  16. package/dist/{field-sidebar-DWfJAJlx.d.ts → field-sidebar-uXmoyvd7.d.cts} +375 -154
  17. package/dist/id-registry.cjs +124 -12
  18. package/dist/id-registry.d.cts +1 -2
  19. package/dist/id-registry.d.ts +1 -2
  20. package/dist/id-registry.js +124 -14
  21. package/dist/id-registry.json +265 -31
  22. package/dist/index.cjs +1162 -253
  23. package/dist/index.d.cts +573 -60
  24. package/dist/index.d.ts +573 -60
  25. package/dist/index.js +1134 -242
  26. package/dist/{key-pad-menu-DfZbeXhG.d.cts → key-pad-menu-CwcY_Vps.d.cts} +151 -7
  27. package/dist/{key-pad-menu-BQunU20e.js → key-pad-menu-Di2aRGbM.js} +388 -461
  28. package/dist/{key-pad-menu-D5mQcS5v.cjs → key-pad-menu-SItoHPLu.cjs} +490 -609
  29. package/dist/{key-pad-menu-BsgJMjD4.d.ts → key-pad-menu-WBJShCJn.d.ts} +152 -8
  30. package/dist/meta.cjs +1304 -168
  31. package/dist/meta.d.cts +12 -36
  32. package/dist/meta.d.ts +12 -36
  33. package/dist/meta.js +1304 -170
  34. package/dist/query.d.cts +1 -2
  35. package/dist/query.d.ts +1 -2
  36. package/dist/query.js +0 -2
  37. package/dist/shells/index.cjs +4 -1
  38. package/dist/shells/index.d.cts +2 -2
  39. package/dist/shells/index.d.ts +2 -2
  40. package/dist/shells/index.js +2 -2
  41. package/dist/{text-truncate-BGr7bB_8.d.cts → text-truncate-CQyfUZvq.d.cts} +48 -5
  42. package/dist/{text-truncate-BGr7bB_8.d.ts → text-truncate-CQyfUZvq.d.ts} +48 -5
  43. package/dist/{text-truncate-j6X3z7Pv.js → text-truncate-DSuZECy0.js} +446 -94
  44. package/dist/{text-truncate-CxdzAnhS.cjs → text-truncate-I1XLWmRa.cjs} +522 -90
  45. package/dist/theme/server.d.cts +1 -2
  46. package/dist/theme/server.d.ts +1 -2
  47. package/dist/theme/server.js +0 -2
  48. package/dist/visuals/index.js +0 -1
  49. package/package.json +4 -3
  50. package/dist/field-sidebar-BXjvV7Cz.js.map +0 -1
  51. package/dist/field-sidebar-DWfJAJlx.d.ts.map +0 -1
  52. package/dist/field-sidebar-nwcE9LC4.d.cts.map +0 -1
  53. package/dist/id-registry.d.cts.map +0 -1
  54. package/dist/id-registry.d.ts.map +0 -1
  55. package/dist/id-registry.js.map +0 -1
  56. package/dist/index.d.cts.map +0 -1
  57. package/dist/index.d.ts.map +0 -1
  58. package/dist/index.js.map +0 -1
  59. package/dist/key-pad-menu-BQunU20e.js.map +0 -1
  60. package/dist/key-pad-menu-BsgJMjD4.d.ts.map +0 -1
  61. package/dist/key-pad-menu-DfZbeXhG.d.cts.map +0 -1
  62. package/dist/meta.d.cts.map +0 -1
  63. package/dist/meta.d.ts.map +0 -1
  64. package/dist/meta.js.map +0 -1
  65. package/dist/query.d.cts.map +0 -1
  66. package/dist/query.d.ts.map +0 -1
  67. package/dist/query.js.map +0 -1
  68. package/dist/text-truncate-BGr7bB_8.d.cts.map +0 -1
  69. package/dist/text-truncate-BGr7bB_8.d.ts.map +0 -1
  70. package/dist/text-truncate-j6X3z7Pv.js.map +0 -1
  71. package/dist/theme/server.d.cts.map +0 -1
  72. package/dist/theme/server.d.ts.map +0 -1
  73. package/dist/theme/server.js.map +0 -1
@@ -1,5 +1,5 @@
1
1
 
2
- import { A as FormFieldDef, D as FaqItem, E as FailureItem, F as ProjectDef, G as ToolbarButtonDef, L as SelectOption, P as NavItemDef, R as StatCard, S as EnvGroupDef, a as FieldDataType, b as DeploymentStep, j as MenuDef, r as TruncationSide, u as BranchDef, x as DomainDef, y as CommandDef, z as TabDef } from "./text-truncate-BGr7bB_8.js";
2
+ import { B as StatCard, C as DomainDef, I as NavItemDef, L as ProjectDef, M as FormFieldDef, N as MenuDef, O as FailureItem, S as DeploymentStep, V as TabDef, a as FieldDataType, f as BranchDef, k as FaqItem, q as ToolbarButtonDef, r as TruncationSide, w as EnvGroupDef, x as CommandDef, z as SelectOption } from "./text-truncate-CQyfUZvq.cjs";
3
3
  import * as React from "react";
4
4
  import { ReactNode, Ref } from "react";
5
5
  import { TimeGranularity, TimeRange, TimeRange as TimeRange$1, TimeSeriesAnnotation, TimeSeriesChartProps, TimeSeriesDef, TimeSeriesPoint } from "@reopt-ai/opt-charts";
@@ -288,7 +288,18 @@ interface DataTableProps<T> {
288
288
  data: T[];
289
289
  columns: ColumnDef<T>[];
290
290
  keyExtractor: (row: T) => string;
291
+ /**
292
+ * A heading above the table. Omitted by default — most tables sit under a
293
+ * page heading that already names them, and a second one in English was
294
+ * showing up on screens that had never asked for a title.
295
+ */
291
296
  title?: string;
297
+ /**
298
+ * The grid's accessible name, for a table that shows no heading. `title`
299
+ * wins when both are given, so a visible heading is never contradicted by a
300
+ * different spoken one.
301
+ */
302
+ ariaLabel?: string;
292
303
  onRowClick?: (row: T) => void;
293
304
  emptyMessage?: string;
294
305
  /** Highlight a single row by its key */
@@ -313,7 +324,7 @@ interface DataTableProps<T> {
313
324
  className?: string;
314
325
  }
315
326
  /** Renders the data table component. */
316
- declare function DataTable<T>({ data, columns, keyExtractor, title, onRowClick, emptyMessage, activeRowId, sortable, selectable, selectedKeys, onSelectionChange, expandable, renderExpanded, pageSize, stickyHeader, resizableColumns, onSort: onSortExternal, className }: DataTableProps<T>): import("react").JSX.Element;
327
+ declare function DataTable<T>({ data, columns, keyExtractor, title, ariaLabel, onRowClick, emptyMessage, activeRowId, sortable, selectable, selectedKeys, onSelectionChange, expandable, renderExpanded, pageSize, stickyHeader, resizableColumns, onSort: onSortExternal, className }: DataTableProps<T>): import("react").JSX.Element;
317
328
  //#endregion
318
329
  //#region src/shells/notification-toast.d.ts
319
330
  /** Defines the toast action shape. */
@@ -491,6 +502,367 @@ declare namespace WorkflowCanvas {
491
502
  var displayName: string;
492
503
  }
493
504
  //#endregion
505
+ //#region src/shells/event-timeline.d.ts
506
+ /** Semantic colour of a timeline node. */
507
+ type EventTimelineTone = "default" | "accent" | "success" | "warning" | "danger";
508
+ /** One event on the timeline. */
509
+ interface EventTimelineItem {
510
+ id: string;
511
+ /** Event name — the headline of the row. */
512
+ name: ReactNode;
513
+ /** ISO timestamp. Drives the shown time and the gap from the previous row. */
514
+ timestamp: string;
515
+ /** Secondary line locating the event: a path, a target, an object id. */
516
+ detail?: ReactNode;
517
+ icon?: ReactNode;
518
+ tone?: EventTimelineTone;
519
+ /**
520
+ * Payload revealed when the row is expanded. Rendering it inline rather
521
+ * than in a separate panel is what lets someone read a sequence and its
522
+ * evidence without losing their place in the sequence.
523
+ */
524
+ properties?: Record<string, unknown>;
525
+ /** Replaces the default property table when the payload needs shaping. */
526
+ content?: ReactNode;
527
+ href?: string;
528
+ }
529
+ /** A run of events that belong together — typically one session. */
530
+ interface EventTimelineGroup {
531
+ id: string;
532
+ title: ReactNode;
533
+ /** Facts about the run: duration, event count, entry channel. */
534
+ meta?: ReactNode;
535
+ href?: string;
536
+ items: EventTimelineItem[];
537
+ /** Collapsed groups still show their header, so the shape stays readable. */
538
+ defaultOpen?: boolean;
539
+ }
540
+ /** Localized strings for the event timeline. */
541
+ interface EventTimelineLabels {
542
+ emptyTitle?: string;
543
+ emptyDescription?: string;
544
+ expand?: string;
545
+ collapse?: string;
546
+ loadMore?: string;
547
+ /** Gap between two adjacent events, e.g. "+2 minutes". */
548
+ gap?: (duration: string) => string;
549
+ /** Announced for a gap the reader cannot see, e.g. across a collapsed group. */
550
+ properties?: string;
551
+ openGroup?: (title: string) => string;
552
+ }
553
+ /** Props for the event timeline component. */
554
+ interface EventTimelineProps {
555
+ /** Flat list. Ignored when `groups` is given. */
556
+ items?: EventTimelineItem[];
557
+ /** Grouped list — the shape a user's history takes once it spans sessions. */
558
+ groups?: EventTimelineGroup[];
559
+ /**
560
+ * Show the elapsed time between adjacent events. This is the difference
561
+ * between a list of things that happened and a record of how someone moved:
562
+ * a four-minute pause before a checkout event is the finding.
563
+ */
564
+ showGaps?: boolean;
565
+ /** Reading direction of the supplied items. */
566
+ order?: "desc" | "asc";
567
+ /** Suppress gap labels below this many milliseconds. */
568
+ minGapMs?: number;
569
+ loading?: boolean;
570
+ hasMore?: boolean;
571
+ onLoadMore?: () => void;
572
+ onItemSelect?: (item: EventTimelineItem) => void;
573
+ locale?: string;
574
+ labels?: EventTimelineLabels;
575
+ className?: string;
576
+ }
577
+ /**
578
+ * EventTimeline — a sequence of events, read as a sequence.
579
+ *
580
+ * A table of events answers "what happened" and hides "how it went": the rows
581
+ * are evenly spaced no matter whether they were two seconds or two hours
582
+ * apart, and the payload that would explain a row lives in a column nobody
583
+ * widened. This renders the same data as an ordered rail, labels the elapsed
584
+ * time between adjacent events, and opens each payload in place. Grouping by
585
+ * session restores the boundary that makes a history legible.
586
+ *
587
+ * @example
588
+ * ```tsx
589
+ * <EventTimeline
590
+ * groups={sessions.map((session) => ({
591
+ * id: session.id,
592
+ * title: session.entryPath,
593
+ * meta: `${session.duration} · ${session.events} events`,
594
+ * items: session.events,
595
+ * }))}
596
+ * showGaps
597
+ * />
598
+ * ```
599
+ */
600
+ declare function EventTimeline({ items, groups, showGaps, order, minGapMs, loading, hasMore, onLoadMore, onItemSelect, locale, labels: customLabels, className }: EventTimelineProps): import("react").JSX.Element;
601
+ declare namespace EventTimeline {
602
+ var displayName: string;
603
+ }
604
+ //#endregion
605
+ //#region src/shells/score-breakdown.d.ts
606
+ /** One contributing dimension of a composite score. */
607
+ interface ScoreAxis {
608
+ id: string;
609
+ label: string;
610
+ /** Value on the same scale as the headline score. */
611
+ value: number;
612
+ /**
613
+ * What the axis measures. A composite score that cannot be taken apart is
614
+ * a number people learn to ignore; naming each axis is what makes a low
615
+ * one actionable.
616
+ */
617
+ hint?: string;
618
+ /** Share of the total this axis carries, 0–1. Rendered so the sum audits. */
619
+ weight?: number;
620
+ }
621
+ /** A named range of the score, used to colour and caption the headline. */
622
+ interface ScoreBand {
623
+ /** Lowest value in the band, inclusive. */
624
+ min: number;
625
+ label: string;
626
+ tone?: "default" | "success" | "warning" | "error";
627
+ }
628
+ /** Localized strings for the score breakdown. */
629
+ interface ScoreBreakdownLabels {
630
+ title?: string;
631
+ outOf?: (max: number) => string;
632
+ weight?: (percent: string) => string;
633
+ empty?: string;
634
+ }
635
+ /** Props for the score breakdown component. */
636
+ interface ScoreBreakdownProps {
637
+ score: number;
638
+ max?: number;
639
+ axes: ScoreAxis[];
640
+ bands?: ScoreBand[];
641
+ /** Sentence under the headline explaining how the score is derived. */
642
+ formula?: ReactNode;
643
+ loading?: boolean;
644
+ labels?: ScoreBreakdownLabels;
645
+ className?: string;
646
+ }
647
+ /**
648
+ * ScoreBreakdown — a composite score you can argue with.
649
+ *
650
+ * Engagement, health and risk scores all collapse several signals into one
651
+ * number, and the number alone tells nobody what to do about it. Showing the
652
+ * axes and their weights beside the headline turns "43" into "recent, but
653
+ * shallow", which is a finding rather than a verdict.
654
+ */
655
+ declare function ScoreBreakdown({ score, max, axes, bands, formula, loading, labels: customLabels, className }: ScoreBreakdownProps): import("react").JSX.Element;
656
+ declare namespace ScoreBreakdown {
657
+ var displayName: string;
658
+ }
659
+ //#endregion
660
+ //#region src/shells/flyout.d.ts
661
+ /** Localized strings for the flyout. */
662
+ interface FlyoutLabels {
663
+ close?: string;
664
+ }
665
+ /** Props for the flyout component. */
666
+ interface FlyoutProps {
667
+ open: boolean;
668
+ onClose: () => void;
669
+ title?: ReactNode;
670
+ /** One line under the title — what this panel is showing. */
671
+ description?: ReactNode;
672
+ /**
673
+ * `overlay` floats the panel over the page. `inline` renders a plain
674
+ * `<aside>` and leaves placement to the parent's layout, which is how a
675
+ * list keeps both itself and the preview visible on a wide screen.
676
+ */
677
+ type?: "overlay" | "inline";
678
+ side?: "right" | "left";
679
+ size?: "sm" | "md" | "lg";
680
+ /** Controls above the close button — "open full page", "next record". */
681
+ actions?: ReactNode;
682
+ footer?: ReactNode;
683
+ /** Dim the page behind an overlay panel. Off by default: the list stays readable. */
684
+ scrim?: boolean;
685
+ closeOnOutsideClick?: boolean;
686
+ hideCloseButton?: boolean;
687
+ labels?: FlyoutLabels;
688
+ className?: string;
689
+ children: ReactNode;
690
+ }
691
+ /**
692
+ * Flyout — a detail panel that does not take the page away.
693
+ *
694
+ * Navigating from a list to a record and back costs the reader their scroll
695
+ * position, their filters and their place in the scan. A flyout keeps the list
696
+ * on screen and shows the record beside it, so comparing three rows is three
697
+ * clicks rather than six navigations.
698
+ *
699
+ * Deliberately **not** a modal: no focus trap, no `aria-modal`, no inert page.
700
+ * The list behind it is still the point, and a reader who tabs out of the panel
701
+ * to change a filter is doing the expected thing. Escape closes; focus returns
702
+ * to whatever opened it.
703
+ *
704
+ * @example
705
+ * ```tsx
706
+ * <Flyout open={Boolean(selected)} onClose={clear} title={selected?.name}>
707
+ * <DescriptionList items={fields} />
708
+ * </Flyout>
709
+ * ```
710
+ */
711
+ declare function Flyout({ open, onClose, title, description, type, side, size, actions, footer, scrim, closeOnOutsideClick, hideCloseButton, labels: customLabels, className, children }: FlyoutProps): import("react").JSX.Element | null;
712
+ declare namespace Flyout {
713
+ var displayName: string;
714
+ }
715
+ //#endregion
716
+ //#region src/lib/query/query-ast.d.ts
717
+ /**
718
+ * A search query, as a value.
719
+ *
720
+ * Free-text search and a row of filter pickers answer different halves of the
721
+ * same question, and neither can express the other: a picker cannot say "not
722
+ * this", and a text box cannot say "this field, exactly". A parsed query is one
723
+ * thing that does both, and — because it is a value rather than a widget's
724
+ * internal state — it survives a URL, a saved view, and the trip to a server
725
+ * that has to turn it into a database filter.
726
+ *
727
+ * The grammar follows the one analytics tools have converged on (Elastic's
728
+ * `EuiSearchBar`, Kibana, GitHub's issue search), minus the parts that only
729
+ * make sense against a Lucene index:
730
+ *
731
+ * error a term anywhere in the row
732
+ * "connection reset" a phrase, kept together
733
+ * -health a term that must not appear
734
+ * path:/checkout a field equal to a value
735
+ * path:(/a or /b) a field equal to any of several values
736
+ * -status:200 a field that must not equal a value
737
+ * status>=500 a comparison
738
+ * path:*checkout* the field contains this somewhere
739
+ * utm_source:* the field is present at all
740
+ *
741
+ * Clauses combine with AND; `or` only groups values inside one field. That is
742
+ * a deliberate ceiling: arbitrary boolean nesting reads worse than it queries,
743
+ * and every backend this targets can express the restricted form directly.
744
+ */
745
+ /** How a field clause compares. */
746
+ type QueryOperator = "eq" | "contains" | "gt" | "gte" | "lt" | "lte" | "exists";
747
+ /** A bare or quoted word matched against the whole row. */
748
+ interface QueryTermClause {
749
+ type: "term";
750
+ value: string;
751
+ negated: boolean;
752
+ }
753
+ /** A constraint on one named field. Several values read as "any of". */
754
+ interface QueryFieldClause {
755
+ type: "field";
756
+ field: string;
757
+ operator: QueryOperator;
758
+ values: string[];
759
+ negated: boolean;
760
+ }
761
+ type QueryClause = QueryTermClause | QueryFieldClause;
762
+ /** A parsed query: clauses combined with AND. */
763
+ interface Query {
764
+ clauses: QueryClause[];
765
+ }
766
+ declare const EMPTY_QUERY: Query;
767
+ /** Whether a query constrains anything at all. */
768
+ declare function isEmptyQuery(query: Query | null | undefined): boolean;
769
+ /** Add a clause unless an identical one is already there. */
770
+ declare function addClause(query: Query, clause: QueryClause): Query;
771
+ /**
772
+ * Constrain a field to a value — what a cell's "filter for this" action does.
773
+ *
774
+ * Applying the opposite of a constraint already present replaces it rather than
775
+ * adding it: `status:200` then "filter out 200" should read as one changed
776
+ * mind, not as a query that can never match.
777
+ */
778
+ declare function withFieldValue(query: Query, field: string, value: string, options?: {
779
+ negated?: boolean;
780
+ operator?: QueryOperator;
781
+ }): Query;
782
+ /** Drop every clause naming `field`. */
783
+ declare function withoutField(query: Query, field: string): Query;
784
+ /** Drop the clause at `index`, for a removable chip. */
785
+ declare function removeClause(query: Query, index: number): Query;
786
+ /** Every field the query names, in the order they first appear. */
787
+ declare function queryFields(query: Query): string[];
788
+ /** The values a field is constrained to, if any — for showing a filter as active. */
789
+ declare function fieldValues(query: Query, field: string): string[];
790
+ /** What a "filter for / filter out" control on a value asks for. */
791
+ interface QueryCellAction {
792
+ field: string;
793
+ value: string;
794
+ intent: "include" | "exclude";
795
+ }
796
+ /**
797
+ * Fold a cell action into the query.
798
+ *
799
+ * The pair of buttons on a log cell is the fastest path from "I noticed this
800
+ * value" to a filtered view, and the reason it works is that the result is a
801
+ * query the reader can then see, edit and share — not a hidden filter stack
802
+ * with its own rules.
803
+ */
804
+ declare function applyCellAction(query: Query, action: QueryCellAction): Query;
805
+ //#endregion
806
+ //#region src/shells/query-bar.d.ts
807
+ /** A field the query can constrain, offered as a completion. */
808
+ interface QueryField {
809
+ name: string;
810
+ /** Shown beside the name — a type, a count, whatever tells them apart. */
811
+ hint?: string;
812
+ /** Known values, offered once the reader has typed `field:`. */
813
+ values?: string[];
814
+ }
815
+ /** Localized strings for the query bar. */
816
+ interface QueryBarLabels {
817
+ placeholder?: string;
818
+ ariaLabel?: string;
819
+ clear?: string;
820
+ removeClause?: (clause: string) => string;
821
+ fieldsHeading?: string;
822
+ valuesHeading?: string;
823
+ syntaxHint?: ReactNode;
824
+ }
825
+ interface QueryBarProps {
826
+ value: Query;
827
+ onChange: (query: Query) => void;
828
+ /** Fields offered as completions, with their known values. */
829
+ fields?: QueryField[];
830
+ /** Show each clause as a removable chip below the input. */
831
+ showClauses?: boolean;
832
+ /** Commit on every keystroke instead of on Enter and blur. */
833
+ live?: boolean;
834
+ disabled?: boolean;
835
+ className?: string;
836
+ labels?: QueryBarLabels;
837
+ }
838
+ /**
839
+ * QueryBar — one control for "find this" and "only these".
840
+ *
841
+ * A search box and a row of filter pickers answer halves of the same question
842
+ * and neither can express the other, so people end up using both and holding
843
+ * the combination in their head. Typing the filter is what closes that: the
844
+ * whole question is one string, which means it can be read back, corrected in
845
+ * place, pasted to a colleague, and stored in a URL.
846
+ *
847
+ * The text is the source of truth while the reader is typing; the parsed query
848
+ * is committed on Enter or blur. Anything half-written parses to a plain term
849
+ * rather than an error, so the bar never argues with someone mid-word.
850
+ *
851
+ * @example
852
+ * ```tsx
853
+ * <QueryBar
854
+ * value={query}
855
+ * onChange={setQuery}
856
+ * fields={[{ name: "path", values: ["/checkout", "/cart"] }]}
857
+ * showClauses
858
+ * />
859
+ * ```
860
+ */
861
+ declare function QueryBar({ value, onChange, fields, showClauses, live, disabled, className, labels: customLabels }: QueryBarProps): import("react").JSX.Element;
862
+ declare namespace QueryBar {
863
+ var displayName: string;
864
+ }
865
+ //#endregion
494
866
  //#region src/shells/time-range-control.d.ts
495
867
  /** A named window offered in the quick-select list. */
496
868
  interface TimeRangePreset {
@@ -826,156 +1198,6 @@ declare const LogTable: <Row>(props: LogTableProps<Row> & {
826
1198
  ref?: Ref<LogTableHandle>;
827
1199
  }) => ReturnType<typeof LogTableInner>;
828
1200
  //#endregion
829
- //#region src/lib/query/query-ast.d.ts
830
- /**
831
- * A search query, as a value.
832
- *
833
- * Free-text search and a row of filter pickers answer different halves of the
834
- * same question, and neither can express the other: a picker cannot say "not
835
- * this", and a text box cannot say "this field, exactly". A parsed query is one
836
- * thing that does both, and — because it is a value rather than a widget's
837
- * internal state — it survives a URL, a saved view, and the trip to a server
838
- * that has to turn it into a database filter.
839
- *
840
- * The grammar follows the one analytics tools have converged on (Elastic's
841
- * `EuiSearchBar`, Kibana, GitHub's issue search), minus the parts that only
842
- * make sense against a Lucene index:
843
- *
844
- * error a term anywhere in the row
845
- * "connection reset" a phrase, kept together
846
- * -health a term that must not appear
847
- * path:/checkout a field equal to a value
848
- * path:(/a or /b) a field equal to any of several values
849
- * -status:200 a field that must not equal a value
850
- * status>=500 a comparison
851
- * path:*checkout* the field contains this somewhere
852
- * utm_source:* the field is present at all
853
- *
854
- * Clauses combine with AND; `or` only groups values inside one field. That is
855
- * a deliberate ceiling: arbitrary boolean nesting reads worse than it queries,
856
- * and every backend this targets can express the restricted form directly.
857
- */
858
- /** How a field clause compares. */
859
- type QueryOperator = "eq" | "contains" | "gt" | "gte" | "lt" | "lte" | "exists";
860
- /** A bare or quoted word matched against the whole row. */
861
- interface QueryTermClause {
862
- type: "term";
863
- value: string;
864
- negated: boolean;
865
- }
866
- /** A constraint on one named field. Several values read as "any of". */
867
- interface QueryFieldClause {
868
- type: "field";
869
- field: string;
870
- operator: QueryOperator;
871
- values: string[];
872
- negated: boolean;
873
- }
874
- type QueryClause = QueryTermClause | QueryFieldClause;
875
- /** A parsed query: clauses combined with AND. */
876
- interface Query {
877
- clauses: QueryClause[];
878
- }
879
- declare const EMPTY_QUERY: Query;
880
- /** Whether a query constrains anything at all. */
881
- declare function isEmptyQuery(query: Query | null | undefined): boolean;
882
- /** Add a clause unless an identical one is already there. */
883
- declare function addClause(query: Query, clause: QueryClause): Query;
884
- /**
885
- * Constrain a field to a value — what a cell's "filter for this" action does.
886
- *
887
- * Applying the opposite of a constraint already present replaces it rather than
888
- * adding it: `status:200` then "filter out 200" should read as one changed
889
- * mind, not as a query that can never match.
890
- */
891
- declare function withFieldValue(query: Query, field: string, value: string, options?: {
892
- negated?: boolean;
893
- operator?: QueryOperator;
894
- }): Query;
895
- /** Drop every clause naming `field`. */
896
- declare function withoutField(query: Query, field: string): Query;
897
- /** Drop the clause at `index`, for a removable chip. */
898
- declare function removeClause(query: Query, index: number): Query;
899
- /** Every field the query names, in the order they first appear. */
900
- declare function queryFields(query: Query): string[];
901
- /** The values a field is constrained to, if any — for showing a filter as active. */
902
- declare function fieldValues(query: Query, field: string): string[];
903
- /** What a "filter for / filter out" control on a value asks for. */
904
- interface QueryCellAction {
905
- field: string;
906
- value: string;
907
- intent: "include" | "exclude";
908
- }
909
- /**
910
- * Fold a cell action into the query.
911
- *
912
- * The pair of buttons on a log cell is the fastest path from "I noticed this
913
- * value" to a filtered view, and the reason it works is that the result is a
914
- * query the reader can then see, edit and share — not a hidden filter stack
915
- * with its own rules.
916
- */
917
- declare function applyCellAction(query: Query, action: QueryCellAction): Query;
918
- //#endregion
919
- //#region src/shells/query-bar.d.ts
920
- /** A field the query can constrain, offered as a completion. */
921
- interface QueryField {
922
- name: string;
923
- /** Shown beside the name — a type, a count, whatever tells them apart. */
924
- hint?: string;
925
- /** Known values, offered once the reader has typed `field:`. */
926
- values?: string[];
927
- }
928
- /** Localized strings for the query bar. */
929
- interface QueryBarLabels {
930
- placeholder?: string;
931
- ariaLabel?: string;
932
- clear?: string;
933
- removeClause?: (clause: string) => string;
934
- fieldsHeading?: string;
935
- valuesHeading?: string;
936
- syntaxHint?: ReactNode;
937
- }
938
- interface QueryBarProps {
939
- value: Query;
940
- onChange: (query: Query) => void;
941
- /** Fields offered as completions, with their known values. */
942
- fields?: QueryField[];
943
- /** Show each clause as a removable chip below the input. */
944
- showClauses?: boolean;
945
- /** Commit on every keystroke instead of on Enter and blur. */
946
- live?: boolean;
947
- disabled?: boolean;
948
- className?: string;
949
- labels?: QueryBarLabels;
950
- }
951
- /**
952
- * QueryBar — one control for "find this" and "only these".
953
- *
954
- * A search box and a row of filter pickers answer halves of the same question
955
- * and neither can express the other, so people end up using both and holding
956
- * the combination in their head. Typing the filter is what closes that: the
957
- * whole question is one string, which means it can be read back, corrected in
958
- * place, pasted to a colleague, and stored in a URL.
959
- *
960
- * The text is the source of truth while the reader is typing; the parsed query
961
- * is committed on Enter or blur. Anything half-written parses to a plain term
962
- * rather than an error, so the bar never argues with someone mid-word.
963
- *
964
- * @example
965
- * ```tsx
966
- * <QueryBar
967
- * value={query}
968
- * onChange={setQuery}
969
- * fields={[{ name: "path", values: ["/checkout", "/cart"] }]}
970
- * showClauses
971
- * />
972
- * ```
973
- */
974
- declare function QueryBar({ value, onChange, fields, showClauses, live, disabled, className, labels: customLabels }: QueryBarProps): import("react").JSX.Element;
975
- declare namespace QueryBar {
976
- var displayName: string;
977
- }
978
- //#endregion
979
1201
  //#region src/shells/field-sidebar.d.ts
980
1202
  /** One value a field takes, with how often. */
981
1203
  interface FieldValueCount {
@@ -1066,5 +1288,4 @@ declare namespace FieldSidebar {
1066
1288
  var displayName: string;
1067
1289
  }
1068
1290
  //#endregion
1069
- export { FailureListProps as $, LogTable as A, SidebarNav as At, TimeRangeControlLabels as B, CommandPaletteTrigger as Bt, withFieldValue as C, SettingsFormProps as Ct, LogColumnPriority as D, ContentTabsProps as Dt, LogColumn as E, ContentTabs as Et, TimeSeriesPanelLabels as F, StatusSelectProps as Ft, WorkflowCanvasProps as G, TimeRangePreset as H, CommandPalette as Ht, TimeSeriesPanelProps as I, SearchCombobox as It, KeyValueEditorLabels as J, WorkflowCanvasStep as K, DEFAULT_TIME_PRESETS as L, SearchComboboxProps as Lt, LogTableLabels as M, AppMenubar as Mt, LogTableProps as N, AppMenubarProps as Nt, LogDensity as O, EditorToolbar as Ot, TimeSeriesPanel as P, StatusSelect as Pt, FailureListLabels as Q, RefreshSetting as R, DashboardGrid as Rt, removeClause as S, SettingsForm as St, LogCellAction as T, FaqAccordionProps as Tt, WorkflowCanvas as U, CommandPaletteProps as Ut, TimeRangeControlProps as V, CommandPaletteTriggerProps as Vt, WorkflowCanvasConnection as W, KeyValueEntry as X, KeyValueEditorProps as Y, FailureList as Z, addClause as _, EnvPanelProps as _t, FieldValueCount as a, ToastProviderProps as at, isEmptyQuery as b, DeploymentTimeline as bt, QueryBarProps as c, useToast as ct, Query as d, DataTableProps as dt, NotificationToast as et, QueryCellAction as f, DomainTable as ft, QueryTermClause as g, EnvPanel as gt, QueryOperator as h, BranchSelectProps as ht, FieldSummary as i, ToastProvider as it, LogTableHandle as j, SidebarNavProps as jt, LogSort as k, EditorToolbarProps as kt, QueryField as l, ColumnDef as lt, QueryFieldClause as m, BranchSelect as mt, FieldSidebarLabels as n, ToastContextValue as nt, QueryBar as o, ToastVariant as ot, QueryClause as p, DomainTableProps as pt, KeyValueEditor as q, FieldSidebarProps as r, ToastMessage as rt, QueryBarLabels as s, toast as st, FieldSidebar as t, ToastAction as tt, EMPTY_QUERY as u, DataTable as ut, applyCellAction as v, ProjectSwitcher as vt, withoutField as w, FaqAccordion as wt, queryFields as x, DeploymentTimelineProps as xt, fieldValues as y, ProjectSwitcherProps as yt, TimeRangeControl as z, DashboardGridProps as zt };
1070
- //# sourceMappingURL=field-sidebar-DWfJAJlx.d.ts.map
1291
+ export { EventTimelineItem as $, DashboardGridProps as $t, QueryCellAction as A, EnvPanel as At, removeClause as B, ContentTabs as Bt, TimeRangePreset as C, ColumnDef as Ct, QueryField as D, DomainTableProps as Dt, QueryBarProps as E, DomainTable as Et, addClause as F, DeploymentTimelineProps as Ft, FlyoutProps as G, SidebarNavProps as Gt, withoutField as H, EditorToolbar as Ht, applyCellAction as I, SettingsForm as It, ScoreBreakdown as J, StatusSelect as Jt, ScoreAxis as K, AppMenubar as Kt, fieldValues as L, SettingsFormProps as Lt, QueryFieldClause as M, ProjectSwitcher as Mt, QueryOperator as N, ProjectSwitcherProps as Nt, EMPTY_QUERY as O, BranchSelect as Ot, QueryTermClause as P, DeploymentTimeline as Pt, EventTimelineGroup as Q, DashboardGrid as Qt, isEmptyQuery as R, FaqAccordion as Rt, TimeRangeControlProps as S, useToast as St, QueryBarLabels as T, DataTableProps as Tt, Flyout as U, EditorToolbarProps as Ut, withFieldValue as V, ContentTabsProps as Vt, FlyoutLabels as W, SidebarNav as Wt, ScoreBreakdownProps as X, SearchCombobox as Xt, ScoreBreakdownLabels as Y, StatusSelectProps as Yt, EventTimeline as Z, SearchComboboxProps as Zt, TimeSeriesPanelProps as _, ToastMessage as _t, FieldValueCount as a, WorkflowCanvasProps as at, TimeRangeControl as b, ToastVariant as bt, LogColumnPriority as c, KeyValueEditorLabels as ct, LogTable as d, FailureList as dt, CommandPaletteTrigger as en, EventTimelineLabels as et, LogTableHandle as f, FailureListLabels as ft, TimeSeriesPanelLabels as g, ToastContextValue as gt, TimeSeriesPanel as h, ToastAction as ht, FieldSummary as i, WorkflowCanvasConnection as it, QueryClause as j, EnvPanelProps as jt, Query as k, BranchSelectProps as kt, LogDensity as l, KeyValueEditorProps as lt, LogTableProps as m, NotificationToast as mt, FieldSidebarLabels as n, CommandPalette as nn, EventTimelineTone as nt, LogCellAction as o, WorkflowCanvasStep as ot, LogTableLabels as p, FailureListProps as pt, ScoreBand as q, AppMenubarProps as qt, FieldSidebarProps as r, CommandPaletteProps as rn, WorkflowCanvas as rt, LogColumn as s, KeyValueEditor as st, FieldSidebar as t, CommandPaletteTriggerProps as tn, EventTimelineProps as tt, LogSort as u, KeyValueEntry as ut, DEFAULT_TIME_PRESETS as v, ToastProvider as vt, QueryBar as w, DataTable as wt, TimeRangeControlLabels as x, toast as xt, RefreshSetting as y, ToastProviderProps as yt, queryFields as z, FaqAccordionProps as zt };