@entur/table 4.5.28 → 4.5.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"table.cjs.production.min.js","sources":["../src/Table.tsx","../src/TableHead.tsx","../src/TableBody.tsx","../src/TableFooter.tsx","../src/TableRow.tsx","../src/DataCell.tsx","../src/HeaderCell.tsx","../src/useTableKeyboardNavigation.tsx","../src/index.tsx","../src/EditableCell.tsx","../src/ExpandRowButton.tsx","../src/ExpandableRow.tsx","../src/useSortableTable.ts"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Setter tettheten mellom rader og kolonner. Bruk gjerne middle og small for for sider med høy informasjonstetthet\n * @default \"default\"\n */\n spacing?: 'default' | 'middle' | 'small';\n /** Setter kolonne-layout til å være uavhengig av innhold\n * @default false\n */\n fixed?: boolean;\n /** Innholdet i tabellen */\n children: React.ReactNode;\n [key: string]: any;\n};\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n fixed = false,\n spacing = 'default',\n sortable = false,\n ...rest\n },\n ref,\n ) => {\n return (\n <table\n className={classNames(\n 'eds-table',\n { 'eds-table--fixed': fixed },\n { 'eds-table--middle': spacing === 'middle' },\n { 'eds-table--small': spacing === 'small' },\n { 'eds-table--sortable': sortable },\n className,\n )}\n ref={ref}\n {...rest}\n />\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableHeadProps = {\n /** Kolonneoverskrifter */\n children: React.ReactNode;\n /** Esktra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableHead = React.forwardRef<\n HTMLTableSectionElement,\n TableHeadProps\n>(({ className, ...props }, ref) => (\n <thead\n className={classNames('eds-table__head', className)}\n ref={ref}\n {...props}\n />\n));\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableBodyProps = {\n /** Tabellrader */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n ref?: React.Ref<HTMLTableSectionElement>;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableBody = React.forwardRef<\n HTMLTableSectionElement,\n TableBodyProps\n>(({ className, ...rest }, ref) => (\n <tbody\n className={classNames('eds-table__body', className)}\n ref={ref}\n {...rest}\n />\n));\n","import React from 'react';\n\nexport type TableFooterProps = {\n /** Tabellrader */\n children: React.ReactNode;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableFooter = React.forwardRef<\n HTMLTableSectionElement,\n TableFooterProps\n>(({ ...props }, ref) => <tfoot ref={ref} {...props} />);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableRowProps = {\n /** Tabellceller */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /**Hvis satt, så vil tabellraden endre fargen ved hover\n * @default false\n */\n hover?: boolean;\n /** Om raden er klikkbar, så vil raden endre farge, og musepekeren vil symbolisere interaktivitet\n * @default false\n */\n active?: boolean;\n /**Signalisere om at det er en feil i tabellraden\n * @default false\n */\n error?: boolean;\n ref?: React.Ref<HTMLTableRowElement>;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableRowElement>,\n HTMLTableRowElement\n>;\n\nexport const TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(\n (\n { className, hover = false, active = false, error = false, ...rest },\n ref: React.Ref<HTMLTableRowElement>,\n ) => (\n <tr\n className={classNames('eds-table__row', className, {\n 'eds-table__row--hover': hover,\n 'eds-table__row--active': active,\n 'eds-table__row--error': error,\n })}\n ref={ref}\n {...rest}\n />\n ),\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type DataCellProps = {\n /** Innholdet i tabellcellen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse som settes for DataCell for ulikt innhold av komponenter */\n padding?: 'default' | 'checkbox' | 'radio' | 'overflow-menu';\n /** Viser en status-sirkel for DataCell */\n status?: 'positive' | 'negative' | 'neutral';\n} & React.DetailedHTMLProps<\n React.TdHTMLAttributes<HTMLTableDataCellElement>,\n HTMLTableDataCellElement\n>;\n\nexport const DataCell = React.forwardRef<\n HTMLTableDataCellElement,\n DataCellProps\n>(\n (\n { className, padding = 'default', status = undefined, ...rest },\n ref: React.Ref<HTMLTableDataCellElement>,\n ) => (\n <td\n ref={ref}\n className={classNames('eds-table__data-cell', className, {\n [`eds-table__data-cell--status-${status}`]: status,\n 'eds-table__data-cell--padding-checkbox': padding === 'checkbox',\n 'eds-table__data-cell--padding-radio': padding === 'radio',\n 'eds-table__data-cell--padding-overflow-menu':\n padding === 'overflow-menu',\n })}\n {...rest}\n />\n ),\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nimport { DownArrowIcon, UpArrowIcon, UnsortedIcon } from '@entur/icons';\n\nimport { ExternalSortConfig } from '.';\n\nimport './HeaderCell.scss';\n\nexport type HeaderCellProps = {\n /** Kolonneoverskrift */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse som settes for HeaderCell for ulikt innhold av komponenter */\n padding?: 'default' | 'checkbox' | 'radio' | 'overflow-menu';\n\n /** Ekstra props som kan sendes til sorteringsknappelementet. Benyttes via useSortableTable */\n sortableButtonProps?: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >;\n\n /** Om komponenten brukes til sortering. Benytt via useSortableTable\n * @default false\n */\n sortable?: boolean;\n /** Konfigurering og rekkefølgen på sortering. Benyttes via useSortableTable */\n sortConfig?: ExternalSortConfig;\n /** Navnet det skal sorteres på. Benyttes via useSortableTable */\n name?: string;\n} & React.DetailedHTMLProps<\n React.ThHTMLAttributes<HTMLTableCellElement>,\n HTMLTableCellElement\n>;\n\nexport const HeaderCell = React.forwardRef<\n HTMLTableCellElement,\n HeaderCellProps\n>(\n (\n {\n className,\n children,\n name,\n sortable = false,\n sortConfig,\n padding = 'default',\n sortableButtonProps,\n ...rest\n },\n ref,\n ) => {\n const [isCurrentlySorted, setIsCurrentlySorted] =\n React.useState<boolean>(false);\n React.useEffect(() => {\n sortConfig &&\n name &&\n setIsCurrentlySorted(sortConfig && name === sortConfig.key);\n }, [sortConfig, name]);\n const ariaSort = isCurrentlySorted\n ? sortConfig && sortConfig.order\n : 'none';\n\n return (\n <th\n className={classNames('eds-table__header-cell', className, {\n 'eds-table__header-cell--sortable': sortable,\n 'eds-table__header-cell--padding-radio': padding === 'radio',\n 'eds-table__header-cell--padding-checkbox': padding === 'checkbox',\n 'eds-table__header-cell--padding-overflow-menu':\n padding === 'overflow-menu',\n })}\n aria-sort={ariaSort}\n ref={ref}\n {...rest}\n >\n {sortable && sortConfig && sortableButtonProps ? (\n <SortableHeaderCellButton\n sortableButtonProps={sortableButtonProps}\n sortConfig={sortConfig}\n isCurrentlySorted={isCurrentlySorted}\n >\n {children}\n </SortableHeaderCellButton>\n ) : (\n children\n )}\n </th>\n );\n },\n);\n\ntype SortableHeaderCellButtonProps = {\n sortConfig: ExternalSortConfig;\n isCurrentlySorted: boolean;\n sortableButtonProps: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >;\n};\n\nconst SortableHeaderCellButton: React.FC<SortableHeaderCellButtonProps> = ({\n sortConfig,\n sortableButtonProps,\n isCurrentlySorted,\n children,\n}) => {\n const { className, ...rest } = sortableButtonProps;\n return (\n <button\n className={classNames('eds-table__header-cell-button', className)}\n type=\"button\"\n {...rest}\n >\n {children}\n {(!isCurrentlySorted || sortConfig.order === 'none') && (\n <UnsortedIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"usortert kolonne\"\n />\n )}\n {isCurrentlySorted && sortConfig.order === 'ascending' && (\n <UpArrowIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"stigende sortert kolonne\"\n />\n )}\n {isCurrentlySorted && sortConfig.order === 'descending' && (\n <DownArrowIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"synkende sortert kolonne\"\n />\n )}\n </button>\n );\n};\n","import React, { useState } from 'react';\nimport { TableBodyProps, TableRowProps } from './index';\n\nfunction onTableKeypress(\n event: React.KeyboardEvent,\n currentRow: number,\n maxRow: number,\n allowWrap?: boolean,\n) {\n const keyPress = event.key;\n switch (keyPress) {\n case 'ArrowUp':\n event.preventDefault();\n if (allowWrap) {\n return currentRow === 0 ? maxRow - 1 : currentRow - 1;\n } else {\n return currentRow > 0 ? currentRow - 1 : 0;\n }\n case 'ArrowDown':\n event.preventDefault();\n if (allowWrap) {\n return currentRow === maxRow - 1 ? 0 : currentRow + 1;\n } else {\n return currentRow < maxRow - 1 ? currentRow + 1 : currentRow;\n }\n default:\n return currentRow;\n }\n}\n\nexport type useTableKeyboardNavigationProps = (\n /** Antall rader i tabellen */\n numberOfRows: number,\n /** Tillate at man kan navigere sirkulært\n * @default false\n */\n allowWrap?: boolean,\n) => {\n getTableRowNavigationProps: (\n /** Raden i tabellen (0-indeksert) */\n row: number,\n ) => Partial<TableRowProps>;\n getTableBodyNavigationProps: () => Partial<TableBodyProps>;\n};\n\nexport const useTableKeyboardNavigation: useTableKeyboardNavigationProps = (\n numberOfRows = 0,\n allowWrap = true,\n) => {\n const [currentRow, setCurrentRow] = useState(numberOfRows);\n const [maxRow, setMaxRow] = useState(0);\n\n const tableBodyRef = React.useRef<HTMLTableSectionElement>(null);\n const tableHasFocus = tableBodyRef?.current?.contains(document.activeElement);\n\n React.useEffect(() => {\n tableBodyRef &&\n tableBodyRef.current &&\n tableHasFocus &&\n tableBodyRef.current.childNodes[\n currentRow\n ].childNodes[0].parentElement?.focus();\n }, [currentRow, tableHasFocus]);\n\n function getTableBodyNavigationProps(...rest: any): Partial<TableBodyProps> {\n return {\n ref: tableBodyRef,\n ...rest,\n };\n }\n\n const tableRowRef = React.useRef<HTMLTableRowElement>(null);\n function getTableRowNavigationProps(\n row: number,\n ...rest: any\n ): Partial<TableRowProps> {\n if (row >= maxRow) {\n setMaxRow(row + 1);\n }\n const tabIndex = currentRow ? 0 : -1;\n return {\n tabIndex,\n ref: tableRowRef,\n onClick: () => setCurrentRow(row),\n onKeyDown: (e: React.KeyboardEvent) => {\n const newCell = onTableKeypress(e, currentRow, numberOfRows, allowWrap);\n setCurrentRow(newCell);\n },\n ...rest,\n };\n }\n return { getTableRowNavigationProps, getTableBodyNavigationProps };\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('table');\n\nexport * from './Table';\nexport * from './TableHead';\nexport * from './TableBody';\nexport * from './TableFooter';\nexport * from './TableRow';\nexport * from './DataCell';\nexport * from './HeaderCell';\nexport * from './useSortableTable';\nexport * from './EditableCell';\nexport * from './ExpandableRow';\nexport * from './ExpandRowButton';\nexport * from './useTableKeyboardNavigation';\n","import classNames from 'classnames';\nimport React from 'react';\nimport { DataCell } from './DataCell';\nimport { VariantProvider, VariantType } from '@entur/form';\nimport { Tooltip } from '@entur/tooltip';\nimport './EditableCell.scss';\n\ntype EditableCellProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Inputelementet som skal være i tabellcellen */\n children: React.ReactElement;\n /** Valideringsvariant for EditableCell */\n variant?: VariantType;\n /** Varselmelding, som vil komme som en Tooltip under EditableCell */\n feedback?: string;\n /** Om cellen skal vise omriss til enhver tid\n * @default false\n */\n outlined?: boolean;\n [key: string]: any;\n};\n\nexport const EditableCell: React.FC<EditableCellProps> = ({\n children,\n className,\n feedback,\n variant,\n outlined = false,\n ...rest\n}) => {\n return (\n <VariantProvider variant={variant}>\n <DataCell\n className={classNames(\n 'eds-editable-cell',\n {\n 'eds-editable-cell--outlined': outlined,\n },\n className,\n )}\n {...rest}\n >\n <Tooltip\n disableHoverListener={!feedback}\n disableFocusListener={!feedback}\n placement=\"bottom\"\n content={feedback || undefined}\n variant={feedback ? 'error' : undefined}\n >\n {children}\n </Tooltip>\n </DataCell>\n </VariantProvider>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './ExpandRowButton.scss';\n\nexport type ExpandRowButtonProps = {\n open: boolean;\n onClick: (e: React.MouseEvent) => void;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const ExpandRowButton: React.FC<ExpandRowButtonProps> = ({\n open,\n onClick,\n ...rest\n}) => {\n return (\n <IconButton\n className={classNames('eds-expand-row-button', {\n 'eds-expand-row-button--open': open,\n })}\n onClick={onClick}\n aria-label={open ? 'Lukk tabellrad' : 'Utvid tabellrad'}\n {...rest}\n >\n <DownArrowIcon className=\"eds-expand-row-button__icon\" />\n </IconButton>\n );\n};\n","import React from 'react';\nimport { BaseExpand } from '@entur/expand';\n\nexport type ExpandableRowProps = {\n /** Antall kolonner tabellraden er */\n colSpan: number;\n /** Innholdet til ExpandableRow */\n children: React.ReactNode;\n /** Om ExpandableRow er åpen\n * @default false\n */\n open?: boolean;\n};\n\nexport const ExpandableRow: React.FC<ExpandableRowProps> = ({\n open = false,\n children,\n colSpan,\n}) => {\n return (\n <tr>\n <td colSpan={colSpan}>\n <BaseExpand open={open}>{children}</BaseExpand>\n </td>\n </tr>\n );\n};\n","import React from 'react';\nimport get from 'lodash.get';\n\nexport type ExternalSortConfig = {\n /**\n * @default \"\"\n */\n key: string;\n /** @default \"none\" */\n order: 'ascending' | 'descending' | 'none';\n};\n\nexport function useSortableData<T>(\n rawData: T[],\n externalSortConfig: ExternalSortConfig = { key: '', order: 'none' },\n): {\n sortedData: T[];\n getSortableHeaderProps: (\n args: SortableHeaderProps,\n ) => SortableHeaderReturnProps;\n getSortableTableProps: (args: SortableTableProps) => SortableTableReturnProps;\n} {\n const [sortConfig, setSortConfig] = React.useState(externalSortConfig);\n const tableCopy = rawData.slice();\n\n React.useEffect(() => {\n setSortConfig({\n key: externalSortConfig.key,\n order: externalSortConfig.order,\n });\n }, [externalSortConfig.key, externalSortConfig.order]);\n\n const sortedData: T[] = React.useMemo(() => {\n if (sortConfig.order === 'none') {\n return tableCopy;\n }\n return [...rawData].sort((a: any, b: any) => {\n if (get(a, sortConfig.key) < get(b, sortConfig.key)) {\n return sortConfig.order === 'ascending' ? -1 : 1;\n } else if (get(a, sortConfig.key) > get(b, sortConfig.key)) {\n return sortConfig.order === 'ascending' ? 1 : -1;\n } else {\n return 0;\n }\n });\n }, [rawData, tableCopy, sortConfig]);\n\n const onSortRequested = (key: string) => {\n let order: 'ascending' | 'descending' | 'none' = 'ascending';\n if (sortConfig.key === key && sortConfig.order === 'ascending') {\n order = 'descending';\n } else if (sortConfig.key === key && sortConfig.order === 'descending') {\n order = 'none';\n }\n\n setSortConfig({ key, order });\n };\n\n function getSortableHeaderProps({\n name,\n sortable = true,\n buttonProps,\n ...props\n }: SortableHeaderProps): SortableHeaderReturnProps {\n return {\n name,\n sortable,\n sortConfig: sortConfig,\n sortableButtonProps: {\n onClick: () => onSortRequested(name),\n ...buttonProps,\n },\n ...props,\n };\n }\n\n function getSortableTableProps({\n sortable = true,\n ...props\n }: SortableTableProps): SortableTableReturnProps {\n return {\n sortable,\n sortConfig: sortConfig,\n ...props,\n };\n }\n\n return { sortedData, getSortableHeaderProps, getSortableTableProps };\n}\n\nexport type SortableHeaderProps = {\n /** Navnet headeren skal se etter i forhold til sortering av items */\n name: string;\n /** Om headeren skal være sorterbar eller ikke\n * @default true */\n sortable?: boolean;\n /** Props som sendes til knapp-elementet */\n buttonProps?: Omit<\n React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >,\n 'type' | 'onClick'\n >;\n [key: string]: any;\n};\n\nexport type SortableHeaderReturnProps = {\n name: string;\n sortable: boolean;\n sortConfig: ExternalSortConfig;\n [key: string]: any;\n};\n\nexport type SortableTableProps = {\n /** @default true */\n sortable?: boolean;\n [key: string]: any;\n};\n\nexport type SortableTableReturnProps = {\n /** @default true */\n sortable?: boolean;\n sortConfig: ExternalSortConfig;\n [key: string]: any;\n};\n"],"names":["Table","React","forwardRef","ref","className","fixed","spacing","sortable","rest","classNames","TableHead","props","TableBody","TableFooter","TableRow","hover","active","error","DataCell","padding","status","undefined","HeaderCell","children","name","sortConfig","sortableButtonProps","useState","isCurrentlySorted","setIsCurrentlySorted","useEffect","key","ariaSort","order","SortableHeaderCellButton","type","UnsortedIcon","size","UpArrowIcon","DownArrowIcon","onTableKeypress","event","currentRow","maxRow","allowWrap","preventDefault","warnAboutMissingStyles","feedback","variant","outlined","VariantProvider","Tooltip","disableHoverListener","disableFocusListener","placement","content","open","onClick","IconButton","colSpan","BaseExpand","rawData","externalSortConfig","setSortConfig","tableCopy","slice","sortedData","useMemo","sort","a","b","get","getSortableHeaderProps","buttonProps","getSortableTableProps","numberOfRows","setCurrentRow","setMaxRow","tableBodyRef","useRef","tableHasFocus","current","_tableBodyRef$current","contains","document","activeElement","childNodes","parentElement","_tableBodyRef$current2","focus","tableRowRef","getTableRowNavigationProps","row","tabIndex","onKeyDown","e","newCell","getTableBodyNavigationProps"],"mappings":"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"}
1
+ {"version":3,"file":"table.cjs.production.min.js","sources":["../src/Table.tsx","../src/TableHead.tsx","../src/TableBody.tsx","../src/TableFooter.tsx","../src/TableRow.tsx","../src/DataCell.tsx","../src/HeaderCell.tsx","../src/useTableKeyboardNavigation.tsx","../src/index.tsx","../src/EditableCell.tsx","../src/ExpandRowButton.tsx","../src/ExpandableRow.tsx","../src/useSortableTable.ts"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Setter tettheten mellom rader og kolonner. Bruk gjerne middle og small for for sider med høy informasjonstetthet\n * @default \"default\"\n */\n spacing?: 'default' | 'middle' | 'small';\n /** Setter kolonne-layout til å være uavhengig av innhold\n * @default false\n */\n fixed?: boolean;\n /** Innholdet i tabellen */\n children: React.ReactNode;\n [key: string]: any;\n};\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n fixed = false,\n spacing = 'default',\n sortable = false,\n ...rest\n },\n ref,\n ) => {\n return (\n <table\n className={classNames(\n 'eds-table',\n { 'eds-table--fixed': fixed },\n { 'eds-table--middle': spacing === 'middle' },\n { 'eds-table--small': spacing === 'small' },\n { 'eds-table--sortable': sortable },\n className,\n )}\n ref={ref}\n {...rest}\n />\n );\n },\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableHeadProps = {\n /** Kolonneoverskrifter */\n children: React.ReactNode;\n /** Esktra klassenavn */\n className?: string;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableHead = React.forwardRef<\n HTMLTableSectionElement,\n TableHeadProps\n>(({ className, ...props }, ref) => (\n <thead\n className={classNames('eds-table__head', className)}\n ref={ref}\n {...props}\n />\n));\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableBodyProps = {\n /** Tabellrader */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n ref?: React.Ref<HTMLTableSectionElement>;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableBody = React.forwardRef<\n HTMLTableSectionElement,\n TableBodyProps\n>(({ className, ...rest }, ref) => (\n <tbody\n className={classNames('eds-table__body', className)}\n ref={ref}\n {...rest}\n />\n));\n","import React from 'react';\n\nexport type TableFooterProps = {\n /** Tabellrader */\n children: React.ReactNode;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableSectionElement>,\n HTMLTableSectionElement\n>;\n\nexport const TableFooter = React.forwardRef<\n HTMLTableSectionElement,\n TableFooterProps\n>(({ ...props }, ref) => <tfoot ref={ref} {...props} />);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type TableRowProps = {\n /** Tabellceller */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /**Hvis satt, så vil tabellraden endre fargen ved hover\n * @default false\n */\n hover?: boolean;\n /** Om raden er klikkbar, så vil raden endre farge, og musepekeren vil symbolisere interaktivitet\n * @default false\n */\n active?: boolean;\n /**Signalisere om at det er en feil i tabellraden\n * @default false\n */\n error?: boolean;\n ref?: React.Ref<HTMLTableRowElement>;\n} & React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLTableRowElement>,\n HTMLTableRowElement\n>;\n\nexport const TableRow = React.forwardRef<HTMLTableRowElement, TableRowProps>(\n (\n { className, hover = false, active = false, error = false, ...rest },\n ref: React.Ref<HTMLTableRowElement>,\n ) => (\n <tr\n className={classNames('eds-table__row', className, {\n 'eds-table__row--hover': hover,\n 'eds-table__row--active': active,\n 'eds-table__row--error': error,\n })}\n ref={ref}\n {...rest}\n />\n ),\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nexport type DataCellProps = {\n /** Innholdet i tabellcellen */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse som settes for DataCell for ulikt innhold av komponenter */\n padding?: 'default' | 'checkbox' | 'radio' | 'overflow-menu';\n /** Viser en status-sirkel for DataCell */\n status?: 'positive' | 'negative' | 'neutral';\n} & React.DetailedHTMLProps<\n React.TdHTMLAttributes<HTMLTableDataCellElement>,\n HTMLTableDataCellElement\n>;\n\nexport const DataCell = React.forwardRef<\n HTMLTableDataCellElement,\n DataCellProps\n>(\n (\n { className, padding = 'default', status = undefined, ...rest },\n ref: React.Ref<HTMLTableDataCellElement>,\n ) => (\n <td\n ref={ref}\n className={classNames('eds-table__data-cell', className, {\n [`eds-table__data-cell--status-${status}`]: status,\n 'eds-table__data-cell--padding-checkbox': padding === 'checkbox',\n 'eds-table__data-cell--padding-radio': padding === 'radio',\n 'eds-table__data-cell--padding-overflow-menu':\n padding === 'overflow-menu',\n })}\n {...rest}\n />\n ),\n);\n","import React from 'react';\nimport classNames from 'classnames';\n\nimport { DownArrowIcon, UpArrowIcon, UnsortedIcon } from '@entur/icons';\n\nimport { ExternalSortConfig } from '.';\n\nimport './HeaderCell.scss';\n\nexport type HeaderCellProps = {\n /** Kolonneoverskrift */\n children: React.ReactNode;\n /** Ekstra klassenavn */\n className?: string;\n /** Størrelse som settes for HeaderCell for ulikt innhold av komponenter */\n padding?: 'default' | 'checkbox' | 'radio' | 'overflow-menu';\n\n /** Ekstra props som kan sendes til sorteringsknappelementet. Benyttes via useSortableTable */\n sortableButtonProps?: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >;\n\n /** Om komponenten brukes til sortering. Benytt via useSortableTable\n * @default false\n */\n sortable?: boolean;\n /** Konfigurering og rekkefølgen på sortering. Benyttes via useSortableTable */\n sortConfig?: ExternalSortConfig;\n /** Navnet det skal sorteres på. Benyttes via useSortableTable */\n name?: string;\n} & React.DetailedHTMLProps<\n React.ThHTMLAttributes<HTMLTableCellElement>,\n HTMLTableCellElement\n>;\n\nexport const HeaderCell = React.forwardRef<\n HTMLTableCellElement,\n HeaderCellProps\n>(\n (\n {\n className,\n children,\n name,\n sortable = false,\n sortConfig,\n padding = 'default',\n sortableButtonProps,\n ...rest\n },\n ref,\n ) => {\n const [isCurrentlySorted, setIsCurrentlySorted] =\n React.useState<boolean>(false);\n React.useEffect(() => {\n sortConfig &&\n name &&\n setIsCurrentlySorted(sortConfig && name === sortConfig.key);\n }, [sortConfig, name]);\n const ariaSort = isCurrentlySorted\n ? sortConfig && sortConfig.order\n : 'none';\n\n return (\n <th\n className={classNames('eds-table__header-cell', className, {\n 'eds-table__header-cell--sortable': sortable,\n 'eds-table__header-cell--padding-radio': padding === 'radio',\n 'eds-table__header-cell--padding-checkbox': padding === 'checkbox',\n 'eds-table__header-cell--padding-overflow-menu':\n padding === 'overflow-menu',\n })}\n aria-sort={ariaSort}\n ref={ref}\n {...rest}\n >\n {sortable && sortConfig && sortableButtonProps ? (\n <SortableHeaderCellButton\n sortableButtonProps={sortableButtonProps}\n sortConfig={sortConfig}\n isCurrentlySorted={isCurrentlySorted}\n >\n {children}\n </SortableHeaderCellButton>\n ) : (\n children\n )}\n </th>\n );\n },\n);\n\ntype SortableHeaderCellButtonProps = {\n sortConfig: ExternalSortConfig;\n isCurrentlySorted: boolean;\n sortableButtonProps: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >;\n};\n\nconst SortableHeaderCellButton: React.FC<SortableHeaderCellButtonProps> = ({\n sortConfig,\n sortableButtonProps,\n isCurrentlySorted,\n children,\n}) => {\n const { className, ...rest } = sortableButtonProps;\n return (\n <button\n className={classNames('eds-table__header-cell-button', className)}\n type=\"button\"\n {...rest}\n >\n {children}\n {(!isCurrentlySorted || sortConfig.order === 'none') && (\n <UnsortedIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"usortert kolonne\"\n />\n )}\n {isCurrentlySorted && sortConfig.order === 'ascending' && (\n <UpArrowIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"stigende sortert kolonne\"\n />\n )}\n {isCurrentlySorted && sortConfig.order === 'descending' && (\n <DownArrowIcon\n size=\"16px\"\n className=\"eds-table__header-cell-button-icon\"\n aria-label=\"synkende sortert kolonne\"\n />\n )}\n </button>\n );\n};\n","import React, { useState } from 'react';\nimport { TableBodyProps, TableRowProps } from './index';\n\nfunction onTableKeypress(\n event: React.KeyboardEvent,\n currentRow: number,\n maxRow: number,\n allowWrap?: boolean,\n) {\n const keyPress = event.key;\n switch (keyPress) {\n case 'ArrowUp':\n event.preventDefault();\n if (allowWrap) {\n return currentRow === 0 ? maxRow - 1 : currentRow - 1;\n } else {\n return currentRow > 0 ? currentRow - 1 : 0;\n }\n case 'ArrowDown':\n event.preventDefault();\n if (allowWrap) {\n return currentRow === maxRow - 1 ? 0 : currentRow + 1;\n } else {\n return currentRow < maxRow - 1 ? currentRow + 1 : currentRow;\n }\n default:\n return currentRow;\n }\n}\n\nexport type useTableKeyboardNavigationProps = (\n /** Antall rader i tabellen */\n numberOfRows: number,\n /** Tillate at man kan navigere sirkulært\n * @default false\n */\n allowWrap?: boolean,\n) => {\n getTableRowNavigationProps: (\n /** Raden i tabellen (0-indeksert) */\n row: number,\n ) => Partial<TableRowProps>;\n getTableBodyNavigationProps: () => Partial<TableBodyProps>;\n};\n\nexport const useTableKeyboardNavigation: useTableKeyboardNavigationProps = (\n numberOfRows = 0,\n allowWrap = true,\n) => {\n const [currentRow, setCurrentRow] = useState(numberOfRows);\n const [maxRow, setMaxRow] = useState(0);\n\n const tableBodyRef = React.useRef<HTMLTableSectionElement>(null);\n const tableHasFocus = tableBodyRef?.current?.contains(document.activeElement);\n\n React.useEffect(() => {\n tableBodyRef &&\n tableBodyRef.current &&\n tableHasFocus &&\n tableBodyRef.current.childNodes[\n currentRow\n ].childNodes[0].parentElement?.focus();\n }, [currentRow, tableHasFocus]);\n\n function getTableBodyNavigationProps(...rest: any): Partial<TableBodyProps> {\n return {\n ref: tableBodyRef,\n ...rest,\n };\n }\n\n const tableRowRef = React.useRef<HTMLTableRowElement>(null);\n function getTableRowNavigationProps(\n row: number,\n ...rest: any\n ): Partial<TableRowProps> {\n if (row >= maxRow) {\n setMaxRow(row + 1);\n }\n const tabIndex = currentRow ? 0 : -1;\n return {\n tabIndex,\n ref: tableRowRef,\n onClick: () => setCurrentRow(row),\n onKeyDown: (e: React.KeyboardEvent) => {\n const newCell = onTableKeypress(e, currentRow, numberOfRows, allowWrap);\n setCurrentRow(newCell);\n },\n ...rest,\n };\n }\n return { getTableRowNavigationProps, getTableBodyNavigationProps };\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('table');\n\nexport * from './Table';\nexport * from './TableHead';\nexport * from './TableBody';\nexport * from './TableFooter';\nexport * from './TableRow';\nexport * from './DataCell';\nexport * from './HeaderCell';\nexport * from './useSortableTable';\nexport * from './EditableCell';\nexport * from './ExpandableRow';\nexport * from './ExpandRowButton';\nexport * from './useTableKeyboardNavigation';\n","import classNames from 'classnames';\nimport React from 'react';\nimport { DataCell } from './DataCell';\nimport { VariantProvider, VariantType } from '@entur/form';\nimport { Tooltip } from '@entur/tooltip';\nimport './EditableCell.scss';\n\ntype EditableCellProps = {\n /** Ekstra klassenavn */\n className?: string;\n /** Inputelementet som skal være i tabellcellen */\n children: React.ReactElement;\n /** Valideringsvariant for EditableCell */\n variant?: VariantType;\n /** Varselmelding, som vil komme som en Tooltip under EditableCell */\n feedback?: string;\n /** Om cellen skal vise omriss til enhver tid\n * @default false\n */\n outlined?: boolean;\n [key: string]: any;\n};\n\nexport const EditableCell: React.FC<EditableCellProps> = ({\n children,\n className,\n feedback,\n variant,\n outlined = false,\n ...rest\n}) => {\n return (\n <VariantProvider variant={variant}>\n <DataCell\n className={classNames(\n 'eds-editable-cell',\n {\n 'eds-editable-cell--outlined': outlined,\n },\n className,\n )}\n {...rest}\n >\n <Tooltip\n disableHoverListener={!feedback}\n disableFocusListener={!feedback}\n placement=\"bottom\"\n content={feedback || undefined}\n variant={feedback ? 'error' : undefined}\n >\n {children}\n </Tooltip>\n </DataCell>\n </VariantProvider>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport './ExpandRowButton.scss';\n\nexport type ExpandRowButtonProps = {\n open: boolean;\n onClick: (e: React.MouseEvent) => void;\n} & React.ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const ExpandRowButton: React.FC<ExpandRowButtonProps> = ({\n open,\n onClick,\n ...rest\n}) => {\n return (\n <IconButton\n className={classNames('eds-expand-row-button', {\n 'eds-expand-row-button--open': open,\n })}\n onClick={onClick}\n aria-label={open ? 'Lukk tabellrad' : 'Utvid tabellrad'}\n {...rest}\n >\n <DownArrowIcon className=\"eds-expand-row-button__icon\" />\n </IconButton>\n );\n};\n","import React from 'react';\nimport { BaseExpand } from '@entur/expand';\n\nexport type ExpandableRowProps = {\n /** Antall kolonner tabellraden er */\n colSpan: number;\n /** Innholdet til ExpandableRow */\n children: React.ReactNode;\n /** Om ExpandableRow er åpen\n * @default false\n */\n open?: boolean;\n};\n\nexport const ExpandableRow: React.FC<ExpandableRowProps> = ({\n open = false,\n children,\n colSpan,\n}) => {\n return (\n <tr>\n <td colSpan={colSpan}>\n <BaseExpand open={open}>{children}</BaseExpand>\n </td>\n </tr>\n );\n};\n","import React from 'react';\nimport get from 'lodash.get';\n\nexport type ExternalSortConfig = {\n /**\n * @default \"\"\n */\n key: string;\n /** @default \"none\" */\n order: 'ascending' | 'descending' | 'none';\n};\n\nexport function useSortableData<T>(\n rawData: T[],\n externalSortConfig: ExternalSortConfig = { key: '', order: 'none' },\n): {\n sortedData: T[];\n getSortableHeaderProps: (\n args: SortableHeaderProps,\n ) => SortableHeaderReturnProps;\n getSortableTableProps: (args: SortableTableProps) => SortableTableReturnProps;\n} {\n const [sortConfig, setSortConfig] = React.useState(externalSortConfig);\n const tableCopy = rawData.slice();\n\n React.useEffect(() => {\n setSortConfig({\n key: externalSortConfig.key,\n order: externalSortConfig.order,\n });\n }, [externalSortConfig.key, externalSortConfig.order]);\n\n const sortedData: T[] = React.useMemo(() => {\n if (sortConfig.order === 'none') {\n return tableCopy;\n }\n return [...rawData].sort((a: any, b: any) => {\n if (get(a, sortConfig.key) < get(b, sortConfig.key)) {\n return sortConfig.order === 'ascending' ? -1 : 1;\n } else if (get(a, sortConfig.key) > get(b, sortConfig.key)) {\n return sortConfig.order === 'ascending' ? 1 : -1;\n } else {\n return 0;\n }\n });\n }, [rawData, tableCopy, sortConfig]);\n\n const onSortRequested = (key: string) => {\n let order: 'ascending' | 'descending' | 'none' = 'ascending';\n if (sortConfig.key === key && sortConfig.order === 'ascending') {\n order = 'descending';\n } else if (sortConfig.key === key && sortConfig.order === 'descending') {\n order = 'none';\n }\n\n setSortConfig({ key, order });\n };\n\n function getSortableHeaderProps({\n name,\n sortable = true,\n buttonProps,\n ...props\n }: SortableHeaderProps): SortableHeaderReturnProps {\n return {\n name,\n sortable,\n sortConfig: sortConfig,\n sortableButtonProps: {\n onClick: () => onSortRequested(name),\n ...buttonProps,\n },\n ...props,\n };\n }\n\n function getSortableTableProps({\n sortable = true,\n ...props\n }: SortableTableProps): SortableTableReturnProps {\n return {\n sortable,\n sortConfig: sortConfig,\n ...props,\n };\n }\n\n return { sortedData, getSortableHeaderProps, getSortableTableProps };\n}\n\nexport type SortableHeaderProps = {\n /** Navnet headeren skal se etter i forhold til sortering av items */\n name: string;\n /** Om headeren skal være sorterbar eller ikke\n * @default true */\n sortable?: boolean;\n /** Props som sendes til knapp-elementet */\n buttonProps?: Omit<\n React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >,\n 'type' | 'onClick'\n >;\n [key: string]: any;\n};\n\nexport type SortableHeaderReturnProps = {\n name: string;\n sortable: boolean;\n sortConfig: ExternalSortConfig;\n [key: string]: any;\n};\n\nexport type SortableTableProps = {\n /** @default true */\n sortable?: boolean;\n [key: string]: any;\n};\n\nexport type SortableTableReturnProps = {\n /** @default true */\n sortable?: boolean;\n sortConfig: ExternalSortConfig;\n [key: string]: any;\n};\n"],"names":["Table","React","forwardRef","ref","className","_ref$fixed","fixed","_ref$spacing","spacing","_ref$sortable","sortable","rest","classNames","TableHead","props","TableBody","TableFooter","TableRow","_ref$hover","hover","_ref$active","active","_ref$error","error","DataCell","_ref$padding","padding","_ref$status","status","undefined","HeaderCell","children","name","sortConfig","sortableButtonProps","useState","isCurrentlySorted","setIsCurrentlySorted","useEffect","key","ariaSort","order","SortableHeaderCellButton","type","UnsortedIcon","size","UpArrowIcon","DownArrowIcon","onTableKeypress","event","currentRow","maxRow","allowWrap","preventDefault","warnAboutMissingStyles","feedback","variant","_ref$outlined","outlined","VariantProvider","Tooltip","disableHoverListener","disableFocusListener","placement","content","open","onClick","IconButton","colSpan","BaseExpand","rawData","externalSortConfig","setSortConfig","tableCopy","slice","sortedData","useMemo","sort","a","b","get","getSortableHeaderProps","buttonProps","getSortableTableProps","numberOfRows","setCurrentRow","setMaxRow","tableBodyRef","useRef","tableHasFocus","current","_tableBodyRef$current","contains","document","activeElement","childNodes","parentElement","_tableBodyRef$current2","focus","tableRowRef","getTableRowNavigationProps","row","tabIndex","onKeyDown","e","newCell","getTableBodyNavigationProps"],"mappings":"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"}
package/dist/table.esm.js CHANGED
@@ -12,46 +12,42 @@ function _extends() {
12
12
  _extends = Object.assign || function (target) {
13
13
  for (var i = 1; i < arguments.length; i++) {
14
14
  var source = arguments[i];
15
-
16
15
  for (var key in source) {
17
16
  if (Object.prototype.hasOwnProperty.call(source, key)) {
18
17
  target[key] = source[key];
19
18
  }
20
19
  }
21
20
  }
22
-
23
21
  return target;
24
22
  };
25
-
26
23
  return _extends.apply(this, arguments);
27
24
  }
