@zesty-io/material 0.12.0 → 0.12.2

package/es/SSOButtonGroup/index.d.ts

@@ -15,7 +15,7 @@ export interface SSOButtonGroupProps {
     /**
      * Callback invoked upon successful authentication.
      */
-    onSuccess: () => void;
+    onSuccess: (message: object) => void;
     /**
      * Callback invoked when an error occurs during authentication.
      * @param error - Description or details of the error.

package/es/SSOButtonGroup/index.js

@@ -3,10 +3,10 @@ import { Box } from "@mui/material";
 import React, { useEffect } from "react";
 import { useSSO } from "../utils/useSSO";
 const SSOButtonGroup = ({ children, sx, authServiceUrl, onSuccess, onError, }) => {
-    const [initiate, isAuthenticated, ssoError] = useSSO(authServiceUrl);
+    const [initiate, isAuthenticated, ssoError, message] = useSSO(authServiceUrl);
     useEffect(() => {
         if (isAuthenticated && onSuccess) {
-            onSuccess();
+            onSuccess(message);
         }
         else if (ssoError && onError) {
             onError(ssoError);

package/es/theme/index.js

@@ -326,10 +326,13 @@ const components = {
                 },
             }),
             standardInfo: ({ theme }) => ({
-                backgroundColor: alpha(theme.palette.blue[500], 0.1),
+                backgroundColor: theme.palette.blue[100],
                 " .MuiAlert-icon": {
                     color: theme.palette.info.main,
                 },
+                "& .MuiAlert-message": {
+                    color: theme.palette.info.dark,
+                },
             }),
             standardError: ({ theme }) => ({
                 backgroundColor: alpha(theme.palette.error.main, 0.1),

package/es/utils/useSSO.d.ts

@@ -1,2 +1,2 @@
 export declare type SSOService = "github" | "google" | "azure";
-export declare const useSSO: (authServiceUrl: string) => readonly [(service: SSOService) => void, boolean, string];
+export declare const useSSO: (authServiceUrl: string) => readonly [(service: SSOService) => void, boolean, string, {}];

package/es/utils/useSSO.js

@@ -1,11 +1,12 @@
 import { useEffect, useState } from "react";
 let tabWindow = null;
 export const useSSO = (authServiceUrl) => {
+    const [message, setMessage] = useState({});
     const [isAuthenticated, setIsAuthenticated] = useState(false);
     const [error, setError] = useState("");
     const receiveMessage = (event) => {
-        if (event.origin === authServiceUrl &&
-            event.data.source === "zesty") {
+        if (event.origin === authServiceUrl && event.data.source === "zesty") {
+            setMessage(event.data);
             if (event.data.status === "200") {
                 setIsAuthenticated(true);
             }
@@ -29,5 +30,5 @@ export const useSSO = (authServiceUrl) => {
         }
         tabWindow = window.open(`${authServiceUrl}/${service}/login`);
     };
-    return [initiate, isAuthenticated, error];
+    return [initiate, isAuthenticated, error, message];
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zesty-io/material",
-  "version": "0.12.0",
+  "version": "0.12.2",
   "description": "Contains custom components which are in addition to the @mui design-system",
   "author": "Zesty.io",
   "license": "MIT",

package/cjs/ConfirmDialog/ConfirmDialog.stories.d.ts

@@ -1,6 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { ConfirmDialogProps } from '.';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<ConfirmDialogProps>;
-export declare const CustomChildren: Story<ConfirmDialogProps>;

package/cjs/ConfirmDialog/ConfirmDialog.stories.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CustomChildren = exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const material_1 = require("@mui/material");
-const _1 = require(".");
-exports.default = {
-    title: 'ConfirmDialog',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [open, setOpen] = (0, react_1.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => setOpen(true), children: "Click me to open" }), (0, jsx_runtime_1.jsx)(_1.default, { ...args, open: open, callback: (confirmed) => setOpen(false) })] }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    title: 'Confirm modal title',
-    content: 'Confirm modal content',
-};
-exports.CustomChildren = Template.bind({});
-exports.CustomChildren.args = {
-    title: 'Confirm modal title',
-    content: 'Confirm modal content',
-    children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { color: "error", variant: "contained", children: "Custom 1" }), (0, jsx_runtime_1.jsx)(material_1.Button, { color: "success", variant: "contained", children: "Custom 2" })] })
-};

package/cjs/ConfirmDialog/index.d.ts

@@ -1,18 +0,0 @@
-import { ReactNode } from 'react';
-import { DialogProps } from '@mui/material/Dialog';
-export interface ConfirmDialogProps extends Omit<DialogProps, 'title'> {
-    /**
-     * Title of confirm dialog
-     */
-    title: string | ReactNode;
-    /**
-     * Content of confirm dialog
-     */
-    content: string | ReactNode;
-    /**
-     * Callback of confirm dialog
-     */
-    callback: (confirmed: boolean) => void;
-}
-declare const ConfirmDialog: ({ title, content, onClose, children, callback, ...props }: ConfirmDialogProps) => JSX.Element;
-export default ConfirmDialog;

