@sqrzro/admin 2.0.0 → 2.1.0-bz.1

package/src/core/CalendarWeek/index.tsx

@@ -1,97 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import CalendarDay from '../CalendarDay';
-import type { DayObject } from '../CalendarDay';
-
-import type { InputEvent } from '../../utility/interfaces';
-
-export type WeekObject = (DayObject | number)[];
-
-interface CalendarWeekProps {
-    data: WeekObject;
-    disabledDates?: string[] | ((date: string) => boolean);
-    name: string;
-    onClick?: (event: InputEvent<string>) => void;
-    pendingValue: string;
-    value?: string;
-}
-
-const isDisabled = (
-    item: DayObject | number,
-    disabledDates?: string[] | ((date: string) => boolean)
-): boolean => {
-    if (typeof item === 'number' || !disabledDates) {
-        return false;
-    }
-
-    if (typeof disabledDates === 'function') {
-        return disabledDates(item.date);
-    }
-
-    return disabledDates.includes(item.date);
-};
-
-const isSelected = (item: DayObject | number, pendingValue: string, value?: string): boolean => {
-    if (typeof item === 'number') {
-        return false;
-    }
-
-    return (pendingValue || value || '').split(',').includes(item.date);
-};
-
-const isHighlighted = (item: DayObject | number, pendingValue: string, value?: string): boolean => {
-    if (typeof item === 'number') {
-        return false;
-    }
-
-    const [lower, upper] = (pendingValue || value || '').split(',');
-    return item.date > lower && item.date < upper;
-};
-
-function CalendarWeek({
-    data,
-    disabledDates,
-    name,
-    onClick,
-    pendingValue,
-    value,
-}: CalendarWeekProps): React.ReactElement {
-    return (
-        <tr>
-            {data.map((item, index) => (
-                <CalendarDay
-                    key={typeof item === 'number' ? index : item.date}
-                    data={item}
-                    isDisabled={isDisabled(item, disabledDates)}
-                    isHighlighted={isHighlighted(item, pendingValue, value)}
-                    isSelected={isSelected(item, pendingValue, value)}
-                    name={name}
-                    onClick={onClick}
-                />
-            ))}
-        </tr>
-    );
-}
-
-CalendarWeek.propTypes = {
-    data: PropTypes.arrayOf(
-        PropTypes.oneOfType([
-            PropTypes.number.isRequired,
-            PropTypes.shape({
-                date: PropTypes.string.isRequired,
-                label: PropTypes.number.isRequired,
-            }).isRequired,
-        ]).isRequired
-    ).isRequired,
-    name: PropTypes.string.isRequired,
-    pendingValue: PropTypes.string.isRequired,
-    disabledDates: PropTypes.oneOfType([
-        PropTypes.arrayOf(PropTypes.string.isRequired),
-        PropTypes.func,
-    ]),
-    value: PropTypes.string,
-    onClick: PropTypes.func,
-};
-
-export default CalendarWeek;

package/src/core/ChkRadList/ChkRadList.module.css

@@ -1,12 +0,0 @@
-.root {
-    display: grid;
-    grid-gap: 1rem;
-    grid-template-columns: repeat(2, 1fr);
-    margin-top: 1rem;
-}
-
-.root4 {
-    @media (--media-med) {
-        grid-template-columns: repeat(4, 1fr);
-    }
-}

package/src/core/ChkRadList/index.tsx

