@cerebruminc/cerebellum 16.1.1 → 16.2.0

package/lib/cjs/{FormikContainer-CY2nLsAs.js → FormikContainer-DVL86Jri.js}

@@ -20,12 +20,13 @@ var useMeasure = require('./useMeasure-CDq3dPfD.js');
 var usePrevious = require('./usePrevious.cjs');
 require('./Loading.cjs');
 var Scroller = require('./Scroller.cjs');
-var FormWrapper = require('./FormStyles-CxgYRZOl.js');
+var FormWrapper = require('./FormStyles-CM25rbhG.js');
 var AddressInput = require('./AddressInput-BwC_Fa3a.js');
 var Inputs = require('./Inputs-IaHMnBKw.js');
 var ReactDOM = require('react-dom');
 var CheckboxItem = require('./CheckboxItem-Bjn6vej0.js');
 var CheckboxGroup = require('./CheckboxGroup-BeBI_kWP.js');
+var ColorPickerInput = require('./ColorPickerInput-CBPI8IJ-.js');
 var ConfigurableInput = require('./ConfigurableInput-naz2E_Pb.js');
 var FormFieldTypeEnum = require('./FormFieldTypeEnum.cjs');
 var CountryDropdown = require('./CountryDropdown-CoeXr-MI.js');
@@ -39,7 +40,7 @@ var CurrencyInput = require('./CurrencyInput-D_QGbxkC.js');
 var InlineCurrencyInput = require('./InlineCurrencyInput-UjEz4U3A.js');
 var formatBytesToString = require('./formatBytesToString.cjs');
 var DatePicker = require('./DatePicker.cjs');
-var InlineDatePicker = require('./InlineDatePicker-DFv_uHo9.js');
+var InlineDatePicker = require('./InlineDatePicker-B7DTwvhv.js');
 require('./CheckboxStyles-CAzemGXD.js');
 require('./RadioStyles-2mVDOf96.js');
 require('./ToggleStyles-DsqemdEf.js');
@@ -193,6 +194,32 @@ var CheckboxGroupField = function (_a) {
                     }, required: required && !disabled, showValidationMessage: !leftLabels && showValidationMessage, validationMessage: validationMessage })) })), leftLabels && (jsxRuntime.jsx(FormWrapper.RightGutter, { "$switchSpacing": true, children: jsxRuntime.jsx(FormWrapper.ValidationTextGrid, { "$showValidationMessage": showValidationMessage, "$switchSpacing": true, children: validationMessage }) }))] }));
 };
 
