Private
Public Access
1
0

feat: Fluent UI Outlook Lite + connections mockup

This commit is contained in:
2026-04-14 18:52:25 +00:00
parent 1199eff6c3
commit dfa4010406
34820 changed files with 1003813 additions and 205 deletions

2825
node_modules/@fluentui/react-table/CHANGELOG.md generated vendored Normal file

File diff suppressed because it is too large Load Diff

15
node_modules/@fluentui/react-table/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,15 @@
@fluentui/react-table
Copyright (c) Microsoft Corporation
All rights reserved.
MIT License
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Note: Usage of the fonts and icons referenced in Fluent UI React is subject to the terms listed at https://aka.ms/fluentui-assets-license

555
node_modules/@fluentui/react-table/README.md generated vendored Normal file
View File

@@ -0,0 +1,555 @@
# @fluentui/react-table
This package contains two high level components and their subcomponents.
## Table
This component is considered **low-level** and should be used when there is a need for more **customization** and
support for **non-standard features**. Please check out the **DataGrid component**
if you don't need lots of customization and rely on common features. There is less work involved and you will benefit
from first class Microsoft design and accessibility support.
A Table displays sets of two-dimensional data. The primitive components can be fully customized to support different
feature sets. The library provides a default `useTableFeatures` hook that handles the business logic and state management of common
features. There is no obligation to use our hook with these components, we've created it for convenience.
The `useTableFeatures` hook was designed with feature composition in mind. This means that they are composed using
plugins hooks such as `useTableSort` and `useTableSelection` as a part of `useTableFeatures`. This means
that as the feature set expands, users will not need to pay the bundle size price for features that they do not intend
to use. Please consult the usage examples below for more details.
### Example without interactive features
```tsx
import * as React from 'react';
import {
FolderRegular,
EditRegular,
OpenRegular,
DocumentRegular,
PeopleRegular,
DocumentPdfRegular,
VideoRegular,
} from '@fluentui/react-icons';
import {
TableBody,
TableCell,
TableRow,
Table,
TableHeader,
TableHeaderCell,
TableCellLayout,
PresenceBadgeStatus,
Avatar,
} from '@fluentui/react-components';
const items = [
{
file: { label: 'Meeting notes', icon: <DocumentRegular /> },
author: { label: 'Max Mustermann', status: 'available' },
lastUpdated: { label: '7h ago', timestamp: 1 },
lastUpdate: {
label: 'You edited this',
icon: <EditRegular />,
},
},
{
file: { label: 'Thursday presentation', icon: <FolderRegular /> },
author: { label: 'Erika Mustermann', status: 'busy' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Training recording', icon: <VideoRegular /> },
author: { label: 'John Doe', status: 'away' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Purchase order', icon: <DocumentPdfRegular /> },
author: { label: 'Jane Doe', status: 'offline' },
lastUpdated: { label: 'Tue at 9:30 AM', timestamp: 3 },
lastUpdate: {
label: 'You shared this in a Teams chat',
icon: <PeopleRegular />,
},
},
];
const columns = [
{ columnKey: 'file', label: 'File' },
{ columnKey: 'author', label: 'Author' },
{ columnKey: 'lastUpdated', label: 'Last updated' },
{ columnKey: 'lastUpdate', label: 'Last update' },
];
export const Default = () => {
return (
<Table arial-label="Default table">
<TableHeader>
<TableRow>
{columns.map(column => (
<TableHeaderCell key={column.columnKey}>{column.label}</TableHeaderCell>
))}
</TableRow>
</TableHeader>
<TableBody>
{items.map(item => (
<TableRow key={item.file.label}>
<TableCell>
<TableCellLayout media={item.file.icon}>{item.file.label}</TableCellLayout>
</TableCell>
<TableCell>
<TableCellLayout
media={
<Avatar
aria-label={item.author.label}
name={item.author.label}
badge={{ status: item.author.status as PresenceBadgeStatus }}
/>
}
>
{item.author.label}
</TableCellLayout>
</TableCell>
<TableCell>{item.lastUpdated.label}</TableCell>
<TableCell>
<TableCellLayout media={item.lastUpdate.icon}>{item.lastUpdate.label}</TableCellLayout>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
);
};
```
### Example with interactive features
```tsx
import * as React from 'react';
import {
FolderRegular,
EditRegular,
OpenRegular,
DocumentRegular,
PeopleRegular,
DocumentPdfRegular,
VideoRegular,
} from '@fluentui/react-icons';
import {
TableBody,
TableCell,
TableRow,
Table,
TableHeader,
TableHeaderCell,
TableSelectionCell,
TableCellLayout,
useTableFeatures,
TableColumnDefinition,
useTableSelection,
useTableSort,
createTableColumn,
TableColumnId,
PresenceBadgeStatus,
Avatar,
useArrowNavigationGroup,
} from '@fluentui/react-components';
type FileCell = {
label: string;
icon: JSX.Element;
};
type LastUpdatedCell = {
label: string;
timestamp: number;
};
type LastUpdateCell = {
label: string;
icon: JSX.Element;
};
type AuthorCell = {
label: string;
status: PresenceBadgeStatus;
};
type Item = {
file: FileCell;
author: AuthorCell;
lastUpdated: LastUpdatedCell;
lastUpdate: LastUpdateCell;
};
const items: Item[] = [
{
file: { label: 'Meeting notes', icon: <DocumentRegular /> },
author: { label: 'Max Mustermann', status: 'available' },
lastUpdated: { label: '7h ago', timestamp: 3 },
lastUpdate: {
label: 'You edited this',
icon: <EditRegular />,
},
},
{
file: { label: 'Thursday presentation', icon: <FolderRegular /> },
author: { label: 'Erika Mustermann', status: 'busy' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Training recording', icon: <VideoRegular /> },
author: { label: 'John Doe', status: 'away' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Purchase order', icon: <DocumentPdfRegular /> },
author: { label: 'Jane Doe', status: 'offline' },
lastUpdated: { label: 'Tue at 9:30 AM', timestamp: 1 },
lastUpdate: {
label: 'You shared this in a Teams chat',
icon: <PeopleRegular />,
},
},
];
const columns: TableColumnDefinition<Item>[] = [
createTableColumn<Item>({
columnId: 'file',
compare: (a, b) => {
return a.file.label.localeCompare(b.file.label);
},
}),
createTableColumn<Item>({
columnId: 'author',
compare: (a, b) => {
return a.author.label.localeCompare(b.author.label);
},
}),
createTableColumn<Item>({
columnId: 'lastUpdated',
compare: (a, b) => {
return a.lastUpdated.timestamp - b.lastUpdated.timestamp;
},
}),
createTableColumn<Item>({
columnId: 'lastUpdate',
compare: (a, b) => {
return a.lastUpdate.label.localeCompare(b.lastUpdate.label);
},
}),
];
export const DataGrid = () => {
const {
getRows,
selection: { allRowsSelected, someRowsSelected, toggleAllRows, toggleRow, isRowSelected },
sort: { getSortDirection, toggleColumnSort, sort },
} = useTableFeatures(
{
columns,
items,
},
[
useTableSelection({
selectionMode: 'multiselect',
defaultSelectedItems: new Set([0, 1]),
}),
useTableSort({ defaultSortState: { sortColumn: 'file', sortDirection: 'ascending' } }),
],
);
const rows = sort(
getRows(row => {
const selected = isRowSelected(row.rowId);
return {
...row,
onClick: (e: React.MouseEvent) => toggleRow(e, row.rowId),
onKeyDown: (e: React.KeyboardEvent) => {
if (e.key === ' ') {
e.preventDefault();
toggleRow(e, row.rowId);
}
},
selected,
appearance: selected ? ('brand' as const) : ('none' as const),
};
}),
);
const headerSortProps = (columnId: TableColumnId) => ({
onClick: (e: React.MouseEvent) => {
toggleColumnSort(e, columnId);
},
sortDirection: getSortDirection(columnId),
});
const keyboardNavAttr = useArrowNavigationGroup({ axis: 'grid' });
return (
<Table {...keyboardNavAttr} role="grid" sortable aria-label="DataGrid implementation with Table primitives">
<TableHeader>
<TableRow>
<TableSelectionCell
checked={allRowsSelected ? true : someRowsSelected ? 'mixed' : false}
aria-checked={allRowsSelected ? true : someRowsSelected ? 'mixed' : false}
role="checkbox"
onClick={toggleAllRows}
checkboxIndicator={{ 'aria-label': 'Select all rows ' }}
/>
<TableHeaderCell {...headerSortProps('file')}>File</TableHeaderCell>
<TableHeaderCell {...headerSortProps('author')}>Author</TableHeaderCell>
<TableHeaderCell {...headerSortProps('lastUpdated')}>Last updated</TableHeaderCell>
<TableHeaderCell {...headerSortProps('lastUpdate')}>Last update</TableHeaderCell>
</TableRow>
</TableHeader>
<TableBody>
{rows.map(({ item, selected, onClick, onKeyDown, appearance }) => (
<TableRow
key={item.file.label}
onClick={onClick}
onKeyDown={onKeyDown}
aria-selected={selected}
appearance={appearance}
>
<TableSelectionCell
role="gridcell"
aria-selected={selected}
checked={selected}
checkboxIndicator={{ 'aria-label': 'Select row' }}
/>
<TableCell tabIndex={0} role="gridcell" aria-selected={selected}>
<TableCellLayout media={item.file.icon}>{item.file.label}</TableCellLayout>
</TableCell>
<TableCell tabIndex={0} role="gridcell">
<TableCellLayout
media={
<Avatar
aria-label={item.author.label}
name={item.author.label}
badge={{ status: item.author.status }}
/>
}
>
{item.author.label}
</TableCellLayout>
</TableCell>
<TableCell tabIndex={0} role="gridcell">
{item.lastUpdated.label}
</TableCell>
<TableCell tabIndex={0} role="gridcell">
<TableCellLayout media={item.lastUpdate.icon}>{item.lastUpdate.label}</TableCellLayout>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
);
};
```
## DataGrid
This component is a higher level extension of the `Table` primitive components and the `useTableFeatures` hook.
`DataGrid` is a feature-rich component that uses `useTableFeatures` internally,
so there should always be full feature parity with what can be
achieved with primitives. This component is **opinionated** and this is intentional. If the desired scenario can
be achieved easily and does not vary too much from documented examples, it can be very convenient. If the desired
scenario varies a lot from the documented examples please use the `Table` components with `useTableFeatures` (or
another state management solution of choice).
### Example usage
```tsx
import * as React from 'react';
import {
FolderRegular,
EditRegular,
OpenRegular,
DocumentRegular,
PeopleRegular,
DocumentPdfRegular,
VideoRegular,
} from '@fluentui/react-icons';
import {
PresenceBadgeStatus,
Avatar,
DataGridBody,
DataGridRow,
DataGrid,
DataGridHeader,
DataGridHeaderCell,
DataGridCell,
TableCellLayout,
TableColumnDefinition,
createTableColumn,
} from '@fluentui/react-components';
type FileCell = {
label: string;
icon: JSX.Element;
};
type LastUpdatedCell = {
label: string;
timestamp: number;
};
type LastUpdateCell = {
label: string;
icon: JSX.Element;
};
type AuthorCell = {
label: string;
status: PresenceBadgeStatus;
};
type Item = {
file: FileCell;
author: AuthorCell;
lastUpdated: LastUpdatedCell;
lastUpdate: LastUpdateCell;
};
const items: Item[] = [
{
file: { label: 'Meeting notes', icon: <DocumentRegular /> },
author: { label: 'Max Mustermann', status: 'available' },
lastUpdated: { label: '7h ago', timestamp: 1 },
lastUpdate: {
label: 'You edited this',
icon: <EditRegular />,
},
},
{
file: { label: 'Thursday presentation', icon: <FolderRegular /> },
author: { label: 'Erika Mustermann', status: 'busy' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Training recording', icon: <VideoRegular /> },
author: { label: 'John Doe', status: 'away' },
lastUpdated: { label: 'Yesterday at 1:45 PM', timestamp: 2 },
lastUpdate: {
label: 'You recently opened this',
icon: <OpenRegular />,
},
},
{
file: { label: 'Purchase order', icon: <DocumentPdfRegular /> },
author: { label: 'Jane Doe', status: 'offline' },
lastUpdated: { label: 'Tue at 9:30 AM', timestamp: 3 },
lastUpdate: {
label: 'You shared this in a Teams chat',
icon: <PeopleRegular />,
},
},
];
const columns: TableColumnDefinition<Item>[] = [
createTableColumn<Item>({
columnId: 'file',
compare: (a, b) => {
return a.file.label.localeCompare(b.file.label);
},
renderHeaderCell: () => {
return 'File';
},
renderCell: item => {
return <TableCellLayout media={item.file.icon}>{item.file.label}</TableCellLayout>;
},
}),
createTableColumn<Item>({
columnId: 'author',
compare: (a, b) => {
return a.author.label.localeCompare(b.author.label);
},
renderHeaderCell: () => {
return 'Author';
},
renderCell: item => {
return (
<TableCellLayout
media={
<Avatar aria-label={item.author.label} name={item.author.label} badge={{ status: item.author.status }} />
}
>
{item.author.label}
</TableCellLayout>
);
},
}),
createTableColumn<Item>({
columnId: 'lastUpdated',
compare: (a, b) => {
return a.lastUpdated.timestamp - b.lastUpdated.timestamp;
},
renderHeaderCell: () => {
return 'Last updated';
},
renderCell: item => {
return item.lastUpdated.label;
},
}),
createTableColumn<Item>({
columnId: 'lastUpdate',
compare: (a, b) => {
return a.lastUpdate.label.localeCompare(b.lastUpdate.label);
},
renderHeaderCell: () => {
return 'Last update';
},
renderCell: item => {
return <TableCellLayout media={item.lastUpdate.icon}>{item.lastUpdate.label}</TableCellLayout>;
},
}),
];
export const Default = () => {
return (
<DataGrid
items={items}
columns={columns}
sortable
selectionMode="multiselect"
getRowId={item => item.file.label}
onSelectionChange={(e, data) => console.log(data)}
>
<DataGridHeader>
<DataGridRow selectionCell={{ 'aria-label': 'Select all rows' }}>
{({ renderHeaderCell }) => <DataGridHeaderCell>{renderHeaderCell()}</DataGridHeaderCell>}
</DataGridRow>
</DataGridHeader>
<DataGridBody<Item>>
{({ item, rowId }) => (
<DataGridRow<Item> key={rowId} selectionCell={{ 'aria-label': 'Select row' }}>
{({ renderCell }) => <DataGridCell>{renderCell(item)}</DataGridCell>}
</DataGridRow>
)}
</DataGridBody>
</DataGrid>
);
};
```

