@bloom-housing/ui-components 7.1.0 → 7.2.1

package/dist/src/blocks/HousingCounselor.d.ts

@@ -0,0 +1,15 @@
+export interface HousingCounselorProps {
+    addressCityState?: string;
+    addressStreet?: string;
+    languages: string[];
+    name: string;
+    phone?: string;
+    website?: string;
+    strings?: {
+        callNumber?: string;
+        languageServices?: string;
+        website?: string;
+    };
+}
+declare const HousingCounselor: (props: HousingCounselorProps) => JSX.Element;
+export { HousingCounselor as default, HousingCounselor };

package/dist/src/blocks/HousingCounselor.js

@@ -0,0 +1,52 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HousingCounselor = exports.default = void 0;
+var React = __importStar(require("react"));
+var Icon_1 = require("../icons/Icon");
+var translator_1 = require("../helpers/translator");
+var LanguageLabel = function (language) {
+    return (React.createElement("span", { className: "pill", key: language }, language));
+};
+var HousingCounselor = function (props) {
+    var _a, _b, _c, _d, _e, _f;
+    return (React.createElement("div", { className: "resource-item text-base" },
+        React.createElement("h3", { className: "font-sans text-lg" }, props.name),
+        React.createElement("p", { className: "text-sm text-gray-800 pb-2" }, (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.languageServices) !== null && _b !== void 0 ? _b : (0, translator_1.t)("housingCounselors.languageServices"),
+            props.languages.map(function (language) { return LanguageLabel(language); })),
+        props.addressStreet && (React.createElement("p", { className: "icon-item pb-2" },
+            props.addressStreet,
+            " ",
+            React.createElement("br", null),
+            " ",
+            props.addressCityState)),
+        props.phone && (React.createElement("a", { className: "icon-item pb-1", href: "tel:+1".concat(props.phone) },
+            React.createElement(Icon_1.Icon, { symbol: "phone", size: "medium", fill: Icon_1.IconFillColors.primary }), " ".concat((_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.callNumber) !== null && _d !== void 0 ? _d : (0, translator_1.t)("housingCounselors.call", { number: props.phone })))),
+        props.website && (React.createElement("a", { className: "icon-item", href: props.website },
+            React.createElement(Icon_1.Icon, { symbol: "globe", size: "medium", fill: Icon_1.IconFillColors.primary }), " ".concat((_f = (_e = props.strings) === null || _e === void 0 ? void 0 : _e.website) !== null && _f !== void 0 ? _f : (0, translator_1.t)("t.website"))))));
+};
+exports.default = HousingCounselor;
+exports.HousingCounselor = HousingCounselor;
+//# sourceMappingURL=HousingCounselor.js.map

package/dist/src/blocks/HousingCounselor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HousingCounselor.js","sourceRoot":"","sources":["../../../src/blocks/HousingCounselor.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,sCAAoD;AACpD,oDAAyC;AAgBzC,IAAM,aAAa,GAAG,UAAC,QAAgB;IACrC,OAAO,CACL,8BAAM,SAAS,EAAC,MAAM,EAAC,GAAG,EAAE,QAAQ,IACjC,QAAQ,CACJ,CACR,CAAA;AACH,CAAC,CAAA;AAED,IAAM,gBAAgB,GAAG,UAAC,KAA4B;;IACpD,OAAO,CACL,6BAAK,SAAS,EAAC,yBAAyB;QACtC,4BAAI,SAAS,EAAC,mBAAmB,IAAE,KAAK,CAAC,IAAI,CAAM;QACnD,2BAAG,SAAS,EAAC,4BAA4B,IACtC,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,gBAAgB,mCAAI,IAAA,cAAC,EAAC,oCAAoC,CAAC;YAC1E,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,UAAC,QAAQ,IAAK,OAAA,aAAa,CAAC,QAAQ,CAAC,EAAvB,CAAuB,CAAC,CACzD;QACH,KAAK,CAAC,aAAa,IAAI,CACtB,2BAAG,SAAS,EAAC,gBAAgB;YAC1B,KAAK,CAAC,aAAa;;YAAE,+BAAM;;YAAE,KAAK,CAAC,gBAAgB,CAClD,CACL;QACA,KAAK,CAAC,KAAK,IAAI,CACd,2BAAG,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAE,gBAAS,KAAK,CAAC,KAAK,CAAE;YACxD,oBAAC,WAAI,IAAC,MAAM,EAAC,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,qBAAc,CAAC,OAAO,GAAI,EAClE,WAAI,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,UAAU,mCAAI,IAAA,cAAC,EAAC,wBAAwB,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC,CAAE,CACtF,CACL;QACA,KAAK,CAAC,OAAO,IAAI,CAChB,2BAAG,SAAS,EAAC,WAAW,EAAC,IAAI,EAAE,KAAK,CAAC,OAAO;YAC1C,oBAAC,WAAI,IAAC,MAAM,EAAC,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAE,qBAAc,CAAC,OAAO,GAAI,EAClE,WAAI,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,OAAO,mCAAI,IAAA,cAAC,EAAC,WAAW,CAAC,CAAE,CAC7C,CACL,CACG,CACP,CAAA;AACH,CAAC,CAAA;AAE4B,mCAAO;AAAE,4CAAgB"}

