@cloudflare/component-page 6.0.0 → 7.1.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 (6) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/Page.d.ts +9 -2
  3. package/es/Page.js +1 -1
  4. package/lib/Page.js +1 -1
  5. package/package.json +8 -7
  6. package/src/Page.tsx +3 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # Change Log
2
2
 
3
+ ## 7.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 51c2d1f916: Apply flex only when sidebar is placed inside, allowing main content to take up the full width if otherwise
8
+
9
+ ## 7.0.0
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies [77059b4a95]
14
+ - @cloudflare/style-container@7.10.0
15
+ - @cloudflare/component-label@5.0.0
16
+ - @cloudflare/elements@3.0.0
17
+
3
18
  ## 6.0.0
4
19
 
5
20
  ### Minor Changes
package/dist/Page.d.ts CHANGED
@@ -16,8 +16,9 @@ declare const _default: React.ComponentType<{
16
16
  sidebar?: React.ReactNode;
17
17
  sidebarPosition?: "left" | "inside" | "outside" | undefined;
18
18
  autofocus?: boolean | undefined;
19
- p?: import("csstype").PaddingProperty<string | number> | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | undefined;
20
19
  color?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
20
+ borderColor?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
21
+ p?: import("csstype").PaddingProperty<string | number> | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | undefined;
21
22
  height?: import("csstype").HeightProperty<string | number> | [import("csstype").HeightProperty<string | number> | undefined, import("csstype").HeightProperty<string | number> | undefined] | [import("csstype").HeightProperty<string | number> | undefined, import("csstype").HeightProperty<string | number> | undefined, import("csstype").HeightProperty<string | number> | undefined] | undefined;
22
23
  width?: import("csstype").WidthProperty<string | number> | [import("csstype").WidthProperty<string | number> | undefined, import("csstype").WidthProperty<string | number> | undefined] | [import("csstype").WidthProperty<string | number> | undefined, import("csstype").WidthProperty<string | number> | undefined, import("csstype").WidthProperty<string | number> | undefined] | undefined;
23
24
  cursor?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
@@ -25,7 +26,6 @@ declare const _default: React.ComponentType<{
25
26
  fontSize?: import("csstype").FontSizeProperty<string | number> | [import("csstype").FontSizeProperty<string | number> | undefined, import("csstype").FontSizeProperty<string | number> | undefined] | [import("csstype").FontSizeProperty<string | number> | undefined, import("csstype").FontSizeProperty<string | number> | undefined, import("csstype").FontSizeProperty<string | number> | undefined] | undefined;
26
27
  fontWeight?: import("csstype").FontWeightProperty | [import("csstype").FontWeightProperty | undefined, import("csstype").FontWeightProperty | undefined] | [import("csstype").FontWeightProperty | undefined, import("csstype").FontWeightProperty | undefined, import("csstype").FontWeightProperty | undefined] | undefined;
27
28
  textDecoration?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
28
- borderColor?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
29
29
  margin?: import("csstype").MarginProperty<string | number> | [import("csstype").MarginProperty<string | number> | undefined, import("csstype").MarginProperty<string | number> | undefined] | [import("csstype").MarginProperty<string | number> | undefined, import("csstype").MarginProperty<string | number> | undefined, import("csstype").MarginProperty<string | number> | undefined] | undefined;
30
30
  marginLeft?: import("csstype").MarginLeftProperty<string | number> | [import("csstype").MarginLeftProperty<string | number> | undefined, import("csstype").MarginLeftProperty<string | number> | undefined] | [import("csstype").MarginLeftProperty<string | number> | undefined, import("csstype").MarginLeftProperty<string | number> | undefined, import("csstype").MarginLeftProperty<string | number> | undefined] | undefined;
31
31
  marginRight?: import("csstype").MarginRightProperty<string | number> | [import("csstype").MarginRightProperty<string | number> | undefined, import("csstype").MarginRightProperty<string | number> | undefined] | [import("csstype").MarginRightProperty<string | number> | undefined, import("csstype").MarginRightProperty<string | number> | undefined, import("csstype").MarginRightProperty<string | number> | undefined] | undefined;
@@ -84,6 +84,13 @@ declare const _default: React.ComponentType<{
84
84
  flexDirection?: import("csstype").FlexDirectionProperty | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | undefined;
85
85
  flexBasis?: import("csstype").FlexBasisProperty<string | number> | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | undefined;
86
86
  flexGrow?: import("csstype").GlobalsNumber | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | undefined;
87
+ gridTemplateColumns?: import("csstype").GridTemplateColumnsProperty<string | number> | [import("csstype").GridTemplateColumnsProperty<string | number> | undefined, import("csstype").GridTemplateColumnsProperty<string | number> | undefined] | [import("csstype").GridTemplateColumnsProperty<string | number> | undefined, import("csstype").GridTemplateColumnsProperty<string | number> | undefined, import("csstype").GridTemplateColumnsProperty<string | number> | undefined] | undefined;
87
88
  innerRef?: React.Ref<never> | undefined;
89
+ gridColumnSpan?: number | number[] | "end" | "all" | undefined;
90
+ gridColumnPad?: number | number[] | undefined;
91
+ gridRowSpan?: number | number[] | undefined;
92
+ gridRowPad?: number | number[] | undefined;
93
+ gridAlign?: ("start" | "end" | "center" | "stretch") | undefined;
94
+ gridJustify?: ("start" | "end" | "center" | "stretch") | undefined;
88
95
  }>;
89
96
  export default _default;
package/es/Page.js CHANGED
@@ -144,7 +144,7 @@ var Page = _ref4 => {
144
144
  }, /*#__PURE__*/React.createElement(Div, {
145
145
  ml: "auto",
146
146
  mr: sidebar && !sidebarInside ? 0 : 'auto',
147
- display: sidebar ? ['block', 'block', 'flex'] : undefined,
147
+ display: sidebar && sidebarInside ? ['block', 'block', 'flex'] : undefined,
148
148
  width: type === 'unbounded' ? '100%' : '90%',
149
149
  maxWidth: maxWidthByType[type] || maxWidthByType.narrow
150
150
  }, /*#__PURE__*/React.createElement(Div, {
package/lib/Page.js CHANGED
@@ -161,7 +161,7 @@ var Page = function Page(_ref4) {
161
161
  }, /*#__PURE__*/_react.default.createElement(_elements.Div, {
162
162
  ml: "auto",
163
163
  mr: sidebar && !sidebarInside ? 0 : 'auto',
164
- display: sidebar ? ['block', 'block', 'flex'] : undefined,
164
+ display: sidebar && sidebarInside ? ['block', 'block', 'flex'] : undefined,
165
165
  width: type === 'unbounded' ? '100%' : '90%',
166
166
  maxWidth: maxWidthByType[type] || maxWidthByType.narrow
167
167
  }, /*#__PURE__*/_react.default.createElement(_elements.Div, {
package/package.json CHANGED
@@ -1,8 +1,7 @@
1
1
  {
2
2
  "name": "@cloudflare/component-page",
3
3
  "description": "Cloudflare Page Component",
4
- "version": "6.0.0",
5
- "types": "./dist/index.d.ts",
4
+ "version": "7.1.0",
6
5
  "main": "lib/index.js",
7
6
  "module": "es/index.js",
8
7
  "author": "James Kyle <jkyle@cloudflare.com>",
@@ -10,16 +9,17 @@
10
9
  "publishConfig": {
11
10
  "access": "public",
12
11
  "main": "lib/index.js",
13
- "module": "es/index.js"
12
+ "module": "es/index.js",
13
+ "types": "./dist/index.d.ts"
14
14
  },
15
15
  "dependencies": {
16
- "@cloudflare/component-label": "^4.0.0",
17
- "@cloudflare/elements": "^2.0.0",
16
+ "@cloudflare/component-label": "^5.0.0",
17
+ "@cloudflare/elements": "^3.0.0",
18
18
  "@cloudflare/intl-react": "^1.9.80",
19
19
  "react-router-dom": "^5.1.0"
20
20
  },
21
21
  "peerDependencies": {
22
- "@cloudflare/style-container": "^7.9.0",
22
+ "@cloudflare/style-container": "^7.10.0",
23
23
  "react": "^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0"
24
24
  },
25
25
  "stratus": {
@@ -32,5 +32,6 @@
32
32
  "test": "stratus test",
33
33
  "test-coverage": "stratus test --coverage",
34
34
  "test-watch": "stratus test --watch"
35
- }
35
+ },
36
+ "types": "./dist/index.d.ts"
36
37
  }
package/src/Page.tsx CHANGED
@@ -200,7 +200,9 @@ const Page = ({
200
200
  <Div
201
201
  ml="auto"
202
202
  mr={sidebar && !sidebarInside ? 0 : 'auto'}
203
- display={sidebar ? ['block', 'block', 'flex'] : undefined}
203
+ display={
204
+ sidebar && sidebarInside ? ['block', 'block', 'flex'] : undefined
205
+ }
204
206
  width={type === 'unbounded' ? '100%' : '90%'}
205
207
  maxWidth={maxWidthByType[type] || maxWidthByType.narrow}
206
208
  >