28
-
25
+ function _objectDestructuringEmpty(obj) {
26
+ if (obj == null) throw new TypeError("Cannot destructure undefined");
27
+ }
29
28
  function _objectWithoutPropertiesLoose(source, excluded) {
30
29
  if (source == null) return {};
31
30
  var target = {};
32
31
  var sourceKeys = Object.keys(source);
33
32
  var key, i;
34
-
35
33
  for (i = 0; i < sourceKeys.length; i++) {
36
34
  key = sourceKeys[i];
37
35
  if (excluded.indexOf(key) >= 0) continue;
38
36
  target[key] = source[key];
39
37
  }
40
-
41
38
  return target;
42
39
  }
43
40
 
44
41
  var _excluded$8 = ["className", "fixed", "spacing", "sortable"];
45
42
  var Table = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
46
43
  var className = _ref.className,
47
- _ref$fixed = _ref.fixed,
48
- fixed = _ref$fixed === void 0 ? false : _ref$fixed,
49
- _ref$spacing = _ref.spacing,
50
- spacing = _ref$spacing === void 0 ? 'default' : _ref$spacing,
51
- _ref$sortable = _ref.sortable,
52
- sortable = _ref$sortable === void 0 ? false : _ref$sortable,
53
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
54
-
44
+ _ref$fixed = _ref.fixed,
45
+ fixed = _ref$fixed === void 0 ? false : _ref$fixed,
46
+ _ref$spacing = _ref.spacing,
47
+ spacing = _ref$spacing === void 0 ? 'default' : _ref$spacing,
48
+ _ref$sortable = _ref.sortable,
49
+ sortable = _ref$sortable === void 0 ? false : _ref$sortable,
50
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
55
51
  return React.createElement("table", _extends({
56
52
  className: classNames('eds-table', {
57
53
  'eds-table--fixed': fixed
@@ -69,8 +65,7 @@ var Table = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
69
65
  var _excluded$7 = ["className"];
70
66
  var TableHead = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
71
67
  var className = _ref.className,
72
- props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
73
-
68
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
74
69
  return React.createElement("thead", _extends({
75
70
  className: classNames('eds-table__head', className),
76
71
  ref: ref
@@ -80,8 +75,7 @@ var TableHead = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
80
75
  var _excluded$6 = ["className"];
81
76
  var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
82
77
  var className = _ref.className,
83
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
84
-
78
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
85
79
  return React.createElement("tbody", _extends({
86
80
  className: classNames('eds-table__body', className),
87
81
  ref: ref
@@ -89,8 +83,7 @@ var TableBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
89
83
  });
90
84
 
91
85
  var TableFooter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
92
- var props = _extends({}, _ref);
93
-
86
+ var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
94
87
  return React.createElement("tfoot", _extends({
95
88
  ref: ref
96
89
  }, props));
@@ -99,14 +92,13 @@ var TableFooter = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
99
92
  var _excluded$5 = ["className", "hover", "active", "error"];
100
93
  var TableRow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
101
94
  var className = _ref.className,
102
- _ref$hover = _ref.hover,
103
- hover = _ref$hover === void 0 ? false : _ref$hover,
104
- _ref$active = _ref.active,
105
- active = _ref$active === void 0 ? false : _ref$active,
106
- _ref$error = _ref.error,
107
- error = _ref$error === void 0 ? false : _ref$error,
108
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
109
-
95
+ _ref$hover = _ref.hover,
96
+ hover = _ref$hover === void 0 ? false : _ref$hover,
97
+ _ref$active = _ref.active,
98
+ active = _ref$active === void 0 ? false : _ref$active,
99
+ _ref$error = _ref.error,
100
+ error = _ref$error === void 0 ? false : _ref$error,
101
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
110
102
  return React.createElement("tr", _extends({
111
103
  className: classNames('eds-table__row', className, {
112
104
  'eds-table__row--hover': hover,
@@ -120,14 +112,12 @@ var TableRow = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
120
112
  var _excluded$4 = ["className", "padding", "status"];
121
113
  var DataCell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
122
114
  var _classNames;
123
-
124
115
  var className = _ref.className,
125
- _ref$padding = _ref.padding,
126
- padding = _ref$padding === void 0 ? 'default' : _ref$padding,
127
- _ref$status = _ref.status,
128
- status = _ref$status === void 0 ? undefined : _ref$status,
129
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
130
-
116
+ _ref$padding = _ref.padding,
117
+ padding = _ref$padding === void 0 ? 'default' : _ref$padding,
118
+ _ref$status = _ref.status,
119
+ status = _ref$status === void 0 ? undefined : _ref$status,
120
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
131
121
  return React.createElement("td", _extends({
132
122
  ref: ref,
133
123
  className: classNames('eds-table__data-cell', className, (_classNames = {}, _classNames["eds-table__data-cell--status-" + status] = status, _classNames['eds-table__data-cell--padding-checkbox'] = padding === 'checkbox', _classNames['eds-table__data-cell--padding-radio'] = padding === 'radio', _classNames['eds-table__data-cell--padding-overflow-menu'] = padding === 'overflow-menu', _classNames))
@@ -135,23 +125,21 @@ var DataCell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
135
125
  });
136
126
 
137
127
  var _excluded$3 = ["className", "children", "name", "sortable", "sortConfig", "padding", "sortableButtonProps"],
138
- _excluded2$1 = ["className"];
128
+ _excluded2$1 = ["className"];
139
129
  var HeaderCell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
140
130
  var className = _ref.className,
141
- children = _ref.children,
142
- name = _ref.name,
143
- _ref$sortable = _ref.sortable,
144
- sortable = _ref$sortable === void 0 ? false : _ref$sortable,
145
- sortConfig = _ref.sortConfig,
146
- _ref$padding = _ref.padding,
147
- padding = _ref$padding === void 0 ? 'default' : _ref$padding,
148
- sortableButtonProps = _ref.sortableButtonProps,
149
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
150
-
131
+ children = _ref.children,
132
+ name = _ref.name,
133
+ _ref$sortable = _ref.sortable,
134
+ sortable = _ref$sortable === void 0 ? false : _ref$sortable,
135
+ sortConfig = _ref.sortConfig,
136
+ _ref$padding = _ref.padding,
137
+ padding = _ref$padding === void 0 ? 'default' : _ref$padding,
138
+ sortableButtonProps = _ref.sortableButtonProps,
139
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
151
140
  var _React$useState = React.useState(false),
152
- isCurrentlySorted = _React$useState[0],
153
- setIsCurrentlySorted = _React$useState[1];
154
-
141
+ isCurrentlySorted = _React$useState[0],
142
+ setIsCurrentlySorted = _React$useState[1];
155
143
  React.useEffect(function () {
156
144
  sortConfig && name && setIsCurrentlySorted(sortConfig && name === sortConfig.key);
157
145
  }, [sortConfig, name]);
@@ -171,16 +159,13 @@ var HeaderCell = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
171
159
  isCurrentlySorted: isCurrentlySorted
172
160
  }, children) : children);
173
161
  });
174
-
175
162
  var SortableHeaderCellButton = function SortableHeaderCellButton(_ref2) {
176
163
  var sortConfig = _ref2.sortConfig,
177
- sortableButtonProps = _ref2.sortableButtonProps,
178
- isCurrentlySorted = _ref2.isCurrentlySorted,
179
- children = _ref2.children;
180
-
164
+ sortableButtonProps = _ref2.sortableButtonProps,
165
+ isCurrentlySorted = _ref2.isCurrentlySorted,
166
+ children = _ref2.children;
181
167
  var className = sortableButtonProps.className,
182
- rest = _objectWithoutPropertiesLoose(sortableButtonProps, _excluded2$1);
183
-
168
+ rest = _objectWithoutPropertiesLoose(sortableButtonProps, _excluded2$1);
184
169
  return React.createElement("button", _extends({
185
170
  className: classNames('eds-table__header-cell-button', className),
186
171
  type: "button"
@@ -200,7 +185,7 @@ var SortableHeaderCellButton = function SortableHeaderCellButton(_ref2) {
200
185
  };
201
186
 
202
187
  var _excluded$2 = ["name", "sortable", "buttonProps"],
203
- _excluded2 = ["sortable"];
188
+ _excluded2 = ["sortable"];
204
189
  function useSortableData(rawData, externalSortConfig) {
205
190
  if (externalSortConfig === void 0) {
206
191
  externalSortConfig = {
@@ -208,11 +193,9 @@ function useSortableData(rawData, externalSortConfig) {
208
193
  order: 'none'
209
194
  };
210
195
  }
211
-
212
196
  var _React$useState = React.useState(externalSortConfig),
213
- sortConfig = _React$useState[0],
214
- setSortConfig = _React$useState[1];
215
-
197
+ sortConfig = _React$useState[0],
198
+ setSortConfig = _React$useState[1];
216
199
  var tableCopy = rawData.slice();
217
200
  React.useEffect(function () {
218
201
  setSortConfig({
@@ -224,7 +207,6 @@ function useSortableData(rawData, externalSortConfig) {
224
207
  if (sortConfig.order === 'none') {
225
208
  return tableCopy;
226
209
  }
227
-
228
210
  return [].concat(rawData).sort(function (a, b) {
229
211
  if (get(a, sortConfig.key) < get(b, sortConfig.key)) {
230
212
  return sortConfig.order === 'ascending' ? -1 : 1;
@@ -235,29 +217,24 @@ function useSortableData(rawData, externalSortConfig) {
235
217
  }
236
218
  });
237
219
  }, [rawData, tableCopy, sortConfig]);
238
-
239
220
  var onSortRequested = function onSortRequested(key) {
240
221
  var order = 'ascending';
241
-
242
222
  if (sortConfig.key === key && sortConfig.order === 'ascending') {
243
223
  order = 'descending';
244
224
  } else if (sortConfig.key === key && sortConfig.order === 'descending') {
245
225
  order = 'none';
246
226
  }
247
-
248
227
  setSortConfig({
249
228
  key: key,
250
229
  order: order
251
230
  });
252
231
  };
253
-
254
232
  function getSortableHeaderProps(_ref) {
255
233
  var name = _ref.name,
256
- _ref$sortable = _ref.sortable,
257
- sortable = _ref$sortable === void 0 ? true : _ref$sortable,
258
- buttonProps = _ref.buttonProps,
259
- props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
260
-
234
+ _ref$sortable = _ref.sortable,
235
+ sortable = _ref$sortable === void 0 ? true : _ref$sortable,
236
+ buttonProps = _ref.buttonProps,
237
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
261
238
  return _extends({
262
239
  name: name,
263
240
  sortable: sortable,
@@ -269,18 +246,15 @@ function useSortableData(rawData, externalSortConfig) {
269
246
  }, buttonProps)
270
247
  }, props);
271
248
  }
272
-
273
249
  function getSortableTableProps(_ref2) {
274
250
  var _ref2$sortable = _ref2.sortable,
275
- sortable = _ref2$sortable === void 0 ? true : _ref2$sortable,
276
- props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
277
-
251
+ sortable = _ref2$sortable === void 0 ? true : _ref2$sortable,
252
+ props = _objectWithoutPropertiesLoose(_ref2, _excluded2);
278
253
  return _extends({
279
254
  sortable: sortable,
280
255
  sortConfig: sortConfig
281
256
  }, props);
282
257
  }
283
-
284
258
  return {
285
259
  sortedData: sortedData,
286
260
  getSortableHeaderProps: getSortableHeaderProps,
@@ -291,13 +265,12 @@ function useSortableData(rawData, externalSortConfig) {
291
265
  var _excluded$1 = ["children", "className", "feedback", "variant", "outlined"];
292
266
  var EditableCell = function EditableCell(_ref) {
293
267
  var children = _ref.children,
294
- className = _ref.className,
295
- feedback = _ref.feedback,
296
- variant = _ref.variant,
297
- _ref$outlined = _ref.outlined,
298
- outlined = _ref$outlined === void 0 ? false : _ref$outlined,
299
- rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
300
-
268
+ className = _ref.className,
269
+ feedback = _ref.feedback,
270
+ variant = _ref.variant,
271
+ _ref$outlined = _ref.outlined,
272
+ outlined = _ref$outlined === void 0 ? false : _ref$outlined,
273
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
301
274
  return React.createElement(VariantProvider, {
302
275
  variant: variant
303
276
  }, React.createElement(DataCell, _extends({
@@ -315,9 +288,9 @@ var EditableCell = function EditableCell(_ref) {
315
288
 
316
289
  var ExpandableRow = function ExpandableRow(_ref) {
317
290
  var _ref$open = _ref.open,
318
- open = _ref$open === void 0 ? false : _ref$open,
319
- children = _ref.children,
320
- colSpan = _ref.colSpan;
291
+ open = _ref$open === void 0 ? false : _ref$open,
292
+ children = _ref.children,
293
+ colSpan = _ref.colSpan;
321
294
  return React.createElement("tr", null, React.createElement("td", {
322
295
  colSpan: colSpan
323
296
  }, React.createElement(BaseExpand, {
@@ -328,9 +301,8 @@ var ExpandableRow = function ExpandableRow(_ref) {
328
301
  var _excluded = ["open", "onClick"];
329
302
  var ExpandRowButton = function ExpandRowButton(_ref) {
330
303
  var open = _ref.open,
331
- onClick = _ref.onClick,
332
- rest = _objectWithoutPropertiesLoose(_ref, _excluded);
333
-
304
+ onClick = _ref.onClick,
305
+ rest = _objectWithoutPropertiesLoose(_ref, _excluded);
334
306
  return React.createElement(IconButton, _extends({
335
307
  className: classNames('eds-expand-row-button', {
336
308
  'eds-expand-row-button--open': open
@@ -344,81 +316,62 @@ var ExpandRowButton = function ExpandRowButton(_ref) {
344
316
 
345
317
  function onTableKeypress(event, currentRow, maxRow, allowWrap) {
346
318
  var keyPress = event.key;
347
-
348
319
  switch (keyPress) {
349
320
  case 'ArrowUp':
350
321
  event.preventDefault();
351
-
352
322
  if (allowWrap) {
353
323
  return currentRow === 0 ? maxRow - 1 : currentRow - 1;
354
324
  } else {
355
325
  return currentRow > 0 ? currentRow - 1 : 0;
356
326
  }
357
-
358
327
  case 'ArrowDown':
359
328
  event.preventDefault();
360
-
361
329
  if (allowWrap) {
362
330
  return currentRow === maxRow - 1 ? 0 : currentRow + 1;
363
331
  } else {
364
332
  return currentRow < maxRow - 1 ? currentRow + 1 : currentRow;
365
333
  }
366
-
367
334
  default:
368
335
  return currentRow;
369
336
  }
370
337
  }
371
-
372
338
  var useTableKeyboardNavigation = function useTableKeyboardNavigation(numberOfRows, allowWrap) {
373
339
  var _tableBodyRef$current;
374
-
375
340
  if (numberOfRows === void 0) {
376
341
  numberOfRows = 0;
377
342
  }
378
-
379
343
  if (allowWrap === void 0) {
380
344
  allowWrap = true;
381
345
  }
382
-
383
346
  var _useState = useState(numberOfRows),
384
- currentRow = _useState[0],
385
- setCurrentRow = _useState[1];
386
-
347
+ currentRow = _useState[0],
348
+ setCurrentRow = _useState[1];
387
349
  var _useState2 = useState(0),
388
- maxRow = _useState2[0],
389
- setMaxRow = _useState2[1];
390
-
350
+ maxRow = _useState2[0],
351
+ setMaxRow = _useState2[1];
391
352
  var tableBodyRef = React.useRef(null);
392
353
  var tableHasFocus = tableBodyRef == null ? void 0 : (_tableBodyRef$current = tableBodyRef.current) == null ? void 0 : _tableBodyRef$current.contains(document.activeElement);
393
354
  React.useEffect(function () {
394
355
  var _tableBodyRef$current2;
395
-
396
356
  tableBodyRef && tableBodyRef.current && tableHasFocus && ((_tableBodyRef$current2 = tableBodyRef.current.childNodes[currentRow].childNodes[0].parentElement) == null ? void 0 : _tableBodyRef$current2.focus());
397
357
  }, [currentRow, tableHasFocus]);
398
-
399
358
  function getTableBodyNavigationProps() {
400
359
  for (var _len = arguments.length, rest = new Array(_len), _key = 0; _key < _len; _key++) {
401
360
  rest[_key] = arguments[_key];
402
361
  }
403
-
404
362
  return _extends({
405
363
  ref: tableBodyRef
406
364
  }, rest);
407
365
  }
408
-
409
366
  var tableRowRef = React.useRef(null);
410
-
411
367
  function getTableRowNavigationProps(row) {
412
368
  if (row >= maxRow) {
413
369
  setMaxRow(row + 1);
414
370
  }
415
-
416
371
  var tabIndex = currentRow ? 0 : -1;
417
-
418
372
  for (var _len2 = arguments.length, rest = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
419
373
  rest[_key2 - 1] = arguments[_key2];
420
374
  }
421
-
422
375
  return _extends({
423
376
  tabIndex: tabIndex,
424
377
  ref: tableRowRef,
@@ -431,7 +384,6 @@ var useTableKeyboardNavigation = function useTableKeyboardNavigation(numberOfRow
431
384
  }
432
385
  }, rest);
433
386
  }
434
-
435
387
  return {
436
388
  getTableRowNavigationProps: getTableRowNavigationProps,
437
389
  getTableBodyNavigationProps: getTableBodyNavigationProps