@dnanpm/styleguide 3.9.0 → 3.9.2

package/build/cjs/components/Tooltip/Tooltip.js

@@ -12,6 +12,10 @@ var common = require('../../utils/common.js');
 var styledUtils = require('../../utils/styledUtils.js');
 var Icon = require('../Icon/Icon.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const Helper = styled.default.div `
     display: inline;
     vertical-align: middle;
@@ -62,10 +66,10 @@ const StyledReactTooltip = styled.default(reactTooltip.Tooltip) `
 `;
 const Tooltip = (_a) => {
     var { 'data-testid': dataTestId, closeWithEsc = true } = _a, props = tslib.__rest(_a, ['data-testid', "closeWithEsc"]);
-    return (React.createElement(React.Fragment, null,
-        !props.hideTriggerElement && (React.createElement(Helper, { "data-tooltip-id": props.id, isClickable: props.isClickable, className: props.className, "data-testid": dataTestId },
-            React.createElement(Icon.default, { icon: icons.Info, size: "1rem", position: props.position }))),
-        React.createElement(StyledReactTooltip, { id: props.id, place: props.placement, closeOnEsc: closeWithEsc, openOnClick: props.isClickable, clickable: props.isHoverable, isMultiline: props.isMultiline, disableStyleInjection: true, "data-testid": dataTestId && `${dataTestId}-content` }, props.children)));
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        !props.hideTriggerElement && (React__default.default.createElement(Helper, { "data-tooltip-id": props.id, isClickable: props.isClickable, className: props.className, "data-testid": dataTestId },
+            React__default.default.createElement(Icon.default, { icon: icons.Info, size: "1rem", position: props.position }))),
+        React__default.default.createElement(StyledReactTooltip, { id: props.id, place: props.placement, closeOnEsc: closeWithEsc, openOnClick: props.isClickable, clickable: props.isHoverable, isMultiline: props.isMultiline, disableStyleInjection: true, "data-testid": dataTestId && `${dataTestId}-content` }, props.children)));
 };
 
 exports.default = Tooltip;

package/build/cjs/components/TooltipMenu/TooltipMenu.js

@@ -10,6 +10,10 @@ var theme = require('../../themes/theme.js');
 var Icon = require('../Icon/Icon.js');
 var TooltipMenuExportedStyles = require('./ChildComponents/TooltipMenuExportedStyles.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 const Selector = styled.default.div `
     display: flex;
     align-items: center;
@@ -53,17 +57,17 @@ const TooltipMenu = ({ selector, className, color = theme.default.color.text.bla
             setShowDropdown(false);
         }
     });
-    return (React.createElement(Container, { className: className, ref: ref },
-        React.createElement(Selector, { color: showDropdown ? activeColor : color, onClick: toggleState, showDropdown: showDropdown },
-            tooltipIcon && React.createElement(Icon.default, { icon: tooltipIcon, size: tooltipIconSize, position: "left" }),
-            tooltipIconName && (React.createElement(Icon.default, { name: tooltipIconName, size: tooltipIconSize, position: "left" })),
-            React.createElement("span", null, selector),
-            tooltipChevron && React.createElement(Icon.default, { icon: icons.ChevronDown, size: iconSize, position: "right" })),
-        showDropdown && (React.createElement(React.Fragment, null,
-            React.createElement(TooltipMenuExportedStyles.TailShadow, { zIndex: zIndex, tooltipTop: tooltipTop, arrowPosition: arrowPosition }),
-            React.createElement(TooltipMenuExportedStyles.Tail, { zIndex: zIndex, tooltipTop: tooltipTop, arrowPosition: arrowPosition }))),
-        showDropdown && (React.createElement(Tooltip, { zIndex: zIndex, tooltipTop: tooltipTop, tooltipRight: tooltipRight },
-            React.createElement(ChildrenWrapper, null, children)))));
+    return (React__default.default.createElement(Container, { className: className, ref: ref },
+        React__default.default.createElement(Selector, { color: showDropdown ? activeColor : color, onClick: toggleState, showDropdown: showDropdown },
+            tooltipIcon && React__default.default.createElement(Icon.default, { icon: tooltipIcon, size: tooltipIconSize, position: "left" }),
+            tooltipIconName && (React__default.default.createElement(Icon.default, { name: tooltipIconName, size: tooltipIconSize, position: "left" })),
+            React__default.default.createElement("span", null, selector),
+            tooltipChevron && React__default.default.createElement(Icon.default, { icon: icons.ChevronDown, size: iconSize, position: "right" })),
+        showDropdown && (React__default.default.createElement(React__default.default.Fragment, null,
+            React__default.default.createElement(TooltipMenuExportedStyles.TailShadow, { zIndex: zIndex, tooltipTop: tooltipTop, arrowPosition: arrowPosition }),
+            React__default.default.createElement(TooltipMenuExportedStyles.Tail, { zIndex: zIndex, tooltipTop: tooltipTop, arrowPosition: arrowPosition }))),
+        showDropdown && (React__default.default.createElement(Tooltip, { zIndex: zIndex, tooltipTop: tooltipTop, tooltipRight: tooltipRight },
+            React__default.default.createElement(ChildrenWrapper, null, children)))));
 };
 
 exports.default = TooltipMenu;

