@coveord/plasma-mantine 52.27.4 → 53.0.0

package/dist/esm/form/FormProvider.js

@@ -1,26 +0,0 @@
-/* eslint-disable prefer-arrow/prefer-arrow-functions */ import { jsx as _jsx } from "react/jsx-runtime";
-import React, { createContext, useContext } from 'react';
-import { useForm } from './useForm';
-export function createFormContext() {
-    const FormContext = /*#__PURE__*/ createContext(null);
-    function FormProvider({ form, children }) {
-        return /*#__PURE__*/ _jsx(FormContext.Provider, {
-            value: form,
-            children: children
-        });
-    }
-    function useFormContext() {
-        const ctx = useContext(FormContext);
-        if (!ctx) {
-            throw new Error('useFormContext was called outside of FormProvider context');
-        }
-        return ctx;
-    }
-    return [
-        FormProvider,
-        useFormContext,
-        useForm
-    ];
-}
-
-//# sourceMappingURL=FormProvider.js.map

package/dist/esm/form/FormProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/form/FormProvider.tsx"],"sourcesContent":["/* eslint-disable prefer-arrow/prefer-arrow-functions */\nimport {_TransformValues, UseForm, UseFormReturnType} from '@mantine/form/lib/types';\nimport React, {createContext, useContext} from 'react';\n\nimport {useForm} from './useForm';\n\nexport interface FormProviderProps<Form> {\n    form: Form;\n    children: React.ReactNode;\n}\n\nexport function createFormContext<\n    Values,\n    TransformValues extends _TransformValues<Values> = (values: Values) => Values,\n>() {\n    type Form = UseFormReturnType<Values, TransformValues>;\n\n    const FormContext = createContext<Form>(null);\n\n    function FormProvider({form, children}: FormProviderProps<Form>) {\n        return <FormContext.Provider value={form}>{children}</FormContext.Provider>;\n    }\n\n    function useFormContext() {\n        const ctx = useContext(FormContext);\n        if (!ctx) {\n            throw new Error('useFormContext was called outside of FormProvider context');\n        }\n\n        return ctx;\n    }\n\n    return [FormProvider, useFormContext, useForm] as [\n        React.FC<FormProviderProps<Form>>,\n        () => Form,\n        UseForm<Values, TransformValues>,\n    ];\n}\n"],"names":["React","createContext","useContext","useForm","createFormContext","FormContext","FormProvider","form","children","Provider","value","useFormContext","ctx","Error"],"mappings":"AAAA,sDAAsD;AAEtD,OAAOA,SAAQC,aAAa,EAAEC,UAAU,QAAO,QAAQ;AAEvD,SAAQC,OAAO,QAAO,YAAY;AAOlC,OAAO,SAASC;IAMZ,MAAMC,4BAAcJ,cAAoB;IAExC,SAASK,aAAa,EAACC,IAAI,EAAEC,QAAQ,EAA0B;QAC3D,qBAAO,KAACH,YAAYI,QAAQ;YAACC,OAAOH;sBAAOC;;IAC/C;IAEA,SAASG;QACL,MAAMC,MAAMV,WAAWG;QACvB,IAAI,CAACO,KAAK;YACN,MAAM,IAAIC,MAAM;QACpB;QAEA,OAAOD;IACX;IAEA,OAAO;QAACN;QAAcK;QAAgBR;KAAQ;AAKlD"}

package/dist/esm/form/index.d.ts

@@ -1,3 +0,0 @@
-export * from './useForm';
-export * from './FormProvider';
-//# sourceMappingURL=index.d.ts.map

package/dist/esm/form/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC"}

package/dist/esm/form/index.js

@@ -1,4 +0,0 @@
-export * from './useForm';
-export * from './FormProvider';
-
-//# sourceMappingURL=index.js.map

package/dist/esm/form/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/form/index.ts"],"sourcesContent":["export * from './useForm';\nexport * from './FormProvider';\n"],"names":[],"mappings":"AAAA,cAAc,YAAY;AAC1B,cAAc,iBAAiB"}

