@zvoove/unity-ui 2.41.0 → 2.42.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2338,6 +2338,8 @@ export declare type IsoWeek = {
2338
2338
  year: number;
2339
2339
  };
2340
2340
 
2341
+ export declare const isTableSectionRow: (row: unknown) => row is TableSectionRow;
2342
+
2341
2343
  export declare type JustifyContent = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
2342
2344
 
2343
2345
  declare type LabelStates = {
@@ -3959,10 +3961,12 @@ export declare type TabItem<T extends React.ElementType = 'button'> = {
3959
3961
  } & Omit<React.ComponentPropsWithoutRef<T>, 'children'>;
3960
3962
 
3961
3963
  export declare const Table: {
3962
- <T extends readonly TableColumnProps[]>({ data, columns, title, subtitle, actions, filters, footer, orderBy, onOrderByChange, emptyState, hiddenColumns, loading, expandedRows, headerBackgroundColor, }: TableProps<T>): JSX.Element;
3964
+ <T extends readonly TableColumnProps[]>({ data, columns, title, subtitle, actions, filters, footer, orderBy, onOrderByChange, emptyState, hiddenColumns, loading, expandedRows, headerBackgroundColor, onRowClick, linkComponent: LinkComponent, getRowLinkProps, rowAriaLabel, }: TableProps<T>): JSX.Element;
3963
3965
  displayName: string;
3964
3966
  };
3965
3967
 
3968
+ export declare type TableBodyRow<T extends readonly TableColumnProps[]> = TableRowData<T> | TableSectionRow;
3969
+
3966
3970
  export declare type TableColumnDirection = (typeof direction)[keyof typeof direction];
3967
3971
 
3968
3972
  export declare interface TableColumnProps extends React.HTMLAttributes<HTMLTableColElement> {
@@ -4010,9 +4014,9 @@ export declare interface TableProps<T extends readonly TableColumnProps[] = read
4010
4014
  */
4011
4015
  filters?: React.ReactNode;
4012
4016
  /**
4013
- * The data rows of the Table.
4017
+ * The data rows and optional section rows of the Table.
4014
4018
  */
4015
- data: TableRowData<T>[];
4019
+ data: TableBodyRow<T>[];
4016
4020
  /**
4017
4021
  * The loading state of the Table.
4018
4022
  */
@@ -4057,14 +4061,85 @@ export declare interface TableProps<T extends readonly TableColumnProps[] = read
4057
4061
  * @default false
4058
4062
  */
4059
4063
  headerBackgroundColor?: boolean;
4064
+ /**
4065
+ * Callback function to handle clicks on data rows.
4066
+ *
4067
+ * The index is the position in `data`, including any section rows.
4068
+ */
4069
+ onRowClick?: (event: React.MouseEvent<HTMLTableRowElement>, row: TableRowData<T>, index: number) => void;
4070
+ /**
4071
+ * The component used to render a row link.
4072
+ * @default 'a'
4073
+ */
4074
+ linkComponent?: React.ElementType;
4075
+ /**
4076
+ * Returns the props forwarded to the link for a data row.
4077
+ *
4078
+ * The index is the position in `data`, including any section rows.
4079
+ */
4080
+ getRowLinkProps?: (row: TableRowData<T>, index: number) => TableRowLinkProps | undefined;
4081
+ /**
4082
+ * Accessible name fallback for clickable rows without a non-empty string cell.
4083
+ * An explicit `aria-label` in `linkProps` or `getRowLinkProps` takes priority.
4084
+ * @default undefined
4085
+ */
4086
+ rowAriaLabel?: string;
4060
4087
  }
4061
4088
 
4062
- export declare type TableRowData<T extends readonly TableColumnProps[]> = {
4063
- [K in ColumnId<T>]: React.ReactNode;
4064
- } & {
4089
+ declare type TableRowCellData<T extends readonly TableColumnProps[]> = {
4090
+ [K in Exclude<ColumnId<T>, TableRowInteractionKey | 'expandableRow'>]: React.ReactNode;
4091
+ };
4092
+
4093
+ declare type TableRowCellValue = React.ReactNode | ExpandableRowConfig | React.MouseEventHandler<HTMLTableRowElement>;
4094
+
4095
+ export declare type TableRowData<T extends readonly TableColumnProps[]> = string extends ColumnId<T> ? TableRowDataForDynamicColumns : TableRowDataForDefinedColumns<T>;
4096
+
4097
+ declare type TableRowDataForDefinedColumns<T extends readonly TableColumnProps[]> = TableRowCellData<T> & {
4065
4098
  expandableRow?: ExpandableRowConfig;
4099
+ } & Partial<Pick<TableRowInteractionProps, Exclude<keyof TableRowInteractionProps, ColumnId<T>>>>;
4100
+
4101
+ declare type TableRowDataForDynamicColumns = Record<string, TableRowCellValue> & TableRowInteractionProps & {
4102
+ expandableRow?: ExpandableRowConfig;
4103
+ };
4104
+
4105
+ declare type TableRowInteractionKey = keyof TableRowInteractionProps;
4106
+
4107
+ /**
4108
+ * Optional interaction props supported by a data row.
4109
+ */
4110
+ export declare interface TableRowInteractionProps {
4111
+ onClick?: React.MouseEventHandler<HTMLTableRowElement>;
4112
+ href?: string;
4113
+ to?: string;
4114
+ target?: React.HTMLAttributeAnchorTarget;
4115
+ rel?: string;
4116
+ linkProps?: TableRowLinkProps;
4117
+ }
4118
+
4119
+ /**
4120
+ * Props forwarded to a row link component.
4121
+ *
4122
+ * `href` and `to` accept relative destinations and the `http`, `https`,
4123
+ * `mailto`, and `tel` protocols. Other protocols are ignored when rendered.
4124
+ */
4125
+ export declare type TableRowLinkProps = {
4126
+ href?: string;
4127
+ to?: string;
4128
+ target?: React.HTMLAttributeAnchorTarget;
4129
+ rel?: string;
4130
+ 'aria-label'?: string;
4131
+ [key: string]: unknown;
4066
4132
  };
4067
4133
 
4134
+ /**
4135
+ * A row that separates table data into a labeled section.
4136
+ */
4137
+ export declare interface TableSectionRow {
4138
+ type: 'section';
4139
+ label: React.ReactNode;
4140
+ id?: string;
4141
+ }
4142
+
4068
4143
  export declare const Tabs: {
4069
4144
  <T extends React.ElementType = "button">({ items, activeItem, onChange, hideBorder, itemsAlignment, isSticky, panels, linkComponent: LinkComponent, }: TabsProps<T>): JSX.Element;
4070
4145
  displayName: string;
@@ -4105,6 +4180,106 @@ export declare interface TabsProps<T extends React.ElementType = 'button'> {
4105
4180
  itemsAlignment?: 'left' | 'center' | 'right' | 'between' | 'around' | 'evenly';
4106
4181
  }
4107
4182
 
4183
+ export declare const TabStepper: {
4184
+ <T extends React.ElementType = "button">({ items, activeItem, onChange, itemsAlignment, hideBorder, isSticky, panels, panelCard, linkComponent: LinkComponent, bgColor, }: TabStepperProps<T>): JSX.Element;
4185
+ displayName: string;
4186
+ };
4187
+
4188
+ export declare type TabStepperItem<T extends React.ElementType = 'button'> = {
4189
+ /**
4190
+ * Unique identifier for the step.
4191
+ */
4192
+ id: string;
4193
+ /**
4194
+ * The step title.
4195
+ */
4196
+ title: string;
4197
+ /**
4198
+ * Supporting text shown below the title.
4199
+ */
4200
+ subtitle?: string;
4201
+ /**
4202
+ * The status represented by the step icon.
4203
+ * @default 'idle'
4204
+ */
4205
+ status?: TabStepperStatus;
4206
+ /**
4207
+ * The number shown for an idle step.
4208
+ * @default The item's position in the list
4209
+ */
4210
+ stepNumber?: number;
4211
+ } & Omit<React.ComponentPropsWithoutRef<T>, 'children' | 'id' | 'onClick' | 'title'>;
4212
+
4213
+ export declare type TabStepperItemsAlignment = 'left' | 'center' | 'right' | 'spread';
4214
+
4215
+ export declare interface TabStepperPanel {
4216
+ /**
4217
+ * Identifier of the tab associated with the panel.
4218
+ */
4219
+ id: string;
4220
+ /**
4221
+ * Panel content.
4222
+ */
4223
+ children: React.ReactNode;
4224
+ }
4225
+
4226
+ export declare type TabStepperPanelCard = Pick<CardProps, 'borderRadius' | 'variant' | 'padding' | 'bgColor' | 'elevation' | 'borderStyle'>;
4227
+
4228
+ export declare interface TabStepperProps<T extends React.ElementType = 'button'> {
4229
+ /**
4230
+ * The steps to display.
4231
+ */
4232
+ items: TabStepperItem<T>[];
4233
+ /**
4234
+ * The identifier of the selected step.
4235
+ */
4236
+ activeItem: string;
4237
+ /**
4238
+ * Callback fired when a step is selected.
4239
+ */
4240
+ onChange?: (item: TabStepperItem<T>) => void;
4241
+ /**
4242
+ * Alignment of the steps when they fit inside the container.
4243
+ * Accepts a single value or a breakpoint object. Breakpoints are resolved
4244
+ * against the TabStepper container width, not the viewport.
4245
+ * @default 'left'
4246
+ */
4247
+ itemsAlignment?: ResponsiveType<TabStepperItemsAlignment>;
4248
+ /**
4249
+ * Whether to hide the bottom border.
4250
+ * @default false
4251
+ */
4252
+ hideBorder?: boolean;
4253
+ /**
4254
+ * Whether the stepper stays at the top while its page scrolls.
4255
+ * @default true
4256
+ */
4257
+ isSticky?: boolean;
4258
+ /**
4259
+ * Optional content panels associated with the steps.
4260
+ */
4261
+ panels?: TabStepperPanel[];
4262
+ /**
4263
+ * Wrap the steps and panels in a Card: steps in the header, panel in the
4264
+ * body. `true` uses Card defaults. An object customizes the Card (for
4265
+ * example `borderRadius`).
4266
+ */
4267
+ panelCard?: boolean | TabStepperPanelCard;
4268
+ /**
4269
+ * The link component used to render each step.
4270
+ * @default 'button'
4271
+ */
4272
+ linkComponent?: T | 'button' | 'a';
4273
+ /**
4274
+ * Background color of the stepper strip. Used by the overflow arrow fade
4275
+ * so overflowing steps appear to disappear into the page.
4276
+ * @default 'surface-container'
4277
+ */
4278
+ bgColor?: BackgroundColors;
4279
+ }
4280
+
4281
+ export declare type TabStepperStatus = 'idle' | 'done' | 'failed' | 'warning';
4282
+
4108
4283
  export declare const Tag: ForwardRefExoticComponent<TagProps & RefAttributes<HTMLSpanElement>>;
4109
4284
 
4110
4285
  export declare interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {