@artsy/palette 19.1.4 → 19.1.5
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/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
# v19.1.5 (Thu Mar 24 2022)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- fix(badge): prevents wrapping; handles truncation on badges [#1146](https://github.com/artsy/palette/pull/1146) ([@dzucconi](https://github.com/dzucconi))
|
|
6
|
+
- fix(badge): prevents wrapping; handles truncation on badges ([@dzucconi](https://github.com/dzucconi))
|
|
7
|
+
|
|
8
|
+
#### Authors: 1
|
|
9
|
+
|
|
10
|
+
- Damon ([@dzucconi](https://github.com/dzucconi))
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
1
14
|
# v19.1.4 (Tue Mar 22 2022)
|
|
2
15
|
|
|
3
16
|
#### 🐛 Bug Fix
|
|
@@ -51,10 +51,12 @@ var Badge = function Badge(_ref) {
|
|
|
51
51
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
52
52
|
|
|
53
53
|
return /*#__PURE__*/React.createElement(Container, _extends({
|
|
54
|
-
display: "inline-
|
|
55
|
-
|
|
54
|
+
display: "inline-flex",
|
|
55
|
+
maxWidth: "100%"
|
|
56
56
|
}, rest), /*#__PURE__*/React.createElement(_palette.Text, {
|
|
57
|
-
variant: "xs"
|
|
57
|
+
variant: "xs",
|
|
58
|
+
px: 0.5,
|
|
59
|
+
overflowEllipsis: true
|
|
58
60
|
}, children));
|
|
59
61
|
};
|
|
60
62
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/Badge/Badge.tsx"],"names":["VARIANTS","defaultLight","backgroundColor","color","defaultDark","brand","Badge","children","rest","defaultProps","variant","Container","Box","variants"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAEA,IAAMA,QAAQ,GAAG;AACfC,EAAAA,YAAY,EAAE;AACZC,IAAAA,eAAe,EAAE,SADL;AAEZC,IAAAA,KAAK,EAAE;AAFK,GADC;AAKfC,EAAAA,WAAW,EAAE;AACXF,IAAAA,eAAe,EAAE,UADN;AAEXC,IAAAA,KAAK,EAAE;AAFI,GALE;AASfE,EAAAA,KAAK,EAAE;AACLH,IAAAA,eAAe,EAAE,OADZ;AAELC,IAAAA,KAAK,EAAE;AAFF;AATQ,CAAjB;;AAoBO,IAAMG,KAA2B,GAAG,SAA9BA,KAA8B,OAA2B;AAAA,MAAxBC,QAAwB,QAAxBA,QAAwB;AAAA,MAAXC,IAAW;;AACpE,sBACE,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAC,
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/Badge/Badge.tsx"],"names":["VARIANTS","defaultLight","backgroundColor","color","defaultDark","brand","Badge","children","rest","defaultProps","variant","Container","Box","variants"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAEA,IAAMA,QAAQ,GAAG;AACfC,EAAAA,YAAY,EAAE;AACZC,IAAAA,eAAe,EAAE,SADL;AAEZC,IAAAA,KAAK,EAAE;AAFK,GADC;AAKfC,EAAAA,WAAW,EAAE;AACXF,IAAAA,eAAe,EAAE,UADN;AAEXC,IAAAA,KAAK,EAAE;AAFI,GALE;AASfE,EAAAA,KAAK,EAAE;AACLH,IAAAA,eAAe,EAAE,OADZ;AAELC,IAAAA,KAAK,EAAE;AAFF;AATQ,CAAjB;;AAoBO,IAAMG,KAA2B,GAAG,SAA9BA,KAA8B,OAA2B;AAAA,MAAxBC,QAAwB,QAAxBA,QAAwB;AAAA,MAAXC,IAAW;;AACpE,sBACE,oBAAC,SAAD;AAAW,IAAA,OAAO,EAAC,aAAnB;AAAiC,IAAA,QAAQ,EAAC;AAA1C,KAAqDA,IAArD,gBACE,oBAAC,aAAD;AAAM,IAAA,OAAO,EAAC,IAAd;AAAmB,IAAA,EAAE,EAAE,GAAvB;AAA4B,IAAA,gBAAgB;AAA5C,KACGD,QADH,CADF,CADF;AAOD,CARM;;;AAAMD,K;AAUbA,KAAK,CAACG,YAAN,GAAqB;AACnBC,EAAAA,OAAO,EAAE;AADU,CAArB;AAIA,IAAMC,SAAS,GAAG,+BAAOC,QAAP,CAAH;AAAA;AAAA;AAAA,aACX,2BAAQ;AAAEC,EAAAA,QAAQ,EAAEb;AAAZ,CAAR,CADW,CAAf","sourcesContent":["import { Text } from \"@artsy/palette\"\nimport * as React from \"react\"\nimport styled from \"styled-components\"\nimport { variant } from \"styled-system\"\nimport { Box, BoxProps } from \"../Box\"\n\nconst VARIANTS = {\n defaultLight: {\n backgroundColor: \"black10\",\n color: \"black100\",\n },\n defaultDark: {\n backgroundColor: \"black100\",\n color: \"white100\",\n },\n brand: {\n backgroundColor: \"brand\",\n color: \"white100\",\n },\n}\n\nexport interface BadgeProps extends BoxProps {\n variant?: keyof typeof VARIANTS\n children: React.ReactNode\n}\n\nexport const Badge: React.FC<BadgeProps> = ({ children, ...rest }) => {\n return (\n <Container display=\"inline-flex\" maxWidth=\"100%\" {...rest}>\n <Text variant=\"xs\" px={0.5} overflowEllipsis>\n {children}\n </Text>\n </Container>\n )\n}\n\nBadge.defaultProps = {\n variant: \"defaultDark\",\n}\n\nconst Container = styled(Box)`\n ${variant({ variants: VARIANTS })}\n`\n"],"file":"Badge.js"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.default = exports.Default = void 0;
|
|
6
|
+
exports.default = exports.OverflowEllipsis = exports.Default = void 0;
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
@@ -11,8 +11,16 @@ var _storybookStates = require("storybook-states");
|
|
|
11
11
|
|
|
12
12
|
var _Badge = require("../Badge/Badge");
|
|
13
13
|
|
|
14
|
+
var _Box = require("../Box");
|
|
15
|
+
|
|
16
|
+
var _excluded = ["children"];
|
|
17
|
+
|
|
14
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
19
|
|
|
20
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
21
|
+
|
|
22
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
23
|
+
|
|
16
24
|
var _default = {
|
|
17
25
|
title: "Components/Badge"
|
|
18
26
|
};
|
|
@@ -32,4 +40,27 @@ var Default = function Default() {
|
|
|
32
40
|
|
|
33
41
|
exports.Default = Default;
|
|
34
42
|
Default.displayName = "Default";
|
|
43
|
+
|
|
44
|
+
var OverflowEllipsis = function OverflowEllipsis() {
|
|
45
|
+
return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
|
|
46
|
+
states: [{}, {
|
|
47
|
+
children: "LGBT+ Owned",
|
|
48
|
+
variant: "brand"
|
|
49
|
+
}, {
|
|
50
|
+
children: "Women Owned",
|
|
51
|
+
variant: "defaultLight"
|
|
52
|
+
}]
|
|
53
|
+
}, function (_ref) {
|
|
54
|
+
var children = _ref.children,
|
|
55
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
56
|
+
|
|
57
|
+
return /*#__PURE__*/_react.default.createElement(_Box.Box, {
|
|
58
|
+
width: 75,
|
|
59
|
+
overflow: "hidden"
|
|
60
|
+
}, /*#__PURE__*/_react.default.createElement(_Badge.Badge, rest, children !== null && children !== void 0 ? children : "Black Owned"));
|
|
61
|
+
});
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
exports.OverflowEllipsis = OverflowEllipsis;
|
|
65
|
+
OverflowEllipsis.displayName = "OverflowEllipsis";
|
|
35
66
|
//# sourceMappingURL=Badge.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/Badge/Badge.story.tsx"],"names":["title","Default","children","variant"],"mappings":";;;;;;;AAAA;;AACA;;AACA
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/Badge/Badge.story.tsx"],"names":["title","Default","children","variant","OverflowEllipsis","rest"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;eAEe;AACbA,EAAAA,KAAK,EAAE;AADM,C;;;AAIR,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAC3B,sBACE,6BAAC,uBAAD;AACE,IAAA,MAAM,EAAE,CACN,EADM,EAEN;AAAEC,MAAAA,QAAQ,EAAE,aAAZ;AAA2BC,MAAAA,OAAO,EAAE;AAApC,KAFM,EAGN;AAAED,MAAAA,QAAQ,EAAE,aAAZ;AAA2BC,MAAAA,OAAO,EAAE;AAApC,KAHM;AADV,kBAOE,6BAAC,YAAD,sBAPF,CADF;AAWD,CAZM;;;AAAMF,O;;AAcN,IAAMG,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AACpC,sBACE,6BAAC,uBAAD;AACE,IAAA,MAAM,EAAE,CACN,EADM,EAEN;AAAEF,MAAAA,QAAQ,EAAE,aAAZ;AAA2BC,MAAAA,OAAO,EAAE;AAApC,KAFM,EAGN;AAAED,MAAAA,QAAQ,EAAE,aAAZ;AAA2BC,MAAAA,OAAO,EAAE;AAApC,KAHM;AADV,KAOG,gBAA2B;AAAA,QAAxBD,QAAwB,QAAxBA,QAAwB;AAAA,QAAXG,IAAW;;AAC1B,wBACE,6BAAC,QAAD;AAAK,MAAA,KAAK,EAAE,EAAZ;AAAgB,MAAA,QAAQ,EAAC;AAAzB,oBACE,6BAAC,YAAD,EAAWA,IAAX,EAAkBH,QAAlB,aAAkBA,QAAlB,cAAkBA,QAAlB,GAA8B,aAA9B,CADF,CADF;AAKD,GAbH,CADF;AAiBD,CAlBM;;;AAAME,gB","sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Badge, BadgeProps } from \"../Badge/Badge\"\nimport { Box } from \"../Box\"\n\nexport default {\n title: \"Components/Badge\",\n}\n\nexport const Default = () => {\n return (\n <States<Partial<BadgeProps>>\n states={[\n {},\n { children: \"LGBT+ Owned\", variant: \"brand\" },\n { children: \"Women Owned\", variant: \"defaultLight\" },\n ]}\n >\n <Badge>Black Owned</Badge>\n </States>\n )\n}\n\nexport const OverflowEllipsis = () => {\n return (\n <States<Partial<BadgeProps>>\n states={[\n {},\n { children: \"LGBT+ Owned\", variant: \"brand\" },\n { children: \"Women Owned\", variant: \"defaultLight\" },\n ]}\n >\n {({ children, ...rest }) => {\n return (\n <Box width={75} overflow=\"hidden\">\n <Badge {...rest}>{children ?? \"Black Owned\"}</Badge>\n </Box>\n )\n }}\n </States>\n )\n}\n"],"file":"Badge.story.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@artsy/palette",
|
|
3
|
-
"version": "19.1.
|
|
3
|
+
"version": "19.1.5",
|
|
4
4
|
"description": "Design system library for react components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"publishConfig": {
|
|
@@ -178,5 +178,5 @@
|
|
|
178
178
|
"<rootDir>/www/"
|
|
179
179
|
]
|
|
180
180
|
},
|
|
181
|
-
"gitHead": "
|
|
181
|
+
"gitHead": "a3b8a0d1d97ce05ad18f7d9fe83c27b2f640dc41"
|
|
182
182
|
}
|