package/dist/esm/form/useForm.d.ts

@@ -1,3 +0,0 @@
-import { useForm as useMantineForm } from '@mantine/form';
-export declare const useForm: typeof useMantineForm;
-//# sourceMappingURL=useForm.d.ts.map

package/dist/esm/form/useForm.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../src/form/useForm.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,MAAM,eAAe,CAAC;AAGxD,eAAO,MAAM,OAAO,EAAE,OAAO,cAsB5B,CAAC"}

package/dist/esm/form/useForm.js

@@ -1,26 +0,0 @@
-import { useForm as useMantineForm } from '@mantine/form';
-export const useForm = (options)=>{
-    const form = useMantineForm(options);
-    const getInputProps = (path, { type = 'input', withError = type === 'input', withFocus = true } = {})=>{
-        const originalPayload = form.getInputProps(path, {
-            type,
-            withError,
-            withFocus
-        });
-        if (Array.isArray(originalPayload.value)) {
-            return {
-                ...originalPayload,
-                onReorderItem: (payload)=>form.reorderListItem(path, payload),
-                onRemoveItem: (index)=>form.removeListItem(path, index),
-                onInsertItem: (valueToInsert, index)=>form.insertListItem(path, valueToInsert, index)
-            };
-        }
-        return originalPayload;
-    };
-    return {
-        ...form,
-        getInputProps
-    };
-};
-
-//# sourceMappingURL=useForm.js.map

package/dist/esm/form/useForm.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/form/useForm.ts"],"sourcesContent":["import {useForm as useMantineForm} from '@mantine/form';\nimport {GetInputProps} from '@mantine/form/lib/types';\n\nexport const useForm: typeof useMantineForm = (options) => {\n    const form = useMantineForm(options);\n\n    const getInputProps: GetInputProps<Record<string, unknown>> = (\n        path,\n        {type = 'input', withError = type === 'input', withFocus = true} = {},\n    ) => {\n        const originalPayload = form.getInputProps(path, {type, withError, withFocus});\n        if (Array.isArray(originalPayload.value)) {\n            return {\n                ...originalPayload,\n                onReorderItem: (payload: Record<'from' | 'to', number>) => form.reorderListItem(path, payload),\n                onRemoveItem: (index: number) => form.removeListItem(path, index),\n                onInsertItem: (valueToInsert: unknown, index: number) =>\n                    form.insertListItem(path, valueToInsert, index),\n            };\n        }\n\n        return originalPayload;\n    };\n\n    return {...form, getInputProps};\n};\n"],"names":["useForm","useMantineForm","options","form","getInputProps","path","type","withError","withFocus","originalPayload","Array","isArray","value","onReorderItem","payload","reorderListItem","onRemoveItem","index","removeListItem","onInsertItem","valueToInsert","insertListItem"],"mappings":"AAAA,SAAQA,WAAWC,cAAc,QAAO,gBAAgB;AAGxD,OAAO,MAAMD,UAAiC,CAACE;IAC3C,MAAMC,OAAOF,eAAeC;IAE5B,MAAME,gBAAwD,CAC1DC,MACA,EAACC,OAAO,OAAO,EAAEC,YAAYD,SAAS,OAAO,EAAEE,YAAY,IAAI,EAAC,GAAG,CAAC,CAAC;QAErE,MAAMC,kBAAkBN,KAAKC,aAAa,CAACC,MAAM;YAACC;YAAMC;YAAWC;QAAS;QAC5E,IAAIE,MAAMC,OAAO,CAACF,gBAAgBG,KAAK,GAAG;YACtC,OAAO;gBACH,GAAGH,eAAe;gBAClBI,eAAe,CAACC,UAA2CX,KAAKY,eAAe,CAACV,MAAMS;gBACtFE,cAAc,CAACC,QAAkBd,KAAKe,cAAc,CAACb,MAAMY;gBAC3DE,cAAc,CAACC,eAAwBH,QACnCd,KAAKkB,cAAc,CAAChB,MAAMe,eAAeH;YACjD;QACJ;QAEA,OAAOR;IACX;IAEA,OAAO;QAAC,GAAGN,IAAI;QAAEC;IAAa;AAClC,EAAE"}

