@atom-learning/components 12.0.0-beta.3 → 12.0.0-beta.4
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/dist/components/empty-state/EmptyState.d.ts +5 -1
- package/dist/components/empty-state/EmptyStateImage.d.ts +6 -2
- package/dist/components/image/Image.d.ts +6 -1
- package/dist/components/image/Image.js +31 -8
- package/dist/components/image/Image.js.map +1 -1
- package/dist/components/side-bar/SideBar.d.ts +6 -2
- package/dist/components/side-bar/SideBarComponents.d.ts +6 -2
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +29 -7
- package/dist/index.cjs.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -1478,17 +1478,39 @@ var StyledImage$2 = styled("img", {
|
|
|
1478
1478
|
"[[width]]:w-auto"
|
|
1479
1479
|
] } }
|
|
1480
1480
|
}, { enablePolymorphism: false });
|
|
1481
|
-
var
|
|
1482
|
-
|
|
1481
|
+
var darkDisplay = {
|
|
1482
|
+
block: "dark:block",
|
|
1483
|
+
"inline-block": "dark:inline-block",
|
|
1484
|
+
flex: "dark:flex",
|
|
1485
|
+
grid: "dark:grid"
|
|
1486
|
+
};
|
|
1487
|
+
var whitespace = /\s+/;
|
|
1488
|
+
var darkDisplayFor = (className) => {
|
|
1489
|
+
const classes = new Set(className?.split(whitespace));
|
|
1490
|
+
return Object.entries(darkDisplay).find(([display]) => classes.has(display))?.[1] ?? "dark:inline";
|
|
1491
|
+
};
|
|
1492
|
+
var ImageComponent = ({ children, ref, src, className, ...props }) => {
|
|
1493
|
+
const image = typeof src === "object" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage$2, {
|
|
1494
|
+
loading: "lazy",
|
|
1483
1495
|
...props,
|
|
1484
|
-
|
|
1496
|
+
src: src.light,
|
|
1497
|
+
ref,
|
|
1498
|
+
className: cn(className, "dark:hidden")
|
|
1499
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage$2, {
|
|
1500
|
+
loading: "lazy",
|
|
1501
|
+
...props,
|
|
1502
|
+
src: src.dark,
|
|
1503
|
+
className: cn(className, "hidden", darkDisplayFor(className))
|
|
1504
|
+
})] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledImage$2, {
|
|
1505
|
+
...props,
|
|
1506
|
+
src,
|
|
1507
|
+
ref,
|
|
1508
|
+
className
|
|
1485
1509
|
});
|
|
1510
|
+
if (!children) return image;
|
|
1486
1511
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("figure", {
|
|
1487
1512
|
className: "relative overflow-hidden",
|
|
1488
|
-
children: [
|
|
1489
|
-
...props,
|
|
1490
|
-
ref
|
|
1491
|
-
}), children]
|
|
1513
|
+
children: [image, children]
|
|
1492
1514
|
});
|
|
1493
1515
|
};
|
|
1494
1516
|
var Image = /* @__PURE__ */ Object.assign(ImageComponent, {
|