@helpdice/ui 2.5.3 → 2.5.8-beta.0

package/esm/table/table.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "textPlaceholder", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
+var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "textPlaceholder", "onSelected", "dataLength", "viewLength", "className", "containerStyle", "rowClassName"];
 import _JSXStyle from "../styled-jsx.es.js";
 /* "use client" */
 
@@ -18,6 +18,8 @@ import { ChevronLeft, ChevronRight } from '@helpdice/icons';
 import Pagination from '../pagination';
 import Button from '../button';
 import Tooltip from '../tooltip';
+import Placeholder from '../placeholder';
+import { useTheme } from '@helpdice/theme';
 function TableComponent(tableProps) {
   /* eslint-disable  @typescript-eslint/no-unused-vars */
   var _ref = tableProps,
@@ -57,6 +59,7 @@ function TableComponent(tableProps) {
     viewLength = _ref.viewLength,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? '' : _ref$className,
+    containerStyle = _ref.containerStyle,
     _ref$rowClassName = _ref.rowClassName,
     rowClassName = _ref$rowClassName === void 0 ? function () {
       return '';
@@ -65,6 +68,7 @@ function TableComponent(tableProps) {
   /* eslint-enable @typescript-eslint/no-unused-vars */
   var _useScale = useScale(),
     SCALES = _useScale.SCALES;
+  var theme = useTheme();
   var ref = useRef(null);
   var _useRealShape = useRealShape(ref),
     _useRealShape2 = _slicedToArray(_useRealShape, 2),
@@ -115,10 +119,25 @@ function TableComponent(tableProps) {
   };
   return /*#__PURE__*/React.createElement(TableContext.Provider, {
     value: contextValue
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      position: 'relative',
+      display: 'flex',
+      flexDirection: 'column',
+      borderBottom: "1px solid ".concat(theme.palette.border),
+      borderBottomLeftRadius: '5px',
+      borderBottomRightRadius: '5px'
+    },
+    className: _JSXStyle.dynamic([["1809040460", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]]])
+  }, /*#__PURE__*/React.createElement("div", {
+    style: _extends({
+      overflow: 'auto'
+    }, containerStyle),
+    className: _JSXStyle.dynamic([["1809040460", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]]])
   }, /*#__PURE__*/React.createElement("table", _extends({
     ref: ref
   }, props, {
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || "")
+    className: _JSXStyle.dynamic([["1809040460", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]]]) + " " + (props && props.className != null && props.className || className || "")
   }), /*#__PURE__*/React.createElement(TableHead, {
     stickyHeader: stickyHeader,
     onFilters: onFilters,
@@ -130,26 +149,30 @@ function TableComponent(tableProps) {
     hover: hover,
     emptyText: emptyText,
     onRow: onRow,
-    onCell: onCell,
-    textPlaceholder: textPlaceholder,
+    onCell: onCell
+    // textPlaceholder={textPlaceholder}
+    ,
     rowClassName: rowClassName,
     rowDraggable: rowDraggable,
     readOnly: readOnly,
     onSelected: onSelected
-  }), children, cursorPagination ? /*#__PURE__*/React.createElement("tfoot", {
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, /*#__PURE__*/React.createElement("td", {
-    colSpan: columns === null || columns === void 0 ? void 0 : columns.length,
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, /*#__PURE__*/React.createElement("div", {
+  }), children), data.length == 0 && /*#__PURE__*/React.createElement(Placeholder, {
+    empty: true,
+    textOnly: textPlaceholder,
+    msg: "No Data to show"
+  })), cursorPagination || viewLength ? /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["1809040460", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]]]) + " " + "table-footer"
+  }, cursorPagination ? /*#__PURE__*/React.createElement("div", {
     style: {
       display: 'flex',
       gap: 10,
       margin: '10px'
     },
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    text: "Previous"
+    className: _JSXStyle.dynamic([["1809040460", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]]])
+  }, /*#__PURE__*/React.createElement(Tooltip.Small, {
+    text: "Previous",
+    placement: "bottom",
+    type: "dark"
   }, /*#__PURE__*/React.createElement(Button, {
     disabled: !previousCursor,
     onClick: function onClick() {
@@ -159,8 +182,10 @@ function TableComponent(tableProps) {
     px: 0.6,
     scale: 2 / 3,
     iconRight: /*#__PURE__*/React.createElement(ChevronLeft, null)
-  })), /*#__PURE__*/React.createElement(Tooltip, {
-    text: "Next"
+  })), /*#__PURE__*/React.createElement(Tooltip.Small, {
+    text: "Next",
+    placement: "bottom",
+    type: "dark"
   }, /*#__PURE__*/React.createElement(Button, {
     disabled: !nextCursor,
     onClick: function onClick() {
@@ -170,12 +195,7 @@ function TableComponent(tableProps) {
     px: 0.6,
     scale: 2 / 3,
     iconRight: /*#__PURE__*/React.createElement(ChevronRight, null)
-  }))))) : dataLength && viewLength && onPageChange ? /*#__PURE__*/React.createElement("tfoot", {
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, /*#__PURE__*/React.createElement("td", {
-    colSpan: columns === null || columns === void 0 ? void 0 : columns.length,
-    className: _JSXStyle.dynamic([["2040515329", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, /*#__PURE__*/React.createElement(Pagination, {
+  }))) : dataLength && viewLength && onPageChange ? /*#__PURE__*/React.createElement(Pagination, {
     style: {
       marginLeft: '10px',
       marginRight: '10px',
@@ -190,10 +210,10 @@ function TableComponent(tableProps) {
     },
     limit: 5,
     count: Number(dataLength / viewLength)
-  }, /*#__PURE__*/React.createElement(Pagination.Next, null, /*#__PURE__*/React.createElement(ChevronRight, null)), /*#__PURE__*/React.createElement(Pagination.Previous, null, /*#__PURE__*/React.createElement(ChevronLeft, null))))) : null, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2040515329",
-    dynamic: [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
-  }, "table.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;--table-font-size:".concat(SCALES.font(1), ";font-size:var(--table-font-size);width:").concat(SCALES.width(1, '100%'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}tfoot.__jsx-style-dynamic-selector td.__jsx-style-dynamic-selector{position:-webkit-sticky;position:sticky;bottom:0;z-index:2;}"))));
+  }, /*#__PURE__*/React.createElement(Pagination.Next, null, /*#__PURE__*/React.createElement(ChevronRight, null)), /*#__PURE__*/React.createElement(Pagination.Previous, null, /*#__PURE__*/React.createElement(ChevronLeft, null))) : null) : null, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "1809040460",
+    dynamic: [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), theme.palette.background]
+  }, "table.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;--table-font-size:".concat(SCALES.font(1), ";font-size:var(--table-font-size);width:").concat(SCALES.width(1, '100%'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.table-footer.__jsx-style-dynamic-selector{background-color:").concat(theme.palette.background, ";width:100%;bottom:0;}"))));
 }
 TableComponent.displayName = 'Table';
 TableComponent.Column = TableColumn;

package/esm/text/text.d.ts

@@ -19,7 +19,10 @@ interface Props {
     blockquote?: boolean;
     noWrap?: boolean;
     className?: string;
+    display?: string;
     color?: TextTypes;
+    alignItems?: string;
+    justify?: string;
     align?: 'center' | 'right' | 'left';
 }
 type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>;

package/esm/text/text.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["h1", "h2", "h3", "h4", "h5", "h6", "p", "b", "small", "i", "span", "del", "em", "blockquote", "noWrap", "collapse", "children", "className"];
+var _excluded = ["h1", "h2", "h3", "h4", "h5", "h6", "p", "b", "small", "i", "span", "del", "em", "blockquote", "noWrap", "collapse", "children", "className", "display", "alignItems", "justify"];
 /* "use client" */;
 import React, { useMemo, useState } from 'react';
 import TextChild from './child';
@@ -50,6 +50,10 @@ var TextComponent = function TextComponent(_ref) {
     children = _ref.children,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$display = _ref.display,
+    display = _ref$display === void 0 ? 'block' : _ref$display,
+    alignItems = _ref.alignItems,
+    justify = _ref.justify,
     props = _objectWithoutProperties(_ref, _excluded);
   var elements = {
     h1: h1,
@@ -104,7 +108,10 @@ var TextComponent = function TextComponent(_ref) {
   }, [renderableChildElements, children]);
   return /*#__PURE__*/React.createElement(TextChild, _extends({
     style: {
-      textAlign: props.align
+      textAlign: props.align,
+      display: display,
+      alignItems: alignItems,
+      justifyContent: justify
     },
     className: "".concat(className, " ").concat(noWrap ? 'no-wrap' : ''),
     tag: tag

package/esm/textarea/textarea.d.ts

@@ -14,6 +14,9 @@ interface Props {
     onFocus?: (e: React.FocusEvent<HTMLTextAreaElement>) => void;
     onBlur?: (e: React.FocusEvent<HTMLTextAreaElement>) => void;
     className?: string;
+    error?: boolean;
+    helperText?: string;
+    label?: string;
     resize?: TextareaResizes;
 }
 type NativeAttrs = Omit<React.TextareaHTMLAttributes<any>, keyof Props>;

package/esm/textarea/textarea.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["type", "disabled", "readOnly", "onFocus", "onBlur", "className", "initialValue", "onChange", "value", "placeholder", "resize"];
+var _excluded = ["type", "disabled", "readOnly", "onFocus", "onBlur", "className", "initialValue", "onChange", "value", "placeholder", "helperText", "error", "label", "resize"];
 import _JSXStyle from "../styled-jsx.es.js";
 /* "use client" */
 
@@ -10,6 +10,8 @@ import { useTheme, useClasses } from '@helpdice/theme';
 import { tuple } from '../utils/prop-types';
 import { getColors } from '../input/styles';
 import useScale, { withScale } from '../use-scale';
+import Text from '../text';
+import InputBlockLabel from '../input/input-block-label';
 var resizeTypes = tuple('none', 'both', 'horizontal', 'vertical', 'initial', 'inherit');
 var TextareaComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$type = _ref.type,
@@ -27,6 +29,9 @@ var TextareaComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onChange = _ref.onChange,
     value = _ref.value,
     placeholder = _ref.placeholder,
+    helperText = _ref.helperText,
+    error = _ref.error,
+    label = _ref.label,
     _ref$resize = _ref.resize,
     resize = _ref$resize === void 0 ? 'none' : _ref$resize,
     props = _objectWithoutProperties(_ref, _excluded);
@@ -83,6 +88,8 @@ var TextareaComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   };
   var textareaProps = _extends({}, props, controlledValue);
   return /*#__PURE__*/React.createElement("div", {
+    className: "with-label"
+  }, label && /*#__PURE__*/React.createElement(InputBlockLabel, null, label), /*#__PURE__*/React.createElement("div", {
     className: _JSXStyle.dynamic([["12276481", [theme.layout.radius, borderColor, color, SCALES.font(0.875), SCALES.height(1, 'auto'), SCALES.width(1, 'initial'), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, theme.palette.accents_1, theme.palette.accents_2, theme.font.sans, SCALES.pt(0.5), SCALES.pr(0.5), SCALES.pb(0.5), SCALES.pl(0.5), resize, theme.palette.background]]]) + " " + (classes || "")
   }, /*#__PURE__*/React.createElement("textarea", _extends({
     ref: textareaRef,
@@ -97,7 +104,17 @@ var TextareaComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   })), /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "12276481",
     dynamic: [theme.layout.radius, borderColor, color, SCALES.font(0.875), SCALES.height(1, 'auto'), SCALES.width(1, 'initial'), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, theme.palette.accents_1, theme.palette.accents_2, theme.font.sans, SCALES.pt(0.5), SCALES.pr(0.5), SCALES.pb(0.5), SCALES.pl(0.5), resize, theme.palette.background]
-  }, ".wrapper.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:".concat(theme.layout.radius, ";border:1px solid ").concat(borderColor, ";color:").concat(color, ";-webkit-transition:border 0.2s ease 0s,color 0.2s ease 0s;transition:border 0.2s ease 0s,color 0.2s ease 0s;min-width:12.5rem;max-width:95vw;--textarea-font-size:").concat(SCALES.font(0.875), ";--textarea-height:").concat(SCALES.height(1, 'auto'), ";width:").concat(SCALES.width(1, 'initial'), ";height:var(--textarea-height);margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.wrapper.hover.__jsx-style-dynamic-selector{border-color:").concat(hoverBorder, ";}.wrapper.disabled.__jsx-style-dynamic-selector{background-color:").concat(theme.palette.accents_1, ";border-color:").concat(theme.palette.accents_2, ";cursor:not-allowed;}textarea.__jsx-style-dynamic-selector{background-color:transparent;box-shadow:none;display:block;font-family:").concat(theme.font.sans, ";font-size:var(--textarea-font-size);width:100%;height:var(--textarea-height);border:none;outline:none;padding:").concat(SCALES.pt(0.5), " ").concat(SCALES.pr(0.5), " ").concat(SCALES.pb(0.5), " ").concat(SCALES.pl(0.5), ";resize:").concat(resize, ";}.disabled.__jsx-style-dynamic-selector>textarea.__jsx-style-dynamic-selector{cursor:not-allowed;}textarea.__jsx-style-dynamic-selector:-webkit-autofill,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:hover,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:active,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:focus{-webkit-box-shadow:0 0 0 30px ").concat(theme.palette.background, " inset !important;}")));
+  }, ".wrapper.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:".concat(theme.layout.radius, ";border:1px solid ").concat(borderColor, ";color:").concat(color, ";-webkit-transition:border 0.2s ease 0s,color 0.2s ease 0s;transition:border 0.2s ease 0s,color 0.2s ease 0s;min-width:12.5rem;max-width:95vw;--textarea-font-size:").concat(SCALES.font(0.875), ";--textarea-height:").concat(SCALES.height(1, 'auto'), ";width:").concat(SCALES.width(1, 'initial'), ";height:var(--textarea-height);margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.wrapper.hover.__jsx-style-dynamic-selector{border-color:").concat(hoverBorder, ";}.wrapper.disabled.__jsx-style-dynamic-selector{background-color:").concat(theme.palette.accents_1, ";border-color:").concat(theme.palette.accents_2, ";cursor:not-allowed;}textarea.__jsx-style-dynamic-selector{background-color:transparent;box-shadow:none;display:block;font-family:").concat(theme.font.sans, ";font-size:var(--textarea-font-size);width:100%;height:var(--textarea-height);border:none;outline:none;padding:").concat(SCALES.pt(0.5), " ").concat(SCALES.pr(0.5), " ").concat(SCALES.pb(0.5), " ").concat(SCALES.pl(0.5), ";resize:").concat(resize, ";}.disabled.__jsx-style-dynamic-selector>textarea.__jsx-style-dynamic-selector{cursor:not-allowed;}textarea.__jsx-style-dynamic-selector:-webkit-autofill,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:hover,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:active,textarea.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:focus{-webkit-box-shadow:0 0 0 30px ").concat(theme.palette.background, " inset !important;}"))), helperText && /*#__PURE__*/React.createElement(Text, {
+    font: 0.8,
+    style: {
+      marginTop: 0.4,
+      marginRight: 0,
+      marginLeft: 0,
+      marginBottom: '0.4rem',
+      textAlign: 'left'
+    },
+    color: error ? "error" : 'default'
+  }, "\xA0", helperText));
 });
 TextareaComponent.displayName = 'Textarea';
 var Textarea = withScale(TextareaComponent);

