@bloom-housing/ui-components 14.0.2 → 14.1.0

package/dist/__tests__/forms/PasswordField.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/forms/PasswordField.test.js

@@ -0,0 +1,53 @@
+import React from "react";
+import { render, cleanup, fireEvent } from "@testing-library/react";
+import { PasswordField } from "../../src/forms/PasswordField";
+import { useForm } from "react-hook-form";
+afterEach(cleanup);
+var PasswordFieldDefault = function () {
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    var register = useForm({ mode: "onChange" }).register;
+    return React.createElement(PasswordField, { register: register, name: "password", label: "Password" });
+};
+var PasswordFieldError = function () {
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    var register = useForm({ mode: "onChange" }).register;
+    return (React.createElement(PasswordField, { register: register, name: "password", label: "Password", error: true, errorMessage: "Wrong password" }));
+};
+var PasswordFieldCustomLabels = function () {
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    var register = useForm({ mode: "onChange" }).register;
+    return (React.createElement(PasswordField, { register: register, name: "password", label: "Password", showPasswordLabel: "Disclose password" }));
+};
+describe("<PasswordField>", function () {
+    it("renders a password input with a show password checkbox", function () {
+        var getByLabelText = render(React.createElement(PasswordFieldDefault, null)).getByLabelText;
+        var input = getByLabelText("Password");
+        expect(input.type).toBe("password");
+        expect(getByLabelText("Show password")).toBeTruthy();
+    });
+    it("toggles the input type when the checkbox is clicked", function () {
+        var getByLabelText = render(React.createElement(PasswordFieldDefault, null)).getByLabelText;
+        var input = getByLabelText("Password");
+        var checkbox = getByLabelText("Show password");
+        fireEvent.click(checkbox);
+        expect(input.type).toBe("text");
+        fireEvent.click(checkbox);
+        expect(input.type).toBe("password");
+    });
+    it("preserves the typed value when toggling visibility", function () {
+        var getByLabelText = render(React.createElement(PasswordFieldDefault, null)).getByLabelText;
+        var input = getByLabelText("Password");
+        fireEvent.change(input, { target: { value: "hunter2" } });
+        fireEvent.click(getByLabelText("Show password"));
+        expect(input.value).toBe("hunter2");
+    });
+    it("renders the error message when passed through", function () {
+        var getByText = render(React.createElement(PasswordFieldError, null)).getByText;
+        expect(getByText("Wrong password")).toBeTruthy();
+    });
+    it("supports a custom show password label", function () {
+        var getByLabelText = render(React.createElement(PasswordFieldCustomLabels, null)).getByLabelText;
+        expect(getByLabelText("Disclose password")).toBeTruthy();
+    });
+});
+//# sourceMappingURL=PasswordField.test.js.map

