@guardian/stand 0.0.66 → 0.0.68
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/SidebarStepperNavigation.cjs +7 -0
- package/dist/SidebarStepperNavigation.d.cts +5 -0
- package/dist/SidebarStepperNavigation.d.ts +5 -0
- package/dist/SidebarStepperNavigation.js +4 -0
- package/dist/_virtual/_rolldown/runtime.cjs +1 -1
- package/dist/components/Avatar/Avatar.cjs +4 -2
- package/dist/components/Avatar/Avatar.js +4 -2
- package/dist/components/AvatarButton/AvatarButton.cjs +2 -1
- package/dist/components/AvatarButton/AvatarButton.js +2 -1
- package/dist/components/AvatarLink/AvatarLink.cjs +2 -1
- package/dist/components/AvatarLink/AvatarLink.js +2 -1
- package/dist/components/Badge/Badge.cjs +2 -1
- package/dist/components/Badge/Badge.js +2 -1
- package/dist/components/Byline/Byline.cjs +4 -2
- package/dist/components/Byline/Byline.js +4 -2
- package/dist/components/Byline/Preview.cjs +13 -11
- package/dist/components/Byline/Preview.js +13 -11
- package/dist/components/Grid/Grid.cjs +4 -2
- package/dist/components/Grid/Grid.js +4 -2
- package/dist/components/HtmlPreviewLoader/styles.cjs +4 -3
- package/dist/components/HtmlPreviewLoader/styles.js +4 -3
- package/dist/components/Layout/Layout.cjs +4 -2
- package/dist/components/Layout/Layout.js +4 -2
- package/dist/components/Menu/Menu.cjs +4 -2
- package/dist/components/Menu/Menu.js +4 -2
- package/dist/components/Modal/Modal.cjs +6 -3
- package/dist/components/Modal/Modal.js +6 -3
- package/dist/components/SidebarStepperNavigation/SidebarStepperNavigation.cjs +161 -0
- package/dist/components/SidebarStepperNavigation/SidebarStepperNavigation.d.cts +5 -0
- package/dist/components/SidebarStepperNavigation/SidebarStepperNavigation.d.ts +5 -0
- package/dist/components/SidebarStepperNavigation/SidebarStepperNavigation.js +161 -0
- package/dist/components/SidebarStepperNavigation/styles.cjs +96 -0
- package/dist/components/SidebarStepperNavigation/styles.d.cts +8 -0
- package/dist/components/SidebarStepperNavigation/styles.d.ts +8 -0
- package/dist/components/SidebarStepperNavigation/styles.js +88 -0
- package/dist/components/SidebarStepperNavigation/types.cjs +9 -0
- package/dist/components/SidebarStepperNavigation/types.d.cts +26 -0
- package/dist/components/SidebarStepperNavigation/types.d.ts +26 -0
- package/dist/components/SidebarStepperNavigation/types.js +9 -0
- package/dist/components/Tabs/Tabs.cjs +2 -1
- package/dist/components/Tabs/Tabs.js +2 -1
- package/dist/components/TagPicker/styles.cjs +4 -2
- package/dist/components/TagPicker/styles.js +4 -2
- package/dist/components/TagTable/styles.cjs +2 -1
- package/dist/components/TagTable/styles.js +2 -1
- package/dist/components/TopBar/TopBarItem/TopBarItem.cjs +2 -1
- package/dist/components/TopBar/TopBarItem/TopBarItem.js +2 -1
- package/dist/components/Typography/Typography.cjs +2 -1
- package/dist/components/Typography/Typography.js +2 -1
- package/dist/components/Typography/types.d.cts +4 -2
- package/dist/components/Typography/types.d.ts +4 -2
- package/dist/index.cjs +2 -0
- package/dist/index.d.cts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/styleD/build/css/component/sidebarStepperNavigation.css +51 -0
- package/dist/styleD/build/typescript/component/sidebarStepperNavigation.cjs +68 -0
- package/dist/styleD/build/typescript/component/sidebarStepperNavigation.d.cts +85 -0
- package/dist/styleD/build/typescript/component/sidebarStepperNavigation.d.ts +85 -0
- package/dist/styleD/build/typescript/component/sidebarStepperNavigation.js +68 -0
- package/dist/util/useId.cjs +16 -0
- package/dist/util/useId.js +14 -0
- package/package.json +34 -19
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
const require_sidebarStepperNavigation = require("./styleD/build/typescript/component/sidebarStepperNavigation.cjs");
|
|
3
|
+
const require_SidebarStepperNavigation = require("./components/SidebarStepperNavigation/SidebarStepperNavigation.cjs");
|
|
4
|
+
const require_types = require("./components/SidebarStepperNavigation/types.cjs");
|
|
5
|
+
exports.SidebarStepperNavigation = require_SidebarStepperNavigation.SidebarStepperNavigation;
|
|
6
|
+
exports.StepStatus = require_types.StepStatus;
|
|
7
|
+
exports.componentSidebarStepperNavigation = require_sidebarStepperNavigation.componentSidebarStepperNavigation;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { ComponentSidebarStepperNavigation, componentSidebarStepperNavigation } from "./styleD/build/typescript/component/sidebarStepperNavigation.cjs";
|
|
2
|
+
import { PartialSidebarStepperNavigationTheme } from "./components/SidebarStepperNavigation/styles.cjs";
|
|
3
|
+
import { SidebarStepperNavigationProps, StepNavConfig, StepNavStep, StepStatus } from "./components/SidebarStepperNavigation/types.cjs";
|
|
4
|
+
import { SidebarStepperNavigation } from "./components/SidebarStepperNavigation/SidebarStepperNavigation.cjs";
|
|
5
|
+
export { type ComponentSidebarStepperNavigation, SidebarStepperNavigation, type SidebarStepperNavigationProps, type PartialSidebarStepperNavigationTheme as SidebarStepperNavigationTheme, type StepNavConfig, type StepNavStep, StepStatus, componentSidebarStepperNavigation };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { ComponentSidebarStepperNavigation, componentSidebarStepperNavigation } from "./styleD/build/typescript/component/sidebarStepperNavigation.js";
|
|
2
|
+
import { PartialSidebarStepperNavigationTheme } from "./components/SidebarStepperNavigation/styles.js";
|
|
3
|
+
import { SidebarStepperNavigationProps, StepNavConfig, StepNavStep, StepStatus } from "./components/SidebarStepperNavigation/types.js";
|
|
4
|
+
import { SidebarStepperNavigation } from "./components/SidebarStepperNavigation/SidebarStepperNavigation.js";
|
|
5
|
+
export { type ComponentSidebarStepperNavigation, SidebarStepperNavigation, type SidebarStepperNavigationProps, type PartialSidebarStepperNavigationTheme as SidebarStepperNavigationTheme, type StepNavConfig, type StepNavStep, StepStatus, componentSidebarStepperNavigation };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { componentSidebarStepperNavigation } from "./styleD/build/typescript/component/sidebarStepperNavigation.js";
|
|
2
|
+
import { SidebarStepperNavigation } from "./components/SidebarStepperNavigation/SidebarStepperNavigation.js";
|
|
3
|
+
import { StepStatus } from "./components/SidebarStepperNavigation/types.js";
|
|
4
|
+
export { SidebarStepperNavigation, StepStatus, componentSidebarStepperNavigation };
|
|
@@ -15,7 +15,7 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
15
15
|
}
|
|
16
16
|
return to;
|
|
17
17
|
};
|
|
18
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
18
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule || !__hasOwnProp.call(mod, "default") ? __defProp(target, "default", {
|
|
19
19
|
value: mod,
|
|
20
20
|
enumerable: true
|
|
21
21
|
}) : target, mod));
|
|
@@ -5,7 +5,8 @@ let react = require("react");
|
|
|
5
5
|
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
6
6
|
//#region src/components/Avatar/Avatar.tsx
|
|
7
7
|
const getColorFromString = (input) => {
|
|
8
|
-
|
|
8
|
+
const index = input.split("").slice(0, 2).reduce((acc, char) => acc + (char.codePointAt(0) ?? 0), 0) % require_types.avatarColors.length;
|
|
9
|
+
return require_types.avatarColors[index];
|
|
9
10
|
};
|
|
10
11
|
function Avatar({ src, initials, alt, size = "md", color, theme = {}, cssOverrides, ...props }) {
|
|
11
12
|
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultAvatarTheme, theme);
|
|
@@ -15,10 +16,11 @@ function Avatar({ src, initials, alt, size = "md", color, theme = {}, cssOverrid
|
|
|
15
16
|
};
|
|
16
17
|
const showImage = src && !imageError;
|
|
17
18
|
const displayInitials = initials?.slice(0, 2).toUpperCase() ?? "";
|
|
19
|
+
const avatarColor = color ?? getColorFromString(src ?? displayInitials);
|
|
18
20
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
|
|
19
21
|
css: [require_styles.avatarStyles(mergedTheme, {
|
|
20
22
|
size,
|
|
21
|
-
color:
|
|
23
|
+
color: avatarColor
|
|
22
24
|
}), cssOverrides],
|
|
23
25
|
role: "img",
|
|
24
26
|
"aria-label": alt ?? `Avatar ${displayInitials ? `with initials ${displayInitials}` : ""}`,
|
|
@@ -5,7 +5,8 @@ import { useState } from "react";
|
|
|
5
5
|
import { Fragment, jsx } from "@emotion/react/jsx-runtime";
|
|
6
6
|
//#region src/components/Avatar/Avatar.tsx
|
|
7
7
|
const getColorFromString = (input) => {
|
|
8
|
-
|
|
8
|
+
const index = input.split("").slice(0, 2).reduce((acc, char) => acc + (char.codePointAt(0) ?? 0), 0) % avatarColors.length;
|
|
9
|
+
return avatarColors[index];
|
|
9
10
|
};
|
|
10
11
|
function Avatar({ src, initials, alt, size = "md", color, theme = {}, cssOverrides, ...props }) {
|
|
11
12
|
const mergedTheme = mergeDeep(defaultAvatarTheme, theme);
|
|
@@ -15,10 +16,11 @@ function Avatar({ src, initials, alt, size = "md", color, theme = {}, cssOverrid
|
|
|
15
16
|
};
|
|
16
17
|
const showImage = src && !imageError;
|
|
17
18
|
const displayInitials = initials?.slice(0, 2).toUpperCase() ?? "";
|
|
19
|
+
const avatarColor = color ?? getColorFromString(src ?? displayInitials);
|
|
18
20
|
return /* @__PURE__ */ jsx("div", {
|
|
19
21
|
css: [avatarStyles(mergedTheme, {
|
|
20
22
|
size,
|
|
21
|
-
color:
|
|
23
|
+
color: avatarColor
|
|
22
24
|
}), cssOverrides],
|
|
23
25
|
role: "img",
|
|
24
26
|
"aria-label": alt ?? `Avatar ${displayInitials ? `with initials ${displayInitials}` : ""}`,
|
|
@@ -5,8 +5,9 @@ let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
|
5
5
|
let react_aria_components = require("react-aria-components");
|
|
6
6
|
//#region src/components/AvatarButton/AvatarButton.tsx
|
|
7
7
|
function AvatarButton(props) {
|
|
8
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultAvatarButtonTheme, props.theme ?? {});
|
|
8
9
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(react_aria_components.Button, {
|
|
9
|
-
css: require_styles.avatarButtonStyles(
|
|
10
|
+
css: require_styles.avatarButtonStyles(mergedTheme),
|
|
10
11
|
...props,
|
|
11
12
|
children: /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_Avatar.Avatar, {
|
|
12
13
|
...props,
|
|
@@ -5,8 +5,9 @@ import { jsx } from "@emotion/react/jsx-runtime";
|
|
|
5
5
|
import { Button } from "react-aria-components";
|
|
6
6
|
//#region src/components/AvatarButton/AvatarButton.tsx
|
|
7
7
|
function AvatarButton(props) {
|
|
8
|
+
const mergedTheme = mergeDeep(defaultAvatarButtonTheme, props.theme ?? {});
|
|
8
9
|
return /* @__PURE__ */ jsx(Button, {
|
|
9
|
-
css: avatarButtonStyles(
|
|
10
|
+
css: avatarButtonStyles(mergedTheme),
|
|
10
11
|
...props,
|
|
11
12
|
children: /* @__PURE__ */ jsx(Avatar, {
|
|
12
13
|
...props,
|
|
@@ -5,8 +5,9 @@ let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
|
5
5
|
let react_aria_components = require("react-aria-components");
|
|
6
6
|
//#region src/components/AvatarLink/AvatarLink.tsx
|
|
7
7
|
function AvatarLink(props) {
|
|
8
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultAvatarLinkTheme, props.theme ?? {});
|
|
8
9
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(react_aria_components.Link, {
|
|
9
|
-
css: require_styles.avatarLinkStyles(
|
|
10
|
+
css: require_styles.avatarLinkStyles(mergedTheme),
|
|
10
11
|
...props,
|
|
11
12
|
children: /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_Avatar.Avatar, {
|
|
12
13
|
...props,
|
|
@@ -5,8 +5,9 @@ import { jsx } from "@emotion/react/jsx-runtime";
|
|
|
5
5
|
import { Link } from "react-aria-components";
|
|
6
6
|
//#region src/components/AvatarLink/AvatarLink.tsx
|
|
7
7
|
function AvatarLink(props) {
|
|
8
|
+
const mergedTheme = mergeDeep(defaultAvatarLinkTheme, props.theme ?? {});
|
|
8
9
|
return /* @__PURE__ */ jsx(Link, {
|
|
9
|
-
css: avatarLinkStyles(
|
|
10
|
+
css: avatarLinkStyles(mergedTheme),
|
|
10
11
|
...props,
|
|
11
12
|
children: /* @__PURE__ */ jsx(Avatar, {
|
|
12
13
|
...props,
|
|
@@ -3,8 +3,9 @@ const require_styles = require("./styles.cjs");
|
|
|
3
3
|
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
4
4
|
//#region src/components/Badge/Badge.tsx
|
|
5
5
|
const Badge = ({ size = "md", color = "green", weight = "strong", theme = {}, cssOverrides, children, ...props }) => {
|
|
6
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultBadgeTheme, theme);
|
|
6
7
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("span", {
|
|
7
|
-
css: [require_styles.badgeStyles(
|
|
8
|
+
css: [require_styles.badgeStyles(mergedTheme, {
|
|
8
9
|
color,
|
|
9
10
|
size,
|
|
10
11
|
weight
|
|
@@ -3,8 +3,9 @@ import { badgeStyles, defaultBadgeTheme } from "./styles.js";
|
|
|
3
3
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
4
4
|
//#region src/components/Badge/Badge.tsx
|
|
5
5
|
const Badge = ({ size = "md", color = "green", weight = "strong", theme = {}, cssOverrides, children, ...props }) => {
|
|
6
|
+
const mergedTheme = mergeDeep(defaultBadgeTheme, theme);
|
|
6
7
|
return /* @__PURE__ */ jsx("span", {
|
|
7
|
-
css: [badgeStyles(
|
|
8
|
+
css: [badgeStyles(mergedTheme, {
|
|
8
9
|
color,
|
|
9
10
|
size,
|
|
10
11
|
weight
|
|
@@ -239,8 +239,10 @@ const Byline = ({ theme, allowUntaggedContributors, contributorLimit, enablePrev
|
|
|
239
239
|
}, []);
|
|
240
240
|
(0, react.useEffect)(() => {
|
|
241
241
|
const numberOfOptions = taggedContributors.length + (allowUntaggedContributors ? 1 : 0);
|
|
242
|
-
if (numberOfOptions)
|
|
243
|
-
|
|
242
|
+
if (numberOfOptions) {
|
|
243
|
+
if (currentOptionIndex < 0) setCurrentOptionIndex(numberOfOptions - 1);
|
|
244
|
+
else setCurrentOptionIndex(currentOptionIndex % numberOfOptions);
|
|
245
|
+
}
|
|
244
246
|
if (showDropdown) {
|
|
245
247
|
const editor = document.querySelector("[role=combobox]");
|
|
246
248
|
editor?.setAttribute("aria-activedescendant", `contributor-option-${currentOptionIndex}`);
|
|
@@ -239,8 +239,10 @@ const Byline = ({ theme, allowUntaggedContributors, contributorLimit, enablePrev
|
|
|
239
239
|
}, []);
|
|
240
240
|
useEffect(() => {
|
|
241
241
|
const numberOfOptions = taggedContributors.length + (allowUntaggedContributors ? 1 : 0);
|
|
242
|
-
if (numberOfOptions)
|
|
243
|
-
|
|
242
|
+
if (numberOfOptions) {
|
|
243
|
+
if (currentOptionIndex < 0) setCurrentOptionIndex(numberOfOptions - 1);
|
|
244
|
+
else setCurrentOptionIndex(currentOptionIndex % numberOfOptions);
|
|
245
|
+
}
|
|
244
246
|
if (showDropdown) {
|
|
245
247
|
const editor = document.querySelector("[role=combobox]");
|
|
246
248
|
editor?.setAttribute("aria-activedescendant", `contributor-option-${currentOptionIndex}`);
|
|
@@ -15,17 +15,19 @@ const Preview = ({ doc }) => {
|
|
|
15
15
|
css: require_styles.previewFreeTextStyles,
|
|
16
16
|
children: node.text
|
|
17
17
|
}, `${node.text}${i}`);
|
|
18
|
-
else if (node.type.name === "chip")
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
18
|
+
else if (node.type.name === "chip") {
|
|
19
|
+
if (node.attrs.path) return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("a", {
|
|
20
|
+
css: require_styles.previewContributorStyles(node),
|
|
21
|
+
href: `https://theguardian.com/${node.attrs.path}`,
|
|
22
|
+
target: "_blank",
|
|
23
|
+
rel: "noopener noreferrer",
|
|
24
|
+
children: node.attrs.label
|
|
25
|
+
}, `${node.text}${i}`);
|
|
26
|
+
else return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("span", {
|
|
27
|
+
css: require_styles.previewContributorStyles(node),
|
|
28
|
+
children: node.attrs.label
|
|
29
|
+
}, `${node.text}${i}`);
|
|
30
|
+
}
|
|
29
31
|
return null;
|
|
30
32
|
})
|
|
31
33
|
});
|
|
@@ -15,17 +15,19 @@ const Preview = ({ doc }) => {
|
|
|
15
15
|
css: previewFreeTextStyles,
|
|
16
16
|
children: node.text
|
|
17
17
|
}, `${node.text}${i}`);
|
|
18
|
-
else if (node.type.name === "chip")
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
18
|
+
else if (node.type.name === "chip") {
|
|
19
|
+
if (node.attrs.path) return /* @__PURE__ */ jsx("a", {
|
|
20
|
+
css: previewContributorStyles(node),
|
|
21
|
+
href: `https://theguardian.com/${node.attrs.path}`,
|
|
22
|
+
target: "_blank",
|
|
23
|
+
rel: "noopener noreferrer",
|
|
24
|
+
children: node.attrs.label
|
|
25
|
+
}, `${node.text}${i}`);
|
|
26
|
+
else return /* @__PURE__ */ jsx("span", {
|
|
27
|
+
css: previewContributorStyles(node),
|
|
28
|
+
children: node.attrs.label
|
|
29
|
+
}, `${node.text}${i}`);
|
|
30
|
+
}
|
|
29
31
|
return null;
|
|
30
32
|
})
|
|
31
33
|
});
|
|
@@ -3,15 +3,17 @@ const require_styles = require("./styles.cjs");
|
|
|
3
3
|
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
4
4
|
//#region src/components/Grid/Grid.tsx
|
|
5
5
|
function Grid({ children, theme = {}, cssOverrides, as: Component = "div", ...props }) {
|
|
6
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultGridTheme, theme);
|
|
6
7
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(Component, {
|
|
7
|
-
css: [require_styles.gridStyles(
|
|
8
|
+
css: [require_styles.gridStyles(mergedTheme), cssOverrides],
|
|
8
9
|
...props,
|
|
9
10
|
children
|
|
10
11
|
});
|
|
11
12
|
}
|
|
12
13
|
function Item({ children, theme = {}, cssOverrides, size, offset, ...props }) {
|
|
14
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultGridTheme, theme);
|
|
13
15
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
|
|
14
|
-
css: [require_styles.itemStyles(
|
|
16
|
+
css: [require_styles.itemStyles(mergedTheme, {
|
|
15
17
|
size,
|
|
16
18
|
offset
|
|
17
19
|
}), cssOverrides],
|
|
@@ -3,15 +3,17 @@ import { defaultGridTheme, gridStyles, itemStyles } from "./styles.js";
|
|
|
3
3
|
import { jsx } from "@emotion/react/jsx-runtime";
|
|
4
4
|
//#region src/components/Grid/Grid.tsx
|
|
5
5
|
function Grid({ children, theme = {}, cssOverrides, as: Component = "div", ...props }) {
|
|
6
|
+
const mergedTheme = mergeDeep(defaultGridTheme, theme);
|
|
6
7
|
return /* @__PURE__ */ jsx(Component, {
|
|
7
|
-
css: [gridStyles(
|
|
8
|
+
css: [gridStyles(mergedTheme), cssOverrides],
|
|
8
9
|
...props,
|
|
9
10
|
children
|
|
10
11
|
});
|
|
11
12
|
}
|
|
12
13
|
function Item({ children, theme = {}, cssOverrides, size, offset, ...props }) {
|
|
14
|
+
const mergedTheme = mergeDeep(defaultGridTheme, theme);
|
|
13
15
|
return /* @__PURE__ */ jsx("div", {
|
|
14
|
-
css: [itemStyles(
|
|
16
|
+
css: [itemStyles(mergedTheme, {
|
|
15
17
|
size,
|
|
16
18
|
offset
|
|
17
19
|
}), cssOverrides],
|
|
@@ -61,11 +61,12 @@ const loadingIconStyle = ({ loadingIcon }) => {
|
|
|
61
61
|
`;
|
|
62
62
|
};
|
|
63
63
|
const spinAnimationStyle = () => {
|
|
64
|
-
|
|
65
|
-
animation: ${(0, _emotion_react.keyframes)({
|
|
64
|
+
const spin = (0, _emotion_react.keyframes)({
|
|
66
65
|
from: { transform: "rotate(0deg)" },
|
|
67
66
|
to: { transform: "rotate(360deg)" }
|
|
68
|
-
})
|
|
67
|
+
});
|
|
68
|
+
return _emotion_react.css`
|
|
69
|
+
animation: ${spin} 1s linear infinite;
|
|
69
70
|
`;
|
|
70
71
|
};
|
|
71
72
|
const centeredStyle = () => {
|
|
@@ -61,11 +61,12 @@ const loadingIconStyle = ({ loadingIcon }) => {
|
|
|
61
61
|
`;
|
|
62
62
|
};
|
|
63
63
|
const spinAnimationStyle = () => {
|
|
64
|
-
|
|
65
|
-
animation: ${keyframes({
|
|
64
|
+
const spin = keyframes({
|
|
66
65
|
from: { transform: "rotate(0deg)" },
|
|
67
66
|
to: { transform: "rotate(360deg)" }
|
|
68
|
-
})
|
|
67
|
+
});
|
|
68
|
+
return css`
|
|
69
|
+
animation: ${spin} 1s linear infinite;
|
|
69
70
|
`;
|
|
70
71
|
};
|
|
71
72
|
const centeredStyle = () => {
|
|
@@ -45,8 +45,9 @@ function LayoutSidebar({ as: Component = "aside", children, layoutSmBreakpoint =
|
|
|
45
45
|
* Places children into the main grid area of the Layout.
|
|
46
46
|
*/
|
|
47
47
|
function LayoutMain({ as: Component = "main", children, fluid = true, paddingTop = true, paddingBottom = true, theme = {}, cssOverrides, ...props }) {
|
|
48
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultMainTheme, theme);
|
|
48
49
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(Component, {
|
|
49
|
-
css: [require_styles.mainLayoutStyles(
|
|
50
|
+
css: [require_styles.mainLayoutStyles(mergedTheme, {
|
|
50
51
|
fluid,
|
|
51
52
|
paddingTop,
|
|
52
53
|
paddingBottom
|
|
@@ -80,8 +81,9 @@ function LayoutMain({ as: Component = "main", children, fluid = true, paddingTop
|
|
|
80
81
|
* ```
|
|
81
82
|
*/
|
|
82
83
|
function LayoutRoot({ children, theme = {}, cssOverrides, ...props }) {
|
|
84
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultLayoutTheme, theme);
|
|
83
85
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
|
|
84
|
-
css: [require_styles.layoutStyles(
|
|
86
|
+
css: [require_styles.layoutStyles(mergedTheme), cssOverrides],
|
|
85
87
|
...props,
|
|
86
88
|
children
|
|
87
89
|
});
|
|
@@ -45,8 +45,9 @@ function LayoutSidebar({ as: Component = "aside", children, layoutSmBreakpoint =
|
|
|
45
45
|
* Places children into the main grid area of the Layout.
|
|
46
46
|
*/
|
|
47
47
|
function LayoutMain({ as: Component = "main", children, fluid = true, paddingTop = true, paddingBottom = true, theme = {}, cssOverrides, ...props }) {
|
|
48
|
+
const mergedTheme = mergeDeep(defaultMainTheme, theme);
|
|
48
49
|
return /* @__PURE__ */ jsx(Component, {
|
|
49
|
-
css: [mainLayoutStyles(
|
|
50
|
+
css: [mainLayoutStyles(mergedTheme, {
|
|
50
51
|
fluid,
|
|
51
52
|
paddingTop,
|
|
52
53
|
paddingBottom
|
|
@@ -80,8 +81,9 @@ function LayoutMain({ as: Component = "main", children, fluid = true, paddingTop
|
|
|
80
81
|
* ```
|
|
81
82
|
*/
|
|
82
83
|
function LayoutRoot({ children, theme = {}, cssOverrides, ...props }) {
|
|
84
|
+
const mergedTheme = mergeDeep(defaultLayoutTheme, theme);
|
|
83
85
|
return /* @__PURE__ */ jsx("div", {
|
|
84
|
-
css: [layoutStyles(
|
|
86
|
+
css: [layoutStyles(mergedTheme), cssOverrides],
|
|
85
87
|
...props,
|
|
86
88
|
children
|
|
87
89
|
});
|
|
@@ -8,16 +8,18 @@ let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
|
|
|
8
8
|
let react_aria_components = require("react-aria-components");
|
|
9
9
|
//#region src/components/Menu/Menu.tsx
|
|
10
10
|
function Popover({ size = "md", children, theme = {}, cssOverrides, ...props }) {
|
|
11
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultMenuPopoverTheme, theme);
|
|
11
12
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(react_aria_components.Popover, {
|
|
12
|
-
css: [require_styles.menuPopoverStyles(
|
|
13
|
+
css: [require_styles.menuPopoverStyles(mergedTheme, { size }), cssOverrides],
|
|
13
14
|
...props,
|
|
14
15
|
children
|
|
15
16
|
});
|
|
16
17
|
}
|
|
17
18
|
function MenuSeparator({ theme = {}, cssOverrides, ...props }) {
|
|
19
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultMenuSeparatorTheme, theme);
|
|
18
20
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(react_aria_components.Separator, {
|
|
19
21
|
orientation: "horizontal",
|
|
20
|
-
css: [require_styles.menuSeparatorStyles(
|
|
22
|
+
css: [require_styles.menuSeparatorStyles(mergedTheme), cssOverrides],
|
|
21
23
|
...props
|
|
22
24
|
});
|
|
23
25
|
}
|
|
@@ -6,16 +6,18 @@ import { Fragment, jsx, jsxs } from "@emotion/react/jsx-runtime";
|
|
|
6
6
|
import { Header, Menu, MenuItem, MenuSection, MenuTrigger, Popover, Separator } from "react-aria-components";
|
|
7
7
|
//#region src/components/Menu/Menu.tsx
|
|
8
8
|
function Popover$1({ size = "md", children, theme = {}, cssOverrides, ...props }) {
|
|
9
|
+
const mergedTheme = mergeDeep(defaultMenuPopoverTheme, theme);
|
|
9
10
|
return /* @__PURE__ */ jsx(Popover, {
|
|
10
|
-
css: [menuPopoverStyles(
|
|
11
|
+
css: [menuPopoverStyles(mergedTheme, { size }), cssOverrides],
|
|
11
12
|
...props,
|
|
12
13
|
children
|
|
13
14
|
});
|
|
14
15
|
}
|
|
15
16
|
function MenuSeparator({ theme = {}, cssOverrides, ...props }) {
|
|
17
|
+
const mergedTheme = mergeDeep(defaultMenuSeparatorTheme, theme);
|
|
16
18
|
return /* @__PURE__ */ jsx(Separator, {
|
|
17
19
|
orientation: "horizontal",
|
|
18
|
-
css: [menuSeparatorStyles(
|
|
20
|
+
css: [menuSeparatorStyles(mergedTheme), cssOverrides],
|
|
19
21
|
...props
|
|
20
22
|
});
|
|
21
23
|
}
|
|
@@ -43,11 +43,12 @@ const DialogRoot = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
|
43
43
|
});
|
|
44
44
|
};
|
|
45
45
|
const DialogHeader = ({ variant = "headingLg", element = "h2", theme = {}, cssOverrides, ...props }) => {
|
|
46
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultDialogTheme.title, theme);
|
|
46
47
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_Typography.Typography, {
|
|
47
48
|
slot: "title",
|
|
48
49
|
variant,
|
|
49
50
|
element,
|
|
50
|
-
cssOverrides: [require_styles.dialogHeadingStyles(
|
|
51
|
+
cssOverrides: [require_styles.dialogHeadingStyles(mergedTheme), ...cssOverrides == null ? [] : Array.isArray(cssOverrides) ? cssOverrides : [cssOverrides]],
|
|
51
52
|
...props
|
|
52
53
|
});
|
|
53
54
|
};
|
|
@@ -69,18 +70,20 @@ const DialogButtons = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
|
69
70
|
});
|
|
70
71
|
};
|
|
71
72
|
const DialogContent = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
73
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultDialogTheme.children, theme);
|
|
72
74
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)("div", {
|
|
73
|
-
css: [require_styles.dialogContentStyles(
|
|
75
|
+
css: [require_styles.dialogContentStyles(mergedTheme), cssOverrides],
|
|
74
76
|
...props,
|
|
75
77
|
children
|
|
76
78
|
});
|
|
77
79
|
};
|
|
78
80
|
const DialogDismiss = ({ theme = {}, size = "lg", symbol = "close", variant = "tertiary", ...props }) => {
|
|
81
|
+
const mergedTheme = require_mergeDeep.mergeDeep(require_styles.defaultDialogTheme.dismiss, theme);
|
|
79
82
|
return /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_IconButton.IconButton, {
|
|
80
83
|
size,
|
|
81
84
|
symbol,
|
|
82
85
|
variant,
|
|
83
|
-
cssOverrides: require_styles.dialogDismissStyles(
|
|
86
|
+
cssOverrides: require_styles.dialogDismissStyles(mergedTheme),
|
|
84
87
|
slot: "close",
|
|
85
88
|
...props
|
|
86
89
|
});
|
|
@@ -41,11 +41,12 @@ const DialogRoot = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
|
41
41
|
});
|
|
42
42
|
};
|
|
43
43
|
const DialogHeader = ({ variant = "headingLg", element = "h2", theme = {}, cssOverrides, ...props }) => {
|
|
44
|
+
const mergedTheme = mergeDeep(defaultDialogTheme.title, theme);
|
|
44
45
|
return /* @__PURE__ */ jsx(Typography, {
|
|
45
46
|
slot: "title",
|
|
46
47
|
variant,
|
|
47
48
|
element,
|
|
48
|
-
cssOverrides: [dialogHeadingStyles(
|
|
49
|
+
cssOverrides: [dialogHeadingStyles(mergedTheme), ...cssOverrides == null ? [] : Array.isArray(cssOverrides) ? cssOverrides : [cssOverrides]],
|
|
49
50
|
...props
|
|
50
51
|
});
|
|
51
52
|
};
|
|
@@ -67,18 +68,20 @@ const DialogButtons = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
|
67
68
|
});
|
|
68
69
|
};
|
|
69
70
|
const DialogContent = ({ children, theme = {}, cssOverrides, ...props }) => {
|
|
71
|
+
const mergedTheme = mergeDeep(defaultDialogTheme.children, theme);
|
|
70
72
|
return /* @__PURE__ */ jsx("div", {
|
|
71
|
-
css: [dialogContentStyles(
|
|
73
|
+
css: [dialogContentStyles(mergedTheme), cssOverrides],
|
|
72
74
|
...props,
|
|
73
75
|
children
|
|
74
76
|
});
|
|
75
77
|
};
|
|
76
78
|
const DialogDismiss = ({ theme = {}, size = "lg", symbol = "close", variant = "tertiary", ...props }) => {
|
|
79
|
+
const mergedTheme = mergeDeep(defaultDialogTheme.dismiss, theme);
|
|
77
80
|
return /* @__PURE__ */ jsx(IconButton, {
|
|
78
81
|
size,
|
|
79
82
|
symbol,
|
|
80
83
|
variant,
|
|
81
|
-
cssOverrides: dialogDismissStyles(
|
|
84
|
+
cssOverrides: dialogDismissStyles(mergedTheme),
|
|
82
85
|
slot: "close",
|
|
83
86
|
...props
|
|
84
87
|
});
|