@itwin/reports-config-widget-react 0.0.1

package/lib/esm/widget/components/Reports.js

@@ -0,0 +1,117 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+import { SvgAdd, SvgDelete, SvgEdit, SvgMore, } from "@itwin/itwinui-icons-react";
+import { Button, DropdownMenu, IconButton, MenuItem, Surface, } from "@itwin/itwinui-react";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { EmptyMessage, generateUrl, handleError, LoadingOverlay, WidgetHeader, } from "./utils";
+import "./Reports.scss";
+import DeleteModal from "./DeleteModal";
+import { REPORTING_BASE_PATH, ReportingClient } from "@itwin/insights-client";
+import ReportAction from "./ReportAction";
+import { ReportMappings } from "./ReportMappings";
+import { HorizontalTile } from "./HorizontalTile";
+import { SearchBar } from "./SearchBar";
+import { useReportsApiConfig } from "../context/ReportsApiConfigContext";
+import { ReportsConfigWidget } from "../../ReportsConfigWidget";
+import { useActiveIModelConnection } from "@itwin/appui-react";
+var ReportsView;
+(function (ReportsView) {
+    ReportsView["REPORTS"] = "reports";
+    ReportsView["REPORTSMAPPING"] = "reportsmapping";
+    ReportsView["ADDING"] = "adding";
+    ReportsView["MODIFYING"] = "modifying";
+})(ReportsView || (ReportsView = {}));
+const fetchReports = async (setReports, iTwinId, setIsLoading, apiContext) => {
+    try {
+        if (!iTwinId)
+            return;
+        setIsLoading(true);
+        const reportingClientApi = new ReportingClient(generateUrl(REPORTING_BASE_PATH, apiContext.baseUrl));
+        const accessToken = await apiContext.getAccessToken();
+        const reports = await reportingClientApi.getReports(accessToken, iTwinId);
+        setReports(reports !== null && reports !== void 0 ? reports : []);
+    }
+    catch (error) {
+        handleError(error.status);
+    }
+    finally {
+        setIsLoading(false);
+    }
+};
+export const Reports = () => {
+    var _a, _b, _c;
+    const iTwinId = (_b = (_a = useActiveIModelConnection()) === null || _a === void 0 ? void 0 : _a.iTwinId) !== null && _b !== void 0 ? _b : "";
+    const apiConfig = useReportsApiConfig();
+    const [showDeleteModal, setShowDeleteModal] = useState(false);
+    const [reportsView, setReportsView] = useState(ReportsView.REPORTS);
+    const [selectedReport, setSelectedReport] = useState(undefined);
+    const [isLoading, setIsLoading] = useState(true);
+    const [searchValue, setSearchValue] = useState("");
+    const [reports, setReports] = useState([]);
+    useEffect(() => {
+        void fetchReports(setReports, iTwinId, setIsLoading, apiConfig);
+    }, [apiConfig, iTwinId, setIsLoading]);
+    const refresh = useCallback(async () => {
+        setReportsView(ReportsView.REPORTS);
+        setSelectedReport(undefined);
+        await fetchReports(setReports, iTwinId, setIsLoading, apiConfig);
+    }, [apiConfig, iTwinId, setReports]);
+    const addReport = () => {
+        setReportsView(ReportsView.ADDING);
+    };
+    const filteredReports = useMemo(() => reports.filter((x) => [x.displayName, x.description]
+        .join(" ")
+        .toLowerCase()
+        .includes(searchValue.toLowerCase())), [reports, searchValue]);
+    switch (reportsView) {
+        case ReportsView.ADDING:
+            return iTwinId ? (React.createElement(ReportAction, { iTwinId: iTwinId !== null && iTwinId !== void 0 ? iTwinId : "", returnFn: refresh })) : null;
+        case ReportsView.MODIFYING:
+            return iTwinId ? (React.createElement(ReportAction, { iTwinId: iTwinId, report: selectedReport, returnFn: refresh })) : null;
+        case ReportsView.REPORTSMAPPING:
+            return selectedReport ? (React.createElement(ReportMappings, { report: selectedReport, goBack: refresh })) : null;
+        default:
+            return (React.createElement(React.Fragment, null,
+                React.createElement(WidgetHeader, { title: ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ITwinReports") }),
+                React.createElement(Surface, { className: "reports-list-container" },
+                    React.createElement("div", { className: "toolbar" },
+                        React.createElement(Button, { startIcon: React.createElement(SvgAdd, null), onClick: () => addReport(), styleType: "high-visibility" }, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:New")),
+                        React.createElement("div", { className: "search-bar-container", "data-testid": "search-bar" },
+                            React.createElement(SearchBar, { searchValue: searchValue, setSearchValue: setSearchValue, disabled: isLoading }))),
+                    isLoading ? (React.createElement(LoadingOverlay, null)) : reports.length === 0 ? (React.createElement(EmptyMessage, null,
+                        React.createElement(React.Fragment, null,
+                            ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:NoReports"),
+                            React.createElement("div", null,
+                                React.createElement(Button, { onClick: () => addReport(), styleType: "cta" }, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:CreateOneReportCTA")))))) : (React.createElement("div", { className: "reports-list" }, filteredReports.map((report) => {
+                        var _a, _b, _c;
+                        return (React.createElement(HorizontalTile, { key: report.id, title: (_a = report.displayName) !== null && _a !== void 0 ? _a : "", subText: (_b = report.description) !== null && _b !== void 0 ? _b : "", subtextToolTip: (_c = report.description) !== null && _c !== void 0 ? _c : "", titleTooltip: report.displayName, onClickTitle: () => {
+                                setSelectedReport(report);
+                                setReportsView(ReportsView.REPORTSMAPPING);
+                            }, button: React.createElement(DropdownMenu, { menuItems: (close) => [
+                                    React.createElement(MenuItem, { key: 0, onClick: () => {
+                                            setSelectedReport(report);
+                                            setReportsView(ReportsView.MODIFYING);
+                                        }, icon: React.createElement(SvgEdit, null) }, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:Modify")),
+                                    React.createElement(MenuItem, { key: 1, onClick: () => {
+                                            setSelectedReport(report);
+                                            setShowDeleteModal(true);
+                                            close();
+                                        }, icon: React.createElement(SvgDelete, null) }, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:Remove")),
+                                ] },
+                                React.createElement(IconButton, { styleType: "borderless" },
+                                    React.createElement(SvgMore, { style: {
+                                            width: "16px",
+                                            height: "16px",
+                                        } }))) }));
+                    })))),
+                React.createElement(DeleteModal, { entityName: (_c = selectedReport === null || selectedReport === void 0 ? void 0 : selectedReport.displayName) !== null && _c !== void 0 ? _c : "", show: showDeleteModal, setShow: setShowDeleteModal, onDelete: async () => {
+                        var _a;
+                        const reportingClientApi = new ReportingClient(generateUrl(REPORTING_BASE_PATH, apiConfig.baseUrl));
+                        const accessToken = await apiConfig.getAccessToken();
+                        await reportingClientApi.deleteReport(accessToken, (_a = selectedReport === null || selectedReport === void 0 ? void 0 : selectedReport.id) !== null && _a !== void 0 ? _a : "");
+                    }, refresh: refresh })));
+    }
+};
+//# sourceMappingURL=Reports.js.map

package/lib/esm/widget/components/Reports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reports.js","sourceRoot":"","sources":["../../../../src/widget/components/Reports.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport {\n  SvgAdd,\n  SvgDelete,\n  SvgEdit,\n  SvgMore,\n} from \"@itwin/itwinui-icons-react\";\nimport {\n  Button,\n  DropdownMenu,\n  IconButton,\n  MenuItem,\n  Surface,\n} from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport type { CreateTypeFromInterface } from \"./utils\";\nimport {\n  EmptyMessage,\n  generateUrl,\n  handleError,\n  LoadingOverlay,\n  WidgetHeader,\n} from \"./utils\";\nimport \"./Reports.scss\";\nimport DeleteModal from \"./DeleteModal\";\nimport type { Report } from \"@itwin/insights-client\";\nimport { REPORTING_BASE_PATH, ReportingClient } from \"@itwin/insights-client\";\nimport ReportAction from \"./ReportAction\";\nimport { ReportMappings } from \"./ReportMappings\";\nimport { HorizontalTile } from \"./HorizontalTile\";\nimport { SearchBar } from \"./SearchBar\";\nimport type { ReportsApiConfig } from \"../context/ReportsApiConfigContext\";\nimport { useReportsApiConfig } from \"../context/ReportsApiConfigContext\";\nimport { ReportsConfigWidget } from \"../../ReportsConfigWidget\";\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\n\nexport type ReportType = CreateTypeFromInterface<Report>;\n\nenum ReportsView {\n  REPORTS = \"reports\",\n  REPORTSMAPPING = \"reportsmapping\",\n  ADDING = \"adding\",\n  MODIFYING = \"modifying\",\n}\n\nconst fetchReports = async (\n  setReports: React.Dispatch<React.SetStateAction<Report[]>>,\n  iTwinId: string | undefined,\n  setIsLoading: React.Dispatch<React.SetStateAction<boolean>>,\n  apiContext: ReportsApiConfig\n) => {\n  try {\n    if (!iTwinId) return;\n    setIsLoading(true);\n    const reportingClientApi = new ReportingClient(\n      generateUrl(REPORTING_BASE_PATH, apiContext.baseUrl)\n    );\n    const accessToken = await apiContext.getAccessToken();\n    const reports = await reportingClientApi.getReports(accessToken, iTwinId);\n    setReports(reports ?? []);\n  } catch (error: any) {\n    handleError(error.status);\n  } finally {\n    setIsLoading(false);\n  }\n};\n\nexport const Reports = () => {\n  const iTwinId = useActiveIModelConnection()?.iTwinId ?? \"\";\n  const apiConfig = useReportsApiConfig();\n  const [showDeleteModal, setShowDeleteModal] = useState<boolean>(false);\n  const [reportsView, setReportsView] = useState<ReportsView>(\n    ReportsView.REPORTS\n  );\n  const [selectedReport, setSelectedReport] = useState<Report | undefined>(\n    undefined\n  );\n  const [isLoading, setIsLoading] = useState<boolean>(true);\n  const [searchValue, setSearchValue] = useState<string>(\"\");\n  const [reports, setReports] = useState<Report[]>([]);\n\n  useEffect(() => {\n    void fetchReports(setReports, iTwinId, setIsLoading, apiConfig);\n  }, [apiConfig, iTwinId, setIsLoading]);\n\n  const refresh = useCallback(async () => {\n    setReportsView(ReportsView.REPORTS);\n    setSelectedReport(undefined);\n    await fetchReports(setReports, iTwinId, setIsLoading, apiConfig);\n  }, [apiConfig, iTwinId, setReports]);\n\n  const addReport = () => {\n    setReportsView(ReportsView.ADDING);\n  };\n\n  const filteredReports = useMemo(\n    () =>\n      reports.filter((x) =>\n        [x.displayName, x.description]\n          .join(\" \")\n          .toLowerCase()\n          .includes(searchValue.toLowerCase())\n      ),\n    [reports, searchValue]\n  );\n\n  switch (reportsView) {\n    case ReportsView.ADDING:\n      return iTwinId ? (\n        <ReportAction iTwinId={iTwinId ?? \"\"} returnFn={refresh} />\n      ) : null;\n    case ReportsView.MODIFYING:\n      return iTwinId ? (\n        <ReportAction\n          iTwinId={iTwinId}\n          report={selectedReport}\n          returnFn={refresh}\n        />\n      ) : null;\n    case ReportsView.REPORTSMAPPING:\n      return selectedReport ? (\n        <ReportMappings report={selectedReport} goBack={refresh} />\n      ) : null;\n    default:\n      return (\n        <>\n          <WidgetHeader\n            title={ReportsConfigWidget.localization.getLocalizedString(\n              \"ReportsConfigWidget:ITwinReports\"\n            )}\n          />\n          <Surface className=\"reports-list-container\">\n            <div className=\"toolbar\">\n              <Button\n                startIcon={<SvgAdd />}\n                onClick={() => addReport()}\n                styleType=\"high-visibility\"\n              >\n                {ReportsConfigWidget.localization.getLocalizedString(\n                  \"ReportsConfigWidget:New\"\n                )}\n              </Button>\n              <div className=\"search-bar-container\" data-testid=\"search-bar\">\n                <SearchBar\n                  searchValue={searchValue}\n                  setSearchValue={setSearchValue}\n                  disabled={isLoading}\n                />\n              </div>\n            </div>\n            {isLoading ? (\n              <LoadingOverlay />\n            ) : reports.length === 0 ? (\n              <EmptyMessage>\n                <>\n                  {ReportsConfigWidget.localization.getLocalizedString(\n                    \"ReportsConfigWidget:NoReports\"\n                  )}\n                  <div>\n                    <Button onClick={() => addReport()} styleType=\"cta\">\n                      {ReportsConfigWidget.localization.getLocalizedString(\n                        \"ReportsConfigWidget:CreateOneReportCTA\"\n                      )}\n                    </Button>\n                  </div>\n                </>\n              </EmptyMessage>\n            ) : (\n              <div className=\"reports-list\">\n                {filteredReports.map((report) => (\n                  <HorizontalTile\n                    key={report.id}\n                    title={report.displayName ?? \"\"}\n                    subText={report.description ?? \"\"}\n                    subtextToolTip={report.description ?? \"\"}\n                    titleTooltip={report.displayName}\n                    onClickTitle={() => {\n                      setSelectedReport(report);\n                      setReportsView(ReportsView.REPORTSMAPPING);\n                    }}\n                    button={\n                      <DropdownMenu\n                        menuItems={(close: () => void) => [\n                          <MenuItem\n                            key={0}\n                            onClick={() => {\n                              setSelectedReport(report);\n                              setReportsView(ReportsView.MODIFYING);\n                            }}\n                            icon={<SvgEdit />}\n                          >\n                            {ReportsConfigWidget.localization.getLocalizedString(\n                              \"ReportsConfigWidget:Modify\"\n                            )}\n                          </MenuItem>,\n                          <MenuItem\n                            key={1}\n                            onClick={() => {\n                              setSelectedReport(report);\n                              setShowDeleteModal(true);\n                              close();\n                            }}\n                            icon={<SvgDelete />}\n                          >\n                            {ReportsConfigWidget.localization.getLocalizedString(\n                              \"ReportsConfigWidget:Remove\"\n                            )}\n                          </MenuItem>,\n                        ]}\n                      >\n                        <IconButton styleType=\"borderless\">\n                          <SvgMore\n                            style={{\n                              width: \"16px\",\n                              height: \"16px\",\n                            }}\n                          />\n                        </IconButton>\n                      </DropdownMenu>\n                    }\n                  />\n                ))}\n              </div>\n            )}\n          </Surface>\n          <DeleteModal\n            entityName={selectedReport?.displayName ?? \"\"}\n            show={showDeleteModal}\n            setShow={setShowDeleteModal}\n            onDelete={async () => {\n              const reportingClientApi = new ReportingClient(\n                generateUrl(REPORTING_BASE_PATH, apiConfig.baseUrl)\n              );\n              const accessToken = await apiConfig.getAccessToken();\n              await reportingClientApi.deleteReport(\n                accessToken,\n                selectedReport?.id ?? \"\"\n              );\n            }}\n            refresh={refresh}\n          />\n        </>\n      );\n  }\n};\n"]}

package/lib/esm/widget/components/Reports.scss

@@ -0,0 +1,36 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+.reports-list-container {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  padding: $iui-baseline $iui-m;
+  min-height: 0;
+
+  .toolbar {
+    display: flex;
+    justify-content: space-between;
+    gap: $iui-s;
+    border-bottom: 1px solid var(--iui-color-background-4);
+    padding-bottom: $iui-baseline;
+    flex-wrap: wrap;
+  }
+
+  .search-bar-container {
+    flex-basis: $iui-3xl;
+    flex-shrink: 1;
+    flex-grow: 1;
+  }
+
+  .reports-list {
+    display: flex;
+    flex-direction: column;
+    overflow-y: overlay;
+    gap: 7.5px;
+    margin-top: 7.5px;
+  }
+}

package/lib/esm/widget/components/ReportsContainer.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { AccessToken } from "@itwin/core-bentley";
+import "./ReportsContainer.scss";
+interface ReportsContainerProps {
+    getAccessToken?: () => Promise<AccessToken>;
+    baseUrl: string;
+}
+declare const ReportsContainer: ({ getAccessToken, baseUrl, }: ReportsContainerProps) => JSX.Element;
+export default ReportsContainer;
+//# sourceMappingURL=ReportsContainer.d.ts.map

package/lib/esm/widget/components/ReportsContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReportsContainer.d.ts","sourceRoot":"","sources":["../../../../src/widget/components/ReportsContainer.tsx"],"names":[],"mappings":";AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAKvD,OAAO,yBAAyB,CAAC;AAEjC,UAAU,qBAAqB;IAC7B,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC;IAC5C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,gBAAgB,iCAGnB,qBAAqB,gBAcvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/esm/widget/components/ReportsContainer.js

@@ -0,0 +1,13 @@
+import { IModelApp } from "@itwin/core-frontend";
+import * as React from "react";
+import { Reports } from "../components/Reports";
+import { ReportsApiConfigContext } from "../context/ReportsApiConfigContext";
+import "./ReportsContainer.scss";
+const ReportsContainer = ({ getAccessToken, baseUrl, }) => (React.createElement(ReportsApiConfigContext.Provider, { value: {
+        getAccessToken: getAccessToken !== null && getAccessToken !== void 0 ? getAccessToken : (async () => { var _a, _b; return (_b = (await ((_a = IModelApp.authorizationClient) === null || _a === void 0 ? void 0 : _a.getAccessToken()))) !== null && _b !== void 0 ? _b : ""; }),
+        baseUrl,
+    } },
+    React.createElement("div", { className: "reports-container" },
+        React.createElement(Reports, null))));
+export default ReportsContainer;
+//# sourceMappingURL=ReportsContainer.js.map

package/lib/esm/widget/components/ReportsContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReportsContainer.js","sourceRoot":"","sources":["../../../../src/widget/components/ReportsContainer.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AAC7E,OAAO,yBAAyB,CAAC;AAOjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,cAAc,EACd,OAAO,GACe,EAAE,EAAE,CAAC,CAC3B,oBAAC,uBAAuB,CAAC,QAAQ,IAC/B,KAAK,EAAE;QACL,cAAc,EACZ,cAAc,aAAd,cAAc,cAAd,cAAc,GACd,CAAC,KAAK,IAAI,EAAE,eACV,OAAA,MAAA,CAAC,MAAM,CAAA,MAAA,SAAS,CAAC,mBAAmB,0CAAE,cAAc,EAAE,CAAA,CAAC,mCAAI,EAAE,CAAA,EAAA,CAAC;QAClE,OAAO;KACR;IAED,6BAAK,SAAS,EAAC,mBAAmB;QAChC,oBAAC,OAAO,OAAG,CACP,CAC2B,CACpC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport type { AccessToken } from \"@itwin/core-bentley\";\nimport { IModelApp } from \"@itwin/core-frontend\";\nimport * as React from \"react\";\nimport { Reports } from \"../components/Reports\";\nimport { ReportsApiConfigContext } from \"../context/ReportsApiConfigContext\";\nimport \"./ReportsContainer.scss\";\n\ninterface ReportsContainerProps {\n  getAccessToken?: () => Promise<AccessToken>;\n  baseUrl: string;\n}\n\nconst ReportsContainer = ({\n  getAccessToken,\n  baseUrl,\n}: ReportsContainerProps) => (\n  <ReportsApiConfigContext.Provider\n    value={{\n      getAccessToken:\n        getAccessToken ??\n        (async () =>\n          (await IModelApp.authorizationClient?.getAccessToken()) ?? \"\"),\n      baseUrl,\n    }}\n  >\n    <div className=\"reports-container\">\n      <Reports />\n    </div>\n  </ReportsApiConfigContext.Provider>\n);\n\nexport default ReportsContainer;\n"]}

package/lib/esm/widget/components/ReportsContainer.scss

@@ -0,0 +1,15 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+.reports-container {
+  display: flex;
+  flex-direction: column;
+  padding: $iui-baseline $iui-m;
+  box-sizing: border-box;
+  height: 100%;
+  overflow: auto;
+  gap: $iui-baseline;
+}

package/lib/esm/widget/components/SearchBar.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import "./SearchBar.scss";
+interface SearchBarProps {
+    searchValue: string;
+    setSearchValue: React.Dispatch<React.SetStateAction<string>>;
+    disabled?: boolean;
+}
+export declare const SearchBar: ({ searchValue, setSearchValue, disabled, }: SearchBarProps) => JSX.Element;
+export {};
+//# sourceMappingURL=SearchBar.d.ts.map

package/lib/esm/widget/components/SearchBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBar.d.ts","sourceRoot":"","sources":["../../../../src/widget/components/SearchBar.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,kBAAkB,CAAC;AAE1B,UAAU,cAAc;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,+CAInB,cAAc,gBAyChB,CAAC"}

package/lib/esm/widget/components/SearchBar.js

@@ -0,0 +1,27 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+import { SvgCloseSmall, SvgSearch } from "@itwin/itwinui-icons-react";
+import { IconButton, LabeledInput } from "@itwin/itwinui-react";
+import React, { useState } from "react";
+import { ReportsConfigWidget } from "../../ReportsConfigWidget";
+import "./SearchBar.scss";
+export const SearchBar = ({ searchValue, setSearchValue, disabled, }) => {
+    const [searchBarOpen, setSearchBarOpened] = useState(false);
+    const [searchBarClosing, setSearchBarClosing] = useState(false);
+    return searchBarOpen || searchValue ? (React.createElement("div", { style: {
+            animation: searchBarClosing ? "rcw-shrink .5s" : "rcw-expand .5s",
+        }, onAnimationEnd: () => {
+            if (searchBarClosing) {
+                setSearchBarClosing(false);
+                setSearchBarOpened(false);
+                setSearchValue("");
+            }
+        } },
+        React.createElement(LabeledInput, { "aria-label": "search-textbox", placeholder: ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:Search"), svgIcon: React.createElement(IconButton, { onClick: () => setSearchBarClosing(true), styleType: "borderless" },
+                React.createElement(SvgCloseSmall, null)), iconDisplayStyle: "inline", value: searchValue, onChange: (e) => setSearchValue(e.target.value), disabled: disabled }),
+        " ")) : (React.createElement(IconButton, { styleType: "borderless", onClick: () => setSearchBarOpened(true) },
+        React.createElement(SvgSearch, null)));
+};
+//# sourceMappingURL=SearchBar.js.map

package/lib/esm/widget/components/SearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../../src/widget/components/SearchBar.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,kBAAkB,CAAC;AAQ1B,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,WAAW,EACX,cAAc,EACd,QAAQ,GACO,EAAE,EAAE;IACnB,MAAM,CAAC,aAAa,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAEzE,OAAO,aAAa,IAAI,WAAW,CAAC,CAAC,CAAC,CACpC,6BACE,KAAK,EAAE;YACL,SAAS,EAAE,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAgB;SAClE,EACD,cAAc,EAAE,GAAG,EAAE;YACnB,IAAI,gBAAgB,EAAE;gBACpB,mBAAmB,CAAC,KAAK,CAAC,CAAC;gBAC3B,kBAAkB,CAAC,KAAK,CAAC,CAAC;gBAC1B,cAAc,CAAC,EAAE,CAAC,CAAC;aACpB;QACH,CAAC;QAED,oBAAC,YAAY,kBACA,gBAAgB,EAC3B,WAAW,EAAE,mBAAmB,CAAC,YAAY,CAAC,kBAAkB,CAC9D,4BAA4B,CAC7B,EACD,OAAO,EACL,oBAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,IAAI,CAAC,EACxC,SAAS,EAAC,YAAY;gBAEtB,oBAAC,aAAa,OAAG,CACN,EAEf,gBAAgB,EAAC,QAAQ,EACzB,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAC/C,QAAQ,EAAE,QAAQ,GAClB;QAAC,GAAG,CACF,CACP,CAAC,CAAC,CAAC,CACF,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC;QACxE,oBAAC,SAAS,OAAG,CACF,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { SvgCloseSmall, SvgSearch } from \"@itwin/itwinui-icons-react\";\nimport { IconButton, LabeledInput } from \"@itwin/itwinui-react\";\nimport React, { useState } from \"react\";\nimport { ReportsConfigWidget } from \"../../ReportsConfigWidget\";\nimport \"./SearchBar.scss\";\n\ninterface SearchBarProps {\n  searchValue: string;\n  setSearchValue: React.Dispatch<React.SetStateAction<string>>;\n  disabled?: boolean;\n}\n\nexport const SearchBar = ({\n  searchValue,\n  setSearchValue,\n  disabled,\n}: SearchBarProps) => {\n  const [searchBarOpen, setSearchBarOpened] = useState<boolean>(false);\n  const [searchBarClosing, setSearchBarClosing] = useState<boolean>(false);\n\n  return searchBarOpen || searchValue ? (\n    <div\n      style={{\n        animation: searchBarClosing ? \"rcw-shrink .5s\" : \"rcw-expand .5s\",\n      }}\n      onAnimationEnd={() => {\n        if (searchBarClosing) {\n          setSearchBarClosing(false);\n          setSearchBarOpened(false);\n          setSearchValue(\"\");\n        }\n      }}\n    >\n      <LabeledInput\n        aria-label=\"search-textbox\"\n        placeholder={ReportsConfigWidget.localization.getLocalizedString(\n          \"ReportsConfigWidget:Search\"\n        )}\n        svgIcon={\n          <IconButton\n            onClick={() => setSearchBarClosing(true)}\n            styleType=\"borderless\"\n          >\n            <SvgCloseSmall />\n          </IconButton>\n        }\n        iconDisplayStyle=\"inline\"\n        value={searchValue}\n        onChange={(e) => setSearchValue(e.target.value)}\n        disabled={disabled}\n      />{\" \"}\n    </div>\n  ) : (\n    <IconButton styleType=\"borderless\" onClick={() => setSearchBarOpened(true)}>\n      <SvgSearch />\n    </IconButton>\n  );\n};\n"]}

