@bloom-housing/ui-components 12.6.4 → 12.7.1

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.
@@ -1,11 +1,13 @@
1
1
  import React from "react";
2
- import MaskedInput from "react-text-mask";
2
+ import { IMaskInput } from "react-imask";
3
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
3
4
  export var PhoneMask = React.forwardRef(function (props, ref) {
4
5
  var value = props.value, onChange = props.onChange, name = props.name, disabled = props.disabled, placeholder = props.placeholder;
5
6
  return (React.createElement(React.Fragment, null,
6
- React.createElement(MaskedInput, { mask: ["(", /[1-9]/, /\d/, /\d/, ")", " ", /\d/, /\d/, /\d/, "-", /\d/, /\d/, /\d/, /\d/], className: "input", type: "tel", placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "", guide: false, id: name, value: value, name: name, disabled: disabled, onChange: function (e) {
7
- e.persist();
8
- onChange(e);
9
- }, ref: ref, "aria-labelledby": "phone-label" })));
7
+ React.createElement(IMaskInput, { "aria-labelledby": "phone-label", className: "input", disabled: disabled, id: name, mask: "(000) 000-0000", name: name,
8
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
9
+ onAccept: function (value, _) {
10
+ onChange(value);
11
+ }, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "", ref: ref, type: "tel", unmask: false, value: value })));
10
12
  });
11
13
  //# sourceMappingURL=PhoneMask.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PhoneMask.js","sourceRoot":"","sources":["../../../src/forms/PhoneMask.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,WAAW,MAAM,iBAAiB,CAAA;AAEzC,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,UAAC,KAAU,EAAE,GAAQ;IACrD,IAAA,KAAK,GAA4C,KAAK,MAAjD,EAAE,QAAQ,GAAkC,KAAK,SAAvC,EAAE,IAAI,GAA4B,KAAK,KAAjC,EAAE,QAAQ,GAAkB,KAAK,SAAvB,EAAE,WAAW,GAAK,KAAK,YAAV,CAAU;IAE9D,OAAO,CACL;QACE,oBAAC,WAAW,IACV,IAAI,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,EACzF,SAAS,EAAC,OAAO,EACjB,IAAI,EAAC,KAAK,EACV,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,EAAE,EAC9B,KAAK,EAAE,KAAK,EACZ,EAAE,EAAE,IAAI,EACR,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,UAAC,CAAM;gBACf,CAAC,CAAC,OAAO,EAAE,CAAA;gBACX,QAAQ,CAAC,CAAC,CAAC,CAAA;YACb,CAAC,EACD,GAAG,EAAE,GAAG,qBACS,aAAa,GAC9B,CACD,CACJ,CAAA;AACH,CAAC,CAAC,CAAA"}
