npm - @itwin/grouping-mapping-widget - Versions diffs - 0.35.4 → 0.36.0 - Mend

@itwin/grouping-mapping-widget 0.35.4 → 0.36.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (302) hide show

package/lib/esm/components/Properties/GroupProperties/GroupsPropertiesSelectionModal.js CHANGED Viewed

@@ -15,6 +15,7 @@ import { getLocalizedStringPresentation } from "../../../common/utils";
 import { closestCenter, DndContext, KeyboardSensor, PointerSensor, useSensor, useSensors } from "@dnd-kit/core";
 import { arrayMove, sortableKeyboardCoordinates } from "@dnd-kit/sortable";
 import { GroupPropertyListItem } from "./GroupPropertyListItem";
+import { GroupingMappingWidget } from "../../../GroupingMappingWidget";
 export const GroupsPropertiesSelectionModal = ({ showModal, setShowModal, selectedProperties, setSelectedProperties, propertiesMetaData, }) => {
     const [searchInput, setSearchInput] = useState("");
     const [activeSearchInput, setActiveSearchInput] = useState("");
@@ -58,7 +59,7 @@ export const GroupsPropertiesSelectionModal = ({ showModal, setShowModal, select
         }
     }, [searchInput, setSearched, clearSearch]);
     return (React.createElement(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragStart: handleDragStart, onDragEnd: handleDragEnd },
-        React.createElement(Modal, { title: "Properties Selection", isOpen: showModal, onClose: () => {
+        React.createElement(Modal, { title: GroupingMappingWidget.translate("properties.selectionModalTitle"), isOpen: showModal, onClose: () => {
                 setShowModal(false);
                 clearSearch();
             }, closeOnExternalClick: false },
@@ -73,26 +74,26 @@ export const GroupsPropertiesSelectionModal = ({ showModal, setShowModal, select
                 }, direction: "horizontal" },
                 React.createElement(Surface, { className: "gmw-available-properties", elevation: 1 },
                     React.createElement("div", { className: "gmw-available-properties-header" },
-                        React.createElement(Label, { as: "span" }, "Available Properties"),
-                        React.createElement(LabeledInput, { displayStyle: "inline", iconDisplayStyle: "inline", className: "gmw-available-prop-search", value: searchInput, size: "small", placeholder: "Search....", onChange: (event) => {
+                        React.createElement(Label, { as: "span" }, GroupingMappingWidget.translate("properties.available")),
+                        React.createElement(LabeledInput, { displayStyle: "inline", iconDisplayStyle: "inline", className: "gmw-available-prop-search", value: searchInput, size: "small", placeholder: GroupingMappingWidget.translate("common.search"), onChange: (event) => {
                                 const { target: { value }, } = event;
                                 setSearchInput(value);
                             }, onKeyDown: (event) => {
                                 if (event.key === "Enter") {
                                     startSearch();
                                 }
-                            }, svgIcon: searched ? (React.createElement(IconButton, { onClick: clearSearch, styleType: "borderless", title: "Clear Search" },
-                                React.createElement(SvgClose, null))) : (React.createElement(IconButton, { onClick: startSearch, styleType: "borderless", title: "Search" },
+                            }, svgIcon: searched ? (React.createElement(IconButton, { onClick: clearSearch, styleType: "borderless", title: GroupingMappingWidget.translate("properties.clearSearch") },
+                                React.createElement(SvgClose, null))) : (React.createElement(IconButton, { onClick: startSearch, styleType: "borderless", title: GroupingMappingWidget.translate("properties.searchButton") },
                                 React.createElement(SvgSearch, null))) })),
                     filteredProperties.length === 0 ? (React.createElement("div", { className: "gmw-empty-selection" },
-                        React.createElement(Text, null, "No properties available. "))) : (React.createElement("div", { className: "gmw-properties-list" }, filteredProperties.map((property) => (React.createElement(GroupPropertyListItem, { key: property.key, content: `${property.displayLabel}`, title: `${property.actualECClassName}`, description: getLocalizedStringPresentation(property.categoryLabel), selected: selectedProperties.some((p) => property.key === p.key), onClick: () => setSelectedProperties((sp) => (sp.some((p) => property.key === p.key) ? sp.filter((p) => property.key !== p.key) : [...sp, property])) })))))),
+                        React.createElement(Text, null, GroupingMappingWidget.translate("properties.noAvailable")))) : (React.createElement("div", { className: "gmw-properties-list" }, filteredProperties.map((property) => (React.createElement(GroupPropertyListItem, { key: property.key, content: `${property.displayLabel}`, title: `${property.actualECClassName}`, description: getLocalizedStringPresentation(property.categoryLabel), selected: selectedProperties.some((p) => property.key === p.key), onClick: () => setSelectedProperties((sp) => (sp.some((p) => property.key === p.key) ? sp.filter((p) => property.key !== p.key) : [...sp, property])) })))))),
                 React.createElement(Surface, { className: "gmw-selected-properties", elevation: 1 },
-                    React.createElement(Label, { as: "span" }, "Selected Properties"),
+                    React.createElement(Label, { as: "span" }, GroupingMappingWidget.translate("properties.selected")),
                     selectedProperties.length === 0 ? (React.createElement("div", { className: "gmw-empty-selection" },
-                        React.createElement(Text, null, "No properties selected."),
-                        React.createElement(Text, null, "Add some by clicking on the properties shown left."))) : (React.createElement("div", { className: "gmw-properties-list" },
+                        React.createElement(Text, null, GroupingMappingWidget.translate("properties.noSelected")),
+                        React.createElement(Text, null, GroupingMappingWidget.translate("properties.addHint")))) : (React.createElement("div", { className: "gmw-properties-list" },
                         React.createElement(SortableContext, { items: selectedProperties.map((p) => p.key), strategy: verticalListSortingStrategy }, selectedProperties.map((property) => (React.createElement(SortableHorizontalTile, { key: property.key, id: property.key, content: `${property.displayLabel}`, title: `${property.actualECClassName}`, description: getLocalizedStringPresentation(property.categoryLabel), action: React.createElement("div", null,
-                                React.createElement(IconButton, { styleType: "borderless", title: "Remove", onClick: () => {
+                                React.createElement(IconButton, { styleType: "borderless", title: GroupingMappingWidget.translate("common.remove"), onClick: () => {
                                         setSelectedProperties((sp) => sp.filter((p) => property.key !== p.key));
                                     } },
                                     React.createElement(SvgRemove, null))) })))))))),
@@ -100,7 +101,7 @@ export const GroupsPropertiesSelectionModal = ({ showModal, setShowModal, select
                 React.createElement(Button, { onClick: () => {
                         setShowModal(false);
                         clearSearch();
-                    }, styleType: "high-visibility" }, "Close"))),
+                    }, styleType: "high-visibility" }, GroupingMappingWidget.translate("common.close")))),
         React.createElement(DragOverlay, { zIndex: 9999 }, activeDragProperty ? (React.createElement(GroupPropertyListItem, { content: `${activeDragProperty.displayLabel}`, title: `${activeDragProperty.actualECClassName}`, description: getLocalizedStringPresentation(activeDragProperty.categoryLabel), action: React.createElement(IconButton, { styleType: "borderless" },
                 React.createElement(SvgRemove, null)), dragHandle: React.createElement(Icon, { className: "gmw-drag-icon", size: "large" },
                 React.createElement(SvgDragHandleVertical, null)) })) : null)));

package/lib/esm/components/Properties/GroupProperties/GroupsPropertiesSelectionModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GroupsPropertiesSelectionModal.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/GroupsPropertiesSelectionModal.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 { renderToStaticMarkup } from \"react-dom/server\";\nimport { Button, Icon, IconButton, Label, LabeledInput, Modal, ModalButtonBar, Surface, Text } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { SvgClose, SvgDragHandleVertical, SvgMoreVerticalSmall, SvgRemove, SvgSearch } from \"@itwin/itwinui-icons-react\";\nimport { DragOverlay } from \"@dnd-kit/core\";\nimport { SortableContext, verticalListSortingStrategy } from \"@dnd-kit/sortable\";\nimport { SortableHorizontalTile } from \"./SortableHorizontalTile\";\nimport Split from \"react-split\";\nimport \"./GroupsPropertiesSelectionModal.scss\";\nimport type { PropertyMetaData } from \"./GroupPropertyUtils\";\nimport { getLocalizedStringPresentation } from \"../../../common/utils\";\nimport { closestCenter, DndContext, KeyboardSensor, PointerSensor, useSensor, useSensors } from \"@dnd-kit/core\";\nimport { arrayMove, sortableKeyboardCoordinates } from \"@dnd-kit/sortable\";\nimport type { DragEndEvent, DragStartEvent } from \"@dnd-kit/core\";\nimport { GroupPropertyListItem } from \"./GroupPropertyListItem\";\n\nexport interface GroupPropertiesSelectionModalProps {\n showModal: boolean;\n setShowModal: (showModal: boolean) => void;\n selectedProperties: PropertyMetaData[];\n setSelectedProperties: (selectedProperties: (selectedProperties: PropertyMetaData[]) => PropertyMetaData[]) => void;\n propertiesMetaData: PropertyMetaData[];\n}\n\nexport const GroupsPropertiesSelectionModal = ({\n showModal,\n setShowModal,\n selectedProperties,\n setSelectedProperties,\n propertiesMetaData,\n}: GroupPropertiesSelectionModalProps) => {\n const [searchInput, setSearchInput] = useState<string>(\"\");\n const [activeSearchInput, setActiveSearchInput] = useState<string>(\"\");\n const [searched, setSearched] = useState<boolean>(false);\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n );\n const [activeDragProperty, setActiveDragProperty] = useState<PropertyMetaData \| undefined>();\n\n const handleDragStart = useCallback(\n (event: DragStartEvent) => {\n const { active } = event;\n const activeProperty = selectedProperties.find((p) => active.id === p.key);\n setActiveDragProperty(activeProperty);\n },\n [selectedProperties],\n );\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n const { active, over } = event;\n\n if (over && active.id !== over.id) {\n setSelectedProperties((items) => {\n const oldIndex = selectedProperties.findIndex((p) => active.id === p.key);\n const newIndex = selectedProperties.findIndex((p) => over.id === p.key);\n\n return arrayMove(items, oldIndex, newIndex);\n });\n }\n\n setActiveDragProperty(undefined);\n },\n [selectedProperties, setSelectedProperties],\n );\n\n const clearSearch = useCallback(() => {\n setSearchInput(\"\");\n setActiveSearchInput(\"\");\n setSearched(false);\n }, []);\n\n const startSearch = useCallback(() => {\n if (!searchInput) return;\n setActiveSearchInput(searchInput);\n setSearched(true);\n }, [searchInput]);\n\n const filteredProperties = useMemo(\n () =>\n propertiesMetaData.filter((p) =>\n [p.displayLabel, p.categoryLabel, p.actualECClassName].map((l) => l.toLowerCase()).some((l) => l.includes(activeSearchInput.toLowerCase())),\n ),\n [activeSearchInput, propertiesMetaData],\n );\n\n useEffect(() => {\n if (searchInput.length === 0) {\n setSearched(false);\n clearSearch();\n }\n }, [searchInput, setSearched, clearSearch]);\n\n return (\n <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <Modal\n title=\"Properties Selection\"\n isOpen={showModal}\n onClose={() => {\n setShowModal(false);\n clearSearch();\n }}\n closeOnExternalClick={false}\n >\n <Split\n expandToMin={false}\n className=\"gmw-property-selection-container\"\n gutterAlign=\"center\"\n gutterSize={2}\n gutter={() => {\n // Expects HTMLElement\n const dragHangle = renderToStaticMarkup(\n <Icon className=\"gmw-gutter-drag-icon\" size=\"large\">\n <SvgMoreVerticalSmall />\n </Icon>,\n );\n const gutter = document.createElement(\"div\");\n gutter.className = `gmw-gutter`;\n gutter.innerHTML = dragHangle;\n return gutter;\n }}\n direction=\"horizontal\"\n >\n <Surface className=\"gmw-available-properties\" elevation={1}>\n <div className=\"gmw-available-properties-header\">\n <Label as=\"span\">Available Properties</Label>\n <LabeledInput\n displayStyle=\"inline\"\n iconDisplayStyle=\"inline\"\n className=\"gmw-available-prop-search\"\n value={searchInput}\n size=\"small\"\n placeholder=\"Search....\"\n onChange={(event) => {\n const {\n target: { value },\n } = event;\n setSearchInput(value);\n }}\n onKeyDown={(event) => {\n if (event.key === \"Enter\") {\n startSearch();\n }\n }}\n svgIcon={\n searched ? (\n <IconButton onClick={clearSearch} styleType=\"borderless\" title=\"Clear Search\">\n <SvgClose />\n </IconButton>\n ) : (\n <IconButton onClick={startSearch} styleType=\"borderless\" title=\"Search\">\n <SvgSearch />\n </IconButton>\n )\n }\n />\n </div>\n {filteredProperties.length === 0 ? (\n <div className=\"gmw-empty-selection\">\n <Text>No properties available. </Text>\n </div>\n ) : (\n <div className=\"gmw-properties-list\">\n {filteredProperties.map((property) => (\n <GroupPropertyListItem\n key={property.key}\n content={`${property.displayLabel}`}\n title={`${property.actualECClassName}`}\n description={getLocalizedStringPresentation(property.categoryLabel)}\n selected={selectedProperties.some((p) => property.key === p.key)}\n onClick={() =>\n setSelectedProperties((sp) => (sp.some((p) => property.key === p.key) ? sp.filter((p) => property.key !== p.key) : [...sp, property]))\n }\n />\n ))}\n </div>\n )}\n </Surface>\n <Surface className=\"gmw-selected-properties\" elevation={1}>\n <Label as=\"span\">Selected Properties</Label>\n {selectedProperties.length === 0 ? (\n <div className=\"gmw-empty-selection\">\n <Text>No properties selected.</Text>\n <Text>Add some by clicking on the properties shown left.</Text>\n </div>\n ) : (\n <div className=\"gmw-properties-list\">\n <SortableContext items={selectedProperties.map((p) => p.key)} strategy={verticalListSortingStrategy}>\n {selectedProperties.map((property) => (\n <SortableHorizontalTile\n key={property.key}\n id={property.key}\n content={`${property.displayLabel}`}\n title={`${property.actualECClassName}`}\n description={getLocalizedStringPresentation(property.categoryLabel)}\n action={\n <div>\n <IconButton\n styleType=\"borderless\"\n title=\"Remove\"\n onClick={() => {\n setSelectedProperties((sp) => sp.filter((p) => property.key !== p.key));\n }}\n >\n <SvgRemove />\n </IconButton>\n </div>\n }\n />\n ))}\n </SortableContext>\n </div>\n )}\n </Surface>\n </Split>\n <ModalButtonBar>\n <Button\n onClick={() => {\n setShowModal(false);\n clearSearch();\n }}\n styleType=\"high-visibility\"\n >\n Close\n </Button>\n </ModalButtonBar>\n </Modal>\n <DragOverlay zIndex={9999}>\n {activeDragProperty ? (\n <GroupPropertyListItem\n content={`${activeDragProperty.displayLabel}`}\n title={`${activeDragProperty.actualECClassName}`}\n description={getLocalizedStringPresentation(activeDragProperty.categoryLabel)}\n action={\n <IconButton styleType=\"borderless\">\n <SvgRemove />\n </IconButton>\n }\n dragHandle={\n <Icon className=\"gmw-drag-icon\" size=\"large\">\n <SvgDragHandleVertical />\n </Icon>\n }\n />\n ) : null}\n </DragOverlay>\n </DndContext>\n );\n};\n"]}
1	+ {"version":3,"file":"GroupsPropertiesSelectionModal.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/GroupsPropertiesSelectionModal.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 { renderToStaticMarkup } from \"react-dom/server\";\nimport { Button, Icon, IconButton, Label, LabeledInput, Modal, ModalButtonBar, Surface, Text } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { SvgClose, SvgDragHandleVertical, SvgMoreVerticalSmall, SvgRemove, SvgSearch } from \"@itwin/itwinui-icons-react\";\nimport { DragOverlay } from \"@dnd-kit/core\";\nimport { SortableContext, verticalListSortingStrategy } from \"@dnd-kit/sortable\";\nimport { SortableHorizontalTile } from \"./SortableHorizontalTile\";\nimport Split from \"react-split\";\nimport \"./GroupsPropertiesSelectionModal.scss\";\nimport type { PropertyMetaData } from \"./GroupPropertyUtils\";\nimport { getLocalizedStringPresentation } from \"../../../common/utils\";\nimport { closestCenter, DndContext, KeyboardSensor, PointerSensor, useSensor, useSensors } from \"@dnd-kit/core\";\nimport { arrayMove, sortableKeyboardCoordinates } from \"@dnd-kit/sortable\";\nimport type { DragEndEvent, DragStartEvent } from \"@dnd-kit/core\";\nimport { GroupPropertyListItem } from \"./GroupPropertyListItem\";\nimport { GroupingMappingWidget } from \"../../../GroupingMappingWidget\";\n\nexport interface GroupPropertiesSelectionModalProps {\n showModal: boolean;\n setShowModal: (showModal: boolean) => void;\n selectedProperties: PropertyMetaData[];\n setSelectedProperties: (selectedProperties: (selectedProperties: PropertyMetaData[]) => PropertyMetaData[]) => void;\n propertiesMetaData: PropertyMetaData[];\n}\n\nexport const GroupsPropertiesSelectionModal = ({\n showModal,\n setShowModal,\n selectedProperties,\n setSelectedProperties,\n propertiesMetaData,\n}: GroupPropertiesSelectionModalProps) => {\n const [searchInput, setSearchInput] = useState<string>(\"\");\n const [activeSearchInput, setActiveSearchInput] = useState<string>(\"\");\n const [searched, setSearched] = useState<boolean>(false);\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n );\n const [activeDragProperty, setActiveDragProperty] = useState<PropertyMetaData \| undefined>();\n\n const handleDragStart = useCallback(\n (event: DragStartEvent) => {\n const { active } = event;\n const activeProperty = selectedProperties.find((p) => active.id === p.key);\n setActiveDragProperty(activeProperty);\n },\n [selectedProperties],\n );\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n const { active, over } = event;\n\n if (over && active.id !== over.id) {\n setSelectedProperties((items) => {\n const oldIndex = selectedProperties.findIndex((p) => active.id === p.key);\n const newIndex = selectedProperties.findIndex((p) => over.id === p.key);\n\n return arrayMove(items, oldIndex, newIndex);\n });\n }\n\n setActiveDragProperty(undefined);\n },\n [selectedProperties, setSelectedProperties],\n );\n\n const clearSearch = useCallback(() => {\n setSearchInput(\"\");\n setActiveSearchInput(\"\");\n setSearched(false);\n }, []);\n\n const startSearch = useCallback(() => {\n if (!searchInput) return;\n setActiveSearchInput(searchInput);\n setSearched(true);\n }, [searchInput]);\n\n const filteredProperties = useMemo(\n () =>\n propertiesMetaData.filter((p) =>\n [p.displayLabel, p.categoryLabel, p.actualECClassName].map((l) => l.toLowerCase()).some((l) => l.includes(activeSearchInput.toLowerCase())),\n ),\n [activeSearchInput, propertiesMetaData],\n );\n\n useEffect(() => {\n if (searchInput.length === 0) {\n setSearched(false);\n clearSearch();\n }\n }, [searchInput, setSearched, clearSearch]);\n\n return (\n <DndContext sensors={sensors} collisionDetection={closestCenter} onDragStart={handleDragStart} onDragEnd={handleDragEnd}>\n <Modal\n title={GroupingMappingWidget.translate(\"properties.selectionModalTitle\")}\n isOpen={showModal}\n onClose={() => {\n setShowModal(false);\n clearSearch();\n }}\n closeOnExternalClick={false}\n >\n <Split\n expandToMin={false}\n className=\"gmw-property-selection-container\"\n gutterAlign=\"center\"\n gutterSize={2}\n gutter={() => {\n // Expects HTMLElement\n const dragHangle = renderToStaticMarkup(\n <Icon className=\"gmw-gutter-drag-icon\" size=\"large\">\n <SvgMoreVerticalSmall />\n </Icon>,\n );\n const gutter = document.createElement(\"div\");\n gutter.className = `gmw-gutter`;\n gutter.innerHTML = dragHangle;\n return gutter;\n }}\n direction=\"horizontal\"\n >\n <Surface className=\"gmw-available-properties\" elevation={1}>\n <div className=\"gmw-available-properties-header\">\n <Label as=\"span\">{GroupingMappingWidget.translate(\"properties.available\")}</Label>\n <LabeledInput\n displayStyle=\"inline\"\n iconDisplayStyle=\"inline\"\n className=\"gmw-available-prop-search\"\n value={searchInput}\n size=\"small\"\n placeholder={GroupingMappingWidget.translate(\"common.search\")}\n onChange={(event) => {\n const {\n target: { value },\n } = event;\n setSearchInput(value);\n }}\n onKeyDown={(event) => {\n if (event.key === \"Enter\") {\n startSearch();\n }\n }}\n svgIcon={\n searched ? (\n <IconButton onClick={clearSearch} styleType=\"borderless\" title={GroupingMappingWidget.translate(\"properties.clearSearch\")}>\n <SvgClose />\n </IconButton>\n ) : (\n <IconButton onClick={startSearch} styleType=\"borderless\" title={GroupingMappingWidget.translate(\"properties.searchButton\")}>\n <SvgSearch />\n </IconButton>\n )\n }\n />\n </div>\n {filteredProperties.length === 0 ? (\n <div className=\"gmw-empty-selection\">\n <Text>{GroupingMappingWidget.translate(\"properties.noAvailable\")}</Text>\n </div>\n ) : (\n <div className=\"gmw-properties-list\">\n {filteredProperties.map((property) => (\n <GroupPropertyListItem\n key={property.key}\n content={`${property.displayLabel}`}\n title={`${property.actualECClassName}`}\n description={getLocalizedStringPresentation(property.categoryLabel)}\n selected={selectedProperties.some((p) => property.key === p.key)}\n onClick={() =>\n setSelectedProperties((sp) => (sp.some((p) => property.key === p.key) ? sp.filter((p) => property.key !== p.key) : [...sp, property]))\n }\n />\n ))}\n </div>\n )}\n </Surface>\n <Surface className=\"gmw-selected-properties\" elevation={1}>\n <Label as=\"span\">{GroupingMappingWidget.translate(\"properties.selected\")}</Label>\n {selectedProperties.length === 0 ? (\n <div className=\"gmw-empty-selection\">\n <Text>{GroupingMappingWidget.translate(\"properties.noSelected\")}</Text>\n <Text>{GroupingMappingWidget.translate(\"properties.addHint\")}</Text>\n </div>\n ) : (\n <div className=\"gmw-properties-list\">\n <SortableContext items={selectedProperties.map((p) => p.key)} strategy={verticalListSortingStrategy}>\n {selectedProperties.map((property) => (\n <SortableHorizontalTile\n key={property.key}\n id={property.key}\n content={`${property.displayLabel}`}\n title={`${property.actualECClassName}`}\n description={getLocalizedStringPresentation(property.categoryLabel)}\n action={\n <div>\n <IconButton\n styleType=\"borderless\"\n title={GroupingMappingWidget.translate(\"common.remove\")}\n onClick={() => {\n setSelectedProperties((sp) => sp.filter((p) => property.key !== p.key));\n }}\n >\n <SvgRemove />\n </IconButton>\n </div>\n }\n />\n ))}\n </SortableContext>\n </div>\n )}\n </Surface>\n </Split>\n <ModalButtonBar>\n <Button\n onClick={() => {\n setShowModal(false);\n clearSearch();\n }}\n styleType=\"high-visibility\"\n >\n {GroupingMappingWidget.translate(\"common.close\")}\n </Button>\n </ModalButtonBar>\n </Modal>\n <DragOverlay zIndex={9999}>\n {activeDragProperty ? (\n <GroupPropertyListItem\n content={`${activeDragProperty.displayLabel}`}\n title={`${activeDragProperty.actualECClassName}`}\n description={getLocalizedStringPresentation(activeDragProperty.categoryLabel)}\n action={\n <IconButton styleType=\"borderless\">\n <SvgRemove />\n </IconButton>\n }\n dragHandle={\n <Icon className=\"gmw-drag-icon\" size=\"large\">\n <SvgDragHandleVertical />\n </Icon>\n }\n />\n ) : null}\n </DragOverlay>\n </DndContext>\n );\n};\n"]}

