@parallelworks/ui 0.5.1 → 0.5.2
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/dist/chunks/{CodePreviewEditor-KwzSyk3-.js → CodePreviewEditor-Uij_Npp4.js} +1 -1
- package/dist/chunks/{CreateModal-CXSi9ELO.js → CreateModal-DEvWkdFl.js} +4 -29
- package/dist/chunks/{Monaco-FlGHL7zR.js → Monaco-H1M5hQbJ.js} +2 -2
- package/dist/chunks/PageHeader-CSo3LVId.js +571 -0
- package/dist/chunks/{Provider-wC9G01Ou.js → Provider-BIL5347a.js} +1 -0
- package/dist/chunks/{SwitchToggle-CkYT1isd.js → SwitchToggle-DiBXEP12.js} +1 -1
- package/dist/chunks/{editor-DbDUZn8w.js → editor-4ZuZruLz.js} +2 -2
- package/dist/chunks/{list-CGbR-ueU.js → list-CgzqVlao.js} +314 -8
- package/dist/components/PageHeader.d.ts +1 -1
- package/dist/components/Provider.d.ts +1 -0
- package/dist/components/Table.d.ts +1 -1
- package/dist/editor/index.js +1 -1
- package/dist/file-explorer/FileExplorer.d.ts +1 -3
- package/dist/file-explorer/helpers.d.ts +1 -3
- package/dist/file-explorer/index.js +15 -23
- package/dist/form/index.js +2 -2
- package/dist/index.js +6 -231
- package/dist/list/ActionToolbar.d.ts +38 -0
- package/dist/list/ListPage.d.ts +63 -0
- package/dist/list/RowContextMenu.d.ts +1 -1
- package/dist/list/index.d.ts +2 -0
- package/dist/list/index.js +3 -3
- package/dist/logviewer/index.js +1 -1
- package/dist/styles/theme.css +1 -0
- package/dist/styles.css +1 -1
- package/dist/theme/index.d.ts +1 -1
- package/dist/theme/index.js +3 -0
- package/dist/workflow/index.js +1 -1
- package/package.json +1 -1
- package/dist/chunks/RowContextMenu-D3G3DPQk.js +0 -319
package/dist/index.js
CHANGED
|
@@ -1,21 +1,20 @@
|
|
|
1
1
|
import { DEFAULT_PRESET, THEME_PRESETS, THEME_TOKENS, applyTheme, contrastRatio, deriveTheme, isDarkColor } from "./theme/index.js";
|
|
2
|
-
import {
|
|
3
|
-
import { a as CreateModalSwitch, c as
|
|
4
|
-
import { a as useProvisionCorsRules, c as useStrings, i as useNotify, l as useWorkflowJsonResolver, n as useLink, o as useRunFile, r as useNavigation, s as useSlots, t as UIProvider } from "./chunks/Provider-
|
|
2
|
+
import { AlertIcon, AngleRightIcon, EyeIcon, EyeOffIcon, FilterIcon, LoaderIcon, SortDownIcon, SortUnsortedIcon, SortUpIcon } from "./icons.js";
|
|
3
|
+
import { a as CreateModalSwitch, c as dangerButtonClasses, d as Markdown, f as CopyCodeBlock, i as CreateModalSelect, l as ghostButtonClasses, m as Callout, n as CreateModalAutocompleteField, o as CreateModalTextarea, p as CopyToClipboard, r as CreateModalField, s as ConfirmModal, t as CreateModal, u as primaryButtonClasses } from "./chunks/CreateModal-DEvWkdFl.js";
|
|
4
|
+
import { a as useProvisionCorsRules, c as useStrings, i as useNotify, l as useWorkflowJsonResolver, n as useLink, o as useRunFile, r as useNavigation, s as useSlots, t as UIProvider } from "./chunks/Provider-BIL5347a.js";
|
|
5
5
|
import { i as formatTooltipContent, n as TOOLTIP_ID, r as TooltipInfo, t as GlobalTooltip } from "./chunks/Tooltip-WgbiC_nd.js";
|
|
6
|
-
import { a as UncontrolledCollapsiblePanel, c as Dropdown, d as flattenOptions, f as isCategory, i as MaybeCollapsible, l as DropdownCaret, n as SectionHeader, o as MultiSelectDropdown, p as isOption, r as ControlledCollapsiblePanel, s as CustomListbox, t as SwitchToggle, u as filterOption } from "./chunks/SwitchToggle-
|
|
6
|
+
import { a as UncontrolledCollapsiblePanel, c as Dropdown, d as flattenOptions, f as isCategory, i as MaybeCollapsible, l as DropdownCaret, n as SectionHeader, o as MultiSelectDropdown, p as isOption, r as ControlledCollapsiblePanel, s as CustomListbox, t as SwitchToggle, u as filterOption } from "./chunks/SwitchToggle-DiBXEP12.js";
|
|
7
7
|
import { t as Loader } from "./chunks/Loader-BXoXTZGc.js";
|
|
8
8
|
import { n as modalPanelClasses, t as BareModal } from "./chunks/BareModal-DBa84JZO.js";
|
|
9
|
+
import { S as AddMenu, _ as BreadcrumbProvider, a as HeaderAddButton, b as useHideBreadcrumbs, c as PageHeader, i as HeaderActionMenu, n as BreadcrumbsRightAction, o as HeaderEditButton, r as BreadcrumbsTitleAction, s as HeaderRowMenu, t as BreadcrumbsActionButton, v as useBreadcrumb, x as useSetBreadcrumbs, y as useClearBreadcrumbs } from "./chunks/PageHeader-CSo3LVId.js";
|
|
9
10
|
import { t as useCssIsDark } from "./chunks/useCssIsDark-DHr05dG2.js";
|
|
10
11
|
import { t as Indicator } from "./chunks/Indicator-hBSIxOPK.js";
|
|
11
12
|
import { t as SwitchToggleSmall } from "./chunks/SwitchToggleSmall-FcsaYSTs.js";
|
|
12
13
|
import { n as StatusDot, t as StatusBadge } from "./chunks/StatusBadge-DXp4zkSd.js";
|
|
13
14
|
import { n as Table, t as CompactTable } from "./chunks/Table-ByziK93x.js";
|
|
14
|
-
import { s as useRowMenu } from "./chunks/RowContextMenu-D3G3DPQk.js";
|
|
15
15
|
import cx from "classnames";
|
|
16
16
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
17
|
-
import React, {
|
|
18
|
-
import { createPortal } from "react-dom";
|
|
17
|
+
import React, { forwardRef, useState } from "react";
|
|
19
18
|
import Skeleton from "react-loading-skeleton";
|
|
20
19
|
//#region src/components/DescriptionList.tsx
|
|
21
20
|
function DescriptionListItem({ label, children, tooltip, className, ...props }) {
|
|
@@ -537,228 +536,4 @@ function SettingModeOption({ name, checked, onSelect, label, description, isFirs
|
|
|
537
536
|
});
|
|
538
537
|
}
|
|
539
538
|
//#endregion
|
|
540
|
-
//#region src/components/Breadcrumbs.tsx
|
|
541
|
-
var BreadcrumbContext = createContext({
|
|
542
|
-
breadcrumbs: [],
|
|
543
|
-
setBreadcrumbs: () => {},
|
|
544
|
-
rightsideBreadcrumb: null,
|
|
545
|
-
setRightsideBreadcrumb: () => {},
|
|
546
|
-
hidden: false,
|
|
547
|
-
setHidden: () => {},
|
|
548
|
-
titleActionSlot: null,
|
|
549
|
-
setTitleActionSlot: () => {},
|
|
550
|
-
rightActionSlot: null,
|
|
551
|
-
setRightActionSlot: () => {}
|
|
552
|
-
});
|
|
553
|
-
var useBreadcrumb = () => useContext(BreadcrumbContext);
|
|
554
|
-
function BreadcrumbProvider({ children }) {
|
|
555
|
-
const [breadcrumbs, setBreadcrumbs] = React.useState([]);
|
|
556
|
-
const [rightsideBreadcrumb, setRightsideBreadcrumb] = React.useState(null);
|
|
557
|
-
const [hidden, setHidden] = React.useState(false);
|
|
558
|
-
const [titleActionSlot, setTitleActionSlot] = React.useState(null);
|
|
559
|
-
const [rightActionSlot, setRightActionSlot] = React.useState(null);
|
|
560
|
-
return /* @__PURE__ */ jsx(BreadcrumbContext.Provider, {
|
|
561
|
-
value: {
|
|
562
|
-
breadcrumbs,
|
|
563
|
-
setBreadcrumbs,
|
|
564
|
-
rightsideBreadcrumb,
|
|
565
|
-
setRightsideBreadcrumb,
|
|
566
|
-
hidden,
|
|
567
|
-
setHidden,
|
|
568
|
-
titleActionSlot,
|
|
569
|
-
setTitleActionSlot,
|
|
570
|
-
rightActionSlot,
|
|
571
|
-
setRightActionSlot
|
|
572
|
-
},
|
|
573
|
-
children
|
|
574
|
-
});
|
|
575
|
-
}
|
|
576
|
-
function useSetBreadcrumbs(getBreadcrumbs) {
|
|
577
|
-
const { setBreadcrumbs } = useBreadcrumb();
|
|
578
|
-
useLayoutEffect(() => {
|
|
579
|
-
setBreadcrumbs(typeof getBreadcrumbs === "function" ? getBreadcrumbs() : getBreadcrumbs);
|
|
580
|
-
}, [getBreadcrumbs, setBreadcrumbs]);
|
|
581
|
-
}
|
|
582
|
-
var EMPTY_BREADCRUMBS = [];
|
|
583
|
-
/** For pages that render their own header instead of the breadcrumb strip. */
|
|
584
|
-
function useClearBreadcrumbs() {
|
|
585
|
-
useSetBreadcrumbs(EMPTY_BREADCRUMBS);
|
|
586
|
-
}
|
|
587
|
-
function useHideBreadcrumbs(hidden) {
|
|
588
|
-
const { setHidden } = useBreadcrumb();
|
|
589
|
-
useEffect(() => {
|
|
590
|
-
setHidden(hidden);
|
|
591
|
-
return () => setHidden(false);
|
|
592
|
-
}, [hidden, setHidden]);
|
|
593
|
-
}
|
|
594
|
-
//#endregion
|
|
595
|
-
//#region src/components/PageHeader.tsx
|
|
596
|
-
var headerActionButtonClasses = "flex items-center justify-center w-6 h-6 rounded-md shrink-0 cursor-pointer text-(--theme-muted-text-color) hover:text-(--theme-app) hover:bg-(--theme-muted-panel-bg) transition-colors";
|
|
597
|
-
var headerAddButtonClasses = "inline-flex h-[26px] shrink-0 items-center gap-1.5 rounded-md border border-(--theme-border) px-2 text-xs font-medium cursor-pointer text-(--theme-muted-text-color) hover:bg-(--theme-muted-panel-bg) hover:text-(--theme-app) transition-colors";
|
|
598
|
-
/** With menu, the plus opens a chooser; otherwise navigates to or calls the
|
|
599
|
-
* single action. `word` is the visible verb; `label` stays the full action for
|
|
600
|
-
* the tooltip and screen readers. */
|
|
601
|
-
function HeaderAddButton({ to, onClick, label, word = "add", menu }) {
|
|
602
|
-
const { common } = useStrings();
|
|
603
|
-
const Link = useLink();
|
|
604
|
-
const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(AddIcon, { className: "w-3 h-3" }), /* @__PURE__ */ jsx("span", { children: word === "create" ? common.create : common.add })] });
|
|
605
|
-
if (menu) return /* @__PURE__ */ jsx(AddMenu, {
|
|
606
|
-
items: menu,
|
|
607
|
-
label,
|
|
608
|
-
buttonClassName: headerAddButtonClasses,
|
|
609
|
-
children: content
|
|
610
|
-
});
|
|
611
|
-
if (to) return /* @__PURE__ */ jsx(Link, {
|
|
612
|
-
to,
|
|
613
|
-
"aria-label": label,
|
|
614
|
-
title: label,
|
|
615
|
-
className: headerAddButtonClasses,
|
|
616
|
-
children: content
|
|
617
|
-
});
|
|
618
|
-
return /* @__PURE__ */ jsx("button", {
|
|
619
|
-
type: "button",
|
|
620
|
-
onClick,
|
|
621
|
-
"aria-label": label,
|
|
622
|
-
title: label,
|
|
623
|
-
className: headerAddButtonClasses,
|
|
624
|
-
children: content
|
|
625
|
-
});
|
|
626
|
-
}
|
|
627
|
-
function HeaderActionMenu({ items, label = "Actions" }) {
|
|
628
|
-
if (items.length === 0) return null;
|
|
629
|
-
return /* @__PURE__ */ jsx(AddMenu, {
|
|
630
|
-
items,
|
|
631
|
-
label,
|
|
632
|
-
buttonClassName: headerActionButtonClasses,
|
|
633
|
-
children: /* @__PURE__ */ jsx(MoreIcon, { className: "w-3.5 h-3.5" })
|
|
634
|
-
});
|
|
635
|
-
}
|
|
636
|
-
/** The header "…" trigger for a RowMenuItem menu — same rendering (submenus,
|
|
637
|
-
* destructive styling) as the list pages' right-click context menus. */
|
|
638
|
-
function HeaderRowMenu({ items, label = "Actions" }) {
|
|
639
|
-
const { openMenu, contextMenu } = useRowMenu();
|
|
640
|
-
if (items.length === 0) return null;
|
|
641
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
|
|
642
|
-
type: "button",
|
|
643
|
-
"aria-label": label,
|
|
644
|
-
title: label,
|
|
645
|
-
className: headerActionButtonClasses,
|
|
646
|
-
onClick: (e) => {
|
|
647
|
-
const r = e.currentTarget.getBoundingClientRect();
|
|
648
|
-
openMenu(r.left, r.bottom + 4, items);
|
|
649
|
-
},
|
|
650
|
-
children: /* @__PURE__ */ jsx(MoreIcon, { className: "w-3.5 h-3.5" })
|
|
651
|
-
}), contextMenu] });
|
|
652
|
-
}
|
|
653
|
-
function HeaderEditButton({ to, onClick, label = "Edit", disabled, tooltip }) {
|
|
654
|
-
const Link = useLink();
|
|
655
|
-
const tooltipProps = tooltip ? {
|
|
656
|
-
"data-tooltip-id": TOOLTIP_ID,
|
|
657
|
-
"data-tooltip-content": tooltip
|
|
658
|
-
} : {};
|
|
659
|
-
if (to && !disabled) return /* @__PURE__ */ jsx(Link, {
|
|
660
|
-
to,
|
|
661
|
-
"aria-label": label,
|
|
662
|
-
...tooltip ? {} : { title: label },
|
|
663
|
-
className: headerActionButtonClasses,
|
|
664
|
-
...tooltipProps,
|
|
665
|
-
children: /* @__PURE__ */ jsx(EditIcon, { className: "w-3 h-3" })
|
|
666
|
-
});
|
|
667
|
-
return /* @__PURE__ */ jsx("button", {
|
|
668
|
-
type: "button",
|
|
669
|
-
onClick,
|
|
670
|
-
disabled,
|
|
671
|
-
"aria-label": label,
|
|
672
|
-
title: tooltip ? void 0 : label,
|
|
673
|
-
className: cx(headerActionButtonClasses, disabled && "opacity-50 cursor-not-allowed hover:bg-transparent"),
|
|
674
|
-
...tooltipProps,
|
|
675
|
-
children: /* @__PURE__ */ jsx(EditIcon, { className: "w-3 h-3" })
|
|
676
|
-
});
|
|
677
|
-
}
|
|
678
|
-
/** Renders nothing when the modern breadcrumb strip isn't mounted (classic chrome or self-headered pages). */
|
|
679
|
-
function BreadcrumbsTitleAction({ children }) {
|
|
680
|
-
const { titleActionSlot } = useBreadcrumb();
|
|
681
|
-
if (!titleActionSlot) return null;
|
|
682
|
-
return createPortal(children, titleActionSlot);
|
|
683
|
-
}
|
|
684
|
-
function BreadcrumbsRightAction({ children }) {
|
|
685
|
-
const { rightActionSlot } = useBreadcrumb();
|
|
686
|
-
if (!rightActionSlot) return null;
|
|
687
|
-
return createPortal(children, rightActionSlot);
|
|
688
|
-
}
|
|
689
|
-
var breadcrumbsActionClasses = "flex items-center gap-1 link text-xs whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed";
|
|
690
|
-
function BreadcrumbsActionButton({ icon: Icon, label, to, onClick, disabled, tooltip }) {
|
|
691
|
-
const Link = useLink();
|
|
692
|
-
const tip = tooltip ? {
|
|
693
|
-
"data-tooltip-id": TOOLTIP_ID,
|
|
694
|
-
"data-tooltip-content": tooltip
|
|
695
|
-
} : {};
|
|
696
|
-
const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Icon, { className: "w-3 h-3" }), label] });
|
|
697
|
-
if (to && !disabled) return /* @__PURE__ */ jsx(Link, {
|
|
698
|
-
to,
|
|
699
|
-
className: breadcrumbsActionClasses,
|
|
700
|
-
...tip,
|
|
701
|
-
children: content
|
|
702
|
-
});
|
|
703
|
-
return /* @__PURE__ */ jsx("button", {
|
|
704
|
-
type: "button",
|
|
705
|
-
onClick,
|
|
706
|
-
disabled,
|
|
707
|
-
className: breadcrumbsActionClasses,
|
|
708
|
-
...tip,
|
|
709
|
-
children: content
|
|
710
|
-
});
|
|
711
|
-
}
|
|
712
|
-
function PageHeader({ breadcrumbs, title, titleAction, actions, toolbar, className, sticky = true, stickyTopClassName = "top-0" }) {
|
|
713
|
-
const { setHidden } = useBreadcrumb();
|
|
714
|
-
const Link = useLink();
|
|
715
|
-
const { breadcrumbPin } = useSlots();
|
|
716
|
-
useLayoutEffect(() => {
|
|
717
|
-
setHidden(true);
|
|
718
|
-
return () => setHidden(false);
|
|
719
|
-
}, [setHidden]);
|
|
720
|
-
const crumbs = [...breadcrumbs ?? []];
|
|
721
|
-
const lastLabel = crumbs[crumbs.length - 1]?.label;
|
|
722
|
-
if (title !== null && title !== void 0 && title !== lastLabel) crumbs.push({ label: title });
|
|
723
|
-
const crumbRow = crumbs.length > 0 && /* @__PURE__ */ jsxs("div", {
|
|
724
|
-
className: "flex items-center gap-1.5 min-w-0",
|
|
725
|
-
children: [
|
|
726
|
-
/* @__PURE__ */ jsx("nav", {
|
|
727
|
-
"aria-label": "Breadcrumb",
|
|
728
|
-
className: "flex items-center gap-2 min-w-0 text-[13px]",
|
|
729
|
-
children: crumbs.map((crumb, idx) => {
|
|
730
|
-
if (idx === crumbs.length - 1) return /* @__PURE__ */ jsx("h1", {
|
|
731
|
-
className: "m-0 text-[13px] font-medium leading-none text-(--theme-app) truncate",
|
|
732
|
-
children: crumb.label
|
|
733
|
-
}, `${crumb.label}-${idx}`);
|
|
734
|
-
return /* @__PURE__ */ jsxs(Fragment$1, { children: [crumb.href ? /* @__PURE__ */ jsx(Link, {
|
|
735
|
-
to: crumb.href,
|
|
736
|
-
className: "text-(--theme-muted-text-color) hover:text-(--theme-app) transition-colors cursor-pointer whitespace-nowrap",
|
|
737
|
-
children: crumb.label
|
|
738
|
-
}) : /* @__PURE__ */ jsx("span", {
|
|
739
|
-
className: "text-(--theme-muted-text-color) whitespace-nowrap",
|
|
740
|
-
children: crumb.label
|
|
741
|
-
}), /* @__PURE__ */ jsx(ChevronRightIcon, { className: "w-3 h-3 opacity-60 shrink-0 text-(--theme-muted-text-color)" })] }, `${crumb.label}-${idx}`);
|
|
742
|
-
})
|
|
743
|
-
}),
|
|
744
|
-
titleAction,
|
|
745
|
-
breadcrumbPin?.({ crumbs })
|
|
746
|
-
]
|
|
747
|
-
});
|
|
748
|
-
const actionCluster = actions && /* @__PURE__ */ jsx("div", {
|
|
749
|
-
className: "flex items-center gap-1.5 shrink-0",
|
|
750
|
-
children: actions
|
|
751
|
-
});
|
|
752
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
753
|
-
className: cx(sticky && cx("sticky z-20", stickyTopClassName), "w-full bg-(--theme-app-bg)", className),
|
|
754
|
-
children: [/* @__PURE__ */ jsxs("div", {
|
|
755
|
-
className: cx("flex items-center justify-between gap-6 px-4 h-11", crumbRow && "border-b border-(--theme-border)"),
|
|
756
|
-
children: [crumbRow || /* @__PURE__ */ jsx("div", {}), actionCluster]
|
|
757
|
-
}), toolbar && /* @__PURE__ */ jsx("div", {
|
|
758
|
-
className: "px-4",
|
|
759
|
-
children: toolbar
|
|
760
|
-
})]
|
|
761
|
-
});
|
|
762
|
-
}
|
|
763
|
-
//#endregion
|
|
764
539
|
export { AddMenu, BareModal, BreadcrumbProvider, BreadcrumbsActionButton, BreadcrumbsRightAction, BreadcrumbsTitleAction, Button, Callout, Card, CardHeader, CompactTable, ConfirmModal, ControlledCollapsiblePanel, CopyCodeBlock, CopyToClipboard, CreateModal, CreateModalAutocompleteField, CreateModalField, CreateModalSelect, CreateModalSwitch, CreateModalTextarea, CustomListbox, DEFAULT_PRESET, DescriptionList, DescriptionListItem, Dropdown, DropdownCaret, EmptyState, Filter, FilterPill, GlobalTooltip, HeaderActionMenu, HeaderAddButton, HeaderEditButton, HeaderRowMenu, IconButton, Indicator, Input, LetterBadge, Loader, Markdown, MaybeCollapsible, MethodButton, MultiSelectDropdown, Overview, PageHeader, Pagination, SectionHeader, SettingModeOption, SettingRow, SettingSection, SettingsCard, SettingsGroup, Sort, StatusBadge, StatusDot, SwitchToggle, SwitchToggleSmall, THEME_PRESETS, THEME_TOKENS, TOOLTIP_ID, Table, Textarea, Toggle, TooltipInfo, UIProvider, UncontrolledCollapsiblePanel, applyTheme, contrastRatio, dangerButtonClasses, deriveTheme, filterOption, flattenOptions, formatTooltipContent, ghostButtonClasses, inputClasses, isCategory, isDarkColor, isOption, modalPanelClasses, primaryButtonClasses, useBreadcrumb, useClearBreadcrumbs, useCssIsDark, useHideBreadcrumbs, useNavigation, useNotify, useProvisionCorsRules, useRunFile, useSetBreadcrumbs, useSlots, useStrings, useWorkflowJsonResolver };
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
export interface ToolbarAction {
|
|
2
|
+
key: string;
|
|
3
|
+
label: string;
|
|
4
|
+
icon: React.ComponentType<{
|
|
5
|
+
className?: string;
|
|
6
|
+
}>;
|
|
7
|
+
iconClassName?: string;
|
|
8
|
+
onClick?: () => void;
|
|
9
|
+
href?: string;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
enabledTooltip?: string;
|
|
12
|
+
disabledTooltip?: string;
|
|
13
|
+
hidden?: boolean;
|
|
14
|
+
}
|
|
15
|
+
/** A pre-rendered element (e.g. a button component that owns its modal). */
|
|
16
|
+
interface ToolbarElement {
|
|
17
|
+
key: string;
|
|
18
|
+
element: React.ReactNode;
|
|
19
|
+
hidden?: boolean;
|
|
20
|
+
}
|
|
21
|
+
export type ToolbarItem = ToolbarAction | ToolbarElement;
|
|
22
|
+
export declare function ToolbarButton({ action }: {
|
|
23
|
+
action: ToolbarAction;
|
|
24
|
+
}): import("react").JSX.Element;
|
|
25
|
+
/** Pins a detail-page toolbar just below the sticky breadcrumb strip (top-10 matches the strip's 40px height). */
|
|
26
|
+
export declare const stickyToolbarClasses = "sticky top-10 z-10 bg-(--theme-app-bg)";
|
|
27
|
+
/** Pins a detail-page tabs row under the pinned toolbar (top-22 = 40px strip + 48px toolbar block). */
|
|
28
|
+
export declare const stickyTabsClasses = "sticky top-22 z-10 bg-(--theme-app-bg)";
|
|
29
|
+
/** Pins a detail-page tabs row directly under the breadcrumb strip when the page has no pinned toolbar (top-10 = the strip's height). */
|
|
30
|
+
export declare const stickyTabsUnderHeaderClasses = "sticky top-10 z-10 bg-(--theme-app-bg)";
|
|
31
|
+
/** Action groups left, secondary actions right (collapsing into a `…` menu). */
|
|
32
|
+
export declare function ActionToolbar({ groups, right, sticky, }: {
|
|
33
|
+
groups: ToolbarItem[][];
|
|
34
|
+
right?: ToolbarItem[];
|
|
35
|
+
/** Pin below the breadcrumb strip while the page scrolls. Requires the toolbar's parent to span the page content. */
|
|
36
|
+
sticky?: boolean;
|
|
37
|
+
}): import("react").JSX.Element;
|
|
38
|
+
export {};
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import type { MouseEvent as ReactMouseEvent, ReactNode } from 'react';
|
|
2
|
+
import { type PageHeaderBreadcrumb } from '../components/PageHeader.js';
|
|
3
|
+
import type { ListView, ListViewChrome } from './listView.js';
|
|
4
|
+
import { type OpenMenu, type RowMenuItem } from './RowContextMenu.js';
|
|
5
|
+
/** Negative offsets (admin/org) cancel the shell's pt-4 so rows don't peek through the gap above the pinned header. */
|
|
6
|
+
declare const SECTION_STICKY_TOP: {
|
|
7
|
+
readonly main: 'top-0';
|
|
8
|
+
readonly kubernetes: 'top-0';
|
|
9
|
+
readonly admin: '-top-4';
|
|
10
|
+
readonly org: '-top-4';
|
|
11
|
+
};
|
|
12
|
+
export type ListSection = keyof typeof SECTION_STICKY_TOP;
|
|
13
|
+
export declare function ListRowActionsProvider({ view, children, }: {
|
|
14
|
+
view?: ListViewChrome | undefined;
|
|
15
|
+
children: ReactNode;
|
|
16
|
+
}): import("react").JSX.Element;
|
|
17
|
+
export interface ListPageProps {
|
|
18
|
+
section?: ListSection;
|
|
19
|
+
/** Force edge-to-edge negative margin for a main-shell page nested under a padded route layout. */
|
|
20
|
+
shellPadded?: boolean;
|
|
21
|
+
breadcrumbs?: PageHeaderBreadcrumb[] | undefined;
|
|
22
|
+
title?: ReactNode;
|
|
23
|
+
titleAction?: ReactNode;
|
|
24
|
+
actions?: ReactNode;
|
|
25
|
+
toolbar?: ReactNode;
|
|
26
|
+
/** Omit on pages without a list view — rows show all actions by default. */
|
|
27
|
+
view?: ListViewChrome | undefined;
|
|
28
|
+
children: ReactNode;
|
|
29
|
+
}
|
|
30
|
+
export declare function ListPage({ section, shellPadded, breadcrumbs, title, titleAction, actions, toolbar, view, children, }: ListPageProps): import("react").JSX.Element;
|
|
31
|
+
export interface PinnedRowAction {
|
|
32
|
+
key: string;
|
|
33
|
+
label: string;
|
|
34
|
+
icon: ReactNode;
|
|
35
|
+
onSelect: () => void;
|
|
36
|
+
disabled?: boolean;
|
|
37
|
+
}
|
|
38
|
+
export declare function ListRow({ href, items, goTo, openMenu, pinnedActions, selected, selectionActive, onRowSelect, leading, className, children, }: {
|
|
39
|
+
href: string | null;
|
|
40
|
+
items: RowMenuItem[];
|
|
41
|
+
goTo: (to: string) => void;
|
|
42
|
+
openMenu: OpenMenu;
|
|
43
|
+
pinnedActions?: PinnedRowAction[];
|
|
44
|
+
className?: string;
|
|
45
|
+
/** Tints the whole row to mark it as part of a multi-selection. */
|
|
46
|
+
selected?: boolean;
|
|
47
|
+
/** When multi-selection is active, plain row click toggles selection instead of navigating. */
|
|
48
|
+
selectionActive?: boolean;
|
|
49
|
+
onRowSelect?: (e: ReactMouseEvent) => void;
|
|
50
|
+
/** Non-column cell rendered before the column cells; kept out of `children` so they stay aligned with `columns`. */
|
|
51
|
+
leading?: ReactNode;
|
|
52
|
+
children: ReactNode;
|
|
53
|
+
}): import("react").JSX.Element;
|
|
54
|
+
/** Name column min-width is by role, not position, so a leading checkbox doesn't shift it. */
|
|
55
|
+
export declare function ListColumns<T>({ view }: {
|
|
56
|
+
view: ListView<T>;
|
|
57
|
+
}): import("react").JSX.Element;
|
|
58
|
+
export declare namespace ListColumns {
|
|
59
|
+
var isTableHeader: boolean;
|
|
60
|
+
}
|
|
61
|
+
/** Stable `goTo` for whole-row navigation (`rowNavProps`, `ListRow`). */
|
|
62
|
+
export declare function useListNavigate(): (to: string) => void;
|
|
63
|
+
export {};
|
|
@@ -109,5 +109,5 @@ export declare function copySubmenu({ name, nameLabel, email, username, uid, id,
|
|
|
109
109
|
export declare function MoreButton({ onOpen, active, className, }: {
|
|
110
110
|
onOpen: (x: number, y: number) => void;
|
|
111
111
|
active?: boolean;
|
|
112
|
-
className?: string;
|
|
112
|
+
className?: string | undefined;
|
|
113
113
|
}): import("react").JSX.Element;
|
package/dist/list/index.d.ts
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
export { ActionToolbar, stickyTabsClasses, stickyTabsUnderHeaderClasses, stickyToolbarClasses, ToolbarButton, type ToolbarAction, type ToolbarItem, } from './ActionToolbar.js';
|
|
2
|
+
export { ListColumns, ListPage, ListRow, ListRowActionsProvider, useListNavigate, type ListPageProps, type ListSection, type PinnedRowAction, } from './ListPage.js';
|
|
1
3
|
export { assembleRowMenu, copySubmenu, MoreButton, rowContextMenuProps, toolbarActionToRowAction, toRowMenuItem, useRowMenu, useRowMenuActive, type OpenMenu, type RowAction, type RowMenuItem, } from './RowContextMenu.js';
|
|
2
4
|
export { actionsColumnWidth, GroupRow, ListActionsHeader, ListError, ListSkeleton, listTableFixedProps, listTableProps, NAME_MIN_WIDTH_PX, NameCell, RowSelectCheckbox, } from './ListTable.js';
|
|
3
5
|
export { DEFAULT_ORDER, FAVORITE_ORDER, useListView, type ActionDef, type ColumnDef, type FilterFacet, type ListView, type ListViewChrome, type ListViewConfig, type OrderByOption, } from './listView.js';
|
package/dist/list/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { C as listTableProps, S as
|
|
3
|
-
export { DEFAULT_ORDER, FAVORITE_ORDER, GroupRow, HoverCardSurface, ListActionsHeader, ListCount, ListDisplayMenu, ListError, ListFilterMenu, ListPager, ListSearchControl, ListSkeleton, MoreButton, NAME_MIN_WIDTH_PX, NameCell, RowSelectCheckbox, actionsColumnWidth, assembleRowMenu, copySubmenu, isTextEntryContext, listControlButtonClasses, listTableFixedProps, listTableProps, rowContextMenuProps, toRowMenuItem, toolbarActionToRowAction, useHoverCard, useListSearch, useListView, useRowMenu, useRowMenuActive };
|
|
1
|
+
import { d as copySubmenu, f as rowContextMenuProps, g as useRowMenuActive, h as useRowMenu, l as MoreButton, m as toolbarActionToRowAction, p as toRowMenuItem, u as assembleRowMenu } from "../chunks/PageHeader-CSo3LVId.js";
|
|
2
|
+
import { A as ToolbarButton, C as NAME_MIN_WIDTH_PX, D as listTableFixedProps, E as actionsColumnWidth, M as stickyTabsUnderHeaderClasses, N as stickyToolbarClasses, O as listTableProps, S as ListSkeleton, T as RowSelectCheckbox, _ as ListRowActionsProvider, a as ListSearchControl, b as ListActionsHeader, c as ListFilterMenu, d as DEFAULT_ORDER, f as FAVORITE_ORDER, g as ListRow, h as ListPage, i as ListCount, j as stickyTabsClasses, k as ActionToolbar, l as listControlButtonClasses, m as ListColumns, n as useHoverCard, o as useListSearch, p as useListView, r as ListPager, s as ListDisplayMenu, t as HoverCardSurface, u as isTextEntryContext, v as useListNavigate, w as NameCell, x as ListError, y as GroupRow } from "../chunks/list-CgzqVlao.js";
|
|
3
|
+
export { ActionToolbar, DEFAULT_ORDER, FAVORITE_ORDER, GroupRow, HoverCardSurface, ListActionsHeader, ListColumns, ListCount, ListDisplayMenu, ListError, ListFilterMenu, ListPage, ListPager, ListRow, ListRowActionsProvider, ListSearchControl, ListSkeleton, MoreButton, NAME_MIN_WIDTH_PX, NameCell, RowSelectCheckbox, ToolbarButton, actionsColumnWidth, assembleRowMenu, copySubmenu, isTextEntryContext, listControlButtonClasses, listTableFixedProps, listTableProps, rowContextMenuProps, stickyTabsClasses, stickyTabsUnderHeaderClasses, stickyToolbarClasses, toRowMenuItem, toolbarActionToRowAction, useHoverCard, useListNavigate, useListSearch, useListView, useRowMenu, useRowMenuActive };
|
package/dist/logviewer/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ArrowDownIcon, ArrowUpIcon, CheckIcon, ChevronDownIcon, ChevronRightIcon, CopyIcon, DownloadIcon, ExpandIcon, ShrinkIcon, XIcon } from "../icons.js";
|
|
2
|
-
import { c as useStrings, i as useNotify } from "../chunks/Provider-
|
|
2
|
+
import { c as useStrings, i as useNotify } from "../chunks/Provider-BIL5347a.js";
|
|
3
3
|
import cx from "classnames";
|
|
4
4
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { Fragment as Fragment$1, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
|