1
+ {"version":3,"file":"PhoneMask.js","sourceRoot":"","sources":["../../../src/forms/PhoneMask.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAExC,8DAA8D;AAC9D,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,UAAC,KAAU,EAAE,GAAQ;IACrD,IAAA,KAAK,GAA4C,KAAK,MAAjD,EAAE,QAAQ,GAAkC,KAAK,SAAvC,EAAE,IAAI,GAA4B,KAAK,KAAjC,EAAE,QAAQ,GAAkB,KAAK,SAAvB,EAAE,WAAW,GAAK,KAAK,YAAV,CAAU;IAE9D,OAAO,CACL;QACE,oBAAC,UAAU,uBACQ,aAAa,EAC9B,SAAS,EAAC,OAAO,EACjB,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,IAAI,EACR,IAAI,EAAE,gBAAgB,EACtB,IAAI,EAAE,IAAI;YACV,6DAA6D;YAC7D,QAAQ,EAAE,UAAC,KAAK,EAAE,CAAC;gBACjB,QAAQ,CAAC,KAAK,CAAC,CAAA;YACjB,CAAC,EACD,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,EAAE,EAC9B,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,KAAK,EACV,MAAM,EAAE,KAAK,EACb,KAAK,EAAE,KAAK,GACZ,CACD,CACJ,CAAA;AACH,CAAC,CAAC,CAAA"}
@@ -6,7 +6,7 @@ var QuantityRowSection = function (_a) {
6
6
  if (row.amount === null)
7
7
  return null;
8
8
  return (React.createElement("li", { key: row.text, className: "uppercase text-gray-800 ".concat(row.emphasized ? "font-bold" : "font-normal", " font-alt-sans leading-7") },
9
- React.createElement("span", { className: "text-right w-12 inline-block pr-2.5 text-base" }, row.amount),
9
+ React.createElement("span", { className: "text-right w-14 inline-block pr-2.5 text-base" }, row.amount),
10
10
  React.createElement("span", { className: "text-xs" }, row.text)));
11
11
  };
12
12
  return (React.createElement("section", { className: "aside-block is-tinted" },
@@ -56,7 +56,7 @@ export var CustomDescription = function () {
56
56
  React.createElement("p", { className: "underline" }, "More custom styled content.")));
57
57
  };
58
58
  return (React.createElement(QuantityRowSection, { quantityRows: [
59
- { amount: 100, text: "Final Size" },
59
+ { amount: 40000, text: "Final Size" },
60
60
  { amount: 40, text: "Current Size" },
61
61
  { amount: 60, text: "Open Spots" },
62
62
  ], strings: __assign(__assign({}, strings), { description: customDescription() }) }));
@@ -1 +1 @@
1
- {"version":3,"file":"QuantityRowSection.stories.js","sourceRoot":"","sources":["../../../../../src/page_components/listing/listing_sidebar/QuantityRowSection.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAEzD,eAAe;IACb,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,kBAAkB;CAC9B,CAAA;AAED,IAAM,OAAO,GAAG;IACd,YAAY,EAAE,8BAA8B;IAC5C,WAAW,EACT,qIAAqI;CACxI,CAAA;AAED,MAAM,CAAC,IAAM,wBAAwB,GAAG;IACtC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;YACnC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG;IAC7B,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;YACnC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,IAAI,EAAE;SACrD,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;YAClC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;YACnC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE;SAClC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,sBAAsB,GAAG;IACpC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;YAClC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG;IAC7B,OAAO,CACL,oBAAC,kBAAkB,IAAC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,EAAE,OAAO,GAAI,CAC9F,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,iBAAiB,GAAG;IAC/B,IAAM,iBAAiB,GAAG;QACxB,OAAO,CACL;YACE,2BAAG,SAAS,EAAE,aAAa,6BAA4B;YACvD,2BAAG,SAAS,EAAE,WAAW,kCAAiC,CACtD,CACP,CAAA;IACH,CAAC,CAAA;IACD,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;YACnC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,wBAAO,OAAO,KAAE,WAAW,EAAE,iBAAiB,EAAE,MACvD,CACH,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"QuantityRowSection.stories.js","sourceRoot":"","sources":["../../../../../src/page_components/listing/listing_sidebar/QuantityRowSection.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAEzD,eAAe;IACb,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,kBAAkB;CAC9B,CAAA;AAED,IAAM,OAAO,GAAG;IACd,YAAY,EAAE,8BAA8B;IAC5C,WAAW,EACT,qIAAqI;CACxI,CAAA;AAED,MAAM,CAAC,IAAM,wBAAwB,GAAG;IACtC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;YACnC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG;IAC7B,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;YACnC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,UAAU,EAAE,IAAI,EAAE;SACrD,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;YAClC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;YACnC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE;SAClC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,sBAAsB,GAAG;IACpC,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;YAClC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,eAAe,GAAG;IAC7B,OAAO,CACL,oBAAC,kBAAkB,IAAC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,EAAE,OAAO,GAAI,CAC9F,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,iBAAiB,GAAG;IAC/B,IAAM,iBAAiB,GAAG;QACxB,OAAO,CACL;YACE,2BAAG,SAAS,EAAE,aAAa,6BAA4B;YACvD,2BAAG,SAAS,EAAE,WAAW,kCAAiC,CACtD,CACP,CAAA;IACH,CAAC,CAAA;IACD,OAAO,CACL,oBAAC,kBAAkB,IACjB,YAAY,EAAE;YACZ,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE;YACrC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;YACpC,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE;SACnC,EACD,OAAO,wBAAO,OAAO,KAAE,WAAW,EAAE,iBAAiB,EAAE,MACvD,CACH,CAAA;AACH,CAAC,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bloom-housing/ui-components",
3
- "version": "12.6.4",
3
+ "version": "12.7.1",
4
4
  "author": "Sean Albert <sean.albert@exygy.com>",
5
5
  "description": "Shared user interface components for Bloom affordable housing system",
6
6
  "homepage": "https://github.com/bloom-housing/ui-components",
@@ -43,16 +43,16 @@
43
43
  "@commitlint/cli": "^13.1.0",
44
44
  "@commitlint/config-conventional": "^13.1.0",
45
45
  "@geometricpanda/storybook-addon-badges": "^1.1.1",
46
- "@storybook/addons": "^6.5.8",
47
- "@storybook/addon-actions": "^6.5.16",
48
46
  "@storybook/addon-a11y": "^6.5.16",
47
+ "@storybook/addon-actions": "^6.5.16",
49
48
  "@storybook/addon-essentials": "^6.5.16",
50
49
  "@storybook/addon-interactions": "^6.5.16",
51
- "@storybook/addon-links": "^6.5.16",
52
50
  "@storybook/addon-knobs": "^6.4.0",
51
+ "@storybook/addon-links": "^6.5.16",
52
+ "@storybook/addon-postcss": "^2.0.0",
53
53
  "@storybook/addon-storyshots": "^6.3.8",
54
54
  "@storybook/addon-storyshots-puppeteer": "^6.3.8",
55
- "@storybook/addon-postcss": "^2.0.0",
55
+ "@storybook/addons": "^6.5.8",
56
56
  "@storybook/api": "^6.5.8",
57
57
  "@storybook/builder-webpack5": "^6.5.16",
58
58
  "@storybook/components": "^6.5.8",
@@ -77,11 +77,10 @@
77
77
  "@types/react-map-gl": "^5.2.10",
78
78
  "@types/react-tabs": "^2.3.2",
79
79
  "@types/react-test-renderer": "^18.0.0",
80
- "@types/react-text-mask": "^5.4.6",
81
80
  "@types/react-transition-group": "^4.4.0",
82
81
  "@types/webpack": "5.28.0",
83
- "@typescript-eslint/parser": "^5.12.1",
84
82
  "@typescript-eslint/eslint-plugin": "^5.12.1",
83
+ "@typescript-eslint/parser": "^5.12.1",
85
84
  "autoprefixer": "^10.3.4",
86
85
  "babel-loader": "^8.2.2",
87
86
  "babel-plugin-require-context-hook": "^1.0.0",
@@ -143,11 +142,11 @@
143
142
  "react-dropzone": "^11.3.2",
144
143
  "react-focus-lock": "^2.9.4",
145
144
  "react-hook-form": "^6.15.5",
145
+ "react-imask": "^7.6.1",
146
146
  "react-map-gl": "^6.1.16",
147
147
  "react-media": "^1.10.0",
148
148
  "react-remove-scroll": "2.5.4",
149
149
  "react-tabs": "^3.2.2",
150
- "react-text-mask": "^5.5.0",
151
150
  "react-transition-group": "^4.4.1",
152
151
  "tailwindcss": "2.2.10",
153
152
  "tailwindcss-rtl": "^0.9.0",
@@ -1,27 +1,28 @@
1
1
  import React from "react"
2
- import MaskedInput from "react-text-mask"
2
+ import { IMaskInput } from "react-imask"
3
3
 
4
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
4
5
  export const PhoneMask = React.forwardRef((props: any, ref: any) => {
5
6
  const { value, onChange, name, disabled, placeholder } = props
6
7
 
7
8
  return (
8
9
  <>
9
- <MaskedInput
10
- mask={["(", /[1-9]/, /\d/, /\d/, ")", " ", /\d/, /\d/, /\d/, "-", /\d/, /\d/, /\d/, /\d/]}
10
+ <IMaskInput
11
+ aria-labelledby={"phone-label"}
11
12
  className="input"
12
- type="tel"
13
- placeholder={placeholder ?? ""}
14
- guide={false}
13
+ disabled={disabled}
15
14
  id={name}
16
- value={value}
15
+ mask={"(000) 000-0000"}
17
16
  name={name}
18
- disabled={disabled}
19
- onChange={(e: any) => {
20
- e.persist()
21
- onChange(e)
17
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
18
+ onAccept={(value, _) => {
19
+ onChange(value)
22
20
  }}
21
+ placeholder={placeholder ?? ""}
23
22
  ref={ref}
24
- aria-labelledby={"phone-label"}
23
+ type="tel"
24
+ unmask={false}
25
+ value={value}
25
26
  />
26
27
  </>
27
28
  )
@@ -81,7 +81,7 @@ export const CustomDescription = () => {
81
81
  return (
82
82
  <QuantityRowSection
83
83
  quantityRows={[
84
- { amount: 100, text: "Final Size" },
84
+ { amount: 40000, text: "Final Size" },
85
85
  { amount: 40, text: "Current Size" },
86
86
  { amount: 60, text: "Open Spots" },
87
87
  ]}
@@ -27,7 +27,7 @@ const QuantityRowSection = ({ quantityRows, strings, priority }: QuantityRowSect
27
27
  row.emphasized ? "font-bold" : "font-normal"
28
28
  } font-alt-sans leading-7`}
29
29
  >
30
- <span className="text-right w-12 inline-block pr-2.5 text-base">{row.amount}</span>
30
+ <span className="text-right w-14 inline-block pr-2.5 text-base">{row.amount}</span>
31
31
  <span className={"text-xs"}>{row.text}</span>
32
32
  </li>
33
33
  )