plataforma-fundacao-componentes 2.22.22 → 2.22.25

package/dist/components/actionCard/ActionCard.d.ts

@@ -0,0 +1,17 @@
+import React, { ReactElement, ReactNode } from 'react';
+import { ActionCardThemes } from '../../libraries/ActionCardThemes';
+import './ActionCard.scss';
+export interface ActionCardProps {
+    text: string;
+    theme?: ActionCardThemes;
+    element?: JSX.Element | ReactElement | ReactNode;
+}
+declare function ActionCard(props: ActionCardProps): JSX.Element;
+declare namespace ActionCard {
+    var defaultProps: {
+        theme: ActionCardThemes;
+        text: string;
+    };
+}
+declare const _default: React.MemoExoticComponent<typeof ActionCard>;
+export default _default;

package/dist/components/actionCard/ActionCard.stories.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const White: () => JSX.Element;
+export declare const Green: () => JSX.Element;
+export declare const Danger: () => JSX.Element;
+export declare const Dark: () => JSX.Element;

package/dist/components/button/Button.stories.d.ts

@@ -13,7 +13,10 @@ export function SecondaryWhiteBackground(): JSX.Element;
 export function SecondaryDisabled(): JSX.Element;
 export function StyleDefault(): JSX.Element;
 export function Danger(): JSX.Element;
+export function DangerDarker(): JSX.Element;
+export function DangerDarkerOutline(): JSX.Element;
 export function DangerDisabled(): JSX.Element;
+export function Black(): JSX.Element;
 export function FullWidth(): JSX.Element;
 export function LeftIcon(): JSX.Element;
 export function LeftIconFullWidth(): JSX.Element;

package/dist/components/container/Container.d.ts

@@ -5,6 +5,7 @@ interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
     'tooltip-position'?: TooltipPosition;
     'tooltip-text'?: string;
     fluid?: boolean;
+    position?: 'fixed' | 'absolute';
     verticalPadding?: boolean;
     hasMobileButton?: boolean;
     hasHeader?: boolean;

package/dist/components/fullHeightContainer/FullHeightContainer.stories.d.ts

