@ntbjs/react-components 2.0.0-rc.29 → 2.0.0-rc.30

package/build/{Popover-20050b91.js → data/Popover/Popover.styled.js}

@@ -1,14 +1,11 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
-import { isBoolean } from 'lodash';
-import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
-import React__default, { useMemo } from 'react';
 import styled, { css } from 'styled-components';
 import { rgba } from 'polished';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
 import TippyTooltip from '@tippyjs/react';
-import './shift-away-subtle-0dd94a03.js';
-import maxSize from 'popper-max-size-modifier';
+import 'tippy.js/dist/tippy.css';
+import 'tippy.js/animations/shift-away-subtle.css';
 
-const Popover$1 = styled(TippyTooltip).attrs(applyDefaultTheme)`
+const Popover = styled(TippyTooltip).attrs(applyDefaultTheme)`
   font-family: ${props => props.theme.primaryFontFamily};
   font-size: 1rem;
   font-weight: 400;
@@ -145,88 +142,5 @@ const Popover$1 = styled(TippyTooltip).attrs(applyDefaultTheme)`
   }
 `;
 
-const Popover = React__default.forwardRef(function Popover({
-  content = 'Tooltip',
-  interactive = true,
-  placement = 'bottom-end',
-  duration = 350,
-  trigger = 'click focus',
-  offset = [0, 8],
-  arrow = true,
-  visible = undefined,
-  contextMenu = false,
-  contextMenuSublevel = false,
-  children,
-  modifiers = [],
-  maxWidth = 'none',
-  ...props
-}, ref) {
-  const errorOffset = useMemo(() => arrow ? 15 : 0, [arrow]);
-  const isControlled = useMemo(() => isBoolean(visible), [visible]);
-  const handleContextMenuItemClick = () => {
-    document.querySelectorAll('.context-menu-item:not(.opens-sublevel)').forEach(item => item.addEventListener('click', () => {
-      document.querySelectorAll('[data-tippy-root]').forEach(node => {
-        if (node._tippy) {
-          node._tippy.hide();
-        }
-      });
-    }));
-  };
-  return React__default.createElement("div", null, React__default.createElement(Popover$1, _extends({
-    ref: ref,
-    content: content,
-    interactive: interactive,
-    placement: contextMenuSublevel ? 'right-start' : placement,
-    duration: duration,
-    animation: 'shift-away-subtle',
-    trigger: isControlled ? undefined : contextMenuSublevel ? 'mouseenter click focus' : trigger,
-    offset: [offset[0], offset[1] + errorOffset],
-    arrow: contextMenu ? false : arrow,
-    visible: visible,
-    popperOptions: {
-      modifiers: [{
-        ...maxSize,
-        options: {
-          boundary: 'viewport',
-          rootBoundary: 'viewport',
-          padding: 10
-        }
-      }, {
-        name: 'applyMaxSize',
-        enabled: true,
-        phase: 'beforeWrite',
-        requires: ['maxSize'],
-        fn({
-          state
-        }) {
-          const {
-            height
-          } = state.modifiersData.maxSize;
-          state.styles.popper = {
-            ...state.styles.popper,
-            maxHeight: `${height}px`
-          };
-        }
-      }, ...modifiers]
-    },
-    onShown: contextMenu ? handleContextMenuItemClick : undefined,
-    maxWidth: maxWidth
-  }, props), children));
-});
-Popover.propTypes = process.env.NODE_ENV !== "production" ? {
-  content: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
-  interactive: PropTypes.bool,
-  placement: PropTypes.oneOf(['top', 'top-start', 'top-end', 'right', 'right-start', 'right-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'auto', 'auto-start', 'auto-end']),
-  duration: PropTypes.number,
-  trigger: PropTypes.string,
-  offset: PropTypes.arrayOf(PropTypes.number),
-  arrow: PropTypes.bool,
-  visible: PropTypes.bool,
-  modifiers: PropTypes.array,
-  maxWidth: PropTypes.string,
-  contextMenu: PropTypes.bool,
-  contextMenuSublevel: PropTypes.bool,
-  children: PropTypes.node.isRequired
-} : {};
-
-export { Popover as P };
+export { Popover };
+//# sourceMappingURL=Popover.styled.js.map

package/build/data/Popover/Popover.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.styled.js","sources":["../../../src/components/data/Popover/Popover.styled.js"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nimport TippyTooltip from '@tippyjs/react';\nimport 'tippy.js/dist/tippy.css';\nimport 'tippy.js/animations/shift-away-subtle.css';\n\nexport const Popover = styled(TippyTooltip).attrs(applyDefaultTheme)`\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 400;\n  color: inherit;\n  border-radius: 0;\n  line-height: inherit;\n  max-height: inherit;\n\n  ${props =>\n    props.maxWidth &&\n    css`\n      max-width: ${props.maxWidth};\n    `}\n\n  ${props =>\n    props.theme.themeProp(\n      'background',\n      props.theme.getColor('gray-700'),\n      props.theme.getColor('white')\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'box-shadow',\n      `0px 1px 6px -3px ${rgba(props.theme.getColor('black'), 0.7)}`,\n      `0 1px 6px -4px ${props.theme.getColor('black')}`\n    )}\n\n  ${props =>\n    props.theme.themeProp(\n      'border',\n      `1px solid ${props.theme.getColor('gray-800')}`,\n      `1px solid ${props.theme.getColor('gray-300')}`\n    )}\n\n  ${props =>\n    props.contextMenu &&\n    css`\n      border-radius: 4px;\n\n      ${props => props.theme.themeProp('border', 'none', 'none')}\n\n      ${props =>\n        props.theme.themeProp(\n          'box-shadow',\n          `none`,\n          `0 1px 6px ${rgba(props.theme.getColor('gray-900'), 0.3)}`\n        )}\n    `}\n\n  ${props =>\n    props.contextMenuSublevel &&\n    css`\n      &[data-placement^='right-start'],\n      &[data-placement^='left-start'] {\n        margin-top: -4px;\n      }\n\n      &[data-placement^='left'] {\n        margin-right: -6px;\n      }\n\n      &[data-placement^='right'] {\n        margin-left: -6px;\n      }\n    `}\n\n  .tippy-content {\n    padding: 0;\n    max-height: inherit;\n\n    > div {\n      max-height: inherit;\n    }\n  }\n\n  .tippy-arrow {\n    ${props =>\n      props.theme.themeProp(\n        'color',\n        props.theme.getColor('gray-700'),\n        props.theme.getColor('white'),\n        1\n      )}\n  }\n\n  && > .tippy-arrow::before {\n    position: absolute;\n    border-color: transparent;\n    border-style: solid;\n  }\n\n  & > .tippy-arrow::after {\n    content: '';\n    position: absolute;\n    border-color: transparent;\n    border-style: solid;\n  }\n\n  &[data-placement^='top'] {\n    & > .tippy-arrow:before {\n      bottom: -16px;\n      left: -5px;\n      border-width: 15px 13px 0;\n      ${props =>\n        props.theme.themeProp(\n          'border-top-color',\n          props.theme.getColor('gray-800'),\n          props.theme.getColor('gray-300'),\n          1\n        )}\n    }\n\n    & > .tippy-arrow:after {\n      bottom: -15px;\n      left: -5px;\n      border-width: 15px 13px 0;\n      border-top-color: initial;\n      transform-origin: center top;\n    }\n  }\n\n  &[data-placement^='right'] {\n    & > .tippy-arrow:before {\n      bottom: -5px;\n      left: -16px;\n      border-width: 13px 15px 13px 0;\n      ${props =>\n        props.theme.themeProp(\n          'border-right-color',\n          props.theme.getColor('gray-800'),\n          props.theme.getColor('gray-300'),\n          1\n        )}\n    }\n\n    & > .tippy-arrow:after {\n      bottom: -5px;\n      left: -15px;\n      border-width: 13px 15px 13px 0;\n      border-right-color: initial;\n      transform-origin: center top;\n    }\n  }\n\n  &[data-placement^='bottom'] {\n    & > .tippy-arrow:before {\n      top: -16px;\n      left: -5px;\n      border-width: 0 13px 15px 13px;\n      ${props =>\n        props.theme.themeProp(\n          'border-bottom-color',\n          props.theme.getColor('gray-800'),\n          props.theme.getColor('gray-300'),\n          1\n        )}\n    }\n\n    & > .tippy-arrow:after {\n      top: -14.5px;\n      left: -5px;\n      border-width: 0 13px 15px 13px;\n      border-bottom-color: initial;\n      transform-origin: center top;\n    }\n  }\n\n  &[data-placement^='left'] {\n    & > .tippy-arrow::before {\n      bottom: -5px;\n      right: -16px;\n      border-width: 13px 0 13px 15px;\n      ${props =>\n        props.theme.themeProp(\n          'border-left-color',\n          props.theme.getColor('gray-800'),\n          props.theme.getColor('gray-300'),\n          1\n        )}\n    }\n\n    & > .tippy-arrow::after {\n      bottom: -5px;\n      right: -15px;\n      border-width: 13px 0 13px 15px;\n      border-left-color: initial;\n      transform-origin: center top;\n    }\n  }\n`;\n"],"names":["Popover","styled","TippyTooltip","attrs","applyDefaultTheme","props","theme","primaryFontFamily","maxWidth","css","themeProp","getColor","rgba","contextMenu","contextMenuSublevel"],"mappings":";;;;;;;AAQO,MAAMA,OAAO,GAAGC,MAAM,CAACC,YAAY,CAAC,CAACC,KAAK,CAACC,iBAAiB,CAAC,CAAA;AACpE,eAAA,EAAiBC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB,CAAA;AACvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,EAAA,EAAIF,KAAK,IACLA,KAAK,CAACG,QAAQ,IACdC,GAAG,CAAA;AACP,iBAAmBJ,EAAAA,KAAK,CAACG,QAAQ,CAAA;AACjC,IAAK,CAAA,CAAA;AACL;AACA,EAAIH,EAAAA,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,YAAY,EACZL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,OAAO,CAC9B,CAAC,CAAA;AACL;AACA,EAAA,EAAIN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,YAAY,EACZ,oBAAoBE,IAAI,CAACP,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA,CAAE,EAC9D,CAAkBN,eAAAA,EAAAA,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,OAAO,CAAC,EACjD,CAAC,CAAA;AACL;AACA,EAAA,EAAIN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,QAAQ,EACR,CAAaL,UAAAA,EAAAA,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,CAAE,CAAA,EAC/C,aAAaN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAC/C,CAAC,CAAA;AACL;AACA,EAAA,EAAIN,KAAK,IACLA,KAAK,CAACQ,WAAW,IACjBJ,GAAG,CAAA;AACP;AACA;AACA,MAAA,EAAQJ,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACI,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;AAChE;AACA,MAAQL,EAAAA,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,YAAY,EACZ,CAAA,IAAA,CAAM,EACN,CAAA,UAAA,EAAaE,IAAI,CAACP,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAAE,GAAG,CAAC,CAAA,CAC1D,CAAC,CAAA;AACT,IAAK,CAAA,CAAA;AACL;AACA,EAAA,EAAIN,KAAK,IACLA,KAAK,CAACS,mBAAmB,IACzBL,GAAG,CAAA;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAK,CAAA,CAAA;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAA,EAAMJ,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,OAAO,EACPL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,OAAO,CAAC,EAC7B,CACF,CAAC,CAAA;AACP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAA,EAAQN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,kBAAkB,EAClBL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChC,CACF,CAAC,CAAA;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAA,EAAQN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,oBAAoB,EACpBL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChC,CACF,CAAC,CAAA;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAA,EAAQN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,qBAAqB,EACrBL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChC,CACF,CAAC,CAAA;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAA,EAAQN,KAAK,IACLA,KAAK,CAACC,KAAK,CAACI,SAAS,CACnB,mBAAmB,EACnBL,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChCN,KAAK,CAACC,KAAK,CAACK,QAAQ,CAAC,UAAU,CAAC,EAChC,CACF,CAAC,CAAA;AACT;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/build/data/Popover/index.js

@@ -1,10 +1,2 @@
-export { P as default } from '../../Popover-20050b91.js';
-import '../../_rollupPluginBabelHelpers-c245b26a.js';
-import 'lodash';
-import '../../defaultTheme-1bcc2541.js';
-import 'styled-components';
-import 'react';
-import 'polished';
-import '@tippyjs/react';
-import '../../shift-away-subtle-0dd94a03.js';
-import 'popper-max-size-modifier';
+export { default } from './Popover.js';
+//# sourceMappingURL=index.js.map

package/build/data/Popover/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/{Tab-04d435c3.js → data/Tab/Tab.js}

@@ -1,15 +1,7 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
-import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import PropTypes from 'prop-types';
 import React__default from 'react';
-import styled from 'styled-components';
-
-const Tab$1 = styled.p.attrs(applyDefaultTheme)`
-  font-family: ${props => props.theme.primaryFontFamily};
-  font-size: 1rem;
-  font-weight: 500;
-  border-bottom: 1px solid;
-  min-height: 35px;
-`;
+import { Tab as Tab$1 } from './Tab.styled.js';
 
 const Tab = React__default.forwardRef(function Tab({
   children,
@@ -29,4 +21,5 @@ Tab.defaultProps = {
   hidden: false
 };
 
-export { Tab as T };
+export { Tab as default };
+//# sourceMappingURL=Tab.js.map

package/build/data/Tab/Tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.js","sources":["../../../src/components/data/Tab/Tab.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport * as S from './Tab.styled';\n\n/**\n * This is a component to help you get started with development.\n */\nconst Tab = React.forwardRef(function Tab({ children, hidden, ...props }, forwardedRef) {\n  if (hidden) return null;\n\n  return (\n    <S.Tab ref={forwardedRef} {...props}>\n      {children}\n    </S.Tab>\n  );\n});\n\nTab.propTypes = {\n  children: PropTypes.any,\n  hidden: PropTypes.bool\n};\n\nTab.defaultProps = {\n  hidden: false\n};\n\nexport default Tab;\n"],"names":["Tab","React","forwardRef","children","hidden","props","forwardedRef","createElement","S","_extends","ref","propTypes","process","env","NODE_ENV","PropTypes","any","bool","defaultProps"],"mappings":";;;;;AAOMA,MAAAA,GAAG,GAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,GAAGA,CAAC;EAAEG,QAAQ;EAAEC,MAAM;EAAE,GAAGC,KAAAA;AAAM,CAAC,EAAEC,YAAY,EAAE;EACtF,IAAIF,MAAM,EAAE,OAAO,IAAI,CAAA;EAEvB,OACEH,cAAA,CAAAM,aAAA,CAACC,KAAK,EAAAC,QAAA,CAAA;AAACC,IAAAA,GAAG,EAAEJ,YAAAA;GAAkBD,EAAAA,KAAK,CAChCF,EAAAA,QACI,CAAC,CAAA;AAEZ,CAAC,EAAC;AAEFH,GAAG,CAACW,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAG,YAAA,GAAA;EACdX,QAAQ,EAAEY,SAAS,CAACC,GAAG;EACvBZ,MAAM,EAAEW,SAAS,CAACE,IAAAA;AACpB,CAAC,GAAA,EAAA,CAAA;AAEDjB,GAAG,CAACkB,YAAY,GAAG;AACjBd,EAAAA,MAAM,EAAE,KAAA;AACV,CAAC;;;;"}

package/build/data/Tab/Tab.styled.js

@@ -0,0 +1,13 @@
+import styled from 'styled-components';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
+
+const Tab = styled.p.attrs(applyDefaultTheme)`
+  font-family: ${props => props.theme.primaryFontFamily};
+  font-size: 1rem;
+  font-weight: 500;
+  border-bottom: 1px solid;
+  min-height: 35px;
+`;
+
+export { Tab };
+//# sourceMappingURL=Tab.styled.js.map

package/build/data/Tab/Tab.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab.styled.js","sources":["../../../src/components/data/Tab/Tab.styled.js"],"sourcesContent":["import styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nexport const Tab = styled.p.attrs(applyDefaultTheme)`\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 500;\n  border-bottom: 1px solid;\n  min-height: 35px;\n`;\n"],"names":["Tab","styled","p","attrs","applyDefaultTheme","props","theme","primaryFontFamily"],"mappings":";;;AAGO,MAAMA,GAAG,GAAGC,MAAM,CAACC,CAAC,CAACC,KAAK,CAACC,iBAAiB,CAAC,CAAA;AACpD,eAAA,EAAiBC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB,CAAA;AACvD;AACA;AACA;AACA;AACA;;;;"}

package/build/data/Tab/index.js

@@ -1,5 +1,2 @@
-export { T as default } from '../../Tab-04d435c3.js';
-import '../../_rollupPluginBabelHelpers-c245b26a.js';
-import '../../defaultTheme-1bcc2541.js';
-import 'styled-components';
-import 'react';
+export { default } from './Tab.js';
+//# sourceMappingURL=index.js.map

package/build/data/Tab/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/{Tabs-74d1ea8a.js → data/Tabs/Tabs.js}

@@ -1,78 +1,9 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { isEmpty, isNil } from 'lodash';
-import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import PropTypes from 'prop-types';
 import React__default, { useState, useRef, useMemo, Children, Fragment } from 'react';
-import { T as Tab } from './Tab-04d435c3.js';
-import styled, { css } from 'styled-components';
-
-const Tabs$1 = styled.div.attrs(applyDefaultTheme)`
-  display: block;
-  position: relative;
-  ${props => props.backgroundColor && css`
-      background-color: ${props.backgroundColor};
-    `};
-`;
-const TabHeaders = styled.ul.attrs(applyDefaultTheme)`
-  display: flex;
-  overflow-x: auto;
-  overflow-y: hidden;
-  white-space: nowrap;
-  gap: 24px;
-
-  margin: 0;
-  ${props => !props.customPadding && css`
-      padding: 0;
-    `};
-  ${props => props.customPadding && css`
-      padding: 0 ${props.customPadding};
-    `};
-`;
-const TabHeader = styled.li.attrs(applyDefaultTheme)`
-  font-family: ${props => props.theme.secondaryFontFamily};
-  text-transform: uppercase;
-  font-weight: 600;
-  font-size: 0.875rem;
-  display: flex;
-  padding-bottom: 8px;
-  letter-spacing: 0.6px;
-  cursor: pointer;
-  border-bottom: 1px solid;
-  border-color: transparent;
-  margin-bottom: 1px;
-
-  ${props => props.active && css`
-      ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-700'))}
-    `};
-  &&:hover:not(:focus) {
-    ${props => props.theme.themeProp('border-color', () => {
-  if (props.active) {
-    return props.theme.getColor('gray-400');
-  } else {
-    return props.theme.getColor('gray-400');
-  }
-}, () => {
-  if (props.active) {
-    return props.theme.getColor('gray-700');
-  } else {
-    return props.theme.getColor('gray-700');
-  }
-})};
-  }
-`;
-const TabContent = styled.div.attrs(applyDefaultTheme)`
-  display: block;
-`;
-const TabHeaderBorder = styled.div.attrs(applyDefaultTheme)`
-  border-top: 1px solid;
-
-  ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5')};
-  ${props => !props.customPadding && css`
-      margin: -2px 0;
-    `};
-  ${props => props.customPadding && css`
-      margin: -2px ${props.customPadding};
-    `};
-`;
+import Tab from '../Tab/Tab.js';
+import { Tabs as Tabs$1, TabHeaders, TabHeader, TabHeaderBorder, TabContent } from './Tabs.styled.js';
 
 const Tabs = React__default.forwardRef(function Tabs({
   children,
@@ -156,4 +87,5 @@ Tabs.propTypes = process.env.NODE_ENV !== "production" ? {
   onTabClick: PropTypes.func
 } : {};
 
-export { Tabs as T };
+export { Tabs as default };
+//# sourceMappingURL=Tabs.js.map

package/build/data/Tabs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sources":["../../../src/components/data/Tabs/Tabs.js"],"sourcesContent":["import { isEmpty, isNil } from 'lodash';\nimport PropTypes from 'prop-types';\nimport React, { Children, Fragment, useMemo, useRef, useState } from 'react';\nimport Tab from '../Tab';\nimport * as S from './Tabs.styled';\n\n/**\n * Tabs that let you group content\n *\n * ### Import\n *\n * ``` js\n * import { Tabs, Tab } from '@ntbjs/react-components/data'\n * // or\n * import Tabs from '@ntbjs/react-components/data/Tabs'\n * import Tab from '@ntbjs/react-components/data/Tab'\n * ```\n * ### Tab - Tabs - Badge\n * `Tab`, `Tabs` and `Badge` must be used in order to implement the component.\n * ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n *  </Tab>\n * </Tabs>\n * ```\n *  ## Wrapping\n *  Content (data displayed inside the `Tab`) is wrapped by `Tab`:\n *  ```\n * <Tab>\n *    Tab content\n * </Tab>\n * ```\n *   ### Badge\n * The tab title is wrapped by `Badge` (which is passed as the trigger prop inside `Tab`):\n *\n *Props that can be passed inside the `Badge` component are: `badgeContent`, `active`, `error`, `warning` (check out the `Badge` component documentation for props options).\n *  ```\n * <Tab trigger={<Badge>Tab title</Badge>}>\n *    Tab content\n * </Tab>\n * ```\n * All tabs are wrapped by `Tabs`:\n *  ```\n * <Tabs>\n *  <Tab trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab trigger={<Badge>Tab title 3</Badge>}>Tab content 3</Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab trigger={<Badge>Tab title 5</Badge>}>Tab content 5</Tab>\n * </Tabs>\n * ```\n *  ## Props\n * A `backgroundColor` prop can be passed as a string to set the `Tabs` component background color.\n *    ```\n *  <Tabs backgroundColor={'#bfe0d5'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *  ### hidden\n * A single Tab can be hidden by using the `hidden={true||false}` prop (this is useful when the tab has empty content):\n *   ```\n *  <Tabs>\n *  <Tab hidden={true} trigger={<Badge>Tab title 1</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 3</Badge>}></Tab>\n *  <Tab trigger={<Badge>Tab title 4</Badge>}>Tab content 4</Tab>\n *  <Tab hidden={true} trigger={<Badge>Tab title 5</Badge>}></Tab>\n * </Tabs>\n * ```\n *  ### Default minHeight\n * A `defaultMinHeight` prop can be passed to the Tabs component to set a predefined min-height.\n *\n * Pass `defaultMinHeight={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs defaultMinHeight={'500px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n *\n *   ### Custom padding\n * A `customPadding` prop can be passed to the Tabs component to set a custom padding on the tabs. The custom padding is applied the the Tabs options,\n * not to the content within the Tabs.\n *\n * Pass `customPadding={'value px'}` on the `Tabs` component to use this feature.\n *   ```\n *  <Tabs customPadding={'40px'}>\n *  <Tab  trigger={<Badge>Tab title 1</Badge>}>Tab content 1</Tab>\n *  <Tab trigger={<Badge>Tab title 2</Badge>}>Tab content 2</Tab>\n * </Tabs>\n * ```\n */\nconst Tabs = React.forwardRef(function Tabs(\n  { children, defaultMinHeight = '', customPadding = 0, onTabClick = () => {}, ...props },\n  forwardedRef\n) {\n  const [activeTab, setActiveTab] = useState(0);\n  const contentRef = useRef(null);\n\n  const tabs = useMemo(() => {\n    const tabs = [];\n    function extractChildren(children) {\n      Children.forEach(children, (child, index) => {\n        if (isNil(child)) {\n          return null;\n        }\n\n        if (child.type === Fragment) {\n          extractChildren(child.props?.children);\n        }\n\n        if (child.props?.hidden) {\n          return null;\n        }\n\n        if (child.type === Tab) {\n          tabs.push({\n            key: index,\n            trigger: child.props?.trigger,\n            content: child.props?.children\n          });\n        }\n      });\n    }\n\n    extractChildren(children);\n\n    if (!tabs.some(tab => tab?.key === activeTab)) {\n      setActiveTab(tabs[0]?.key);\n    }\n\n    return tabs;\n  }, [children]);\n\n  const handleTabClick = tab => {\n    setActiveTab(tab.key);\n    let triggerText = '';\n\n    if (tab.trigger && tab.trigger.props && tab.trigger.props.children) {\n      triggerText = tab.trigger.props.children;\n    }\n    if (onTabClick) {\n      onTabClick({\n        ...tab,\n        triggerText: triggerText\n      });\n    }\n  };\n\n  return (\n    <S.Tabs ref={forwardedRef} {...props} role=\"tablist\">\n      <S.TabHeaders customPadding={customPadding}>\n        {tabs.map(tab => (\n          <S.TabHeader\n            key={tab.key}\n            hidden={tab.hidden}\n            active={tab.key === activeTab}\n            onClick={() => handleTabClick(tab)}\n            role=\"tab\"\n          >\n            {tab.trigger}\n          </S.TabHeader>\n        ))}\n      </S.TabHeaders>\n      <S.TabHeaderBorder customPadding={customPadding}></S.TabHeaderBorder>\n      <S.TabContent>\n        {tabs.map(tab => (\n          <div\n            ref={tab.key === activeTab?.key ? contentRef : null}\n            key={tab.key}\n            role=\"tabpanel\"\n            hidden={tab.key !== activeTab}\n            style={{\n              minHeight: !isEmpty(defaultMinHeight) ? defaultMinHeight : ''\n            }}\n          >\n            {tab.content}\n          </div>\n        ))}\n      </S.TabContent>\n    </S.Tabs>\n  );\n});\n\nTabs.propTypes = {\n  children: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),\n  /**\n   * Whether `Tabs` component has a background color\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * Whether `tabs` will have a predefined min-height.\n   */\n  defaultMinHeight: PropTypes.string,\n  /**\n   * Custom padding.\n   */\n  customPadding: PropTypes.string,\n  /**\n   * Callback for clicked tab\n   */\n  onTabClick: PropTypes.func\n};\n\nexport default Tabs;\n"],"names":["Tabs","React","forwardRef","children","defaultMinHeight","customPadding","onTabClick","props","forwardedRef","activeTab","setActiveTab","useState","contentRef","useRef","tabs","useMemo","extractChildren","Children","forEach","child","index","isNil","type","Fragment","hidden","Tab","push","key","trigger","content","some","tab","handleTabClick","triggerText","createElement","S","_extends","ref","role","map","active","onClick","style","minHeight","isEmpty","propTypes","process","env","NODE_ENV","PropTypes","oneOfType","array","object","backgroundColor","string","func"],"mappings":"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"}

package/build/data/Tabs/Tabs.styled.js

@@ -0,0 +1,74 @@
+import styled, { css } from 'styled-components';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
+
+const Tabs = styled.div.attrs(applyDefaultTheme)`
+  display: block;
+  position: relative;
+  ${props => props.backgroundColor && css`
+      background-color: ${props.backgroundColor};
+    `};
+`;
+const TabHeaders = styled.ul.attrs(applyDefaultTheme)`
+  display: flex;
+  overflow-x: auto;
+  overflow-y: hidden;
+  white-space: nowrap;
+  gap: 24px;
+
+  margin: 0;
+  ${props => !props.customPadding && css`
+      padding: 0;
+    `};
+  ${props => props.customPadding && css`
+      padding: 0 ${props.customPadding};
+    `};
+`;
+const TabHeader = styled.li.attrs(applyDefaultTheme)`
+  font-family: ${props => props.theme.secondaryFontFamily};
+  text-transform: uppercase;
+  font-weight: 600;
+  font-size: 0.875rem;
+  display: flex;
+  padding-bottom: 8px;
+  letter-spacing: 0.6px;
+  cursor: pointer;
+  border-bottom: 1px solid;
+  border-color: transparent;
+  margin-bottom: 1px;
+
+  ${props => props.active && css`
+      ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-400'), props.theme.getColor('gray-700'))}
+    `};
+  &&:hover:not(:focus) {
+    ${props => props.theme.themeProp('border-color', () => {
+  if (props.active) {
+    return props.theme.getColor('gray-400');
+  } else {
+    return props.theme.getColor('gray-400');
+  }
+}, () => {
+  if (props.active) {
+    return props.theme.getColor('gray-700');
+  } else {
+    return props.theme.getColor('gray-700');
+  }
+})};
+  }
+`;
+const TabContent = styled.div.attrs(applyDefaultTheme)`
+  display: block;
+`;
+const TabHeaderBorder = styled.div.attrs(applyDefaultTheme)`
+  border-top: 1px solid;
+
+  ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5')};
+  ${props => !props.customPadding && css`
+      margin: -2px 0;
+    `};
+  ${props => props.customPadding && css`
+      margin: -2px ${props.customPadding};
+    `};
+`;
+
+export { TabContent, TabHeader, TabHeaderBorder, TabHeaders, Tabs };
+//# sourceMappingURL=Tabs.styled.js.map

package/build/data/Tabs/Tabs.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.styled.js","sources":["../../../src/components/data/Tabs/Tabs.styled.js"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nexport const Tabs = styled.div.attrs(applyDefaultTheme)`\n  display: block;\n  position: relative;\n  ${props =>\n    props.backgroundColor &&\n    css`\n      background-color: ${props.backgroundColor};\n    `};\n`;\n\nexport const TabHeaders = styled.ul.attrs(applyDefaultTheme)`\n  display: flex;\n  overflow-x: auto;\n  overflow-y: hidden;\n  white-space: nowrap;\n  gap: 24px;\n\n  margin: 0;\n  ${props =>\n    !props.customPadding &&\n    css`\n      padding: 0;\n    `};\n  ${props =>\n    props.customPadding &&\n    css`\n      padding: 0 ${props.customPadding};\n    `};\n`;\n\nexport const TabHeader = styled.li.attrs(applyDefaultTheme)`\n  font-family: ${props => props.theme.secondaryFontFamily};\n  text-transform: uppercase;\n  font-weight: 600;\n  font-size: 0.875rem;\n  display: flex;\n  padding-bottom: 8px;\n  letter-spacing: 0.6px;\n  cursor: pointer;\n  border-bottom: 1px solid;\n  border-color: transparent;\n  margin-bottom: 1px;\n\n  ${props =>\n    props.active &&\n    css`\n      ${props =>\n        props.theme.themeProp(\n          'border-color',\n          props.theme.getColor('gray-400'),\n          props.theme.getColor('gray-700')\n        )}\n    `};\n  &&:hover:not(:focus) {\n    ${props =>\n      props.theme.themeProp(\n        'border-color',\n        () => {\n          if (props.active) {\n            return props.theme.getColor('gray-400');\n          } else {\n            return props.theme.getColor('gray-400');\n          }\n        },\n        () => {\n          if (props.active) {\n            return props.theme.getColor('gray-700');\n          } else {\n            return props.theme.getColor('gray-700');\n          }\n        }\n      )};\n  }\n`;\n\nexport const TabContent = styled.div.attrs(applyDefaultTheme)`\n  display: block;\n`;\n\nexport const TabHeaderBorder = styled.div.attrs(applyDefaultTheme)`\n  border-top: 1px solid;\n\n  ${props => props.theme.themeProp('border-color', props.theme.getColor('gray-600'), '#F0F2F5')};\n  ${props =>\n    !props.customPadding &&\n    css`\n      margin: -2px 0;\n    `};\n  ${props =>\n    props.customPadding &&\n    css`\n      margin: -2px ${props.customPadding};\n    `};\n`;\n"],"names":["Tabs","styled","div","attrs","applyDefaultTheme","props","backgroundColor","css","TabHeaders","ul","customPadding","TabHeader","li","theme","secondaryFontFamily","active","themeProp","getColor","TabContent","TabHeaderBorder"],"mappings":"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"}

package/build/data/Tabs/index.js

@@ -1,7 +1,2 @@
-export { T as default } from '../../Tabs-74d1ea8a.js';
-import '../../_rollupPluginBabelHelpers-c245b26a.js';
-import 'lodash';
-import '../../defaultTheme-1bcc2541.js';
-import 'styled-components';
-import 'react';
-import '../../Tab-04d435c3.js';
+export { default } from './Tabs.js';
+//# sourceMappingURL=index.js.map

package/build/data/Tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/{Tooltip-c1d1199e.js → data/Tooltip/Tooltip.js}

@@ -1,29 +1,7 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
-import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import PropTypes from 'prop-types';
 import React__default from 'react';
-import styled from 'styled-components';
-import TippyTooltip from '@tippyjs/react';
-import './shift-away-subtle-0dd94a03.js';
-
-const Tooltip$1 = styled(TippyTooltip).attrs(applyDefaultTheme)`
-  font-family: ${props => props.theme.primaryFontFamily};
-  font-size: 1rem;
-  font-weight: 400;
-  background: ${props => props.theme.getColor('gray-700')};
-  border-radius: 3px;
-  pointer-events: default !important;
-  .tippy-content {
-    padding: 9px 12px;
-  }
-
-  .tippy-arrow {
-    color: ${props => props.theme.getColor('gray-700')};
-  }
-
-  a {
-    color: inherit;
-  }
-`;
+import { Tooltip as Tooltip$1 } from './Tooltip.styled.js';
 
 const Tooltip = React__default.forwardRef(function Tooltip({
   content,
@@ -62,4 +40,5 @@ Tooltip.propTypes = process.env.NODE_ENV !== "production" ? {
   children: PropTypes.node
 } : {};
 
-export { Tooltip as T };
+export { Tooltip as default };
+//# sourceMappingURL=Tooltip.js.map

package/build/data/Tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../../src/components/data/Tooltip/Tooltip.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\nimport * as S from './Tooltip.styled';\n\n/**\n * Tooltips display informative text when users hover over, focus on, or tap an element.\n *\n * ### Import\n *\n * ``` js\n * import { Tooltip } from '@ntbjs/react-components/data'\n * // or\n * import Tooltip from '@ntbjs/react-components/data/Tooltip'\n * ```\n */\nconst Tooltip = React.forwardRef(function Tooltip(\n  { content, interactive, placement, duration, trigger, visible, children, ...props },\n  ref\n) {\n  return (\n    <div>\n      <S.Tooltip\n        ref={ref}\n        content={content}\n        interactive={interactive}\n        placement={placement}\n        duration={duration}\n        trigger={trigger}\n        visible={visible}\n        animation={'shift-away-subtle'}\n        {...props}\n      >\n        {children}\n      </S.Tooltip>\n    </div>\n  );\n});\n\nTooltip.defaultProps = {\n  content: 'Tooltip',\n  interactive: false,\n  placement: 'top',\n  duration: 350\n};\n\n/**\n * https://atomiks.github.io/tippyjs/v6/all-props/\n * @type {{content: Validator<NonNullable<string>>}}\n */\nTooltip.propTypes = {\n  /**\n   * The content of the `Tooltip`.\n   *\n   * **NB!** If the content is a `string`, it should be [wrapped in a tag](https://github.com/atomiks/tippyjs-react/issues/283#issuecomment-1268986001), e.g.:\n   *\n   * `<span>{content}</span>`.\n   */\n  content: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n\n  /**\n   * Determines if the tippy has interactive content inside of it, so that it can be\n   * hovered over and clicked inside without hiding.\n   */\n  interactive: PropTypes.bool,\n\n  /**\n   * The preferred placement of the tippy. Note that Popper's flip modifier can change\n   * this to the opposite placement if it has more space.\n   */\n  placement: PropTypes.oneOf([\n    'top',\n    'top-start',\n    'top-end',\n    'right',\n    'right-start',\n    'right-end',\n    'bottom',\n    'bottom-start',\n    'bottom-end',\n    'left',\n    'left-start',\n    'left-end',\n    'auto',\n    'auto-start',\n    'auto-end'\n  ]),\n  /**\n   * Duration in ms of the transition animation.\n   */\n  duration: PropTypes.number,\n\n  /**\n   * Determines the events that cause the tippy to show. Multiple event names are separated by\n   * spaces.\n   *\n   * *Example events:*\n   *\n   * `trigger: 'click'`\n   *\n   * `trigger: 'focusin'`\n   *\n   * `trigger: 'mouseenter click'`\n   *\n   * `trigger: 'mouseenter'`\n   *\n   * --\n   */\n  trigger: PropTypes.oneOf([\n    'mouseenter',\n    'mouseenter focus',\n    'click',\n    'focusin',\n    'mouseenter click',\n    ''\n  ]),\n  /**\n   * Determines if the tippy is visible without trigger\n   */\n  visible: PropTypes.bool,\n\n  children: PropTypes.node\n};\n\nexport default Tooltip;\n"],"names":["Tooltip","React","forwardRef","content","interactive","placement","duration","trigger","visible","children","props","ref","createElement","S","_extends","animation","defaultProps","propTypes","process","env","NODE_ENV","PropTypes","oneOfType","string","element","isRequired","bool","oneOf","number","node"],"mappings":";;;;;AAeMA,MAAAA,OAAO,GAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,OAAOA,CAC/C;EAAEG,OAAO;EAAEC,WAAW;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;EAAEC,OAAO;EAAEC,QAAQ;EAAE,GAAGC,KAAAA;AAAM,CAAC,EACnFC,GAAG,EACH;AACA,EAAA,OACEV,cAAA,CAAAW,aAAA,CAAA,KAAA,EAAA,IAAA,EACEX,cAAA,CAAAW,aAAA,CAACC,SAAS,EAAAC,QAAA,CAAA;AACRH,IAAAA,GAAG,EAAEA,GAAI;AACTR,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,WAAW,EAAEA,WAAY;AACzBC,IAAAA,SAAS,EAAEA,SAAU;AACrBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBO,IAAAA,SAAS,EAAE,mBAAA;AAAoB,GAAA,EAC3BL,KAAK,CAAA,EAERD,QACQ,CACR,CAAC,CAAA;AAEV,CAAC,EAAC;AAEFT,OAAO,CAACgB,YAAY,GAAG;AACrBb,EAAAA,OAAO,EAAE,SAAS;AAClBC,EAAAA,WAAW,EAAE,KAAK;AAClBC,EAAAA,SAAS,EAAE,KAAK;AAChBC,EAAAA,QAAQ,EAAE,GAAA;AACZ,CAAC,CAAA;AAMDN,OAAO,CAACiB,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAG,YAAA,GAAA;AAQlBjB,EAAAA,OAAO,EAAEkB,SAAS,CAACC,SAAS,CAAC,CAACD,SAAS,CAACE,MAAM,EAAEF,SAAS,CAACG,OAAO,CAAC,CAAC,CAACC,UAAU;EAM9ErB,WAAW,EAAEiB,SAAS,CAACK,IAAI;AAM3BrB,EAAAA,SAAS,EAAEgB,SAAS,CAACM,KAAK,CAAC,CACzB,KAAK,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,aAAa,EACb,WAAW,EACX,QAAQ,EACR,cAAc,EACd,YAAY,EACZ,MAAM,EACN,YAAY,EACZ,UAAU,EACV,MAAM,EACN,YAAY,EACZ,UAAU,CACX,CAAC;EAIFrB,QAAQ,EAAEe,SAAS,CAACO,MAAM;AAkB1BrB,EAAAA,OAAO,EAAEc,SAAS,CAACM,KAAK,CAAC,CACvB,YAAY,EACZ,kBAAkB,EAClB,OAAO,EACP,SAAS,EACT,kBAAkB,EAClB,EAAE,CACH,CAAC;EAIFnB,OAAO,EAAEa,SAAS,CAACK,IAAI;EAEvBjB,QAAQ,EAAEY,SAAS,CAACQ,IAAAA;AACtB,CAAC,GAAA,EAAA;;;;"}

package/build/data/Tooltip/Tooltip.styled.js

@@ -0,0 +1,28 @@
+import styled from 'styled-components';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
+import TippyTooltip from '@tippyjs/react';
+import 'tippy.js/animations/shift-away-subtle.css';
+import 'tippy.js/dist/tippy.css';
+
+const Tooltip = styled(TippyTooltip).attrs(applyDefaultTheme)`
+  font-family: ${props => props.theme.primaryFontFamily};
+  font-size: 1rem;
+  font-weight: 400;
+  background: ${props => props.theme.getColor('gray-700')};
+  border-radius: 3px;
+  pointer-events: default !important;
+  .tippy-content {
+    padding: 9px 12px;
+  }
+
+  .tippy-arrow {
+    color: ${props => props.theme.getColor('gray-700')};
+  }
+
+  a {
+    color: inherit;
+  }
+`;
+
+export { Tooltip };
+//# sourceMappingURL=Tooltip.styled.js.map

package/build/data/Tooltip/Tooltip.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.styled.js","sources":["../../../src/components/data/Tooltip/Tooltip.styled.js"],"sourcesContent":["import styled from 'styled-components';\nimport { applyDefaultTheme } from '../../../utils/defaultTheme';\n\nimport Tippy from '@tippyjs/react';\nimport 'tippy.js/animations/shift-away-subtle.css';\nimport 'tippy.js/dist/tippy.css';\n\nexport const Tooltip = styled(Tippy).attrs(applyDefaultTheme)`\n  font-family: ${props => props.theme.primaryFontFamily};\n  font-size: 1rem;\n  font-weight: 400;\n  background: ${props => props.theme.getColor('gray-700')};\n  border-radius: 3px;\n  pointer-events: default !important;\n  .tippy-content {\n    padding: 9px 12px;\n  }\n\n  .tippy-arrow {\n    color: ${props => props.theme.getColor('gray-700')};\n  }\n\n  a {\n    color: inherit;\n  }\n`;\n"],"names":["Tooltip","styled","Tippy","attrs","applyDefaultTheme","props","theme","primaryFontFamily","getColor"],"mappings":";;;;;;AAOO,MAAMA,OAAO,GAAGC,MAAM,CAACC,YAAK,CAAC,CAACC,KAAK,CAACC,iBAAiB,CAAC,CAAA;AAC7D,eAAA,EAAiBC,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACC,iBAAiB,CAAA;AACvD;AACA;AACA,cAAgBF,EAAAA,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,CAAA;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAaH,EAAAA,KAAK,IAAIA,KAAK,CAACC,KAAK,CAACE,QAAQ,CAAC,UAAU,CAAC,CAAA;AACtD;AACA;AACA;AACA;AACA;AACA;;;;"}

package/build/data/Tooltip/index.js

@@ -1,7 +1,2 @@
-export { T as default } from '../../Tooltip-c1d1199e.js';
-import '../../_rollupPluginBabelHelpers-c245b26a.js';
-import '../../defaultTheme-1bcc2541.js';
-import 'styled-components';
-import 'react';
-import '@tippyjs/react';
-import '../../shift-away-subtle-0dd94a03.js';
+export { default } from './Tooltip.js';
+//# sourceMappingURL=index.js.map

package/build/data/Tooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/data/VerificationStatusIcon/VerificationStatusIcon.js

@@ -0,0 +1,36 @@
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { VerificationIconWrapper, VerificationStatusIcon as VerificationStatusIcon$1, VerificationStatusColor } from './VerificationStatusIcon.styled.js';
+import { ReactComponent as SvgVerification } from '../../icons/verification.svg.js';
+
+const VerificationStatusIcon = React__default.forwardRef(function VerificationStatusIcon({
+  status,
+  iconHeight,
+  background,
+  ...props
+}, forwardedRef) {
+  return React__default.createElement(VerificationIconWrapper, {
+    background: background
+  }, React__default.createElement(VerificationStatusIcon$1, _extends({
+    iconHeight: iconHeight,
+    background: background,
+    ref: forwardedRef
+  }, props), React__default.createElement(SvgVerification, null), React__default.createElement(VerificationStatusColor, {
+    iconHeight: iconHeight,
+    status: status,
+    background: background
+  })));
+});
+VerificationStatusIcon.propTypes = process.env.NODE_ENV !== "production" ? {
+  status: PropTypes.oneOf(['verified', 'pending', 'rejected', 'mixed']).isRequired,
+  iconHeight: PropTypes.number,
+  background: PropTypes.bool
+} : {};
+VerificationStatusIcon.defaultProps = {
+  iconHeight: 15,
+  background: false
+};
+
+export { VerificationStatusIcon as default };
+//# sourceMappingURL=VerificationStatusIcon.js.map

package/build/data/VerificationStatusIcon/VerificationStatusIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerificationStatusIcon.js","sources":["../../../src/components/data/VerificationStatusIcon/VerificationStatusIcon.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport * as S from './VerificationStatusIcon.styled';\nimport { VerificationIcon } from '../../../icons';\n\n/**\n * A compact icon showing verification status with color coding.\n *\n * ### Import\n *\n * ``` js\n * import { VerificationStatusIcon } from '@ntbjs/react-components/data'\n * // or\n * import VerificationStatusIcon from '@ntbjs/react-components/data/VerificationStatusIcon'\n * ```\n *\n * ### Props\n * ```\n * Pass one of \"verified\", \"pending\" or \"rejected\" to `status` to display the correct verification status.\n * Pass `iconHeight={15}` to set the height of the icon in pixel\n * ```\n */\nconst VerificationStatusIcon = React.forwardRef(function VerificationStatusIcon(\n  { status, iconHeight, background, ...props },\n  forwardedRef\n) {\n  return (\n    <S.VerificationIconWrapper background={background}>\n      <S.VerificationStatusIcon\n        iconHeight={iconHeight}\n        background={background}\n        ref={forwardedRef}\n        {...props}\n      >\n        <VerificationIcon />\n        <S.VerificationStatusColor\n          iconHeight={iconHeight}\n          status={status}\n          background={background}\n        />\n      </S.VerificationStatusIcon>\n    </S.VerificationIconWrapper>\n  );\n});\n\nVerificationStatusIcon.propTypes = {\n  /**\n   * Status of the verification\n   */\n  status: PropTypes.oneOf(['verified', 'pending', 'rejected', 'mixed']).isRequired,\n  /**\n   * Custom height of the icon\n   */\n  iconHeight: PropTypes.number,\n  /**\n   * If Icon has background\n   */\n  background: PropTypes.bool\n};\n\nVerificationStatusIcon.defaultProps = {\n  iconHeight: 15,\n  background: false\n};\n\nexport default VerificationStatusIcon;\n"],"names":["VerificationStatusIcon","React","forwardRef","status","iconHeight","background","props","forwardedRef","createElement","S","_extends","ref","VerificationIcon","propTypes","process","env","NODE_ENV","PropTypes","oneOf","isRequired","number","bool","defaultProps"],"mappings":";;;;;;AAsBMA,MAAAA,sBAAsB,GAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,sBAAsBA,CAC7E;EAAEG,MAAM;EAAEC,UAAU;EAAEC,UAAU;EAAE,GAAGC,KAAAA;AAAM,CAAC,EAC5CC,YAAY,EACZ;AACA,EAAA,OACEN,cAAA,CAAAO,aAAA,CAACC,uBAAyB,EAAA;AAACJ,IAAAA,UAAU,EAAEA,UAAAA;GACrCJ,EAAAA,cAAA,CAAAO,aAAA,CAACC,wBAAwB,EAAAC,QAAA,CAAA;AACvBN,IAAAA,UAAU,EAAEA,UAAW;AACvBC,IAAAA,UAAU,EAAEA,UAAW;AACvBM,IAAAA,GAAG,EAAEJ,YAAAA;AAAa,GAAA,EACdD,KAAK,CAETL,EAAAA,cAAA,CAAAO,aAAA,CAACI,eAAgB,EAAA,IAAE,CAAC,EACpBX,cAAA,CAAAO,aAAA,CAACC,uBAAyB,EAAA;AACxBL,IAAAA,UAAU,EAAEA,UAAW;AACvBD,IAAAA,MAAM,EAAEA,MAAO;AACfE,IAAAA,UAAU,EAAEA,UAAAA;GACb,CACuB,CACD,CAAC,CAAA;AAEhC,CAAC,EAAC;AAEFL,sBAAsB,CAACa,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAG,YAAA,GAAA;AAIjCb,EAAAA,MAAM,EAAEc,SAAS,CAACC,KAAK,CAAC,CAAC,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAACC,UAAU;EAIhFf,UAAU,EAAEa,SAAS,CAACG,MAAM;EAI5Bf,UAAU,EAAEY,SAAS,CAACI,IAAAA;AACxB,CAAC,GAAA,EAAA,CAAA;AAEDrB,sBAAsB,CAACsB,YAAY,GAAG;AACpClB,EAAAA,UAAU,EAAE,EAAE;AACdC,EAAAA,UAAU,EAAE,KAAA;AACd,CAAC;;;;"}

package/build/data/VerificationStatusIcon/VerificationStatusIcon.styled.js

@@ -0,0 +1,53 @@
+import styled, { css } from 'styled-components';
+import { applyDefaultTheme } from '../../utils/defaultTheme.js';
+
+const VerificationIconWrapper = styled.div.attrs(applyDefaultTheme)`
+  ${props => props.background && css`
+    background-color: #000 !important;
+    width: fit-content;
+    padding: 6px 14px 6px 9px;
+    border-radius: 15px;
+}
+    `};
+`;
+const VerificationStatusIcon = styled.div.attrs(applyDefaultTheme)`
+  display: flex;
+  position: relative;
+  font: normal normal normal 12px/16px Roboto;
+  ${props => props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700'))};
+
+  ${props => props.background && props.theme.themeProp('color', props.theme.getColor('gray-100'), props.theme.getColor('gray-100'))};
+
+  svg {
+    height: ${props => props.iconHeight ?? 15}px;
+  }
+`;
+const VerificationStatusColor = styled.div.attrs(applyDefaultTheme)`
+  position: absolute;
+  bottom: 0;
+  left: ${props => (props.iconHeight ?? 15) * 2 / 3}px;
+  width: ${props => (props.iconHeight ?? 15) * 2 / 3}px;
+  height: ${props => (props.iconHeight ?? 15) * 2 / 3}px;
+  border-radius: 50%;
+  ${props => {
+  let darkThemeColor = props.theme.getColor('gray-100');
+  let lightThemeColor = props.theme.getColor('gray-500');
+  if (props.status === 'verified') {
+    darkThemeColor = props.theme.getColor('emerald-500');
+    lightThemeColor = props.theme.getColor('emerald-500');
+  } else if (props.status === 'pending') {
+    darkThemeColor = props.theme.getColor('signal-yellow-500');
+    lightThemeColor = props.theme.getColor('signal-yellow-500');
+  } else if (props.status === 'rejected') {
+    darkThemeColor = props.theme.getColor('red-600');
+    lightThemeColor = props.theme.getColor('red-600');
+  } else if (props.status === 'mixed') {
+    darkThemeColor = '#008CDB';
+    lightThemeColor = '#008CDB';
+  }
+  return props.theme.themeProp('background-color', darkThemeColor, lightThemeColor);
+}};
+`;
+
+export { VerificationIconWrapper, VerificationStatusColor, VerificationStatusIcon };
+//# sourceMappingURL=VerificationStatusIcon.styled.js.map