package/dist/src/blocks/HousingCounselor.stories.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const withOnlyRequiredFields: () => JSX.Element;
+export declare const withMultipleLanguages: () => JSX.Element;
+export declare const withAllFields: () => JSX.Element;

package/dist/src/blocks/HousingCounselor.stories.js

@@ -0,0 +1,38 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withAllFields = exports.withMultipleLanguages = exports.withOnlyRequiredFields = void 0;
+var React = __importStar(require("react"));
+var HousingCounselor_1 = require("./HousingCounselor");
+exports.default = {
+    title: "Blocks/Housing Counselor",
+};
+var withOnlyRequiredFields = function () { return (React.createElement(HousingCounselor_1.HousingCounselor, { name: "Counselor Name", languages: ["English"] })); };
+exports.withOnlyRequiredFields = withOnlyRequiredFields;
+var withMultipleLanguages = function () { return (React.createElement(HousingCounselor_1.HousingCounselor, { name: "Counselor Name", languages: ["English", "Spanish", "Chinese"] })); };
+exports.withMultipleLanguages = withMultipleLanguages;
+var withAllFields = function () { return (React.createElement(HousingCounselor_1.HousingCounselor, { name: "Counselor Name", languages: ["English"], addressStreet: "123 Main St", addressCityState: "San Francisco, CA", website: "www.counselor.org", phone: "123-456-7890" })); };
+exports.withAllFields = withAllFields;
+//# sourceMappingURL=HousingCounselor.stories.js.map

package/dist/src/blocks/HousingCounselor.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HousingCounselor.stories.js","sourceRoot":"","sources":["../../../src/blocks/HousingCounselor.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAE9B,uDAAqD;AAErD,kBAAe;IACb,KAAK,EAAE,0BAA0B;CAClC,CAAA;AAEM,IAAM,sBAAsB,GAAG,cAAM,OAAA,CAC1C,oBAAC,mCAAgB,IAAC,IAAI,EAAE,gBAAgB,EAAE,SAAS,EAAE,CAAC,SAAS,CAAC,GAAI,CACrE,EAF2C,CAE3C,CAAA;AAFY,QAAA,sBAAsB,0BAElC;AAEM,IAAM,qBAAqB,GAAG,cAAM,OAAA,CACzC,oBAAC,mCAAgB,IAAC,IAAI,EAAE,gBAAgB,EAAE,SAAS,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,GAAI,CAC3F,EAF0C,CAE1C,CAAA;AAFY,QAAA,qBAAqB,yBAEjC;AAEM,IAAM,aAAa,GAAG,cAAM,OAAA,CACjC,oBAAC,mCAAgB,IACf,IAAI,EAAE,gBAAgB,EACtB,SAAS,EAAE,CAAC,SAAS,CAAC,EACtB,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,mBAAmB,EACrC,OAAO,EAAE,mBAAmB,EAC5B,KAAK,EAAE,cAAc,GACrB,CACH,EATkC,CASlC,CAAA;AATY,QAAA,aAAa,iBASzB"}

package/dist/src/blocks/ImageCard.d.ts

@@ -0,0 +1,55 @@
+import "./ImageCard.scss";
+import { ApplicationStatusType } from "../global/ApplicationStatusType";
+import { AppearanceStyleType } from "../global/AppearanceTypes";
+import { UniversalIconType } from "../icons/Icon";
+export interface StatusBarType {
+    status?: ApplicationStatusType;
+    content: string;
+    subContent?: string;
+    hideIcon?: boolean;
+    iconType?: UniversalIconType;
+}
+export interface ImageTag {
+    text?: string;
+    iconType?: UniversalIconType;
+    iconColor?: string;
+    styleType?: AppearanceStyleType;
+}
+export interface ImageItem {
+    url: string;
+    description?: string;
+    thumbnailUrl?: string;
+    mobileUrl?: string;
+}
+export interface ImageCardProps {
+    /** A description of the image, used as alt text */
+    description?: string;
+    /** A link, used to wrap the entire component */
+    href?: string;
+    /** An image URL, used as the main image */
+    imageUrl?: string;
+    /** Alternatively, a number of images can be passed in  */
+    images?: ImageItem[];
+    /** A list of status indicators, an ApplicationStatus component is rendered for each item at the bottom of the card */
+    statuses?: StatusBarType[];
+    /** A list of image tags, a Tag component is rendered for each over the image */
+    tags?: ImageTag[];
+    /** The label text of the close button when the gallery modal is displayed */
+    modalCloseLabel?: string;
+    /** The title text of the gallery modal, only for screen readers */
+    modalAriaTitle?: string;
+    /** The label of the more images area of the images grid  */
+    moreImagesLabel?: string;
+    /** The aria label of the clickable region of the images grid */
+    moreImagesDescription?: string;
+    strings?: {
+        defaultImageAltText?: string;
+    };
+}
+/**
+ * @component ImageCard
+ *
+ * A component that renders an image with optional tags at top and status bars below it
+ */
+declare const ImageCard: (props: ImageCardProps) => JSX.Element;
+export { ImageCard as default, ImageCard };

