@popsure/dirty-swan 0.54.0 → 0.54.2

package/src/lib/components/table/components/TableColumn/TableColumn.tsx

@@ -1,37 +0,0 @@
-import classNames from 'classnames';
-
-import styles from './TableColumn.module.scss';
-
-export interface TableColumnProps {
-  children?: React.ReactNode;
-  isColumn?: boolean;
-  isFixed?: boolean;
-  isHeader?: boolean;
-  cellProps?: React.HTMLProps<HTMLTableCellElement>;
-}
-
-const TableColumn = ({
-  children,
-  isColumn,
-  isFixed,
-  isHeader,
-  cellProps = {},
-}: TableColumnProps) => {
-  const Tag = isHeader ? 'th' : 'td';
-
-  return (
-    <Tag
-      scope={isColumn ? 'col' : 'row'}
-      className={classNames('bg-white py24 px8', styles.th, {
-        [styles.thCol]: isColumn,
-        [styles.fixedCell]: isFixed,
-        pl32: isFixed,
-      })}
-      {...cellProps}
-    >
-      {children}
-    </Tag>
-  );
-};
-
-export { TableColumn };

package/src/lib/components/table/components/TableContent/TableContent.module.scss

@@ -1,38 +0,0 @@
-@use '../../../../scss/public/colors' as *;
-@use '../../../../scss/public/grid' as *;
-
-.table {
-  border-collapse: collapse;
-  table-layout: fixed;
-  
-  @include p-size-tablet {
-    min-width: 845px;
-  }
-}
-
-.tr {
-  min-height: 72px;
-}
-
-.title {
-  position: relative;
-  display: none;
-
-  &:after {
-    content: '';
-    display: block;
-    position: absolute;
-    top: calc(
-      50% + 16px
-    ); // Display bottom border at the same distance regardless of cell height
-
-    height: 4px;
-    width: 100%;
-    max-width: 140px;
-    background-color: $ds-primary-500;
-  }
-
-  @include p-size-tablet {
-    display: flex;
-  }
-}

package/src/lib/components/table/components/TableContent/TableContent.test.tsx

@@ -1,56 +0,0 @@
-import { render, screen } from '../../../../util/testUtils';
-import { TableContent, TableContentProps } from './TableContent';
-
-const mockData: TableContentProps['data'] = [
-  [{ text: 'Cell 1.1' }, { text: 'Cell 1.2' }, { text: 'Cell 1.3' }],
-  [{ text: 'Cell 2.1' }, { text: 'Cell 2.2' }, { text: 'Cell 2.3' }],
-];
-
-const mockTitle = 'Test Table';
-
-const mockOpenModal = jest.fn();
-
-const defaultProps: TableContentProps = {
-  data: mockData,
-  title: mockTitle,
-  openModal: mockOpenModal,
-};
-
-describe('TableContent', () => {
-  it('renders the table caption', () => {
-    render(<TableContent {...defaultProps} />);
-
-    expect(screen.getByText(mockTitle)).toBeInTheDocument();
-  });
-
-  it('renders the table with correct data', () => {
-    render(<TableContent {...defaultProps} />);
-
-    expect(screen.getByText('Cell 1.1')).toBeInTheDocument();
-    expect(screen.getByText('Cell 1.2')).toBeInTheDocument();
-    expect(screen.getByText('Cell 1.3')).toBeInTheDocument();
-
-    expect(screen.getByText('Cell 2.1')).toBeInTheDocument();
-    expect(screen.getByText('Cell 2.2')).toBeInTheDocument();
-    expect(screen.getByText('Cell 2.3')).toBeInTheDocument();
-  });
-
-  it('should render table headers', () => {
-    const { container } = render(<TableContent {...defaultProps} />);
-
-    const thElements = container.querySelectorAll('th');
-
-    expect(thElements.length).toBe(4);
-    expect(thElements[0]).toHaveTextContent('Cell 1.1');
-    expect(thElements[3]).toHaveTextContent('Cell 2.1');
-  });
-
-  it('should render table data cells', () => {
-    const { container } = render(<TableContent {...defaultProps} />);
-
-    const tdElements = container.querySelectorAll('td');
-    expect(tdElements.length).toBe(2);
-    expect(tdElements[0]).toHaveTextContent('Cell 2.2');
-    expect(tdElements[1]).toHaveTextContent('Cell 2.3');
-  });
-});

