@niledatabase/react 3.0.0-alpha.9 → 3.0.1-alpha.0

package/dist/react.cjs.development.js

@@ -1,943 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var Browser = require('@niledatabase/browser');
-var reactQuery = require('@tanstack/react-query');
-var CssBaseline = require('@mui/material/CssBaseline');
-var styles = require('@mui/joy/styles');
-var Box = require('@mui/joy/Box');
-var Button = require('@mui/joy/Button');
-var Stack = require('@mui/joy/Stack');
-var Typography = require('@mui/joy/Typography');
-var react = require('next-auth/react');
-var Alert = require('@mui/joy/Alert');
-var reactHookForm = require('react-hook-form');
-var Input = require('@mui/joy/Input');
-var FormControl = require('@mui/joy/FormControl');
-var FormHelperText = require('@mui/joy/FormHelperText');
-var Error$1 = require('@mui/icons-material/Error');
-var FormLabel = require('@mui/joy/FormLabel');
-var Select = require('@mui/joy/Select');
-var Option = require('@mui/joy/Option');
-var Tooltip = require('@mui/joy/Tooltip');
-var joy = require('@mui/joy');
-var Checkbox = require('@mui/joy/Checkbox');
-var List = require('@mui/joy/List');
-var ListItem = require('@mui/joy/ListItem');
-var xDataGrid = require('@mui/x-data-grid');
-var Add = require('@mui/icons-material/Add');
-
-function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return n;
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
-
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-function Themer({
-  theme,
-  children,
-  slotProps
-}) {
-  return /*#__PURE__*/React.createElement(styles.CssVarsProvider, {
-    ...slotProps,
-    theme: theme
-  }, /*#__PURE__*/React.createElement(CssBaseline, {
-    enableColorScheme: true
-  }), children);
-}
-
-const queryClient = /*#__PURE__*/new reactQuery.QueryClient();
-const defaultContext = {
-  api: /*#__PURE__*/new Browser({
-    basePath: 'https://api.thenile.dev',
-    credentials: 'include'
-  }),
-  apiUrl: ''
-};
-const context = /*#__PURE__*/React.createContext(defaultContext);
-const {
-  Provider
-} = context;
-const BaseQueryProvider = ({
-  children
-}) => {
-  return /*#__PURE__*/React.createElement(reactQuery.QueryClientProvider, {
-    client: queryClient
-  }, children);
-};
-const NileProvider = props => {
-  const {
-    children,
-    theme,
-    slotProps,
-    tenantId,
-    QueryProvider = BaseQueryProvider,
-    appUrl,
-    apiUrl = 'https://api.thenile.dev',
-    api
-  } = props;
-  const values = React.useMemo(() => {
-    return {
-      api: api ?? new Browser({
-        basePath: appUrl,
-        credentials: 'include'
-      }),
-      tenantId: String(tenantId),
-      apiUrl,
-      appUrl
-    };
-  }, [api, apiUrl, appUrl, tenantId]);
-  return /*#__PURE__*/React.createElement(QueryProvider, null, /*#__PURE__*/React.createElement(Themer, {
-    slotProps: slotProps?.provider,
-    theme: theme
-  }, /*#__PURE__*/React.createElement(Provider, {
-    value: values
-  }, children)));
-};
-const useNileContext = () => {
-  return React.useContext(context);
-};
-const useNileConfig = () => {
-  const {
-    apiUrl,
-    tenantId,
-    appUrl
-  } = useNileContext();
-  return React.useMemo(() => ({
-    tenantId,
-    apiUrl,
-    appUrl
-  }), [apiUrl, tenantId, appUrl]);
-};
-const useApi = () => {
-  return useNileContext().api;
-};
-
-var _g;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-var SvgGoogle = function SvgGoogle(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 18,
-    height: 18
-  }, props), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
-    fillRule: "evenodd"
-  }, /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "#EA4335",
-    d: "M9 3.48c1.69 0 2.83.73 3.48 1.34l2.54-2.48C13.46.89 11.43 0 9 0 5.48 0 2.44 2.02.96 4.96l2.91 2.26C4.6 5.05 6.62 3.48 9 3.48"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "#4285F4",
-    d: "M17.64 9.2c0-.74-.06-1.28-.19-1.84H9v3.34h4.96c-.1.83-.64 2.08-1.84 2.92l2.84 2.2c1.7-1.57 2.68-3.88 2.68-6.62"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "#FBBC05",
-    d: "M3.88 10.78A5.5 5.5 0 0 1 3.58 9c0-.62.11-1.22.29-1.78L.96 4.96A9 9 0 0 0 0 9c0 1.45.35 2.82.96 4.04z"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "#34A853",
-    d: "M9 18c2.43 0 4.47-.8 5.96-2.18l-2.84-2.2c-.76.53-1.78.9-3.12.9-2.38 0-4.4-1.57-5.12-3.74L.97 13.04C2.45 15.98 5.48 18 9 18"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    fill: "none",
-    d: "M0 0h18v18H0z"
-  }))));
-};
-
-/**
- * A component for a Google login button, according to their design language.
- * This works when an identity provider is configured in the admin dashboard.
- * @param props href: a string to override the URL provided by the context
- * @returns a JSX.Element to render
- */
-function GoogleSSOButton(props) {
-  const {
-    callbackUrl
-  } = props;
-  return /*#__PURE__*/React.createElement(Box, {
-    display: "flex",
-    flex: 1,
-    sx: {
-      textDecoration: 'none'
-    },
-    onClick: () => {
-      react.signIn('google', {
-        callbackUrl
-      });
-    }
-  }, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
-    sx: {
-      padding: 0,
-      textTransform: 'initial',
-      flex: 1
-    },
-    "aria-label": "log in with google"
-  }, /*#__PURE__*/React.createElement(Stack, {
-    direction: "row",
-    alignItems: "center",
-    p: 0,
-    flex: 1,
-    fontFamily: "Roboto, sans-serif",
-    fontSize: "14px",
-    display: "inline-flex",
-    color: "rgb(255 255, 255)",
-    boxShadow: "rgb(0 0 0 / 24%) 0px 2px 2px 0px rgb(0 0 0 / 24%) 0px 0px 1px 0px",
-    borderRadius: "4px",
-    border: "1px solid transparent",
-    fontWeight: "500",
-    sx: {
-      backgroundColor: 'rgb(66 133, 244)'
-    }
-  }, /*#__PURE__*/React.createElement(Box, {
-    padding: "11px",
-    display: "flex",
-    border: "1px solid rgb(66, 133, 244)",
-    borderRadius: "4px",
-    sx: {
-      background: 'rgb(255, 255, 255)'
-    }
-  }, /*#__PURE__*/React.createElement(SvgGoogle, {
-    "aria-hidden": "true"
-  })), /*#__PURE__*/React.createElement(Box, {
-    padding: "10px",
-    flex: 1
-  }, /*#__PURE__*/React.createElement(Typography, {
-    sx: {
-      color: 'white'
-    },
-    fontWeight: 700,
-    fontFamily: "Roboto, sans-serif",
-    fontSize: "14px",
-    height: "20px"
-  }, "Continue with Google"))))));
-}
-
-function CheckGroup(props) {
-  const {
-    options,
-    attribute,
-    display,
-    helperText
-  } = props;
-  const {
-    watch,
-    control
-  } = reactHookForm.useFormContext();
-  const currentVals = watch(attribute.name);
-  const checkProps = {};
-  if (helperText) {
-    checkProps.color = 'danger';
-  }
-  return /*#__PURE__*/React__namespace.createElement(reactHookForm.Controller, {
-    name: attribute.name,
-    rules: {
-      required: Boolean(attribute.required)
-    },
-    control: control,
-    render: ({
-      field
-    }) => {
-      return /*#__PURE__*/React__namespace.createElement(Stack, null, /*#__PURE__*/React__namespace.createElement(FormLabel, {
-        htmlFor: `${field.name}`
-      }, display.label), /*#__PURE__*/React__namespace.createElement(Box, {
-        role: "group",
-        "aria-labelledby": attribute.name,
-        sx: {
-          borderRadius: 'var(--joy-radius-sm)',
-          p: 0.5,
-          border: helperText ? '1px solid var(--joy-palette-danger-outlinedBorder)' : 'none'
-        }
-      }, /*#__PURE__*/React__namespace.createElement(List, {
-        orientation: "horizontal",
-        wrap: true,
-        sx: {
-          '--List-gap': '8px'
-        }
-      }, options.map(item => {
-        checkProps.id = String(item.value);
-        return /*#__PURE__*/React__namespace.createElement(ListItem, {
-          key: `${item.value}-${item.label}`
-        }, /*#__PURE__*/React__namespace.createElement(Checkbox, {
-          overlay: options.length > 1,
-          ...checkProps,
-          checked: currentVals.includes(item.value),
-          disableIcon: options.length > 1,
-          variant: "soft",
-          label: item.label,
-          onChange: event => {
-            if (attribute.allowMultiple) {
-              if (event.target.checked) {
-                if (!currentVals) {
-                  field.onChange([item.value]);
-                } else {
-                  field.onChange(currentVals.concat(item.value));
-                }
-              } else {
-                const remaining = currentVals.filter(val => val !== item.value);
-                if (remaining.length > 0) {
-                  field.onChange(remaining);
-                } else {
-                  field.onChange('');
-                }
-              }
-            } else {
-              if (event.target.checked) {
-                field.onChange(item.value);
-              } else {
-                field.onChange('');
-              }
-            }
-          }
-        }));
-      }))), /*#__PURE__*/React__namespace.createElement(Typography, {
-        sx: {
-          color: 'var(--joy-palette-danger-500)'
-        },
-        level: "body-sm"
-      }, helperText));
-    }
-  });
-}
-
-exports.FormAttributeType = void 0;
-(function (AttributeType) {
-  AttributeType["Text"] = "text";
-  AttributeType["Email"] = "email";
-  AttributeType["Password"] = "password";
-  AttributeType["Select"] = "select";
-  AttributeType["Number"] = "number";
-  AttributeType["Float"] = "float";
-  AttributeType["Checkbox"] = "checkbox";
-  AttributeType["Switch"] = "switch";
-})(exports.FormAttributeType || (exports.FormAttributeType = {}));
-
-const getAttributeDefault = attribute => {
-  // have to look to see if it is an enum
-  if (attribute.allowMultiple === true) {
-    if (!Array.isArray(attribute.defaultValue) && attribute.defaultValue) {
-      if (typeof attribute.defaultValue === 'number') {
-        return [attribute.defaultValue];
-      }
-      return [String(attribute.defaultValue)];
-    }
-  }
-  return attribute.defaultValue ?? '';
-};
-function Labler(props) {
-  const {
-    error,
-    attr
-  } = props;
-  if (error) {
-    return /*#__PURE__*/React.createElement(Tooltip, {
-      title: error,
-      color: "danger",
-      sx: {
-        cursor: 'pointer'
-      }
-    }, /*#__PURE__*/React.createElement(FormLabel, null, attr.label ?? attr.name, /*#__PURE__*/React.createElement(Error$1, {
-      sx: {
-        ml: 0.5,
-        '--Icon-color': '#c41c1c'
-      },
-      fontSize: "small"
-    })));
-  }
-  return /*#__PURE__*/React.createElement(FormLabel, null, attr.label ?? attr.name);
-}
-function SimpleForm(props) {
-  const {
-    mutation,
-    buttonText,
-    attributes,
-    cancelButton,
-    loading,
-    successMessage
-  } = props;
-  const defaultValues = React.useMemo(() => attributes.reduce((accum, attr) => {
-    accum[attr.name] = getAttributeDefault(attr);
-    return accum;
-  }, {}), [attributes]);
-  const methods = reactHookForm.useForm({
-    defaultValues
-  });
-  const {
-    register,
-    control,
-    handleSubmit,
-    formState: {
-      errors
-    }
-  } = methods;
-  const onSubmit = React.useCallback(
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  data => {
-    mutation.mutate(data);
-  }, [mutation]);
-  return /*#__PURE__*/React.createElement(reactHookForm.FormProvider, {
-    ...methods
-  }, /*#__PURE__*/React.createElement(Stack, {
-    component: "form",
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    onSubmit: handleSubmit(data => onSubmit(data)),
-    spacing: 2
-  }, attributes.map(attr => {
-    const fieldConfig = {};
-    const display = {
-      key: attr.name,
-      label: attr.label ?? attr.name,
-      id: attr.label ?? attr.name,
-      placeholder: attr.placeholder ?? attr.label ?? attr.name,
-      error: Boolean(errors[attr.name]),
-      disabled: Boolean(attr.disabled)
-    };
-    const options = attr.options ?? [];
-    const helperText = attr.helpText ?? '';
-    let error = '';
-    if (attr.required) {
-      error = errors[attr.name] ? `${attr.label ?? attr.name} is required` : '';
-      fieldConfig.required = true;
-    }
-    switch (attr.type) {
-      case exports.FormAttributeType.Switch:
-        return /*#__PURE__*/React.createElement(FormControl, {
-          key: display.key,
-          id: display.id,
-          orientation: "horizontal",
-          sx: {
-            alignItems: 'center'
-          },
-          required: attr.required
-        }, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Labler, {
-          error: error,
-          attr: attr
-        }), /*#__PURE__*/React.createElement(FormHelperText, {
-          id: `${attr.name}-helper-text`
-        }, helperText)), /*#__PURE__*/React.createElement(reactHookForm.Controller, {
-          control: control,
-          rules: {
-            required: Boolean(attr.required)
-          },
-          name: attr.name,
-          render: ({
-            field
-          }) => {
-            const color = {};
-            if (errors[attr.name]) {
-              color.color = 'danger';
-            }
-            return /*#__PURE__*/React.createElement(joy.Switch, {
-              id: `switch-field-${attr.name}`,
-              ...color,
-              ...field,
-              checked: Boolean(field.value),
-              onChange: event => {
-                field.onChange(event.target.checked);
-              },
-              color: field.value ? 'success' : 'neutral',
-              endDecorator: field.value ? options[0].label : options[1].label
-            });
-          }
-        }));
-      case exports.FormAttributeType.Checkbox:
-        return /*#__PURE__*/React.createElement(CheckGroup, {
-          key: display.key,
-          attribute: attr,
-          display: display,
-          options: options,
-          helperText: helperText
-        });
-      case exports.FormAttributeType.Select:
-        return /*#__PURE__*/React.createElement(FormControl, {
-          key: display.key,
-          id: display.id,
-          required: attr.required
-        }, /*#__PURE__*/React.createElement(Labler, {
-          error: error,
-          attr: attr
-        }), /*#__PURE__*/React.createElement(reactHookForm.Controller, {
-          control: control,
-          rules: {
-            required: Boolean(attr.required)
-          },
-          name: attr.name,
-          render: ({
-            field
-          }) => {
-            const color = {};
-            if (errors[attr.name]) {
-              color.color = 'danger';
-            }
-            const value = String(field.value);
-            return /*#__PURE__*/React.createElement(Stack, null, /*#__PURE__*/React.createElement(Select, {
-              id: `select-field-${attr.name}`,
-              placeholder: `${display.placeholder}...`,
-              ...color,
-              ...field,
-              value: value,
-              onChange: (_, newValue) => {
-                field.onChange(newValue);
-              }
-            }, options.map(option => {
-              return /*#__PURE__*/React.createElement(Option, {
-                key: String(option.value ?? ''),
-                value: option.value
-              }, option.label);
-            })), /*#__PURE__*/React.createElement(FormHelperText, {
-              id: `${attr.name}-helper-text`
-            }, helperText));
-          }
-        }));
-      case exports.FormAttributeType.Password:
-        return /*#__PURE__*/React.createElement(FormControl, {
-          key: display.key,
-          id: display.id,
-          required: attr.required
-        }, /*#__PURE__*/React.createElement(Labler, {
-          error: error,
-          attr: attr
-        }), /*#__PURE__*/React.createElement(Input, {
-          ...display,
-          ...register(attr.name, fieldConfig),
-          type: exports.FormAttributeType.Password
-        }), /*#__PURE__*/React.createElement(FormHelperText, {
-          id: `${attr.name}-helper-text`
-        }, helperText));
-      case exports.FormAttributeType.Number:
-        return /*#__PURE__*/React.createElement(FormControl, {
-          key: display.key,
-          id: display.id,
-          required: attr.required
-        }, /*#__PURE__*/React.createElement(Labler, {
-          error: error,
-          attr: attr
-        }), /*#__PURE__*/React.createElement(Input, {
-          ...display,
-          ...register(attr.name, fieldConfig),
-          type: exports.FormAttributeType.Number
-        }), /*#__PURE__*/React.createElement(FormHelperText, {
-          id: `${attr.name}-helper-text`
-        }, helperText));
-      case exports.FormAttributeType.Text:
-      default:
-        return /*#__PURE__*/React.createElement(FormControl, {
-          key: display.key,
-          id: display.id,
-          required: attr.required
-        }, /*#__PURE__*/React.createElement(Labler, {
-          error: error,
-          attr: attr
-        }), /*#__PURE__*/React.createElement(Input, {
-          ...display,
-          ...register(attr.name, fieldConfig)
-        }), /*#__PURE__*/React.createElement(FormHelperText, {
-          id: `${attr.name}-helper-text`
-        }, helperText));
-    }
-  }), cancelButton ? ( /*#__PURE__*/React.createElement(Stack, {
-    spacing: 2,
-    direction: "row"
-  }, cancelButton, /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Button, {
-    type: "submit"
-  }, buttonText)))) : ( /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Stack, {
-    direction: "row",
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "submit",
-    loading: loading
-  }, buttonText), successMessage)))));
-}
-
-function SignUpForm(props) {
-  const [error, setError] = React.useState();
-  const {
-    buttonText = 'Sign up',
-    onSuccess,
-    onError,
-    attributes,
-    beforeMutate
-  } = props;
-  const api = useApi();
-  const mutation = reactQuery.useMutation(async _data => {
-    setError(undefined);
-    const possibleData = beforeMutate && beforeMutate(_data);
-    const data = {
-      ..._data,
-      ...possibleData
-    };
-    const {
-      name,
-      givenName,
-      familyName,
-      picture,
-      email,
-      password,
-      newTenantName,
-      ...metadata
-    } = data;
-    if (Object.keys(metadata).length > 0) {
-      // eslint-disable-next-line no-console
-      console.warn('additional metadata not supported yet.');
-    }
-    return await api.users.createUser({
-      createBasicUserRequest: {
-        email,
-        password,
-        name,
-        familyName,
-        picture,
-        givenName,
-        newTenantName
-      }
-    });
-  }, {
-    onSuccess,
-    onError: (e, vars) => {
-      setError(e.message);
-      onError && onError(e, vars);
-    }
-  });
-  const completeAttributes = React.useMemo(() => {
-    const mainAttributes = [{
-      name: 'email',
-      label: 'Email',
-      type: exports.FormAttributeType.Email,
-      defaultValue: '',
-      required: true
-    }, {
-      name: 'password',
-      label: 'Password',
-      type: exports.FormAttributeType.Password,
-      defaultValue: '',
-      required: true
-    }];
-    if (attributes && attributes.length > 0) {
-      return mainAttributes.concat(attributes);
-    }
-    return mainAttributes;
-  }, [attributes]);
-  return /*#__PURE__*/React.createElement(Stack, {
-    gap: 2
-  }, error ? /*#__PURE__*/React.createElement(Alert, {
-    color: "danger"
-  }, error) : null, /*#__PURE__*/React.createElement(SimpleForm, {
-    mutation: mutation,
-    buttonText: buttonText,
-    attributes: completeAttributes
-  }));
-}
-
-function SignInForm(props) {
-  const [error, setError] = React.useState();
-  const {
-    attributes,
-    onSuccess,
-    onError,
-    beforeMutate,
-    callbackUrl
-  } = props;
-  const mutation = reactQuery.useMutation(async _data => {
-    setError(undefined);
-    const d = {
-      ..._data,
-      callbackUrl
-    };
-    const possibleData = beforeMutate && beforeMutate(d);
-    const data = possibleData ?? d;
-    react.signIn('credentials', data);
-  }, {
-    onSuccess,
-    onError
-  });
-  const completeAttributes = React.useMemo(() => {
-    const mainAttributes = [{
-      name: 'email',
-      label: 'Email',
-      type: exports.FormAttributeType.Text,
-      defaultValue: '',
-      required: true
-    }, {
-      name: 'password',
-      label: 'Password',
-      type: exports.FormAttributeType.Password,
-      defaultValue: '',
-      required: true
-    }];
-    if (attributes && attributes.length > 0) {
-      return mainAttributes.concat(attributes);
-    }
-    return mainAttributes;
-  }, [attributes]);
-  return /*#__PURE__*/React.createElement(Stack, {
-    gap: 2
-  }, error ? /*#__PURE__*/React.createElement(Alert, {
-    color: "danger"
-  }, error) : null, /*#__PURE__*/React.createElement(SimpleForm, {
-    mutation: mutation,
-    buttonText: "Log in",
-    attributes: completeAttributes
-  }));
-}
-
-/* eslint-disable @typescript-eslint/no-explicit-any */
-function AddUser(props) {
-  const {
-    open,
-    setOpen,
-    refetch
-  } = props;
-  const {
-    tenantId
-  } = useNileConfig();
-  const api = useApi();
-  const [errorText, setErrorText] = React.useState();
-  const {
-    watch,
-    register,
-    handleSubmit
-  } = reactHookForm.useForm();
-  const email = watch('email');
-  React.useEffect(() => {
-    if (errorText != null) {
-      setErrorText();
-    }
-    // if email changes, no more error
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [email]);
-  const mutation = reactQuery.useMutation(data => api.users.createTenantUser({
-    createBasicUserRequest: data,
-    tenantId: String(tenantId)
-  }), {
-    onSuccess(data) {
-      refetch && refetch(data);
-      setOpen(false);
-    },
-    onError(e) {
-      if (e instanceof Error) {
-        setErrorText(e.message);
-      }
-    }
-  });
-  const handleUpdate = React.useCallback(async data => {
-    setErrorText('');
-    mutation.mutate(data);
-  }, [mutation]);
-  return /*#__PURE__*/React.createElement(joy.Modal, {
-    open: open
-  }, /*#__PURE__*/React.createElement(joy.ModalDialog, null, /*#__PURE__*/React.createElement(joy.Stack, {
-    spacing: 2
-  }, /*#__PURE__*/React.createElement(joy.Typography, {
-    level: "h4"
-  }, "Create user"), /*#__PURE__*/React.createElement(React.Fragment, null, errorText && /*#__PURE__*/React.createElement(joy.Typography, {
-    color: "danger"
-  }, errorText)), /*#__PURE__*/React.createElement(joy.Stack, {
-    component: "form",
-    sx: {
-      width: '40ch'
-    },
-    spacing: 1,
-    onSubmit: handleSubmit(data => handleUpdate(data))
-  }, /*#__PURE__*/React.createElement(joy.FormControl, {
-    sx: {
-      '--FormHelperText-color': 'var(--joy-palette-danger-500)'
-    }
-  }, /*#__PURE__*/React.createElement(joy.FormLabel, {
-    htmlFor: "email"
-  }, "Email"), /*#__PURE__*/React.createElement(joy.Input, {
-    ...register('email'),
-    fullWidth: true,
-    size: "lg",
-    id: "email",
-    name: "email",
-    autoComplete: "current-email",
-    required: true,
-    error: Boolean(errorText)
-  })), /*#__PURE__*/React.createElement(joy.FormControl, {
-    sx: {
-      '--FormHelperText-color': 'var(--joy-palette-danger-500)'
-    }
-  }, /*#__PURE__*/React.createElement(joy.FormLabel, {
-    htmlFor: "password"
-  }, "Password"), /*#__PURE__*/React.createElement(joy.Input, {
-    ...register('password'),
-    fullWidth: true,
-    size: "lg",
-    id: "password",
-    autoComplete: "current-password",
-    type: "password",
-    required: true
-  })), /*#__PURE__*/React.createElement(joy.Stack, {
-    direction: "row",
-    sx: {
-      pt: 2
-    },
-    spacing: 2
-  }, /*#__PURE__*/React.createElement(joy.Button, {
-    onClick: () => setOpen(false),
-    variant: "plain"
-  }, "Cancel"), /*#__PURE__*/React.createElement(joy.Button, {
-    type: "submit"
-  }, "Create"))))));
-}
-
-function CreateUser(props) {
-  const {
-    allowCreation,
-    buttonText,
-    onUserCreateSuccess
-  } = props;
-  const [open, setOpen] = React.useState(false);
-  if (!allowCreation) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(Stack, {
-    alignItems: "flex-end",
-    gap: 1
-  }, /*#__PURE__*/React.createElement(AddUser, {
-    open: open,
-    setOpen: setOpen,
-    refetch: onUserCreateSuccess
-  }), /*#__PURE__*/React.createElement(Button, {
-    startDecorator: /*#__PURE__*/React.createElement(Add, null),
-    size: "sm",
-    onClick: () => setOpen(true)
-  }, buttonText));
-}
-
-function getColumnSize(column, rows, canvasContext) {
-  const dataWidthReducer = (longest,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  nextRow) => {
-    let value = nextRow[String(column)];
-    if (value == null) {
-      value = '';
-    }
-    value = value?.toString();
-    return longest.length > value.length ? longest : value;
-  };
-  let columnHeaderLen = canvasContext && column ? canvasContext.measureText(String(column)).width : 50;
-  /* padding 12, icon-width 15 */
-  columnHeaderLen += 15 + 12;
-  let width = columnHeaderLen;
-  width = 16 + Math.ceil(canvasContext ? canvasContext.measureText(rows.reduce(dataWidthReducer, '')).width : 50);
-  if (width < columnHeaderLen) {
-    width = columnHeaderLen;
-  }
-  /* Gracefull */
-  width += 8;
-  return width;
-}
-
-function useTextSizer() {
-  const [ctx, setCtx] = React.useState();
-  React.useEffect(() => {
-    const canvas = document.createElement('canvas');
-    const canvasContext = canvas.getContext('2d');
-    if (canvasContext) {
-      canvasContext.font = '18px Roboto';
-      setCtx(canvasContext);
-    }
-  }, []);
-  return ctx;
-}
-
-const makeRenderable = vals => {
-  return Object.keys(vals).reduce((cleaned, key) => {
-    const val = vals[key];
-    if (val instanceof Set) {
-      cleaned[key] = Array.from(val).join(', ');
-    } else if (Array.isArray(val)) {
-      cleaned[key] = val.join(', ');
-    } else {
-      cleaned[key] = val;
-    }
-    return cleaned;
-  }, {});
-};
-const parseResults = (data, ctx, include) => {
-  if (!data) {
-    return [[], []];
-  }
-  const rows = data.map(makeRenderable);
-  const fields = Object.keys(rows[0]);
-  const existentCols = {};
-  const mapCols = col => {
-    const width = getColumnSize(col, rows, ctx);
-    const name = col.slice();
-    if (include.includes(name)) {
-      // add spaces to the end of column names so they are not duplicated in the UI
-      if (existentCols[name] == null) {
-        existentCols[name] = name.length;
-      } else {
-        existentCols[name] += 1;
-      }
-      return {
-        field: name.padEnd(existentCols[name]),
-        headerName: name.padEnd(existentCols[name]),
-        width
-      };
-    }
-  };
-  const cols = fields?.map(mapCols).filter(Boolean) ?? [];
-  return [cols, rows];
-};
-function useDataParser(data, include) {
-  const ctx = useTextSizer();
-  const [cols, rows] = React.useMemo(() => parseResults(data, ctx, include), [data, ctx, include]);
-  return [cols, rows];
-}
-
-function UserList(props) {
-  const {
-    data,
-    allowCreation = true,
-    buttonText = 'Add a user',
-    onUserCreateSuccess,
-    slots,
-    include = ['email', 'preferredName']
-  } = props;
-  const dataGridSx = {
-    width: '100%',
-    height: '100%',
-    ...(slots?.dataGrid ?? {})
-  };
-  const [columns, rows] = useDataParser(data, include);
-  return /*#__PURE__*/React.createElement(Stack, {
-    flex: 1
-  }, /*#__PURE__*/React.createElement(CreateUser, {
-    allowCreation: allowCreation,
-    buttonText: buttonText,
-    onUserCreateSuccess: onUserCreateSuccess
-  }), /*#__PURE__*/React.createElement(xDataGrid.DataGrid, {
-    sx: dataGridSx,
-    rows: rows,
-    columns: columns,
-    hideFooter: true
-  }));
-}
-
-exports.Google = GoogleSSOButton;
-exports.NileProvider = NileProvider;
-exports.SignInForm = SignInForm;
-exports.SignUpForm = SignUpForm;
-exports.UserTenantList = UserList;
-exports.useApi = useApi;
-Object.keys(react).forEach(function (k) {
-  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
-    enumerable: true,
-    get: function () { return react[k]; }
-  });
-});
-//# sourceMappingURL=react.cjs.development.js.map