udp-react-enterprise-component-library 25.16.2-beta.1 → 25.16.2-beta.2

package/dist/FluentTextField-CgQcsDtq.js

@@ -0,0 +1,68 @@
+import React, { forwardRef } from "react";
+import { TextField, makeStyles } from "@material-ui/core";
+
+//#region src/UI/inputs/textField/FluentTextField.jsx
+const useStyles = makeStyles((theme) => ({
+	input: {
+		borderRadius: 2,
+		height: (props) => !props.multiline && !Array.isArray(props.value) && 32,
+		padding: (props) => !props.multiline && 0,
+		marginTop: 3
+	},
+	formTextInput: { fontSize: 14 },
+	labelRoot: { fontSize: 14 },
+	FormControl: {
+		display: "none",
+		marginTop: 0
+	},
+	root: {
+		marginTop: 25,
+		"& .MuiFormLabel-root": {
+			marginTop: -27,
+			marginLeft: -15
+		},
+		"& .MuiInputAdornment-root": { paddingLeft: theme.spacing(1) }
+	},
+	noLabel: { marginTop: theme.spacing(1) }
+}));
+const FluentTextFieldComponent = (props, ref) => {
+	const classes = useStyles(props);
+	const { id, label, startAdornment, endAdornment, udprecordid, inputProps,...InputProps } = props;
+	return /* @__PURE__ */ React.createElement("div", { className: label ? classes.root : classes.noLabel }, /* @__PURE__ */ React.createElement(TextField, {
+		...InputProps,
+		id,
+		variant: "outlined",
+		size: "small",
+		inputRef: ref,
+		margin: "dense",
+		label,
+		classes: { label: classes.label },
+		inputProps: {
+			id,
+			udprecordid,
+			...inputProps
+		},
+		InputProps: {
+			classes: {
+				root: classes.input,
+				input: classes.formTextInput,
+				...props.InputProps?.classes
+			},
+			...props.InputProps,
+			...startAdornment,
+			...endAdornment
+		},
+		InputLabelProps: {
+			shrink: false,
+			classes: {
+				root: classes.labelRoot,
+				focused: classes.labelFocused
+			}
+		}
+	}));
+};
+const FluentTextField = forwardRef(FluentTextFieldComponent);
+
+//#endregion
+export { FluentTextFieldComponent as n, FluentTextField as t };
+//# sourceMappingURL=FluentTextField-CgQcsDtq.js.map