package/src/components/browser-preview/BrowserPreview.styles.ts

@@ -1,14 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export default createStyles((theme) => ({
-    root: {
-        boxShadow: theme.shadows.md,
-        borderRadius: theme.defaultRadius,
-        border: '1px solid',
-        borderColor: theme.colors.gray[3],
-        flex: 1,
-    },
-    header: {boxShadow: theme.shadows.xs, borderRadius: `${theme.defaultRadius}px ${theme.defaultRadius}px 0 0`},
-    content: {overflow: 'auto', flexGrow: 1},
-    infoIcon: {color: theme.colors.gray[5]},
-}));

package/src/components/collection/Collection.styles.ts

@@ -1,20 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export interface CollectionStylesParams {}
-
-export default createStyles((theme) => ({
-    root: {
-        position: 'relative',
-    },
-    item: {
-        backgroundColor: theme.colorScheme === 'light' ? theme.white : theme.black,
-        alignItems: 'baseline',
-    },
-    itemDragging: {
-        boxShadow: theme.shadows.md,
-        zIndex: 2,
-    },
-    dragHandle: {
-        cursor: 'move',
-    },
-}));

package/src/components/header/Header.styles.ts

@@ -1,20 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export interface HeaderStylesParams {
-    variant?: 'page' | 'modal';
-}
-
-export const useStyles = createStyles((theme, {variant}: HeaderStylesParams) => ({
-    root: {
-        padding: variant === 'page' ? theme.spacing.xl : undefined,
-        paddingBottom: variant === 'page' ? theme.spacing.lg : undefined,
-    },
-    title: {
-        wordBreak: 'break-word',
-        color: variant === 'page' ? theme.colors.gray[5] : undefined,
-    },
-    description: {
-        color: theme.colors.gray[6],
-    },
-    divider: {},
-}));

package/src/components/header/HeaderActions/HeaderActions.styles.ts

@@ -1,7 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export interface HeaderActionsStylesParams {}
-
-export const useStyles = createStyles((theme, {}: HeaderActionsStylesParams) => ({
-    root: {},
-}));

package/src/components/header/HeaderBreadcrumbs/HeaderBreadcrumbs.styles.ts

@@ -1,8 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export interface HeaderBreadcrumbsStylesParams {}
-
-export const useStyles = createStyles((theme, {}: HeaderBreadcrumbsStylesParams) => ({
-    breadcrumb: {fontSize: theme.fontSizes.sm, fontWeight: 300},
-    separator: {color: theme.colors.gray[5]},
-}));

package/src/components/header/HeaderDocAnchor/HeaderDocAnchor.styles.ts

@@ -1,11 +0,0 @@
-import {createStyles} from '@mantine/core';
-
-export interface HeaderDocAnchorStylesParams {}
-
-export const useStyles = createStyles((theme, {}: HeaderDocAnchorStylesParams) => ({
-    tooltip: {},
-    anchor: {
-        marginLeft: theme.spacing.xs,
-        verticalAlign: 'middle',
-    },
-}));

package/src/components/inline-confirm/InlineConfirmButton.tsx

@@ -1,21 +0,0 @@
-import {forwardRef, MouseEventHandler} from 'react';
-import {Button, ButtonProps} from '../button';
-
-import {useInlineConfirm} from './useInlineConfirm';
-
-export interface InlineConfirmButtonProps extends ButtonProps {
-    id: string;
-    onClick?: MouseEventHandler<HTMLButtonElement>;
-}
-
-export const InlineConfirmButton = forwardRef<HTMLButtonElement, InlineConfirmButtonProps>(
-    ({onClick, id, ...others}, ref) => {
-        const {setConfirmingId} = useInlineConfirm();
-        const handleOnClick: MouseEventHandler<HTMLButtonElement> = (e) => {
-            setConfirmingId(id);
-            onClick?.(e);
-        };
-
-        return <Button ref={ref} onClick={handleOnClick} {...others} />;
-    },
-);

