plataforma-fundacao-componentes 2.26.4 → 2.26.5

package/dist/components/tooltipElement/TooltipElement.d.ts

@@ -1,9 +1,11 @@
 import { Placement } from '@floating-ui/react';
-import React, { ReactNode } from 'react';
+import React, { HTMLAttributes, ReactNode } from 'react';
+import './TooltipElement.scss';
 export interface iTooltip {
     label?: ReactNode;
     placement?: Placement;
     fallbackPlacements?: Placement[];
     children?: ReactNode;
+    wrapperProps?: HTMLAttributes<HTMLDivElement>;
 }
-export default function TooltipElement({ label, placement, fallbackPlacements, children, }: iTooltip): React.JSX.Element;
+export default function TooltipElement({ label, placement, fallbackPlacements, wrapperProps, children, }: iTooltip): React.JSX.Element;

package/dist/components/typography/Typography.d.ts

@@ -1,4 +1,5 @@
 import { CSSProperties, HTMLAttributes } from 'react';
+import './Typography.scss';
 export interface TypographyProps extends HTMLAttributes<HTMLElement> {
     variant?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'body' | 'caption' | 'small';
     focus?: boolean;

package/dist/components/typography/Typography.stories.d.ts

@@ -22,6 +22,7 @@ export declare const Default: {
         color: string;
         children: string;
         focus: boolean;
+        format: boolean;
     };
 };
 export declare const Formatted: {

package/dist/index.css

@@ -8810,7 +8810,7 @@ nav.component-tabs {
   widthMd: 991.98px;
   widthLg: 1199.98px; }
 
-.tooltip {
+.tooltip-element-tooltip {
   z-index: 989;
   display: flex;
   align-items: center;
@@ -8824,10 +8824,10 @@ nav.component-tabs {
   font-size: 16px;
   line-height: 24px;
   border-radius: 8px; }
-  .tooltip .label {
+  .tooltip-element-tooltip .tooltip-element-label {
     max-width: 300px; }
 
-.reference {
+.tooltip-element-reference {
   display: flex;
   align-items: center;
   width: -moz-fit-content;
@@ -8860,21 +8860,21 @@ nav.component-tabs {
   widthMd: 991.98px;
   widthLg: 1199.98px; }
 
-.tp {
+.typography-tp {
   margin: 0;
   padding: 0;
   font-weight: 300;
   display: block;
   text-align: start; }
-  .tp.focus {
+  .typography-tp.typography-focus {
     font-weight: 500; }
-  .tp.primary {
+  .typography-tp.primary {
     color: #3fa110; }
-  .tp.primary-dark {
+  .typography-tp.primary-dark {
     color: #33820d; }
-  .tp.secondary {
+  .typography-tp.secondary {
     color: #fefefe; }
-  .tp.default {
+  .typography-tp.default {
     color: #323c32; }
 
 .caption.tp {

package/dist/index.js

@@ -12806,12 +12806,15 @@ var LeftControlWithLabel = function LeftControlWithLabel(_ref) {
   }), props.label));
 };
 
+var rootClassName$2$ = 'tooltip-element';
 function TooltipElement(_ref) {
   var label = _ref.label,
     _ref$placement = _ref.placement,
     placement = _ref$placement === void 0 ? 'top' : _ref$placement,
     _ref$fallbackPlacemen = _ref.fallbackPlacements,
     fallbackPlacements = _ref$fallbackPlacemen === void 0 ? ['right', 'left', 'bottom'] : _ref$fallbackPlacemen,
+    _ref$wrapperProps = _ref.wrapperProps,
+    wrapperProps = _ref$wrapperProps === void 0 ? {} : _ref$wrapperProps,
     children = _ref.children;
   var arrowRef = React.useRef(null);
   var _useState = React.useState(false),
@@ -12862,14 +12865,14 @@ function TooltipElement(_ref) {
     isMounted = _useTransitionStyles.isMounted,
     transitionStyles = _useTransitionStyles.styles;
   return React__default.createElement(React.Fragment, null, React__default.createElement("div", Object.assign({
-    className: undefined.reference,
+    className: rootClassName$2$ + "-reference",
     ref: refs.setReference
-  }, getReferenceProps), children), React__default.createElement(react.FloatingPortal, null, isMounted && React__default.createElement("div", Object.assign({
-    className: undefined.tooltip,
+  }, getReferenceProps(wrapperProps)), children), React__default.createElement(react.FloatingPortal, null, isMounted && React__default.createElement("div", Object.assign({
+    className: rootClassName$2$ + "-tooltip",
     ref: refs.setFloating,
     style: _extends({}, floatingStyles, transitionStyles)
   }, getFloatingProps()), React__default.createElement("span", {
-    className: undefined.label
+    className: rootClassName$2$ + "-label"
   }, label), React__default.createElement(react.FloatingArrow, {
     ref: arrowRef,
     context: context,
@@ -12878,6 +12881,7 @@ function TooltipElement(_ref) {
 }
 
 var _excluded$k = ["className", "variant", "color", "focus", "style", "alignment", "format", "dangerouslySetInnerHTML", "children"];
+var rootClassName$30 = 'typography';
 var Typography = React.forwardRef(function (_ref, ref) {
   var _ref$className = _ref.className,
     className = _ref$className === void 0 ? '' : _ref$className,
@@ -12897,7 +12901,7 @@ var Typography = React.forwardRef(function (_ref, ref) {
     dangerouslySetInnerHTML = _ref.dangerouslySetInnerHTML,
     children = _ref.children,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$k);
-  var classNames = useMergedClassNames([undefined.tp, focus ? undefined.focus : '', undefined[color], undefined[variant], className]);
+  var classNames = useMergedClassNames([rootClassName$30 + "-tp", focus ? rootClassName$30 + "-focus" : '', color, variant, className]);
   var tag = React.useMemo(function () {
     switch (variant) {
       case 'body':
@@ -43961,7 +43965,7 @@ function useHTMLShare() {
   };
 }
 
-var rootClassName$2$ = 'comp-modal-manager';
+var rootClassName$31 = 'comp-modal-manager';
 var maskRootClassName$1 = 'component-modal-mask';
 var hackFocus$1 = function hackFocus() {
   var tmp = document.createElement('input');
@@ -44029,13 +44033,13 @@ function useModalManager() {
   return [React__default.createElement(React__default.Fragment, {
     key: 1
   }, React__default.createElement(reactTransitionGroup.TransitionGroup, {
-    className: rootClassName$2$ + "-modals"
+    className: rootClassName$31 + "-modals"
   }, arrayOfModal.map(function (obj) {
     var _obj$props2, _obj$props3;
     var ModalComponent = React__default.createElement(obj.component, obj.props);
     return React__default.createElement(reactTransitionGroup.CSSTransition, {
       timeout: 300,
-      classNames: rootClassName$2$ + "-mask",
+      classNames: rootClassName$31 + "-mask",
       key: (_obj$props2 = obj.props) === null || _obj$props2 === void 0 ? void 0 : _obj$props2.modalKey,
       unmountOnExit: true
     }, React__default.createElement(ModalMask, {
@@ -44306,7 +44310,7 @@ function useTimeElapsed(timeLeftInSeconds, callBackZero) {
   return timeToReturn;
 }
 
-var rootClassName$30 = 'comp-toast-manager';
+var rootClassName$32 = 'comp-toast-manager';
 var count$1 = 0;
 function useToastManager(props) {
   var _props$max;
@@ -44351,17 +44355,17 @@ function useToastManager(props) {
     toastsRef.current = [];
   }, []);
   var classNames = React.useMemo(function () {
-    return getMergedClassNames([rootClassName$30 + "-toasts", rootClassName$30 + "-" + verticalPosition, rootClassName$30 + "-" + horizontalPosition, reverse ? rootClassName$30 + "-reverse" : '', animateSize ? rootClassName$30 + "-animate-size" : '']);
+    return getMergedClassNames([rootClassName$32 + "-toasts", rootClassName$32 + "-" + verticalPosition, rootClassName$32 + "-" + horizontalPosition, reverse ? rootClassName$32 + "-reverse" : '', animateSize ? rootClassName$32 + "-animate-size" : '']);
   }, [reverse, animateSize, horizontalPosition, verticalPosition]);
   React.useLayoutEffect(function () {
-    var wrapper = document.querySelector("." + rootClassName$30 + "-toasts");
+    var wrapper = document.querySelector("." + rootClassName$32 + "-toasts");
     if (wrapper && wrapper.childElementCount > 0) {
       var somaDasAlturas = 0;
       if (verticalPosition === 'top' && !reverse) {
         somaDasAlturas = 12;
         for (var i = 0; i < wrapper.children.length; i++) {
           var el = wrapper.children[i];
-          if (!el.classList.contains(rootClassName$30 + "-toast-exit")) {
+          if (!el.classList.contains(rootClassName$32 + "-toast-exit")) {
             el.style.transform = "translateY(" + somaDasAlturas + "px)";
             somaDasAlturas += el.getBoundingClientRect().height + 12;
           }
@@ -44369,7 +44373,7 @@ function useToastManager(props) {
       } else if (verticalPosition === 'top') {
         for (var _i = wrapper.children.length - 1; _i >= 0; _i--) {
           var _el = wrapper.children[_i];
-          if (!_el.classList.contains(rootClassName$30 + "-toast-exit")) {
+          if (!_el.classList.contains(rootClassName$32 + "-toast-exit")) {
             somaDasAlturas += _el.getBoundingClientRect().height + 12;
             _el.style.transform = "translateY(" + somaDasAlturas + "px)";
           }
@@ -44377,7 +44381,7 @@ function useToastManager(props) {
       } else if (verticalPosition === 'bottom' && !reverse) {
         for (var _i2 = 0; _i2 < wrapper.children.length; _i2++) {
           var _el2 = wrapper.children[_i2];
-          if (!_el2.classList.contains(rootClassName$30 + "-toast-exit")) {
+          if (!_el2.classList.contains(rootClassName$32 + "-toast-exit")) {
             somaDasAlturas += _el2.getBoundingClientRect().height + 12;
             _el2.style.transform = "translateY(-" + somaDasAlturas + "px)";
           }
@@ -44386,7 +44390,7 @@ function useToastManager(props) {
         somaDasAlturas = 12;
         for (var _i3 = wrapper.children.length - 1; _i3 >= 0; _i3--) {
           var _el3 = wrapper.children[_i3];
-          if (!_el3.classList.contains(rootClassName$30 + "-toast-exit")) {
+          if (!_el3.classList.contains(rootClassName$32 + "-toast-exit")) {
             _el3.style.transform = "translateY(-" + somaDasAlturas + "px)";
             somaDasAlturas += _el3.getBoundingClientRect().height + 12;
           }
@@ -44401,11 +44405,11 @@ function useToastManager(props) {
   }, arrayOfToast.map(function (toast) {
     return React__default.createElement(reactTransitionGroup.CSSTransition, {
       timeout: 300,
-      classNames: rootClassName$30 + "-toast",
+      classNames: rootClassName$32 + "-toast",
       key: toast.id,
       unmountOnExit: true
     }, React__default.createElement("div", {
-      className: rootClassName$30 + "-toastzin"
+      className: rootClassName$32 + "-toastzin"
     }, React__default.createElement(Toast, {
       theme: toast.theme,
       label: toast.label,