@bloom-housing/ui-components 9.0.0 → 9.0.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.
Files changed (39) hide show
  1. package/dist/index.d.ts +1 -0
  2. package/dist/index.js +1 -0
  3. package/dist/index.js.map +1 -1
  4. package/dist/src/blocks/ImageCard.d.ts +3 -0
  5. package/dist/src/blocks/ImageCard.js +30 -16
  6. package/dist/src/blocks/ImageCard.js.map +1 -1
  7. package/dist/src/blocks/ImageCard.stories.d.ts +1 -0
  8. package/dist/src/blocks/ImageCard.stories.js +17 -0
  9. package/dist/src/blocks/ImageCard.stories.js.map +1 -1
  10. package/dist/src/blocks/InfoCard.d.ts +1 -1
  11. package/dist/src/blocks/InfoCard.js +1 -1
  12. package/dist/src/blocks/InfoCard.stories.d.ts +1 -0
  13. package/dist/src/blocks/InfoCard.stories.js +3 -1
  14. package/dist/src/blocks/InfoCard.stories.js.map +1 -1
  15. package/dist/src/blocks/Tooltip.d.ts +13 -0
  16. package/dist/src/blocks/Tooltip.js +28 -0
  17. package/dist/src/blocks/Tooltip.js.map +1 -0
  18. package/dist/src/page_components/listing/AdditionalFees.stories.d.ts +1 -0
  19. package/dist/src/page_components/listing/AdditionalFees.stories.js +3 -0
  20. package/dist/src/page_components/listing/AdditionalFees.stories.js.map +1 -1
  21. package/dist/src/sections/InfoCardGrid.js +1 -1
  22. package/dist/src/sections/InfoCardGrid.js.map +1 -1
  23. package/dist/src/text/Tag.d.ts +1 -0
  24. package/dist/src/text/Tag.js +1 -1
  25. package/dist/src/text/Tag.js.map +1 -1
  26. package/index.ts +1 -0
  27. package/package.json +1 -1
  28. package/src/blocks/ImageCard.scss +27 -1
  29. package/src/blocks/ImageCard.stories.tsx +27 -1
  30. package/src/blocks/ImageCard.tsx +48 -37
  31. package/src/blocks/InfoCard.scss +18 -0
  32. package/src/blocks/InfoCard.stories.tsx +12 -0
  33. package/src/blocks/InfoCard.tsx +2 -2
  34. package/src/blocks/Tooltip.scss +43 -0
  35. package/src/blocks/Tooltip.tsx +65 -0
  36. package/src/page_components/listing/AdditionalFees.stories.tsx +4 -0
  37. package/src/sections/InfoCardGrid.scss +12 -16
  38. package/src/sections/InfoCardGrid.tsx +1 -1
  39. package/src/text/Tag.tsx +6 -1
package/dist/index.d.ts CHANGED
@@ -18,6 +18,7 @@ export * from "./src/blocks/StatusBar";
18
18
  export * from "./src/blocks/ViewItem";
19
19
  export * from "./src/blocks/StandardCard";
20
20
  export * from "./src/blocks/MediaCard";
21
+ export * from "./src/blocks/Tooltip";
21
22
  export * from "./src/config";
22
23
  export * from "./src/footers/ExygyFooter";
23
24
  export * from "./src/footers/SiteFooter";
package/dist/index.js CHANGED
@@ -20,6 +20,7 @@ export * from "./src/blocks/StatusBar";
20
20
  export * from "./src/blocks/ViewItem";
21
21
  export * from "./src/blocks/StandardCard";
22
22
  export * from "./src/blocks/MediaCard";
23
+ export * from "./src/blocks/Tooltip";
23
24
  /* Contexts */
24
25
  export * from "./src/config";
25
26
  /* Footers */
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
@@ -1,4 +1,5 @@
1
1
  import "./ImageCard.scss";
2
+ import { TooltipProps } from "./Tooltip";
2
3
  import { ApplicationStatusType } from "../global/ApplicationStatusType";
3
4
  import { AppearanceStyleType } from "../global/AppearanceTypes";
4
5
  import { UniversalIconType } from "../icons/Icon";
@@ -9,11 +10,13 @@ export interface StatusBarType {
9
10
  hideIcon?: boolean;
10
11
  iconType?: UniversalIconType;
11
12
  }
13
+ export type ImageTagTooltip = Pick<TooltipProps, "id" | "text">;
12
14
  export interface ImageTag {
13
15
  text?: string;
14
16
  iconType?: UniversalIconType;
15
17
  iconColor?: string;
16
18
  styleType?: AppearanceStyleType;
19
+ tooltip?: ImageTagTooltip;
17
20
  }
18
21
  export interface ImageItem {
19
22
  url: string;
@@ -1,8 +1,20 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
1
12
  import React, { useMemo, useState } from "react";
2
13
  import { LocalizedLink } from "../actions/LocalizedLink";
3
14
  import { ApplicationStatus } from "../notifications/ApplicationStatus";
4
15
  import "./ImageCard.scss";
5
16
  import { Tag } from "../text/Tag";
17
+ import { Tooltip } from "./Tooltip";
6
18
  import { AppearanceSizeType, AppearanceStyleType } from "../global/AppearanceTypes";
7
19
  import { Icon, IconFillColors } from "../icons/Icon";
8
20
  import { Modal } from "../overlays/Modal";
@@ -14,14 +26,14 @@ import { t } from "../helpers/translator";
14
26
  * A component that renders an image with optional tags at top and status bars below it
15
27
  */
16
28
  var ImageCard = function (props) {
17
- var _a, _b, _c, _d;
18
- var _e = useState(false), showModal = _e[0], setShowModal = _e[1];
29
+ var _a, _b, _c, _d, _e;
30
+ var _f = useState(false), showModal = _f[0], setShowModal = _f[1];
19
31
  var getStatuses = function () {
20
32
  var _a;
21
33
  var statuses = (_a = props.statuses) === null || _a === void 0 ? void 0 : _a.map(function (status, index) {
22
34
  return (React.createElement(ApplicationStatus, { status: status.status, content: status.content, subContent: status.subContent, withIcon: !status.hideIcon, iconType: status.iconType, vivid: true, key: index }));
23
35
  });
24
- return (React.createElement("aside", { className: "image-card__status", "aria-label": "".concat(props.description || "", " Statuses") }, statuses));
36
+ return React.createElement("aside", { "aria-label": "".concat(props.description || "", " Statuses") }, statuses);
25
37
  };
26
38
  var innerClasses = ["image-card__inner"];
27
39
  if (props.images && props.images.length > 1) {
@@ -57,21 +69,23 @@ var ImageCard = function (props) {
57
69
  } })))),
