design-zystem 1.0.435 → 1.0.436
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/ui/index.d.mts +27 -9
- package/dist/ui/index.d.ts +27 -9
- package/dist/ui/index.js +615 -520
- package/dist/ui/index.mjs +616 -521
- package/dist/ui/style.css +1 -1
- package/package.json +1 -1
package/dist/ui/index.d.mts
CHANGED
|
@@ -729,6 +729,8 @@ interface RowSelection {
|
|
|
729
729
|
isRange?: boolean;
|
|
730
730
|
}) => void;
|
|
731
731
|
toggleAllOnPage: () => void;
|
|
732
|
+
getGroupState: (groupIds: RowId[]) => HeaderCheckState;
|
|
733
|
+
toggleGroup: (groupIds: RowId[]) => void;
|
|
732
734
|
selectAllResults: () => void;
|
|
733
735
|
clear: () => void;
|
|
734
736
|
}
|
|
@@ -860,6 +862,7 @@ interface TableRowProps {
|
|
|
860
862
|
* dont `measureElement` lit cet attribut sur l'élément mesuré pour retrouver
|
|
861
863
|
* quelle ligne a changé de taille). Sans objet hors virtualisation. */
|
|
862
864
|
'data-index'?: number;
|
|
865
|
+
isMuted?: boolean;
|
|
863
866
|
}
|
|
864
867
|
declare const TableRow: react.ForwardRefExoticComponent<TableRowProps & react.RefAttributes<HTMLTableRowElement>>;
|
|
865
868
|
|
|
@@ -867,6 +870,11 @@ declare const SURFACE_CLASS: {
|
|
|
867
870
|
readonly white: "bg-white";
|
|
868
871
|
readonly 'grey-100': "bg-grey-100";
|
|
869
872
|
};
|
|
873
|
+
declare const LINE_CLAMP_CLASS: {
|
|
874
|
+
readonly 2: "line-clamp-2";
|
|
875
|
+
readonly 3: "line-clamp-3";
|
|
876
|
+
};
|
|
877
|
+
type TableCellTheme = Exclude<ColorToken, 'red-900'>;
|
|
870
878
|
declare const CURSOR_CLASS: {
|
|
871
879
|
readonly pointer: "cursor-pointer";
|
|
872
880
|
};
|
|
@@ -893,8 +901,12 @@ interface TableCellProps {
|
|
|
893
901
|
className?: string;
|
|
894
902
|
/** Fusionne la cellule sur ce nombre de colonnes — ignore `width` pour laisser le navigateur répartir l'espace fusionné. */
|
|
895
903
|
colSpan?: number;
|
|
904
|
+
wrap?: boolean;
|
|
905
|
+
maxLines?: keyof typeof LINE_CLAMP_CLASS;
|
|
906
|
+
tooltip?: ReactNode;
|
|
907
|
+
theme?: TableCellTheme;
|
|
896
908
|
}
|
|
897
|
-
declare const TableCell: ({ children, secondary, isExpanded, width, centerContent, sticky, stickyOffset, surface, backgroundColor, accentColor, borderLeft, colSpan, cursor, className, }: TableCellProps) => react.JSX.Element;
|
|
909
|
+
declare const TableCell: ({ children, secondary, isExpanded, width, centerContent, sticky, stickyOffset, surface, backgroundColor, accentColor, borderLeft, colSpan, cursor, className, wrap, maxLines, tooltip, theme, }: TableCellProps) => react.JSX.Element;
|
|
898
910
|
|
|
899
911
|
interface TableFooterProps {
|
|
900
912
|
children?: ReactNode;
|
|
@@ -935,15 +947,18 @@ interface TableGroupLabelProps {
|
|
|
935
947
|
selection?: TableGroupSelection;
|
|
936
948
|
}
|
|
937
949
|
|
|
938
|
-
interface
|
|
950
|
+
interface TableGroupBandProps extends TableGroupLabelProps {
|
|
939
951
|
colSpan: number;
|
|
952
|
+
canCollapseFromBand?: boolean;
|
|
940
953
|
}
|
|
941
|
-
declare const TableSectionRow: ({ colSpan, ...label }: TableSectionRowProps) => react.JSX.Element;
|
|
942
954
|
|
|
943
|
-
interface
|
|
944
|
-
|
|
955
|
+
interface TableSectionRowProps extends TableGroupBandProps {
|
|
956
|
+
endContent?: ReactNode;
|
|
945
957
|
}
|
|
946
|
-
declare const
|
|
958
|
+
declare const TableSectionRow: (props: TableSectionRowProps) => react.JSX.Element;
|
|
959
|
+
|
|
960
|
+
type TableSubgroupRowProps = TableGroupBandProps;
|
|
961
|
+
declare const TableSubgroupRow: (props: TableSubgroupRowProps) => react.JSX.Element;
|
|
947
962
|
|
|
948
963
|
type TableAlertTone = 'red' | 'yellow' | 'green' | 'blue';
|
|
949
964
|
interface TableAlertAction {
|
|
@@ -961,8 +976,9 @@ declare const TableAlertRow: ({ children, colSpan, tone, action, }: TableAlertRo
|
|
|
961
976
|
interface TableExpandedRowProps {
|
|
962
977
|
/** Des `TableCell` : la sous-ligne reprend les colonnes du tableau, avec les mêmes largeurs que l'en-tête. */
|
|
963
978
|
children?: ReactNode;
|
|
979
|
+
onClick?: () => void;
|
|
964
980
|
}
|
|
965
|
-
declare const TableExpandedRow: ({ children }: TableExpandedRowProps) => react.JSX.Element;
|
|
981
|
+
declare const TableExpandedRow: ({ children, onClick, }: TableExpandedRowProps) => react.JSX.Element;
|
|
966
982
|
|
|
967
983
|
interface TablePersonCellProps {
|
|
968
984
|
firstName: string;
|
|
@@ -976,7 +992,7 @@ interface TablePersonCellProps {
|
|
|
976
992
|
}
|
|
977
993
|
declare const TablePersonCell: ({ firstName, lastName, src, avatarBadge, secondary, onNameClick, isExpanded, width, }: TablePersonCellProps) => react.JSX.Element;
|
|
978
994
|
|
|
979
|
-
interface TableClientCellProps extends Pick<TableCellProps, 'width' | 'sticky' | 'stickyOffset' | 'isExpanded'> {
|
|
995
|
+
interface TableClientCellProps extends Pick<TableCellProps, 'width' | 'sticky' | 'stickyOffset' | 'isExpanded' | 'accentColor'> {
|
|
980
996
|
name: string;
|
|
981
997
|
color: HexColor;
|
|
982
998
|
onNameClick?: () => void;
|
|
@@ -999,6 +1015,7 @@ interface TableAction {
|
|
|
999
1015
|
/** Dit pourquoi l'action est indisponible, en infobulle. */
|
|
1000
1016
|
disabledReason?: string;
|
|
1001
1017
|
hasUnread?: boolean;
|
|
1018
|
+
inMenu?: boolean;
|
|
1002
1019
|
}
|
|
1003
1020
|
interface TableActionsCellProps {
|
|
1004
1021
|
actions: TableAction[];
|
|
@@ -1013,9 +1030,10 @@ interface TableSelectCellProps {
|
|
|
1013
1030
|
}) => void;
|
|
1014
1031
|
label: string;
|
|
1015
1032
|
disabled?: boolean;
|
|
1033
|
+
disabledReason?: string;
|
|
1016
1034
|
width?: string;
|
|
1017
1035
|
}
|
|
1018
|
-
declare const TableSelectCell: ({ isSelected, onToggle, label, disabled, width, }: TableSelectCellProps) => react.JSX.Element;
|
|
1036
|
+
declare const TableSelectCell: ({ isSelected, onToggle, label, disabled, disabledReason, width, }: TableSelectCellProps) => react.JSX.Element;
|
|
1019
1037
|
|
|
1020
1038
|
interface TableSelectHeaderCellProps {
|
|
1021
1039
|
state: HeaderCheckState;
|
package/dist/ui/index.d.ts
CHANGED
|
@@ -729,6 +729,8 @@ interface RowSelection {
|
|
|
729
729
|
isRange?: boolean;
|
|
730
730
|
}) => void;
|
|
731
731
|
toggleAllOnPage: () => void;
|
|
732
|
+
getGroupState: (groupIds: RowId[]) => HeaderCheckState;
|
|
733
|
+
toggleGroup: (groupIds: RowId[]) => void;
|
|
732
734
|
selectAllResults: () => void;
|
|
733
735
|
clear: () => void;
|
|
734
736
|
}
|
|
@@ -860,6 +862,7 @@ interface TableRowProps {
|
|
|
860
862
|
* dont `measureElement` lit cet attribut sur l'élément mesuré pour retrouver
|
|
861
863
|
* quelle ligne a changé de taille). Sans objet hors virtualisation. */
|
|
862
864
|
'data-index'?: number;
|
|
865
|
+
isMuted?: boolean;
|
|
863
866
|
}
|
|
864
867
|
declare const TableRow: react.ForwardRefExoticComponent<TableRowProps & react.RefAttributes<HTMLTableRowElement>>;
|
|
865
868
|
|
|
@@ -867,6 +870,11 @@ declare const SURFACE_CLASS: {
|
|
|
867
870
|
readonly white: "bg-white";
|
|
868
871
|
readonly 'grey-100': "bg-grey-100";
|
|
869
872
|
};
|
|
873
|
+
declare const LINE_CLAMP_CLASS: {
|
|
874
|
+
readonly 2: "line-clamp-2";
|
|
875
|
+
readonly 3: "line-clamp-3";
|
|
876
|
+
};
|
|
877
|
+
type TableCellTheme = Exclude<ColorToken, 'red-900'>;
|
|
870
878
|
declare const CURSOR_CLASS: {
|
|
871
879
|
readonly pointer: "cursor-pointer";
|
|
872
880
|
};
|
|
@@ -893,8 +901,12 @@ interface TableCellProps {
|
|
|
893
901
|
className?: string;
|
|
894
902
|
/** Fusionne la cellule sur ce nombre de colonnes — ignore `width` pour laisser le navigateur répartir l'espace fusionné. */
|
|
895
903
|
colSpan?: number;
|
|
904
|
+
wrap?: boolean;
|
|
905
|
+
maxLines?: keyof typeof LINE_CLAMP_CLASS;
|
|
906
|
+
tooltip?: ReactNode;
|
|
907
|
+
theme?: TableCellTheme;
|
|
896
908
|
}
|
|
897
|
-
declare const TableCell: ({ children, secondary, isExpanded, width, centerContent, sticky, stickyOffset, surface, backgroundColor, accentColor, borderLeft, colSpan, cursor, className, }: TableCellProps) => react.JSX.Element;
|
|
909
|
+
declare const TableCell: ({ children, secondary, isExpanded, width, centerContent, sticky, stickyOffset, surface, backgroundColor, accentColor, borderLeft, colSpan, cursor, className, wrap, maxLines, tooltip, theme, }: TableCellProps) => react.JSX.Element;
|
|
898
910
|
|
|
899
911
|
interface TableFooterProps {
|
|
900
912
|
children?: ReactNode;
|
|
@@ -935,15 +947,18 @@ interface TableGroupLabelProps {
|
|
|
935
947
|
selection?: TableGroupSelection;
|
|
936
948
|
}
|
|
937
949
|
|
|
938
|
-
interface
|
|
950
|
+
interface TableGroupBandProps extends TableGroupLabelProps {
|
|
939
951
|
colSpan: number;
|
|
952
|
+
canCollapseFromBand?: boolean;
|
|
940
953
|
}
|
|
941
|
-
declare const TableSectionRow: ({ colSpan, ...label }: TableSectionRowProps) => react.JSX.Element;
|
|
942
954
|
|
|
943
|
-
interface
|
|
944
|
-
|
|
955
|
+
interface TableSectionRowProps extends TableGroupBandProps {
|
|
956
|
+
endContent?: ReactNode;
|
|
945
957
|
}
|
|
946
|
-
declare const
|
|
958
|
+
declare const TableSectionRow: (props: TableSectionRowProps) => react.JSX.Element;
|
|
959
|
+
|
|
960
|
+
type TableSubgroupRowProps = TableGroupBandProps;
|
|
961
|
+
declare const TableSubgroupRow: (props: TableSubgroupRowProps) => react.JSX.Element;
|
|
947
962
|
|
|
948
963
|
type TableAlertTone = 'red' | 'yellow' | 'green' | 'blue';
|
|
949
964
|
interface TableAlertAction {
|
|
@@ -961,8 +976,9 @@ declare const TableAlertRow: ({ children, colSpan, tone, action, }: TableAlertRo
|
|
|
961
976
|
interface TableExpandedRowProps {
|
|
962
977
|
/** Des `TableCell` : la sous-ligne reprend les colonnes du tableau, avec les mêmes largeurs que l'en-tête. */
|
|
963
978
|
children?: ReactNode;
|
|
979
|
+
onClick?: () => void;
|
|
964
980
|
}
|
|
965
|
-
declare const TableExpandedRow: ({ children }: TableExpandedRowProps) => react.JSX.Element;
|
|
981
|
+
declare const TableExpandedRow: ({ children, onClick, }: TableExpandedRowProps) => react.JSX.Element;
|
|
966
982
|
|
|
967
983
|
interface TablePersonCellProps {
|
|
968
984
|
firstName: string;
|
|
@@ -976,7 +992,7 @@ interface TablePersonCellProps {
|
|
|
976
992
|
}
|
|
977
993
|
declare const TablePersonCell: ({ firstName, lastName, src, avatarBadge, secondary, onNameClick, isExpanded, width, }: TablePersonCellProps) => react.JSX.Element;
|
|
978
994
|
|
|
979
|
-
interface TableClientCellProps extends Pick<TableCellProps, 'width' | 'sticky' | 'stickyOffset' | 'isExpanded'> {
|
|
995
|
+
interface TableClientCellProps extends Pick<TableCellProps, 'width' | 'sticky' | 'stickyOffset' | 'isExpanded' | 'accentColor'> {
|
|
980
996
|
name: string;
|
|
981
997
|
color: HexColor;
|
|
982
998
|
onNameClick?: () => void;
|
|
@@ -999,6 +1015,7 @@ interface TableAction {
|
|
|
999
1015
|
/** Dit pourquoi l'action est indisponible, en infobulle. */
|
|
1000
1016
|
disabledReason?: string;
|
|
1001
1017
|
hasUnread?: boolean;
|
|
1018
|
+
inMenu?: boolean;
|
|
1002
1019
|
}
|
|
1003
1020
|
interface TableActionsCellProps {
|
|
1004
1021
|
actions: TableAction[];
|
|
@@ -1013,9 +1030,10 @@ interface TableSelectCellProps {
|
|
|
1013
1030
|
}) => void;
|
|
1014
1031
|
label: string;
|
|
1015
1032
|
disabled?: boolean;
|
|
1033
|
+
disabledReason?: string;
|
|
1016
1034
|
width?: string;
|
|
1017
1035
|
}
|
|
1018
|
-
declare const TableSelectCell: ({ isSelected, onToggle, label, disabled, width, }: TableSelectCellProps) => react.JSX.Element;
|
|
1036
|
+
declare const TableSelectCell: ({ isSelected, onToggle, label, disabled, disabledReason, width, }: TableSelectCellProps) => react.JSX.Element;
|
|
1019
1037
|
|
|
1020
1038
|
interface TableSelectHeaderCellProps {
|
|
1021
1039
|
state: HeaderCheckState;
|