+var ColorPickerField = function (_a) {
+    var fade = _a.fade, field = _a.field, formikProps = _a.formikProps, leftLabels = _a.leftLabels, leftLabelsRightGutter = _a.leftLabelsRightGutter, leftLabelWidth = _a.leftLabelWidth, rowGap = _a.rowGap, setHasValues = _a.setHasValues, setSubmitAttempt = _a.setSubmitAttempt, submitAttempt = _a.submitAttempt, submitOnBlur = _a.submitOnBlur;
+    var theme = styled.useTheme();
+    var values = formikProps.values, errors = formikProps.errors, touched = formikProps.touched, handleBlur = formikProps.handleBlur, handleChange = formikProps.handleChange, submitForm = formikProps.submitForm;
+    var _b = field.disabled, disabled = _b === void 0 ? false : _b, fieldLabel = field.fieldLabel, name = field.name, nextGap = field.nextGap, _c = field.options, options = _c === void 0 ? {} : _c, width = field.width;
+    var helperText = options.helperText, onInputBlur = options.onInputBlur, onChange = options.onChange;
+    var showValidationMessage = (touched[name] || submitAttempt) && !!errors[name];
+    var validationMessage = errors[name];
+    var InputComponent = leftLabels ? ColorPickerInput.InlineColorPickerInput : ColorPickerInput.ColorPickerInput;
+    var InputWrap = leftLabels ? FormWrapper.InputBox : React.Fragment;
+    return (jsxRuntime.jsxs(FormWrapper.FieldBox, { "$fade": fade, "$fieldWidth": leftLabels ? undefined : width, "$leftLabelLayout": leftLabels, "$leftLabelWidth": leftLabelWidth, "$leftLabelsRightGutter": leftLabelsRightGutter, "$rowGap": nextGap !== null && nextGap !== void 0 ? nextGap : rowGap, children: [leftLabels && (jsxRuntime.jsxs(FormWrapper.LeftGutter, { children: [jsxRuntime.jsx(FormWrapper.LeftLabel, { "$textColor": disabled ? theme.input.disabledLabelColor : theme.input.leftLabelColor, "data-sentry-unmask": true, children: fieldLabel || name }), helperText && jsxRuntime.jsx(FormWrapper.HelperTextGrid, { "data-sentry-unmask": true, children: helperText })] })), jsxRuntime.jsx(InputWrap, { children: jsxRuntime.jsx(InputComponent, _tslib.__assign({}, options, { disabled: disabled }, (leftLabels ? {} : { inputLabel: fieldLabel || name }), { name: name, onChange: function (event) {
+                        handleChange(event);
+                        onChange === null || onChange === void 0 ? void 0 : onChange(event);
+                    }, onInputBlur: function (event) {
+                        ReactDOM.flushSync(function () {
+                            setSubmitAttempt(false);
+                            handleBlur(event);
+                            onInputBlur === null || onInputBlur === void 0 ? void 0 : onInputBlur(event);
+                            setHasValues(FormWrapper.formHasValues(values));
+                        });
+                        if (submitOnBlur) {
+                            submitForm(event);
+                        }
+                    }, showValidationMessage: showValidationMessage }, (leftLabels ? {} : { validationMessage: validationMessage }), { value: values[name] || "#000000" })) }), leftLabels && (jsxRuntime.jsx(FormWrapper.RightGutter, { children: jsxRuntime.jsx(FormWrapper.ValidationTextGrid, { "$showValidationMessage": showValidationMessage, children: validationMessage }) }))] }));
+};
+
 var ConfigurableInputField = function (_a) {
     var configurableInputFieldActiveIds = _a.configurableInputFieldActiveIds, fade = _a.fade, field = _a.field, formikProps = _a.formikProps, leftLabels = _a.leftLabels, leftLabelsRightGutter = _a.leftLabelsRightGutter, leftLabelWidth = _a.leftLabelWidth, rowGap = _a.rowGap, submitAttempt = _a.submitAttempt, setConfigurableInputFieldActiveIds = _a.setConfigurableInputFieldActiveIds, setHasValues = _a.setHasValues, setSubmitAttempt = _a.setSubmitAttempt, submitOnBlur = _a.submitOnBlur;
     var theme = styled.useTheme();
@@ -1461,6 +1488,9 @@ var Form = function (_a) {
                     else if (FormFieldTypeEnum.isCheckboxGroup(field) && (!field.showIf || field.showIf({ values: values }))) {
                         return (jsxRuntime.jsx(CheckboxGroupField, { fade: FormWrapper.shouldFade({ isDeleting: isDeleting, index: index }), field: field, formikProps: formikProps, leftLabels: leftLabels, leftLabelWidth: leftLabelWidth, leftLabelsRightGutter: leftLabelsRightGutter, rowGap: rowGap, setHasValues: setHasValues, submitAttempt: submitAttempt, submitOnBlur: submitOnBlur }, name_1));
                     }
+                    else if (FormFieldTypeEnum.isColorPicker(field) && (!field.showIf || field.showIf({ values: values }))) {
+                        return (jsxRuntime.jsx(ColorPickerField, { fade: FormWrapper.shouldFade({ isDeleting: isDeleting, index: index }), field: field, formikProps: formikProps, leftLabels: leftLabels, leftLabelWidth: leftLabelWidth, leftLabelsRightGutter: leftLabelsRightGutter, rowGap: rowGap, setHasValues: setHasValues, setSubmitAttempt: setSubmitAttempt, submitAttempt: submitAttempt, submitOnBlur: submitOnBlur }, name_1));
+                    }
                     else if (FormFieldTypeEnum.isConfigurableInput(field) && (!field.showIf || field.showIf({ values: values }))) {
                         return (jsxRuntime.jsx(ConfigurableInputField, { configurableInputFieldActiveIds: configurableInputFieldActiveIds, fade: FormWrapper.shouldFade({ isDeleting: isDeleting, index: index }), field: field, formikProps: formikProps, leftLabels: leftLabels, leftLabelWidth: leftLabelWidth, leftLabelsRightGutter: leftLabelsRightGutter, rowGap: rowGap, setConfigurableInputFieldActiveIds: setConfigurableInputFieldActiveIds, setHasValues: setHasValues, setSubmitAttempt: setSubmitAttempt, submitAttempt: submitAttempt, submitOnBlur: submitOnBlur }, name_1));
                     }
@@ -1580,4 +1610,4 @@ var FormikContainer = function (props) {
 exports.FormikContainer = FormikContainer;
 exports.NationalityDropdown = NationalityDropdown;
 exports.nationalityList = nationalityList;
-//# sourceMappingURL=FormikContainer-CY2nLsAs.js.map
+//# sourceMappingURL=FormikContainer-DVL86Jri.js.map

package/lib/cjs/{FormikContainer-CY2nLsAs.js.map → FormikContainer-DVL86Jri.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FormikContainer-CY2nLsAs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"FormikContainer-DVL86Jri.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/cjs/InlineColorPickerInput.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var ColorPickerInput = require('./ColorPickerInput-CBPI8IJ-.js');
+require('./_tslib-ByDtMVOd.js');
+require('react/jsx-runtime');
+require('react');
+require('styled-components');
+require('./BodyLEmphasis.cjs');
+require('./useMeasure-CDq3dPfD.js');
+require('./addOrRemoveById.cjs');
+require('dayjs');
+require('./isEmptyObject.cjs');
+require('./useIsomorphicLayoutEffect-kdlV9QVN.js');
+require('./showLabel-BkZISyqw.js');
+require('./Inputs-IaHMnBKw.js');
+require('./colors.cjs');
+require('./IconComponentStyles-oUWNoaaH.js');
+require('./pressedEnter.cjs');
+require('./validateColorContrast.cjs');
+
+
+
+exports.ColorPickerInput = ColorPickerInput.ColorPickerInput;
+exports.InlineColorPickerInput = ColorPickerInput.InlineColorPickerInput;
+//# sourceMappingURL=InlineColorPickerInput.cjs.map

package/lib/cjs/InlineColorPickerInput.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineColorPickerInput.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}