package/dist/__tests__/forms/PasswordField.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordField.test.js","sourceRoot":"","sources":["../../../__tests__/forms/PasswordField.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAEzC,SAAS,CAAC,OAAO,CAAC,CAAA;AAElB,IAAM,oBAAoB,GAAG;IAC3B,6DAA6D;IACrD,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,oBAAC,aAAa,IAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,GAAI,CAAA;AACnF,CAAC,CAAA;AAED,IAAM,kBAAkB,GAAG;IACzB,6DAA6D;IACrD,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,CACL,oBAAC,aAAa,IACZ,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,UAAU,EAChB,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,IAAI,EACX,YAAY,EAAE,gBAAgB,GAC9B,CACH,CAAA;AACH,CAAC,CAAA;AAED,IAAM,yBAAyB,GAAG;IAChC,6DAA6D;IACrD,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,CACL,oBAAC,aAAa,IACZ,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,UAAU,EAChB,KAAK,EAAE,UAAU,EACjB,iBAAiB,EAAE,mBAAmB,GACtC,CACH,CAAA;AACH,CAAC,CAAA;AAED,QAAQ,CAAC,iBAAiB,EAAE;IAC1B,EAAE,CAAC,wDAAwD,EAAE;QACnD,IAAA,cAAc,GAAK,MAAM,CAAC,oBAAC,oBAAoB,OAAG,CAAC,eAArC,CAAqC;QAC3D,IAAM,KAAK,GAAG,cAAc,CAAC,UAAU,CAAqB,CAAA;QAC5D,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;QACnC,MAAM,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC,UAAU,EAAE,CAAA;IACtD,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,qDAAqD,EAAE;QAChD,IAAA,cAAc,GAAK,MAAM,CAAC,oBAAC,oBAAoB,OAAG,CAAC,eAArC,CAAqC;QAC3D,IAAM,KAAK,GAAG,cAAc,CAAC,UAAU,CAAqB,CAAA;QAC5D,IAAM,QAAQ,GAAG,cAAc,CAAC,eAAe,CAAC,CAAA;QAEhD,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAA;QAEzB,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;QAE/B,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAA;QAEzB,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,oDAAoD,EAAE;QAC/C,IAAA,cAAc,GAAK,MAAM,CAAC,oBAAC,oBAAoB,OAAG,CAAC,eAArC,CAAqC;QAC3D,IAAM,KAAK,GAAG,cAAc,CAAC,UAAU,CAAqB,CAAA;QAE5D,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,CAAA;QACzD,SAAS,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAA;QAEhD,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,+CAA+C,EAAE;QAC1C,IAAA,SAAS,GAAK,MAAM,CAAC,oBAAC,kBAAkB,OAAG,CAAC,UAAnC,CAAmC;QACpD,MAAM,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,uCAAuC,EAAE;QAClC,IAAA,cAAc,GAAK,MAAM,CAAC,oBAAC,yBAAyB,OAAG,CAAC,eAA1C,CAA0C;QAChE,MAAM,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAA;IAC1D,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/index.d.ts

@@ -26,6 +26,7 @@ export * from "./src/forms/DateField";
 export * from "./src/forms/DOBField";
 export * from "./src/forms/Dropzone";
 export * from "./src/forms/Field";
+export * from "./src/forms/PasswordField";
 export * from "./src/forms/PhoneField";
 export * from "./src/forms/PhoneMask";
 export * from "./src/forms/HouseholdMemberForm";

package/dist/index.js

@@ -31,6 +31,7 @@ export * from "./src/forms/DateField";
 export * from "./src/forms/DOBField";
 export * from "./src/forms/Dropzone";
 export * from "./src/forms/Field";
+export * from "./src/forms/PasswordField";
 export * from "./src/forms/PhoneField";
 export * from "./src/forms/PhoneMask";
 export * from "./src/forms/HouseholdMemberForm";

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}

package/dist/src/forms/PasswordField.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { FieldProps } from "./Field";
+export interface PasswordFieldProps extends Omit<FieldProps, "type" | "postInputContent" | "className"> {
+    showPasswordLabel?: string;
+    checkboxDataTestId?: string;
+    className?: string;
+    fieldClassName?: string;
+}
+declare const PasswordField: (props: PasswordFieldProps) => React.JSX.Element;
+export { PasswordField as default, PasswordField };

package/dist/src/forms/PasswordField.js

@@ -0,0 +1,40 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import { useState } from "react";
+import { Field } from "./Field";
+var PasswordField = function (props) {
+    var _a = props.showPasswordLabel, showPasswordLabel = _a === void 0 ? "Show password" : _a, checkboxDataTestId = props.checkboxDataTestId, className = props.className, fieldClassName = props.fieldClassName, fieldProps = __rest(props, ["showPasswordLabel", "checkboxDataTestId", "className", "fieldClassName"]);
+    var classes = ["password-field"];
+    if (className) {
+        classes.push(className);
+    }
+    var _b = useState(false), visible = _b[0], setVisible = _b[1];
+    var idOrName = props.id || props.name;
+    var checkboxIdOrName = "".concat(idOrName, "-show-password");
+    return (React.createElement("div", { className: classes.join(" ") },
+        React.createElement(Field, __assign({}, fieldProps, { className: fieldClassName, type: visible ? "text" : "password" })),
+        React.createElement(Field, { type: "checkbox", id: checkboxIdOrName, name: checkboxIdOrName, label: showPasswordLabel, onChange: function () { return setVisible(function (prevVisible) { return !prevVisible; }); }, dataTestId: checkboxDataTestId })));
+};
+export { PasswordField as default, PasswordField };
+//# sourceMappingURL=PasswordField.js.map

