msw-dev-tool 3.2.1 → 3.2.3

package/dist/cjs/ui/DevToolContent/Form/Select.js

@@ -3,14 +3,16 @@
 var React = require('react');
 var index = require('../../../node_modules/@radix-ui/react-select/dist/index.js');
 var reactIcons_esm = require('../../../node_modules/@radix-ui/react-icons/dist/react-icons.esm.js');
+var PortalContainerProvider = require('../../PortalContainerProvider.js');
 
 const Select = React.forwardRef(({ options, placeholder, label, id, style, ...rest }, ref) => {
+    const container = PortalContainerProvider.usePortalContainer();
     return (React.createElement(index.Select, { "data-theme": "light", "data-radix-color-scheme": "light", ...rest },
         React.createElement(index.SelectTrigger, { className: "msw-dt-select-trigger", "aria-label": label !== null && label !== void 0 ? label : "select", onClick: (e) => e.stopPropagation(), id: id, ref: ref, style: style },
             React.createElement(index.SelectValue, { placeholder: placeholder, className: "msw-dt-text-ellipsis" }),
             React.createElement(index.SelectIcon, { className: "msw-dt-select-icon" },
                 React.createElement(reactIcons_esm.ChevronDownIcon, null))),
-        React.createElement(index.SelectPortal, null,
+        container && (React.createElement(index.SelectPortal, { container: container },
             React.createElement(index.SelectContent, { className: "msw-dt-select-content", style: { zIndex: 10000 }, "data-theme": "light", "data-radix-color-scheme": "light" },
                 React.createElement(index.SelectScrollUpButton, { className: "msw-dt-select-scroll-button" },
                     React.createElement(reactIcons_esm.ChevronUpIcon, null)),
@@ -18,7 +20,7 @@ const Select = React.forwardRef(({ options, placeholder, label, id, style, ...re
                     return (React.createElement(SelectItem, { key: opt.value, value: opt.value }, opt.label));
                 })),
                 React.createElement(index.SelectScrollDownButton, { className: "msw-dt-select-scroll-button" },
-                    React.createElement(reactIcons_esm.ChevronDownIcon, null))))));
+                    React.createElement(reactIcons_esm.ChevronDownIcon, null)))))));
 });
 Select.displayName = "Select";
 const SelectItem = React.forwardRef(({ children, className, value, ...props }, forwardedRef) => {

package/dist/cjs/ui/DevToolContent/Form/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../../src/ui/DevToolContent/Form/Select.tsx"],"sourcesContent":[null],"names":["forwardRef","_Select","SelectTrigger","SelectValue","SelectIcon","ChevronDownIcon","SelectPortal","SelectContent","SelectScrollUpButton","ChevronUpIcon","SelectViewport","SelectScrollDownButton","_SelectItem","SelectItemText","SelectItemIndicator","CheckIcon"],"mappings":";;;;;;AAqCa,MAAA,MAAM,GAAGA,gBAAU,CAC9B,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAI;IAC3D,QACE,oBAACC,YAAO,EAAA,EAAA,YAAA,EAAY,OAAO,EAAyB,yBAAA,EAAA,OAAO,KAAK,IAAI,EAAA;AAClE,QAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EACZ,EAAA,SAAS,EAAC,uBAAuB,gBACrB,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,KAAA,CAAA,GAAL,KAAK,GAAI,QAAQ,EAC7B,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,eAAe,EAAE,EACnC,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EAAA;YAEZ,KAAC,CAAA,aAAA,CAAAC,iBAAW,IACV,WAAW,EAAE,WAAW,EACxB,SAAS,EAAC,sBAAsB,EAChC,CAAA;AACF,YAAA,KAAA,CAAA,aAAA,CAACC,gBAAU,EAAA,EAAC,SAAS,EAAC,oBAAoB,EAAA;gBACxC,KAAC,CAAA,aAAA,CAAAC,8BAAe,EAAG,IAAA,CAAA,CACR,CACC;AAChB,QAAA,KAAA,CAAA,aAAA,CAACC,kBAAY,EAAA,IAAA;AACX,YAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EACZ,EAAA,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,EACb,YAAA,EAAA,OAAO,6BACM,OAAO,EAAA;AAE/B,gBAAA,KAAA,CAAA,aAAA,CAACC,0BAAoB,EAAA,EAAC,SAAS,EAAC,6BAA6B,EAAA;oBAC3D,KAAC,CAAA,aAAA,CAAAC,4BAAa,OAAG,CACI;AACvB,gBAAA,KAAA,CAAA,aAAA,CAACC,oBAAc,EAAA,EAAC,SAAS,EAAC,wBAAwB,EAAA,EAC/C,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;oBACnB,QACE,oBAAC,UAAU,EAAA,EAAC,GAAG,EAAE,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAA,EACzC,GAAG,CAAC,KAAK,CACC,EACb;AACJ,iBAAC,CAAC,CACa;AACjB,gBAAA,KAAA,CAAA,aAAA,CAACC,4BAAsB,EAAA,EAAC,SAAS,EAAC,6BAA6B,EAAA;AAC7D,oBAAA,KAAA,CAAA,aAAA,CAACN,8BAAe,EAAG,IAAA,CAAA,CACI,CACX,CACH,CACP,EACV;AACJ,CAAC,EACD;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAE9B,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CACjC,CACE,EACE,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EAC2B,EACrC,YAA0C,KACxC;AACF,IAAA,QACE,KAAC,CAAA,aAAA,CAAAO,gBAAW,EACV,EAAA,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE,KAAK,EACR,GAAA,KAAK,EACT,GAAG,EAAE,YAAY,EAAA;QAEjB,KAAC,CAAA,aAAA,CAAAC,oBAAc,EAAE,IAAA,EAAA,QAAQ,CAAkB;AAC3C,QAAA,KAAA,CAAA,aAAA,CAACC,yBAAmB,EAAA,EAAC,SAAS,EAAC,8BAA8B,EAAA;AAC3D,YAAA,KAAA,CAAA,aAAA,CAACC,wBAAS,EAAA,IAAA,CAAG,CACO,CACV,EACd;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
+{"version":3,"file":"Select.js","sources":["../../../../../src/ui/DevToolContent/Form/Select.tsx"],"sourcesContent":[null],"names":["forwardRef","usePortalContainer","_Select","SelectTrigger","SelectValue","SelectIcon","ChevronDownIcon","SelectPortal","SelectContent","SelectScrollUpButton","ChevronUpIcon","SelectViewport","SelectScrollDownButton","_SelectItem","SelectItemText","SelectItemIndicator","CheckIcon"],"mappings":"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"}

package/dist/cjs/ui/DevToolContent/ToolButtonGroup/index.js

@@ -4,50 +4,49 @@ var React = require('react');
 var handlerStore = require('../../../lib/handlerStore.js');
 var reactIcons_esm = require('../../../node_modules/@radix-ui/react-icons/dist/react-icons.esm.js');
 var index = require('../../../node_modules/@radix-ui/react-dialog/dist/index.js');
-var ThemeProvider = require('../../ThemeProvider.js');
 var HandlerForm = require('./HandlerForm.js');
 var CloseButton = require('../CloseButton.js');
+var PortalContainerProvider = require('../../PortalContainerProvider.js');
 var flex = require('../../../node_modules/@radix-ui/themes/dist/esm/components/flex.js');
 var button = require('../../../node_modules/@radix-ui/themes/dist/esm/components/button.js');
-var dialog = require('../../../node_modules/@radix-ui/themes/dist/esm/components/dialog.js');
 
 const ToolButtonGroup = () => {
     const { resetMSWDevTool } = handlerStore.useHandlerStore();
     const [isDialogOpen, setIsDialogOpen] = React.useState(false);
+    const container = PortalContainerProvider.usePortalContainer();
     return (React.createElement(flex.Flex, { gap: "6", py: "4" },
         React.createElement(button.Button, { onClick: () => resetMSWDevTool(), color: "crimson" },
             React.createElement(reactIcons_esm.ReloadIcon, null),
             "Reset Dev tool"),
-        React.createElement(dialog.Root, { open: isDialogOpen, onOpenChange: setIsDialogOpen },
+        React.createElement(index.Root, { open: isDialogOpen, onOpenChange: setIsDialogOpen },
             React.createElement(index.DialogTrigger, { asChild: true },
                 React.createElement(button.Button, null,
                     React.createElement(reactIcons_esm.PlusIcon, null),
                     "Add Temp Handler")),
-            React.createElement(index.DialogPortal, null,
-                React.createElement(ThemeProvider.ThemeProvider, null,
-                    React.createElement(index.DialogOverlay, { className: "msw-dt-dialog-overlay msw-dt-dialog-layout" }),
-                    React.createElement(index.DialogContent, { className: "msw-dt-dialog-content msw-dt-dialog-layout", style: {
-                            top: "50%",
-                            left: "50%",
-                            transform: "translate(-50%, -50%)",
-                            padding: "1rem 2rem",
-                            borderRadius: "1rem",
-                            maxHeight: "90vh",
-                            maxWidth: "90vw",
-                            overflow: "hidden",
-                        } },
-                        React.createElement(flex.Flex, { align: "center", justify: "between" },
-                            React.createElement(index.DialogTitle, null, "Add Temp Handler"),
-                            React.createElement(index.DialogClose, { asChild: true },
-                                React.createElement(CloseButton.CloseButton, null))),
-                        React.createElement(index.DialogDescription, null,
-                            "Temp handler is stored in the session storage. If you",
-                            " ",
-                            React.createElement("span", { style: { fontWeight: "600" } }, "reset dev tool"),
-                            ", it will be ",
-                            React.createElement("span", { style: { color: "red" } }, "deleted"),
-                            "."),
-                        React.createElement(HandlerForm.HandlerForm, { onClose: () => setIsDialogOpen(false) })))))));
+            container && (React.createElement(index.DialogPortal, { container: container },
+                React.createElement(index.DialogOverlay, { className: "msw-dt-dialog-overlay msw-dt-dialog-layout" }),
+                React.createElement(index.DialogContent, { className: "msw-dt-dialog-content msw-dt-dialog-layout", style: {
+                        top: "50%",
+                        left: "50%",
+                        transform: "translate(-50%, -50%)",
+                        padding: "1rem 2rem",
+                        borderRadius: "1rem",
+                        maxHeight: "90vh",
+                        maxWidth: "90vw",
+                        overflow: "hidden",
+                    } },
+                    React.createElement(flex.Flex, { align: "center", justify: "between" },
+                        React.createElement(index.DialogTitle, { style: { margin: 0, fontSize: "1.5rem", fontWeight: "bold" } }, "Add Temp Handler"),
+                        React.createElement(index.DialogClose, { asChild: true },
+                            React.createElement(CloseButton.CloseButton, null))),
+                    React.createElement(index.DialogDescription, { style: { margin: "1rem 0" } },
+                        "Temp handler is stored in the session storage. If you",
+                        " ",
+                        React.createElement("span", { style: { fontWeight: "600" } }, "reset dev tool"),
+                        ", it will be ",
+                        React.createElement("span", { style: { color: "red" } }, "deleted"),
+                        "."),
+                    React.createElement(HandlerForm.HandlerForm, { onClose: () => setIsDialogOpen(false) })))))));
 };
 
 exports.ToolButtonGroup = ToolButtonGroup;