package/dist/src/blocks/ImageCard.js

@@ -0,0 +1,108 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageCard = exports.default = void 0;
+var react_1 = __importStar(require("react"));
+var LocalizedLink_1 = require("../actions/LocalizedLink");
+var ApplicationStatus_1 = require("../notifications/ApplicationStatus");
+require("./ImageCard.scss");
+var Tag_1 = require("../text/Tag");
+var AppearanceTypes_1 = require("../global/AppearanceTypes");
+var Icon_1 = require("../icons/Icon");
+var Modal_1 = require("../overlays/Modal");
+var Button_1 = require("../actions/Button");
+var translator_1 = require("../helpers/translator");
+/**
+ * @component ImageCard
+ *
+ * A component that renders an image with optional tags at top and status bars below it
+ */
+var ImageCard = function (props) {
+    var _a, _b, _c, _d;
+    var _e = (0, react_1.useState)(false), showModal = _e[0], setShowModal = _e[1];
+    var getStatuses = function () {
+        var _a;
+        var statuses = (_a = props.statuses) === null || _a === void 0 ? void 0 : _a.map(function (status, index) {
+            return (react_1.default.createElement(ApplicationStatus_1.ApplicationStatus, { status: status.status, content: status.content, subContent: status.subContent, withIcon: !status.hideIcon, iconType: status.iconType, vivid: true, key: index }));
+        });
+        return (react_1.default.createElement("aside", { className: "image-card__status", "aria-label": "".concat(props.description, " Statuses") }, statuses));
+    };
+    var innerClasses = ["image-card__inner"];
+    if (props.images && props.images.length > 1) {
+        innerClasses.push("has-grid-layout");
+        if (props.images.length > 3) {
+            innerClasses.push("has-modal-overflow");
+        }
+        else {
+            innerClasses.push("has-".concat(props.images.length, "-images"));
+        }
+    }
+    var displayedImages = (0, react_1.useMemo)(function () {
+        var _a;
+        return (_a = props.images) === null || _a === void 0 ? void 0 : _a.slice(0, 3);
+    }, [props.images]);
+    var image = (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: "image-card" },
+            react_1.default.createElement("div", { className: "image-card-tag__wrapper" }, (_a = props.tags) === null || _a === void 0 ? void 0 : _a.map(function (tag, index) {
+                var _a;
+                return (react_1.default.createElement(react_1.default.Fragment, { key: index },
+                    react_1.default.createElement(Tag_1.Tag, { styleType: tag.styleType || AppearanceTypes_1.AppearanceStyleType.warning },
+                        tag.iconType && (react_1.default.createElement(Icon_1.Icon, { size: "medium", symbol: tag.iconType, fill: (_a = tag.iconColor) !== null && _a !== void 0 ? _a : Icon_1.IconFillColors.primary })),
+                        tag.text)));
+            })),
+            react_1.default.createElement("figure", { className: innerClasses.join(" ") },
+                props.imageUrl ? (react_1.default.createElement("img", { src: props.imageUrl, alt: (_d = (_b = props.description) !== null && _b !== void 0 ? _b : (_c = props.strings) === null || _c === void 0 ? void 0 : _c.defaultImageAltText) !== null && _d !== void 0 ? _d : (0, translator_1.t)("listings.buildingImageAltText") })) : props.images && displayedImages ? (displayedImages.map(function (image, index) { return (react_1.default.createElement("img", { key: index, src: image.thumbnailUrl || image.mobileUrl || image.url, alt: image.description
+                        ? image.description
+                        : "".concat(props.description || "", " - photo ").concat(index + 1) })); })) : (react_1.default.createElement("div", { className: "image-card__placeholder" })),
+                props.images && props.images.length > 1 && (react_1.default.createElement(react_1.default.Fragment, null,
+                    props.images && props.images.length > 3 && (react_1.default.createElement("div", { className: "image-card__more-images" },
+                        react_1.default.createElement(Icon_1.Icon, { symbol: "plus", size: "xlarge" }),
+                        props.moreImagesLabel && (react_1.default.createElement("span", null,
+                            props.images.length - 2,
+                            " ",
+                            props.moreImagesLabel)))),
+                    react_1.default.createElement("button", { "aria-label": props.moreImagesDescription &&
+                            "".concat(props.images.length - 2, " ").concat(props.moreImagesDescription), "data-test-id": "open-modal-button", onClick: function () {
+                            setShowModal(true);
+                        } })))),
+            getStatuses()),
+        props.images && props.images.length > 1 && (react_1.default.createElement(Modal_1.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: Icon_1.IconFillColors.white, actions: [
+                react_1.default.createElement(Button_1.Button, { onClick: function () { return setShowModal(!showModal); }, size: AppearanceTypes_1.AppearanceSizeType.small }, props.modalCloseLabel || "Close"),
+            ] }, props.images &&
+            props.images.map(function (image, index) { return (react_1.default.createElement("p", { key: index, className: "mb-7" },
+                react_1.default.createElement("picture", null,
+                    image.mobileUrl && (react_1.default.createElement("source", { media: "(max-width: 767px)", srcSet: image.mobileUrl })),
+                    react_1.default.createElement("img", { src: image.url, alt: image.description
+                            ? image.description
+                            : "".concat(props.description || "", " - photo ").concat(index + 1) })))); })))));
+    var card = image;
+    if (props.href) {
+        card = (react_1.default.createElement(LocalizedLink_1.LocalizedLink, { className: "block", href: props.href }, image));
+    }
+    return card;
+};
+exports.default = ImageCard;
+exports.ImageCard = ImageCard;
+//# sourceMappingURL=ImageCard.js.map

