@coorpacademy/components 11.32.48-alpha.78 → 11.32.48

package/es/atom/button-link/index.d.ts

@@ -8,6 +8,8 @@ declare const ButtonLink: {
         label: import("prop-types").Requireable<string>;
         content: import("prop-types").Requireable<import("prop-types").ReactNodeLike>;
         'aria-label': import("prop-types").Requireable<string>;
+        tooltipText: import("prop-types").Requireable<string>;
+        tooltipPlacement: import("prop-types").Requireable<string>;
         'data-name': import("prop-types").Requireable<string>;
         'data-testid': import("prop-types").Requireable<string>;
         icon: import("prop-types").Requireable<import("prop-types").InferProps<{

package/es/atom/button-link/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/index.tsx"],"names":[],"mappings":";AAMA,OAAkB,EAAC,eAAe,EAAW,MAAM,SAAS,CAAC;AAoD7D,QAAA,MAAM,UAAU;YAAW,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;CAoGzC,CAAC;AAIF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/index.tsx"],"names":[],"mappings":";AAOA,OAAkB,EAAC,eAAe,EAAW,MAAM,SAAS,CAAC;AAoD7D,QAAA,MAAM,UAAU;YAAW,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmIzC,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/es/atom/button-link/index.js

@@ -7,6 +7,7 @@ import classnames from 'classnames';
 import Link from '../link';
 import FaIcon from '../icon';
 import { ICONS } from '../../util/button-icons';
+import ToolTip from '../tooltip';
 import propTypes from './types';
 import style from './style.css';
 
@@ -63,6 +64,8 @@ const ButtonLink = props => {
     'data-name': dataName,
     'data-testid': dataTestId = 'button-link',
     'aria-label': ariaLabel,
+    tooltipText,
+    tooltipPlacement = 'left',
     link,
     onClick = _noop,
     onKeyDown = _noop,
@@ -70,7 +73,7 @@ const ButtonLink = props => {
     customStyle,
     useTitle = true
   } = props;
-  const styleButton = classnames(className, style.button, type === 'primary' && style.primary, type === 'secondary' && style.secondary, type === 'tertiary' && style.tertiary, type === 'text' && style.text, type === 'dangerous' && style.dangerous, link && style.link, disabled && style.disabled);
+  const styleButton = classnames(className, style.button, !label && style.iconButton, type === 'primary' && style.primary, type === 'secondary' && style.secondary, type === 'tertiary' && style.tertiary, type === 'text' && style.text, type === 'dangerous' && style.dangerous, link && style.link, disabled && style.disabled);
   const [hovered, setHovered] = useState(false);
   const handleOnClick = useCallback(event => onClick(event), [onClick]);
   const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);
@@ -78,6 +81,22 @@ const ButtonLink = props => {
     setHovered(true);
   }, [setHovered]);
   const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);
+  const TooltipContent = useCallback(() => /*#__PURE__*/React.createElement("span", {
+    className: style.tooltipContentWrapper
+  }, tooltipText || ariaLabel), [tooltipText, ariaLabel]);
+
+  const renderToolTip = () => {
+    const closeToolTipInformationTextAriaLabel = tooltipText || ariaLabel;
+    if (!closeToolTipInformationTextAriaLabel) return null;
+    return /*#__PURE__*/React.createElement(ToolTip, {
+      fontSize: 12,
+      anchorId: "button-icon",
+      toolTipIsVisible: hovered,
+      placement: tooltipPlacement,
+      TooltipContent: TooltipContent,
+      closeToolTipInformationTextAriaLabel: closeToolTipInformationTextAriaLabel
+    });
+  };
 
   const _customStyle = useMemo(() => {
     return _extends({}, customStyle, (hoverBackgroundColor || hoverColor) && hovered ? {
@@ -99,12 +118,15 @@ const ButtonLink = props => {
       hoverBackgroundColor: hoverBackgroundColor,
       onMouseEnter: handleMouseOver,
       onMouseLeave: handleMouseLeave
-    }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor));
+    }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor), renderToolTip());
   }
 
   return /*#__PURE__*/React.createElement("button", _extends({}, useTitle && {
     title: ariaLabel || label
-  }, {
+  }, ariaLabel && !label ? {
+    'data-for': 'button-icon',
+    'data-tip': hovered
+  } : {}, {
     // eslint-disable-next-line react/button-has-type
     type: usage,
     "aria-label": ariaLabel || label,
@@ -118,7 +140,7 @@ const ButtonLink = props => {
     onMouseLeave: handleMouseLeave,
     tabIndex: 0,
     disabled: disabled
-  }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor));
+  }), getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor), renderToolTip());
 };
 
 ButtonLink.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};