package/esm/tooltip/index.d.ts

@@ -1,3 +1,8 @@
 import Tooltip from './tooltip';
 export type { TooltipProps, TooltipOnVisibleChange, TooltipTypes, TooltipTriggers, TooltipPlacement, } from './tooltip';
-export default Tooltip;
+import SmallTooltip from './tooltip-small';
+export type TooltipComponentType = typeof Tooltip & {
+    Small: typeof SmallTooltip;
+};
+declare const _default: TooltipComponentType;
+export default _default;

package/esm/tooltip/index.js

@@ -1,2 +1,4 @@
 import Tooltip from './tooltip';
+import SmallTooltip from './tooltip-small';
+Tooltip.Small = SmallTooltip;
 export default Tooltip;

package/esm/tooltip/tooltip-small.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TooltipProps } from './tooltip';
+declare const _default: React.NamedExoticComponent<TooltipProps>;
+export default _default;

package/esm/tooltip/tooltip-small.js

@@ -0,0 +1,12 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { memo } from 'react';
+import Tooltip from './tooltip';
+var SmallTooltip = function SmallTooltip(props) {
+  return /*#__PURE__*/React.createElement(Tooltip, _extends({
+    font: 0.8,
+    px: 0.6,
+    py: 0.4
+  }, props), props.children);
+};
+SmallTooltip.displayName = 'Tooltip.Small';
+export default /*#__PURE__*/memo(SmallTooltip);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@helpdice/ui",
-  "version": "2.5.3",
+  "version": "2.5.8-beta.0",
   "main": "dist/index.js",
   "types": "esm/index.d.ts",
   "unpkg": "dist/index.min.js",
@@ -65,7 +65,7 @@
     "@helpdice/icons": "^1.2.5",
     "@helpdice/sdk": "^0.4.3",
     "@helpdice/utils": "^0.1.4",
-    "@helpdice/pro": "2.1.0",
+    "@helpdice/pro": "2.1.1",
     "@mapbox/rehype-prism": "^0.9.0",
     "@mdx-js/loader": "^3.1.0",
     "@mdx-js/react": "^3.1.0",