package/lib/esm/components/Properties/GroupProperties/SaveModal.js CHANGED Viewed

@@ -4,12 +4,13 @@
  *--------------------------------------------------------------------------------------------*/
 import { Button, Modal, ModalButtonBar, Text } from "@itwin/itwinui-react";
 import React from "react";
+import { GroupingMappingWidget } from "../../../GroupingMappingWidget";
 export const SaveModal = ({ onSave, onClose, showSaveModal }) => {
     return (React.createElement(React.Fragment, null,
-        React.createElement(Modal, { title: "Confirm", modalRootId: "grouping-mapping-widget", isOpen: showSaveModal, onClose: onClose },
-            React.createElement(Text, { variant: "leading", as: "h3" }, "Are you sure you want to save this property with a new name? You may need to update this name in Custom Calculation formulas."),
+        React.createElement(Modal, { title: GroupingMappingWidget.translate("common.confirm"), modalRootId: "grouping-mapping-widget", isOpen: showSaveModal, onClose: onClose },
+            React.createElement(Text, { variant: "leading", as: "h3" }, GroupingMappingWidget.translate("shared.saveConfirm")),
             React.createElement(ModalButtonBar, null,
-                React.createElement(Button, { styleType: "high-visibility", onClick: onSave }, "Save"),
-                React.createElement(Button, { onClick: onClose, styleType: "default" }, "Cancel")))));
+                React.createElement(Button, { styleType: "high-visibility", onClick: onSave }, GroupingMappingWidget.translate("common.save")),
+                React.createElement(Button, { onClick: onClose, styleType: "default" }, GroupingMappingWidget.translate("common.cancel"))))));
 };
 //# sourceMappingURL=SaveModal.js.map