package/dist/cjs/ui/DevToolContent/ToolButtonGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/ui/DevToolContent/ToolButtonGroup/index.tsx"],"sourcesContent":[null],"names":["useHandlerStore","useState","Flex","Button","ReloadIcon","Dialog.Root","DialogTrigger","PlusIcon","DialogPortal","ThemeProvider","DialogOverlay","DialogContent","DialogTitle","DialogClose","CloseButton","DialogDescription","HandlerForm"],"mappings":";;;;;;;;;;;;;AAiBO,MAAM,eAAe,GAAG,MAAK;AAClC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAGA,4BAAe,EAAE,CAAC;IAC9C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,QACE,KAAC,CAAA,aAAA,CAAAC,SAAI,EAAC,EAAA,GAAG,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAA;AAClB,QAAA,KAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EAAC,OAAO,EAAE,MAAM,eAAe,EAAE,EAAE,KAAK,EAAC,SAAS,EAAA;AACvD,YAAA,KAAA,CAAA,aAAA,CAACC,yBAAU,EAAG,IAAA,CAAA;AAEP,YAAA,gBAAA,CAAA;QACT,KAAC,CAAA,aAAA,CAAAC,WAAW,EAAC,EAAA,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,eAAe,EAAA;YAC5D,KAAC,CAAA,aAAA,CAAAC,mBAAa,IAAC,OAAO,EAAA,IAAA,EAAA;AACpB,gBAAA,KAAA,CAAA,aAAA,CAACH,aAAM,EAAA,IAAA;AACL,oBAAA,KAAA,CAAA,aAAA,CAACI,uBAAQ,EAAG,IAAA,CAAA;uCAEL,CACK;AAChB,YAAA,KAAA,CAAA,aAAA,CAACC,kBAAY,EAAA,IAAA;AACX,gBAAA,KAAA,CAAA,aAAA,CAACC,2BAAa,EAAA,IAAA;AACZ,oBAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EAAA,EAAC,SAAS,EAAC,4CAA4C,EAAG,CAAA;AACxE,oBAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EACZ,EAAA,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE;AACL,4BAAA,GAAG,EAAE,KAAK;AACV,4BAAA,IAAI,EAAE,KAAK;AACX,4BAAA,SAAS,EAAE,uBAAuB;AAClC,4BAAA,OAAO,EAAE,WAAW;AACpB,4BAAA,YAAY,EAAE,MAAM;AACpB,4BAAA,SAAS,EAAE,MAAM;AACjB,4BAAA,QAAQ,EAAE,MAAM;AAChB,4BAAA,QAAQ,EAAE,QAAQ;AACnB,yBAAA,EAAA;wBAED,KAAC,CAAA,aAAA,CAAAT,SAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAA;AACpC,4BAAA,KAAA,CAAA,aAAA,CAACU,iBAAW,EAA+B,IAAA,EAAA,kBAAA,CAAA;4BAC3C,KAAC,CAAA,aAAA,CAAAC,iBAAW,IAAC,OAAO,EAAA,IAAA,EAAA;gCAClB,KAAC,CAAA,aAAA,CAAAC,uBAAW,EAAG,IAAA,CAAA,CACH,CACT;AACP,wBAAA,KAAA,CAAA,aAAA,CAACC,uBAAiB,EAAA,IAAA;;4BACsC,GAAG;AACzD,4BAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,EAAuB,EAAA,gBAAA,CAAA;;AACjD,4BAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,EAAgB,EAAA,SAAA,CAAA;AACnC,4BAAA,GAAA,CAAA;AACpB,wBAAA,KAAA,CAAA,aAAA,CAACC,uBAAW,EAAC,EAAA,OAAO,EAAE,MAAM,eAAe,CAAC,KAAK,CAAC,GAAI,CACxC,CACF,CACH,CACH,CACT,EACP;AACJ;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/ui/DevToolContent/ToolButtonGroup/index.tsx"],"sourcesContent":[null],"names":["useHandlerStore","useState","usePortalContainer","Flex","Button","ReloadIcon","DialogRoot","DialogTrigger","PlusIcon","DialogPortal","DialogOverlay","DialogContent","DialogTitle","DialogClose","CloseButton","DialogDescription","HandlerForm"],"mappings":";;;;;;;;;;;;AAkBO,MAAM,eAAe,GAAG,MAAK;AAClC,IAAA,MAAM,EAAE,eAAe,EAAE,GAAGA,4BAAe,EAAE,CAAC;IAC9C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC,CAAC;AAExD,IAAA,MAAM,SAAS,GAAGC,0CAAkB,EAAE,CAAA;IAEtC,QACE,KAAC,CAAA,aAAA,CAAAC,SAAI,EAAC,EAAA,GAAG,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAA;AAClB,QAAA,KAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EAAC,OAAO,EAAE,MAAM,eAAe,EAAE,EAAE,KAAK,EAAC,SAAS,EAAA;AACvD,YAAA,KAAA,CAAA,aAAA,CAACC,yBAAU,EAAG,IAAA,CAAA;AAEP,YAAA,gBAAA,CAAA;QACT,KAAC,CAAA,aAAA,CAAAC,UAAU,IAAC,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,eAAe,EAAA;YAC3D,KAAC,CAAA,aAAA,CAAAC,mBAAa,IAAC,OAAO,EAAA,IAAA,EAAA;AACpB,gBAAA,KAAA,CAAA,aAAA,CAACH,aAAM,EAAA,IAAA;AACL,oBAAA,KAAA,CAAA,aAAA,CAACI,uBAAQ,EAAG,IAAA,CAAA;uCAEL,CACK;AACf,YAAA,SAAS,KACR,KAAA,CAAA,aAAA,CAACC,kBAAY,EAAC,EAAA,SAAS,EAAE,SAAS,EAAA;AAChC,gBAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EAAA,EAAC,SAAS,EAAC,4CAA4C,EAAG,CAAA;AACxE,gBAAA,KAAA,CAAA,aAAA,CAACC,mBAAa,EACZ,EAAA,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE;AACL,wBAAA,GAAG,EAAE,KAAK;AACV,wBAAA,IAAI,EAAE,KAAK;AACX,wBAAA,SAAS,EAAE,uBAAuB;AAClC,wBAAA,OAAO,EAAE,WAAW;AACpB,wBAAA,YAAY,EAAE,MAAM;AACpB,wBAAA,SAAS,EAAE,MAAM;AACjB,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,QAAQ,EAAE,QAAQ;AACnB,qBAAA,EAAA;oBAED,KAAC,CAAA,aAAA,CAAAR,SAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAA;AACpC,wBAAA,KAAA,CAAA,aAAA,CAACS,iBAAW,EACV,EAAA,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EAGhD,EAAA,kBAAA,CAAA;wBACd,KAAC,CAAA,aAAA,CAAAC,iBAAW,IAAC,OAAO,EAAA,IAAA,EAAA;4BAClB,KAAC,CAAA,aAAA,CAAAC,uBAAW,EAAG,IAAA,CAAA,CACH,CACT;oBACP,KAAC,CAAA,aAAA,CAAAC,uBAAiB,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAA;;wBACU,GAAG;AACzD,wBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,EAAuB,EAAA,gBAAA,CAAA;;AACjD,wBAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,EAAgB,EAAA,SAAA,CAAA;AACnC,wBAAA,GAAA,CAAA;AACpB,oBAAA,KAAA,CAAA,aAAA,CAACC,uBAAW,EAAC,EAAA,OAAO,EAAE,MAAM,eAAe,CAAC,KAAK,CAAC,GAAI,CACxC,CACH,CAChB,CACU,CACR,EACP;AACJ;;;;"}

