@stoplight/elements-core 8.1.0 → 8.1.2

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.
@@ -1 +1 @@
1
- import 'jest-enzyme';
1
+ export {};
@@ -1,2 +1 @@
1
1
  import '@testing-library/jest-dom';
2
- import 'jest-enzyme';
package/index.esm.js CHANGED
@@ -3384,12 +3384,12 @@ const MobileTopNav = ({ name, logo, tree, pathname, onTocClick, }) => {
3384
3384
  onTocClick();
3385
3385
  setIsSidebarOpen(false);
3386
3386
  };
3387
- return (React.createElement(Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full", zIndex: 20 },
3387
+ return (React.createElement(Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full" },
3388
3388
  React.createElement(Flex, { "data-test": "mobile-top-nav", w: "full", alignItems: "center", justifyContent: "between" },
3389
3389
  React.createElement(Button, { "data-test": "show-left-sidebar-btn", onPress: () => setIsSidebarOpen(true), appearance: "minimal" },
3390
3390
  React.createElement(Icon, { size: "lg", icon: faBars })),
3391
3391
  React.createElement(NavHeading, { heading: name })),
3392
- React.createElement(Drawer, { isOpen: isSidebarOpen, position: "left" },
3392
+ React.createElement(Drawer, { isOpen: isSidebarOpen, position: "left", onClose: () => setIsSidebarOpen(false), w: "5/6" },
3393
3393
  React.createElement(Flex, { justifyContent: "end" },
3394
3394
  React.createElement(Button, { className: "sl-mr-4 sl-mt-2", onPress: () => setIsSidebarOpen(false), appearance: "minimal", justifySelf: "end" },
3395
3395
  React.createElement(Icon, { size: "lg", icon: faX }))),
@@ -3411,16 +3411,17 @@ const ResponsiveSidebarLayout = React.forwardRef(({ children, name, logo, tree,
3411
3411
  }, [pathname]);
3412
3412
  const { isResponsiveLayoutEnabled } = useResponsiveLayout();
3413
3413
  return (React.createElement(Flex, { ref: ref, className: "sl-elements-api", pin: true, h: "full" },
3414
- !isResponsiveLayoutEnabled ? (React.createElement(Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3414
+ !isResponsiveLayoutEnabled && (React.createElement(Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3415
3415
  React.createElement(Flex, { direction: "col", bg: "canvas-100", borderR: true, pt: 8, pos: "sticky", pinY: true, overflowY: "auto", style: {
3416
3416
  paddingLeft: `calc((100% - ${maxContentWidth}px) / 2)`,
3417
3417
  width: `${currentSidebarWidth}px`,
3418
3418
  minWidth: `${SIDEBAR_MIN_WIDTH$1}px`,
3419
3419
  } },
3420
3420
  React.createElement(Sidebar, { name: name, logo: logo, tree: tree, pathname: pathname, onTocClick: onTocClick, isInResponsiveMode: false })),
3421
- React.createElement(Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))) : (React.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname })),
3421
+ React.createElement(Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))),
3422
3422
  React.createElement(Box, { ref: scrollRef, bg: "canvas", px: !isResponsiveLayoutEnabled ? 24 : 6, flex: 1, w: "full", overflowY: "auto" },
3423
- React.createElement(Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children))));
3423
+ React.createElement(Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children)),
3424
+ isResponsiveLayoutEnabled && (React.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname }))));
3424
3425
  });
