@citygross/components 0.14.0 → 0.14.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/build/@types/components/Chips/Chip.styles.d.ts +1 -8
- package/build/@types/components/RadioBox/RadioBoxList.styles.d.ts +1 -8
- package/build/@types/components/RadioListItem/RadioListItem.styles.d.ts +1 -8
- package/build/@types/components/WarningLabel/WarningLabel.styles.d.ts +1 -8
- package/build/cjs/components/src/components/AlertBox/AlertBox.js +7 -7
- package/build/cjs/components/src/components/Fieldset/Fieldset.js +3 -3
- package/build/cjs/components/src/components/FormElements/Input/Input.js +2 -4
- package/build/cjs/components/src/components/FormElements/Input/Input.js.map +1 -1
- package/build/cjs/components/src/components/Links/Link.js +2 -2
- package/build/cjs/components/src/components/ProductHeader/ProductHeader.js +5 -5
- package/build/es/components/src/components/AlertBox/AlertBox.js +7 -7
- package/build/es/components/src/components/Fieldset/Fieldset.js +3 -3
- package/build/es/components/src/components/FormElements/Input/Input.js +2 -4
- package/build/es/components/src/components/FormElements/Input/Input.js.map +1 -1
- package/build/es/components/src/components/Links/Link.js +3 -3
- package/build/es/components/src/components/ProductHeader/ProductHeader.js +5 -5
- package/package.json +3 -3
|
@@ -9,11 +9,4 @@ export declare type TChip = {
|
|
|
9
9
|
};
|
|
10
10
|
export declare const BaseChip: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TChip, never>;
|
|
11
11
|
export declare const ChipCheckbox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
12
|
-
export declare const ChipLabel: import("styled-components").StyledComponent<({ children, color, fontWeight,
|
|
13
|
-
color?: string | undefined;
|
|
14
|
-
fontWeight?: "regular" | "medium" | "semiBold" | "bold" | "extraBold" | undefined;
|
|
15
|
-
id?: string | undefined;
|
|
16
|
-
lineThrough?: boolean | undefined;
|
|
17
|
-
size?: import("@citygross/typography/build/types/textTypes").TextSize | undefined;
|
|
18
|
-
textAlign?: "center" | "left" | "right" | undefined;
|
|
19
|
-
} & import("react").HTMLAttributes<HTMLParagraphElement>) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
12
|
+
export declare const ChipLabel: import("styled-components").StyledComponent<({ children, color, fontWeight, size, textAlign, ...props }: import("@citygross/typography/build/bodyText/bodyText").TBodyText) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -3,11 +3,4 @@ import { TBaseRadioBox } from './RadioBoxItem.styles';
|
|
|
3
3
|
export declare const BaseRadioBoxList: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TBaseRadioBox, never>;
|
|
4
4
|
export declare const RadioBoxListChildContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TBaseRadioBox, never>;
|
|
5
5
|
export declare const DividerPadding: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
-
export declare const RadioBoxListParagraph: import("styled-components").StyledComponent<({ children, color, fontWeight,
|
|
7
|
-
color?: string | undefined;
|
|
8
|
-
fontWeight?: "regular" | "medium" | "semiBold" | "bold" | "extraBold" | undefined;
|
|
9
|
-
id?: string | undefined;
|
|
10
|
-
lineThrough?: boolean | undefined;
|
|
11
|
-
size?: import("@citygross/typography/build/types/textTypes").TextSize | undefined;
|
|
12
|
-
textAlign?: "center" | "left" | "right" | undefined;
|
|
13
|
-
} & import("react").HTMLAttributes<HTMLParagraphElement>) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const RadioBoxListParagraph: import("styled-components").StyledComponent<({ children, color, fontWeight, size, textAlign, ...props }: import("@citygross/typography/build/bodyText/bodyText").TBodyText) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -20,14 +20,7 @@ export declare const StyledH3: import("styled-components").StyledComponent<({ ch
|
|
|
20
20
|
as: string;
|
|
21
21
|
} & TBaseRadioItemInputWrapper, "as">;
|
|
22
22
|
export declare const RadioRightWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
23
|
-
export declare const DisableText: import("styled-components").StyledComponent<({ children, color, fontWeight,
|
|
24
|
-
color?: string | undefined;
|
|
25
|
-
fontWeight?: "bold" | "regular" | "medium" | "semiBold" | "extraBold" | undefined;
|
|
26
|
-
id?: string | undefined;
|
|
27
|
-
lineThrough?: boolean | undefined;
|
|
28
|
-
size?: import("@citygross/typography/build/types/textTypes").TextSize | undefined;
|
|
29
|
-
textAlign?: "left" | "center" | "right" | undefined;
|
|
30
|
-
} & import("react").HTMLAttributes<HTMLParagraphElement>) => JSX.Element, import("styled-components").DefaultTheme, TWrapMobile, never>;
|
|
23
|
+
export declare const DisableText: import("styled-components").StyledComponent<({ children, color, fontWeight, size, textAlign, ...props }: import("@citygross/typography/build/bodyText/bodyText").TBodyText) => JSX.Element, import("styled-components").DefaultTheme, TWrapMobile, never>;
|
|
31
24
|
export declare const RadioFlex: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TWrapMobile, never>;
|
|
32
25
|
export declare const SecondaryColumn: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
33
26
|
export declare const LabelContentWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -5,11 +5,4 @@ export declare type TWarningIndicator = {
|
|
|
5
5
|
};
|
|
6
6
|
export declare const WarningIndicator: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TWarningIndicator, never>;
|
|
7
7
|
export declare const IconWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
8
|
-
export declare const BodyTextStyled: import("styled-components").StyledComponent<({ children, color, fontWeight,
|
|
9
|
-
color?: string | undefined;
|
|
10
|
-
fontWeight?: "regular" | "medium" | "semiBold" | "bold" | "extraBold" | undefined;
|
|
11
|
-
id?: string | undefined;
|
|
12
|
-
lineThrough?: boolean | undefined;
|
|
13
|
-
size?: import("@citygross/typography/build/types/textTypes").TextSize | undefined;
|
|
14
|
-
textAlign?: "center" | "left" | "right" | undefined;
|
|
15
|
-
} & import("react").HTMLAttributes<HTMLParagraphElement>) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
8
|
+
export declare const BodyTextStyled: import("styled-components").StyledComponent<({ children, color, fontWeight, size, textAlign, ...props }: import("@citygross/typography/build/bodyText/bodyText").TBodyText) => JSX.Element, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -4,11 +4,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _tslib = require('../../../../_virtual/_tslib.js');
|
|
6
6
|
var React = require('react');
|
|
7
|
+
var designTokens = require('@citygross/design-tokens');
|
|
7
8
|
var icons = require('@citygross/icons');
|
|
9
|
+
var typography = require('@citygross/typography');
|
|
8
10
|
var alertBox = require('../../helpers/alert-box.js');
|
|
9
11
|
var AlertBox_styles = require('./AlertBox.styles.js');
|
|
10
|
-
var typography = require('@citygross/typography');
|
|
11
|
-
var designTokens = require('@citygross/design-tokens');
|
|
12
12
|
|
|
13
13
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
14
|
|
|
@@ -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,
|
|
26
|
-
var
|
|
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;
|
|
27
27
|
return (React__default["default"].createElement(AlertBox_styles.AlertBox, _tslib.__assign({ backgroundColor: backgroundColor, borderColor: borderColor }, props),
|
|
28
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 &&
|
|
31
|
-
text && React__default["default"].createElement(typography.BodyText,
|
|
30
|
+
headLine && React__default["default"].createElement(typography.BodyText, { fontWeight: "medium" }, headLine),
|
|
31
|
+
text && React__default["default"].createElement(typography.BodyText, null, text),
|
|
32
32
|
customElement && customElement)));
|
|
33
33
|
}
|
|
34
34
|
|
|
@@ -12,11 +12,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
13
13
|
|
|
14
14
|
var Fieldset = function (_a) {
|
|
15
|
-
var _b, _c
|
|
16
|
-
var children = _a.children,
|
|
15
|
+
var _b, _c;
|
|
16
|
+
var children = _a.children, _d = _a.gap, gap = _d === void 0 ? (_c = (_b = designTokens.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) !== null && _c !== void 0 ? _c : 8 : _d, legend = _a.legend;
|
|
17
17
|
return (React__default["default"].createElement(Fieldset_styles.Fieldset, { gap: gap },
|
|
18
18
|
legend && (React__default["default"].createElement("legend", null,
|
|
19
|
-
React__default["default"].createElement(typography.BodyText, {
|
|
19
|
+
React__default["default"].createElement(typography.BodyText, { fontWeight: "medium", size: typography.TextTypes.TextSize.SMALL }, legend))),
|
|
20
20
|
children));
|
|
21
21
|
};
|
|
22
22
|
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _tslib = require('../../../../../_virtual/_tslib.js');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
var designTokens = require('@citygross/design-tokens');
|
|
8
7
|
var typography = require('@citygross/typography');
|
|
9
8
|
var formElement = require('../../../helpers/form-element.js');
|
|
10
9
|
var FormElement_styles = require('../FormElement.styles.js');
|
|
@@ -16,8 +15,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
16
15
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
17
16
|
|
|
18
17
|
var Input = React__default["default"].forwardRef(function (_a, ref) {
|
|
19
|
-
var _b;
|
|
20
|
-
var elementLeft = _a.elementLeft, elementRight = _a.elementRight, error = _a.error, errorLabel = _a.errorLabel, fullWidth = _a.fullWidth, id = _a.id, hideLabel = _a.hideLabel, label = _a.label, required = _a.required, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? FormElement_types.EFormElementSize.large : _c, unit = _a.unit, props = _tslib.__rest(_a, ["elementLeft", "elementRight", "error", "errorLabel", "fullWidth", "id", "hideLabel", "label", "required", "paddingLeft", "size", "unit"]);
|
|
18
|
+
var elementLeft = _a.elementLeft, elementRight = _a.elementRight, error = _a.error, errorLabel = _a.errorLabel, fullWidth = _a.fullWidth, id = _a.id, hideLabel = _a.hideLabel, label = _a.label, required = _a.required, paddingLeft = _a.paddingLeft, _b = _a.size, size = _b === void 0 ? FormElement_types.EFormElementSize.large : _b, unit = _a.unit, props = _tslib.__rest(_a, ["elementLeft", "elementRight", "error", "errorLabel", "fullWidth", "id", "hideLabel", "label", "required", "paddingLeft", "size", "unit"]);
|
|
21
19
|
var sizeAttributes = formElement.getSizeAttributes(size);
|
|
22
20
|
var errorId = "".concat(id, "-error");
|
|
23
21
|
return (React__default["default"].createElement(FormElement_styles.Wrapper, null,
|
|
@@ -29,7 +27,7 @@ var Input = React__default["default"].forwardRef(function (_a, ref) {
|
|
|
29
27
|
elementLeft && (React__default["default"].createElement(Input_styles.AbsoluteContainer, null, elementLeft)),
|
|
30
28
|
React__default["default"].createElement(Input_styles.InputElement, _tslib.__assign({ "aria-describedby": error && errorLabel ? errorId : undefined, "aria-invalid": !!error, error: error, paddingLeft: paddingLeft, ref: ref, sizeAttributes: sizeAttributes, id: id }, props)),
|
|
31
29
|
elementRight && (React__default["default"].createElement(Input_styles.AbsoluteContainer, { right: true }, elementRight))),
|
|
32
|
-
unit && React__default["default"].createElement(typography.BodyText,
|
|
30
|
+
unit && React__default["default"].createElement(typography.BodyText, null, unit)),
|
|
33
31
|
error && errorLabel && (React__default["default"].createElement(FormElement_styles.ErrorLabel, { id: errorId }, errorLabel))));
|
|
34
32
|
});
|
|
35
33
|
Input.displayName = 'Input';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Input.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -30,9 +30,9 @@ exports.ELinkVariant = void 0;
|
|
|
30
30
|
function Link(_a) {
|
|
31
31
|
var asButton = _a.asButton, borderRadius = _a.borderRadius, children = _a.children, hrefPath = _a.hrefPath, icon = _a.icon, _b = _a.inverted, inverted = _b === void 0 ? false : _b, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, _c = _a.size, size = _c === void 0 ? typography.TextTypes.TextSize.REGULAR : _c, _d = _a.target, target = _d === void 0 ? '_self' : _d, tabIndex = _a.tabIndex, _e = _a.variant, variant = _e === void 0 ? exports.ELinkVariant.PRIMARY : _e, props = _tslib.__rest(_a, ["asButton", "borderRadius", "children", "hrefPath", "icon", "inverted", "isDisabled", "noWrap", "onClick", "size", "target", "tabIndex", "variant"]);
|
|
32
32
|
return asButton ? (React__default["default"].createElement(Link_styles.LinkAsButton, _tslib.__assign({ borderRadius: borderRadius, disabled: isDisabled, icon: icon, inverted: inverted, isDisabled: isDisabled, noWrap: noWrap, onClick: onClick, size: size, variant: variant }, props),
|
|
33
|
-
React__default["default"].createElement(typography.
|
|
33
|
+
React__default["default"].createElement(typography.BodyText, { size: size }, children),
|
|
34
34
|
icon && React__default["default"].createElement(Link_styles.IconWrapper, null, icon))) : (React__default["default"].createElement(Link_styles.BaseLink, _tslib.__assign({ borderRadius: borderRadius, href: hrefPath, isDisabled: isDisabled, icon: icon, inverted: inverted, noWrap: noWrap, onClick: onClick, size: size, tabIndex: tabIndex, target: target, variant: variant }, props),
|
|
35
|
-
React__default["default"].createElement(typography.
|
|
35
|
+
React__default["default"].createElement(typography.BodyText, { size: size }, children),
|
|
36
36
|
icon && React__default["default"].createElement(Link_styles.IconWrapper, null, icon)));
|
|
37
37
|
}
|
|
38
38
|
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var typography = require('@citygross/typography');
|
|
7
6
|
var designTokens = require('@citygross/design-tokens');
|
|
7
|
+
var typography = require('@citygross/typography');
|
|
8
8
|
var ProductHeader_styles = require('./ProductHeader.styles.js');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -18,7 +18,7 @@ exports.EProductHeader = void 0;
|
|
|
18
18
|
EProductHeader["LIST_ITEM"] = "listItem";
|
|
19
19
|
})(exports.EProductHeader || (exports.EProductHeader = {}));
|
|
20
20
|
var ProductHeader = function (_a) {
|
|
21
|
-
var _b, _c, _d, _e, _f
|
|
21
|
+
var _b, _c, _d, _e, _f;
|
|
22
22
|
var location = _a.location, subtitle = _a.subtitle, title = _a.title;
|
|
23
23
|
switch (location) {
|
|
24
24
|
case exports.EProductHeader.DETAIL_PAGE:
|
|
@@ -28,11 +28,11 @@ var ProductHeader = function (_a) {
|
|
|
28
28
|
case exports.EProductHeader.CARD:
|
|
29
29
|
return (React__default["default"].createElement(ProductHeader_styles.Container, null,
|
|
30
30
|
React__default["default"].createElement(typography.H3, { color: (_d = designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.darkest }, title),
|
|
31
|
-
React__default["default"].createElement(typography.BodyText, {
|
|
31
|
+
React__default["default"].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.EXTRASMALL }, subtitle)));
|
|
32
32
|
case exports.EProductHeader.LIST_ITEM:
|
|
33
33
|
return (React__default["default"].createElement(ProductHeader_styles.Container, null,
|
|
34
|
-
React__default["default"].createElement(typography.BodyText, { color: (
|
|
35
|
-
React__default["default"].createElement(typography.BodyText, { color: (
|
|
34
|
+
React__default["default"].createElement(typography.BodyText, { color: (_e = designTokens.theme.palette) === null || _e === void 0 ? void 0 : _e.darkest, fontWeight: "medium", size: typography.TextTypes.TextSize.REGULAR }, title),
|
|
35
|
+
React__default["default"].createElement(typography.BodyText, { color: (_f = designTokens.theme.palette) === null || _f === void 0 ? void 0 : _f.darkest, size: typography.TextTypes.TextSize.EXTRASMALL }, subtitle)));
|
|
36
36
|
default:
|
|
37
37
|
return null;
|
|
38
38
|
}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { __rest, __assign } from '../../../../_virtual/_tslib.js';
|
|
2
2
|
import React from 'react';
|
|
3
|
+
import { theme } from '@citygross/design-tokens';
|
|
3
4
|
import { Icons } from '@citygross/icons';
|
|
5
|
+
import { BodyText } from '@citygross/typography';
|
|
4
6
|
import { getAlertBoxAttributes } from '../../helpers/alert-box.js';
|
|
5
7
|
import { AlertBox as AlertBox$1, AlertBoxContent } from './AlertBox.styles.js';
|
|
6
|
-
import { BodyText } from '@citygross/typography';
|
|
7
|
-
import { theme } from '@citygross/design-tokens';
|
|
8
8
|
|
|
9
9
|
var EAlertBoxVariant;
|
|
10
10
|
(function (EAlertBoxVariant) {
|
|
@@ -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,
|
|
18
|
-
var
|
|
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;
|
|
19
19
|
return (React.createElement(AlertBox$1, __assign({ backgroundColor: backgroundColor, borderColor: borderColor }, props),
|
|
20
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 &&
|
|
23
|
-
text && React.createElement(BodyText,
|
|
22
|
+
headLine && React.createElement(BodyText, { fontWeight: "medium" }, headLine),
|
|
23
|
+
text && React.createElement(BodyText, null, text),
|
|
24
24
|
customElement && customElement)));
|
|
25
25
|
}
|
|
26
26
|
|
|
@@ -4,11 +4,11 @@ import { BodyText, TextTypes } from '@citygross/typography';
|
|
|
4
4
|
import { Fieldset as Fieldset$1 } from './Fieldset.styles.js';
|
|
5
5
|
|
|
6
6
|
var Fieldset = function (_a) {
|
|
7
|
-
var _b, _c
|
|
8
|
-
var children = _a.children,
|
|
7
|
+
var _b, _c;
|
|
8
|
+
var children = _a.children, _d = _a.gap, gap = _d === void 0 ? (_c = (_b = theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) !== null && _c !== void 0 ? _c : 8 : _d, legend = _a.legend;
|
|
9
9
|
return (React.createElement(Fieldset$1, { gap: gap },
|
|
10
10
|
legend && (React.createElement("legend", null,
|
|
11
|
-
React.createElement(BodyText, {
|
|
11
|
+
React.createElement(BodyText, { fontWeight: "medium", size: TextTypes.TextSize.SMALL }, legend))),
|
|
12
12
|
children));
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { __rest, __assign } from '../../../../../_virtual/_tslib.js';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { theme } from '@citygross/design-tokens';
|
|
4
3
|
import { BodyText } from '@citygross/typography';
|
|
5
4
|
import { getSizeAttributes } from '../../../helpers/form-element.js';
|
|
6
5
|
import { Wrapper, HiddenLabel, Label, ErrorLabel } from '../FormElement.styles.js';
|
|
@@ -8,8 +7,7 @@ import { InputWrapper, InputContainer, AbsoluteContainer, InputElement } from '.
|
|
|
8
7
|
import { EFormElementSize } from '../FormElement.types.js';
|
|
9
8
|
|
|
10
9
|
var Input = React.forwardRef(function (_a, ref) {
|
|
11
|
-
var _b;
|
|
12
|
-
var elementLeft = _a.elementLeft, elementRight = _a.elementRight, error = _a.error, errorLabel = _a.errorLabel, fullWidth = _a.fullWidth, id = _a.id, hideLabel = _a.hideLabel, label = _a.label, required = _a.required, paddingLeft = _a.paddingLeft, _c = _a.size, size = _c === void 0 ? EFormElementSize.large : _c, unit = _a.unit, props = __rest(_a, ["elementLeft", "elementRight", "error", "errorLabel", "fullWidth", "id", "hideLabel", "label", "required", "paddingLeft", "size", "unit"]);
|
|
10
|
+
var elementLeft = _a.elementLeft, elementRight = _a.elementRight, error = _a.error, errorLabel = _a.errorLabel, fullWidth = _a.fullWidth, id = _a.id, hideLabel = _a.hideLabel, label = _a.label, required = _a.required, paddingLeft = _a.paddingLeft, _b = _a.size, size = _b === void 0 ? EFormElementSize.large : _b, unit = _a.unit, props = __rest(_a, ["elementLeft", "elementRight", "error", "errorLabel", "fullWidth", "id", "hideLabel", "label", "required", "paddingLeft", "size", "unit"]);
|
|
13
11
|
var sizeAttributes = getSizeAttributes(size);
|
|
14
12
|
var errorId = "".concat(id, "-error");
|
|
15
13
|
return (React.createElement(Wrapper, null,
|
|
@@ -21,7 +19,7 @@ var Input = React.forwardRef(function (_a, ref) {
|
|
|
21
19
|
elementLeft && (React.createElement(AbsoluteContainer, null, elementLeft)),
|
|
22
20
|
React.createElement(InputElement, __assign({ "aria-describedby": error && errorLabel ? errorId : undefined, "aria-invalid": !!error, error: error, paddingLeft: paddingLeft, ref: ref, sizeAttributes: sizeAttributes, id: id }, props)),
|
|
23
21
|
elementRight && (React.createElement(AbsoluteContainer, { right: true }, elementRight))),
|
|
24
|
-
unit && React.createElement(BodyText,
|
|
22
|
+
unit && React.createElement(BodyText, null, unit)),
|
|
25
23
|
error && errorLabel && (React.createElement(ErrorLabel, { id: errorId }, errorLabel))));
|
|
26
24
|
});
|
|
27
25
|
Input.displayName = 'Input';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Input.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __rest, __assign } from '../../../../_virtual/_tslib.js';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { TextTypes,
|
|
3
|
+
import { TextTypes, BodyText } from '@citygross/typography';
|
|
4
4
|
import { LinkAsButton, IconWrapper, BaseLink } from './Link.styles.js';
|
|
5
5
|
|
|
6
6
|
var LinkSize;
|
|
@@ -22,9 +22,9 @@ var ELinkVariant;
|
|
|
22
22
|
function Link(_a) {
|
|
23
23
|
var asButton = _a.asButton, borderRadius = _a.borderRadius, children = _a.children, hrefPath = _a.hrefPath, icon = _a.icon, _b = _a.inverted, inverted = _b === void 0 ? false : _b, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, _c = _a.size, size = _c === void 0 ? TextTypes.TextSize.REGULAR : _c, _d = _a.target, target = _d === void 0 ? '_self' : _d, tabIndex = _a.tabIndex, _e = _a.variant, variant = _e === void 0 ? ELinkVariant.PRIMARY : _e, props = __rest(_a, ["asButton", "borderRadius", "children", "hrefPath", "icon", "inverted", "isDisabled", "noWrap", "onClick", "size", "target", "tabIndex", "variant"]);
|
|
24
24
|
return asButton ? (React.createElement(LinkAsButton, __assign({ borderRadius: borderRadius, disabled: isDisabled, icon: icon, inverted: inverted, isDisabled: isDisabled, noWrap: noWrap, onClick: onClick, size: size, variant: variant }, props),
|
|
25
|
-
React.createElement(
|
|
25
|
+
React.createElement(BodyText, { size: size }, children),
|
|
26
26
|
icon && React.createElement(IconWrapper, null, icon))) : (React.createElement(BaseLink, __assign({ borderRadius: borderRadius, href: hrefPath, isDisabled: isDisabled, icon: icon, inverted: inverted, noWrap: noWrap, onClick: onClick, size: size, tabIndex: tabIndex, target: target, variant: variant }, props),
|
|
27
|
-
React.createElement(
|
|
27
|
+
React.createElement(BodyText, { size: size }, children),
|
|
28
28
|
icon && React.createElement(IconWrapper, null, icon)));
|
|
29
29
|
}
|
|
30
30
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { BodyText, TextTypes, H3, H1 } from '@citygross/typography';
|
|
3
2
|
import { theme } from '@citygross/design-tokens';
|
|
3
|
+
import { BodyText, TextTypes, H3, H1 } from '@citygross/typography';
|
|
4
4
|
import { Container } from './ProductHeader.styles.js';
|
|
5
5
|
|
|
6
6
|
var EProductHeader;
|
|
@@ -10,7 +10,7 @@ var EProductHeader;
|
|
|
10
10
|
EProductHeader["LIST_ITEM"] = "listItem";
|
|
11
11
|
})(EProductHeader || (EProductHeader = {}));
|
|
12
12
|
var ProductHeader = function (_a) {
|
|
13
|
-
var _b, _c, _d, _e, _f
|
|
13
|
+
var _b, _c, _d, _e, _f;
|
|
14
14
|
var location = _a.location, subtitle = _a.subtitle, title = _a.title;
|
|
15
15
|
switch (location) {
|
|
16
16
|
case EProductHeader.DETAIL_PAGE:
|
|
@@ -20,11 +20,11 @@ var ProductHeader = function (_a) {
|
|
|
20
20
|
case EProductHeader.CARD:
|
|
21
21
|
return (React.createElement(Container, null,
|
|
22
22
|
React.createElement(H3, { color: (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.darkest }, title),
|
|
23
|
-
React.createElement(BodyText, {
|
|
23
|
+
React.createElement(BodyText, { size: TextTypes.TextSize.EXTRASMALL }, subtitle)));
|
|
24
24
|
case EProductHeader.LIST_ITEM:
|
|
25
25
|
return (React.createElement(Container, null,
|
|
26
|
-
React.createElement(BodyText, { color: (
|
|
27
|
-
React.createElement(BodyText, { color: (
|
|
26
|
+
React.createElement(BodyText, { color: (_e = theme.palette) === null || _e === void 0 ? void 0 : _e.darkest, fontWeight: "medium", size: TextTypes.TextSize.REGULAR }, title),
|
|
27
|
+
React.createElement(BodyText, { color: (_f = theme.palette) === null || _f === void 0 ? void 0 : _f.darkest, size: TextTypes.TextSize.EXTRASMALL }, subtitle)));
|
|
28
28
|
default:
|
|
29
29
|
return null;
|
|
30
30
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@citygross/components",
|
|
3
|
-
"version": "0.14.
|
|
3
|
+
"version": "0.14.1",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "./build/cjs/components/src/index.js",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"@citygross/design-tokens": "^0.2.80",
|
|
68
68
|
"@citygross/icons": "^0.3.2",
|
|
69
69
|
"@citygross/react-use-bg-wizard": "^0.0.8",
|
|
70
|
-
"@citygross/typography": "^0.0.
|
|
70
|
+
"@citygross/typography": "^0.0.117",
|
|
71
71
|
"@citygross/utils": "^0.0.44",
|
|
72
72
|
"framer-motion": "^4.1.17",
|
|
73
73
|
"moment": "^2.29.1",
|
|
@@ -75,5 +75,5 @@
|
|
|
75
75
|
"react-slick": "^0.30.1",
|
|
76
76
|
"slick-carousel": "^1.8.1"
|
|
77
77
|
},
|
|
78
|
-
"gitHead": "
|
|
78
|
+
"gitHead": "9cd386e7e3379dd334507dc20128b9aa39c6ad0e"
|
|
79
79
|
}
|