@openmrs/esm-implementer-tools-app 3.3.2-pre.9 → 4.0.0-pre.0

package/src/popup/popup.component.tsx

@@ -1,11 +1,11 @@
 import React, { useState } from "react";
-import Close16 from "@carbon/icons-react/es/close/16";
-import styles from "./popup.styles.scss";
-import { Button, ContentSwitcher, Switch } from "carbon-components-react";
+import { Button, ContentSwitcher, Switch } from "@carbon/react";
+import { Close } from "@carbon/react/icons";
 import { useTranslation } from "react-i18next";
 import { Configuration } from "../configuration/configuration.component";
 import { ModuleDiagnostics } from "../backend-dependencies/backend-dependencies.component";
 import { FrontendModule } from "../backend-dependencies/openmrs-backend-dependencies";
+import styles from "./popup.styles.scss";
 
 interface DevToolsPopupProps {
   close(): void;
@@ -39,10 +39,11 @@ export default function Popup({ close, frontendModules }: DevToolsPopupProps) {
         <div>
           <Button
             kind="secondary"
-            renderIcon={Close16}
+            renderIcon={(props) => <Close size={16} {...props} />}
             iconDescription="Close"
             onClick={close}
             hasIconOnly
+            size="sm"
           />
         </div>
       </div>

package/src/popup/popup.styles.scss

@@ -29,15 +29,7 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  border-bottom: 1px solid #a0a0a0;
   z-index: 2;
   background: #e0e0e0;
-}
-
-.topBar :global(.bx--content-switcher-btn:first-child),
-.topBar :global(.bx--content-switcher-btn:last-child) {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
+  padding: 0.25rem;
 }

package/src/ui-editor/ui-editor.tsx

@@ -1,12 +1,12 @@
 import React from "react";
 import styles from "./styles.css";
-import Close16 from "@carbon/icons-react/es/close/16";
 import {
   getExtensionInternalStore,
   useStore,
   useStoreWithActions,
 } from "@openmrs/esm-framework/src/internal";
-import { Button } from "carbon-components-react";
+import { Button } from "@carbon/react";
+import { Close } from "@carbon/react/icons";
 import { Portal } from "./portal";
 import { ExtensionOverlay } from "./extension-overlay.component";
 import { ImplementerToolsStore, implementerToolsStore } from "../store";
@@ -79,7 +79,7 @@ export function ExitButton() {
       className={styles.exitButton}
       kind="danger"
       size="sm"
-      renderIcon={Close16}
+      renderIcon={(props) => <Close {...props} size={16} />}
       iconDescription="Exit UI Editor"
       tooltipPosition="left"
       onClick={toggleIsUIEditorEnabled}