carbon-react 143.2.5 → 144.0.1
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.
- package/esm/components/advanced-color-picker/advanced-color-picker.style.js +1 -5
- package/esm/components/dialog/dialog.component.js +29 -103
- package/esm/components/dialog/dialog.config.d.ts +0 -4
- package/esm/components/dialog/dialog.config.js +1 -5
- package/esm/components/dialog/dialog.style.d.ts +6 -14
- package/esm/components/dialog/dialog.style.js +54 -83
- package/esm/components/dialog-full-screen/content.style.js +32 -74
- package/esm/components/dialog-full-screen/dialog-full-screen.style.js +0 -5
- package/esm/components/form/form.component.js +8 -17
- package/esm/components/form/form.style.d.ts +10 -6
- package/esm/components/form/form.style.js +12 -25
- package/esm/components/menu/__internal__/submenu/submenu.style.js +8 -5
- package/esm/components/menu/menu-item/menu-item.component.d.ts +1 -1
- package/esm/components/menu/menu-item/menu-item.component.js +3 -1
- package/esm/components/menu/menu-item/menu-item.style.d.ts +1 -0
- package/esm/components/menu/menu-item/menu-item.style.js +58 -24
- package/esm/components/menu/menu.component.d.ts +1 -1
- package/esm/components/menu/menu.style.js +13 -0
- package/esm/components/sidebar/sidebar.component.js +8 -18
- package/esm/components/sidebar/sidebar.config.d.ts +0 -4
- package/esm/components/sidebar/sidebar.config.js +1 -5
- package/esm/components/sidebar/sidebar.style.d.ts +4 -2
- package/esm/components/sidebar/sidebar.style.js +26 -12
- package/lib/components/advanced-color-picker/advanced-color-picker.style.js +0 -4
- package/lib/components/dialog/dialog.component.js +27 -101
- package/lib/components/dialog/dialog.config.d.ts +0 -4
- package/lib/components/dialog/dialog.config.js +2 -6
- package/lib/components/dialog/dialog.style.d.ts +6 -14
- package/lib/components/dialog/dialog.style.js +54 -83
- package/lib/components/dialog-full-screen/content.style.js +31 -73
- package/lib/components/dialog-full-screen/dialog-full-screen.style.js +0 -5
- package/lib/components/form/form.component.js +7 -16
- package/lib/components/form/form.style.d.ts +10 -6
- package/lib/components/form/form.style.js +12 -25
- package/lib/components/menu/__internal__/submenu/submenu.style.js +8 -5
- package/lib/components/menu/menu-item/menu-item.component.d.ts +1 -1
- package/lib/components/menu/menu-item/menu-item.component.js +3 -1
- package/lib/components/menu/menu-item/menu-item.style.d.ts +1 -0
- package/lib/components/menu/menu-item/menu-item.style.js +58 -24
- package/lib/components/menu/menu.component.d.ts +1 -1
- package/lib/components/menu/menu.style.js +13 -0
- package/lib/components/sidebar/sidebar.component.js +7 -17
- package/lib/components/sidebar/sidebar.config.d.ts +0 -4
- package/lib/components/sidebar/sidebar.config.js +2 -6
- package/lib/components/sidebar/sidebar.style.d.ts +4 -2
- package/lib/components/sidebar/sidebar.style.js +28 -15
- package/package.json +1 -1
- package/esm/style/utils/form-style-utils.d.ts +0 -21
- package/esm/style/utils/form-style-utils.js +0 -92
- package/lib/style/utils/form-style-utils.d.ts +0 -21
- package/lib/style/utils/form-style-utils.js +0 -100
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { PaddingProps } from "styled-system";
|
|
2
|
-
declare type ContainerComponent = "dialog" | "sidebar";
|
|
3
|
-
export declare const calculateWidthValue: (props: PaddingProps) => string;
|
|
4
|
-
export declare const calculateFormSpacingValues: (props: PaddingProps, isFormContent: boolean, containerComponent?: ContainerComponent) => {
|
|
5
|
-
"margin-top": string;
|
|
6
|
-
"padding-top": string;
|
|
7
|
-
"padding-bottom": string | undefined;
|
|
8
|
-
"padding-left": string;
|
|
9
|
-
"padding-right": string;
|
|
10
|
-
"margin-left": string;
|
|
11
|
-
"margin-right": string;
|
|
12
|
-
} | {
|
|
13
|
-
":not(.padded)"?: {
|
|
14
|
-
"padding-left": string;
|
|
15
|
-
"padding-right": string;
|
|
16
|
-
} | undefined;
|
|
17
|
-
"margin-bottom": string;
|
|
18
|
-
"margin-left": string;
|
|
19
|
-
"margin-right": string;
|
|
20
|
-
};
|
|
21
|
-
export {};
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.calculateWidthValue = exports.calculateFormSpacingValues = void 0;
|
|
7
|
-
var _styledSystem = require("styled-system");
|
|
8
|
-
var _dialog = require("../../components/dialog/dialog.config");
|
|
9
|
-
var _sidebar = require("../../components/sidebar/sidebar.config");
|
|
10
|
-
const parsePadding = paddingString => {
|
|
11
|
-
const paddingValues = paddingString.split(/\s+/);
|
|
12
|
-
let paddingTop, paddingBottom, paddingLeft, paddingRight;
|
|
13
|
-
switch (paddingValues.length) {
|
|
14
|
-
case 1:
|
|
15
|
-
{
|
|
16
|
-
const [value] = paddingValues;
|
|
17
|
-
[paddingTop, paddingRight, paddingBottom, paddingLeft] = [value, value, value, value];
|
|
18
|
-
break;
|
|
19
|
-
}
|
|
20
|
-
case 2:
|
|
21
|
-
{
|
|
22
|
-
const [vertical, horizontal] = paddingValues;
|
|
23
|
-
[paddingTop, paddingRight, paddingBottom, paddingLeft] = [vertical, horizontal, vertical, horizontal];
|
|
24
|
-
break;
|
|
25
|
-
}
|
|
26
|
-
case 3:
|
|
27
|
-
{
|
|
28
|
-
const [top, horizontal, bottom] = paddingValues;
|
|
29
|
-
[paddingTop, paddingRight, paddingBottom, paddingLeft] = [top, horizontal, bottom, horizontal];
|
|
30
|
-
break;
|
|
31
|
-
}
|
|
32
|
-
case 4:
|
|
33
|
-
{
|
|
34
|
-
[paddingTop, paddingRight, paddingBottom, paddingLeft] = paddingValues;
|
|
35
|
-
break;
|
|
36
|
-
}
|
|
37
|
-
/* istanbul ignore next */
|
|
38
|
-
default:
|
|
39
|
-
break;
|
|
40
|
-
}
|
|
41
|
-
return {
|
|
42
|
-
paddingTop,
|
|
43
|
-
paddingBottom,
|
|
44
|
-
paddingLeft,
|
|
45
|
-
paddingRight
|
|
46
|
-
};
|
|
47
|
-
};
|
|
48
|
-
const calculatePadding = props => {
|
|
49
|
-
const {
|
|
50
|
-
padding,
|
|
51
|
-
...individualPaddingProperties
|
|
52
|
-
} = (0, _styledSystem.padding)(props);
|
|
53
|
-
const result = padding ? parsePadding(padding) : {};
|
|
54
|
-
Object.assign(result, individualPaddingProperties);
|
|
55
|
-
return result;
|
|
56
|
-
};
|
|
57
|
-
const calculateWidthValue = props => {
|
|
58
|
-
const {
|
|
59
|
-
paddingLeft,
|
|
60
|
-
paddingRight
|
|
61
|
-
} = calculatePadding(props);
|
|
62
|
-
const paddingValue = `(${paddingLeft ?? `${_dialog.HORIZONTAL_PADDING}px`} + ${paddingRight ?? `${_dialog.HORIZONTAL_PADDING}px`})`;
|
|
63
|
-
return `width: calc(100% + ${paddingValue});`;
|
|
64
|
-
};
|
|
65
|
-
exports.calculateWidthValue = calculateWidthValue;
|
|
66
|
-
const calculateFormSpacingValues = (props, isFormContent, containerComponent = "dialog") => {
|
|
67
|
-
const {
|
|
68
|
-
paddingTop,
|
|
69
|
-
paddingBottom,
|
|
70
|
-
paddingLeft,
|
|
71
|
-
paddingRight
|
|
72
|
-
} = calculatePadding(props);
|
|
73
|
-
const isSidebar = containerComponent === "sidebar";
|
|
74
|
-
const spacingTopValue = paddingTop ?? (isSidebar ? _sidebar.SIDEBAR_TOP_SPACING : `${_dialog.CONTENT_TOP_PADDING}px`);
|
|
75
|
-
const spacingRightValue = paddingRight ?? `${_dialog.HORIZONTAL_PADDING}px`;
|
|
76
|
-
const spacingBottomValue = paddingBottom ?? (isSidebar ? _sidebar.SIDEBAR_BOTTOM_SPACING : `${_dialog.CONTENT_BOTTOM_PADDING}px`);
|
|
77
|
-
const spacingLeftValue = paddingLeft ?? `${_dialog.HORIZONTAL_PADDING}px`;
|
|
78
|
-
const setNegativeValue = value => `calc(-1 * ${value})`;
|
|
79
|
-
return {
|
|
80
|
-
"margin-left": setNegativeValue(spacingLeftValue),
|
|
81
|
-
"margin-right": setNegativeValue(spacingRightValue),
|
|
82
|
-
...(isFormContent ? {
|
|
83
|
-
"margin-top": setNegativeValue(spacingTopValue),
|
|
84
|
-
"padding-top": spacingTopValue,
|
|
85
|
-
"padding-bottom": isSidebar ? undefined : spacingBottomValue,
|
|
86
|
-
"padding-left": spacingLeftValue,
|
|
87
|
-
"padding-right": spacingRightValue
|
|
88
|
-
} : {
|
|
89
|
-
"margin-bottom": setNegativeValue(spacingBottomValue),
|
|
90
|
-
...(isSidebar && {
|
|
91
|
-
// if footer already has custom padding do not set
|
|
92
|
-
":not(.padded)": {
|
|
93
|
-
"padding-left": _sidebar.SIDEBAR_LEFT_PADDING,
|
|
94
|
-
"padding-right": _sidebar.SIDEBAR_RIGHT_PADDING
|
|
95
|
-
}
|
|
96
|
-
})
|
|
97
|
-
})
|
|
98
|
-
};
|
|
99
|
-
};
|
|
100
|
-
exports.calculateFormSpacingValues = calculateFormSpacingValues;
|