@@ -1,88 +0,0 @@
-import React from 'react';
-import clsx from 'clsx';
-import PropTypes from 'prop-types';
-
-import ChkRad from '../ChkRad';
-
-import type { InputProps } from '../../utility/interfaces';
-
-// Import styles from './ChkRadList.module.css';
-
-export interface ChkRadDataItem {
-    isDisabled?: boolean;
-    label: string;
-    value: string;
-}
-
-interface ChkRadListProps extends InputProps<string[] | string, string> {
-    columns?: number;
-    data: ChkRadDataItem[];
-    type?: 'checkbox' | 'radio';
-}
-
-const DEFAULT_COLUMNS = 4;
-
-const getIsChecked = (itemValue: string, fieldValue?: string[] | string): boolean => {
-    if (!fieldValue) {
-        return false;
-    }
-
-    if (Array.isArray(fieldValue)) {
-        return fieldValue.includes(itemValue);
-    }
-
-    return fieldValue === itemValue;
-};
-
-/**
- * A list of either checkboxes or radio buttons. The onChange event will return a string - the
- * value of the last item that was checked/unchecked.
- */
-function ChkRadList({
-    columns = DEFAULT_COLUMNS,
-    data,
-    isDisabled,
-    name,
-    onChange,
-    type,
-    value,
-}: ChkRadListProps): React.ReactElement {
-    return (
-        <ul className="/*clsx(styles.root, styles[`root${columns.toString()`])*/">
-            {data.map((item) => (
-                <li key={item.value}>
-                    <ChkRad
-                        id={`${name}_${item.value}`}
-                        isChecked={getIsChecked(item.value, value)}
-                        isDisabled={item.isDisabled || isDisabled}
-                        label={item.label}
-                        name={name}
-                        onChange={onChange}
-                        type={type}
-                        value={item.value}
-                    />
-                </li>
-            ))}
-        </ul>
-    );
-}
-
-ChkRadList.propTypes = {
-    data: PropTypes.arrayOf(
-        PropTypes.shape({
-            label: PropTypes.string.isRequired,
-            value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-        }).isRequired
-    ).isRequired,
-    name: PropTypes.string.isRequired,
-    isDisabled: PropTypes.bool,
-    type: PropTypes.oneOf(['checkbox', 'radio']),
-    value: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.number,
-        PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired),
-    ]),
-    onChange: PropTypes.func,
-};
-
-export default ChkRadList;

package/src/core/CloseButton/CloseButton.spec.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-
-import CloseButton from './index';
-
-describe('CloseButton', () => {
-    it('should render', () => {
-        render(<CloseButton />);
-        expect(screen.getByRole('button')).toBeInTheDocument();
-        expect(screen.getByRole('button')).toHaveTextContent('Close');
-    });
-
-    it('should have custom label', () => {
-        render(<CloseButton label="Lorem" />);
-        expect(screen.getByRole('button')).toHaveTextContent('Lorem');
-    });
-
-    it('should be submit', () => {
-        render(<CloseButton type="submit" />);
-        expect(screen.getByRole('button')).toHaveAttribute('type', 'submit');
-    });
-
-    it('should have size', () => {
-        render(<CloseButton size="sm" />);
-        expect(screen.getByRole('img', { hidden: true })).toHaveStyle({ width: '16px' });
-    });
-
-    it('should handle click', async () => {
-        const user = userEvent.setup();
-
-        const mockFn = jest.fn();
-        render(<CloseButton onClick={mockFn} />);
-
-        await user.click(screen.getByRole('button'));
-        expect(mockFn).toHaveBeenCalledTimes(1);
-    });
-});

package/src/core/CloseButton/index.tsx

@@ -1,33 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import IconButton from '../IconButton';
-
-interface CloseButtonProps {
-    label?: string;
-    onClick?: React.MouseEventHandler<HTMLButtonElement>;
-    // eslint-disable-next-line @typescript-eslint/sort-type-constituents
-    size?: 'sm' | 'md' | 'lg';
-    type?: 'button' | 'submit';
-}
-
-function CloseButton({
-    label = 'Close',
-    onClick,
-    size,
-    type,
-}: CloseButtonProps): React.ReactElement {
-    return (
-        <IconButton icon="x" onClick={onClick} size={size} type={type}>
-            {label}
-        </IconButton>
-    );
-}
-
-CloseButton.propTypes = {
-    size: PropTypes.oneOf(['sm', 'md', 'lg']),
-    type: PropTypes.oneOf(['button', 'submit']),
-    onClick: PropTypes.func,
-};
-
-export default CloseButton;

package/src/core/ConfirmModal/ConfirmModal.spec.tsx