1220
node_modules/@fluentui/react-table/dist/index.d.ts generated vendored Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGrid: function() {
return _index.DataGrid;
},
dataGridClassNames: function() {
return _index.dataGridClassNames;
},
renderDataGrid_unstable: function() {
return _index.renderDataGrid_unstable;
},
useDataGridContextValues_unstable: function() {
return _index.useDataGridContextValues_unstable;
},
useDataGridStyles_unstable: function() {
return _index.useDataGridStyles_unstable;
},
useDataGrid_unstable: function() {
return _index.useDataGrid_unstable;
}
});
const _index = require("./components/DataGrid/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGrid.ts"],"sourcesContent":["export type {\n DataGridContextValue,\n DataGridContextValues,\n DataGridFocusMode,\n DataGridProps,\n DataGridSlots,\n DataGridState,\n} from './components/DataGrid/index';\nexport {\n DataGrid,\n dataGridClassNames,\n renderDataGrid_unstable,\n useDataGridContextValues_unstable,\n useDataGridStyles_unstable,\n useDataGrid_unstable,\n} from './components/DataGrid/index';\n"],"names":["DataGrid","dataGridClassNames","renderDataGrid_unstable","useDataGridContextValues_unstable","useDataGridStyles_unstable","useDataGrid_unstable"],"mappings":";;;;;;;;;;;;eASEA,eAAQ;;;eACRC,yBAAkB;;;eAClBC,8BAAuB;;;eACvBC,wCAAiC;;;eACjCC,iCAA0B;;;eAC1BC,2BAAoB;;;uBACf,8BAA8B"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridBody: function() {
return _index.DataGridBody;
},
dataGridBodyClassNames: function() {
return _index.dataGridBodyClassNames;
},
renderDataGridBody_unstable: function() {
return _index.renderDataGridBody_unstable;
},
useDataGridBodyStyles_unstable: function() {
return _index.useDataGridBodyStyles_unstable;
},
useDataGridBody_unstable: function() {
return _index.useDataGridBody_unstable;
}
});
const _index = require("./components/DataGridBody/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridBody.ts"],"sourcesContent":["export type {\n DataGridBodyProps,\n DataGridBodySlots,\n DataGridBodyState,\n RowRenderFunction,\n} from './components/DataGridBody/index';\nexport {\n DataGridBody,\n dataGridBodyClassNames,\n renderDataGridBody_unstable,\n useDataGridBodyStyles_unstable,\n useDataGridBody_unstable,\n} from './components/DataGridBody/index';\n"],"names":["DataGridBody","dataGridBodyClassNames","renderDataGridBody_unstable","useDataGridBodyStyles_unstable","useDataGridBody_unstable"],"mappings":";;;;;;;;;;;;eAOEA,mBAAY;;;eACZC,6BAAsB;;;eACtBC,kCAA2B;;;eAC3BC,qCAA8B;;;eAC9BC,+BAAwB;;;uBACnB,kCAAkC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridCell: function() {
return _index.DataGridCell;
},
dataGridCellClassNames: function() {
return _index.dataGridCellClassNames;
},
renderDataGridCell_unstable: function() {
return _index.renderDataGridCell_unstable;
},
useDataGridCellStyles_unstable: function() {
return _index.useDataGridCellStyles_unstable;
},
useDataGridCell_unstable: function() {
return _index.useDataGridCell_unstable;
}
});
const _index = require("./components/DataGridCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridCell.ts"],"sourcesContent":["export type {\n DataGridCellFocusMode,\n DataGridCellProps,\n DataGridCellSlots,\n DataGridCellState,\n} from './components/DataGridCell/index';\nexport {\n DataGridCell,\n dataGridCellClassNames,\n renderDataGridCell_unstable,\n useDataGridCellStyles_unstable,\n useDataGridCell_unstable,\n} from './components/DataGridCell/index';\n"],"names":["DataGridCell","dataGridCellClassNames","renderDataGridCell_unstable","useDataGridCellStyles_unstable","useDataGridCell_unstable"],"mappings":";;;;;;;;;;;;eAOEA,mBAAY;;;eACZC,6BAAsB;;;eACtBC,kCAA2B;;;eAC3BC,qCAA8B;;;eAC9BC,+BAAwB;;;uBACnB,kCAAkC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridHeader: function() {
return _index.DataGridHeader;
},
dataGridHeaderClassNames: function() {
return _index.dataGridHeaderClassNames;
},
renderDataGridHeader_unstable: function() {
return _index.renderDataGridHeader_unstable;
},
useDataGridHeaderStyles_unstable: function() {
return _index.useDataGridHeaderStyles_unstable;
},
useDataGridHeader_unstable: function() {
return _index.useDataGridHeader_unstable;
}
});
const _index = require("./components/DataGridHeader/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridHeader.ts"],"sourcesContent":["export type { DataGridHeaderProps, DataGridHeaderSlots, DataGridHeaderState } from './components/DataGridHeader/index';\nexport {\n DataGridHeader,\n dataGridHeaderClassNames,\n renderDataGridHeader_unstable,\n useDataGridHeaderStyles_unstable,\n useDataGridHeader_unstable,\n} from './components/DataGridHeader/index';\n"],"names":["DataGridHeader","dataGridHeaderClassNames","renderDataGridHeader_unstable","useDataGridHeaderStyles_unstable","useDataGridHeader_unstable"],"mappings":";;;;;;;;;;;;eAEEA,qBAAc;;;eACdC,+BAAwB;;;eACxBC,oCAA6B;;;eAC7BC,uCAAgC;;;eAChCC,iCAA0B;;;uBACrB,oCAAoC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridHeaderCell: function() {
return _index.DataGridHeaderCell;
},
dataGridHeaderCellClassNames: function() {
return _index.dataGridHeaderCellClassNames;
},
renderDataGridHeaderCell_unstable: function() {
return _index.renderDataGridHeaderCell_unstable;
},
useDataGridHeaderCellStyles_unstable: function() {
return _index.useDataGridHeaderCellStyles_unstable;
},
useDataGridHeaderCell_unstable: function() {
return _index.useDataGridHeaderCell_unstable;
}
});
const _index = require("./components/DataGridHeaderCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridHeaderCell.ts"],"sourcesContent":["export type {\n DataGridHeaderCellProps,\n DataGridHeaderCellSlots,\n DataGridHeaderCellState,\n} from './components/DataGridHeaderCell/index';\nexport {\n DataGridHeaderCell,\n dataGridHeaderCellClassNames,\n renderDataGridHeaderCell_unstable,\n useDataGridHeaderCellStyles_unstable,\n useDataGridHeaderCell_unstable,\n} from './components/DataGridHeaderCell/index';\n"],"names":["DataGridHeaderCell","dataGridHeaderCellClassNames","renderDataGridHeaderCell_unstable","useDataGridHeaderCellStyles_unstable","useDataGridHeaderCell_unstable"],"mappings":";;;;;;;;;;;;eAMEA,yBAAkB;;;eAClBC,mCAA4B;;;eAC5BC,wCAAiC;;;eACjCC,2CAAoC;;;eACpCC,qCAA8B;;;uBACzB,wCAAwC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridRow: function() {
return _index.DataGridRow;
},
dataGridRowClassNames: function() {
return _index.dataGridRowClassNames;
},
renderDataGridRow_unstable: function() {
return _index.renderDataGridRow_unstable;
},
useDataGridRowStyles_unstable: function() {
return _index.useDataGridRowStyles_unstable;
},
useDataGridRow_unstable: function() {
return _index.useDataGridRow_unstable;
}
});
const _index = require("./components/DataGridRow/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridRow.ts"],"sourcesContent":["export type {\n CellRenderFunction,\n DataGridRowProps,\n DataGridRowSlots,\n DataGridRowState,\n} from './components/DataGridRow/index';\nexport {\n DataGridRow,\n dataGridRowClassNames,\n renderDataGridRow_unstable,\n useDataGridRowStyles_unstable,\n useDataGridRow_unstable,\n} from './components/DataGridRow/index';\n"],"names":["DataGridRow","dataGridRowClassNames","renderDataGridRow_unstable","useDataGridRowStyles_unstable","useDataGridRow_unstable"],"mappings":";;;;;;;;;;;;eAOEA,kBAAW;;;eACXC,4BAAqB;;;eACrBC,iCAA0B;;;eAC1BC,oCAA6B;;;eAC7BC,8BAAuB;;;uBAClB,iCAAiC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridSelectionCell: function() {
return _index.DataGridSelectionCell;
},
dataGridSelectionCellClassNames: function() {
return _index.dataGridSelectionCellClassNames;
},
renderDataGridSelectionCell_unstable: function() {
return _index.renderDataGridSelectionCell_unstable;
},
useDataGridSelectionCellStyles_unstable: function() {
return _index.useDataGridSelectionCellStyles_unstable;
},
useDataGridSelectionCell_unstable: function() {
return _index.useDataGridSelectionCell_unstable;
}
});
const _index = require("./components/DataGridSelectionCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/DataGridSelectionCell.ts"],"sourcesContent":["export type {\n DataGridSelectionCellProps,\n DataGridSelectionCellSlots,\n DataGridSelectionCellState,\n} from './components/DataGridSelectionCell/index';\nexport {\n DataGridSelectionCell,\n dataGridSelectionCellClassNames,\n renderDataGridSelectionCell_unstable,\n useDataGridSelectionCellStyles_unstable,\n useDataGridSelectionCell_unstable,\n} from './components/DataGridSelectionCell/index';\n"],"names":["DataGridSelectionCell","dataGridSelectionCellClassNames","renderDataGridSelectionCell_unstable","useDataGridSelectionCellStyles_unstable","useDataGridSelectionCell_unstable"],"mappings":";;;;;;;;;;;;eAMEA,4BAAqB;;;eACrBC,sCAA+B;;;eAC/BC,2CAAoC;;;eACpCC,8CAAuC;;;eACvCC,wCAAiC;;;uBAC5B,2CAA2C"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
Table: function() {
return _index.Table;
},
renderTable_unstable: function() {
return _index.renderTable_unstable;
},
tableClassName: function() {
return _index.tableClassName;
},
tableClassNames: function() {
return _index.tableClassNames;
},
useTableStyles_unstable: function() {
return _index.useTableStyles_unstable;
},
useTable_unstable: function() {
return _index.useTable_unstable;
}
});
const _index = require("./components/Table/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/Table.ts"],"sourcesContent":["export type {\n SortDirection,\n TableContextValue,\n TableContextValues,\n TableProps,\n TableSlots,\n TableState,\n} from './components/Table/index';\nexport {\n Table,\n renderTable_unstable,\n tableClassName,\n tableClassNames,\n useTableStyles_unstable,\n useTable_unstable,\n} from './components/Table/index';\n"],"names":["Table","renderTable_unstable","tableClassName","tableClassNames","useTableStyles_unstable","useTable_unstable"],"mappings":";;;;;;;;;;;;eASEA,YAAK;;;eACLC,2BAAoB;;;eACpBC,qBAAc;;;eACdC,sBAAe;;;eACfC,8BAAuB;;;eACvBC,wBAAiB;;;uBACZ,2BAA2B"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableBody: function() {
return _index.TableBody;
},
renderTableBody_unstable: function() {
return _index.renderTableBody_unstable;
},
tableBodyClassName: function() {
return _index.tableBodyClassName;
},
tableBodyClassNames: function() {
return _index.tableBodyClassNames;
},
useTableBodyStyles_unstable: function() {
return _index.useTableBodyStyles_unstable;
},
useTableBody_unstable: function() {
return _index.useTableBody_unstable;
}
});
const _index = require("./components/TableBody/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableBody.ts"],"sourcesContent":["export type { TableBodyProps, TableBodySlots, TableBodyState } from './components/TableBody/index';\nexport {\n TableBody,\n renderTableBody_unstable,\n tableBodyClassName,\n tableBodyClassNames,\n useTableBodyStyles_unstable,\n useTableBody_unstable,\n} from './components/TableBody/index';\n"],"names":["TableBody","renderTableBody_unstable","tableBodyClassName","tableBodyClassNames","useTableBodyStyles_unstable","useTableBody_unstable"],"mappings":";;;;;;;;;;;;eAEEA,gBAAS;;;eACTC,+BAAwB;;;eACxBC,yBAAkB;;;eAClBC,0BAAmB;;;eACnBC,kCAA2B;;;eAC3BC,4BAAqB;;;uBAChB,+BAA+B"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableCell: function() {
return _index.TableCell;
},
renderTableCell_unstable: function() {
return _index.renderTableCell_unstable;
},
tableCellClassName: function() {
return _index.tableCellClassName;
},
tableCellClassNames: function() {
return _index.tableCellClassNames;
},
useTableCellStyles_unstable: function() {
return _index.useTableCellStyles_unstable;
},
useTableCell_unstable: function() {
return _index.useTableCell_unstable;
}
});
const _index = require("./components/TableCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableCell.ts"],"sourcesContent":["export type { TableCellProps, TableCellSlots, TableCellState } from './components/TableCell/index';\nexport {\n TableCell,\n renderTableCell_unstable,\n tableCellClassName,\n tableCellClassNames,\n useTableCellStyles_unstable,\n useTableCell_unstable,\n} from './components/TableCell/index';\n"],"names":["TableCell","renderTableCell_unstable","tableCellClassName","tableCellClassNames","useTableCellStyles_unstable","useTableCell_unstable"],"mappings":";;;;;;;;;;;;eAEEA,gBAAS;;;eACTC,+BAAwB;;;eACxBC,yBAAkB;;;eAClBC,0BAAmB;;;eACnBC,kCAA2B;;;eAC3BC,4BAAqB;;;uBAChB,+BAA+B"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableCellActions: function() {
return _index.TableCellActions;
},
renderTableCellActions_unstable: function() {
return _index.renderTableCellActions_unstable;
},
tableCellActionsClassNames: function() {
return _index.tableCellActionsClassNames;
},
useTableCellActionsStyles_unstable: function() {
return _index.useTableCellActionsStyles_unstable;
},
useTableCellActions_unstable: function() {
return _index.useTableCellActions_unstable;
}
});
const _index = require("./components/TableCellActions/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableCellActions.ts"],"sourcesContent":["export type {\n TableCellActionsProps,\n TableCellActionsSlots,\n TableCellActionsState,\n} from './components/TableCellActions/index';\nexport {\n TableCellActions,\n renderTableCellActions_unstable,\n tableCellActionsClassNames,\n useTableCellActionsStyles_unstable,\n useTableCellActions_unstable,\n} from './components/TableCellActions/index';\n"],"names":["TableCellActions","renderTableCellActions_unstable","tableCellActionsClassNames","useTableCellActionsStyles_unstable","useTableCellActions_unstable"],"mappings":";;;;;;;;;;;;eAMEA,uBAAgB;;;eAChBC,sCAA+B;;;eAC/BC,iCAA0B;;;eAC1BC,yCAAkC;;;eAClCC,mCAA4B;;;uBACvB,sCAAsC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableCellLayout: function() {
return _index.TableCellLayout;
},
renderTableCellLayout_unstable: function() {
return _index.renderTableCellLayout_unstable;
},
tableCellLayoutClassNames: function() {
return _index.tableCellLayoutClassNames;
},
useTableCellLayoutStyles_unstable: function() {
return _index.useTableCellLayoutStyles_unstable;
},
useTableCellLayout_unstable: function() {
return _index.useTableCellLayout_unstable;
}
});
const _index = require("./components/TableCellLayout/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableCellLayout.ts"],"sourcesContent":["export type {\n TableCellLayoutContextValues,\n TableCellLayoutProps,\n TableCellLayoutSlots,\n TableCellLayoutState,\n} from './components/TableCellLayout/index';\nexport {\n TableCellLayout,\n renderTableCellLayout_unstable,\n tableCellLayoutClassNames,\n useTableCellLayoutStyles_unstable,\n useTableCellLayout_unstable,\n} from './components/TableCellLayout/index';\n"],"names":["TableCellLayout","renderTableCellLayout_unstable","tableCellLayoutClassNames","useTableCellLayoutStyles_unstable","useTableCellLayout_unstable"],"mappings":";;;;;;;;;;;;eAOEA,sBAAe;;;eACfC,qCAA8B;;;eAC9BC,gCAAyB;;;eACzBC,wCAAiC;;;eACjCC,kCAA2B;;;uBACtB,qCAAqC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableCellLayout: function() {
return _index.TableCellLayout;
},
renderTableCellLayout_unstable: function() {
return _index.renderTableCellLayout_unstable;
},
tableCellLayoutClassNames: function() {
return _index.tableCellLayoutClassNames;
},
useTableCellLayoutStyles_unstable: function() {
return _index.useTableCellLayoutStyles_unstable;
},
useTableCellLayout_unstable: function() {
return _index.useTableCellLayout_unstable;
}
});
const _index = require("./components/TableCellLayout/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableCellPrimaryLayout.ts"],"sourcesContent":["export type {\n TableCellLayoutContextValues,\n TableCellLayoutProps,\n TableCellLayoutSlots,\n TableCellLayoutState,\n} from './components/TableCellLayout/index';\nexport {\n TableCellLayout,\n renderTableCellLayout_unstable,\n tableCellLayoutClassNames,\n useTableCellLayoutStyles_unstable,\n useTableCellLayout_unstable,\n} from './components/TableCellLayout/index';\n"],"names":["TableCellLayout","renderTableCellLayout_unstable","tableCellLayoutClassNames","useTableCellLayoutStyles_unstable","useTableCellLayout_unstable"],"mappings":";;;;;;;;;;;;eAOEA,sBAAe;;;eACfC,qCAA8B;;;eAC9BC,gCAAyB;;;eACzBC,wCAAiC;;;eACjCC,kCAA2B;;;uBACtB,qCAAqC"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableHeader: function() {
return _index.TableHeader;
},
renderTableHeader_unstable: function() {
return _index.renderTableHeader_unstable;
},
tableHeaderClassName: function() {
return _index.tableHeaderClassName;
},
tableHeaderClassNames: function() {
return _index.tableHeaderClassNames;
},
useTableHeaderStyles_unstable: function() {
return _index.useTableHeaderStyles_unstable;
},
useTableHeader_unstable: function() {
return _index.useTableHeader_unstable;
}
});
const _index = require("./components/TableHeader/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableHeader.ts"],"sourcesContent":["export type { TableHeaderProps, TableHeaderSlots, TableHeaderState } from './components/TableHeader/index';\nexport {\n TableHeader,\n renderTableHeader_unstable,\n tableHeaderClassName,\n tableHeaderClassNames,\n useTableHeaderStyles_unstable,\n useTableHeader_unstable,\n} from './components/TableHeader/index';\n"],"names":["TableHeader","renderTableHeader_unstable","tableHeaderClassName","tableHeaderClassNames","useTableHeaderStyles_unstable","useTableHeader_unstable"],"mappings":";;;;;;;;;;;;eAEEA,kBAAW;;;eACXC,iCAA0B;;;eAC1BC,2BAAoB;;;eACpBC,4BAAqB;;;eACrBC,oCAA6B;;;eAC7BC,8BAAuB;;;uBAClB,iCAAiC"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableHeaderCell: function() {
return _index.TableHeaderCell;
},
renderTableHeaderCell_unstable: function() {
return _index.renderTableHeaderCell_unstable;
},
tableHeaderCellClassName: function() {
return _index.tableHeaderCellClassName;
},
tableHeaderCellClassNames: function() {
return _index.tableHeaderCellClassNames;
},
useTableHeaderCellStyles_unstable: function() {
return _index.useTableHeaderCellStyles_unstable;
},
useTableHeaderCell_unstable: function() {
return _index.useTableHeaderCell_unstable;
}
});
const _index = require("./components/TableHeaderCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableHeaderCell.ts"],"sourcesContent":["export type {\n TableHeaderCellProps,\n TableHeaderCellSlots,\n TableHeaderCellState,\n} from './components/TableHeaderCell/index';\nexport {\n TableHeaderCell,\n renderTableHeaderCell_unstable,\n tableHeaderCellClassName,\n tableHeaderCellClassNames,\n useTableHeaderCellStyles_unstable,\n useTableHeaderCell_unstable,\n} from './components/TableHeaderCell/index';\n"],"names":["TableHeaderCell","renderTableHeaderCell_unstable","tableHeaderCellClassName","tableHeaderCellClassNames","useTableHeaderCellStyles_unstable","useTableHeaderCell_unstable"],"mappings":";;;;;;;;;;;;eAMEA,sBAAe;;;eACfC,qCAA8B;;;eAC9BC,+BAAwB;;;eACxBC,gCAAyB;;;eACzBC,wCAAiC;;;eACjCC,kCAA2B;;;uBACtB,qCAAqC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableResizeHandle: function() {
return _index.TableResizeHandle;
},
renderTableResizeHandle_unstable: function() {
return _index.renderTableResizeHandle_unstable;
},
tableResizeHandleClassNames: function() {
return _index.tableResizeHandleClassNames;
},
useTableResizeHandleStyles_unstable: function() {
return _index.useTableResizeHandleStyles_unstable;
},
useTableResizeHandle_unstable: function() {
return _index.useTableResizeHandle_unstable;
}
});
const _index = require("./components/TableResizeHandle/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableResizeHandle.ts"],"sourcesContent":["export type {\n TableResizeHandleProps,\n TableResizeHandleSlots,\n TableResizeHandleState,\n} from './components/TableResizeHandle/index';\nexport {\n TableResizeHandle,\n renderTableResizeHandle_unstable,\n tableResizeHandleClassNames,\n useTableResizeHandleStyles_unstable,\n useTableResizeHandle_unstable,\n} from './components/TableResizeHandle/index';\n"],"names":["TableResizeHandle","renderTableResizeHandle_unstable","tableResizeHandleClassNames","useTableResizeHandleStyles_unstable","useTableResizeHandle_unstable"],"mappings":";;;;;;;;;;;;eAMEA,wBAAiB;;;eACjBC,uCAAgC;;;eAChCC,kCAA2B;;;eAC3BC,0CAAmC;;;eACnCC,oCAA6B;;;uBACxB,uCAAuC"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TableRow: function() {
return _index.TableRow;
},
renderTableRow_unstable: function() {
return _index.renderTableRow_unstable;
},
tableRowClassName: function() {
return _index.tableRowClassName;
},
tableRowClassNames: function() {
return _index.tableRowClassNames;
},
useTableRowStyles_unstable: function() {
return _index.useTableRowStyles_unstable;
},
useTableRow_unstable: function() {
return _index.useTableRow_unstable;
}
});
const _index = require("./components/TableRow/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableRow.ts"],"sourcesContent":["export type { TableRowProps, TableRowSlots, TableRowState } from './components/TableRow/index';\nexport {\n TableRow,\n renderTableRow_unstable,\n tableRowClassName,\n tableRowClassNames,\n useTableRowStyles_unstable,\n useTableRow_unstable,\n} from './components/TableRow/index';\n"],"names":["TableRow","renderTableRow_unstable","tableRowClassName","tableRowClassNames","useTableRowStyles_unstable","useTableRow_unstable"],"mappings":";;;;;;;;;;;;eAEEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,wBAAiB;;;eACjBC,yBAAkB;;;eAClBC,iCAA0B;;;eAC1BC,2BAAoB;;;uBACf,8BAA8B"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CELL_WIDTH: function() {
return _index.CELL_WIDTH;
},
TableSelectionCell: function() {
return _index.TableSelectionCell;
},
renderTableSelectionCell_unstable: function() {
return _index.renderTableSelectionCell_unstable;
},
tableSelectionCellClassNames: function() {
return _index.tableSelectionCellClassNames;
},
useTableSelectionCellStyles_unstable: function() {
return _index.useTableSelectionCellStyles_unstable;
},
useTableSelectionCell_unstable: function() {
return _index.useTableSelectionCell_unstable;
}
});
const _index = require("./components/TableSelectionCell/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TableSelectionCell.ts"],"sourcesContent":["export type {\n TableSelectionCellProps,\n TableSelectionCellSlots,\n TableSelectionCellState,\n} from './components/TableSelectionCell/index';\nexport {\n CELL_WIDTH,\n TableSelectionCell,\n renderTableSelectionCell_unstable,\n tableSelectionCellClassNames,\n useTableSelectionCellStyles_unstable,\n useTableSelectionCell_unstable,\n} from './components/TableSelectionCell/index';\n"],"names":["CELL_WIDTH","TableSelectionCell","renderTableSelectionCell_unstable","tableSelectionCellClassNames","useTableSelectionCellStyles_unstable","useTableSelectionCell_unstable"],"mappings":";;;;;;;;;;;;eAMEA,iBAAU;;;eACVC,yBAAkB;;;eAClBC,wCAAiC;;;eACjCC,mCAA4B;;;eAC5BC,2CAAoC;;;eACpCC,qCAA8B;;;uBACzB,wCAAwC"}