package/src/components/inline-confirm/InlineConfirmMenuItem.tsx

@@ -1,21 +0,0 @@
-import {forwardRef, MouseEventHandler} from 'react';
-
-import {Menu, MenuItemProps} from '../menu';
-import {useInlineConfirm} from './useInlineConfirm';
-
-export interface InlineConfirmMenuItemProps extends MenuItemProps {
-    id: string;
-    onClick?: MouseEventHandler<HTMLButtonElement>;
-}
-
-export const InlineConfirmMenuItem = forwardRef<HTMLButtonElement, InlineConfirmMenuItemProps>(
-    ({onClick, id, ...others}, ref) => {
-        const {setConfirmingId} = useInlineConfirm();
-        const handleOnClick: MouseEventHandler<HTMLButtonElement> = (e) => {
-            setConfirmingId(id);
-            onClick?.(e);
-        };
-
-        return <Menu.Item ref={ref} onClick={handleOnClick} {...others} />;
-    },
-);

package/src/components/inline-confirm/useInlineConfirm.ts

@@ -1,12 +0,0 @@
-import {useContext} from 'react';
-import {InlineConfirmContext} from './InlineConfirmContext';
-
-export const useInlineConfirm = () => {
-    const ctx = useContext(InlineConfirmContext);
-
-    if (ctx === null) {
-        throw new Error('useConfirm must be used inside of a InlineConfirmContext.Provider');
-    }
-
-    return ctx;
-};

package/src/components/modal-wizard/ModalWizard.tsx