package/es/atom/button-link/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","classnames","Link","FaIcon","ICONS","propTypes","style","getButtonContent","icon","content","hovered","hoverBackgroundColor","hoverColor","type","faIcon","position","Icon","buttonContent","label","iconComponent","iconName","name","iconColor","color","backgroundColor","size","faSize","wrapperSize","customStyle","ButtonLink","props","usage","disabled","dataName","dataTestId","ariaLabel","link","onClick","onKeyDown","className","useTitle","styleButton","button","primary","secondary","tertiary","text","dangerous","setHovered","handleOnClick","event","handleOnKeyDown","handleMouseOver","handleMouseLeave","_customStyle","title"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport FaIcon from '../icon';\nimport {ICONS} from '../../util/button-icons';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\nimport style from './style.css';\n\nconst getButtonContent = (\n  icon?: IconType,\n  content?: string | React.ReactNode,\n  hovered?: boolean,\n  hoverBackgroundColor?: string,\n  hoverColor?: string\n) => {\n  const {type, faIcon, position} = icon || {type: '', position: ''};\n  const Icon = type && ICONS[type];\n\n  if (!Icon && !faIcon) {\n    return (\n      <div className={style.buttonContent}>\n        <span className={style.label}>{content}</span>\n      </div>\n    );\n  }\n\n  const iconComponent = faIcon ? (\n    <FaIcon\n      {...{\n        iconName: faIcon.name,\n        iconColor: hovered && hoverColor ? hoverColor : faIcon.color,\n        // eslint-disable-next-line no-nested-ternary\n        backgroundColor: !faIcon?.backgroundColor\n          ? 'transparent'\n          : hovered && hoverBackgroundColor\n          ? hoverBackgroundColor\n          : faIcon.backgroundColor,\n        size: {\n          faSize: faIcon.size,\n          wrapperSize: faIcon.size\n        },\n        customStyle: faIcon.customStyle\n      }}\n    />\n  ) : (\n    <Icon className={style.icon} theme=\"coorpmanager\" />\n  );\n\n  return (\n    <div className={style.buttonContent}>\n      {position === 'left' ? iconComponent : null}\n      {content ? <span className={style.label}>{content}</span> : null}\n      {position === 'right' ? iconComponent : null}\n    </div>\n  );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n  const {\n    type,\n    usage = 'button',\n    label,\n    content,\n    hoverBackgroundColor,\n    hoverColor,\n    disabled = false,\n    icon,\n    'data-name': dataName,\n    'data-testid': dataTestId = 'button-link',\n    'aria-label': ariaLabel,\n    link,\n    onClick = noop,\n    onKeyDown = noop,\n    className,\n    customStyle,\n    useTitle = true\n  } = props;\n  const styleButton = classnames(\n    className,\n    style.button,\n    type === 'primary' && style.primary,\n    type === 'secondary' && style.secondary,\n    type === 'tertiary' && style.tertiary,\n    type === 'text' && style.text,\n    type === 'dangerous' && style.dangerous,\n    link && style.link,\n    disabled && style.disabled\n  );\n\n  const [hovered, setHovered] = useState(false);\n\n  const handleOnClick = useCallback(event => onClick(event), [onClick]);\n\n  const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n  const handleMouseOver = useCallback(() => {\n    setHovered(true);\n  }, [setHovered]);\n\n  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n  const _customStyle = useMemo(() => {\n    return {\n      ...customStyle,\n      ...((hoverBackgroundColor || hoverColor) && hovered\n        ? {\n            backgroundColor: hoverBackgroundColor,\n            color: hoverColor\n          }\n        : null)\n    };\n  }, [hoverBackgroundColor, hoverColor, hovered, customStyle]);\n\n  if (link) {\n    return (\n      <Link\n        {...link}\n        {...(useTitle && {\n          title: ariaLabel || label\n        })}\n        style={customStyle}\n        className={styleButton}\n        data-name={dataName}\n        data-testid={dataTestId}\n        aria-label={ariaLabel || label}\n        hoverColor={hoverColor}\n        hoverBackgroundColor={hoverBackgroundColor}\n        onMouseEnter={handleMouseOver}\n        onMouseLeave={handleMouseLeave}\n      >\n        {getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor)}\n      </Link>\n    );\n  }\n\n  return (\n    <button\n      {...(useTitle && {\n        title: ariaLabel || label\n      })}\n      // eslint-disable-next-line react/button-has-type\n      type={usage}\n      aria-label={ariaLabel || label}\n      data-name={dataName}\n      data-testid={dataTestId}\n      style={_customStyle}\n      className={styleButton}\n      onClick={handleOnClick}\n      onKeyDown={handleOnKeyDown}\n      onMouseOver={handleMouseOver}\n      onMouseLeave={handleMouseLeave}\n      tabIndex={0}\n      disabled={disabled}\n    >\n      {getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor)}\n    </button>\n  );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","useCallback","useState","useMemo","classnames","Link","FaIcon","ICONS","ToolTip","propTypes","style","getButtonContent","icon","content","hovered","hoverBackgroundColor","hoverColor","type","faIcon","position","Icon","buttonContent","label","iconComponent","iconName","name","iconColor","color","backgroundColor","size","faSize","wrapperSize","customStyle","ButtonLink","props","usage","disabled","dataName","dataTestId","ariaLabel","tooltipText","tooltipPlacement","link","onClick","onKeyDown","className","useTitle","styleButton","button","iconButton","primary","secondary","tertiary","text","dangerous","setHovered","handleOnClick","event","handleOnKeyDown","handleMouseOver","handleMouseLeave","TooltipContent","tooltipContentWrapper","renderToolTip","closeToolTipInformationTextAriaLabel","_customStyle","title"],"sources":["../../../src/atom/button-link/index.tsx"],"sourcesContent":["import React, {useCallback, useState, useMemo} from 'react';\nimport {noop} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Link from '../link';\nimport FaIcon from '../icon';\nimport {ICONS} from '../../util/button-icons';\nimport ToolTip from '../tooltip';\nimport propTypes, {ButtonLinkProps, IconType} from './types';\nimport style from './style.css';\n\nconst getButtonContent = (\n  icon?: IconType,\n  content?: string | React.ReactNode,\n  hovered?: boolean,\n  hoverBackgroundColor?: string,\n  hoverColor?: string\n) => {\n  const {type, faIcon, position} = icon || {type: '', position: ''};\n  const Icon = type && ICONS[type];\n\n  if (!Icon && !faIcon) {\n    return (\n      <div className={style.buttonContent}>\n        <span className={style.label}>{content}</span>\n      </div>\n    );\n  }\n\n  const iconComponent = faIcon ? (\n    <FaIcon\n      {...{\n        iconName: faIcon.name,\n        iconColor: hovered && hoverColor ? hoverColor : faIcon.color,\n        // eslint-disable-next-line no-nested-ternary\n        backgroundColor: !faIcon?.backgroundColor\n          ? 'transparent'\n          : hovered && hoverBackgroundColor\n          ? hoverBackgroundColor\n          : faIcon.backgroundColor,\n        size: {\n          faSize: faIcon.size,\n          wrapperSize: faIcon.size\n        },\n        customStyle: faIcon.customStyle\n      }}\n    />\n  ) : (\n    <Icon className={style.icon} theme=\"coorpmanager\" />\n  );\n\n  return (\n    <div className={style.buttonContent}>\n      {position === 'left' ? iconComponent : null}\n      {content ? <span className={style.label}>{content}</span> : null}\n      {position === 'right' ? iconComponent : null}\n    </div>\n  );\n};\n\nconst ButtonLink = (props: ButtonLinkProps) => {\n  const {\n    type,\n    usage = 'button',\n    label,\n    content,\n    hoverBackgroundColor,\n    hoverColor,\n    disabled = false,\n    icon,\n    'data-name': dataName,\n    'data-testid': dataTestId = 'button-link',\n    'aria-label': ariaLabel,\n    tooltipText,\n    tooltipPlacement = 'left',\n    link,\n    onClick = noop,\n    onKeyDown = noop,\n    className,\n    customStyle,\n    useTitle = true\n  } = props;\n  const styleButton = classnames(\n    className,\n    style.button,\n    !label && style.iconButton,\n    type === 'primary' && style.primary,\n    type === 'secondary' && style.secondary,\n    type === 'tertiary' && style.tertiary,\n    type === 'text' && style.text,\n    type === 'dangerous' && style.dangerous,\n    link && style.link,\n    disabled && style.disabled\n  );\n\n  const [hovered, setHovered] = useState(false);\n\n  const handleOnClick = useCallback(event => onClick(event), [onClick]);\n\n  const handleOnKeyDown = useCallback(event => onKeyDown(event), [onKeyDown]);\n\n  const handleMouseOver = useCallback(() => {\n    setHovered(true);\n  }, [setHovered]);\n\n  const handleMouseLeave = useCallback(() => setHovered(false), [setHovered]);\n\n  const TooltipContent = useCallback(\n    () => <span className={style.tooltipContentWrapper}>{tooltipText || ariaLabel}</span>,\n    [tooltipText, ariaLabel]\n  );\n\n  const renderToolTip = () => {\n    const closeToolTipInformationTextAriaLabel = tooltipText || ariaLabel;\n    if (!closeToolTipInformationTextAriaLabel) return null;\n    return (\n      <ToolTip\n        fontSize={12}\n        anchorId=\"button-icon\"\n        toolTipIsVisible={hovered}\n        placement={tooltipPlacement}\n        TooltipContent={TooltipContent}\n        closeToolTipInformationTextAriaLabel={closeToolTipInformationTextAriaLabel}\n      />\n    );\n  };\n\n  const _customStyle = useMemo(() => {\n    return {\n      ...customStyle,\n      ...((hoverBackgroundColor || hoverColor) && hovered\n        ? {\n            backgroundColor: hoverBackgroundColor,\n            color: hoverColor\n          }\n        : null)\n    };\n  }, [hoverBackgroundColor, hoverColor, hovered, customStyle]);\n\n  if (link) {\n    return (\n      <Link\n        {...link}\n        {...(useTitle && {\n          title: ariaLabel || label\n        })}\n        style={customStyle}\n        className={styleButton}\n        data-name={dataName}\n        data-testid={dataTestId}\n        aria-label={ariaLabel || label}\n        hoverColor={hoverColor}\n        hoverBackgroundColor={hoverBackgroundColor}\n        onMouseEnter={handleMouseOver}\n        onMouseLeave={handleMouseLeave}\n      >\n        {getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor)}\n        {renderToolTip()}\n      </Link>\n    );\n  }\n\n  return (\n    <button\n      {...(useTitle && {\n        title: ariaLabel || label\n      })}\n      {...(ariaLabel && !label\n        ? {\n            'data-for': 'button-icon',\n            'data-tip': hovered\n          }\n        : {})}\n      // eslint-disable-next-line react/button-has-type\n      type={usage}\n      aria-label={ariaLabel || label}\n      data-name={dataName}\n      data-testid={dataTestId}\n      style={_customStyle}\n      className={styleButton}\n      onClick={handleOnClick}\n      onKeyDown={handleOnKeyDown}\n      onMouseOver={handleMouseOver}\n      onMouseLeave={handleMouseLeave}\n      tabIndex={0}\n      disabled={disabled}\n    >\n      {getButtonContent(icon, content ?? label, hovered, hoverBackgroundColor, hoverColor)}\n      {renderToolTip()}\n    </button>\n  );\n};\n\nButtonLink.propTypes = propTypes;\n\nexport default ButtonLink;\n"],"mappings":"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"}