View File

@@ -0,0 +1,25 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "DataGrid", {
enumerable: true,
get: function() {
return DataGrid;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useDataGrid = require("./useDataGrid");
const _renderDataGrid = require("./renderDataGrid");
const _useDataGridStylesstyles = require("./useDataGridStyles.styles");
const _useDataGridContextValues = require("./useDataGridContextValues");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const DataGrid = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useDataGrid.useDataGrid_unstable)(props, ref);
(0, _useDataGridStylesstyles.useDataGridStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDataGridStyles_unstable')(state);
return (0, _renderDataGrid.renderDataGrid_unstable)(state, (0, _useDataGridContextValues.useDataGridContextValues_unstable)(state));
});
DataGrid.displayName = 'DataGrid';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/DataGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDataGrid_unstable } from './useDataGrid';\nimport { renderDataGrid_unstable } from './renderDataGrid';\nimport { useDataGridStyles_unstable } from './useDataGridStyles.styles';\nimport type { DataGridProps } from './DataGrid.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useDataGridContextValues_unstable } from './useDataGridContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGrid component\n */\nexport const DataGrid: ForwardRefComponent<DataGridProps> = React.forwardRef((props, ref) => {\n const state = useDataGrid_unstable(props, ref);\n\n useDataGridStyles_unstable(state);\n\n useCustomStyleHook_unstable('useDataGridStyles_unstable')(state);\n\n return renderDataGrid_unstable(state, useDataGridContextValues_unstable(state));\n});\n\nDataGrid.displayName = 'DataGrid';\n"],"names":["React","useDataGrid_unstable","renderDataGrid_unstable","useDataGridStyles_unstable","useDataGridContextValues_unstable","useCustomStyleHook_unstable","DataGrid","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;6BACM,gBAAgB;gCACb,mBAAmB;yCAChB,6BAA6B;0CAGtB,6BAA6B;qCACnC,kCAAkC;AAKvE,MAAMM,WAAAA,WAAAA,GAA+CN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,YAAQT,iCAAAA,EAAqBO,OAAOC;QAE1CN,mDAAAA,EAA2BO;QAE3BL,gDAAAA,EAA4B,8BAA8BK;IAE1D,WAAOR,uCAAAA,EAAwBQ,WAAON,2DAAAA,EAAkCM;AAC1E,GAAG;AAEHJ,SAASK,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/DataGrid.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { SelectionHookParams, SelectionMode } from '@fluentui/react-utilities';\nimport { TabsterDOMAttribute } from '@fluentui/react-tabster';\nimport type { TableContextValues, TableProps, TableSlots, TableState } from '../Table/Table.types';\nimport type {\n SortState,\n TableFeaturesState,\n UseTableSortOptions,\n OnSelectionChangeData,\n TableColumnSizingOptions,\n TableColumnId,\n} from '../../hooks';\nimport { TableRowProps } from '../TableRow/TableRow.types';\n\nexport type DataGridSlots = TableSlots;\n\nexport type DataGridFocusMode = 'none' | 'cell' | 'row_unstable' | 'composite';\n\nexport type DataGridContextValues = TableContextValues & {\n dataGrid: DataGridContextValue;\n};\n\n// Use any here since we can't know the user types\n// The user is responsible for narrowing the type downstream\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type DataGridContextValue = TableFeaturesState<any> & {\n /**\n * How focus navigation will work in the datagrid\n * @default cell\n */\n focusMode: DataGridFocusMode;\n\n /**\n * Lets child components know if rows selection is enabled\n * @see selectionMode prop enables row selection on the component\n */\n selectableRows: boolean;\n\n /**\n * Enables subtle selection style\n * @default false\n */\n subtleSelection: boolean;\n\n /**\n * Row appearance when selected\n * @default brand\n */\n selectionAppearance: TableRowProps['appearance'];\n\n /**\n * Enables column resizing\n */\n resizableColumns?: boolean;\n\n compositeRowTabsterAttribute: TabsterDOMAttribute;\n};\n\n/**\n * DataGrid Props\n */\nexport type DataGridProps = TableProps &\n Pick<DataGridContextValue, 'items' | 'columns' | 'getRowId'> &\n Pick<Partial<DataGridContextValue>, 'focusMode' | 'subtleSelection' | 'selectionAppearance' | 'resizableColumns'> &\n Pick<UseTableSortOptions, 'sortState' | 'defaultSortState'> &\n Pick<SelectionHookParams, 'defaultSelectedItems' | 'selectedItems'> & {\n /* eslint-disable @nx/workspace-consistent-callback-type -- can't change type of existing callback */\n onSortChange?: (e: React.MouseEvent, sortState: SortState) => void;\n onSelectionChange?: (e: React.MouseEvent | React.KeyboardEvent, data: OnSelectionChangeData) => void;\n /* eslint-enable @nx/workspace-consistent-callback-type */\n\n /**\n * Enables row selection and sets the selection mode\n * @default false\n */\n selectionMode?: SelectionMode;\n /**\n * Options for column resizing, specific for each column\n */\n columnSizingOptions?: TableColumnSizingOptions;\n /**\n * A callback triggered when a column is resized.\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onColumnResize?: (\n e: KeyboardEvent | TouchEvent | MouseEvent | undefined,\n data: { columnId: TableColumnId; width: number },\n ) => void;\n /**\n * For column resizing. Allows for a container size to be adjusted by a number of pixels, to make\n * sure the columns don't overflow the table.\n * By default, this value is calculated internally based on other props, but can be overriden.\n */\n containerWidthOffset?: number;\n\n /**\n * Custom options for column resizing.\n */\n resizableColumnsOptions?: {\n /**\n * If true, columns will be auto-fitted to the container width.\n * @default true\n * */\n autoFitColumns?: boolean;\n };\n };\n\n/**\n * State used in rendering DataGrid\n */\nexport type DataGridState = TableState & { tableState: TableFeaturesState<unknown> } & Pick<\n DataGridContextValue,\n | 'focusMode'\n | 'selectableRows'\n | 'subtleSelection'\n | 'selectionAppearance'\n | 'getRowId'\n | 'resizableColumns'\n | 'compositeRowTabsterAttribute'\n >;\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

