@backstage/ui 0.7.0-next.2 → 0.7.0-next.3
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/CHANGELOG.md +12 -0
- package/css/styles.css +187 -73
- package/dist/components/Checkbox/Checkbox.esm.js +10 -7
- package/dist/components/Checkbox/Checkbox.esm.js.map +1 -1
- package/dist/components/Header/Header.esm.js +0 -2
- package/dist/components/Header/Header.esm.js.map +1 -1
- package/dist/components/Header/HeaderToolbar.esm.js +4 -93
- package/dist/components/Header/HeaderToolbar.esm.js.map +1 -1
- package/dist/components/HeaderPage/HeaderPage.esm.js +95 -41
- package/dist/components/HeaderPage/HeaderPage.esm.js.map +1 -1
- package/dist/components/Link/Link.esm.js +1 -13
- package/dist/components/Link/Link.esm.js.map +1 -1
- package/dist/components/Menu/Combobox.esm.js +9 -6
- package/dist/components/Menu/Combobox.esm.js.map +1 -1
- package/dist/components/SearchField/SearchField.esm.js +27 -4
- package/dist/components/SearchField/SearchField.esm.js.map +1 -1
- package/dist/components/Select/Select.esm.js +0 -1
- package/dist/components/Select/Select.esm.js.map +1 -1
- package/dist/components/Table/components/Cell.esm.js +30 -0
- package/dist/components/Table/components/Cell.esm.js.map +1 -0
- package/dist/components/Table/components/CellProfile.esm.js +41 -0
- package/dist/components/Table/components/CellProfile.esm.js.map +1 -0
- package/dist/components/Table/components/Column.esm.js +17 -0
- package/dist/components/Table/components/Column.esm.js.map +1 -0
- package/dist/components/Table/components/Row.esm.js +38 -0
- package/dist/components/Table/components/Row.esm.js.map +1 -0
- package/dist/components/Table/components/Table.esm.js +18 -0
- package/dist/components/Table/components/Table.esm.js.map +1 -0
- package/dist/components/Table/components/TableBody.esm.js +11 -0
- package/dist/components/Table/components/TableBody.esm.js.map +1 -0
- package/dist/components/Table/components/TableHeader.esm.js +20 -0
- package/dist/components/Table/components/TableHeader.esm.js.map +1 -0
- package/dist/components/Table/hooks/useTable.esm.js +116 -0
- package/dist/components/Table/hooks/useTable.esm.js.map +1 -0
- package/dist/components/TablePagination/TablePagination.esm.js +130 -0
- package/dist/components/TablePagination/TablePagination.esm.js.map +1 -0
- package/dist/index.d.ts +161 -94
- package/dist/index.esm.js +9 -2
- package/dist/index.esm.js.map +1 -1
- package/dist/utils/componentDefinitions.esm.js +16 -5
- package/dist/utils/componentDefinitions.esm.js.map +1 -1
- package/dist/utils/isExternalLink.esm.js +16 -0
- package/dist/utils/isExternalLink.esm.js.map +1 -0
- package/package.json +2 -2
- package/dist/components/DataTable/DataTable.esm.js +0 -26
- package/dist/components/DataTable/DataTable.esm.js.map +0 -1
- package/dist/components/DataTable/Pagination/DataTablePagination.esm.js +0 -84
- package/dist/components/DataTable/Pagination/DataTablePagination.esm.js.map +0 -1
- package/dist/components/DataTable/Root/DataTableRoot.esm.js +0 -24
- package/dist/components/DataTable/Root/DataTableRoot.esm.js.map +0 -1
- package/dist/components/DataTable/Table/DataTableTable.esm.js +0 -64
- package/dist/components/DataTable/Table/DataTableTable.esm.js.map +0 -1
- package/dist/components/Select/Select.styles.css.esm.js +0 -7
- package/dist/components/Select/Select.styles.css.esm.js.map +0 -1
- package/dist/components/Table/Table.esm.js +0 -68
- package/dist/components/Table/Table.esm.js.map +0 -1
- package/dist/components/Table/TableCell/TableCell.esm.js +0 -13
- package/dist/components/Table/TableCell/TableCell.esm.js.map +0 -1
- package/dist/components/Table/TableCellLink/TableCellLink.esm.js +0 -28
- package/dist/components/Table/TableCellLink/TableCellLink.esm.js.map +0 -1
- package/dist/components/Table/TableCellProfile/TableCellProfile.esm.js +0 -40
- package/dist/components/Table/TableCellProfile/TableCellProfile.esm.js.map +0 -1
- package/dist/components/Table/TableCellText/TableCellText.esm.js +0 -27
- package/dist/components/Table/TableCellText/TableCellText.esm.js.map +0 -1
- package/dist/node_modules_dist/style-inject/dist/style-inject.es.esm.js +0 -29
- package/dist/node_modules_dist/style-inject/dist/style-inject.es.esm.js.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -2,12 +2,10 @@ import * as react from 'react';
|
|
|
2
2
|
import { ReactNode, ReactElement, ElementType, ComponentPropsWithRef, ComponentProps, ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
3
|
import { RemixiconComponentType } from '@remixicon/react';
|
|
4
4
|
import { Avatar as Avatar$1 } from '@base-ui-components/react/avatar';
|
|
5
|
-
import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, TabListProps as TabListProps$1, TabProps as TabProps$1, TabPanelProps as TabPanelProps$1, LinkProps as LinkProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SwitchProps as SwitchProps$1 } from 'react-aria-components';
|
|
5
|
+
import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, TabListProps as TabListProps$1, TabProps as TabProps$1, TabPanelProps as TabPanelProps$1, LinkProps as LinkProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, TableProps, TableHeaderProps, TableBodyProps, ColumnProps, RowProps, CellProps as CellProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SwitchProps as SwitchProps$1 } from 'react-aria-components';
|
|
6
6
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
7
|
import { NavigateOptions } from 'react-router-dom';
|
|
8
8
|
import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
|
|
9
|
-
import { useRender } from '@base-ui-components/react/use-render';
|
|
10
|
-
import { Table as Table$1 } from '@tanstack/react-table';
|
|
11
9
|
import { Menu as Menu$1 } from '@base-ui-components/react/menu';
|
|
12
10
|
import { ScrollArea as ScrollArea$1 } from '@base-ui-components/react/scroll-area';
|
|
13
11
|
|
|
@@ -146,6 +144,13 @@ declare const componentDefinitions: {
|
|
|
146
144
|
readonly content: "bui-HeaderPageContent";
|
|
147
145
|
readonly tabsWrapper: "bui-HeaderPageTabsWrapper";
|
|
148
146
|
readonly controls: "bui-HeaderPageControls";
|
|
147
|
+
readonly sticky: "bui-HeaderPageSticky";
|
|
148
|
+
readonly stickyWrapper: "bui-HeaderPageStickyWrapper";
|
|
149
|
+
readonly stickyContent: "bui-HeaderPageStickyContent";
|
|
150
|
+
readonly breadcrumbs: "bui-HeaderPageBreadcrumbs";
|
|
151
|
+
readonly breadcrumb: "bui-HeaderPageBreadcrumb";
|
|
152
|
+
readonly breadcrumbLink: "bui-HeaderPageBreadcrumbLink";
|
|
153
|
+
readonly breadcrumbSeparator: "bui-HeaderPageBreadcrumbSeparator";
|
|
149
154
|
};
|
|
150
155
|
};
|
|
151
156
|
readonly Heading: {
|
|
@@ -223,6 +228,9 @@ declare const componentDefinitions: {
|
|
|
223
228
|
readonly root: "bui-SearchField";
|
|
224
229
|
readonly clear: "bui-InputClear";
|
|
225
230
|
};
|
|
231
|
+
readonly dataAttributes: {
|
|
232
|
+
readonly startCollapsed: readonly [true, false];
|
|
233
|
+
};
|
|
226
234
|
};
|
|
227
235
|
readonly Select: {
|
|
228
236
|
readonly classNames: {
|
|
@@ -252,16 +260,17 @@ declare const componentDefinitions: {
|
|
|
252
260
|
};
|
|
253
261
|
readonly Table: {
|
|
254
262
|
readonly classNames: {
|
|
255
|
-
readonly
|
|
263
|
+
readonly table: "bui-Table";
|
|
256
264
|
readonly header: "bui-TableHeader";
|
|
257
265
|
readonly body: "bui-TableBody";
|
|
258
266
|
readonly row: "bui-TableRow";
|
|
259
267
|
readonly head: "bui-TableHead";
|
|
268
|
+
readonly headSortButton: "bui-TableHeadSortButton";
|
|
260
269
|
readonly caption: "bui-TableCaption";
|
|
261
270
|
readonly cell: "bui-TableCell";
|
|
262
|
-
readonly
|
|
263
|
-
readonly
|
|
264
|
-
readonly
|
|
271
|
+
readonly cellContentWrapper: "bui-TableCellContentWrapper";
|
|
272
|
+
readonly cellContent: "bui-TableCellContent";
|
|
273
|
+
readonly cellIcon: "bui-TableCellIcon";
|
|
265
274
|
readonly cellProfileAvatar: "bui-TableCellProfileAvatar";
|
|
266
275
|
readonly cellProfileAvatarImage: "bui-TableCellProfileAvatarImage";
|
|
267
276
|
readonly cellProfileAvatarFallback: "bui-TableCellProfileAvatarFallback";
|
|
@@ -795,82 +804,6 @@ declare const Collapsible: {
|
|
|
795
804
|
Panel: react.ForwardRefExoticComponent<Omit<Collapsible$1.Panel.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
796
805
|
};
|
|
797
806
|
|
|
798
|
-
/**
|
|
799
|
-
* Table component for displaying tabular data
|
|
800
|
-
* @public
|
|
801
|
-
*/
|
|
802
|
-
declare const Table: {
|
|
803
|
-
Root: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
804
|
-
Header: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
805
|
-
Body: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
806
|
-
Head: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
807
|
-
Row: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
808
|
-
Cell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
809
|
-
CellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
|
|
810
|
-
CellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
|
|
811
|
-
CellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
|
|
812
|
-
Caption: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableCaptionElement> & react.RefAttributes<HTMLTableCaptionElement>>;
|
|
813
|
-
};
|
|
814
|
-
|
|
815
|
-
/** @public */
|
|
816
|
-
interface TableCellTextProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
817
|
-
title: string;
|
|
818
|
-
description?: string;
|
|
819
|
-
}
|
|
820
|
-
|
|
821
|
-
/** @public */
|
|
822
|
-
interface TableCellLinkProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
823
|
-
title: string;
|
|
824
|
-
description?: string;
|
|
825
|
-
href: string;
|
|
826
|
-
render?: useRender.ComponentProps<'a'>['render'];
|
|
827
|
-
}
|
|
828
|
-
|
|
829
|
-
/** @public */
|
|
830
|
-
interface TableCellProfileProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
831
|
-
src?: string;
|
|
832
|
-
name?: string;
|
|
833
|
-
to?: string;
|
|
834
|
-
withImage?: boolean;
|
|
835
|
-
}
|
|
836
|
-
|
|
837
|
-
/**
|
|
838
|
-
* DataTable component for displaying tabular data with pagination
|
|
839
|
-
* @public
|
|
840
|
-
*/
|
|
841
|
-
declare const DataTable: {
|
|
842
|
-
Root: <TData>(props: {
|
|
843
|
-
table: Table$1<TData>;
|
|
844
|
-
} & React.HTMLAttributes<HTMLDivElement>) => JSX.Element;
|
|
845
|
-
Pagination: react.ForwardRefExoticComponent<DataTablePaginationProps & react.RefAttributes<HTMLDivElement>>;
|
|
846
|
-
Table: react.ForwardRefExoticComponent<DataTableTableProps & react.RefAttributes<HTMLTableElement>>;
|
|
847
|
-
TableRoot: react.ForwardRefExoticComponent<Omit<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>, "ref"> & react.RefAttributes<HTMLTableElement>>;
|
|
848
|
-
TableHeader: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
849
|
-
TableBody: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
850
|
-
TableRow: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
851
|
-
TableCell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
852
|
-
TableCellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
|
|
853
|
-
TableCellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
|
|
854
|
-
TableCellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
|
|
855
|
-
TableHead: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
856
|
-
};
|
|
857
|
-
|
|
858
|
-
/** @public */
|
|
859
|
-
interface DataTableRootProps<TData> extends React.HTMLAttributes<HTMLDivElement> {
|
|
860
|
-
/**
|
|
861
|
-
* The table instance.
|
|
862
|
-
*/
|
|
863
|
-
table: Table$1<TData>;
|
|
864
|
-
}
|
|
865
|
-
|
|
866
|
-
/** @public */
|
|
867
|
-
interface DataTablePaginationProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
868
|
-
}
|
|
869
|
-
|
|
870
|
-
/** @public */
|
|
871
|
-
interface DataTableTableProps extends React.HTMLAttributes<HTMLTableElement> {
|
|
872
|
-
}
|
|
873
|
-
|
|
874
807
|
/** @public */
|
|
875
808
|
interface FieldLabelProps {
|
|
876
809
|
/**
|
|
@@ -973,7 +906,6 @@ interface HeaderProps {
|
|
|
973
906
|
icon?: React.ReactNode;
|
|
974
907
|
title?: string;
|
|
975
908
|
titleLink?: string;
|
|
976
|
-
breadcrumbs?: HeaderBreadcrumb[];
|
|
977
909
|
customActions?: React.ReactNode;
|
|
978
910
|
menuItems?: HeaderMenuItem[];
|
|
979
911
|
tabs?: HeaderTab[];
|
|
@@ -1005,15 +937,6 @@ interface HeaderMenuItem {
|
|
|
1005
937
|
value: string;
|
|
1006
938
|
onClick?: () => void;
|
|
1007
939
|
}
|
|
1008
|
-
/**
|
|
1009
|
-
* Represents a breadcrumb item in the header.
|
|
1010
|
-
*
|
|
1011
|
-
* @public
|
|
1012
|
-
*/
|
|
1013
|
-
interface HeaderBreadcrumb {
|
|
1014
|
-
label: string;
|
|
1015
|
-
href: string;
|
|
1016
|
-
}
|
|
1017
940
|
|
|
1018
941
|
declare module 'react-aria-components' {
|
|
1019
942
|
interface RouterConfig {
|
|
@@ -1037,6 +960,16 @@ interface HeaderPageProps {
|
|
|
1037
960
|
customActions?: React.ReactNode;
|
|
1038
961
|
menuItems?: HeaderMenuItem[];
|
|
1039
962
|
tabs?: HeaderTab[];
|
|
963
|
+
breadcrumbs?: HeaderPageBreadcrumb[];
|
|
964
|
+
}
|
|
965
|
+
/**
|
|
966
|
+
* Represents a breadcrumb item in the header.
|
|
967
|
+
*
|
|
968
|
+
* @public
|
|
969
|
+
*/
|
|
970
|
+
interface HeaderPageBreadcrumb {
|
|
971
|
+
label: string;
|
|
972
|
+
href: string;
|
|
1040
973
|
}
|
|
1041
974
|
|
|
1042
975
|
/**
|
|
@@ -1115,6 +1048,136 @@ declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & reac
|
|
|
1115
1048
|
/** @public */
|
|
1116
1049
|
declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLLabelElement>>;
|
|
1117
1050
|
|
|
1051
|
+
/** @public */
|
|
1052
|
+
declare const Table: (props: TableProps) => react_jsx_runtime.JSX.Element;
|
|
1053
|
+
|
|
1054
|
+
/** @public */
|
|
1055
|
+
declare const TableHeader: <T extends object>({ columns, children, }: TableHeaderProps<T>) => react_jsx_runtime.JSX.Element;
|
|
1056
|
+
|
|
1057
|
+
/** @public */
|
|
1058
|
+
declare const TableBody: <T extends object>(props: TableBodyProps<T>) => react_jsx_runtime.JSX.Element;
|
|
1059
|
+
|
|
1060
|
+
/** @public */
|
|
1061
|
+
declare const Column: (props: Omit<ColumnProps, "children"> & {
|
|
1062
|
+
children?: React.ReactNode;
|
|
1063
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
1064
|
+
|
|
1065
|
+
/** @public */
|
|
1066
|
+
declare function Row<T extends object>({ id, columns, children, href, ...otherProps }: RowProps<T>): react_jsx_runtime.JSX.Element;
|
|
1067
|
+
|
|
1068
|
+
/** @public */
|
|
1069
|
+
interface CellProps extends CellProps$1 {
|
|
1070
|
+
title: string;
|
|
1071
|
+
description?: string;
|
|
1072
|
+
color?: 'primary' | 'secondary';
|
|
1073
|
+
leadingIcon?: React.ReactNode | null;
|
|
1074
|
+
href?: string;
|
|
1075
|
+
}
|
|
1076
|
+
/** @public */
|
|
1077
|
+
interface CellProfileProps extends CellProps$1 {
|
|
1078
|
+
src?: string;
|
|
1079
|
+
name?: string;
|
|
1080
|
+
href?: string;
|
|
1081
|
+
description?: string;
|
|
1082
|
+
color?: 'primary' | 'secondary';
|
|
1083
|
+
}
|
|
1084
|
+
|
|
1085
|
+
/** @public */
|
|
1086
|
+
declare const Cell: {
|
|
1087
|
+
(props: CellProps): react_jsx_runtime.JSX.Element;
|
|
1088
|
+
displayName: string;
|
|
1089
|
+
};
|
|
1090
|
+
|
|
1091
|
+
/** @public */
|
|
1092
|
+
declare const CellProfile: (props: CellProfileProps) => react_jsx_runtime.JSX.Element;
|
|
1093
|
+
|
|
1094
|
+
/** @public */
|
|
1095
|
+
interface TablePaginationProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1096
|
+
offset?: number;
|
|
1097
|
+
pageSize?: number;
|
|
1098
|
+
setPageSize?: (pageSize: number) => void;
|
|
1099
|
+
setOffset?: (offset: number) => void;
|
|
1100
|
+
rowCount?: number;
|
|
1101
|
+
onNextPage?: () => void;
|
|
1102
|
+
onPreviousPage?: () => void;
|
|
1103
|
+
onPageSizeChange?: (pageSize: number) => void;
|
|
1104
|
+
showPageSizeOptions?: boolean;
|
|
1105
|
+
}
|
|
1106
|
+
|
|
1107
|
+
/** @public */
|
|
1108
|
+
interface UseTablePaginationConfig {
|
|
1109
|
+
/** Total number of rows in the dataset - only needed when data is not provided at the top level */
|
|
1110
|
+
rowCount?: number;
|
|
1111
|
+
/** Current offset. When provided, pagination is controlled */
|
|
1112
|
+
offset?: number;
|
|
1113
|
+
/** Current page size. When provided, pagination is controlled */
|
|
1114
|
+
pageSize?: number;
|
|
1115
|
+
/** Callback when offset changes */
|
|
1116
|
+
onOffsetChange?: (offset: number) => void;
|
|
1117
|
+
/** Callback when page size changes */
|
|
1118
|
+
onPageSizeChange?: (pageSize: number) => void;
|
|
1119
|
+
/** Default page size for uncontrolled mode */
|
|
1120
|
+
defaultPageSize?: number;
|
|
1121
|
+
/** Default offset for uncontrolled mode */
|
|
1122
|
+
defaultOffset?: number;
|
|
1123
|
+
/** Callback when next page is clicked */
|
|
1124
|
+
onNextPage?: () => void;
|
|
1125
|
+
/** Callback when previous page is clicked */
|
|
1126
|
+
onPreviousPage?: () => void;
|
|
1127
|
+
/** Whether to show page size options */
|
|
1128
|
+
showPageSizeOptions?: boolean;
|
|
1129
|
+
}
|
|
1130
|
+
/** @public */
|
|
1131
|
+
interface UseTablePagination<T = any> {
|
|
1132
|
+
/** Props to pass to TablePagination component */
|
|
1133
|
+
paginationProps: TablePaginationProps;
|
|
1134
|
+
/** Current offset */
|
|
1135
|
+
offset: number;
|
|
1136
|
+
/** Current page size */
|
|
1137
|
+
pageSize: number;
|
|
1138
|
+
/** Sliced data for current page - only available when data is provided to useTable */
|
|
1139
|
+
data?: T[];
|
|
1140
|
+
/** Go to next page */
|
|
1141
|
+
nextPage: () => void;
|
|
1142
|
+
/** Go to previous page */
|
|
1143
|
+
previousPage: () => void;
|
|
1144
|
+
/** Set specific offset */
|
|
1145
|
+
setOffset: (offset: number) => void;
|
|
1146
|
+
/** Set page size */
|
|
1147
|
+
setPageSize: (pageSize: number) => void;
|
|
1148
|
+
}
|
|
1149
|
+
/** @public */
|
|
1150
|
+
interface UseTableConfig<T = any> {
|
|
1151
|
+
/** Full dataset - when provided, rowCount is calculated automatically and sliced data is returned */
|
|
1152
|
+
data?: T[];
|
|
1153
|
+
/** Pagination configuration */
|
|
1154
|
+
pagination?: UseTablePaginationConfig;
|
|
1155
|
+
}
|
|
1156
|
+
/** @public */
|
|
1157
|
+
interface UseTableResult<T = any> {
|
|
1158
|
+
/** Sliced data for current page */
|
|
1159
|
+
data?: T[];
|
|
1160
|
+
/** Props to pass to TablePagination component */
|
|
1161
|
+
paginationProps: TablePaginationProps;
|
|
1162
|
+
/** Pagination utilities */
|
|
1163
|
+
pagination: UseTablePagination<T>;
|
|
1164
|
+
}
|
|
1165
|
+
|
|
1166
|
+
/**
|
|
1167
|
+
* Hook for managing table state including pagination and future features like sorting.
|
|
1168
|
+
* Supports both controlled and uncontrolled modes using offset/pageSize pattern (Backstage style).
|
|
1169
|
+
*
|
|
1170
|
+
* @public
|
|
1171
|
+
*/
|
|
1172
|
+
declare function useTable<T = any>(config?: UseTableConfig<T>): UseTableResult<T>;
|
|
1173
|
+
|
|
1174
|
+
/**
|
|
1175
|
+
* Pagination controls for Table components with page navigation and size selection.
|
|
1176
|
+
*
|
|
1177
|
+
* @public
|
|
1178
|
+
*/
|
|
1179
|
+
declare function TablePagination(props: TablePaginationProps): react_jsx_runtime.JSX.Element;
|
|
1180
|
+
|
|
1118
1181
|
/** @public */
|
|
1119
1182
|
type TextOwnProps = {
|
|
1120
1183
|
as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'label' | 'div' | 'strong' | 'em' | 'small' | 'legend';
|
|
@@ -1226,6 +1289,10 @@ interface SearchFieldProps extends SearchFieldProps$1, Omit<FieldLabelProps, 'ht
|
|
|
1226
1289
|
* The placeholder text for the input
|
|
1227
1290
|
*/
|
|
1228
1291
|
placeholder?: string;
|
|
1292
|
+
/**
|
|
1293
|
+
* Controls whether the SearchField starts in a collapsed state.
|
|
1294
|
+
*/
|
|
1295
|
+
startCollapsed?: boolean;
|
|
1229
1296
|
}
|
|
1230
1297
|
|
|
1231
1298
|
/** @public */
|
|
@@ -1407,4 +1474,4 @@ declare const useBreakpoint: () => {
|
|
|
1407
1474
|
down: (key: Breakpoint) => boolean;
|
|
1408
1475
|
};
|
|
1409
1476
|
|
|
1410
|
-
export { type AlignItems, type ArbitraryStylingPropDef, Avatar, type AvatarProps, type BooleanPropDef, type Border, type BorderRadius, Box, type BoxOwnProps, type BoxProps, type Breakpoint, Button, ButtonIcon, type ButtonIconProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, type ClassNamesMap, Collapsible, type Columns, type ComponentClassNames, type ComponentDefinition, type ComponentDefinitionName, Container, type ContainerProps, type DataAttributeValues, type DataAttributesMap,
|
|
1477
|
+
export { type AlignItems, type ArbitraryStylingPropDef, Avatar, type AvatarProps, type BooleanPropDef, type Border, type BorderRadius, Box, type BoxOwnProps, type BoxProps, type Breakpoint, Button, ButtonIcon, type ButtonIconProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Cell, CellProfile, type CellProfileProps, type CellProps, Checkbox, type CheckboxProps, type ClassNamesMap, Collapsible, Column, type Columns, type ComponentClassNames, type ComponentDefinition, type ComponentDefinitionName, Container, type ContainerProps, type DataAttributeValues, type DataAttributesMap, type Display, type DisplayProps, type EnumOrStringPropDef, type EnumPropDef, FieldLabel, type FieldLabelProps, Flex, type FlexDirection, type FlexOwnProps, type FlexProps, type FlexWrap, type GapProps, type GetPropDefType, type GetPropDefTypes, Grid, type GridItemOwnProps, type GridItemProps, type GridOwnProps, type GridProps, Header, type HeaderMenuItem, HeaderPage, type HeaderPageBreadcrumb, type HeaderPageProps, type HeaderProps, type HeaderTab, type HeightProps, Icon, IconContext, type IconContextProps, type IconMap, type IconNames, type IconProps, IconProvider, type IconProviderProps, type JustifyContent, Link, type LinkProps, type MarginProps, Menu, type MenuComboboxOption, type MenuComboboxProps, type MenuComponent, type NonStylingPropDef, type PaddingProps, type PositionProps, type PropDef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type ReactNodePropDef, type RegularPropDef, type Responsive, type ResponsivePropDef, Row, ScrollArea, SearchField, type SearchFieldProps, Select, type SelectProps, Skeleton, type SkeletonProps, type Space, type SpaceProps, type StringPropDef, type StylingPropDef, Switch, type SwitchProps, Tab, TabList, type TabListProps, type TabMatchStrategy, TabPanel, type TabPanelProps, type TabProps, Table, TableBody, TableHeader, TablePagination, type TablePaginationProps, Tabs, type TabsProps, Text, type TextColorStatus, type TextColors, TextField, type TextFieldProps, type TextOwnProps, type TextProps, type TextVariants, type TextWeights, Tooltip, type TooltipProps, TooltipTrigger, type UseTableConfig, type UseTablePagination, type UseTablePaginationConfig, type UseTableResult, type UtilityProps, type WidthProps, boxPropDefs, breakpoints, componentDefinitions, displayPropDefs, flexPropDefs, gapPropDefs, gridItemPropDefs, gridPropDefs, heightPropDefs, icons, marginPropDefs, paddingPropDefs, positionPropDefs, useBreakpoint, useIcons, useTable, widthPropDefs };
|
package/dist/index.esm.js
CHANGED
|
@@ -10,7 +10,6 @@ export { Avatar } from './components/Avatar/Avatar.esm.js';
|
|
|
10
10
|
export { Button } from './components/Button/Button.esm.js';
|
|
11
11
|
export { Card } from './components/Card/Card.esm.js';
|
|
12
12
|
export { Collapsible } from './components/Collapsible/Collapsible.esm.js';
|
|
13
|
-
export { DataTable } from './components/DataTable/DataTable.esm.js';
|
|
14
13
|
export { FieldLabel } from './components/FieldLabel/FieldLabel.esm.js';
|
|
15
14
|
export { Header } from './components/Header/Header.esm.js';
|
|
16
15
|
export { HeaderPage } from './components/HeaderPage/HeaderPage.esm.js';
|
|
@@ -21,7 +20,15 @@ export { ButtonIcon } from './components/ButtonIcon/ButtonIcon.esm.js';
|
|
|
21
20
|
export { ButtonLink } from './components/ButtonLink/ButtonLink.esm.js';
|
|
22
21
|
export { Checkbox } from './components/Checkbox/Checkbox.esm.js';
|
|
23
22
|
export { Radio, RadioGroup } from './components/RadioGroup/RadioGroup.esm.js';
|
|
24
|
-
export { Table } from './components/Table/Table.esm.js';
|
|
23
|
+
export { Table } from './components/Table/components/Table.esm.js';
|
|
24
|
+
export { TableHeader } from './components/Table/components/TableHeader.esm.js';
|
|
25
|
+
export { TableBody } from './components/Table/components/TableBody.esm.js';
|
|
26
|
+
export { Column } from './components/Table/components/Column.esm.js';
|
|
27
|
+
export { Row } from './components/Table/components/Row.esm.js';
|
|
28
|
+
export { Cell } from './components/Table/components/Cell.esm.js';
|
|
29
|
+
export { CellProfile } from './components/Table/components/CellProfile.esm.js';
|
|
30
|
+
export { useTable } from './components/Table/hooks/useTable.esm.js';
|
|
31
|
+
export { TablePagination } from './components/TablePagination/TablePagination.esm.js';
|
|
25
32
|
export { Tab, TabList, TabPanel, Tabs } from './components/Tabs/Tabs.esm.js';
|
|
26
33
|
export { Text } from './components/Text/Text.esm.js';
|
|
27
34
|
export { TextField } from './components/TextField/TextField.esm.js';
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -102,7 +102,14 @@ const componentDefinitions = {
|
|
|
102
102
|
root: "bui-HeaderPage",
|
|
103
103
|
content: "bui-HeaderPageContent",
|
|
104
104
|
tabsWrapper: "bui-HeaderPageTabsWrapper",
|
|
105
|
-
controls: "bui-HeaderPageControls"
|
|
105
|
+
controls: "bui-HeaderPageControls",
|
|
106
|
+
sticky: "bui-HeaderPageSticky",
|
|
107
|
+
stickyWrapper: "bui-HeaderPageStickyWrapper",
|
|
108
|
+
stickyContent: "bui-HeaderPageStickyContent",
|
|
109
|
+
breadcrumbs: "bui-HeaderPageBreadcrumbs",
|
|
110
|
+
breadcrumb: "bui-HeaderPageBreadcrumb",
|
|
111
|
+
breadcrumbLink: "bui-HeaderPageBreadcrumbLink",
|
|
112
|
+
breadcrumbSeparator: "bui-HeaderPageBreadcrumbSeparator"
|
|
106
113
|
}
|
|
107
114
|
},
|
|
108
115
|
Heading: {
|
|
@@ -179,6 +186,9 @@ const componentDefinitions = {
|
|
|
179
186
|
classNames: {
|
|
180
187
|
root: "bui-SearchField",
|
|
181
188
|
clear: "bui-InputClear"
|
|
189
|
+
},
|
|
190
|
+
dataAttributes: {
|
|
191
|
+
startCollapsed: [true, false]
|
|
182
192
|
}
|
|
183
193
|
},
|
|
184
194
|
Select: {
|
|
@@ -209,16 +219,17 @@ const componentDefinitions = {
|
|
|
209
219
|
},
|
|
210
220
|
Table: {
|
|
211
221
|
classNames: {
|
|
212
|
-
|
|
222
|
+
table: "bui-Table",
|
|
213
223
|
header: "bui-TableHeader",
|
|
214
224
|
body: "bui-TableBody",
|
|
215
225
|
row: "bui-TableRow",
|
|
216
226
|
head: "bui-TableHead",
|
|
227
|
+
headSortButton: "bui-TableHeadSortButton",
|
|
217
228
|
caption: "bui-TableCaption",
|
|
218
229
|
cell: "bui-TableCell",
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
230
|
+
cellContentWrapper: "bui-TableCellContentWrapper",
|
|
231
|
+
cellContent: "bui-TableCellContent",
|
|
232
|
+
cellIcon: "bui-TableCellIcon",
|
|
222
233
|
cellProfileAvatar: "bui-TableCellProfileAvatar",
|
|
223
234
|
cellProfileAvatarImage: "bui-TableCellProfileAvatarImage",
|
|
224
235
|
cellProfileAvatarFallback: "bui-TableCellProfileAvatarFallback",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"componentDefinitions.esm.js","sources":["../../src/utils/componentDefinitions.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { ComponentDefinition } from '../types';\n\n/**\n * Component definitions for the Backstage UI library\n * @public\n */\nexport const componentDefinitions = {\n Avatar: {\n classNames: {\n root: 'bui-AvatarRoot',\n image: 'bui-AvatarImage',\n fallback: 'bui-AvatarFallback',\n },\n dataAttributes: {\n size: ['small', 'medium', 'large'] as const,\n },\n },\n Box: {\n classNames: {\n root: 'bui-Box',\n },\n },\n Button: {\n classNames: {\n root: 'bui-Button',\n },\n dataAttributes: {\n size: ['small', 'medium', 'large'] as const,\n variant: ['primary', 'secondary', 'tertiary'] as const,\n },\n },\n ButtonIcon: {\n classNames: {\n root: 'bui-ButtonIcon',\n },\n },\n ButtonLink: {\n classNames: {\n root: 'bui-ButtonLink',\n },\n },\n Card: {\n classNames: {\n root: 'bui-Card',\n header: 'bui-CardHeader',\n body: 'bui-CardBody',\n footer: 'bui-CardFooter',\n },\n },\n Checkbox: {\n classNames: {\n root: 'bui-CheckboxRoot',\n label: 'bui-CheckboxLabel',\n indicator: 'bui-CheckboxIndicator',\n },\n dataAttributes: {\n checked: [true, false] as const,\n },\n },\n Collapsible: {\n classNames: {\n root: 'bui-CollapsibleRoot',\n trigger: 'bui-CollapsibleTrigger',\n panel: 'bui-CollapsiblePanel',\n },\n },\n Container: {\n classNames: {\n root: 'bui-Container',\n },\n },\n FieldLabel: {\n classNames: {\n root: 'bui-FieldLabelWrapper',\n label: 'bui-FieldLabel',\n secondaryLabel: 'bui-FieldSecondaryLabel',\n description: 'bui-FieldDescription',\n },\n },\n Flex: {\n classNames: {\n root: 'bui-Flex',\n },\n },\n Grid: {\n classNames: {\n root: 'bui-Grid',\n item: 'bui-GridItem',\n },\n },\n Header: {\n classNames: {\n toolbar: 'bui-HeaderToolbar',\n toolbarWrapper: 'bui-HeaderToolbarWrapper',\n toolbarContent: 'bui-HeaderToolbarContent',\n toolbarControls: 'bui-HeaderToolbarControls',\n toolbarIcon: 'bui-HeaderToolbarIcon',\n toolbarName: 'bui-HeaderToolbarName',\n breadcrumbs: 'bui-HeaderBreadcrumbs',\n breadcrumb: 'bui-HeaderBreadcrumb',\n breadcrumbLink: 'bui-HeaderBreadcrumbLink',\n breadcrumbSeparator: 'bui-HeaderBreadcrumbSeparator',\n tabsWrapper: 'bui-HeaderTabsWrapper',\n },\n },\n HeaderPage: {\n classNames: {\n root: 'bui-HeaderPage',\n content: 'bui-HeaderPageContent',\n tabsWrapper: 'bui-HeaderPageTabsWrapper',\n controls: 'bui-HeaderPageControls',\n },\n },\n Heading: {\n classNames: {\n root: 'bui-Heading',\n },\n dataAttributes: {\n variant: ['title1', 'title2', 'title3', 'subtitle'] as const,\n color: ['primary', 'secondary', 'muted'] as const,\n truncate: [true, false] as const,\n },\n },\n Icon: {\n classNames: {\n root: 'bui-Icon',\n },\n },\n Link: {\n classNames: {\n root: 'bui-Link',\n },\n dataAttributes: {\n variant: ['subtitle', 'body', 'caption', 'label'] as const,\n weight: ['regular', 'bold'] as const,\n },\n },\n List: {\n classNames: {\n root: 'bui-List',\n row: 'bui-ListRow',\n label: 'bui-ListLabel',\n },\n },\n Menu: {\n classNames: {\n trigger: 'bui-MenuTrigger',\n backdrop: 'bui-MenuBackdrop',\n positioner: 'bui-MenuPositioner',\n popup: 'bui-MenuPopup',\n arrow: 'bui-MenuArrow',\n item: 'bui-MenuItem',\n group: 'bui-MenuGroup',\n groupLabel: 'bui-MenuGroupLabel',\n radioGroup: 'bui-MenuRadioGroup',\n radioItem: 'bui-MenuRadioItem',\n radioItemIndicator: 'bui-MenuRadioItemIndicator',\n checkboxItem: 'bui-MenuCheckboxItem',\n checkboxItemIndicator: 'bui-MenuCheckboxItemIndicator',\n submenuTrigger: 'bui-MenuSubmenuTrigger',\n separator: 'bui-MenuSeparator',\n },\n },\n Popover: {\n classNames: {\n root: 'bui-Popover',\n },\n },\n RadioGroup: {\n classNames: {\n root: 'bui-RadioGroup',\n content: 'bui-RadioGroupContent',\n radio: 'bui-Radio',\n },\n },\n ScrollArea: {\n classNames: {\n root: 'bui-ScrollAreaRoot',\n viewport: 'bui-ScrollAreaViewport',\n scrollbar: 'bui-ScrollAreaScrollbar',\n thumb: 'bui-ScrollAreaThumb',\n },\n },\n SearchField: {\n classNames: {\n root: 'bui-SearchField',\n clear: 'bui-InputClear',\n },\n },\n Select: {\n classNames: {\n root: 'bui-Select',\n trigger: 'bui-SelectTrigger',\n value: 'bui-SelectValue',\n icon: 'bui-SelectIcon',\n list: 'bui-SelectList',\n item: 'bui-SelectItem',\n itemIndicator: 'bui-SelectItemIndicator',\n itemLabel: 'bui-SelectItemLabel',\n },\n dataAttributes: {\n size: ['small', 'medium'] as const,\n },\n },\n Skeleton: {\n classNames: {\n root: 'bui-Skeleton',\n },\n },\n Switch: {\n classNames: {\n root: 'bui-Switch',\n indicator: 'bui-SwitchIndicator',\n },\n },\n Table: {\n classNames: {\n root: 'bui-TableRoot',\n header: 'bui-TableHeader',\n body: 'bui-TableBody',\n row: 'bui-TableRow',\n head: 'bui-TableHead',\n caption: 'bui-TableCaption',\n cell: 'bui-TableCell',\n cellText: 'bui-TableCellText',\n cellLink: 'bui-TableCellLink',\n cellProfile: 'bui-TableCellProfile',\n cellProfileAvatar: 'bui-TableCellProfileAvatar',\n cellProfileAvatarImage: 'bui-TableCellProfileAvatarImage',\n cellProfileAvatarFallback: 'bui-TableCellProfileAvatarFallback',\n cellProfileName: 'bui-TableCellProfileName',\n cellProfileLink: 'bui-TableCellProfileLink',\n },\n },\n Tabs: {\n classNames: {\n tabs: 'bui-Tabs',\n tabList: 'bui-TabList',\n tabListWrapper: 'bui-TabListWrapper',\n tab: 'bui-Tab',\n tabActive: 'bui-TabActive',\n tabHovered: 'bui-TabHovered',\n panel: 'bui-TabPanel',\n },\n },\n Text: {\n classNames: {\n root: 'bui-Text',\n },\n dataAttributes: {\n variant: ['subtitle', 'body', 'caption', 'label'] as const,\n weight: ['regular', 'bold'] as const,\n color: ['primary', 'secondary', 'danger', 'warning', 'success'] as const,\n truncate: [true, false] as const,\n },\n },\n TextField: {\n classNames: {\n root: 'bui-TextField',\n inputWrapper: 'bui-InputWrapper',\n input: 'bui-Input',\n inputIcon: 'bui-InputIcon',\n },\n dataAttributes: {\n invalid: [true, false] as const,\n disabled: [true, false] as const,\n },\n },\n Tooltip: {\n classNames: {\n tooltip: 'bui-Tooltip',\n arrow: 'bui-TooltipArrow',\n },\n },\n} as const satisfies Record<string, ComponentDefinition>;\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"componentDefinitions.esm.js","sources":["../../src/utils/componentDefinitions.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { ComponentDefinition } from '../types';\n\n/**\n * Component definitions for the Backstage UI library\n * @public\n */\nexport const componentDefinitions = {\n Avatar: {\n classNames: {\n root: 'bui-AvatarRoot',\n image: 'bui-AvatarImage',\n fallback: 'bui-AvatarFallback',\n },\n dataAttributes: {\n size: ['small', 'medium', 'large'] as const,\n },\n },\n Box: {\n classNames: {\n root: 'bui-Box',\n },\n },\n Button: {\n classNames: {\n root: 'bui-Button',\n },\n dataAttributes: {\n size: ['small', 'medium', 'large'] as const,\n variant: ['primary', 'secondary', 'tertiary'] as const,\n },\n },\n ButtonIcon: {\n classNames: {\n root: 'bui-ButtonIcon',\n },\n },\n ButtonLink: {\n classNames: {\n root: 'bui-ButtonLink',\n },\n },\n Card: {\n classNames: {\n root: 'bui-Card',\n header: 'bui-CardHeader',\n body: 'bui-CardBody',\n footer: 'bui-CardFooter',\n },\n },\n Checkbox: {\n classNames: {\n root: 'bui-CheckboxRoot',\n label: 'bui-CheckboxLabel',\n indicator: 'bui-CheckboxIndicator',\n },\n dataAttributes: {\n checked: [true, false] as const,\n },\n },\n Collapsible: {\n classNames: {\n root: 'bui-CollapsibleRoot',\n trigger: 'bui-CollapsibleTrigger',\n panel: 'bui-CollapsiblePanel',\n },\n },\n Container: {\n classNames: {\n root: 'bui-Container',\n },\n },\n FieldLabel: {\n classNames: {\n root: 'bui-FieldLabelWrapper',\n label: 'bui-FieldLabel',\n secondaryLabel: 'bui-FieldSecondaryLabel',\n description: 'bui-FieldDescription',\n },\n },\n Flex: {\n classNames: {\n root: 'bui-Flex',\n },\n },\n Grid: {\n classNames: {\n root: 'bui-Grid',\n item: 'bui-GridItem',\n },\n },\n Header: {\n classNames: {\n toolbar: 'bui-HeaderToolbar',\n toolbarWrapper: 'bui-HeaderToolbarWrapper',\n toolbarContent: 'bui-HeaderToolbarContent',\n toolbarControls: 'bui-HeaderToolbarControls',\n toolbarIcon: 'bui-HeaderToolbarIcon',\n toolbarName: 'bui-HeaderToolbarName',\n breadcrumbs: 'bui-HeaderBreadcrumbs',\n breadcrumb: 'bui-HeaderBreadcrumb',\n breadcrumbLink: 'bui-HeaderBreadcrumbLink',\n breadcrumbSeparator: 'bui-HeaderBreadcrumbSeparator',\n tabsWrapper: 'bui-HeaderTabsWrapper',\n },\n },\n HeaderPage: {\n classNames: {\n root: 'bui-HeaderPage',\n content: 'bui-HeaderPageContent',\n tabsWrapper: 'bui-HeaderPageTabsWrapper',\n controls: 'bui-HeaderPageControls',\n sticky: 'bui-HeaderPageSticky',\n stickyWrapper: 'bui-HeaderPageStickyWrapper',\n stickyContent: 'bui-HeaderPageStickyContent',\n breadcrumbs: 'bui-HeaderPageBreadcrumbs',\n breadcrumb: 'bui-HeaderPageBreadcrumb',\n breadcrumbLink: 'bui-HeaderPageBreadcrumbLink',\n breadcrumbSeparator: 'bui-HeaderPageBreadcrumbSeparator',\n },\n },\n Heading: {\n classNames: {\n root: 'bui-Heading',\n },\n dataAttributes: {\n variant: ['title1', 'title2', 'title3', 'subtitle'] as const,\n color: ['primary', 'secondary', 'muted'] as const,\n truncate: [true, false] as const,\n },\n },\n Icon: {\n classNames: {\n root: 'bui-Icon',\n },\n },\n Link: {\n classNames: {\n root: 'bui-Link',\n },\n dataAttributes: {\n variant: ['subtitle', 'body', 'caption', 'label'] as const,\n weight: ['regular', 'bold'] as const,\n },\n },\n List: {\n classNames: {\n root: 'bui-List',\n row: 'bui-ListRow',\n label: 'bui-ListLabel',\n },\n },\n Menu: {\n classNames: {\n trigger: 'bui-MenuTrigger',\n backdrop: 'bui-MenuBackdrop',\n positioner: 'bui-MenuPositioner',\n popup: 'bui-MenuPopup',\n arrow: 'bui-MenuArrow',\n item: 'bui-MenuItem',\n group: 'bui-MenuGroup',\n groupLabel: 'bui-MenuGroupLabel',\n radioGroup: 'bui-MenuRadioGroup',\n radioItem: 'bui-MenuRadioItem',\n radioItemIndicator: 'bui-MenuRadioItemIndicator',\n checkboxItem: 'bui-MenuCheckboxItem',\n checkboxItemIndicator: 'bui-MenuCheckboxItemIndicator',\n submenuTrigger: 'bui-MenuSubmenuTrigger',\n separator: 'bui-MenuSeparator',\n },\n },\n Popover: {\n classNames: {\n root: 'bui-Popover',\n },\n },\n RadioGroup: {\n classNames: {\n root: 'bui-RadioGroup',\n content: 'bui-RadioGroupContent',\n radio: 'bui-Radio',\n },\n },\n ScrollArea: {\n classNames: {\n root: 'bui-ScrollAreaRoot',\n viewport: 'bui-ScrollAreaViewport',\n scrollbar: 'bui-ScrollAreaScrollbar',\n thumb: 'bui-ScrollAreaThumb',\n },\n },\n SearchField: {\n classNames: {\n root: 'bui-SearchField',\n clear: 'bui-InputClear',\n },\n dataAttributes: {\n startCollapsed: [true, false] as const,\n },\n },\n Select: {\n classNames: {\n root: 'bui-Select',\n trigger: 'bui-SelectTrigger',\n value: 'bui-SelectValue',\n icon: 'bui-SelectIcon',\n list: 'bui-SelectList',\n item: 'bui-SelectItem',\n itemIndicator: 'bui-SelectItemIndicator',\n itemLabel: 'bui-SelectItemLabel',\n },\n dataAttributes: {\n size: ['small', 'medium'] as const,\n },\n },\n Skeleton: {\n classNames: {\n root: 'bui-Skeleton',\n },\n },\n Switch: {\n classNames: {\n root: 'bui-Switch',\n indicator: 'bui-SwitchIndicator',\n },\n },\n Table: {\n classNames: {\n table: 'bui-Table',\n header: 'bui-TableHeader',\n body: 'bui-TableBody',\n row: 'bui-TableRow',\n head: 'bui-TableHead',\n headSortButton: 'bui-TableHeadSortButton',\n caption: 'bui-TableCaption',\n cell: 'bui-TableCell',\n cellContentWrapper: 'bui-TableCellContentWrapper',\n cellContent: 'bui-TableCellContent',\n cellIcon: 'bui-TableCellIcon',\n cellProfileAvatar: 'bui-TableCellProfileAvatar',\n cellProfileAvatarImage: 'bui-TableCellProfileAvatarImage',\n cellProfileAvatarFallback: 'bui-TableCellProfileAvatarFallback',\n cellProfileName: 'bui-TableCellProfileName',\n cellProfileLink: 'bui-TableCellProfileLink',\n },\n },\n Tabs: {\n classNames: {\n tabs: 'bui-Tabs',\n tabList: 'bui-TabList',\n tabListWrapper: 'bui-TabListWrapper',\n tab: 'bui-Tab',\n tabActive: 'bui-TabActive',\n tabHovered: 'bui-TabHovered',\n panel: 'bui-TabPanel',\n },\n },\n Text: {\n classNames: {\n root: 'bui-Text',\n },\n dataAttributes: {\n variant: ['subtitle', 'body', 'caption', 'label'] as const,\n weight: ['regular', 'bold'] as const,\n color: ['primary', 'secondary', 'danger', 'warning', 'success'] as const,\n truncate: [true, false] as const,\n },\n },\n TextField: {\n classNames: {\n root: 'bui-TextField',\n inputWrapper: 'bui-InputWrapper',\n input: 'bui-Input',\n inputIcon: 'bui-InputIcon',\n },\n dataAttributes: {\n invalid: [true, false] as const,\n disabled: [true, false] as const,\n },\n },\n Tooltip: {\n classNames: {\n tooltip: 'bui-Tooltip',\n arrow: 'bui-TooltipArrow',\n },\n },\n} as const satisfies Record<string, ComponentDefinition>;\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
function isExternalLink(href) {
|
|
2
|
+
if (!href) return false;
|
|
3
|
+
if (href.startsWith("http://") || href.startsWith("https://")) {
|
|
4
|
+
return true;
|
|
5
|
+
}
|
|
6
|
+
if (href.startsWith("//")) {
|
|
7
|
+
return true;
|
|
8
|
+
}
|
|
9
|
+
if (href.startsWith("mailto:") || href.startsWith("tel:")) {
|
|
10
|
+
return true;
|
|
11
|
+
}
|
|
12
|
+
return false;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
export { isExternalLink };
|
|
16
|
+
//# sourceMappingURL=isExternalLink.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"isExternalLink.esm.js","sources":["../../src/utils/isExternalLink.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * Determines if a link is external.\n * @param href - The href of the link.\n * @returns True if the link is external, false otherwise.\n * @internal\n */\nexport function isExternalLink(href?: string): boolean {\n if (!href) return false;\n\n // Check if it's an absolute URL with protocol\n if (href.startsWith('http://') || href.startsWith('https://')) {\n return true;\n }\n\n // Check if it's a protocol-relative URL\n if (href.startsWith('//')) {\n return true;\n }\n\n // Check if it's a mailto: or tel: link\n if (href.startsWith('mailto:') || href.startsWith('tel:')) {\n return true;\n }\n\n return false;\n}\n"],"names":[],"mappings":"AAsBO,SAAS,eAAe,IAAwB,EAAA;AACrD,EAAI,IAAA,CAAC,MAAa,OAAA,KAAA;AAGlB,EAAA,IAAI,KAAK,UAAW,CAAA,SAAS,KAAK,IAAK,CAAA,UAAA,CAAW,UAAU,CAAG,EAAA;AAC7D,IAAO,OAAA,IAAA;AAAA;AAIT,EAAI,IAAA,IAAA,CAAK,UAAW,CAAA,IAAI,CAAG,EAAA;AACzB,IAAO,OAAA,IAAA;AAAA;AAIT,EAAA,IAAI,KAAK,UAAW,CAAA,SAAS,KAAK,IAAK,CAAA,UAAA,CAAW,MAAM,CAAG,EAAA;AACzD,IAAO,OAAA,IAAA;AAAA;AAGT,EAAO,OAAA,KAAA;AACT;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage/ui",
|
|
3
|
-
"version": "0.7.0-next.
|
|
3
|
+
"version": "0.7.0-next.3",
|
|
4
4
|
"backstage": {
|
|
5
5
|
"role": "web-library"
|
|
6
6
|
},
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"react-aria-components": "^1.10.1"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
|
-
"@backstage/cli": "0.34.0-next.
|
|
53
|
+
"@backstage/cli": "0.34.0-next.2",
|
|
54
54
|
"@storybook/addon-essentials": "^8.6.12",
|
|
55
55
|
"@storybook/addon-interactions": "^8.6.12",
|
|
56
56
|
"@storybook/addon-styling-webpack": "^1.0.1",
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { forwardRef } from 'react';
|
|
3
|
-
import { Table } from '../Table/Table.esm.js';
|
|
4
|
-
import { DataTableRoot } from './Root/DataTableRoot.esm.js';
|
|
5
|
-
import { DataTablePagination } from './Pagination/DataTablePagination.esm.js';
|
|
6
|
-
import { DataTableTable } from './Table/DataTableTable.esm.js';
|
|
7
|
-
|
|
8
|
-
const TableRoot = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Table.Root, { ref, ...props }));
|
|
9
|
-
TableRoot.displayName = Table.Root.displayName;
|
|
10
|
-
const DataTable = {
|
|
11
|
-
Root: DataTableRoot,
|
|
12
|
-
Pagination: DataTablePagination,
|
|
13
|
-
Table: DataTableTable,
|
|
14
|
-
TableRoot,
|
|
15
|
-
TableHeader: Table.Header,
|
|
16
|
-
TableBody: Table.Body,
|
|
17
|
-
TableRow: Table.Row,
|
|
18
|
-
TableCell: Table.Cell,
|
|
19
|
-
TableCellText: Table.CellText,
|
|
20
|
-
TableCellLink: Table.CellLink,
|
|
21
|
-
TableCellProfile: Table.CellProfile,
|
|
22
|
-
TableHead: Table.Head
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export { DataTable };
|
|
26
|
-
//# sourceMappingURL=DataTable.esm.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.esm.js","sources":["../../../src/components/DataTable/DataTable.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Table } from '../Table';\nimport { DataTableRoot } from './Root/DataTableRoot';\nimport { DataTablePagination } from './Pagination/DataTablePagination';\nimport { Table as TanstackTable } from '@tanstack/react-table';\nimport { DataTableTable } from './Table/DataTableTable';\n\nconst TableRoot = forwardRef<\n React.ElementRef<typeof Table.Root>,\n React.ComponentPropsWithoutRef<typeof Table.Root>\n>(({ className, ...props }, ref) => <Table.Root ref={ref} {...props} />);\nTableRoot.displayName = Table.Root.displayName;\n\n/**\n * DataTable component for displaying tabular data with pagination\n * @public\n */\nexport const DataTable = {\n Root: DataTableRoot as <TData>(\n props: {\n table: TanstackTable<TData>;\n } & React.HTMLAttributes<HTMLDivElement>,\n ) => JSX.Element,\n Pagination: DataTablePagination,\n Table: DataTableTable,\n TableRoot: TableRoot,\n TableHeader: Table.Header,\n TableBody: Table.Body,\n TableRow: Table.Row,\n TableCell: Table.Cell,\n TableCellText: Table.CellText,\n TableCellLink: Table.CellLink,\n TableCellProfile: Table.CellProfile,\n TableHead: Table.Head,\n};\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,YAAY,UAGhB,CAAA,CAAC,EAAE,SAAA,EAAW,GAAG,KAAM,EAAA,EAAG,GAAQ,qBAAA,GAAA,CAAC,MAAM,IAAN,EAAA,EAAW,GAAW,EAAA,GAAG,OAAO,CAAE,CAAA;AACvE,SAAU,CAAA,WAAA,GAAc,MAAM,IAAK,CAAA,WAAA;AAM5B,MAAM,SAAY,GAAA;AAAA,EACvB,IAAM,EAAA,aAAA;AAAA,EAKN,UAAY,EAAA,mBAAA;AAAA,EACZ,KAAO,EAAA,cAAA;AAAA,EACP,SAAA;AAAA,EACA,aAAa,KAAM,CAAA,MAAA;AAAA,EACnB,WAAW,KAAM,CAAA,IAAA;AAAA,EACjB,UAAU,KAAM,CAAA,GAAA;AAAA,EAChB,WAAW,KAAM,CAAA,IAAA;AAAA,EACjB,eAAe,KAAM,CAAA,QAAA;AAAA,EACrB,eAAe,KAAM,CAAA,QAAA;AAAA,EACrB,kBAAkB,KAAM,CAAA,WAAA;AAAA,EACxB,WAAW,KAAM,CAAA;AACnB;;;;"}
|
|
@@ -1,84 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { forwardRef } from 'react';
|
|
3
|
-
import { Text } from '../../Text/Text.esm.js';
|
|
4
|
-
import { ButtonIcon } from '../../ButtonIcon/ButtonIcon.esm.js';
|
|
5
|
-
import clsx from 'clsx';
|
|
6
|
-
import { Select } from '../../Select/Select.esm.js';
|
|
7
|
-
import { useDataTable } from '../Root/DataTableRoot.esm.js';
|
|
8
|
-
import '@remixicon/react';
|
|
9
|
-
import { Icon } from '../../Icon/Icon.esm.js';
|
|
10
|
-
import '../../Icon/context.esm.js';
|
|
11
|
-
|
|
12
|
-
const DataTablePagination = forwardRef(
|
|
13
|
-
(props, ref) => {
|
|
14
|
-
const { className, ...rest } = props;
|
|
15
|
-
const { table } = useDataTable();
|
|
16
|
-
const pageIndex = table?.getState().pagination.pageIndex;
|
|
17
|
-
const pageSize = table?.getState().pagination.pageSize;
|
|
18
|
-
const rowCount = table?.getRowCount();
|
|
19
|
-
const fromCount = (pageIndex ?? 0) * (pageSize ?? 10) + 1;
|
|
20
|
-
const toCount = Math.min(
|
|
21
|
-
((pageIndex ?? 0) + 1) * (pageSize ?? 10),
|
|
22
|
-
rowCount
|
|
23
|
-
);
|
|
24
|
-
return /* @__PURE__ */ jsxs(
|
|
25
|
-
"div",
|
|
26
|
-
{
|
|
27
|
-
ref,
|
|
28
|
-
style: { minWidth: table?.getTotalSize() },
|
|
29
|
-
className: clsx("bui-DataTablePagination", className),
|
|
30
|
-
...rest,
|
|
31
|
-
children: [
|
|
32
|
-
/* @__PURE__ */ jsx("div", { className: "bui-DataTablePagination--left", children: !table.options.manualPagination && /* @__PURE__ */ jsx(
|
|
33
|
-
Select,
|
|
34
|
-
{
|
|
35
|
-
name: "pageSize",
|
|
36
|
-
size: "small",
|
|
37
|
-
placeholder: "Show 10 results",
|
|
38
|
-
options: [
|
|
39
|
-
{ label: "Show 5 results", value: "5" },
|
|
40
|
-
{ label: "Show 10 results", value: "10" },
|
|
41
|
-
{ label: "Show 20 results", value: "20" },
|
|
42
|
-
{ label: "Show 30 results", value: "30" },
|
|
43
|
-
{ label: "Show 40 results", value: "40" },
|
|
44
|
-
{ label: "Show 50 results", value: "50" }
|
|
45
|
-
],
|
|
46
|
-
selectedKey: pageSize?.toString(),
|
|
47
|
-
onSelectionChange: (value) => {
|
|
48
|
-
table?.setPageSize(Number(value));
|
|
49
|
-
},
|
|
50
|
-
className: "bui-DataTablePagination--select"
|
|
51
|
-
}
|
|
52
|
-
) }),
|
|
53
|
-
/* @__PURE__ */ jsxs("div", { className: "bui-DataTablePagination--right", children: [
|
|
54
|
-
/* @__PURE__ */ jsx(Text, { variant: "body-medium", children: `${fromCount} - ${toCount} of ${rowCount}` }),
|
|
55
|
-
/* @__PURE__ */ jsx(
|
|
56
|
-
ButtonIcon,
|
|
57
|
-
{
|
|
58
|
-
variant: "secondary",
|
|
59
|
-
size: "small",
|
|
60
|
-
onClick: () => table?.previousPage(),
|
|
61
|
-
isDisabled: !table?.getCanPreviousPage(),
|
|
62
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevron-left" })
|
|
63
|
-
}
|
|
64
|
-
),
|
|
65
|
-
/* @__PURE__ */ jsx(
|
|
66
|
-
ButtonIcon,
|
|
67
|
-
{
|
|
68
|
-
variant: "secondary",
|
|
69
|
-
size: "small",
|
|
70
|
-
onClick: () => table?.nextPage(),
|
|
71
|
-
isDisabled: !table?.getCanNextPage(),
|
|
72
|
-
icon: /* @__PURE__ */ jsx(Icon, { name: "chevron-right" })
|
|
73
|
-
}
|
|
74
|
-
)
|
|
75
|
-
] })
|
|
76
|
-
]
|
|
77
|
-
}
|
|
78
|
-
);
|
|
79
|
-
}
|
|
80
|
-
);
|
|
81
|
-
DataTablePagination.displayName = "DataTablePagination";
|
|
82
|
-
|
|
83
|
-
export { DataTablePagination };
|
|
84
|
-
//# sourceMappingURL=DataTablePagination.esm.js.map
|