@cerebruminc/cerebellum 16.1.1-beta.dangerous.94a8f04 → 16.1.1-beta.dangerous.bc77c27

package/lib/types/src/components/Form/fields/index.d.ts

@@ -1,7 +1,6 @@
 import { AddressField } from "./AddressField/AddressField";
 import { CheckboxField } from "./CheckboxField/CheckboxField";
 import { CheckboxGroupField } from "./CheckboxGroupField/CheckboxGroupField";
-import { ColorPickerField } from "./ColorPickerField/ColorPickerField";
 import { ConfigurableInputField } from "./ConfigurableInputField/ConfigurableInputField";
 import { CountrySelectField } from "./CountrySelectField/CountrySelectField";
 import { CountySelectField } from "./CountySelectField/CountySelectField";
@@ -29,4 +28,4 @@ import { TextareaField } from "./TextareaField/TextareaField";
 import { ToggleField } from "./ToggleField/ToggleField";
 import { ToggleGroupField } from "./ToggleGroupField/ToggleGroupField";
 import { ZipCodeField } from "./ZipCodeField/ZipCodeField";
-export { AddressField, CheckboxField, CheckboxGroupField, ColorPickerField, ConfigurableInputField, CountySelectField, CountrySelectField, CreditCardField, CurrencyField, DatePickerField, DescriptiveDropdownInputField, EmailField, HiddenField, ImagePickerField, MultiSelectField, NationalitySelectField, NumberField, PasswordField, PhoneField, RadioGroupField, RemovableField, SectionHeader, SelectField, SocialSecurityField, SplitLineField, StateSelectField, TextField, TextareaField, ToggleField, ToggleGroupField, ZipCodeField, };
+export { AddressField, CheckboxField, CheckboxGroupField, ConfigurableInputField, CountySelectField, CountrySelectField, CreditCardField, CurrencyField, DatePickerField, DescriptiveDropdownInputField, EmailField, HiddenField, ImagePickerField, MultiSelectField, NationalitySelectField, NumberField, PasswordField, PhoneField, RadioGroupField, RemovableField, SectionHeader, SelectField, SocialSecurityField, SplitLineField, StateSelectField, TextField, TextareaField, ToggleField, ToggleGroupField, ZipCodeField, };

package/lib/types/src/components/Form/index.d.ts

@@ -1,5 +1,5 @@
 import { FormWrapper } from "./FormStyles";
 import { FormikContainer as Form } from "./FormikContainer";