View File

@@ -0,0 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGrid: function() {
return _DataGrid.DataGrid;
},
dataGridClassNames: function() {
return _useDataGridStylesstyles.dataGridClassNames;
},
renderDataGrid_unstable: function() {
return _renderDataGrid.renderDataGrid_unstable;
},
useDataGridContextValues_unstable: function() {
return _useDataGridContextValues.useDataGridContextValues_unstable;
},
useDataGridStyles_unstable: function() {
return _useDataGridStylesstyles.useDataGridStyles_unstable;
},
useDataGrid_unstable: function() {
return _useDataGrid.useDataGrid_unstable;
}
});
const _DataGrid = require("./DataGrid");
const _renderDataGrid = require("./renderDataGrid");
const _useDataGrid = require("./useDataGrid");
const _useDataGridStylesstyles = require("./useDataGridStyles.styles");
const _useDataGridContextValues = require("./useDataGridContextValues");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/index.ts"],"sourcesContent":["export { DataGrid } from './DataGrid';\nexport type {\n DataGridContextValue,\n DataGridContextValues,\n DataGridFocusMode,\n DataGridProps,\n DataGridSlots,\n DataGridState,\n} from './DataGrid.types';\nexport { renderDataGrid_unstable } from './renderDataGrid';\nexport { useDataGrid_unstable } from './useDataGrid';\nexport { dataGridClassNames, useDataGridStyles_unstable } from './useDataGridStyles.styles';\nexport { useDataGridContextValues_unstable } from './useDataGridContextValues';\n"],"names":["DataGrid","renderDataGrid_unstable","useDataGrid_unstable","dataGridClassNames","useDataGridStyles_unstable","useDataGridContextValues_unstable"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eAWRG,2CAAkB;;;eAFlBF,uCAAuB;;;eAGvBI,2DAAiC;;;eADbD,mDAA0B;;;eAD9CF,iCAAoB;;;0BAVJ,aAAa;gCASE,mBAAmB;6BACtB,gBAAgB;yCACU,6BAA6B;0CAC1C,6BAA6B"}

View File

