@synerise/ds-layout 1.1.15 → 1.2.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 (4) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +8 -8
  3. package/dist/Layout.styles.js +3 -3
  4. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -3,6 +3,12 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [1.2.0](https://github.com/synerise/synerise-design/compare/@synerise/ds-layout@1.1.15...@synerise/ds-layout@1.2.0) (2026-03-20)
7
+
8
+ ### Features
9
+
10
+ - **modal:** disableScrollbar prop ([d6a80ec](https://github.com/synerise/synerise-design/commit/d6a80ec2a5394703974d2b369f25a13fc4e5eeb0))
11
+
6
12
  ## [1.1.15](https://github.com/synerise/synerise-design/compare/@synerise/ds-layout@1.1.14...@synerise/ds-layout@1.1.15) (2026-03-09)
7
13
 
8
14
  **Note:** Version bump only for package @synerise/ds-layout
package/README.md CHANGED
@@ -36,23 +36,23 @@ import Layout from '@synerise/ds-layout'
36
36
  | -------------------------- | ------------------------------------------------------------------- | ------------------------- | ------- |
37
37
  | header | Set top header content page | React.ReactNode | |
38
38
  | subheader | Set subheader content page | React.ReactNode | |
39
- | left | Configuration of left sidebar | SidebarProps | |
40
- | right | Configuration of right sidebar | SidebarProps | |
39
+ | left | Configuration of left sidebar (includes opened, onChange, width) | SidebarProps | |
40
+ | right | Configuration of right sidebar (includes opened, onChange, width) | SidebarProps | |
41
41
  | children | The layout elements passed to the parent | React.ReactNode | |
42
42
  | className | Layout's className | string | |
43
43
  | styles | Custom layout styles | LayoutStyles | |
44
- | leftOpened | Whether left sidebar is opened | boolean | false |
45
- | rightOpened | Whether right sidebar is opened | boolean | false |
46
- | leftOpenedWidth | Width of opened left sidebar | number | 320 |
47
- | rightOpenedWidth | Width of opened right sidebar | number | 320 |
48
44
  | renderLeftSidebarControls | Left sidebar visibility. Accepts function returning `ReactNode`. | boolean or function | false |
49
45
  | renderRightSidebarControls | Right sidebar visibility. Accepts function returning `ReactNode`. | boolean or function | false |
50
46
  | leftSidebarWithDnd | Set withDnd in left sidebar scrollbar | boolean | false |
51
47
  | mainSidebarWithDnd | Set withDnd in main sidebar scrollbar | boolean | false |
52
48
  | rightSidebarWithDnd | Set withDnd in right sidebar scrollbar | boolean | false |
53
- | nativeScroll | Set main column to use native browser scroll | boolean | false |
49
+ | leftSidebarWithScrollbar | Wrap left sidebar content in ds-scrollbar | boolean | true |
50
+ | rightSidebarWithScrollbar | Wrap right sidebar content in ds-scrollbar | boolean | true |
51
+ | sidebarAnimationDisabled | Disable CSS transition on sidebar width | boolean | |
52
+ | nativeScroll | Set main column to use native browser scroll | boolean | |
54
53
  | nativeScrollRef | ref to pass to scrollable element | Ref<HTMLDivElement> | - |
55
- | fillViewport | sets layout to absolute with calc(100vh - viewportTopOffset) height | boolean | false |
54
+ | fullPage | Remove 24 px padding from main content inner wrapper | boolean | false |
55
+ | fillViewport | sets layout to absolute with calc(100vh - viewportTopOffset) height | boolean | |
56
56
  | viewportTopOffset | top viewport offset (if fillViewport is true) | number | 55 |
57
57
 
58
58
  ### SidebarProps
package/dist/Layout.styles.js CHANGED
@@ -15,7 +15,7 @@ export var CloseIcon = styled(Icon).withConfig({
15
15
  export var LayoutContent = styled.div.withConfig({
16
16
  displayName: "Layoutstyles__LayoutContent",
17
17
  componentId: "sc-i053aj-2"
18
- })(["overflow:hidden;width:100%;height:100%;", ";"], mediaQuery.to.small(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["overflow-x: auto;"]))));
18
+ })(["overflow:hidden;width:100%;height:100%;display:flex;flex-direction:column;", ";"], mediaQuery.to.small(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["overflow-x: auto;"]))));
19
19
  export var LayoutHeader = styled.div.withConfig({
20
20
  displayName: "Layoutstyles__LayoutHeader",
21
21
  componentId: "sc-i053aj-3"
@@ -27,7 +27,7 @@ export var LayoutSubheader = styled.div.withConfig({
27
27
  export var LayoutBody = styled.div.withConfig({
28
28
  displayName: "Layoutstyles__LayoutBody",
29
29
  componentId: "sc-i053aj-5"
30
- })(["flex:1;display:flex;flex-direction:row;min-height:0;min-width:0;position:relative;overflow:hidden;height:100%;", ";", ";"], mediaQuery.to.small(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["min-width: 704px;}"]))), function (props) {
30
+ })(["flex:1 1 auto;display:flex;flex-direction:row;min-height:0;min-width:0;position:relative;overflow:hidden;height:100%;", ";", ";"], mediaQuery.to.small(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["min-width: 704px;}"]))), function (props) {
31
31
  return props.allowOverflow && mediaQuery.to.small(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["overflow-x: auto;"])));
32
32
  });
33
33
  export var LayoutMain = styled.div.withConfig({
@@ -95,7 +95,7 @@ export var LayoutSidebar = styled.div.withConfig({
95
95
  export var LayoutSidebarWrapper = styled.div.withConfig({
96
96
  displayName: "Layoutstyles__LayoutSidebarWrapper",
97
97
  componentId: "sc-i053aj-11"
98
- })(["position:relative;overflow:visible;height:100%;left:", ";right:", ";z-index:10;", ";&:hover{", "{background-color:", ";left:", ";right:", ";", ";", ";}}", ";", ";)"], function (props) {
98
+ })(["position:relative;overflow:visible;left:", ";right:", ";z-index:10;", ";&:hover{", "{background-color:", ";left:", ";right:", ";", ";", ";}}", ";", ";)"], function (props) {
99
99
  return props.right ? 'auto' : '0';
100
100
  }, function (props) {
101
101
  return props.right ? '0' : 'auto';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-layout",
3
- "version": "1.1.15",
3
+ "version": "1.2.0",
4
4
  "description": "Layout UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "synerise/synerise-design",
@@ -35,14 +35,14 @@
35
35
  ],
36
36
  "types": "dist/index.d.ts",
37
37
  "dependencies": {
38
- "@synerise/ds-icon": "^1.14.1",
39
- "@synerise/ds-scrollbar": "^1.2.15",
40
- "@synerise/ds-utils": "^1.6.0"
38
+ "@synerise/ds-icon": "^1.15.0",
39
+ "@synerise/ds-scrollbar": "^1.2.16",
40
+ "@synerise/ds-utils": "^1.7.0"
41
41
  },
42
42
  "peerDependencies": {
43
43
  "@synerise/ds-core": "*",
44
44
  "react": ">=16.9.0 <= 18.3.1",
45
45
  "styled-components": "^5.3.3"
46
46
  },
47
- "gitHead": "8dfafc5d7278f09d430f1e7499782d05c76b47c0"
47
+ "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
48
48
  }