@transferwise/components 46.45.0 → 46.46.1

package/build/tabs/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../src/tabs/utils.js"],"sourcesContent":["const MIN_SWIPE_DISTANCE = 50;\nconst MIN_SWIPE_VELOCITY = 0.1;\n\nconst swipedSignificantDistance = (difference) => Math.abs(difference) > MIN_SWIPE_DISTANCE;\n\nconst swipedWithSignificantVelocity = (velocity) => velocity > MIN_SWIPE_VELOCITY;\n\nexport const getSwipeVelocity = (start, end) => {\n  const timePassed = end.time - start.time;\n\n  return getSwipeDifference(start, end) / timePassed;\n};\n\nexport const getSwipeDifference = (start, end, axis = 'x') => {\n  return Math.abs(start[axis] - end[axis]);\n};\n\nexport const swipedLeftToRight = (start, end) => {\n  return end.x > start.x;\n};\n\nexport const swipedRightToLeft = (start, end) => {\n  return start.x > end.x;\n};\n\nexport const swipeShouldChangeTab = (start, end) => {\n  const difference = getSwipeDifference(start, end);\n  const velocity = getSwipeVelocity(start, end);\n\n  return swipedSignificantDistance(difference) && swipedWithSignificantVelocity(velocity);\n};\n\nexport function getVelocity(coords) {\n  try {\n    const relevant = coords.slice(Math.max(coords.length - 5, 1));\n    const first = relevant[0];\n    const last = relevant[relevant.length - 1];\n\n    return Math.abs(first.x - last.x) / (last.time - first.time);\n  } catch {\n    return 0;\n  }\n}\n\n/*\n  `elasticDrag` is the translateX value, which slows down as the difference increases\n  `1 - Math.E ** (-0.005 * difference)` provides a % value of how far we want to translate (0.005 being the rate)\n  `Math.min(150, window.innerWidth / 3)` provides the maximum translate value\n*/\nexport const getElasticDragDifference = (difference) =>\n  Math.min(150, window.innerWidth / 3) * (1 - Math.E ** (-0.005 * difference));\n"],"names":["MIN_SWIPE_DISTANCE","MIN_SWIPE_VELOCITY","swipedSignificantDistance","difference","Math","abs","swipedWithSignificantVelocity","velocity","getSwipeVelocity","start","end","timePassed","time","getSwipeDifference","axis","swipedLeftToRight","x","swipedRightToLeft","swipeShouldChangeTab","getVelocity","coords","relevant","slice","max","length","first","last","getElasticDragDifference","min","window","innerWidth","E"],"mappings":";;AAAA,MAAMA,kBAAkB,GAAG,EAAE,CAAA;AAC7B,MAAMC,kBAAkB,GAAG,GAAG,CAAA;AAE9B,MAAMC,yBAAyB,GAAIC,UAAU,IAAKC,IAAI,CAACC,GAAG,CAACF,UAAU,CAAC,GAAGH,kBAAkB,CAAA;AAE3F,MAAMM,6BAA6B,GAAIC,QAAQ,IAAKA,QAAQ,GAAGN,kBAAkB,CAAA;MAEpEO,gBAAgB,GAAGA,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC9C,MAAMC,UAAU,GAAGD,GAAG,CAACE,IAAI,GAAGH,KAAK,CAACG,IAAI,CAAA;AAExC,EAAA,OAAOC,kBAAkB,CAACJ,KAAK,EAAEC,GAAG,CAAC,GAAGC,UAAU,CAAA;AACpD,EAAC;AAEM,MAAME,kBAAkB,GAAGA,CAACJ,KAAK,EAAEC,GAAG,EAAEI,IAAI,GAAG,GAAG,KAAK;AAC5D,EAAA,OAAOV,IAAI,CAACC,GAAG,CAACI,KAAK,CAACK,IAAI,CAAC,GAAGJ,GAAG,CAACI,IAAI,CAAC,CAAC,CAAA;AAC1C,EAAC;MAEYC,iBAAiB,GAAGA,CAACN,KAAK,EAAEC,GAAG,KAAK;AAC/C,EAAA,OAAOA,GAAG,CAACM,CAAC,GAAGP,KAAK,CAACO,CAAC,CAAA;AACxB,EAAC;MAEYC,iBAAiB,GAAGA,CAACR,KAAK,EAAEC,GAAG,KAAK;AAC/C,EAAA,OAAOD,KAAK,CAACO,CAAC,GAAGN,GAAG,CAACM,CAAC,CAAA;AACxB,EAAC;MAEYE,oBAAoB,GAAGA,CAACT,KAAK,EAAEC,GAAG,KAAK;AAClD,EAAA,MAAMP,UAAU,GAAGU,kBAAkB,CAACJ,KAAK,EAAEC,GAAG,CAAC,CAAA;AACjD,EAAA,MAAMH,QAAQ,GAAGC,gBAAgB,CAACC,KAAK,EAAEC,GAAG,CAAC,CAAA;EAE7C,OAAOR,yBAAyB,CAACC,UAAU,CAAC,IAAIG,6BAA6B,CAACC,QAAQ,CAAC,CAAA;AACzF,EAAC;AAEM,SAASY,WAAWA,CAACC,MAAM,EAAE;EAClC,IAAI;AACF,IAAA,MAAMC,QAAQ,GAAGD,MAAM,CAACE,KAAK,CAAClB,IAAI,CAACmB,GAAG,CAACH,MAAM,CAACI,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;AAC7D,IAAA,MAAMC,KAAK,GAAGJ,QAAQ,CAAC,CAAC,CAAC,CAAA;IACzB,MAAMK,IAAI,GAAGL,QAAQ,CAACA,QAAQ,CAACG,MAAM,GAAG,CAAC,CAAC,CAAA;IAE1C,OAAOpB,IAAI,CAACC,GAAG,CAACoB,KAAK,CAACT,CAAC,GAAGU,IAAI,CAACV,CAAC,CAAC,IAAIU,IAAI,CAACd,IAAI,GAAGa,KAAK,CAACb,IAAI,CAAC,CAAA;AAC9D,GAAC,CAAC,MAAM;AACN,IAAA,OAAO,CAAC,CAAA;AACV,GAAA;AACF,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACae,MAAAA,wBAAwB,GAAIxB,UAAU,IACjDC,IAAI,CAACwB,GAAG,CAAC,GAAG,EAAEC,MAAM,CAACC,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG1B,IAAI,CAAC2B,CAAC,KAAK,CAAC,KAAK,GAAG5B,UAAU,CAAC;;;;;;;;;;"}

package/build/tabs/utils.mjs

@@ -0,0 +1,42 @@
+const MIN_SWIPE_DISTANCE = 50;
+const MIN_SWIPE_VELOCITY = 0.1;
+const swipedSignificantDistance = difference => Math.abs(difference) > MIN_SWIPE_DISTANCE;
+const swipedWithSignificantVelocity = velocity => velocity > MIN_SWIPE_VELOCITY;
+const getSwipeVelocity = (start, end) => {
+  const timePassed = end.time - start.time;
+  return getSwipeDifference(start, end) / timePassed;
+};
+const getSwipeDifference = (start, end, axis = 'x') => {
+  return Math.abs(start[axis] - end[axis]);
+};
+const swipedLeftToRight = (start, end) => {
+  return end.x > start.x;
+};
+const swipedRightToLeft = (start, end) => {
+  return start.x > end.x;
+};
+const swipeShouldChangeTab = (start, end) => {
+  const difference = getSwipeDifference(start, end);
+  const velocity = getSwipeVelocity(start, end);
+  return swipedSignificantDistance(difference) && swipedWithSignificantVelocity(velocity);
+};
+function getVelocity(coords) {
+  try {
+    const relevant = coords.slice(Math.max(coords.length - 5, 1));
+    const first = relevant[0];
+    const last = relevant[relevant.length - 1];
+    return Math.abs(first.x - last.x) / (last.time - first.time);
+  } catch {
+    return 0;
+  }
+}
+
+/*
+  `elasticDrag` is the translateX value, which slows down as the difference increases
+  `1 - Math.E ** (-0.005 * difference)` provides a % value of how far we want to translate (0.005 being the rate)
+  `Math.min(150, window.innerWidth / 3)` provides the maximum translate value
+*/
+const getElasticDragDifference = difference => Math.min(150, window.innerWidth / 3) * (1 - Math.E ** (-0.005 * difference));
+
+export { getElasticDragDifference, getSwipeDifference, getSwipeVelocity, getVelocity, swipeShouldChangeTab, swipedLeftToRight, swipedRightToLeft };
+//# sourceMappingURL=utils.mjs.map