3425
3426
  const Sidebar = ({ name, logo, tree, pathname, onTocClick, isInResponsiveMode, }) => {
3426
3427
  return (React.createElement(React.Fragment, null,
package/index.js CHANGED
@@ -3441,12 +3441,12 @@ const MobileTopNav = ({ name, logo, tree, pathname, onTocClick, }) => {
3441
3441
  onTocClick();
3442
3442
  setIsSidebarOpen(false);
3443
3443
  };
3444
- return (React__namespace.createElement(mosaic.Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full", zIndex: 20 },
3444
+ return (React__namespace.createElement(mosaic.Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full" },
3445
3445
  React__namespace.createElement(mosaic.Flex, { "data-test": "mobile-top-nav", w: "full", alignItems: "center", justifyContent: "between" },
3446
3446
  React__namespace.createElement(mosaic.Button, { "data-test": "show-left-sidebar-btn", onPress: () => setIsSidebarOpen(true), appearance: "minimal" },
3447
3447
  React__namespace.createElement(mosaic.Icon, { size: "lg", icon: faBars })),
3448
3448
  React__namespace.createElement(NavHeading, { heading: name })),
3449
- React__namespace.createElement(mosaic.Drawer, { isOpen: isSidebarOpen, position: "left" },
3449
+ React__namespace.createElement(mosaic.Drawer, { isOpen: isSidebarOpen, position: "left", onClose: () => setIsSidebarOpen(false), w: "5/6" },
3450
3450
  React__namespace.createElement(mosaic.Flex, { justifyContent: "end" },
3451
3451
  React__namespace.createElement(mosaic.Button, { className: "sl-mr-4 sl-mt-2", onPress: () => setIsSidebarOpen(false), appearance: "minimal", justifySelf: "end" },
3452
3452
  React__namespace.createElement(mosaic.Icon, { size: "lg", icon: faX }))),
@@ -3468,16 +3468,17 @@ const ResponsiveSidebarLayout = React__namespace.forwardRef(({ children, name, l
3468
3468
  }, [pathname]);
3469
3469
  const { isResponsiveLayoutEnabled } = useResponsiveLayout();
3470
3470
  return (React__namespace.createElement(mosaic.Flex, { ref: ref, className: "sl-elements-api", pin: true, h: "full" },
3471
- !isResponsiveLayoutEnabled ? (React__namespace.createElement(mosaic.Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3471
+ !isResponsiveLayoutEnabled && (React__namespace.createElement(mosaic.Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3472
3472
  React__namespace.createElement(mosaic.Flex, { direction: "col", bg: "canvas-100", borderR: true, pt: 8, pos: "sticky", pinY: true, overflowY: "auto", style: {
3473
3473
  paddingLeft: `calc((100% - ${maxContentWidth}px) / 2)`,
3474
3474
  width: `${currentSidebarWidth}px`,
3475
3475
  minWidth: `${SIDEBAR_MIN_WIDTH$1}px`,
3476
3476
  } },
3477
3477
  React__namespace.createElement(Sidebar, { name: name, logo: logo, tree: tree, pathname: pathname, onTocClick: onTocClick, isInResponsiveMode: false })),
3478
- React__namespace.createElement(mosaic.Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))) : (React__namespace.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname })),
3478
+ React__namespace.createElement(mosaic.Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))),
3479
3479
  React__namespace.createElement(mosaic.Box, { ref: scrollRef, bg: "canvas", px: !isResponsiveLayoutEnabled ? 24 : 6, flex: 1, w: "full", overflowY: "auto" },
3480
- React__namespace.createElement(mosaic.Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children))));
3480
+ React__namespace.createElement(mosaic.Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children)),
3481
+ isResponsiveLayoutEnabled && (React__namespace.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname }))));
3481
3482
  });
3482
3483
  const Sidebar = ({ name, logo, tree, pathname, onTocClick, isInResponsiveMode, }) => {
3483
3484
  return (React__namespace.createElement(React__namespace.Fragment, null,
package/index.mjs CHANGED
@@ -3384,12 +3384,12 @@ const MobileTopNav = ({ name, logo, tree, pathname, onTocClick, }) => {
3384
3384
  onTocClick();
3385
3385
  setIsSidebarOpen(false);
3386
3386
  };
3387
- return (React.createElement(Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full", zIndex: 20 },
3387
+ return (React.createElement(Flex, { className: "TopNav--mosaic", alignItems: "center", h: "3xl", pl: 4, pr: 4, bg: "canvas", borderB: true, pos: "fixed", w: "full" },
3388
3388
  React.createElement(Flex, { "data-test": "mobile-top-nav", w: "full", alignItems: "center", justifyContent: "between" },
3389
3389
  React.createElement(Button, { "data-test": "show-left-sidebar-btn", onPress: () => setIsSidebarOpen(true), appearance: "minimal" },
3390
3390
  React.createElement(Icon, { size: "lg", icon: faBars })),
3391
3391
  React.createElement(NavHeading, { heading: name })),
3392
- React.createElement(Drawer, { isOpen: isSidebarOpen, position: "left" },
3392
+ React.createElement(Drawer, { isOpen: isSidebarOpen, position: "left", onClose: () => setIsSidebarOpen(false), w: "5/6" },
3393
3393
  React.createElement(Flex, { justifyContent: "end" },
3394
3394
  React.createElement(Button, { className: "sl-mr-4 sl-mt-2", onPress: () => setIsSidebarOpen(false), appearance: "minimal", justifySelf: "end" },
3395
3395
  React.createElement(Icon, { size: "lg", icon: faX }))),
@@ -3411,16 +3411,17 @@ const ResponsiveSidebarLayout = React.forwardRef(({ children, name, logo, tree,
3411
3411
  }, [pathname]);
3412
3412
  const { isResponsiveLayoutEnabled } = useResponsiveLayout();
3413
3413
  return (React.createElement(Flex, { ref: ref, className: "sl-elements-api", pin: true, h: "full" },
3414
- !isResponsiveLayoutEnabled ? (React.createElement(Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3414
+ !isResponsiveLayoutEnabled && (React.createElement(Flex, { ref: sidebarRef, onMouseDown: (e) => e.preventDefault(), style: { maxWidth: `${SIDEBAR_MAX_WIDTH$1}px` } },
3415
3415
  React.createElement(Flex, { direction: "col", bg: "canvas-100", borderR: true, pt: 8, pos: "sticky", pinY: true, overflowY: "auto", style: {
3416
3416
  paddingLeft: `calc((100% - ${maxContentWidth}px) / 2)`,
3417
3417
  width: `${currentSidebarWidth}px`,
3418
3418
  minWidth: `${SIDEBAR_MIN_WIDTH$1}px`,
3419
3419
  } },
3420
3420
  React.createElement(Sidebar, { name: name, logo: logo, tree: tree, pathname: pathname, onTocClick: onTocClick, isInResponsiveMode: false })),
3421
- React.createElement(Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))) : (React.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname })),
3421
+ React.createElement(Flex, { justifySelf: "end", flexGrow: 0, flexShrink: 0, resize: "x", onMouseDown: startResizing, style: { width: '1em', flexBasis: '6px', cursor: 'ew-resize' } }))),
3422
3422
  React.createElement(Box, { ref: scrollRef, bg: "canvas", px: !isResponsiveLayoutEnabled ? 24 : 6, flex: 1, w: "full", overflowY: "auto" },
3423
- React.createElement(Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children))));
3423
+ React.createElement(Box, { style: { maxWidth: `${maxContentWidth - currentSidebarWidth}px` }, py: 16 }, children)),
3424
+ isResponsiveLayoutEnabled && (React.createElement(MobileTopNav, { onTocClick: onTocClick, name: name, logo: logo, tree: tree, pathname: pathname }))));
3424
3425
  });
3425
3426
  const Sidebar = ({ name, logo, tree, pathname, onTocClick, isInResponsiveMode, }) => {
3426
3427
  return (React.createElement(React.Fragment, null,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoplight/elements-core",
3
- "version": "8.1.0",
3
+ "version": "8.1.2",
4
4
  "main": "./index.js",
5
5
  "sideEffects": [
6
6
  "web-components.min.js",
@@ -24,16 +24,16 @@
24
24
  "react-dom": ">=16.8"
25
25
  },
26
26
  "dependencies": {
27
- "@stoplight/http-spec": "^7.0.2",
27
+ "@stoplight/http-spec": "^7.0.3",
28
28
  "@stoplight/json": "^3.18.1",
29
29
  "@stoplight/json-schema-ref-parser": "^9.0.5",
30
30
  "@stoplight/json-schema-sampler": "0.2.3",
31
31
  "@stoplight/json-schema-tree": "^4.0.0",
32
- "@stoplight/json-schema-viewer": "^4.14.2",
32
+ "@stoplight/json-schema-viewer": "^4.15.1",
33
33
  "@stoplight/markdown-viewer": "^5.7.0",
34
- "@stoplight/mosaic": "^1.51.3",
35
- "@stoplight/mosaic-code-editor": "^1.51.3",
36
- "@stoplight/mosaic-code-viewer": "^1.51.3",
34
+ "@stoplight/mosaic": "^1.52.1",
35
+ "@stoplight/mosaic-code-editor": "^1.52.1",
36
+ "@stoplight/mosaic-code-viewer": "^1.52.1",
37
37
  "@stoplight/path": "^1.3.2",
38
38
  "@stoplight/react-error-boundary": "^3.0.0",
39
39
  "@stoplight/types": "^14.1.1",