@citygross/components 0.8.155 → 0.8.157

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 (15) hide show
  1. package/build/@types/components/FormElements/Input/Input.d.ts +2 -1
  2. package/build/@types/components/FormElements/Input/Input.styles.d.ts +3 -1
  3. package/build/cjs/components/src/components/AlertBox/AlertBox.js +6 -6
  4. package/build/cjs/components/src/components/AlertBox/AlertBox.styles.js +9 -1
  5. package/build/cjs/components/src/components/AlertBox/AlertBox.styles.js.map +1 -1
  6. package/build/cjs/components/src/components/FormElements/Input/Input.js +2 -2
  7. package/build/cjs/components/src/components/FormElements/Input/Input.styles.js +4 -1
  8. package/build/cjs/components/src/components/FormElements/Input/Input.styles.js.map +1 -1
  9. package/build/es/components/src/components/AlertBox/AlertBox.js +6 -6
  10. package/build/es/components/src/components/AlertBox/AlertBox.styles.js +9 -1
  11. package/build/es/components/src/components/AlertBox/AlertBox.styles.js.map +1 -1
  12. package/build/es/components/src/components/FormElements/Input/Input.js +2 -2
  13. package/build/es/components/src/components/FormElements/Input/Input.styles.js +4 -1
  14. package/build/es/components/src/components/FormElements/Input/Input.styles.js.map +1 -1
  15. package/package.json +2 -2
package/build/@types/components/FormElements/Input/Input.d.ts CHANGED
@@ -3,9 +3,10 @@ import { TFormElement } from '../FormElement.types';
3
3
  export declare type TInput = {
4
4
  elementLeft?: React.ReactElement;
5
5
  elementRight?: React.ReactElement;
6
+ fullWidth?: boolean;
6
7
  hideLabel?: boolean;
7
8
  label: string;
8
9
  paddingLeft?: number;
9
10
  unit?: string;
10
11
  } & TFormElement & Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>;
11
- export declare const Input: ({ elementLeft, elementRight, hideLabel, error, errorLabel, label, paddingLeft, size, unit, ...props }: TInput) => JSX.Element;
12
+ export declare const Input: ({ elementLeft, elementRight, fullWidth, hideLabel, error, errorLabel, label, paddingLeft, size, unit, ...props }: TInput) => JSX.Element;
package/build/@types/components/FormElements/Input/Input.styles.d.ts CHANGED
@@ -1,5 +1,7 @@
1
+ import { TInput } from './Input';
1
2
  export declare const InputWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
2
- export declare const InputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
3
+ declare type TInputContainer = Pick<TInput, 'fullWidth'>;
4
+ export declare const InputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TInputContainer, never>;
3
5
  export declare const InputElement: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {
4
6
  paddingLeft?: number | undefined;
5
7
  } & {
package/build/cjs/components/src/components/AlertBox/AlertBox.js CHANGED
@@ -21,14 +21,14 @@ exports.EAlertBoxVariant = void 0;
21
21
  EAlertBoxVariant["warning"] = "warning";
22
22
  })(exports.EAlertBoxVariant || (exports.EAlertBoxVariant = {}));