@@ -1,255 +0,0 @@
-import {Box, CloseButton, createStyles, DefaultProps, Modal, ModalProps, Progress, Selectors} from '@mantine/core';
-import {Children, ReactElement, useEffect, useMemo, useState} from 'react';
-
-import {Button} from '../button';
-import {Header} from '../header';
-import {StickyFooter} from '../sticky-footer';
-import {ModalWizardStep, ModalWizardStepProps, ResolveStep} from './ModalWizardStep';
-
-const useStyles = createStyles(() => ({
-    content: {
-        display: 'flex',
-        flexDirection: 'column',
-    },
-    body: {
-        flex: 1,
-        display: 'flex',
-        flexDirection: 'column',
-    },
-}));
-
-type ModalWizardStylesNames = Selectors<typeof useStyles>;
-
-export interface ModalWizardProps
-    extends Omit<DefaultProps<ModalWizardStylesNames>, 'classNames' | 'styles'>,
-        Omit<ModalProps, 'centered' | 'title'> {
-    /**
-     * The label of the cancel button
-     *
-     * @default "Cancel"
-     */
-    cancelButtonLabel?: string;
-
-    /**
-     * The label of the next button
-     *
-     * @default "Next"
-     */
-    nextButtonLabel?: string;
-
-    /**
-     * The label of the previous button
-     *
-     * @default "Previous"
-     */
-    previousButtonLabel?: string;
-
-    /**
-     * The label of the finish button
-     *
-     * @default "Finish"
-     */
-    finishButtonLabel?: string;
-
-    /**
-     * A callback function that is executed when the user clicks on the next button
-     */
-    onNext?: (newStep: number, setCurrentStep?: React.Dispatch<number>) => unknown;
-
-    /**
-     * A callback function that is executed when the user clicks on the previous button
-     */
-    onPrevious?: (newStep: number) => unknown;
-
-    /**
-     * A function that is executed when user completes all the steps.
-     *
-     * @param close A function that closes the modal when called.
-     */
-    onFinish?: () => unknown;
-
-    /**
-     * Determine if user interacted with any steps in the modal wizard
-     */
-    isDirty?: () => boolean;
-
-    /**
-     * A function to confirm close if the state is dirty before closing
-     */
-    handleDirtyState?: () => boolean;
-
-    /**
-     * Children to display in modal wizard
-     * */
-    children?: Array<ReturnType<typeof ModalWizardStep>>;
-
-    /**
-     * Indicates if step validation should be performed when clicking on to the next step
-     * If true, the next step will always be enabled
-     *
-     * @default false
-     */
-    isStepValidatedOnNext?: boolean;
-}
-
-interface ModalWizardType {
-    (props: ModalWizardProps): ReactElement;
-
-    Step: typeof ModalWizardStep;
-}
-
-export const ModalWizard: ModalWizardType = ({
-    cancelButtonLabel = 'Cancel',
-    nextButtonLabel = 'Next',
-    previousButtonLabel = 'Previous',
-    finishButtonLabel = 'Finish',
-    opened,
-    onNext,
-    onPrevious,
-    onClose,
-    onFinish,
-    isDirty,
-    handleDirtyState,
-    classNames,
-    styles,
-    unstyled,
-    children,
-    isStepValidatedOnNext,
-    ...modalProps
-}) => {
-    const {
-        classes: {content, body},
-        cx,
-    } = useStyles(null, {
-        name: 'ModalWizard',
-        classNames,
-        styles,
-        unstyled,
-    });
-
-    const [currentStepIndex, setCurrentStepIndex] = useState(0);
-    const modalSteps = (Children.toArray(children) as ReactElement[]).filter((child) => child.type === ModalWizardStep);
-
-    const numberOfSteps = modalSteps.length;
-    const isFirstStep = currentStepIndex === 0;
-    const isLastStep = currentStepIndex === numberOfSteps - 1;
-    const currentStep = modalSteps.filter((step: ReactElement, index: number) => index === currentStepIndex)[0];
-
-    const {isValid} = isStepValidatedOnNext
-        ? {isValid: true}
-        : currentStep?.props?.validateStep?.(currentStepIndex, numberOfSteps) ?? {isValid: true};
-
-    useEffect(() => {
-        if (opened) {
-            setCurrentStepIndex(0);
-        }
-    }, [opened]);
-
-    const handleClose = (confirmDirty: boolean) => {
-        if (confirmDirty) {
-            const isModalDirty = isDirty?.() ?? false;
-            if (isModalDirty) {
-                const discardChanges = handleDirtyState?.() ?? true;
-                if (!discardChanges) {
-                    return;
-                }
-            }
-        }
-        onClose?.();
-    };
-
-    const resolveStepDependentProp = <P extends keyof ModalWizardStepProps>(
-        prop: P,
-    ): ResolveStep<ModalWizardStepProps[P]> =>
-        typeof currentStep.props[prop] === 'function'
-            ? currentStep.props[prop](currentStepIndex + 1, numberOfSteps)
-            : currentStep.props[prop];
-
-    const getProgress = useMemo(
-        () => (currStepIndex: number) => {
-            const totalNumberOfSteps = modalSteps.filter((step) => step.props.countsAsProgress).length;
-            const numberOfCompletedSteps = modalSteps.filter(
-                (step, index) => step.props.countsAsProgress && index <= currStepIndex,
-            ).length;
-            return (numberOfCompletedSteps / totalNumberOfSteps) * 100;
-        },
-        [],
-    );
-
-    return (
-        <Modal
-            opened={opened}
-            classNames={{content: cx(content, classNames?.content), body: cx(body, classNames?.body)}}
-            centered
-            onClose={() => handleClose(true)}
-            withCloseButton={false}
-            padding={0}
-            {...modalProps}
-        >
-            <Header
-                p="lg"
-                pr="md"
-                variant="modal"
-                description={resolveStepDependentProp('description')}
-                borderBottom={!currentStep.props.showProgressBar}
-            >
-                {resolveStepDependentProp('title')}
-                {resolveStepDependentProp('docLink') ? (
-                    <Header.DocAnchor
-                        href={resolveStepDependentProp('docLink')}
-                        label={resolveStepDependentProp('docLinkTooltipLabel')}
-                    />
-                ) : null}
-                <Header.Actions>
-                    <CloseButton aria-label={'close-modal'} onClick={() => handleClose(true)} />
-                </Header.Actions>
-            </Header>
-            {currentStep.props.showProgressBar && (
-                <Progress color="navy.5" size="sm" radius={0} value={getProgress(currentStepIndex)} />
-            )}
-            <Box p="lg">{currentStep}</Box>
-            <Box
-                sx={{
-                    marginTop: 'auto',
-                }}
-            >
-                <StickyFooter borderTop>
-                    <Button
-                        name={isFirstStep ? cancelButtonLabel : previousButtonLabel}
-                        variant="outline"
-                        onClick={() => {
-                            if (isFirstStep) {
-                                handleClose(true);
-                            } else {
-                                onPrevious?.(currentStepIndex - 1);
-                                setCurrentStepIndex(currentStepIndex - 1);
-                            }
-                        }}
-                    >
-                        {isFirstStep ? cancelButtonLabel : previousButtonLabel}
-                    </Button>
-
-                    <Button
-                        disabledTooltip={currentStep.props.disabledTooltipLabel}
-                        disabled={!isValid}
-                        onClick={() => {
-                            if (isLastStep) {
-                                onFinish?.() ?? handleClose(false);
-                            } else {
-                                onNext?.(currentStepIndex + 1, setCurrentStepIndex);
-
-                                if (!isStepValidatedOnNext) {
-                                    setCurrentStepIndex(currentStepIndex + 1);
-                                }
-                            }
-                        }}
-                    >
-                        {isLastStep ? finishButtonLabel : nextButtonLabel}
-                    </Button>
-                </StickyFooter>
-            </Box>
-        </Modal>
-    );
-};
-
-ModalWizard.Step = ModalWizardStep;