package/lib/esm/widget/components/SearchBar.scss

@@ -0,0 +1,27 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+@keyframes rcw-expand {
+  0% {
+    opacity: 0;
+    width: 20%;
+  }
+  100% {
+    opacity: 1;
+    width: 100%;
+  }
+}
+
+@keyframes rcw-shrink {
+  100% {
+    opacity: 0;
+    width: 20%;
+  }
+  0% {
+    opacity: 1;
+    width: 100%;
+  }
+}

package/lib/esm/widget/components/SelectIModel.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import "./SelectIModel.scss";
+interface SelectedIModelProps {
+    selectedIModelId: string;
+    setSelectedIModelId: React.Dispatch<React.SetStateAction<string>>;
+}
+export declare const SelectIModel: ({ selectedIModelId, setSelectedIModelId, }: SelectedIModelProps) => JSX.Element;
+export {};
+//# sourceMappingURL=SelectIModel.d.ts.map

package/lib/esm/widget/components/SelectIModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectIModel.d.ts","sourceRoot":"","sources":["../../../../src/widget/components/SelectIModel.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAI5D,OAAO,qBAAqB,CAAC;AAyB7B,UAAU,mBAAmB;IAC3B,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CACnE;AAED,eAAO,MAAM,YAAY,+CAGtB,mBAAmB,gBA+CrB,CAAC"}

