@algolia/satellite 1.0.0-beta.132 → 1.0.0-beta.135

package/cjs/Toggle/Toggle.tailwind.js

@@ -1,13 +1,11 @@
 "use strict";
 
 // @ts-check
-var rgba = require("../styles/rgba");
-/**
- * @type {import('../tailwind-types').TailwindPlugin}
- */
+var plugin = require("tailwindcss/plugin");
 
+var rgba = require("../styles/rgba");
 
-var buttonPlugin = function buttonPlugin(_ref) {
+var togglePlugin = plugin(function (_ref) {
   var addComponents = _ref.addComponents,
       theme = _ref.theme;
   var transition = "all 72ms ease-in-out";
@@ -15,16 +13,16 @@ var buttonPlugin = function buttonPlugin(_ref) {
     ".toggle-container": {
       position: "relative",
       display: "block",
-      height: 18,
-      width: 32,
+      height: "18px",
+      width: "32px",
       overflow: "hidden",
       "& input": {
         position: "absolute",
-        top: 0,
-        left: 0,
+        top: "0px",
+        left: "0px",
         width: "100%",
         height: "100%",
-        opacity: 0,
+        opacity: "0",
         cursor: "pointer",
         "&:disabled": {
           cursor: "not-allowed"
@@ -33,23 +31,23 @@ var buttonPlugin = function buttonPlugin(_ref) {
     },
     ".toggle": {
       position: "absolute",
-      top: 0,
-      left: 0,
+      top: "0px",
+      left: "0px",
       width: "100%",
       height: "100%",
       pointerEvents: "none",
-      borderRadius: 9999,
+      borderRadius: "9999px",
       background: theme("colors.grey.100"),
       boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.500"), 0.2)),
       transition: transition,
       "&::after": {
         position: "absolute",
-        top: 1,
-        left: 1,
-        width: 16,
-        height: 16,
+        top: "1px",
+        left: "1px",
+        width: "16px",
+        height: "16px",
         content: '" "',
-        borderRadius: 9999,
+        borderRadius: "9999px",
         background: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.50"), " 100%)"),
         boxShadow: "0px 1px 1px 0px ".concat(theme("colors.shadow.10")),
         transition: transition
@@ -62,10 +60,9 @@ var buttonPlugin = function buttonPlugin(_ref) {
         }
       },
       "input:disabled ~ &": {
-        opacity: 0.6
+        opacity: "0.6"
       }
     }
   });
-};
-
-module.exports = buttonPlugin;
+});
+module.exports = togglePlugin;

package/cjs/Tooltip/OverflowTooltipWrapper.d.ts

@@ -1,5 +1,6 @@
 import type { FunctionComponent } from "react";
 import type { TooltipWrapperBaseProps } from "./types";
+/** @ignore */
 export declare const isOverflowing: (element: HTMLElement) => boolean;
 export declare const OverflowTooltipWrapper: FunctionComponent<TooltipWrapperBaseProps>;
 export default OverflowTooltipWrapper;

package/cjs/Tooltip/OverflowTooltipWrapper.js

@@ -19,10 +19,10 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _react = require("react");
 
-var _reactDom = require("react-dom");
-
 var _reactPopper = require("react-popper");
 
+var _Satellite = require("../Satellite");
+
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
 
 var _TextWrap = _interopRequireDefault(require("../TextWrap"));
@@ -39,6 +39,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
+/** @ignore */
 var isOverflowing = function isOverflowing(element) {
   return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
 };
@@ -57,6 +58,7 @@ var OverflowTooltipWrapper = function OverflowTooltipWrapper(_ref) {
       modifiers = _ref$modifiers === void 0 ? [] : _ref$modifiers,
       _ref$noArrow = _ref.noArrow,
       noArrow = _ref$noArrow === void 0 ? false : _ref$noArrow;
+  var createPortal = (0, _Satellite.useCreatePortal)();
 
   var _useState = (0, _react.useState)(null),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
@@ -106,7 +108,7 @@ var OverflowTooltipWrapper = function OverflowTooltipWrapper(_ref) {
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
       children: children
-    }), tooltipText && /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, attributes.popper), {}, {
+    }), tooltipText && createPortal( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, attributes.popper), {}, {
       style: styles.popper,
       className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["tooltip-wrapper-popper"]))), tooltipClassName),
       ref: setPopperEl,