package/dist/src/blocks/ImageCard.js.map

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

package/dist/src/blocks/ImageCard.stories.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="mdx" />
+import { BADGES } from "../../.storybook/constants";
+import ImageCardDocumentation from "./ImageCard.docs.mdx";
+declare const _default: {
+    title: string;
+    id: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+    parameters: {
+        docs: {
+            page: typeof ImageCardDocumentation;
+        };
+        badges: BADGES[];
+    };
+};
+export default _default;
+export declare const image: () => JSX.Element;
+export declare const twoImages: () => JSX.Element;
+export declare const threeImages: () => JSX.Element;
+export declare const fourImages: () => JSX.Element;
+export declare const withLink: () => JSX.Element;
+export declare const withNoImage: () => JSX.Element;
+export declare const withOneStatusAndSmaller: () => JSX.Element;
+export declare const withDescriptionAsAlt: () => JSX.Element;
+export declare const withOneStatusAndTag: () => JSX.Element;
+export declare const withMultipleTags: () => JSX.Element;
+export declare const withLongTagsAndIcons: () => JSX.Element;
+export declare const withManyTags: () => JSX.Element;
+export declare const withMultipleAppStatus: () => JSX.Element;
+export declare const withCustomIconType: () => JSX.Element;

package/dist/src/blocks/ImageCard.stories.js