package/lib/esm/components/Properties/GroupProperties/SaveModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SaveModal.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/SaveModal.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,KAAK,MAAM,OAAO,CAAC;~~AAQ1B~~,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAkB,EAAE,EAAE;IAC9E,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,KAAK,~~EAAC~~,SAAS,~~EAAC~~,WAAW,EAAC,yBAAyB,EAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO;~~YAClG~~,oBAAC,IAAI,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAC,IAAI,~~oIAExB~~;YACP,oBAAC,cAAc;gBACb,oBAAC,MAAM,IAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,MAAM,~~WAE1C~~;gBACT,oBAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,SAAS,~~aAEpC~~,CACM,CACX,CACP,CACJ,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 { Button, Modal, ModalButtonBar, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\n\nexport interface SaveModalProps {\n onSave: () => void;\n onClose: () => void;\n showSaveModal: boolean;\n}\n\nexport const SaveModal = ({ onSave, onClose, showSaveModal }: SaveModalProps) => {\n return (\n <>\n <Modal title=\"~~Confirm~~\" modalRootId=\"grouping-mapping-widget\" isOpen={showSaveModal} onClose={onClose}>\n <Text variant=\"leading\" as=\"h3\">\n ~~Are you sure you want to save this property with a new name? You may need to update this name in Custom Calculation formulas.\~~n </Text>\n <ModalButtonBar>\n <Button styleType=\"high-visibility\" onClick={onSave}>\n ~~Save~~\n </Button>\n <Button onClick={onClose} styleType=\"default\">\n ~~Cancel~~\n </Button>\n </ModalButtonBar>\n </Modal>\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"SaveModal.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/SaveModal.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAQvE,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAkB,EAAE,EAAE;IAC9E,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,KAAK,EAAE,qBAAqB,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,WAAW,EAAC,yBAAyB,EAAC,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO;YAC5I,oBAAC,IAAI,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAC,IAAI,IAC5B,qBAAqB,CAAC,SAAS,CAAC,oBAAoB,CAAC,CACjD;YACP,oBAAC,cAAc;gBACb,oBAAC,MAAM,IAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,MAAM,IAChD,qBAAqB,CAAC,SAAS,CAAC,aAAa,CAAC,CACxC;gBACT,oBAAC,MAAM,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,SAAS,IAC1C,qBAAqB,CAAC,SAAS,CAAC,eAAe,CAAC,CAC1C,CACM,CACX,CACP,CACJ,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 { Button, Modal, ModalButtonBar, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport { GroupingMappingWidget } from \"../../../GroupingMappingWidget\";\n\nexport interface SaveModalProps {\n onSave: () => void;\n onClose: () => void;\n showSaveModal: boolean;\n}\n\nexport const SaveModal = ({ onSave, onClose, showSaveModal }: SaveModalProps) => {\n return (\n <>\n <Modal title={GroupingMappingWidget.translate(\"common.confirm\")} modalRootId=\"grouping-mapping-widget\" isOpen={showSaveModal} onClose={onClose}>\n <Text variant=\"leading\" as=\"h3\">\n {GroupingMappingWidget.translate(\"shared.saveConfirm\")}\n </Text>\n <ModalButtonBar>\n <Button styleType=\"high-visibility\" onClick={onSave}>\n {GroupingMappingWidget.translate(\"common.save\")}\n </Button>\n <Button onClick={onClose} styleType=\"default\">\n {GroupingMappingWidget.translate(\"common.cancel\")}\n </Button>\n </ModalButtonBar>\n </Modal>\n </>\n );\n};\n"]}

package/lib/esm/components/Properties/GroupProperties/SortableHorizontalTile.js CHANGED Viewed

@@ -8,6 +8,7 @@ import { CSS } from "@dnd-kit/utilities";
 import { SvgDragHandleVertical } from "@itwin/itwinui-icons-react";
 import { Icon } from "@itwin/itwinui-react";
 import { GroupPropertyListItem } from "./GroupPropertyListItem";
+import { GroupingMappingWidget } from "../../../GroupingMappingWidget";
 export const SortableHorizontalTile = ({ id, ...props }) => {
     const { attributes, listeners, isDragging, setNodeRef, transform, transition } = useSortable({ id });
     const style = {
@@ -24,7 +25,7 @@ export const SortableHorizontalTile = ({ id, ...props }) => {
         };
     }, [isDragging]);
     return (React.createElement("div", { ref: setNodeRef, ...attributes, style: { ...style, visibility: isDragging ? "hidden" : "visible" } },
-        React.createElement(GroupPropertyListItem, { dragHandle: React.createElement(Icon, { className: "gmw-drag-icon", size: "large", style: { cursor: "grab" }, title: "Drag & Drop", ...listeners },
+        React.createElement(GroupPropertyListItem, { dragHandle: React.createElement(Icon, { className: "gmw-drag-icon", size: "large", style: { cursor: "grab" }, title: GroupingMappingWidget.translate("properties.dragAndDrop"), ...listeners },
                 React.createElement(SvgDragHandleVertical, null)), ...props })));
 };
 //# sourceMappingURL=SortableHorizontalTile.js.map

package/lib/esm/components/Properties/GroupProperties/SortableHorizontalTile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SortableHorizontalTile.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/SortableHorizontalTile.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAE5C,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;~~AAMhE~~,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAE,EAAE,EAAE,GAAG,KAAK,EAA+B,EAAE,EAAE;IACtF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,WAAW,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;IAErG,MAAM,KAAK,GAAG;QACZ,SAAS,EAAE,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5C,UAAU;KACX,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,UAAU,EAAE;YACf,OAAO;SACR;QACD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,CAAC;QACxC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,CAAC;QAClC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,6BAAK,GAAG,EAAE,UAAU,KAAM,UAAU,EAAE,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAAE;QACtG,oBAAC,qBAAqB,IACpB,UAAU,EACR,oBAAC,IAAI,IAAC,SAAS,EAAC,eAAe,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,KAAK,~~EAAC~~,~~aAAa~~,~~KAAK~~,SAAS;~~gBACvG~~,oBAAC,qBAAqB,OAAG,CACpB,KAEL,KAAK,GACT,CACE,CACP,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 React, { useEffect } from \"react\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SvgDragHandleVertical } from \"@itwin/itwinui-icons-react\";\nimport { Icon } from \"@itwin/itwinui-react\";\nimport type { GroupPropertyListItemProps } from \"./GroupPropertyListItem\";\nimport { GroupPropertyListItem } from \"./GroupPropertyListItem\";\n\ninterface SortableHorizontalTileProps extends GroupPropertyListItemProps {\n id: string;\n}\n\nexport const SortableHorizontalTile = ({ id, ...props }: SortableHorizontalTileProps) => {\n const { attributes, listeners, isDragging, setNodeRef, transform, transition } = useSortable({ id });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\n\n useEffect(() => {\n if (!isDragging) {\n return;\n }\n document.body.style.cursor = \"grabbing\";\n return () => {\n document.body.style.cursor = \"\";\n };\n }, [isDragging]);\n\n return (\n <div ref={setNodeRef} {...attributes} style={{ ...style, visibility: isDragging ? \"hidden\" : \"visible\" }}>\n <GroupPropertyListItem\n dragHandle={\n <Icon className=\"gmw-drag-icon\" size=\"large\" style={{ cursor: \"grab\" }} title=\"~~Drag & Drop~~\" {...listeners}>\n <SvgDragHandleVertical />\n </Icon>\n }\n {...props}\n />\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"SortableHorizontalTile.js","sourceRoot":"","sources":["../../../../../src/components/Properties/GroupProperties/SortableHorizontalTile.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAE5C,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAMvE,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAE,EAAE,EAAE,GAAG,KAAK,EAA+B,EAAE,EAAE;IACtF,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,WAAW,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;IAErG,MAAM,KAAK,GAAG;QACZ,SAAS,EAAE,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5C,UAAU;KACX,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,UAAU,EAAE;YACf,OAAO;SACR;QACD,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,CAAC;QACxC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,CAAC;QAClC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL,6BAAK,GAAG,EAAE,UAAU,KAAM,UAAU,EAAE,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAAE;QACtG,oBAAC,qBAAqB,IACpB,UAAU,EACR,oBAAC,IAAI,IAAC,SAAS,EAAC,eAAe,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,qBAAqB,CAAC,SAAS,CAAC,wBAAwB,CAAC,KAAM,SAAS;gBACrJ,oBAAC,qBAAqB,OAAG,CACpB,KAEL,KAAK,GACT,CACE,CACP,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 React, { useEffect } from \"react\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SvgDragHandleVertical } from \"@itwin/itwinui-icons-react\";\nimport { Icon } from \"@itwin/itwinui-react\";\nimport type { GroupPropertyListItemProps } from \"./GroupPropertyListItem\";\nimport { GroupPropertyListItem } from \"./GroupPropertyListItem\";\nimport { GroupingMappingWidget } from \"../../../GroupingMappingWidget\";\n\ninterface SortableHorizontalTileProps extends GroupPropertyListItemProps {\n id: string;\n}\n\nexport const SortableHorizontalTile = ({ id, ...props }: SortableHorizontalTileProps) => {\n const { attributes, listeners, isDragging, setNodeRef, transform, transition } = useSortable({ id });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\n\n useEffect(() => {\n if (!isDragging) {\n return;\n }\n document.body.style.cursor = \"grabbing\";\n return () => {\n document.body.style.cursor = \"\";\n };\n }, [isDragging]);\n\n return (\n <div ref={setNodeRef} {...attributes} style={{ ...style, visibility: isDragging ? \"hidden\" : \"visible\" }}>\n <GroupPropertyListItem\n dragHandle={\n <Icon className=\"gmw-drag-icon\" size=\"large\" style={{ cursor: \"grab\" }} title={GroupingMappingWidget.translate(\"properties.dragAndDrop\")} {...listeners}>\n <SvgDragHandleVertical />\n </Icon>\n }\n {...props}\n />\n </div>\n );\n};\n"]}

package/lib/esm/components/Properties/PropertyMenuWithVisualization.js CHANGED Viewed

@@ -9,6 +9,7 @@ import { IconButton, InformationPanelWrapper } from "@itwin/itwinui-react";
 import { GroupInformationPanel } from "./GroupInformationPanel";
 import { SvgProperties } from "@itwin/itwinui-icons-react";
 import "./PropertyMenuWithVisualization.scss";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 /**
  * Component to display a property menu with visualization.
  * @public
@@ -18,7 +19,7 @@ export const PropertyMenuWithVisualization = ({ group, color, hideRefreshIcon, d
     return (React.createElement(InformationPanelWrapper, { className: "gmw-property-menu-vis-wrapper" },
         React.createElement("div", { className: "gmw-property-menu-vis-toolbar" },
             React.createElement(GroupColorToggle, { group: group, color: color, labelPosition: "left", disableZoom: disableZoom }),
-            React.createElement(IconButton, { styleType: "borderless", onClick: () => setIsInformationPanelOpen(true), title: "Group Information" },
+            React.createElement(IconButton, { styleType: "borderless", onClick: () => setIsInformationPanelOpen(true), title: GroupingMappingWidget.translate("properties.groupInformation") },
                 React.createElement(SvgProperties, null))),
         React.createElement(PropertyMenu, { group: group, hideRefreshIcon: hideRefreshIcon, ...rest }),
         React.createElement(GroupInformationPanel, { isOpen: isInformationPanelOpen, onClose: () => setIsInformationPanelOpen(false), query: group.query, groupName: group.groupName })));

package/lib/esm/components/Properties/PropertyMenuWithVisualization.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PropertyMenuWithVisualization.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyMenuWithVisualization.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,sCAAsC,CAAC;~~AAY9C~~;;;GAGG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,IAAI,EAAsC,EAAE,EAAE;IAC3I,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAErF,OAAO,CACL,oBAAC,uBAAuB,IAAC,SAAS,EAAC,+BAA+B;QAChE,6BAAK,SAAS,EAAC,+BAA+B;YAC5C,oBAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAC,MAAM,EAAC,WAAW,EAAE,WAAW,GAAI;YAC/F,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,KAAK,~~EAAC~~,~~mBAAmB~~;~~gBAC1G~~,oBAAC,aAAa,OAAG,CACN,CACT;QACN,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,eAAe,KAAM,IAAI,GAAI;QAC1E,oBAAC,qBAAqB,IAAC,MAAM,EAAE,sBAAsB,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,GAAI,CAClI,CAC3B,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 React, { useState } from \"react\";\nimport type { PropertyMenuProps } from \"./PropertyMenu\";\nimport { PropertyMenu } from \"./PropertyMenu\";\nimport { GroupColorToggle } from \"./GroupColorToggle\";\nimport { IconButton, InformationPanelWrapper } from \"@itwin/itwinui-react\";\nimport { GroupInformationPanel } from \"./GroupInformationPanel\";\nimport { SvgProperties } from \"@itwin/itwinui-icons-react\";\nimport \"./PropertyMenuWithVisualization.scss\";\n\n/*\n Properties for the {@link PropertyMenuWithVisualization} component.\n * @public\n /\nexport interface PropertyMenuWithVisualizationProps extends PropertyMenuProps {\n color: string;\n disableZoom?: boolean;\n onGroupPropertyDelete?: () => void;\n}\n\n/\n Component to display a property menu with visualization.\n * @public\n */\nexport const PropertyMenuWithVisualization = ({ group, color, hideRefreshIcon, disableZoom, ...rest }: PropertyMenuWithVisualizationProps) => {\n const [isInformationPanelOpen, setIsInformationPanelOpen] = useState<boolean>(false);\n\n return (\n <InformationPanelWrapper className=\"gmw-property-menu-vis-wrapper\">\n <div className=\"gmw-property-menu-vis-toolbar\">\n <GroupColorToggle group={group} color={color} labelPosition=\"left\" disableZoom={disableZoom} />\n <IconButton styleType=\"borderless\" onClick={() => setIsInformationPanelOpen(true)} title=\"~~Group Information~~\">\n <SvgProperties />\n </IconButton>\n </div>\n <PropertyMenu group={group} hideRefreshIcon={hideRefreshIcon} {...rest} />\n <GroupInformationPanel isOpen={isInformationPanelOpen} onClose={() => setIsInformationPanelOpen(false)} query={group.query} groupName={group.groupName} />\n </InformationPanelWrapper>\n );\n};\n"]}
1	+ {"version":3,"file":"PropertyMenuWithVisualization.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyMenuWithVisualization.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAC3E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,sCAAsC,CAAC;AAC9C,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAYpE;;;GAGG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,GAAG,IAAI,EAAsC,EAAE,EAAE;IAC3I,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAErF,OAAO,CACL,oBAAC,uBAAuB,IAAC,SAAS,EAAC,+BAA+B;QAChE,6BAAK,SAAS,EAAC,+BAA+B;YAC5C,oBAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAC,MAAM,EAAC,WAAW,EAAE,WAAW,GAAI;YAC/F,oBAAC,UAAU,IAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,qBAAqB,CAAC,SAAS,CAAC,6BAA6B,CAAC;gBACtJ,oBAAC,aAAa,OAAG,CACN,CACT;QACN,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,eAAe,KAAM,IAAI,GAAI;QAC1E,oBAAC,qBAAqB,IAAC,MAAM,EAAE,sBAAsB,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,GAAI,CAClI,CAC3B,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 React, { useState } from \"react\";\nimport type { PropertyMenuProps } from \"./PropertyMenu\";\nimport { PropertyMenu } from \"./PropertyMenu\";\nimport { GroupColorToggle } from \"./GroupColorToggle\";\nimport { IconButton, InformationPanelWrapper } from \"@itwin/itwinui-react\";\nimport { GroupInformationPanel } from \"./GroupInformationPanel\";\nimport { SvgProperties } from \"@itwin/itwinui-icons-react\";\nimport \"./PropertyMenuWithVisualization.scss\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\n\n/*\n Properties for the {@link PropertyMenuWithVisualization} component.\n * @public\n /\nexport interface PropertyMenuWithVisualizationProps extends PropertyMenuProps {\n color: string;\n disableZoom?: boolean;\n onGroupPropertyDelete?: () => void;\n}\n\n/\n Component to display a property menu with visualization.\n * @public\n */\nexport const PropertyMenuWithVisualization = ({ group, color, hideRefreshIcon, disableZoom, ...rest }: PropertyMenuWithVisualizationProps) => {\n const [isInformationPanelOpen, setIsInformationPanelOpen] = useState<boolean>(false);\n\n return (\n <InformationPanelWrapper className=\"gmw-property-menu-vis-wrapper\">\n <div className=\"gmw-property-menu-vis-toolbar\">\n <GroupColorToggle group={group} color={color} labelPosition=\"left\" disableZoom={disableZoom} />\n <IconButton styleType=\"borderless\" onClick={() => setIsInformationPanelOpen(true)} title={GroupingMappingWidget.translate(\"properties.groupInformation\")}>\n <SvgProperties />\n </IconButton>\n </div>\n <PropertyMenu group={group} hideRefreshIcon={hideRefreshIcon} {...rest} />\n <GroupInformationPanel isOpen={isInformationPanelOpen} onClose={() => setIsInformationPanelOpen(false)} query={group.query} groupName={group.groupName} />\n </InformationPanelWrapper>\n );\n};\n"]}

package/lib/esm/components/Properties/PropertyTable.js CHANGED Viewed

@@ -7,6 +7,7 @@ import React, { useCallback, useMemo, useState } from "react";
 import DeleteModal from "../SharedComponents/DeleteModal";
 import { PropertyTableToolbar } from "./PropertyTableToolbar";
 import "./PropertyTable.scss";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 export const PropertyTable = ({ propertyType, columnsFactory, data, isLoading, onClickAdd, refreshProperties, deleteProperty, hideRefreshIcon, onGroupPropertyDelete, }) => {
     const [showDeleteModal, setShowDeleteModal] = useState(undefined);
     const handleDeleteProperty = useCallback(async () => {
@@ -22,7 +23,7 @@ export const PropertyTable = ({ propertyType, columnsFactory, data, isLoading, o
     const memoizedColumns = useMemo(() => columnsFactory(handleShowDeleteModal), [columnsFactory, handleShowDeleteModal]);
     return (React.createElement("div", { className: "gmw-property-table-container" },
         React.createElement(PropertyTableToolbar, { propertyType: propertyType, onClickAddProperty: onClickAdd, refreshProperties: refreshProperties, isLoading: isLoading, hideRefreshIcon: hideRefreshIcon }),
-        React.createElement(Table, { data: isLoading ? [] : data, density: "extra-condensed", columns: memoizedColumns, emptyTableContent: `No ${propertyType} Properties`, isSortable: true, isLoading: isLoading }),
+        React.createElement(Table, { data: isLoading ? [] : data, density: "extra-condensed", columns: memoizedColumns, emptyTableContent: GroupingMappingWidget.translate("properties.noProperties", { propertyType }), isSortable: true, isLoading: isLoading }),
         showDeleteModal && React.createElement(DeleteModal, { entityName: showDeleteModal.propertyName, onClose: handleCloseDeleteModal, onDelete: handleDeleteProperty })));
 };
 //# sourceMappingURL=PropertyTable.js.map

package/lib/esm/components/Properties/PropertyTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PropertyTable.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyTable.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG9D,OAAO,WAAW,MAAM,iCAAiC,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,sBAAsB,CAAC;~~AAmB9B~~,MAAM,CAAC,MAAM,aAAa,GAAG,CAA8B,EACzD,YAAY,EACZ,cAAc,EACd,IAAI,EACJ,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,qBAAqB,GACC,EAAE,EAAE;IAC1B,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAgB,SAAS,CAAC,CAAC;IAEjF,MAAM,oBAAoB,GAAG,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,MAAM,cAAc,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;QAChD,qBAAqB,EAAE,EAAE,CAAC;IAC5B,CAAC,EAAE,CAAC,cAAc,EAAE,eAAe,EAAE,EAAE,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEjE,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,QAAW,EAAE,EAAE;QACxD,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAClC,kBAAkB,CAAC,SAAS,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,qBAAqB,CAAC,EAAE,CAAC,cAAc,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEtH,OAAO,CACL,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,oBAAoB,IACnB,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,UAAU,EAC9B,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,GAChC;QACF,oBAAC,KAAK,IACJ,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAC3B,OAAO,EAAC,iBAAiB,EACzB,OAAO,EAAE,eAAe,EACxB,iBAAiB,EAAE,~~MAAM~~,YAAY,~~aAAa~~,~~EAClD~~,UAAU,QACV,SAAS,EAAE,SAAS,GACpB;QACD,eAAe,IAAI,oBAAC,WAAW,IAAC,UAAU,EAAE,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,sBAAsB,EAAE,QAAQ,EAAE,oBAAoB,GAAI,CAC1I,CACP,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 { Table } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useMemo, useState } from \"react\";\nimport type { Column } from \"react-table\";\nimport type { CreateTypeFromInterface } from \"../../common/utils\";\nimport DeleteModal from \"../SharedComponents/DeleteModal\";\nimport { PropertyTableToolbar } from \"./PropertyTableToolbar\";\nimport \"./PropertyTable.scss\";\n\nexport interface PropertyTableItem {\n propertyName: string;\n id: string;\n}\n\nexport interface PropertyTableProps<T extends PropertyTableItem> {\n propertyType: string;\n columnsFactory: (handleShowDeleteModal: (value: T) => void) => Array<Column<T>>;\n data: T[];\n isLoading: boolean;\n onClickAdd?: () => void;\n refreshProperties: () => Promise<void>;\n deleteProperty: (propertyId: string) => Promise<void>;\n hideRefreshIcon?: boolean;\n onGroupPropertyDelete?: () => void;\n}\n\nexport const PropertyTable = <T extends PropertyTableItem>({\n propertyType,\n columnsFactory,\n data,\n isLoading,\n onClickAdd,\n refreshProperties,\n deleteProperty,\n hideRefreshIcon,\n onGroupPropertyDelete,\n}: PropertyTableProps<T>) => {\n const [showDeleteModal, setShowDeleteModal] = useState<T \| undefined>(undefined);\n\n const handleDeleteProperty = useCallback(async () => {\n await deleteProperty(showDeleteModal?.id ?? \"\");\n onGroupPropertyDelete?.();\n }, [deleteProperty, showDeleteModal?.id, onGroupPropertyDelete]);\n\n const handleShowDeleteModal = useCallback((property: T) => {\n setShowDeleteModal(property);\n }, []);\n\n const handleCloseDeleteModal = () => {\n setShowDeleteModal(undefined);\n };\n\n const memoizedColumns = useMemo(() => columnsFactory(handleShowDeleteModal), [columnsFactory, handleShowDeleteModal]);\n\n return (\n <div className=\"gmw-property-table-container\">\n <PropertyTableToolbar\n propertyType={propertyType}\n onClickAddProperty={onClickAdd}\n refreshProperties={refreshProperties}\n isLoading={isLoading}\n hideRefreshIcon={hideRefreshIcon}\n />\n <Table<CreateTypeFromInterface<T>>\n data={isLoading ? [] : data}\n density=\"extra-condensed\"\n columns={memoizedColumns}\n emptyTableContent={~~`No~~ ${propertyType} ~~Properties`~~}\n isSortable\n isLoading={isLoading}\n />\n {showDeleteModal && <DeleteModal entityName={showDeleteModal.propertyName} onClose={handleCloseDeleteModal} onDelete={handleDeleteProperty} />}\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"PropertyTable.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyTable.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG9D,OAAO,WAAW,MAAM,iCAAiC,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,sBAAsB,CAAC;AAC9B,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAmBpE,MAAM,CAAC,MAAM,aAAa,GAAG,CAA8B,EACzD,YAAY,EACZ,cAAc,EACd,IAAI,EACJ,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,qBAAqB,GACC,EAAE,EAAE;IAC1B,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAgB,SAAS,CAAC,CAAC;IAEjF,MAAM,oBAAoB,GAAG,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,MAAM,cAAc,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;QAChD,qBAAqB,EAAE,EAAE,CAAC;IAC5B,CAAC,EAAE,CAAC,cAAc,EAAE,eAAe,EAAE,EAAE,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEjE,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,QAAW,EAAE,EAAE;QACxD,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAClC,kBAAkB,CAAC,SAAS,CAAC,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,qBAAqB,CAAC,EAAE,CAAC,cAAc,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEtH,OAAO,CACL,6BAAK,SAAS,EAAC,8BAA8B;QAC3C,oBAAC,oBAAoB,IACnB,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,UAAU,EAC9B,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,GAChC;QACF,oBAAC,KAAK,IACJ,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAC3B,OAAO,EAAC,iBAAiB,EACzB,OAAO,EAAE,eAAe,EACxB,iBAAiB,EAAE,qBAAqB,CAAC,SAAS,CAAC,yBAAyB,EAAE,EAAE,YAAY,EAAE,CAAC,EAC/F,UAAU,QACV,SAAS,EAAE,SAAS,GACpB;QACD,eAAe,IAAI,oBAAC,WAAW,IAAC,UAAU,EAAE,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,sBAAsB,EAAE,QAAQ,EAAE,oBAAoB,GAAI,CAC1I,CACP,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 { Table } from \"@itwin/itwinui-react\";\nimport React, { useCallback, useMemo, useState } from \"react\";\nimport type { Column } from \"react-table\";\nimport type { CreateTypeFromInterface } from \"../../common/utils\";\nimport DeleteModal from \"../SharedComponents/DeleteModal\";\nimport { PropertyTableToolbar } from \"./PropertyTableToolbar\";\nimport \"./PropertyTable.scss\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\n\nexport interface PropertyTableItem {\n propertyName: string;\n id: string;\n}\n\nexport interface PropertyTableProps<T extends PropertyTableItem> {\n propertyType: string;\n columnsFactory: (handleShowDeleteModal: (value: T) => void) => Array<Column<T>>;\n data: T[];\n isLoading: boolean;\n onClickAdd?: () => void;\n refreshProperties: () => Promise<void>;\n deleteProperty: (propertyId: string) => Promise<void>;\n hideRefreshIcon?: boolean;\n onGroupPropertyDelete?: () => void;\n}\n\nexport const PropertyTable = <T extends PropertyTableItem>({\n propertyType,\n columnsFactory,\n data,\n isLoading,\n onClickAdd,\n refreshProperties,\n deleteProperty,\n hideRefreshIcon,\n onGroupPropertyDelete,\n}: PropertyTableProps<T>) => {\n const [showDeleteModal, setShowDeleteModal] = useState<T \| undefined>(undefined);\n\n const handleDeleteProperty = useCallback(async () => {\n await deleteProperty(showDeleteModal?.id ?? \"\");\n onGroupPropertyDelete?.();\n }, [deleteProperty, showDeleteModal?.id, onGroupPropertyDelete]);\n\n const handleShowDeleteModal = useCallback((property: T) => {\n setShowDeleteModal(property);\n }, []);\n\n const handleCloseDeleteModal = () => {\n setShowDeleteModal(undefined);\n };\n\n const memoizedColumns = useMemo(() => columnsFactory(handleShowDeleteModal), [columnsFactory, handleShowDeleteModal]);\n\n return (\n <div className=\"gmw-property-table-container\">\n <PropertyTableToolbar\n propertyType={propertyType}\n onClickAddProperty={onClickAdd}\n refreshProperties={refreshProperties}\n isLoading={isLoading}\n hideRefreshIcon={hideRefreshIcon}\n />\n <Table<CreateTypeFromInterface<T>>\n data={isLoading ? [] : data}\n density=\"extra-condensed\"\n columns={memoizedColumns}\n emptyTableContent={GroupingMappingWidget.translate(\"properties.noProperties\", { propertyType })}\n isSortable\n isLoading={isLoading}\n />\n {showDeleteModal && <DeleteModal entityName={showDeleteModal.propertyName} onClose={handleCloseDeleteModal} onDelete={handleDeleteProperty} />}\n </div>\n );\n};\n"]}

package/lib/esm/components/Properties/PropertyTableToolbar.js CHANGED Viewed

@@ -6,11 +6,9 @@ import React from "react";
 import { SvgAdd, SvgRefresh } from "@itwin/itwinui-icons-react";
 import { Button, IconButton } from "@itwin/itwinui-react";
 import "./PropertyTableToolbar.scss";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 export const PropertyTableToolbar = ({ propertyType, onClickAddProperty, refreshProperties, isLoading, hideRefreshIcon }) => (React.createElement("div", { className: "gmw-property-table-toolbar" },
-    onClickAddProperty && (React.createElement(Button, { startIcon: React.createElement(SvgAdd, null), styleType: "high-visibility", onClick: onClickAddProperty },
-        "Add ",
-        propertyType,
-        " Property")),
-    !hideRefreshIcon && (React.createElement(IconButton, { title: "Refresh", className: "gmw-property-table-refresh-button", onClick: refreshProperties, disabled: isLoading, styleType: "borderless" },
+    onClickAddProperty && (React.createElement(Button, { startIcon: React.createElement(SvgAdd, null), styleType: "high-visibility", onClick: onClickAddProperty }, GroupingMappingWidget.translate("properties.addProperty", { propertyType }))),
+    !hideRefreshIcon && (React.createElement(IconButton, { title: GroupingMappingWidget.translate("common.refresh"), className: "gmw-property-table-refresh-button", onClick: refreshProperties, disabled: isLoading, styleType: "borderless" },
         React.createElement(SvgRefresh, null)))));
 //# sourceMappingURL=PropertyTableToolbar.js.map

package/lib/esm/components/Properties/PropertyTableToolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PropertyTableToolbar.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyTableToolbar.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,6BAA6B,CAAC;~~AAUrC~~,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,SAAS,EAAE,eAAe,EAA6B,EAAE,EAAE,CAAC,CACtJ,6BAAK,SAAS,EAAC,4BAA4B;IACxC,kBAAkB,IAAI,CACrB,oBAAC,MAAM,IAAC,SAAS,EAAE,oBAAC,MAAM,OAAG,EAAE,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,kBAAkB~~;;QAC/E~~,YAAY~~;oBACV~~,CACV;IACA,CAAC,eAAe,IAAI,CACnB,oBAAC,UAAU,IAAC,KAAK,~~EAAC~~,SAAS,~~EAAC~~,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAC,YAAY;~~QAC/I~~,oBAAC,UAAU,OAAG,CACH,CACd,CACG,CACP,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 React from \"react\";\nimport { SvgAdd, SvgRefresh } from \"@itwin/itwinui-icons-react\";\nimport { Button, IconButton } from \"@itwin/itwinui-react\";\nimport \"./PropertyTableToolbar.scss\";\n\nexport interface PropertyTableToolbarProps {\n propertyType: string;\n onClickAddProperty?: () => void;\n refreshProperties: () => void;\n isLoading: boolean;\n hideRefreshIcon?: boolean;\n}\n\nexport const PropertyTableToolbar = ({ propertyType, onClickAddProperty, refreshProperties, isLoading, hideRefreshIcon }: PropertyTableToolbarProps) => (\n <div className=\"gmw-property-table-toolbar\">\n {onClickAddProperty && (\n <Button startIcon={<SvgAdd />} styleType=\"high-visibility\" onClick={onClickAddProperty}>\n ~~Add~~ {propertyType} ~~Property~~\n </Button>\n )}\n {!hideRefreshIcon && (\n <IconButton title=\"~~Refresh~~\" className=\"gmw-property-table-refresh-button\" onClick={refreshProperties} disabled={isLoading} styleType=\"borderless\">\n <SvgRefresh />\n </IconButton>\n )}\n </div>\n);\n"]}
1	+ {"version":3,"file":"PropertyTableToolbar.js","sourceRoot":"","sources":["../../../../src/components/Properties/PropertyTableToolbar.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,6BAA6B,CAAC;AACrC,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAUpE,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,SAAS,EAAE,eAAe,EAA6B,EAAE,EAAE,CAAC,CACtJ,6BAAK,SAAS,EAAC,4BAA4B;IACxC,kBAAkB,IAAI,CACrB,oBAAC,MAAM,IAAC,SAAS,EAAE,oBAAC,MAAM,OAAG,EAAE,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,kBAAkB,IACnF,qBAAqB,CAAC,SAAS,CAAC,wBAAwB,EAAE,EAAE,YAAY,EAAE,CAAC,CACrE,CACV;IACA,CAAC,eAAe,IAAI,CACnB,oBAAC,UAAU,IAAC,KAAK,EAAE,qBAAqB,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,SAAS,EAAC,mCAAmC,EAAC,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAC,YAAY;QACzL,oBAAC,UAAU,OAAG,CACH,CACd,CACG,CACP,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 React from \"react\";\nimport { SvgAdd, SvgRefresh } from \"@itwin/itwinui-icons-react\";\nimport { Button, IconButton } from \"@itwin/itwinui-react\";\nimport \"./PropertyTableToolbar.scss\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\n\nexport interface PropertyTableToolbarProps {\n propertyType: string;\n onClickAddProperty?: () => void;\n refreshProperties: () => void;\n isLoading: boolean;\n hideRefreshIcon?: boolean;\n}\n\nexport const PropertyTableToolbar = ({ propertyType, onClickAddProperty, refreshProperties, isLoading, hideRefreshIcon }: PropertyTableToolbarProps) => (\n <div className=\"gmw-property-table-toolbar\">\n {onClickAddProperty && (\n <Button startIcon={<SvgAdd />} styleType=\"high-visibility\" onClick={onClickAddProperty}>\n {GroupingMappingWidget.translate(\"properties.addProperty\", { propertyType })}\n </Button>\n )}\n {!hideRefreshIcon && (\n <IconButton title={GroupingMappingWidget.translate(\"common.refresh\")} className=\"gmw-property-table-refresh-button\" onClick={refreshProperties} disabled={isLoading} styleType=\"borderless\">\n <SvgRefresh />\n </IconButton>\n )}\n </div>\n);\n"]}

package/lib/esm/components/Properties/hooks/useValidator.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import SimpleReactValidator from "simple-react-validator";
-export declare const Validators: {
+export declare const getValidators: () => {
     NoDuplicateUnderscore: {
         message: string;
         rule: (val: string) => boolean;
@@ -18,7 +18,7 @@ export declare const Validators: {
     };
 };
 export declare const NAME_REQUIREMENTS = "required|NoDuplicateUnderscore|OnlyBeginsWithLetterOrUnderscore|FollowedByLettersUnderscoresAndDigits|CharLimit";
-export declare const Messages: {
+export declare const getMessages: () => {
     required: string;
 };
 declare const useValidator: (customMessage?: {

package/lib/esm/components/Properties/hooks/useValidator.js CHANGED Viewed

@@ -4,37 +4,38 @@
  *--------------------------------------------------------------------------------------------*/
 import { useState } from "react";
 import SimpleReactValidator from "simple-react-validator";
-export const Validators = {
+import { GroupingMappingWidget } from "../../../GroupingMappingWidget";
+export const getValidators = () => ({
     NoDuplicateUnderscore: {
-        message: 'Remove duplicate "_"',
+        message: GroupingMappingWidget.translate("validation.noDuplicateUnderscore"),
         rule: (val) => {
             return !val.match(/__+/i);
         },
     },
     OnlyBeginsWithLetterOrUnderscore: {
-        message: "Name can only start with a letter or underscore.",
+        message: GroupingMappingWidget.translate("validation.startsWithLetterOrUnderscore"),
         rule: (val) => {
             const regexPattern = new RegExp(/^[\p{L}\p{Nl}_]+/u);
             return regexPattern.test(val);
         },
     },
     FollowedByLettersUnderscoresAndDigits: {
-        message: "Name can only contain letters, underscores, or digits",
+        message: GroupingMappingWidget.translate("validation.onlyLettersUnderscoresDigits"),
         rule: (val) => {
             const regexPattern = new RegExp(/^[\p{L}\p{Nl}\p{Nd}\p{Mn}\p{Mc}\p{Pc}\p{Cf}]+$/u);
             return regexPattern.test(val);
         },
     },
     CharLimit: {
-        message: "There is an 128 character limit.",
+        message: GroupingMappingWidget.translate("validation.charLimit"),
         rule: (val) => {
             return val.length <= 128;
         },
     },
-};
+});
 export const NAME_REQUIREMENTS = "required|NoDuplicateUnderscore|OnlyBeginsWithLetterOrUnderscore|FollowedByLettersUnderscoresAndDigits|CharLimit";
-export const Messages = { required: "This field is required." };
-const useValidator = (customMessage = Messages, customValidator = Validators) => {
+export const getMessages = () => ({ required: GroupingMappingWidget.translate("validation.required") });
+const useValidator = (customMessage = getMessages(), customValidator = getValidators()) => {
     const [show, setShow] = useState(false);
     const validator = new SimpleReactValidator({
         messages: customMessage,

package/lib/esm/components/Properties/hooks/useValidator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useValidator.js","sourceRoot":"","sources":["../../../../../src/components/Properties/hooks/useValidator.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;~~AAE1D~~,MAAM,CAAC,MAAM,~~UAAU~~,GAAG;~~IACxB~~,qBAAqB,EAAE;QACrB,OAAO,EAAE,~~sBAAsB~~;~~QAC/B~~,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC;KACF;IACD,gCAAgC,EAAE;QAChC,OAAO,EAAE,~~kDAAkD~~;~~QAC3D~~,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,MAAM,YAAY,GAAG,IAAI,MAAM,CAAC,mBAAmB,CAAC,CAAC;YACrD,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,CAAC;KACF;IACD,qCAAqC,EAAE;QACrC,OAAO,EAAE,~~uDAAuD~~;~~QAChE~~,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,MAAM,YAAY,GAAG,IAAI,MAAM,CAAC,iDAAiD,CAAC,CAAC;YACnF,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,CAAC;KACF;IACD,SAAS,EAAE;QACT,OAAO,EAAE,~~kCAAkC~~;~~QAC3C~~,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,OAAO,GAAG,CAAC,MAAM,IAAI,GAAG,CAAC;QAC3B,CAAC;KACF;CACF,CAAC;~~AAEF~~,MAAM,CAAC,MAAM,iBAAiB,GAAG,iHAAiH,CAAC;AAEnJ,MAAM,CAAC,MAAM,~~QAAQ~~,GAAG,EAAE,QAAQ,EAAE,~~yBAAyB~~,EAAE,CAAC;~~AAEhE~~,MAAM,YAAY,GAAG,CAAC,aAAa,GAAG,~~QAAQ~~,EAAE,eAAe,GAAG,~~UAAU~~,EAAyE,EAAE;~~IACrJ~~,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,SAAS,GAAG,IAAI,oBAAoB,CAAC;QACzC,QAAQ,EAAE,aAAa;QACvB,UAAU,EAAE,eAAe;KAC5B,CAAC,CAAC;IAEH,IAAI,IAAI,EAAE;QACR,SAAS,CAAC,YAAY,EAAE,CAAC;KAC1B;IAED,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;AAC9B,CAAC,CAAC;AAEF,eAAe,YAAY,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 { useState } from \"react\";\nimport SimpleReactValidator from \"simple-react-validator\";\n\nexport const ~~Validators~~ = {\n NoDuplicateUnderscore: {\n message: ~~'Remove duplicate~~ \"_\"',\n rule: (val: string) => {\n return !val.match(/__+/i);\n },\n },\n OnlyBeginsWithLetterOrUnderscore: {\n message: \"~~Name can only start with a letter or underscore.\~~",\n rule: (val: string) => {\n const regexPattern = new RegExp(/^[\\p{L}\\p{Nl}_]+/u);\n return regexPattern.test(val);\n },\n },\n FollowedByLettersUnderscoresAndDigits: {\n message: \"~~Name can only contain letters, underscores, or digits~~\",\n rule: (val: string) => {\n const regexPattern = new RegExp(/^[\\p{L}\\p{Nl}\\p{Nd}\\p{Mn}\\p{Mc}\\p{Pc}\\p{Cf}]+$/u);\n return regexPattern.test(val);\n },\n },\n CharLimit: {\n message: \"~~There is an 128 character limit.\~~",\n rule: (val: string) => {\n return val.length <= 128;\n },\n },\n};\n\nexport const NAME_REQUIREMENTS = \"required\|NoDuplicateUnderscore\|OnlyBeginsWithLetterOrUnderscore\|FollowedByLettersUnderscoresAndDigits\|CharLimit\";\n\nexport const ~~Messages~~ = { required: \"~~This field is~~ required.\" };\n\nconst useValidator = (customMessage = ~~Messages~~, customValidator = ~~Validators~~): [SimpleReactValidator, React.Dispatch<React.SetStateAction<boolean>>] => {\n const [show, setShow] = useState(false);\n const validator = new SimpleReactValidator({\n messages: customMessage,\n validators: customValidator,\n });\n\n if (show) {\n validator.showMessages();\n }\n\n return [validator, setShow];\n};\n\nexport default useValidator;\n"]}
1	+ {"version":3,"file":"useValidator.js","sourceRoot":"","sources":["../../../../../src/components/Properties/hooks/useValidator.ts"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAEvE,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,CAAC;IAClC,qBAAqB,EAAE;QACrB,OAAO,EAAE,qBAAqB,CAAC,SAAS,CAAC,kCAAkC,CAAC;QAC5E,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAC5B,CAAC;KACF;IACD,gCAAgC,EAAE;QAChC,OAAO,EAAE,qBAAqB,CAAC,SAAS,CAAC,yCAAyC,CAAC;QACnF,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,MAAM,YAAY,GAAG,IAAI,MAAM,CAAC,mBAAmB,CAAC,CAAC;YACrD,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,CAAC;KACF;IACD,qCAAqC,EAAE;QACrC,OAAO,EAAE,qBAAqB,CAAC,SAAS,CAAC,yCAAyC,CAAC;QACnF,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,MAAM,YAAY,GAAG,IAAI,MAAM,CAAC,iDAAiD,CAAC,CAAC;YACnF,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,CAAC;KACF;IACD,SAAS,EAAE;QACT,OAAO,EAAE,qBAAqB,CAAC,SAAS,CAAC,sBAAsB,CAAC;QAChE,IAAI,EAAE,CAAC,GAAW,EAAE,EAAE;YACpB,OAAO,GAAG,CAAC,MAAM,IAAI,GAAG,CAAC;QAC3B,CAAC;KACF;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG,iHAAiH,CAAC;AAEnJ,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,qBAAqB,CAAC,SAAS,CAAC,qBAAqB,CAAC,EAAE,CAAC,CAAC;AAExG,MAAM,YAAY,GAAG,CAAC,aAAa,GAAG,WAAW,EAAE,EAAE,eAAe,GAAG,aAAa,EAAE,EAAyE,EAAE;IAC/J,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,SAAS,GAAG,IAAI,oBAAoB,CAAC;QACzC,QAAQ,EAAE,aAAa;QACvB,UAAU,EAAE,eAAe;KAC5B,CAAC,CAAC;IAEH,IAAI,IAAI,EAAE;QACR,SAAS,CAAC,YAAY,EAAE,CAAC;KAC1B;IAED,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;AAC9B,CAAC,CAAC;AAEF,eAAe,YAAY,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 { useState } from \"react\";\nimport SimpleReactValidator from \"simple-react-validator\";\nimport { GroupingMappingWidget } from \"../../../GroupingMappingWidget\";\n\nexport const getValidators = () => ({\n NoDuplicateUnderscore: {\n message: GroupingMappingWidget.translate(\"validation.noDuplicateUnderscore\"),\n rule: (val: string) => {\n return !val.match(/__+/i);\n },\n },\n OnlyBeginsWithLetterOrUnderscore: {\n message: GroupingMappingWidget.translate(\"validation.startsWithLetterOrUnderscore\"),\n rule: (val: string) => {\n const regexPattern = new RegExp(/^[\\p{L}\\p{Nl}_]+/u);\n return regexPattern.test(val);\n },\n },\n FollowedByLettersUnderscoresAndDigits: {\n message: GroupingMappingWidget.translate(\"validation.onlyLettersUnderscoresDigits\"),\n rule: (val: string) => {\n const regexPattern = new RegExp(/^[\\p{L}\\p{Nl}\\p{Nd}\\p{Mn}\\p{Mc}\\p{Pc}\\p{Cf}]+$/u);\n return regexPattern.test(val);\n },\n },\n CharLimit: {\n message: GroupingMappingWidget.translate(\"validation.charLimit\"),\n rule: (val: string) => {\n return val.length <= 128;\n },\n },\n});\n\nexport const NAME_REQUIREMENTS = \"required\|NoDuplicateUnderscore\|OnlyBeginsWithLetterOrUnderscore\|FollowedByLettersUnderscoresAndDigits\|CharLimit\";\n\nexport const getMessages = () => ({ required: GroupingMappingWidget.translate(\"validation.required\") });\n\nconst useValidator = (customMessage = getMessages(), customValidator = getValidators()): [SimpleReactValidator, React.Dispatch<React.SetStateAction<boolean>>] => {\n const [show, setShow] = useState(false);\n const validator = new SimpleReactValidator({\n messages: customMessage,\n validators: customValidator,\n });\n\n if (show) {\n validator.showMessages();\n }\n\n return [validator, setShow];\n};\n\nexport default useValidator;\n"]}

package/lib/esm/components/SharedComponents/ActionPanel.js CHANGED Viewed

@@ -4,14 +4,15 @@
  *--------------------------------------------------------------------------------------------*/
 import { Button } from "@itwin/itwinui-react";
 import * as React from "react";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 import "./ActionPanel.scss";
 import { LoadingSpinner } from "./LoadingSpinner";
 const ActionPanel = ({ onSave, onSaveCapture, onCancel, onCancelCapture, isCancelDisabled = false, isSavingDisabled = false, isLoading = false }) => {
     return (React.createElement("div", { id: "action", className: "gmw-action-panel-container" },
         React.createElement("div", { className: "gmw-action-panel" },
             isLoading && React.createElement(LoadingSpinner, null),
-            React.createElement(Button, { disabled: isSavingDisabled || isLoading, styleType: "high-visibility", id: "save-app", onClick: onSave, onClickCapture: onSaveCapture }, "Save"),
-            onCancel && (React.createElement(Button, { styleType: "default", type: "button", id: "cancel", onClick: onCancel, disabled: isCancelDisabled || isLoading, onClickCapture: onCancelCapture }, "Cancel")))));
+            React.createElement(Button, { disabled: isSavingDisabled || isLoading, styleType: "high-visibility", id: "save-app", onClick: onSave, onClickCapture: onSaveCapture }, GroupingMappingWidget.translate("common.save")),
+            onCancel && (React.createElement(Button, { styleType: "default", type: "button", id: "cancel", onClick: onCancel, disabled: isCancelDisabled || isLoading, onClickCapture: onCancelCapture }, GroupingMappingWidget.translate("common.cancel"))))));
 };
 export default ActionPanel;
 //# sourceMappingURL=ActionPanel.js.map

package/lib/esm/components/SharedComponents/ActionPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionPanel.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/ActionPanel.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAYlD,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,eAAe,EAAE,gBAAgB,GAAG,KAAK,EAAE,gBAAgB,GAAG,KAAK,EAAE,SAAS,GAAG,KAAK,EAAoB,EAAe,EAAE;IACjL,OAAO,CACL,6BAAK,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,4BAA4B;QACrD,6BAAK,SAAS,EAAC,kBAAkB;YAC9B,SAAS,IAAI,oBAAC,cAAc,OAAG;YAChC,oBAAC,MAAM,IAAC,QAAQ,EAAE,gBAAgB,IAAI,SAAS,EAAE,SAAS,EAAC,iBAAiB,EAAC,EAAE,EAAC,UAAU,EAAC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,aAAa,~~WAEhI~~;YACR,QAAQ,IAAI,CACX,oBAAC,MAAM,IAAC,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,gBAAgB,IAAI,SAAS,EAAE,cAAc,EAAE,eAAe,~~aAExI~~,CACV,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,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 { Button } from \"@itwin/itwinui-react\";\nimport * as React from \"react\";\nimport \"./ActionPanel.scss\";\nimport { LoadingSpinner } from \"./LoadingSpinner\";\n\nexport interface ActionPanelProps {\n onSave: () => void;\n onSaveCapture?: () => void;\n onCancel?: () => void;\n onCancelCapture?: () => void;\n isCancelDisabled?: boolean;\n isSavingDisabled?: boolean;\n isLoading?: boolean;\n}\n\nconst ActionPanel = ({ onSave, onSaveCapture, onCancel, onCancelCapture, isCancelDisabled = false, isSavingDisabled = false, isLoading = false }: ActionPanelProps): JSX.Element => {\n return (\n <div id=\"action\" className=\"gmw-action-panel-container\">\n <div className=\"gmw-action-panel\">\n {isLoading && <LoadingSpinner />}\n <Button disabled={isSavingDisabled \|\| isLoading} styleType=\"high-visibility\" id=\"save-app\" onClick={onSave} onClickCapture={onSaveCapture}>\n ~~Save~~\n </Button>\n {onCancel && (\n <Button styleType=\"default\" type=\"button\" id=\"cancel\" onClick={onCancel} disabled={isCancelDisabled \|\| isLoading} onClickCapture={onCancelCapture}>\n ~~Cancel~~\n </Button>\n )}\n </div>\n </div>\n );\n};\n\nexport default ActionPanel;\n"]}
1	+ {"version":3,"file":"ActionPanel.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/ActionPanel.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAYlD,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,eAAe,EAAE,gBAAgB,GAAG,KAAK,EAAE,gBAAgB,GAAG,KAAK,EAAE,SAAS,GAAG,KAAK,EAAoB,EAAe,EAAE;IACjL,OAAO,CACL,6BAAK,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,4BAA4B;QACrD,6BAAK,SAAS,EAAC,kBAAkB;YAC9B,SAAS,IAAI,oBAAC,cAAc,OAAG;YAChC,oBAAC,MAAM,IAAC,QAAQ,EAAE,gBAAgB,IAAI,SAAS,EAAE,SAAS,EAAC,iBAAiB,EAAC,EAAE,EAAC,UAAU,EAAC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,aAAa,IACtI,qBAAqB,CAAC,SAAS,CAAC,aAAa,CAAC,CACxC;YACR,QAAQ,IAAI,CACX,oBAAC,MAAM,IAAC,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAC,QAAQ,EAAC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,gBAAgB,IAAI,SAAS,EAAE,cAAc,EAAE,eAAe,IAC9I,qBAAqB,CAAC,SAAS,CAAC,eAAe,CAAC,CAC1C,CACV,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,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 { Button } from \"@itwin/itwinui-react\";\nimport * as React from \"react\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\nimport \"./ActionPanel.scss\";\nimport { LoadingSpinner } from \"./LoadingSpinner\";\n\nexport interface ActionPanelProps {\n onSave: () => void;\n onSaveCapture?: () => void;\n onCancel?: () => void;\n onCancelCapture?: () => void;\n isCancelDisabled?: boolean;\n isSavingDisabled?: boolean;\n isLoading?: boolean;\n}\n\nconst ActionPanel = ({ onSave, onSaveCapture, onCancel, onCancelCapture, isCancelDisabled = false, isSavingDisabled = false, isLoading = false }: ActionPanelProps): JSX.Element => {\n return (\n <div id=\"action\" className=\"gmw-action-panel-container\">\n <div className=\"gmw-action-panel\">\n {isLoading && <LoadingSpinner />}\n <Button disabled={isSavingDisabled \|\| isLoading} styleType=\"high-visibility\" id=\"save-app\" onClick={onSave} onClickCapture={onSaveCapture}>\n {GroupingMappingWidget.translate(\"common.save\")}\n </Button>\n {onCancel && (\n <Button styleType=\"default\" type=\"button\" id=\"cancel\" onClick={onCancel} disabled={isCancelDisabled \|\| isLoading} onClickCapture={onCancelCapture}>\n {GroupingMappingWidget.translate(\"common.cancel\")}\n </Button>\n )}\n </div>\n </div>\n );\n};\n\nexport default ActionPanel;\n"]}

package/lib/esm/components/SharedComponents/DeleteModal.js CHANGED Viewed

@@ -5,6 +5,7 @@
 import { Button, MiddleTextTruncation, Modal, ModalButtonBar, Text } from "@itwin/itwinui-react";
 import { useMutation } from "@tanstack/react-query";
 import React, { useCallback, useState } from "react";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 import "./DeleteModal.scss";
 import { LoadingSpinner } from "./LoadingSpinner";
 export const DeleteModal = ({ entityName, onClose, onDelete, confirmationMessage }) => {
@@ -19,15 +20,15 @@ export const DeleteModal = ({ entityName, onClose, onDelete, confirmationMessage
         deleteMutation.mutate();
     }, [deleteMutation]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(Modal, { title: "Confirm", modalRootId: "grouping-mapping-widget", isOpen: !!localEntityName, isDismissible: !deleteMutation.isLoading, onClose: onClose },
+        React.createElement(Modal, { title: GroupingMappingWidget.translate("common.confirm"), modalRootId: "grouping-mapping-widget", isOpen: !!localEntityName, isDismissible: !deleteMutation.isLoading, onClose: onClose },
             React.createElement("div", { className: "gmw-delete-modal-body-text" }, confirmationMessage ?? (React.createElement(React.Fragment, null,
-                React.createElement(Text, { variant: "leading", as: "h3" }, "Are you sure you want to delete"),
+                React.createElement(Text, { variant: "leading", as: "h3" }, GroupingMappingWidget.translate("shared.deleteConfirm")),
                 React.createElement("strong", null, React.createElement(MiddleTextTruncation, { text: `${entityName}?` }))))),
             React.createElement(ModalButtonBar, null,
                 deleteMutation.isLoading && (React.createElement("div", { className: "gmw-loading-delete" },
                     React.createElement(LoadingSpinner, null))),
-                React.createElement(Button, { styleType: "high-visibility", onClick: deleteCallback, disabled: deleteMutation.isLoading }, "Delete"),
-                React.createElement(Button, { styleType: "default", onClick: onClose, disabled: deleteMutation.isLoading }, "Cancel")))));
+                React.createElement(Button, { styleType: "high-visibility", onClick: deleteCallback, disabled: deleteMutation.isLoading }, GroupingMappingWidget.translate("common.delete")),
+                React.createElement(Button, { styleType: "default", onClick: onClose, disabled: deleteMutation.isLoading }, GroupingMappingWidget.translate("common.cancel"))))));
 };
 export default DeleteModal;
 //# sourceMappingURL=DeleteModal.js.map

