@bloom-housing/ui-components 9.0.1 → 9.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/src/blocks/ViewItem.js +1 -1
  2. package/dist/src/blocks/ViewItem.js.map +1 -1
  3. package/package.json +1 -1
  4. package/src/blocks/ViewItem.scss +38 -26
  5. package/src/blocks/ViewItem.tsx +1 -1
package/dist/src/blocks/ViewItem.js CHANGED
@@ -12,7 +12,7 @@ var ViewItem = function (props) {
12
12
  if (props.truncated)
13
13
  valueClassName += " is-truncated";
14
14
  return (React.createElement("div", { id: props.id, className: viewItemClasses.join(" "), "data-test-id": props.dataTestId },
15
- props.label && (React.createElement("span", { className: "view-item__label ".concat(props.error ? "text-alert text-sm" : "") }, props.label)),
15
+ props.label && (React.createElement("span", { className: "view-item__label ".concat(props.error ? "view-item__label-error" : "") }, props.label)),
16
16
  props.children && (React.createElement("span", { className: valueClassName, "data-test-id": props.dataTestId }, props.children)),
17
17
  props.helper && React.createElement("span", { className: "view-item__helper" }, props.helper)));
18
18
  };
package/dist/src/blocks/ViewItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ViewItem.js","sourceRoot":"","sources":["../../../src/blocks/ViewItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,iBAAiB,CAAA;AAcxB,IAAM,QAAQ,GAAG,UAAC,KAAoB;IACpC,IAAM,eAAe,GAAG,CAAC,WAAW,CAAC,CAAA;IACrC,IAAI,KAAK,CAAC,OAAO;QAAE,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;IACrD,IAAI,KAAK,CAAC,SAAS;QAAE,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAE1D,IAAI,cAAc,GAAG,kBAAkB,CAAA;IACvC,IAAI,CAAC,KAAK,CAAC,KAAK;QAAE,cAAc,IAAI,OAAO,CAAA;IAC3C,IAAI,KAAK,CAAC,SAAS;QAAE,cAAc,IAAI,eAAe,CAAA;IAEtD,OAAO,CACL,6BAAK,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,kBAAgB,KAAK,CAAC,UAAU;QACpF,KAAK,CAAC,KAAK,IAAI,CACd,8BAAM,SAAS,EAAE,2BAAoB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAE,IAC3E,KAAK,CAAC,KAAK,CACP,CACR;QACA,KAAK,CAAC,QAAQ,IAAI,CACjB,8BAAM,SAAS,EAAE,cAAc,kBAAgB,KAAK,CAAC,UAAU,IAC5D,KAAK,CAAC,QAAQ,CACV,CACR;QACA,KAAK,CAAC,MAAM,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,KAAK,CAAC,MAAM,CAAQ,CACtE,CACP,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,QAAQ,EAAE,CAAA"}
1
+ {"version":3,"file":"ViewItem.js","sourceRoot":"","sources":["../../../src/blocks/ViewItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,iBAAiB,CAAA;AAcxB,IAAM,QAAQ,GAAG,UAAC,KAAoB;IACpC,IAAM,eAAe,GAAG,CAAC,WAAW,CAAC,CAAA;IACrC,IAAI,KAAK,CAAC,OAAO;QAAE,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;IACrD,IAAI,KAAK,CAAC,SAAS;QAAE,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAE1D,IAAI,cAAc,GAAG,kBAAkB,CAAA;IACvC,IAAI,CAAC,KAAK,CAAC,KAAK;QAAE,cAAc,IAAI,OAAO,CAAA;IAC3C,IAAI,KAAK,CAAC,SAAS;QAAE,cAAc,IAAI,eAAe,CAAA;IAEtD,OAAO,CACL,6BAAK,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,kBAAgB,KAAK,CAAC,UAAU;QACpF,KAAK,CAAC,KAAK,IAAI,CACd,8BAAM,SAAS,EAAE,2BAAoB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,CAAE,IAC/E,KAAK,CAAC,KAAK,CACP,CACR;QACA,KAAK,CAAC,QAAQ,IAAI,CACjB,8BAAM,SAAS,EAAE,cAAc,kBAAgB,KAAK,CAAC,UAAU,IAC5D,KAAK,CAAC,QAAQ,CACV,CACR;QACA,KAAK,CAAC,MAAM,IAAI,8BAAM,SAAS,EAAC,mBAAmB,IAAE,KAAK,CAAC,MAAM,CAAQ,CACtE,CACP,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,QAAQ,EAAE,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bloom-housing/ui-components",
3
- "version": "9.0.1",
3
+ "version": "9.0.2",
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",
package/src/blocks/ViewItem.scss CHANGED
@@ -1,59 +1,71 @@
1
1
  @import "../global/mixins.scss";
2
2
 
3
3
  .view-item {
4
- @apply relative;
5
- @apply text-base;
6
- @apply mb-4;
4
+ --label-font-size: var(--bloom-font-size-sm);
5
+ --helper-font-size: var(--bloom-font-size-sm);
6
+ --label-error-font-size: var(--bloom-font-size-sm);
7
+ --label-text-color: var(--bloom-color-gray-800);
8
+ --helper-text-color: var(--bloom-color-gray-750);
9
+ --font-size: var(--bloom-font-size-base);
10
+ --bottom-margin: var(--bloom-s4);
11
+
12
+ font-size: var(--font-size);
13
+ margin-bottom: var(--bottom-margin);
14
+ position: relative;
7
15
 
8
16
  &:last-of-type {
9
- @apply mb-0;
17
+ margin-bottom: 0;
10
18
  }
11
19
 
12
20
  &.is-flagged {
13
- @apply bg-warn-light;
14
- @apply -my-1;
15
- @apply py-1;
16
- @apply -ml-8;
17
- @apply pl-8;
18
- box-shadow: inset 2px 0px 0px 0px $tailwind-warn;
21
+ background-color: var(--bloom-color-warn-light);
22
+ margin: calc(var(--bloom-s1) * -1) 0;
23
+ margin-left: calc(var(--bloom-s8) * -1);
24
+ padding: var(--bloom-s1) 0;
25
+ padding-left: var(--bloom-s8);
26
+ box-shadow: inset 2px 0px 0px 0px var(--bloom-color-warn);
19
27
  }
20
28
 
21
29
  .edit-link {
22
- @apply absolute;
30
+ position: absolute;
23
31
  right: 0;
24
32
  top: 0;
25
33
  }
26
34
  }
27
35
 
28
36
  .view-item__label {
29
- @apply text-gray-800;
30
- @apply font-sans;
31
- @apply text-sm;
32
- @apply block;
37
+ color: var(--label-text-color);
38
+ font-family: var(--bloom-font-sans);
39
+ font-size: var(--label-font-size);
40
+ display: block;
41
+ }
42
+
43
+ .view-item__label-error {
44
+ color: var(--bloom-color-alert);
45
+ font-size: var(--label-error-font-size);
33
46
  }
34
47
 
35
48
  .view-item__value {
36
- @apply font-alt-sans;
37
- @apply tracking-wide;
38
- @apply font-semibold;
39
- @apply block;
49
+ font-family: var(--bloom-font-alt-sans);
50
+ letter-spacing: var(--bloom-letter-spacing-wide);
51
+ font-weight: 600;
52
+ display: block;
40
53
  padding-top: 10px;
41
54
 
42
55
  &.is-truncated {
43
56
  @include ellipsis;
44
57
  }
45
58
 
46
- // do not change font-family for inputs
47
59
  .field .control .input,
48
60
  .error-message {
49
- @apply font-sans;
50
- @apply font-normal;
61
+ font-family: var(--bloom-font-sans);
62
+ font-weight: 400;
51
63
  }
52
64
  }
53
65
 
54
66
  .view-item__helper {
55
- @apply text-gray-750;
56
- @apply font-sans;
57
- @apply text-sm;
58
- @apply block;
67
+ color: var(--helper-text-color);
68
+ font-family: var(--bloom-font-sans);
69
+ font-size: var(--helper-font-size);
70
+ display: block;
59
71
  }
package/src/blocks/ViewItem.tsx CHANGED
@@ -25,7 +25,7 @@ const ViewItem = (props: ViewItemProps) => {
25
25
  return (
26
26
  <div id={props.id} className={viewItemClasses.join(" ")} data-test-id={props.dataTestId}>
27
27
  {props.label && (
28
- <span className={`view-item__label ${props.error ? "text-alert text-sm" : ""}`}>
28
+ <span className={`view-item__label ${props.error ? "view-item__label-error" : ""}`}>
29
29
  {props.label}
30
30
  </span>
31
31
  )}