@@ -1,94 +0,0 @@
-import React from 'react';
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-
-import ConfirmService from '../../services/ConfirmService';
-
-import ConfirmModal from './index';
-
-describe('ConfirmModal', () => {
-    it('should render', () => {
-        render(<ConfirmModal />);
-        expect(screen.queryByText('Are You Sure?')).not.toBeInTheDocument();
-    });
-
-    it('should render confirmation', async () => {
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem' });
-        });
-
-        expect(screen.getByText('Are You Sure?')).toBeInTheDocument();
-        expect(screen.getByText('lorem')).toBeInTheDocument();
-    });
-
-    it('should render custom label', async () => {
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem', label: 'Confirm Lorem' });
-        });
-
-        expect(screen.getByRole('button', { name: 'Confirm Lorem' })).toBeInTheDocument();
-    });
-
-    it('should handle onconfirm', async () => {
-        const user = userEvent.setup();
-
-        const mockFn = jest.fn();
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem', onConfirm: mockFn });
-        });
-
-        await user.click(screen.getByRole('button', { name: 'Confirm' }));
-        expect(mockFn).toHaveBeenCalledTimes(1);
-    });
-
-    it('should handle confirm with no onconfirm', async () => {
-        const user = userEvent.setup();
-
-        const mockFn = jest.fn();
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem' });
-        });
-
-        await user.click(screen.getByRole('button', { name: 'Confirm' }));
-        expect(mockFn).toHaveBeenCalledTimes(0);
-    });
-
-    it('should handle close (service)', async () => {
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem' });
-        });
-
-        expect(screen.getByText('lorem')).toBeInTheDocument();
-
-        await waitFor(() => {
-            ConfirmService.close();
-        });
-
-        expect(screen.queryByText('lorem')).not.toBeInTheDocument();
-    });
-
-    it('should handle close (button)', async () => {
-        const user = userEvent.setup();
-
-        render(<ConfirmModal />);
-
-        await waitFor(() => {
-            ConfirmService.ask({ description: 'lorem' });
-        });
-
-        expect(screen.getByText('lorem')).toBeInTheDocument();
-
-        await user.click(screen.getByRole('button', { name: 'Close' }));
-        expect(screen.queryByText('lorem')).not.toBeInTheDocument();
-    });
-});

package/src/core/ConfirmModal/index.tsx

@@ -1,59 +0,0 @@
-'use client';
-
-import React, { useEffect, useState } from 'react';
-
-import { EventService } from '@sqrzro/utility';
-
-import type { ConfirmModalData } from '../../services/ConfirmService';
-
-import ContentBlock from '../../components/ContentBlock';
-import ModalActions from '../../components/ModalActions';
-import ModalComponent from '../ModalComponent';
-
-import useModal from '../../hooks/useModal';
-
-function ConfirmModal(): React.ReactElement {
-    const [data, setData] = useState<ConfirmModalData | null>(null);
-    const { closeModal, modalProps, openModal } = useModal();
-
-    const handleConfirm = (): void => {
-        /*
-         * `data` can be null, so the optional check (?.) is required for typescript.
-         * However, the modal can't be open without data, so this can be ignored by test coverage.
-         */
-        /* istanbul ignore next */
-        if (data?.onConfirm) {
-            data.onConfirm();
-        }
-        closeModal();
-    };
-
-    const handleData = (_key: string, responseData: ConfirmModalData | null): void => {
-        setData(responseData);
-
-        if (responseData) {
-            openModal();
-        }
-    };
-
-    useEffect(() => {
-        const sub = EventService.subscribe<ConfirmModalData | null>('@confirm/send', handleData);
-
-        return (): void => {
-            EventService.unsubscribe(sub);
-        };
-    }, []);
-
-    return (
-        <ModalComponent {...modalProps} title="Are You Sure?" variant="danger">
-            {data?.description ? <ContentBlock>{data.description}</ContentBlock> : null}
-            <ModalActions
-                label={data?.label || 'Confirm'}
-                onClick={handleConfirm}
-                variant="danger"
-            />
-        </ModalComponent>
-    );
-}
-
-export default ConfirmModal;