58
70
  getStatuses(),
59
71
  React.createElement("div", { className: "image-card-tag__wrapper" }, (_d = props.tags) === null || _d === void 0 ? void 0 : _d.map(function (tag, index) {
60
- var _a;
61
- return (React.createElement(React.Fragment, { key: index },
62
- React.createElement(Tag, { styleType: tag.styleType || AppearanceStyleType.warning },
63
- tag.iconType && (React.createElement(Icon, { size: "medium", symbol: tag.iconType, fill: (_a = tag.iconColor) !== null && _a !== void 0 ? _a : IconFillColors.primary })),
64
- tag.text)));
72
+ var _a, _b;
73
+ var tagContent = (React.createElement(Tag, { styleType: tag.styleType || AppearanceStyleType.warning, ariaLabel: tag.tooltip ? "".concat(tag.text || "", " - ").concat(((_a = tag.tooltip) === null || _a === void 0 ? void 0 : _a.text) || "") : undefined },
74
+ tag.iconType && (React.createElement(Icon, { size: "medium", symbol: tag.iconType, fill: (_b = tag.iconColor) !== null && _b !== void 0 ? _b : IconFillColors.primary, className: "mr-2" })),
75
+ tag.text));
76
+ if (tag.tooltip) {
77
+ return (React.createElement(Tooltip, __assign({ key: index, className: "mt-3" }, tag.tooltip), tagContent));
78
+ }
79
+ return React.createElement(React.Fragment, { key: index }, tagContent);
65
80
  }))),
66
- props.images && props.images.length > 1 && (React.createElement(Modal, { open: showModal, title: props.modalAriaTitle || "Images", scrollable: true, onClose: function () { return setShowModal(!showModal); }, className: "image-card__overlay", modalClassNames: "image-card__gallery-modal", headerClassNames: "sr-only", closeIconColor: IconFillColors.white, actions: [
81
+ props.images && props.images.length > 1 && (React.createElement(Modal, { open: showModal, title: props.modalAriaTitle || "Images", scrollableModal: true, onClose: function () { return setShowModal(!showModal); }, className: "image-card__overlay", modalClassNames: "image-card__gallery-modal", headerClassNames: "sr-only", closeIconColor: IconFillColors.white, actions: [
67
82
  React.createElement(Button, { onClick: function () { return setShowModal(!showModal); }, size: AppearanceSizeType.small }, props.modalCloseLabel || "Close"),
68
- ] }, props.images &&
69
- props.images.map(function (image, index) { return (React.createElement("p", { key: index, className: "mb-7" },
70
- React.createElement("picture", null,
71
- image.mobileUrl && (React.createElement("source", { media: "(max-width: 767px)", srcSet: image.mobileUrl })),
72
- React.createElement("img", { src: image.url, alt: image.description
73
- ? image.description
74
- : "".concat(props.description || "", " - photo ").concat(index + 1) })))); })))));
83
+ ] }, (_e = props.images) === null || _e === void 0 ? void 0 : _e.map(function (image, index) { return (React.createElement("p", { key: index, className: "mb-7" },
84
+ React.createElement("picture", null,
85
+ image.mobileUrl && React.createElement("source", { media: "(max-width: 767px)", srcSet: image.mobileUrl }),
86
+ React.createElement("img", { src: image.url, alt: image.description
87
+ ? image.description
88
+ : "".concat(props.description || "", " - photo ").concat(index + 1) })))); })))));
75
89
  var card = image;