package/lib/esm/widget/components/SelectIModel.js

@@ -0,0 +1,59 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+import { useActiveIModelConnection } from "@itwin/appui-react";
+import { AccessTokenAdapter } from "@itwin/imodels-access-frontend";
+import { Constants, IModelsClient, toArray, } from "@itwin/imodels-client-management";
+import { ComboBox, Label } from "@itwin/itwinui-react";
+import React, { useEffect, useMemo, useState } from "react";
+import { ReportsConfigWidget } from "../../ReportsConfigWidget";
+import { useReportsApiConfig } from "../context/ReportsApiConfigContext";
+import "./SelectIModel.scss";
+import { generateUrl } from "./utils";
+const fetchIModels = async (setiModels, iTwinId, apiContext) => {
+    const iModelClientOptions = {
+        api: { baseUrl: generateUrl(Constants.api.baseUrl, apiContext.baseUrl) },
+    };
+    const iModelsClient = new IModelsClient(iModelClientOptions);
+    const accessToken = await apiContext.getAccessToken();
+    const authorization = AccessTokenAdapter.toAuthorizationCallback(accessToken);
+    const getiModelListParams = {
+        urlParams: { projectId: iTwinId },
+        authorization,
+    };
+    const iModels = await toArray(iModelsClient.iModels.getMinimalList(getiModelListParams));
+    setiModels(iModels);
+};
+export const SelectIModel = ({ selectedIModelId, setSelectedIModelId, }) => {
+    var _a, _b, _c, _d;
+    const apiConfig = useReportsApiConfig();
+    const iModelId = (_b = (_a = useActiveIModelConnection()) === null || _a === void 0 ? void 0 : _a.iModelId) !== null && _b !== void 0 ? _b : "";
+    const iTwinId = (_d = (_c = useActiveIModelConnection()) === null || _c === void 0 ? void 0 : _c.iTwinId) !== null && _d !== void 0 ? _d : "";
+    const [iModels, setIModels] = useState([]);
+    useEffect(() => {
+        if (iModelId && iTwinId) {
+            void fetchIModels(setIModels, iTwinId, apiConfig);
+        }
+    }, [apiConfig, setIModels, iModelId, iTwinId]);
+    useEffect(() => {
+        if (iModelId && iModels.length > 0) {
+            setSelectedIModelId(iModelId);
+        }
+    }, [iModelId, iModels, setSelectedIModelId]);
+    const iModelOptions = useMemo(() => {
+        return iModels.map((iModel) => ({
+            label: iModel.displayName,
+            value: iModel.id,
+        }));
+    }, [iModels]);
+    return (React.createElement("div", { className: "reports-select-imodel" },
+        React.createElement(Label, { htmlFor: "combo-input" }, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:SelectIModel")),
+        React.createElement("div", { className: "combobox" },
+            React.createElement(ComboBox, { options: iModelOptions, value: selectedIModelId, onChange: (value) => {
+                    setSelectedIModelId(value);
+                }, inputProps: {
+                    id: "combo-input",
+                }, style: { flexGrow: 1, maxWidth: "395px" } }))));
+};
+//# sourceMappingURL=SelectIModel.js.map

package/lib/esm/widget/components/SelectIModel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectIModel.js","sourceRoot":"","sources":["../../../../src/widget/components/SelectIModel.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { useActiveIModelConnection } from \"@itwin/appui-react\";\nimport { AccessTokenAdapter } from \"@itwin/imodels-access-frontend\";\nimport type {\n  GetIModelListParams,\n  IModelsClientOptions,\n  MinimalIModel,\n} from \"@itwin/imodels-client-management\";\nimport {\n  Constants,\n  IModelsClient,\n  toArray,\n} from \"@itwin/imodels-client-management\";\nimport { ComboBox, Label } from \"@itwin/itwinui-react\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { ReportsConfigWidget } from \"../../ReportsConfigWidget\";\nimport type { ReportsApiConfig } from \"../context/ReportsApiConfigContext\";\nimport { useReportsApiConfig } from \"../context/ReportsApiConfigContext\";\nimport \"./SelectIModel.scss\";\nimport { generateUrl } from \"./utils\";\n\nconst fetchIModels = async (\n  setiModels: React.Dispatch<React.SetStateAction<MinimalIModel[]>>,\n  iTwinId: string,\n  apiContext: ReportsApiConfig\n) => {\n  const iModelClientOptions: IModelsClientOptions = {\n    api: { baseUrl: generateUrl(Constants.api.baseUrl, apiContext.baseUrl) },\n  };\n\n  const iModelsClient: IModelsClient = new IModelsClient(iModelClientOptions);\n  const accessToken = await apiContext.getAccessToken();\n  const authorization = AccessTokenAdapter.toAuthorizationCallback(accessToken);\n  const getiModelListParams: GetIModelListParams = {\n    urlParams: { projectId: iTwinId },\n    authorization,\n  };\n  const iModels = await toArray(\n    iModelsClient.iModels.getMinimalList(getiModelListParams)\n  );\n  setiModels(iModels);\n};\n\ninterface SelectedIModelProps {\n  selectedIModelId: string;\n  setSelectedIModelId: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport const SelectIModel = ({\n  selectedIModelId,\n  setSelectedIModelId,\n}: SelectedIModelProps) => {\n  const apiConfig = useReportsApiConfig();\n  const iModelId = useActiveIModelConnection()?.iModelId ?? \"\";\n  const iTwinId = useActiveIModelConnection()?.iTwinId ?? \"\";\n  const [iModels, setIModels] = useState<MinimalIModel[]>([]);\n\n  useEffect(() => {\n    if (iModelId && iTwinId) {\n      void fetchIModels(setIModels, iTwinId, apiConfig);\n    }\n  }, [apiConfig, setIModels, iModelId, iTwinId]);\n\n  useEffect(() => {\n    if (iModelId && iModels.length > 0) {\n      setSelectedIModelId(iModelId);\n    }\n  }, [iModelId, iModels, setSelectedIModelId]);\n\n  const iModelOptions = useMemo(() => {\n    return iModels.map((iModel) => ({\n      label: iModel.displayName,\n      value: iModel.id,\n    }));\n  }, [iModels]);\n\n  return (\n    <div className=\"reports-select-imodel\">\n      <Label htmlFor=\"combo-input\">\n        {ReportsConfigWidget.localization.getLocalizedString(\n          \"ReportsConfigWidget:SelectIModel\"\n        )}\n      </Label>\n      <div className=\"combobox\">\n        <ComboBox<string>\n          options={iModelOptions}\n          value={selectedIModelId}\n          onChange={(value) => {\n            setSelectedIModelId(value);\n          }}\n          inputProps={{\n            id: \"combo-input\",\n          }}\n          style={{ flexGrow: 1, maxWidth: \"395px\" }}\n        />\n      </div>\n    </div>\n  );\n};\n"]}