package/dist/src/forms/PasswordField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordField.js","sourceRoot":"","sources":["../../../src/forms/PasswordField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,KAAK,EAAc,MAAM,SAAS,CAAA;AAU3C,IAAM,aAAa,GAAG,UAAC,KAAyB;IAE5C,IAAA,KAKE,KAAK,kBAL4B,EAAnC,iBAAiB,mBAAG,eAAe,KAAA,EACnC,kBAAkB,GAIhB,KAAK,mBAJW,EAClB,SAAS,GAGP,KAAK,UAHE,EACT,cAAc,GAEZ,KAAK,eAFO,EACX,UAAU,UACX,KAAK,EANH,0EAML,CADc,CACN;IAET,IAAM,OAAO,GAAG,CAAC,gBAAgB,CAAC,CAAA;IAElC,IAAI,SAAS,EAAE;QACb,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;KACxB;IAEK,IAAA,KAAwB,QAAQ,CAAC,KAAK,CAAC,EAAtC,OAAO,QAAA,EAAE,UAAU,QAAmB,CAAA;IAE7C,IAAM,QAAQ,GAAG,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,IAAI,CAAA;IACvC,IAAM,gBAAgB,GAAG,UAAG,QAAQ,mBAAgB,CAAA;IAEpD,OAAO,CACL,6BAAK,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QAC/B,oBAAC,KAAK,eAAK,UAAU,IAAE,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,IAAI;QACzF,oBAAC,KAAK,IACJ,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,gBAAgB,EACpB,IAAI,EAAE,gBAAgB,EACtB,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,cAAM,OAAA,UAAU,CAAC,UAAC,WAAW,IAAK,OAAA,CAAC,WAAW,EAAZ,CAAY,CAAC,EAAzC,CAAyC,EACzD,UAAU,EAAE,kBAAkB,GAC9B,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,aAAa,IAAI,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/dist/src/forms/PasswordField.stories.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => React.JSX.Element)[];
+};
+export default _default;
+export declare const PasswordFieldDefault: () => React.JSX.Element;
+export declare const PasswordFieldWithError: () => React.JSX.Element;
+export declare const PasswordFieldWithNote: () => React.JSX.Element;