package/cjs/ConfirmDialog/index.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Dialog_1 = require("@mui/material/Dialog");
-const DialogActions_1 = require("@mui/material/DialogActions");
-const DialogContent_1 = require("@mui/material/DialogContent");
-const DialogContentText_1 = require("@mui/material/DialogContentText");
-const DialogTitle_1 = require("@mui/material/DialogTitle");
-const material_1 = require("@mui/material");
-const ConfirmDialog = ({ title, content, onClose, children, callback, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(Dialog_1.default, { ...props, children: [(0, jsx_runtime_1.jsx)(DialogTitle_1.default, { children: title }), (0, jsx_runtime_1.jsx)(DialogContent_1.default, { children: (0, jsx_runtime_1.jsx)(DialogContentText_1.default, { children: content }) }), children ? (0, jsx_runtime_1.jsx)(DialogActions_1.default, { children: children }) : ((0, jsx_runtime_1.jsxs)(DialogActions_1.default, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => callback(false), children: "No" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: () => callback(true), autoFocus: true, children: "Yes" })] }))] }));
-};
-exports.default = ConfirmDialog;

package/cjs/CopyButton/CopyButton.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { CopyButtonProps } from '.';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<CopyButtonProps>;

package/cjs/CopyButton/CopyButton.stories.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const _1 = require(".");
-exports.default = {
-    title: 'CopyButton',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    value: 'Copy Me!'
-};

package/cjs/CopyButton/index.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { ButtonProps } from '@mui/material/Button';
-export interface CopyButtonProps extends ButtonProps {
-    /**
-    * Value to be copied to clipboard
-    */
-    value: string;
-}
-declare const CopyButton: ({ value, sx, ...props }: CopyButtonProps) => JSX.Element;
-export default CopyButton;

package/cjs/CopyButton/index.js

@@ -1,28 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Button_1 = require("@mui/material/Button");
-const ContentCopy_1 = require("@mui/icons-material/ContentCopy");
-const Check_1 = require("@mui/icons-material/Check");
-const CopyButton = ({ value, sx, ...props }) => {
-    const [copied, setCopied] = (0, react_1.useState)(false);
-    const copyValue = (0, react_1.useCallback)(() => {
-        navigator?.clipboard.writeText(value);
-        setCopied(true);
-    }, [value]);
-    (0, react_1.useEffect)(() => {
-        const iconTimer = setTimeout(() => {
-            setCopied(false);
-        }, 500);
-        return () => {
-            clearTimeout(iconTimer);
-        };
-    }, [copied]);
-    return ((0, jsx_runtime_1.jsx)(Button_1.default, { variant: 'outlined', onClick: copyValue, size: "small", title: props.children ? `Copy ${props.children}` : `Copy ${value}`, sx: {
-            textTransform: 'unset',
-            // Spread sx prop at the end to allow sx prop overrides
-            ...sx,
-        }, startIcon: copied ? ((0, jsx_runtime_1.jsx)(Check_1.default, { color: 'success', fontSize: 'small' })) : ((0, jsx_runtime_1.jsx)(ContentCopy_1.default, { fontSize: 'small' })), ...props, children: props.children ? props.children : value }));
-};
-exports.default = CopyButton;

package/cjs/FieldTypeColor/FieldTypeColor.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeColorProps } from './';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeColorProps>;

