@automattic/charts 1.11.0 → 1.12.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/CHANGELOG.md +10 -2
- package/TOKENS.md +12 -1
- package/dist/index.cjs +751 -97
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +11 -28
- package/dist/index.d.cts +58 -6
- package/dist/index.d.ts +58 -6
- package/dist/index.js +751 -97
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
- package/src/charts/area-chart/area-chart.tsx +28 -8
- package/src/charts/area-chart/test/area-chart.test.tsx +102 -0
- package/src/charts/area-chart/types.ts +20 -6
- package/src/charts/bar-chart/bar-chart.tsx +33 -9
- package/src/charts/bar-chart/test/bar-chart.test.tsx +117 -0
- package/src/charts/line-chart/line-chart.tsx +40 -5
- package/src/charts/line-chart/test/line-chart.test.tsx +190 -1
- package/src/charts/line-chart/types.ts +14 -0
- package/src/charts/private/x-zoom/index.ts +1 -0
- package/src/charts/private/{test → x-zoom/test}/x-zoom.test.tsx +46 -3
- package/src/charts/private/x-zoom/x-zoom.module.scss +43 -0
- package/src/charts/private/{x-zoom.tsx → x-zoom/x-zoom.tsx} +52 -24
- package/src/components/legend/hooks/test/use-chart-legend-items.test.tsx +152 -0
- package/src/components/legend/hooks/use-chart-legend-items.ts +118 -16
- package/src/components/legend/private/base-legend.tsx +21 -9
- package/src/components/legend/test/legend-config-types.test.tsx +32 -0
- package/src/components/legend/test/legend.test.tsx +121 -1
- package/src/components/legend/types.ts +6 -0
- package/src/index.ts +1 -0
- package/src/types.ts +16 -0
- package/src/charts/private/x-zoom.module.scss +0 -50
package/dist/index.js
CHANGED
|
@@ -1517,6 +1517,30 @@ function paramCase(input, options) {
|
|
|
1517
1517
|
return dotCase(input, __assign({ delimiter: "-" }, options));
|
|
1518
1518
|
}
|
|
1519
1519
|
//#endregion
|
|
1520
|
+
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/error.mjs
|
|
1521
|
+
let set$1;
|
|
1522
|
+
if (process.env.NODE_ENV !== "production") set$1 = /* @__PURE__ */ new Set();
|
|
1523
|
+
function error(...messages) {
|
|
1524
|
+
if (process.env.NODE_ENV !== "production") {
|
|
1525
|
+
const messageKey = messages.join(" ");
|
|
1526
|
+
if (!set$1.has(messageKey)) {
|
|
1527
|
+
set$1.add(messageKey);
|
|
1528
|
+
console.error(`Base UI: ${messageKey}`);
|
|
1529
|
+
}
|
|
1530
|
+
}
|
|
1531
|
+
}
|
|
1532
|
+
//#endregion
|
|
1533
|
+
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/safeReact.mjs
|
|
1534
|
+
/**
|
|
1535
|
+
* A clone of the React namespace for reading APIs that may be missing in older
|
|
1536
|
+
* supported React versions. Bundlers can rewrite direct `React.someNewApi`
|
|
1537
|
+
* reads into named imports, which breaks React 17. Reading from this cloned
|
|
1538
|
+
* object keeps those lookups optional.
|
|
1539
|
+
*
|
|
1540
|
+
* @see https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
|
|
1541
|
+
*/
|
|
1542
|
+
const SafeReact = { ...React };
|
|
1543
|
+
//#endregion
|
|
1520
1544
|
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/useRefWithInit.mjs
|
|
1521
1545
|
const UNINITIALIZED = {};
|
|
1522
1546
|
/**
|
|
@@ -1532,6 +1556,44 @@ function useRefWithInit(init, initArg) {
|
|
|
1532
1556
|
return ref;
|
|
1533
1557
|
}
|
|
1534
1558
|
//#endregion
|
|
1559
|
+
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/useStableCallback.mjs
|
|
1560
|
+
const useInsertionEffect$1 = SafeReact.useInsertionEffect;
|
|
1561
|
+
const useSafeInsertionEffect = useInsertionEffect$1 && useInsertionEffect$1 !== SafeReact.useLayoutEffect ? useInsertionEffect$1 : (fn) => fn();
|
|
1562
|
+
/**
|
|
1563
|
+
* Stabilizes the function passed so it's always the same between renders.
|
|
1564
|
+
*
|
|
1565
|
+
* The function becomes non-reactive to any values it captures.
|
|
1566
|
+
* It can safely be passed as a dependency of `React.useMemo` and `React.useEffect` without re-triggering them if its captured values change.
|
|
1567
|
+
*
|
|
1568
|
+
* The function must only be called inside effects and event handlers, never during render (which throws an error).
|
|
1569
|
+
*
|
|
1570
|
+
* This hook is a more permissive version of React 19.2's `React.useEffectEvent` in that it can be passed through contexts and called in event handler props, not just effects.
|
|
1571
|
+
*/
|
|
1572
|
+
function useStableCallback(callback) {
|
|
1573
|
+
const stable = useRefWithInit(createStableCallback).current;
|
|
1574
|
+
stable.next = callback;
|
|
1575
|
+
useSafeInsertionEffect(stable.effect);
|
|
1576
|
+
return stable.trampoline;
|
|
1577
|
+
}
|
|
1578
|
+
function createStableCallback() {
|
|
1579
|
+
const stable = {
|
|
1580
|
+
next: void 0,
|
|
1581
|
+
callback: assertNotCalled,
|
|
1582
|
+
trampoline: (...args) => stable.callback?.(...args),
|
|
1583
|
+
effect: () => {
|
|
1584
|
+
stable.callback = stable.next;
|
|
1585
|
+
}
|
|
1586
|
+
};
|
|
1587
|
+
return stable;
|
|
1588
|
+
}
|
|
1589
|
+
function assertNotCalled() {
|
|
1590
|
+
if (process.env.NODE_ENV !== "production") throw new Error("Base UI: Cannot call an event handler while rendering.");
|
|
1591
|
+
}
|
|
1592
|
+
//#endregion
|
|
1593
|
+
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/useIsoLayoutEffect.mjs
|
|
1594
|
+
const noop = () => {};
|
|
1595
|
+
const useIsoLayoutEffect = typeof document !== "undefined" ? React.useLayoutEffect : noop;
|
|
1596
|
+
//#endregion
|
|
1535
1597
|
//#region ../../../node_modules/.pnpm/@base-ui+utils@0.3.1_@types+react@18.3.28_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/utils/warn.mjs
|
|
1536
1598
|
let set;
|
|
1537
1599
|
if (process.env.NODE_ENV !== "production") set = /* @__PURE__ */ new Set();
|
|
@@ -1971,6 +2033,190 @@ function renderTag(Tag, props) {
|
|
|
1971
2033
|
return /*#__PURE__*/ React.createElement(Tag, props);
|
|
1972
2034
|
}
|
|
1973
2035
|
//#endregion
|
|
2036
|
+
//#region ../../../node_modules/.pnpm/@floating-ui+utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
|
|
2037
|
+
function hasWindow() {
|
|
2038
|
+
return typeof window !== "undefined";
|
|
2039
|
+
}
|
|
2040
|
+
function getWindow(node) {
|
|
2041
|
+
var _node$ownerDocument;
|
|
2042
|
+
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
2043
|
+
}
|
|
2044
|
+
function isHTMLElement(value) {
|
|
2045
|
+
if (!hasWindow()) return false;
|
|
2046
|
+
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
2047
|
+
}
|
|
2048
|
+
//#endregion
|
|
2049
|
+
//#region ../../../node_modules/.pnpm/@base-ui+react@1.6.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/internals/composite/root/CompositeRootContext.mjs
|
|
2050
|
+
const CompositeRootContext = /*#__PURE__*/ React.createContext(void 0);
|
|
2051
|
+
if (process.env.NODE_ENV !== "production") CompositeRootContext.displayName = "CompositeRootContext";
|
|
2052
|
+
function useCompositeRootContext(optional = false) {
|
|
2053
|
+
const context = React.useContext(CompositeRootContext);
|
|
2054
|
+
if (context === void 0 && !optional) throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>." : formatErrorMessage(16));
|
|
2055
|
+
return context;
|
|
2056
|
+
}
|
|
2057
|
+
//#endregion
|
|
2058
|
+
//#region ../../../node_modules/.pnpm/@base-ui+react@1.6.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/utils/useFocusableWhenDisabled.mjs
|
|
2059
|
+
function useFocusableWhenDisabled(parameters) {
|
|
2060
|
+
const { focusableWhenDisabled, disabled, composite = false, tabIndex: tabIndexProp = 0, isNativeButton } = parameters;
|
|
2061
|
+
const isFocusableComposite = composite && focusableWhenDisabled !== false;
|
|
2062
|
+
const isNonFocusableComposite = composite && focusableWhenDisabled === false;
|
|
2063
|
+
return { props: React.useMemo(() => {
|
|
2064
|
+
const additionalProps = { onKeyDown(event) {
|
|
2065
|
+
if (disabled && focusableWhenDisabled && event.key !== "Tab") event.preventDefault();
|
|
2066
|
+
} };
|
|
2067
|
+
if (!composite) {
|
|
2068
|
+
additionalProps.tabIndex = tabIndexProp;
|
|
2069
|
+
if (!isNativeButton && disabled) additionalProps.tabIndex = focusableWhenDisabled ? tabIndexProp : -1;
|
|
2070
|
+
}
|
|
2071
|
+
if (isNativeButton && (focusableWhenDisabled || isFocusableComposite) || !isNativeButton && disabled) additionalProps["aria-disabled"] = disabled;
|
|
2072
|
+
if (isNativeButton && (!focusableWhenDisabled || isNonFocusableComposite)) additionalProps.disabled = disabled;
|
|
2073
|
+
return additionalProps;
|
|
2074
|
+
}, [
|
|
2075
|
+
composite,
|
|
2076
|
+
disabled,
|
|
2077
|
+
focusableWhenDisabled,
|
|
2078
|
+
isFocusableComposite,
|
|
2079
|
+
isNonFocusableComposite,
|
|
2080
|
+
isNativeButton,
|
|
2081
|
+
tabIndexProp
|
|
2082
|
+
]) };
|
|
2083
|
+
}
|
|
2084
|
+
//#endregion
|
|
2085
|
+
//#region ../../../node_modules/.pnpm/@base-ui+react@1.6.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/internals/use-button/useButton.mjs
|
|
2086
|
+
function useButton(parameters = {}) {
|
|
2087
|
+
const { disabled = false, focusableWhenDisabled, tabIndex = 0, native: isNativeButton = true, composite: compositeProp } = parameters;
|
|
2088
|
+
const elementRef = React.useRef(null);
|
|
2089
|
+
const compositeRootContext = useCompositeRootContext(true);
|
|
2090
|
+
const isCompositeItem = compositeProp ?? compositeRootContext !== void 0;
|
|
2091
|
+
const { props: focusableWhenDisabledProps } = useFocusableWhenDisabled({
|
|
2092
|
+
focusableWhenDisabled,
|
|
2093
|
+
disabled,
|
|
2094
|
+
composite: isCompositeItem,
|
|
2095
|
+
tabIndex,
|
|
2096
|
+
isNativeButton
|
|
2097
|
+
});
|
|
2098
|
+
if (process.env.NODE_ENV !== "production") React.useEffect(() => {
|
|
2099
|
+
if (!elementRef.current) return;
|
|
2100
|
+
const isButtonTag = isButtonElement(elementRef.current);
|
|
2101
|
+
if (isNativeButton) {
|
|
2102
|
+
if (!isButtonTag) error(`A component that acts as a button expected a native <button> because the \`nativeButton\` prop is true. Rendering a non-<button> removes native button semantics, which can impact forms and accessibility. Use a real <button> in the \`render\` prop, or set \`nativeButton\` to \`false\`.${SafeReact.captureOwnerStack?.() || ""}`);
|
|
2103
|
+
} else if (isButtonTag) error(`A component that acts as a button expected a non-<button> because the \`nativeButton\` prop is false. Rendering a <button> keeps native behavior while Base UI applies non-native attributes and handlers, which can add unintended extra attributes (such as \`role\` or \`aria-disabled\`). Use a non-<button> in the \`render\` prop, or set \`nativeButton\` to \`true\`.${SafeReact.captureOwnerStack?.() || ""}`);
|
|
2104
|
+
}, [isNativeButton]);
|
|
2105
|
+
const updateDisabled = React.useCallback(() => {
|
|
2106
|
+
const element = elementRef.current;
|
|
2107
|
+
if (!isButtonElement(element)) return;
|
|
2108
|
+
if (isCompositeItem && disabled && focusableWhenDisabledProps.disabled === void 0 && element.disabled) element.disabled = false;
|
|
2109
|
+
}, [
|
|
2110
|
+
disabled,
|
|
2111
|
+
focusableWhenDisabledProps.disabled,
|
|
2112
|
+
isCompositeItem
|
|
2113
|
+
]);
|
|
2114
|
+
useIsoLayoutEffect(updateDisabled, [updateDisabled]);
|
|
2115
|
+
return {
|
|
2116
|
+
getButtonProps: React.useCallback((externalProps = {}) => {
|
|
2117
|
+
const { onClick: externalOnClick, onMouseDown: externalOnMouseDown, onKeyUp: externalOnKeyUp, onKeyDown: externalOnKeyDown, onPointerDown: externalOnPointerDown, ...otherExternalProps } = externalProps;
|
|
2118
|
+
return mergeProps({
|
|
2119
|
+
onClick(event) {
|
|
2120
|
+
if (disabled) {
|
|
2121
|
+
event.preventDefault();
|
|
2122
|
+
return;
|
|
2123
|
+
}
|
|
2124
|
+
externalOnClick?.(event);
|
|
2125
|
+
},
|
|
2126
|
+
onMouseDown(event) {
|
|
2127
|
+
if (!disabled) externalOnMouseDown?.(event);
|
|
2128
|
+
},
|
|
2129
|
+
onKeyDown(event) {
|
|
2130
|
+
if (disabled) return;
|
|
2131
|
+
makeEventPreventable(event);
|
|
2132
|
+
externalOnKeyDown?.(event);
|
|
2133
|
+
if (event.baseUIHandlerPrevented) return;
|
|
2134
|
+
const isCurrentTarget = event.target === event.currentTarget;
|
|
2135
|
+
const currentTarget = event.currentTarget;
|
|
2136
|
+
const isButton = isButtonElement(currentTarget);
|
|
2137
|
+
const isLink = !isNativeButton && isValidLinkElement(currentTarget);
|
|
2138
|
+
const shouldClick = isCurrentTarget && (isNativeButton ? isButton : !isLink);
|
|
2139
|
+
const isEnterKey = event.key === "Enter";
|
|
2140
|
+
const isSpaceKey = event.key === " ";
|
|
2141
|
+
const role = currentTarget.getAttribute("role");
|
|
2142
|
+
const isTextNavigationRole = role?.startsWith("menuitem") || role === "option" || role === "gridcell";
|
|
2143
|
+
if (isCurrentTarget && isCompositeItem && isSpaceKey) {
|
|
2144
|
+
if (event.defaultPrevented && isTextNavigationRole) return;
|
|
2145
|
+
event.preventDefault();
|
|
2146
|
+
if (isLink || isNativeButton && isButton) {
|
|
2147
|
+
currentTarget.click();
|
|
2148
|
+
event.preventBaseUIHandler();
|
|
2149
|
+
} else if (shouldClick) {
|
|
2150
|
+
externalOnClick?.(event);
|
|
2151
|
+
event.preventBaseUIHandler();
|
|
2152
|
+
}
|
|
2153
|
+
return;
|
|
2154
|
+
}
|
|
2155
|
+
if (shouldClick) {
|
|
2156
|
+
if (!isNativeButton && (isSpaceKey || isEnterKey)) event.preventDefault();
|
|
2157
|
+
if (!isNativeButton && isEnterKey) externalOnClick?.(event);
|
|
2158
|
+
}
|
|
2159
|
+
},
|
|
2160
|
+
onKeyUp(event) {
|
|
2161
|
+
if (disabled) return;
|
|
2162
|
+
makeEventPreventable(event);
|
|
2163
|
+
externalOnKeyUp?.(event);
|
|
2164
|
+
if (event.target === event.currentTarget && isNativeButton && isCompositeItem && isButtonElement(event.currentTarget) && event.key === " ") {
|
|
2165
|
+
event.preventDefault();
|
|
2166
|
+
return;
|
|
2167
|
+
}
|
|
2168
|
+
if (event.baseUIHandlerPrevented) return;
|
|
2169
|
+
if (event.target === event.currentTarget && !isNativeButton && !isCompositeItem && event.key === " ") externalOnClick?.(event);
|
|
2170
|
+
},
|
|
2171
|
+
onPointerDown(event) {
|
|
2172
|
+
if (disabled) {
|
|
2173
|
+
event.preventDefault();
|
|
2174
|
+
return;
|
|
2175
|
+
}
|
|
2176
|
+
externalOnPointerDown?.(event);
|
|
2177
|
+
}
|
|
2178
|
+
}, isNativeButton ? { type: "button" } : { role: "button" }, focusableWhenDisabledProps, otherExternalProps);
|
|
2179
|
+
}, [
|
|
2180
|
+
disabled,
|
|
2181
|
+
focusableWhenDisabledProps,
|
|
2182
|
+
isCompositeItem,
|
|
2183
|
+
isNativeButton
|
|
2184
|
+
]),
|
|
2185
|
+
buttonRef: useStableCallback((element) => {
|
|
2186
|
+
elementRef.current = element;
|
|
2187
|
+
updateDisabled();
|
|
2188
|
+
})
|
|
2189
|
+
};
|
|
2190
|
+
}
|
|
2191
|
+
function isButtonElement(elem) {
|
|
2192
|
+
return isHTMLElement(elem) && elem.tagName === "BUTTON";
|
|
2193
|
+
}
|
|
2194
|
+
function isValidLinkElement(elem) {
|
|
2195
|
+
return Boolean(elem?.tagName === "A" && elem?.href);
|
|
2196
|
+
}
|
|
2197
|
+
//#endregion
|
|
2198
|
+
//#region ../../../node_modules/.pnpm/@base-ui+react@1.6.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/button/Button.mjs
|
|
2199
|
+
/**
|
|
2200
|
+
* A button component that can be used to trigger actions.
|
|
2201
|
+
* Renders a `<button>` element.
|
|
2202
|
+
*
|
|
2203
|
+
* Documentation: [Base UI Button](https://base-ui.com/react/components/button)
|
|
2204
|
+
*/
|
|
2205
|
+
const Button$2 = /*#__PURE__*/ React.forwardRef(function Button(componentProps, forwardedRef) {
|
|
2206
|
+
const { render, className, disabled = false, focusableWhenDisabled = false, nativeButton = true, style, ...elementProps } = componentProps;
|
|
2207
|
+
const { getButtonProps, buttonRef } = useButton({
|
|
2208
|
+
disabled,
|
|
2209
|
+
focusableWhenDisabled,
|
|
2210
|
+
native: nativeButton
|
|
2211
|
+
});
|
|
2212
|
+
return useRenderElement("button", componentProps, {
|
|
2213
|
+
state: { disabled },
|
|
2214
|
+
ref: [forwardedRef, buttonRef],
|
|
2215
|
+
props: [elementProps, getButtonProps]
|
|
2216
|
+
});
|
|
2217
|
+
});
|
|
2218
|
+
if (process.env.NODE_ENV !== "production") Button$2.displayName = "Button";
|
|
2219
|
+
//#endregion
|
|
1974
2220
|
//#region ../../../node_modules/.pnpm/@base-ui+react@1.6.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@base-ui/react/use-render/useRender.mjs
|
|
1975
2221
|
/**
|
|
1976
2222
|
* Renders a Base UI element.
|
|
@@ -1982,8 +2228,8 @@ function useRender(params) {
|
|
|
1982
2228
|
}
|
|
1983
2229
|
//#endregion
|
|
1984
2230
|
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/text/text.mjs
|
|
1985
|
-
var STYLE_HASH_ATTRIBUTE$
|
|
1986
|
-
function getRuntime$
|
|
2231
|
+
var STYLE_HASH_ATTRIBUTE$3 = "data-wp-hash";
|
|
2232
|
+
function getRuntime$3() {
|
|
1987
2233
|
const globalScope = globalThis;
|
|
1988
2234
|
if (globalScope.__wpStyleRuntime) return globalScope.__wpStyleRuntime;
|
|
1989
2235
|
globalScope.__wpStyleRuntime = {
|
|
@@ -1991,37 +2237,37 @@ function getRuntime$1() {
|
|
|
1991
2237
|
styles: /* @__PURE__ */ new Map(),
|
|
1992
2238
|
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
1993
2239
|
};
|
|
1994
|
-
if (typeof document !== "undefined") registerDocument$
|
|
2240
|
+
if (typeof document !== "undefined") registerDocument$3(document);
|
|
1995
2241
|
return globalScope.__wpStyleRuntime;
|
|
1996
2242
|
}
|
|
1997
|
-
function documentContainsStyleHash$
|
|
2243
|
+
function documentContainsStyleHash$3(targetDocument, hash) {
|
|
1998
2244
|
if (!targetDocument.head) return false;
|
|
1999
|
-
for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE$
|
|
2245
|
+
for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE$3}]`)) if (style.getAttribute(STYLE_HASH_ATTRIBUTE$3) === hash) return true;
|
|
2000
2246
|
return false;
|
|
2001
2247
|
}
|
|
2002
|
-
function injectStyle$
|
|
2248
|
+
function injectStyle$3(targetDocument, hash, css) {
|
|
2003
2249
|
if (!targetDocument.head) return;
|
|
2004
|
-
const runtime = getRuntime$
|
|
2250
|
+
const runtime = getRuntime$3();
|
|
2005
2251
|
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
2006
2252
|
if (!injectedStyles) {
|
|
2007
2253
|
injectedStyles = /* @__PURE__ */ new Set();
|
|
2008
2254
|
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
2009
2255
|
}
|
|
2010
2256
|
if (injectedStyles.has(hash)) return;
|
|
2011
|
-
if (documentContainsStyleHash$
|
|
2257
|
+
if (documentContainsStyleHash$3(targetDocument, hash)) {
|
|
2012
2258
|
injectedStyles.add(hash);
|
|
2013
2259
|
return;
|
|
2014
2260
|
}
|
|
2015
2261
|
const style = targetDocument.createElement("style");
|
|
2016
|
-
style.setAttribute(STYLE_HASH_ATTRIBUTE$
|
|
2262
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE$3, hash);
|
|
2017
2263
|
style.appendChild(targetDocument.createTextNode(css));
|
|
2018
2264
|
targetDocument.head.appendChild(style);
|
|
2019
2265
|
injectedStyles.add(hash);
|
|
2020
2266
|
}
|
|
2021
|
-
function registerDocument$
|
|
2022
|
-
const runtime = getRuntime$
|
|
2267
|
+
function registerDocument$3(targetDocument) {
|
|
2268
|
+
const runtime = getRuntime$3();
|
|
2023
2269
|
runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);
|
|
2024
|
-
for (const [hash, css] of runtime.styles) injectStyle$
|
|
2270
|
+
for (const [hash, css] of runtime.styles) injectStyle$3(targetDocument, hash, css);
|
|
2025
2271
|
return () => {
|
|
2026
2272
|
const count = runtime.documents.get(targetDocument);
|
|
2027
2273
|
if (count === void 0) return;
|
|
@@ -2032,13 +2278,13 @@ function registerDocument$1(targetDocument) {
|
|
|
2032
2278
|
runtime.documents.set(targetDocument, count - 1);
|
|
2033
2279
|
};
|
|
2034
2280
|
}
|
|
2035
|
-
function registerStyle$
|
|
2036
|
-
const runtime = getRuntime$
|
|
2281
|
+
function registerStyle$3(hash, css) {
|
|
2282
|
+
const runtime = getRuntime$3();
|
|
2037
2283
|
runtime.styles.set(hash, css);
|
|
2038
|
-
for (const targetDocument of runtime.documents.keys()) injectStyle$
|
|
2284
|
+
for (const targetDocument of runtime.documents.keys()) injectStyle$3(targetDocument, hash, css);
|
|
2039
2285
|
}
|
|
2040
|
-
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$
|
|
2041
|
-
var style_default$
|
|
2286
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$3("0c5702ddca", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._83ed8a8da5dd50ea__text{margin:0}._14437cfb77831647__heading-2xl{--_gcd-heading-font-size:var(--wpds-typography-font-size-2xl,32px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-medium,499);--_gcd-p-font-size:var(--wpds-typography-font-size-2xl,32px);--_gcd-p-line-height:var(--wpds-typography-line-height-2xl,40px);font-size:var(--wpds-typography-font-size-2xl,32px);line-height:var(--wpds-typography-line-height-2xl,40px)}._14437cfb77831647__heading-2xl,._3c78b7fa9b4072dd__heading-xl{font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-weight:var(--wpds-typography-font-weight-medium,499)}._3c78b7fa9b4072dd__heading-xl{--_gcd-heading-font-size:var(--wpds-typography-font-size-xl,20px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-medium,499);--_gcd-p-font-size:var(--wpds-typography-font-size-xl,20px);--_gcd-p-line-height:var(--wpds-typography-line-height-md,24px);font-size:var(--wpds-typography-font-size-xl,20px);line-height:var(--wpds-typography-line-height-md,24px)}.aa58f227716bcde2__heading-lg{--_gcd-heading-font-size:var(--wpds-typography-font-size-lg,15px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-medium,499);--_gcd-p-font-size:var(--wpds-typography-font-size-lg,15px);--_gcd-p-line-height:var(--wpds-typography-line-height-sm,20px);font-size:var(--wpds-typography-font-size-lg,15px)}.aa58f227716bcde2__heading-lg,.fc4da56d8dfe52c4__heading-md{font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-weight:var(--wpds-typography-font-weight-medium,499);line-height:var(--wpds-typography-line-height-sm,20px)}.fc4da56d8dfe52c4__heading-md{--_gcd-heading-font-size:var(--wpds-typography-font-size-md,13px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-medium,499);--_gcd-p-font-size:var(--wpds-typography-font-size-md,13px);--_gcd-p-line-height:var(--wpds-typography-line-height-sm,20px);font-size:var(--wpds-typography-font-size-md,13px)}.a9b78c7c82e8dff7__heading-sm{--_gcd-heading-font-size:var(--wpds-typography-font-size-xs,11px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-medium,499);--_gcd-p-font-size:var(--wpds-typography-font-size-xs,11px);--_gcd-p-line-height:var(--wpds-typography-line-height-xs,16px);font-family:var(--wpds-typography-font-family-heading,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-size:var(--wpds-typography-font-size-xs,11px);font-weight:var(--wpds-typography-font-weight-medium,499);line-height:var(--wpds-typography-line-height-xs,16px);text-transform:uppercase}._305ff559e52180d5__body-xl{--_gcd-heading-font-size:var(--wpds-typography-font-size-xl,20px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-regular,400);--_gcd-p-font-size:var(--wpds-typography-font-size-xl,20px);--_gcd-p-line-height:var(--wpds-typography-line-height-xl,32px);font-size:var(--wpds-typography-font-size-xl,20px);line-height:var(--wpds-typography-line-height-xl,32px)}._305ff559e52180d5__body-xl,.ca1aa3fc2029e958__body-lg{font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-weight:var(--wpds-typography-font-weight-regular,400)}.ca1aa3fc2029e958__body-lg{--_gcd-heading-font-size:var(--wpds-typography-font-size-lg,15px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-regular,400);--_gcd-p-font-size:var(--wpds-typography-font-size-lg,15px);--_gcd-p-line-height:var(--wpds-typography-line-height-md,24px);font-size:var(--wpds-typography-font-size-lg,15px);line-height:var(--wpds-typography-line-height-md,24px)}._131101940be12424__body-md{--_gcd-heading-font-size:var(--wpds-typography-font-size-md,13px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-regular,400);--_gcd-p-font-size:var(--wpds-typography-font-size-md,13px);--_gcd-p-line-height:var(--wpds-typography-line-height-sm,20px);font-size:var(--wpds-typography-font-size-md,13px);line-height:var(--wpds-typography-line-height-sm,20px)}._0e8d87a42c1f75fa__body-sm,._131101940be12424__body-md{font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-weight:var(--wpds-typography-font-weight-regular,400)}._0e8d87a42c1f75fa__body-sm{--_gcd-heading-font-size:var(--wpds-typography-font-size-sm,12px);--_gcd-heading-font-weight:var(--wpds-typography-font-weight-regular,400);--_gcd-p-font-size:var(--wpds-typography-font-size-sm,12px);--_gcd-p-line-height:var(--wpds-typography-line-height-xs,16px);font-size:var(--wpds-typography-font-size-sm,12px);line-height:var(--wpds-typography-line-height-xs,16px)}}}");
|
|
2287
|
+
var style_default$3 = {
|
|
2042
2288
|
"text": "_83ed8a8da5dd50ea__text",
|
|
2043
2289
|
"heading-2xl": "_14437cfb77831647__heading-2xl",
|
|
2044
2290
|
"heading-xl": "_3c78b7fa9b4072dd__heading-xl",
|
|
@@ -2050,8 +2296,8 @@ var style_default$1 = {
|
|
|
2050
2296
|
"body-md": "_131101940be12424__body-md",
|
|
2051
2297
|
"body-sm": "_0e8d87a42c1f75fa__body-sm"
|
|
2052
2298
|
};
|
|
2053
|
-
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$
|
|
2054
|
-
var global_css_defense_default = {
|
|
2299
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$3("d390e935a7", "._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,transparent);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 transparent);color:var(--_gcd-input-color,var(--wpds-color-foreground-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,transparent);border-color:var(--_gcd-input-border-color-disabled,transparent);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid transparent)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-foreground-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid transparent);transition:var(--_gcd-a-transition,none)}");
|
|
2300
|
+
var global_css_defense_default$1 = {
|
|
2055
2301
|
"button": "_6defc79820e382c6__button",
|
|
2056
2302
|
"input": "d2cff2e5dea83bd1__input",
|
|
2057
2303
|
"textarea": "_547d86373d02e108__textarea",
|
|
@@ -2065,10 +2311,317 @@ var Text$1 = forwardRef$1(function Text2({ variant = "body-md", render, classNam
|
|
|
2065
2311
|
render,
|
|
2066
2312
|
defaultTagName: "span",
|
|
2067
2313
|
ref,
|
|
2068
|
-
props: mergeProps(props, { className: clsx(style_default$
|
|
2314
|
+
props: mergeProps(props, { className: clsx(style_default$3.text, global_css_defense_default$1.heading, global_css_defense_default$1.p, style_default$3[variant], className) })
|
|
2315
|
+
});
|
|
2316
|
+
});
|
|
2317
|
+
//#endregion
|
|
2318
|
+
//#region ../../../node_modules/.pnpm/@wordpress+dom-ready@4.51.0/node_modules/@wordpress/dom-ready/build-module/index.mjs
|
|
2319
|
+
function domReady(callback) {
|
|
2320
|
+
if (typeof document === "undefined") return;
|
|
2321
|
+
if (document.readyState === "complete" || document.readyState === "interactive") {
|
|
2322
|
+
callback();
|
|
2323
|
+
return;
|
|
2324
|
+
}
|
|
2325
|
+
document.addEventListener("DOMContentLoaded", callback);
|
|
2326
|
+
}
|
|
2327
|
+
//#endregion
|
|
2328
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/script/add-container.mjs
|
|
2329
|
+
function addContainer(ariaLive = "polite") {
|
|
2330
|
+
const container = document.createElement("div");
|
|
2331
|
+
container.id = `a11y-speak-${ariaLive}`;
|
|
2332
|
+
container.className = "a11y-speak-region";
|
|
2333
|
+
container.setAttribute("style", "position:absolute;margin:-1px;padding:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);border:0;word-wrap:normal !important;word-break:normal !important;");
|
|
2334
|
+
container.setAttribute("aria-live", ariaLive);
|
|
2335
|
+
container.setAttribute("aria-relevant", "additions text");
|
|
2336
|
+
container.setAttribute("aria-atomic", "true");
|
|
2337
|
+
const { body } = document;
|
|
2338
|
+
if (body) body.appendChild(container);
|
|
2339
|
+
return container;
|
|
2340
|
+
}
|
|
2341
|
+
//#endregion
|
|
2342
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/script/add-intro-text.mjs
|
|
2343
|
+
function addIntroText() {
|
|
2344
|
+
const introText = document.createElement("p");
|
|
2345
|
+
introText.id = "a11y-speak-intro-text";
|
|
2346
|
+
introText.className = "a11y-speak-intro-text";
|
|
2347
|
+
introText.textContent = __("Notifications");
|
|
2348
|
+
introText.setAttribute("style", "position:absolute;margin:-1px;padding:0;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);border:0;word-wrap:normal !important;word-break:normal !important;");
|
|
2349
|
+
introText.setAttribute("hidden", "");
|
|
2350
|
+
const { body } = document;
|
|
2351
|
+
if (body) body.appendChild(introText);
|
|
2352
|
+
return introText;
|
|
2353
|
+
}
|
|
2354
|
+
//#endregion
|
|
2355
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/shared/clear.mjs
|
|
2356
|
+
function clear() {
|
|
2357
|
+
const regions = document.getElementsByClassName("a11y-speak-region");
|
|
2358
|
+
const introText = document.getElementById("a11y-speak-intro-text");
|
|
2359
|
+
for (let i = 0; i < regions.length; i++) regions[i].textContent = "";
|
|
2360
|
+
if (introText) introText.setAttribute("hidden", "hidden");
|
|
2361
|
+
}
|
|
2362
|
+
//#endregion
|
|
2363
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/shared/filter-message.mjs
|
|
2364
|
+
var previousMessage = "";
|
|
2365
|
+
function filterMessage(message) {
|
|
2366
|
+
message = message.replace(/<[^<>]+>/g, " ");
|
|
2367
|
+
if (previousMessage === message) message += "\xA0";
|
|
2368
|
+
previousMessage = message;
|
|
2369
|
+
return message;
|
|
2370
|
+
}
|
|
2371
|
+
//#endregion
|
|
2372
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/shared/index.mjs
|
|
2373
|
+
function speak(message, ariaLive) {
|
|
2374
|
+
clear();
|
|
2375
|
+
message = filterMessage(message);
|
|
2376
|
+
const introText = document.getElementById("a11y-speak-intro-text");
|
|
2377
|
+
const containerAssertive = document.getElementById("a11y-speak-assertive");
|
|
2378
|
+
const containerPolite = document.getElementById("a11y-speak-polite");
|
|
2379
|
+
if (containerAssertive && ariaLive === "assertive") containerAssertive.textContent = message;
|
|
2380
|
+
else if (containerPolite) containerPolite.textContent = message;
|
|
2381
|
+
if (introText) introText.removeAttribute("hidden");
|
|
2382
|
+
}
|
|
2383
|
+
//#endregion
|
|
2384
|
+
//#region ../../../node_modules/.pnpm/@wordpress+a11y@4.51.0/node_modules/@wordpress/a11y/build-module/index.mjs
|
|
2385
|
+
function setup() {
|
|
2386
|
+
const introText = document.getElementById("a11y-speak-intro-text");
|
|
2387
|
+
const containerAssertive = document.getElementById("a11y-speak-assertive");
|
|
2388
|
+
const containerPolite = document.getElementById("a11y-speak-polite");
|
|
2389
|
+
if (introText === null) addIntroText();
|
|
2390
|
+
if (containerAssertive === null) addContainer("assertive");
|
|
2391
|
+
if (containerPolite === null) addContainer("polite");
|
|
2392
|
+
}
|
|
2393
|
+
domReady(setup);
|
|
2394
|
+
//#endregion
|
|
2395
|
+
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/button/button.mjs
|
|
2396
|
+
var STYLE_HASH_ATTRIBUTE$2 = "data-wp-hash";
|
|
2397
|
+
function getRuntime$2() {
|
|
2398
|
+
const globalScope = globalThis;
|
|
2399
|
+
if (globalScope.__wpStyleRuntime) return globalScope.__wpStyleRuntime;
|
|
2400
|
+
globalScope.__wpStyleRuntime = {
|
|
2401
|
+
documents: /* @__PURE__ */ new Map(),
|
|
2402
|
+
styles: /* @__PURE__ */ new Map(),
|
|
2403
|
+
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
2404
|
+
};
|
|
2405
|
+
if (typeof document !== "undefined") registerDocument$2(document);
|
|
2406
|
+
return globalScope.__wpStyleRuntime;
|
|
2407
|
+
}
|
|
2408
|
+
function documentContainsStyleHash$2(targetDocument, hash) {
|
|
2409
|
+
if (!targetDocument.head) return false;
|
|
2410
|
+
for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE$2}]`)) if (style.getAttribute(STYLE_HASH_ATTRIBUTE$2) === hash) return true;
|
|
2411
|
+
return false;
|
|
2412
|
+
}
|
|
2413
|
+
function injectStyle$2(targetDocument, hash, css) {
|
|
2414
|
+
if (!targetDocument.head) return;
|
|
2415
|
+
const runtime = getRuntime$2();
|
|
2416
|
+
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
2417
|
+
if (!injectedStyles) {
|
|
2418
|
+
injectedStyles = /* @__PURE__ */ new Set();
|
|
2419
|
+
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
2420
|
+
}
|
|
2421
|
+
if (injectedStyles.has(hash)) return;
|
|
2422
|
+
if (documentContainsStyleHash$2(targetDocument, hash)) {
|
|
2423
|
+
injectedStyles.add(hash);
|
|
2424
|
+
return;
|
|
2425
|
+
}
|
|
2426
|
+
const style = targetDocument.createElement("style");
|
|
2427
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE$2, hash);
|
|
2428
|
+
style.appendChild(targetDocument.createTextNode(css));
|
|
2429
|
+
targetDocument.head.appendChild(style);
|
|
2430
|
+
injectedStyles.add(hash);
|
|
2431
|
+
}
|
|
2432
|
+
function registerDocument$2(targetDocument) {
|
|
2433
|
+
const runtime = getRuntime$2();
|
|
2434
|
+
runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);
|
|
2435
|
+
for (const [hash, css] of runtime.styles) injectStyle$2(targetDocument, hash, css);
|
|
2436
|
+
return () => {
|
|
2437
|
+
const count = runtime.documents.get(targetDocument);
|
|
2438
|
+
if (count === void 0) return;
|
|
2439
|
+
if (count <= 1) {
|
|
2440
|
+
runtime.documents.delete(targetDocument);
|
|
2441
|
+
return;
|
|
2442
|
+
}
|
|
2443
|
+
runtime.documents.set(targetDocument, count - 1);
|
|
2444
|
+
};
|
|
2445
|
+
}
|
|
2446
|
+
function registerStyle$2(hash, css) {
|
|
2447
|
+
const runtime = getRuntime$2();
|
|
2448
|
+
runtime.styles.set(hash, css);
|
|
2449
|
+
for (const targetDocument of runtime.documents.keys()) injectStyle$2(targetDocument, hash, css);
|
|
2450
|
+
}
|
|
2451
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$2("4c317b0736", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:var(--wpds-typography-font-weight-medium,499);--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-brand-strong,#fff);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-brand-strong-active,#fff);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-brand-strong-disabled,#8d8d8d);--wp-ui-button-padding-block:var(--wpds-dimension-padding-xs,4px);--wp-ui-button-padding-inline:var(--wpds-dimension-padding-md,12px);--wp-ui-button-height:var(--wpds-dimension-size-lg,40px);--wp-ui-button-aspect-ratio:auto;--wp-ui-button-font-size:var(--wpds-typography-font-size-md,13px);--wp-ui-button-min-width:calc(4ch + var(--wp-ui-button-padding-inline)*2);--wp-ui-button-icon-margin:calc((var(--wpds-dimension-size-2xs, 16px) - var(--wpds-dimension-size-sm, 24px))/2);--wp-ui-button-border-color:var(--wp-ui-button-background-color);--wp-ui-button-border-color-active:var(--wp-ui-button-background-color-active);--wp-ui-button-border-color-disabled:var(--wp-ui-button-background-color-disabled);--_gcd-button-font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);--_gcd-button-font-size:var(--wp-ui-button-font-size);--_gcd-button-font-weight:var(--wp-ui-button-font-weight);align-items:center;aspect-ratio:var(--wp-ui-button-aspect-ratio);background-clip:padding-box;background-color:var(--wp-ui-button-background-color);border-color:var(--wp-ui-button-border-color);border-radius:var(--wpds-border-radius-sm,2px);border-style:solid;border-width:1px;color:var(--wp-ui-button-foreground-color);display:inline-flex;font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-size:var(--wp-ui-button-font-size);font-weight:var(--wp-ui-button-font-weight);gap:var(--wpds-dimension-gap-sm,8px);justify-content:center;line-height:var(--wpds-typography-line-height-sm,20px);max-width:100%;min-height:var(--wp-ui-button-height);min-width:var(--wp-ui-button-min-width);overflow-wrap:anywhere;padding-block:var(--wp-ui-button-padding-block);padding-inline:var(--wp-ui-button-padding-inline);position:relative;text-align:center;text-decoration:none;&:not([data-disabled]){cursor:var(--wpds-cursor-control,pointer)}@media not (prefers-reduced-motion){transition:color .1s ease-out;*{transition:opacity .1s ease-out}}&[href]{cursor:pointer}[href]{color:inherit;text-decoration:inherit}&:not([data-disabled]):is(:hover,:active,:focus){background-color:var(--wp-ui-button-background-color-active);border-color:var(--wp-ui-button-border-color-active);color:var(--wp-ui-button-foreground-color-active)}&[data-disabled]:not(._914b42f315c0e580__is-loading){background-color:var(--wp-ui-button-background-color-disabled);border-color:var(--wp-ui-button-border-color-disabled);color:var(--wp-ui-button-foreground-color-disabled);@media (forced-colors:active){border-bottom-color:GrayText;border-left-color:GrayText;border-right-color:GrayText;border-top-color:GrayText;color:GrayText}}&:before{aspect-ratio:1;border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid;border-block-end-color:transparent;border-block-start-color:var(--wp-ui-button-foreground-color);border-inline-end-color:var(--wp-ui-button-foreground-color);border-inline-start-color:transparent;border-radius:50%;box-sizing:border-box;content:\"\";display:block;height:var(--wp-ui-button-font-size);inset-inline-start:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);@media not (prefers-reduced-motion){transition:opacity .1s ease-out}@media (forced-colors:active){border-block-end-style:none;border-bottom-color:ButtonText;border-inline-start-style:none;border-left-color:ButtonText;border-right-color:ButtonText;border-top-color:ButtonText}}}._908205475f9f2a92__is-small{--wp-ui-button-padding-block:0;--wp-ui-button-padding-inline:var(--wpds-dimension-padding-sm,8px);--wp-ui-button-height:var(--wpds-dimension-size-sm,24px)}._9f6fc6553aeb36fe__icon{margin:var(--wp-ui-button-icon-margin)}.dd460c965226cc77__is-brand{&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-brand-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 85%,#000));--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-brand-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-weak-disabled,#0000)}}.e722a8f96726aa99__is-neutral{&.ad0619a3217c6a5b__is-minimal[aria-pressed=true],&.b50b3358c5fb4d0b__is-solid{--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-strong-active,#1e1e1e);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-neutral-strong-active,#f0f0f0);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-neutral-strong-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal:not([aria-pressed=true]){--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-neutral,#1e1e1e);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-neutral-active,#1e1e1e);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-neutral,#8d8d8d);--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-neutral-active,#6e6e6e);--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal:not([aria-pressed=true]){--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-weak-disabled,#0000)}}.abbb272e2ce49bd6__is-unstyled{background:none;border:none;min-width:unset}.cf59cf1b69629838__is-compact{--wp-ui-button-height:var(--wpds-dimension-size-md,32px)}._914b42f315c0e580__is-loading:not(.abbb272e2ce49bd6__is-unstyled){color:transparent;&:not([data-disabled]):is(:hover,:active,:focus){color:transparent}@media (forced-colors:active){color:ButtonFace}*{opacity:0}&:before{opacity:1;transition-delay:.05s;@media not (prefers-reduced-motion){animation:_5a1d53da6f830c8d__loading-animation 1s linear infinite}}}}@keyframes _5a1d53da6f830c8d__loading-animation{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}}");
|
|
2452
|
+
var style_default$2 = {
|
|
2453
|
+
"button": "_97b0fc33c028be1a__button",
|
|
2454
|
+
"is-unstyled": "abbb272e2ce49bd6__is-unstyled",
|
|
2455
|
+
"is-loading": "_914b42f315c0e580__is-loading",
|
|
2456
|
+
"is-small": "_908205475f9f2a92__is-small",
|
|
2457
|
+
"icon": "_9f6fc6553aeb36fe__icon",
|
|
2458
|
+
"is-brand": "dd460c965226cc77__is-brand",
|
|
2459
|
+
"is-outline": "_62d5a778b7b258ee__is-outline",
|
|
2460
|
+
"is-minimal": "ad0619a3217c6a5b__is-minimal",
|
|
2461
|
+
"is-neutral": "e722a8f96726aa99__is-neutral",
|
|
2462
|
+
"is-solid": "b50b3358c5fb4d0b__is-solid",
|
|
2463
|
+
"is-compact": "cf59cf1b69629838__is-compact",
|
|
2464
|
+
"loading-animation": "_5a1d53da6f830c8d__loading-animation"
|
|
2465
|
+
};
|
|
2466
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$2("10f3806643", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}}");
|
|
2467
|
+
var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" };
|
|
2468
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$2("5f8e7aa0bc", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer utilities{._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active),:focus-visible .ecadb9e080e2dfa5__outset-ring--focus-parent-visible{--_gcd-a-outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));--_gcd-div-outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,#3858e9));outline-offset:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px))}}}");
|
|
2469
|
+
var focus_default = {
|
|
2470
|
+
"outset-ring--focus": "_08e8a2e44959f892__outset-ring--focus",
|
|
2471
|
+
"outset-ring--focus-except-active": "e25b2bdd7aa21721__outset-ring--focus-except-active",
|
|
2472
|
+
"outset-ring--focus-visible": "d0541bc9dd9dc7b6__outset-ring--focus-visible",
|
|
2473
|
+
"outset-ring--focus-within": "cd83dfc2126a0846__outset-ring--focus-within",
|
|
2474
|
+
"outset-ring--focus-within-except-active": "_970d04df7376df67__outset-ring--focus-within-except-active",
|
|
2475
|
+
"outset-ring--focus-within-visible": "c5cb3ee4bddaa8e4__outset-ring--focus-within-visible",
|
|
2476
|
+
"outset-ring--focus-parent-visible": "ecadb9e080e2dfa5__outset-ring--focus-parent-visible"
|
|
2477
|
+
};
|
|
2478
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$2("d390e935a7", "._6defc79820e382c6__button{box-sizing:var(--_gcd-button-box-sizing,border-box);font-family:var(--_gcd-button-font-family,inherit);font-size:var(--_gcd-button-font-size,inherit);font-weight:var(--_gcd-button-font-weight,inherit)}.d2cff2e5dea83bd1__input{box-sizing:var(--_gcd-input-box-sizing,border-box);font-family:var(--_gcd-input-font-family,inherit);font-size:var(--_gcd-input-font-size,inherit);font-weight:var(--_gcd-input-font-weight,inherit);margin:var(--_gcd-input-margin,0);&:is(textarea,[type=text],[type=password],[type=color],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){background-color:var(--_gcd-input-background-color,transparent);border:var(--_gcd-input-border,none);border-radius:var(--_gcd-input-border-radius,0);box-shadow:var(--_gcd-input-box-shadow,0 0 0 transparent);color:var(--_gcd-input-color,var(--wpds-color-foreground-interactive-neutral,#1e1e1e));&:focus{border-color:var(--_gcd-input-border-color-focus,var(--wp-admin-theme-color));box-shadow:var(--_gcd-input-box-shadow-focus,none);outline:var(--_gcd-input-outline-focus,none)}&:disabled{background:var(--_gcd-input-background-disabled,transparent);border-color:var(--_gcd-input-border-color-disabled,transparent);box-shadow:var(--_gcd-input-box-shadow-disabled,none);color:var(--_gcd-input-color-disabled,var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d))}&::placeholder{color:var(--_gcd-input-placeholder-color,var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d))}}&:is(textarea,[type=text],[type=password],[type=date],[type=datetime],[type=datetime-local],[type=email],[type=month],[type=number],[type=search],[type=tel],[type=time],[type=url],[type=week]){line-height:var(--_gcd-input-line-height,inherit);min-height:var(--_gcd-input-min-height,auto);padding:var(--_gcd-input-padding,0)}}._547d86373d02e108__textarea{box-sizing:var(--_gcd-textarea-box-sizing,border-box);overflow:var(--_gcd-textarea-overflow,auto);resize:var(--_gcd-textarea-resize,block)}._8c15fd0ed9f28ba4__div{outline:var(--_gcd-div-outline,0 solid transparent)}p._43cec3e1eec1066d__p{font-size:var(--_gcd-p-font-size,13px);line-height:var(--_gcd-p-line-height,1.5);margin:var(--_gcd-p-margin,0)}:is(h1,h2,h3,h4,h5,h6).e97669c6d9a38497__heading{color:var(--_gcd-heading-color,var(--wpds-color-foreground-content-neutral,#1e1e1e));font-size:var(--_gcd-heading-font-size,inherit);font-weight:var(--_gcd-heading-font-weight,var(--wpds-typography-font-weight-medium,499));margin:var(--_gcd-heading-margin,0)}._2c0831b0499dbd6e__a,._2c0831b0499dbd6e__a:is(:hover,:focus,:active){border-radius:var(--_gcd-a-border-radius,0);box-shadow:var(--_gcd-a-box-shadow,none);color:var(--_gcd-a-color,inherit);outline:var(--_gcd-a-outline,0 solid transparent);transition:var(--_gcd-a-transition,none)}");
|
|
2479
|
+
var global_css_defense_default = {
|
|
2480
|
+
"button": "_6defc79820e382c6__button",
|
|
2481
|
+
"input": "d2cff2e5dea83bd1__input",
|
|
2482
|
+
"textarea": "_547d86373d02e108__textarea",
|
|
2483
|
+
"div": "_8c15fd0ed9f28ba4__div",
|
|
2484
|
+
"p": "_43cec3e1eec1066d__p",
|
|
2485
|
+
"heading": "e97669c6d9a38497__heading",
|
|
2486
|
+
"a": "_2c0831b0499dbd6e__a"
|
|
2487
|
+
};
|
|
2488
|
+
var Button$1 = forwardRef$1(function Button2({ tone = "brand", variant = "solid", size = "default", className, focusableWhenDisabled = true, disabled, loading, loadingAnnouncement = __("Loading"), children, ...props }, ref) {
|
|
2489
|
+
const mergedClassName = clsx(global_css_defense_default.button, resets_default["box-sizing"], focus_default["outset-ring--focus-except-active"], variant !== "unstyled" && style_default$2.button, style_default$2[`is-${tone}`], style_default$2[`is-${variant}`], style_default$2[`is-${size}`], loading && style_default$2["is-loading"], className);
|
|
2490
|
+
useEffect$1(() => {
|
|
2491
|
+
if (loading && loadingAnnouncement) speak(loadingAnnouncement);
|
|
2492
|
+
}, [loading, loadingAnnouncement]);
|
|
2493
|
+
return /* @__PURE__ */ jsx(Button$2, {
|
|
2494
|
+
ref,
|
|
2495
|
+
className: mergedClassName,
|
|
2496
|
+
focusableWhenDisabled,
|
|
2497
|
+
disabled: disabled ?? loading,
|
|
2498
|
+
...props,
|
|
2499
|
+
children
|
|
2500
|
+
});
|
|
2501
|
+
});
|
|
2502
|
+
//#endregion
|
|
2503
|
+
//#region ../../../node_modules/.pnpm/@wordpress+primitives@4.51.0_@types+react@18.3.28_react@18.3.1/node_modules/@wordpress/primitives/build-module/svg/index.mjs
|
|
2504
|
+
var SVG = forwardRef$1(
|
|
2505
|
+
/**
|
|
2506
|
+
* @param {SVGProps} props isPressed indicates whether the SVG should appear as pressed.
|
|
2507
|
+
* Other props will be passed through to svg component.
|
|
2508
|
+
* @param {React.ForwardedRef<SVGSVGElement>} ref The forwarded ref to the SVG element.
|
|
2509
|
+
*
|
|
2510
|
+
* @return {React.JSX.Element} Stop component
|
|
2511
|
+
*/
|
|
2512
|
+
({ className, isPressed, ...props }, ref) => {
|
|
2513
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
2514
|
+
...props,
|
|
2515
|
+
className: clsx(className, { "is-pressed": isPressed }) || void 0,
|
|
2516
|
+
"aria-hidden": true,
|
|
2517
|
+
focusable: false,
|
|
2518
|
+
ref
|
|
2519
|
+
});
|
|
2520
|
+
}
|
|
2521
|
+
);
|
|
2522
|
+
SVG.displayName = "SVG";
|
|
2523
|
+
//#endregion
|
|
2524
|
+
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/icon/icon.mjs
|
|
2525
|
+
var Icon$2 = forwardRef$1(function Icon2({ icon, size = 24, ...restProps }, ref) {
|
|
2526
|
+
return /* @__PURE__ */ jsx(SVG, {
|
|
2527
|
+
ref,
|
|
2528
|
+
...icon.props,
|
|
2529
|
+
...restProps,
|
|
2530
|
+
width: size,
|
|
2531
|
+
height: size
|
|
2069
2532
|
});
|
|
2070
2533
|
});
|
|
2071
2534
|
//#endregion
|
|
2535
|
+
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/button/icon.mjs
|
|
2536
|
+
var STYLE_HASH_ATTRIBUTE$1 = "data-wp-hash";
|
|
2537
|
+
function getRuntime$1() {
|
|
2538
|
+
const globalScope = globalThis;
|
|
2539
|
+
if (globalScope.__wpStyleRuntime) return globalScope.__wpStyleRuntime;
|
|
2540
|
+
globalScope.__wpStyleRuntime = {
|
|
2541
|
+
documents: /* @__PURE__ */ new Map(),
|
|
2542
|
+
styles: /* @__PURE__ */ new Map(),
|
|
2543
|
+
injectedStyles: /* @__PURE__ */ new WeakMap()
|
|
2544
|
+
};
|
|
2545
|
+
if (typeof document !== "undefined") registerDocument$1(document);
|
|
2546
|
+
return globalScope.__wpStyleRuntime;
|
|
2547
|
+
}
|
|
2548
|
+
function documentContainsStyleHash$1(targetDocument, hash) {
|
|
2549
|
+
if (!targetDocument.head) return false;
|
|
2550
|
+
for (const style of targetDocument.head.querySelectorAll(`style[${STYLE_HASH_ATTRIBUTE$1}]`)) if (style.getAttribute(STYLE_HASH_ATTRIBUTE$1) === hash) return true;
|
|
2551
|
+
return false;
|
|
2552
|
+
}
|
|
2553
|
+
function injectStyle$1(targetDocument, hash, css) {
|
|
2554
|
+
if (!targetDocument.head) return;
|
|
2555
|
+
const runtime = getRuntime$1();
|
|
2556
|
+
let injectedStyles = runtime.injectedStyles.get(targetDocument);
|
|
2557
|
+
if (!injectedStyles) {
|
|
2558
|
+
injectedStyles = /* @__PURE__ */ new Set();
|
|
2559
|
+
runtime.injectedStyles.set(targetDocument, injectedStyles);
|
|
2560
|
+
}
|
|
2561
|
+
if (injectedStyles.has(hash)) return;
|
|
2562
|
+
if (documentContainsStyleHash$1(targetDocument, hash)) {
|
|
2563
|
+
injectedStyles.add(hash);
|
|
2564
|
+
return;
|
|
2565
|
+
}
|
|
2566
|
+
const style = targetDocument.createElement("style");
|
|
2567
|
+
style.setAttribute(STYLE_HASH_ATTRIBUTE$1, hash);
|
|
2568
|
+
style.appendChild(targetDocument.createTextNode(css));
|
|
2569
|
+
targetDocument.head.appendChild(style);
|
|
2570
|
+
injectedStyles.add(hash);
|
|
2571
|
+
}
|
|
2572
|
+
function registerDocument$1(targetDocument) {
|
|
2573
|
+
const runtime = getRuntime$1();
|
|
2574
|
+
runtime.documents.set(targetDocument, (runtime.documents.get(targetDocument) ?? 0) + 1);
|
|
2575
|
+
for (const [hash, css] of runtime.styles) injectStyle$1(targetDocument, hash, css);
|
|
2576
|
+
return () => {
|
|
2577
|
+
const count = runtime.documents.get(targetDocument);
|
|
2578
|
+
if (count === void 0) return;
|
|
2579
|
+
if (count <= 1) {
|
|
2580
|
+
runtime.documents.delete(targetDocument);
|
|
2581
|
+
return;
|
|
2582
|
+
}
|
|
2583
|
+
runtime.documents.set(targetDocument, count - 1);
|
|
2584
|
+
};
|
|
2585
|
+
}
|
|
2586
|
+
function registerStyle$1(hash, css) {
|
|
2587
|
+
const runtime = getRuntime$1();
|
|
2588
|
+
runtime.styles.set(hash, css);
|
|
2589
|
+
for (const targetDocument of runtime.documents.keys()) injectStyle$1(targetDocument, hash, css);
|
|
2590
|
+
}
|
|
2591
|
+
if (typeof process === "undefined" || process.env.NODE_ENV !== "test") registerStyle$1("4c317b0736", "@layer wp-ui{@layer utilities, components, compositions, overrides;@layer components{._97b0fc33c028be1a__button,.abbb272e2ce49bd6__is-unstyled{appearance:none;padding:0}._97b0fc33c028be1a__button{--wp-ui-button-font-weight:var(--wpds-typography-font-weight-medium,499);--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-strong,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-strong-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 93%,#000));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-brand-strong,#fff);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-brand-strong-active,#fff);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-brand-strong-disabled,#8d8d8d);--wp-ui-button-padding-block:var(--wpds-dimension-padding-xs,4px);--wp-ui-button-padding-inline:var(--wpds-dimension-padding-md,12px);--wp-ui-button-height:var(--wpds-dimension-size-lg,40px);--wp-ui-button-aspect-ratio:auto;--wp-ui-button-font-size:var(--wpds-typography-font-size-md,13px);--wp-ui-button-min-width:calc(4ch + var(--wp-ui-button-padding-inline)*2);--wp-ui-button-icon-margin:calc((var(--wpds-dimension-size-2xs, 16px) - var(--wpds-dimension-size-sm, 24px))/2);--wp-ui-button-border-color:var(--wp-ui-button-background-color);--wp-ui-button-border-color-active:var(--wp-ui-button-background-color-active);--wp-ui-button-border-color-disabled:var(--wp-ui-button-background-color-disabled);--_gcd-button-font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);--_gcd-button-font-size:var(--wp-ui-button-font-size);--_gcd-button-font-weight:var(--wp-ui-button-font-weight);align-items:center;aspect-ratio:var(--wp-ui-button-aspect-ratio);background-clip:padding-box;background-color:var(--wp-ui-button-background-color);border-color:var(--wp-ui-button-border-color);border-radius:var(--wpds-border-radius-sm,2px);border-style:solid;border-width:1px;color:var(--wp-ui-button-foreground-color);display:inline-flex;font-family:var(--wpds-typography-font-family-body,-apple-system,system-ui,\"Segoe UI\",\"Roboto\",\"Oxygen-Sans\",\"Ubuntu\",\"Cantarell\",\"Helvetica Neue\",sans-serif);font-size:var(--wp-ui-button-font-size);font-weight:var(--wp-ui-button-font-weight);gap:var(--wpds-dimension-gap-sm,8px);justify-content:center;line-height:var(--wpds-typography-line-height-sm,20px);max-width:100%;min-height:var(--wp-ui-button-height);min-width:var(--wp-ui-button-min-width);overflow-wrap:anywhere;padding-block:var(--wp-ui-button-padding-block);padding-inline:var(--wp-ui-button-padding-inline);position:relative;text-align:center;text-decoration:none;&:not([data-disabled]){cursor:var(--wpds-cursor-control,pointer)}@media not (prefers-reduced-motion){transition:color .1s ease-out;*{transition:opacity .1s ease-out}}&[href]{cursor:pointer}[href]{color:inherit;text-decoration:inherit}&:not([data-disabled]):is(:hover,:active,:focus){background-color:var(--wp-ui-button-background-color-active);border-color:var(--wp-ui-button-border-color-active);color:var(--wp-ui-button-foreground-color-active)}&[data-disabled]:not(._914b42f315c0e580__is-loading){background-color:var(--wp-ui-button-background-color-disabled);border-color:var(--wp-ui-button-border-color-disabled);color:var(--wp-ui-button-foreground-color-disabled);@media (forced-colors:active){border-bottom-color:GrayText;border-left-color:GrayText;border-right-color:GrayText;border-top-color:GrayText;color:GrayText}}&:before{aspect-ratio:1;border:var(--wpds-border-width-focus,var(--wp-admin-border-width-focus,2px)) solid;border-block-end-color:transparent;border-block-start-color:var(--wp-ui-button-foreground-color);border-inline-end-color:var(--wp-ui-button-foreground-color);border-inline-start-color:transparent;border-radius:50%;box-sizing:border-box;content:\"\";display:block;height:var(--wp-ui-button-font-size);inset-inline-start:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);@media not (prefers-reduced-motion){transition:opacity .1s ease-out}@media (forced-colors:active){border-block-end-style:none;border-bottom-color:ButtonText;border-inline-start-style:none;border-left-color:ButtonText;border-right-color:ButtonText;border-top-color:ButtonText}}}._908205475f9f2a92__is-small{--wp-ui-button-padding-block:0;--wp-ui-button-padding-inline:var(--wpds-dimension-padding-sm,8px);--wp-ui-button-height:var(--wpds-dimension-size-sm,24px)}._9f6fc6553aeb36fe__icon{margin:var(--wp-ui-button-icon-margin)}.dd460c965226cc77__is-brand{&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 52%,#000));--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-brand-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,#3858e9));--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 85%,#000));--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-brand-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal{--wp-ui-button-background-color:var(--wpds-color-background-interactive-brand-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,#3858e9) 12%,#fff));--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-brand-weak-disabled,#0000)}}.e722a8f96726aa99__is-neutral{&.ad0619a3217c6a5b__is-minimal[aria-pressed=true],&.b50b3358c5fb4d0b__is-solid{--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-strong,#2d2d2d);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-strong-active,#1e1e1e);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-strong-disabled,#e6e6e6);--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-neutral-strong,#f0f0f0);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-neutral-strong-active,#f0f0f0);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-neutral-strong-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline,&.ad0619a3217c6a5b__is-minimal:not([aria-pressed=true]){--wp-ui-button-foreground-color:var(--wpds-color-foreground-interactive-neutral,#1e1e1e);--wp-ui-button-foreground-color-active:var(--wpds-color-foreground-interactive-neutral-active,#1e1e1e);--wp-ui-button-foreground-color-disabled:var(--wpds-color-foreground-interactive-neutral-disabled,#8d8d8d)}&._62d5a778b7b258ee__is-outline{--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-weak-disabled,#0000);--wp-ui-button-border-color:var(--wpds-color-stroke-interactive-neutral,#8d8d8d);--wp-ui-button-border-color-active:var(--wpds-color-stroke-interactive-neutral-active,#6e6e6e);--wp-ui-button-border-color-disabled:var(--wpds-color-stroke-interactive-neutral-disabled,#dbdbdb)}&.ad0619a3217c6a5b__is-minimal:not([aria-pressed=true]){--wp-ui-button-background-color:var(--wpds-color-background-interactive-neutral-weak,#0000);--wp-ui-button-background-color-active:var(--wpds-color-background-interactive-neutral-weak-active,#ededed);--wp-ui-button-background-color-disabled:var(--wpds-color-background-interactive-neutral-weak-disabled,#0000)}}.abbb272e2ce49bd6__is-unstyled{background:none;border:none;min-width:unset}.cf59cf1b69629838__is-compact{--wp-ui-button-height:var(--wpds-dimension-size-md,32px)}._914b42f315c0e580__is-loading:not(.abbb272e2ce49bd6__is-unstyled){color:transparent;&:not([data-disabled]):is(:hover,:active,:focus){color:transparent}@media (forced-colors:active){color:ButtonFace}*{opacity:0}&:before{opacity:1;transition-delay:.05s;@media not (prefers-reduced-motion){animation:_5a1d53da6f830c8d__loading-animation 1s linear infinite}}}}@keyframes _5a1d53da6f830c8d__loading-animation{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}}");
|
|
2592
|
+
var style_default$1 = {
|
|
2593
|
+
"button": "_97b0fc33c028be1a__button",
|
|
2594
|
+
"is-unstyled": "abbb272e2ce49bd6__is-unstyled",
|
|
2595
|
+
"is-loading": "_914b42f315c0e580__is-loading",
|
|
2596
|
+
"is-small": "_908205475f9f2a92__is-small",
|
|
2597
|
+
"icon": "_9f6fc6553aeb36fe__icon",
|
|
2598
|
+
"is-brand": "dd460c965226cc77__is-brand",
|
|
2599
|
+
"is-outline": "_62d5a778b7b258ee__is-outline",
|
|
2600
|
+
"is-minimal": "ad0619a3217c6a5b__is-minimal",
|
|
2601
|
+
"is-neutral": "e722a8f96726aa99__is-neutral",
|
|
2602
|
+
"is-solid": "b50b3358c5fb4d0b__is-solid",
|
|
2603
|
+
"is-compact": "cf59cf1b69629838__is-compact",
|
|
2604
|
+
"loading-animation": "_5a1d53da6f830c8d__loading-animation"
|
|
2605
|
+
};
|
|
2606
|
+
var ButtonIcon = forwardRef$1(function ButtonIcon2({ className, icon, ...props }, ref) {
|
|
2607
|
+
return /* @__PURE__ */ jsx(Icon$2, {
|
|
2608
|
+
ref,
|
|
2609
|
+
icon,
|
|
2610
|
+
className: clsx(style_default$1.icon, className),
|
|
2611
|
+
size: 24,
|
|
2612
|
+
...props
|
|
2613
|
+
});
|
|
2614
|
+
});
|
|
2615
|
+
//#endregion
|
|
2616
|
+
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/button/index.mjs
|
|
2617
|
+
ButtonIcon.displayName = "Button.Icon";
|
|
2618
|
+
var Button = Object.assign(Button$1, {
|
|
2619
|
+
/**
|
|
2620
|
+
* An icon component specifically designed to work well when rendered inside
|
|
2621
|
+
* a `Button` component.
|
|
2622
|
+
*/
|
|
2623
|
+
Icon: ButtonIcon });
|
|
2624
|
+
//#endregion
|
|
2072
2625
|
//#region ../../../node_modules/.pnpm/@wordpress+ui@0.17.0_@types+react@18.3.28_date-fns@4.1.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@wordpress/ui/build-module/stack/stack.mjs
|
|
2073
2626
|
var STYLE_HASH_ATTRIBUTE = "data-wp-hash";
|
|
2074
2627
|
function getRuntime() {
|
|
@@ -2233,8 +2786,13 @@ const BaseLegend = forwardRef(({ items, className, orientation = "horizontal", a
|
|
|
2233
2786
|
});
|
|
2234
2787
|
const domain = legendScale.domain();
|
|
2235
2788
|
const getShapeStyle = useCallback(({ index }) => items[index]?.shapeStyle, [items]);
|
|
2236
|
-
const handleLegendClick = useCallback((
|
|
2237
|
-
if (interactive && chartId && context)
|
|
2789
|
+
const handleLegendClick = useCallback((seriesLabels) => {
|
|
2790
|
+
if (interactive && chartId && context) {
|
|
2791
|
+
const representativeVisible = context.isSeriesVisible(chartId, seriesLabels[0]);
|
|
2792
|
+
seriesLabels.forEach((label) => {
|
|
2793
|
+
if (context.isSeriesVisible(chartId, label) === representativeVisible) context.toggleSeriesVisibility(chartId, label);
|
|
2794
|
+
});
|
|
2795
|
+
}
|
|
2238
2796
|
}, [
|
|
2239
2797
|
interactive,
|
|
2240
2798
|
chartId,
|
|
@@ -2248,16 +2806,16 @@ const BaseLegend = forwardRef(({ items, className, orientation = "horizontal", a
|
|
|
2248
2806
|
chartId,
|
|
2249
2807
|
context
|
|
2250
2808
|
]);
|
|
2251
|
-
const createClickHandler = useCallback((
|
|
2809
|
+
const createClickHandler = useCallback((seriesLabels) => {
|
|
2252
2810
|
if (!interactive) return;
|
|
2253
|
-
return () => handleLegendClick(
|
|
2811
|
+
return () => handleLegendClick(seriesLabels);
|
|
2254
2812
|
}, [interactive, handleLegendClick]);
|
|
2255
|
-
const createKeyDownHandler = useCallback((
|
|
2813
|
+
const createKeyDownHandler = useCallback((seriesLabels) => {
|
|
2256
2814
|
if (!interactive) return;
|
|
2257
2815
|
return (event) => {
|
|
2258
2816
|
if (event.key === "Enter" || event.key === " ") {
|
|
2259
2817
|
event.preventDefault();
|
|
2260
|
-
handleLegendClick(
|
|
2818
|
+
handleLegendClick(seriesLabels);
|
|
2261
2819
|
}
|
|
2262
2820
|
};
|
|
2263
2821
|
}, [interactive, handleLegendClick]);
|
|
@@ -2277,10 +2835,11 @@ const BaseLegend = forwardRef(({ items, className, orientation = "horizontal", a
|
|
|
2277
2835
|
className: clsx(base_legend_module_default.legend, className),
|
|
2278
2836
|
style: theme.legend?.containerStyles,
|
|
2279
2837
|
children: labels.map((label, i) => {
|
|
2280
|
-
const visible = isSeriesVisible(label.text);
|
|
2281
|
-
const handleClick = createClickHandler(label.text);
|
|
2282
|
-
const handleKeyDown = createKeyDownHandler(label.text);
|
|
2283
2838
|
const matchedItem = items[i];
|
|
2839
|
+
const seriesLabels = matchedItem?.seriesLabels?.length ? matchedItem.seriesLabels : [label.text];
|
|
2840
|
+
const visible = isSeriesVisible(seriesLabels[0]);
|
|
2841
|
+
const handleClick = createClickHandler(seriesLabels);
|
|
2842
|
+
const handleKeyDown = createKeyDownHandler(seriesLabels);
|
|
2284
2843
|
return /* @__PURE__ */ jsxs(LegendItem, {
|
|
2285
2844
|
className: clsx("visx-legend-item", base_legend_module_default["legend-item"], interactive && base_legend_module_default["legend-item--interactive"], !visible && base_legend_module_default["legend-item--inactive"], itemClassName),
|
|
2286
2845
|
margin: itemMargin,
|
|
@@ -2408,31 +2967,88 @@ function applyGlyphToLegendItem(baseItem, withGlyph, glyph, renderGlyph, glyphSi
|
|
|
2408
2967
|
return baseItem;
|
|
2409
2968
|
}
|
|
2410
2969
|
/**
|
|
2411
|
-
*
|
|
2970
|
+
* Buckets series by their `group`, preserving first-appearance order. Series with no group — or a
|
|
2971
|
+
* group value unique to them — end up in a bucket of their own. Whether a multi-series bucket then
|
|
2972
|
+
* collapses to a single legend item is decided by the caller: with `collapseGroups` on, every
|
|
2973
|
+
* multi-member bucket collapses, and the comparison pattern only decides which member represents it.
|
|
2974
|
+
* @param seriesData - The series data to group
|
|
2975
|
+
* @return Ordered groups, each holding its member series with their original indices
|
|
2976
|
+
*/
|
|
2977
|
+
function groupSeriesForLegend(seriesData) {
|
|
2978
|
+
const groups = [];
|
|
2979
|
+
const groupIndexByKey = /* @__PURE__ */ new Map();
|
|
2980
|
+
seriesData.forEach((series, index) => {
|
|
2981
|
+
const member = {
|
|
2982
|
+
series,
|
|
2983
|
+
index
|
|
2984
|
+
};
|
|
2985
|
+
const key = series.group;
|
|
2986
|
+
if (key === void 0) {
|
|
2987
|
+
groups.push([member]);
|
|
2988
|
+
return;
|
|
2989
|
+
}
|
|
2990
|
+
const existing = groupIndexByKey.get(key);
|
|
2991
|
+
if (existing === void 0) {
|
|
2992
|
+
groupIndexByKey.set(key, groups.length);
|
|
2993
|
+
groups.push([member]);
|
|
2994
|
+
} else groups[existing].push(member);
|
|
2995
|
+
});
|
|
2996
|
+
return groups;
|
|
2997
|
+
}
|
|
2998
|
+
/**
|
|
2999
|
+
* Builds a single legend item from a representative series, tagging it with the series it controls
|
|
3000
|
+
* @param member - The series (with its original index) that provides the label/colour
|
|
3001
|
+
* @param seriesLabels - Every series label this item toggles (grouped) or just its own
|
|
3002
|
+
* @param getElementStyles - Function to get element styles
|
|
3003
|
+
* @param showValues - Whether to show values in legend
|
|
3004
|
+
* @param withGlyph - Whether to include glyph rendering
|
|
3005
|
+
* @param glyphSize - Size of the glyph
|
|
3006
|
+
* @param renderGlyph - Component to render the glyph
|
|
3007
|
+
* @param legendShape - The shape type for legend items (string literal or React component)
|
|
3008
|
+
* @return The processed legend item
|
|
3009
|
+
*/
|
|
3010
|
+
function buildSeriesLegendItem(member, seriesLabels, getElementStyles, showValues, withGlyph, glyphSize, renderGlyph, legendShape) {
|
|
3011
|
+
const { color, glyph, shapeStyles } = getElementStyles({
|
|
3012
|
+
data: member.series,
|
|
3013
|
+
index: member.index,
|
|
3014
|
+
legendShape
|
|
3015
|
+
});
|
|
3016
|
+
return applyGlyphToLegendItem({
|
|
3017
|
+
label: member.series.label,
|
|
3018
|
+
value: showValues ? member.series.data?.length?.toString() || "0" : "",
|
|
3019
|
+
color,
|
|
3020
|
+
shapeStyle: shapeStyles,
|
|
3021
|
+
seriesLabels
|
|
3022
|
+
}, withGlyph, glyph, renderGlyph, glyphSize);
|
|
3023
|
+
}
|
|
3024
|
+
/**
|
|
3025
|
+
* Processes SeriesData into legend items. Every series keeps its own legend entry unless
|
|
3026
|
+
* `collapseGroups` is set, in which case series sharing a `group` collapse to one item labelled by
|
|
3027
|
+
* the group's primary (its first non-comparison member).
|
|
2412
3028
|
* @param seriesData - The series data to process
|
|
2413
3029
|
* @param getElementStyles - Function to get element styles
|
|
2414
3030
|
* @param showValues - Whether to show values in legend
|
|
2415
3031
|
* @param withGlyph - Whether to include glyph rendering
|
|
2416
3032
|
* @param glyphSize - Size of the glyph
|
|
3033
|
+
* @param collapseGroups - Whether series sharing a group collapse to a single item
|
|
2417
3034
|
* @param renderGlyph - Component to render the glyph
|
|
2418
3035
|
* @param legendShape - The shape type for legend items (string literal or React component)
|
|
2419
3036
|
* @return Array of processed legend items
|
|
2420
3037
|
*/
|
|
2421
|
-
function processSeriesData(seriesData, getElementStyles, showValues, withGlyph, glyphSize, renderGlyph, legendShape) {
|
|
2422
|
-
const
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
|
|
2428
|
-
|
|
2429
|
-
|
|
2430
|
-
|
|
2431
|
-
|
|
2432
|
-
|
|
2433
|
-
|
|
2434
|
-
};
|
|
2435
|
-
return seriesData.map(mapper);
|
|
3038
|
+
function processSeriesData(seriesData, getElementStyles, showValues, withGlyph, glyphSize, collapseGroups, renderGlyph, legendShape) {
|
|
3039
|
+
const buildItem = (member, seriesLabels) => buildSeriesLegendItem(member, seriesLabels, getElementStyles, showValues, withGlyph, glyphSize, renderGlyph, legendShape);
|
|
3040
|
+
if (!collapseGroups) return seriesData.map((series, index) => buildItem({
|
|
3041
|
+
series,
|
|
3042
|
+
index
|
|
3043
|
+
}, [series.label]));
|
|
3044
|
+
return groupSeriesForLegend(seriesData).flatMap((members) => {
|
|
3045
|
+
if (members.length > 1) {
|
|
3046
|
+
const primary = members.find(({ series }) => series.options?.type !== "comparison") ?? members[0];
|
|
3047
|
+
const seriesLabels = [primary.series.label, ...members.filter((member) => member !== primary).map(({ series }) => series.label)];
|
|
3048
|
+
return [buildItem(primary, seriesLabels)];
|
|
3049
|
+
}
|
|
3050
|
+
return members.map((member) => buildItem(member, [member.series.label]));
|
|
3051
|
+
});
|
|
2436
3052
|
}
|
|
2437
3053
|
/**
|
|
2438
3054
|
* Processes point data into legend items
|
|
@@ -2470,11 +3086,11 @@ function processPointData(pointData, getElementStyles, showValues, legendValueDi
|
|
|
2470
3086
|
* @return Array of legend items ready for display
|
|
2471
3087
|
*/
|
|
2472
3088
|
function useChartLegendItems(data, options = {}, legendShape) {
|
|
2473
|
-
const { showValues = false, legendValueDisplay = "percentage", withGlyph = false, glyphSize = 8, renderGlyph } = options;
|
|
3089
|
+
const { showValues = false, legendValueDisplay = "percentage", withGlyph = false, glyphSize = 8, collapseGroups = false, renderGlyph } = options;
|
|
2474
3090
|
const { getElementStyles } = useGlobalChartsContext();
|
|
2475
3091
|
return useMemo(() => {
|
|
2476
3092
|
if (!data || !Array.isArray(data) || data.length === 0) return [];
|
|
2477
|
-
if ("data" in data[0]) return processSeriesData(data, getElementStyles, showValues, withGlyph, glyphSize, renderGlyph, legendShape);
|
|
3093
|
+
if ("data" in data[0]) return processSeriesData(data, getElementStyles, showValues, withGlyph, glyphSize, collapseGroups, renderGlyph, legendShape);
|
|
2478
3094
|
return processPointData(data, getElementStyles, showValues, legendValueDisplay, withGlyph, glyphSize, renderGlyph, legendShape);
|
|
2479
3095
|
}, [
|
|
2480
3096
|
data,
|
|
@@ -2483,6 +3099,7 @@ function useChartLegendItems(data, options = {}, legendShape) {
|
|
|
2483
3099
|
legendValueDisplay,
|
|
2484
3100
|
withGlyph,
|
|
2485
3101
|
glyphSize,
|
|
3102
|
+
collapseGroups,
|
|
2486
3103
|
renderGlyph,
|
|
2487
3104
|
legendShape
|
|
2488
3105
|
]);
|
|
@@ -2989,14 +3606,13 @@ function withResponsive(WrappedComponent) {
|
|
|
2989
3606
|
};
|
|
2990
3607
|
}
|
|
2991
3608
|
//#endregion
|
|
2992
|
-
//#region src/charts/private/x-zoom.module.scss
|
|
3609
|
+
//#region src/charts/private/x-zoom/x-zoom.module.scss
|
|
2993
3610
|
var x_zoom_module_default = {
|
|
2994
|
-
"x-zoom__reset": "a8ccharts-
|
|
2995
|
-
"x-
|
|
2996
|
-
"x-zoom__selection": "a8ccharts-y6bXNq-x-zoom__selection"
|
|
3611
|
+
"x-zoom__reset": "a8ccharts-ur9dWW-x-zoom__reset",
|
|
3612
|
+
"x-zoom__selection": "a8ccharts-ur9dWW-x-zoom__selection"
|
|
2997
3613
|
};
|
|
2998
3614
|
//#endregion
|
|
2999
|
-
//#region src/charts/private/x-zoom.tsx
|
|
3615
|
+
//#region src/charts/private/x-zoom/x-zoom.tsx
|
|
3000
3616
|
const MIN_DRAG_PIXELS = 6;
|
|
3001
3617
|
/**
|
|
3002
3618
|
* Drag-to-zoom state + pointer handlers for an XY chart. Designed to be
|
|
@@ -3125,24 +3741,35 @@ function ZoomClip({ active, chartId, children }) {
|
|
|
3125
3741
|
})] });
|
|
3126
3742
|
}
|
|
3127
3743
|
/**
|
|
3128
|
-
* Visible icon-only reset
|
|
3129
|
-
*
|
|
3130
|
-
* container so the button anchors correctly.
|
|
3744
|
+
* Visible icon-only reset control rendered as an HTML overlay on top of the
|
|
3745
|
+
* chart container, using the WPDS `Button`. The host should wrap its SVG in a
|
|
3746
|
+
* `position: relative` container so the button anchors correctly.
|
|
3747
|
+
*
|
|
3748
|
+
* `IconButton` would be the natural fit, but it renders a Base UI tooltip whose
|
|
3749
|
+
* CommonJS `use-sync-external-store` dependency makes Rolldown emit a dynamic
|
|
3750
|
+
* `require()` into `dist`, which throws on evaluation in WordPress Script
|
|
3751
|
+
* Module consumers. `Button` gives the same treatment without that dependency;
|
|
3752
|
+
* the tooltip is replaced by `aria-label` + `title`.
|
|
3131
3753
|
*
|
|
3132
3754
|
* @param props - Props.
|
|
3133
3755
|
* @param props.onClick - Click handler. Typically the `reset` from `useXZoom`.
|
|
3134
3756
|
* @return JSX element.
|
|
3135
3757
|
*/
|
|
3136
3758
|
function ZoomResetButton({ onClick }) {
|
|
3759
|
+
const stopActivationKeys = useCallback((event) => {
|
|
3760
|
+
if (event.key === "Enter" || event.key === " ") event.stopPropagation();
|
|
3761
|
+
}, []);
|
|
3137
3762
|
const label = __("Reset zoom", "jetpack-charts");
|
|
3138
|
-
return /* @__PURE__ */ jsx(
|
|
3139
|
-
type: "button",
|
|
3763
|
+
return /* @__PURE__ */ jsx(Button, {
|
|
3140
3764
|
className: x_zoom_module_default["x-zoom__reset"],
|
|
3141
|
-
|
|
3765
|
+
onKeyDown: stopActivationKeys,
|
|
3142
3766
|
"aria-label": label,
|
|
3143
3767
|
title: label,
|
|
3144
|
-
|
|
3145
|
-
|
|
3768
|
+
variant: "outline",
|
|
3769
|
+
tone: "neutral",
|
|
3770
|
+
size: "small",
|
|
3771
|
+
onClick,
|
|
3772
|
+
children: /* @__PURE__ */ jsx(Button.Icon, { icon: /* @__PURE__ */ jsx("svg", {
|
|
3146
3773
|
viewBox: "0 0 24 24",
|
|
3147
3774
|
fill: "none",
|
|
3148
3775
|
stroke: "currentColor",
|
|
@@ -3151,26 +3778,29 @@ function ZoomResetButton({ onClick }) {
|
|
|
3151
3778
|
strokeLinejoin: "round",
|
|
3152
3779
|
"aria-hidden": "true",
|
|
3153
3780
|
focusable: "false",
|
|
3154
|
-
children:
|
|
3155
|
-
|
|
3156
|
-
|
|
3157
|
-
|
|
3158
|
-
|
|
3159
|
-
|
|
3160
|
-
|
|
3161
|
-
|
|
3162
|
-
|
|
3163
|
-
|
|
3164
|
-
|
|
3165
|
-
|
|
3166
|
-
|
|
3167
|
-
|
|
3168
|
-
|
|
3169
|
-
|
|
3170
|
-
|
|
3171
|
-
|
|
3172
|
-
|
|
3173
|
-
|
|
3781
|
+
children: /* @__PURE__ */ jsxs("g", {
|
|
3782
|
+
transform: "translate(2.4 2.4) scale(0.8)",
|
|
3783
|
+
children: [
|
|
3784
|
+
/* @__PURE__ */ jsx("circle", {
|
|
3785
|
+
cx: "10",
|
|
3786
|
+
cy: "10",
|
|
3787
|
+
r: "6"
|
|
3788
|
+
}),
|
|
3789
|
+
/* @__PURE__ */ jsx("line", {
|
|
3790
|
+
x1: "15",
|
|
3791
|
+
y1: "15",
|
|
3792
|
+
x2: "20",
|
|
3793
|
+
y2: "20"
|
|
3794
|
+
}),
|
|
3795
|
+
/* @__PURE__ */ jsx("line", {
|
|
3796
|
+
x1: "7",
|
|
3797
|
+
y1: "10",
|
|
3798
|
+
x2: "13",
|
|
3799
|
+
y2: "10"
|
|
3800
|
+
})
|
|
3801
|
+
]
|
|
3802
|
+
})
|
|
3803
|
+
}) })
|
|
3174
3804
|
});
|
|
3175
3805
|
}
|
|
3176
3806
|
//#endregion
|
|
@@ -3659,8 +4289,9 @@ const LineChartScalesRef = ({ chartRef, width, height, margin }) => {
|
|
|
3659
4289
|
]);
|
|
3660
4290
|
return null;
|
|
3661
4291
|
};
|
|
3662
|
-
const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, height, className, margin, withTooltips = true, withTooltipCrosshairs, showLegend = false, legend = {}, renderGlyph = defaultRenderGlyph, glyphStyle = {}, withLegendGlyph = false, withGradientFill = false, smoothing = true, curveType, renderTooltip = renderDefaultTooltip, withStartGlyphs = false, withEndGlyphs = false, animation, options = {}, onPointerDown = void 0, onPointerUp = void 0, onPointerMove = void 0, onPointerOut = void 0, zoomable = false, children, gridVisibility, gap = "md" }, ref) => {
|
|
4292
|
+
const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, height, className, margin, withTooltips = true, withTooltipCrosshairs, showLegend = false, legend = {}, renderGlyph = defaultRenderGlyph, glyphStyle = {}, withLegendGlyph = false, withGradientFill = false, smoothing = true, curveType, renderTooltip = renderDefaultTooltip, withStartGlyphs = false, withEndGlyphs = false, animation, options = {}, onPointerDown = void 0, onPointerUp = void 0, onPointerMove = void 0, onPointerOut = void 0, zoomable = false, rescaleYOnVisibilityChange = true, children, gridVisibility, gap = "md" }, ref) => {
|
|
3663
4293
|
const legendInteractive = legend.interactive ?? false;
|
|
4294
|
+
const legendCollapseGroups = legend.collapseGroups ?? false;
|
|
3664
4295
|
const legendShape = legend.shape ?? "line";
|
|
3665
4296
|
const legendPosition = legend.position ?? "bottom";
|
|
3666
4297
|
const providerTheme = useGlobalChartsTheme();
|
|
@@ -3715,6 +4346,23 @@ const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
3715
4346
|
const allSeriesHidden = useMemo(() => {
|
|
3716
4347
|
return seriesWithVisibility.every(({ isVisible }) => !isVisible);
|
|
3717
4348
|
}, [seriesWithVisibility]);
|
|
4349
|
+
const stableYDomain = useMemo(() => {
|
|
4350
|
+
if (!legendInteractive || rescaleYOnVisibilityChange) return;
|
|
4351
|
+
let min = Infinity;
|
|
4352
|
+
let max = -Infinity;
|
|
4353
|
+
for (const series of dataSorted) for (const point of series.data ?? []) {
|
|
4354
|
+
const value = point?.value;
|
|
4355
|
+
if (typeof value === "number" && Number.isFinite(value)) {
|
|
4356
|
+
min = Math.min(min, value);
|
|
4357
|
+
max = Math.max(max, value);
|
|
4358
|
+
}
|
|
4359
|
+
}
|
|
4360
|
+
return min < max ? [min, max] : void 0;
|
|
4361
|
+
}, [
|
|
4362
|
+
legendInteractive,
|
|
4363
|
+
rescaleYOnVisibilityChange,
|
|
4364
|
+
dataSorted
|
|
4365
|
+
]);
|
|
3718
4366
|
const { tooltipRef, onChartFocus, onChartBlur, onChartKeyDown } = useKeyboardNavigation({
|
|
3719
4367
|
selectedIndex,
|
|
3720
4368
|
setSelectedIndex,
|
|
@@ -3751,6 +4399,7 @@ const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
3751
4399
|
type: "linear",
|
|
3752
4400
|
nice: true,
|
|
3753
4401
|
zero: false,
|
|
4402
|
+
...stableYDomain ? { domain: stableYDomain } : {},
|
|
3754
4403
|
...options?.yScale
|
|
3755
4404
|
}
|
|
3756
4405
|
};
|
|
@@ -3758,7 +4407,8 @@ const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
3758
4407
|
options,
|
|
3759
4408
|
dataSorted,
|
|
3760
4409
|
width,
|
|
3761
|
-
zoom.domain
|
|
4410
|
+
zoom.domain,
|
|
4411
|
+
stableYDomain
|
|
3762
4412
|
]);
|
|
3763
4413
|
const tooltipRenderGlyph = useMemo(() => {
|
|
3764
4414
|
return (props) => {
|
|
@@ -3787,10 +4437,12 @@ const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
3787
4437
|
legendItems: useChartLegendItems(dataSorted, useMemo(() => ({
|
|
3788
4438
|
withGlyph: withLegendGlyph,
|
|
3789
4439
|
glyphSize: Math.max(0, toNumber(glyphStyle?.radius) ?? 4),
|
|
4440
|
+
collapseGroups: legendCollapseGroups,
|
|
3790
4441
|
renderGlyph
|
|
3791
4442
|
}), [
|
|
3792
4443
|
withLegendGlyph,
|
|
3793
4444
|
glyphStyle?.radius,
|
|
4445
|
+
legendCollapseGroups,
|
|
3794
4446
|
renderGlyph
|
|
3795
4447
|
]), legendShape),
|
|
3796
4448
|
chartType: "line",
|
|
@@ -3880,12 +4532,12 @@ const LineChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
3880
4532
|
onPointerOut,
|
|
3881
4533
|
pointerEventsDataKey: "nearest",
|
|
3882
4534
|
children: [
|
|
3883
|
-
gridVisibility !== "none" && /* @__PURE__ */ jsx(Grid, {
|
|
4535
|
+
!allSeriesHidden && gridVisibility !== "none" && /* @__PURE__ */ jsx(Grid, {
|
|
3884
4536
|
columns: false,
|
|
3885
4537
|
numTicks: 4
|
|
3886
4538
|
}),
|
|
3887
|
-
chartOptions.axis.x.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }),
|
|
3888
|
-
chartOptions.axis.y.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y }),
|
|
4539
|
+
!allSeriesHidden && chartOptions.axis.x.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }),
|
|
4540
|
+
!allSeriesHidden && chartOptions.axis.y.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y }),
|
|
3889
4541
|
allSeriesHidden ? /* @__PURE__ */ jsx(SvgEmptyState, {
|
|
3890
4542
|
x: width / 2,
|
|
3891
4543
|
y: chartHeight / 2,
|
|
@@ -4093,10 +4745,11 @@ const HoverGlyphs = ({ visibleSeries, stacked, stackOffset, getElementStyles, st
|
|
|
4093
4745
|
};
|
|
4094
4746
|
//#endregion
|
|
4095
4747
|
//#region src/charts/area-chart/area-chart.tsx
|
|
4096
|
-
const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, height, className, margin, withTooltips = true, withTooltipCrosshairs, showLegend = false, legend = {}, stacked = true, stackOffset = "none", smoothing = true, curveType, fillOpacity, withStroke, renderTooltip = renderDefaultTooltip, animation, options = {}, onPointerDown, onPointerUp, onPointerMove, onPointerOut, zoomable = false, rescaleYOnLegendToggle
|
|
4748
|
+
const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, height, className, margin, withTooltips = true, withTooltipCrosshairs, showLegend = false, legend = {}, stacked = true, stackOffset = "none", smoothing = true, curveType, fillOpacity, withStroke, renderTooltip = renderDefaultTooltip, animation, options = {}, onPointerDown, onPointerUp, onPointerMove, onPointerOut, zoomable = false, rescaleYOnVisibilityChange, rescaleYOnLegendToggle, children, gridVisibility, gap = "md" }, ref) => {
|
|
4097
4749
|
const legendInteractive = legend.interactive ?? false;
|
|
4098
4750
|
const legendShape = legend.shape ?? "rect";
|
|
4099
4751
|
const legendPosition = legend.position ?? "bottom";
|
|
4752
|
+
const rescaleYOnVisibility = rescaleYOnVisibilityChange ?? rescaleYOnLegendToggle ?? true;
|
|
4100
4753
|
const providerTheme = useGlobalChartsTheme();
|
|
4101
4754
|
const theme = useXYChartTheme(data);
|
|
4102
4755
|
const chartId = useChartId(providedChartId);
|
|
@@ -4155,7 +4808,7 @@ const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
4155
4808
|
totalPoints: dataSorted[0]?.data.length || 0
|
|
4156
4809
|
});
|
|
4157
4810
|
const fixedYDomain = useMemo(() => {
|
|
4158
|
-
if (
|
|
4811
|
+
if (rescaleYOnVisibility || !legendInteractive || !dataSorted.length || !dataSorted[0].data.length || stacked && stackOffset !== "none") return;
|
|
4159
4812
|
if (stacked) {
|
|
4160
4813
|
const numPoints = Math.max(...dataSorted.map((s) => s.data.length));
|
|
4161
4814
|
let posMax = 0;
|
|
@@ -4190,7 +4843,7 @@ const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
4190
4843
|
stacked,
|
|
4191
4844
|
stackOffset,
|
|
4192
4845
|
legendInteractive,
|
|
4193
|
-
|
|
4846
|
+
rescaleYOnVisibility
|
|
4194
4847
|
]);
|
|
4195
4848
|
const chartOptions = useMemo(() => {
|
|
4196
4849
|
const formatter = options?.axis?.x?.tickFormat || getFormatter(dataSorted);
|
|
@@ -4239,8 +4892,9 @@ const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
4239
4892
|
chartId,
|
|
4240
4893
|
legendItems: useChartLegendItems(dataSorted, useMemo(() => ({
|
|
4241
4894
|
withGlyph: false,
|
|
4242
|
-
glyphSize: 0
|
|
4243
|
-
|
|
4895
|
+
glyphSize: 0,
|
|
4896
|
+
collapseGroups: legend.collapseGroups ?? false
|
|
4897
|
+
}), [legend.collapseGroups]), legendShape),
|
|
4244
4898
|
chartType: "area",
|
|
4245
4899
|
isDataValid,
|
|
4246
4900
|
metadata: useMemo(() => ({
|
|
@@ -4377,12 +5031,12 @@ const AreaChartInternal = forwardRef(({ data, chartId: providedChartId, width, h
|
|
|
4377
5031
|
onPointerOut,
|
|
4378
5032
|
pointerEventsDataKey: "nearest",
|
|
4379
5033
|
children: [
|
|
4380
|
-
gridVisibility !== "none" && /* @__PURE__ */ jsx(Grid, {
|
|
5034
|
+
!allSeriesHidden && gridVisibility !== "none" && /* @__PURE__ */ jsx(Grid, {
|
|
4381
5035
|
columns: false,
|
|
4382
5036
|
numTicks: 4
|
|
4383
5037
|
}),
|
|
4384
|
-
chartOptions.axis.x.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }),
|
|
4385
|
-
chartOptions.axis.y.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y }),
|
|
5038
|
+
!allSeriesHidden && chartOptions.axis.x.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }),
|
|
5039
|
+
!allSeriesHidden && chartOptions.axis.y.display && /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y }),
|
|
4386
5040
|
allSeriesHidden ? /* @__PURE__ */ jsx(SvgEmptyState, {
|
|
4387
5041
|
x: width / 2,
|
|
4388
5042
|
y: chartHeight / 2,
|
|
@@ -4851,6 +5505,7 @@ const renderTooltipRow = (label, value) => /* @__PURE__ */ jsx("div", {
|
|
|
4851
5505
|
});
|
|
4852
5506
|
const BarChartInternal = ({ data, chartId: providedChartId, width, height, className, margin, withTooltips = false, showLegend = false, legend = {}, gridVisibility: gridVisibilityProp, renderTooltip, options = {}, orientation = "vertical", withPatterns = false, showZeroValues = false, animation, children, gap = "md" }) => {
|
|
4853
5507
|
const legendInteractive = legend.interactive ?? false;
|
|
5508
|
+
const legendCollapseGroups = legend.collapseGroups ?? false;
|
|
4854
5509
|
const horizontal = orientation === "horizontal";
|
|
4855
5510
|
const chartId = useChartId(providedChartId);
|
|
4856
5511
|
const theme = useXYChartTheme(data);
|
|
@@ -4859,7 +5514,7 @@ const BarChartInternal = ({ data, chartId: providedChartId, width, height, class
|
|
|
4859
5514
|
enabled: showZeroValues,
|
|
4860
5515
|
valueAxisLength: horizontal ? width : height
|
|
4861
5516
|
});
|
|
4862
|
-
const legendItems = useChartLegendItems(dataSorted);
|
|
5517
|
+
const legendItems = useChartLegendItems(dataSorted, useMemo(() => ({ collapseGroups: legendCollapseGroups }), [legendCollapseGroups]));
|
|
4863
5518
|
const chartOptions = useBarChartOptions(dataWithVisibleZeros, horizontal, options);
|
|
4864
5519
|
const defaultMargin = useChartMargin(height, chartOptions, dataSorted, theme, horizontal);
|
|
4865
5520
|
const chartRef = useRef(null);
|
|
@@ -5151,7 +5806,7 @@ const BarChartInternal = ({ data, chartId: providedChartId, width, height, class
|
|
|
5151
5806
|
horizontal,
|
|
5152
5807
|
pointerEventsDataKey: "nearest",
|
|
5153
5808
|
children: [
|
|
5154
|
-
/* @__PURE__ */ jsx(Grid, {
|
|
5809
|
+
!allSeriesHidden && /* @__PURE__ */ jsx(Grid, {
|
|
5155
5810
|
columns: gridVisibility.includes("y"),
|
|
5156
5811
|
rows: gridVisibility.includes("x"),
|
|
5157
5812
|
numTicks: 4
|
|
@@ -5191,8 +5846,7 @@ const BarChartInternal = ({ data, chartId: providedChartId, width, height, class
|
|
|
5191
5846
|
colorAccessor: getBarBackground(index)
|
|
5192
5847
|
}, seriesData?.label))
|
|
5193
5848
|
}),
|
|
5194
|
-
/* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }),
|
|
5195
|
-
/* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y }),
|
|
5849
|
+
!allSeriesHidden && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.x }), /* @__PURE__ */ jsx(Axis, { ...chartOptions.axis.y })] }),
|
|
5196
5850
|
withTooltips && /* @__PURE__ */ jsx(AccessibleTooltip, {
|
|
5197
5851
|
detectBounds: true,
|
|
5198
5852
|
snapTooltipToDatumX: true,
|