package/dist/FluentTextField-CgQcsDtq.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentTextField-CgQcsDtq.js","names":[],"sources":["../src/UI/inputs/textField/FluentTextField.jsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { makeStyles, TextField } from '@material-ui/core';\n\nconst useStyles = makeStyles((theme) => ({\n  input: {\n    borderRadius: 2,\n    height: (props) => !props.multiline && !Array.isArray(props.value) && 32, // multiline or multiselect\n    padding: (props) => !props.multiline && 0,\n    marginTop: 3\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  },\n  FormControl: {\n    display: 'none',\n    marginTop: 0\n  },\n  root: {\n    marginTop: 25,\n    '& .MuiFormLabel-root': {\n      marginTop: -27,\n      marginLeft: -15\n    },\n    '& .MuiInputAdornment-root': {\n      paddingLeft: theme.spacing(1)\n    }\n  },\n  noLabel: {\n    marginTop: theme.spacing(1)\n  }\n}));\n\nexport const FluentTextFieldComponent = (props, ref) => {\n  const classes = useStyles(props);\n  const {\n    id,\n    label,\n    startAdornment,\n    endAdornment,\n    udprecordid,\n    inputProps,\n    ...InputProps\n  } = props;\n  return (\n    <div className={label ? classes.root : classes.noLabel}>\n      <TextField\n        {...InputProps}\n        id={id}\n        variant='outlined'\n        size='small'\n        inputRef={ref}\n        margin='dense'\n        label={label}\n        classes={{ label: classes.label }}\n        inputProps={{ id: id, udprecordid: udprecordid, ...inputProps }}\n        InputProps={{\n          classes: {\n            root: classes.input,\n            input: classes.formTextInput,\n            ...props.InputProps?.classes\n          },\n          ...props.InputProps,\n          ...startAdornment,\n          ...endAdornment\n        }}\n        InputLabelProps={{\n          shrink: false,\n          classes: {\n            root: classes.labelRoot,\n            focused: classes.labelFocused\n          }\n        }}\n      />\n    </div>\n  );\n};\n\nexport const FluentTextField = forwardRef(FluentTextFieldComponent);\n"],"mappings":";;;;AAGA,MAAM,YAAY,YAAY,WAAW;CACvC,OAAO;EACL,cAAc;EACd,SAAS,UAAU,CAAC,MAAM,aAAa,CAAC,MAAM,QAAQ,MAAM,MAAM,IAAI;EACtE,UAAU,UAAU,CAAC,MAAM,aAAa;EACxC,WAAW;EACZ;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACD,aAAa;EACX,SAAS;EACT,WAAW;EACZ;CACD,MAAM;EACJ,WAAW;EACX,wBAAwB;GACtB,WAAW;GACX,YAAY;GACb;EACD,6BAA6B,EAC3B,aAAa,MAAM,QAAQ,EAAE,EAC9B;EACF;CACD,SAAS,EACP,WAAW,MAAM,QAAQ,EAAE,EAC5B;CACF,EAAE;AAEH,MAAa,4BAA4B,OAAO,QAAQ;CACtD,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EACJ,IACA,OACA,gBACA,cACA,aACA,WACA,GAAG,eACD;AACJ,QACE,oCAAC,SAAI,WAAW,QAAQ,QAAQ,OAAO,QAAQ,WAC7C,oCAAC;EACC,GAAI;EACA;EACJ,SAAQ;EACR,MAAK;EACL,UAAU;EACV,QAAO;EACA;EACP,SAAS,EAAE,OAAO,QAAQ,OAAO;EACjC,YAAY;GAAM;GAAiB;GAAa,GAAG;GAAY;EAC/D,YAAY;GACV,SAAS;IACP,MAAM,QAAQ;IACd,OAAO,QAAQ;IACf,GAAG,MAAM,YAAY;IACtB;GACD,GAAG,MAAM;GACT,GAAG;GACH,GAAG;GACJ;EACD,iBAAiB;GACf,QAAQ;GACR,SAAS;IACP,MAAM,QAAQ;IACd,SAAS,QAAQ;IAClB;GACF;GACD,CACE;;AAIV,MAAa,kBAAkB,WAAW,yBAAyB"}

package/dist/FluentTextFieldAutoComplete-DiwMTnol.js

@@ -0,0 +1,100 @@
+import React, { useCallback, useState } from "react";
+import { Popper, TextField, makeStyles } from "@material-ui/core";
+import Autocomplete from "@material-ui/lab/Autocomplete";
+import clsx from "clsx";
+
+//#region src/UI/inputs/textField/FluentTextFieldAutoComplete.jsx
+const useStyles = makeStyles((theme) => ({
+	formTextInput: { fontSize: 14 },
+	labelRoot: { fontSize: 14 }
+}));
+const AutoCompletePopper = (props) => {
+	return /* @__PURE__ */ React.createElement(Popper, {
+		...props,
+		placement: "bottom-start"
+	});
+};
+const FluentTextFieldAutoComplete = (props) => {
+	const { label, placeholder, options, textFieldProps, disabled, onChange: onChangeProp, value, optionKey, additionalOnChangeAction, classes: classProps, variant = "outlined", inputProps, inputPropClasses, customPopper, disableClearable = false, defaultValue, additionalOptionKey, isMultiple = false, limitTags, renderTags, optionLabelDisplayFunction = (option) => option, groupBy = null, size = "medium", id, udprecordid, freeSolo = false, formatUserInputValue,...other } = props;
+	const classes = useStyles();
+	const { autocompleteRoot } = classProps || {};
+	const [inputValue, setInputValue] = useState("");
+	const onChange = useCallback((e, value$1) => {
+		if (additionalOnChangeAction) additionalOnChangeAction(value$1);
+		return onChangeProp?.(value$1);
+	}, [onChangeProp, additionalOnChangeAction]);
+	const handleInputChange = useCallback((e, newInputValue) => {
+		setInputValue(newInputValue ?? "");
+	}, []);
+	const handleClose = useCallback((event, reason) => {
+		if (!freeSolo) return;
+		if (isMultiple) return;
+		if (value && typeof value === "object") return;
+		const raw = (inputValue || "").trim();
+		if (!raw) return;
+		if (reason === "blur" || reason === "enter" || reason === "create-option") {
+			const updatedValue = formatUserInputValue ? formatUserInputValue(raw) : raw;
+			if (additionalOnChangeAction) additionalOnChangeAction(updatedValue);
+			onChangeProp?.(updatedValue);
+		}
+	}, [
+		freeSolo,
+		isMultiple,
+		value,
+		inputValue,
+		formatUserInputValue,
+		additionalOnChangeAction,
+		onChangeProp
+	]);
+	return /* @__PURE__ */ React.createElement(Autocomplete, {
+		id: "autocomplete",
+		multiple: isMultiple,
+		limitTags,
+		disabled,
+		options: options || [],
+		getOptionLabel: (option) => option && (optionKey ? `${optionLabelDisplayFunction(option[optionKey])}${additionalOptionKey ? ` - (${option[additionalOptionKey]})` : ""}` : optionLabelDisplayFunction(option) || ""),
+		getOptionSelected: (option, val) => optionKey ? option[optionKey] === val[optionKey] : option === val,
+		groupBy,
+		onChange,
+		inputValue,
+		onInputChange: handleInputChange,
+		onClose: handleClose,
+		value: value || (isMultiple ? [] : null),
+		className: autocompleteRoot,
+		classes: { root: classProps?.formControl },
+		PopperComponent: customPopper || AutoCompletePopper,
+		disableClearable,
+		defaultValue,
+		size,
+		renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, {
+			...textFieldProps,
+			...params,
+			...other,
+			inputProps: {
+				...params.inputProps,
+				id,
+				udprecordid
+			},
+			label,
+			margin: "dense",
+			variant,
+			placeholder,
+			size: "small",
+			InputProps: {
+				...params.InputProps,
+				...inputProps,
+				classes: {
+					root: classProps?.inputPropRoot,
+					input: clsx(classes.formTextInput, classProps?.inputPropInput)
+				}
+			},
+			InputLabelProps: { classes: { root: clsx(classes.labelRoot, classProps?.formLabelRoot) } }
+		}),
+		renderTags,
+		freeSolo
+	});
+};
+
+//#endregion
+export { FluentTextFieldAutoComplete as t };
+//# sourceMappingURL=FluentTextFieldAutoComplete-DiwMTnol.js.map

package/dist/FluentTextFieldAutoComplete-DiwMTnol.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentTextFieldAutoComplete-DiwMTnol.js","names":["value"],"sources":["../src/UI/inputs/textField/FluentTextFieldAutoComplete.jsx"],"sourcesContent":["/* eslint-disable no-use-before-define */\nimport React, { useCallback, useState } from 'react';\nimport { TextField, makeStyles, Popper } from '@material-ui/core';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport clsx from 'clsx';\n\nconst useStyles = makeStyles((theme) => ({\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  }\n}));\n\nconst AutoCompletePopper = (props) => {\n  return <Popper {...props} placement='bottom-start' />;\n};\n\nexport const FluentTextFieldAutoComplete = (props) => {\n  const {\n    label,\n    placeholder,\n    options,\n    textFieldProps,\n    disabled,\n    onChange: onChangeProp,\n    value,\n    optionKey,\n    additionalOnChangeAction,\n    classes: classProps,\n    variant = 'outlined',\n    inputProps,\n    inputPropClasses,\n    customPopper,\n    disableClearable = false,\n    defaultValue,\n    additionalOptionKey,\n    isMultiple = false,\n    limitTags,\n    renderTags,\n    optionLabelDisplayFunction = (option) => option,\n    groupBy = null,\n    size = 'medium',\n    id,\n    udprecordid,\n    freeSolo = false,\n    formatUserInputValue,\n    ...other\n  } = props;\n\n  const classes = useStyles();\n  const { autocompleteRoot } = classProps || {};\n  const [inputValue, setInputValue] = useState('');\n\n  const onChange = useCallback(\n    (e, value) => {\n      if (additionalOnChangeAction) {\n        additionalOnChangeAction(value);\n      }\n      return onChangeProp?.(value);\n    },\n    [onChangeProp, additionalOnChangeAction]\n  );\n\n  const handleInputChange = useCallback((e, newInputValue) => {\n    setInputValue(newInputValue ?? '');\n  }, []);\n\n  const handleClose = useCallback(\n    (event, reason) => {\n      if (!freeSolo) return;\n      if (isMultiple) return;\n\n      if (value && typeof value === 'object') return;\n\n      const raw = (inputValue || '').trim();\n      if (!raw) return;\n\n      if (\n        reason === 'blur' ||\n        reason === 'enter' ||\n        reason === 'create-option'\n      ) {\n        const updatedValue = formatUserInputValue\n          ? formatUserInputValue(raw)\n          : raw;\n        if (additionalOnChangeAction) additionalOnChangeAction(updatedValue);\n        onChangeProp?.(updatedValue);\n      }\n    },\n    [\n      freeSolo,\n      isMultiple,\n      value,\n      inputValue,\n      formatUserInputValue,\n      additionalOnChangeAction,\n      onChangeProp\n    ]\n  );\n\n  return (\n    <Autocomplete\n      id='autocomplete'\n      multiple={isMultiple}\n      limitTags={limitTags}\n      disabled={disabled}\n      options={options || []}\n      getOptionLabel={(option) =>\n        option &&\n        (optionKey\n          ? `${optionLabelDisplayFunction(option[optionKey])}${\n              additionalOptionKey ? ` - (${option[additionalOptionKey]})` : ''\n            }`\n          : optionLabelDisplayFunction(option) || '')\n      }\n      getOptionSelected={(option, val) =>\n        optionKey ? option[optionKey] === val[optionKey] : option === val\n      }\n      groupBy={groupBy}\n      onChange={onChange}\n      inputValue={inputValue}\n      onInputChange={handleInputChange}\n      onClose={handleClose}\n      value={value || (isMultiple ? [] : null)}\n      className={autocompleteRoot}\n      classes={{\n        root: classProps?.formControl\n      }}\n      PopperComponent={customPopper || AutoCompletePopper}\n      disableClearable={disableClearable}\n      defaultValue={defaultValue}\n      size={size}\n      renderInput={(params) => (\n        <TextField\n          {...textFieldProps}\n          {...params}\n          {...other}\n          inputProps={{\n            ...params.inputProps,\n            id: id,\n            udprecordid: udprecordid\n          }}\n          label={label}\n          margin='dense'\n          variant={variant}\n          placeholder={placeholder}\n          size='small'\n          InputProps={{\n            ...params.InputProps,\n            ...inputProps,\n            classes: {\n              root: classProps?.inputPropRoot,\n              input: clsx(classes.formTextInput, classProps?.inputPropInput)\n            }\n          }}\n          InputLabelProps={{\n            classes: {\n              root: clsx(classes.labelRoot, classProps?.formLabelRoot)\n            }\n          }}\n        />\n      )}\n      renderTags={renderTags}\n      freeSolo={freeSolo}\n    />\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAM,YAAY,YAAY,WAAW;CACvC,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACF,EAAE;AAEH,MAAM,sBAAsB,UAAU;AACpC,QAAO,oCAAC;EAAO,GAAI;EAAO,WAAU;GAAiB;;AAGvD,MAAa,+BAA+B,UAAU;CACpD,MAAM,EACJ,OACA,aACA,SACA,gBACA,UACA,UAAU,cACV,OACA,WACA,0BACA,SAAS,YACT,UAAU,YACV,YACA,kBACA,cACA,mBAAmB,OACnB,cACA,qBACA,aAAa,OACb,WACA,YACA,8BAA8B,WAAW,QACzC,UAAU,MACV,OAAO,UACP,IACA,aACA,WAAW,OACX,qBACA,GAAG,UACD;CAEJ,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,qBAAqB,cAAc,EAAE;CAC7C,MAAM,CAAC,YAAY,iBAAiB,SAAS,GAAG;CAEhD,MAAM,WAAW,aACd,GAAG,YAAU;AACZ,MAAI,yBACF,0BAAyBA,QAAM;AAEjC,SAAO,eAAeA,QAAM;IAE9B,CAAC,cAAc,yBAAyB,CACzC;CAED,MAAM,oBAAoB,aAAa,GAAG,kBAAkB;AAC1D,gBAAc,iBAAiB,GAAG;IACjC,EAAE,CAAC;CAEN,MAAM,cAAc,aACjB,OAAO,WAAW;AACjB,MAAI,CAAC,SAAU;AACf,MAAI,WAAY;AAEhB,MAAI,SAAS,OAAO,UAAU,SAAU;EAExC,MAAM,OAAO,cAAc,IAAI,MAAM;AACrC,MAAI,CAAC,IAAK;AAEV,MACE,WAAW,UACX,WAAW,WACX,WAAW,iBACX;GACA,MAAM,eAAe,uBACjB,qBAAqB,IAAI,GACzB;AACJ,OAAI,yBAA0B,0BAAyB,aAAa;AACpE,kBAAe,aAAa;;IAGhC;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,QACE,oCAAC;EACC,IAAG;EACH,UAAU;EACC;EACD;EACV,SAAS,WAAW,EAAE;EACtB,iBAAiB,WACf,WACC,YACG,GAAG,2BAA2B,OAAO,WAAW,GAC9C,sBAAsB,OAAO,OAAO,qBAAqB,KAAK,OAEhE,2BAA2B,OAAO,IAAI;EAE5C,oBAAoB,QAAQ,QAC1B,YAAY,OAAO,eAAe,IAAI,aAAa,WAAW;EAEvD;EACC;EACE;EACZ,eAAe;EACf,SAAS;EACT,OAAO,UAAU,aAAa,EAAE,GAAG;EACnC,WAAW;EACX,SAAS,EACP,MAAM,YAAY,aACnB;EACD,iBAAiB,gBAAgB;EACf;EACJ;EACR;EACN,cAAc,WACZ,oCAAC;GACC,GAAI;GACJ,GAAI;GACJ,GAAI;GACJ,YAAY;IACV,GAAG,OAAO;IACN;IACS;IACd;GACM;GACP,QAAO;GACE;GACI;GACb,MAAK;GACL,YAAY;IACV,GAAG,OAAO;IACV,GAAG;IACH,SAAS;KACP,MAAM,YAAY;KAClB,OAAO,KAAK,QAAQ,eAAe,YAAY,eAAe;KAC/D;IACF;GACD,iBAAiB,EACf,SAAS,EACP,MAAM,KAAK,QAAQ,WAAW,YAAY,cAAc,EACzD,EACF;IACD;EAEQ;EACF;GACV"}

package/dist/FluentTimePicker-C_MdYHpE.js

@@ -0,0 +1,67 @@
+import React from "react";
+import { InputAdornment, makeStyles } from "@material-ui/core";
+import { KeyboardTimePicker, MuiPickersUtilsProvider } from "@material-ui/pickers";
+import DateFnsUtils from "@date-io/date-fns";
+import { EventDateIcon } from "@fluentui/react-icons";
+import PropTypes from "prop-types";
+
+//#region src/UI/inputs/pickers/FluentTimePicker.jsx
+const useStyles = makeStyles((theme) => ({
+	root: {},
+	inputRoot: { fontSize: 12 },
+	input: {
+		borderRadius: 2,
+		height: 32,
+		padding: 0,
+		paddingLeft: theme.spacing(1)
+	},
+	formTextInput: { fontSize: 14 },
+	labelRoot: { fontSize: 14 },
+	FormControl: {
+		display: "none",
+		marginTop: 0
+	}
+}));
+const FluentTimePicker = (props) => {
+	const classes = useStyles();
+	const { id, label, startAdornment, endAdornment,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(MuiPickersUtilsProvider, { utils: DateFnsUtils }, /* @__PURE__ */ React.createElement(KeyboardTimePicker, {
+		variant: "inline",
+		margin: "normal",
+		...otherProps,
+		id,
+		inputVariant: "outlined",
+		KeyboardButtonProps: { "aria-label": "change date" },
+		keyboardIcon: /* @__PURE__ */ React.createElement(EventDateIcon, { style: { fontSize: 16 } }),
+		InputProps: {
+			classes: {
+				root: classes.input,
+				input: classes.formTextInput,
+				...props.InputProps?.classes
+			},
+			...props.InputProps,
+			...startAdornment,
+			...endAdornment,
+			startAdornment: /* @__PURE__ */ React.createElement(InputAdornment, {
+				classes: { root: classes.inputRoot },
+				className: classes.inputRoot,
+				position: "start"
+			}, label)
+		},
+		InputLabelProps: {
+			shrink: false,
+			classes: {
+				root: classes.labelRoot,
+				focused: classes.labelFocused
+			}
+		}
+	})));
+};
+FluentTimePicker.propTypes = {
+	label: PropTypes.string,
+	id: PropTypes.string
+};
+
+//#endregion
+export { FluentTimePicker as t };
+//# sourceMappingURL=FluentTimePicker-C_MdYHpE.js.map

package/dist/FluentTimePicker-C_MdYHpE.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentTimePicker-C_MdYHpE.js","names":[],"sources":["../src/UI/inputs/pickers/FluentTimePicker.jsx"],"sourcesContent":["import React from 'react'\nimport { KeyboardTimePicker } from '@material-ui/pickers'\nimport { makeStyles, InputAdornment } from '@material-ui/core'\nimport { EventDateIcon } from '@fluentui/react-icons'\nimport { MuiPickersUtilsProvider } from '@material-ui/pickers'\nimport DateFnsUtils from '@date-io/date-fns'\nimport PropTypes from 'prop-types'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {},\n  inputRoot: {\n    fontSize: 12\n  },\n  input: {\n    borderRadius: 2,\n    height: 32,\n    padding: 0,\n    paddingLeft: theme.spacing(1)\n  },\n  formTextInput: {\n    fontSize: 14\n  },\n  labelRoot: {\n    fontSize: 14\n  },\n  FormControl: {\n    display: 'none',\n    marginTop: 0\n  }\n}))\n\nexport const FluentTimePicker = (props) => {\n  const classes = useStyles()\n  const { id, label, startAdornment, endAdornment, ...otherProps } = props\n\n  return (\n    <div>\n      <MuiPickersUtilsProvider utils={DateFnsUtils}>\n        <KeyboardTimePicker\n          variant='inline'\n          margin='normal'\n          {...otherProps}\n          id={id}\n          inputVariant='outlined'\n          KeyboardButtonProps={{\n            'aria-label': 'change date'\n          }}\n          keyboardIcon={<EventDateIcon style={{ fontSize: 16 }} />}\n          InputProps={{\n            classes: {\n              root: classes.input,\n              input: classes.formTextInput,\n              ...props.InputProps?.classes\n            },\n            ...props.InputProps,\n            ...startAdornment,\n            ...endAdornment,\n            startAdornment: (\n              <InputAdornment\n                classes={{ root: classes.inputRoot }}\n                className={classes.inputRoot}\n                position='start'\n              >\n                {label}\n              </InputAdornment>\n            )\n          }}\n          InputLabelProps={{\n            shrink: false,\n            classes: {\n              root: classes.labelRoot,\n              focused: classes.labelFocused\n            }\n          }}\n        />\n      </MuiPickersUtilsProvider>\n    </div>\n  )\n}\n\nFluentTimePicker.propTypes = {\n  /**\n   * Adornment label (eg, From: )\n   */\n  label: PropTypes.string,\n  /**\n   * Id\n   */\n  id: PropTypes.string\n}\n"],"mappings":";;;;;;;;AAQA,MAAM,YAAY,YAAY,WAAW;CACvC,MAAM,EAAE;CACR,WAAW,EACT,UAAU,IACX;CACD,OAAO;EACL,cAAc;EACd,QAAQ;EACR,SAAS;EACT,aAAa,MAAM,QAAQ,EAAE;EAC9B;CACD,eAAe,EACb,UAAU,IACX;CACD,WAAW,EACT,UAAU,IACX;CACD,aAAa;EACX,SAAS;EACT,WAAW;EACZ;CACF,EAAE;AAEH,MAAa,oBAAoB,UAAU;CACzC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,IAAI,OAAO,gBAAgB,aAAc,GAAG,eAAe;AAEnE,QACE,oCAAC,aACC,oCAAC,2BAAwB,OAAO,gBAC9B,oCAAC;EACC,SAAQ;EACR,QAAO;EACP,GAAI;EACA;EACJ,cAAa;EACb,qBAAqB,EACnB,cAAc,eACf;EACD,cAAc,oCAAC,iBAAc,OAAO,EAAE,UAAU,IAAI,GAAI;EACxD,YAAY;GACV,SAAS;IACP,MAAM,QAAQ;IACd,OAAO,QAAQ;IACf,GAAG,MAAM,YAAY;IACtB;GACD,GAAG,MAAM;GACT,GAAG;GACH,GAAG;GACH,gBACE,oCAAC;IACC,SAAS,EAAE,MAAM,QAAQ,WAAW;IACpC,WAAW,QAAQ;IACnB,UAAS;MAER,MACc;GAEpB;EACD,iBAAiB;GACf,QAAQ;GACR,SAAS;IACP,MAAM,QAAQ;IACd,SAAS,QAAQ;IAClB;GACF;GACD,CACsB,CACtB;;AAIV,iBAAiB,YAAY;CAI3B,OAAO,UAAU;CAIjB,IAAI,UAAU;CACf"}

package/dist/FluentToggle-C2u7hxkz.js

@@ -0,0 +1,49 @@
+import React from "react";
+import { Switch, withStyles } from "@material-ui/core";
+
+//#region src/UI/inputs/toggle/FluentToggle.jsx
+const FluentSwitch = withStyles((theme) => ({
+	root: {
+		width: 40,
+		height: 20,
+		padding: 0,
+		display: "flex"
+	},
+	switchBase: {
+		padding: 4,
+		color: theme.palette.grey[500],
+		"&$checked": {
+			transform: "translateX(20px)",
+			color: theme.palette.common.white,
+			"& + $track": {
+				opacity: 1,
+				borderColor: theme.palette.primary.main
+			}
+		}
+	},
+	thumb: {
+		width: 12,
+		height: 12,
+		boxShadow: "none"
+	},
+	track: {
+		border: `1px solid ${theme.palette.grey[500]}`,
+		borderRadius: 20 / 2,
+		opacity: 1,
+		backgroundColor: theme.palette.common.white
+	},
+	checked: {}
+}))(Switch);
+const FluentToggle = (props) => {
+	const { name, onChange, checked,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement(FluentSwitch, {
+		...otherProps,
+		checked,
+		onChange,
+		name
+	});
+};
+
+//#endregion
+export { FluentToggle as t };
+//# sourceMappingURL=FluentToggle-C2u7hxkz.js.map

package/dist/FluentToggle-C2u7hxkz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentToggle-C2u7hxkz.js","names":[],"sources":["../src/UI/inputs/toggle/FluentToggle.jsx"],"sourcesContent":["import React from 'react'\nimport { Switch, withStyles } from '@material-ui/core'\n\nconst FluentSwitch = withStyles((theme) => ({\n  root: {\n    width: 40,\n    height: 20,\n    padding: 0,\n    display: 'flex',\n  },\n  switchBase: {\n    padding: 4,\n    color: theme.palette.grey[500],\n    '&$checked': {\n      transform: 'translateX(20px)',\n      color: theme.palette.common.white,\n      '& + $track': {\n        opacity: 1,\n        borderColor: theme.palette.primary.main\n      }\n    }\n  },\n  thumb: {\n    width: 12,\n    height: 12,\n    boxShadow: 'none'\n  },\n  track: {\n    border: `1px solid ${theme.palette.grey[500]}`,\n    borderRadius: 20 / 2,\n    opacity: 1,\n    backgroundColor: theme.palette.common.white\n  },\n  checked: {}\n}))(Switch)\n\nexport const FluentToggle = (props) => {\n  const { name, onChange, checked, ...otherProps } = props\n\n  return (\n    <FluentSwitch\n      {...otherProps}\n      checked={checked}\n      onChange={onChange}\n      name={name}\n    />\n  )\n}\n"],"mappings":";;;;AAGA,MAAM,eAAe,YAAY,WAAW;CAC1C,MAAM;EACJ,OAAO;EACP,QAAQ;EACR,SAAS;EACT,SAAS;EACV;CACD,YAAY;EACV,SAAS;EACT,OAAO,MAAM,QAAQ,KAAK;EAC1B,aAAa;GACX,WAAW;GACX,OAAO,MAAM,QAAQ,OAAO;GAC5B,cAAc;IACZ,SAAS;IACT,aAAa,MAAM,QAAQ,QAAQ;IACpC;GACF;EACF;CACD,OAAO;EACL,OAAO;EACP,QAAQ;EACR,WAAW;EACZ;CACD,OAAO;EACL,QAAQ,aAAa,MAAM,QAAQ,KAAK;EACxC,cAAc,KAAK;EACnB,SAAS;EACT,iBAAiB,MAAM,QAAQ,OAAO;EACvC;CACD,SAAS,EAAE;CACZ,EAAE,CAAC,OAAO;AAEX,MAAa,gBAAgB,UAAU;CACrC,MAAM,EAAE,MAAM,UAAU,QAAS,GAAG,eAAe;AAEnD,QACE,oCAAC;EACC,GAAI;EACK;EACC;EACJ;GACN"}

package/dist/FluentUploadIconButton-B1mutcAT.js

@@ -0,0 +1,129 @@
+import { t as FluentButton } from "./FluentButton-3xMbN_Vs.js";
+import { t as FluentIconButton } from "./FluentIconButton-AN9tZKVl.js";
+import React from "react";
+import { Button, ButtonBase, Divider, Typography, makeStyles } from "@material-ui/core";
+import { IncreaseIndentArrowIcon } from "@fluentui/react-icons";
+import PropTypes from "prop-types";
+import { makeStyles as makeStyles$1 } from "@material-ui/core/styles";
+
+//#region src/UI/inputs/buttons/FluentCompoundButton.jsx
+const useStyles$3 = makeStyles({
+	root: {
+		borderRadius: 2,
+		minHeight: 72,
+		padding: "0 16px",
+		minWidth: 80,
+		border: (props) => `1px solid ${props.color}`
+	},
+	label: {
+		textTransform: "capitalize",
+		fontSize: "0.875rem",
+		fontWeight: 600,
+		textAlign: "left"
+	}
+});
+const FluentCompoundButton = (props) => {
+	const classes = useStyles$3(props);
+	const { children, textSecondary,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement(Button, {
+		...otherProps,
+		disableElevation: true,
+		classes: {
+			root: classes.root,
+			label: classes.label
+		}
+	}, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", null, children), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, textSecondary))));
+};
+
+//#endregion
+//#region src/UI/inputs/buttons/FluentMenuListButton.jsx
+const useStyles$2 = makeStyles((theme) => ({
+	wrapper: {
+		display: "flex",
+		flexDirection: "row",
+		padding: theme.spacing(.5),
+		"&:hover": { color: theme.palette.secondary.main },
+		width: "100%"
+	},
+	titleWrapper: {
+		display: "flex",
+		width: "100%",
+		textAlign: "left"
+	},
+	labelWrapper: { marginTop: 4 },
+	label: { marginBottom: 4 }
+}), { name: "FluentMenuListButton" });
+const FluentMenuListButton = (props) => {
+	const classes = useStyles$2();
+	const { label, value, arrow = true,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(ButtonBase, {
+		classes: { root: classes.root },
+		className: classes.wrapper,
+		disableRipple: true,
+		...otherProps
+	}, /* @__PURE__ */ React.createElement("div", { className: classes.titleWrapper }, /* @__PURE__ */ React.createElement("div", { className: classes.labelWrapper }, /* @__PURE__ */ React.createElement("div", { className: classes.label }, " ", /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, " ", /* @__PURE__ */ React.createElement("span", { style: { fontWeight: 700 } }, label), " ")), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle2" }, value))), arrow && /* @__PURE__ */ React.createElement(IncreaseIndentArrowIcon, { style: { fontSize: 24 } }))), /* @__PURE__ */ React.createElement(Divider, null));
+};
+FluentMenuListButton.propTypes = { label: PropTypes.string.isRequired };
+
+//#endregion
+//#region src/UI/inputs/buttons/FluentUploadButton.jsx
+const useStyles$1 = makeStyles$1((theme) => ({
+	root: { "& > *": { margin: theme.spacing(1) } },
+	input: { display: "none" }
+}));
+const FluentUploadButton = (props) => {
+	const classes = useStyles$1();
+	const { color, label, accept, id, onChange, onClick, variant } = props;
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("input", {
+		accept,
+		className: classes.input,
+		id,
+		multiple: true,
+		type: "file",
+		onChange
+	}), /* @__PURE__ */ React.createElement("label", { htmlFor: id }, /* @__PURE__ */ React.createElement(FluentButton, {
+		onClick,
+		variant,
+		color,
+		component: "span"
+	}, label)), /* @__PURE__ */ React.createElement("input", {
+		accept,
+		className: classes.input,
+		id,
+		type: "file"
+	}));
+};
+
+//#endregion
+//#region src/UI/inputs/buttons/FluentUploadIconButton.jsx
+const useStyles = makeStyles$1((theme) => ({
+	root: { "& > *": { margin: theme.spacing(1) } },
+	input: { display: "none" }
+}));
+const FluentUploadIconButton = (props) => {
+	const classes = useStyles();
+	const { color, icon, aria, accept, id, onChange, onClick } = props;
+	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("input", {
+		accept,
+		className: classes.input,
+		id,
+		type: "file",
+		onChange
+	}), /* @__PURE__ */ React.createElement("label", { htmlFor: id }, /* @__PURE__ */ React.createElement(FluentIconButton, {
+		icon,
+		color,
+		"aria-label": aria,
+		id,
+		component: "span",
+		onClick
+	})), /* @__PURE__ */ React.createElement("input", {
+		accept,
+		className: classes.input,
+		id,
+		type: "file"
+	}));
+};
+
+//#endregion
+export { FluentCompoundButton as i, FluentUploadButton as n, FluentMenuListButton as r, FluentUploadIconButton as t };
+//# sourceMappingURL=FluentUploadIconButton-B1mutcAT.js.map

package/dist/FluentUploadIconButton-B1mutcAT.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentUploadIconButton-B1mutcAT.js","names":["useStyles","useStyles","useStyles","makeStyles","makeStyles"],"sources":["../src/UI/inputs/buttons/FluentCompoundButton.jsx","../src/UI/inputs/buttons/FluentMenuListButton.jsx","../src/UI/inputs/buttons/FluentUploadButton.jsx","../src/UI/inputs/buttons/FluentUploadIconButton.jsx"],"sourcesContent":["import React from 'react'\nimport { makeStyles, Typography } from '@material-ui/core'\nimport { Button } from '@material-ui/core'\n\nconst useStyles = makeStyles({\n  root: {\n    borderRadius: 2,\n    minHeight: 72,\n    padding: '0 16px',\n    minWidth: 80,\n    border: (props) => `1px solid ${props.color}`\n  },\n  label: {\n    textTransform: 'capitalize',\n    fontSize: '0.875rem',\n    fontWeight: 600,\n    textAlign: 'left'\n  }\n})\n\nexport const FluentCompoundButton = (props) => {\n  const classes = useStyles(props)\n  const { children, textSecondary, ...otherProps } = props\n  return (\n    <Button\n      {...otherProps}\n      disableElevation\n      classes={{\n        root: classes.root,\n        label: classes.label\n      }}\n    >\n      <div>\n        <div>{children}</div>\n        <div>\n          <Typography variant='caption'>{textSecondary}</Typography>\n        </div>\n      </div>\n    </Button>\n  )\n}\n","import React from 'react';\nimport { ButtonBase, Typography, makeStyles, Divider } from '@material-ui/core';\nimport { IncreaseIndentArrowIcon } from '@fluentui/react-icons';\nimport PropTypes from 'prop-types';\n\nconst useStyles = makeStyles(\n  (theme) => ({\n    wrapper: {\n      display: 'flex',\n      flexDirection: 'row',\n      // height: theme.spacing(5),\n      padding: theme.spacing(0.5),\n      '&:hover': { color: theme.palette.secondary.main },\n      width: '100%'\n    },\n    titleWrapper: {\n      display: 'flex',\n      width: '100%',\n      textAlign: 'left'\n    },\n    labelWrapper: {\n      marginTop: 4\n    },\n    label: {\n      marginBottom: 4\n    }\n  }),\n  { name: 'FluentMenuListButton' }\n);\n\nexport const FluentMenuListButton = (props) => {\n  const classes = useStyles();\n  const { label, value, arrow = true, ...otherProps } = props;\n\n  return (\n    <div>\n      <ButtonBase\n        classes={{\n          root: classes.root\n        }}\n        className={classes.wrapper}\n        disableRipple\n        {...otherProps}\n      >\n        <div className={classes.titleWrapper}>\n          <div className={classes.labelWrapper}>\n            <div className={classes.label}>\n              {' '}\n              <Typography variant='caption'>\n                {' '}\n                <span style={{ fontWeight: 700 }}>{label}</span>{' '}\n              </Typography>\n            </div>\n            <div>\n              <Typography variant='subtitle2'>{value}</Typography>\n            </div>\n          </div>\n          {/* @todo  Change to component for size */}\n          {arrow && <IncreaseIndentArrowIcon style={{ fontSize: 24 }} />}\n        </div>\n      </ButtonBase>\n      <Divider />\n    </div>\n  );\n};\n\nFluentMenuListButton.propTypes = {\n  /**\n   * Button label\n   */\n  label: PropTypes.string.isRequired\n};\n","import React from 'react'\nimport { makeStyles } from '@material-ui/core/styles'\nimport { FluentButton } from './FluentButton'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    '& > *': {\n      margin: theme.spacing(1)\n    }\n  },\n  input: {\n    display: 'none'\n  }\n}))\n\nexport const FluentUploadButton = (props) => {\n  const classes = useStyles()\n  const { color, label, accept, id, onChange, onClick, variant } = props\n\n  return (\n    <div className={classes.root}>\n      <input\n        accept={accept}\n        className={classes.input}\n        id={id}\n        multiple\n        type='file'\n        onChange={onChange}\n      />\n      <label htmlFor={id}>\n        <FluentButton\n          onClick={onClick}\n          variant={variant}\n          color={color}\n          component='span'\n        >\n          {label}\n        </FluentButton>\n      </label>\n      <input accept={accept} className={classes.input} id={id} type='file' />\n    </div>\n  )\n}\n","import React from 'react'\nimport { makeStyles } from '@material-ui/core/styles'\nimport { FluentIconButton } from './FluentIconButton'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    '& > *': {\n      margin: theme.spacing(1)\n    }\n  },\n  input: {\n    display: 'none'\n  }\n}))\n\nexport const FluentUploadIconButton = (props) => {\n  const classes = useStyles()\n  const { color, icon, aria, accept, id, onChange, onClick } = props\n\n  return (\n    <div className={classes.root}>\n      <input\n        accept={accept}\n        className={classes.input}\n        id={id}\n        type='file'\n        onChange={onChange}\n      />\n      <label htmlFor={id}>\n        <FluentIconButton\n          icon={icon}\n          color={color}\n          aria-label={aria}\n          id={id}\n          component='span'\n          onClick={onClick}\n        />\n      </label>\n      <input accept={accept} className={classes.input} id={id} type='file' />\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/FormButtons-3-Do6TqZ.js

@@ -0,0 +1,130 @@
+import { t as FluentButton } from "./FluentButton-3xMbN_Vs.js";
+import React, { forwardRef, useImperativeHandle } from "react";
+import { makeStyles } from "@material-ui/core";
+import { Form, FormSpy } from "react-final-form";
+import { getIn } from "final-form";
+
+//#region src/utilities/form/final-form-scroll/isFocusableInput.js
+const isFocusableInput = (wtf) => !!(wtf && typeof wtf.focus === "function");
+var isFocusableInput_default = isFocusableInput;
+
+//#endregion
+//#region src/utilities/form/final-form-scroll/getAllInputs.js
+const getAllInputs = () => {
+	if (typeof document === "undefined") return [];
+	return Array.prototype.slice.call(document.forms).reduce((accumulator, form) => accumulator.concat(Array.prototype.slice.call(form).filter(isFocusableInput_default)), []);
+};
+var getAllInputs_default = getAllInputs;
+
+//#endregion
+//#region src/utilities/form/final-form-scroll/findInput.js
+const findInput = (inputs, errors) => inputs.find((input) => input.name && getIn(errors, input.name));
+var findInput_default = findInput;
+
+//#endregion
+//#region src/utilities/form/final-form-scroll/createDecorator.js
+const noop = () => {};
+/**
+* The decorator is created based on final-form-focus https://github.com/final-form/final-form-focus
+*/
+const createDecorator = () => (form) => {
+	const scrollToFirstError = (errors) => {
+		const inputToScrollTo = findInput_default(getAllInputs_default(), errors)?.parentElement;
+		if (inputToScrollTo) inputToScrollTo.scrollIntoView({ behavior: "smooth" });
+	};
+	const originalSubmit = form.submit;
+	let state = {};
+	const unsubscribe = form.subscribe((nextState) => {
+		state = nextState;
+	}, {
+		errors: true,
+		submitErrors: true
+	});
+	const afterSubmit = () => {
+		const { errors, submitErrors } = state;
+		if (errors && Object.keys(errors).length) scrollToFirstError(errors);
+		else if (submitErrors && Object.keys(submitErrors).length) scrollToFirstError(submitErrors);
+	};
+	form.submit = () => {
+		const result = originalSubmit.call(form);
+		if (result && typeof result.then === "function") result.then(afterSubmit, noop);
+		else afterSubmit();
+		return result;
+	};
+	return () => {
+		unsubscribe();
+		form.submit = originalSubmit;
+	};
+};
+var createDecorator_default = createDecorator;
+
+//#endregion
+//#region src/utilities/form/Form.tsx
+const scrollToError = createDecorator_default();
+/**
+* final-form Form wrapper with automatic <form> and submit handler
+*/
+const _Form = ({ render: renderProp, children, id,...props }, ref) => {
+	const render = renderProp || children;
+	return /* @__PURE__ */ React.createElement(Form, {
+		ref,
+		decorators: [scrollToError],
+		...props
+	}, (params) => {
+		useImperativeHandle(ref, () => ({ ...params }));
+		return /* @__PURE__ */ React.createElement("form", {
+			onSubmit: params.handleSubmit,
+			noValidate: true,
+			id
+		}, typeof render === "function" ? render(params) : render);
+	});
+};
+const Form$1 = forwardRef(_Form);
+
+//#endregion
+//#region src/utilities/form/SubmitButton.tsx
+/**
+* A MUI Button varaint intended for use as the submit button for a form
+*/
+let SubmitButton = forwardRef((props, ref) => {
+	const { ButtonComponent = FluentButton, disabled, disablePristine = true,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement(FormSpy, { subscription: {
+		submitting: true,
+		pristine: true
+	} }, ({ submitting, pristine }) => /* @__PURE__ */ React.createElement(ButtonComponent, {
+		ref,
+		type: "submit",
+		disabled: submitting || disablePristine && pristine || disabled,
+		...otherProps
+	}));
+});
+SubmitButton.displayName = "SubmitButton";
+
+//#endregion
+//#region src/utilities/form/FormButtons.tsx
+const useStyles = makeStyles((theme) => ({ root: {
+	display: "flex",
+	flexDirection: "row",
+	alignItems: "center",
+	justifyContent: "flex-start",
+	marginBottom: theme.spacing(2),
+	marginTop: theme.spacing(1),
+	"& > *": { margin: `0 ${theme.spacing(2)}px 0 0` }
+} }));
+/**
+* A MUI Button varaint intended for use as the submit button for a form
+*/
+const FormButtonsCore = (props, ref) => {
+	const classes = useStyles(props);
+	const { children,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement("div", {
+		...otherProps,
+		ref,
+		className: classes.root
+	}, children);
+};
+const FormButtons = forwardRef(FormButtonsCore);
+
+//#endregion
+export { createDecorator_default as i, SubmitButton as n, Form$1 as r, FormButtons as t };
+//# sourceMappingURL=FormButtons-3-Do6TqZ.js.map

package/dist/FormButtons-3-Do6TqZ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormButtons-3-Do6TqZ.js","names":["isFocusableInput","findInput","getAllInputs","createDecorator","FinalForm","Form: React.FC<FormProps>","FormButtonsCore: any","FormButtons: React.FC<FormButtonsProps>"],"sources":["../src/utilities/form/final-form-scroll/isFocusableInput.js","../src/utilities/form/final-form-scroll/getAllInputs.js","../src/utilities/form/final-form-scroll/findInput.js","../src/utilities/form/final-form-scroll/createDecorator.js","../src/utilities/form/Form.tsx","../src/utilities/form/SubmitButton.tsx","../src/utilities/form/FormButtons.tsx"],"sourcesContent":["const isFocusableInput = (wtf) =>\n  !!(wtf && typeof wtf.focus === 'function');\n\nexport default isFocusableInput;\n","import isFocusableInput from './isFocusableInput';\n\nconst getAllInputs = () => {\n  if (typeof document === 'undefined') {\n    return [];\n  }\n  return Array.prototype.slice\n    .call(document.forms)\n    .reduce(\n      (accumulator, form) =>\n        accumulator.concat(\n          Array.prototype.slice.call(form).filter(isFocusableInput)\n        ),\n      []\n    );\n};\n\nexport default getAllInputs;\n","import { getIn } from 'final-form';\n\nconst findInput = (inputs, errors) =>\n  inputs.find(input => input.name && getIn(errors, input.name));\n\nexport default findInput;\n","import getAllInputs from './getAllInputs.js';\nimport findInput from './findInput.js';\n\nconst noop = () => {};\n\n/**\n * The decorator is created based on final-form-focus https://github.com/final-form/final-form-focus\n */\nconst createDecorator = () => (form) => {\n  const scrollToFirstError = (errors) => {\n    const allInputs = getAllInputs();\n    const firstInput = findInput(allInputs, errors);\n    const inputToScrollTo = firstInput?.parentElement;\n    if (inputToScrollTo) {\n      inputToScrollTo.scrollIntoView({ behavior: 'smooth' });\n    }\n  };\n  // Save original submit function\n  const originalSubmit = form.submit;\n  let state = {};\n  const unsubscribe = form.subscribe(\n    (nextState) => {\n      state = nextState;\n    },\n    { errors: true, submitErrors: true }\n  );\n  // What to do after submit\n  const afterSubmit = () => {\n    const { errors, submitErrors } = state;\n    if (errors && Object.keys(errors).length) {\n      scrollToFirstError(errors);\n    } else if (submitErrors && Object.keys(submitErrors).length) {\n      scrollToFirstError(submitErrors);\n    }\n  };\n\n  // Rewrite submit function\n  form.submit = () => {\n    const result = originalSubmit.call(form);\n    if (result && typeof result.then === 'function') {\n      // async\n      result.then(afterSubmit, noop);\n    } else {\n      // sync\n      afterSubmit();\n    }\n    return result;\n  };\n\n  return () => {\n    unsubscribe();\n    form.submit = originalSubmit;\n  };\n};\n\nexport default createDecorator;\n","import React, { forwardRef, useImperativeHandle } from 'react';\nimport {\n  AnyObject,\n  Form as FinalForm,\n  FormProps as FinalFormProps,\n  FormRenderProps,\n} from 'react-final-form';\nimport createDecorator from './final-form-scroll/createDecorator';\n\nexport interface FormProps<FormValues = AnyObject>\n  extends FinalFormProps<FormValues> {\n  children?: (props: FormRenderProps<FormValues>) => React.ReactNode;\n  id?: string;\n}\nconst scrollToError = createDecorator();\n\n/**\n * final-form Form wrapper with automatic <form> and submit handler\n */\n\nconst _Form = ({ render: renderProp, children, id, ...props }: FormProps, ref: React.Ref<any>) => {\n  const render = renderProp || children;\n\n  return (\n    <FinalForm ref={ref} decorators={[scrollToError]} {...props}>\n      {params => {\n         useImperativeHandle(ref, () => ({ ...params}))\n        return (\n          <form onSubmit={params.handleSubmit} noValidate={true} id={id}>\n            {typeof render === 'function' ? render(params) : render}\n          </form>\n        )\n      }}\n    </FinalForm>\n  );\n};\n\nexport const Form: React.FC<FormProps> = forwardRef(_Form)\n","import { Button, ButtonProps } from '@material-ui/core';\nimport React, { forwardRef, ComponentType } from 'react';\nimport { FormSpy } from 'react-final-form';\nimport { FluentButton } from '../../UI/inputs/buttons/FluentButton';\n\nexport type SubmitButtonProps<\n  P = {},\n  D extends React.ElementType = 'button'\n  > = ButtonProps<D, P> & {\n    // @fixme Probably want to swap this with something that'll allow ...otherProps to inherit the specified component's props to pass through\n    ButtonComponent?: typeof FluentButton;\n    disablePristine: boolean;\n  };\n\ntype SubmitButtonComponent<\n  P = {},\n  D extends React.ElementType = 'button'\n  > = ComponentType<SubmitButtonProps<P, D>>;\n\n/**\n * A MUI Button varaint intended for use as the submit button for a form\n */\nexport let SubmitButton = forwardRef<HTMLButtonElement, SubmitButtonProps>((props, ref) => {\n  const {\n    ButtonComponent = FluentButton,\n    disabled,\n    disablePristine = true,\n    ...otherProps\n  } = props;\n\n  return (\n    <FormSpy subscription={{ submitting: true, pristine: true }}>\n      {({ submitting, pristine }) => (\n        <ButtonComponent\n          ref={ref}\n          type=\"submit\"\n          disabled={submitting || (disablePristine && pristine) || disabled}\n          {...otherProps}\n        />\n      )}\n    </FormSpy>\n  );\n});\nSubmitButton.displayName = 'SubmitButton';\n","import { makeStyles } from '@material-ui/core';\nimport React, { forwardRef, } from 'react';\n\nconst useStyles = makeStyles((theme:any) => ({\n  root: {\n    display: 'flex',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-start',\n    marginBottom: theme.spacing(2),\n    marginTop: theme.spacing(1),\n    '& > *': {\n      margin: `0 ${theme.spacing(2)}px 0 0`,\n    },\n  },\n}));\n\nexport type FormButtonsProps = {};\n\n/**\n * A MUI Button varaint intended for use as the submit button for a form\n */\nconst FormButtonsCore: any = (\n  props: any,\n  ref: any\n) => {\n  const classes = useStyles(props);\n  const { children, ...otherProps } = props;\n\n  return (\n    <div {...otherProps} ref={ref as any} className={classes.root}>\n      {children}\n    </div>\n  );\n};\nexport const FormButtons: React.FC<FormButtonsProps> = forwardRef(FormButtonsCore);\n"],"mappings":";;;;;;;AAAA,MAAM,oBAAoB,QACxB,CAAC,EAAE,OAAO,OAAO,IAAI,UAAU;AAEjC,+BAAe;;;;ACDf,MAAM,qBAAqB;AACzB,KAAI,OAAO,aAAa,YACtB,QAAO,EAAE;AAEX,QAAO,MAAM,UAAU,MACpB,KAAK,SAAS,MAAM,CACpB,QACE,aAAa,SACZ,YAAY,OACV,MAAM,UAAU,MAAM,KAAK,KAAK,CAAC,OAAOA,yBAAiB,CAC1D,EACH,EAAE,CACH;;AAGL,2BAAe;;;;ACff,MAAM,aAAa,QAAQ,WACzB,OAAO,MAAK,UAAS,MAAM,QAAQ,MAAM,QAAQ,MAAM,KAAK,CAAC;AAE/D,wBAAe;;;;ACFf,MAAM,aAAa;;;;AAKnB,MAAM,yBAAyB,SAAS;CACtC,MAAM,sBAAsB,WAAW;EAGrC,MAAM,kBADaC,kBADDC,sBAAc,EACQ,OAAO,EACX;AACpC,MAAI,gBACF,iBAAgB,eAAe,EAAE,UAAU,UAAU,CAAC;;CAI1D,MAAM,iBAAiB,KAAK;CAC5B,IAAI,QAAQ,EAAE;CACd,MAAM,cAAc,KAAK,WACtB,cAAc;AACb,UAAQ;IAEV;EAAE,QAAQ;EAAM,cAAc;EAAM,CACrC;CAED,MAAM,oBAAoB;EACxB,MAAM,EAAE,QAAQ,iBAAiB;AACjC,MAAI,UAAU,OAAO,KAAK,OAAO,CAAC,OAChC,oBAAmB,OAAO;WACjB,gBAAgB,OAAO,KAAK,aAAa,CAAC,OACnD,oBAAmB,aAAa;;AAKpC,MAAK,eAAe;EAClB,MAAM,SAAS,eAAe,KAAK,KAAK;AACxC,MAAI,UAAU,OAAO,OAAO,SAAS,WAEnC,QAAO,KAAK,aAAa,KAAK;MAG9B,cAAa;AAEf,SAAO;;AAGT,cAAa;AACX,eAAa;AACb,OAAK,SAAS;;;AAIlB,8BAAe;;;;ACzCf,MAAM,gBAAgBC,yBAAiB;;;;AAMvC,MAAM,SAAS,EAAE,QAAQ,YAAY,UAAU,GAAI,GAAG,SAAoB,QAAwB;CAChG,MAAM,SAAS,cAAc;AAE7B,QACE,oCAACC;EAAe;EAAK,YAAY,CAAC,cAAc;EAAE,GAAI;KACnD,WAAU;AACR,sBAAoB,YAAY,EAAE,GAAG,QAAO,EAAE;AAC/C,SACE,oCAAC;GAAK,UAAU,OAAO;GAAc,YAAY;GAAU;KACxD,OAAO,WAAW,aAAa,OAAO,OAAO,GAAG,OAC5C;GAGD;;AAIhB,MAAaC,SAA4B,WAAW,MAAM;;;;;;;ACf1D,IAAW,eAAe,YAAkD,OAAO,QAAQ;CACzF,MAAM,EACJ,kBAAkB,cAClB,UACA,kBAAkB,KAClB,GAAG,eACD;AAEJ,QACE,oCAAC,WAAQ,cAAc;EAAE,YAAY;EAAM,UAAU;EAAM,KACvD,EAAE,YAAY,eACd,oCAAC;EACM;EACL,MAAK;EACL,UAAU,cAAe,mBAAmB,YAAa;EACzD,GAAI;GACJ,CAEI;EAEZ;AACF,aAAa,cAAc;;;;ACxC3B,MAAM,YAAY,YAAY,WAAe,EAC3C,MAAM;CACJ,SAAS;CACT,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,cAAc,MAAM,QAAQ,EAAE;CAC9B,WAAW,MAAM,QAAQ,EAAE;CAC3B,SAAS,EACP,QAAQ,KAAK,MAAM,QAAQ,EAAE,CAAC,SAC/B;CACF,EACF,EAAE;;;;AAOH,MAAMC,mBACJ,OACA,QACG;CACH,MAAM,UAAU,UAAU,MAAM;CAChC,MAAM,EAAE,SAAU,GAAG,eAAe;AAEpC,QACE,oCAAC;EAAI,GAAI;EAAiB;EAAY,WAAW,QAAQ;IACtD,SACG;;AAGV,MAAaC,cAA0C,WAAW,gBAAgB"}

package/dist/FormControlLabel-D89w22Fg.js

@@ -0,0 +1,17 @@
+import React from "react";
+import { FormControlLabel } from "@material-ui/core";
+
+//#region src/UI/utilityDisplay/FormControlLabel.jsx
+const FormControlLabel$1 = (props) => {
+	const { control, label, labelPlacement,...otherProps } = props;
+	return /* @__PURE__ */ React.createElement(FormControlLabel, {
+		control,
+		label,
+		labelPlacement,
+		...otherProps
+	});
+};
+
+//#endregion
+export { FormControlLabel$1 as t };
+//# sourceMappingURL=FormControlLabel-D89w22Fg.js.map

package/dist/FormControlLabel-D89w22Fg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormControlLabel-D89w22Fg.js","names":["FormControlLabel","MuiFormControlLabel"],"sources":["../src/UI/utilityDisplay/FormControlLabel.jsx"],"sourcesContent":["import React from 'react';\nimport { FormControlLabel as MuiFormControlLabel } from '@material-ui/core';\n\nexport const FormControlLabel = (props) => {\n  const { control, label, labelPlacement, ...otherProps } = props;\n\n  return (\n    <MuiFormControlLabel\n      control={control}\n      label={label}\n      labelPlacement={labelPlacement}\n      {...otherProps}\n    />\n  );\n};\n"],"mappings":";;;;AAGA,MAAaA,sBAAoB,UAAU;CACzC,MAAM,EAAE,SAAS,OAAO,eAAgB,GAAG,eAAe;AAE1D,QACE,oCAACC;EACU;EACF;EACS;EAChB,GAAI;GACJ"}