carbon-react 105.1.1 → 106.0.0

package/lib/components/split-button/split-button.component.d.ts

@@ -1,5 +1,5 @@
 export default SplitButton;
-declare function SplitButton({ align, as, buttonType, children, disabled, iconPosition, iconType, onClick, size, subtext, text, ...rest }: {
+declare function SplitButton({ align, as, buttonType, children, disabled, iconPosition, iconType, onClick, size, subtext, text, "data-element": dataElement, "data-role": dataRole, ...rest }: {
     [x: string]: any;
     align?: string | undefined;
     as: any;
@@ -12,6 +12,8 @@ declare function SplitButton({ align, as, buttonType, children, disabled, iconPo
     size?: string | undefined;
     subtext: any;
     text: any;
+    "data-element": any;
+    "data-role": any;
 }): JSX.Element;
 declare namespace SplitButton {
     const propTypes: {

package/lib/components/split-button/split-button.component.js

@@ -61,6 +61,8 @@ const SplitButton = ({
   size = "medium",
   subtext,
   text,
+  "data-element": dataElement,
+  "data-role": dataRole,
   ...rest
 }) => {
   if (!deprecatedWarnTriggered && as) {
@@ -145,7 +147,8 @@ const SplitButton = ({
       iconType,
       onClick,
       size,
-      subtext
+      subtext,
+      ...(0, _utils.filterOutStyledSystemSpacingProps)(rest)
     };
   }
 
@@ -173,8 +176,8 @@ const SplitButton = ({
   function componentTags() {
     return {
       "data-component": "split-button",
-      "data-element": rest["data-element"],
-      "data-role": rest["data-role"]
+      "data-element": dataElement,
+      "data-role": dataRole
     };
   }
 

package/lib/components/split-button/split-button.d.ts

@@ -1,6 +1,9 @@
 import * as React from "react";
+import { MarginProps } from "styled-system";
 
-export interface SplitButtonProps {
+export interface SplitButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+    MarginProps {
   /** Set align of the rendered content */
   align?: "left" | "right";
   /** Button type: "primary" | "secondary" for legacy theme */
@@ -23,6 +26,6 @@ export interface SplitButtonProps {
   text: string;
 }
 
-declare class SplitButton extends React.Component<SplitButtonProps> {}
+declare function SplitButton(props: SplitButtonProps): JSX.Element;
 
 export default SplitButton;

package/lib/components/textbox/textbox.component.d.ts

@@ -1,6 +1,5 @@
 export { Textbox as OriginalTextbox };
-declare var _default: JSX.Element;
-export default _default;
+export default Textbox;
 declare function Textbox({ align, autoFocus, children, disabled, inputIcon, leftChildren, labelId: externalLabelId, label, labelAlign, labelHelp, labelInline, labelSpacing, id, formattedValue, fieldHelp, error, warning, info, name, reverse, size, value, readOnly, placeholder, inputRef, onBlur, onClick, onFocus, onChange, onMouseDown, onChangeDeferred, deferTimeout, isOptional, iconOnClick, iconOnMouseDown, iconTabIndex, validationOnLabel, labelWidth, inputWidth, prefix, adaptiveLabelBreakpoint, required, positionedChildren, tooltipPosition, "data-component": dataComponent, "data-element": dataElement, "data-role": dataRole, enforceCharacterLimit, characterLimit, warnOverLimit, helpAriaLabel, ...props }: {
     [x: string]: any;
     align: any;

package/lib/components/textbox/textbox.component.js

@@ -19,7 +19,7 @@ var _inputIconToggle = _interopRequireDefault(require("../../__internal__/input-
 
 var _formField = _interopRequireDefault(require("../../__internal__/form-field"));
 
-var _withUniqueIdProps = _interopRequireDefault(require("../../__internal__/utils/helpers/with-unique-id-props"));
+var _useUniqueId = _interopRequireDefault(require("../../__internal__/utils/helpers/useUniqueId"));
 
 var _inputBehaviour = require("../../__internal__/input-behaviour");
 
@@ -113,13 +113,14 @@ const Textbox = ({
 
   const computeLabelPropValues = prop => validationRedesignOptIn ? undefined : prop;
 
+  const [uniqueId, uniqueName] = (0, _useUniqueId.default)(id, name);
   const {
     labelId: internalLabelId,
     validationIconId,
     fieldHelpId,
     ariaDescribedBy
   } = (0, _useInputAccessibility.default)({
-    id,
+    id: uniqueId,
     error,
     warning,
     info,
@@ -145,7 +146,7 @@ const Textbox = ({
     labelInline: computeLabelPropValues(labelInline),
     labelSpacing: labelSpacing,
     labelWidth: computeLabelPropValues(labelWidth),
-    id: id,
+    id: uniqueId,
     reverse: computeLabelPropValues(reverse),
     isOptional: isOptional,
     useValidationIcon: computeLabelPropValues(validationOnLabel),
@@ -185,9 +186,9 @@ const Textbox = ({
     autoFocus: autoFocus,
     deferTimeout: deferTimeout,
     disabled: disabled,
-    id: id,
+    id: uniqueId,
     inputRef: inputRef,
-    name: name,
+    name: uniqueName,
     onBlur: onBlur,
     onChange: onChange,
     onChangeDeferred: onChangeDeferred,
@@ -410,7 +411,5 @@ Textbox.defaultProps = {
   size: "medium",
   validationOnLabel: false
 };
-
-var _default = (0, _withUniqueIdProps.default)(Textbox);
-
+var _default = Textbox;
 exports.default = _default;

package/lib/components/tooltip/index.d.ts

@@ -1 +1,2 @@
-export { default } from "./tooltip";
+export { default } from "./tooltip.component";
+export type { TooltipProps } from "./tooltip.component";

package/lib/components/tooltip/tooltip-pointer.style.d.ts

@@ -1,2 +1,11 @@
+import { Placement } from "tippy.js";
+interface StyledTooltipPointer {
+    /** Sets position of the tooltip */
+    position?: Placement;
+    /** Defines the message type */
+    type?: string;
+    /** Override background color of the Tooltip, provide any color from palette or any valid css color value. */
+    bgColor?: string;
+}
+declare const StyledTooltipPointer: import("styled-components").StyledComponent<"div", any, StyledTooltipPointer, never>;
 export default StyledTooltipPointer;
-declare const StyledTooltipPointer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/components/tooltip/tooltip-pointer.style.js

@@ -5,21 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
 var _base = _interopRequireDefault(require("../../style/themes/base"));
 
 var _color = require("../../style/utils/color");
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const pointerColor = (type, theme, bgColor) => {
+const pointerColor = (theme, bgColor, type) => {
   if (bgColor) return (0, _color.toColor)(theme, bgColor);
   return type === "error" ? "var(--colorsSemanticNegative500)" : "var(--colorsSemanticNeutral500)";
 };
@@ -38,7 +36,7 @@ const StyledTooltipPointer = _styledComponents.default.div`
     ${position === "top" && (0, _styledComponents.css)`
       border-left: 8px solid transparent;
       border-right: 8px solid transparent;
-      border-top: 8px solid ${pointerColor(type, theme, bgColor)};
+      border-top: 8px solid ${pointerColor(theme, bgColor, type)};
       bottom: calc(-1 * var(--spacing100));
       @-moz-document url-prefix() {
         bottom: -7px;
@@ -48,7 +46,7 @@ const StyledTooltipPointer = _styledComponents.default.div`
     ${position === "bottom" && (0, _styledComponents.css)`
       border-left: 8px solid transparent;
       border-right: 8px solid transparent;
-      border-bottom: 8px solid ${pointerColor(type, theme, bgColor)};
+      border-bottom: 8px solid ${pointerColor(theme, bgColor, type)};
       top: calc(-1 * var(--spacing100));
       @-moz-document url-prefix() {
         top: -7px;
@@ -58,7 +56,7 @@ const StyledTooltipPointer = _styledComponents.default.div`
     ${position === "right" && (0, _styledComponents.css)`
       border-top: 8px solid transparent;
       border-bottom: 8px solid transparent;
-      border-right: 8px solid ${pointerColor(type, theme, bgColor)};
+      border-right: 8px solid ${pointerColor(theme, bgColor, type)};
       left: calc(-1 * var(--spacing100));
       @-moz-document url-prefix() {
         left: -7px;
@@ -68,7 +66,7 @@ const StyledTooltipPointer = _styledComponents.default.div`
     ${position === "left" && (0, _styledComponents.css)`
       border-top: 8px solid transparent;
       border-bottom: 8px solid transparent;
-      border-left: 8px solid ${pointerColor(type, theme, bgColor)};
+      border-left: 8px solid ${pointerColor(theme, bgColor, type)};
       right: calc(-1 * var(--spacing100));
       @-moz-document url-prefix() {
         right: -7px;
@@ -80,11 +78,5 @@ StyledTooltipPointer.defaultProps = {
   theme: _base.default,
   position: "top"
 };
-StyledTooltipPointer.propTypes = {
-  position: _propTypes.default.oneOf(["bottom", "left", "right", "top"]),
-  theme: _propTypes.default.object,
-  type: _propTypes.default.string,
-  bgColor: _propTypes.default.string
-};
 var _default = StyledTooltipPointer;
 exports.default = _default;

package/lib/components/tooltip/tooltip.component.d.ts

@@ -1,3 +1,34 @@
-export default Tooltip;
-declare const Tooltip: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
 import React from "react";
+import { TooltipPositions } from "./tooltip.config";
+export declare type InputSizes = "small" | "medium" | "large";
+export interface TooltipProps {
+    /** The message to be displayed within the tooltip */
+    message: React.ReactNode;
+    /** The id attribute to use for the tooltip */
+    id?: string;
+    /** Whether to to show the Tooltip */
+    isVisible?: boolean;
+    /** Sets position of the tooltip */
+    position?: TooltipPositions;
+    /** Defines the message type */
+    type?: string;
+    /** Children elements */
+    children: React.ReactElement;
+    /** Defines the size of the tooltip content */
+    size?: "medium" | "large";
+    /** Override background color of the Tooltip, provide any color from palette or any valid css color value. */
+    bgColor?: string;
+    /** Override font color of the Tooltip, provide any color from palette or any valid css color value. */
+    fontColor?: string;
+    /**
+     * Overrides the default flip behaviour of the Tooltip,
+     * must be an array containing some or all of ["top", "bottom", "left", "right"]
+     * (see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements)
+     */
+    flipOverrides?: TooltipPositions[];
+    target?: Element;
+    isPartOfInput?: boolean;
+    inputSize?: InputSizes;
+}
+export declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement | null>>;
+export default Tooltip;

package/lib/components/tooltip/tooltip.component.js

@@ -1,158 +1,249 @@
 "use strict";
 
 Object.defineProperty(exports, "__esModule", {
-  value: true
+  value: true,
 });
-exports.default = void 0;
 
-var _react = _interopRequireWildcard(require("react"));
+exports.default = exports.Tooltip = void 0;
 
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _headless = _interopRequireDefault(require("@tippyjs/react/headless"));
 
 var _tippy = require("tippy.js");
 
-var _tooltip = _interopRequireDefault(require("./tooltip.style"));
-
-var _tooltipPointer = _interopRequireDefault(require("./tooltip-pointer.style"));
-
-var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags/tags"));
-
-var _carbonScopedTokensProvider = _interopRequireDefault(require("../../style/design-tokens/carbon-scoped-tokens-provider/carbon-scoped-tokens-provider.component"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _invariant = _interopRequireDefault(require("invariant"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _tooltip = _interopRequireDefault(require("./tooltip.style"));
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var _tooltipPointer = _interopRequireDefault(
+  require("./tooltip-pointer.style")
+);
+
+var _tooltip2 = require("./tooltip.config");
+
+var _tags = _interopRequireDefault(
+  require("../../__internal__/utils/helpers/tags/tags")
+);
+
+var _carbonScopedTokensProvider = _interopRequireDefault(
+  require("../../style/design-tokens/carbon-scoped-tokens-provider/carbon-scoped-tokens-provider.component")
+);
+
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : { default: obj };
+}
+
+function _extends() {
+  _extends =
+    Object.assign ||
+    function (target) {
+      for (var i = 1; i < arguments.length; i++) {
+        var source = arguments[i];
+        for (var key in source) {
+          if (Object.prototype.hasOwnProperty.call(source, key)) {
+            target[key] = source[key];
+          }
+        }
+      }
+      return target;
+    };
+  return _extends.apply(this, arguments);
+}
 
 const TOOLTIP_DELAY = 100;
 const tippyPlugins = [_tippy.sticky];
 
-const Tooltip = /*#__PURE__*/_react.default.forwardRef(({
-  children,
-  isVisible,
-  position = "top",
-  message,
-  type,
-  size = "medium",
-  isPartOfInput,
-  inputSize,
-  id,
-  bgColor,
-  fontColor,
-  flipOverrides,
-  target,
-  ...rest
-}, ref) => {
-  const tooltipRef = (0, _react.useRef)(ref || null);
-
-  const tooltip = (attrs, content) => {
-    const currentPosition = attrs["data-placement"] || position;
-    return /*#__PURE__*/_react.default.createElement(_carbonScopedTokensProvider.default, null, /*#__PURE__*/_react.default.createElement(_tooltip.default, _extends({
-      "data-element": "tooltip",
-      role: "tooltip",
-      tabIndex: "-1",
-      type: type,
-      size: size,
-      id: id
-    }, (0, _tags.default)("tooltip", rest), {
-      isPartOfInput: isPartOfInput,
-      inputSize: inputSize
-    }, attrs, {
-      position: currentPosition,
-      ref: tooltipRef,
-      bgColor: bgColor,
-      fontColor: fontColor
-    }), /*#__PURE__*/_react.default.createElement(_tooltipPointer.default, _extends({
-      key: "pointer",
-      type: type
-    }, attrs, {
-      position: currentPosition,
-      "data-popper-arrow": "",
-      "data-element": "tooltip-pointer",
-      bgColor: bgColor
-    })), content));
-  };
-
-  return /*#__PURE__*/_react.default.createElement(_headless.default, _extends({
-    placement: position,
-    delay: TOOLTIP_DELAY
-  }, isVisible !== undefined && {
-    visible: isVisible
-  }, {
-    plugins: tippyPlugins,
-    sticky: true,
-    render: attrs => tooltip(attrs, message),
-    reference: target,
-    popperOptions: {
-      modifiers: [...(flipOverrides ? [{
-        name: "flip",
-        options: {
-          fallbackPlacements: flipOverrides
-        }
-      }] : []), {
-        name: "computeStyles",
-        options: {
-          gpuAcceleration: false
+const Tooltip = /*#__PURE__*/ _react.default.forwardRef(
+  (
+    {
+      children,
+      isVisible,
+      position = "top",
+      message,
+      type,
+      size = "medium",
+      isPartOfInput,
+      inputSize,
+      id,
+      bgColor,
+      fontColor,
+      flipOverrides,
+      target,
+      ...rest
+    },
+    ref
+  ) => {
+    const isFlipOverridesValid =
+      !flipOverrides ||
+      (Array.isArray(flipOverrides) &&
+        flipOverrides.every((placement) =>
+          _tooltip2.TOOLTIP_POSITIONS.includes(placement)
+        ));
+    (0, _invariant.default)(
+      isFlipOverridesValid,
+      `The flipOverrides prop supplied to Tooltip must be an array containing some or all of ["top", "bottom", "left", "right"].`
+    );
+
+    const tooltip = (attrs, content) => {
+      const currentPosition = attrs["data-placement"] || position;
+      return /*#__PURE__*/ _react.default.createElement(
+        _carbonScopedTokensProvider.default,
+        null,
+        /*#__PURE__*/ _react.default.createElement(
+          _tooltip.default,
+          _extends(
+            {
+              "data-element": "tooltip",
+              role: "tooltip",
+              tabIndex: -1,
+              type: type,
+              size: size,
+              id: id,
+            },
+            (0, _tags.default)("tooltip", rest),
+            {
+              isPartOfInput: isPartOfInput,
+              inputSize: inputSize,
+            },
+            attrs,
+            {
+              position: currentPosition,
+              ref: ref,
+              bgColor: bgColor,
+              fontColor: fontColor,
+            }
+          ),
+          /*#__PURE__*/ _react.default.createElement(
+            _tooltipPointer.default,
+            _extends(
+              {
+                key: "pointer",
+                type: type,
+              },
+              attrs,
+              {
+                position: currentPosition,
+                "data-popper-arrow": "",
+                "data-element": "tooltip-pointer",
+                bgColor: bgColor,
+              }
+            )
+          ),
+          content
+        )
+      );
+    };
+
+    return /*#__PURE__*/ _react.default.createElement(
+      _headless.default,
+      _extends(
+        {
+          placement: position,
+          delay: TOOLTIP_DELAY,
+        },
+        isVisible !== undefined && {
+          visible: isVisible,
+        },
+        {
+          plugins: tippyPlugins,
+          sticky: true,
+          render: (attrs) => tooltip(attrs, message),
+          reference: target,
+          popperOptions: {
+            modifiers: [
+              ...(flipOverrides
+                ? [
+                    {
+                      name: "flip",
+                      options: {
+                        fallbackPlacements: flipOverrides,
+                      },
+                    },
+                  ]
+                : []),
+              {
+                name: "computeStyles",
+                options: {
+                  gpuAcceleration: false,
+                },
+              },
+            ],
+          },
         }
-      }]
-    }
-  }), children);
-});
+      ),
+      children
+    );
+  }
+);
 
-const placements = ["top", "bottom", "left", "right"];
 Tooltip.propTypes = {
-  /** The message to be displayed within the tooltip */
-  message: _propTypes.default.node.isRequired,
-
-  /** The id attribute to use for the tooltip */
-  id: _propTypes.default.string,
-
-  /** Whether to to show the Tooltip */
-  isVisible: _propTypes.default.bool,
-
-  /** Sets position of the tooltip */
-  position: _propTypes.default.oneOf(placements),
-
-  /** Defines the message type */
-  type: _propTypes.default.string,
-
-  /** Children elements */
-  children: _propTypes.default.node.isRequired,
-
-  /** Defines the size of the tooltip content */
-  size: _propTypes.default.oneOf(["medium", "large"]),
-  // Reference element, tooltip will be positioned in relation to this element
-  target: _propTypes.default.instanceOf(Element),
-
-  /** Override background color of the Tooltip, provide design token, any color from palette or any valid css color value. */
+  /**
+   * Override background color of the Tooltip, provide any color from palette or any valid css color value.
+   */
   bgColor: _propTypes.default.string,
-
-  /** Override font color of the Tooltip, provide design token, any color from palette or any valid css color value. */
+  /**
+   * Children elements
+   */
+  children: _propTypes.default.element.isRequired,
+  /**
+   * Overrides the default flip behaviour of the Tooltip,
+   * must be an array containing some or all of ["top", "bottom", "left", "right"]
+   * (see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements)
+   */
+  flipOverrides: _propTypes.default.arrayOf(
+    _propTypes.default.oneOf(["bottom", "left", "right", "top"])
+  ),
+  /**
+   * Override font color of the Tooltip, provide any color from palette or any valid css color value.
+   */
   fontColor: _propTypes.default.string,
-
-  /** @ignore @private */
+  /**
+   * The id attribute to use for the tooltip
+   */
+  id: _propTypes.default.string,
+  inputSize: _propTypes.default.oneOf(["large", "medium", "small"]),
   isPartOfInput: _propTypes.default.bool,
-
-  /** @ignore @private */
-  inputSize: _propTypes.default.oneOf(["small", "medium", "large"]),
-
-  /** Overrides the default flip behaviour of the Tooltip, must be an array containing some or all of ["top", "bottom", "left", "right"] (see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements) */
-  flipOverrides: (props, propName) => {
-    const prop = props[propName];
-    const isValid = prop && Array.isArray(prop) && prop.every(placement => placements.includes(placement));
-
-    if (!prop || isValid) {
+  /**
+   * Whether to to show the Tooltip
+   */
+  isVisible: _propTypes.default.bool,
+  key: _propTypes.default.oneOfType([
+    _propTypes.default.number,
+    _propTypes.default.string,
+  ]),
+  /**
+   * The message to be displayed within the tooltip
+   */
+  message: _propTypes.default.node,
+  /**
+   * Sets position of the tooltip
+   */
+  position: _propTypes.default.oneOf(["bottom", "left", "right", "top"]),
+  /**
+   * Defines the size of the tooltip content
+   */
+  size: _propTypes.default.oneOf(["large", "medium"]),
+  target: function (props, propName) {
+    if (props[propName] == null) {
       return null;
+    } else if (
+      typeof props[propName] !== "object" ||
+      props[propName].nodeType !== 1
+    ) {
+      return new Error(
+        "Expected prop '" + propName + "' to be of type Element"
+      );
     }
-
-    return new Error( // eslint-disable-next-line max-len
-    `The \`${propName}\` prop supplied to \`Tooltip\` must be an array containing some or all of ["top", "bottom", "left", "right"].`);
-  }
+  },
+  /**
+   * Defines the message type
+   */
+  type: _propTypes.default.string,
 };
+
+exports.Tooltip = Tooltip;
+Tooltip.displayName = "Tooltip";
 var _default = Tooltip;
-exports.default = _default;
+exports.default = _default;

package/lib/components/tooltip/tooltip.config.d.ts

@@ -1 +1,2 @@
-export const TOOLTIP_POSITIONS: string[];
+export declare const TOOLTIP_POSITIONS: string[];
+export declare type TooltipPositions = "top" | "bottom" | "left" | "right";

package/lib/components/tooltip/tooltip.style.d.ts

@@ -1,2 +1,7 @@
-export default StyledTooltipWrapper;
-declare const StyledTooltipWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+import { Placement } from "tippy.js";
+import { TooltipProps } from "./tooltip.component";
+interface StyledTooltipProps extends Omit<TooltipProps, "children" | "message" | "position"> {
+    position: Placement;
+}
+declare const StyledTooltip: import("styled-components").StyledComponent<"div", any, StyledTooltipProps, never>;
+export default StyledTooltip;