package/dist/src/forms/PasswordField.stories.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { useForm } from "react-hook-form";
+import { PasswordField } from "./PasswordField";
+export default {
+    title: "Forms/PasswordField",
+    decorators: [function (storyFn) { return React.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+export var PasswordFieldDefault = function () {
+    var register = useForm({ mode: "onChange" }).register;
+    return React.createElement(PasswordField, { id: "password-1", register: register, name: "password", label: "Password" });
+};
+export var PasswordFieldWithError = function () {
+    var register = useForm({ mode: "onChange" }).register;
+    return (React.createElement(PasswordField, { id: "password2", register: register, name: "password", label: "Password", error: true, errorMessage: "Password must be at least 8 characters" }));
+};
+export var PasswordFieldWithNote = function () {
+    var register = useForm({ mode: "onChange" }).register;
+    return (React.createElement(PasswordField, { id: "password-3", register: register, name: "password", label: "Password", note: "Must be at least 8 characters and include a number." }));
+};
+//# sourceMappingURL=PasswordField.stories.js.map

package/dist/src/forms/PasswordField.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PasswordField.stories.js","sourceRoot":"","sources":["../../../src/forms/PasswordField.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,eAAe;IACb,KAAK,EAAE,qBAAqB;IAC5B,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,CAAC;CACnF,CAAA;AAED,MAAM,CAAC,IAAM,oBAAoB,GAAG;IAC1B,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,oBAAC,aAAa,IAAC,EAAE,EAAC,YAAY,EAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,GAAI,CAAA;AACnG,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,sBAAsB,GAAG;IAC5B,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,CACL,oBAAC,aAAa,IACZ,EAAE,EAAC,WAAW,EACd,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,UAAU,EAChB,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,IAAI,EACX,YAAY,EAAE,wCAAwC,GACtD,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,qBAAqB,GAAG;IAC3B,IAAA,QAAQ,GAAK,OAAO,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,SAAlC,CAAkC;IAClD,OAAO,CACL,oBAAC,aAAa,IACZ,EAAE,EAAC,YAAY,EACf,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,UAAU,EAChB,KAAK,EAAE,UAAU,EACjB,IAAI,EAAE,qDAAqD,GAC3D,CACH,CAAA;AACH,CAAC,CAAA"}

package/index.ts

@@ -35,6 +35,7 @@ export * from "./src/forms/DateField"
 export * from "./src/forms/DOBField"
 export * from "./src/forms/Dropzone"
 export * from "./src/forms/Field"
+export * from "./src/forms/PasswordField"
 export * from "./src/forms/PhoneField"
 export * from "./src/forms/PhoneMask"
 export * from "./src/forms/HouseholdMemberForm"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bloom-housing/ui-components",
-  "version": "14.0.2",
+  "version": "14.1.0",
   "author": "Sean Albert <sean.albert@exygy.com>",
   "description": "Shared user interface components for Bloom affordable housing system",
   "homepage": "https://github.com/bloom-housing/ui-components",
@@ -169,7 +169,7 @@
     }
   },
   "lint-staged": {
-    "*.{js,ts,tsx}": "eslint --max-warnings 0"
+    "!(*.stories).{js,ts,tsx}": "eslint --max-warnings 0"
   },
   "resolutions": {
     "react": "19.2.3",

package/src/forms/PasswordField.stories.tsx

@@ -0,0 +1,40 @@
+import React from "react"
+import { useForm } from "react-hook-form"
+import { PasswordField } from "./PasswordField"
+
+export default {
+  title: "Forms/PasswordField",
+  decorators: [(storyFn: any) => <div style={{ padding: "1rem" }}>{storyFn()}</div>],
+}
+
+export const PasswordFieldDefault = () => {
+  const { register } = useForm({ mode: "onChange" })
+  return <PasswordField id="password-1" register={register} name={"password"} label={"Password"} />
+}
+
+export const PasswordFieldWithError = () => {
+  const { register } = useForm({ mode: "onChange" })
+  return (
+    <PasswordField
+      id="password2"
+      register={register}
+      name={"password"}
+      label={"Password"}
+      error={true}
+      errorMessage={"Password must be at least 8 characters"}
+    />
+  )
+}
+
+export const PasswordFieldWithNote = () => {
+  const { register } = useForm({ mode: "onChange" })
+  return (
+    <PasswordField
+      id="password-3"
+      register={register}
+      name={"password"}
+      label={"Password"}
+      note={"Must be at least 8 characters and include a number."}
+    />
+  )
+}

package/src/forms/PasswordField.tsx

@@ -0,0 +1,48 @@
+import * as React from "react"
+import { useState } from "react"
+import { Field, FieldProps } from "./Field"
+
+export interface PasswordFieldProps
+  extends Omit<FieldProps, "type" | "postInputContent" | "className"> {
+  showPasswordLabel?: string
+  checkboxDataTestId?: string
+  className?: string
+  fieldClassName?: string
+}
+
+const PasswordField = (props: PasswordFieldProps) => {
+  const {
+    showPasswordLabel = "Show password",
+    checkboxDataTestId,
+    className,
+    fieldClassName,
+    ...fieldProps
+  } = props
+
+  const classes = ["password-field"]
+
+  if (className) {
+    classes.push(className)
+  }
+
+  const [visible, setVisible] = useState(false)
+
+  const idOrName = props.id || props.name
+  const checkboxIdOrName = `${idOrName}-show-password`
+
+  return (
+    <div className={classes.join(" ")}>
+      <Field {...fieldProps} className={fieldClassName} type={visible ? "text" : "password"} />
+      <Field
+        type="checkbox"
+        id={checkboxIdOrName}
+        name={checkboxIdOrName}
+        label={showPasswordLabel}
+        onChange={() => setVisible((prevVisible) => !prevVisible)}
+        dataTestId={checkboxDataTestId}
+      />
+    </div>
+  )
+}
+
+export { PasswordField as default, PasswordField }

package/src/global/forms.scss

@@ -412,3 +412,10 @@ progress,
   @apply bg-primary;
   transition: width 0.25s;
 }
+
+.password-field {
+  margin-block-end: 1.25rem;
+  * > &:last-child {
+    margin-block-end: 0;
+  }
+}