@flanksource/clicky-ui 0.3.38 → 0.3.40

package/README.md

@@ -5,10 +5,10 @@ Flanksource's React component library built on [shadcn/ui](https://ui.shadcn.com
 ## Install
 
 ```bash
-pnpm add @flanksource/clicky-ui react react-dom tailwindcss
-npm install @flanksource/clicky-ui react react-dom tailwindcss
-yarn add @flanksource/clicky-ui react react-dom tailwindcss
-bun add @flanksource/clicky-ui react react-dom tailwindcss
+pnpm add @flanksource/clicky-ui @tanstack/react-query react react-dom tailwindcss
+npm install @flanksource/clicky-ui @tanstack/react-query react react-dom tailwindcss
+yarn add @flanksource/clicky-ui @tanstack/react-query react react-dom tailwindcss
+bun add @flanksource/clicky-ui @tanstack/react-query react react-dom tailwindcss
 ```
 
 ## Usage
@@ -54,6 +54,42 @@ export function ClickyPanel() {
 
 `OperationCatalog` and `EntityExplorerApp` (both exported from `@flanksource/clicky-ui/rpc`) render an OpenAPI spec — fetched via an `OperationsApiClient` — as a navigable list of operations grouped by entity surface. They expect the spec to declare `x-clicky` surface metadata for the surfaces they should expose. See `apps/kitchen-sink/src/demos/OperationExplorerDemo.tsx` for a fake-client example.
 
+## Timeseries widgets and WorkloadCard
+
+`TimeseriesPanel`, `TimeseriesGauge`, `TimeseriesCoreBars` and `WorkloadCard` (from `@flanksource/clicky-ui/data`) poll their series with `@tanstack/react-query`, so they **must render under the host application's `QueryClientProvider`**. React Query v5 is a required peer dependency, ensuring clicky-ui and its host use the same Query Client context rather than installing isolated copies.
+
+Each series is either URL-backed (`baseUrl + id`, loaded through `fetcher(url)`) or function-backed via `load`:
+
+```tsx
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { WorkloadCard } from "@flanksource/clicky-ui/data";
+
+const queryClient = new QueryClient();
+
+<QueryClientProvider client={queryClient}>
+  <WorkloadCard
+    workload={{
+      type: "EC2 instance",
+      name: "build-runner-1",
+      status: { label: "running", health: "healthy" },
+      metadata: [{ label: "region", value: "us-east-1" }],
+    }}
+    metrics={{
+      cpu: {
+        value: {
+          id: "i-0a1b2c3d.cpu", // cache identity: unique per data source
+          load: ({ range, signal }) =>
+            api.instanceCpu("i-0a1b2c3d", { range, signal }),
+        },
+        max: 4000,
+      },
+    }}
+  />
+</QueryClientProvider>;
+```
+
+A `load`-backed series is cached under `["timeseries", "load", id, range]`: **the `id` is the cache identity**, so two series that share an id share one cached response. The loader receives the widget's `range` and react-query's `AbortSignal`, which aborts when the query is cancelled (for example on unmount). URL-backed series keep their `["timeseries", requestUrl]` key. See the [timeseries guide](../../apps/docs/src/content/docs/guides/timeseries.md) for details.
+
 ## Markdown editor field
 
 `JsonSchemaForm` fields with `format: md` — and the standalone `MdxEditorField` exported from `@flanksource/clicky-ui/mdx-editor` — render an [MDXEditor](https://mdxeditor.dev/)-backed rich-text field. Its base styles ship as a **separate** stylesheet so apps that don't use the field don't pay its weight (the editor's JavaScript is also loaded lazily, on first render). Import it once at the app root, in addition to `styles.css`:

package/dist/ai.d.ts

@@ -1,2 +1,2 @@
-export * from './data/ai';
+export * from './data/ai/index.js';
 //# sourceMappingURL=ai.d.ts.map

package/dist/chat.d.ts

@@ -1,2 +1,2 @@
-export * from './data/chat';
+export * from './data/chat/index.js';
 //# sourceMappingURL=chat.d.ts.map

package/dist/clicky.d.ts

@@ -1,2 +1,2 @@
-export { Clicky, ClickyNodeView, ClickyTable, type ClickyCommandRequest, type ClickyCommandRuntime, type ClickyLinkTarget, type ClickyResolvedCommand, type ClickyColumn, type ClickyDownloadOptions, type ClickyDownloadScope, type ClickyDocument, type ClickyField, type ClickyNode, type ClickyNodeViewProps, type ClickyProps, type ClickyRemoteFormat, type ClickyRow, type ClickyRowDetailRenderer, type ClickyStyle, type ClickyTableProps, type ClickyTableRowHref, type ClickyTableRowClick, type ClickyTableRowPredicate, type ClickyTableRowSelection, type ClickyTreeItem, type ClickyViewOptions, } from './data/Clicky';
+export { Clicky, ClickyNodeView, ClickyTable, type ClickyCommandRequest, type ClickyCommandRuntime, type ClickyLinkTarget, type ClickyResolvedCommand, type ClickyColumn, type ClickyDownloadOptions, type ClickyDownloadScope, type ClickyDocument, type ClickyField, type ClickyNode, type ClickyNodeViewProps, type ClickyProps, type ClickyRemoteFormat, type ClickyRow, type ClickyRowDetailRenderer, type ClickyStyle, type ClickyTableProps, type ClickyTableRowHref, type ClickyTableRowClick, type ClickyTableRowPredicate, type ClickyTableRowSelection, type ClickyTreeItem, type ClickyViewOptions, } from './data/Clicky.js';
 //# sourceMappingURL=clicky.d.ts.map

package/dist/comments/CommentAuthor.d.ts

@@ -1,5 +1,5 @@
-import { SizeToken } from '../lib/size';
-import { CommentAuthor as CommentAuthorModel } from './comment-types';
+import { SizeToken } from '../lib/size.js';
+import { CommentAuthor as CommentAuthorModel } from './comment-types.js';
 export type CommentAuthorAvatarProps = {
     /** Author to render; null renders an anonymous user. */
     author: CommentAuthorModel | null;

package/dist/comments/CommentCard.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { Comment, CommentConfig } from './comment-types';
+import { Comment, CommentConfig } from './comment-types.js';
 export type CommentCardProps = {
     comment: Comment;
     config: CommentConfig;

package/dist/comments/CommentCardParts.d.ts

@@ -1,4 +1,4 @@
-import { Comment, CommentConfig, CommentRating } from './comment-types';
+import { Comment, CommentConfig, CommentRating } from './comment-types.js';
 export declare function RatingChip({ rating }: {
     rating: CommentRating | undefined;
 }): import("react").JSX.Element | null;

package/dist/comments/CommentComposer.d.ts

@@ -1,4 +1,4 @@
-import { CommentAnchor, CommentConfig, CommentCreateAction, CommentCreateInput, CommentMention } from './comment-types';
+import { CommentAnchor, CommentConfig, CommentCreateAction, CommentCreateInput, CommentMention } from './comment-types.js';
 export type CommentComposerProps = {
     config: CommentConfig;
     /** Anchor stamped onto created comments. */

package/dist/comments/CommentFilterBar.d.ts

@@ -1,4 +1,4 @@
-import { CommentConfig, CommentFilters } from './comment-types';
+import { CommentConfig, CommentFilters } from './comment-types.js';
 export type CommentFilterBarProps = {
     config: CommentConfig;
     filters: CommentFilters;

package/dist/comments/CommentProgress.d.ts

@@ -1,4 +1,4 @@
-import { Comment, CommentConfig } from './comment-types';
+import { Comment, CommentConfig } from './comment-types.js';
 export type CommentProgressProps = {
     comments: Comment[];
     config: CommentConfig;

package/dist/comments/CommentProvider.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { AnchorResolver, CommentRailMode } from './comment-context';
-import { Comment, CommentCallbacks, CommentConfig } from './comment-types';
+import { AnchorResolver, CommentRailMode } from './comment-context.js';
+import { Comment, CommentCallbacks, CommentConfig } from './comment-types.js';
 export type CommentProviderProps = CommentCallbacks & {
     children: ReactNode;
     /** All comments for the document; counts and metadata are derived from these. */

package/dist/comments/CommentSidePanel.d.ts

@@ -1,4 +1,4 @@
-import { Comment, CommentAnchor, CommentCreateAction } from './comment-types';
+import { Comment, CommentAnchor, CommentCreateAction } from './comment-types.js';
 export type CommentSidePanelProps = {
     /** Explicit label per anchor key. */
     anchorLabels?: Record<CommentAnchor, string>;

package/dist/comments/CommentThread.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { Comment, CommentAnchor, CommentCallbacks, CommentConfig, CommentCreateAction } from './comment-types';
+import { Comment, CommentAnchor, CommentCallbacks, CommentConfig, CommentCreateAction } from './comment-types.js';
 export type CommentThreadProps = CommentCallbacks & {
     /** Comments for this thread (typically pre-filtered to one anchor). */
     comments: Comment[];

package/dist/comments/CommentThreadList.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes, ReactNode } from 'react';
-import { Comment, CommentConfig } from './comment-types';
+import { Comment, CommentConfig } from './comment-types.js';
 export type CommentThreadListProps = {
     comments: Comment[];
     config: CommentConfig;

package/dist/comments/GroupedComments.d.ts

@@ -1,4 +1,4 @@
-import { Comment, CommentCallbacks, CommentConfig } from './comment-types';
+import { Comment, CommentCallbacks, CommentConfig } from './comment-types.js';
 export type GroupedCommentsProps = CommentCallbacks & {
     comments: Comment[];
     config: CommentConfig;

package/dist/comments/MentionTextarea.d.ts

@@ -1,4 +1,4 @@
-import { CommentMention, CommentMentionable } from './comment-types';
+import { CommentMention, CommentMentionable } from './comment-types.js';
 export type MentionTextareaProps = {
     /** Controlled value. */
     value: string;

package/dist/comments/comment-context.d.ts

@@ -1,5 +1,5 @@
 import { RefObject } from 'react';
-import { Comment, CommentAnchor, CommentAnchorMeta, CommentCallbacks, CommentConfig } from './comment-types';
+import { Comment, CommentAnchor, CommentAnchorMeta, CommentCallbacks, CommentConfig } from './comment-types.js';
 export type CommentRailMode = "closed" | "focused" | "all";
 export type CommentScrollOptions = {
     behavior?: ScrollBehavior;

package/dist/comments/comment-fixtures.d.ts

@@ -1,4 +1,4 @@
-import { Comment, CommentAuthor, CommentCallbacks, CommentConfig } from './comment-types';
+import { Comment, CommentAuthor, CommentCallbacks, CommentConfig } from './comment-types.js';
 export declare const ME: CommentAuthor;
 export declare const sampleConfig: CommentConfig;
 export declare const sampleComments: Comment[];

package/dist/comments/comment-types.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 /** Semantic tone driving a status/facet color (maps onto Badge tones). */
 export type CommentTone = "default" | "info" | "success" | "warning" | "danger" | "neutral";
 /** Product lifecycle stage represented by one or more stored statuses. */

package/dist/comments/comment-utils.d.ts

@@ -1,5 +1,5 @@
-import { BadgeTone } from '../data/Badge';
-import { Comment, CommentAnchor, CommentAnchorMeta, CommentAuthor, CommentCallbacks, CommentConfig, CommentFacet, CommentFacetOption, CommentFilters, CommentMention, CommentMentionable, CommentStatusConfig, CommentTone } from './comment-types';
+import { BadgeTone } from '../data/Badge.js';
+import { Comment, CommentAnchor, CommentAnchorMeta, CommentAuthor, CommentCallbacks, CommentConfig, CommentFacet, CommentFacetOption, CommentFilters, CommentMention, CommentMentionable, CommentStatusConfig, CommentTone } from './comment-types.js';
 /** Human-readable name for an author, falling back to "Unknown". */
 export declare function authorDisplayName(author: CommentAuthor | null): string;
 /** Maps a CommentTone onto the Badge component's tone vocabulary. */

package/dist/comments.d.ts

@@ -1,17 +1,17 @@
-export * from './comments/comment-types';
-export * from './comments/comment-utils';
-export { resolveCommentStage, selectCommentThreadsByStage, statusForCommentStage, } from './lib/comment-stage';
-export { CommentMarkdown, type CommentMarkdownProps, } from './comments/CommentMarkdown';
-export { CommentAuthorAvatar, type CommentAuthorAvatarProps, } from './comments/CommentAuthor';
-export { MentionTextarea, type MentionTextareaProps, } from './comments/MentionTextarea';
-export { CommentCard, type CommentCardProps } from './comments/CommentCard';
-export { CommentComposer, type CommentComposerProps, } from './comments/CommentComposer';
-export { CommentThreadList, type CommentThreadListProps, } from './comments/CommentThreadList';
-export { CommentThread, type CommentThreadProps, } from './comments/CommentThread';
-export { CommentProvider, type CommentProviderProps } from './comments/CommentProvider';
-export { useCommentContext, useCommentContextOptional, useCommentAnchorOptional, useCommentAnchorActionsOptional, exactAnchorResolver, dottedAnchorResolver, strictAnchorResolver, type CommentContextValue, type CommentAnchorState, type CommentAnchorActions, type CommentRailMode, type AnchorResolver, type CommentScrollOptions, } from './comments/comment-context';
-export { CommentSidePanel, type CommentSidePanelProps, } from './comments/CommentSidePanel';
-export { GroupedComments, type GroupedCommentsProps, } from './comments/GroupedComments';
-export { CommentFilterBar, type CommentFilterBarProps, } from './comments/CommentFilterBar';
-export { CommentProgress, type CommentProgressProps, } from './comments/CommentProgress';
+export * from './comments/comment-types.js';
+export * from './comments/comment-utils.js';
+export { resolveCommentStage, selectCommentThreadsByStage, statusForCommentStage, } from './lib/comment-stage.js';
+export { CommentMarkdown, type CommentMarkdownProps, } from './comments/CommentMarkdown.js';
+export { CommentAuthorAvatar, type CommentAuthorAvatarProps, } from './comments/CommentAuthor.js';
+export { MentionTextarea, type MentionTextareaProps, } from './comments/MentionTextarea.js';
+export { CommentCard, type CommentCardProps } from './comments/CommentCard.js';
+export { CommentComposer, type CommentComposerProps, } from './comments/CommentComposer.js';
+export { CommentThreadList, type CommentThreadListProps, } from './comments/CommentThreadList.js';
+export { CommentThread, type CommentThreadProps, } from './comments/CommentThread.js';
+export { CommentProvider, type CommentProviderProps } from './comments/CommentProvider.js';
+export { useCommentContext, useCommentContextOptional, useCommentAnchorOptional, useCommentAnchorActionsOptional, exactAnchorResolver, dottedAnchorResolver, strictAnchorResolver, type CommentContextValue, type CommentAnchorState, type CommentAnchorActions, type CommentRailMode, type AnchorResolver, type CommentScrollOptions, } from './comments/comment-context.js';
+export { CommentSidePanel, type CommentSidePanelProps, } from './comments/CommentSidePanel.js';
+export { GroupedComments, type GroupedCommentsProps, } from './comments/GroupedComments.js';
+export { CommentFilterBar, type CommentFilterBarProps, } from './comments/CommentFilterBar.js';
+export { CommentProgress, type CommentProgressProps, } from './comments/CommentProgress.js';
 //# sourceMappingURL=comments.d.ts.map

package/dist/components/AccordionList.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { SizeToken } from '../lib/size';
+import { SizeToken } from '../lib/size.js';
 /** Handed to every slot, describing one row. */
 export interface AccordionListItemContext<T> {
     item: T;

package/dist/components/Combobox.d.ts

@@ -1,4 +1,4 @@
-import { ComboboxProps } from './combobox-types';
-export type { ComboboxMultiProps, ComboboxOption, ComboboxProps, ComboboxSingleProps, ComboboxTriStateMode, ComboboxTriStateProps, } from './combobox-types';
+import { ComboboxProps } from './combobox-types.js';
+export type { ComboboxMultiProps, ComboboxOption, ComboboxProps, ComboboxSingleProps, ComboboxTriStateMode, ComboboxTriStateProps, } from './combobox-types.js';
 export declare function Combobox(props: ComboboxProps): import("react").JSX.Element;
 //# sourceMappingURL=Combobox.d.ts.map

package/dist/components/ComboboxControl.d.ts

@@ -1,6 +1,6 @@
 import { ClipboardEvent, KeyboardEvent, ReactNode, RefObject } from 'react';
-import { FormSize } from './json-schema-form-size';
-import { ComboboxOption, ComboboxTriStateMode } from './combobox-types';
+import { FormSize } from './json-schema-form-size.js';
+import { ComboboxOption, ComboboxTriStateMode } from './combobox-types.js';
 export declare function ComboboxControl({ anchorRef, ariaLabel, ariaRequired, closedLabel, describedBy, disabled, displayValue, effectivePrefix, highlighted, id, inputRef, invalid, label, labelRef, labelWidth, listId, loading, onClear, onInput, onKeyDown, onOpen, onPaste, onRemoveTag, onSetTagMode, onToggle, open, options, placeholder, showClear, size, suffix, tagModes, tagValues, tags, }: {
     anchorRef: RefObject<HTMLDivElement | null>;
     ariaLabel: string | undefined;

package/dist/components/ComboboxMenu.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, RefObject } from 'react';
-import { ComboboxOption, ComboboxTriStateMode } from './combobox-types';
-import { ComboboxMenuPosition } from '../lib/combobox';
+import { ComboboxOption, ComboboxTriStateMode } from './combobox-types.js';
+import { ComboboxMenuPosition } from '../lib/combobox.js';
 export declare function ComboboxMenu({ customEntry, filtered, floatingZ, footer, hasOptions, highlighted, isSelected, listId, listRef, loading, menuPos, modes, multiple, onHighlight, onSelect, onSetMode, tristate, }: {
     customEntry: ComboboxOption | null;
     filtered: ComboboxOption[];

package/dist/components/ComboboxTags.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { ComboboxOption, ComboboxTriStateMode } from './combobox-types';
+import { ComboboxOption, ComboboxTriStateMode } from './combobox-types.js';
 export declare function ComboboxTags({ disabled, modes, onRemove, onSetMode, options, values, }: {
     disabled: boolean | undefined;
     /** Per-value include/exclude modes; set only in tristate mode. */

package/dist/components/ConnectionLoggingPolicy.d.ts

@@ -1,3 +1,3 @@
-import { ConnectionLoggingPolicyProps } from './ConnectionLoggingPolicy.model';
+import { ConnectionLoggingPolicyProps } from './ConnectionLoggingPolicy.model.js';
 export declare function ConnectionLoggingPolicy({ definition, value, onChange, readOnly, className, }: ConnectionLoggingPolicyProps): import("react").JSX.Element;
 //# sourceMappingURL=ConnectionLoggingPolicy.d.ts.map

package/dist/components/CountryPicker.d.ts

@@ -1,4 +1,4 @@
-import { ComboboxSingleProps } from './Combobox';
+import { ComboboxSingleProps } from './Combobox.js';
 export type CountryPickerProps = Omit<ComboboxSingleProps, "allowCustomValue" | "loading" | "multiple" | "onCreate" | "onNew" | "onSearch" | "options" | "prefix" | "tristate">;
 export declare function CountryPicker({ ariaLabel, invalid, placeholder, value, ...props }: CountryPickerProps): import("react").JSX.Element;
 //# sourceMappingURL=CountryPicker.d.ts.map

package/dist/components/EndpointSelector.d.ts

@@ -1,3 +1,3 @@
-import { EndpointSelectorProps } from './EndpointSelector.model';
+import { EndpointSelectorProps } from './EndpointSelector.model.js';
 export declare function EndpointSelector({ value, onChange, namespace, modes, defaultMode, loadWorkloads, allowNamespaceSelection, loadNamespaces, onNamespaceChange, urlSelector, modeKinds, defaults, preferredPorts, schemes, allowCustomScheme, allowCustomPort, showScheme, showPath, showIngressPort, className, }: EndpointSelectorProps): import("react").JSX.Element;
 //# sourceMappingURL=EndpointSelector.d.ts.map

package/dist/components/EndpointSelector.model.d.ts

@@ -1,7 +1,7 @@
-import { SecretKeySelectorProps, SecretKeyValue } from './SecretKeySelector';
-import { WorkloadKind, WorkloadResource } from './workload-picker-utils';
-import { WorkloadPickerProps } from './WorkloadPicker';
-import { NamespacePickerProps } from './NamespacePicker';
+import { SecretKeySelectorProps, SecretKeyValue } from './SecretKeySelector.js';
+import { WorkloadKind, WorkloadResource } from './workload-picker-utils.js';
+import { WorkloadPickerProps } from './WorkloadPicker.js';
+import { NamespacePickerProps } from './NamespacePicker.js';
 export type EndpointMode = "url" | "service" | "cluster-ip" | "api-proxy" | "ingress" | "port-forward";
 export type EndpointWorkloadMode = Exclude<EndpointMode, "url">;
 export type EndpointTarget = {

package/dist/components/FilterBar.d.ts

@@ -1,12 +1,12 @@
 import { ReactNode } from 'react';
-import { FilterBarMultiFilterMode } from './filter-bar-field-utils';
-import { FilterBarMultiFilter } from './filter-bar-multi';
-import { LabelIconSpec } from '../data/Icon';
-import { MultiSelectOption } from './MultiSelect';
-import { TimeRangePresetGroup } from './TimeRange';
-import { TriState, TriStateLabels } from './TriStateToggle';
-import { WorkloadKind, WorkloadResource } from './workload-picker-utils';
-export { TriStateMultiSelect, type TriStateMultiSelectProps, } from './filter-bar-multi';
+import { FilterBarMultiFilterMode } from './filter-bar-field-utils.js';
+import { FilterBarMultiFilter } from './filter-bar-multi.js';
+import { LabelIconSpec } from '../data/Icon.js';
+import { MultiSelectOption } from './MultiSelect.js';
+import { TimeRangePresetGroup } from './TimeRange.js';
+import { TriState, TriStateLabels } from './TriStateToggle.js';
+import { WorkloadKind, WorkloadResource } from './workload-picker-utils.js';
+export { TriStateMultiSelect, type TriStateMultiSelectProps, } from './filter-bar-multi.js';
 export type { FilterBarMultiFilter, FilterBarMultiFilterMode };
 export type FilterBarSearchProps = {
     /** Controlled search text. */

package/dist/components/FormLookupProvider.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { LookupFetcher } from './json-schema-form-types';
+import { LookupFetcher } from './json-schema-form-types.js';
 export declare function FormLookupProvider({ fetcher, children, }: {
     fetcher?: LookupFetcher;
     children: ReactNode;

package/dist/components/FormatOptionsDropdown.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { ButtonProps } from './button';
-import { FormatOption } from './format-options';
+import { ButtonProps } from './button.js';
+import { FormatOption } from './format-options.js';
 export type FormatOptionsDropdownProps = {
     /** Active format value. */
     value: string;

package/dist/components/IconButton.d.ts

@@ -1,5 +1,5 @@
 import { ButtonHTMLAttributes } from 'react';
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 export type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     /** Imported icon component to render. */
     icon: StaticIconComponent;

package/dist/components/ItemActions.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { SizeToken } from '../lib/size';
+import { SizeToken } from '../lib/size.js';
 export interface ItemActionsProps {
     /** Names the item in every action's accessible label ("Move Routes up"). */
     label: string;

package/dist/components/JSONPathField.d.ts

@@ -1,7 +1,7 @@
-import { InputFieldInputProps } from './InputField';
-import { JSONPathNode } from './jsonPathTree';
-import { JSONPathEvalRequest, JSONPathEvalResult } from './JSONPathPlayground';
-export type { JSONPathNode } from './jsonPathTree';
+import { InputFieldInputProps } from './InputField.js';
+import { JSONPathNode } from './jsonPathTree.js';
+import { JSONPathEvalRequest, JSONPathEvalResult } from './JSONPathPlayground.js';
+export type { JSONPathNode } from './jsonPathTree.js';
 export type JSONPathFieldProps = Omit<InputFieldInputProps, "onChange" | "suffix" | "value"> & {
     json?: unknown;
     value: string;

package/dist/components/JsonSchemaForm.d.ts

@@ -1,3 +1,3 @@
-import { JsonSchemaFormProps } from './json-schema-form-types';
+import { JsonSchemaFormProps } from './json-schema-form-types.js';
 export declare function JsonSchemaForm({ schema, value, onChange, rootValue, onRootChange, instancePath, errors, readOnly, inline, layout, size, idPrefix, hideReadOnlyFields, hideEmpty, autoSave, hiddenKeys, requiredFirst, title, pre, post, showPreferencesMenu, showFilter, persistPreferences, preferencesStorageKey, lookupFetcher, applyDefaults, }: JsonSchemaFormProps): import("react").JSX.Element;
 //# sourceMappingURL=JsonSchemaForm.d.ts.map

package/dist/components/ListMenu.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes, ReactNode } from 'react';
-import { ButtonProps } from './button';
-import { ListMenuSelection } from './use-list-menu-selection';
+import { ButtonProps } from './button.js';
+import { ListMenuSelection } from './use-list-menu-selection.js';
 export type ListMenuProps = HTMLAttributes<HTMLDivElement> & {
     /**
      * Enables multi-select. Pass the object returned by `useListMenuSelection`;

package/dist/components/MdxEditorCallout.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorJsxNode, MdxEditorRuntime } from './mdx-editor-options';
+import { MdxEditorJsxNode, MdxEditorRuntime } from './mdx-editor-options.js';
 /**
  * The callout as the author sees it while editing: the rendered box, with the
  * attributes that decide its tone on a control strip above it.

package/dist/components/MdxEditorField.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorFieldProps } from './mdx-editor-options';
-export type { MdxEditorAdmonitionOptions, MdxEditorCalloutOptions, MdxEditorCodeBlockEditorContext, MdxEditorCodeBlockEditorDescriptor, MdxEditorCodeBlockEditorProps, MdxEditorCodeBlockLanguage, MdxEditorCodeBlockOptions, MdxEditorCodeMirrorOptions, MdxEditorDiffModeOptions, MdxEditorFieldProps, MdxEditorHeadingLevel, MdxEditorImageOptions, MdxEditorImagePreviewHandler, MdxEditorImageUploadHandler, MdxEditorInsertJsx, MdxEditorJsxAttribute, MdxEditorJsxComponentDescriptor, MdxEditorJsxEditorProps, MdxEditorJsxNode, MdxEditorLinkOptions, MdxEditorPlugin, MdxEditorPluginOptions, MdxEditorRuntime, MdxEditorToolbarOptions, MdxEditorViewMode, } from './mdx-editor-options';
+import { MdxEditorFieldProps } from './mdx-editor-options.js';
+export type { MdxEditorAdmonitionOptions, MdxEditorCalloutOptions, MdxEditorCodeBlockEditorContext, MdxEditorCodeBlockEditorDescriptor, MdxEditorCodeBlockEditorProps, MdxEditorCodeBlockLanguage, MdxEditorCodeBlockOptions, MdxEditorCodeMirrorOptions, MdxEditorDiffModeOptions, MdxEditorFieldProps, MdxEditorHeadingLevel, MdxEditorImageOptions, MdxEditorImagePreviewHandler, MdxEditorImageUploadHandler, MdxEditorInsertJsx, MdxEditorJsxAttribute, MdxEditorJsxComponentDescriptor, MdxEditorJsxEditorProps, MdxEditorJsxNode, MdxEditorLinkOptions, MdxEditorPlugin, MdxEditorPluginOptions, MdxEditorRuntime, MdxEditorToolbarOptions, MdxEditorViewMode, } from './mdx-editor-options.js';
 export declare function MdxEditorField({ id, value, onChange, readOnly, disabled, size, placeholder, className, contentClassName, textareaClassName, "aria-label": ariaLabel, commitInitialMarkdownNormalize, ...pluginOptions }: MdxEditorFieldProps): import("react").JSX.Element;
 //# sourceMappingURL=MdxEditorField.d.ts.map

package/dist/components/MdxEditorToolbar.d.ts

@@ -1,4 +1,4 @@
-import { MdxEditorPluginOptions } from './mdx-editor-options';
+import { MdxEditorPluginOptions } from './mdx-editor-options.js';
 type MdxEditorModule = typeof import("@mdxeditor/editor");
 export declare function MdxEditorToolbar({ mdx, options, }: {
     mdx: MdxEditorModule;

package/dist/components/MultiSelect.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { LabelIconSpec } from '../data/Icon';
+import { LabelIconSpec } from '../data/Icon.js';
 export type MultiSelectOption = {
     /** Stable option value written into the selected value array. */
     value: string;

package/dist/components/OnePasswordSelector.d.ts

@@ -1,4 +1,4 @@
-import { OnePasswordLoaders } from './OnePasswordSelector.model';
+import { OnePasswordLoaders } from './OnePasswordSelector.model.js';
 export type OnePasswordSelectorProps = OnePasswordLoaders & {
     value: string;
     onChange: (reference: string) => void;

package/dist/components/ScheduleEditor.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { CronSuggestion } from './schedule-types';
+import { CronSuggestion } from './schedule-types.js';
 export interface ScheduleValue {
     cron: string;
     timezone: string;

package/dist/components/SearchInput.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { InputFieldInputProps } from './InputField';
+import { InputFieldInputProps } from './InputField.js';
 export type SearchInputProps = Omit<InputFieldInputProps, "onChange" | "prefix" | "type" | "value"> & {
     /** Controlled query value. */
     value: string;

package/dist/components/SecretFormField.d.ts

@@ -1,5 +1,5 @@
-import { FieldControl } from './json-schema-form-types';
-import { SecretFormExtensionOptions } from './secret-form-extension';
+import { FieldControl } from './json-schema-form-types.js';
+import { SecretFormExtensionOptions } from './secret-form-extension.js';
 export type SecretFormFieldProps = SecretFormExtensionOptions & {
     field: FieldControl;
     namespace: string;

package/dist/components/SecretKeySelector.d.ts

@@ -1,4 +1,4 @@
-import { OnePasswordLoaders } from './OnePasswordSelector.model';
+import { OnePasswordLoaders } from './OnePasswordSelector.model.js';
 /** Kinds that reference a named resource plus one of its keys. */
 export type SecretKind = "secret" | "configmap" | "helm";
 /** Every source the picker can emit, including the non-keyed ones. */

package/dist/components/SecretKeySelector.model.d.ts

@@ -1,4 +1,4 @@
-import { SecretKeyValue } from './SecretKeySelector';
+import { SecretKeyValue } from './SecretKeySelector.js';
 export declare function serializeSecretRef(value: SecretKeyValue | undefined): string;
 export declare function parseSecretRef(raw: unknown): SecretKeyValue | undefined;
 //# sourceMappingURL=SecretKeySelector.model.d.ts.map

package/dist/components/SegmentedControl.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { StaticIconComponent } from '../data/Icon';
+import { StaticIconComponent } from '../data/Icon.js';
 export type SegmentedSize = "sm" | "md" | "lg";
 export type SegmentedOption<T extends string = string> = {
     /** Stable value emitted on selection. */

package/dist/components/SplitButton.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
-import { ButtonProps } from './button';
-import { StaticIconComponent } from '../data/Icon';
-import { DropdownMenuItem } from '../overlay/DropdownMenu';
+import { ButtonProps } from './button.js';
+import { StaticIconComponent } from '../data/Icon.js';
+import { DropdownMenuItem } from '../overlay/DropdownMenu.js';
 export type SplitButtonProps = {
     /** Content of the primary action button. */
     label: ReactNode;

package/dist/components/TreePickerField.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, Ref } from 'react';
-import { TreeProps } from '../data/Tree';
-import { FormSize } from './json-schema-form-size';
+import { TreeProps } from '../data/Tree.js';
+import { FormSize } from './json-schema-form-size.js';
 export interface TreePickerFieldProps<T> {
     /** Root nodes of the tree to browse. */
     roots: T[];

package/dist/components/TriStateToggle.d.ts

@@ -1,4 +1,4 @@
-import { TriState } from './tri-state';
+import { TriState } from './tri-state.js';
 export type { TriState };
 export type TriStateLabels = {
     /** Label for the unset state. Defaults to "Any". */

package/dist/components/WorkloadPicker.d.ts

@@ -1,5 +1,5 @@
-import { NamespacePickerProps } from './NamespacePicker';
-import { WorkloadKind, WorkloadResource } from './workload-picker-utils';
+import { NamespacePickerProps } from './NamespacePicker.js';
+import { WorkloadKind, WorkloadResource } from './workload-picker-utils.js';
 export type WorkloadPickerProps = {
     /**
      * Controlled selected value — a `[namespace/]kind/name` key (see

package/dist/components/button.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 import { ButtonHTMLAttributes, ReactNode } from 'react';
-import { buttonVariants } from './button-variants';
+import { buttonVariants } from './button-variants.js';
 export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonVariants> & {
     /** Render the button styles onto the child element via Radix Slot. */
     asChild?: boolean;

package/dist/components/combobox-types.d.ts

@@ -1,6 +1,6 @@
 import { KeyboardEvent, ReactNode } from 'react';
-import { LabelIconSpec } from '../data/Icon';
-import { FormSize } from './json-schema-form-size';
+import { LabelIconSpec } from '../data/Icon.js';
+import { FormSize } from './json-schema-form-size.js';
 export type ComboboxOption = {
     value: string;
     /** Full label used for searching and in the open option menu. */

package/dist/components/endpoint-port.d.ts

@@ -1,4 +1,4 @@
-import { WorkloadPort } from './workload-picker-utils';
+import { WorkloadPort } from './workload-picker-utils.js';
 export declare const DEFAULT_PREFERRED_ENDPOINT_PORTS: readonly [80, 443, 8080];
 export declare function preferredEndpointPort(ports: readonly WorkloadPort[] | undefined, preferredPorts?: readonly number[]): string | undefined;
 //# sourceMappingURL=endpoint-port.d.ts.map

package/dist/components/filter-bar-field-utils.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
-import { FilterMode } from '../data/FilterPill';
-import { LabelIconSpec } from '../data/Icon';
-import { MultiSelectOption } from './MultiSelect';
+import { FilterMode } from '../data/FilterPill.js';
+import { LabelIconSpec } from '../data/Icon.js';
+import { MultiSelectOption } from './MultiSelect.js';
 export type FilterBarMultiFilterMode = Extract<FilterMode, "include" | "exclude">;
 export declare function mergeMultiSelectOptions(head: MultiSelectOption[], extra: MultiSelectOption[]): MultiSelectOption[];
 export declare function multiSelectOptionText(option: MultiSelectOption): string;

package/dist/components/filter-bar-multi.d.ts

@@ -1,7 +1,7 @@
-import { LabelIconSpec } from '../data/Icon';
-import { FilterBarMultiFilterMode } from './filter-bar-field-utils';
-import { MultiSelectOption } from './MultiSelect';
-export type { FilterBarMultiFilterMode } from './filter-bar-field-utils';
+import { LabelIconSpec } from '../data/Icon.js';
+import { FilterBarMultiFilterMode } from './filter-bar-field-utils.js';
+import { MultiSelectOption } from './MultiSelect.js';
+export type { FilterBarMultiFilterMode } from './filter-bar-field-utils.js';
 export type FilterBarMultiFilter = {
     key: string;
     /** Renders include/exclude chips for each option. */

package/dist/components/filter-bar-utils.d.ts

@@ -1,4 +1,4 @@
-import { FilterBarDateRangeFilter, FilterBarFilter, FilterBarRangeProps } from './FilterBar';
+import { FilterBarDateRangeFilter, FilterBarFilter, FilterBarRangeProps } from './FilterBar.js';
 export type FilterExtension = (filter: FilterBarFilter) => FilterBarFilter;
 export declare function applyFilterExtensions(filter: FilterBarFilter, extensions: FilterExtension[] | undefined): FilterBarFilter;
 export declare function dateRangeFilterProps(filter: FilterBarDateRangeFilter): FilterBarRangeProps;