76
90
  if (props.href) {
77
91
  card = (React.createElement(LocalizedLink, { className: "block", href: props.href }, image));
@@ -1 +1 @@
1
- {"version":3,"file":"ImageCard.js","sourceRoot":"","sources":["../../../src/blocks/ImageCard.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ImageCard.js","sourceRoot":"","sources":["../../../src/blocks/ImageCard.tsx"],"names":[],"mappings":"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"}
@@ -23,6 +23,7 @@ export declare const withOneStatusAndSmaller: () => JSX.Element;
23
23
  export declare const withDescriptionAsAlt: () => JSX.Element;
24
24
  export declare const withOneStatusAndTag: () => JSX.Element;
25
25
  export declare const withMultipleTags: () => JSX.Element;
26
+ export declare const withTooltip: () => JSX.Element;
26
27
  export declare const withLongTagsAndIcons: () => JSX.Element;
27
28
  export declare const withManyTags: () => JSX.Element;
28
29
  export declare const withMultipleAppStatus: () => JSX.Element;
@@ -53,6 +53,23 @@ export var withOneStatusAndSmaller = function () { return (React.createElement(I
53
53
  export var withDescriptionAsAlt = function () { return (React.createElement(ImageCard, { imageUrl: "/images/listing.jpg", description: "An image of the building" })); };
54
54
  export var withOneStatusAndTag = function () { return (React.createElement(ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [{ text: "Label" }], statuses: [{ status: ApplicationStatusType.Closed, content: t("listings.applicationsClosed") }] })); };
55
55
  export var withMultipleTags = function () { return (React.createElement(ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [{ text: "Label" }, { text: "Label2" }], statuses: [{ status: ApplicationStatusType.Closed, content: t("listings.applicationsClosed") }] })); };
56
+ export var withTooltip = function () { return (React.createElement("div", { style: { margin: "5rem" } },
57
+ React.createElement(ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [
58
+ {
59
+ text: "Label",
60
+ },
61
+ {
62
+ text: "Label2",
63
+ iconType: "globe",
64
+ iconColor: IconFillColors.white,
65
+ tooltip: {
66
+ id: "tooltip",
67
+ text: "Here is some helpful tooltip content. Here is even more helpful tooltip content.",
68
+ },
69
+ },
70
+ ], statuses: [
71
+ { status: ApplicationStatusType.Closed, content: t("listings.applicationsClosed") },
72
+ ] }))); };
56
73
  export var withLongTagsAndIcons = function () { return (React.createElement(ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [
57
74
  { text: "This is a long label", iconType: "mail", iconColor: IconFillColors.white },
58
75
  { text: "This is another longer label" },
@@ -1 +1 @@
1
- {"version":3,"file":"ImageCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/ImageCard.stories.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ImageCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/ImageCard.stories.tsx"],"names":[],"mappings":"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"}
@@ -5,7 +5,7 @@ export interface InfoCardProps {
5
5
  subtitle?: string;
6
6
  externalHref?: string;
7
7
  className?: string;
8
- children: React.ReactNode;
8
+ children?: React.ReactNode;
9
9
  }
10
10
  declare const InfoCard: (props: InfoCardProps) => JSX.Element;
11
11
  export { InfoCard as default, InfoCard };
@@ -10,7 +10,7 @@ var InfoCard = function (props) {
10
10
  React.createElement("div", { className: "info-card__header" },
11
11
  props.externalHref ? (React.createElement("h3", { className: "info-card__title" },
12
12
  React.createElement("a", { href: props.externalHref, target: "_blank" }, props.title))) : (React.createElement("h3", { className: "info-card__title" }, props.title)),
13
- props.subtitle && React.createElement("span", { className: "text-xs text-gray-700" }, props.subtitle)),
13
+ props.subtitle && React.createElement("span", { className: "text-sm text-gray-700" }, props.subtitle)),
14
14
  typeof props.children == "string" ? (React.createElement("div", { className: "markdown" },
15
15
  React.createElement(Markdown, { options: { disableParsingRawHTML: true }, children: props.children }))) : (props.children)));
16
16
  };
@@ -14,5 +14,6 @@ declare const _default: {
14
14
  };
15
15
  export default _default;
16
16
  export declare const Default: () => JSX.Element;
17
+ export declare const NoChildren: () => JSX.Element;
17
18
  export declare const WithMarkdown: () => JSX.Element;
18
19
  export declare const WithChildComponent: () => JSX.Element;
@@ -15,7 +15,9 @@ export default {
15
15
  },
16
16
  };
17
17
  export var Default = function () { return (React.createElement(React.Fragment, null,
18
- React.createElement(InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" }, "\nParagraph content\n\n----\n\nMore content\n "))); };
18
+ React.createElement(InfoCard, { title: "My Card", subtitle: "Subtitle", externalHref: "http://google.com", className: "is-normal-primary-lighter" }, "\nParagraph content\n\n----\n\nMore content\n "))); };
19
+ export var NoChildren = function () { return (React.createElement(React.Fragment, null,
20
+ React.createElement(InfoCard, { title: "My Card", subtitle: "Subtitle", externalHref: "http://google.com", className: "is-normal-primary-lighter" }))); };
19
21
  export var WithMarkdown = function () { return (React.createElement(InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" }, "\n#### Header 4\n\n* A list\n* of items\n ")); };
20
22
  export var WithChildComponent = function () { return (React.createElement(InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" },
21
23
  React.createElement(ExpandableText, { strings: { readMore: "More", readLess: "Less" } }, "\nText within _another_ component\u2026\n "))); };
@@ -1 +1 @@
1
- {"version":3,"file":"InfoCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/InfoCard.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC1D,OAAO,qBAAqB,MAAM,qBAAqB,CAAA;AAEvD,eAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,CAAC;IAClF,EAAE,EAAE,kBAAkB;IACtB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,qBAAqB;SAC5B;QACD,MAAM,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC;KACtB;CACF,CAAA;AAED,MAAM,CAAC,IAAM,OAAO,GAAG,cAAM,OAAA,CAC3B;IACE,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,YAAY,EAAC,mBAAmB,EAChC,SAAS,EAAC,2BAA2B,IAEpC,qDAMA,CACQ,CACV,CACJ,EAhB4B,CAgB5B,CAAA;AAED,MAAM,CAAC,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,oBAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B,IAC7F,iDAKE,CACM,CACZ,EATiC,CASjC,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG,cAAM,OAAA,CACtC,oBAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B;IAC9F,oBAAC,cAAc,IAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAC5D,iDAEA,CACc,CACR,CACZ,EARuC,CAQvC,CAAA"}
1
+ {"version":3,"file":"InfoCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/InfoCard.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAA;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAC1D,OAAO,qBAAqB,MAAM,qBAAqB,CAAA;AAEvD,eAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,CAAC;IAClF,EAAE,EAAE,kBAAkB;IACtB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,qBAAqB;SAC5B;QACD,MAAM,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC;KACtB;CACF,CAAA;AAED,MAAM,CAAC,IAAM,OAAO,GAAG,cAAM,OAAA,CAC3B;IACE,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,QAAQ,EAAC,UAAU,EACnB,YAAY,EAAC,mBAAmB,EAChC,SAAS,EAAC,2BAA2B,IAEpC,qDAMA,CACQ,CACV,CACJ,EAjB4B,CAiB5B,CAAA;AAED,MAAM,CAAC,IAAM,UAAU,GAAG,cAAM,OAAA,CAC9B;IACE,oBAAC,QAAQ,IACP,KAAK,EAAC,SAAS,EACf,QAAQ,EAAC,UAAU,EACnB,YAAY,EAAC,mBAAmB,EAChC,SAAS,EAAC,2BAA2B,GACrC,CACD,CACJ,EAT+B,CAS/B,CAAA;AAED,MAAM,CAAC,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,oBAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B,IAC7F,iDAKE,CACM,CACZ,EATiC,CASjC,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG,cAAM,OAAA,CACtC,oBAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B;IAC9F,oBAAC,cAAc,IAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAC5D,iDAEA,CACc,CACR,CACZ,EARuC,CAQvC,CAAA"}
@@ -0,0 +1,13 @@
1
+ import React from "react";
2
+ import "./Tooltip.scss";
3
+ export interface TooltipProps {
4
+ className?: string;
5
+ id: string;
6
+ text: string;
7
+ }
8
+ export interface TooltipPosition {
9
+ top: number;
10
+ left: number;
11
+ }
12
+ declare const Tooltip: ({ className, id, text, children }: React.PropsWithChildren<TooltipProps>) => JSX.Element;
13
+ export { Tooltip as default, Tooltip };
@@ -0,0 +1,28 @@
1
+ import React, { useState, useRef, useEffect } from "react";
2
+ import useKeyPress from "../helpers/useKeyPress";
3
+ import "./Tooltip.scss";
4
+ var Tooltip = function (_a) {
5
+ var className = _a.className, id = _a.id, text = _a.text, children = _a.children;
6
+ var _b = useState(null), position = _b[0], setPosition = _b[1];
7
+ var childrenWrapperRef = useRef(null);
8
+ var show = function () {
9
+ var _a;
10
+ var _b = ((_a = childrenWrapperRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) || {}, x = _b.x, y = _b.y, width = _b.width, height = _b.height;
11
+ if (x && y && width && height) {
12
+ setPosition({ top: y, left: x + width / 2 });
13
+ }
14
+ };
15
+ var hide = function () { return setPosition(null); };
16
+ useKeyPress("Escape", function () { return hide(); });
17
+ useEffect(function () {
18
+ window.addEventListener("scroll", function () { return hide(); });
19
+ return function () {
20
+ window.removeEventListener("scroll", function () { return hide(); });
21
+ };
22
+ }, []);
23
+ return (React.createElement("div", { className: "tooltip ".concat(className || ""), onFocus: show, onMouseEnter: show, onBlur: hide, onMouseLeave: hide },
24
+ React.createElement("div", { className: "tooltip__element ".concat(position ? "tooltip__element--visible" : ""), style: position || {}, role: "tooltip", id: id, "data-test-id": "tooltip-element" }, text),
25
+ React.createElement("div", { className: "tooltip__children", "data-test-id": "tooltip-children", ref: childrenWrapperRef }, children)));
26
+ };
27
+ export { Tooltip as default, Tooltip };
28
+ //# sourceMappingURL=Tooltip.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/blocks/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC1D,OAAO,WAAW,MAAM,wBAAwB,CAAA;AAChD,OAAO,gBAAgB,CAAA;AAavB,IAAM,OAAO,GAAG,UAAC,EAAwE;QAAtE,SAAS,eAAA,EAAE,EAAE,QAAA,EAAE,IAAI,UAAA,EAAE,QAAQ,cAAA;IACxC,IAAA,KAA0B,QAAQ,CAAyB,IAAI,CAAC,EAA/D,QAAQ,QAAA,EAAE,WAAW,QAA0C,CAAA;IACtE,IAAM,kBAAkB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAEvD,IAAM,IAAI,GAAG;;QACL,IAAA,KAA0B,CAAA,MAAA,kBAAkB,CAAC,OAAO,0CAAE,qBAAqB,EAAE,KAAI,EAAE,EAAjF,CAAC,OAAA,EAAE,CAAC,OAAA,EAAE,KAAK,WAAA,EAAE,MAAM,YAA8D,CAAA;QAEzF,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,MAAM,EAAE;YAC7B,WAAW,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,CAAC,CAAA;SAC7C;IACH,CAAC,CAAA;IAED,IAAM,IAAI,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAA;IAEpC,WAAW,CAAC,QAAQ,EAAE,cAAM,OAAA,IAAI,EAAE,EAAN,CAAM,CAAC,CAAA;IAEnC,SAAS,CAAC;QACR,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,cAAM,OAAA,IAAI,EAAE,EAAN,CAAM,CAAC,CAAA;QAE/C,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,cAAM,OAAA,IAAI,EAAE,EAAN,CAAM,CAAC,CAAA;QACpD,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,6BACE,SAAS,EAAE,kBAAW,SAAS,IAAI,EAAE,CAAE,EACvC,OAAO,EAAE,IAAI,EACb,YAAY,EAAE,IAAI,EAClB,MAAM,EAAE,IAAI,EACZ,YAAY,EAAE,IAAI;QAElB,6BACE,SAAS,EAAE,2BAAoB,QAAQ,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,EAAE,CAAE,EAC5E,KAAK,EAAE,QAAQ,IAAI,EAAE,EACrB,IAAI,EAAC,SAAS,EACd,EAAE,EAAE,EAAE,kBACO,iBAAiB,IAE7B,IAAI,CACD;QAEN,6BAAK,SAAS,EAAC,mBAAmB,kBAAc,kBAAkB,EAAC,GAAG,EAAE,kBAAkB,IACvF,QAAQ,CACL,CACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,OAAO,EAAE,CAAA"}
@@ -10,3 +10,4 @@ export declare const allFieldsAndFooterNotIncluded: () => JSX.Element;
10
10
  export declare const justDepositRange: () => JSX.Element;
11
11
  export declare const justApplicationFee: () => JSX.Element;
12
12
  export declare const costsNotIncluded: () => JSX.Element;
13
+ export declare const multipleFooters: () => JSX.Element;
@@ -64,4 +64,7 @@ export var costsNotIncluded = function () {
64
64
  "Resident responsible for PG&E, internet and phone. Owner pays for water, trash, and sewage. Residents encouraged to obtain renter's insurance but this is not a requirement. Rent is due by the 5th of each month. Late fee $35 and returned check fee is $35 additional.",
65
65
  ] }));
66
66
  };
67
+ export var multipleFooters = function () {
68
+ return React.createElement(AdditionalFees, { strings: strings, footerContent: ["Footer 1", "Footer 2", "Footer 3"] });
69
+ };
67
70
  //# sourceMappingURL=AdditionalFees.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AdditionalFees.stories.js","sourceRoot":"","sources":["../../../../src/page_components/listing/AdditionalFees.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,eAAe;IACb,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,cAAc;CAC1B,CAAA;AAED,IAAM,OAAO,GAAG;IACd,aAAa,EAAE,iBAAiB;IAChC,OAAO,EAAE,SAAS;IAClB,cAAc,EAAE,iBAAiB;CAClC,CAAA;AACD,MAAM,CAAC,IAAM,2BAA2B,GAAG;IACzC,OAAO,CACL,oBAAC,cAAc,IACb,OAAO,EAAE,gBAAgB,EACzB,cAAc,EAAE,KAAK,EACrB,aAAa,EAAE;YACb;gBACE,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC,CACF;YACL,oDAAoD;YACpD,wHAAwH;YACxH,wDAAwD;SACzD,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AACD,MAAM,CAAC,IAAM,4BAA4B,GAAG;IAC1C,OAAO,CACL,oBAAC,cAAc,IACb,OAAO,EAAE,eAAe,EACxB,cAAc,EAAE,KAAK,EACrB,aAAa,EAAE;YACb;gBACE,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC,CACF;YACL,oDAAoD;YACpD,+KAA+K;SAChL,EACD,OAAO,EAAE,OAAO,GAChB,CACH,CAAA;AACH,CAAC,CAAA;AACD,MAAM,CAAC,IAAM,0BAA0B,GAAG;IACxC,OAAO,CACL,oBAAC,cAAc,IACb,OAAO,EAAE,eAAe,EACxB,cAAc,EAAE,KAAK,EACrB,aAAa,EAAE;YACb;gBACE,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC;gBACL,4BAAI,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,uBAAuB,YAEzC,CACF;YACL,oDAAoD;SACrD,EACD,OAAO,wBACF,OAAO,KACV,qBAAqB,EAAE,CAAC,+BAA+B,EAAE,kBAAkB,CAAC,EAC5E,cAAc,EAAE,CAAC,qBAAqB,EAAE,uCAAuC,CAAC,MAElF,CACH,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,6BAA6B,GAAG;IAC3C,OAAO,oBAAC,cAAc,IAAC,cAAc,EAAE,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,OAAO,GAAI,CAAA;AAC9F,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,gBAAgB,GAAG;IAC9B,OAAO,oBAAC,cAAc,IAAC,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,OAAO,GAAI,CAAA;AACvE,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,OAAO,oBAAC,cAAc,IAAC,cAAc,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,GAAI,CAAA;AACpE,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,gBAAgB,GAAG;IAC9B,OAAO,CACL,oBAAC,cAAc,IACb,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE;YACb,8QAA8Q;SAC/Q,GACD,CACH,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"AdditionalFees.stories.js","sourceRoot":"","sources":["../../../../src/page_components/listing/AdditionalFees.stories.tsx"],"names":[],"mappings":"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"}
@@ -3,7 +3,7 @@ import { Heading } from "../text/Heading";
3
3
  import "./InfoCardGrid.scss";
4
4
  var InfoCardGrid = function (props) { return (React.createElement("section", { className: "info-cards" },
5
5
  React.createElement("header", { className: "info-cards__header" },
6
- React.createElement(Heading, { styleType: "underlineWeighted", priority: 2, className: "text-sm" }, props.title),
6
+ React.createElement(Heading, { styleType: "underlineWeighted", priority: 2, className: "info-cards__title" }, props.title),
7
7
  props.subtitle && React.createElement("p", { className: "info-cards__subtitle" }, props.subtitle)),
8
8
  React.createElement("div", { className: "info-cards__grid" }, props.children))); };
9
9
  export { InfoCardGrid as default, InfoCardGrid };
@@ -1 +1 @@
1
- {"version":3,"file":"InfoCardGrid.js","sourceRoot":"","sources":["../../../src/sections/InfoCardGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,qBAAqB,CAAA;AAQ5B,IAAM,YAAY,GAAG,UAAC,KAAwB,IAAK,OAAA,CACjD,iCAAS,SAAS,EAAC,YAAY;IAC7B,gCAAQ,SAAS,EAAC,oBAAoB;QACpC,oBAAC,OAAO,IAAC,SAAS,EAAE,mBAAmB,EAAE,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,IACvE,KAAK,CAAC,KAAK,CACJ;QACT,KAAK,CAAC,QAAQ,IAAI,2BAAG,SAAS,EAAC,sBAAsB,IAAE,KAAK,CAAC,QAAQ,CAAK,CACpE;IACT,6BAAK,SAAS,EAAC,kBAAkB,IAAE,KAAK,CAAC,QAAQ,CAAO,CAChD,CACX,EAVkD,CAUlD,CAAA;AAED,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"InfoCardGrid.js","sourceRoot":"","sources":["../../../src/sections/InfoCardGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,qBAAqB,CAAA;AAQ5B,IAAM,YAAY,GAAG,UAAC,KAAwB,IAAK,OAAA,CACjD,iCAAS,SAAS,EAAC,YAAY;IAC7B,gCAAQ,SAAS,EAAC,oBAAoB;QACpC,oBAAC,OAAO,IAAC,SAAS,EAAE,mBAAmB,EAAE,QAAQ,EAAE,CAAC,EAAE,SAAS,EAAE,mBAAmB,IACjF,KAAK,CAAC,KAAK,CACJ;QACT,KAAK,CAAC,QAAQ,IAAI,2BAAG,SAAS,EAAC,sBAAsB,IAAE,KAAK,CAAC,QAAQ,CAAK,CACpE;IACT,6BAAK,SAAS,EAAC,kBAAkB,IAAE,KAAK,CAAC,QAAQ,CAAO,CAChD,CACX,EAVkD,CAUlD,CAAA;AAED,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,YAAY,EAAE,CAAA"}
@@ -7,5 +7,6 @@ export interface TagProps extends AppearanceProps {
7
7
  capitalized?: boolean;
8
8
  children: React.ReactNode;
9
9
  fillContainer?: boolean;
10
+ ariaLabel?: string;
10
11
  }
11
12
  export declare const Tag: (props: TagProps) => JSX.Element;
@@ -11,6 +11,6 @@ export var Tag = function (props) {
11
11
  tagClasses.push("is-capitalized");
12
12
  if (props.className)
13
13
  tagClasses.push(props.className);
14
- return React.createElement("span", { className: tagClasses.join(" ") }, props.children);
14
+ return (React.createElement("span", { className: tagClasses.join(" "), "aria-label": props.ariaLabel || undefined }, props.children));
15
15
  };
16
16
  //# sourceMappingURL=Tag.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../../src/text/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAmB,4BAA4B,EAAE,MAAM,2BAA2B,CAAA;AACzF,OAAO,YAAY,CAAA;AAUnB,MAAM,CAAC,IAAM,GAAG,GAAG,UAAC,KAAe;IACjC,IAAM,UAAU,GAAG,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAC,CAAA;IAEtE,IAAI,KAAK,CAAC,SAAS;QAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IAC/C,IAAI,KAAK,CAAC,aAAa;QAAE,UAAU,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;IAC1D,IAAI,KAAK,CAAC,WAAW;QAAE,UAAU,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;IACxD,IAAI,KAAK,CAAC,SAAS;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAErD,OAAO,8BAAM,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,IAAG,KAAK,CAAC,QAAQ,CAAQ,CAAA;AACvE,CAAC,CAAA"}
1
+ {"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../../src/text/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAmB,4BAA4B,EAAE,MAAM,2BAA2B,CAAA;AACzF,OAAO,YAAY,CAAA;AAWnB,MAAM,CAAC,IAAM,GAAG,GAAG,UAAC,KAAe;IACjC,IAAM,UAAU,GAAG,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAC,CAAA;IAEtE,IAAI,KAAK,CAAC,SAAS;QAAE,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IAC/C,IAAI,KAAK,CAAC,aAAa;QAAE,UAAU,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;IAC1D,IAAI,KAAK,CAAC,WAAW;QAAE,UAAU,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;IACxD,IAAI,KAAK,CAAC,SAAS;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAErD,OAAO,CACL,8BAAM,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,gBAAc,KAAK,CAAC,SAAS,IAAI,SAAS,IAC5E,KAAK,CAAC,QAAQ,CACV,CACR,CAAA;AACH,CAAC,CAAA"}
package/index.ts CHANGED
@@ -21,6 +21,7 @@ export * from "./src/blocks/StatusBar"
21
21
  export * from "./src/blocks/ViewItem"
22
22
  export * from "./src/blocks/StandardCard"
23
23
  export * from "./src/blocks/MediaCard"
24
+ export * from "./src/blocks/Tooltip"
24
25
 
25
26
  /* Contexts */
26
27
  export * from "./src/config"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bloom-housing/ui-components",
3
- "version": "9.0.0",
3
+ "version": "9.0.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",
@@ -1,4 +1,5 @@
1
1
  @import "../global/mixins.scss";
2
+ @import "../global/accessibility.scss";
2
3
 
3
4
  .image-card {
4
5
  /* Component Variables */
@@ -18,6 +19,11 @@
18
19
  background-color: var(--default-background-color);
19
20
  border-radius: var(--border-radius);
20
21
 
22
+ button:focus {
23
+ outline: none;
24
+ box-shadow: 0 0 3px 4px var(--bloom-color-accent-cool);
25
+ }
26
+
21
27
  img {
22
28
  border-radius: var(--border-radius);
23
29
  width: 100%;
@@ -98,7 +104,8 @@
98
104
  flex-direction: column;
99
105
  align-items: center;
100
106
  justify-content: center;
101
-
107
+ color: var(--bloom-color-white);
108
+ background: rgba(0, 0, 0, 0.6);
102
109
  @media (max-width: $screen-sm) {
103
110
  font-size: var(--bloom-font-size-xs);
104
111
  line-height: var(--bloom-line-height-none);
@@ -119,6 +126,7 @@
119
126
  justify-content: var(--tags-justify);
120
127
  position: absolute;
121
128
  top: 0;
129
+ z-index: 10;
122
130
  width: 100%;
123
131
  margin-block-start: var(--bloom-s1);
124
132
  padding-inline: var(--bloom-s4);
@@ -157,4 +165,22 @@
157
165
  --footer-justify: center;
158
166
  --modal-border: none;
159
167
  --modal-shadow: none;
168
+ @media (min-width: $screen-md) {
169
+ --scroll-max-height: calc(80vh - 200px);
170
+ max-width: var(--bloom-width-5xl);
171
+ }
172
+ section {
173
+ display: flex;
174
+ flex-direction: column;
175
+ align-items: center;
176
+ }
177
+ button {
178
+ outline: none;
179
+ }
180
+ svg {
181
+ @extend .sr-only;
182
+ }
183
+ footer button:focus {
184
+ box-shadow: 0 0 3px 4px var(--bloom-color-accent-cool);
185
+ }
160
186
  }
@@ -3,7 +3,7 @@ import { BADGES } from "../../.storybook/constants"
3
3
  import { ImageCard } from "./ImageCard"
4
4
  import { t } from "../helpers/translator"
5
5
  import { ApplicationStatusType } from "../global/ApplicationStatusType"
6
- import { IconFillColors } from "../icons/Icon"
6
+ import { IconFillColors, UniversalIconType } from "../icons/Icon"
7
7
  import ImageCardDocumentation from "./ImageCard.docs.mdx"
8
8
 
9
9
  export default {
@@ -103,6 +103,32 @@ export const withMultipleTags = () => (
103
103
  />
104
104
  )
105
105
 
106
+ export const withTooltip = () => (
107
+ <div style={{ margin: "5rem" }}>
108
+ <ImageCard
109
+ href="/listings"
110
+ imageUrl="/images/listing.jpg"
111
+ tags={[
112
+ {
113
+ text: "Label",
114
+ },
115
+ {
116
+ text: "Label2",
117
+ iconType: "globe" as UniversalIconType,
118
+ iconColor: IconFillColors.white,
119
+ tooltip: {
120
+ id: "tooltip",
121
+ text: "Here is some helpful tooltip content. Here is even more helpful tooltip content.",
122
+ },
123
+ },
124
+ ]}
125
+ statuses={[
126
+ { status: ApplicationStatusType.Closed, content: t("listings.applicationsClosed") },
127
+ ]}
128
+ />
129
+ </div>
130
+ )
131
+
106
132
  export const withLongTagsAndIcons = () => (
107
133
  <ImageCard
108
134
  href="/listings"
@@ -3,6 +3,7 @@ import { LocalizedLink } from "../actions/LocalizedLink"
3
3
  import { ApplicationStatus } from "../notifications/ApplicationStatus"
4
4
  import "./ImageCard.scss"
5
5
  import { Tag } from "../text/Tag"
6
+ import { TooltipProps, Tooltip } from "./Tooltip"
6
7
  import { ApplicationStatusType } from "../global/ApplicationStatusType"
7
8
  import { AppearanceSizeType, AppearanceStyleType } from "../global/AppearanceTypes"
8
9
  import { Icon, IconFillColors, UniversalIconType } from "../icons/Icon"
@@ -18,11 +19,14 @@ export interface StatusBarType {
18
19
  iconType?: UniversalIconType
19
20
  }
20
21
 
22
+ export type ImageTagTooltip = Pick<TooltipProps, "id" | "text">
23
+
21
24
  export interface ImageTag {
22
25
  text?: string
23
26
  iconType?: UniversalIconType
24
27
  iconColor?: string
25
28
  styleType?: AppearanceStyleType
29
+ tooltip?: ImageTagTooltip
26
30
  }
27
31
 
28
32
  export interface ImageItem {
@@ -80,11 +84,7 @@ const ImageCard = (props: ImageCardProps) => {
80
84
  />
81
85
  )
82
86
  })
83
- return (
84
- <aside className="image-card__status" aria-label={`${props.description || ""} Statuses`}>
85
- {statuses}
86
- </aside>
87
- )
87
+ return <aside aria-label={`${props.description || ""} Statuses`}>{statuses}</aside>
88
88
  }
89
89
 
90
90
  const innerClasses = ["image-card__inner"]
@@ -158,20 +158,34 @@ const ImageCard = (props: ImageCardProps) => {
158
158
  {getStatuses()}
159
159
  <div className="image-card-tag__wrapper">
160
160
  {props.tags?.map((tag, index) => {
161
- return (
162
- <React.Fragment key={index}>
163
- <Tag styleType={tag.styleType || AppearanceStyleType.warning}>
164
- {tag.iconType && (
165
- <Icon
166
- size={"medium"}
167
- symbol={tag.iconType}
168
- fill={tag.iconColor ?? IconFillColors.primary}
169
- />
170
- )}
171
- {tag.text}
172
- </Tag>
173
- </React.Fragment>
161
+ const tagContent = (
162
+ <Tag
163
+ styleType={tag.styleType || AppearanceStyleType.warning}
164
+ ariaLabel={
165
+ tag.tooltip ? `${tag.text || ""} - ${tag.tooltip?.text || ""}` : undefined
166
+ }
167
+ >
168
+ {tag.iconType && (
169
+ <Icon
170
+ size={"medium"}
171
+ symbol={tag.iconType}
172
+ fill={tag.iconColor ?? IconFillColors.primary}
173
+ className={"mr-2"}
174
+ />
175
+ )}
176
+ {tag.text}
177
+ </Tag>
174
178
  )
179
+
180
+ if (tag.tooltip) {
181
+ return (
182
+ <Tooltip key={index} className="mt-3" {...tag.tooltip}>
183
+ {tagContent}
184
+ </Tooltip>
185
+ )
186
+ }
187
+
188
+ return <React.Fragment key={index}>{tagContent}</React.Fragment>
175
189
  })}
176
190
  </div>
177
191
  </div>
@@ -179,7 +193,7 @@ const ImageCard = (props: ImageCardProps) => {
179
193
  <Modal
180
194
  open={showModal}
181
195
  title={props.modalAriaTitle || "Images"}
182
- scrollable={true}
196
+ scrollableModal={true}
183
197
  onClose={() => setShowModal(!showModal)}
184
198
  className="image-card__overlay"
185
199
  modalClassNames="image-card__gallery-modal"
@@ -191,24 +205,21 @@ const ImageCard = (props: ImageCardProps) => {
191
205
  </Button>,
192
206
  ]}
193
207
  >
194
- {props.images &&
195
- props.images.map((image, index) => (
196
- <p key={index} className="mb-7">
197
- <picture>
198
- {image.mobileUrl && (
199
- <source media="(max-width: 767px)" srcSet={image.mobileUrl} />
200
- )}
201
- <img
202
- src={image.url}
203
- alt={
204
- image.description
205
- ? image.description
206
- : `${props.description || ""} - photo ${index + 1}`
207
- }
208
- />
209
- </picture>
210
- </p>
211
- ))}
208
+ {props.images?.map((image, index) => (
209
+ <p key={index} className="mb-7">
210
+ <picture>
211
+ {image.mobileUrl && <source media="(max-width: 767px)" srcSet={image.mobileUrl} />}
212
+ <img
213
+ src={image.url}
214
+ alt={
215
+ image.description
216
+ ? image.description
217
+ : `${props.description || ""} - photo ${index + 1}`
218
+ }
219
+ />
220
+ </picture>
221
+ </p>
222
+ ))}
212
223
  </Modal>
213
224
  )}
214
225
  </>
@@ -46,3 +46,21 @@
46
46
  margin-bottom: var(--bloom-s4);
47
47
  }
48
48
  }
49
+
50
+ .info-card__columns {
51
+ display: flex;
52
+ flex-wrap: wrap;
53
+ }
54
+
55
+ .info-card__column {
56
+ flex: 1 1 0%;
57
+ }
58
+
59
+ .info-card__column-2 {
60
+ flex: 1 1 100%;
61
+ margin-top: var(--bloom-s4);
62
+ margin-right: var(--bloom-s4);
63
+ @media (min-width: 440px) {
64
+ flex: 1 1 45%;
65
+ }
66
+ }
@@ -20,6 +20,7 @@ export const Default = () => (
20
20
  <>
21
21
  <InfoCard
22
22
  title="My Card"
23
+ subtitle="Subtitle"
23
24
  externalHref="http://google.com"
24
25
  className="is-normal-primary-lighter"
25
26
  >
@@ -34,6 +35,17 @@ More content
34
35
  </>
35
36
  )
36
37
 
38
+ export const NoChildren = () => (
39
+ <>
40
+ <InfoCard
41
+ title="My Card"
42
+ subtitle="Subtitle"
43
+ externalHref="http://google.com"
44
+ className="is-normal-primary-lighter"
45
+ />
46
+ </>
47
+ )
48
+
37
49
  export const WithMarkdown = () => (
38
50
  <InfoCard title="My Card" externalHref="http://google.com" className="is-normal-primary-lighter">
39
51
  {`
@@ -7,7 +7,7 @@ export interface InfoCardProps {
7
7
  subtitle?: string
8
8
  externalHref?: string
9
9
  className?: string
10
- children: React.ReactNode
10
+ children?: React.ReactNode
11
11
  }
12
12
 
13
13
  const InfoCard = (props: InfoCardProps) => {
@@ -28,7 +28,7 @@ const InfoCard = (props: InfoCardProps) => {
28
28
  ) : (
29
29
  <h3 className="info-card__title">{props.title}</h3>
30
30
  )}
31
- {props.subtitle && <span className={"text-xs text-gray-700"}>{props.subtitle}</span>}
31
+ {props.subtitle && <span className={"text-sm text-gray-700"}>{props.subtitle}</span>}
32
32
  </div>
33
33
  {typeof props.children == "string" ? (
34
34
  <div className="markdown">
@@ -0,0 +1,43 @@
1
+ .tooltip {
2
+ @apply relative;
3
+ display: inline-block;
4
+ width: fit-content;
5
+ }
6
+
7
+ .tooltip__element {
8
+ @apply w-full;
9
+ @apply fixed;
10
+ @apply bg-primary-dark;
11
+ @apply text-white;
12
+ @apply rounded;
13
+ @apply p-2;
14
+ @apply text-sm;
15
+ @apply font-bold;
16
+ @apply text-center;
17
+ @apply normal-case;
18
+ @apply opacity-0;
19
+ @apply invisible;
20
+ transform: translate(-50%, calc(-100% - 10px * 2));
21
+
22
+ max-width: 280px;
23
+ transition: opacity 0.2s;
24
+
25
+ &--visible {
26
+ @apply opacity-100;
27
+ @apply visible;
28
+ }
29
+
30
+ &::before {
31
+ content: "";
32
+ @apply absolute;
33
+ @apply bottom-0;
34
+ @apply w-0;
35
+ @apply h-0;
36
+ @apply border-solid;
37
+ left: 50%;
38
+ bottom: -8px;
39
+ transform: translateX(-50%);
40
+ border-width: 10px 7px 0 7px;
41
+ border-color: theme("colors.primary-dark") transparent transparent transparent;
42
+ }
43
+ }
@@ -0,0 +1,65 @@
1
+ import React, { useState, useRef, useEffect } from "react"
2
+ import useKeyPress from "../helpers/useKeyPress"
3
+ import "./Tooltip.scss"
4
+
5
+ export interface TooltipProps {
6
+ className?: string
7
+ id: string
8
+ text: string
9
+ }
10
+
11
+ export interface TooltipPosition {
12
+ top: number
13
+ left: number
14
+ }
15
+
16
+ const Tooltip = ({ className, id, text, children }: React.PropsWithChildren<TooltipProps>) => {
17
+ const [position, setPosition] = useState<TooltipPosition | null>(null)
18
+ const childrenWrapperRef = useRef<HTMLDivElement>(null)
19
+
20
+ const show = () => {
21
+ const { x, y, width, height } = childrenWrapperRef.current?.getBoundingClientRect() || {}
22
+
23
+ if (x && y && width && height) {
24
+ setPosition({ top: y, left: x + width / 2 })
25
+ }
26
+ }
27
+
28
+ const hide = () => setPosition(null)
29
+
30
+ useKeyPress("Escape", () => hide())
31
+
32
+ useEffect(() => {
33
+ window.addEventListener("scroll", () => hide())
34
+
35
+ return () => {
36
+ window.removeEventListener("scroll", () => hide())
37
+ }
38
+ }, [])
39
+
40
+ return (
41
+ <div
42
+ className={`tooltip ${className || ""}`}
43
+ onFocus={show}
44
+ onMouseEnter={show}
45
+ onBlur={hide}
46
+ onMouseLeave={hide}
47
+ >
48
+ <div
49
+ className={`tooltip__element ${position ? "tooltip__element--visible" : ""}`}
50
+ style={position || {}}
51
+ role="tooltip"
52
+ id={id}
53
+ data-test-id="tooltip-element"
54
+ >
55
+ {text}
56
+ </div>
57
+
58
+ <div className="tooltip__children" data-test-id="tooltip-children" ref={childrenWrapperRef}>
59
+ {children}
60
+ </div>
61
+ </div>
62
+ )
63
+ }
64
+
65
+ export { Tooltip as default, Tooltip }
@@ -111,3 +111,7 @@ export const costsNotIncluded = () => {
111
111
  />
112
112
  )
113
113
  }
114
+
115
+ export const multipleFooters = () => {
116
+ return <AdditionalFees strings={strings} footerContent={["Footer 1", "Footer 2", "Footer 3"]} />
117
+ }
@@ -1,5 +1,11 @@
1
+ .info-cards {
2
+ --header-margin: var(--bloom-s3) 0 var(--bloom-s3) 0;
3
+ --title-font-size: var(--bloom-font-size-sm);
4
+ --info-card-font-size: var(--bloom-font-size-sm);
5
+ }
6
+
1
7
  .info-cards__header {
2
- @apply my-3;
8
+ margin: var(--header-margin);
3
9
 
4
10
  @screen md {
5
11
  margin-right: 1rem;
@@ -7,18 +13,7 @@
7
13
  }
8
14
 
9
15
  .info-cards__title {
10
- @apply font-alt-sans;
11
- @apply uppercase;
12
- @apply text-sm;
13
- @apply mb-5;
14
- @apply pb-2;
15
- @apply border-0;
16
- @apply border-b-4;
17
- @apply border-primary;
18
- @apply font-semibold;
19
- @apply text-gray-800;
20
- @apply tracking-widest;
21
- @apply inline-block;
16
+ font-size: var(--title-font-size);
22
17
  }
23
18
 
24
19
  .info-cards__subtitle {
@@ -30,16 +25,17 @@
30
25
  @screen md {
31
26
  @apply flex;
32
27
  @apply flex-wrap;
28
+ column-gap: 1rem;
33
29
  }
34
30
 
35
31
  .info-card {
36
32
  & > :not(.info-card__title) {
37
- @apply text-sm;
33
+ font-size: var(--info-card-font-size);
38
34
  }
39
35
 
40
36
  @screen md {
41
- width: calc(50% - 1rem);
42
- margin-right: 1rem;
37
+ width: calc(50% - 0.5rem);
38
+ margin-right: auto;
43
39
  }
44
40
  }
45
41
  }
@@ -11,7 +11,7 @@ export interface InfoCardGridProps {
11
11
  const InfoCardGrid = (props: InfoCardGridProps) => (
12
12
  <section className="info-cards">
13
13
  <header className="info-cards__header">
14
- <Heading styleType={"underlineWeighted"} priority={2} className={"text-sm"}>
14
+ <Heading styleType={"underlineWeighted"} priority={2} className={"info-cards__title"}>
15
15
  {props.title}
16
16
  </Heading>
17
17
  {props.subtitle && <p className="info-cards__subtitle">{props.subtitle}</p>}
package/src/text/Tag.tsx CHANGED
@@ -8,6 +8,7 @@ export interface TagProps extends AppearanceProps {
8
8
  capitalized?: boolean
9
9
  children: React.ReactNode
10
10
  fillContainer?: boolean
11
+ ariaLabel?: string
11
12
  }
12
13
 
13
14
  export const Tag = (props: TagProps) => {
@@ -18,5 +19,9 @@ export const Tag = (props: TagProps) => {
18
19
  if (props.capitalized) tagClasses.push("is-capitalized")
19
20
  if (props.className) tagClasses.push(props.className)
20
21
 
21
- return <span className={tagClasses.join(" ")}>{props.children}</span>
22
+ return (
23
+ <span className={tagClasses.join(" ")} aria-label={props.ariaLabel || undefined}>
24
+ {props.children}
25
+ </span>
26
+ )
22
27
  }