@@ -0,0 +1,19 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderDataGrid_unstable", {
enumerable: true,
get: function() {
return renderDataGrid_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _renderTable = require("../Table/renderTable");
const _dataGridContext = require("../../contexts/dataGridContext");
const renderDataGrid_unstable = (state, contextValues)=>{
return /*#__PURE__*/ _react.createElement(_dataGridContext.DataGridContextProvider, {
value: contextValues.dataGrid
}, (0, _renderTable.renderTable_unstable)(state, contextValues));
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/renderDataGrid.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DataGridContextValues, DataGridState } from './DataGrid.types';\nimport { renderTable_unstable } from '../Table/renderTable';\nimport { DataGridContextProvider } from '../../contexts/dataGridContext';\n\n/**\n * Render the final JSX of DataGrid\n */\n\nexport const renderDataGrid_unstable = (state: DataGridState, contextValues: DataGridContextValues): JSXElement => {\n return (\n <DataGridContextProvider value={contextValues.dataGrid}>\n {renderTable_unstable(state, contextValues)}\n </DataGridContextProvider>\n );\n};\n"],"names":["React","renderTable_unstable","DataGridContextProvider","renderDataGrid_unstable","state","contextValues","value","dataGrid"],"mappings":";;;;;;;;;;;iEAAuB,QAAQ;6BAGM,uBAAuB;iCACpB,iCAAiC;AAMlE,MAAMG,0BAA0B,CAACC,OAAsBC;IAC5D,OAAA,WAAA,GACE,OAAA,aAAA,CAACH,wCAAAA,EAAAA;QAAwBI,OAAOD,cAAcE,QAAQ;WACnDN,iCAAAA,EAAqBG,OAAOC;AAGnC,EAAE"}

View File

@@ -0,0 +1,101 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useDataGrid_unstable", {
enumerable: true,
get: function() {
return useDataGrid_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reacttabster = require("@fluentui/react-tabster");
const _useTable = require("../Table/useTable");
const _reactutilities = require("@fluentui/react-utilities");
const _keyboardkeys = require("@fluentui/keyboard-keys");
const _hooks = require("../../hooks");
const _TableSelectionCell = require("../TableSelectionCell");
const useDataGrid_unstable = (props, ref)=>{
const { items, columns, focusMode = 'cell', selectionMode, onSortChange, onSelectionChange, defaultSortState, sortState, selectedItems, defaultSelectedItems, subtleSelection = false, selectionAppearance = 'brand', getRowId, resizableColumns, columnSizingOptions, onColumnResize, containerWidthOffset, resizableColumnsOptions = {} } = props;
const widthOffset = containerWidthOffset !== null && containerWidthOffset !== void 0 ? containerWidthOffset : selectionMode ? -_TableSelectionCell.CELL_WIDTH : 0;
const gridTabsterAttribute = (0, _reacttabster.useArrowNavigationGroup)({
axis: 'grid'
});
const { onTableKeyDown: onCompositeKeyDown, tableTabsterAttribute: compositeTabsterAttribute, tableRowTabsterAttribute: compositeRowTabsterAttribute } = (0, _hooks.useTableCompositeNavigation)();
var _resizableColumnsOptions_autoFitColumns;
const tableState = (0, _hooks.useTableFeatures)({
items,
columns,
getRowId
}, [
(0, _hooks.useTableSort)({
defaultSortState,
sortState,
onSortChange
}),
(0, _hooks.useTableSelection)({
defaultSelectedItems,
selectedItems,
onSelectionChange,
selectionMode: selectionMode !== null && selectionMode !== void 0 ? selectionMode : 'multiselect'
}),
(0, _hooks.useTableColumnSizing_unstable)({
onColumnResize,
columnSizingOptions,
// The selection cell is not part of the columns, therefore its width needs to be subtracted
// from the container to make sure the columns don't overflow the table.
containerWidthOffset: widthOffset,
// Disables automatic resizing of columns when the container overflows.
// This allows the sum of the columns to be larger than the container.
autoFitColumns: (_resizableColumnsOptions_autoFitColumns = resizableColumnsOptions.autoFitColumns) !== null && _resizableColumnsOptions_autoFitColumns !== void 0 ? _resizableColumnsOptions_autoFitColumns : true
})
]);
const innerRef = _react.useRef(null);
const { findFirstFocusable, findLastFocusable } = (0, _reacttabster.useFocusFinders)();
const onKeyDown = (0, _reactutilities.useEventCallback)((e)=>{
var _props_onKeyDown;
(_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);
focusMode === 'composite' && onCompositeKeyDown(e);
// handle ctrl+home and ctrl+end
if (!innerRef.current || !e.ctrlKey || e.defaultPrevented) {
return;
}
if (e.key === _keyboardkeys.Home) {
const firstRow = innerRef.current.querySelector('[role="row"]');
if (firstRow) {
var _findFirstFocusable;
(_findFirstFocusable = findFirstFocusable(firstRow)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();
}
}
if (e.key === _keyboardkeys.End) {
const rows = innerRef.current.querySelectorAll('[role="row"]');
if (rows.length) {
var _findLastFocusable;
const lastRow = rows.item(rows.length - 1);
(_findLastFocusable = findLastFocusable(lastRow)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
}
}
});
const baseTableState = (0, _useTable.useTable_unstable)({
role: 'grid',
as: 'div',
noNativeElements: true,
...focusMode === 'cell' && gridTabsterAttribute,
...focusMode === 'composite' && compositeTabsterAttribute,
...props,
onKeyDown,
...resizableColumns ? tableState.columnSizing_unstable.getTableProps(props) : {}
}, (0, _reactutilities.useMergedRefs)(ref, tableState.tableRef, innerRef));
return {
...baseTableState,
focusMode,
tableState,
selectableRows: !!selectionMode,
subtleSelection,
selectionAppearance,
resizableColumns,
compositeRowTabsterAttribute
};
};

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,28 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useDataGridContextValues_unstable", {
enumerable: true,
get: function() {
return useDataGridContextValues_unstable;
}
});
const _useTableContextValues = require("../Table/useTableContextValues");
function useDataGridContextValues_unstable(state) {
const tableContextValues = (0, _useTableContextValues.useTableContextValues_unstable)(state);
const { tableState, focusMode, selectableRows, subtleSelection, selectionAppearance, resizableColumns, compositeRowTabsterAttribute } = state;
return {
...tableContextValues,
dataGrid: {
...tableState,
focusMode,
selectableRows,
subtleSelection,
selectionAppearance,
resizableColumns,
compositeRowTabsterAttribute
}
};
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/useDataGridContextValues.ts"],"sourcesContent":["'use client';\n\nimport { useTableContextValues_unstable } from '../Table/useTableContextValues';\nimport { DataGridContextValues, DataGridState } from './DataGrid.types';\n\nexport function useDataGridContextValues_unstable(state: DataGridState): DataGridContextValues {\n const tableContextValues = useTableContextValues_unstable(state);\n const {\n tableState,\n focusMode,\n selectableRows,\n subtleSelection,\n selectionAppearance,\n resizableColumns,\n compositeRowTabsterAttribute,\n } = state;\n return {\n ...tableContextValues,\n dataGrid: {\n ...tableState,\n focusMode,\n selectableRows,\n subtleSelection,\n selectionAppearance,\n resizableColumns,\n compositeRowTabsterAttribute,\n },\n };\n}\n"],"names":["useTableContextValues_unstable","useDataGridContextValues_unstable","state","tableContextValues","tableState","focusMode","selectableRows","subtleSelection","selectionAppearance","resizableColumns","compositeRowTabsterAttribute","dataGrid"],"mappings":"AAAA;;;;;;;;;;;uCAE+C,iCAAiC;AAGzE,SAASC,kCAAkCC,KAAoB;IACpE,MAAMC,yBAAqBH,qDAAAA,EAA+BE;IAC1D,MAAM,EACJE,UAAU,EACVC,SAAS,EACTC,cAAc,EACdC,eAAe,EACfC,mBAAmB,EACnBC,gBAAgB,EAChBC,4BAA4B,EAC7B,GAAGR;IACJ,OAAO;QACL,GAAGC,kBAAkB;QACrBQ,UAAU;YACR,GAAGP,UAAU;YACbC;YACAC;YACAC;YACAC;YACAC;YACAC;QACF;IACF;AACF"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridClassNames: function() {
return dataGridClassNames;
},
useDataGridStyles_unstable: function() {
return useDataGridStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableStylesstyles = require("../Table/useTableStyles.styles");
const dataGridClassNames = {
root: 'fui-DataGrid'
};
const useDataGridStyles_unstable = (state)=>{
'use no memo';
(0, _useTableStylesstyles.useTableStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useDataGridStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableStyles_unstable } from '../Table/useTableStyles.styles';\nexport const dataGridClassNames = {\n root: 'fui-DataGrid'\n};\n/**\n * Apply styling to the DataGrid slots based on the state\n */ export const useDataGridStyles_unstable = (state)=>{\n 'use no memo';\n useTableStyles_unstable(state);\n state.root.className = mergeClasses(dataGridClassNames.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","useTableStyles_unstable","dataGridClassNames","root","useDataGridStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;sBAGmB;;;8BAKY;;;;uBAPd,gBAAgB;sCACL,gCAAgC;AACjE,MAAME,qBAAqB;IAC9BC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,8BAA8BC,KAAK,IAAG;IACnD,aAAa;QACbJ,6CAAuB,EAACI,KAAK,CAAC;IAC9BA,KAAK,CAACF,IAAI,CAACG,SAAS,OAAGN,mBAAY,EAACE,kBAAkB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;IAClF,OAAOD,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridClassNames: function() {
return dataGridClassNames;
},
useDataGridStyles_unstable: function() {
return useDataGridStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableStylesstyles = require("../Table/useTableStyles.styles");
const dataGridClassNames = {
root: 'fui-DataGrid'
};
const useDataGridStyles_unstable = (state)=>{
'use no memo';
(0, _useTableStylesstyles.useTableStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGrid/useDataGridStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridSlots, DataGridState } from './DataGrid.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableStyles_unstable } from '../Table/useTableStyles.styles';\n\nexport const dataGridClassNames: SlotClassNames<DataGridSlots> = {\n root: 'fui-DataGrid',\n};\n\n/**\n * Apply styling to the DataGrid slots based on the state\n */\nexport const useDataGridStyles_unstable = (state: DataGridState): DataGridState => {\n 'use no memo';\n\n useTableStyles_unstable(state);\n state.root.className = mergeClasses(dataGridClassNames.root, state.root.className);\n\n return state;\n};\n"],"names":["mergeClasses","useTableStyles_unstable","dataGridClassNames","root","useDataGridStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;sBAOaE;;;8BAOAE;;;;uBAZgB,iBAAiB;sCAGN,iCAAiC;AAElE,MAAMF,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAKK,MAAMC,6BAA6B,CAACC;IACzC;QAEAJ,6CAAAA,EAAwBI;IACxBA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,mBAAmBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAEjF,OAAOD;AACT,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "DataGridBody", {
enumerable: true,
get: function() {
return DataGridBody;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useDataGridBody = require("./useDataGridBody");
const _renderDataGridBody = require("./renderDataGridBody");
const _useDataGridBodyStylesstyles = require("./useDataGridBodyStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const DataGridBody = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useDataGridBody.useDataGridBody_unstable)(props, ref);
(0, _useDataGridBodyStylesstyles.useDataGridBodyStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDataGridBodyStyles_unstable')(state);
return (0, _renderDataGridBody.renderDataGridBody_unstable)(state);
});
DataGridBody.displayName = 'DataGridBody';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/DataGridBody.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDataGridBody_unstable } from './useDataGridBody';\nimport { renderDataGridBody_unstable } from './renderDataGridBody';\nimport { useDataGridBodyStyles_unstable } from './useDataGridBodyStyles.styles';\nimport type { DataGridBodyProps } from './DataGridBody.types';\nimport type { ForwardRefComponent, JSXElement } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridBody component\n */\nexport const DataGridBody: ForwardRefComponent<DataGridBodyProps> &\n (<TItem>(props: DataGridBodyProps<TItem>) => JSXElement) = React.forwardRef<HTMLElement, DataGridBodyProps>(\n (props, ref) => {\n const state = useDataGridBody_unstable(props, ref);\n\n useDataGridBodyStyles_unstable(state);\n\n useCustomStyleHook_unstable('useDataGridBodyStyles_unstable')(state);\n\n return renderDataGridBody_unstable(state);\n },\n) as ForwardRefComponent<DataGridBodyProps> & (<TItem>(props: DataGridBodyProps<TItem>) => JSXElement);\n\nDataGridBody.displayName = 'DataGridBody';\n"],"names":["React","useDataGridBody_unstable","renderDataGridBody_unstable","useDataGridBodyStyles_unstable","useCustomStyleHook_unstable","DataGridBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;iCACU,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;qCAGpC,kCAAkC;AAKvE,MAAMK,eAAAA,WAAAA,GACgDL,OAAMM,UAAU,CAC3E,CAACC,OAAOC;IACN,MAAMC,YAAQR,yCAAAA,EAAyBM,OAAOC;QAE9CL,2DAAAA,EAA+BM;QAE/BL,gDAAAA,EAA4B,kCAAkCK;IAE9D,WAAOP,+CAAAA,EAA4BO;AACrC,GACqG;AAEvGJ,aAAaK,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/DataGridBody.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TableRowData } from '../../hooks';\nimport type { TableBodySlots, TableBodyProps, TableBodyState } from '../TableBody/TableBody.types';\n\nexport type DataGridBodySlots = TableBodySlots;\n\nexport type RowRenderFunction<TItem = unknown> = (row: TableRowData<TItem>, ...rest: unknown[]) => React.ReactNode;\n\n/**\n * DataGridBody Props\n */\nexport type DataGridBodyProps<TItem = unknown> = Omit<TableBodyProps, 'children'> & {\n /**\n * Render function for rows\n */\n children: RowRenderFunction<TItem>;\n};\n\n/**\n * State used in rendering DataGridBody\n */\nexport type DataGridBodyState = TableBodyState & {\n rows: TableRowData<unknown>[];\n\n renderRow: RowRenderFunction;\n};\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridBody: function() {
return _DataGridBody.DataGridBody;
},
dataGridBodyClassNames: function() {
return _useDataGridBodyStylesstyles.dataGridBodyClassNames;
},
renderDataGridBody_unstable: function() {
return _renderDataGridBody.renderDataGridBody_unstable;
},
useDataGridBodyStyles_unstable: function() {
return _useDataGridBodyStylesstyles.useDataGridBodyStyles_unstable;
},
useDataGridBody_unstable: function() {
return _useDataGridBody.useDataGridBody_unstable;
}
});
const _DataGridBody = require("./DataGridBody");
const _renderDataGridBody = require("./renderDataGridBody");
const _useDataGridBody = require("./useDataGridBody");
const _useDataGridBodyStylesstyles = require("./useDataGridBodyStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/index.ts"],"sourcesContent":["export { DataGridBody } from './DataGridBody';\nexport type { DataGridBodyProps, DataGridBodySlots, DataGridBodyState, RowRenderFunction } from './DataGridBody.types';\nexport { renderDataGridBody_unstable } from './renderDataGridBody';\nexport { useDataGridBody_unstable } from './useDataGridBody';\nexport { dataGridBodyClassNames, useDataGridBodyStyles_unstable } from './useDataGridBodyStyles.styles';\n"],"names":["DataGridBody","renderDataGridBody_unstable","useDataGridBody_unstable","dataGridBodyClassNames","useDataGridBodyStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAIZG,mDAAsB;;;eAFtBF,+CAA2B;;;eAEHG,2DAA8B;;;eADtDF,yCAAwB;;;8BAHJ,iBAAiB;oCAEF,uBAAuB;iCAC1B,oBAAoB;6CACU,iCAAiC"}

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderDataGridBody_unstable", {
enumerable: true,
get: function() {
return renderDataGridBody_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _rowIdContext = require("../../contexts/rowIdContext");
const renderDataGridBody_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {
children: state.rows.map((row)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_rowIdContext.TableRowIdContextProvider, {
value: row.rowId,
children: state.renderRow(row)
}, row.rowId))
});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/renderDataGridBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { DataGridBodyState, DataGridBodySlots } from './DataGridBody.types';\nimport { TableRowIdContextProvider } from '../../contexts/rowIdContext';\n\n/**\n * Render the final JSX of DataGridBody\n */\nexport const renderDataGridBody_unstable = (state: DataGridBodyState): JSXElement => {\n assertSlots<DataGridBodySlots>(state);\n\n return (\n <state.root>\n {state.rows.map(row => (\n <TableRowIdContextProvider key={row.rowId} value={row.rowId}>\n {state.renderRow(row)}\n </TableRowIdContextProvider>\n ))}\n </state.root>\n );\n};\n"],"names":["assertSlots","TableRowIdContextProvider","renderDataGridBody_unstable","state","root","rows","map","row","value","rowId","renderRow"],"mappings":";;;;+BAUaE;;;;;;4BATb,gDAAiD;gCACrB,4BAA4B;8BAGd,8BAA8B;AAKjE,oCAAoC,CAACC;QAC1CH,2BAAAA,EAA+BG;IAE/B,OAAA,WAAA,OACE,eAAA,EAACA,MAAMC,IAAI,EAAA;kBACRD,MAAME,IAAI,CAACC,GAAG,CAACC,CAAAA,MAAAA,WAAAA,OACd,eAAA,EAACN,uCAAAA,EAAAA;gBAA0CO,OAAOD,IAAIE,KAAK;0BACxDN,MAAMO,SAAS,CAACH;eADaA,IAAIE,KAAK;;AAMjD,EAAE"}

View File

@@ -0,0 +1,32 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useDataGridBody_unstable", {
enumerable: true,
get: function() {
return useDataGridBody_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTableBody = require("../TableBody/useTableBody");
const _dataGridContext = require("../../contexts/dataGridContext");
const _tableContext = require("../../contexts/tableContext");
const useDataGridBody_unstable = (props, ref)=>{
const { sortable } = (0, _tableContext.useTableContext)();
const getRows = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.getRows);
const sort = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.sort.sort);
const rows = sortable ? sort(getRows()) : getRows();
const baseState = (0, _useTableBody.useTableBody_unstable)({
...props,
children: null,
as: 'div'
}, ref);
return {
...baseState,
rows,
renderRow: props.children
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/useDataGridBody.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { DataGridBodyProps, DataGridBodyState } from './DataGridBody.types';\nimport { useTableBody_unstable } from '../TableBody/useTableBody';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useTableContext } from '../../contexts/tableContext';\n\n/**\n * Create the state required to render DataGridBody.\n *\n * The returned state can be modified with hooks such as useDataGridBodyStyles_unstable,\n * before being passed to renderDataGridBody_unstable.\n *\n * @param props - props from this instance of DataGridBody\n * @param ref - reference to root HTMLElement of DataGridBody\n */\nexport const useDataGridBody_unstable = (props: DataGridBodyProps, ref: React.Ref<HTMLElement>): DataGridBodyState => {\n const { sortable } = useTableContext();\n const getRows = useDataGridContext_unstable(ctx => ctx.getRows);\n const sort = useDataGridContext_unstable(ctx => ctx.sort.sort);\n const rows = sortable ? sort(getRows()) : getRows();\n\n const baseState = useTableBody_unstable({ ...props, children: null, as: 'div' }, ref);\n return {\n ...baseState,\n rows,\n renderRow: props.children,\n };\n};\n"],"names":["React","useTableBody_unstable","useDataGridContext_unstable","useTableContext","useDataGridBody_unstable","props","ref","sortable","getRows","ctx","sort","rows","baseState","children","as","renderRow"],"mappings":"AAAA;;;;;+BAiBaI;;;;;;;iEAfU,QAAQ;8BAEO,4BAA4B;iCACtB,iCAAiC;8BAC7C,8BAA8B;AAWvD,iCAAiC,CAACC,OAA0BC;IACjE,MAAM,EAAEC,QAAQ,EAAE,OAAGJ,6BAAAA;IACrB,MAAMK,UAAUN,gDAAAA,EAA4BO,CAAAA,MAAOA,IAAID,OAAO;IAC9D,MAAME,WAAOR,4CAAAA,EAA4BO,CAAAA,MAAOA,IAAIC,IAAI,CAACA,IAAI;IAC7D,MAAMC,OAAOJ,WAAWG,KAAKF,aAAaA;IAE1C,MAAMI,gBAAYX,mCAAAA,EAAsB;QAAE,GAAGI,KAAK;QAAEQ,UAAU;QAAMC,IAAI;IAAM,GAAGR;IACjF,OAAO;QACL,GAAGM,SAAS;QACZD;QACAI,WAAWV,MAAMQ,QAAQ;IAC3B;AACF,EAAE"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridBodyClassNames: function() {
return dataGridBodyClassNames;
},
useDataGridBodyStyles_unstable: function() {
return useDataGridBodyStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableBodyStylesstyles = require("../TableBody/useTableBodyStyles.styles");
const dataGridBodyClassNames = {
root: 'fui-DataGridBody'
};
const useDataGridBodyStyles_unstable = (state)=>{
'use no memo';
(0, _useTableBodyStylesstyles.useTableBodyStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridBodyClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useDataGridBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableBodyStyles_unstable } from '../TableBody/useTableBodyStyles.styles';\nexport const dataGridBodyClassNames = {\n root: 'fui-DataGridBody'\n};\n/**\n * Apply styling to the DataGridBody slots based on the state\n */ export const useDataGridBodyStyles_unstable = (state)=>{\n 'use no memo';\n useTableBodyStyles_unstable(state);\n state.root.className = mergeClasses(dataGridBodyClassNames.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","useTableBodyStyles_unstable","dataGridBodyClassNames","root","useDataGridBodyStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;0BAGuB;;;kCAKY;;;;uBAPlB,gBAAgB;0CACD,wCAAwC;AAC7E,MAAME,yBAAyB;IAClCC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,kCAAkCC,KAAK,IAAG;IACvD,aAAa;QACbJ,qDAA2B,EAACI,KAAK,CAAC;IAClCA,KAAK,CAACF,IAAI,CAACG,SAAS,OAAGN,mBAAY,EAACE,sBAAsB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;IACtF,OAAOD,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridBodyClassNames: function() {
return dataGridBodyClassNames;
},
useDataGridBodyStyles_unstable: function() {
return useDataGridBodyStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableBodyStylesstyles = require("../TableBody/useTableBodyStyles.styles");
const dataGridBodyClassNames = {
root: 'fui-DataGridBody'
};
const useDataGridBodyStyles_unstable = (state)=>{
'use no memo';
(0, _useTableBodyStylesstyles.useTableBodyStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridBodyClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridBody/useDataGridBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridBodySlots, DataGridBodyState } from './DataGridBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableBodyStyles_unstable } from '../TableBody/useTableBodyStyles.styles';\n\nexport const dataGridBodyClassNames: SlotClassNames<DataGridBodySlots> = {\n root: 'fui-DataGridBody',\n};\n\n/**\n * Apply styling to the DataGridBody slots based on the state\n */\nexport const useDataGridBodyStyles_unstable = (state: DataGridBodyState): DataGridBodyState => {\n 'use no memo';\n\n useTableBodyStyles_unstable(state);\n state.root.className = mergeClasses(dataGridBodyClassNames.root, state.root.className);\n\n return state;\n};\n"],"names":["mergeClasses","useTableBodyStyles_unstable","dataGridBodyClassNames","root","useDataGridBodyStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;0BAOaE;;;kCAOAE;;;;uBAZgB,iBAAiB;0CAGF,yCAAyC;AAE9E,MAAMF,yBAA4D;IACvEC,MAAM;AACR,EAAE;AAKK,MAAMC,iCAAiC,CAACC;IAC7C;QAEAJ,qDAAAA,EAA4BI;IAC5BA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,uBAAuBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAErF,OAAOD;AACT,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "DataGridCell", {
enumerable: true,
get: function() {
return DataGridCell;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useDataGridCell = require("./useDataGridCell");
const _renderDataGridCell = require("./renderDataGridCell");
const _useDataGridCellStylesstyles = require("./useDataGridCellStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const DataGridCell = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useDataGridCell.useDataGridCell_unstable)(props, ref);
(0, _useDataGridCellStylesstyles.useDataGridCellStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDataGridCellStyles_unstable')(state);
return (0, _renderDataGridCell.renderDataGridCell_unstable)(state);
});
DataGridCell.displayName = 'DataGridCell';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/DataGridCell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDataGridCell_unstable } from './useDataGridCell';\nimport { renderDataGridCell_unstable } from './renderDataGridCell';\nimport { useDataGridCellStyles_unstable } from './useDataGridCellStyles.styles';\nimport type { DataGridCellProps } from './DataGridCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridCell component\n */\nexport const DataGridCell: ForwardRefComponent<DataGridCellProps> = React.forwardRef((props, ref) => {\n const state = useDataGridCell_unstable(props, ref);\n\n useDataGridCellStyles_unstable(state);\n\n useCustomStyleHook_unstable('useDataGridCellStyles_unstable')(state);\n\n return renderDataGridCell_unstable(state);\n});\n\nDataGridCell.displayName = 'DataGridCell';\n"],"names":["React","useDataGridCell_unstable","renderDataGridCell_unstable","useDataGridCellStyles_unstable","useCustomStyleHook_unstable","DataGridCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;iCACU,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;qCAGpC,kCAAkC;AAKvE,MAAMK,eAAAA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQR,yCAAAA,EAAyBM,OAAOC;QAE9CL,2DAAAA,EAA+BM;QAE/BL,gDAAAA,EAA4B,kCAAkCK;IAE9D,WAAOP,+CAAAA,EAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* State used in rendering DataGridCell
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/DataGridCell.types.ts"],"sourcesContent":["import { TableCellProps, TableCellSlots, TableCellState } from '../TableCell/TableCell.types';\n\nexport type DataGridCellSlots = TableCellSlots;\n\n/**\n * Used when there are nested focusble elements inside a focusable cell\n * - `group`: Enter keypress moves focus inside the cell, focus is trapped inside the cell until Escape keypress\n * - `cell`: The cell is focusable - if there are focusable elements in the cell use `group`\n * - `none`: The cell is not focusable\n */\nexport type DataGridCellFocusMode = 'group' | 'none' | 'cell';\n\n/**\n * DataGridCell Props\n */\nexport type DataGridCellProps = TableCellProps & {\n /**\n * Used when there are nested focusble elements inside a focusable cell\n * - `group`: Enter keypress moves focus inside the cell, focus is trapped inside the cell until Escape keypress\n * - `cell`: The cell is focusable - if there are focusable elements in the cell use `group`\n * - `none`: The cell is not focusable\n * @default cell\n */\n focusMode?: DataGridCellFocusMode;\n};\n\n/**\n * State used in rendering DataGridCell\n */\nexport type DataGridCellState = TableCellState;\n"],"names":[],"mappings":"AA0BA;;CAEC,GACD,WAA+C"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridCell: function() {
return _DataGridCell.DataGridCell;
},
dataGridCellClassNames: function() {
return _useDataGridCellStylesstyles.dataGridCellClassNames;
},
renderDataGridCell_unstable: function() {
return _renderDataGridCell.renderDataGridCell_unstable;
},
useDataGridCellStyles_unstable: function() {
return _useDataGridCellStylesstyles.useDataGridCellStyles_unstable;
},
useDataGridCell_unstable: function() {
return _useDataGridCell.useDataGridCell_unstable;
}
});
const _DataGridCell = require("./DataGridCell");
const _renderDataGridCell = require("./renderDataGridCell");
const _useDataGridCell = require("./useDataGridCell");
const _useDataGridCellStylesstyles = require("./useDataGridCellStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/index.ts"],"sourcesContent":["export { DataGridCell } from './DataGridCell';\nexport type {\n DataGridCellFocusMode,\n DataGridCellProps,\n DataGridCellSlots,\n DataGridCellState,\n} from './DataGridCell.types';\nexport { renderDataGridCell_unstable } from './renderDataGridCell';\nexport { useDataGridCell_unstable } from './useDataGridCell';\nexport { dataGridCellClassNames, useDataGridCellStyles_unstable } from './useDataGridCellStyles.styles';\n"],"names":["DataGridCell","renderDataGridCell_unstable","useDataGridCell_unstable","dataGridCellClassNames","useDataGridCellStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eASZG,mDAAsB;;;eAFtBF,+CAA2B;;;eAEHG,2DAA8B;;;eADtDF,yCAAwB;;;8BARJ,iBAAiB;oCAOF,uBAAuB;iCAC1B,oBAAoB;6CACU,iCAAiC"}

View File

@@ -0,0 +1,14 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderDataGridCell_unstable", {
enumerable: true,
get: function() {
return renderDataGridCell_unstable;
}
});
const _renderTableCell = require("../TableCell/renderTableCell");
const renderDataGridCell_unstable = (state)=>{
return (0, _renderTableCell.renderTableCell_unstable)(state);
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/renderDataGridCell.tsx"],"sourcesContent":["import type { JSXElement } from '@fluentui/react-utilities';\nimport type { DataGridCellState } from './DataGridCell.types';\nimport { renderTableCell_unstable } from '../TableCell/renderTableCell';\n\n/**\n * Render the final JSX of DataGridCell\n */\nexport const renderDataGridCell_unstable = (state: DataGridCellState): JSXElement => {\n return renderTableCell_unstable(state);\n};\n"],"names":["renderTableCell_unstable","renderDataGridCell_unstable","state"],"mappings":";;;;;;;;;;iCAEyC,+BAA+B;AAKjE,MAAMC,8BAA8B,CAACC;IAC1C,WAAOF,yCAAAA,EAAyBE;AAClC,EAAE"}

View File

@@ -0,0 +1,37 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useDataGridCell_unstable", {
enumerable: true,
get: function() {
return useDataGridCell_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reacttabster = require("@fluentui/react-tabster");
const _useTableCell = require("../TableCell/useTableCell");
const _dataGridContext = require("../../contexts/dataGridContext");
const _columnIdContext = require("../../contexts/columnIdContext");
const useDataGridCell_unstable = (props, ref)=>{
const { focusMode = 'cell' } = props;
const columnId = (0, _columnIdContext.useColumnIdContext)();
const tabbable = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>(ctx.focusMode === 'cell' || ctx.focusMode === 'composite') && focusMode !== 'none');
const resizableColumns = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>ctx.resizableColumns);
const getTableCellProps = (0, _dataGridContext.useDataGridContext_unstable)((ctx)=>{
return ctx.columnSizing_unstable.getTableCellProps;
});
const focusableGroupAttr = (0, _reacttabster.useFocusableGroup)({
tabBehavior: 'limited-trap-focus'
});
return (0, _useTableCell.useTableCell_unstable)({
as: 'div',
role: 'gridcell',
...focusMode === 'group' && focusableGroupAttr,
tabIndex: tabbable ? 0 : undefined,
...resizableColumns ? getTableCellProps(columnId) : {},
...props
}, ref);
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/useDataGridCell.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport type { DataGridCellProps, DataGridCellState } from './DataGridCell.types';\nimport { useTableCell_unstable } from '../TableCell/useTableCell';\nimport { useDataGridContext_unstable } from '../../contexts/dataGridContext';\nimport { useColumnIdContext } from '../../contexts/columnIdContext';\n\n/**\n * Create the state required to render DataGridCell.\n *\n * The returned state can be modified with hooks such as useDataGridCellStyles_unstable,\n * before being passed to renderDataGridCell_unstable.\n *\n * @param props - props from this instance of DataGridCell\n * @param ref - reference to root HTMLElement of DataGridCell\n */\nexport const useDataGridCell_unstable = (props: DataGridCellProps, ref: React.Ref<HTMLElement>): DataGridCellState => {\n const { focusMode = 'cell' } = props;\n const columnId = useColumnIdContext();\n const tabbable = useDataGridContext_unstable(\n ctx => (ctx.focusMode === 'cell' || ctx.focusMode === 'composite') && focusMode !== 'none',\n );\n const resizableColumns = useDataGridContext_unstable(ctx => ctx.resizableColumns);\n const getTableCellProps = useDataGridContext_unstable(ctx => {\n return ctx.columnSizing_unstable.getTableCellProps;\n });\n const focusableGroupAttr = useFocusableGroup({ tabBehavior: 'limited-trap-focus' });\n return useTableCell_unstable(\n {\n as: 'div',\n role: 'gridcell',\n ...(focusMode === 'group' && focusableGroupAttr),\n tabIndex: tabbable ? 0 : undefined,\n ...(resizableColumns ? getTableCellProps(columnId) : {}),\n ...props,\n },\n ref,\n );\n};\n"],"names":["React","useFocusableGroup","useTableCell_unstable","useDataGridContext_unstable","useColumnIdContext","useDataGridCell_unstable","props","ref","focusMode","columnId","tabbable","ctx","resizableColumns","getTableCellProps","columnSizing_unstable","focusableGroupAttr","tabBehavior","as","role","tabIndex","undefined"],"mappings":"AAAA;;;;;+BAkBaK;;;;;;;iEAhBU,QAAQ;8BACG,0BAA0B;8BAEtB,4BAA4B;iCACtB,iCAAiC;iCAC1C,iCAAiC;AAW7D,iCAAiC,CAACC,OAA0BC;IACjE,MAAM,EAAEC,YAAY,MAAM,EAAE,GAAGF;IAC/B,MAAMG,eAAWL,mCAAAA;IACjB,MAAMM,eAAWP,4CAAAA,EACfQ,CAAAA,MAAQA,CAAAA,IAAIH,SAAS,KAAK,UAAUG,IAAIH,SAAS,KAAK,WAAA,CAAU,IAAMA,cAAc;IAEtF,MAAMI,uBAAmBT,4CAAAA,EAA4BQ,CAAAA,MAAOA,IAAIC,gBAAgB;IAChF,MAAMC,oBAAoBV,gDAAAA,EAA4BQ,CAAAA;QACpD,OAAOA,IAAIG,qBAAqB,CAACD,iBAAiB;IACpD;IACA,MAAME,yBAAqBd,+BAAAA,EAAkB;QAAEe,aAAa;IAAqB;IACjF,WAAOd,mCAAAA,EACL;QACEe,IAAI;QACJC,MAAM;QACN,GAAIV,cAAc,WAAWO,kBAAkB;QAC/CI,UAAUT,WAAW,IAAIU;QACzB,GAAIR,mBAAmBC,kBAAkBJ,YAAY,CAAC,CAAC;QACvD,GAAGH,KAAK;IACV,GACAC;AAEJ,EAAE"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridCellClassNames: function() {
return dataGridCellClassNames;
},
useDataGridCellStyles_unstable: function() {
return useDataGridCellStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableCellStylesstyles = require("../TableCell/useTableCellStyles.styles");
const dataGridCellClassNames = {
root: 'fui-DataGridCell'
};
const useDataGridCellStyles_unstable = (state)=>{
'use no memo';
(0, _useTableCellStylesstyles.useTableCellStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridCellClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useDataGridCellStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableCellStyles_unstable } from '../TableCell/useTableCellStyles.styles';\nexport const dataGridCellClassNames = {\n root: 'fui-DataGridCell'\n};\n/**\n * Apply styling to the DataGridCell slots based on the state\n */ export const useDataGridCellStyles_unstable = (state)=>{\n 'use no memo';\n useTableCellStyles_unstable(state);\n state.root.className = mergeClasses(dataGridCellClassNames.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","useTableCellStyles_unstable","dataGridCellClassNames","root","useDataGridCellStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;0BAGuB;;;kCAKY;;;;uBAPlB,gBAAgB;0CACD,wCAAwC;AAC7E,MAAME,yBAAyB;IAClCC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,kCAAkCC,KAAK,IAAG;IACvD,aAAa;QACbJ,qDAA2B,EAACI,KAAK,CAAC;IAClCA,KAAK,CAACF,IAAI,CAACG,SAAS,OAAGN,mBAAY,EAACE,sBAAsB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;IACtF,OAAOD,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridCellClassNames: function() {
return dataGridCellClassNames;
},
useDataGridCellStyles_unstable: function() {
return useDataGridCellStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableCellStylesstyles = require("../TableCell/useTableCellStyles.styles");
const dataGridCellClassNames = {
root: 'fui-DataGridCell'
};
const useDataGridCellStyles_unstable = (state)=>{
'use no memo';
(0, _useTableCellStylesstyles.useTableCellStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridCellClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridCell/useDataGridCellStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridCellSlots, DataGridCellState } from './DataGridCell.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableCellStyles_unstable } from '../TableCell/useTableCellStyles.styles';\n\nexport const dataGridCellClassNames: SlotClassNames<DataGridCellSlots> = {\n root: 'fui-DataGridCell',\n};\n\n/**\n * Apply styling to the DataGridCell slots based on the state\n */\nexport const useDataGridCellStyles_unstable = (state: DataGridCellState): DataGridCellState => {\n 'use no memo';\n\n useTableCellStyles_unstable(state);\n state.root.className = mergeClasses(dataGridCellClassNames.root, state.root.className);\n\n return state;\n};\n"],"names":["mergeClasses","useTableCellStyles_unstable","dataGridCellClassNames","root","useDataGridCellStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;0BAOaE;;;kCAOAE;;;;uBAZgB,iBAAiB;0CAGF,yCAAyC;AAE9E,MAAMF,yBAA4D;IACvEC,MAAM;AACR,EAAE;AAKK,MAAMC,iCAAiC,CAACC;IAC7C;QAEAJ,qDAAAA,EAA4BI;IAC5BA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,uBAAuBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAErF,OAAOD;AACT,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "DataGridHeader", {
enumerable: true,
get: function() {
return DataGridHeader;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useDataGridHeader = require("./useDataGridHeader");
const _renderDataGridHeader = require("./renderDataGridHeader");
const _useDataGridHeaderStylesstyles = require("./useDataGridHeaderStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const DataGridHeader = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useDataGridHeader.useDataGridHeader_unstable)(props, ref);
(0, _useDataGridHeaderStylesstyles.useDataGridHeaderStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDataGridHeaderStyles_unstable')(state);
return (0, _renderDataGridHeader.renderDataGridHeader_unstable)(state);
});
DataGridHeader.displayName = 'DataGridHeader';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/DataGridHeader.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDataGridHeader_unstable } from './useDataGridHeader';\nimport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nimport { useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles.styles';\nimport type { DataGridHeaderProps } from './DataGridHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeader component\n */\nexport const DataGridHeader: ForwardRefComponent<DataGridHeaderProps> = React.forwardRef((props, ref) => {\n const state = useDataGridHeader_unstable(props, ref);\n\n useDataGridHeaderStyles_unstable(state);\n\n useCustomStyleHook_unstable('useDataGridHeaderStyles_unstable')(state);\n\n return renderDataGridHeader_unstable(state);\n});\n\nDataGridHeader.displayName = 'DataGridHeader';\n"],"names":["React","useDataGridHeader_unstable","renderDataGridHeader_unstable","useDataGridHeaderStyles_unstable","useCustomStyleHook_unstable","DataGridHeader","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;mCACY,sBAAsB;sCACnB,yBAAyB;+CACtB,mCAAmC;qCAGxC,kCAAkC;AAKvE,MAAMK,iBAAAA,WAAAA,GAA2DL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,YAAQR,6CAAAA,EAA2BM,OAAOC;QAEhDL,+DAAAA,EAAiCM;QAEjCL,gDAAAA,EAA4B,oCAAoCK;IAEhE,WAAOP,mDAAAA,EAA8BO;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* State used in rendering DataGridHeader
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/DataGridHeader.types.ts"],"sourcesContent":["import { TableHeaderProps, TableHeaderSlots, TableHeaderState } from '../TableHeader/TableHeader.types';\n\nexport type DataGridHeaderSlots = TableHeaderSlots;\n\n/**\n * DataGridHeader Props\n */\nexport type DataGridHeaderProps = TableHeaderProps;\n\n/**\n * State used in rendering DataGridHeader\n */\nexport type DataGridHeaderState = TableHeaderState;\n"],"names":[],"mappings":"AASA;;CAEC,GACD,WAAmD"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
DataGridHeader: function() {
return _DataGridHeader.DataGridHeader;
},
dataGridHeaderClassNames: function() {
return _useDataGridHeaderStylesstyles.dataGridHeaderClassNames;
},
renderDataGridHeader_unstable: function() {
return _renderDataGridHeader.renderDataGridHeader_unstable;
},
useDataGridHeaderStyles_unstable: function() {
return _useDataGridHeaderStylesstyles.useDataGridHeaderStyles_unstable;
},
useDataGridHeader_unstable: function() {
return _useDataGridHeader.useDataGridHeader_unstable;
}
});
const _DataGridHeader = require("./DataGridHeader");
const _renderDataGridHeader = require("./renderDataGridHeader");
const _useDataGridHeader = require("./useDataGridHeader");
const _useDataGridHeaderStylesstyles = require("./useDataGridHeaderStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/index.ts"],"sourcesContent":["export { DataGridHeader } from './DataGridHeader';\nexport type { DataGridHeaderProps, DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nexport { renderDataGridHeader_unstable } from './renderDataGridHeader';\nexport { useDataGridHeader_unstable } from './useDataGridHeader';\nexport { dataGridHeaderClassNames, useDataGridHeaderStyles_unstable } from './useDataGridHeaderStyles.styles';\n"],"names":["DataGridHeader","renderDataGridHeader_unstable","useDataGridHeader_unstable","dataGridHeaderClassNames","useDataGridHeaderStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,8BAAc;;;eAIdG,uDAAwB;;;eAFxBF,mDAA6B;;;eAEHG,+DAAgC;;;eAD1DF,6CAA0B;;;gCAHJ,mBAAmB;sCAEJ,yBAAyB;mCAC5B,sBAAsB;+CACU,mCAAmC"}

View File

@@ -0,0 +1,14 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderDataGridHeader_unstable", {
enumerable: true,
get: function() {
return renderDataGridHeader_unstable;
}
});
const _renderTableHeader = require("../TableHeader/renderTableHeader");
const renderDataGridHeader_unstable = (state)=>{
return (0, _renderTableHeader.renderTableHeader_unstable)(state);
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/renderDataGridHeader.tsx"],"sourcesContent":["import type { JSXElement } from '@fluentui/react-utilities';\nimport { renderTableHeader_unstable } from '../TableHeader/renderTableHeader';\nimport type { DataGridHeaderState } from './DataGridHeader.types';\n\n/**\n * Render the final JSX of DataGridHeader\n */\nexport const renderDataGridHeader_unstable = (state: DataGridHeaderState): JSXElement => {\n return renderTableHeader_unstable(state);\n};\n"],"names":["renderTableHeader_unstable","renderDataGridHeader_unstable","state"],"mappings":";;;;;;;;;;mCAC2C,mCAAmC;AAMvE,MAAMC,gCAAgC,CAACC;IAC5C,WAAOF,6CAAAA,EAA2BE;AACpC,EAAE"}

View File

@@ -0,0 +1,20 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useDataGridHeader_unstable", {
enumerable: true,
get: function() {
return useDataGridHeader_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTableHeader = require("../TableHeader/useTableHeader");
const useDataGridHeader_unstable = (props, ref)=>{
return (0, _useTableHeader.useTableHeader_unstable)({
...props,
as: 'div'
}, ref);
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/useDataGridHeader.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { DataGridHeaderProps, DataGridHeaderState } from './DataGridHeader.types';\nimport { useTableHeader_unstable } from '../TableHeader/useTableHeader';\n\n/**\n * Create the state required to render DataGridHeader.\n *\n * The returned state can be modified with hooks such as useDataGridHeaderStyles_unstable,\n * before being passed to renderDataGridHeader_unstable.\n *\n * @param props - props from this instance of DataGridHeader\n * @param ref - reference to root HTMLElement of DataGridHeader\n */\nexport const useDataGridHeader_unstable = (\n props: DataGridHeaderProps,\n ref: React.Ref<HTMLElement>,\n): DataGridHeaderState => {\n return useTableHeader_unstable({ ...props, as: 'div' }, ref);\n};\n"],"names":["React","useTableHeader_unstable","useDataGridHeader_unstable","props","ref","as"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;gCAES,gCAAgC;AAWjE,MAAME,6BAA6B,CACxCC,OACAC;IAEA,WAAOH,uCAAAA,EAAwB;QAAE,GAAGE,KAAK;QAAEE,IAAI;IAAM,GAAGD;AAC1D,EAAE"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridHeaderClassNames: function() {
return dataGridHeaderClassNames;
},
useDataGridHeaderStyles_unstable: function() {
return useDataGridHeaderStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableHeaderStylesstyles = require("../TableHeader/useTableHeaderStyles.styles");
const dataGridHeaderClassNames = {
root: 'fui-DataGridHeader'
};
const useDataGridHeaderStyles_unstable = (state)=>{
'use no memo';
(0, _useTableHeaderStylesstyles.useTableHeaderStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridHeaderClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useDataGridHeaderStyles.styles.js"],"sourcesContent":["'use client';\nimport { mergeClasses } from '@griffel/react';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles.styles';\nexport const dataGridHeaderClassNames = {\n root: 'fui-DataGridHeader'\n};\n/**\n * Apply styling to the DataGridHeader slots based on the state\n */ export const useDataGridHeaderStyles_unstable = (state)=>{\n 'use no memo';\n useTableHeaderStyles_unstable(state);\n state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n return state;\n};\n"],"names":["mergeClasses","useTableHeaderStyles_unstable","dataGridHeaderClassNames","root","useDataGridHeaderStyles_unstable","state","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;4BAGyB;;;oCAKY;;;;uBAPpB,gBAAgB;4CACC,4CAA4C;AACnF,MAAME,2BAA2B;IACpCC,IAAI,EAAE;AACV,CAAC;AAGU,MAAMC,oCAAoCC,KAAK,IAAG;IACzD,aAAa;QACbJ,yDAA6B,EAACI,KAAK,CAAC;IACpCA,KAAK,CAACF,IAAI,CAACG,SAAS,OAAGN,mBAAY,EAACE,wBAAwB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;IACxF,OAAOD,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,30 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
dataGridHeaderClassNames: function() {
return dataGridHeaderClassNames;
},
useDataGridHeaderStyles_unstable: function() {
return useDataGridHeaderStyles_unstable;
}
});
const _react = require("@griffel/react");
const _useTableHeaderStylesstyles = require("../TableHeader/useTableHeaderStyles.styles");
const dataGridHeaderClassNames = {
root: 'fui-DataGridHeader'
};
const useDataGridHeaderStyles_unstable = (state)=>{
'use no memo';
(0, _useTableHeaderStylesstyles.useTableHeaderStyles_unstable)(state);
state.root.className = (0, _react.mergeClasses)(dataGridHeaderClassNames.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeader/useDataGridHeaderStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport type { DataGridHeaderSlots, DataGridHeaderState } from './DataGridHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { useTableHeaderStyles_unstable } from '../TableHeader/useTableHeaderStyles.styles';\n\nexport const dataGridHeaderClassNames: SlotClassNames<DataGridHeaderSlots> = {\n root: 'fui-DataGridHeader',\n};\n\n/**\n * Apply styling to the DataGridHeader slots based on the state\n */\nexport const useDataGridHeaderStyles_unstable = (state: DataGridHeaderState): DataGridHeaderState => {\n 'use no memo';\n\n useTableHeaderStyles_unstable(state);\n state.root.className = mergeClasses(dataGridHeaderClassNames.root, state.root.className);\n\n return state;\n};\n"],"names":["mergeClasses","useTableHeaderStyles_unstable","dataGridHeaderClassNames","root","useDataGridHeaderStyles_unstable","state","className"],"mappings":"AAAA;;;;;;;;;;;;4BAOaE;;;oCAOAE;;;;uBAZgB,iBAAiB;4CAGA,6CAA6C;AAEpF,MAAMF,2BAAgE;IAC3EC,MAAM;AACR,EAAE;AAKK,MAAMC,mCAAmC,CAACC;IAC/C;QAEAJ,yDAAAA,EAA8BI;IAC9BA,MAAMF,IAAI,CAACG,SAAS,OAAGN,mBAAAA,EAAaE,yBAAyBC,IAAI,EAAEE,MAAMF,IAAI,CAACG,SAAS;IAEvF,OAAOD;AACT,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "DataGridHeaderCell", {
enumerable: true,
get: function() {
return DataGridHeaderCell;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useDataGridHeaderCell = require("./useDataGridHeaderCell");
const _renderDataGridHeaderCell = require("./renderDataGridHeaderCell");
const _useDataGridHeaderCellStylesstyles = require("./useDataGridHeaderCellStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const DataGridHeaderCell = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useDataGridHeaderCell.useDataGridHeaderCell_unstable)(props, ref);
(0, _useDataGridHeaderCellStylesstyles.useDataGridHeaderCellStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useDataGridHeaderCellStyles_unstable')(state);
return (0, _renderDataGridHeaderCell.renderDataGridHeaderCell_unstable)(state);
});
DataGridHeaderCell.displayName = 'DataGridHeaderCell';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/DataGridHeaderCell/DataGridHeaderCell.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useDataGridHeaderCell_unstable } from './useDataGridHeaderCell';\nimport { renderDataGridHeaderCell_unstable } from './renderDataGridHeaderCell';\nimport { useDataGridHeaderCellStyles_unstable } from './useDataGridHeaderCellStyles.styles';\nimport type { DataGridHeaderCellProps } from './DataGridHeaderCell.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * DataGridHeaderCell component\n */\nexport const DataGridHeaderCell: ForwardRefComponent<DataGridHeaderCellProps> = React.forwardRef((props, ref) => {\n const state = useDataGridHeaderCell_unstable(props, ref);\n\n useDataGridHeaderCellStyles_unstable(state);\n\n useCustomStyleHook_unstable('useDataGridHeaderCellStyles_unstable')(state);\n\n return renderDataGridHeaderCell_unstable(state);\n});\n\nDataGridHeaderCell.displayName = 'DataGridHeaderCell';\n"],"names":["React","useDataGridHeaderCell_unstable","renderDataGridHeaderCell_unstable","useDataGridHeaderCellStyles_unstable","useCustomStyleHook_unstable","DataGridHeaderCell","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;uCACgB,0BAA0B;0CACvB,6BAA6B;mDAC1B,uCAAuC;qCAGhD,kCAAkC;AAKvE,MAAMK,qBAAAA,WAAAA,GAAmEL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACvG,MAAMC,YAAQR,qDAAAA,EAA+BM,OAAOC;QAEpDL,uEAAAA,EAAqCM;QAErCL,gDAAAA,EAA4B,wCAAwCK;IAEpE,WAAOP,2DAAAA,EAAkCO;AAC3C,GAAG;AAEHJ,mBAAmBK,WAAW,GAAG"}

Some files were not shown because too many files have changed in this diff Show More