package/es/atom/button-link/style.css

@@ -27,6 +27,11 @@
   user-select: none;
 }
 
+.iconButton {
+  composes: button;
+  padding: 0px 14px;
+}
+
 .disabled {
   opacity: 0.4;
   pointer-events: none;
@@ -96,3 +101,12 @@
   border-radius: 0px;
   height: auto;
 }
+
+.tooltipContentWrapper {
+  text-align: left;
+  width: max-content;
+  font-family: Gilroy;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 16px;
+}

package/es/atom/button-link/types.d.ts

@@ -7,6 +7,8 @@ declare const propTypes: {
     label: PropTypes.Requireable<string>;
     content: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     'aria-label': PropTypes.Requireable<string>;
+    tooltipText: PropTypes.Requireable<string>;
+    tooltipPlacement: PropTypes.Requireable<string>;
     'data-name': PropTypes.Requireable<string>;
     'data-testid': PropTypes.Requireable<string>;
     icon: PropTypes.Requireable<PropTypes.InferProps<{
@@ -43,6 +45,8 @@ export declare type ButtonLinkProps = {
     label?: string;
     content?: React.ReactNode;
     'aria-label'?: string;
+    tooltipText?: string;
+    tooltipPlacement?: 'left' | 'right' | 'top' | 'bottom';
     'data-name'?: string;
     'data-testid'?: string;
     icon?: IconType;

package/es/atom/button-link/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;CAuBd,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACvC,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,OAAO,KAAK,CAAC;IAC1B,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/atom/button-link/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;CAyBd,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACvC,CAAC;AAEF,oBAAY,QAAQ,GAAG;IACrB,QAAQ,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,OAAO,KAAK,CAAC;IAC1B,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AACF,oBAAY,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,WAAW,CAAC;IACnE,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;IACvD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,CAAC,EAAE;QACL,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;KAClD,CAAC;IACF,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,OAAO,GAAG;IAAC,KAAK,EAAE,eAAe,CAAA;CAAC,CAAC;AAE/C,eAAe,SAAS,CAAC"}

package/es/atom/button-link/types.js

@@ -7,6 +7,8 @@ const propTypes = {
   label: PropTypes.string,
   content: PropTypes.node,
   'aria-label': PropTypes.string,
+  tooltipText: PropTypes.string,
+  tooltipPlacement: PropTypes.oneOf(['left', 'right', 'top', 'bottom']),
   'data-name': PropTypes.string,
   'data-testid': PropTypes.string,
   icon: PropTypes.shape({

package/es/atom/button-link/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["PropTypes","ICONS","propTypes","type","oneOf","usage","label","string","content","node","icon","shape","position","onClick","func","link","href","download","bool","target","hoverBackgroundColor","hoverColor","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n  type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n  usage: PropTypes.oneOf(['button', 'submit', 'reset']),\n  label: PropTypes.string,\n  content: PropTypes.node,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  'data-testid': PropTypes.string,\n  icon: PropTypes.shape({\n    position: PropTypes.oneOf(['right', 'left']),\n    type: PropTypes.oneOf(keys(ICONS))\n  }),\n  onClick: PropTypes.func,\n  link: PropTypes.shape({\n    href: PropTypes.string,\n    download: PropTypes.bool,\n    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n  }),\n  hoverBackgroundColor: PropTypes.string,\n  hoverColor: PropTypes.string,\n  disabled: PropTypes.bool,\n  className: PropTypes.string,\n  customStyle: PropTypes.shape({})\n};\n\nexport type FaIcontype = {\n  name: string;\n  color?: string;\n  backgroundColor?: string;\n  size?: number;\n  customStyle?: Record<string, unknown>;\n};\n\nexport type IconType = {\n  position: 'right' | 'left';\n  type?: keyof typeof ICONS;\n  faIcon?: FaIcontype;\n};\nexport type ButtonLinkProps = {\n  type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n  usage?: 'button' | 'submit' | 'reset';\n  label?: string;\n  content?: React.ReactNode;\n  'aria-label'?: string;\n  'data-name'?: string;\n  'data-testid'?: string;\n  icon?: IconType;\n  onClick?: () => void;\n  onKeyDown?: () => void;\n  link?: {\n    href?: string;\n    download?: boolean;\n    target?: '_self' | '_blank' | '_parent' | '_top';\n  };\n  hoverBackgroundColor?: string;\n  hoverColor?: string;\n  disabled?: boolean;\n  className?: string;\n  customStyle?: Record<string, unknown>;\n  useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";AAAA,OAAOA,SAAP,MAAsB,YAAtB;AAEA,SAAQC,KAAR,QAAoB,yBAApB;AAEA,MAAMC,SAAS,GAAG;EAChBC,IAAI,EAAEH,SAAS,CAACI,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEL,SAAS,CAACI,KAAV,CAAgB,CAAC,QAAD,EAAW,QAAX,EAAqB,OAArB,CAAhB,CAFS;EAGhBE,KAAK,EAAEN,SAAS,CAACO,MAHD;EAIhBC,OAAO,EAAER,SAAS,CAACS,IAJH;EAKhB,cAAcT,SAAS,CAACO,MALR;EAMhB,aAAaP,SAAS,CAACO,MANP;EAOhB,eAAeP,SAAS,CAACO,MAPT;EAQhBG,IAAI,EAAEV,SAAS,CAACW,KAAV,CAAgB;IACpBC,QAAQ,EAAEZ,SAAS,CAACI,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBD,IAAI,EAAEH,SAAS,CAACI,KAAV,CAAgB,MAAKH,KAAL,CAAhB;EAFc,CAAhB,CARU;EAYhBY,OAAO,EAAEb,SAAS,CAACc,IAZH;EAahBC,IAAI,EAAEf,SAAS,CAACW,KAAV,CAAgB;IACpBK,IAAI,EAAEhB,SAAS,CAACO,MADI;IAEpBU,QAAQ,EAAEjB,SAAS,CAACkB,IAFA;IAGpBC,MAAM,EAAEnB,SAAS,CAACI,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAbU;EAkBhBgB,oBAAoB,EAAEpB,SAAS,CAACO,MAlBhB;EAmBhBc,UAAU,EAAErB,SAAS,CAACO,MAnBN;EAoBhBe,QAAQ,EAAEtB,SAAS,CAACkB,IApBJ;EAqBhBK,SAAS,EAAEvB,SAAS,CAACO,MArBL;EAsBhBiB,WAAW,EAAExB,SAAS,CAACW,KAAV,CAAgB,EAAhB;AAtBG,CAAlB;AAgEA,eAAeT,SAAf"}
+{"version":3,"file":"types.js","names":["PropTypes","ICONS","propTypes","type","oneOf","usage","label","string","content","node","tooltipText","tooltipPlacement","icon","shape","position","onClick","func","link","href","download","bool","target","hoverBackgroundColor","hoverColor","disabled","className","customStyle"],"sources":["../../../src/atom/button-link/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport {ICONS} from '../../util/button-icons';\n\nconst propTypes = {\n  type: PropTypes.oneOf(['primary', 'secondary', 'tertiary', 'text', 'dangerous']),\n  usage: PropTypes.oneOf(['button', 'submit', 'reset']),\n  label: PropTypes.string,\n  content: PropTypes.node,\n  'aria-label': PropTypes.string,\n  tooltipText: PropTypes.string,\n  tooltipPlacement: PropTypes.oneOf(['left', 'right', 'top', 'bottom']),\n  'data-name': PropTypes.string,\n  'data-testid': PropTypes.string,\n  icon: PropTypes.shape({\n    position: PropTypes.oneOf(['right', 'left']),\n    type: PropTypes.oneOf(keys(ICONS))\n  }),\n  onClick: PropTypes.func,\n  link: PropTypes.shape({\n    href: PropTypes.string,\n    download: PropTypes.bool,\n    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n  }),\n  hoverBackgroundColor: PropTypes.string,\n  hoverColor: PropTypes.string,\n  disabled: PropTypes.bool,\n  className: PropTypes.string,\n  customStyle: PropTypes.shape({})\n};\n\nexport type FaIcontype = {\n  name: string;\n  color?: string;\n  backgroundColor?: string;\n  size?: number;\n  customStyle?: Record<string, unknown>;\n};\n\nexport type IconType = {\n  position: 'right' | 'left';\n  type?: keyof typeof ICONS;\n  faIcon?: FaIcontype;\n};\nexport type ButtonLinkProps = {\n  type?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'dangerous';\n  usage?: 'button' | 'submit' | 'reset';\n  label?: string;\n  content?: React.ReactNode;\n  'aria-label'?: string;\n  tooltipText?: string;\n  tooltipPlacement?: 'left' | 'right' | 'top' | 'bottom';\n  'data-name'?: string;\n  'data-testid'?: string;\n  icon?: IconType;\n  onClick?: () => void;\n  onKeyDown?: () => void;\n  link?: {\n    href?: string;\n    download?: boolean;\n    target?: '_self' | '_blank' | '_parent' | '_top';\n  };\n  hoverBackgroundColor?: string;\n  hoverColor?: string;\n  disabled?: boolean;\n  className?: string;\n  customStyle?: Record<string, unknown>;\n  useTitle?: boolean;\n};\n\nexport type Fixture = {props: ButtonLinkProps};\n\nexport default propTypes;\n"],"mappings":";AAAA,OAAOA,SAAP,MAAsB,YAAtB;AAEA,SAAQC,KAAR,QAAoB,yBAApB;AAEA,MAAMC,SAAS,GAAG;EAChBC,IAAI,EAAEH,SAAS,CAACI,KAAV,CAAgB,CAAC,SAAD,EAAY,WAAZ,EAAyB,UAAzB,EAAqC,MAArC,EAA6C,WAA7C,CAAhB,CADU;EAEhBC,KAAK,EAAEL,SAAS,CAACI,KAAV,CAAgB,CAAC,QAAD,EAAW,QAAX,EAAqB,OAArB,CAAhB,CAFS;EAGhBE,KAAK,EAAEN,SAAS,CAACO,MAHD;EAIhBC,OAAO,EAAER,SAAS,CAACS,IAJH;EAKhB,cAAcT,SAAS,CAACO,MALR;EAMhBG,WAAW,EAAEV,SAAS,CAACO,MANP;EAOhBI,gBAAgB,EAAEX,SAAS,CAACI,KAAV,CAAgB,CAAC,MAAD,EAAS,OAAT,EAAkB,KAAlB,EAAyB,QAAzB,CAAhB,CAPF;EAQhB,aAAaJ,SAAS,CAACO,MARP;EAShB,eAAeP,SAAS,CAACO,MATT;EAUhBK,IAAI,EAAEZ,SAAS,CAACa,KAAV,CAAgB;IACpBC,QAAQ,EAAEd,SAAS,CAACI,KAAV,CAAgB,CAAC,OAAD,EAAU,MAAV,CAAhB,CADU;IAEpBD,IAAI,EAAEH,SAAS,CAACI,KAAV,CAAgB,MAAKH,KAAL,CAAhB;EAFc,CAAhB,CAVU;EAchBc,OAAO,EAAEf,SAAS,CAACgB,IAdH;EAehBC,IAAI,EAAEjB,SAAS,CAACa,KAAV,CAAgB;IACpBK,IAAI,EAAElB,SAAS,CAACO,MADI;IAEpBY,QAAQ,EAAEnB,SAAS,CAACoB,IAFA;IAGpBC,MAAM,EAAErB,SAAS,CAACI,KAAV,CAAgB,CAAC,OAAD,EAAU,QAAV,EAAoB,SAApB,EAA+B,MAA/B,CAAhB;EAHY,CAAhB,CAfU;EAoBhBkB,oBAAoB,EAAEtB,SAAS,CAACO,MApBhB;EAqBhBgB,UAAU,EAAEvB,SAAS,CAACO,MArBN;EAsBhBiB,QAAQ,EAAExB,SAAS,CAACoB,IAtBJ;EAuBhBK,SAAS,EAAEzB,SAAS,CAACO,MAvBL;EAwBhBmB,WAAW,EAAE1B,SAAS,CAACa,KAAV,CAAgB,EAAhB;AAxBG,CAAlB;AAoEA,eAAeX,SAAf"}

package/es/atom/input-switch/style.css

@@ -86,10 +86,6 @@
   left: 30px;
 }
 
-.coorpmanager input:checked ~ label::after {
-  left: 23px;
-}
-
 .checkbox:disabled ~ label {
   background: light;
   pointer-events: none;
@@ -112,10 +108,6 @@
   min-height: 24px;
 }
 
-.coorpmanager .title {
-  width: fit-content;
-}
-
 .description {
   font-family: 'Gilroy';
   font-weight: 500;
@@ -134,7 +126,6 @@
 }
 
 .coorpmanager label::after, .coorpmanagerModified label::after {
-  top: 1px;
   width: 22px;
   height: 22px;
 }
@@ -143,6 +134,7 @@
   font-family: Gilroy;
   font-weight: bold;
   color: black;
+  min-width: 190px;
 }
 
 .coorpmanager .checkbox:checked ~ label {

package/es/molecule/banner/index.d.ts

@@ -5,11 +5,10 @@ declare namespace Banner {
         const bannerKey: PropTypes.Requireable<string>;
         const type: PropTypes.Requireable<string>;
         const message: PropTypes.Validator<string>;
-        const cta: PropTypes.Requireable<(PropTypes.InferProps<{
-            label: PropTypes.Requireable<string>;
-            type: PropTypes.Requireable<string>;
-            action: PropTypes.Requireable<(...args: any[]) => any>;
-        }> | null | undefined)[]>;
+        const firstCTA: PropTypes.Requireable<(...args: any[]) => any>;
+        const firstCTALabel: PropTypes.Requireable<string>;
+        const secondCTALabel: PropTypes.Requireable<string>;
+        const secondCTA: PropTypes.Requireable<(...args: any[]) => any>;
         const temporary: PropTypes.Requireable<boolean>;
         const onEnd: PropTypes.Requireable<(...args: any[]) => any>;
     }

package/es/molecule/banner/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/banner/index.js"],"names":[],"mappings":";AA0BA,iDAoFC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/banner/index.js"],"names":[],"mappings":";AAuBA,iDAmDC"}

package/es/molecule/banner/index.js

@@ -1,96 +1,34 @@
-import _map from "lodash/fp/map";
-import _isEmpty from "lodash/fp/isEmpty";
-import _noop from "lodash/fp/noop";
 import _keys from "lodash/fp/keys";
-import React, { useState, useCallback } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { COLORS } from '../../variables/colors';
+import { NovaSolidInterfaceFeedbackInterfaceAlertDiamond as QuestionIcon, NovaCompositionCoorpacademyValidate as ValidateIcon } from '@coorpacademy/nova-icons';
 import ButtonLink from '../../atom/button-link';
-import Icon from '../../atom/icon';
-import InputSwitch from '../../atom/input-switch';
 import style from './style.css';
-
-const uncappedMap = _map.convert({
-  cap: false
-});
-
-const TYPES = {
-  success: ['circle-check', COLORS.cm_positive_200],
-  error: ['triangle-exclamation', COLORS.cm_negative_200],
-  warning: ['circle-exclamation', COLORS.cm_yellow_400],
-  info: ['circle-info', COLORS.cm_grey_500]
+const ICONS = {
+  success: ValidateIcon,
+  error: QuestionIcon,
+  warning: QuestionIcon
 };
 const STYLES = {
   success: style.success,
   error: style.error,
-  warning: style.warning,
-  info: style.info
+  warning: style.warning
 };
 
 const Banner = props => {
   const {
     type,
     message,
-    cta = [],
+    firstCTA,
+    firstCTALabel,
+    secondCTALabel,
+    secondCTA,
     temporary,
     bannerKey,
     onEnd
   } = props;
-  const [switchValue, setSwitchValue] = useState(false);
-  const ButtonSeparator = /*#__PURE__*/React.createElement("div", {
-    className: classnames(style.buttonsBar, STYLES[type])
-  });
-
-  const buildButton = ({
-    type: buttonType = 'button',
-    label,
-    action = _noop
-  }) => {
-    const handleSwitchToggle = useCallback(() => {
-      console.log('handleSwitchToggle new test 2');
-      const newSwitchValue = !switchValue;
-      setSwitchValue(newSwitchValue);
-      action(newSwitchValue);
-    }, [switchValue, setSwitchValue]);
-
-    switch (buttonType) {
-      case 'switch':
-        return /*#__PURE__*/React.createElement("div", {
-          className: classnames(style.button, STYLES[type])
-        }, /*#__PURE__*/React.createElement(InputSwitch, {
-          id: "show-microlearning-switch",
-          theme: "coorpmanager",
-          title: label,
-          value: switchValue,
-          onChange: handleSwitchToggle,
-          "data-name": `banner-switch-cta`,
-          "aria-label": label
-        }));
-
-      default:
-        return /*#__PURE__*/React.createElement("div", {
-          className: classnames(style.button, STYLES[type])
-        }, /*#__PURE__*/React.createElement(ButtonLink, {
-          "data-name": "banner-button-cta",
-          "aria-label": label,
-          label: label,
-          onClick: action,
-          type: "text"
-        }));
-    }
-  };
-
-  const buildCta = ctaOptions => {
-    return uncappedMap((options, i) => {
-      if (_isEmpty(options)) return null;
-      return /*#__PURE__*/React.createElement(React.Fragment, {
-        key: i
-      }, i > 0 ? ButtonSeparator : null, buildButton(options));
-    }, ctaOptions);
-  };
-
-  const [iconName, iconColor] = TYPES[type];
+  const Icon = ICONS[type];
   return /*#__PURE__*/React.createElement("div", {
     key: bannerKey,
     className: classnames(style.banner, STYLES[type], temporary && style.temporaryBanner),
@@ -100,22 +38,36 @@ const Banner = props => {
     "data-name": `${type}-banner-message`,
     className: style.message
   }, /*#__PURE__*/React.createElement(Icon, {
-    iconName: iconName,
-    iconColor: iconColor,
     className: classnames(style.icon, temporary && style.temporaryIcon)
-  }), message), buildCta(cta));
+  }), message), firstCTALabel ? /*#__PURE__*/React.createElement("div", {
+    className: classnames(style.button, STYLES[type])
+  }, /*#__PURE__*/React.createElement(ButtonLink, {
+    "data-name": "first-banner-cta",
+    "aria-label": firstCTALabel,
+    label: firstCTALabel,
+    onClick: firstCTA,
+    type: "text"
+  })) : null, firstCTALabel && secondCTALabel ? /*#__PURE__*/React.createElement("div", {
+    className: classnames(style.buttonsBar, STYLES[type])
+  }) : null, secondCTALabel ? /*#__PURE__*/React.createElement("div", {
+    className: classnames(style.button, STYLES[type])
+  }, /*#__PURE__*/React.createElement(ButtonLink, {
+    "data-name": "second-banner-cta",
+    onClick: secondCTA,
+    "aria-label": secondCTALabel,
+    label: secondCTALabel,
+    type: "text"
+  })) : null);
 };
 
-const ctaPropTypes = process.env.NODE_ENV !== "production" ? PropTypes.shape({
-  label: PropTypes.string,
-  type: PropTypes.oneOf(['button', 'switch']),
-  action: PropTypes.func
-}) : {};
 Banner.propTypes = process.env.NODE_ENV !== "production" ? {
   bannerKey: PropTypes.string,
-  type: PropTypes.oneOf(_keys(TYPES)),
+  type: PropTypes.oneOf(_keys(ICONS)),
   message: PropTypes.string.isRequired,
-  cta: PropTypes.arrayOf(ctaPropTypes),
+  firstCTA: PropTypes.func,
+  firstCTALabel: PropTypes.string,
+  secondCTALabel: PropTypes.string,
+  secondCTA: PropTypes.func,
   temporary: PropTypes.bool,
   onEnd: PropTypes.func
 } : {};

package/es/molecule/banner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","classnames","COLORS","ButtonLink","Icon","InputSwitch","style","uncappedMap","convert","cap","TYPES","success","cm_positive_200","error","cm_negative_200","warning","cm_yellow_400","info","cm_grey_500","STYLES","Banner","props","type","message","cta","temporary","bannerKey","onEnd","switchValue","setSwitchValue","ButtonSeparator","buttonsBar","buildButton","buttonType","label","action","handleSwitchToggle","console","log","newSwitchValue","button","buildCta","ctaOptions","options","i","iconName","iconColor","banner","temporaryBanner","icon","temporaryIcon","ctaPropTypes","shape","string","oneOf","func","propTypes","isRequired","arrayOf","bool"],"sources":["../../../src/molecule/banner/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {keys, noop, isEmpty, map} from 'lodash/fp';\nimport {COLORS} from '../../variables/colors';\nimport ButtonLink from '../../atom/button-link';\nimport Icon from '../../atom/icon';\nimport InputSwitch from '../../atom/input-switch';\nimport style from './style.css';\n\nconst uncappedMap = map.convert({cap: false});\n\nconst TYPES = {\n  success: ['circle-check', COLORS.cm_positive_200],\n  error: ['triangle-exclamation', COLORS.cm_negative_200],\n  warning: ['circle-exclamation', COLORS.cm_yellow_400],\n  info: ['circle-info', COLORS.cm_grey_500]\n};\n\nconst STYLES = {\n  success: style.success,\n  error: style.error,\n  warning: style.warning,\n  info: style.info\n};\n\nconst Banner = props => {\n  const {type, message, cta = [], temporary, bannerKey, onEnd} = props;\n  const [switchValue, setSwitchValue] = useState(false);\n\n\n\n  const ButtonSeparator = <div className={classnames(style.buttonsBar, STYLES[type])} />;\n\n  const buildButton = ({type: buttonType = 'button', label, action = noop}) => {\n\n    const handleSwitchToggle = useCallback(\n      () => {\n        console.log('handleSwitchToggle new test 2');\n        const newSwitchValue = !switchValue;\n        setSwitchValue(newSwitchValue);\n        action(newSwitchValue);\n      },\n      [switchValue, setSwitchValue]\n    );\n  \n\n    switch (buttonType) {\n      case 'switch':\n        return (\n          <div className={classnames(style.button, STYLES[type])}>\n            <InputSwitch\n              id='show-microlearning-switch'\n              theme=\"coorpmanager\"\n              title={label}\n              value={switchValue}\n              onChange={handleSwitchToggle}\n              data-name={`banner-switch-cta`}\n              aria-label={label}\n            />\n          </div>\n        );\n      default:\n        return (\n          <div className={classnames(style.button, STYLES[type])}>\n            <ButtonLink\n              data-name=\"banner-button-cta\"\n              aria-label={label}\n              label={label}\n              onClick={action}\n              type=\"text\"\n            />\n          </div>\n        );\n    }\n  };\n\n  const buildCta = ctaOptions => {\n    return uncappedMap((options, i) => {\n      if (isEmpty(options)) return null;\n\n      return (\n        <React.Fragment key={i}>\n          {i > 0 ? ButtonSeparator : null}\n          {buildButton(options)}\n        </React.Fragment>\n      );\n    }, ctaOptions);\n  };\n\n  const [iconName, iconColor] = TYPES[type];\n\n  return (\n    <div\n      key={bannerKey}\n      className={classnames(style.banner, STYLES[type], temporary && style.temporaryBanner)}\n      onAnimationEnd={onEnd}\n      title={message}\n    >\n      <div data-name={`${type}-banner-message`} className={style.message}>\n        <Icon\n          iconName={iconName}\n          iconColor={iconColor}\n          className={classnames(style.icon, temporary && style.temporaryIcon)}\n        />\n        {message}\n      </div>\n      {buildCta(cta)}\n    </div>\n  );\n};\n\nconst ctaPropTypes = PropTypes.shape({\n  label: PropTypes.string,\n  type: PropTypes.oneOf(['button', 'switch']),\n  action: PropTypes.func\n});\n\nBanner.propTypes = {\n  bannerKey: PropTypes.string,\n  type: PropTypes.oneOf(keys(TYPES)),\n  message: PropTypes.string.isRequired,\n  cta: PropTypes.arrayOf(ctaPropTypes),\n  temporary: PropTypes.bool,\n  onEnd: PropTypes.func\n};\n\nexport default Banner;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaSolidInterfaceFeedbackInterfaceAlertDiamond","QuestionIcon","NovaCompositionCoorpacademyValidate","ValidateIcon","ButtonLink","style","ICONS","success","error","warning","STYLES","Banner","props","type","message","firstCTA","firstCTALabel","secondCTALabel","secondCTA","temporary","bannerKey","onEnd","Icon","banner","temporaryBanner","icon","temporaryIcon","button","buttonsBar","propTypes","string","oneOf","isRequired","func","bool"],"sources":["../../../src/molecule/banner/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {keys} from 'lodash/fp';\nimport {\n  NovaSolidInterfaceFeedbackInterfaceAlertDiamond as QuestionIcon,\n  NovaCompositionCoorpacademyValidate as ValidateIcon\n} from '@coorpacademy/nova-icons';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst ICONS = {\n  success: ValidateIcon,\n  error: QuestionIcon,\n  warning: QuestionIcon\n};\n\nconst STYLES = {\n  success: style.success,\n  error: style.error,\n  warning: style.warning\n};\n\nconst Banner = props => {\n  const {\n    type,\n    message,\n    firstCTA,\n    firstCTALabel,\n    secondCTALabel,\n    secondCTA,\n    temporary,\n    bannerKey,\n    onEnd\n  } = props;\n  const Icon = ICONS[type];\n  return (\n    <div\n      key={bannerKey}\n      className={classnames(style.banner, STYLES[type], temporary && style.temporaryBanner)}\n      onAnimationEnd={onEnd}\n      title={message}\n    >\n      <div data-name={`${type}-banner-message`} className={style.message}>\n        <Icon className={classnames(style.icon, temporary && style.temporaryIcon)} />\n        {message}\n      </div>\n      {firstCTALabel ? (\n        <div className={classnames(style.button, STYLES[type])}>\n          <ButtonLink\n            data-name=\"first-banner-cta\"\n            aria-label={firstCTALabel}\n            label={firstCTALabel}\n            onClick={firstCTA}\n            type=\"text\"\n          />\n        </div>\n      ) : null}\n      {firstCTALabel && secondCTALabel ? (\n        <div className={classnames(style.buttonsBar, STYLES[type])} />\n      ) : null}\n      {secondCTALabel ? (\n        <div className={classnames(style.button, STYLES[type])}>\n          <ButtonLink\n            data-name=\"second-banner-cta\"\n            onClick={secondCTA}\n            aria-label={secondCTALabel}\n            label={secondCTALabel}\n            type=\"text\"\n          />\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nBanner.propTypes = {\n  bannerKey: PropTypes.string,\n  type: PropTypes.oneOf(keys(ICONS)),\n  message: PropTypes.string.isRequired,\n  firstCTA: PropTypes.func,\n  firstCTALabel: PropTypes.string,\n  secondCTALabel: PropTypes.string,\n  secondCTA: PropTypes.func,\n  temporary: PropTypes.bool,\n  onEnd: PropTypes.func\n};\n\nexport default Banner;\n"],"mappings":"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"}

package/es/molecule/banner/style.css

@@ -12,8 +12,6 @@
 @value cm_yellow_100 from colors;
 @value cm_yellow_200 from colors;
 @value cm_yellow_400 from colors;
-@value cm_grey_100 from colors;
-@value cm_grey_700 from colors;
 
 @keyframes fadeIn {
     0% {
@@ -38,8 +36,8 @@
     justify-content: flex-start;  
     align-items: center; 
     gap: 8px; 
-    padding: 8px 8px 8px 24px; 
-    border-radius: 12px;
+    padding: 16px 24px; 
+    border-radius: 5px;
 }
 
 .banner.warning {
@@ -57,11 +55,6 @@
     color: cm_positive_200;
 }
 
-.banner.info {
-    background-color: cm_grey_100;
-    color: cm_grey_700;
-}
-
 .temporaryBanner {
     display: inline-flex;
     align-items: center;  
@@ -110,6 +103,7 @@
     color: color(cm_positive_100 blackness(+12%));
 }
 
+
 .buttonsBar {
     width: 2px;
     align-self: stretch;
@@ -129,9 +123,6 @@
     background-color: cm_positive_100;
 }
 
-.buttonsBar.info {
-    background-color: cm_grey_700;
-}
 
 .icon {
     height: 22px;

package/es/molecule/base-modal/index.d.ts

@@ -52,6 +52,7 @@ declare namespace BaseModal {
         }> | null | undefined>>;
         const onClose: PropTypes.Requireable<(...args: any[]) => any>;
         const onScroll: PropTypes.Requireable<(...args: any[]) => any>;
+        const detectScrollbar: PropTypes.Requireable<boolean>;
     }
 }
 import PropTypes from "prop-types";

package/es/molecule/base-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AASA,yEA+GC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AASA,yEA0KC"}