package/build/tabs/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","sources":["../../src/tabs/utils.js"],"sourcesContent":["const MIN_SWIPE_DISTANCE = 50;\nconst MIN_SWIPE_VELOCITY = 0.1;\n\nconst swipedSignificantDistance = (difference) => Math.abs(difference) > MIN_SWIPE_DISTANCE;\n\nconst swipedWithSignificantVelocity = (velocity) => velocity > MIN_SWIPE_VELOCITY;\n\nexport const getSwipeVelocity = (start, end) => {\n  const timePassed = end.time - start.time;\n\n  return getSwipeDifference(start, end) / timePassed;\n};\n\nexport const getSwipeDifference = (start, end, axis = 'x') => {\n  return Math.abs(start[axis] - end[axis]);\n};\n\nexport const swipedLeftToRight = (start, end) => {\n  return end.x > start.x;\n};\n\nexport const swipedRightToLeft = (start, end) => {\n  return start.x > end.x;\n};\n\nexport const swipeShouldChangeTab = (start, end) => {\n  const difference = getSwipeDifference(start, end);\n  const velocity = getSwipeVelocity(start, end);\n\n  return swipedSignificantDistance(difference) && swipedWithSignificantVelocity(velocity);\n};\n\nexport function getVelocity(coords) {\n  try {\n    const relevant = coords.slice(Math.max(coords.length - 5, 1));\n    const first = relevant[0];\n    const last = relevant[relevant.length - 1];\n\n    return Math.abs(first.x - last.x) / (last.time - first.time);\n  } catch {\n    return 0;\n  }\n}\n\n/*\n  `elasticDrag` is the translateX value, which slows down as the difference increases\n  `1 - Math.E ** (-0.005 * difference)` provides a % value of how far we want to translate (0.005 being the rate)\n  `Math.min(150, window.innerWidth / 3)` provides the maximum translate value\n*/\nexport const getElasticDragDifference = (difference) =>\n  Math.min(150, window.innerWidth / 3) * (1 - Math.E ** (-0.005 * difference));\n"],"names":["MIN_SWIPE_DISTANCE","MIN_SWIPE_VELOCITY","swipedSignificantDistance","difference","Math","abs","swipedWithSignificantVelocity","velocity","getSwipeVelocity","start","end","timePassed","time","getSwipeDifference","axis","swipedLeftToRight","x","swipedRightToLeft","swipeShouldChangeTab","getVelocity","coords","relevant","slice","max","length","first","last","getElasticDragDifference","min","window","innerWidth","E"],"mappings":"AAAA,MAAMA,kBAAkB,GAAG,EAAE,CAAA;AAC7B,MAAMC,kBAAkB,GAAG,GAAG,CAAA;AAE9B,MAAMC,yBAAyB,GAAIC,UAAU,IAAKC,IAAI,CAACC,GAAG,CAACF,UAAU,CAAC,GAAGH,kBAAkB,CAAA;AAE3F,MAAMM,6BAA6B,GAAIC,QAAQ,IAAKA,QAAQ,GAAGN,kBAAkB,CAAA;MAEpEO,gBAAgB,GAAGA,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC9C,MAAMC,UAAU,GAAGD,GAAG,CAACE,IAAI,GAAGH,KAAK,CAACG,IAAI,CAAA;AAExC,EAAA,OAAOC,kBAAkB,CAACJ,KAAK,EAAEC,GAAG,CAAC,GAAGC,UAAU,CAAA;AACpD,EAAC;AAEM,MAAME,kBAAkB,GAAGA,CAACJ,KAAK,EAAEC,GAAG,EAAEI,IAAI,GAAG,GAAG,KAAK;AAC5D,EAAA,OAAOV,IAAI,CAACC,GAAG,CAACI,KAAK,CAACK,IAAI,CAAC,GAAGJ,GAAG,CAACI,IAAI,CAAC,CAAC,CAAA;AAC1C,EAAC;MAEYC,iBAAiB,GAAGA,CAACN,KAAK,EAAEC,GAAG,KAAK;AAC/C,EAAA,OAAOA,GAAG,CAACM,CAAC,GAAGP,KAAK,CAACO,CAAC,CAAA;AACxB,EAAC;MAEYC,iBAAiB,GAAGA,CAACR,KAAK,EAAEC,GAAG,KAAK;AAC/C,EAAA,OAAOD,KAAK,CAACO,CAAC,GAAGN,GAAG,CAACM,CAAC,CAAA;AACxB,EAAC;MAEYE,oBAAoB,GAAGA,CAACT,KAAK,EAAEC,GAAG,KAAK;AAClD,EAAA,MAAMP,UAAU,GAAGU,kBAAkB,CAACJ,KAAK,EAAEC,GAAG,CAAC,CAAA;AACjD,EAAA,MAAMH,QAAQ,GAAGC,gBAAgB,CAACC,KAAK,EAAEC,GAAG,CAAC,CAAA;EAE7C,OAAOR,yBAAyB,CAACC,UAAU,CAAC,IAAIG,6BAA6B,CAACC,QAAQ,CAAC,CAAA;AACzF,EAAC;AAEM,SAASY,WAAWA,CAACC,MAAM,EAAE;EAClC,IAAI;AACF,IAAA,MAAMC,QAAQ,GAAGD,MAAM,CAACE,KAAK,CAAClB,IAAI,CAACmB,GAAG,CAACH,MAAM,CAACI,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,CAAA;AAC7D,IAAA,MAAMC,KAAK,GAAGJ,QAAQ,CAAC,CAAC,CAAC,CAAA;IACzB,MAAMK,IAAI,GAAGL,QAAQ,CAACA,QAAQ,CAACG,MAAM,GAAG,CAAC,CAAC,CAAA;IAE1C,OAAOpB,IAAI,CAACC,GAAG,CAACoB,KAAK,CAACT,CAAC,GAAGU,IAAI,CAACV,CAAC,CAAC,IAAIU,IAAI,CAACd,IAAI,GAAGa,KAAK,CAACb,IAAI,CAAC,CAAA;AAC9D,GAAC,CAAC,MAAM;AACN,IAAA,OAAO,CAAC,CAAA;AACV,GAAA;AACF,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACae,MAAAA,wBAAwB,GAAIxB,UAAU,IACjDC,IAAI,CAACwB,GAAG,CAAC,GAAG,EAAEC,MAAM,CAACC,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG1B,IAAI,CAAC2B,CAAC,KAAK,CAAC,KAAK,GAAG5B,UAAU,CAAC;;;;"}

package/build/textareaWithDisplayFormat/TextareaWithDisplayFormat.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var TextArea = require('../inputs/TextArea.js');
+var WithDisplayFormat = require('../withDisplayFormat/WithDisplayFormat.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+const TextareaWithDisplayFormat = props => /*#__PURE__*/jsxRuntime.jsx(WithDisplayFormat, {
+  ...props,
+  render: renderProps => /*#__PURE__*/jsxRuntime.jsx(TextArea.TextArea, {
+    ...renderProps
+  })
+});
+
+module.exports = TextareaWithDisplayFormat;
+//# sourceMappingURL=TextareaWithDisplayFormat.js.map