package/src/lib/components/table/components/TableContent/TableContent.tsx

@@ -1,127 +0,0 @@
-import classNames from 'classnames';
-
-import styles from './TableContent.module.scss';
-import { TableCell, TableCellProps } from '../TableCell/TableCell';
-import { ReactNode, useCallback } from 'react';
-import { TableColumn } from '../TableColumn/TableColumn';
-
-export interface TableContentProps {
-  className?: string;
-  data: TableCellProps[][];
-  hideHeader?: boolean;
-  openModal?: (title: ReactNode, body: ReactNode) => void;
-  title: string;
-  width?: number | string;
-}
-
-const TableContent = ({
-  className,
-  data,
-  hideHeader,
-  openModal,
-  title,
-  width,
-}: TableContentProps) => {
-  const headerRow = data?.[0];
-
-  const getColumnTextByKey = useCallback(
-    (key: number) => data?.[0]?.[key]?.text || '',
-    [data]
-  );
-
-  const handleOpenModal = (
-    cellIndex: number,
-    modalBody: ReactNode,
-    title?: ReactNode
-  ) => openModal?.(title || getColumnTextByKey(cellIndex), modalBody);
-
-  return (
-    <table
-      className={classNames(className, 'w100', styles.table)}
-      width={width}
-    >
-      <caption className="sr-only">{title}</caption>
-
-      {headerRow && (
-        <thead className={hideHeader ? 'sr-only' : ''}>
-          <tr>
-            {headerRow.map(({ cellProps, ...cell }, cellIndex) => {
-              const isFirstColumn = cellIndex === 0;
-
-              return (
-                <TableColumn
-                  key={cellIndex}
-                  cellProps={cellProps}
-                  isColumn
-                  isFixed={isFirstColumn}
-                  isHeader
-                >
-                  {isFirstColumn ? (
-                    <div
-                      aria-hidden
-                      className={classNames(
-                        'tc-grey-800 p-h2 p--serif',
-                        styles.title
-                      )}
-                    >
-                      {cell?.text}
-                    </div>
-                  ) : (
-                    <TableCell
-                      {...cell}
-                      openModal={(info) => handleOpenModal(0, info, cell?.text)}
-                    />
-                  )}
-                </TableColumn>
-              );
-            })}
-          </tr>
-        </thead>
-      )}
-
-      <tbody>
-        {data.map((row, rowIndex) => {
-          const isSingleCell = row.length === 1;
-
-          return (
-            rowIndex > 0 && (
-              <tr key={rowIndex} className={styles.tr}>
-                {row.map(({ cellProps, ...cell }, cellIndex) => {
-                  const isFirstCol = cellIndex === 0;
-                  const key = `${rowIndex}-${cellIndex}`;
-                  const isHeader = isFirstCol && !isSingleCell;
-
-                  const onCelInfoClick = (info: ReactNode) =>
-                    handleOpenModal(
-                      cellIndex,
-                      info,
-                      isFirstCol ? cell.text : undefined
-                    );
-
-                  return (
-                    <TableColumn
-                      key={key}
-                      cellProps={cellProps}
-                      isFixed={isHeader}
-                      isHeader={isHeader}
-                    >
-                      <TableCell
-                        align={isFirstCol && !isSingleCell ? 'left' : 'center'}
-                        openModal={onCelInfoClick}
-                        {...cell}
-                      />
-                    </TableColumn>
-                  );
-                })}
-              </tr>
-            )
-          );
-        })}
-      </tbody>
-    </table>
-  );
-};
-
-export type { TableCellProps };
-
-export { TableContent };