@cerebruminc/cerebellum 16.1.1 → 16.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (80) hide show
  1. package/lib/cjs/ColorPickerInput-CBPI8IJ-.js +187 -0
  2. package/lib/cjs/ColorPickerInput-CBPI8IJ-.js.map +1 -0
  3. package/lib/cjs/ColorPickerInput.cjs +25 -0
  4. package/lib/cjs/ColorPickerInput.cjs.map +1 -0
  5. package/lib/cjs/DatePicker.cjs +1 -1
  6. package/lib/cjs/Form.cjs +7 -4
  7. package/lib/cjs/Form.cjs.map +1 -1
  8. package/lib/cjs/FormFieldTypeEnum.cjs +5 -0
  9. package/lib/cjs/FormFieldTypeEnum.cjs.map +1 -1
  10. package/lib/cjs/FormSeparator.cjs +3 -1
  11. package/lib/cjs/FormSeparator.cjs.map +1 -1
  12. package/lib/cjs/{FormStyles-CxgYRZOl.js → FormStyles-CM25rbhG.js} +38 -21
  13. package/lib/cjs/{FormStyles-CxgYRZOl.js.map → FormStyles-CM25rbhG.js.map} +1 -1
  14. package/lib/cjs/FormWrapper.cjs +3 -1
  15. package/lib/cjs/FormWrapper.cjs.map +1 -1
  16. package/lib/cjs/{FormikContainer-CY2nLsAs.js → FormikContainer-DVL86Jri.js} +33 -3
  17. package/lib/cjs/{FormikContainer-CY2nLsAs.js.map → FormikContainer-DVL86Jri.js.map} +1 -1
  18. package/lib/cjs/InlineColorPickerInput.cjs +25 -0
  19. package/lib/cjs/InlineColorPickerInput.cjs.map +1 -0
  20. package/lib/cjs/{InlineDatePicker-DFv_uHo9.js → InlineDatePicker-B7DTwvhv.js} +344 -176
  21. package/lib/cjs/InlineDatePicker-B7DTwvhv.js.map +1 -0
  22. package/lib/cjs/InlineDatePicker.cjs +1 -1
  23. package/lib/cjs/TitleGroup.cjs +3 -1
  24. package/lib/cjs/TitleGroup.cjs.map +1 -1
  25. package/lib/cjs/cerebellumTheme.cjs +5 -0
  26. package/lib/cjs/cerebellumTheme.cjs.map +1 -1
  27. package/lib/cjs/index.cjs +9 -3
  28. package/lib/cjs/index.cjs.map +1 -1
  29. package/lib/cjs/validateColorContrast.cjs +53 -0
  30. package/lib/cjs/validateColorContrast.cjs.map +1 -0
  31. package/lib/cjs/validateColorContrastWithMessage.cjs +10 -0
  32. package/lib/cjs/validateColorContrastWithMessage.cjs.map +1 -0
  33. package/lib/esm/ColorPickerInput-S8X2gIA5.js +180 -0
  34. package/lib/esm/ColorPickerInput-S8X2gIA5.js.map +1 -0
  35. package/lib/esm/ColorPickerInput.js +18 -0
  36. package/lib/esm/ColorPickerInput.js.map +1 -0
  37. package/lib/esm/DatePicker.js +1 -1
  38. package/lib/esm/Form.js +7 -5
  39. package/lib/esm/Form.js.map +1 -1
  40. package/lib/esm/FormFieldTypeEnum.js +5 -1
  41. package/lib/esm/FormFieldTypeEnum.js.map +1 -1
  42. package/lib/esm/FormSeparator.js +3 -1
  43. package/lib/esm/FormSeparator.js.map +1 -1
  44. package/lib/esm/{FormStyles-BQJPyTS0.js → FormStyles-CyqyMC1o.js} +39 -22
  45. package/lib/esm/{FormStyles-BQJPyTS0.js.map → FormStyles-CyqyMC1o.js.map} +1 -1
  46. package/lib/esm/FormWrapper.js +3 -1
  47. package/lib/esm/FormWrapper.js.map +1 -1
  48. package/lib/esm/{FormikContainer-SJPYfIkF.js → FormikContainer-uI5oe1px.js} +34 -4
  49. package/lib/esm/{FormikContainer-SJPYfIkF.js.map → FormikContainer-uI5oe1px.js.map} +1 -1
  50. package/lib/esm/InlineColorPickerInput.js +18 -0
  51. package/lib/esm/InlineColorPickerInput.js.map +1 -0
  52. package/lib/esm/{InlineDatePicker-ClVBWEzW.js → InlineDatePicker-BuxjkoV0.js} +345 -177
  53. package/lib/esm/InlineDatePicker-BuxjkoV0.js.map +1 -0
  54. package/lib/esm/InlineDatePicker.js +1 -1
  55. package/lib/esm/TitleGroup.js +3 -1
  56. package/lib/esm/TitleGroup.js.map +1 -1
  57. package/lib/esm/cerebellumTheme.js +5 -0
  58. package/lib/esm/cerebellumTheme.js.map +1 -1
  59. package/lib/esm/index.js +6 -4
  60. package/lib/esm/index.js.map +1 -1
  61. package/lib/esm/validateColorContrast.js +50 -0
  62. package/lib/esm/validateColorContrast.js.map +1 -0
  63. package/lib/esm/validateColorContrastWithMessage.js +3 -0
  64. package/lib/esm/validateColorContrastWithMessage.js.map +1 -0
  65. package/lib/types/src/components/ColorPickerInput/ColorPickerInput.d.ts +3 -0
  66. package/lib/types/src/components/ColorPickerInput/InlineColorPickerInput.d.ts +3 -0
  67. package/lib/types/src/components/ColorPickerInput/index.d.ts +3 -0
  68. package/lib/types/src/components/ColorPickerInput/types.d.ts +48 -0
  69. package/lib/types/src/components/Form/fields/ColorPickerField/ColorPickerField.d.ts +4 -0
  70. package/lib/types/src/components/Form/fields/ColorPickerField/index.d.ts +1 -0
  71. package/lib/types/src/components/Form/fields/index.d.ts +2 -1
  72. package/lib/types/src/components/Form/index.d.ts +3 -3
  73. package/lib/types/src/components/Form/mocks/fields.d.ts +62 -0
  74. package/lib/types/src/components/Form/types.d.ts +36 -2
  75. package/lib/types/src/helpers/colorValidators.d.ts +19 -0
  76. package/lib/types/src/index.d.ts +5 -1
  77. package/lib/types/src/theme.d.ts +6 -0
  78. package/package.json +1 -1
  79. package/lib/cjs/InlineDatePicker-DFv_uHo9.js.map +0 -1
  80. package/lib/esm/InlineDatePicker-ClVBWEzW.js.map +0 -1