@@ -5,4 +5,5 @@ declare namespace _default {
 export default _default;
 export function FirstExample(): JSX.Element;
 export function NoContentExample(): JSX.Element;
+export function ContainerExample(): JSX.Element;
 import FullHeightContainer from "./FullHeightContainer";

package/dist/components/notification/Notification.stories.d.ts

@@ -1,8 +1,9 @@
-declare namespace _default {
-    export const title: string;
-    export { Notification as component };
-}
+/// <reference types="react" />
+import Notification from './Notification';
+declare const _default: {
+    title: string;
+    component: typeof Notification;
+};
 export default _default;
-export function NumberCount(): JSX.Element;
-export function ExclamationPoint(): JSX.Element;
-import Notification from "./Notification";
+export declare const NumberCount: () => JSX.Element;
+export declare const ExclamationPoint: () => JSX.Element;

package/dist/components/tableFileNameAndAction/TableFileNameAndAction.d.ts

@@ -10,6 +10,7 @@ export interface TableFileNameAndActionProps {
         error?: boolean;
         disabled?: boolean;
     }[];
+    white?: boolean;
     rightIcon?: React.ReactNode;
     onRightIconClick?: (event: number) => void;
     disabledRightIcon?: boolean;

package/dist/components/tableFileNameAndAction/TableFileNameAndAction.stories.d.ts

@@ -4,5 +4,6 @@ declare namespace _default {
 }
 export default _default;
 export function Primary(): JSX.Element;
+export function White(): JSX.Element;
 export function WithLoader(): JSX.Element;
 import TableFileNameAndAction from "./TableFileNameAndAction";

package/dist/hooks/useStorageState/useStorageState.d.ts

@@ -0,0 +1,2 @@
+import { Dispatch, SetStateAction } from 'react';
+export default function useStorageState<T = any>(storage: Storage, key: string, initialValue?: T | undefined): [T | undefined, Dispatch<SetStateAction<T | undefined>>];

package/dist/hooks/useStorageState/useStorageState.stories.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import useStorageState from './useStorageState';
+declare const _default: {
+    title: string;
+    component: typeof useStorageState;
+};
+export default _default;
+export declare const LocalStorageExample: () => JSX.Element;
+export declare const SessionStorageExample: () => JSX.Element;
+export declare const ObjectExample: () => JSX.Element;

package/dist/index.css

@@ -963,6 +963,167 @@ h5 {
   .scroll-white::-webkit-scrollbar-thumb:hover {
     background-color: #bfc7bf; }
 
+.action-card {
+  position: relative;
+  border-radius: 8px;
+  padding: 16px 24px;
+  width: 100%; }
+  .action-card .action {
+    margin-top: 12px; }
+  .action-card .bar {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 8px;
+    border-top-left-radius: 8px;
+    border-bottom-left-radius: 8px;
+    height: 100%; }
+  .action-card.primary {
+    background-color: #fefefe;
+    color: #121212; }
+    .action-card.primary .bar {
+      background-color: #3fa110; }
+  .action-card.secondary {
+    background-color: #3fa110;
+    color: #fefefe; }
+    .action-card.secondary .bar {
+      background-color: #33820d; }
+  .action-card.danger {
+    background-color: #ffb4b4;
+    color: #803230; }
+    .action-card.danger .bar {
+      background-color: #e60000; }
+  .action-card.darker {
+    background-color: #323c32;
+    color: #fefefe; }
+    .action-card.darker .bar {
+      background-color: #121212; }
+
+@import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
+:export {
+  white: #fefefe;
+  darkenWhite: #efefef;
+  black: #121212;
+  transparent: rgba(0, 0, 0, 0);
+  primary: #3fa110;
+  primaryDark: #33820d;
+  primaryLight: #d7e6c8;
+  secondaryDarker: #323c32;
+  secondaryDark: #5a645a;
+  secondary: #828a82;
+  secondaryLight: #cdd3cd;
+  secondaryLighter: #f8f9f7;
+  danger: #e60000;
+  dangerLight: #ffb4b4;
+  dangerDark: #ab4745;
+  warning: #ffcd00;
+  warningLight: #ffeb98;
+  warningDark: #765f00; }
+
+:root {
+  --rowPadding: 0;
+  --colPadding: 8px; }
+
+:export {
+  widthXs: 575.98px;
+  widthSm: 767.98px;
+  widthMd: 991.98px;
+  widthLg: 1199.98px; }
+
+body.sb-show-main.sb-main-padded {
+  padding: 15px; }
+
+*.nunito {
+  font-family: "Nunito", sans-serif; }
+
+*:not(.nunito) {
+  font-family: "Exo 2", sans-serif; }
+
+.document-grabbing {
+  cursor: -webkit-grabbing !important;
+  cursor: grabbing !important; }
+
+h1 {
+  font-size: 36px;
+  font-weight: 600;
+  margin: 0; }
+
+h2 {
+  font-size: 32px;
+  font-weight: 500;
+  margin: 0; }
+
+h3 {
+  font-size: 24px;
+  font-weight: 500;
+  margin: 0; }
+
+h4 {
+  font-size: 18px;
+  font-weight: 500;
+  margin: 0; }
+
+h5 {
+  font-family: "Nunito", sans-serif;
+  font-size: 24px;
+  font-weight: 400;
+  margin: 0; }
+
+.fade-enter {
+  transition: opacity 0.2s ease;
+  position: absolute;
+  opacity: 0; }
+
+.fade-enter-active {
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit {
+  transition: opacity 0.15s ease;
+  position: absolute;
+  opacity: 1; }
+
+.fade-exit-active {
+  position: absolute;
+  opacity: 0; }
+
+.fade-exit-done {
+  position: absolute;
+  opacity: 0; }
+
+* {
+  box-sizing: border-box; }
+  *::-webkit-scrollbar-track {
+    background-color: #f8f9f7;
+    border-radius: 20px; }
+  *::-webkit-scrollbar {
+    width: 12px;
+    height: 12px; }
+  *::-webkit-scrollbar-thumb {
+    -webkit-transition: all 0.3s ease;
+    transition: all 0.3s ease;
+    border-radius: 10px;
+    background-color: #cdd3cd;
+    border-width: 3px;
+    border-style: solid;
+    border-color: #f8f9f7; }
+    *::-webkit-scrollbar-thumb:hover {
+      border-width: 2px;
+      background-color: #bfc7bf; }
+  *::-webkit-scrollbar-button {
+    display: none; }
+
+.scroll-white::-webkit-scrollbar-track {
+  background-color: #fefefe;
+  border-radius: 20px; }
+
+.scroll-white::-webkit-scrollbar-thumb {
+  background-color: #cdd3cd;
+  border-color: #fefefe; }
+  .scroll-white::-webkit-scrollbar-thumb:hover {
+    background-color: #bfc7bf; }
+
 @media screen and (max-width: 575.98px) {
   .component-advanced-semi-header,
   .component-advanced-semi-header-semi-clear,
@@ -1624,6 +1785,20 @@ h5 {
     background-color: #368a0e;
     transform: scale(0.95); }
 
+.component-button:not(:disabled).component-button-primary-dark {
+  background-color: #33820d;
+  border-color: #33820d;
+  color: #fefefe; }
+  .component-button:not(:disabled).component-button-primary-dark:focus {
+    border-color: #33820d; }
+  .component-button:not(:disabled).component-button-primary-dark:hover {
+    border-color: #2a6b0b;
+    background-color: #2a6b0b; }
+  .component-button:not(:disabled).component-button-primary-dark:active {
+    border-color: #2a6b0b;
+    background-color: #2a6b0b;
+    transform: scale(0.95); }
+
 .component-button:not(:disabled).component-button-primary-light {
   background-color: #d7e6c8;
   border-color: #d7e6c8;
@@ -1667,6 +1842,27 @@ h5 {
     background-color: #cd0000;
     transform: scale(0.95); }
 
+.component-button:not(:disabled).component-button-danger-darker {
+  background-color: #803230;
+  border-color: #803230;
+  color: #fefefe; }
+  .component-button:not(:disabled).component-button-danger-darker:focus {
+    border-color: #803230; }
+  .component-button:not(:disabled).component-button-danger-darker:hover {
+    border-color: #6d2b29;
+    background-color: #6d2b29; }
+  .component-button:not(:disabled).component-button-danger-darker:active {
+    border-color: #6d2b29;
+    background-color: #6d2b29;
+    transform: scale(0.95); }
+
+.component-button:not(:disabled).component-button-danger-darker-outline {
+  background-color: rgba(0, 0, 0, 0);
+  border-color: #803230;
+  color: #803230; }
+  .component-button:not(:disabled).component-button-danger-darker-outline:active {
+    transform: scale(0.95); }
+
 .component-button:not(:disabled).component-button-default {
   background-color: rgba(0, 0, 0, 0);
   border-color: rgba(0, 0, 0, 0);
@@ -1678,6 +1874,13 @@ h5 {
   .component-button:not(:disabled).component-button-default:active {
     transform: scale(0.95); }
 
+.component-button:not(:disabled).component-button-black {
+  background-color: #121212;
+  border-color: #121212;
+  color: #fefefe; }
+  .component-button:not(:disabled).component-button-black:active {
+    transform: scale(0.95); }
+
 .component-button:not(:disabled).component-button-default-primary {
   position: relative;
   background-color: rgba(0, 0, 0, 0);
@@ -7411,9 +7614,6 @@ h5 {
   align-items: center;
   justify-content: center;
   transition: transform 0.3s ease, opacity 0.3s ease; }
-  .component-date-picker-clear-button svg {
-    max-height: 0.72em;
-    max-width: 0.72em; }
 
 @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -9498,6 +9698,7 @@ h5 {
     flex-flow: column;
     flex: 1 1 auto;
     overflow-y: overlay;
+    position: relative;
     padding: 0; }
     .full-height-container .full-height-container-row-content.vertical-padding {
       padding-top: 12px;
@@ -15098,15 +15299,31 @@ h5 {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 12px 8px;
+    padding: 12px;
     color: #323c32;
     font-size: 16px;
     word-break: break-all;
-    transition: color 0.3s ease; }
+    transition: color 0.3s ease;
+    position: relative; }
+    .component-table-file-name-and-action .component-table-file-name-and-action-file.white {
+      background-color: #fefefe; }
+    .component-table-file-name-and-action .component-table-file-name-and-action-file:first-child {
+      border-top-left-radius: 8px;
+      border-top-right-radius: 8px; }
+    .component-table-file-name-and-action .component-table-file-name-and-action-file:last-child {
+      border-bottom-left-radius: 8px;
+      border-bottom-right-radius: 8px; }
     .component-table-file-name-and-action .component-table-file-name-and-action-file span {
-      padding-right: 8px; }
-    .component-table-file-name-and-action .component-table-file-name-and-action-file:not(:last-child) {
-      border-bottom: 1px solid #cdd3cd; }
+      padding-right: 8px;
+      padding-bottom: 3px; }
+    .component-table-file-name-and-action .component-table-file-name-and-action-file:not(:last-child)::after {
+      content: '';
+      position: absolute;
+      left: 8px;
+      bottom: 0;
+      width: calc(100% - 16px);
+      height: 1px;
+      background-color: #cdd3cd; }
     .component-table-file-name-and-action .component-table-file-name-and-action-file.error * {
       color: #e60000; }
     .component-table-file-name-and-action .component-table-file-name-and-action-file.disabled * {

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 import Accordion from './components/accordion/Accordion';
 import Aconteceu from './components/aconteceu/Aconteceu';
+import ActionCard from './components/actionCard/ActionCard';
 import AdvancedSemiHeader from './components/advancedSemiHeader/AdvancedSemiHeader';
 import AnimatedLink from './components/animatedLink/AnimatedLink';
 import AssembleiaItem from './components/assembleiaItem/AssembleiaItem';
@@ -88,10 +89,12 @@ import useDropOpened from './hooks/useDropOpened/useDropOpened';
 import useModalManager from './hooks/useModalManager/useModalManager';
 import useProgressiveCount from './hooks/useProgressiveCount/useProgressiveCount';
 import useScreenSize from './hooks/useScreenSize/useScreenSize';
+import useStorageState from './hooks/useStorageState/useStorageState';
 import useTimeElapsed from './hooks/useTimeElapsed/useTimeElapsed';
 import useToastManager from './hooks/useToastManager/useToastManager';
 import useValidatedState from './hooks/useValidatedState/useValidatedState';
 export * from './components/modal/ModalTypes';
+export * from './libraries/ActionCardThemes';
 export * from './libraries/BlobFileTypes';
 export * from './libraries/ButtonTheme';
 export * from './libraries/CardThemes';
@@ -108,4 +111,4 @@ export * from './libraries/RadioButtonTheme';
 export * from './libraries/SicrediLogoThemes';
 export * from './libraries/Toast';
 export * from './libraries/Tooltips';
-export { Accordion, AdvancedSemiHeader, AssembleiaItem, AssembleiaPauta, Aconteceu, AnimatedLink, Banner, BannerAssembleia, BannerPesquisaCpfCnpj, BigBlockButton, BlocoDeNotas, BreadCrumb, Button, ButtonFileUpload, BlocoMinhasAssembleias, BottomNavigation, Card, Carousel, CarouselPersona, CarouselTouchFrendly, Checkbox, Col, Collapse, Container, DatePicker, Doughnut, DoughnutSquare, DropdownItem, DropdownMenu, EditableVideoItem, ElementPaginator, Etapas, Etiqueta, FileLoader, FileUpload, FooterSicredi, FullHeightContainer, Header, HeaderSeparator, HeaderSearchField, IconButton, IconButtonWithLabel, Information, Input, InputArea, ItemDropdownDownload, InformativoAssembleiasComImagem, InformativoAssembleiasComVideo, Menu, MenuItem, Modal, ModalManager, ModulosTitle, MoneyByMonth, MoneyMonthLineChart, NotaEdit, Notification, PageSubTitle, PageTitle, Paginator, PreviaVideo, ProgressBar, RadioButton, Row, SearchBlocoDeNotas, Select, Switch, Table, TypedTable, TableFileNameAndAction, TableActions, TableWithOverflow, TextEditor, LeftCheckboxWithLabel, ActionsColumn, Tabs, Toast, ToastManager, Tooltip, TooltipManager, TopLoader, VideoItem, VideoPlayer, VideoModal, useCallbackedState, useCarouselBehaviour, useControlledTimer, useDraggableContainer, useDropOpened, useModalManager, useProgressiveCount, useScreenSize, useTimeElapsed, useToastManager, useValidatedState };
+export { Accordion, ActionCard, AdvancedSemiHeader, AssembleiaItem, AssembleiaPauta, Aconteceu, AnimatedLink, Banner, BannerAssembleia, BannerPesquisaCpfCnpj, BigBlockButton, BlocoDeNotas, BreadCrumb, Button, ButtonFileUpload, BlocoMinhasAssembleias, BottomNavigation, Card, Carousel, CarouselPersona, CarouselTouchFrendly, Checkbox, Col, Collapse, Container, DatePicker, Doughnut, DoughnutSquare, DropdownItem, DropdownMenu, EditableVideoItem, ElementPaginator, Etapas, Etiqueta, FileLoader, FileUpload, FooterSicredi, FullHeightContainer, Header, HeaderSeparator, HeaderSearchField, IconButton, IconButtonWithLabel, Information, Input, InputArea, ItemDropdownDownload, InformativoAssembleiasComImagem, InformativoAssembleiasComVideo, Menu, MenuItem, Modal, ModalManager, ModulosTitle, MoneyByMonth, MoneyMonthLineChart, NotaEdit, Notification, PageSubTitle, PageTitle, Paginator, PreviaVideo, ProgressBar, RadioButton, Row, SearchBlocoDeNotas, Select, Switch, Table, TypedTable, TableFileNameAndAction, TableActions, TableWithOverflow, TextEditor, LeftCheckboxWithLabel, ActionsColumn, Tabs, Toast, ToastManager, Tooltip, TooltipManager, TopLoader, VideoItem, VideoPlayer, VideoModal, useCallbackedState, useCarouselBehaviour, useControlledTimer, useDraggableContainer, useDropOpened, useModalManager, useProgressiveCount, useScreenSize, useStorageState, useTimeElapsed, useToastManager, useValidatedState, };