23
23
  function AlertBox(_a) {
24
- var _b, _c;
25
- var customElement = _a.customElement, headLine = _a.headLine, text = _a.text, _d = _a.variant, variant = _d === void 0 ? exports.EAlertBoxVariant.info : _d, props = _tslib.__rest(_a, ["customElement", "headLine", "text", "variant"]);
26
- var _e = alertBox.getAlertBoxAttributes(variant), backgroundColor = _e.backgroundColor, borderColor = _e.borderColor, iconColor = _e.iconColor;
24
+ var _b, _c, _d, _e;
25
+ var customElement = _a.customElement, headLine = _a.headLine, text = _a.text, _f = _a.variant, variant = _f === void 0 ? exports.EAlertBoxVariant.info : _f, props = _tslib.__rest(_a, ["customElement", "headLine", "text", "variant"]);
26
+ var _g = alertBox.getAlertBoxAttributes(variant), backgroundColor = _g.backgroundColor, borderColor = _g.borderColor, iconColor = _g.iconColor;
27
27
  return (React__default["default"].createElement(AlertBox_styles.AlertBox, _tslib.__assign({ backgroundColor: backgroundColor, borderColor: borderColor }, props),
28
- React__default["default"].createElement(icons.Icons.Info, { color: iconColor, height: 16, width: 16 }),
28
+ React__default["default"].createElement(icons.Icons.Info, { color: iconColor, height: (_b = designTokens.theme.spacings) === null || _b === void 0 ? void 0 : _b.sm, width: (_c = designTokens.theme.spacings) === null || _c === void 0 ? void 0 : _c.sm }),
29
29
  React__default["default"].createElement(AlertBox_styles.AlertBoxContent, null,
30
- headLine && (React__default["default"].createElement(typography.BodyText, { color: (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.darkest, fontWeight: "medium" }, headLine)),
31
- text && React__default["default"].createElement(typography.BodyText, { color: (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.darkest }, text),
30
+ headLine && (React__default["default"].createElement(typography.BodyText, { color: (_d = designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.darkest, fontWeight: "medium" }, headLine)),
31
+ text && React__default["default"].createElement(typography.BodyText, { color: (_e = designTokens.theme.palette) === null || _e === void 0 ? void 0 : _e.darkest }, text),
32
32
  customElement && customElement)));
33
33
  }
34
34
 
package/build/cjs/components/src/components/AlertBox/AlertBox.styles.js CHANGED
@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
9
9
 
10
10
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
11
 
12
- var AlertBox = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n margin-top: ", "px;\n }\n"], ["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n margin-top: ", "px;\n }\n"])), function (_a) {
12
+ var AlertBox = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n flex-shrink: 0;\n height: ", "px;\n width: ", "px;\n margin-top: ", "px;\n }\n"], ["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n flex-shrink: 0;\n height: ", "px;\n width: ", "px;\n margin-top: ", "px;\n }\n"])), function (_a) {
13
13
  var backgroundColor = _a.backgroundColor;
14
14
  return backgroundColor;