@@ -0,0 +1,187 @@
1
+ 'use strict';
2
+
3
+ var _tslib = require('./_tslib-ByDtMVOd.js');
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var React = require('react');
6
+ var styled = require('styled-components');
7
+ var BodyLEmphasis = require('./BodyLEmphasis.cjs');
8
+ var useMeasure = require('./useMeasure-CDq3dPfD.js');
9
+ var showLabel = require('./showLabel-BkZISyqw.js');
10
+ var Inputs = require('./Inputs-IaHMnBKw.js');
11
+ var pressedEnter = require('./pressedEnter.cjs');
12
+ var validateColorContrast = require('./validateColorContrast.cjs');
13
+
14
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
15
+
16
+ var styled__default = /*#__PURE__*/_interopDefault(styled);
17
+
18
+ // Container that holds both the input and the text side by side
19
+ var ColorPickerContainer = styled__default.default.div(templateObject_1$1 || (templateObject_1$1 = _tslib.__makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-wrap: nowrap;\n gap: 12px;\n"], ["\n align-items: center;\n display: flex;\n flex-wrap: nowrap;\n gap: 12px;\n"])));
20
+ var ColorInputWrapper = styled__default.default.div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n align-items: center;\n background: ", ";\n border: solid 1px ", ";\n border-radius: ", "px;\n display: flex;\n flex-shrink: 0; /* Prevent the square from shrinking */\n height: ", "px;\n justify-content: center;\n min-width: ", "px;\n padding: ", "px;\n position: relative;\n transition: border-color 350ms ease-out 50ms, background-color 350ms ease-out 50ms;\n /* Make the wrapper square based on inputHeight, with a larger default for color pickers */\n width: ", "px;\n \n &:hover {\n border-color: ", ";\n }\n \n &:focus-within {\n border-color: ", ";\n }\n"], ["\n align-items: center;\n background: ", ";\n border: solid 1px ", ";\n border-radius: ", "px;\n display: flex;\n flex-shrink: 0; /* Prevent the square from shrinking */\n height: ", "px;\n justify-content: center;\n min-width: ", "px;\n padding: ", "px;\n position: relative;\n transition: border-color 350ms ease-out 50ms, background-color 350ms ease-out 50ms;\n /* Make the wrapper square based on inputHeight, with a larger default for color pickers */\n width: ", "px;\n \n &:hover {\n border-color: ", ";\n }\n \n &:focus-within {\n border-color: ", ";\n }\n"])), function (_a) {
21
+ var _b;
22
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
23
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputBackgroundColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.inputBackgroundColor);
24
+ }, function (_a) {
25
+ var _b, _c, _d;
26
+ var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
27
+ return $showValidationMessage
28
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
29
+ : $disabled
30
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
31
+ : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inactiveBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.inactiveBorderColor);
32
+ }, function (_a) {
33
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
34
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputBorderRadius) || theme.input.inputBorderRadius;
35
+ }, function (_a) {
36
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
37
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
38
+ }, function (_a) {
39
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
40
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
41
+ }, function (_a) {
42
+ var _b;
43
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
44
+ return (_b = $themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputPadding) !== null && _b !== void 0 ? _b : theme.colorPickerInput.padding;
45
+ }, function (_a) {
46
+ var $themeOverride = _a.$themeOverride, theme = _a.theme;
47
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
48
+ }, function (_a) {
49
+ var _b, _c, _d;
50
+ var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
51
+ return $showValidationMessage
52
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
53
+ : $disabled
54
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
55
+ : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.hoverBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.hoverBorderColor);
56
+ }, function (_a) {
57
+ var _b, _c, _d;
58
+ var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
59
+ return $showValidationMessage
60
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
61
+ : $disabled
62
+ ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
63
+ : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.activeBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.activeBorderColor);
64
+ });
65
+ // Custom styled color input that is 90% of the wrapper size and centered
66
+ var ColorInput = styled__default.default.input(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n background: none;\n border-radius: 4px;\n border: none;\n cursor: ", ";\n height: 90%;\n opacity: ", ";\n outline: none;\n width: 90%;\n \n /* Remove the default color input outline/border and ensure color is visible */\n &::-webkit-color-swatch-wrapper {\n border-radius: 4px;\n border: none;\n padding: 0;\n }\n \n &::-webkit-color-swatch {\n border: none;\n border-radius: 4px;\n outline: none;\n }\n \n &::-moz-color-swatch {\n border: none;\n border-radius: 4px;\n outline: none;\n }\n \n /* Firefox specific fixes */\n &::-moz-focus-inner {\n border: none;\n padding: 0;\n }\n \n &:focus {\n outline: none;\n }\n"], ["\n background: none;\n border-radius: 4px;\n border: none;\n cursor: ", ";\n height: 90%;\n opacity: ", ";\n outline: none;\n width: 90%;\n \n /* Remove the default color input outline/border and ensure color is visible */\n &::-webkit-color-swatch-wrapper {\n border-radius: 4px;\n border: none;\n padding: 0;\n }\n \n &::-webkit-color-swatch {\n border: none;\n border-radius: 4px;\n outline: none;\n }\n \n &::-moz-color-swatch {\n border: none;\n border-radius: 4px;\n outline: none;\n }\n \n /* Firefox specific fixes */\n &::-moz-focus-inner {\n border: none;\n padding: 0;\n }\n \n &:focus {\n outline: none;\n }\n"])), function (_a) {
67
+ var $disabled = _a.$disabled;
68
+ return ($disabled ? "not-allowed" : "pointer");
69
+ }, function (_a) {
70
+ var $disabled = _a.$disabled;
71
+ return ($disabled ? 0.5 : 1);
72
+ });
73
+ // Legibility text component that displays to the right, vertically centered
74
+ var LegibilityText = styled__default.default.div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n color: ", ";\n font-size: ", "px;\n opacity: ", ";\n white-space: nowrap;\n"], ["\n color: ", ";\n font-size: ", "px;\n opacity: ", ";\n white-space: nowrap;\n"])), function (_a) {
75
+ var _b, _c;
76
+ var $disabled = _a.$disabled, $themeOverride = _a.$themeOverride, theme = _a.theme;
77
+ return $disabled ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.disabledColor) : (_c = theme.input) === null || _c === void 0 ? void 0 : _c.helperTextColor;
78
+ }, function (_a) {
79
+ var _b;
80
+ var theme = _a.theme;
81
+ return (((_b = theme.input) === null || _b === void 0 ? void 0 : _b.textFontSize) || 14) - 2;
82
+ }, function (_a) {
83
+ var $disabled = _a.$disabled;
84
+ return ($disabled ? 0.5 : 1);
85
+ });
86
+ var InlineColorPickerInput = function (_a) {
87
+ var _b = _a.checkLegible, checkLegible = _b === void 0 ? false : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, focus = _a.focus, innerRef = _a.innerRef, inputLabel = _a.inputLabel, _d = _a.legibleAgainst, legibleAgainst = _d === void 0 ? "#ffffff" : _d, name = _a.name, onChange = _a.onChange, onEnter = _a.onEnter, onInputBlur = _a.onInputBlur, onInputFocus = _a.onInputFocus, onValueChange = _a.onValueChange, _e = _a.showValidationMessage, showValidationMessage = _e === void 0 ? false : _e, themeOverride = _a.themeOverride, value = _a.value;
88
+ var inputRef = innerRef || React.useRef(null);
89
+ // Calculate legibility and dynamic text
90
+ var legibilityInfo = React.useMemo(function () {
91
+ if (!checkLegible || !value) {
92
+ return { isLegible: true, legibilityText: undefined };
93
+ }
94
+ try {
95
+ var isLegible = validateColorContrast.validateColorContrast(value, legibleAgainst);
96
+ var legibilityText = void 0;
97
+ if (isLegible) {
98
+ legibilityText = "✅ Looks good";
99
+ }
100
+ else {
101
+ // Determine if we need lighter or darker
102
+ // If contrast with black is greater, the color is light and needs to be darker
103
+ // If contrast with white is greater, the color is dark and needs to be lighter
104
+ var needsDarker = pressedEnter.contrast(value, "#000000") > pressedEnter.contrast(value, "#ffffff");
105
+ legibilityText = needsDarker ? "⚠️ Too light" : "⚠️ Too dark";
106
+ }
107
+ return { isLegible: isLegible, legibilityText: legibilityText };
108
+ }
109
+ catch (error) {
110
+ // If there's an error in contrast calculation, assume it's legible
111
+ return { isLegible: true, legibilityText: undefined };
112
+ }
113
+ }, [checkLegible, value, legibleAgainst]);
114
+ React.useEffect(function () {
115
+ var _a;
116
+ if (focus) {
117
+ (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
118
+ }
119
+ }, [focus]);
120
+ return (jsxRuntime.jsxs(ColorPickerContainer, { children: [jsxRuntime.jsx(ColorInputWrapper, { "$disabled": disabled, "$showValidationMessage": showValidationMessage || (checkLegible && !legibilityInfo.isLegible), "$themeOverride": themeOverride, children: jsxRuntime.jsx(ColorInput, _tslib.__assign({ ref: inputRef, type: "color", value: value, disabled: disabled, "$disabled": disabled, "$themeOverride": themeOverride }, (name ? { name: name } : {}), { onChange: function (event) {
121
+ onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(event.target.value);
122
+ onChange === null || onChange === void 0 ? void 0 : onChange({
123
+ target: {
124
+ value: event.target.value,
125
+ name: name,
126
+ selectionStart: event.target.selectionStart || undefined,
127
+ selectionEnd: event.target.selectionEnd || undefined,
128
+ },
129
+ nativeEvent: event.nativeEvent,
130
+ });
131
+ }, onBlur: function (event) {
132
+ if (onInputBlur) {
133
+ onInputBlur(event);
134
+ }
135
+ }, onFocus: function (event) {
136
+ if (onInputFocus) {
137
+ onInputFocus(event);
138
+ }
139
+ }, onKeyDown: function (event) {
140
+ if (event.key === "Enter" && onEnter) {
141
+ onEnter(value);
142
+ }
143
+ }, "aria-label": typeof inputLabel === "string" ? inputLabel : undefined })) }), checkLegible && legibilityInfo.legibilityText && (jsxRuntime.jsx(LegibilityText, { "$isLegible": legibilityInfo.isLegible, "$disabled": disabled, "$themeOverride": themeOverride, children: legibilityInfo.legibilityText }))] }));
144
+ };
145
+ var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4;
146
+
147
+ var InstructionalText = styled__default.default(BodyLEmphasis.BodyXSPrimary)(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n\tcolor: ", ";\n\tfont-size: ", "px;\n\tmargin-bottom: ", "px;\n"], ["\n\tcolor: ", ";\n\tfont-size: ", "px;\n\tmargin-bottom: ", "px;\n"])), function (_a) {
148
+ var theme = _a.theme, $themeOverride = _a.$themeOverride;
149
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextColor) || theme.colorPickerInput.instructionalTextColor;
150
+ }, function (_a) {
151
+ var theme = _a.theme, $themeOverride = _a.$themeOverride;
152
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextFontSize) || theme.colorPickerInput.instructionalTextFontSize;
153
+ }, function (_a) {
154
+ var theme = _a.theme, $themeOverride = _a.$themeOverride;
155
+ return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextFontSize) || theme.colorPickerInput.instructionalTextFontSize;
156
+ });
157
+ var ColorPickerInput = function (props) {
158
+ var _a = props.checkLegible, checkLegible = _a === void 0 ? false : _a, _b = props.disabled, disabled = _b === void 0 ? false : _b, helperText = props.helperText, inputLabel = props.inputLabel, inputWidth = props.inputWidth, instructionalText = props.instructionalText, _c = props.showValidationMessage, showValidationMessage = _c === void 0 ? false : _c, themeOverride = props.themeOverride, validationMessage = props.validationMessage;
159
+ var labelBoxRef = React.useRef(null);
160
+ var _d = useMeasure.useMeasure(), inputGroupRef = _d[0], inputGroupMeasure = _d[1];
161
+ var validationRef = React.useRef(null);
162
+ var _e = React.useState(false), designSwitch = _e[0], setDesignSwitch = _e[1];
163
+ var helperTextVisible = !showValidationMessage || !designSwitch;
164
+ React.useEffect(function () {
165
+ var _a, _b;
166
+ var validationWidth = ((_a = validationRef.current) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
167
+ var labelWidth = ((_b = labelBoxRef.current) === null || _b === void 0 ? void 0 : _b.clientWidth) || 0;
168
+ var noRoomForTopLabel = validationWidth + labelWidth >= inputGroupMeasure.width;
169
+ if (noRoomForTopLabel) {
170
+ setDesignSwitch(true);
171
+ }
172
+ else {
173
+ setDesignSwitch(false);
174
+ }
175
+ }, [inputGroupMeasure.width, showValidationMessage, inputLabel, validationMessage]);
176
+ return (jsxRuntime.jsxs(Inputs.InputGroup, { ref: inputGroupRef, "$inputWidth": inputWidth, "$roomForError": showValidationMessage && !inputLabel, children: [jsxRuntime.jsx(Inputs.LabelBox, { ref: labelBoxRef, children: showLabel.showLabel({
177
+ inputLabel: inputLabel,
178
+ disabled: disabled,
179
+ disabledColor: themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.disabledColor,
180
+ labelColor: themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.labelColor,
181
+ }) }), instructionalText && jsxRuntime.jsx(InstructionalText, { "$themeOverride": themeOverride, children: instructionalText }), jsxRuntime.jsx(InlineColorPickerInput, _tslib.__assign({}, props, { checkLegible: checkLegible, themeOverride: themeOverride })), jsxRuntime.jsx(Inputs.ValidationText, { ref: validationRef, "$showValidationMessage": showValidationMessage, "$disabled": disabled, "$failColor": themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.failColor, "$disabledColor": themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.disabledColor, "$designSwitch": designSwitch && showValidationMessage, children: validationMessage }), helperTextVisible && (jsxRuntime.jsx(Inputs.HelperText, { "$disabled": disabled, "$helperTextColor": themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.helperTextColor, "$disabledColor": themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.disabledColor, "data-sentry-unmask": true, children: helperText }))] }));
182
+ };
183
+ var templateObject_1;
184
+
185
+ exports.ColorPickerInput = ColorPickerInput;
186
+ exports.InlineColorPickerInput = InlineColorPickerInput;
187
+ //# sourceMappingURL=ColorPickerInput-CBPI8IJ-.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ColorPickerInput-CBPI8IJ-.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -0,0 +1,25 @@
1
+ 'use strict';
2
+
3
+ var ColorPickerInput = require('./ColorPickerInput-CBPI8IJ-.js');
4
+ require('./_tslib-ByDtMVOd.js');
5
+ require('react/jsx-runtime');
6
+ require('react');
7
+ require('styled-components');
8
+ require('./BodyLEmphasis.cjs');
9
+ require('./useMeasure-CDq3dPfD.js');
10
+ require('./addOrRemoveById.cjs');
11
+ require('dayjs');
12
+ require('./isEmptyObject.cjs');
13
+ require('./useIsomorphicLayoutEffect-kdlV9QVN.js');
14
+ require('./showLabel-BkZISyqw.js');
15
+ require('./Inputs-IaHMnBKw.js');
16
+ require('./colors.cjs');
17
+ require('./IconComponentStyles-oUWNoaaH.js');
18
+ require('./pressedEnter.cjs');
19
+ require('./validateColorContrast.cjs');
20
+
21
+
22
+
23
+ exports.ColorPickerInput = ColorPickerInput.ColorPickerInput;
24
+ exports.InlineColorPickerInput = ColorPickerInput.InlineColorPickerInput;
25
+ //# sourceMappingURL=ColorPickerInput.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ColorPickerInput.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
@@ -3,7 +3,7 @@
3
3
  var _tslib = require('./_tslib-ByDtMVOd.js');
4
4
  var jsxRuntime = require('react/jsx-runtime');
5
5
  var React = require('react');
6
- var InlineDatePicker = require('./InlineDatePicker-DFv_uHo9.js');
6
+ var InlineDatePicker = require('./InlineDatePicker-B7DTwvhv.js');
7
7
  var useMeasure = require('./useMeasure-CDq3dPfD.js');
8
8
  var showLabel = require('./showLabel-BkZISyqw.js');
9
9
  var Inputs = require('./Inputs-IaHMnBKw.js');
package/lib/cjs/Form.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
- var FormWrapper = require('./FormStyles-CxgYRZOl.js');
4
- var FormikContainer = require('./FormikContainer-CY2nLsAs.js');
3
+ var FormWrapper = require('./FormStyles-CM25rbhG.js');
4
+ var FormikContainer = require('./FormikContainer-DVL86Jri.js');
5
5
  var FormFieldTypeEnum = require('./FormFieldTypeEnum.cjs');
6
6
  require('./_tslib-ByDtMVOd.js');
7
7
  require('styled-components');
@@ -20,6 +20,8 @@ require('./Switches-Cpums4DB.js');
20
20
  require('./DescriptiveSwitchMenuStyles-BwkgIy6d.js');
21
21
  require('./SwitchTypeEnum.cjs');
22
22
  require('./addOrRemoveById.cjs');
23
+ require('./validateColorContrast.cjs');
24
+ require('./pressedEnter.cjs');
23
25
  require('./formatBytesToString.cjs');
24
26
  require('./northAmericanNumberingPlanRegex.cjs');
25
27
  require('yup');
@@ -28,7 +30,6 @@ require('react');
28
30
  require('./ButtonColorFamilyEnum.cjs');
29
31
  require('./LoadingEllipsis-COKIzsEu.js');
30
32
  require('./Button.cjs');
31
- require('./pressedEnter.cjs');
32
33
  require('./ArrowLong.cjs');
33
34
  require('./colors-BudXQEyU.js');
34
35
  require('./CaretDown.cjs');
@@ -62,6 +63,7 @@ require('./Checkbox-Cd_xyAss.js');
62
63
  require('./CheckboxEmpty.cjs');
63
64
  require('./CheckboxFull.cjs');
64
65
  require('./CheckboxGroup-BeBI_kWP.js');
66
+ require('./ColorPickerInput-CBPI8IJ-.js');
65
67
  require('./ConfigurableInput-naz2E_Pb.js');
66
68
  require('./RadioGroup-B0HUH_33.js');
67
69
  require('./RadioItem-ChF6qHFI.js');
@@ -94,7 +96,7 @@ require('./cardValidationStateMachine.cjs');
94
96
  require('./CurrencyInput-D_QGbxkC.js');
95
97
  require('./InlineCurrencyInput-UjEz4U3A.js');
96
98
  require('./DatePicker.cjs');
97
- require('./InlineDatePicker-DFv_uHo9.js');
99
+ require('./InlineDatePicker-B7DTwvhv.js');
98
100
  require('./Calendar.cjs');
99
101
  require('./ClickOutHandler-b5mI7kuA.js');
100
102
  require('./CaretLeft.cjs');
@@ -160,6 +162,7 @@ Object.defineProperty(exports, "RemovableFieldTypeEnum", {
160
162
  exports.isAddress = FormFieldTypeEnum.isAddress;
161
163
  exports.isCheckbox = FormFieldTypeEnum.isCheckbox;
162
164
  exports.isCheckboxGroup = FormFieldTypeEnum.isCheckboxGroup;
165
+ exports.isColorPicker = FormFieldTypeEnum.isColorPicker;
163
166
  exports.isConfigurableInput = FormFieldTypeEnum.isConfigurableInput;
164
167
  exports.isCountrySelect = FormFieldTypeEnum.isCountrySelect;
165
168
  exports.isCountySelect = FormFieldTypeEnum.isCountySelect;
@@ -1 +1 @@
1
- {"version":3,"file":"Form.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Form.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -5,6 +5,7 @@ exports.FormFieldTypeEnum = void 0;
5
5
  FormFieldTypeEnum["Address"] = "ADDRESS";
6
6
  FormFieldTypeEnum["Checkbox"] = "CHECKBOX";
7
7
  FormFieldTypeEnum["CheckboxGroup"] = "CHECKBOX_GROUP";
8
+ FormFieldTypeEnum["ColorPicker"] = "COLOR_PICKER";
8
9
  FormFieldTypeEnum["ConfigurableInput"] = "CONFIGURABLE_INPUT";
9
10
  FormFieldTypeEnum["CountySelect"] = "COUNTY_SELECT";
10
11
  FormFieldTypeEnum["CountrySelect"] = "COUNTRY_SELECT";
@@ -46,6 +47,9 @@ var isCheckbox = function (field) {
46
47
  var isCheckboxGroup = function (field) {
47
48
  return field.type === exports.FormFieldTypeEnum.CheckboxGroup;
48
49
  };
50
+ var isColorPicker = function (field) {
51
+ return field.type === exports.FormFieldTypeEnum.ColorPicker;
52
+ };
49
53
  var isConfigurableInput = function (field) {
50
54
  return field.type === exports.FormFieldTypeEnum.ConfigurableInput;
51
55
  };
@@ -161,6 +165,7 @@ exports.isAddress = isAddress;
161
165
  exports.isArrayOfSelectOptionsType = isArrayOfSelectOptionsType;
162
166
  exports.isCheckbox = isCheckbox;
163
167
  exports.isCheckboxGroup = isCheckboxGroup;
168
+ exports.isColorPicker = isColorPicker;
164
169
  exports.isConfigurableInput = isConfigurableInput;
165
170
  exports.isCountrySelect = isCountrySelect;
166
171
  exports.isCountySelect = isCountySelect;
@@ -1 +1 @@
1
- {"version":3,"file":"FormFieldTypeEnum.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"FormFieldTypeEnum.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -7,7 +7,7 @@ require('./BodyLEmphasis.cjs');
7
7
  require('./Loading.cjs');
8
8
  require('./Scroller.cjs');
9
9
  require('./Inputs-IaHMnBKw.js');
10
- var FormWrapper = require('./FormStyles-CxgYRZOl.js');
10
+ var FormWrapper = require('./FormStyles-CM25rbhG.js');
11
11
  require('react/jsx-runtime');
12
12
  require('./IconComponentStyles-oUWNoaaH.js');
13
13
  require('./CheckboxStyles-CAzemGXD.js');
@@ -18,6 +18,8 @@ require('./Switches-Cpums4DB.js');
18
18
  require('./DescriptiveSwitchMenuStyles-BwkgIy6d.js');
19
19
  require('./SwitchTypeEnum.cjs');
20
20
  require('./addOrRemoveById.cjs');
21
+ require('./validateColorContrast.cjs');
22
+ require('./pressedEnter.cjs');
21
23
  require('./formatBytesToString.cjs');
22
24
  require('./northAmericanNumberingPlanRegex.cjs');
23
25
  require('yup');
@@ -1 +1 @@
1
- {"version":3,"file":"FormSeparator.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"FormSeparator.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -16,6 +16,7 @@ require('./Switches-Cpums4DB.js');
16
16
  require('./DescriptiveSwitchMenuStyles-BwkgIy6d.js');
17
17
  var SwitchTypeEnum = require('./SwitchTypeEnum.cjs');
18
18
  var addOrRemoveById = require('./addOrRemoveById.cjs');
19
+ var validateColorContrast = require('./validateColorContrast.cjs');
19
20
  var formatBytesToString = require('./formatBytesToString.cjs');
20
21
  var northAmericanNumberingPlanRegex = require('./northAmericanNumberingPlanRegex.cjs');
21
22
  var yup = require('yup');
@@ -195,8 +196,24 @@ var formatValidationInternals = function (_a) {
195
196
  validationFunction ||
196
197
  (required && allowRequired && !disabled ? yup__namespace.array().of(yup__namespace.string()).min(1, requiredMessage) : yup__namespace.array().of(yup__namespace.string()));
197
198
  }
199
+ else if (FormFieldTypeEnum.isColorPicker(field)) {
200
+ var _j = field.requiredMessage, requiredMessage = _j === void 0 ? "This field is required" : _j, _k = field.validationMessage, validationMessage = _k === void 0 ? "This color does not have sufficient contrast for accessibility" : _k;
201
+ var _l = field.options || {}, _m = _l.checkLegible, checkLegible = _m === void 0 ? false : _m, _o = _l.legibleAgainst, legibleAgainst_1 = _o === void 0 ? "#ffffff" : _o;
202
+ // Create base string validation
203
+ var colorSchema = yup__namespace.string();
204
+ // Add contrast validation if checkLegible is enabled
205
+ if (checkLegible) {
206
+ colorSchema = colorSchema.test("color-contrast", validationMessage, function (value) {
207
+ if (!value)
208
+ return true; // Allow empty values, let required validation handle this
209
+ return validateColorContrast.validateColorContrast(value, legibleAgainst_1);
210
+ });
211
+ }
212
+ validationInternals[name_6] =
213
+ validationFunction || (required && allowRequired && !disabled ? colorSchema.required(requiredMessage) : colorSchema);
214
+ }
198
215
  else if (FormFieldTypeEnum.isConfigurableInput(field)) {
199
- var _j = field.requiredMessage, requiredMessage = _j === void 0 ? "This field is required" : _j, _k = field.validationMessage, validationMessage = _k === void 0 ? "This field must be a string" : _k, options = field.options;
216
+ var _p = field.requiredMessage, requiredMessage = _p === void 0 ? "This field is required" : _p, _q = field.validationMessage, validationMessage = _q === void 0 ? "This field must be a string" : _q, options = field.options;
200
217
  var maskedRadios = options.maskedRadios, defaultId = options.defaultId;
201
218
  var activeId = configurableInputFieldActiveIds[name_6] || defaultId || maskedRadios[0].value;
202
219
  var selectedOption = addOrRemoveById.getObjectById({ array: maskedRadios, id: activeId, idKey: "value" });
@@ -209,31 +226,31 @@ var formatValidationInternals = function (_a) {
209
226
  : yup__namespace.string().typeError(validationMessage));
210
227
  }
211
228
  else if (FormFieldTypeEnum.isCountySelect(field)) {
212
- var _l = field.requiredMessage, requiredMessage = _l === void 0 ? "This field is required" : _l, _m = field.validationMessage, validationMessage = _m === void 0 ? "This field must be a string" : _m;
229
+ var _r = field.requiredMessage, requiredMessage = _r === void 0 ? "This field is required" : _r, _s = field.validationMessage, validationMessage = _s === void 0 ? "This field must be a string" : _s;
213
230
  validationInternals[name_6] =
214
231
  validationFunction ||
215
232
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
216
233
  }
217
234
  else if (FormFieldTypeEnum.isCountrySelect(field)) {
218
- var _o = field.requiredMessage, requiredMessage = _o === void 0 ? "This field is required" : _o, _p = field.validationMessage, validationMessage = _p === void 0 ? "This field must be a string" : _p;
235
+ var _t = field.requiredMessage, requiredMessage = _t === void 0 ? "This field is required" : _t, _u = field.validationMessage, validationMessage = _u === void 0 ? "This field must be a string" : _u;
219
236
  validationInternals[name_6] =
220
237
  validationFunction ||
221
238
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
222
239
  }
223
240
  else if (FormFieldTypeEnum.isCreditCard(field)) {
224
- var _q = field.requiredMessage, requiredMessage = _q === void 0 ? "This field is required" : _q, _r = field.validationMessage, validationMessage = _r === void 0 ? "This field must be a string" : _r;
241
+ var _v = field.requiredMessage, requiredMessage = _v === void 0 ? "This field is required" : _v, _w = field.validationMessage, validationMessage = _w === void 0 ? "This field must be a string" : _w;
225
242
  validationInternals[name_6] =
226
243
  validationFunction ||
227
244
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
228
245
  }
229
246
  else if (FormFieldTypeEnum.isCurrency(field)) {
230
- var _s = field.requiredMessage, requiredMessage = _s === void 0 ? "This field is required" : _s, _t = field.validationMessage, validationMessage = _t === void 0 ? "This field must be a number" : _t;
247
+ var _x = field.requiredMessage, requiredMessage = _x === void 0 ? "This field is required" : _x, _y = field.validationMessage, validationMessage = _y === void 0 ? "This field must be a number" : _y;
231
248
  validationInternals[name_6] =
232
249
  validationFunction ||
233
250
  (required && allowRequired && !disabled ? yup__namespace.number().required(requiredMessage) : yup__namespace.number().typeError(validationMessage));
234
251
  }
235
252
  else if (FormFieldTypeEnum.isDatePicker(field)) {
236
- var _u = field.requiredMessage, requiredMessage = _u === void 0 ? "This field is required" : _u, _v = field.validationMessage, validationMessage = _v === void 0 ? "Please enter a valid date" : _v;
253
+ var _z = field.requiredMessage, requiredMessage = _z === void 0 ? "This field is required" : _z, _0 = field.validationMessage, validationMessage = _0 === void 0 ? "Please enter a valid date" : _0;
237
254
  var dateSchema = yup__namespace
238
255
  .date()
239
256
  // For some reason, "value" is always wrong. Thanks react-datepicker. Thanks a lot.
@@ -250,7 +267,7 @@ var formatValidationInternals = function (_a) {
250
267
  validationFunction || (required && allowRequired && !disabled ? dateSchema.required(requiredMessage) : dateSchema);
251
268
  }
252
269
  else if (FormFieldTypeEnum.isDescriptiveDropdownInput(field)) {
253
- var _w = field.requiredMessage, requiredMessage = _w === void 0 ? "Please select at least one" : _w, _x = field.validationMessage, validationMessage = _x === void 0 ? "This field must be a string" : _x;
270
+ var _1 = field.requiredMessage, requiredMessage = _1 === void 0 ? "Please select at least one" : _1, _2 = field.validationMessage, validationMessage = _2 === void 0 ? "This field must be a string" : _2;
254
271
  var switchType = (_b = field.options) === null || _b === void 0 ? void 0 : _b.switchType;
255
272
  if (!switchType || switchType === SwitchTypeEnum.SwitchTypeEnum.Radio) {
256
273
  validationInternals[name_6] =
@@ -264,7 +281,7 @@ var formatValidationInternals = function (_a) {
264
281
  }
265
282
  }
266
283
  else if (FormFieldTypeEnum.isEmail(field)) {
267
- var _y = field.requiredMessage, requiredMessage = _y === void 0 ? "Please enter your email" : _y, _z = field.validationMessage, validationMessage = _z === void 0 ? "Invalid email" : _z;
284
+ var _3 = field.requiredMessage, requiredMessage = _3 === void 0 ? "Please enter your email" : _3, _4 = field.validationMessage, validationMessage = _4 === void 0 ? "Invalid email" : _4;
268
285
  validationInternals[name_6] =
269
286
  validationFunction ||
270
287
  (required && allowRequired && !disabled
@@ -273,7 +290,7 @@ var formatValidationInternals = function (_a) {
273
290
  }
274
291
  else if (FormFieldTypeEnum.isImagePicker(field)) {
275
292
  var maxFileSize_1 = ((_c = field.options) === null || _c === void 0 ? void 0 : _c.maxFileSize) || 9999999999;
276
- var initialValue_1 = field.initialValue, _0 = field.requiredMessage, requiredMessage = _0 === void 0 ? "Please pick an image" : _0, _1 = field.validationMessage, validationMessage = _1 === void 0 ? "File cannot exceed ".concat(formatBytesToString.formatBytesToString({ bytes: maxFileSize_1 })) : _1;
293
+ var initialValue_1 = field.initialValue, _5 = field.requiredMessage, requiredMessage = _5 === void 0 ? "Please pick an image" : _5, _6 = field.validationMessage, validationMessage = _6 === void 0 ? "File cannot exceed ".concat(formatBytesToString.formatBytesToString({ bytes: maxFileSize_1 })) : _6;
277
294
  validationInternals[name_6] =
278
295
  validationFunction ||
279
296
  (required && allowRequired && !disabled
@@ -281,13 +298,13 @@ var formatValidationInternals = function (_a) {
281
298
  : yup__namespace.mixed().test("fileSize", validationMessage, function (value) { return imageValidation({ value: value, maxFileSize: maxFileSize_1, initialValue: initialValue_1 }); })); // will validate if there is no file, or if the initialValue is passed
282
299
  }
283
300
  else if (FormFieldTypeEnum.isMultiSelect(field)) {
284
- var _2 = field.requiredMessage, requiredMessage = _2 === void 0 ? "This field is required" : _2;
301
+ var _7 = field.requiredMessage, requiredMessage = _7 === void 0 ? "This field is required" : _7;
285
302
  validationInternals[name_6] =
286
303
  validationFunction ||
287
304
  (required && allowRequired && !disabled ? yup__namespace.array().of(yup__namespace.string()).min(1, requiredMessage) : yup__namespace.array().of(yup__namespace.string()));
288
305
  }
289
306
  else if (FormFieldTypeEnum.isNumber(field)) {
290
- var _3 = field.requiredMessage, requiredMessage = _3 === void 0 ? "This field is required" : _3, _4 = field.validationMessage, validationMessage = _4 === void 0 ? "Please enter a valid number" : _4;
307
+ var _8 = field.requiredMessage, requiredMessage = _8 === void 0 ? "This field is required" : _8, _9 = field.validationMessage, validationMessage = _9 === void 0 ? "Please enter a valid number" : _9;
291
308
  validationInternals[name_6] =
292
309
  validationFunction ||
293
310
  (required && allowRequired && !disabled
@@ -304,7 +321,7 @@ var formatValidationInternals = function (_a) {
304
321
  }));
305
322
  }
306
323
  else if (FormFieldTypeEnum.isPhone(field)) {
307
- var _5 = field.requiredMessage, requiredMessage = _5 === void 0 ? "Phone number is required" : _5, _6 = field.validationMessage, validationMessage = _6 === void 0 ? "Please enter a valid phone number" : _6;
324
+ var _10 = field.requiredMessage, requiredMessage = _10 === void 0 ? "Phone number is required" : _10, _11 = field.validationMessage, validationMessage = _11 === void 0 ? "Please enter a valid phone number" : _11;
308
325
  validationInternals[name_6] =
309
326
  validationFunction ||
310
327
  (required && allowRequired && !disabled
@@ -322,19 +339,19 @@ var formatValidationInternals = function (_a) {
322
339
  }));
323
340
  }
324
341
  else if (FormFieldTypeEnum.isRadioGroup(field)) {
325
- var _7 = field.requiredMessage, requiredMessage = _7 === void 0 ? "Please select one" : _7, _8 = field.validationMessage, validationMessage = _8 === void 0 ? "This field must be a string" : _8;
342
+ var _12 = field.requiredMessage, requiredMessage = _12 === void 0 ? "Please select one" : _12, _13 = field.validationMessage, validationMessage = _13 === void 0 ? "This field must be a string" : _13;
326
343
  validationInternals[name_6] =
327
344
  validationFunction ||
328
345
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
329
346
  }
330
347
  else if (FormFieldTypeEnum.isSelect(field)) {
331
- var _9 = field.requiredMessage, requiredMessage = _9 === void 0 ? "This field is required" : _9, _10 = field.validationMessage, validationMessage = _10 === void 0 ? "This field must be a string" : _10;
348
+ var _14 = field.requiredMessage, requiredMessage = _14 === void 0 ? "This field is required" : _14, _15 = field.validationMessage, validationMessage = _15 === void 0 ? "This field must be a string" : _15;
332
349
  validationInternals[name_6] =
333
350
  validationFunction ||
334
351
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
335
352
  }
336
353
  else if (FormFieldTypeEnum.isSocialSecurity(field)) {
337
- var _11 = field.requiredMessage, requiredMessage = _11 === void 0 ? "Please enter an SSN" : _11, _12 = field.validationMessage, validationMessage = _12 === void 0 ? "Please enter a valid SSN" : _12;
354
+ var _16 = field.requiredMessage, requiredMessage = _16 === void 0 ? "Please enter an SSN" : _16, _17 = field.validationMessage, validationMessage = _17 === void 0 ? "Please enter a valid SSN" : _17;
338
355
  validationInternals[name_6] =
339
356
  validationFunction ||
340
357
  (required && allowRequired && !disabled
@@ -351,25 +368,25 @@ var formatValidationInternals = function (_a) {
351
368
  }));
352
369
  }
353
370
  else if (FormFieldTypeEnum.isStateSelect(field)) {
354
- var _13 = field.requiredMessage, requiredMessage = _13 === void 0 ? "This field is required" : _13, _14 = field.validationMessage, validationMessage = _14 === void 0 ? "This field must be a string" : _14;
371
+ var _18 = field.requiredMessage, requiredMessage = _18 === void 0 ? "This field is required" : _18, _19 = field.validationMessage, validationMessage = _19 === void 0 ? "This field must be a string" : _19;
355
372
  validationInternals[name_6] =
356
373
  validationFunction ||
357
374
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
358
375
  }
359
376
  else if (FormFieldTypeEnum.isTextarea(field)) {
360
- var _15 = field.requiredMessage, requiredMessage = _15 === void 0 ? "This field is required" : _15, _16 = field.validationMessage, validationMessage = _16 === void 0 ? "This field must be a string" : _16;
377
+ var _20 = field.requiredMessage, requiredMessage = _20 === void 0 ? "This field is required" : _20, _21 = field.validationMessage, validationMessage = _21 === void 0 ? "This field must be a string" : _21;
361
378
  validationInternals[name_6] =
362
379
  validationFunction ||
363
380
  (required && allowRequired && !disabled ? yup__namespace.string().required(requiredMessage) : yup__namespace.string().typeError(validationMessage));
364
381
  }
365
382
  else if (FormFieldTypeEnum.isToggleGroup(field)) {
366
- var _17 = field.requiredMessage, requiredMessage = _17 === void 0 ? "Please select at least one" : _17;
383
+ var _22 = field.requiredMessage, requiredMessage = _22 === void 0 ? "Please select at least one" : _22;
367
384
  validationInternals[name_6] =
368
385
  validationFunction ||
369
386
  (required && allowRequired && !disabled ? yup__namespace.array().of(yup__namespace.string()).min(1, requiredMessage) : yup__namespace.array().of(yup__namespace.string()));
370
387
  }
371
388
  else if (FormFieldTypeEnum.isZipCode(field)) {
372
- var _18 = field.requiredMessage, requiredMessage = _18 === void 0 ? "Please enter a zip code" : _18, _19 = field.validationMessage, validationMessage = _19 === void 0 ? "Please enter a valid zip code" : _19;
389
+ var _23 = field.requiredMessage, requiredMessage = _23 === void 0 ? "Please enter a zip code" : _23, _24 = field.validationMessage, validationMessage = _24 === void 0 ? "Please enter a valid zip code" : _24;
373
390
  validationInternals[name_6] =
374
391
  validationFunction ||
375
392
  (required && allowRequired && !disabled
@@ -386,7 +403,7 @@ var formatValidationInternals = function (_a) {
386
403
  }));
387
404
  }
388
405
  else {
389
- var _20 = field.requiredMessage, requiredMessage = _20 === void 0 ? "This field is required" : _20, _21 = field.validationMessage, validationMessage = _21 === void 0 ? "This field must be a string" : _21;
406
+ var _25 = field.requiredMessage, requiredMessage = _25 === void 0 ? "This field is required" : _25, _26 = field.validationMessage, validationMessage = _26 === void 0 ? "This field must be a string" : _26;
390
407
  validationInternals[name_6] =
391
408
  validationFunction ||
392
409
  (required && allowRequired && !disabled
@@ -754,4 +771,4 @@ exports.formHasValues = formHasValues;
754
771
  exports.formatInitialValues = formatInitialValues;
755
772
  exports.formatValidation = formatValidation;
756
773
  exports.shouldFade = shouldFade;
757
- //# sourceMappingURL=FormStyles-CxgYRZOl.js.map
774
+ //# sourceMappingURL=FormStyles-CM25rbhG.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormStyles-CxgYRZOl.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"FormStyles-CM25rbhG.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -7,7 +7,7 @@ require('./BodyLEmphasis.cjs');
7
7
  require('./Loading.cjs');
8
8
  require('./Scroller.cjs');
9
9
  require('./Inputs-IaHMnBKw.js');
10
- var FormWrapper = require('./FormStyles-CxgYRZOl.js');
10
+ var FormWrapper = require('./FormStyles-CM25rbhG.js');
11
11
  require('react/jsx-runtime');
12
12
  require('./IconComponentStyles-oUWNoaaH.js');
13
13
  require('./CheckboxStyles-CAzemGXD.js');
@@ -18,6 +18,8 @@ require('./Switches-Cpums4DB.js');
18
18
  require('./DescriptiveSwitchMenuStyles-BwkgIy6d.js');
19
19
  require('./SwitchTypeEnum.cjs');
20
20
  require('./addOrRemoveById.cjs');
21
+ require('./validateColorContrast.cjs');
22
+ require('./pressedEnter.cjs');
21
23
  require('./formatBytesToString.cjs');
22
24
  require('./northAmericanNumberingPlanRegex.cjs');
23
25
  require('yup');
@@ -1 +1 @@
1
- {"version":3,"file":"FormWrapper.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"FormWrapper.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}