@citygross/components 0.7.62 → 0.7.63
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 -1
- package/build/cjs/components/src/components/Chips/Chip.js +5 -4
- package/build/cjs/components/src/components/Chips/Chip.js.map +1 -1
- package/build/cjs/components/src/components/Chips/Chip.styles.js +4 -5
- package/build/cjs/components/src/components/Chips/Chip.styles.js.map +1 -1
- package/build/es/components/src/components/Chips/Chip.js +5 -4
- package/build/es/components/src/components/Chips/Chip.js.map +1 -1
- package/build/es/components/src/components/Chips/Chip.styles.js +4 -5
- package/build/es/components/src/components/Chips/Chip.styles.js.map +1 -1
- package/package.json +2 -2
|
@@ -6,7 +6,7 @@ export declare type TChip = {
|
|
|
6
6
|
background?: string;
|
|
7
7
|
activeBackground?: string;
|
|
8
8
|
};
|
|
9
|
-
export declare const BaseChip: import("styled-components").StyledComponent<
|
|
9
|
+
export declare const BaseChip: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TChip, never>;
|
|
10
10
|
export declare const ChipCheckbox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
11
11
|
export declare const ChipLabel: import("styled-components").StyledComponent<({ size, color, children, lineThrough, fontWeight, ...props }: {
|
|
12
12
|
children: import("react").ReactNode;
|
|
@@ -13,11 +13,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
13
13
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
14
14
|
|
|
15
15
|
function Chip(_a) {
|
|
16
|
-
var _b, _c, _d
|
|
17
|
-
var label = _a.label, checked = _a.checked, onClick = _a.onClick,
|
|
18
|
-
return (React__default['default'].createElement(Chip_styles.BaseChip, { checked: checked, onClick: onClick, background: background, activeBackground: activeBackground
|
|
16
|
+
var _b, _c, _d;
|
|
17
|
+
var label = _a.label, checked = _a.checked, onClick = _a.onClick, _e = _a.background, background = _e === void 0 ? (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.lighter : _e, _f = _a.activeBackground, activeBackground = _f === void 0 ? (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.white : _f;
|
|
18
|
+
return (React__default['default'].createElement(Chip_styles.BaseChip, { checked: checked, onClick: onClick, background: background, activeBackground: activeBackground },
|
|
19
19
|
checked
|
|
20
|
-
? (React__default['default'].createElement(
|
|
20
|
+
? (React__default['default'].createElement(Chip_styles.ChipCheckbox, null,
|
|
21
|
+
React__default['default'].createElement(Icon.Icons.CheckMark, { color: (_d = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.alertGreen, width: 12, height: 12, viewBox: '0 0 25 25' })))
|
|
21
22
|
: (React__default['default'].createElement(Chip_styles.ChipCheckbox, null)),
|
|
22
23
|
React__default['default'].createElement(Chip_styles.ChipLabel, { forwardedAs: 'label', size: typography.TextTypes.TextSize.SMALL }, label)));
|
|
23
24
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Chip.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -5,22 +5,21 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _tslib = require('../../../../_virtual/_tslib.js');
|
|
6
6
|
var styled = require('styled-components');
|
|
7
7
|
var typography = require('@citygross/typography');
|
|
8
|
-
var framerMotion = require('framer-motion');
|
|
9
8
|
|
|
10
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
10
|
|
|
12
11
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
13
12
|
|
|
14
|
-
var BaseChip = styled__default['default']
|
|
13
|
+
var BaseChip = styled__default['default'].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n gap: ", "px;\n border-radius: ", "px;\n background: ", ";\n /* static for height of chip */\n padding: ", "px\n ", "px;\n ", ";\n cursor: pointer;\n"], ["\n display: inline-flex;\n align-items: center;\n gap: ", "px;\n border-radius: ", "px;\n background: ", ";\n /* static for height of chip */\n padding: ", "px\n ", "px;\n ", ";\n cursor: pointer;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) {
|
|
15
14
|
return props.checked
|
|
16
15
|
? props.activeBackground && props.activeBackground
|
|
17
16
|
: props.background && props.background;
|
|
18
17
|
}, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) {
|
|
19
|
-
var _a
|
|
18
|
+
var _a;
|
|
20
19
|
return props.checked &&
|
|
21
|
-
"box-shadow: 0 0 0 1px inset " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen)
|
|
20
|
+
"box-shadow: 0 0 0 1px inset " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen);
|
|
22
21
|
});
|
|
23
|
-
var ChipCheckbox = styled__default['default'].span(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"], ["\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.extraSmall; });
|
|
22
|
+
var ChipCheckbox = styled__default['default'].span(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n display: flex;\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"], ["\n display: flex;\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.extraSmall; });
|
|
24
23
|
var ChipLabel = styled__default['default'](typography.BodyText)(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n pointer-events: none;\n"], ["\n pointer-events: none;\n"])));
|
|
25
24
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
26
25
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Chip.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -5,11 +5,12 @@ import { BaseChip, ChipCheckbox, ChipLabel } from './Chip.styles.js';
|
|
|
5
5
|
import { theme } from '@citygross/design-tokens';
|
|
6
6
|
|
|
7
7
|
function Chip(_a) {
|
|
8
|
-
var _b, _c, _d
|
|
9
|
-
var label = _a.label, checked = _a.checked, onClick = _a.onClick,
|
|
10
|
-
return (React.createElement(BaseChip, { checked: checked, onClick: onClick, background: background, activeBackground: activeBackground
|
|
8
|
+
var _b, _c, _d;
|
|
9
|
+
var label = _a.label, checked = _a.checked, onClick = _a.onClick, _e = _a.background, background = _e === void 0 ? (_b = theme.palette) === null || _b === void 0 ? void 0 : _b.lighter : _e, _f = _a.activeBackground, activeBackground = _f === void 0 ? (_c = theme.palette) === null || _c === void 0 ? void 0 : _c.white : _f;
|
|
10
|
+
return (React.createElement(BaseChip, { checked: checked, onClick: onClick, background: background, activeBackground: activeBackground },
|
|
11
11
|
checked
|
|
12
|
-
? (React.createElement(
|
|
12
|
+
? (React.createElement(ChipCheckbox, null,
|
|
13
|
+
React.createElement(Icons.CheckMark, { color: (_d = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _d === void 0 ? void 0 : _d.alertGreen, width: 12, height: 12, viewBox: '0 0 25 25' })))
|
|
13
14
|
: (React.createElement(ChipCheckbox, null)),
|
|
14
15
|
React.createElement(ChipLabel, { forwardedAs: 'label', size: TextTypes.TextSize.SMALL }, label)));
|
|
15
16
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Chip.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,18 +1,17 @@
|
|
|
1
1
|
import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
|
|
2
2
|
import styled from 'styled-components';
|
|
3
3
|
import { BodyText } from '@citygross/typography';
|
|
4
|
-
import { motion } from 'framer-motion';
|
|
5
4
|
|
|
6
|
-
var BaseChip = styled
|
|
5
|
+
var BaseChip = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n gap: ", "px;\n border-radius: ", "px;\n background: ", ";\n /* static for height of chip */\n padding: ", "px\n ", "px;\n ", ";\n cursor: pointer;\n"], ["\n display: inline-flex;\n align-items: center;\n gap: ", "px;\n border-radius: ", "px;\n background: ", ";\n /* static for height of chip */\n padding: ", "px\n ", "px;\n ", ";\n cursor: pointer;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) {
|
|
7
6
|
return props.checked
|
|
8
7
|
? props.activeBackground && props.activeBackground
|
|
9
8
|
: props.background && props.background;
|
|
10
9
|
}, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) {
|
|
11
|
-
var _a
|
|
10
|
+
var _a;
|
|
12
11
|
return props.checked &&
|
|
13
|
-
"box-shadow: 0 0 0 1px inset " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen)
|
|
12
|
+
"box-shadow: 0 0 0 1px inset " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen);
|
|
14
13
|
});
|
|
15
|
-
var ChipCheckbox = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"], ["\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.extraSmall; });
|
|
14
|
+
var ChipCheckbox = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"], ["\n display: flex;\n height: ", "px;\n width: ", "px;\n background: white;\n border: 1px solid ", ";\n border-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.extraSmall; });
|
|
16
15
|
var ChipLabel = styled(BodyText)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n pointer-events: none;\n"], ["\n pointer-events: none;\n"])));
|
|
17
16
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
18
17
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Chip.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@citygross/components",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.63",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "./build/cjs/components/src/index.js",
|
|
@@ -71,5 +71,5 @@
|
|
|
71
71
|
"moment": "^2.29.1",
|
|
72
72
|
"react-loading-skeleton": "^2.2.0"
|
|
73
73
|
},
|
|
74
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "d69767c4c7f2e2f60f500cc82eba8788a0d9f695"
|
|
75
75
|
}
|