@artsy/palette 31.4.0 → 31.4.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.
|
@@ -17,7 +17,7 @@ var _Clickable = require("../Clickable");
|
|
|
17
17
|
|
|
18
18
|
var _Text = require("../Text");
|
|
19
19
|
|
|
20
|
-
var
|
|
20
|
+
var _Box = require("../Box");
|
|
21
21
|
|
|
22
22
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
23
23
|
|
|
@@ -37,58 +37,22 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
|
37
37
|
|
|
38
38
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
39
39
|
|
|
40
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
41
|
-
|
|
42
|
-
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; }
|
|
43
|
-
|
|
44
|
-
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; }
|
|
45
|
-
|
|
46
|
-
var ReadMoreOrLessLink = function ReadMoreOrLessLink(_ref) {
|
|
47
|
-
var children = _ref.children,
|
|
48
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
49
|
-
|
|
50
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, " ", /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, _extends({
|
|
51
|
-
"aria-expanded": "false",
|
|
52
|
-
cursor: "pointer",
|
|
53
|
-
textDecoration: "underline"
|
|
54
|
-
}, rest), /*#__PURE__*/_react.default.createElement(_Text.Text, {
|
|
55
|
-
variant: "xs",
|
|
56
|
-
fontWeight: "bold"
|
|
57
|
-
}, children)));
|
|
58
|
-
};
|
|
59
|
-
|
|
60
|
-
ReadMoreOrLessLink.displayName = "ReadMoreOrLessLink";
|
|
61
|
-
|
|
62
|
-
var Container = _styledComponents.default.div.withConfig({
|
|
63
|
-
displayName: "ReadMore__Container",
|
|
64
|
-
componentId: "sc-1bqy0ya-0"
|
|
65
|
-
})(["cursor:pointer;> span{display:", ";}> span > *:last-child{display:inherit;}"], function (_ref2) {
|
|
66
|
-
var isExpanded = _ref2.isExpanded;
|
|
67
|
-
return isExpanded ? "block" : "inline";
|
|
68
|
-
});
|
|
69
|
-
|
|
70
|
-
Container.displayName = "Container";
|
|
71
|
-
var HTML_TAG_REGEX = /(<([^>]+)>)/gi;
|
|
72
|
-
|
|
73
40
|
/** ReadMore */
|
|
74
|
-
var ReadMore = function ReadMore(
|
|
75
|
-
var expandedHTML =
|
|
76
|
-
disabled =
|
|
77
|
-
isExpanded =
|
|
78
|
-
|
|
79
|
-
maxChars =
|
|
80
|
-
onReadLessClicked =
|
|
81
|
-
onReadMoreClicked =
|
|
41
|
+
var ReadMore = function ReadMore(_ref) {
|
|
42
|
+
var expandedHTML = _ref.content,
|
|
43
|
+
disabled = _ref.disabled,
|
|
44
|
+
isExpanded = _ref.isExpanded,
|
|
45
|
+
_ref$maxChars = _ref.maxChars,
|
|
46
|
+
maxChars = _ref$maxChars === void 0 ? Infinity : _ref$maxChars,
|
|
47
|
+
onReadLessClicked = _ref.onReadLessClicked,
|
|
48
|
+
onReadMoreClicked = _ref.onReadMoreClicked;
|
|
82
49
|
|
|
83
50
|
var _useState = (0, _react.useState)(!!isExpanded),
|
|
84
51
|
_useState2 = _slicedToArray(_useState, 2),
|
|
85
52
|
expanded = _useState2[0],
|
|
86
53
|
setExpanded = _useState2[1];
|
|
87
54
|
|
|
88
|
-
if (typeof expandedHTML !== "string")
|
|
89
|
-
return null;
|
|
90
|
-
}
|
|
91
|
-
|
|
55
|
+
if (typeof expandedHTML !== "string") return null;
|
|
92
56
|
var charCount = expandedHTML.replace(HTML_TAG_REGEX, "").length;
|
|
93
57
|
var truncatedHTML = (0, _truncHtml.default)(expandedHTML, maxChars).html;
|
|
94
58
|
var visible = charCount > maxChars;
|
|
@@ -110,15 +74,42 @@ var ReadMore = function ReadMore(_ref3) {
|
|
|
110
74
|
}
|
|
111
75
|
|
|
112
76
|
return /*#__PURE__*/_react.default.createElement(Container, {
|
|
113
|
-
|
|
114
|
-
|
|
77
|
+
"aria-expanded": expanded
|
|
78
|
+
}, expanded ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Box.Box, {
|
|
79
|
+
dangerouslySetInnerHTML: {
|
|
80
|
+
__html: expandedHTML
|
|
81
|
+
}
|
|
82
|
+
}), /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, {
|
|
83
|
+
cursor: "pointer",
|
|
84
|
+
textDecoration: "underline",
|
|
85
|
+
onClick: handleClick
|
|
86
|
+
}, /*#__PURE__*/_react.default.createElement(_Text.Text, {
|
|
87
|
+
variant: "xs",
|
|
88
|
+
fontWeight: "bold"
|
|
89
|
+
}, "Read less"))) : /*#__PURE__*/_react.default.createElement(_Clickable.Clickable, {
|
|
90
|
+
onClick: handleClick
|
|
115
91
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
116
92
|
dangerouslySetInnerHTML: {
|
|
117
|
-
__html:
|
|
93
|
+
__html: truncatedHTML
|
|
118
94
|
}
|
|
119
|
-
}), /*#__PURE__*/_react.default.createElement(
|
|
95
|
+
}), " ", /*#__PURE__*/_react.default.createElement(_Text.Text, {
|
|
96
|
+
as: "span",
|
|
97
|
+
variant: "xs",
|
|
98
|
+
fontWeight: "bold",
|
|
99
|
+
style: {
|
|
100
|
+
textDecoration: "underline"
|
|
101
|
+
}
|
|
102
|
+
}, "Read more")));
|
|
120
103
|
};
|
|
121
104
|
|
|
122
105
|
exports.ReadMore = ReadMore;
|
|
123
106
|
ReadMore.displayName = "ReadMore";
|
|
107
|
+
|
|
108
|
+
var Container = _styledComponents.default.div.withConfig({
|
|
109
|
+
displayName: "ReadMore__Container",
|
|
110
|
+
componentId: "sc-1bqy0ya-0"
|
|
111
|
+
})(["> * > span > *:last-child{display:inherit;}"]);
|
|
112
|
+
|
|
113
|
+
Container.displayName = "Container";
|
|
114
|
+
var HTML_TAG_REGEX = /(<([^>]+)>)/gi;
|
|
124
115
|
//# sourceMappingURL=ReadMore.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"names":["
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/ReadMore/ReadMore.tsx"],"names":["ReadMore","expandedHTML","content","disabled","isExpanded","maxChars","Infinity","onReadLessClicked","onReadMoreClicked","expanded","setExpanded","charCount","replace","HTML_TAG_REGEX","length","truncatedHTML","html","visible","handleClick","expandedState","__html","textDecoration","Container","styled","div","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAWA;AACO,IAAMA,QAAiC,GAAG,SAApCA,QAAoC,OAO3C;AAAA,MANKC,YAML,QANJC,OAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,UAII,QAJJA,UAII;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHOC,QAGP;AAAA,MAFJC,iBAEI,QAFJA,iBAEI;AAAA,MADJC,iBACI,QADJA,iBACI;;AACJ,kBAAgC,qBAAS,CAAC,CAACJ,UAAX,CAAhC;AAAA;AAAA,MAAOK,QAAP;AAAA,MAAiBC,WAAjB;;AAEA,MAAI,OAAOT,YAAP,KAAwB,QAA5B,EAAsC,OAAO,IAAP;AAEtC,MAAMU,SAAS,GAAGV,YAAY,CAACW,OAAb,CAAqBC,cAArB,EAAqC,EAArC,EAAyCC,MAA3D;AAEA,MAAMC,aAAa,GAAG,wBAASd,YAAT,EAAuBI,QAAvB,EAAiCW,IAAvD;AAEA,MAAMC,OAAO,GAAGN,SAAS,GAAGN,QAA5B;;AAEA,MAAMa,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,QAAIf,QAAJ,EAAc;AACdO,IAAAA,WAAW,CAAC,UAACS,aAAD;AAAA,aAAmB,CAACA,aAApB;AAAA,KAAD,CAAX;AAEAV,IAAAA,QAAQ,GACJF,iBAAiB,IAAIA,iBAAiB,EADlC,GAEJC,iBAAiB,IAAIA,iBAAiB,EAF1C;AAGD,GAPD;;AASA,MAAI,CAACS,OAAL,EAAc;AACZ,wBACE;AACE,MAAA,uBAAuB,EAAE;AACvBG,QAAAA,MAAM,EAAEnB;AADe;AAD3B,MADF;AAOD;;AAED,sBACE,6BAAC,SAAD;AAAW,qBAAeQ;AAA1B,KACGA,QAAQ,gBACP,yEACE,6BAAC,QAAD;AAAK,IAAA,uBAAuB,EAAE;AAAEW,MAAAA,MAAM,EAAEnB;AAAV;AAA9B,IADF,eAGE,6BAAC,oBAAD;AACE,IAAA,MAAM,EAAC,SADT;AAEE,IAAA,cAAc,EAAC,WAFjB;AAGE,IAAA,OAAO,EAAEiB;AAHX,kBAKE,6BAAC,UAAD;AAAM,IAAA,OAAO,EAAC,IAAd;AAAmB,IAAA,UAAU,EAAC;AAA9B,iBALF,CAHF,CADO,gBAeP,6BAAC,oBAAD;AAAW,IAAA,OAAO,EAAEA;AAApB,kBACE;AAAM,IAAA,uBAAuB,EAAE;AAAEE,MAAAA,MAAM,EAAEL;AAAV;AAA/B,IADF,EAC+D,GAD/D,eAEE,6BAAC,UAAD;AACE,IAAA,EAAE,EAAC,MADL;AAEE,IAAA,OAAO,EAAC,IAFV;AAGE,IAAA,UAAU,EAAC,MAHb;AAIE,IAAA,KAAK,EAAE;AAAEM,MAAAA,cAAc,EAAE;AAAlB;AAJT,iBAFF,CAhBJ,CADF;AA+BD,CApEM;;;AAAMrB,Q;;AAsEb,IAAMsB,SAAS,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,mDAAf;;AAMAF,SAAS,CAACG,WAAV,GAAwB,WAAxB;AAEA,IAAMZ,cAAc,GAAG,eAAvB","sourcesContent":["import React, { useState } from \"react\"\nimport styled from \"styled-components\"\nimport truncate from \"trunc-html\"\nimport { Clickable } from \"../Clickable\"\nimport { Text } from \"../Text\"\nimport { Box } from \"../Box\"\n\nexport interface ReadMoreProps {\n content: string\n disabled?: boolean\n isExpanded?: boolean\n maxChars?: number\n onReadLessClicked?: () => void\n onReadMoreClicked?: () => void\n}\n\n/** ReadMore */\nexport const ReadMore: React.FC<ReadMoreProps> = ({\n content: expandedHTML,\n disabled,\n isExpanded,\n maxChars = Infinity,\n onReadLessClicked,\n onReadMoreClicked,\n}) => {\n const [expanded, setExpanded] = useState(!!isExpanded)\n\n if (typeof expandedHTML !== \"string\") return null\n\n const charCount = expandedHTML.replace(HTML_TAG_REGEX, \"\").length\n\n const truncatedHTML = truncate(expandedHTML, maxChars).html\n\n const visible = charCount > maxChars\n\n const handleClick = () => {\n if (disabled) return\n setExpanded((expandedState) => !expandedState)\n\n expanded\n ? onReadLessClicked && onReadLessClicked()\n : onReadMoreClicked && onReadMoreClicked()\n }\n\n if (!visible) {\n return (\n <span\n dangerouslySetInnerHTML={{\n __html: expandedHTML,\n }}\n />\n )\n }\n\n return (\n <Container aria-expanded={expanded}>\n {expanded ? (\n <>\n <Box dangerouslySetInnerHTML={{ __html: expandedHTML }} />\n\n <Clickable\n cursor=\"pointer\"\n textDecoration=\"underline\"\n onClick={handleClick}\n >\n <Text variant=\"xs\" fontWeight=\"bold\">\n Read less\n </Text>\n </Clickable>\n </>\n ) : (\n <Clickable onClick={handleClick}>\n <span dangerouslySetInnerHTML={{ __html: truncatedHTML }} />{\" \"}\n <Text\n as=\"span\"\n variant=\"xs\"\n fontWeight=\"bold\"\n style={{ textDecoration: \"underline\" }}\n >\n Read more\n </Text>\n </Clickable>\n )}\n </Container>\n )\n}\n\nconst Container = styled.div`\n > * > span > *:last-child {\n display: inherit;\n }\n`\n\nContainer.displayName = \"Container\"\n\nconst HTML_TAG_REGEX = /(<([^>]+)>)/gi\n"],"file":"ReadMore.js"}
|
|
@@ -60,7 +60,7 @@ AsString.story = {
|
|
|
60
60
|
var CharacterCapWithHtml = function CharacterCapWithHtml() {
|
|
61
61
|
return /*#__PURE__*/_react.default.createElement(_ReadMore.ReadMore, {
|
|
62
62
|
maxChars: 300,
|
|
63
|
-
content: "<p>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur adipisicing\n elit. Ducimus eligendi obcaecati voluptate
|
|
63
|
+
content: "<p>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur adipisicing\n elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est temporibus\n labore sint aliquam, laudantium tempore. Tenetur adipisci cumque\n alias facilis animi. Illum.\n </p>"
|
|
64
64
|
});
|
|
65
65
|
};
|
|
66
66
|
|
|
@@ -73,7 +73,7 @@ CharacterCapWithHtml.story = {
|
|
|
73
73
|
var WithCustomizableTypography = function WithCustomizableTypography() {
|
|
74
74
|
return /*#__PURE__*/_react.default.createElement(_HTML.HTML, null, /*#__PURE__*/_react.default.createElement(_ReadMore.ReadMore, {
|
|
75
75
|
maxChars: 300,
|
|
76
|
-
content: "\n <p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate
|
|
76
|
+
content: "\n <p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum\n assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est\n temporibus labore sint aliquam, laudantium tempore. Tenetur\n adipisci cumque alias facilis animi. Illum.\n </p>"
|
|
77
77
|
}));
|
|
78
78
|
};
|
|
79
79
|
|
|
@@ -88,7 +88,7 @@ var WithCustomizableTypography2 = function WithCustomizableTypography2() {
|
|
|
88
88
|
variant: "lg"
|
|
89
89
|
}, /*#__PURE__*/_react.default.createElement(_ReadMore.ReadMore, {
|
|
90
90
|
maxChars: 300,
|
|
91
|
-
content: "<p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate
|
|
91
|
+
content: "<p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum\n assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est\n temporibus labore sint aliquam, laudantium tempore. Tenetur\n adipisci cumque alias facilis animi. Illum.\n </p>"
|
|
92
92
|
}));
|
|
93
93
|
};
|
|
94
94
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/ReadMore/ReadMore.story.tsx"],"names":["title","WithCharacterCap","story","name","ShortContent","AsString","CharacterCapWithHtml","WithCustomizableTypography","WithCustomizableTypography2","CharacterCapWithHtmlDisabled"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe;AACbA,EAAAA,KAAK,EAAE;AADM,C;;;AAIR,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AACpC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AAcD,CAfM;;;AAAMA,gB;AAiBbA,gBAAgB,CAACC,KAAjB,GAAyB;AACvBC,EAAAA,IAAI,EAAE;AADiB,CAAzB;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,GAAM;AAChC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AASD,CAVM;;;AAAMA,Y;AAYbA,YAAY,CAACF,KAAb,GAAqB;AACnBC,EAAAA,IAAI,EAAE;AADa,CAArB;;AAIO,IAAME,QAAQ,GAAG,SAAXA,QAAW,GAAM;AAC5B,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO,EAAC;AAFV,IADF;AAMD,CAPM;;;AAAMA,Q;AASbA,QAAQ,CAACH,KAAT,GAAiB;AACfC,EAAAA,IAAI,EAAE;AADS,CAAjB;;AAIO,IAAMG,oBAAoB,GAAG,SAAvBA,oBAAuB,GAAM;AACxC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AA0BD,CA3BM;;;AAAMA,oB;AA6BbA,oBAAoB,CAACJ,KAArB,GAA6B;AAC3BC,EAAAA,IAAI,EAAE;AADqB,CAA7B;;AAIO,IAAMI,0BAA0B,GAAG,SAA7BA,0BAA6B,GAAM;AAC9C,sBACE,6BAAC,UAAD,qBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF,CADF;AA8BD,CA/BM;;;AAAMA,0B;AAiCbA,0BAA0B,CAACL,KAA3B,GAAmC;AACjCC,EAAAA,IAAI,EAAE;AAD2B,CAAnC;;AAIO,IAAMK,2BAA2B,GAAG,SAA9BA,2BAA8B,GAAM;AAC/C,sBACE,6BAAC,UAAD;AAAM,IAAA,OAAO,EAAC;AAAd,kBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF,CADF;AA6BD,CA9BM;;;AAAMA,2B;AAgCbA,2BAA2B,CAACN,KAA5B,GAAoC;AAClCC,EAAAA,IAAI,EAAE;AAD4B,CAApC;;AAIO,IAAMM,4BAA4B,GAAG,SAA/BA,4BAA+B,GAAM;AAChD,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,MADV;AAEE,IAAA,QAAQ,EAAE,GAFZ;AAGE,IAAA,OAAO;AAHT,IADF;AAeD,CAhBM;;;AAAMA,4B;AAkBbA,4BAA4B,CAACP,KAA7B,GAAqC;AACnCC,EAAAA,IAAI,EAAE;AAD6B,CAArC","sourcesContent":["import React from \"react\"\nimport { HTML } from \"../HTML\"\nimport { ReadMore } from \"./ReadMore\"\n\nexport default {\n title: \"Components/ReadMore\",\n}\n\nexport const WithCharacterCap = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<div>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps best-known\n for the large-scale outdoor installations and long, spacious interiors\n he designed in Marfa. Donald Judd, widely regarded as one of the most\n significant American artists of the post-war period, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa.\n </div>`}\n />\n )\n}\n\nWithCharacterCap.story = {\n name: \"With character cap\",\n}\n\nexport const ShortContent = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<div>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>.\n </div>`}\n />\n )\n}\n\nShortContent.story = {\n name: \"Short content\",\n}\n\nexport const AsString = () => {\n return (\n <ReadMore\n maxChars={300}\n content=\"Donald Judd, widely regarded as one of the most significant American artists of the post-war period, is perhaps best-known for the large-scale outdoor installations and long, spacious interiors he designed in Marfa. Donald Judd, widely regarded as one of the most significant American artists of the post-war period, is perhaps best-known for the large-scale outdoor installations and long, spacious interiors he designed in Marfa.\"\n />\n )\n}\n\nAsString.story = {\n name: \"As string\",\n}\n\nexport const CharacterCapWithHtml = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<p>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur adipisicing\n elit. Ducimus eligendi obcaecati voluptate
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/ReadMore/ReadMore.story.tsx"],"names":["title","WithCharacterCap","story","name","ShortContent","AsString","CharacterCapWithHtml","WithCustomizableTypography","WithCustomizableTypography2","CharacterCapWithHtmlDisabled"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;eAEe;AACbA,EAAAA,KAAK,EAAE;AADM,C;;;AAIR,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AACpC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AAcD,CAfM;;;AAAMA,gB;AAiBbA,gBAAgB,CAACC,KAAjB,GAAyB;AACvBC,EAAAA,IAAI,EAAE;AADiB,CAAzB;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,GAAM;AAChC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AASD,CAVM;;;AAAMA,Y;AAYbA,YAAY,CAACF,KAAb,GAAqB;AACnBC,EAAAA,IAAI,EAAE;AADa,CAArB;;AAIO,IAAME,QAAQ,GAAG,SAAXA,QAAW,GAAM;AAC5B,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO,EAAC;AAFV,IADF;AAMD,CAPM;;;AAAMA,Q;AASbA,QAAQ,CAACH,KAAT,GAAiB;AACfC,EAAAA,IAAI,EAAE;AADS,CAAjB;;AAIO,IAAMG,oBAAoB,GAAG,SAAvBA,oBAAuB,GAAM;AACxC,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF;AA0BD,CA3BM;;;AAAMA,oB;AA6BbA,oBAAoB,CAACJ,KAArB,GAA6B;AAC3BC,EAAAA,IAAI,EAAE;AADqB,CAA7B;;AAIO,IAAMI,0BAA0B,GAAG,SAA7BA,0BAA6B,GAAM;AAC9C,sBACE,6BAAC,UAAD,qBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF,CADF;AA8BD,CA/BM;;;AAAMA,0B;AAiCbA,0BAA0B,CAACL,KAA3B,GAAmC;AACjCC,EAAAA,IAAI,EAAE;AAD2B,CAAnC;;AAIO,IAAMK,2BAA2B,GAAG,SAA9BA,2BAA8B,GAAM;AAC/C,sBACE,6BAAC,UAAD;AAAM,IAAA,OAAO,EAAC;AAAd,kBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,EAAE,GADZ;AAEE,IAAA,OAAO;AAFT,IADF,CADF;AA6BD,CA9BM;;;AAAMA,2B;AAgCbA,2BAA2B,CAACN,KAA5B,GAAoC;AAClCC,EAAAA,IAAI,EAAE;AAD4B,CAApC;;AAIO,IAAMM,4BAA4B,GAAG,SAA/BA,4BAA+B,GAAM;AAChD,sBACE,6BAAC,kBAAD;AACE,IAAA,QAAQ,MADV;AAEE,IAAA,QAAQ,EAAE,GAFZ;AAGE,IAAA,OAAO;AAHT,IADF;AAeD,CAhBM;;;AAAMA,4B;AAkBbA,4BAA4B,CAACP,KAA7B,GAAqC;AACnCC,EAAAA,IAAI,EAAE;AAD6B,CAArC","sourcesContent":["import React from \"react\"\nimport { HTML } from \"../HTML\"\nimport { ReadMore } from \"./ReadMore\"\n\nexport default {\n title: \"Components/ReadMore\",\n}\n\nexport const WithCharacterCap = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<div>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps best-known\n for the large-scale outdoor installations and long, spacious interiors\n he designed in Marfa. Donald Judd, widely regarded as one of the most\n significant American artists of the post-war period, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa.\n </div>`}\n />\n )\n}\n\nWithCharacterCap.story = {\n name: \"With character cap\",\n}\n\nexport const ShortContent = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<div>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>.\n </div>`}\n />\n )\n}\n\nShortContent.story = {\n name: \"Short content\",\n}\n\nexport const AsString = () => {\n return (\n <ReadMore\n maxChars={300}\n content=\"Donald Judd, widely regarded as one of the most significant American artists of the post-war period, is perhaps best-known for the large-scale outdoor installations and long, spacious interiors he designed in Marfa. Donald Judd, widely regarded as one of the most significant American artists of the post-war period, is perhaps best-known for the large-scale outdoor installations and long, spacious interiors he designed in Marfa.\"\n />\n )\n}\n\nAsString.story = {\n name: \"As string\",\n}\n\nexport const CharacterCapWithHtml = () => {\n return (\n <ReadMore\n maxChars={300}\n content={`<p>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur adipisicing\n elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est temporibus\n labore sint aliquam, laudantium tempore. Tenetur adipisci cumque\n alias facilis animi. Illum.\n </p>`}\n />\n )\n}\n\nCharacterCapWithHtml.story = {\n name: \"Character cap with HTML\",\n}\n\nexport const WithCustomizableTypography = () => {\n return (\n <HTML>\n <ReadMore\n maxChars={300}\n content={`\n <p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum\n assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est\n temporibus labore sint aliquam, laudantium tempore. Tenetur\n adipisci cumque alias facilis animi. Illum.\n </p>`}\n />\n </HTML>\n )\n}\n\nWithCustomizableTypography.story = {\n name: \"With customizable typography\",\n}\n\nexport const WithCustomizableTypography2 = () => {\n return (\n <HTML variant=\"lg\">\n <ReadMore\n maxChars={300}\n content={`<p>\n Donald Judd, widely regarded as one of the most significant\n American artists of <a href=\"#\">the post-war period</a>, is\n perhaps best-known for the large-scale outdoor installations and\n long, spacious interiors he designed in Marfa. Donald Judd, widely\n regarded as one of the most significant American artists of the\n post-war period, is perhaps best-known for the large-scale outdoor\n installations and long, spacious interiors he designed in Marfa.\n </p>\n <hr />\n <p>\n <strong>Lorem ipsum dolor</strong> sit amet consectetur\n adipisicing elit. Ducimus eligendi obcaecati voluptate\n <em>molestias vero nobis voluptatum</em>, tenetur dolorum\n assumenda.\n </p>\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis\n eveniet aliquid laborum fugiat quibusdam id suscipit est\n temporibus labore sint aliquam, laudantium tempore. Tenetur\n adipisci cumque alias facilis animi. Illum.\n </p>`}\n />\n </HTML>\n )\n}\n\nWithCustomizableTypography2.story = {\n name: \"With customizable typography (2)\",\n}\n\nexport const CharacterCapWithHtmlDisabled = () => {\n return (\n <ReadMore\n disabled\n maxChars={300}\n content={`<div>\n Donald Judd, widely regarded as one of the most significant American\n artists of <a href=\"#\">the post-war period</a>, is perhaps best-known\n for the large-scale outdoor installations and long, spacious interiors\n he designed in Marfa. Donald Judd, widely regarded as one of the most\n significant American artists of the post-war period, is perhaps\n best-known for the large-scale outdoor installations and long,\n spacious interiors he designed in Marfa.\n </div>`}\n />\n )\n}\n\nCharacterCapWithHtmlDisabled.story = {\n name: \"Character cap with html (disabled)\",\n}\n"],"file":"ReadMore.story.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@artsy/palette",
|
|
3
|
-
"version": "31.4.
|
|
3
|
+
"version": "31.4.1",
|
|
4
4
|
"description": "Design system library for react components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"publishConfig": {
|
|
@@ -180,5 +180,5 @@
|
|
|
180
180
|
"url": "http://localhost"
|
|
181
181
|
}
|
|
182
182
|
},
|
|
183
|
-
"gitHead": "
|
|
183
|
+
"gitHead": "ffa2c198375e7853516cae20d7f6002db48b4b5c"
|
|
184
184
|
}
|