package/src/components/modal-wizard/ModalWizardStep.tsx

@@ -1,59 +0,0 @@
-import {FunctionComponent, PropsWithChildren, ReactNode} from 'react';
-
-type DependsOnStep<T> = (currentStep: number, numberOfSteps: number) => T;
-export type ResolveStep<P> = P extends infer T | DependsOnStep<infer T> ? T : never;
-
-export interface ModalWizardStepProps {
-    /**
-     * The title of the current step. The title can be dependent on the current step if needed
-     */
-    title?: ReactNode | DependsOnStep<ReactNode>;
-
-    /**
-     * The description of the current step. The description can be dependent on the current step if needed
-     */
-    description?: string | DependsOnStep<string>;
-
-    /**
-     * A link to the documentation for the current step
-     */
-    docLink?: string | DependsOnStep<string>;
-
-    /**
-     * A tooltip label for the docLink
-     */
-    docLinkTooltipLabel?: string | DependsOnStep<string>;
-
-    /**
-     * A function to validate the current step, it determines if the next step should be enabled or not.
-     */
-    validateStep?: (currentStep: any, numberOfSteps: any) => {isValid: boolean; messsage?: unknown};
-
-    /**
-     * Show progress bar at this step
-     *
-     * @default true
-     */
-    showProgressBar?: boolean;
-
-    /**
-     * Does completion of current step count moves the progress bar
-     *
-     * @default true
-     */
-    countsAsProgress?: boolean;
-
-    /**
-     * Tooltip label of the next button when disabled
-     */
-    disabledTooltipLabel?: string;
-}
-
-const ModalWizardStep: FunctionComponent<PropsWithChildren<ModalWizardStepProps>> = ({children}) => <>{children}</>;
-
-ModalWizardStep.defaultProps = {
-    showProgressBar: true,
-    countsAsProgress: true,
-};
-
-export {ModalWizardStep};