15
15
  }, function (_a) {
@@ -28,6 +28,14 @@ var AlertBox = styled__default["default"].div(templateObject_1 || (templateObjec
28
28
  var _b;
29
29
  var theme = _a.theme;
30
30
  return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
31
+ }, function (_a) {
32
+ var _b;
33
+ var theme = _a.theme;
34
+ return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
35
+ }, function (_a) {
36
+ var _b;
37
+ var theme = _a.theme;
38
+ return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
31
39
  }, function (_a) {
32
40
  var _b;
33
41
  var theme = _a.theme;
package/build/cjs/components/src/components/AlertBox/AlertBox.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AlertBox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AlertBox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/FormElements/Input/Input.js CHANGED
@@ -18,7 +18,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
18
 
19
19
  var Input = function (_a) {
20
20
  var _b;
21
- var elementLeft = _a.elementLeft, elementRight = _a.elementRight, hideLabel = _a.hideLabel, error = _a.error, errorLabel = _a.errorLabel, label = _a.label, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? FormElement_types.EFormElementSize.large : _c, unit = _a.unit, props = _tslib.__rest(_a, ["elementLeft", "elementRight", "hideLabel", "error", "errorLabel", "label", "paddingLeft", "size", "unit"]);
21
+ var elementLeft = _a.elementLeft, elementRight = _a.elementRight, fullWidth = _a.fullWidth, hideLabel = _a.hideLabel, error = _a.error, errorLabel = _a.errorLabel, label = _a.label, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? FormElement_types.EFormElementSize.large : _c, unit = _a.unit, props = _tslib.__rest(_a, ["elementLeft", "elementRight", "fullWidth", "hideLabel", "error", "errorLabel", "label", "paddingLeft", "size", "unit"]);
22
22
  var id = props.id, required = props.required;
23
23
  var sizeAttributes = formElement.getSizeAttributes(size);
24
24
  var errorId = "".concat(id, "-error");
@@ -27,7 +27,7 @@ var Input = function (_a) {
27
27
  label,
28
28
  required ? ' *' : ''))),
29
29
  React__default["default"].createElement(Input_styles.InputWrapper, null,
30
- React__default["default"].createElement(Input_styles.InputContainer, null,
30
+ React__default["default"].createElement(Input_styles.InputContainer, { fullWidth: fullWidth },
31
31
  elementLeft && (React__default["default"].createElement(Input_styles.AbsoluteContainer, null, elementLeft)),
32
32
  React__default["default"].createElement(Input_styles.InputElement, _tslib.__assign({ "aria-describedby": error && errorLabel ? errorId : undefined, "aria-invalid": !!error, error: error, paddingLeft: paddingLeft, sizeAttributes: sizeAttributes }, props)),
33
33
  elementRight && (React__default["default"].createElement(Input_styles.AbsoluteContainer, { right: true }, elementRight))),
package/build/cjs/components/src/components/FormElements/Input/Input.styles.js CHANGED
@@ -15,7 +15,10 @@ var InputWrapper = styled__default["default"].div(templateObject_1 || (templateO
15
15
  var theme = _a.theme;
16
16
  return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.xs;
17
17
  });
18
- var InputContainer = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n position: relative;\n width: 100%;\n"], ["\n position: relative;\n width: 100%;\n"])));
18
+ var InputContainer = styled__default["default"].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), function (_a) {
19
+ var fullWidth = _a.fullWidth;
20
+ return fullWidth && "width: 100%;";
21
+ });
19
22
  var InputElement = styled__default["default"].input(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), FormElement_styles.sharedFormElementStyles, function (_a) {
20
23
  var paddingLeft = _a.paddingLeft;
21
24
  return paddingLeft && "padding-left: ".concat(paddingLeft, "px;");
package/build/cjs/components/src/components/FormElements/Input/Input.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/AlertBox/AlertBox.js CHANGED
@@ -13,14 +13,14 @@ var EAlertBoxVariant;
13
13
  EAlertBoxVariant["warning"] = "warning";
14
14
  })(EAlertBoxVariant || (EAlertBoxVariant = {}));
15
15
  function AlertBox(_a) {
16
- var _b, _c;
17
- var customElement = _a.customElement, headLine = _a.headLine, text = _a.text, _d = _a.variant, variant = _d === void 0 ? EAlertBoxVariant.info : _d, props = __rest(_a, ["customElement", "headLine", "text", "variant"]);
18
- var _e = getAlertBoxAttributes(variant), backgroundColor = _e.backgroundColor, borderColor = _e.borderColor, iconColor = _e.iconColor;
16
+ var _b, _c, _d, _e;
17
+ var customElement = _a.customElement, headLine = _a.headLine, text = _a.text, _f = _a.variant, variant = _f === void 0 ? EAlertBoxVariant.info : _f, props = __rest(_a, ["customElement", "headLine", "text", "variant"]);
18
+ var _g = getAlertBoxAttributes(variant), backgroundColor = _g.backgroundColor, borderColor = _g.borderColor, iconColor = _g.iconColor;
19
19
  return (React.createElement(AlertBox$1, __assign({ backgroundColor: backgroundColor, borderColor: borderColor }, props),
20
- React.createElement(Icons.Info, { color: iconColor, height: 16, width: 16 }),
20
+ React.createElement(Icons.Info, { color: iconColor, height: (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm, width: (_c = theme.spacings) === null || _c === void 0 ? void 0 : _c.sm }),
21
21
  React.createElement(AlertBoxContent, null,
22
- headLine && (React.createElement(BodyText, { color: (_b = theme.palette) === null || _b === void 0 ? void 0 : _b.darkest, fontWeight: "medium" }, headLine)),
23
- text && React.createElement(BodyText, { color: (_c = theme.palette) === null || _c === void 0 ? void 0 : _c.darkest }, text),
22
+ headLine && (React.createElement(BodyText, { color: (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.darkest, fontWeight: "medium" }, headLine)),
23
+ text && React.createElement(BodyText, { color: (_e = theme.palette) === null || _e === void 0 ? void 0 : _e.darkest }, text),
24
24
  customElement && customElement)));
25
25
  }
26
26
 
package/build/es/components/src/components/AlertBox/AlertBox.styles.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
3
 
4
- var AlertBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n margin-top: ", "px;\n }\n"], ["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n margin-top: ", "px;\n }\n"])), function (_a) {
4
+ var AlertBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n flex-shrink: 0;\n height: ", "px;\n width: ", "px;\n margin-top: ", "px;\n }\n"], ["\n background: ", ";\n border-left: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n display: flex;\n gap: ", "px;\n padding: ", "px;\n\n svg {\n flex-shrink: 0;\n height: ", "px;\n width: ", "px;\n margin-top: ", "px;\n }\n"])), function (_a) {
5
5
  var backgroundColor = _a.backgroundColor;