package/lib/esm/components/SharedComponents/DeleteModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DeleteModal.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/DeleteModal.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjG,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AASlD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,mBAAmB,EAAoB,EAAE,EAAE;IACtG,MAAM,CAAC,eAAe,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;IAE/C,MAAM,cAAc,GAAG,WAAW,CAAC;QACjC,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,KAAK,IAAI,EAAE;YACpB,OAAO,EAAE,CAAC;QACZ,CAAC;KACF,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,cAAc,CAAC,MAAM,EAAE,CAAC;IAC1B,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,KAAK,~~EAAC~~,SAAS,~~EAAC~~,WAAW,EAAC,yBAAyB,EAAC,MAAM,EAAE,CAAC,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC,cAAc,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO;~~YAChJ~~,6BAAK,SAAS,EAAC,4BAA4B,IACxC,mBAAmB,IAAI,CACtB;gBACE,oBAAC,IAAI,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAC,IAAI,~~sCAExB~~;gBACP,oCAAS,oBAAC,oBAAoB,IAAC,IAAI,EAAE,GAAG,UAAU,GAAG,GAAI,CAAU,CAClE,CACJ,CACG;YACN,oBAAC,cAAc;gBACZ,cAAc,CAAC,SAAS,IAAI,CAC3B,6BAAK,SAAS,EAAC,oBAAoB;oBACjC,oBAAC,cAAc,OAAG,CACd,CACP;gBACD,oBAAC,MAAM,IAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,SAAS,~~aAEtF~~;gBACT,oBAAC,MAAM,IAAC,SAAS,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,SAAS,~~aAEvE~~,CACM,CACX,CACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,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 { Button, MiddleTextTruncation, Modal, ModalButtonBar, Text } from \"@itwin/itwinui-react\";\nimport { useMutation } from \"@tanstack/react-query\";\nimport React, { useCallback, useState } from \"react\";\nimport \"./DeleteModal.scss\";\nimport { LoadingSpinner } from \"./LoadingSpinner\";\n\nexport interface DeleteModalProps {\n entityName: string;\n onClose: () => void;\n onDelete: () => Promise<void>;\n confirmationMessage?: JSX.Element;\n}\n\nexport const DeleteModal = ({ entityName, onClose, onDelete, confirmationMessage }: DeleteModalProps) => {\n const [localEntityName] = useState(entityName);\n\n const deleteMutation = useMutation({\n mutationFn: onDelete,\n onSuccess: async () => {\n onClose();\n },\n });\n\n const deleteCallback = useCallback(() => {\n deleteMutation.mutate();\n }, [deleteMutation]);\n\n return (\n <>\n <Modal title=\"~~Confirm~~\" modalRootId=\"grouping-mapping-widget\" isOpen={!!localEntityName} isDismissible={!deleteMutation.isLoading} onClose={onClose}>\n <div className=\"gmw-delete-modal-body-text\">\n {confirmationMessage ?? (\n <>\n <Text variant=\"leading\" as=\"h3\">\n ~~Are you sure you want to delete~~\n </Text>\n <strong>{<MiddleTextTruncation text={`${entityName}?`} />}</strong>\n </>\n )}\n </div>\n <ModalButtonBar>\n {deleteMutation.isLoading && (\n <div className=\"gmw-loading-delete\">\n <LoadingSpinner />\n </div>\n )}\n <Button styleType=\"high-visibility\" onClick={deleteCallback} disabled={deleteMutation.isLoading}>\n ~~Delete~~\n </Button>\n <Button styleType=\"default\" onClick={onClose} disabled={deleteMutation.isLoading}>\n ~~Cancel~~\n </Button>\n </ModalButtonBar>\n </Modal>\n </>\n );\n};\n\nexport default DeleteModal;\n"]}
1	+ {"version":3,"file":"DeleteModal.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/DeleteModal.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjG,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AASlD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,mBAAmB,EAAoB,EAAE,EAAE;IACtG,MAAM,CAAC,eAAe,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;IAE/C,MAAM,cAAc,GAAG,WAAW,CAAC;QACjC,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,KAAK,IAAI,EAAE;YACpB,OAAO,EAAE,CAAC;QACZ,CAAC;KACF,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,cAAc,CAAC,MAAM,EAAE,CAAC;IAC1B,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,KAAK,EAAE,qBAAqB,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,WAAW,EAAC,yBAAyB,EAAC,MAAM,EAAE,CAAC,CAAC,eAAe,EAAE,aAAa,EAAE,CAAC,cAAc,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO;YAC1L,6BAAK,SAAS,EAAC,4BAA4B,IACxC,mBAAmB,IAAI,CACtB;gBACE,oBAAC,IAAI,IAAC,OAAO,EAAC,SAAS,EAAC,EAAE,EAAC,IAAI,IAC5B,qBAAqB,CAAC,SAAS,CAAC,sBAAsB,CAAC,CACnD;gBACP,oCAAS,oBAAC,oBAAoB,IAAC,IAAI,EAAE,GAAG,UAAU,GAAG,GAAI,CAAU,CAClE,CACJ,CACG;YACN,oBAAC,cAAc;gBACZ,cAAc,CAAC,SAAS,IAAI,CAC3B,6BAAK,SAAS,EAAC,oBAAoB;oBACjC,oBAAC,cAAc,OAAG,CACd,CACP;gBACD,oBAAC,MAAM,IAAC,SAAS,EAAC,iBAAiB,EAAC,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,SAAS,IAC5F,qBAAqB,CAAC,SAAS,CAAC,eAAe,CAAC,CAC1C;gBACT,oBAAC,MAAM,IAAC,SAAS,EAAC,SAAS,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,cAAc,CAAC,SAAS,IAC7E,qBAAqB,CAAC,SAAS,CAAC,eAAe,CAAC,CAC1C,CACM,CACX,CACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,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 { Button, MiddleTextTruncation, Modal, ModalButtonBar, Text } from \"@itwin/itwinui-react\";\nimport { useMutation } from \"@tanstack/react-query\";\nimport React, { useCallback, useState } from \"react\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\nimport \"./DeleteModal.scss\";\nimport { LoadingSpinner } from \"./LoadingSpinner\";\n\nexport interface DeleteModalProps {\n entityName: string;\n onClose: () => void;\n onDelete: () => Promise<void>;\n confirmationMessage?: JSX.Element;\n}\n\nexport const DeleteModal = ({ entityName, onClose, onDelete, confirmationMessage }: DeleteModalProps) => {\n const [localEntityName] = useState(entityName);\n\n const deleteMutation = useMutation({\n mutationFn: onDelete,\n onSuccess: async () => {\n onClose();\n },\n });\n\n const deleteCallback = useCallback(() => {\n deleteMutation.mutate();\n }, [deleteMutation]);\n\n return (\n <>\n <Modal title={GroupingMappingWidget.translate(\"common.confirm\")} modalRootId=\"grouping-mapping-widget\" isOpen={!!localEntityName} isDismissible={!deleteMutation.isLoading} onClose={onClose}>\n <div className=\"gmw-delete-modal-body-text\">\n {confirmationMessage ?? (\n <>\n <Text variant=\"leading\" as=\"h3\">\n {GroupingMappingWidget.translate(\"shared.deleteConfirm\")}\n </Text>\n <strong>{<MiddleTextTruncation text={`${entityName}?`} />}</strong>\n </>\n )}\n </div>\n <ModalButtonBar>\n {deleteMutation.isLoading && (\n <div className=\"gmw-loading-delete\">\n <LoadingSpinner />\n </div>\n )}\n <Button styleType=\"high-visibility\" onClick={deleteCallback} disabled={deleteMutation.isLoading}>\n {GroupingMappingWidget.translate(\"common.delete\")}\n </Button>\n <Button styleType=\"default\" onClick={onClose} disabled={deleteMutation.isLoading}>\n {GroupingMappingWidget.translate(\"common.cancel\")}\n </Button>\n </ModalButtonBar>\n </Modal>\n </>\n );\n};\n\nexport default DeleteModal;\n"]}