package/cjs/FieldTypeColor/FieldTypeColor.stories.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require("./");
-exports.default = {
-    title: 'FieldTypeColor',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)('');
-    const handleOnChange = (e) => {
-        setValue(e.target.value);
-    };
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: handleOnChange }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    placeholder: 'Placeholder Text...',
-    label: 'Color label',
-    helperText: 'Color helper text',
-};

package/cjs/FieldTypeColor/index.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import { OutlinedTextFieldProps } from '@mui/material/TextField';
-export interface FieldTypeColorProps extends Omit<OutlinedTextFieldProps, 'variant'> {
-}
-declare const FieldTypeColor: ({ InputProps, label, required, ...props }: FieldTypeColorProps) => JSX.Element;
-export default FieldTypeColor;

package/cjs/FieldTypeColor/index.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const TextField_1 = require("@mui/material/TextField");
-const material_1 = require("@mui/material");
-const Brush_1 = require("@mui/icons-material/Brush");
-const FieldTypeColor = ({ InputProps, label, required, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, required: required, children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsx)(TextField_1.default, { size: "small", variant: 'outlined', type: 'color', InputProps: {
-                    endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", children: (0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", onClick: (e) => {
-                                // References color input via event in order to open color picker
-                                const input = e.currentTarget?.parentElement?.parentElement?.firstElementChild;
-                                input?.click();
-                            }, children: (0, jsx_runtime_1.jsx)(Brush_1.default, { fontSize: 'small' }) }) })),
-                    // Spread props at the end to allow Input prop overrides
-                    ...InputProps,
-                }, ...props })] }));
-};
-exports.default = FieldTypeColor;

package/cjs/FieldTypeDate/FieldTypeDate.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeDateProps } from '.';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeDateProps>;

package/cjs/FieldTypeDate/FieldTypeDate.stories.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require(".");
-exports.default = {
-    title: 'FieldTypeDate',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)(null);
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: (value) => setValue(value) }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    label: 'Date label',
-    helperText: 'Date helper text',
-};

package/cjs/FieldTypeDate/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DesktopDatePickerProps } from '@mui/x-date-pickers';
-export interface FieldTypeDateProps extends Omit<DesktopDatePickerProps<Date, Date>, 'renderInput'> {
-    helperText?: string;
-    error?: boolean;
-    required?: boolean;
-}
-declare const FieldTypeDate: ({ label, helperText, error, required, ...props }: FieldTypeDateProps) => JSX.Element;
-export default FieldTypeDate;

package/cjs/FieldTypeDate/index.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const AdapterDateFns_1 = require("@mui/x-date-pickers/AdapterDateFns");
-const LocalizationProvider_1 = require("@mui/x-date-pickers/LocalizationProvider");
-const x_date_pickers_1 = require("@mui/x-date-pickers");
-const material_1 = require("@mui/material");
-;
-const FieldTypeDate = ({ label, helperText, error, required, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, required: required, children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsx)(LocalizationProvider_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DesktopDatePicker, { "data-testid": "zds-date-picker", renderInput: (params) => (0, jsx_runtime_1.jsx)(material_1.TextField, { ...params, helperText: helperText, error: error, size: "small" }), ...props }) })] }));
-};
-exports.default = FieldTypeDate;

package/cjs/FieldTypeDateTime/FieldTypeDateTime.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeDateTimeProps } from '.';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeDateTimeProps>;

package/cjs/FieldTypeDateTime/FieldTypeDateTime.stories.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require(".");
-exports.default = {
-    title: 'FieldTypeDateTime',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)(null);
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: (value) => setValue(value) }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    label: 'Date label',
-    helperText: 'Date helper text',
-};

package/cjs/FieldTypeDateTime/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { DesktopDateTimePickerProps } from '@mui/x-date-pickers';
-export interface FieldTypeDateTimeProps extends Omit<DesktopDateTimePickerProps<Date, Date>, 'renderInput'> {
-    helperText?: string;
-    error?: boolean;
-    required?: boolean;
-}
-declare const FieldTypeDateTime: ({ label, helperText, error, required, ...props }: FieldTypeDateTimeProps) => JSX.Element;
-export default FieldTypeDateTime;

