@drivy/cobalt 2.8.0 → 2.9.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/components/Callout/index.js +16 -6
- package/components/Callout/index.js.map +1 -1
- package/index.js +1 -0
- package/index.js.map +1 -1
- package/package.json +3 -3
- package/styles/components/Banner/index.scss +6 -1
- package/styles/components/Callout/index.scss +6 -1
- package/types/src/index.d.ts +1 -0
|
@@ -1,14 +1,24 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import cx from 'classnames';
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
function enforceCTA(cta, variant) {
|
|
5
|
+
if (!cta || !React.isValidElement(cta)) {
|
|
6
|
+
return cta;
|
|
7
|
+
}
|
|
8
|
+
return variant === "error"
|
|
7
9
|
? React.cloneElement(cta, {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
+
size: "small",
|
|
11
|
+
primary: true,
|
|
12
|
+
destructive: true,
|
|
10
13
|
})
|
|
11
|
-
: cta
|
|
14
|
+
: React.cloneElement(cta, {
|
|
15
|
+
size: "small",
|
|
16
|
+
variant,
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
const Callout = ({ title, children, cta, variant = "neutral", illustrationUrl, className, }) => {
|
|
20
|
+
// force CTA to match Callout variant
|
|
21
|
+
const enforcedCTA = enforceCTA(cta, variant);
|
|
12
22
|
return (React.createElement("div", { className: cx("cobalt-callout", {
|
|
13
23
|
"cobalt-callout--warning": variant === "warning",
|
|
14
24
|
"cobalt-callout--neutral": variant === "neutral",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/Callout/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\nimport {
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Callout/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\nimport { ButtonProps } from \"../Buttons/Button/type\"\n\nexport type CalloutPropsType = React.PropsWithChildren<{\n title?: string\n cta?: React.ReactNode\n illustrationUrl?: string\n variant: \"warning\" | \"neutral\" | \"error\"\n className?: string\n}>\n\nfunction enforceCTA(\n cta: React.ReactNode,\n variant: CalloutPropsType[\"variant\"]\n) {\n if (!cta || !React.isValidElement<ButtonProps>(cta)) {\n return cta\n }\n\n return variant === \"error\"\n ? React.cloneElement(cta, {\n size: \"small\",\n primary: true,\n destructive: true,\n })\n : React.cloneElement(cta, {\n size: \"small\",\n variant,\n })\n}\n\nexport const Callout = ({\n title,\n children,\n cta,\n variant = \"neutral\",\n illustrationUrl,\n className,\n}: CalloutPropsType) => {\n // force CTA to match Callout variant\n const enforcedCTA = enforceCTA(cta, variant)\n\n return (\n <div\n className={cx(\n \"cobalt-callout\",\n {\n \"cobalt-callout--warning\": variant === \"warning\",\n \"cobalt-callout--neutral\": variant === \"neutral\",\n \"cobalt-callout--error\": variant === \"error\",\n },\n className\n )}\n >\n <div className=\"cobalt-callout__content\">\n {title && <div className=\"cobalt-callout__title\">{title}</div>}\n <div className=\"cobalt-callout__body\">{children}</div>\n {enforcedCTA}\n </div>\n {illustrationUrl && (\n <img className=\"cobalt-callout__illustration\" src={illustrationUrl} />\n )}\n </div>\n )\n}\n\nexport default Callout\n"],"names":[],"mappings":";;;AAYA,SAAS,UAAU,CACjB,GAAoB,EACpB,OAAoC,EAAA;IAEpC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAc,GAAG,CAAC,EAAE;AACnD,QAAA,OAAO,GAAG,CAAA;KACX;IAED,OAAO,OAAO,KAAK,OAAO;AACxB,UAAE,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE;AACtB,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,WAAW,EAAE,IAAI;SAClB,CAAC;AACJ,UAAE,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE;AACtB,YAAA,IAAI,EAAE,OAAO;YACb,OAAO;AACR,SAAA,CAAC,CAAA;AACR,CAAC;MAEY,OAAO,GAAG,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,GAAG,EACH,OAAO,GAAG,SAAS,EACnB,eAAe,EACf,SAAS,GACQ,KAAI;;IAErB,MAAM,WAAW,GAAG,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;AAE5C,IAAA,QACE,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CACX,gBAAgB,EAChB;YACE,yBAAyB,EAAE,OAAO,KAAK,SAAS;YAChD,yBAAyB,EAAE,OAAO,KAAK,SAAS;YAChD,uBAAuB,EAAE,OAAO,KAAK,OAAO;AAC7C,SAAA,EACD,SAAS,CACV,EAAA;QAED,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,yBAAyB,EAAA;AACrC,YAAA,KAAK,IAAI,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,uBAAuB,EAAA,EAAE,KAAK,CAAO;AAC9D,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,sBAAsB,EAAA,EAAE,QAAQ,CAAO;AACrD,YAAA,WAAW,CACR;AACL,QAAA,eAAe,KACd,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,8BAA8B,EAAC,GAAG,EAAE,eAAe,EAAA,CAAI,CACvE,CACG,EACP;AACH;;;;"}
|
package/index.js
CHANGED
|
@@ -2,6 +2,7 @@ export { default as Accordion } from './components/Accordion/index.js';
|
|
|
2
2
|
export { default as Alerter, useAlerts } from './components/Alerter/index.js';
|
|
3
3
|
export { BasicCell } from './components/BasicCell/index.js';
|
|
4
4
|
export { BulletList, BulletListItem } from './components/BulletList/index.js';
|
|
5
|
+
export { default as Button } from './components/Buttons/Button/index.js';
|
|
5
6
|
export { default as GhostButton } from './components/Buttons/GhostButton/index.js';
|
|
6
7
|
export { default as InversedButton } from './components/Buttons/InversedButton/index.js';
|
|
7
8
|
export { default as DefaultButton } from './components/Buttons/DefaultButton/index.js';
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@drivy/cobalt",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.9.1",
|
|
4
4
|
"description": "Opinionated design system for Drivy's projects.",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"types": "types/src/index.d.ts",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"media-typer": "1.1.0",
|
|
30
30
|
"nanoid": "5.1.6",
|
|
31
31
|
"postcss": "8.5.6",
|
|
32
|
-
"tailwindcss": "3.4.
|
|
32
|
+
"tailwindcss": "3.4.19",
|
|
33
33
|
"tippy.js": "6.3.7"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"rollup-plugin-copy": "3.5.0",
|
|
89
89
|
"rollup-plugin-svgo": "2.0.0",
|
|
90
90
|
"rollup-plugin-typescript2": "0.36.0",
|
|
91
|
-
"sass": "1.
|
|
91
|
+
"sass": "1.96.0",
|
|
92
92
|
"sass-loader": "13.3.3",
|
|
93
93
|
"sharp-cli": "5.2.0",
|
|
94
94
|
"storybook": "7.6.20",
|
package/types/src/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ export { default as Accordion, useAccordionItemContext, } from "./components/Acc
|
|
|
2
2
|
export { default as Alerter, useAlerts, type AlertStatus, } from "./components/Alerter";
|
|
3
3
|
export { BasicCell } from "./components/BasicCell";
|
|
4
4
|
export { BulletList, BulletListItem } from "./components/BulletList";
|
|
5
|
+
export { default as Button } from "./components/Buttons/Button";
|
|
5
6
|
export { default as GhostButton } from "./components/Buttons/GhostButton";
|
|
6
7
|
export { default as InversedButton } from "./components/Buttons/InversedButton";
|
|
7
8
|
export { default as DefaultButton } from "./components/Buttons/DefaultButton";
|