@@ -120,7 +122,7 @@ var OverflowTooltipWrapper = function OverflowTooltipWrapper(_ref) {
           children: tooltipText
         })
       })]
-    })), document.body)]
+    })))]
   });
 };
 

package/cjs/Tooltip/Tooltip.d.ts

@@ -20,5 +20,5 @@ export interface TooltipProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivEl
  * - Not contain any links or buttons
  * - Be used sparingly. If you're building something that requires a lot of tooltips, work on clarifying the design and the language in the experience
  */
-export declare const Tooltip: import("react").ForwardRefExoticComponent<Pick<TooltipProps, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "key" | "variant" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Tooltip: import("react").ForwardRefExoticComponent<Pick<TooltipProps, "key" | "id" | "color" | "translate" | "hidden" | "dir" | "slot" | "style" | "title" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "tabIndex" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant"> & import("react").RefAttributes<HTMLDivElement>>;
 export default Tooltip;

package/cjs/Tooltip/Tooltip.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = tooltipPlugin;
-/**
- * @type {import('../tailwind-types').TailwindPlugin}
- */
-declare const tooltipPlugin: import('../tailwind-types').TailwindPlugin;
+declare const tooltipPlugin: {
+    handler: import("tailwindcss/types/config").PluginCreator;
+    config?: import("tailwindcss").Config | undefined;
+};

package/cjs/Tooltip/Tooltip.tailwind.js

@@ -1,15 +1,17 @@
 "use strict";
 
 // @ts-check
+var plugin = require("tailwindcss/plugin");
 
-/**
- * @type {import('../tailwind-types').TailwindPlugin}
- */
-var tooltipPlugin = function tooltipPlugin(_ref) {
+var tooltipPlugin = plugin(function (_ref) {
   var addComponents = _ref.addComponents,
       theme = _ref.theme;
   var arrowSize = 4;
+  /** @type {string} */
+
   var tooltipDarkBackground = theme("colors.grey.900");
+  /** @type {string} */
+
   var tooltipLightBackground = theme("colors.white");
   addComponents({
     ".tooltip": {
@@ -24,7 +26,7 @@ var tooltipPlugin = function tooltipPlugin(_ref) {
         border: "1px solid currentColor",
         background: "initial",
         whiteSpace: "nowrap",
-        lineHeight: 2
+        lineHeight: "2"
       }
     },
     ".tooltip-dark": {
@@ -40,8 +42,8 @@ var tooltipPlugin = function tooltipPlugin(_ref) {
   addComponents({
     ".tooltip-wrapper": {
       display: "inline-block",
-      lineHeight: 0,
-      outline: 0
+      lineHeight: "0",
+      outline: "0px"
     },
     ".tooltip-wrapper-popper": {
       zIndex: theme("zIndex.tooltip"),
@@ -51,17 +53,17 @@ var tooltipPlugin = function tooltipPlugin(_ref) {
     ".tooltip-wrapper-arrow": {
       position: "absolute",
       display: "block",
-      width: arrowSize,
-      height: arrowSize,
+      width: "".concat(arrowSize, "px"),
+      height: "".concat(arrowSize, "px"),
       border: "".concat(arrowSize, "px solid transparent"),
       color: tooltipDarkBackground,
       '[data-popper-placement^="right"] > &': {
-        left: -arrowSize,
+        left: "".concat(-arrowSize, "px"),
         borderLeft: "none",
         borderRightColor: "currentColor"
       },
       '[data-popper-placement^="left"] > &': {
-        right: -arrowSize,
+        right: "".concat(-arrowSize, "px"),
         borderRight: "none",
         borderLeftColor: "currentColor"
       },
@@ -71,7 +73,7 @@ var tooltipPlugin = function tooltipPlugin(_ref) {
         borderTopColor: "currentColor"
       },
       '[data-popper-placement^="bottom"] > &': {
-        top: -arrowSize,
+        top: "".concat(-arrowSize, "px"),
         borderTop: "none",
         borderBottomColor: "currentColor"
       }
@@ -84,31 +86,30 @@ var tooltipPlugin = function tooltipPlugin(_ref) {
         border: "".concat(arrowSize - 1, "px solid transparent")
       },
       '[data-popper-placement^="left"] > &::after': {
-        right: 1,
+        right: "1px",
         transform: "translate(0, -50%)",
         borderRight: "none",
         borderLeftColor: tooltipLightBackground
       },
       '[data-popper-placement^="right"] > &::after': {
-        left: 1,
+        left: "1px",
         transform: "translate(0, -50%)",
         borderLeft: "none",
         borderRightColor: tooltipLightBackground
       },
       '[data-popper-placement^="top"] > &::after': {
-        bottom: 1,
+        bottom: "1px",
         transform: "translate(-50%, 0)",
         borderBottom: "none",
         borderTopColor: tooltipLightBackground
       },
       '[data-popper-placement^="bottom"] > &::after': {
-        top: 1,
+        top: "1px",
         transform: "translate(-50%, 0)",
         borderTop: "none",
         borderBottomColor: tooltipLightBackground
       }
     }
   });
-};
-
+});
 module.exports = tooltipPlugin;

package/cjs/Tooltip/TooltipWrapper.d.ts

@@ -22,6 +22,7 @@ export interface TooltipWrapperProps extends TooltipWrapperBaseProps {
      */
     interactive?: boolean;
     content: ReactNode;
+    children: ReactNode;
 }
 export declare const TooltipWrapper: FunctionComponent<TooltipWrapperProps>;
 export default TooltipWrapper;

package/cjs/Tooltip/TooltipWrapper.js

@@ -21,10 +21,10 @@ var _lodash = _interopRequireDefault(require("lodash.throttle"));
 
 var _react = require("react");
 
-var _reactDom = require("react-dom");
-
 var _reactPopper = require("react-popper");
 
+var _Satellite = require("../Satellite");
+
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
 
 var _Tooltip = _interopRequireDefault(require("./Tooltip"));
@@ -65,6 +65,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
       noArrow = _ref$noArrow === void 0 ? false : _ref$noArrow,
       _ref$interactive = _ref.interactive,
       interactive = _ref$interactive === void 0 ? true : _ref$interactive;
+  var createPortal = (0, _Satellite.useCreatePortal)();
   var isControlled = typeof show === "boolean";
 
   var _useState = (0, _react.useState)(!!show),
@@ -197,7 +198,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
       }
     }), {}, {
       children: children
-    })), showTooltip && /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, attributes.popper), {}, {
+    })), showTooltip && createPortal( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, attributes.popper), {}, {
       style: styles.popper,
       className: (0, _classnames["default"])((0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["tooltip-wrapper-popper"]))), tooltipClassName),
       ref: setPopperEl,