package/cjs/FieldTypeDateTime/index.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const AdapterDateFns_1 = require("@mui/x-date-pickers/AdapterDateFns");
-const LocalizationProvider_1 = require("@mui/x-date-pickers/LocalizationProvider");
-const x_date_pickers_1 = require("@mui/x-date-pickers");
-const material_1 = require("@mui/material");
-;
-const FieldTypeDateTime = ({ label, helperText, error, required, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, required: required, children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsx)(LocalizationProvider_1.LocalizationProvider, { dateAdapter: AdapterDateFns_1.AdapterDateFns, children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DesktopDateTimePicker, { "data-testid": "zds-date-time-picker", renderInput: (params) => (0, jsx_runtime_1.jsx)(material_1.TextField, { ...params, helperText: helperText, error: error, size: "small" }), ...props }) })] }));
-};
-exports.default = FieldTypeDateTime;

package/cjs/FieldTypeNumber/FieldTypeNumber.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeNumberProps } from './';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeNumberProps>;

package/cjs/FieldTypeNumber/FieldTypeNumber.stories.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require("./");
-exports.default = {
-    title: 'FieldTypeNumber',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)('0');
-    const handleOnChange = (e) => {
-        setValue(e.target.value);
-    };
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: handleOnChange }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    placeholder: 'Placeholder Text...',
-    label: 'Number label',
-    helperText: 'Number helper text',
-};

package/cjs/FieldTypeNumber/index.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-import { OutlinedTextFieldProps } from '@mui/material/TextField';
-export interface FieldTypeNumberProps extends Omit<OutlinedTextFieldProps, 'variant'> {
-}
-declare const FieldTypeText: ({ label, required, ...props }: FieldTypeNumberProps) => JSX.Element;
-export default FieldTypeText;

package/cjs/FieldTypeNumber/index.js

@@ -1,9 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const material_1 = require("@mui/material");
-const TextField_1 = require("@mui/material/TextField");
-const FieldTypeText = ({ label, required, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, required: required, children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsx)(TextField_1.default, { size: "small", variant: 'outlined', type: 'number', ...props })] }));
-};
-exports.default = FieldTypeText;

package/cjs/FieldTypeOneToMany/FieldTypeOneToMany.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeOneToManyProps } from '.';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeOneToManyProps>;

package/cjs/FieldTypeOneToMany/FieldTypeOneToMany.stories.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require(".");
-exports.default = {
-    title: 'FieldTypeOneToMany',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)([]);
-    const [options, setOptions] = (0, react_1.useState)([]);
-    const handleOnOpen = async () => {
-        const largeArr = new Array(1000).fill(null);
-        await new Promise((resolve) => setTimeout(resolve, 3000));
-        const data = largeArr.map((_, idx) => ({ component: (0, jsx_runtime_1.jsx)("div", { children: `Test ${idx}` }), value: String(Math.random()), inputLabel: `Test ${idx}` }));
-        setOptions(data);
-    };
-    const handleOnChange = (e, values) => {
-        setValue(values);
-    };
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: handleOnChange, options: options, onOpen: handleOnOpen }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    placeholder: 'Placeholder Text...',
-    label: 'OneToMany label',
-    helperText: 'OneToMany helperText',
-};

package/cjs/FieldTypeOneToMany/index.d.ts

@@ -1,32 +0,0 @@
-import { ReactNode } from 'react';
-import { AutocompleteProps } from '@mui/material';
-export interface FieldTypeOneToManyProps extends Omit<AutocompleteProps<any, false, false, false>, 'onOpen' | 'renderInput'> {
-    label?: string;
-    helperText?: string;
-    placeholder?: string;
-    error?: boolean;
-    required?: boolean;
-    /**
-     * Callback to be fired upon opening the dropdown
-     */
-    onOpen: () => Promise<any>;
-    /**
-     * Structure for option
-     */
-    options: {
-        /**
-         * Component to be rendered in the dropdown
-         */
-        component: ReactNode | string;
-        /**
-         * Value of option
-         */
-        value: string;
-        /**
-         * Label that should display in the input when selected
-         */
-        inputLabel: string;
-    }[];
-}
-declare const FieldTypeOneToMany: ({ label, helperText, placeholder, error, onOpen, options, required, ...props }: FieldTypeOneToManyProps) => JSX.Element;
-export default FieldTypeOneToMany;