6
6
  return backgroundColor;
7
7
  }, function (_a) {
@@ -20,6 +20,14 @@ var AlertBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplate
20
20
  var _b;
21
21
  var theme = _a.theme;
22
22
  return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
23
+ }, function (_a) {
24
+ var _b;
25
+ var theme = _a.theme;
26
+ return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
27
+ }, function (_a) {
28
+ var _b;
29
+ var theme = _a.theme;
30
+ return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.sm;
23
31
  }, function (_a) {
24
32
  var _b;
25
33
  var theme = _a.theme;
package/build/es/components/src/components/AlertBox/AlertBox.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AlertBox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AlertBox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/FormElements/Input/Input.js CHANGED
@@ -10,7 +10,7 @@ import { EFormElementSize } from '../FormElement.types.js';
10
10
 
11
11
  var Input = function (_a) {
12
12
  var _b;
13
- var elementLeft = _a.elementLeft, elementRight = _a.elementRight, hideLabel = _a.hideLabel, error = _a.error, errorLabel = _a.errorLabel, label = _a.label, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? EFormElementSize.large : _c, unit = _a.unit, props = __rest(_a, ["elementLeft", "elementRight", "hideLabel", "error", "errorLabel", "label", "paddingLeft", "size", "unit"]);
13
+ var elementLeft = _a.elementLeft, elementRight = _a.elementRight, fullWidth = _a.fullWidth, hideLabel = _a.hideLabel, error = _a.error, errorLabel = _a.errorLabel, label = _a.label, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? EFormElementSize.large : _c, unit = _a.unit, props = __rest(_a, ["elementLeft", "elementRight", "fullWidth", "hideLabel", "error", "errorLabel", "label", "paddingLeft", "size", "unit"]);
14
14
  var id = props.id, required = props.required;
15
15
  var sizeAttributes = getSizeAttributes(size);
16
16
  var errorId = "".concat(id, "-error");
@@ -19,7 +19,7 @@ var Input = function (_a) {
19
19
  label,
20
20
  required ? ' *' : ''))),
21
21
  React.createElement(InputWrapper, null,
22
- React.createElement(InputContainer, null,
22
+ React.createElement(InputContainer, { fullWidth: fullWidth },
23
23
  elementLeft && (React.createElement(AbsoluteContainer, null, elementLeft)),
24
24
  React.createElement(InputElement, __assign({ "aria-describedby": error && errorLabel ? errorId : undefined, "aria-invalid": !!error, error: error, paddingLeft: paddingLeft, sizeAttributes: sizeAttributes }, props)),
25
25
  elementRight && (React.createElement(AbsoluteContainer, { right: true }, elementRight))),
package/build/es/components/src/components/FormElements/Input/Input.styles.js CHANGED
@@ -7,7 +7,10 @@ var InputWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemp
7
7
  var theme = _a.theme;
8
8
  return (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.xs;
9
9
  });
10
- var InputContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n width: 100%;\n"], ["\n position: relative;\n width: 100%;\n"])));
10
+ var InputContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n ", "\n"], ["\n position: relative;\n ", "\n"])), function (_a) {
11
+ var fullWidth = _a.fullWidth;
12
+ return fullWidth && "width: 100%;";
13
+ });
11
14
  var InputElement = styled.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), sharedFormElementStyles, function (_a) {
12
15
  var paddingLeft = _a.paddingLeft;
13
16
  return paddingLeft && "padding-left: ".concat(paddingLeft, "px;");
package/build/es/components/src/components/FormElements/Input/Input.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.155",
3
+ "version": "0.8.157",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -74,5 +74,5 @@
74
74
  "react-slick": "^0.30.1",
75
75
  "slick-carousel": "^1.8.1"
76
76
  },
77
- "gitHead": "cb6c963306b03ccbc56103b84a9042c3ccf29255"
77
+ "gitHead": "8bf2ee39f36d0bb8d7145c06f379b7cd79b756b7"
78
78
  }