@artsy/palette 31.4.2 → 31.4.3
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.
|
@@ -86,13 +86,13 @@ var Expandable = function Expandable(_ref) {
|
|
|
86
86
|
justifyContent: "space-between",
|
|
87
87
|
borderTop: "1px solid",
|
|
88
88
|
borderColor: borderColor,
|
|
89
|
-
pt:
|
|
89
|
+
pt: 2,
|
|
90
|
+
pb: 1,
|
|
90
91
|
disabled: disabled,
|
|
91
92
|
"aria-expanded": expanded,
|
|
92
93
|
onClick: handleClick
|
|
93
94
|
}, clickableProps), /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
|
|
94
95
|
flex: 1,
|
|
95
|
-
minHeight: 40,
|
|
96
96
|
display: "flex",
|
|
97
97
|
alignItems: "center"
|
|
98
98
|
}, (0, _isText.isText)(label) ? /*#__PURE__*/_react.default.createElement(_Text.Text, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/Expandable/Expandable.tsx"],"names":["Expandable","label","defaultExpanded","expanded","children","disabled","onClick","borderColor","rest","setExpanded","boxProps","clickableProps","handleClick","event","prevExpanded"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA;AACA;AACA;AACO,IAAMA,UAAqC,GAAG,SAAxCA,UAAwC,OAQ/C;AAAA,MAPJC,KAOI,QAPJA,KAOI;AAAA,MANMC,eAMN,QANJC,QAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,8BAFJC,WAEI;AAAA,MAFJA,WAEI,iCAFU,SAEV;AAAA,MADDC,IACC;;AACJ,kBAAgC,qBAASN,eAAT,CAAhC;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBM,WAAjB;;AAEA,uBAAmC,wBAAcD,IAAd,CAAnC;AAAA;AAAA,MAAOE,QAAP;AAAA,MAAiBC,cAAjB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,CAClBC,KADkB,EAEf;AACHJ,IAAAA,WAAW,CAAC,UAACK,YAAD;AAAA,aAAkB,CAACA,YAAnB;AAAA,KAAD,CAAX;AACAR,IAAAA,OAAO,IAAIA,OAAO,CAACO,KAAD,CAAlB;AACD,GALD;;AAOA,sBACE,6BAAC,QAAD,EAASH,QAAT,eACE,6BAAC,oBAAD;AACE,IAAA,KAAK,EAAC,MADR;AAEE,IAAA,OAAO,EAAC,MAFV;AAGE,IAAA,UAAU,EAAC,QAHb;AAIE,IAAA,cAAc,EAAC,eAJjB;AAKE,IAAA,SAAS,EAAC,WALZ;AAME,IAAA,WAAW,EAAEH,WANf;AAOE,IAAA,EAAE,EAAE,CAPN;AAQE,IAAA,QAAQ,EAAEF,
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/Expandable/Expandable.tsx"],"names":["Expandable","label","defaultExpanded","expanded","children","disabled","onClick","borderColor","rest","setExpanded","boxProps","clickableProps","handleClick","event","prevExpanded"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA;AACA;AACA;AACO,IAAMA,UAAqC,GAAG,SAAxCA,UAAwC,OAQ/C;AAAA,MAPJC,KAOI,QAPJA,KAOI;AAAA,MANMC,eAMN,QANJC,QAMI;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,QAII,QAJJA,QAII;AAAA,MAHJC,OAGI,QAHJA,OAGI;AAAA,8BAFJC,WAEI;AAAA,MAFJA,WAEI,iCAFU,SAEV;AAAA,MADDC,IACC;;AACJ,kBAAgC,qBAASN,eAAT,CAAhC;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBM,WAAjB;;AAEA,uBAAmC,wBAAcD,IAAd,CAAnC;AAAA;AAAA,MAAOE,QAAP;AAAA,MAAiBC,cAAjB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,CAClBC,KADkB,EAEf;AACHJ,IAAAA,WAAW,CAAC,UAACK,YAAD;AAAA,aAAkB,CAACA,YAAnB;AAAA,KAAD,CAAX;AACAR,IAAAA,OAAO,IAAIA,OAAO,CAACO,KAAD,CAAlB;AACD,GALD;;AAOA,sBACE,6BAAC,QAAD,EAASH,QAAT,eACE,6BAAC,oBAAD;AACE,IAAA,KAAK,EAAC,MADR;AAEE,IAAA,OAAO,EAAC,MAFV;AAGE,IAAA,UAAU,EAAC,QAHb;AAIE,IAAA,cAAc,EAAC,eAJjB;AAKE,IAAA,SAAS,EAAC,WALZ;AAME,IAAA,WAAW,EAAEH,WANf;AAOE,IAAA,EAAE,EAAE,CAPN;AAQE,IAAA,EAAE,EAAE,CARN;AASE,IAAA,QAAQ,EAAEF,QATZ;AAUE,qBAAeF,QAVjB;AAWE,IAAA,OAAO,EAAES;AAXX,KAYMD,cAZN,gBAcE,6BAAC,UAAD;AAAM,IAAA,IAAI,EAAE,CAAZ;AAAe,IAAA,OAAO,EAAC,MAAvB;AAA8B,IAAA,UAAU,EAAC;AAAzC,KACG,oBAAOV,KAAP,iBAAgB,6BAAC,UAAD;AAAM,IAAA,OAAO,EAAC;AAAd,KAA4BA,KAA5B,CAAhB,GAA4DA,KAD/D,CAdF,EAkBG,CAACI,QAAD,iBACC,4DACGF,QAAQ,gBACP,6BAAC,sBAAD;AACE,IAAA,KAAK,EAAE,EADT;AAEE,IAAA,MAAM,EAAE,EAFV;AAGE,IAAA,EAAE,EAAE,CAHN;AAIE,IAAA,EAAE,EAAE,CAJN;AAKE,mBAAY;AALd,IADO,gBASP,6BAAC,wBAAD;AACE,IAAA,KAAK,EAAE,EADT;AAEE,IAAA,MAAM,EAAE,EAFV;AAGE,IAAA,EAAE,EAAE,CAHN;AAIE,IAAA,EAAE,EAAE,CAJN;AAKE,mBAAY;AALd,IAVJ,CAnBJ,CADF,EA0CGA,QAAQ,KACN,OAAOC,QAAP,KAAoB,UAApB,GACGA,QAAQ,CAAC;AAAEK,IAAAA,WAAW,EAAXA,WAAF;AAAeN,IAAAA,QAAQ,EAARA;AAAf,GAAD,CADX,GAEGC,QAHG,CA1CX,CADF;AAiDD,CArEM;;;AAAMJ,U","sourcesContent":["import React, { useState } from \"react\"\nimport { isText } from \"../../helpers/isText\"\nimport ChevronUpIcon from \"@artsy/icons/ChevronUpIcon\"\nimport ChevronDownIcon from \"@artsy/icons/ChevronDownIcon\"\nimport { Box, splitBoxProps } from \"../Box\"\nimport { Clickable, ClickableProps } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\n\nexport interface ExpandableProps extends ClickableProps {\n label?: string | JSX.Element\n expanded?: boolean\n children: React.ReactNode\n}\n\n/**\n * A toggleable component used to show / hide content\n */\nexport const Expandable: React.FC<ExpandableProps> = ({\n label,\n expanded: defaultExpanded,\n children,\n disabled,\n onClick,\n borderColor = \"black60\",\n ...rest\n}) => {\n const [expanded, setExpanded] = useState(defaultExpanded)\n\n const [boxProps, clickableProps] = splitBoxProps(rest)\n\n const handleClick = (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>\n ) => {\n setExpanded((prevExpanded) => !prevExpanded)\n onClick && onClick(event)\n }\n\n return (\n <Box {...boxProps}>\n <Clickable\n width=\"100%\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n borderTop=\"1px solid\"\n borderColor={borderColor}\n pt={2}\n pb={1}\n disabled={disabled}\n aria-expanded={expanded}\n onClick={handleClick}\n {...clickableProps}\n >\n <Flex flex={1} display=\"flex\" alignItems=\"center\">\n {isText(label) ? <Text variant=\"sm-display\">{label}</Text> : label}\n </Flex>\n\n {!disabled && (\n <>\n {expanded ? (\n <ChevronUpIcon\n width={14}\n height={14}\n ml={1}\n mr={1}\n aria-hidden=\"true\"\n />\n ) : (\n <ChevronDownIcon\n width={14}\n height={14}\n ml={1}\n mr={1}\n aria-hidden=\"true\"\n />\n )}\n </>\n )}\n </Clickable>\n\n {expanded &&\n (typeof children === \"function\"\n ? children({ setExpanded, expanded })\n : children)}\n </Box>\n )\n}\n"],"file":"Expandable.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/elements/Expandable/Expandable.story.tsx"],"names":["title","Default","expanded","disabled","label","e","stopPropagation","mb","children","setExpanded","ConfigurableColors"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;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,KAFM,EAGN;AAAEA,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,QAAQ,EAAE;AAA7B,KAHM,EAIN;AAAED,MAAAA,QAAQ,EAAE,IAAZ;AAAkBC,MAAAA,QAAQ,EAAE;AAA5B,KAJM,EAKN;AACEC,MAAAA,KAAK,eACH,6BAAC,UAAD;AAAM,QAAA,IAAI,EAAE,CAAZ;AAAe,QAAA,cAAc,EAAC;AAA9B,sBACE,6BAAC,UAAD;AAAM,QAAA,OAAO,EAAC;AAAd,mBADF,eAEE,6BAAC,oBAAD;AACE,QAAA,cAAc,EAAC,WADjB;AAEE,QAAA,OAAO,EAAE,iBAACC,CAAD,EAAO;AACdA,UAAAA,CAAC,CAACC,eAAF;AACA,oCAAO,kBAAP;AACD;AALH,sBAOE,6BAAC,UAAD;AAAM,QAAA,OAAO,EAAC;AAAd,iBAPF,CAFF;AAFJ,KALM,EAqBN;AAAEC,MAAAA,EAAE,EAAE;AAAN,KArBM,EAsBN;AAAEL,MAAAA,QAAQ,EAAE,IAAZ;AAAkBK,MAAAA,EAAE,EAAE;AAAtB,KAtBM,EAuBN;AACEL,MAAAA,QAAQ,EAAE,IADZ;AAEEM,MAAAA,QAAQ,EAAE;AAAA,YAAGC,WAAH,QAAGA,WAAH;AAAA,4BACR,uDACE,6BAAC,UAAD,2BADF,eAEE,6BAAC,cAAD;AAAQ,UAAA,OAAO,EAAE;AAAA,mBAAMA,WAAW,CAAC,KAAD,CAAjB;AAAA;AAAjB,mBAFF,CADQ;AAAA;AAFZ,KAvBM;AADV,
|
|
1
|
+
{"version":3,"sources":["../../../src/elements/Expandable/Expandable.story.tsx"],"names":["title","Default","expanded","disabled","label","e","stopPropagation","mb","children","setExpanded","ConfigurableColors"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;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,KAFM,EAGN;AAAEA,MAAAA,QAAQ,EAAE,KAAZ;AAAmBC,MAAAA,QAAQ,EAAE;AAA7B,KAHM,EAIN;AAAED,MAAAA,QAAQ,EAAE,IAAZ;AAAkBC,MAAAA,QAAQ,EAAE;AAA5B,KAJM,EAKN;AACEC,MAAAA,KAAK,eACH,6BAAC,UAAD;AAAM,QAAA,IAAI,EAAE,CAAZ;AAAe,QAAA,cAAc,EAAC;AAA9B,sBACE,6BAAC,UAAD;AAAM,QAAA,OAAO,EAAC;AAAd,mBADF,eAEE,6BAAC,oBAAD;AACE,QAAA,cAAc,EAAC,WADjB;AAEE,QAAA,OAAO,EAAE,iBAACC,CAAD,EAAO;AACdA,UAAAA,CAAC,CAACC,eAAF;AACA,oCAAO,kBAAP;AACD;AALH,sBAOE,6BAAC,UAAD;AAAM,QAAA,OAAO,EAAC;AAAd,iBAPF,CAFF;AAFJ,KALM,EAqBN;AAAEC,MAAAA,EAAE,EAAE;AAAN,KArBM,EAsBN;AAAEL,MAAAA,QAAQ,EAAE,IAAZ;AAAkBK,MAAAA,EAAE,EAAE;AAAtB,KAtBM,EAuBN;AACEL,MAAAA,QAAQ,EAAE,IADZ;AAEEM,MAAAA,QAAQ,EAAE;AAAA,YAAGC,WAAH,QAAGA,WAAH;AAAA,4BACR,uDACE,6BAAC,UAAD,2BADF,eAEE,6BAAC,cAAD;AAAQ,UAAA,OAAO,EAAE;AAAA,mBAAMA,WAAW,CAAC,KAAD,CAAjB;AAAA;AAAjB,mBAFF,CADQ;AAAA;AAFZ,KAvBM,EAgCN;AAAEL,MAAAA,KAAK,EAAE;AAAT,KAhCM;AADV,kBAoCE,6BAAC,sBAAD;AAAY,IAAA,KAAK,EAAC,SAAlB;AAA4B,IAAA,QAAQ,EAAE;AAAtC,kBACE,6BAAC,UAAD,2BADF,CApCF,CADF;AA0CD,CA3CM;;;AAAMH,O;;AA6CN,IAAMS,kBAAkB,GAAG,SAArBA,kBAAqB,GAAM;AACtC,sBACE,6BAAC,QAAD;AAAK,IAAA,KAAK,EAAC,UAAX;AAAsB,IAAA,EAAE,EAAC;AAAzB,kBACE,6BAAC,uBAAD;AAAkC,IAAA,MAAM,EAAE,CAAC,EAAD,EAAK;AAAER,MAAAA,QAAQ,EAAE;AAAZ,KAAL;AAA1C,kBACE,6BAAC,sBAAD;AAAY,IAAA,KAAK,EAAC,SAAlB;AAA4B,IAAA,QAAQ,EAAE,GAAtC;AAA2C,IAAA,WAAW,EAAC;AAAvD,kBACE,6BAAC,UAAD,2BADF,CADF,CADF,CADF;AASD,CAVM;;;AAAMQ,kB","sourcesContent":["import { action } from \"@storybook/addon-actions\"\nimport React from \"react\"\nimport { States } from \"storybook-states\"\nimport { Clickable } from \"../Clickable\"\nimport { Flex } from \"../Flex\"\nimport { Text } from \"../Text\"\nimport { Expandable, ExpandableProps } from \"./Expandable\"\nimport { Button } from \"../Button\"\nimport { Box } from \"../Box\"\n\nexport default {\n title: \"Components/Expandable\",\n}\n\nexport const Default = () => {\n return (\n <States<Partial<ExpandableProps>>\n states={[\n {},\n { expanded: true },\n { expanded: false, disabled: true },\n { expanded: true, disabled: true },\n {\n label: (\n <Flex flex={1} justifyContent=\"space-between\">\n <Text variant=\"sm-display\">Heading</Text>\n <Clickable\n textDecoration=\"underline\"\n onClick={(e) => {\n e.stopPropagation()\n action(\"Secondary action\")\n }}\n >\n <Text variant=\"sm-display\">Reset</Text>\n </Clickable>\n </Flex>\n ),\n },\n { mb: 6 },\n { expanded: true, mb: 6 },\n {\n expanded: true,\n children: ({ setExpanded }) => (\n <div>\n <Text>Expanded content</Text>\n <Button onClick={() => setExpanded(false)}>Close</Button>\n </div>\n ),\n },\n { label: \"Lorem ipsum dolor sit amet consectetur adipisicing elit.\" },\n ]}\n >\n <Expandable label=\"Example\" maxWidth={350}>\n <Text>Expanded content</Text>\n </Expandable>\n </States>\n )\n}\n\nexport const ConfigurableColors = () => {\n return (\n <Box color=\"white100\" bg=\"black100\">\n <States<Partial<ExpandableProps>> states={[{}, { expanded: true }]}>\n <Expandable label=\"Example\" maxWidth={350} borderColor=\"black30\">\n <Text>Expanded content</Text>\n </Expandable>\n </States>\n </Box>\n )\n}\n"],"file":"Expandable.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.3",
|
|
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": "8ea6a4747ed0889b9fe4cf71fe72b15af13163f9"
|
|
184
184
|
}
|