package/lib/esm/widget/components/SelectIModel.scss

@@ -0,0 +1,15 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+
+.reports-select-imodel {
+  position: relative;
+  margin-bottom: $iui-baseline * 2;
+  .combobox {
+    display: flex;
+    gap: $iui-s;
+    width: 100%;
+  }
+}

package/lib/esm/widget/components/utils.d.ts

@@ -0,0 +1,23 @@
+import "./utils.scss";
+import React from "react";
+export interface WidgetHeaderProps {
+    title: string;
+    disabled?: boolean;
+    returnFn?: () => Promise<void>;
+}
+export declare const WidgetHeader: ({ title, disabled, returnFn, }: WidgetHeaderProps) => JSX.Element;
+export declare const handleError: (errorStatus: number) => void;
+export declare const LoadingOverlay: () => JSX.Element;
+interface EmptyMessageProps {
+    children?: React.ReactNode;
+}
+export declare const EmptyMessage: ({ children }: EmptyMessageProps) => JSX.Element;
+export declare const handleInputChange: <T>(e: React.ChangeEvent<HTMLInputElement>, values: T, setValues: React.Dispatch<React.SetStateAction<T>>) => void;
+export declare const LoadingSpinner: () => JSX.Element;
+export declare const SkeletonBlock: () => JSX.Element;
+export declare const generateUrl: (baseUrl: string, newBaseUrl: string) => string;
+export declare type CreateTypeFromInterface<Interface> = {
+    [Property in keyof Interface]: Interface[Property];
+};
+export {};
+//# sourceMappingURL=utils.d.ts.map

