@atom-learning/components 8.1.2 → 8.1.3-beta.0
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/dialog/DialogContent.js +19 -6
- package/dist/components/dialog/DialogContent.js.map +1 -1
- package/dist/components/navigation/NavigationMenu.js +1 -1
- package/dist/components/navigation/NavigationMenu.js.map +1 -1
- package/dist/components/toast/ToastProvider.js +2 -1
- package/dist/components/toast/ToastProvider.js.map +1 -1
- package/dist/components/top-bar/TopBar.js +4 -4
- package/dist/components/top-bar/TopBar.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +26 -12
- package/dist/index.cjs.js.map +1 -1
- package/package.json +2 -1
- package/src/index.css +2 -0
- package/src/responsive-variant-classes.css +1 -1
- package/src/utilities.css +6 -0
package/dist/index.cjs.js
CHANGED
|
@@ -6419,7 +6419,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6419
6419
|
"max-h-[90vh]",
|
|
6420
6420
|
"supports-svh:h-auto",
|
|
6421
6421
|
"supports-svh:max-h-[90vh]",
|
|
6422
|
-
"w-95"
|
|
6422
|
+
"w-95",
|
|
6423
|
+
"[&>[data-dialog-close]]:top-4",
|
|
6424
|
+
"[&>[data-dialog-close]]:right-4"
|
|
6423
6425
|
],
|
|
6424
6426
|
sm: [
|
|
6425
6427
|
"rounded-md",
|
|
@@ -6428,7 +6430,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6428
6430
|
"max-h-[90vh]",
|
|
6429
6431
|
"supports-svh:h-auto",
|
|
6430
6432
|
"supports-svh:max-h-[90vh]",
|
|
6431
|
-
"w-120"
|
|
6433
|
+
"w-120",
|
|
6434
|
+
"[&>[data-dialog-close]]:top-4",
|
|
6435
|
+
"[&>[data-dialog-close]]:right-4"
|
|
6432
6436
|
],
|
|
6433
6437
|
md: [
|
|
6434
6438
|
"rounded-md",
|
|
@@ -6437,7 +6441,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6437
6441
|
"max-h-[90vh]",
|
|
6438
6442
|
"supports-svh:h-auto",
|
|
6439
6443
|
"supports-svh:max-h-[90vh]",
|
|
6440
|
-
"w-150"
|
|
6444
|
+
"w-150",
|
|
6445
|
+
"[&>[data-dialog-close]]:top-4",
|
|
6446
|
+
"[&>[data-dialog-close]]:right-4"
|
|
6441
6447
|
],
|
|
6442
6448
|
lg: [
|
|
6443
6449
|
"rounded-md",
|
|
@@ -6446,7 +6452,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6446
6452
|
"max-h-[90vh]",
|
|
6447
6453
|
"supports-svh:h-auto",
|
|
6448
6454
|
"supports-svh:max-h-[90vh]",
|
|
6449
|
-
"w-200"
|
|
6455
|
+
"w-200",
|
|
6456
|
+
"[&>[data-dialog-close]]:top-4",
|
|
6457
|
+
"[&>[data-dialog-close]]:right-4"
|
|
6450
6458
|
],
|
|
6451
6459
|
xl: [
|
|
6452
6460
|
"rounded-md",
|
|
@@ -6455,7 +6463,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6455
6463
|
"max-h-[90vh]",
|
|
6456
6464
|
"supports-svh:h-auto",
|
|
6457
6465
|
"supports-svh:max-h-[90vh]",
|
|
6458
|
-
"w-275"
|
|
6466
|
+
"w-275",
|
|
6467
|
+
"[&>[data-dialog-close]]:top-4",
|
|
6468
|
+
"[&>[data-dialog-close]]:right-4"
|
|
6459
6469
|
],
|
|
6460
6470
|
fullscreen: [
|
|
6461
6471
|
"rounded-none",
|
|
@@ -6464,7 +6474,9 @@ var StyledDialogContent = styled(_radix_ui_react_dialog.Content, {
|
|
|
6464
6474
|
"max-w-screen",
|
|
6465
6475
|
"max-h-screen",
|
|
6466
6476
|
"supports-svh:h-svh",
|
|
6467
|
-
"supports-svh:max-h-svh"
|
|
6477
|
+
"supports-svh:max-h-svh",
|
|
6478
|
+
"[&>[data-dialog-close]]:top-safe-offset-4",
|
|
6479
|
+
"[&>[data-dialog-close]]:right-safe-offset-4"
|
|
6468
6480
|
]
|
|
6469
6481
|
},
|
|
6470
6482
|
layout: { panel: [
|
|
@@ -6489,6 +6501,7 @@ var DialogContent = ({ size = "sm", children, closeDialogText = "Close dialog",
|
|
|
6489
6501
|
hasTooltip: false,
|
|
6490
6502
|
size: "md",
|
|
6491
6503
|
theme: "neutral",
|
|
6504
|
+
"data-dialog-close": true,
|
|
6492
6505
|
className: "absolute top-4 right-4 size-12",
|
|
6493
6506
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { is: _atom_learning_icons.Close })
|
|
6494
6507
|
}), react.Children.map(children, (child) => react.isValidElement(child) && child.type === DialogBackground ? null : child)]
|
|
@@ -7428,7 +7441,7 @@ var NavigationMenuComponent = ({ children, className, ...rest }) => {
|
|
|
7428
7441
|
const [activeItem, setActiveItem] = react.useState();
|
|
7429
7442
|
const [listWidth, setListWidth] = react.useState(0);
|
|
7430
7443
|
const listRef = react.useRef(null);
|
|
7431
|
-
react.
|
|
7444
|
+
react.useEffect(() => {
|
|
7432
7445
|
if (listRef.current) setListWidth(listRef.current.offsetWidth);
|
|
7433
7446
|
}, [react.Children.toArray(children).length]);
|
|
7434
7447
|
react.useEffect(() => {
|
|
@@ -10213,7 +10226,8 @@ var ToastProviderBase = styled("div", { base: [
|
|
|
10213
10226
|
"z-2147483647",
|
|
10214
10227
|
"inset-2",
|
|
10215
10228
|
"pointer-events-none",
|
|
10216
|
-
"
|
|
10229
|
+
"top-safe-offset-2",
|
|
10230
|
+
"sm:top-safe-offset-3"
|
|
10217
10231
|
] });
|
|
10218
10232
|
var ToastWrapper = styled("div", {
|
|
10219
10233
|
base: [
|
|
@@ -10620,21 +10634,21 @@ var StyledRoot = styled("header", {
|
|
|
10620
10634
|
variants: {
|
|
10621
10635
|
hasScrolled: { true: ["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"] },
|
|
10622
10636
|
size: {
|
|
10623
|
-
md: ["h-16"],
|
|
10624
|
-
lg: ["h-24"]
|
|
10637
|
+
md: ["h-safe-offset-top-16", "pt-safe"],
|
|
10638
|
+
lg: ["h-safe-offset-top-24", "pt-safe"]
|
|
10625
10639
|
},
|
|
10626
10640
|
diffused: { true: ["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]", "supports-color-mix:backdrop-blur-sm"] },
|
|
10627
10641
|
appearance: {
|
|
10628
10642
|
standard: [
|
|
10629
10643
|
"w-screen",
|
|
10630
10644
|
"max-w-full",
|
|
10631
|
-
"top-0",
|
|
10645
|
+
"top-safe-offset-0",
|
|
10632
10646
|
"border-b",
|
|
10633
10647
|
"border-b-(--border-bottom)"
|
|
10634
10648
|
],
|
|
10635
10649
|
rounded: [
|
|
10636
10650
|
"w-full",
|
|
10637
|
-
"top-2",
|
|
10651
|
+
"top-safe-offset-2",
|
|
10638
10652
|
"p-2",
|
|
10639
10653
|
"border",
|
|
10640
10654
|
"border-white",
|