@bloom-housing/ui-components 3.0.1-alpha.9 → 4.0.0

package/.jest/setup-tests.js

@@ -1,4 +1,5 @@
 import "@testing-library/jest-dom/extend-expect"
+import { configure } from "@testing-library/dom"
 
 import { addTranslation } from "../src/helpers/translator"
 import general from "../src/locales/general.json"
@@ -18,3 +19,5 @@ window.matchMedia = jest.fn().mockImplementation((query) => {
 })
 
 addTranslation(general)
+
+configure({ testIdAttribute: "data-test-id" })

package/CHANGELOG.md

@@ -3,6 +3,388 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.0.0](https://github.com/seanmalbert/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.48...@bloom-housing/ui-components@4.0.0) (2021-12-22)
+
+
+### Bug Fixes
+
+* removes more closed listing application paths ([#2319](https://github.com/seanmalbert/bloom/issues/2319)) ([ff50205](https://github.com/seanmalbert/bloom/commit/ff50205f371ebd63d07168b290733d0f1e2d493c))
+
+
+### Code Refactoring
+
+* removing helpers from ui-components that are backend dependent ([#2108](https://github.com/seanmalbert/bloom/issues/2108)) ([1d0c1f3](https://github.com/seanmalbert/bloom/commit/1d0c1f340781a3ba76c89462d8bee954dd40b889))
+
+
+### Features
+
+* adds updating open listing modal ([#2288](https://github.com/seanmalbert/bloom/issues/2288)) ([4f6945f](https://github.com/seanmalbert/bloom/commit/4f6945f04d797fad1b3140bcdc74b134ea42810a))
+* make page header title optional ([6ce7707](https://github.com/seanmalbert/bloom/commit/6ce770790120fe3d472bca2a937a9b9d3faaa943))
+
+
+### BREAKING CHANGES
+
+* moved some helpers from ui-components to shared-helpers
+
+
+
+
+
+## [3.0.1-alpha.48](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.47...@bloom-housing/ui-components@3.0.1-alpha.48) (2021-12-15)
+
+
+### Bug Fixes
+
+* add mailThin icon to stories ([ba8400b](https://github.com/bloom-housing/bloom/commit/ba8400bed4e9d653f85ec38ef4bca3b74df371dd))
+* make mailThin background transparent ([87b372b](https://github.com/bloom-housing/bloom/commit/87b372b28e1b44c5a450544a2d15f09a84de2ebb))
+
+
+
+
+
+## [3.0.1-alpha.47](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.46...@bloom-housing/ui-components@3.0.1-alpha.47) (2021-12-15)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.46](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.45...@bloom-housing/ui-components@3.0.1-alpha.46) (2021-12-15)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.45](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.44...@bloom-housing/ui-components@3.0.1-alpha.45) (2021-12-14)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.44](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.43...@bloom-housing/ui-components@3.0.1-alpha.44) (2021-12-14)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.43](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.42...@bloom-housing/ui-components@3.0.1-alpha.43) (2021-12-13)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.42](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.40...@bloom-housing/ui-components@3.0.1-alpha.42) (2021-12-13)
+
+
+### Bug Fixes
+
+* fix hero button width with secondary button ([#2306](https://github.com/bloom-housing/bloom/issues/2306)) ([929ac8e](https://github.com/bloom-housing/bloom/commit/929ac8e7fd30718a77a10277323abf1604a45a19))
+* mobile notice text wrap issue ([#2308](https://github.com/bloom-housing/bloom/issues/2308)) ([47fdd7e](https://github.com/bloom-housing/bloom/commit/47fdd7ea0e15ec50888cb00f1caa11df269c9e84))
+* versioning issues ([#2311](https://github.com/bloom-housing/bloom/issues/2311)) ([0b1d143](https://github.com/bloom-housing/bloom/commit/0b1d143ab8b17add9d52533560f28d7a1f6dfd3d))
+
+
+
+
+
+## [3.0.1-alpha.40](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.39...@bloom-housing/ui-components@3.0.1-alpha.40) (2021-12-10)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.39](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.38...@bloom-housing/ui-components@3.0.1-alpha.39) (2021-12-09)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.38](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.37...@bloom-housing/ui-components@3.0.1-alpha.38) (2021-12-09)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.37](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.36...@bloom-housing/ui-components@3.0.1-alpha.37) (2021-12-09)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.36](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.35...@bloom-housing/ui-components@3.0.1-alpha.36) (2021-12-09)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.35](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.34...@bloom-housing/ui-components@3.0.1-alpha.35) (2021-12-08)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.34](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.33...@bloom-housing/ui-components@3.0.1-alpha.34) (2021-12-07)
+
+
+### Bug Fixes
+
+* account translations ([#2278](https://github.com/bloom-housing/bloom/issues/2278)) ([1420282](https://github.com/bloom-housing/bloom/commit/1420282ec0de17b8629f2a7dd6c1149f7a1f8894))
+
+
+
+
+
+## [3.0.1-alpha.33](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.32...@bloom-housing/ui-components@3.0.1-alpha.33) (2021-12-07)
+
+
+### Features
+
+* overrides fallback to english, tagalog support ([#2262](https://github.com/bloom-housing/bloom/issues/2262)) ([679ab9b](https://github.com/bloom-housing/bloom/commit/679ab9b1816d5934f48f02ca5f5696952ef88ae7))
+
+
+
+
+
+## [3.0.1-alpha.32](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.31...@bloom-housing/ui-components@3.0.1-alpha.32) (2021-12-07)
+
+
+### Bug Fixes
+
+* Fix modal styles on mobile ([#2280](https://github.com/bloom-housing/bloom/issues/2280)) ([95f45e5](https://github.com/bloom-housing/bloom/commit/95f45e5a6d2c38c512f59d8cb35847cab59dc8bb)), closes [#2253](https://github.com/bloom-housing/bloom/issues/2253)
+
+
+
+
+
+## [3.0.1-alpha.31](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.30...@bloom-housing/ui-components@3.0.1-alpha.31) (2021-12-06)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.30](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.29...@bloom-housing/ui-components@3.0.1-alpha.30) (2021-12-03)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.29](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.28...@bloom-housing/ui-components@3.0.1-alpha.29) (2021-12-03)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.28](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.27...@bloom-housing/ui-components@3.0.1-alpha.28) (2021-12-03)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.27](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.26...@bloom-housing/ui-components@3.0.1-alpha.27) (2021-12-01)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.26](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.25...@bloom-housing/ui-components@3.0.1-alpha.26) (2021-12-01)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.25](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.24...@bloom-housing/ui-components@3.0.1-alpha.25) (2021-11-30)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.24](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.23...@bloom-housing/ui-components@3.0.1-alpha.24) (2021-11-29)
+
+
+### Bug Fixes
+
+* guard against 0 output ([0ea9012](https://github.com/bloom-housing/bloom/commit/0ea9012fdac02fb1cb4357abec2ec69633902654))
+* remove bold style from current waitlist size ([2e2f414](https://github.com/bloom-housing/bloom/commit/2e2f4141e62c8544c0828b29de0b99bb97abb201))
+* show waitlist values even if they're zero ([6a35e67](https://github.com/bloom-housing/bloom/commit/6a35e679f142105e40719e89bda3d957e3200e1d))
+* simpler conditionals ([f3e588d](https://github.com/bloom-housing/bloom/commit/f3e588d5e6dd0a39d1aed99ef6eba0054540ed14))
+* waitlist: handle both null and undefined ([90fd369](https://github.com/bloom-housing/bloom/commit/90fd369b471c7f9baa0a1d58f452159449fe6fcf))
+
+
+### Features
+
+* simplify Waitlist component and use more flexible schema ([96df149](https://github.com/bloom-housing/bloom/commit/96df1496f377ddfa6f0e6c016c84954b6a43ff4a))
+
+
+
+
+
+## [3.0.1-alpha.23](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.22...@bloom-housing/ui-components@3.0.1-alpha.23) (2021-11-29)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.22](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.21...@bloom-housing/ui-components@3.0.1-alpha.22) (2021-11-23)
+
+
+### Bug Fixes
+
+* remove alameda reference in demographics ([#2209](https://github.com/bloom-housing/bloom/issues/2209)) ([7d5991c](https://github.com/bloom-housing/bloom/commit/7d5991cbf6dbe0b61f2b14d265e87ce3687f743d))
+
+
+
+
+
+## [3.0.1-alpha.21](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.20...@bloom-housing/ui-components@3.0.1-alpha.21) (2021-11-23)
+
+
+### Bug Fixes
+
+* change the yes/no radio text to be more descriptive ([#2208](https://github.com/bloom-housing/bloom/issues/2208)) ([0c46054](https://github.com/bloom-housing/bloom/commit/0c46054574535523d6f217bb0677bbe732b8945f))
+
+
+
+
+
+## [3.0.1-alpha.20](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.19...@bloom-housing/ui-components@3.0.1-alpha.20) (2021-11-23)
+
+
+### Bug Fixes
+
+* add ariaLabel prop to Button component ([509ddc8](https://github.com/bloom-housing/bloom/commit/509ddc898ba44c05e26f8ed8c777f1ba456eeee5))
+
+
+
+
+
+## [3.0.1-alpha.19](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.18...@bloom-housing/ui-components@3.0.1-alpha.19) (2021-11-23)
+
+
+### Bug Fixes
+
+* add ariaHidden to Icon component ([c7bb86a](https://github.com/bloom-housing/bloom/commit/c7bb86aec6fd5ad386c7ca50087d0113b14503be))
+
+
+
+
+
+## [3.0.1-alpha.18](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.17...@bloom-housing/ui-components@3.0.1-alpha.18) (2021-11-23)
+
+
+### Features
+
+* new demographics sub-race questions ([#2109](https://github.com/bloom-housing/bloom/issues/2109)) ([9ab8926](https://github.com/bloom-housing/bloom/commit/9ab892694c1ad2fa8890b411b3b32af68ade1fc3))
+
+
+
+
+
+## [3.0.1-alpha.17](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.16...@bloom-housing/ui-components@3.0.1-alpha.17) (2021-11-22)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.16](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.15...@bloom-housing/ui-components@3.0.1-alpha.16) (2021-11-22)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.15](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.14...@bloom-housing/ui-components@3.0.1-alpha.15) (2021-11-16)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.14](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.13...@bloom-housing/ui-components@3.0.1-alpha.14) (2021-11-16)
+
+
+### Bug Fixes
+
+* preference cleanup for avance ([d0aebbc](https://github.com/bloom-housing/bloom/commit/d0aebbcd334dfffc4a7a1a39e9964c90155c5bfb))
+
+
+
+
+
+## [3.0.1-alpha.13](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.12...@bloom-housing/ui-components@3.0.1-alpha.13) (2021-11-16)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.12](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.11...@bloom-housing/ui-components@3.0.1-alpha.12) (2021-11-16)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.11](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.10...@bloom-housing/ui-components@3.0.1-alpha.11) (2021-11-15)
+
+**Note:** Version bump only for package @bloom-housing/ui-components
+
+
+
+
+
+## [3.0.1-alpha.10](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.9...@bloom-housing/ui-components@3.0.1-alpha.10) (2021-11-12)
+
+
+### Features
+
+* refactor and add public site application flow cypress tests ([#2118](https://github.com/bloom-housing/bloom/issues/2118)) ([9ec0e8d](https://github.com/bloom-housing/bloom/commit/9ec0e8d05f9570773110754e7fdaf49254d1eab8))
+
+
+
+
+
 ## [3.0.1-alpha.9](https://github.com/bloom-housing/bloom/compare/@bloom-housing/ui-components@3.0.1-alpha.8...@bloom-housing/ui-components@3.0.1-alpha.9) (2021-11-12)
 
 **Note:** Version bump only for package @bloom-housing/ui-components

package/index.ts

@@ -58,23 +58,16 @@ export * from "./src/helpers/dateToString"
 export * from "./src/helpers/formOptions"
 export * from "./src/helpers/links"
 export * from "./src/helpers/mergeDeep"
-export * from "./src/helpers/localeRoute"
-export * from "./src/helpers/nextjs"
 export * from "./src/helpers/numberOrdinal"
-export * from "./src/helpers/occupancyFormatting"
-export * from "./src/helpers/photos"
-export * from "./src/helpers/pdfs"
-export * from "./src/helpers/tableSummaries"
 export * from "./src/helpers/translator"
 export * from "./src/helpers/debounce"
 export * from "./src/helpers/validators"
-export * from "./src/helpers/blankApplication"
 export * from "./src/helpers/formatYesNoLabel"
 export * from "./src/helpers/getTranslationWithArguments"
 export * from "./src/helpers/preferences"
 export * from "./src/helpers/resolveObject"
 export * from "./src/helpers/useMutate"
-export * from "./src/helpers/unitTypes"
+export * from "./src/helpers/tableSummaries"
 
 /* Icons */
 export * from "./src/icons/HeaderBadge"

package/jest.config.js

@@ -9,7 +9,6 @@ module.exports = {
     "**/*.tsx",
     "!**/*.stories.tsx",
     "<rootDir>/ui-components/src/helpers/*.ts",
-    "!<rootDir>/ui-components/src/helpers/blankApplication.ts",
   ],
   coverageReporters: ["lcov", "text"],
   coverageDirectory: "test-coverage",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bloom-housing/ui-components",
-  "version": "3.0.1-alpha.9",
+  "version": "4.0.0",
   "author": "Sean Albert <sean.albert@exygy.com>",
   "description": "Shared user interface components for Bloom affordable housing system",
   "homepage": "https://github.com/bloom-housing/bloom/tree/master/shared/ui-components",
@@ -69,6 +69,7 @@
     "webpack": "^4.44.2"
   },
   "dependencies": {
+    "@bloom-housing/backend-core": "^3.0.1",
     "@mapbox/mapbox-sdk": "^0.13.0",
     "@types/body-scroll-lock": "^2.6.1",
     "@types/jwt-decode": "^2.2.1",
@@ -79,7 +80,7 @@
     "@types/react-dom": "^16.9.5",
     "@types/react-text-mask": "^5.4.6",
     "@types/react-transition-group": "^4.4.0",
-    "axios": "^0.21.1",
+    "axios": "0.21.1",
     "body-scroll-lock": "^3.1.5",
     "jwt-decode": "^2.2.0",
     "markdown-to-jsx": "^6.11.4",
@@ -99,8 +100,5 @@
     "tailwindcss": "2.2.10",
     "typesafe-actions": "^5.1.0"
   },
-  "peerDependencies": {
-    "@bloom-housing/backend-core": ">= 2.0.0-pre-tailwind"
-  },
-  "gitHead": "22fe6a3536ece3c0860efe1b7f2f382d1f336054"
+  "gitHead": "7f017f5b74d996eb9385d767825a2a842f5456ac"
 }

package/src/actions/Button.tsx

@@ -19,6 +19,9 @@ export interface ButtonProps extends AppearanceProps {
   className?: string
   disabled?: boolean
   loading?: boolean
+  ariaLabel?: string
+  dataTestId?: string
+  "data-test-id"?: string
 }
 
 export const buttonClassesForProps = (props: Omit<ButtonProps, "onClick">) => {
@@ -67,11 +70,14 @@ const Button = (props: ButtonProps) => {
 
   return (
     <button
+      {...props}
       id={props.id}
       type={props.type}
       className={buttonClasses.join(" ")}
       onClick={props.onClick}
       disabled={props.disabled || props.loading}
+      aria-label={props.ariaLabel}
+      data-test-id={props.dataTestId || props["data-test-id"]}
     >
       {buttonInner(props)}
     </button>

package/src/actions/LinkButton.tsx

@@ -6,6 +6,7 @@ import { isExternalLink } from "../helpers/links"
 
 export interface LinkButtonProps extends Omit<ButtonProps, "onClick"> {
   href: string
+  dataTestId?: string
 }
 
 const LinkButton = (props: LinkButtonProps) => {
@@ -14,13 +15,17 @@ const LinkButton = (props: LinkButtonProps) => {
 
   if (isExternalLink(props.href)) {
     return (
-      <a href={props.href} className={buttonClasses.join(" ")}>
+      <a href={props.href} className={buttonClasses.join(" ")} data-test-id={props.dataTestId}>
         {buttonInner(props)}
       </a>
     )
   } else {
     return (
-      <LinkComponent href={props.href} className={buttonClasses.join(" ")}>
+      <LinkComponent
+        href={props.href}
+        className={buttonClasses.join(" ")}
+        data-test-id={props.dataTestId}
+      >
         {buttonInner(props)}
       </LinkComponent>
     )

package/src/blocks/DashBlock.tsx

@@ -7,6 +7,7 @@ interface DashBlockProps {
   subtitle?: string
   icon: React.ReactNode
   children?: React.ReactNode
+  dataTestId?: string
 }
 const DashBlock = (props: DashBlockProps) => {
   const { href, title, subtitle, icon, children } = props
@@ -37,6 +38,10 @@ const DashBlock = (props: DashBlockProps) => {
       </>
     )
   }
-  return <div className="dash-block">{wrapper}</div>
+  return (
+    <div className="dash-block" data-test-id={props.dataTestId}>
+      {wrapper}
+    </div>
+  )
 }
 export { DashBlock as default, DashBlock }

package/src/blocks/ViewItem.tsx

@@ -10,6 +10,7 @@ export interface ViewItemProps {
   className?: string
   truncated?: boolean
   error?: boolean
+  dataTestId?: string
 }
 
 const ViewItem = (props: ViewItemProps) => {
@@ -22,7 +23,7 @@ const ViewItem = (props: ViewItemProps) => {
   if (props.truncated) valueClassName += " is-truncated"
 
   return (
-    <div id={props.id} className={viewItemClasses.join(" ")}>
+    <div id={props.id} className={viewItemClasses.join(" ")} data-test-id={props.dataTestId}>
       {props.label && (
         <span className={`view-item__label ${props.error ? "text-alert text-tiny" : ""}`}>
           {props.label}

package/src/forms/DOBField.tsx

@@ -71,6 +71,7 @@ const DOBField = (props: DOBFieldProps) => {
           }}
           inputProps={{ maxLength: 2 }}
           register={register}
+          dataTestId={"dob-field-month"}
         />
         <Field
           name={getFieldName("birthDay")}
@@ -92,6 +93,7 @@ const DOBField = (props: DOBFieldProps) => {
           }}
           inputProps={{ maxLength: 2 }}
           register={register}
+          dataTestId={"dob-field-day"}
         />
         <Field
           name={getFieldName("birthYear")}
@@ -115,6 +117,7 @@ const DOBField = (props: DOBFieldProps) => {
           }}
           inputProps={{ maxLength: 4 }}
           register={register}
+          dataTestId={"dob-field-year"}
         />
       </div>
 

package/src/forms/DateField.tsx

@@ -24,6 +24,7 @@ export interface DateFieldProps {
   register: UseFormMethods["register"]
   required?: boolean
   watch: UseFormMethods["watch"]
+  dataTestId?: string
 }
 
 const DateField = (props: DateFieldProps) => {
@@ -60,6 +61,7 @@ const DateField = (props: DateFieldProps) => {
           }}
           inputProps={{ maxLength: 2 }}
           register={register}
+          dataTestId={props.dataTestId ? `${props.dataTestId}-month` : undefined}
         />
         <Field
           name={getFieldName("day")}
@@ -80,6 +82,7 @@ const DateField = (props: DateFieldProps) => {
           }}
           inputProps={{ maxLength: 2 }}
           register={register}
+          dataTestId={props.dataTestId ? `${props.dataTestId}-day` : undefined}
         />
         <Field
           name={getFieldName("year")}
@@ -102,6 +105,7 @@ const DateField = (props: DateFieldProps) => {
           }}
           inputProps={{ maxLength: 4 }}
           register={register}
+          dataTestId={props.dataTestId ? `${props.dataTestId}-year` : undefined}
         />
       </div>
       {props.note && <p className="field-note mb-2 mt-4">{props.note}</p>}

package/src/forms/Field.tsx

@@ -29,6 +29,7 @@ export interface FieldProps {
   describedBy?: string
   getValues?: UseFormMethods["getValues"]
   setValue?: UseFormMethods["setValue"]
+  dataTestId?: string
 }
 
 const Field = (props: FieldProps) => {
@@ -94,6 +95,7 @@ const Field = (props: FieldProps) => {
       <div className={controlClasses.join(" ")}>
         {props.prepend && <span className="prepend">{props.prepend}</span>}
         <input
+          {...props}
           aria-describedby={props.describedBy ? props.describedBy : `${idOrName}`}
           aria-invalid={!!props.error || false}
           className="input"
@@ -107,6 +109,7 @@ const Field = (props: FieldProps) => {
           onPaste={props.onPaste}
           onDrop={props.onDrop}
           onChange={props.onChange}
+          data-test-id={props.dataTestId}
           {...inputProps}
         />
         {isRadioOrCheckbox && label}