package/lib/esm/widget/components/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/widget/components/utils.tsx"],"names":[],"mappings":"AAWA,OAAO,cAAc,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,YAAY,mCAItB,iBAAiB,gBAiBnB,CAAC;AAEF,eAAO,MAAM,WAAW,gBAAiB,MAAM,SAwD9C,CAAC;AAEF,eAAO,MAAM,cAAc,mBAc1B,CAAC;AACF,UAAU,iBAAiB;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AACD,eAAO,MAAM,YAAY,iBAAkB,iBAAiB,gBAE3D,CAAC;AAEF,eAAO,MAAM,iBAAiB,SACzB,MAAM,WAAW,CAAC,gBAAgB,CAAC,wEAUvC,CAAC;AAEF,eAAO,MAAM,cAAc,mBAS1B,CAAC;AAEF,eAAO,MAAM,aAAa,mBAEzB,CAAC;AAEF,eAAO,MAAM,WAAW,YAAa,MAAM,cAAc,MAAM,WAE9D,CAAC;AAEF,oBAAY,uBAAuB,CAAC,SAAS,IAAI;KAC9C,QAAQ,IAAI,MAAM,SAAS,GAAG,SAAS,CAAC,QAAQ,CAAC;CACnD,CAAC"}

package/lib/esm/widget/components/utils.js