package/build/cjs/utils/createStyled.js

@@ -4,7 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var styled = require('styled-components');
 
-function _interopNamespaceDefault(e) {
+function _interopNamespaceCompat(e) {
+    if (e && typeof e === 'object' && 'default' in e) return e;
     var n = Object.create(null);
     if (e) {
         Object.keys(e).forEach(function (k) {
@@ -21,7 +22,7 @@ function _interopNamespaceDefault(e) {
     return Object.freeze(n);
 }
 
-var styled__namespace = /*#__PURE__*/_interopNamespaceDefault(styled);
+var styled__namespace = /*#__PURE__*/_interopNamespaceCompat(styled);
 
 const createStyled = () => {
     const { default: styled, css, createGlobalStyle, keyframes, ThemeProvider, ServerStyleSheet, } = styled__namespace;

package/build/es/components/Button/Button.d.ts

@@ -78,6 +78,10 @@ export interface Props {
      * Allows to pass testid string for testing purposes
      */
     'data-testid'?: string;
+    /**
+     * Allows to pass any data-* attribute
+     */
+    dataAttributes?: Record<`data-${string}`, string>;
 }
 export declare const shade: {
     pink: {

package/build/es/components/Button/Button.js

@@ -114,7 +114,7 @@ const Element = styled__default.button `
 /** @visibleName Button */
 const Button = (_a) => {
     var { type = 'submit', 'data-testid': dataTestId, 'data-no-close': dataNoClose, 'data-track-value': dataTrackValue } = _a, props = __rest(_a, ["type", 'data-testid', 'data-no-close', 'data-track-value']);
-    return (React__default.createElement(Element, Object.assign({ id: props.id, as: props.href ? 'a' : undefined, type: props.href ? undefined : type, href: props.href, onClick: props.onClick, onMouseDown: props.onMouseDown, small: props.small, darkBg: props.darkBg, fullWidth: props.fullWidth, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue }, (!props.href && {
+    return (React__default.createElement(Element, Object.assign({ id: props.id, as: props.href ? 'a' : undefined, type: props.href ? undefined : type, href: props.href, onClick: props.onClick, onMouseDown: props.onMouseDown, small: props.small, darkBg: props.darkBg, fullWidth: props.fullWidth, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue }, props.dataAttributes, (!props.href && {
         name: props.name,
         disabled: props.disabled,
     })), props.loading ? (React__default.createElement(PixelLoader, { color: props.darkBg ? theme.color.default.white : theme.color.default.plum })) : (React__default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text`, "data-no-close": dataNoClose }, props.children))));

package/build/es/components/ButtonArrow/ButtonArrow.js

@@ -64,7 +64,7 @@ const buttonsMap = {
 const ButtonArrow = (_a) => {
     var { variant = 'primary', 'data-testid': dataTestId, 'data-track-value': dataTrackValue } = _a, props = __rest(_a, ["variant", 'data-testid', 'data-track-value']);
     const Element = buttonsMap[variant];
-    return (React__default.createElement(Element, { id: props.id, href: props.href, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, darkBg: props.darkBg, disabled: props.disabled, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue }, props.direction ? (React__default.createElement(Icon, { icon: iconsMap[props.direction], size: "1rem" })) : (isValidElement(props.icon) && props.icon.type === Icon && props.icon)));
+    return (React__default.createElement(Element, { id: props.id, href: props.href, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, darkBg: props.darkBg, disabled: props.disabled, className: props.className, "data-testid": dataTestId, "data-track-value": dataTrackValue, dataAttributes: props.dataAttributes }, props.direction ? (React__default.createElement(Icon, { icon: iconsMap[props.direction], size: "1rem" })) : (isValidElement(props.icon) && props.icon.type === Icon && props.icon)));
 };
 
 export { ButtonArrow as default };

package/build/es/components/ButtonCard/ButtonCard.d.ts

@@ -63,6 +63,10 @@ interface Props {
      * Allows to pass testid string for testing purposes
      */
     'data-testid'?: string;
+    /**
+     * Allows to pass any data-* attribute
+     */
+    dataAttributes?: Record<`data-${string}`, string>;
 }
 /** @visibleName Button Card */
 declare const ButtonCard: ({ type, size, "data-testid": dataTestId, ...props }: Props) => React.JSX.Element;

package/build/es/components/ButtonCard/ButtonCard.js

@@ -116,7 +116,7 @@ const CtaIcon = styled__default(Icon) `
 /** @visibleName Button Card */
 const ButtonCard = (_a) => {
     var { type = 'submit', size = 'medium', 'data-testid': dataTestId } = _a, props = __rest(_a, ["type", "size", 'data-testid']);
-    return (React__default.createElement(ButtonCardWrapper, Object.assign({ id: props.id, as: props.href ? 'a' : undefined, type: props.href ? undefined : type, href: props.href, onClick: props.onClick, className: props.className, "data-testid": dataTestId }, (!props.href && {
+    return (React__default.createElement(ButtonCardWrapper, Object.assign({ id: props.id, as: props.href ? 'a' : undefined, type: props.href ? undefined : type, href: props.href, onClick: props.onClick, className: props.className, "data-testid": dataTestId }, props.dataAttributes, (!props.href && {
         name: props.name,
     })),
         React__default.createElement(StyledBox, { elevation: "low", size: size },

package/build/es/components/ButtonIcon/ButtonIcon.js

@@ -83,7 +83,7 @@ const ButtonElement = styled__default.button `
 const ButtonIcon = (_a) => {
     var { icon = EditUnderline, 'data-testid': dataTestId, 'data-no-close': dataNoClose, 'data-track-value': dataTrackValue } = _a, props = __rest(_a, ["icon", 'data-testid', 'data-no-close', 'data-track-value']);
     const position = props.isReversed ? 'right' : 'left';
-    return (React__default.createElement(ButtonElement, { id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, small: props.small, darkBg: props.darkBg, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, disabled: props.disabled, hideChildrenMobile: props.hideChildrenMobile, isReversed: props.isReversed, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue }, props.loading ? (React__default.createElement(PixelLoader, { color: props.darkBg ? theme.color.default.white : theme.color.default.black })) : (React__default.createElement(React__default.Fragment, null,
+    return (React__default.createElement(ButtonElement, Object.assign({ id: props.id, name: props.name, type: props.type, onClick: props.onClick, onMouseDown: props.onMouseDown, small: props.small, darkBg: props.darkBg, "$loading": props.loading, tabIndex: props.loading ? -1 : 0, "data-loading": props.loading, disabled: props.disabled, hideChildrenMobile: props.hideChildrenMobile, isReversed: props.isReversed, className: props.className, "data-testid": dataTestId, "data-no-close": dataNoClose, "data-track-value": dataTrackValue }, props.dataAttributes), props.loading ? (React__default.createElement(PixelLoader, { color: props.darkBg ? theme.color.default.white : theme.color.default.black })) : (React__default.createElement(React__default.Fragment, null,
         React__default.createElement(Icon, { icon: icon, color: props.darkBg ? theme.color.default.white : theme.color.default.pink, size: props.small ? '1.25rem' : '1.5rem', position: props.children ? position : undefined }),
         props.children && (React__default.createElement("span", { "data-testid": dataTestId && `${dataTestId}-text`, "data-no-close": dataNoClose }, props.children))))));
 };

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@dnanpm/styleguide",
     "sideEffects": false,
-    "version": "v3.9.0",
+    "version": "v3.9.2",
     "main": "build/cjs/index.js",
     "module": "build/es/index.js",
     "jsnext:main": "build/es/index.js",
@@ -44,7 +44,7 @@
         "@babel/preset-env": "^7.26.0",
         "@babel/preset-react": "^7.25.9",
         "@babel/preset-typescript": "^7.25.7",
-        "@dnanpm/icons": "2.0.3",
+        "@dnanpm/icons": "2.0.4",
         "@rollup/plugin-commonjs": "^28.0.1",
         "@rollup/plugin-node-resolve": "^15.3.0",
         "@rollup/plugin-typescript": "^12.1.1",