@@ -209,7 +210,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
         variant: tooltipVariant,
         children: tooltipContent
       })]
-    })), document.body)]
+    })))]
   });
 };
 

package/cjs/Tooltip/types.d.ts

@@ -1,4 +1,5 @@
 import type { Placement, StrictModifiers } from "@popperjs/core";
+import type { ReactNode } from "react";
 import type { TooltipVariant } from "./Tooltip";
 export interface TooltipWrapperBaseProps {
     /** Defines where to open the menu */
@@ -9,4 +10,5 @@ export interface TooltipWrapperBaseProps {
     /** Modifiers for the Popper menu */
     modifiers?: StrictModifiers[];
     noArrow?: boolean;
+    children: ReactNode;
 }

package/cjs/Typography/Typography.tailwind.d.ts

@@ -1,17 +1,5 @@
-/**
- * @type {import('../tailwind-types').TailwindFunction}
- */
-declare const desktop: import('../tailwind-types').TailwindFunction;
-/**
- * @type {import('../tailwind-types').TailwindFunction}
- */
-declare const mobile: import('../tailwind-types').TailwindFunction;
-/**
- * @type {import("../tailwind-types").TailwindPlugin}
- */
-declare const typographyPlugin: import("../tailwind-types").TailwindPlugin;
-export declare namespace styles {
-    export { desktop };
-    export { mobile };
-}
-export { typographyPlugin as plugin };
+export = typographyPlugin;
+declare const typographyPlugin: {
+    handler: import("tailwindcss/types/config").PluginCreator;
+    config?: import("tailwindcss").Config | undefined;
+};

package/cjs/Typography/Typography.tailwind.js

@@ -9,134 +9,18 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 // @ts-check
-// @ts-ignore
 var _require = require("lodash"),
     mapKeys = _require.mapKeys;
-/**
- * @type {import('../tailwind-types').TailwindFunction}
- */
 
+var plugin = require("tailwindcss/plugin");
 
-var desktop = function desktop(theme) {
-  return {
-    "display-xlarge": {
-      fontSize: theme("fontSize.3xl"),
-      lineHeight: theme("lineHeight.3xl"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-large": {
-      fontSize: theme("fontSize.2xl"),
-      lineHeight: theme("lineHeight.2xl"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-medium": {
-      fontSize: theme("fontSize.xl"),
-      lineHeight: theme("lineHeight.xl"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-small": {
-      fontSize: theme("fontSize.lg"),
-      lineHeight: theme("lineHeight.lg"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-heading": {
-      fontSize: theme("fontSize.md"),
-      lineHeight: theme("lineHeight.md"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-subheading": {
-      fontSize: theme("fontSize.sm"),
-      lineHeight: theme("lineHeight.sm"),
-      fontWeight: theme("fontWeight.semibold"),
-      textTransform: "uppercase"
-    },
-    "display-body": {
-      fontSize: theme("fontSize.base"),
-      lineHeight: theme("lineHeight.base"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-caption": {
-      fontSize: theme("fontSize.sm"),
-      lineHeight: theme("lineHeight.sm"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-code": {
-      fontFamily: theme("fontFamily.mono"),
-      fontSize: theme("fontSize.base"),
-      lineHeight: theme("lineHeight.base"),
-      fontWeight: theme("fontWeight.normal")
-    }
-  };
-};
-/**
- * @type {import('../tailwind-types').TailwindFunction}
- */
-
-
-var mobile = function mobile(theme) {
-  return {
-    "display-xlarge": {
-      lineHeight: theme("lineHeight.xl"),
-      fontSize: theme("fontSize.2xl"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-large": {
-      lineHeight: theme("lineHeight.xl"),
-      fontSize: theme("fontSize.xl"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-medium": {
-      lineHeight: theme("lineHeight.xl"),
-      fontSize: theme("fontSize.lg"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-small": {
-      lineHeight: theme("lineHeight.md"),
-      fontSize: theme("fontSize.md"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-heading": {
-      lineHeight: theme("lineHeight.md"),
-      fontSize: theme("fontSize.md"),
-      fontWeight: theme("fontWeight.semibold")
-    },
-    "display-subheading": {
-      lineHeight: theme("lineHeight.sm"),
-      fontSize: theme("fontSize.mobile"),
-      fontWeight: theme("fontWeight.semibold"),
-      textTransform: "uppercase"
-    },
-    "display-body": {
-      lineHeight: theme("lineHeight.md"),
-      fontSize: theme("fontSize.md"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-caption": {
-      lineHeight: theme("lineHeight.base"),
-      fontSize: theme("fontSize.mobile"),
-      fontWeight: theme("fontWeight.normal")
-    },
-    "display-code": {
-      fontFamily: theme("fontFamily.mono"),
-      lineHeight: theme("lineHeight.md"),
-      fontSize: theme("fontSize.md"),
-      fontWeight: theme("fontWeight.normal")
-    }
-  };
-};
-/**
- * @type {import("../tailwind-types").TailwindPlugin}
- */
-
-
-var typographyPlugin = function typographyPlugin(_ref) {
-  var addComponents = _ref.addComponents,
+var typographyPlugin = plugin(function (_ref) {
+  var theme = _ref.theme,
       addUtilities = _ref.addUtilities,
-      e = _ref.e,
-      theme = _ref.theme,
-      variants = _ref.variants;
-  var desktop = theme("typography.desktop", {})(theme);
-  var mobile = theme("typography.mobile", {})(theme);
+      addComponents = _ref.addComponents,
+      e = _ref.e;
+  var desktop = theme("typography.desktop", {});
+  var mobile = theme("typography.mobile", {});
   var common = {
     reversed: {
       color: theme("colors.white")
@@ -156,6 +40,8 @@ var typographyPlugin = function typographyPlugin(_ref) {
   }; // add utilities for manual typography declaration
   // Example: `className="typo-m-display-small lg:typo-display-small"`
 
+  /** @type {any} */
+
   var utilities = _objectSpread(_objectSpread(_objectSpread({}, mapKeys(common, function (_, key) {
     return ".typo-".concat(e(key));
   })), mapKeys(desktop, function (_, key) {
@@ -173,14 +59,118 @@ var typographyPlugin = function typographyPlugin(_ref) {
   })))); // register add-ons
 
 
-  addUtilities(utilities, variants("styles", ["responsive"]));
+  addUtilities(utilities);
   addComponents(components);
-};
-
-module.exports = {
-  styles: {
-    desktop: desktop,
-    mobile: mobile
-  },
-  plugin: typographyPlugin
-};
+}, {
+  content: [],
+  theme: {
+    // @ts-ignore
+    typography: function typography(_ref2) {
+      var theme = _ref2.theme;
+      // Need to transform it to a string because in this context, Tailwind doesn't automagically turn it into a string value
+      // Asked here https://github.com/tailwindlabs/tailwindcss/discussions/8755
+      var monoFontFamily = theme("fontFamily.mono").join(",");
+      return {
+        desktop: {
+          "display-xlarge": {
+            fontSize: theme("fontSize.3xl"),
+            lineHeight: theme("lineHeight.3xl"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-large": {
+            fontSize: theme("fontSize.2xl"),
+            lineHeight: theme("lineHeight.2xl"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-medium": {
+            fontSize: theme("fontSize.xl"),
+            lineHeight: theme("lineHeight.xl"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-small": {
+            fontSize: theme("fontSize.lg"),
+            lineHeight: theme("lineHeight.lg"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-heading": {
+            fontSize: theme("fontSize.md"),
+            lineHeight: theme("lineHeight.md"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-subheading": {
+            fontSize: theme("fontSize.sm"),
+            lineHeight: theme("lineHeight.sm"),
+            fontWeight: theme("fontWeight.semibold"),
+            textTransform: "uppercase"
+          },
+          "display-body": {
+            fontSize: theme("fontSize.base"),
+            lineHeight: theme("lineHeight.base"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-caption": {
+            fontSize: theme("fontSize.sm"),
+            lineHeight: theme("lineHeight.sm"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-code": {
+            fontFamily: monoFontFamily,
+            fontSize: theme("fontSize.base"),
+            lineHeight: theme("lineHeight.base"),
+            fontWeight: theme("fontWeight.normal")
+          }
+        },
+        mobile: {
+          "display-xlarge": {
+            lineHeight: theme("lineHeight.xl"),
+            fontSize: theme("fontSize.2xl"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-large": {
+            lineHeight: theme("lineHeight.xl"),
+            fontSize: theme("fontSize.xl"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-medium": {
+            lineHeight: theme("lineHeight.xl"),
+            fontSize: theme("fontSize.lg"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-small": {
+            lineHeight: theme("lineHeight.md"),
+            fontSize: theme("fontSize.md"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-heading": {
+            lineHeight: theme("lineHeight.md"),
+            fontSize: theme("fontSize.md"),
+            fontWeight: theme("fontWeight.semibold")
+          },
+          "display-subheading": {
+            lineHeight: theme("lineHeight.sm"),
+            fontSize: theme("fontSize.mobile"),
+            fontWeight: theme("fontWeight.semibold"),
+            textTransform: "uppercase"
+          },
+          "display-body": {
+            lineHeight: theme("lineHeight.md"),
+            fontSize: theme("fontSize.md"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-caption": {
+            lineHeight: theme("lineHeight.base"),
+            fontSize: theme("fontSize.mobile"),
+            fontWeight: theme("fontWeight.normal")
+          },
+          "display-code": {
+            fontFamily: monoFontFamily,
+            lineHeight: theme("lineHeight.md"),
+            fontSize: theme("fontSize.md"),
+            fontWeight: theme("fontWeight.normal")
+          }
+        }
+      };
+    }
+  }
+});
+module.exports = typographyPlugin;

package/cjs/UserContent/UserContent.tailwind.d.ts

@@ -1,2 +1,5 @@
-declare const _exports: import('../tailwind-types').TailwindPlugin;
+declare const _exports: {
+    handler: import("tailwindcss/types/config").PluginCreator;
+    config?: import("tailwindcss").Config | undefined;
+};
 export = _exports;