@@ -0,0 +1,136 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withCustomIconType = exports.withMultipleAppStatus = exports.withManyTags = exports.withLongTagsAndIcons = exports.withMultipleTags = exports.withOneStatusAndTag = exports.withDescriptionAsAlt = exports.withOneStatusAndSmaller = exports.withNoImage = exports.withLink = exports.fourImages = exports.threeImages = exports.twoImages = exports.image = void 0;
+var React = __importStar(require("react"));
+var constants_1 = require("../../.storybook/constants");
+var ImageCard_1 = require("./ImageCard");
+var translator_1 = require("../helpers/translator");
+var ApplicationStatusType_1 = require("../global/ApplicationStatusType");
+var Icon_1 = require("../icons/Icon");
+var ImageCard_docs_mdx_1 = __importDefault(require("./ImageCard.docs.mdx"));
+exports.default = {
+    title: "Blocks/Image Card 🚩",
+    id: "blocks/image-card",
+    decorators: [function (storyFn) { return React.createElement("div", { style: { maxWidth: "700px" } }, storyFn()); }],
+    parameters: {
+        docs: {
+            page: ImageCard_docs_mdx_1.default,
+        },
+        badges: [constants_1.BADGES.GEN2],
+    },
+};
+var image = function () { return React.createElement(ImageCard_1.ImageCard, { imageUrl: "/images/listing.jpg" }); };
+exports.image = image;
+var twoImages = function () { return (React.createElement(ImageCard_1.ImageCard, { images: [
+        { url: "/images/listing.jpg" },
+        {
+            url: "https://res.cloudinary.com/exygy/image/upload/w_1302,c_limit,q_65/dev/oakhouse_cgdqmx.jpg",
+        },
+    ] })); };
+exports.twoImages = twoImages;
+var threeImages = function () { return (React.createElement(ImageCard_1.ImageCard, { images: [
+        { url: "/images/listing.jpg" },
+        {
+            url: "https://res.cloudinary.com/exygy/image/upload/w_1302,c_limit,q_65/dev/oakhouse_cgdqmx.jpg",
+        },
+        {
+            url: "https://res.cloudinary.com/exygy/image/upload/w_1302,c_limit,q_65/dev/house_goo3cp.jpg",
+        },
+    ] })); };
+exports.threeImages = threeImages;
+var fourImages = function () { return (React.createElement(ImageCard_1.ImageCard, { images: [
+        { url: "/images/listing.jpg" },
+        {
+            url: "https://res.cloudinary.com/exygy/image/upload/w_1302,c_limit,q_65/dev/oakhouse_cgdqmx.jpg",
+            mobileUrl: "https://res.cloudinary.com/exygy/image/upload/w_767,c_limit,q_55/dev/oakhouse_cgdqmx.jpg",
+            thumbnailUrl: "https://res.cloudinary.com/exygy/image/upload/w_480,c_limit,q_55/dev/oakhouse_cgdqmx.jpg",
+            description: "The second photo in the list",
+        },
+        {
+            url: "https://res.cloudinary.com/exygy/image/upload/w_1302,c_limit,q_65/dev/house_goo3cp.jpg",
+        },
+        {
+            url: "https://regional-dahlia-staging.s3-us-west-1.amazonaws.com/listings/triton/thetriton.png",
+        },
+    ], modalCloseLabel: "Back to listing", moreImagesLabel: "images", moreImagesDescription: "more images for 'Property Name'" })); };
+exports.fourImages = fourImages;
+var withLink = function () { return React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg" }); };
+exports.withLink = withLink;
+var withNoImage = function () { return React.createElement(ImageCard_1.ImageCard, null); };
+exports.withNoImage = withNoImage;
+var withOneStatusAndSmaller = function () { return (React.createElement("header", { className: "image-card--leader" },
+    React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", statuses: [
+            { status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") },
+        ] }))); };
+exports.withOneStatusAndSmaller = withOneStatusAndSmaller;
+var withDescriptionAsAlt = function () { return (React.createElement(ImageCard_1.ImageCard, { imageUrl: "/images/listing.jpg", description: "An image of the building" })); };
+exports.withDescriptionAsAlt = withDescriptionAsAlt;
+var withOneStatusAndTag = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [{ text: "Label" }], statuses: [{ status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") }] })); };
+exports.withOneStatusAndTag = withOneStatusAndTag;
+var withMultipleTags = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [{ text: "Label" }, { text: "Label2" }], statuses: [{ status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") }] })); };
+exports.withMultipleTags = withMultipleTags;
+var withLongTagsAndIcons = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [
+        { text: "This is a long label", iconType: "mail", iconColor: Icon_1.IconFillColors.white },
+        { text: "This is another longer label" },
+    ], statuses: [{ status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") }] })); };
+exports.withLongTagsAndIcons = withLongTagsAndIcons;
+var withManyTags = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [
+        { text: "Label 1" },
+        { text: "Label 2" },
+        { text: "Label 3" },
+        { text: "Label 4" },
+        { text: "Label 5" },
+        { text: "Label 6" },
+        { text: "Label 7" },
+        { text: "Label 8" },
+    ], statuses: [{ status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") }] })); };
+exports.withManyTags = withManyTags;
+var withMultipleAppStatus = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", tags: [{ text: "Label" }], statuses: [
+        {
+            status: ApplicationStatusType_1.ApplicationStatusType.Open,
+            content: "First Come First Served",
+            subContent: "Application Due Date: July 10th",
+        },
+        { status: ApplicationStatusType_1.ApplicationStatusType.Closed, content: (0, translator_1.t)("listings.applicationsClosed") },
+        {
+            status: ApplicationStatusType_1.ApplicationStatusType.PostLottery,
+            content: "Lottery Results Posted: September 3rd",
+            hideIcon: true,
+        },
+    ] })); };
+exports.withMultipleAppStatus = withMultipleAppStatus;
+var withCustomIconType = function () { return (React.createElement(ImageCard_1.ImageCard, { href: "/listings", imageUrl: "/images/listing.jpg", statuses: [
+        {
+            status: ApplicationStatusType_1.ApplicationStatusType.Matched,
+            content: "Matched",
+            iconType: "check",
+        },
+    ] })); };
+exports.withCustomIconType = withCustomIconType;
+//# sourceMappingURL=ImageCard.stories.js.map

package/dist/src/blocks/ImageCard.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/ImageCard.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,wDAAmD;AACnD,yCAAuC;AACvC,oDAAyC;AACzC,yEAAuE;AACvE,sCAA8C;AAC9C,4EAAyD;AAEzD,kBAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,EAAE,EAAE,mBAAmB;IACvB,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAG,OAAO,EAAE,CAAO,EAApD,CAAoD,CAAC;IACpF,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,4BAAsB;SAC7B;QACD,MAAM,EAAE,CAAC,kBAAM,CAAC,IAAI,CAAC;KACtB;CACF,CAAA;AAEM,IAAM,KAAK,GAAG,cAAM,OAAA,oBAAC,qBAAS,IAAC,QAAQ,EAAC,qBAAqB,GAAG,EAA5C,CAA4C,CAAA;AAA1D,QAAA,KAAK,SAAqD;AAEhE,IAAM,SAAS,GAAG,cAAM,OAAA,CAC7B,oBAAC,qBAAS,IACR,MAAM,EAAE;QACN,EAAE,GAAG,EAAE,qBAAqB,EAAE;QAC9B;YACE,GAAG,EACD,2FAA2F;SAC9F;KACF,GACD,CACH,EAV8B,CAU9B,CAAA;AAVY,QAAA,SAAS,aAUrB;AAEM,IAAM,WAAW,GAAG,cAAM,OAAA,CAC/B,oBAAC,qBAAS,IACR,MAAM,EAAE;QACN,EAAE,GAAG,EAAE,qBAAqB,EAAE;QAC9B;YACE,GAAG,EACD,2FAA2F;SAC9F;QACD;YACE,GAAG,EACD,wFAAwF;SAC3F;KACF,GACD,CACH,EAdgC,CAchC,CAAA;AAdY,QAAA,WAAW,eAcvB;AAEM,IAAM,UAAU,GAAG,cAAM,OAAA,CAC9B,oBAAC,qBAAS,IACR,MAAM,EAAE;QACN,EAAE,GAAG,EAAE,qBAAqB,EAAE;QAC9B;YACE,GAAG,EACD,2FAA2F;YAC7F,SAAS,EACP,0FAA0F;YAC5F,YAAY,EACV,0FAA0F;YAC5F,WAAW,EAAE,8BAA8B;SAC5C;QACD;YACE,GAAG,EACD,wFAAwF;SAC3F;QACD;YACE,GAAG,EACD,0FAA0F;SAC7F;KACF,EACD,eAAe,EAAC,iBAAiB,EACjC,eAAe,EAAC,QAAQ,EACxB,qBAAqB,EAAC,iCAAiC,GACvD,CACH,EA1B+B,CA0B/B,CAAA;AA1BY,QAAA,UAAU,cA0BtB;AAEM,IAAM,QAAQ,GAAG,cAAM,OAAA,oBAAC,qBAAS,IAAC,IAAI,EAAC,WAAW,EAAC,QAAQ,EAAC,qBAAqB,GAAG,EAA7D,CAA6D,CAAA;AAA9E,QAAA,QAAQ,YAAsE;AAEpF,IAAM,WAAW,GAAG,cAAM,OAAA,oBAAC,qBAAS,OAAG,EAAb,CAAa,CAAA;AAAjC,QAAA,WAAW,eAAsB;AAEvC,IAAM,uBAAuB,GAAG,cAAM,OAAA,CAC3C,gCAAQ,SAAS,EAAC,oBAAoB;IACpC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,QAAQ,EAAE;YACR,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE;SACpF,GACD,CACK,CACV,EAV4C,CAU5C,CAAA;AAVY,QAAA,uBAAuB,2BAUnC;AAEM,IAAM,oBAAoB,GAAG,cAAM,OAAA,CACxC,oBAAC,qBAAS,IAAC,QAAQ,EAAC,qBAAqB,EAAC,WAAW,EAAC,0BAA0B,GAAG,CACpF,EAFyC,CAEzC,CAAA;AAFY,QAAA,oBAAoB,wBAEhC;AAEM,IAAM,mBAAmB,GAAG,cAAM,OAAA,CACvC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EACzB,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE,CAAC,GAC/F,CACH,EAPwC,CAOxC,CAAA;AAPY,QAAA,mBAAmB,uBAO/B;AACM,IAAM,gBAAgB,GAAG,cAAM,OAAA,CACpC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAC7C,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE,CAAC,GAC/F,CACH,EAPqC,CAOrC,CAAA;AAPY,QAAA,gBAAgB,oBAO5B;AAEM,IAAM,oBAAoB,GAAG,cAAM,OAAA,CACxC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,IAAI,EAAE;QACJ,EAAE,IAAI,EAAE,sBAAsB,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,qBAAc,CAAC,KAAK,EAAE;QACnF,EAAE,IAAI,EAAE,8BAA8B,EAAE;KACzC,EACD,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE,CAAC,GAC/F,CACH,EAVyC,CAUzC,CAAA;AAVY,QAAA,oBAAoB,wBAUhC;AAEM,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,IAAI,EAAE;QACJ,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;QACnB,EAAE,IAAI,EAAE,SAAS,EAAE;KACpB,EACD,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE,CAAC,GAC/F,CACH,EAhBiC,CAgBjC,CAAA;AAhBY,QAAA,YAAY,gBAgBxB;AAEM,IAAM,qBAAqB,GAAG,cAAM,OAAA,CACzC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EACzB,QAAQ,EAAE;QACR;YACE,MAAM,EAAE,6CAAqB,CAAC,IAAI;YAClC,OAAO,EAAE,yBAAyB;YAClC,UAAU,EAAE,iCAAiC;SAC9C;QACD,EAAE,MAAM,EAAE,6CAAqB,CAAC,MAAM,EAAE,OAAO,EAAE,IAAA,cAAC,EAAC,6BAA6B,CAAC,EAAE;QACnF;YACE,MAAM,EAAE,6CAAqB,CAAC,WAAW;YACzC,OAAO,EAAE,uCAAuC;YAChD,QAAQ,EAAE,IAAI;SACf;KACF,GACD,CACH,EAnB0C,CAmB1C,CAAA;AAnBY,QAAA,qBAAqB,yBAmBjC;AAEM,IAAM,kBAAkB,GAAG,cAAM,OAAA,CACtC,oBAAC,qBAAS,IACR,IAAI,EAAC,WAAW,EAChB,QAAQ,EAAC,qBAAqB,EAC9B,QAAQ,EAAE;QACR;YACE,MAAM,EAAE,6CAAqB,CAAC,OAAO;YACrC,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,OAAO;SAClB;KACF,GACD,CACH,EAZuC,CAYvC,CAAA;AAZY,QAAA,kBAAkB,sBAY9B"}

package/dist/src/blocks/InfoCard.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import "./InfoCard.scss";
+export interface InfoCardProps {
+    title: string;
+    subtitle?: string;
+    externalHref?: string;
+    className?: string;
+    children: React.ReactNode;
+}
+declare const InfoCard: (props: InfoCardProps) => JSX.Element;
+export { InfoCard as default, InfoCard };

package/dist/src/blocks/InfoCard.js

@@ -0,0 +1,48 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InfoCard = exports.default = void 0;
+var React = __importStar(require("react"));
+require("./InfoCard.scss");
+var markdown_to_jsx_1 = __importDefault(require("markdown-to-jsx"));
+var InfoCard = function (props) {
+    var wrapperClasses = ["info-card"];
+    if (props.className) {
+        wrapperClasses.push(props.className);
+    }
+    return (React.createElement("div", { className: wrapperClasses.join(" ") },
+        React.createElement("div", { className: "info-card__header" },
+            props.externalHref ? (React.createElement("h3", { className: "info-card__title" },
+                React.createElement("a", { href: props.externalHref, target: "_blank" }, props.title))) : (React.createElement("h3", { className: "info-card__title" }, props.title)),
+            props.subtitle && React.createElement("span", { className: "text-sm text-gray-700" }, props.subtitle)),
+        typeof props.children == "string" ? (React.createElement("div", { className: "markdown" },
+            React.createElement(markdown_to_jsx_1.default, { options: { disableParsingRawHTML: true }, children: props.children }))) : (props.children)));
+};
+exports.default = InfoCard;
+exports.InfoCard = InfoCard;
+//# sourceMappingURL=InfoCard.js.map

package/dist/src/blocks/InfoCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoCard.js","sourceRoot":"","sources":["../../../src/blocks/InfoCard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,2BAAwB;AACxB,oEAAsC;AAUtC,IAAM,QAAQ,GAAG,UAAC,KAAoB;IACpC,IAAM,cAAc,GAAG,CAAC,WAAW,CAAC,CAAA;IACpC,IAAI,KAAK,CAAC,SAAS,EAAE;QACnB,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;KACrC;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,CAAC;QACtC,6BAAK,SAAS,EAAE,mBAAmB;YAChC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CACpB,4BAAI,SAAS,EAAC,kBAAkB;gBAC9B,2BAAG,IAAI,EAAE,KAAK,CAAC,YAAY,EAAE,MAAM,EAAC,QAAQ,IACzC,KAAK,CAAC,KAAK,CACV,CACD,CACN,CAAC,CAAC,CAAC,CACF,4BAAI,SAAS,EAAC,kBAAkB,IAAE,KAAK,CAAC,KAAK,CAAM,CACpD;YACA,KAAK,CAAC,QAAQ,IAAI,8BAAM,SAAS,EAAE,uBAAuB,IAAG,KAAK,CAAC,QAAQ,CAAQ,CAChF;QACL,OAAO,KAAK,CAAC,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,CACnC,6BAAK,SAAS,EAAC,UAAU;YACvB,oBAAC,yBAAQ,IAAC,OAAO,EAAE,EAAE,qBAAqB,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAAI,CAC5E,CACP,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,QAAQ,CACf,CACG,CACP,CAAA;AACH,CAAC,CAAA;AAEoB,2BAAO;AAAE,4BAAQ"}

package/dist/src/blocks/InfoCard.stories.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="mdx" />
+import { BADGES } from "../../.storybook/constants";
+import InfoCardDocumentation from "./InfoCard.docs.mdx";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+    id: string;
+    parameters: {
+        docs: {
+            page: typeof InfoCardDocumentation;
+        };
+        badges: BADGES[];
+    };
+};
+export default _default;
+export declare const Default: () => JSX.Element;
+export declare const WithMarkdown: () => JSX.Element;
+export declare const WithChildComponent: () => JSX.Element;

package/dist/src/blocks/InfoCard.stories.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WithChildComponent = exports.WithMarkdown = exports.Default = void 0;
+var react_1 = __importDefault(require("react"));
+var constants_1 = require("../../.storybook/constants");
+var InfoCard_1 = require("../blocks/InfoCard");
+var ExpandableText_1 = require("../actions/ExpandableText");
+var InfoCard_docs_mdx_1 = __importDefault(require("./InfoCard.docs.mdx"));
+exports.default = {
+    title: "blocks/Info Card  🚩",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+    id: "blocks/info-card",
+    parameters: {
+        docs: {
+            page: InfoCard_docs_mdx_1.default,
+        },
+        badges: [constants_1.BADGES.GEN2],
+    },
+};
+var Default = function () { return (react_1.default.createElement(react_1.default.Fragment, null,
+    react_1.default.createElement(InfoCard_1.InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" }, "\nParagraph content\n\n----\n\nMore content\n      "))); };
+exports.Default = Default;
+var WithMarkdown = function () { return (react_1.default.createElement(InfoCard_1.InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" }, "\n#### Header 4\n\n* A list\n* of items\n      ")); };
+exports.WithMarkdown = WithMarkdown;
+var WithChildComponent = function () { return (react_1.default.createElement(InfoCard_1.InfoCard, { title: "My Card", externalHref: "http://google.com", className: "is-normal-primary-lighter" },
+    react_1.default.createElement(ExpandableText_1.ExpandableText, { strings: { readMore: "More", readLess: "Less" } }, "\nText within _another_ component\u2026\n      "))); };
+exports.WithChildComponent = WithChildComponent;
+//# sourceMappingURL=InfoCard.stories.js.map

package/dist/src/blocks/InfoCard.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoCard.stories.js","sourceRoot":"","sources":["../../../src/blocks/InfoCard.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,wDAAmD;AACnD,+CAA6C;AAC7C,4DAA0D;AAC1D,0EAAuD;AAEvD,kBAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,uCAAK,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,2BAAqB;SAC5B;QACD,MAAM,EAAE,CAAC,kBAAM,CAAC,IAAI,CAAC;KACtB;CACF,CAAA;AAEM,IAAM,OAAO,GAAG,cAAM,OAAA,CAC3B;IACE,8BAAC,mBAAQ,IACP,KAAK,EAAC,SAAS,EACf,YAAY,EAAC,mBAAmB,EAChC,SAAS,EAAC,2BAA2B,IAEpC,qDAMA,CACQ,CACV,CACJ,EAhB4B,CAgB5B,CAAA;AAhBY,QAAA,OAAO,WAgBnB;AAEM,IAAM,YAAY,GAAG,cAAM,OAAA,CAChC,8BAAC,mBAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B,IAC7F,iDAKE,CACM,CACZ,EATiC,CASjC,CAAA;AATY,QAAA,YAAY,gBASxB;AAEM,IAAM,kBAAkB,GAAG,cAAM,OAAA,CACtC,8BAAC,mBAAQ,IAAC,KAAK,EAAC,SAAS,EAAC,YAAY,EAAC,mBAAmB,EAAC,SAAS,EAAC,2BAA2B;IAC9F,8BAAC,+BAAc,IAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,IAC5D,iDAEA,CACc,CACR,CACZ,EARuC,CAQvC,CAAA;AARY,QAAA,kBAAkB,sBAQ9B"}

package/dist/src/blocks/MediaCard.d.ts

@@ -0,0 +1,11 @@
+import "./MediaCard.scss";
+import { UniversalIconType } from "../icons/Icon";
+export interface MediaCardProps {
+    title: string;
+    subtitle?: string;
+    className?: string;
+    icon?: UniversalIconType;
+    handleClick: () => void;
+}
+declare const MediaCard: (props: MediaCardProps) => JSX.Element;
+export { MediaCard as default, MediaCard };