@@ -0,0 +1,73 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+import { SvgChevronLeft } from "@itwin/itwinui-icons-react";
+import { IconButton, ProgressRadial, Text, toaster, } from "@itwin/itwinui-react";
+import "./utils.scss";
+import React from "react";
+import { ReportsConfigWidget } from "../../ReportsConfigWidget";
+export const WidgetHeader = ({ title, disabled = false, returnFn, }) => {
+    return (React.createElement("div", { className: "rcw-widget-header-container" },
+        returnFn && (React.createElement(IconButton, { onClick: returnFn, disabled: disabled, styleType: "borderless" },
+            React.createElement(SvgChevronLeft, null))),
+        React.createElement(Text, { className: "title", variant: "title" }, title)));
+};
+export const handleError = (errorStatus) => {
+    let errorMessage = `${ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.Error")} `;
+    switch (errorStatus) {
+        case 401:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.401");
+            break;
+        case 403:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.403");
+            break;
+        case 404:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.404");
+            break;
+        case 409:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.409");
+            break;
+        case 422:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.422");
+            break;
+        case 429:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.429");
+            break;
+        case 500:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.500");
+            break;
+        case 502:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.502");
+            break;
+        case 503:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.503");
+            break;
+        default:
+            errorMessage += ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:ErrorMessages.SomethingWentWrong");
+    }
+    toaster.negative(errorMessage);
+};
+export const LoadingOverlay = () => (React.createElement("div", { className: "rcw-center-overlay" },
+    React.createElement(Text, null, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:Loading")),
+    React.createElement(ProgressRadial, { indeterminate: true }),
+    React.createElement(Text, null, ReportsConfigWidget.localization.getLocalizedString("ReportsConfigWidget:PleaseWait"))));
+export const EmptyMessage = ({ children }) => {
+    return React.createElement("div", { className: "rcw-center-overlay" }, children);
+};
+export const handleInputChange = (e, values, setValues) => {
+    const { name, value } = e.target;
+    setValues({
+        ...values,
+        [name]: value,
+    });
+};
+export const LoadingSpinner = () => {
+    return (React.createElement("div", { className: "rcw-loading-spinner", "data-testid": "rcw-action-loading-spinner" },
+        React.createElement(ProgressRadial, { size: "small", indeterminate: true })));
+};
+export const SkeletonBlock = () => (React.createElement("div", { className: "rcw-skeleton-block iui-skeleton" }));
+export const generateUrl = (baseUrl, newBaseUrl) => {
+    return baseUrl.replace("https://api.bentley.com", newBaseUrl);
+};
+//# sourceMappingURL=utils.js.map

package/lib/esm/widget/components/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/widget/components/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\nimport { SvgChevronLeft } from \"@itwin/itwinui-icons-react\";\nimport {\n  IconButton,\n  ProgressRadial,\n  Text,\n  toaster,\n} from \"@itwin/itwinui-react\";\nimport \"./utils.scss\";\nimport React from \"react\";\nimport { ReportsConfigWidget } from \"../../ReportsConfigWidget\";\n\nexport interface WidgetHeaderProps {\n  title: string;\n  disabled?: boolean;\n  returnFn?: () => Promise<void>;\n}\n\nexport const WidgetHeader = ({\n  title,\n  disabled = false,\n  returnFn,\n}: WidgetHeaderProps) => {\n  return (\n    <div className=\"rcw-widget-header-container\">\n      {returnFn && (\n        <IconButton\n          onClick={returnFn}\n          disabled={disabled}\n          styleType=\"borderless\"\n        >\n          <SvgChevronLeft />\n        </IconButton>\n      )}\n      <Text className=\"title\" variant=\"title\">\n        {title}\n      </Text>\n    </div>\n  );\n};\n\nexport const handleError = (errorStatus: number) => {\n  let errorMessage = `${ReportsConfigWidget.localization.getLocalizedString(\n    \"ReportsConfigWidget:ErrorMessages.Error\"\n  )} `;\n  switch (errorStatus) {\n    case 401:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.401\"\n      );\n      break;\n    case 403:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.403\"\n      );\n      break;\n    case 404:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.404\"\n      );\n      break;\n    case 409:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.409\"\n      );\n      break;\n    case 422:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.422\"\n      );\n      break;\n    case 429:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.429\"\n      );\n      break;\n    case 500:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.500\"\n      );\n      break;\n    case 502:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.502\"\n      );\n      break;\n    case 503:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.503\"\n      );\n      break;\n    default:\n      errorMessage += ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:ErrorMessages.SomethingWentWrong\"\n      );\n  }\n  toaster.negative(errorMessage);\n};\n\nexport const LoadingOverlay = () => (\n  <div className=\"rcw-center-overlay\">\n    <Text>\n      {ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:Loading\"\n      )}\n    </Text>\n    <ProgressRadial indeterminate />\n    <Text>\n      {ReportsConfigWidget.localization.getLocalizedString(\n        \"ReportsConfigWidget:PleaseWait\"\n      )}\n    </Text>\n  </div>\n);\ninterface EmptyMessageProps {\n  children?: React.ReactNode;\n}\nexport const EmptyMessage = ({ children }: EmptyMessageProps) => {\n  return <div className=\"rcw-center-overlay\">{children}</div>;\n};\n\nexport const handleInputChange = <T,>(\n  e: React.ChangeEvent<HTMLInputElement>,\n  values: T,\n  setValues: React.Dispatch<React.SetStateAction<T>>\n) => {\n  const { name, value } = e.target;\n\n  setValues({\n    ...values,\n    [name]: value,\n  });\n};\n\nexport const LoadingSpinner = () => {\n  return (\n    <div\n      className=\"rcw-loading-spinner\"\n      data-testid=\"rcw-action-loading-spinner\"\n    >\n      <ProgressRadial size=\"small\" indeterminate />\n    </div>\n  );\n};\n\nexport const SkeletonBlock = () => (\n  <div className=\"rcw-skeleton-block iui-skeleton\" />\n);\n\nexport const generateUrl = (baseUrl: string, newBaseUrl: string) => {\n  return baseUrl.replace(\"https://api.bentley.com\", newBaseUrl);\n};\n\nexport type CreateTypeFromInterface<Interface> = {\n  [Property in keyof Interface]: Interface[Property];\n};\n"]}

