@trackunit/react-components 0.1.124 → 0.1.127

package/index.js

@@ -1,11 +1,12 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { useRef, useCallback, useEffect, useState, useLayoutEffect, useMemo, createContext, forwardRef, useContext, isValidElement, cloneElement, Children, useReducer, memo, Component } from 'react';
+import React__default, { useRef, useCallback, useEffect, useState, useLayoutEffect, useMemo, createContext, forwardRef, useContext, isValidElement, cloneElement, memo, Children, useReducer, Component } from 'react';
 import { tw, tws } from '@trackunit/tailwind-styled-components';
 import { cvaMerge } from '@trackunit/css-class-variance-utilities';
 import { HeroIconsArray, heroIconLookup, TrackunitSolidIconsArray, TrackunitOutlineIconsArray, trackunitIconLookup } from '@trackunit/ui-icons';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { createPortal } from 'react-dom';
+import { UNSAFE_NavigationContext } from 'react-router-dom';
 import { color } from '@trackunit/ui-design-tokens';
 
 const docs = {
@@ -59,6 +60,16 @@ function __rest$1(s, e) {
                 t[p[i]] = s[p[i]];
         }
     return t;
+}
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
 }
 
 const cvaSpinner = cvaMerge([
@@ -13131,7 +13142,7 @@ function getPreviousMonth(startingMonth, options) {
  * The Navigation context shares details and methods to navigate the months in DayPicker.
  * Access this context from the {@link useNavigation} hook.
  */
-var NavigationContext$1 = createContext(undefined);
+var NavigationContext = createContext(undefined);
 /** Provides the values for the {@link NavigationContext}. */
 function NavigationProvider(props) {
     var dayPicker = useDayPicker();
@@ -13164,7 +13175,7 @@ function NavigationProvider(props) {
         nextMonth: nextMonth,
         isDateDisplayed: isDateDisplayed
     };
-    return (React__default.createElement(NavigationContext$1.Provider, { value: value }, props.children));
+    return (React__default.createElement(NavigationContext.Provider, { value: value }, props.children));
 }
 /**
  * Hook to access the {@link NavigationContextValue}. Use this hook to navigate
@@ -13173,7 +13184,7 @@ function NavigationProvider(props) {
  * This hook is meant to be used inside internal or custom components.
  */
 function useNavigation() {
-    var context = useContext(NavigationContext$1);
+    var context = useContext(NavigationContext);
     if (!context) {
         throw new Error('useNavigation must be used within a NavigationProvider');
     }
@@ -18793,6 +18804,93 @@ const Drawer = ({ open, onClose = () => { }, children, disableOverlay = false, p
         jsx(Fragment, {})) }));
 };
 
+const cvaSkeletonLine = cvaMerge([
+    "rounded-md",
+    "h-3",
+    "opacity-20",
+    "animate-pulse",
+    "bg-black/50",
+    "bg-auto",
+    "bg-gradient-to-r",
+    "from-black/0",
+    "via-black/50",
+    "to-black/20",
+]);
+
+/**
+ * Display placeholder lines before the data gets loaded to reduce load-time frustration.
+ */
+const SkeletonLines = memo(({ margin = "10px 0", lines = 1, height, width = "100%", className, dataTestId }) => {
+    const skeletonLines = [];
+    const getWidth = (index) => {
+        if (width instanceof Array) {
+            return width[index] || "100%";
+        }
+        return width;
+    };
+    const getHeight = (index) => {
+        if (height instanceof Array) {
+            return height[index] || "auto";
+        }
+        return height;
+    };
+    for (let i = 0; i < lines; i++) {
+        skeletonLines.push(jsx("div", { "data-testid": dataTestId !== null && dataTestId !== void 0 ? dataTestId : "skeleton-lines", "data-type": "loading-skeleton-line", className: cvaSkeletonLine({ className }), style: { height: getHeight(i), width: getWidth(i), margin: lines > 1 ? margin : "" }, children: lines > 1 && jsx(Fragment, { children: "\u00A0" }) }, i));
+    }
+    // eslint-disable-next-line react/jsx-no-useless-fragment
+    return jsx(Fragment, { children: skeletonLines });
+});
+
+const containerStyles = cvaMerge(["flex flex-col items-center gap-5 p-12 text-center justify-center h-full"]);
+const textStyles = cvaMerge(["flex flex-col items-center gap-2"]);
+
+var WorkerWithSign = "8df3d27593b5fba4.svg";
+
+/**
+ * Component representing an empty state.
+ * Use this component when there is no data to display or when an error occurs.
+ *
+ *
+ * @param {EmptyStateProps} props props
+ * @returns {JSX.Element} component
+ * @example
+ * <EmptyState
+ *  title="No results found"
+ * description="Try changing your search criteria"
+ * altText="No results found"
+ * image="BUILDING_ERROR"
+ * />
+ */
+const EmptyState = ({ title, description, altText, image, customImageSrc, action, loading, dataTestId, className, }) => {
+    const [imageSource, setImageSource] = useState(WorkerWithSign);
+    useEffect(() => {
+        const lazyLoadImage = () => __awaiter(void 0, void 0, void 0, function* () {
+            let importedImage = null;
+            switch (image) {
+                case "WORKER_WITH_SIGN":
+                    importedImage = WorkerWithSign;
+                    break;
+                case "ROAD_BLOCK":
+                    importedImage = (yield import('./road_block.js')).default;
+                    break;
+                case "BUILDING_ERROR":
+                    importedImage = (yield import('./building_error.js')).default;
+                    break;
+                case "WALL_CONSTRUCTION":
+                    importedImage = (yield import('./wall_construction.js')).default;
+                    break;
+                default:
+                    importedImage = WorkerWithSign;
+            }
+            setImageSource(importedImage);
+        });
+        if (!customImageSrc && image) {
+            lazyLoadImage();
+        }
+    }, [customImageSrc, image]);
+    return (jsx("div", { className: `${containerStyles()} ${className}`, "data-testid": dataTestId !== null && dataTestId !== void 0 ? dataTestId : "empty-state", children: loading ? (jsxs(Fragment, { children: [jsx(Spinner, { dataTestId: "spinner", size: "large", centering: "centered" }), jsx(SkeletonLines, { dataTestId: "skeleton-lines", width: 50 })] })) : (jsxs(Fragment, { children: [jsx("img", { src: customImageSrc ? customImageSrc : imageSource, alt: altText }), jsxs("div", { className: textStyles(), children: [jsx(Heading, { variant: "secondary", children: title }), jsx(Text, { align: "center", children: description })] }), action] })) }));
+};
+
 /**
  *  The external link component is used to link to an external page outside the Trackunit Manager.
  *
@@ -37062,43 +37160,6 @@ const PageHeader = ({ className, dataTestId, action, showLoading, description, l
     return (jsxs("div", { className: cvaPageHeader({ className: `${className} tu-page-header` }), "data-testid": dataTestId, children: [jsxs("div", { className: cvaPageHeaderHeadingAccessoriesContainer(), "data-testid": dataTestId && `${dataTestId}-heading-container`, children: [jsxs("div", { className: cvaPageHeaderHeadingContainer(), children: [backTo && (jsx(IconButton, { to: backTo, color: "tertiary", variant: "transparent", size: "small", icon: jsx(Icon, { name: "ArrowLeftIcon" }) })), jsx("h1", { className: cvaPageHeaderHeading(), "data-testid": dataTestId && `${dataTestId}-heading`, children: title }), description && !showLoading && (jsx(Tip, { dataTestId: dataTestId && `${dataTestId}-tip`, iconProps: { name: "QuestionMarkCircleIcon" }, link: link, children: description }))] }), tag && !showLoading && jsx(Tag, { dataTestId: dataTestId, children: tag }), showLoading && jsx(Spinner, { dataTestId: dataTestId && `${dataTestId}-spinner`, centering: "vertically" }), action] }), jsx("div", { className: cvaPageHeaderChildContainer(), children: children })] }));
 };
 
-const cvaSkeletonLine = cvaMerge([
-    "rounded-md",
-    "h-3",
-    "opacity-20",
-    "animate-pulse",
-    "bg-black/50",
-    "bg-auto",
-    "bg-gradient-to-r",
-    "from-black/0",
-    "via-black/50",
-    "to-black/20",
-]);
-
-/**
- * Display placeholder lines before the data gets loaded to reduce load-time frustration.
- */
-const SkeletonLines = memo(({ margin = "10px 0", lines = 1, height, width = "100%", className, dataTestId }) => {
-    const skeletonLines = [];
-    const getWidth = (index) => {
-        if (width instanceof Array) {
-            return width[index] || "100%";
-        }
-        return width;
-    };
-    const getHeight = (index) => {
-        if (height instanceof Array) {
-            return height[index] || "auto";
-        }
-        return height;
-    };
-    for (let i = 0; i < lines; i++) {
-        skeletonLines.push(jsx("div", { "data-testid": dataTestId !== null && dataTestId !== void 0 ? dataTestId : "skeleton-lines", "data-type": "loading-skeleton-line", className: cvaSkeletonLine({ className }), style: { height: getHeight(i), width: getWidth(i), margin: lines > 1 ? margin : "" }, children: lines > 1 && jsx(Fragment, { children: "\u00A0" }) }, i));
-    }
-    // eslint-disable-next-line react/jsx-no-useless-fragment
-    return jsx(Fragment, { children: skeletonLines });
-});
-
 const cvaPagination = cvaMerge(["flex", "items-center", "gap-1"]);
 const cvaPaginationText = cvaMerge("whitespace-nowrap");
 
@@ -37150,96 +37211,8 @@ const Pagination = ({ previousPage, nextPage, canPreviousPage, canNextPage, page
                     : page !== undefined && pageCount !== undefined && pageCount !== null && page >= pageCount - 1, "data-testid": "next-page", icon: jsx(Icon, { name: "ChevronRightIcon", size: "small" }), size: "small", color: "secondary", variant: "transparent" })] }));
 };
 