package/lib/esm/components/SharedComponents/LoadingOverlay.js CHANGED Viewed

@@ -4,9 +4,10 @@
  *--------------------------------------------------------------------------------------------*/
 import { ProgressRadial, Text } from "@itwin/itwinui-react";
 import React from "react";
+import { GroupingMappingWidget } from "../../GroupingMappingWidget";
 import "./LoadingOverlay.scss";
 export const LoadingOverlay = () => (React.createElement("div", { className: "gmw-loading-center-overlay" },
-    React.createElement(Text, null, "Loading"),
+    React.createElement(Text, null, GroupingMappingWidget.translate("common.loading")),
     React.createElement(ProgressRadial, { indeterminate: true }),
-    React.createElement(Text, null, "Please wait...")));
+    React.createElement(Text, null, GroupingMappingWidget.translate("common.pleaseWait"))));
 //# sourceMappingURL=LoadingOverlay.js.map

package/lib/esm/components/SharedComponents/LoadingOverlay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoadingOverlay.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/LoadingOverlay.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,CAClC,6BAAK,SAAS,EAAC,4BAA4B;IACzC,oBAAC,IAAI,~~kBAAe~~;~~IACpB~~,oBAAC,cAAc,IAAC,aAAa,SAAG;IAChC,oBAAC,IAAI,~~yBAAsB~~,~~CACvB~~,CACP,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 { ProgressRadial, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport \"./LoadingOverlay.scss\";\n\nexport const LoadingOverlay = () => (\n <div className=\"gmw-loading-center-overlay\">\n <Text>~~Loading~~</Text>\n <ProgressRadial indeterminate />\n <Text>~~Please wait...</~~Text>\n </div>\n);\n"]}
1	+ {"version":3,"file":"LoadingOverlay.js","sourceRoot":"","sources":["../../../../src/components/SharedComponents/LoadingOverlay.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,CAClC,6BAAK,SAAS,EAAC,4BAA4B;IACzC,oBAAC,IAAI,QAAE,qBAAqB,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAQ;IAChE,oBAAC,cAAc,IAAC,aAAa,SAAG;IAChC,oBAAC,IAAI,QAAE,qBAAqB,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAQ,CAC/D,CACP,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 { ProgressRadial, Text } from \"@itwin/itwinui-react\";\nimport React from \"react\";\nimport { GroupingMappingWidget } from \"../../GroupingMappingWidget\";\nimport \"./LoadingOverlay.scss\";\n\nexport const LoadingOverlay = () => (\n <div className=\"gmw-loading-center-overlay\">\n <Text>{GroupingMappingWidget.translate(\"common.loading\")}</Text>\n <ProgressRadial indeterminate />\n <Text>{GroupingMappingWidget.translate(\"common.pleaseWait\")}</Text>\n </div>\n);\n"]}

package/lib/esm/components/customUI/DefaultGroupingUI.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import type { GroupingMappingCustomUI } from "./GroupingMappingCustomUI";
-export declare const defaultGroupingUI: GroupingMappingCustomUI[];
+export declare const getDefaultGroupingUI: () => GroupingMappingCustomUI[];
 //# sourceMappingURL=DefaultGroupingUI.d.ts.map