package/dist/cjs/ui/MSWDevTool.js

@@ -9,15 +9,17 @@ var ThemeProvider = require('./ThemeProvider.js');
 var index$2 = require('./DevToolContent/ToolButtonGroup/index.js');
 var Trigger = require('./Trigger.js');
 var CloseButton = require('./DevToolContent/CloseButton.js');
+var PortalContainerProvider = require('./PortalContainerProvider.js');
 var flex = require('../node_modules/@radix-ui/themes/dist/esm/components/flex.js');
 
 const MSWDevTool = ({ trigger }) => {
-    return (React.createElement(ThemeProvider.ThemeProvider, null,
-        React.createElement(index.Drawer.Root, null,
-            trigger ? (React.createElement(index.Drawer.Trigger, { asChild: true }, trigger)) : (React.createElement(index.Drawer.Trigger, { asChild: true },
-                React.createElement(Trigger.DefaultDevToolTrigger, null))),
-            React.createElement(index.Drawer.Portal, null,
-                React.createElement(ThemeProvider.ThemeProvider, null,
+    const [container, setContainer] = React.useState(null);
+    return (React.createElement(index.Drawer.Root, { autoFocus: true },
+        trigger ? (React.createElement(index.Drawer.Trigger, { asChild: true }, trigger)) : (React.createElement(index.Drawer.Trigger, { asChild: true },
+            React.createElement(Trigger.DefaultDevToolTrigger, null))),
+        React.createElement(index.Drawer.Portal, null,
+            React.createElement(ThemeProvider.ThemeProvider, { ref: setContainer },
+                React.createElement(PortalContainerProvider.PortalContainerProvider, { container: container },
                     React.createElement(index.Drawer.Overlay, { className: "msw-dt-dialog-overlay msw-dt-dialog-layout" }),
                     React.createElement(index.Drawer.Content, { className: "msw-dt-dialog-content msw-dt-dialog-layout", style: {
                             bottom: 0,
@@ -28,7 +30,11 @@ const MSWDevTool = ({ trigger }) => {
                             padding: "2rem",
                         } },
                         React.createElement(flex.Flex, { align: "center", justify: "between" },
-                            React.createElement(index.Drawer.Title, { style: { margin: 0, fontSize: "1.5rem", fontWeight: "bold" } }, "MSW DEV TOOL"),
+                            React.createElement(index.Drawer.Title, { style: {
+                                    margin: 0,
+                                    fontSize: "1.5rem",
+                                    fontWeight: "bold",
+                                } }, "MSW DEV TOOL"),
                             React.createElement(index.Drawer.Close, { asChild: true },
                                 React.createElement(CloseButton.CloseButton, null))),
                         React.createElement(index$1.DialogDescription, { hidden: true, className: "msw-dt-sub-text" }, "Dev tool to control mock logic, and monitor handler logic calls."),

package/dist/cjs/ui/MSWDevTool.js.map

@@ -1 +1 @@
-{"version":3,"file":"MSWDevTool.js","sources":["../../../src/ui/MSWDevTool.tsx"],"sourcesContent":[null],"names":["ThemeProvider","Drawer","DefaultDevToolTrigger","Flex","CloseButton","DialogDescription","ToolButtonGroup","HandlerTable","HandlerDebugger"],"mappings":";;;;;;;;;;;;;MAea,UAAU,GAAG,CAAC,EAAE,OAAO,EAAmB,KAAI;IACzD,QACE,oBAACA,2BAAa,EAAA,IAAA;QACZ,KAAC,CAAA,aAAA,CAAAC,YAAM,CAAC,IAAI,EAAA,IAAA;YACT,OAAO,IACN,oBAACA,YAAM,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA,EAAE,OAAO,CAAkB,KAElD,oBAACA,YAAM,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA;gBACrB,KAAC,CAAA,aAAA,CAAAC,6BAAqB,EAAG,IAAA,CAAA,CACV,CAClB;YACD,KAAC,CAAA,aAAA,CAAAD,YAAM,CAAC,MAAM,EAAA,IAAA;AACZ,gBAAA,KAAA,CAAA,aAAA,CAACD,2BAAa,EAAA,IAAA;AACZ,oBAAA,KAAA,CAAA,aAAA,CAACC,YAAM,CAAC,OAAO,IAAC,SAAS,EAAC,4CAA4C,EAAG,CAAA;oBACzE,KAAC,CAAA,aAAA,CAAAA,YAAM,CAAC,OAAO,EAAA,EACb,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE;AACL,4BAAA,MAAM,EAAE,CAAC;AACT,4BAAA,IAAI,EAAE,CAAC;AACP,4BAAA,KAAK,EAAE,CAAC;AACR,4BAAA,MAAM,EAAE,KAAK;AACb,4BAAA,OAAO,EAAE,MAAM;AACf,4BAAA,OAAO,EAAE,MAAM;AAChB,yBAAA,EAAA;wBAED,KAAC,CAAA,aAAA,CAAAE,SAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAA;AACpC,4BAAA,KAAA,CAAA,aAAA,CAACF,YAAM,CAAC,KAAK,IACX,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,EAG/C,EAAA,cAAA,CAAA;AACf,4BAAA,KAAA,CAAA,aAAA,CAACA,YAAM,CAAC,KAAK,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA;gCACnB,KAAC,CAAA,aAAA,CAAAG,uBAAW,EAAG,IAAA,CAAA,CACF,CACV;AACP,wBAAA,KAAA,CAAA,aAAA,CAACC,yBAAiB,EAAC,EAAA,MAAM,QAAC,SAAS,EAAC,iBAAiB,EAEjC,EAAA,kEAAA,CAAA;AACpB,wBAAA,KAAA,CAAA,aAAA,CAACC,uBAAe,EAAG,IAAA,CAAA;AACnB,wBAAA,KAAA,CAAA,aAAA,CAACH,SAAI,EAAC,EAAA,GAAG,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAA;AAClD,4BAAA,KAAA,CAAA,aAAA,CAACI,oBAAY,EAAG,IAAA,CAAA;4BAChB,KAAC,CAAA,aAAA,CAAAC,uBAAe,OAAG,CACd,CACQ,CACH,CACF,CACJ,CACA,EAChB;AACJ;;;;"}
+{"version":3,"file":"MSWDevTool.js","sources":["../../../src/ui/MSWDevTool.tsx"],"sourcesContent":[null],"names":["useState","Drawer","DefaultDevToolTrigger","ThemeProvider","PortalContainerProvider","Flex","CloseButton","DialogDescription","ToolButtonGroup","HandlerTable","HandlerDebugger"],"mappings":";;;;;;;;;;;;;;MAgBa,UAAU,GAAG,CAAC,EAAE,OAAO,EAAmB,KAAI;IACzD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGA,cAAQ,CAAwB,IAAI,CAAC,CAAC;AAExE,IAAA,QACE,KAAC,CAAA,aAAA,CAAAC,YAAM,CAAC,IAAI,IAAC,SAAS,EAAA,IAAA,EAAA;QACnB,OAAO,IACN,oBAACA,YAAM,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA,EAAE,OAAO,CAAkB,KAElD,oBAACA,YAAM,CAAC,OAAO,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA;YACrB,KAAC,CAAA,aAAA,CAAAC,6BAAqB,EAAG,IAAA,CAAA,CACV,CAClB;QACD,KAAC,CAAA,aAAA,CAAAD,YAAM,CAAC,MAAM,EAAA,IAAA;AACZ,YAAA,KAAA,CAAA,aAAA,CAACE,2BAAa,EAAA,EAAC,GAAG,EAAE,YAAY,EAAA;AAC9B,gBAAA,KAAA,CAAA,aAAA,CAACC,+CAAuB,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA;AAC3C,oBAAA,KAAA,CAAA,aAAA,CAACH,YAAM,CAAC,OAAO,IAAC,SAAS,EAAC,4CAA4C,EAAG,CAAA;oBACzE,KAAC,CAAA,aAAA,CAAAA,YAAM,CAAC,OAAO,EAAA,EACb,SAAS,EAAC,4CAA4C,EACtD,KAAK,EAAE;AACL,4BAAA,MAAM,EAAE,CAAC;AACT,4BAAA,IAAI,EAAE,CAAC;AACP,4BAAA,KAAK,EAAE,CAAC;AACR,4BAAA,MAAM,EAAE,KAAK;AACb,4BAAA,OAAO,EAAE,MAAM;AACf,4BAAA,OAAO,EAAE,MAAM;AAChB,yBAAA,EAAA;wBAED,KAAC,CAAA,aAAA,CAAAI,SAAI,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAA;AACpC,4BAAA,KAAA,CAAA,aAAA,CAACJ,YAAM,CAAC,KAAK,EAAA,EACX,KAAK,EAAE;AACL,oCAAA,MAAM,EAAE,CAAC;AACT,oCAAA,QAAQ,EAAE,QAAQ;AAClB,oCAAA,UAAU,EAAE,MAAM;iCACnB,EAGY,EAAA,cAAA,CAAA;AACf,4BAAA,KAAA,CAAA,aAAA,CAACA,YAAM,CAAC,KAAK,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA;gCACnB,KAAC,CAAA,aAAA,CAAAK,uBAAW,EAAG,IAAA,CAAA,CACF,CACV;AACP,wBAAA,KAAA,CAAA,aAAA,CAACC,yBAAiB,EAAC,EAAA,MAAM,QAAC,SAAS,EAAC,iBAAiB,EAEjC,EAAA,kEAAA,CAAA;AACpB,wBAAA,KAAA,CAAA,aAAA,CAACC,uBAAe,EAAG,IAAA,CAAA;AACnB,wBAAA,KAAA,CAAA,aAAA,CAACH,SAAI,EAAC,EAAA,GAAG,EAAC,GAAG,EAAC,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAA;AAClD,4BAAA,KAAA,CAAA,aAAA,CAACI,oBAAY,EAAG,IAAA,CAAA;4BAChB,KAAC,CAAA,aAAA,CAAAC,uBAAe,OAAG,CACd,CACQ,CACO,CACZ,CACF,CACJ,EACd;AACJ;;;;"}

package/dist/cjs/ui/PortalContainerProvider.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var React = require('react');
+
+const PortalContainerContext = React.createContext(null);
+const PortalContainerProvider = ({ children, container, }) => {
+    return (React.createElement(PortalContainerContext.Provider, { value: container }, children));
+};
+const usePortalContainer = () => {
+    return React.useContext(PortalContainerContext);
+};
+
+exports.PortalContainerContext = PortalContainerContext;
+exports.PortalContainerProvider = PortalContainerProvider;
+exports.usePortalContainer = usePortalContainer;
+//# sourceMappingURL=PortalContainerProvider.js.map

package/dist/cjs/ui/PortalContainerProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortalContainerProvider.js","sources":["../../../src/ui/PortalContainerProvider.tsx"],"sourcesContent":[null],"names":["createContext","useContext"],"mappings":";;;;MAEa,sBAAsB,GAAGA,mBAAa,CACjD,IAAI,EACJ;AACW,MAAA,uBAAuB,GAAG,CAAC,EACtC,QAAQ,EACR,SAAS,GAC+C,KAAI;AAC5D,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,sBAAsB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,SAAS,EAAA,EAC9C,QAAQ,CACuB,EAClC;AACJ,EAAE;AAEK,MAAM,kBAAkB,GAAG,MAAK;AACrC,IAAA,OAAOC,gBAAU,CAAC,sBAAsB,CAAC,CAAC;AAC5C;;;;;;"}

package/dist/cjs/ui/ThemeProvider.js

@@ -14,6 +14,7 @@ const ThemeProvider = React.forwardRef(({ children }, ref) => {
             maxHeight: "fit-content",
             maxWidth: "fit-content",
             backgroundColor: "transparent",
+            zIndex: "inherit",
         } }, children));
 });
 ThemeProvider.displayName = "ThemeProvider";

package/dist/cjs/ui/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../../src/ui/ThemeProvider.tsx"],"sourcesContent":[null],"names":["forwardRef","Theme"],"mappings":";;;;;AAGA;;;AAGG;AACI,MAAM,aAAa,GAAGA,gBAAU,CACrC,CAAC,EAAE,QAAQ,EAAE,EAAE,GAAG,KAAI;AACpB,IAAA,QACE,KAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EACJ,UAAU,EAAC,OAAO,EAClB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,SAAS,EAAE,CAAC;AACZ,YAAA,QAAQ,EAAE,CAAC;AACX,YAAA,SAAS,EAAE,aAAa;AACxB,YAAA,QAAQ,EAAE,aAAa;AACvB,YAAA,eAAe,EAAE,aAAa;SAC/B,EAEA,EAAA,QAAQ,CACH,EACR;AACJ,CAAC,EACD;AAEF,aAAa,CAAC,WAAW,GAAG,eAAe;;;;"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../../src/ui/ThemeProvider.tsx"],"sourcesContent":[null],"names":["forwardRef","Theme"],"mappings":";;;;;AAGA;;;AAGG;AACI,MAAM,aAAa,GAAGA,gBAAU,CACrC,CAAC,EAAE,QAAQ,EAAE,EAAE,GAAG,KAAI;AACpB,IAAA,QACE,KAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EACJ,UAAU,EAAC,OAAO,EAClB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,SAAS,EAAE,CAAC;AACZ,YAAA,QAAQ,EAAE,CAAC;AACX,YAAA,SAAS,EAAE,aAAa;AACxB,YAAA,QAAQ,EAAE,aAAa;AACvB,YAAA,eAAe,EAAE,aAAa;AAC9B,YAAA,MAAM,EAAE,SAAS;SAClB,EAEA,EAAA,QAAQ,CACH,EACR;AACJ,CAAC,EACD;AAEF,aAAa,CAAC,WAAW,GAAG,eAAe;;;;"}

package/dist/cjs/ui/Trigger.js

@@ -1,21 +1,12 @@
 'use strict';
 
 var React = require('react');
-var button = require('../node_modules/@radix-ui/themes/dist/esm/components/button.js');
+var reactIcons_esm = require('../node_modules/@radix-ui/react-icons/dist/react-icons.esm.js');
 
 const DefaultDevToolTrigger = React.forwardRef((props, ref) => {
-    return (React.createElement(button.Button, { ref: ref, style: {
-            fontSize: "2rem",
-            borderRadius: "50%",
-            width: "3.5rem",
-            height: "3.5rem",
-            margin: "1rem",
-            position: "fixed",
-            top: 0,
-            left: 0,
-            zIndex: 999,
-            cursor: "pointer",
-        }, ...props }, "M"));
+    return (React.createElement("button", { ref: ref, className: "msw-dt-default-trigger", ...props },
+        React.createElement(reactIcons_esm.CodeIcon, { width: "1rem", height: "1rem" }),
+        "msw"));
 });
 DefaultDevToolTrigger.displayName = "DefaultDevToolTrigger";
 

package/dist/cjs/ui/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../src/ui/Trigger.tsx"],"sourcesContent":[null],"names":["forwardRef","Button"],"mappings":";;;;;AAGa,MAAA,qBAAqB,GAAGA,gBAAU,CAC7C,CAAC,KAAK,EAAE,GAAG,KAAI;IACb,QACE,oBAACC,aAAM,EAAA,EACL,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,MAAM;AAChB,YAAA,YAAY,EAAE,KAAK;AACnB,YAAA,KAAK,EAAE,QAAQ;AACf,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,QAAQ,EAAE,OAAO;AACjB,YAAA,GAAG,EAAE,CAAC;AACN,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,MAAM,EAAE,GAAG;AACX,YAAA,MAAM,EAAE,SAAS;SAClB,EACG,GAAA,KAAK,EAGF,EAAA,GAAA,CAAA,EACT;AACJ,CAAC,EACD;AAEF,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;"}
+{"version":3,"file":"Trigger.js","sources":["../../../src/ui/Trigger.tsx"],"sourcesContent":[null],"names":["forwardRef","CodeIcon"],"mappings":";;;;;AAGa,MAAA,qBAAqB,GAAGA,gBAAU,CAG7C,CAAC,KAAK,EAAE,GAAG,KAAI;IACf,QACE,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,wBAAwB,EAAA,GAC9B,KAAK,EAAA;QAET,KAAC,CAAA,aAAA,CAAAC,uBAAQ,IAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAI,CAAA;AAEpC,QAAA,KAAA,CAAA,EACT;AACJ,CAAC,EAAE;AAEH,qBAAqB,CAAC,WAAW,GAAG,uBAAuB;;;;"}