package/build/textareaWithDisplayFormat/TextareaWithDisplayFormat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaWithDisplayFormat.js","sources":["../../src/textareaWithDisplayFormat/TextareaWithDisplayFormat.tsx"],"sourcesContent":["import { TextArea, type TextAreaProps } from '../inputs/TextArea';\nimport WithDisplayFormat, { type WithDisplayFormatProps } from '../withDisplayFormat';\n\nexport interface TextareaWithDisplayFormatProps extends Omit<WithDisplayFormatProps, 'render'> {}\n\nconst TextareaWithDisplayFormat = (props: TextareaWithDisplayFormatProps) => (\n  <WithDisplayFormat<TextAreaProps>\n    {...props}\n    render={(renderProps) => <TextArea {...renderProps} />}\n  />\n);\n\nexport default TextareaWithDisplayFormat;\n"],"names":["TextareaWithDisplayFormat","props","_jsx","WithDisplayFormat","render","renderProps","TextArea"],"mappings":";;;;;;AAKA,MAAMA,yBAAyB,GAAIC,KAAqC,iBACtEC,cAAA,CAACC,iBAAiB,EAAA;AAAA,EAAA,GACZF,KAAK;AACTG,EAAAA,MAAM,EAAGC,WAAW,iBAAKH,cAAA,CAACI,iBAAQ,EAAA;IAAA,GAAKD,WAAAA;GAAY,CAAA;AAAI,CAAA;;;;"}

package/build/textareaWithDisplayFormat/TextareaWithDisplayFormat.mjs

@@ -0,0 +1,13 @@
+import { TextArea } from '../inputs/TextArea.mjs';
+import WithDisplayFormat from '../withDisplayFormat/WithDisplayFormat.mjs';
+import { jsx } from 'react/jsx-runtime';
+
+const TextareaWithDisplayFormat = props => /*#__PURE__*/jsx(WithDisplayFormat, {
+  ...props,
+  render: renderProps => /*#__PURE__*/jsx(TextArea, {
+    ...renderProps
+  })
+});
+
+export { TextareaWithDisplayFormat as default };
+//# sourceMappingURL=TextareaWithDisplayFormat.mjs.map

package/build/textareaWithDisplayFormat/TextareaWithDisplayFormat.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaWithDisplayFormat.mjs","sources":["../../src/textareaWithDisplayFormat/TextareaWithDisplayFormat.tsx"],"sourcesContent":["import { TextArea, type TextAreaProps } from '../inputs/TextArea';\nimport WithDisplayFormat, { type WithDisplayFormatProps } from '../withDisplayFormat';\n\nexport interface TextareaWithDisplayFormatProps extends Omit<WithDisplayFormatProps, 'render'> {}\n\nconst TextareaWithDisplayFormat = (props: TextareaWithDisplayFormatProps) => (\n  <WithDisplayFormat<TextAreaProps>\n    {...props}\n    render={(renderProps) => <TextArea {...renderProps} />}\n  />\n);\n\nexport default TextareaWithDisplayFormat;\n"],"names":["TextareaWithDisplayFormat","props","_jsx","WithDisplayFormat","render","renderProps","TextArea"],"mappings":";;;;AAKA,MAAMA,yBAAyB,GAAIC,KAAqC,iBACtEC,GAAA,CAACC,iBAAiB,EAAA;AAAA,EAAA,GACZF,KAAK;AACTG,EAAAA,MAAM,EAAGC,WAAW,iBAAKH,GAAA,CAACI,QAAQ,EAAA;IAAA,GAAKD,WAAAA;GAAY,CAAA;AAAI,CAAA;;;;"}

package/build/tile/Tile.js

@@ -0,0 +1,58 @@
+'use strict';
+
+var classNames = require('classnames');
+var Body = require('../body/Body.js');
+var Title = require('../title/Title.js');
+var jsxRuntime = require('react/jsx-runtime');
+var typography = require('../common/propsValues/typography.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+
+function Tile({
+  className,
+  description,
+  disabled,
+  href,
+  target,
+  media,
+  onClick,
+  size = 'md',
+  title
+}) {
+  const isSmall = size === 'sm';
+  const Element = href ? 'a' : 'button';
+  return /*#__PURE__*/jsxRuntime.jsxs(Element, {
+    className: classNames__default.default('decision', 'flex-column', 'np-tile', 'text-no-decoration', 'text-xs-center', className, {
+      'p-a-3': !isSmall,
+      'p-a-2 np-tile--small': isSmall
+    }, disabled && 'disabled'),
+    href: href,
+    target: target,
+    onClick: disabled ? undefined : onClick,
+    onKeyDown: disabled ? undefined : ({
+      key
+    }) => {
+      if (key === 'Enter' || key === ' ') {
+        onClick?.();
+      }
+    },
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "np-tile__media d-flex justify-content-center",
+      children: media
+    }), /*#__PURE__*/jsxRuntime.jsx(Title, {
+      type: typography.Typography.TITLE_SUBSECTION,
+      className: classNames__default.default(isSmall ? 'm-t-1' : 'm-t-2'),
+      children: title
+    }), description ? /*#__PURE__*/jsxRuntime.jsx(Body, {
+      as: "span",
+      type: typography.Typography.BODY_DEFAULT,
+      className: "m-t-1",
+      children: description
+    }) : null]
+  });
+}
+
+module.exports = Tile;
+//# sourceMappingURL=Tile.js.map