-import { AddressOptionsType, CheckboxGroupOptionsType, CheckboxOptionsType, ColorPickerOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormFieldTypeEnum, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, RemovableFieldTypeEnum, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleGroupOptionsType, ToggleOptionsType, ZipCodeOptionsType, isAddress, isCheckbox, isCheckboxGroup, isColorPicker, isConfigurableInput, isCountrySelect, isCountySelect, isCreditCard, isCurrency, isDatePicker, isDescriptiveDropdownInput, isEmail, isFormFieldType, isImagePicker, isMultiSelect, isNationalitySelect, isNumber, isPassword, isPhone, isRadioGroup, isRemovable, isSectionHeader, isSelect, isSocialSecurity, isSplitLine, isStateSelect, isTextarea, isToggle, isToggleGroup, isZipCode } from "./types";
-export { Form, FormFieldTypeEnum, FormWrapper, RemovableFieldTypeEnum, isAddress, isCheckbox, isCheckboxGroup, isColorPicker, isConfigurableInput, isCountrySelect, isCountySelect, isCreditCard, isCurrency, isDatePicker, isDescriptiveDropdownInput, isEmail, isFormFieldType, isImagePicker, isMultiSelect, isNationalitySelect, isNumber, isPassword, isPhone, isRadioGroup, isRemovable, isSectionHeader, isSelect, isSocialSecurity, isSplitLine, isStateSelect, isTextarea, isToggle, isToggleGroup, isZipCode, };
-export type { AddressOptionsType, CheckboxOptionsType, CheckboxGroupOptionsType, ColorPickerOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleOptionsType, ToggleGroupOptionsType, ZipCodeOptionsType, };
+import { AddressOptionsType, CheckboxGroupOptionsType, CheckboxOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormFieldTypeEnum, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, RemovableFieldTypeEnum, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleGroupOptionsType, ToggleOptionsType, ZipCodeOptionsType, isAddress, isCheckbox, isCheckboxGroup, isConfigurableInput, isCountrySelect, isCountySelect, isCreditCard, isCurrency, isDatePicker, isDescriptiveDropdownInput, isEmail, isFormFieldType, isImagePicker, isMultiSelect, isNationalitySelect, isNumber, isPassword, isPhone, isRadioGroup, isRemovable, isSectionHeader, isSelect, isSocialSecurity, isSplitLine, isStateSelect, isTextarea, isToggle, isToggleGroup, isZipCode } from "./types";
+export { Form, FormFieldTypeEnum, FormWrapper, RemovableFieldTypeEnum, isAddress, isCheckbox, isCheckboxGroup, isConfigurableInput, isCountrySelect, isCountySelect, isCreditCard, isCurrency, isDatePicker, isDescriptiveDropdownInput, isEmail, isFormFieldType, isImagePicker, isMultiSelect, isNationalitySelect, isNumber, isPassword, isPhone, isRadioGroup, isRemovable, isSectionHeader, isSelect, isSocialSecurity, isSplitLine, isStateSelect, isTextarea, isToggle, isToggleGroup, isZipCode, };
+export type { AddressOptionsType, CheckboxOptionsType, CheckboxGroupOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleOptionsType, ToggleGroupOptionsType, ZipCodeOptionsType, };

package/lib/types/src/components/Form/mocks/fields.d.ts