package/lib/esm/widget/components/utils.scss

@@ -0,0 +1,39 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+@import "~@itwin/itwinui-css/scss/variables";
+@import "~@itwin/itwinui-css/scss/icon/index";
+@import "~@itwin/itwinui-css/scss/button/index";
+
+.rcw-widget-header-container {
+  display: flex;
+  margin-bottom: $iui-baseline;
+  align-items: center;
+
+  .title {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    margin-bottom: 3px;
+  }
+}
+
+.rcw-loading-spinner {
+  display: flex;
+  align-items: center;
+}
+
+.rcw-center-overlay {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  gap: $iui-baseline;
+  height: 100%;
+}
+
+.rcw-skeleton-block {
+  height: $iui-baseline * 3;
+  width: 100%;
+}

package/lib/esm/widget/context/ReportsApiConfigContext.d.ts

@@ -0,0 +1,9 @@
+import type { AccessToken } from "@itwin/core-bentley";
+import * as React from "react";
+export interface ReportsApiConfig {
+    getAccessToken: () => Promise<AccessToken>;
+    baseUrl: string;
+}
+export declare const ReportsApiConfigContext: React.Context<ReportsApiConfig>;
+export declare const useReportsApiConfig: () => ReportsApiConfig;
+//# sourceMappingURL=ReportsApiConfigContext.d.ts.map

package/lib/esm/widget/context/ReportsApiConfigContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReportsApiConfigContext.d.ts","sourceRoot":"","sources":["../../../../src/widget/context/ReportsApiConfigContext.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC;IAC3C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,uBAAuB,iCAGlC,CAAC;AAEH,eAAO,MAAM,mBAAmB,wBAQ/B,CAAC"}