package/build/tile/Tile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tile.js","sources":["../../src/tile/Tile.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport Body from '../body';\nimport { Size, Typography } from '../common';\nimport Title from '../title';\n\nexport interface TileProps {\n  /** Classes to apply to the Tile container */\n  className?: string;\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  /** Accepts only Avatar and images */\n  media: React.ReactNode;\n  /** Function called onClick or onKeyDown */\n  onClick?: (event?: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;\n  /** The size applied to Tile */\n  size?: `${Size.SMALL | Size.MEDIUM}`;\n  title: React.ReactNode;\n}\n\nexport default function Tile({\n  className,\n  description,\n  disabled,\n  href,\n  target,\n  media,\n  onClick,\n  size = 'md',\n  title,\n}: TileProps) {\n  const isSmall = size === 'sm';\n  const Element = href ? 'a' : 'button';\n\n  return (\n    <Element\n      className={classNames(\n        'decision',\n        'flex-column',\n        'np-tile',\n        'text-no-decoration',\n        'text-xs-center',\n        className,\n        {\n          'p-a-3': !isSmall,\n          'p-a-2 np-tile--small': isSmall,\n        },\n        disabled && 'disabled',\n      )}\n      href={href}\n      target={target}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={\n        disabled\n          ? undefined\n          : ({ key }) => {\n              if (key === 'Enter' || key === ' ') {\n                onClick?.();\n              }\n            }\n      }\n    >\n      <div className=\"np-tile__media d-flex justify-content-center\">{media}</div>\n      <Title type={Typography.TITLE_SUBSECTION} className={classNames(isSmall ? 'm-t-1' : 'm-t-2')}>\n        {title}\n      </Title>\n      {description ? (\n        <Body as=\"span\" type={Typography.BODY_DEFAULT} className=\"m-t-1\">\n          {description}\n        </Body>\n      ) : null}\n    </Element>\n  );\n}\n"],"names":["Tile","className","description","disabled","href","target","media","onClick","size","title","isSmall","Element","_jsxs","classNames","undefined","onKeyDown","key","children","_jsx","Title","type","Typography","TITLE_SUBSECTION","Body","as","BODY_DEFAULT"],"mappings":";;;;;;;;;;;;AAsBc,SAAUA,IAAIA,CAAC;EAC3BC,SAAS;EACTC,WAAW;EACXC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,KAAK;EACLC,OAAO;AACPC,EAAAA,IAAI,GAAG,IAAI;AACXC,EAAAA,KAAAA;AACU,CAAA,EAAA;AACV,EAAA,MAAMC,OAAO,GAAGF,IAAI,KAAK,IAAI,CAAA;AAC7B,EAAA,MAAMG,OAAO,GAAGP,IAAI,GAAG,GAAG,GAAG,QAAQ,CAAA;EAErC,oBACEQ,eAAA,CAACD,OAAO,EAAA;AACNV,IAAAA,SAAS,EAAEY,2BAAU,CACnB,UAAU,EACV,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,gBAAgB,EAChBZ,SAAS,EACT;MACE,OAAO,EAAE,CAACS,OAAO;AACjB,MAAA,sBAAsB,EAAEA,OAAAA;AACzB,KAAA,EACDP,QAAQ,IAAI,UAAU,CACtB;AACFC,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfE,IAAAA,OAAO,EAAEJ,QAAQ,GAAGW,SAAS,GAAGP,OAAQ;AACxCQ,IAAAA,SAAS,EACPZ,QAAQ,GACJW,SAAS,GACT,CAAC;AAAEE,MAAAA,GAAAA;AAAG,KAAE,KAAI;AACV,MAAA,IAAIA,GAAG,KAAK,OAAO,IAAIA,GAAG,KAAK,GAAG,EAAE;AAClCT,QAAAA,OAAO,IAAI,CAAA;AACb,OAAA;KAEP;AAAAU,IAAAA,QAAA,gBAEDC,cAAA,CAAA,KAAA,EAAA;AAAKjB,MAAAA,SAAS,EAAC,8CAA8C;AAAAgB,MAAAA,QAAA,EAAEX,KAAAA;AAAK,KAAM,CAC1E,eAAAY,cAAA,CAACC,KAAK,EAAA;MAACC,IAAI,EAAEC,qBAAU,CAACC,gBAAiB;MAACrB,SAAS,EAAEY,2BAAU,CAACH,OAAO,GAAG,OAAO,GAAG,OAAO,CAAE;AAAAO,MAAAA,QAAA,EAC1FR,KAAAA;AAAK,KACD,CACP,EAACP,WAAW,gBACVgB,cAAA,CAACK,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACJ,IAAI,EAAEC,qBAAU,CAACI,YAAa;AAACxB,MAAAA,SAAS,EAAC,OAAO;AAAAgB,MAAAA,QAAA,EAC7Df,WAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACD,CAAC,CAAA;AAEd;;;;"}

package/build/tile/Tile.mjs

@@ -0,0 +1,52 @@
+import classNames from 'classnames';
+import Body from '../body/Body.mjs';
+import Title from '../title/Title.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Typography } from '../common/propsValues/typography.mjs';
+
+function Tile({
+  className,
+  description,
+  disabled,
+  href,
+  target,
+  media,
+  onClick,
+  size = 'md',
+  title
+}) {
+  const isSmall = size === 'sm';
+  const Element = href ? 'a' : 'button';
+  return /*#__PURE__*/jsxs(Element, {
+    className: classNames('decision', 'flex-column', 'np-tile', 'text-no-decoration', 'text-xs-center', className, {
+      'p-a-3': !isSmall,
+      'p-a-2 np-tile--small': isSmall
+    }, disabled && 'disabled'),
+    href: href,
+    target: target,
+    onClick: disabled ? undefined : onClick,
+    onKeyDown: disabled ? undefined : ({
+      key
+    }) => {
+      if (key === 'Enter' || key === ' ') {
+        onClick?.();
+      }
+    },
+    children: [/*#__PURE__*/jsx("div", {
+      className: "np-tile__media d-flex justify-content-center",
+      children: media
+    }), /*#__PURE__*/jsx(Title, {
+      type: Typography.TITLE_SUBSECTION,
+      className: classNames(isSmall ? 'm-t-1' : 'm-t-2'),
+      children: title
+    }), description ? /*#__PURE__*/jsx(Body, {
+      as: "span",
+      type: Typography.BODY_DEFAULT,
+      className: "m-t-1",
+      children: description
+    }) : null]
+  });
+}
+
+export { Tile as default };
+//# sourceMappingURL=Tile.mjs.map

package/build/tile/Tile.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tile.mjs","sources":["../../src/tile/Tile.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport Body from '../body';\nimport { Size, Typography } from '../common';\nimport Title from '../title';\n\nexport interface TileProps {\n  /** Classes to apply to the Tile container */\n  className?: string;\n  description?: React.ReactNode;\n  disabled?: boolean;\n  href?: string;\n  target?: React.HTMLAttributeAnchorTarget;\n  /** Accepts only Avatar and images */\n  media: React.ReactNode;\n  /** Function called onClick or onKeyDown */\n  onClick?: (event?: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;\n  /** The size applied to Tile */\n  size?: `${Size.SMALL | Size.MEDIUM}`;\n  title: React.ReactNode;\n}\n\nexport default function Tile({\n  className,\n  description,\n  disabled,\n  href,\n  target,\n  media,\n  onClick,\n  size = 'md',\n  title,\n}: TileProps) {\n  const isSmall = size === 'sm';\n  const Element = href ? 'a' : 'button';\n\n  return (\n    <Element\n      className={classNames(\n        'decision',\n        'flex-column',\n        'np-tile',\n        'text-no-decoration',\n        'text-xs-center',\n        className,\n        {\n          'p-a-3': !isSmall,\n          'p-a-2 np-tile--small': isSmall,\n        },\n        disabled && 'disabled',\n      )}\n      href={href}\n      target={target}\n      onClick={disabled ? undefined : onClick}\n      onKeyDown={\n        disabled\n          ? undefined\n          : ({ key }) => {\n              if (key === 'Enter' || key === ' ') {\n                onClick?.();\n              }\n            }\n      }\n    >\n      <div className=\"np-tile__media d-flex justify-content-center\">{media}</div>\n      <Title type={Typography.TITLE_SUBSECTION} className={classNames(isSmall ? 'm-t-1' : 'm-t-2')}>\n        {title}\n      </Title>\n      {description ? (\n        <Body as=\"span\" type={Typography.BODY_DEFAULT} className=\"m-t-1\">\n          {description}\n        </Body>\n      ) : null}\n    </Element>\n  );\n}\n"],"names":["Tile","className","description","disabled","href","target","media","onClick","size","title","isSmall","Element","_jsxs","classNames","undefined","onKeyDown","key","children","_jsx","Title","type","Typography","TITLE_SUBSECTION","Body","as","BODY_DEFAULT"],"mappings":";;;;;;AAsBc,SAAUA,IAAIA,CAAC;EAC3BC,SAAS;EACTC,WAAW;EACXC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,KAAK;EACLC,OAAO;AACPC,EAAAA,IAAI,GAAG,IAAI;AACXC,EAAAA,KAAAA;AACU,CAAA,EAAA;AACV,EAAA,MAAMC,OAAO,GAAGF,IAAI,KAAK,IAAI,CAAA;AAC7B,EAAA,MAAMG,OAAO,GAAGP,IAAI,GAAG,GAAG,GAAG,QAAQ,CAAA;EAErC,oBACEQ,IAAA,CAACD,OAAO,EAAA;AACNV,IAAAA,SAAS,EAAEY,UAAU,CACnB,UAAU,EACV,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,gBAAgB,EAChBZ,SAAS,EACT;MACE,OAAO,EAAE,CAACS,OAAO;AACjB,MAAA,sBAAsB,EAAEA,OAAAA;AACzB,KAAA,EACDP,QAAQ,IAAI,UAAU,CACtB;AACFC,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfE,IAAAA,OAAO,EAAEJ,QAAQ,GAAGW,SAAS,GAAGP,OAAQ;AACxCQ,IAAAA,SAAS,EACPZ,QAAQ,GACJW,SAAS,GACT,CAAC;AAAEE,MAAAA,GAAAA;AAAG,KAAE,KAAI;AACV,MAAA,IAAIA,GAAG,KAAK,OAAO,IAAIA,GAAG,KAAK,GAAG,EAAE;AAClCT,QAAAA,OAAO,IAAI,CAAA;AACb,OAAA;KAEP;AAAAU,IAAAA,QAAA,gBAEDC,GAAA,CAAA,KAAA,EAAA;AAAKjB,MAAAA,SAAS,EAAC,8CAA8C;AAAAgB,MAAAA,QAAA,EAAEX,KAAAA;AAAK,KAAM,CAC1E,eAAAY,GAAA,CAACC,KAAK,EAAA;MAACC,IAAI,EAAEC,UAAU,CAACC,gBAAiB;MAACrB,SAAS,EAAEY,UAAU,CAACH,OAAO,GAAG,OAAO,GAAG,OAAO,CAAE;AAAAO,MAAAA,QAAA,EAC1FR,KAAAA;AAAK,KACD,CACP,EAACP,WAAW,gBACVgB,GAAA,CAACK,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACJ,IAAI,EAAEC,UAAU,CAACI,YAAa;AAACxB,MAAAA,SAAS,EAAC,OAAO;AAAAgB,MAAAA,QAAA,EAC7Df,WAAAA;KACG,CAAC,GACL,IAAI,CAAA;AAAA,GACD,CAAC,CAAA;AAEd;;;;"}

package/build/title/Title.js

@@ -0,0 +1,42 @@
+'use strict';
+
+var classNames = require('classnames');
+var jsxRuntime = require('react/jsx-runtime');
+var typography = require('../common/propsValues/typography.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+
+const DEFAULT_TYPE = typography.Typography.TITLE_GROUP;
+const titleTypeMapping = {
+  [typography.Typography.TITLE_SCREEN]: 'h1',
+  [typography.Typography.TITLE_SECTION]: 'h2',
+  [typography.Typography.TITLE_SUBSECTION]: 'h3',
+  [typography.Typography.TITLE_BODY]: 'h4',
+  [typography.Typography.TITLE_GROUP]: 'h5'
+};
+function Title({
+  as,
+  type = DEFAULT_TYPE,
+  className,
+  ...props
+}) {
+  const mapping = titleTypeMapping[type];
+  const isTypeSupported = mapping !== undefined;
+  if (isTypeSupported) {
+    const HeaderTag = as ?? mapping;
+    return /*#__PURE__*/jsxRuntime.jsx(HeaderTag, {
+      ...props,
+      className: classNames__default.default(`np-text-${type}`, className)
+    });
+  }
+  const HeaderTag = as ?? titleTypeMapping[DEFAULT_TYPE];
+  return /*#__PURE__*/jsxRuntime.jsx(HeaderTag, {
+    ...props,
+    className: classNames__default.default(`np-text-${DEFAULT_TYPE}`, className)
+  });
+}
+
+module.exports = Title;
+//# sourceMappingURL=Title.js.map

package/build/title/Title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.js","sources":["../../src/title/Title.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { LabelHTMLAttributes, LiHTMLAttributes, ReactHTML } from 'react';\n\nimport { TitleTypes, Typography, Heading } from '../common';\n\nconst DEFAULT_TYPE = Typography.TITLE_GROUP;\n\nconst titleTypeMapping = {\n  [Typography.TITLE_SCREEN]: 'h1',\n  [Typography.TITLE_SECTION]: 'h2',\n  [Typography.TITLE_SUBSECTION]: 'h3',\n  [Typography.TITLE_BODY]: 'h4',\n  [Typography.TITLE_GROUP]: 'h5',\n} as const;\n\ntype Props = LabelHTMLAttributes<HTMLHeadingElement | HTMLSpanElement | HTMLLabelElement> &\n  LiHTMLAttributes<HTMLLIElement> & {\n    /**\n     * Default value will based one `type` prop\n     */\n    as?: 'span' | 'label' | 'li' | 'legend' | Heading;\n    /**\n     * Default value: {@link DEFAULT_TYPE}\n     */\n    type?: TitleTypes;\n  };\n\nfunction Title({ as, type = DEFAULT_TYPE, className, ...props }: Props) {\n  const mapping = titleTypeMapping[type];\n  const isTypeSupported = mapping !== undefined;\n  if (isTypeSupported) {\n    const HeaderTag = as ?? mapping;\n    return <HeaderTag {...props} className={classNames(`np-text-${type}`, className)} />;\n  }\n  const HeaderTag = as ?? titleTypeMapping[DEFAULT_TYPE];\n  return <HeaderTag {...props} className={classNames(`np-text-${DEFAULT_TYPE}`, className)} />;\n}\n\nexport default Title;\n"],"names":["DEFAULT_TYPE","Typography","TITLE_GROUP","titleTypeMapping","TITLE_SCREEN","TITLE_SECTION","TITLE_SUBSECTION","TITLE_BODY","Title","as","type","className","props","mapping","isTypeSupported","undefined","HeaderTag","_jsx","classNames"],"mappings":";;;;;;;;;;AAKA,MAAMA,YAAY,GAAGC,qBAAU,CAACC,WAAW,CAAA;AAE3C,MAAMC,gBAAgB,GAAG;AACvB,EAAA,CAACF,qBAAU,CAACG,YAAY,GAAG,IAAI;AAC/B,EAAA,CAACH,qBAAU,CAACI,aAAa,GAAG,IAAI;AAChC,EAAA,CAACJ,qBAAU,CAACK,gBAAgB,GAAG,IAAI;AACnC,EAAA,CAACL,qBAAU,CAACM,UAAU,GAAG,IAAI;EAC7B,CAACN,qBAAU,CAACC,WAAW,GAAG,IAAA;CAClB,CAAA;AAcV,SAASM,KAAKA,CAAC;EAAEC,EAAE;AAAEC,EAAAA,IAAI,GAAGV,YAAY;EAAEW,SAAS;EAAE,GAAGC,KAAAA;AAAc,CAAA,EAAA;AACpE,EAAA,MAAMC,OAAO,GAAGV,gBAAgB,CAACO,IAAI,CAAC,CAAA;AACtC,EAAA,MAAMI,eAAe,GAAGD,OAAO,KAAKE,SAAS,CAAA;AAC7C,EAAA,IAAID,eAAe,EAAE;AACnB,IAAA,MAAME,SAAS,GAAGP,EAAE,IAAII,OAAO,CAAA;IAC/B,oBAAOI,cAAA,CAACD,SAAS,EAAA;AAAA,MAAA,GAAKJ,KAAK;AAAED,MAAAA,SAAS,EAAEO,2BAAU,CAAC,WAAWR,IAAM,CAAA,CAAA,EAAEC,SAAS,CAAA;AAAE,MAAG,CAAA;AACtF,GAAA;AACA,EAAA,MAAMK,SAAS,GAAGP,EAAE,IAAIN,gBAAgB,CAACH,YAAY,CAAC,CAAA;EACtD,oBAAOiB,cAAA,CAACD,SAAS,EAAA;AAAA,IAAA,GAAKJ,KAAK;AAAED,IAAAA,SAAS,EAAEO,2BAAU,CAAC,WAAWlB,YAAc,CAAA,CAAA,EAAEW,SAAS,CAAA;AAAE,IAAG,CAAA;AAC9F;;;;"}

package/build/title/Title.mjs

@@ -0,0 +1,36 @@
+import classNames from 'classnames';
+import { jsx } from 'react/jsx-runtime';
+import { Typography } from '../common/propsValues/typography.mjs';
+
+const DEFAULT_TYPE = Typography.TITLE_GROUP;
+const titleTypeMapping = {
+  [Typography.TITLE_SCREEN]: 'h1',
+  [Typography.TITLE_SECTION]: 'h2',
+  [Typography.TITLE_SUBSECTION]: 'h3',
+  [Typography.TITLE_BODY]: 'h4',
+  [Typography.TITLE_GROUP]: 'h5'
+};
+function Title({
+  as,
+  type = DEFAULT_TYPE,
+  className,
+  ...props
+}) {
+  const mapping = titleTypeMapping[type];
+  const isTypeSupported = mapping !== undefined;
+  if (isTypeSupported) {
+    const HeaderTag = as ?? mapping;
+    return /*#__PURE__*/jsx(HeaderTag, {
+      ...props,
+      className: classNames(`np-text-${type}`, className)
+    });
+  }
+  const HeaderTag = as ?? titleTypeMapping[DEFAULT_TYPE];
+  return /*#__PURE__*/jsx(HeaderTag, {
+    ...props,
+    className: classNames(`np-text-${DEFAULT_TYPE}`, className)
+  });
+}
+
+export { Title as default };
+//# sourceMappingURL=Title.mjs.map

package/build/title/Title.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.mjs","sources":["../../src/title/Title.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { LabelHTMLAttributes, LiHTMLAttributes, ReactHTML } from 'react';\n\nimport { TitleTypes, Typography, Heading } from '../common';\n\nconst DEFAULT_TYPE = Typography.TITLE_GROUP;\n\nconst titleTypeMapping = {\n  [Typography.TITLE_SCREEN]: 'h1',\n  [Typography.TITLE_SECTION]: 'h2',\n  [Typography.TITLE_SUBSECTION]: 'h3',\n  [Typography.TITLE_BODY]: 'h4',\n  [Typography.TITLE_GROUP]: 'h5',\n} as const;\n\ntype Props = LabelHTMLAttributes<HTMLHeadingElement | HTMLSpanElement | HTMLLabelElement> &\n  LiHTMLAttributes<HTMLLIElement> & {\n    /**\n     * Default value will based one `type` prop\n     */\n    as?: 'span' | 'label' | 'li' | 'legend' | Heading;\n    /**\n     * Default value: {@link DEFAULT_TYPE}\n     */\n    type?: TitleTypes;\n  };\n\nfunction Title({ as, type = DEFAULT_TYPE, className, ...props }: Props) {\n  const mapping = titleTypeMapping[type];\n  const isTypeSupported = mapping !== undefined;\n  if (isTypeSupported) {\n    const HeaderTag = as ?? mapping;\n    return <HeaderTag {...props} className={classNames(`np-text-${type}`, className)} />;\n  }\n  const HeaderTag = as ?? titleTypeMapping[DEFAULT_TYPE];\n  return <HeaderTag {...props} className={classNames(`np-text-${DEFAULT_TYPE}`, className)} />;\n}\n\nexport default Title;\n"],"names":["DEFAULT_TYPE","Typography","TITLE_GROUP","titleTypeMapping","TITLE_SCREEN","TITLE_SECTION","TITLE_SUBSECTION","TITLE_BODY","Title","as","type","className","props","mapping","isTypeSupported","undefined","HeaderTag","_jsx","classNames"],"mappings":";;;;AAKA,MAAMA,YAAY,GAAGC,UAAU,CAACC,WAAW,CAAA;AAE3C,MAAMC,gBAAgB,GAAG;AACvB,EAAA,CAACF,UAAU,CAACG,YAAY,GAAG,IAAI;AAC/B,EAAA,CAACH,UAAU,CAACI,aAAa,GAAG,IAAI;AAChC,EAAA,CAACJ,UAAU,CAACK,gBAAgB,GAAG,IAAI;AACnC,EAAA,CAACL,UAAU,CAACM,UAAU,GAAG,IAAI;EAC7B,CAACN,UAAU,CAACC,WAAW,GAAG,IAAA;CAClB,CAAA;AAcV,SAASM,KAAKA,CAAC;EAAEC,EAAE;AAAEC,EAAAA,IAAI,GAAGV,YAAY;EAAEW,SAAS;EAAE,GAAGC,KAAAA;AAAc,CAAA,EAAA;AACpE,EAAA,MAAMC,OAAO,GAAGV,gBAAgB,CAACO,IAAI,CAAC,CAAA;AACtC,EAAA,MAAMI,eAAe,GAAGD,OAAO,KAAKE,SAAS,CAAA;AAC7C,EAAA,IAAID,eAAe,EAAE;AACnB,IAAA,MAAME,SAAS,GAAGP,EAAE,IAAII,OAAO,CAAA;IAC/B,oBAAOI,GAAA,CAACD,SAAS,EAAA;AAAA,MAAA,GAAKJ,KAAK;AAAED,MAAAA,SAAS,EAAEO,UAAU,CAAC,WAAWR,IAAM,CAAA,CAAA,EAAEC,SAAS,CAAA;AAAE,MAAG,CAAA;AACtF,GAAA;AACA,EAAA,MAAMK,SAAS,GAAGP,EAAE,IAAIN,gBAAgB,CAACH,YAAY,CAAC,CAAA;EACtD,oBAAOiB,GAAA,CAACD,SAAS,EAAA;AAAA,IAAA,GAAKJ,KAAK;AAAED,IAAAA,SAAS,EAAEO,UAAU,CAAC,WAAWlB,YAAc,CAAA,CAAA,EAAEW,SAAS,CAAA;AAAE,IAAG,CAAA;AAC9F;;;;"}

package/build/tooltip/Tooltip.js

@@ -0,0 +1,103 @@
+'use strict';
+
+var classNames = require('classnames');
+var React = require('react');
+var reactPopper = require('react-popper');
+var jsxRuntime = require('react/jsx-runtime');
+var position = require('../common/propsValues/position.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+const Tooltip = ({
+  position: position$1 = position.Position.TOP,
+  children = undefined,
+  label,
+  id,
+  className
+}) => {
+  const [open, setOpen] = React.useState(false);
+  const anchorReference = React.useRef(null);
+  const [arrowElement, setArrowElement] = React.useState(null);
+  const [popperElement, setPopperElement] = React.useState(null);
+  const fallbackId = React.useId();
+  const tooltipId = id ?? fallbackId;
+  const modifiers = [];
+  modifiers.push({
+    name: 'arrow',
+    options: {
+      element: arrowElement,
+      options: {
+        padding: 8 // 8px from the edges of the popper
+      }
+    }
+  });
+  // This lets you displace a popper element from its reference element.
+  modifiers.push({
+    name: 'offset',
+    options: {
+      offset: [0, 16]
+    }
+  });
+  modifiers.push({
+    name: 'flip',
+    options: {
+      fallbackPlacements: position.Position.TOP
+    }
+  });
+  const {
+    styles,
+    attributes,
+    forceUpdate
+  } = reactPopper.usePopper(anchorReference.current, popperElement, {
+    placement: position$1,
+    modifiers
+  });
+  // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),
+  // it is most simple just to always position before opening
+  React.useEffect(() => {
+    if (open && forceUpdate) {
+      forceUpdate();
+    }
+  }, [open]);
+  return /*#__PURE__*/jsxRuntime.jsxs("span", {
+    ref: anchorReference,
+    className: "tw-tooltip-container",
+    onMouseOver: () => setOpen(true),
+    onFocus: () => setOpen(true),
+    onMouseOut: () => setOpen(false),
+    onBlur: () => setOpen(false),
+    children: [children ? /*#__PURE__*/React.cloneElement(children, {
+      'aria-describedby': `${tooltipId}-tooltip`
+    }) : null, /*#__PURE__*/jsxRuntime.jsx("div", {
+      // @ts-expect-error
+      ref: setPopperElement,
+      className: classNames__default.default('np-tooltip', 'np-panel', open ? `np-panel--open np-tooltip--open` : null, className)
+      // eslint-disable-next-line react/forbid-dom-props
+      ,
+      style: {
+        ...styles.popper
+      },
+      ...attributes.popper,
+      "aria-hidden": !open,
+      role: "tooltip",
+      id: `${tooltipId}-tooltip`,
+      children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "np-panel__content tooltip-inner",
+        children: [label, /*#__PURE__*/jsxRuntime.jsx("div", {
+          // @ts-expect-error
+          ref: setArrowElement,
+          className: classNames__default.default('np-panel__arrow')
+          // eslint-disable-next-line react/forbid-dom-props
+          ,
+          style: styles.arrow
+        })]
+      })
+    })]
+  });
+};
+
+module.exports = Tooltip;
+//# sourceMappingURL=Tooltip.js.map

