@homebound/beam 2.126.0 → 2.127.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.
|
@@ -11,9 +11,12 @@ const utils_1 = require("../utils");
|
|
|
11
11
|
const useTestIds_1 = require("../utils/useTestIds");
|
|
12
12
|
function Button(props) {
|
|
13
13
|
const { onClick: onPress, disabled, endAdornment, menuTriggerProps, tooltip, openInNew, download, ...otherProps } = props;
|
|
14
|
+
const showExternalLinkIcon = (typeof onPress === "string" && (0, utils_1.isAbsoluteUrl)(onPress)) || openInNew;
|
|
14
15
|
const isDisabled = !!disabled;
|
|
15
16
|
const ariaProps = { onPress, isDisabled, ...otherProps, ...menuTriggerProps };
|
|
16
|
-
const { label,
|
|
17
|
+
const { label,
|
|
18
|
+
// Default the icon based on other properties.
|
|
19
|
+
icon = download ? "download" : showExternalLinkIcon ? "linkExternal" : undefined, variant = "primary", size = "sm", buttonRef, } = ariaProps;
|
|
17
20
|
const ref = buttonRef || (0, react_1.useRef)(null);
|
|
18
21
|
const tid = (0, useTestIds_1.useTestIds)(props, label);
|
|
19
22
|
const { buttonProps, isPressed } = (0, react_aria_1.useButton)({
|
|
@@ -25,7 +28,7 @@ function Button(props) {
|
|
|
25
28
|
const { hoverProps, isHovered } = (0, react_aria_1.useHover)(ariaProps);
|
|
26
29
|
const { baseStyles, hoverStyles, disabledStyles, pressedStyles } = (0, react_1.useMemo)(() => getButtonStyles(variant, size), [variant, size]);
|
|
27
30
|
const focusRingStyles = (0, react_1.useMemo)(() => (variant === "danger" ? Css_1.Css.bshDanger.$ : Css_1.Css.bshFocus.$), [variant]);
|
|
28
|
-
const buttonContent = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon && (0, jsx_runtime_1.jsx)(components_1.Icon, { xss: iconStyles[size], icon: icon }, void 0), label,
|
|
31
|
+
const buttonContent = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon && (0, jsx_runtime_1.jsx)(components_1.Icon, { xss: iconStyles[size], icon: icon }, void 0), label, endAdornment && (0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.ml1.$ }, { children: endAdornment }), void 0)] }, void 0));
|
|
29
32
|
const buttonAttrs = {
|
|
30
33
|
ref: ref,
|
|
31
34
|
...buttonProps,
|
|
@@ -41,7 +44,7 @@ function Button(props) {
|
|
|
41
44
|
},
|
|
42
45
|
...tid,
|
|
43
46
|
};
|
|
44
|
-
const button = typeof onPress === "string" ? ((0, utils_1.isAbsoluteUrl)(onPress) || openInNew || download ? ((0, jsx_runtime_1.
|
|
47
|
+
const button = typeof onPress === "string" ? ((0, utils_1.isAbsoluteUrl)(onPress) || openInNew || download ? ((0, jsx_runtime_1.jsx)("a", Object.assign({}, buttonAttrs, { href: onPress, className: components_1.navLink }, (download ? { download: "" } : { target: "_blank", rel: "noreferrer noopener" }), { children: buttonContent }), void 0)) : ((0, jsx_runtime_1.jsx)(react_router_dom_1.Link, Object.assign({}, buttonAttrs, { to: onPress, className: components_1.navLink }, { children: buttonContent }), void 0))) : ((0, jsx_runtime_1.jsx)("button", Object.assign({}, buttonAttrs, { children: buttonContent }), void 0));
|
|
45
48
|
// If we're disabled b/c of a non-boolean ReactNode, or the caller specified tooltip text, then show it in a tooltip
|
|
46
49
|
return (0, components_1.maybeTooltip)({
|
|
47
50
|
title: (0, components_1.resolveTooltip)(disabled, tooltip),
|
|
@@ -47,6 +47,8 @@ export declare const Icons: {
|
|
|
47
47
|
starFilled: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
48
48
|
cloudSave: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
49
49
|
attachment: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
50
|
+
archive: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
51
|
+
unarchive: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
50
52
|
errorCircle: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
51
53
|
checkCircle: import("@emotion/react/jsx-runtime").JSX.Element;
|
|
52
54
|
infoCircle: import("@emotion/react/jsx-runtime").JSX.Element;
|
package/dist/components/Icon.js
CHANGED
|
@@ -48,6 +48,8 @@ exports.Icons = {
|
|
|
48
48
|
starFilled: ((0, jsx_runtime_1.jsx)("path", { d: "M10.2822 4.15376C10.823 2.48976 13.1771 2.48976 13.7178 4.15376L14.8988 7.78807L18.1239 7.78819L18.125 7.78819L18.7202 7.78821C20.4699 7.78828 21.1973 10.0272 19.7818 11.0557L19.3009 11.4051L19.2994 11.4062L16.6904 13.3019L17.8711 16.9363C18.4117 18.6004 16.5072 19.9841 15.0917 18.9557L14.6111 18.6066L14.6092 18.6052L12 16.7097L9.39081 18.6052L8.90836 18.9557C7.49282 19.9841 5.5883 18.6004 6.12891 16.9363L7.30965 13.3019L4.21817 11.0557C2.80271 10.0272 3.53017 7.78828 5.27983 7.78821L5.87502 7.78819L5.87615 7.78819L9.10121 7.78807L10.0979 4.72089L10.2822 4.15376Z" }, void 0)),
|
|
49
49
|
cloudSave: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M9 19H7C4.243 19 2 16.757 2 14C2 11.82 3.609 9.792 5.757 9.15C6.85 6.611 9.244 5 12 5C15.56 5 18.507 7.67 18.944 11.112C20.695 11.538 22 13.12 22 15C22 17.206 20.206 19 18 19H15H9ZM15 17H18C19.103 17 20 16.103 20 15C20 13.897 19.103 13 18 13H17V12C17 9.243 14.757 7 12 7C9.895 7 8.149 8.274 7.446 10.325L7.254 10.883L6.673 10.985C5.199 11.244 4 12.596 4 14C4 15.654 5.346 17 7 17H9H15Z" }, void 0), (0, jsx_runtime_1.jsx)("rect", { x: "9.67139", y: "14.6567", width: "6", height: "1.5", transform: "rotate(-45 9.67139 14.6567)" }, void 0), (0, jsx_runtime_1.jsx)("rect", { x: "9.31787", y: "12.1819", width: "3.5", height: "1.5", transform: "rotate(45 9.31787 12.1819)" }, void 0)] }, void 0)),
|
|
50
50
|
attachment: ((0, jsx_runtime_1.jsx)("path", { d: "M5.70034 11.879L13.2477 4.15188C14.7481 2.61751 17.2048 2.61457 18.7439 4.15187C20.2147 5.69292 20.2456 8.1905 18.7439 9.72637L12.1677 16.4463C11.1677 17.4455 9.53953 17.4417 8.57861 16.4145L8.5763 16.4121C7.61217 15.4147 7.64468 13.8162 8.60983 12.8511L8.6113 12.8496L13.7859 7.56715C13.9307 7.42307 14.1608 7.40384 14.3248 7.56783L15.121 8.36403L15.1269 8.3691C15.2788 8.49929 15.2951 8.72507 15.1451 8.90458L9.9755 14.146C9.84287 14.2789 9.78341 14.4569 9.77747 14.6231C9.77157 14.7885 9.81776 14.9643 9.92515 15.0986L9.93923 15.1162L9.95684 15.1303C10.2011 15.3257 10.5715 15.346 10.8022 15.1153L17.3808 8.39291L17.3829 8.39073C18.1402 7.59359 18.1402 6.28461 17.3829 5.48747L17.3793 5.48379C16.6171 4.72167 15.3745 4.72167 14.6124 5.48379L14.6107 5.48549L7.06489 13.211L7.06402 13.2118C5.72803 14.5488 5.72839 16.7596 7.02689 18.0962C8.32851 19.4362 10.437 19.436 11.7387 18.0962L17.9191 11.7721C18.0556 11.6365 18.2859 11.6367 18.422 11.7728L19.2542 12.605L19.2601 12.6101C19.4197 12.7469 19.4187 12.9691 19.2846 13.1031L19.283 13.1048L13.1015 19.43C11.0256 21.5403 7.70624 21.5062 5.66445 19.4304C3.62176 17.3177 3.65669 13.9573 5.70034 11.879Z" }, void 0)),
|
|
51
|
+
archive: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { "fill-rule": "evenodd", d: "M19 10H5L5 18H19V10ZM3 8V18C3 19.1046 3.89543 20 5 20H19C20.1046 20 21 19.1046 21 18V8H3Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { "fill-rule": "evenodd", d: "M3.81818 6V8H20.1818V6H3.81818ZM2.90909 4C2.40701 4 2 4.44772 2 5V9C2 9.55228 2.40701 10 2.90909 10H21.0909C21.593 10 22 9.55228 22 9V5C22 4.44772 21.593 4 21.0909 4H2.90909Z" }, void 0), (0, jsx_runtime_1.jsx)("rect", { x: "8", y: "11", width: "8", height: "2", rx: "1" }, void 0)] }, void 0)),
|
|
52
|
+
unarchive: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M13 12V8H16L12 3L8 8H11V12H13Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M17 10H19V18H5L5 10H7V8H3V18C3 19.1046 3.89543 20 5 20H19C20.1046 20 21 19.1046 21 18V8H17V10Z" }, void 0), (0, jsx_runtime_1.jsx)("rect", { x: "8", y: "15", width: "8", height: "2", rx: "1" }, void 0)] }, void 0)),
|
|
51
53
|
// Alerts
|
|
52
54
|
errorCircle: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M11.953 2C6.465 2 2 6.486 2 12C2 17.514 6.486 22 12 22C17.514 22 22 17.514 22 12C22 6.486 17.493 2 11.953 2ZM12 20C7.589 20 4 16.411 4 12C4 7.589 7.567 4 11.953 4C16.391 4 20 7.589 20 12C20 16.411 16.411 20 12 20Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M11 7H13V14H11V7ZM11 15H13V17H11V15Z" }, void 0)] }, void 0)),
|
|
53
55
|
checkCircle: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M12 2C6.486 2 2 6.486 2 12C2 17.514 6.486 22 12 22C17.514 22 22 17.514 22 12C22 6.486 17.514 2 12 2ZM12 20C7.589 20 4 16.411 4 12C4 7.589 7.589 4 12 4C16.411 4 20 7.589 20 12C20 16.411 16.411 20 12 20Z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M9.99909 13.587L7.70009 11.292L6.28809 12.708L10.0011 16.413L16.7071 9.70697L15.2931 8.29297L9.99909 13.587Z" }, void 0)] }, void 0)),
|
|
@@ -44,7 +44,11 @@ function TextFieldBase(props) {
|
|
|
44
44
|
// When borderless then perceived vertical alignments are misaligned. As there is no longer a border, then the field looks oddly indented.
|
|
45
45
|
// This typically happens in tables when a column has a mix of static text (i.e. "roll up" rows and table headers) and input fields.
|
|
46
46
|
// To remedy this perceived misalignment then we increase the width by the horizontal padding applied (16px), and set a negative margin left margin to re-center the field.
|
|
47
|
-
|
|
47
|
+
// Note: Do not modify width and position of 'compound' fields.
|
|
48
|
+
...(borderless && !compound
|
|
49
|
+
? Css_1.Css.bTransparent.w("calc(100% + 16px)").ml(-1).$
|
|
50
|
+
: Css_1.Css.bGray300.if(contrast).bGray700.$),
|
|
51
|
+
// Do not add borders to compound fields. A compound field is responsible for drawing its own borders
|
|
48
52
|
...(!compound ? Css_1.Css.ba.$ : {}),
|
|
49
53
|
},
|
|
50
54
|
inputWrapperReadOnly: {
|