-/**
- * React Router v6.11.2
- *
- * Copyright (c) Remix Software Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.md file in the root directory of this source tree.
- *
- * @license MIT
- */
-
-const DataRouterContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  DataRouterContext.displayName = "DataRouter";
-}
-
-const DataRouterStateContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  DataRouterStateContext.displayName = "DataRouterState";
-}
-
-const AwaitContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  AwaitContext.displayName = "Await";
-}
-
-const NavigationContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  NavigationContext.displayName = "Navigation";
-}
-
-const LocationContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  LocationContext.displayName = "Location";
-}
-
-const RouteContext = /*#__PURE__*/React.createContext({
-  outlet: null,
-  matches: [],
-  isDataRoute: false
-});
-
-if (process.env.NODE_ENV !== "production") {
-  RouteContext.displayName = "Route";
-}
-
-const RouteErrorContext = /*#__PURE__*/React.createContext(null);
-
-if (process.env.NODE_ENV !== "production") {
-  RouteErrorContext.displayName = "RouteError";
-}
-var DataRouterHook;
-
-(function (DataRouterHook) {
-  DataRouterHook["UseBlocker"] = "useBlocker";
-  DataRouterHook["UseRevalidator"] = "useRevalidator";
-  DataRouterHook["UseNavigateStable"] = "useNavigate";
-})(DataRouterHook || (DataRouterHook = {}));
-
-var DataRouterStateHook;
-
-(function (DataRouterStateHook) {
-  DataRouterStateHook["UseBlocker"] = "useBlocker";
-  DataRouterStateHook["UseLoaderData"] = "useLoaderData";
-  DataRouterStateHook["UseActionData"] = "useActionData";
-  DataRouterStateHook["UseRouteError"] = "useRouteError";
-  DataRouterStateHook["UseNavigation"] = "useNavigation";
-  DataRouterStateHook["UseRouteLoaderData"] = "useRouteLoaderData";
-  DataRouterStateHook["UseMatches"] = "useMatches";
-  DataRouterStateHook["UseRevalidator"] = "useRevalidator";
-  DataRouterStateHook["UseNavigateStable"] = "useNavigate";
-  DataRouterStateHook["UseRouteId"] = "useRouteId";
-})(DataRouterStateHook || (DataRouterStateHook = {}));
-var AwaitRenderStatus;
-
-(function (AwaitRenderStatus) {
-  AwaitRenderStatus[AwaitRenderStatus["pending"] = 0] = "pending";
-  AwaitRenderStatus[AwaitRenderStatus["success"] = 1] = "success";
-  AwaitRenderStatus[AwaitRenderStatus["error"] = 2] = "error";
-})(AwaitRenderStatus || (AwaitRenderStatus = {}));
-
-new Promise(() => {});
-
 function useConfirmExit(confirmExit, when = true) {
-    const { navigator } = useContext(NavigationContext);
+    const { navigator } = useContext(UNSAFE_NavigationContext);
     useEffect(() => {
         if (!when) {
             return;
@@ -39164,4 +39137,4 @@ const ContentGridArea = tw.article `
   tu-layout-area-content
 `;
 
-export { Alert, Badge, Button$1 as Button, Card, CardBody, CardFooter, CardHeader, Collapse, ContentGridArea, CopyableText, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, Drawer, ExternalLink, FilterListMapLayout, FullWidthRepeatingLayout, GridArea, Heading, Icon, IconButton, Indicator, IntrinsicallyResponsiveGrid, MenuItem, MenuList, MinTopFullContentLayout, Modal, ModalBackdrop, MoreMenu, NavGridArea, PageHeader, Pagination, Popover, PopoverContent, PopoverTitle, PopoverTrigger, Prompt, ROLE_CARD, SectionHeader, Sidebar, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, Timeline, TimelineElement, Tip, TitleGridArea, TitleNavContentLayout, Tooltip, ValueBar, cvaButton, cvaButtonSpinner, cvaClickable, cvaIconButtonContainer, cvaIndicator, cvaIndicatorIcon, cvaIndicatorIconBackground, cvaIndicatorLabel, cvaIndicatorPing, cvaMenuItem, cvaMenuItemLabel, cvaMenuItemPrefix, cvaMenuItemSuffix, docs, getDevicePixelRatio, getValueBarColorByValue, useClickOutside, useContainerProps, useDebounce, useDevicePixelRatio, useHover, useIsFirstRender, useLocalStorage, useLocalStorageReducer, useModal, usePopoverContext, usePrompt, useResize, useTimeout };
+export { Alert, Badge, Button$1 as Button, Card, CardBody, CardFooter, CardHeader, Collapse, ContentGridArea, CopyableText, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, Drawer, EmptyState, ExternalLink, FilterListMapLayout, FullWidthRepeatingLayout, GridArea, Heading, Icon, IconButton, Indicator, IntrinsicallyResponsiveGrid, MenuItem, MenuList, MinTopFullContentLayout, Modal, ModalBackdrop, MoreMenu, NavGridArea, PageHeader, Pagination, Popover, PopoverContent, PopoverTitle, PopoverTrigger, Prompt, ROLE_CARD, SectionHeader, Sidebar, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, Timeline, TimelineElement, Tip, TitleGridArea, TitleNavContentLayout, Tooltip, ValueBar, cvaButton, cvaButtonSpinner, cvaClickable, cvaIconButtonContainer, cvaIndicator, cvaIndicatorIcon, cvaIndicatorIconBackground, cvaIndicatorLabel, cvaIndicatorPing, cvaMenuItem, cvaMenuItemLabel, cvaMenuItemPrefix, cvaMenuItemSuffix, docs, getDevicePixelRatio, getValueBarColorByValue, useClickOutside, useContainerProps, useDebounce, useDevicePixelRatio, useHover, useIsFirstRender, useLocalStorage, useLocalStorageReducer, useModal, usePopoverContext, usePrompt, useResize, useTimeout };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.1.124",
+  "version": "0.1.127",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -8,11 +8,11 @@
   },
   "dependencies": {
     "@floating-ui/react": "0.22.2",
-    "@trackunit/css-class-variance-utilities": "0.0.6",
-    "@trackunit/css-core": "0.0.88",
+    "@trackunit/css-class-variance-utilities": "0.0.7",
+    "@trackunit/css-core": "0.0.89",
     "@trackunit/tailwind-styled-components": "0.0.58",
-    "@trackunit/ui-design-tokens": "0.0.72",
-    "@trackunit/ui-icons": "0.0.69",
+    "@trackunit/ui-design-tokens": "0.0.73",
+    "@trackunit/ui-icons": "0.0.70",
     "date-fns": "2.29.3",
     "lodash": "4.17.21",
     "react": "18.2.0",

package/road_block.cjs

@@ -0,0 +1,244 @@
+'use strict';
+
+var React = require('react');
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n["default"] = e;
+	return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var _path, _path2, _path3, _path4, _path5, _path6, _path7, _path8, _path9, _path10, _path11, _path12, _path13, _path14, _path15, _path16, _path17, _path18, _path19, _path20, _path21, _path22, _path23, _path24, _path25, _path26, _path27, _path28, _path29, _path30, _path31, _path32, _path33, _path34;
+var _excluded = ["title", "titleId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var SvgRoadBlock = (_ref, ref) => {
+  var {
+      title,
+      titleId
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    width: 200,
+    height: 200,
+    viewBox: "0 0 200 200",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ref: ref,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M100 191.432C144.183 191.432 180 155.615 180 111.432C180 67.2492 144.183 31.432 100 31.432C55.8172 31.432 20 67.2492 20 111.432C20 155.615 55.8172 191.432 100 191.432Z",
+    fill: "#F1F5F9"
+  })), _path2 || (_path2 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M13 144.432H18",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path3 || (_path3 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M182 144.432H187",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path4 || (_path4 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M27.128 144.432C33.4734 158.44 43.7216 170.322 56.6457 178.656C69.5698 186.99 84.622 191.422 100 191.422C115.378 191.422 130.43 186.99 143.354 178.656C156.278 170.322 166.527 158.44 172.872 144.432H27.128Z",
+    fill: "white"
+  })), _path5 || (_path5 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M156.8 167.76L133.648 144.432H62.892L41.506 165.98C48.8464 173.858 57.7025 180.173 67.5431 184.545C77.3838 188.917 88.0061 191.256 98.7729 191.423C109.54 191.589 120.229 189.579 130.2 185.512C140.171 181.446 149.22 175.408 156.8 167.76Z",
+    fill: "#E2E8F0"
+  })), _path6 || (_path6 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M156.798 167.76L133.648 144.432H62.892L41.506 165.98",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path7 || (_path7 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M102.73 153.8L101.8 144.432H94.738L93.81 153.8C93.772 154.183 93.8146 154.57 93.9351 154.935C94.0556 155.301 94.2513 155.637 94.5096 155.922C94.7679 156.207 95.0831 156.435 95.4349 156.591C95.7866 156.747 96.1672 156.828 96.552 156.828H99.988C100.373 156.828 100.753 156.747 101.105 156.591C101.457 156.435 101.772 156.207 102.03 155.922C102.289 155.637 102.484 155.301 102.605 154.935C102.725 154.57 102.768 154.183 102.73 153.8Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path8 || (_path8 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M105.186 178.6L103.958 166.2C103.89 165.52 103.572 164.889 103.065 164.431C102.558 163.972 101.899 163.718 101.216 163.718H95.324C94.6405 163.718 93.9815 163.972 93.4748 164.431C92.9681 164.889 92.6499 165.52 92.582 166.2L91.354 178.6C91.316 178.983 91.3586 179.37 91.4791 179.735C91.5996 180.101 91.7953 180.437 92.0536 180.722C92.3119 181.007 92.6271 181.235 92.9789 181.391C93.3306 181.547 93.7112 181.628 94.096 181.628H102.444C102.829 181.628 103.209 181.547 103.561 181.391C103.913 181.235 104.228 181.007 104.486 180.722C104.745 180.437 104.94 180.101 105.061 179.735C105.181 179.37 105.224 178.983 105.186 178.6Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path9 || (_path9 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M162 59.33H154V144.432H162V59.33Z",
+    fill: "white"
+  })), _path10 || (_path10 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M162 59.33H154V144.432H162V59.33Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path11 || (_path11 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M133.916 61.33C133.258 61.3313 132.611 61.1617 132.038 60.8378C131.466 60.514 130.987 60.047 130.649 59.4825C130.311 58.9181 130.125 58.2755 130.11 57.6177C130.094 56.9599 130.25 56.3095 130.562 55.73L154.644 10.582C154.968 9.97276 155.451 9.46311 156.042 9.10769C156.633 8.75226 157.31 8.56448 158 8.56448C158.69 8.56448 159.367 8.75226 159.958 9.10769C160.549 9.46311 161.032 9.97276 161.356 10.582L185.438 55.738C185.75 56.3175 185.906 56.9679 185.89 57.6257C185.875 58.2835 185.689 58.9261 185.351 59.4905C185.013 60.055 184.534 60.522 183.962 60.8458C183.389 61.1697 182.742 61.3393 182.084 61.338L133.916 61.33Z",
+    fill: "#E2E8F0"
+  })), _path12 || (_path12 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M158.9 43.4C158.848 43.5992 158.732 43.7756 158.569 43.9015C158.406 44.0274 158.206 44.0957 158 44.0957C157.794 44.0957 157.594 44.0274 157.431 43.9015C157.268 43.7756 157.152 43.5992 157.1 43.4C153.464 29.062 153.616 29.708 153.602 29.564C153.544 28.9509 153.614 28.3324 153.808 27.7481C154.003 27.1637 154.317 26.6265 154.731 26.1708C155.146 25.7151 155.651 25.351 156.214 25.1018C156.777 24.8527 157.386 24.724 158.002 24.724C158.618 24.724 159.227 24.8527 159.79 25.1018C160.353 25.351 160.858 25.7151 161.273 26.1708C161.687 26.6265 162.001 27.1637 162.196 27.7481C162.39 28.3324 162.461 28.9509 162.402 29.564C162.386 29.702 162.54 29.052 158.9 43.4Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path13 || (_path13 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M158 55.328C157.323 55.3284 156.661 55.128 156.098 54.7523C155.535 54.3765 155.096 53.8422 154.837 53.2169C154.578 52.5917 154.51 51.9036 154.642 51.2396C154.773 50.5757 155.099 49.9658 155.578 49.487C156.056 49.0082 156.666 48.6821 157.33 48.5499C157.994 48.4177 158.682 48.4854 159.307 48.7443C159.932 49.0032 160.467 49.4419 160.843 50.0046C161.219 50.5674 161.42 51.2291 161.42 51.906C161.419 52.8131 161.059 53.6829 160.418 54.3244C159.777 54.966 158.907 55.3269 158 55.328Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path14 || (_path14 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M133.916 61.33C133.258 61.3313 132.611 61.1617 132.038 60.8378C131.466 60.514 130.987 60.047 130.649 59.4825C130.311 58.9181 130.125 58.2755 130.11 57.6177C130.094 56.9599 130.25 56.3095 130.562 55.73L154.644 10.582C154.968 9.97276 155.451 9.46311 156.042 9.10769C156.633 8.75226 157.31 8.56448 158 8.56448C158.69 8.56448 159.367 8.75226 159.958 9.10769C160.549 9.46311 161.032 9.97276 161.356 10.582L185.438 55.738C185.75 56.3175 185.906 56.9679 185.89 57.6257C185.875 58.2835 185.689 58.9261 185.351 59.4905C185.013 60.055 184.534 60.522 183.962 60.8458C183.389 61.1697 182.742 61.3393 182.084 61.338L133.916 61.33Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path15 || (_path15 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M134.268 110.774H125.27V144.432H134.268V110.774Z",
+    fill: "#E2E8F0"
+  })), _path16 || (_path16 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M140.278 110.774H56.262C55.8692 110.776 55.4797 110.701 55.1161 110.552C54.7525 110.403 54.4218 110.184 54.1431 109.907C53.8643 109.63 53.643 109.301 53.4918 108.938C53.3406 108.576 53.2625 108.187 53.262 107.794V99.412C53.2625 99.0191 53.3406 98.6302 53.4918 98.2676C53.643 97.905 53.8643 97.5758 54.1431 97.2989C54.4218 97.022 54.7525 96.8029 55.1161 96.6541C55.4797 96.5054 55.8692 96.4299 56.262 96.432H140.278C140.671 96.4299 141.06 96.5054 141.424 96.6541C141.788 96.8029 142.118 97.022 142.397 97.2989C142.676 97.5758 142.897 97.905 143.048 98.2676C143.199 98.6302 143.278 99.0191 143.278 99.412V107.8C143.277 108.192 143.198 108.581 143.046 108.943C142.895 109.304 142.673 109.633 142.395 109.909C142.116 110.185 141.786 110.404 141.423 110.552C141.059 110.701 140.67 110.776 140.278 110.774Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path17 || (_path17 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M71.268 110.774H62.27V144.432H71.268V110.774Z",
+    fill: "#E2E8F0"
+  })), _path18 || (_path18 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M71.268 110.774H62.27V144.432H71.268V110.774Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path19 || (_path19 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M134.268 110.774H125.27V144.432H134.268V110.774Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path20 || (_path20 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M125.27 125.116H71.268V134.078H125.27V125.116Z",
+    fill: "white",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path21 || (_path21 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M73.068 88.122H62.27V96.432H73.068V88.122Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path22 || (_path22 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M67.67 110.774H58.668L65.87 96.432H74.872L67.67 110.774Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path23 || (_path23 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M89.268 110.774H80.27L87.468 96.432H96.47L89.268 110.774Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path24 || (_path24 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M110.87 110.774H101.868L109.07 96.432H118.068L110.87 110.774Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path25 || (_path25 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M132.468 110.774H123.47L130.67 96.432H139.67L132.468 110.774Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path26 || (_path26 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M82.07 134.078H74.872L80.27 125.116H87.468L82.07 134.078Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path27 || (_path27 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M98.27 134.078H91.068L96.47 125.116H103.668L98.27 134.078Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path28 || (_path28 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M114.47 134.078H107.27L112.67 125.116H119.868L114.47 134.078Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path29 || (_path29 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M134.268 88.122H123.47V96.432H134.268V88.122Z",
+    fill: "#E2E8F0",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path30 || (_path30 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M137.87 81.508C137.878 83.2896 137.356 85.0334 136.372 86.5184C135.387 88.0035 133.984 89.1629 132.341 89.85C130.697 90.537 128.886 90.7206 127.138 90.3777C125.389 90.0347 123.782 89.1806 122.52 87.9234C121.257 86.6663 120.396 85.0627 120.046 83.3158C119.695 81.569 119.871 79.7574 120.552 78.1107C121.232 76.4639 122.385 75.0561 123.866 74.0655C125.347 73.0748 127.088 72.546 128.87 72.546C131.252 72.5423 133.537 73.4841 135.225 75.1645C136.912 76.8449 137.864 79.1265 137.87 81.508Z",
+    fill: "white"
+  })), _path31 || (_path31 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M137.87 81.508C137.878 83.2896 137.356 85.0334 136.372 86.5184C135.387 88.0035 133.984 89.1629 132.341 89.85C130.697 90.537 128.886 90.7206 127.138 90.3777C125.389 90.0347 123.782 89.1806 122.52 87.9234C121.257 86.6663 120.396 85.0627 120.046 83.3158C119.695 81.569 119.871 79.7574 120.552 78.1107C121.232 76.4639 122.385 75.0561 123.866 74.0655C125.347 73.0748 127.088 72.546 128.87 72.546C131.252 72.5423 133.537 73.4841 135.225 75.1645C136.912 76.8449 137.864 79.1265 137.87 81.508Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path32 || (_path32 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M76.67 81.508C76.6775 83.2896 76.1561 85.0334 75.1718 86.5184C74.1874 88.0035 72.7845 89.1629 71.1406 89.85C69.4967 90.537 67.686 90.7206 65.9376 90.3777C64.1893 90.0347 62.5821 89.1805 61.3196 87.9234C60.0571 86.6663 59.1962 85.0627 58.8458 83.3158C58.4955 81.569 58.6715 79.7574 59.3515 78.1107C60.0316 76.4639 61.1851 75.0561 62.666 74.0654C64.1468 73.0748 65.8884 72.546 67.67 72.546C70.0517 72.5417 72.3376 73.4834 74.0253 75.1639C75.7129 76.8444 76.6642 79.1263 76.67 81.508Z",
+    fill: "white"
+  })), _path33 || (_path33 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M76.67 81.508C76.6775 83.2896 76.1561 85.0334 75.1718 86.5184C74.1874 88.0035 72.7845 89.1629 71.1406 89.85C69.4967 90.537 67.686 90.7206 65.9376 90.3777C64.1893 90.0347 62.5821 89.1805 61.3196 87.9234C60.0571 86.6663 59.1962 85.0627 58.8458 83.3158C58.4955 81.569 58.6715 79.7574 59.3515 78.1107C60.0316 76.4639 61.1851 75.0561 62.666 74.0654C64.1468 73.0748 65.8884 72.546 67.67 72.546C70.0517 72.5417 72.3376 73.4834 74.0253 75.1639C75.7129 76.8444 76.6642 79.1263 76.67 81.508Z",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })), _path34 || (_path34 = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M22 144.432H178",
+    stroke: "#334155",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  })));
+};
+var ForwardRef = /*#__PURE__*/React.forwardRef(SvgRoadBlock);
+var road_block = "051071830dacb5a2.svg";
+
+exports.ReactComponent = ForwardRef;
+exports["default"] = road_block;