package/build/tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sources":["../../src/tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport classNames from 'classnames';\nimport {\n  AriaAttributes,\n  PropsWithChildren,\n  ReactElement,\n  ReactNode,\n  cloneElement,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { CommonProps, Position } from '../common';\nimport {\n  PositionBottom,\n  PositionLeft,\n  PositionRight,\n  PositionTop,\n} from '../common/propsValues/position';\n\nexport type TooltipProps = PropsWithChildren<{\n  position?: PositionTop | PositionRight | PositionBottom | PositionLeft;\n  label: ReactNode;\n  id?: string;\n}> &\n  CommonProps;\n\nconst Tooltip = ({\n  position = Position.TOP,\n  children = undefined,\n  label,\n  id,\n  className,\n}: TooltipProps) => {\n  const [open, setOpen] = useState(false);\n  const anchorReference = useRef(null);\n  const [arrowElement, setArrowElement] = useState(null);\n  const [popperElement, setPopperElement] = useState(null);\n\n  const fallbackId = useId();\n  const tooltipId = id ?? fallbackId;\n  const modifiers = [];\n\n  modifiers.push({\n    name: 'arrow',\n    options: {\n      element: arrowElement,\n      options: {\n        padding: 8, // 8px from the edges of the popper\n      },\n    },\n  });\n  // This lets you displace a popper element from its reference element.\n  modifiers.push({ name: 'offset', options: { offset: [0, 16] } });\n  modifiers.push({\n    name: 'flip',\n    options: {\n      fallbackPlacements: Position.TOP,\n    },\n  });\n\n  const { styles, attributes, forceUpdate } = usePopper(anchorReference.current, popperElement, {\n    placement: position,\n    modifiers,\n  });\n\n  // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n  // it is most simple just to always position before opening\n  useEffect(() => {\n    if (open && forceUpdate) {\n      forceUpdate();\n    }\n  }, [open]);\n\n  return (\n    <span\n      ref={anchorReference}\n      className=\"tw-tooltip-container\"\n      onMouseOver={() => setOpen(true)}\n      onFocus={() => setOpen(true)}\n      onMouseOut={() => setOpen(false)}\n      onBlur={() => setOpen(false)}\n    >\n      {children\n        ? cloneElement(children as ReactElement<Pick<AriaAttributes, 'aria-describedby'>>, {\n            'aria-describedby': `${tooltipId}-tooltip`,\n          })\n        : null}\n      <div\n        // @ts-expect-error\n        ref={setPopperElement}\n        className={classNames(\n          'np-tooltip',\n          'np-panel',\n          open ? `np-panel--open np-tooltip--open` : null,\n          className,\n        )}\n        // eslint-disable-next-line react/forbid-dom-props\n        style={{ ...styles.popper }}\n        {...attributes.popper}\n        aria-hidden={!open}\n        role=\"tooltip\"\n        id={`${tooltipId}-tooltip`}\n      >\n        <div className=\"np-panel__content tooltip-inner\">\n          {label}\n          <div\n            // @ts-expect-error\n            ref={setArrowElement}\n            className={classNames('np-panel__arrow')}\n            // eslint-disable-next-line react/forbid-dom-props\n            style={styles.arrow}\n          />\n        </div>\n      </div>\n    </span>\n  );\n};\n\nexport default Tooltip;\n"],"names":["Tooltip","position","Position","TOP","children","undefined","label","id","className","open","setOpen","useState","anchorReference","useRef","arrowElement","setArrowElement","popperElement","setPopperElement","fallbackId","useId","tooltipId","modifiers","push","name","options","element","padding","offset","fallbackPlacements","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","_jsxs","ref","onMouseOver","onFocus","onMouseOut","onBlur","cloneElement","_jsx","classNames","style","popper","role","arrow"],"mappings":";;;;;;;;;;;;AAAA;AA8BMA,MAAAA,OAAO,GAAGA,CAAC;YACfC,UAAQ,GAAGC,iBAAQ,CAACC,GAAG;AACvBC,EAAAA,QAAQ,GAAGC,SAAS;EACpBC,KAAK;EACLC,EAAE;AACFC,EAAAA,SAAAA;AACa,CAAA,KAAI;EACjB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC,CAAA;AACvC,EAAA,MAAMC,eAAe,GAAGC,YAAM,CAAC,IAAI,CAAC,CAAA;EACpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGJ,cAAQ,CAAC,IAAI,CAAC,CAAA;EACtD,MAAM,CAACK,aAAa,EAAEC,gBAAgB,CAAC,GAAGN,cAAQ,CAAC,IAAI,CAAC,CAAA;AAExD,EAAA,MAAMO,UAAU,GAAGC,WAAK,EAAE,CAAA;AAC1B,EAAA,MAAMC,SAAS,GAAGb,EAAE,IAAIW,UAAU,CAAA;EAClC,MAAMG,SAAS,GAAG,EAAE,CAAA;EAEpBA,SAAS,CAACC,IAAI,CAAC;AACbC,IAAAA,IAAI,EAAE,OAAO;AACbC,IAAAA,OAAO,EAAE;AACPC,MAAAA,OAAO,EAAEX,YAAY;AACrBU,MAAAA,OAAO,EAAE;QACPE,OAAO,EAAE,CAAC;AACX,OAAA;AACF,KAAA;AACF,GAAA,CAAC,CAAA;AACF;EACAL,SAAS,CAACC,IAAI,CAAC;AAAEC,IAAAA,IAAI,EAAE,QAAQ;AAAEC,IAAAA,OAAO,EAAE;AAAEG,MAAAA,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAA;AAAC,KAAA;AAAI,GAAA,CAAC,CAAA;EAChEN,SAAS,CAACC,IAAI,CAAC;AACbC,IAAAA,IAAI,EAAE,MAAM;AACZC,IAAAA,OAAO,EAAE;MACPI,kBAAkB,EAAE1B,iBAAQ,CAACC,GAAAA;AAC9B,KAAA;AACF,GAAA,CAAC,CAAA;EAEF,MAAM;IAAE0B,MAAM;IAAEC,UAAU;AAAEC,IAAAA,WAAAA;GAAa,GAAGC,qBAAS,CAACpB,eAAe,CAACqB,OAAO,EAAEjB,aAAa,EAAE;AAC5FkB,IAAAA,SAAS,EAAEjC,UAAQ;AACnBoB,IAAAA,SAAAA;AACD,GAAA,CAAC,CAAA;AAEF;AACA;AACAc,EAAAA,eAAS,CAAC,MAAK;IACb,IAAI1B,IAAI,IAAIsB,WAAW,EAAE;AACvBA,MAAAA,WAAW,EAAE,CAAA;AACf,KAAA;AACF,GAAC,EAAE,CAACtB,IAAI,CAAC,CAAC,CAAA;AAEV,EAAA,oBACE2B,eAAA,CAAA,MAAA,EAAA;AACEC,IAAAA,GAAG,EAAEzB,eAAgB;AACrBJ,IAAAA,SAAS,EAAC,sBAAsB;AAChC8B,IAAAA,WAAW,EAAEA,MAAM5B,OAAO,CAAC,IAAI,CAAE;AACjC6B,IAAAA,OAAO,EAAEA,MAAM7B,OAAO,CAAC,IAAI,CAAE;AAC7B8B,IAAAA,UAAU,EAAEA,MAAM9B,OAAO,CAAC,KAAK,CAAE;AACjC+B,IAAAA,MAAM,EAAEA,MAAM/B,OAAO,CAAC,KAAK,CAAE;AAAAN,IAAAA,QAAA,GAE5BA,QAAQ,gBACLsC,kBAAY,CAACtC,QAAkE,EAAE;MAC/E,kBAAkB,EAAK,GAAAgB,SAAmB,CAAA,QAAA,CAAA;KAC3C,CAAC,GACF,IAAI,eACRuB,cAAA,CAAA,KAAA,EAAA;AACE;AACAN,MAAAA,GAAG,EAAEpB,gBAAiB;AACtBT,MAAAA,SAAS,EAAEoC,2BAAU,CACnB,YAAY,EACZ,UAAU,EACVnC,IAAI,GAAoC,CAAA,+BAAA,CAAA,GAAG,IAAI,EAC/CD,SAAS,CAAA;AAEX;AAAA;AACAqC,MAAAA,KAAK,EAAE;AAAE,QAAA,GAAGhB,MAAM,CAACiB,MAAAA;OAAS;MAAA,GACxBhB,UAAU,CAACgB,MAAM;AACrB,MAAA,aAAA,EAAa,CAACrC,IAAK;AACnBsC,MAAAA,IAAI,EAAC,SAAS;MACdxC,EAAE,EAAE,CAAGa,EAAAA,SAAS,CAAW,QAAA,CAAA;AAAAhB,MAAAA,QAAA,eAE3BgC,eAAA,CAAA,KAAA,EAAA;AAAK5B,QAAAA,SAAS,EAAC,iCAAiC;QAAAJ,QAAA,EAAA,CAC7CE,KAAK,eACNqC,cAAA,CAAA,KAAA,EAAA;AACE;AACAN,UAAAA,GAAG,EAAEtB,eAAgB;UACrBP,SAAS,EAAEoC,2BAAU,CAAC,iBAAiB,CAAA;AACvC;AAAA;UACAC,KAAK,EAAEhB,MAAM,CAACmB,KAAAA;AAAM,SAExB,CAAA,CAAA;OAAK,CAAA;AACP,KAAK,CACP,CAAA;AAAA,GAAM,CAAC,CAAA;AAEX;;;;"}

package/build/tooltip/Tooltip.mjs

@@ -0,0 +1,97 @@
+import classNames from 'classnames';
+import { useState, useRef, useId, useEffect, cloneElement } from 'react';
+import { usePopper } from 'react-popper';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Position } from '../common/propsValues/position.mjs';
+
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+const Tooltip = ({
+  position = Position.TOP,
+  children = undefined,
+  label,
+  id,
+  className
+}) => {
+  const [open, setOpen] = useState(false);
+  const anchorReference = useRef(null);
+  const [arrowElement, setArrowElement] = useState(null);
+  const [popperElement, setPopperElement] = useState(null);
+  const fallbackId = useId();
+  const tooltipId = id ?? fallbackId;
+  const modifiers = [];
+  modifiers.push({
+    name: 'arrow',
+    options: {
+      element: arrowElement,
+      options: {
+        padding: 8 // 8px from the edges of the popper
+      }
+    }
+  });
+  // This lets you displace a popper element from its reference element.
+  modifiers.push({
+    name: 'offset',
+    options: {
+      offset: [0, 16]
+    }
+  });
+  modifiers.push({
+    name: 'flip',
+    options: {
+      fallbackPlacements: Position.TOP
+    }
+  });
+  const {
+    styles,
+    attributes,
+    forceUpdate
+  } = usePopper(anchorReference.current, popperElement, {
+    placement: position,
+    modifiers
+  });
+  // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),
+  // it is most simple just to always position before opening
+  useEffect(() => {
+    if (open && forceUpdate) {
+      forceUpdate();
+    }
+  }, [open]);
+  return /*#__PURE__*/jsxs("span", {
+    ref: anchorReference,
+    className: "tw-tooltip-container",
+    onMouseOver: () => setOpen(true),
+    onFocus: () => setOpen(true),
+    onMouseOut: () => setOpen(false),
+    onBlur: () => setOpen(false),
+    children: [children ? /*#__PURE__*/cloneElement(children, {
+      'aria-describedby': `${tooltipId}-tooltip`
+    }) : null, /*#__PURE__*/jsx("div", {
+      // @ts-expect-error
+      ref: setPopperElement,
+      className: classNames('np-tooltip', 'np-panel', open ? `np-panel--open np-tooltip--open` : null, className)
+      // eslint-disable-next-line react/forbid-dom-props
+      ,
+      style: {
+        ...styles.popper
+      },
+      ...attributes.popper,
+      "aria-hidden": !open,
+      role: "tooltip",
+      id: `${tooltipId}-tooltip`,
+      children: /*#__PURE__*/jsxs("div", {
+        className: "np-panel__content tooltip-inner",
+        children: [label, /*#__PURE__*/jsx("div", {
+          // @ts-expect-error
+          ref: setArrowElement,
+          className: classNames('np-panel__arrow')
+          // eslint-disable-next-line react/forbid-dom-props
+          ,
+          style: styles.arrow
+        })]
+      })
+    })]
+  });
+};
+
+export { Tooltip as default };
+//# sourceMappingURL=Tooltip.mjs.map

package/build/tooltip/Tooltip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.mjs","sources":["../../src/tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport classNames from 'classnames';\nimport {\n  AriaAttributes,\n  PropsWithChildren,\n  ReactElement,\n  ReactNode,\n  cloneElement,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n} from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { CommonProps, Position } from '../common';\nimport {\n  PositionBottom,\n  PositionLeft,\n  PositionRight,\n  PositionTop,\n} from '../common/propsValues/position';\n\nexport type TooltipProps = PropsWithChildren<{\n  position?: PositionTop | PositionRight | PositionBottom | PositionLeft;\n  label: ReactNode;\n  id?: string;\n}> &\n  CommonProps;\n\nconst Tooltip = ({\n  position = Position.TOP,\n  children = undefined,\n  label,\n  id,\n  className,\n}: TooltipProps) => {\n  const [open, setOpen] = useState(false);\n  const anchorReference = useRef(null);\n  const [arrowElement, setArrowElement] = useState(null);\n  const [popperElement, setPopperElement] = useState(null);\n\n  const fallbackId = useId();\n  const tooltipId = id ?? fallbackId;\n  const modifiers = [];\n\n  modifiers.push({\n    name: 'arrow',\n    options: {\n      element: arrowElement,\n      options: {\n        padding: 8, // 8px from the edges of the popper\n      },\n    },\n  });\n  // This lets you displace a popper element from its reference element.\n  modifiers.push({ name: 'offset', options: { offset: [0, 16] } });\n  modifiers.push({\n    name: 'flip',\n    options: {\n      fallbackPlacements: Position.TOP,\n    },\n  });\n\n  const { styles, attributes, forceUpdate } = usePopper(anchorReference.current, popperElement, {\n    placement: position,\n    modifiers,\n  });\n\n  // If the trigger is not visible when the position is calculated, it will be incorrect. Because this can happen repeatedly (on resize for example),\n  // it is most simple just to always position before opening\n  useEffect(() => {\n    if (open && forceUpdate) {\n      forceUpdate();\n    }\n  }, [open]);\n\n  return (\n    <span\n      ref={anchorReference}\n      className=\"tw-tooltip-container\"\n      onMouseOver={() => setOpen(true)}\n      onFocus={() => setOpen(true)}\n      onMouseOut={() => setOpen(false)}\n      onBlur={() => setOpen(false)}\n    >\n      {children\n        ? cloneElement(children as ReactElement<Pick<AriaAttributes, 'aria-describedby'>>, {\n            'aria-describedby': `${tooltipId}-tooltip`,\n          })\n        : null}\n      <div\n        // @ts-expect-error\n        ref={setPopperElement}\n        className={classNames(\n          'np-tooltip',\n          'np-panel',\n          open ? `np-panel--open np-tooltip--open` : null,\n          className,\n        )}\n        // eslint-disable-next-line react/forbid-dom-props\n        style={{ ...styles.popper }}\n        {...attributes.popper}\n        aria-hidden={!open}\n        role=\"tooltip\"\n        id={`${tooltipId}-tooltip`}\n      >\n        <div className=\"np-panel__content tooltip-inner\">\n          {label}\n          <div\n            // @ts-expect-error\n            ref={setArrowElement}\n            className={classNames('np-panel__arrow')}\n            // eslint-disable-next-line react/forbid-dom-props\n            style={styles.arrow}\n          />\n        </div>\n      </div>\n    </span>\n  );\n};\n\nexport default Tooltip;\n"],"names":["Tooltip","position","Position","TOP","children","undefined","label","id","className","open","setOpen","useState","anchorReference","useRef","arrowElement","setArrowElement","popperElement","setPopperElement","fallbackId","useId","tooltipId","modifiers","push","name","options","element","padding","offset","fallbackPlacements","styles","attributes","forceUpdate","usePopper","current","placement","useEffect","_jsxs","ref","onMouseOver","onFocus","onMouseOut","onBlur","cloneElement","_jsx","classNames","style","popper","role","arrow"],"mappings":"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"}