package/cjs/FieldTypeOneToMany/index.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const material_1 = require("@mui/material");
-const Autocomplete_1 = require("@mui/material/Autocomplete");
-const virtualization_1 = require("../utils/virtualization");
-const FieldTypeOneToMany = ({ label, helperText, placeholder, error, onOpen, options, required, ...props }) => {
-    const [loaded, setLoaded] = (0, react_1.useState)(false);
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const handleOpen = () => {
-        if (!loaded && onOpen) {
-            onOpen().then(() => {
-                setLoading(false);
-            });
-            setLoading(true);
-            setLoaded(true);
-        }
-    };
-    return ((0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, required: required, children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { onOpen: handleOpen, loading: loading, fullWidth: true, multiple: true, disableListWrap: true, disableClearable: true, disablePortal: true, size: 'small', PopperComponent: StyledPopper, ListboxComponent: virtualization_1.ListboxComponent, renderInput: (params) => ((0, jsx_runtime_1.jsx)(material_1.TextField, { ...params, helperText: helperText, error: error, placeholder: placeholder })), options: loading ? [] : options, getOptionLabel: (option) => option.inputLabel, renderOption: (props, option) => [props, option.component], ...props })] }));
-};
-exports.default = FieldTypeOneToMany;
-const StyledPopper = (0, material_1.styled)(material_1.Popper)({
-    [`& .${Autocomplete_1.autocompleteClasses.listbox}`]: {
-        boxSizing: 'border-box',
-        '& ul': {
-            padding: 0,
-            margin: 0,
-        },
-    },
-});

package/cjs/FieldTypeOneToOne/FieldTypeOneToOne.stories.d.ts

@@ -1,5 +0,0 @@
-import { Story, Meta } from '@storybook/react/types-6-0';
-import { FieldTypeOneToOneProps } from './';
-declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
-export default _default;
-export declare const Default: Story<FieldTypeOneToOneProps>;

package/cjs/FieldTypeOneToOne/FieldTypeOneToOne.stories.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const _1 = require("./");
-exports.default = {
-    title: 'FieldTypeOneToOne',
-    component: _1.default,
-    argType: {},
-};
-const Template = (args) => {
-    const [value, setValue] = (0, react_1.useState)({ component: '- None -', value: '0', inputLabel: '- None -' });
-    const [options, setOptions] = (0, react_1.useState)([]);
-    const handleOnOpen = async () => {
-        const largeArr = new Array(1000).fill(null);
-        await new Promise((resolve) => setTimeout(resolve, 3000));
-        const data = largeArr.map((_, idx) => ({ component: (0, jsx_runtime_1.jsx)("div", { children: `Test ${idx}` }), value: String(Math.random()), inputLabel: `Test ${idx}` }));
-        setOptions(data);
-    };
-    const handleOnChange = (e, option) => {
-        setValue(option);
-    };
-    return ((0, jsx_runtime_1.jsx)(_1.default, { ...args, value: value, onChange: handleOnChange, options: options, onOpen: handleOnOpen }));
-};
-exports.Default = Template.bind({});
-exports.Default.args = {
-    label: 'OneToOne label',
-    helperText: 'OneToOne helperText',
-    placeholder: 'OneToOne placeholder'
-};

package/cjs/FieldTypeOneToOne/index.d.ts

@@ -1,34 +0,0 @@
-import { ReactNode } from 'react';
-import { AutocompleteProps } from '@mui/material';
-export interface FieldTypeOneToOneProps extends Omit<AutocompleteProps<any, false, false, false>, 'onOpen' | 'renderInput'> {
-    label?: string;
-    helperText?: string;
-    placeholder?: string;
-    error?: boolean;
-    required?: boolean;
-    startAdornment?: ReactNode;
-    endAdornment?: ReactNode;
-    /**
-     * Callback to be fired upon opening the dropdown
-     */
-    onOpen?: () => Promise<any>;
-    /**
-     * Structure for option
-     */
-    options: {
-        /**
-         * Component to be rendered in the dropdown
-         */
-        component: ReactNode | string;
-        /**
-         * Value of option
-         */
-        value: string;
-        /**
-         * Label that should display in the input when selected
-         */
-        inputLabel: string;
-    }[];
-}
-declare const FieldTypeOneToOne: ({ label, helperText, placeholder, error, onOpen, options, required, startAdornment, endAdornment, ...props }: FieldTypeOneToOneProps) => JSX.Element;
-export default FieldTypeOneToOne;