@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.
- package/COMPONENT_CATALOG.md +522 -218
- package/README.md +61 -7
- package/dist/core/index.cjs +10 -8
- package/dist/core/index.d.cts +3 -3
- package/dist/core/index.d.ts +3 -3
- package/dist/core/index.js +3 -3
- package/dist/docs/02-components/01-core.md +213 -96
- package/dist/docs/02-components/02-visuals.md +1 -1
- package/dist/docs/02-components/03-shells.md +334 -123
- package/dist/docs/02-components/04-surfaces.md +1 -1
- package/dist/docs/02-components/index.md +5 -5
- package/dist/docs/03-recipes/02-dashboards.md +126 -10
- package/dist/{field-sidebar-B6Ndr8HE.cjs → field-sidebar-BYgEmdy0.cjs} +2128 -1558
- package/dist/{field-sidebar-BXjvV7Cz.js → field-sidebar-BuO37l4c.js} +2111 -1561
- package/dist/{field-sidebar-nwcE9LC4.d.cts → field-sidebar-CrYlRZew.d.ts} +375 -154
- package/dist/{field-sidebar-DWfJAJlx.d.ts → field-sidebar-uXmoyvd7.d.cts} +375 -154
- package/dist/id-registry.cjs +124 -12
- package/dist/id-registry.d.cts +1 -2
- package/dist/id-registry.d.ts +1 -2
- package/dist/id-registry.js +124 -14
- package/dist/id-registry.json +265 -31
- package/dist/index.cjs +1162 -253
- package/dist/index.d.cts +573 -60
- package/dist/index.d.ts +573 -60
- package/dist/index.js +1134 -242
- package/dist/{key-pad-menu-DfZbeXhG.d.cts → key-pad-menu-CwcY_Vps.d.cts} +151 -7
- package/dist/{key-pad-menu-BQunU20e.js → key-pad-menu-Di2aRGbM.js} +388 -461
- package/dist/{key-pad-menu-D5mQcS5v.cjs → key-pad-menu-SItoHPLu.cjs} +490 -609
- package/dist/{key-pad-menu-BsgJMjD4.d.ts → key-pad-menu-WBJShCJn.d.ts} +152 -8
- package/dist/meta.cjs +1304 -168
- package/dist/meta.d.cts +12 -36
- package/dist/meta.d.ts +12 -36
- package/dist/meta.js +1304 -170
- package/dist/query.d.cts +1 -2
- package/dist/query.d.ts +1 -2
- package/dist/query.js +0 -2
- package/dist/shells/index.cjs +4 -1
- package/dist/shells/index.d.cts +2 -2
- package/dist/shells/index.d.ts +2 -2
- package/dist/shells/index.js +2 -2
- package/dist/{text-truncate-BGr7bB_8.d.cts → text-truncate-CQyfUZvq.d.cts} +48 -5
- package/dist/{text-truncate-BGr7bB_8.d.ts → text-truncate-CQyfUZvq.d.ts} +48 -5
- package/dist/{text-truncate-j6X3z7Pv.js → text-truncate-DSuZECy0.js} +446 -94
- package/dist/{text-truncate-CxdzAnhS.cjs → text-truncate-I1XLWmRa.cjs} +522 -90
- package/dist/theme/server.d.cts +1 -2
- package/dist/theme/server.d.ts +1 -2
- package/dist/theme/server.js +0 -2
- package/dist/visuals/index.js +0 -1
- package/package.json +4 -3
- package/dist/field-sidebar-BXjvV7Cz.js.map +0 -1
- package/dist/field-sidebar-DWfJAJlx.d.ts.map +0 -1
- package/dist/field-sidebar-nwcE9LC4.d.cts.map +0 -1
- package/dist/id-registry.d.cts.map +0 -1
- package/dist/id-registry.d.ts.map +0 -1
- package/dist/id-registry.js.map +0 -1
- package/dist/index.d.cts.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/index.js.map +0 -1
- package/dist/key-pad-menu-BQunU20e.js.map +0 -1
- package/dist/key-pad-menu-BsgJMjD4.d.ts.map +0 -1
- package/dist/key-pad-menu-DfZbeXhG.d.cts.map +0 -1
- package/dist/meta.d.cts.map +0 -1
- package/dist/meta.d.ts.map +0 -1
- package/dist/meta.js.map +0 -1
- package/dist/query.d.cts.map +0 -1
- package/dist/query.d.ts.map +0 -1
- package/dist/query.js.map +0 -1
- package/dist/text-truncate-BGr7bB_8.d.cts.map +0 -1
- package/dist/text-truncate-BGr7bB_8.d.ts.map +0 -1
- package/dist/text-truncate-j6X3z7Pv.js.map +0 -1
- package/dist/theme/server.d.cts.map +0 -1
- package/dist/theme/server.d.ts.map +0 -1
- package/dist/theme/server.js.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
import {
|
|
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.js";
|
|
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 {
|
|
1070
|
-
//# sourceMappingURL=field-sidebar-nwcE9LC4.d.cts.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 };
|