@@ -104,7 +104,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -144,7 +143,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -183,7 +181,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -222,7 +219,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -261,7 +257,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -300,7 +295,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -341,7 +335,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -385,7 +378,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -424,7 +416,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -463,7 +454,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -502,7 +492,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -541,7 +530,6 @@ export declare const allFieldTypes: ({
         countyFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -579,7 +567,6 @@ export declare const allFieldTypes: ({
         maxDateUnix?: undefined;
         countyFieldName?: undefined;
         stateFieldName?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -618,46 +605,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
-        placeholderInitials?: undefined;
-        menuOptions?: undefined;
-        switchType?: undefined;
-        selectOptions?: undefined;
-        label?: undefined;
-        toggles?: undefined;
-        region?: undefined;
-        checkboxes?: undefined;
-        maskedRadios?: undefined;
-    };
-    initialValue?: undefined;
-    required?: undefined;
-    width?: undefined;
-    header?: undefined;
-    separator?: undefined;
-    subHeader?: undefined;
-    text?: undefined;
-    validationMessage?: undefined;
-    inlineFields?: undefined;
-} | {
-    fieldLabel: string;
-    name: string;
-    type: FormFieldTypeEnum;
-    options: {
-        helperText: string;
-        checkLegible: boolean;
-        placeholder?: undefined;
-        disabled?: undefined;
-        showIcon?: undefined;
-        clearButton?: undefined;
-        showFlag?: undefined;
-        radios?: undefined;
-        characterLimit?: undefined;
-        initialValue?: undefined;
-        maxDateUnix?: undefined;
-        countyFieldName?: undefined;
-        stateFieldName?: undefined;
-        center?: undefined;
-        leftLabel?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -698,7 +645,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
         selectOptions?: undefined;
@@ -738,7 +684,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         selectOptions?: undefined;
         label?: undefined;
@@ -786,7 +731,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -826,7 +770,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -878,7 +821,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -915,7 +857,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -983,7 +924,6 @@ export declare const allFieldTypes: ({
         countyFieldName?: undefined;
         stateFieldName?: undefined;
         center?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -1030,7 +970,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;
@@ -1091,7 +1030,6 @@ export declare const allFieldTypes: ({
         stateFieldName?: undefined;
         center?: undefined;
         leftLabel?: undefined;
-        checkLegible?: undefined;
         placeholderInitials?: undefined;
         menuOptions?: undefined;
         switchType?: undefined;

package/lib/types/src/components/Form/types.d.ts

@@ -151,7 +151,7 @@ export interface ValuesType {
 export interface ShowIfType {
     values: ValuesType;
 }
-type OptionTypes = AddressOptionsType | CheckboxOptionsType | CheckboxGroupOptionsType | ColorPickerOptionsType | CountySelectOptionsType | CountrySelectOptionsType | CreditCardOptionsType | CurrencyOptionsType | DatePickerOptionsType | DescriptiveDropdownInputOptionsType | EmailOptionsType | HiddenOptionsType | ImagePickerOptionsType | IconCheckboxesOptionsType | MultiSelectOptionsType | NumberOptionsType | PasswordOptionsType | PhoneOptionsType | RadioGroupOptionsType | SelectOptionsType | SocialSecurityOptionsType | StateSelectOptionsType | TextOptionsType | TextareaOptionsType | ToggleOptionsType | ToggleGroupOptionsType | ZipCodeOptionsType;
+type OptionTypes = AddressOptionsType | CheckboxOptionsType | CheckboxGroupOptionsType | CountySelectOptionsType | CountrySelectOptionsType | CreditCardOptionsType | CurrencyOptionsType | DatePickerOptionsType | DescriptiveDropdownInputOptionsType | EmailOptionsType | HiddenOptionsType | ImagePickerOptionsType | IconCheckboxesOptionsType | MultiSelectOptionsType | NumberOptionsType | PasswordOptionsType | PhoneOptionsType | RadioGroupOptionsType | SelectOptionsType | SocialSecurityOptionsType | StateSelectOptionsType | TextOptionsType | TextareaOptionsType | ToggleOptionsType | ToggleGroupOptionsType | ZipCodeOptionsType;
 export interface AddButtonType {
     addFunction: () => void;
     color?: ButtonColorFamilyEnum;
@@ -193,22 +193,6 @@ export interface CheckboxGroupOptionsType {
     breakText?: boolean;
     onCheckboxClick?: (event: ChangeEvent<HTMLInputElement>) => void;
 }
-export interface ColorPickerOptionsType {
-    checkLegible?: boolean;
-    helperText?: string | ReactElement;
-    innerRef?: RefObject<HTMLInputElement>;
-    instructionalText?: string;
-    legibleAgainst?: string;
-    onEnter?: () => void;
-    onInputBlur?: (event: FocusEvent<HTMLInputElement>) => void;
-    onInputFocus?: () => void;
-    onChange?: (event: {
-        target: {
-            value: string;
-            name?: string;
-        };
-    }) => void;
-}
 export interface ConfigurableInputOptionsType {
     clearButton?: boolean;
     defaultId?: string;
@@ -616,7 +600,6 @@ export declare enum FormFieldTypeEnum {
     Address = "ADDRESS",
     Checkbox = "CHECKBOX",
     CheckboxGroup = "CHECKBOX_GROUP",
-    ColorPicker = "COLOR_PICKER",
     ConfigurableInput = "CONFIGURABLE_INPUT",
     CountySelect = "COUNTY_SELECT",
     CountrySelect = "COUNTRY_SELECT",
@@ -701,23 +684,6 @@ export interface CheckboxGroupFieldProps {
     submitAttempt: boolean;
     submitOnBlur?: boolean;
 }
-export interface ColorPickerFieldType extends Omit<FormFieldType, "options"> {
-    options?: ColorPickerOptionsType;
-}
-export declare const isColorPicker: (field: FormFieldType) => field is ColorPickerFieldType;
-export interface ColorPickerFieldProps {
-    fade?: boolean;
-    field: ColorPickerFieldType;
-    formikProps: any;
-    leftLabels?: boolean;
-    leftLabelWidth?: number;
-    leftLabelsRightGutter?: number;
-    rowGap?: number;
-    setHasValues: Dispatch<SetStateAction<boolean>>;
-    setSubmitAttempt: Dispatch<SetStateAction<boolean>>;
-    submitAttempt: boolean;
-    submitOnBlur?: boolean;
-}
 export interface ConfigurableInputFieldType extends Omit<FormFieldType, "options"> {
     options: ConfigurableInputOptionsType;
 }
@@ -1116,7 +1082,7 @@ export interface InlineFieldType {
     validationFunction?: YupSchema;
     nextGap?: number;
 }
-type SplitLineOptionTypes = AddressOptionsType | CheckboxOptionsType | ColorPickerOptionsType | CountySelectOptionsType | CountrySelectOptionsType | CreditCardOptionsType | CurrencyOptionsType | DatePickerOptionsType | DescriptiveDropdownInputOptionsType | EmailOptionsType | ImagePickerOptionsType | MultiSelectOptionsType | NumberOptionsType | PasswordOptionsType | PhoneOptionsType | SelectOptionsType | SocialSecurityOptionsType | StateSelectOptionsType | TextOptionsType | ToggleOptionsType | ZipCodeOptionsType;
+type SplitLineOptionTypes = AddressOptionsType | CheckboxOptionsType | CountySelectOptionsType | CountrySelectOptionsType | CreditCardOptionsType | CurrencyOptionsType | DatePickerOptionsType | DescriptiveDropdownInputOptionsType | EmailOptionsType | ImagePickerOptionsType | MultiSelectOptionsType | NumberOptionsType | PasswordOptionsType | PhoneOptionsType | SelectOptionsType | SocialSecurityOptionsType | StateSelectOptionsType | TextOptionsType | ToggleOptionsType | ZipCodeOptionsType;
 export declare const isSplitLine: (field: SingleOrMultipleFieldType) => field is SplitLineFieldType;
 export interface SplitLineFieldProps {
     fade?: boolean;

package/lib/types/src/index.d.ts

@@ -9,7 +9,6 @@ export { CheckboxGroup } from "./components/CheckboxGroup";
 export { ClearableTag } from "./components/ClearableTag";
 export { ClickOutHandler } from "./components/ClickOutHandler";
 export { ColorButton } from "./components/ColorButton";
-export { ColorPickerInput, InlineColorPickerInput } from "./components/ColorPickerInput";
 export { ColorPickerMenu } from "./components/ColorPickerMenu";
 export { ConfigurableInput } from "./components/ConfigurableInput";
 export { ConfirmModal } from "./components/ConfirmModal";
@@ -102,7 +101,6 @@ export { usStates } from "./const/usStates";
 export { addOrRemoveById, addOrRemoveString, getObjectById, makeIdString, removeById, removeByIdArray, removeString, replaceObjectById, setAllKeysToValue, setObjectById, toggleObjectById, } from "./helpers/arrays";
 export { getPosition } from "./helpers/position";
 export { pressedEnter, higherContrast } from "./helpers/accessibility";
-export { validateColorContrast, validateColorContrastWithMessage } from "./helpers/colorValidators";
 export { northAmericanPhoneMask, colombianPhoneMask, brazilianPhoneMask, mexicanPhoneMask } from "./helpers/inputMasks";
 export { formatBytesToString, formatNumberToString } from "./helpers/numbers";
 export { northAmericanNumberingPlanRegex, validateRegex } from "./helpers/phoneValidators";
@@ -138,7 +136,6 @@ export type { CheckboxItemType } from "./components/CheckboxItem";
 export type { ClearableTagType } from "./components/ClearableTag";
 export type { ClickOutHandlerType } from "./components/ClickOutHandler";
 export type { ColorButtonType } from "./components/ColorButton";
-export type { ColorPickerInputType, ColorPickerInputThemeOverride, ThemeOverride as InlineColorPickerInputThemeOverride, } from "./components/ColorPickerInput";
 export type { ColorPickerMenuType } from "./components/ColorPickerMenu";
 export type { ConfigurableInputType, MaskedRadioType } from "./components/ConfigurableInput";
 export type { ConfirmModalType } from "./components/ConfirmModal";
@@ -152,13 +149,12 @@ export type { DrawerDividerType } from "./components/Drawer/DrawerDivider";
 export type { EmailInputType } from "./components/EmailInput";
 export type { FiltersBarType } from "./components/FiltersBar";
 export type { FooterProps } from "./components/Footer";
-export type { AddressOptionsType, CheckboxOptionsType, CheckboxGroupOptionsType, ColorPickerOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleOptionsType, ToggleGroupOptionsType, ZipCodeOptionsType, } from "./components/Form";
+export type { AddressOptionsType, CheckboxOptionsType, CheckboxGroupOptionsType, CountySelectOptionsType, CreditCardOptionsType, CurrencyOptionsType, DatePickerOptionsType, EmailOptionsType, FormFieldType, FormReturnType, FormWrapperType, IconCheckboxesOptionsType, MultiSelectOptionsType, NationalitySelectOptionsType, NumberOptionsType, PasswordOptionsType, PhoneOptionsType, RadioGroupOptionsType, RemovableFieldType, SelectOptionType, SelectOptionsType, ShowIfType, SingleOrMultipleFieldType, SocialSecurityOptionsType, SplitLineFieldType, StateSelectOptionsType, TextOptionsType, TextareaOptionsType, ToggleOptionsType, ToggleGroupOptionsType, ZipCodeOptionsType, } from "./components/Form";
 export type { HorizontalTabMenuType } from "./components/HorizontalTabMenu";
 export type { IconButtonType } from "./components/IconButton";
 export type { IconProps, IconType } from "./components/Icons";
 export type { IconTileType } from "./components/IconTile";
 export type { ImagePickerType } from "./components/ImagePicker";
-export type { InlineColorPickerInputType } from "./components/ColorPickerInput";
 export type { InlineEmailInputType } from "./components/InlineEmailInput";
 export type { InlineCreditCardInputType } from "./components/InlineCreditCardInput";
 export type { InlineCurrencyInputType } from "./components/InlineCurrencyInput";

package/lib/types/src/theme.d.ts

@@ -53,11 +53,6 @@ interface ColorButtonTheme {
     focusColor: string;
     borderColor: string;
 }
-interface ColorPickerInputTheme {
-    instructionalTextColor: string;
-    instructionalTextFontSize: number;
-    padding: number;
-}
 interface ColorPickerTheme {
     borderColor: string;
     buttonSize: number;
@@ -589,7 +584,6 @@ interface CustomTheme {
     colorButton: ColorButtonTheme;
     colorFamilies: ColorFamilyTheme;
     colorPicker: ColorPickerTheme;
-    colorPickerInput: ColorPickerInputTheme;
     colorPickerMenu: ColorPickerMenuTheme;
     configurableInput: ConfigurableInputTheme;
     confirmModal: ConfirmModalTheme;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cerebruminc/cerebellum",
-  "version": "16.1.1-beta.dangerous.94a8f04",
+  "version": "16.1.1-beta.dangerous.bc77c27",
   "description": "Cerebrum's React Component Library",
   "type": "module",
   "main": "lib/cjs/index.cjs",
@@ -114,7 +114,7 @@
     "rollup-plugin-typescript2": "^0.36.0",
     "rollup-plugin-visualizer": "^5.12.0",
     "storybook": "^9.0.0",
-    "ts-jest": "29.3.4",
+    "ts-jest": "29.4.5",
     "ts-patch": "^3.2.1",
     "typescript": "^5.8.3",
     "typescript-transform-paths": "^3.4.6",

package/lib/cjs/ColorPickerInput-CBPI8IJ-.js

@@ -1,187 +0,0 @@
-'use strict';
-
-var _tslib = require('./_tslib-ByDtMVOd.js');
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var styled = require('styled-components');
-var BodyLEmphasis = require('./BodyLEmphasis.cjs');
-var useMeasure = require('./useMeasure-CDq3dPfD.js');
-var showLabel = require('./showLabel-BkZISyqw.js');
-var Inputs = require('./Inputs-IaHMnBKw.js');
-var pressedEnter = require('./pressedEnter.cjs');
-var validateColorContrast = require('./validateColorContrast.cjs');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var styled__default = /*#__PURE__*/_interopDefault(styled);
-
-// Container that holds both the input and the text side by side
-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"])));
-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) {
-    var _b;
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputBackgroundColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.inputBackgroundColor);
-}, function (_a) {
-    var _b, _c, _d;
-    var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
-    return $showValidationMessage
-        ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
-        : $disabled
-            ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
-            : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inactiveBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.inactiveBorderColor);
-}, function (_a) {
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputBorderRadius) || theme.input.inputBorderRadius;
-}, function (_a) {
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
-}, function (_a) {
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
-}, function (_a) {
-    var _b;
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return (_b = $themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputPadding) !== null && _b !== void 0 ? _b : theme.colorPickerInput.padding;
-}, function (_a) {
-    var $themeOverride = _a.$themeOverride, theme = _a.theme;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.inputHeight) || theme.input.inputHeight;
-}, function (_a) {
-    var _b, _c, _d;
-    var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
-    return $showValidationMessage
-        ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
-        : $disabled
-            ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
-            : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.hoverBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.hoverBorderColor);
-}, function (_a) {
-    var _b, _c, _d;
-    var $disabled = _a.$disabled, theme = _a.theme, $showValidationMessage = _a.$showValidationMessage, $themeOverride = _a.$themeOverride;
-    return $showValidationMessage
-        ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.failColor) || ((_b = theme.input) === null || _b === void 0 ? void 0 : _b.failColor)
-        : $disabled
-            ? ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.disabledBorderColor) || ((_c = theme.input) === null || _c === void 0 ? void 0 : _c.disabledBorderColor)
-            : ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.activeBorderColor) || ((_d = theme.input) === null || _d === void 0 ? void 0 : _d.activeBorderColor);
-});
-// Custom styled color input that is 90% of the wrapper size and centered
-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) {
-    var $disabled = _a.$disabled;
-    return ($disabled ? "not-allowed" : "pointer");
-}, function (_a) {
-    var $disabled = _a.$disabled;
-    return ($disabled ? 0.5 : 1);
-});
-// Legibility text component that displays to the right, vertically centered
-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) {
-    var _b, _c;
-    var $disabled = _a.$disabled, $themeOverride = _a.$themeOverride, theme = _a.theme;
-    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;
-}, function (_a) {
-    var _b;
-    var theme = _a.theme;
-    return (((_b = theme.input) === null || _b === void 0 ? void 0 : _b.textFontSize) || 14) - 2;
-}, function (_a) {
-    var $disabled = _a.$disabled;
-    return ($disabled ? 0.5 : 1);
-});
-var InlineColorPickerInput = function (_a) {
-    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;
-    var inputRef = innerRef || React.useRef(null);
-    // Calculate legibility and dynamic text
-    var legibilityInfo = React.useMemo(function () {
-        if (!checkLegible || !value) {
-            return { isLegible: true, legibilityText: undefined };
-        }
-        try {
-            var isLegible = validateColorContrast.validateColorContrast(value, legibleAgainst);
-            var legibilityText = void 0;
-            if (isLegible) {
-                legibilityText = "✅ Looks good";
-            }
-            else {
-                // Determine if we need lighter or darker
-                // If contrast with black is greater, the color is light and needs to be darker
-                // If contrast with white is greater, the color is dark and needs to be lighter
-                var needsDarker = pressedEnter.contrast(value, "#000000") > pressedEnter.contrast(value, "#ffffff");
-                legibilityText = needsDarker ? "⚠️ Too light" : "⚠️ Too dark";
-            }
-            return { isLegible: isLegible, legibilityText: legibilityText };
-        }
-        catch (error) {
-            // If there's an error in contrast calculation, assume it's legible
-            return { isLegible: true, legibilityText: undefined };
-        }
-    }, [checkLegible, value, legibleAgainst]);
-    React.useEffect(function () {
-        var _a;
-        if (focus) {
-            (_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-    }, [focus]);
-    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) {
-                        onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(event.target.value);
-                        onChange === null || onChange === void 0 ? void 0 : onChange({
-                            target: {
-                                value: event.target.value,
-                                name: name,
-                                selectionStart: event.target.selectionStart || undefined,
-                                selectionEnd: event.target.selectionEnd || undefined,
-                            },
-                            nativeEvent: event.nativeEvent,
-                        });
-                    }, onBlur: function (event) {
-                        if (onInputBlur) {
-                            onInputBlur(event);
-                        }
-                    }, onFocus: function (event) {
-                        if (onInputFocus) {
-                            onInputFocus(event);
-                        }
-                    }, onKeyDown: function (event) {
-                        if (event.key === "Enter" && onEnter) {
-                            onEnter(value);
-                        }
-                    }, "aria-label": typeof inputLabel === "string" ? inputLabel : undefined })) }), checkLegible && legibilityInfo.legibilityText && (jsxRuntime.jsx(LegibilityText, { "$isLegible": legibilityInfo.isLegible, "$disabled": disabled, "$themeOverride": themeOverride, children: legibilityInfo.legibilityText }))] }));
-};
-var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4;
-
-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) {
-    var theme = _a.theme, $themeOverride = _a.$themeOverride;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextColor) || theme.colorPickerInput.instructionalTextColor;
-}, function (_a) {
-    var theme = _a.theme, $themeOverride = _a.$themeOverride;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextFontSize) || theme.colorPickerInput.instructionalTextFontSize;
-}, function (_a) {
-    var theme = _a.theme, $themeOverride = _a.$themeOverride;
-    return ($themeOverride === null || $themeOverride === void 0 ? void 0 : $themeOverride.instructionalTextFontSize) || theme.colorPickerInput.instructionalTextFontSize;
-});
-var ColorPickerInput = function (props) {
-    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;
-    var labelBoxRef = React.useRef(null);
-    var _d = useMeasure.useMeasure(), inputGroupRef = _d[0], inputGroupMeasure = _d[1];
-    var validationRef = React.useRef(null);
-    var _e = React.useState(false), designSwitch = _e[0], setDesignSwitch = _e[1];
-    var helperTextVisible = !showValidationMessage || !designSwitch;
-    React.useEffect(function () {
-        var _a, _b;
-        var validationWidth = ((_a = validationRef.current) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
-        var labelWidth = ((_b = labelBoxRef.current) === null || _b === void 0 ? void 0 : _b.clientWidth) || 0;
-        var noRoomForTopLabel = validationWidth + labelWidth >= inputGroupMeasure.width;
-        if (noRoomForTopLabel) {
-            setDesignSwitch(true);
-        }
-        else {
-            setDesignSwitch(false);
-        }
-    }, [inputGroupMeasure.width, showValidationMessage, inputLabel, validationMessage]);
-    return (jsxRuntime.jsxs(Inputs.InputGroup, { ref: inputGroupRef, "$inputWidth": inputWidth, "$roomForError": showValidationMessage && !inputLabel, children: [jsxRuntime.jsx(Inputs.LabelBox, { ref: labelBoxRef, children: showLabel.showLabel({
-                    inputLabel: inputLabel,
-                    disabled: disabled,
-                    disabledColor: themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.disabledColor,
-                    labelColor: themeOverride === null || themeOverride === void 0 ? void 0 : themeOverride.labelColor,
-                }) }), 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 }))] }));
-};
-var templateObject_1;
-
-exports.ColorPickerInput = ColorPickerInput;
-exports.InlineColorPickerInput = InlineColorPickerInput;
-//# sourceMappingURL=ColorPickerInput-CBPI8IJ-.js.map

package/lib/cjs/ColorPickerInput-CBPI8IJ-.js.map

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

package/lib/cjs/ColorPickerInput.cjs

@@ -1,25 +0,0 @@
-'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=ColorPickerInput.cjs.map

package/lib/cjs/ColorPickerInput.cjs.map

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