pge-front-common 10.3.0 → 10.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/PgeButton/PgeButton.stories.d.ts +15 -0
- package/lib/components/PgeButton/index.d.ts +3 -0
- package/lib/components/PgeButton/index.type.d.ts +12 -0
- package/lib/components/Upload/FileUpload.stories.d.ts +6 -0
- package/lib/components/Upload/index.d.ts +3 -0
- package/lib/components/Upload/index.type.d.ts +5 -0
- package/lib/icons/index.d.ts +3 -1
- package/lib/icons/print-icon.d.ts +2 -0
- package/lib/icons/upload-file.d.ts +2 -0
- package/lib/index.d.ts +29 -3
- package/lib/index.esm.js +115 -44
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +118 -43
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { PgeButton } from "./index";
|
|
3
|
+
declare const meta: Meta<typeof PgeButton>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const Primary: Story;
|
|
8
|
+
export declare const PrimaryFullWidth: Story;
|
|
9
|
+
export declare const PrimaryDisabled: Story;
|
|
10
|
+
export declare const PrimaryWithIcon: Story;
|
|
11
|
+
export declare const Secondary: Story;
|
|
12
|
+
export declare const SecondaryDisabled: Story;
|
|
13
|
+
export declare const SecondaryDanger: Story;
|
|
14
|
+
export declare const Tertiary: Story;
|
|
15
|
+
export declare const TertiaryDanger: Story;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
type ButtonVariant = "primary" | "secondary" | "tertiary";
|
|
2
|
+
type WidthType = "full-width" | "fit-content";
|
|
3
|
+
export type ButtonProps = {
|
|
4
|
+
variant: ButtonVariant;
|
|
5
|
+
danger?: boolean;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
title: string;
|
|
8
|
+
leftIcon?: React.ReactNode;
|
|
9
|
+
rightIcon?: React.ReactNode;
|
|
10
|
+
widthType?: WidthType;
|
|
11
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
|
|
12
|
+
export {};
|
package/lib/icons/index.d.ts
CHANGED
|
@@ -30,4 +30,6 @@ import { IconHourglass } from "./hour-glass-icon";
|
|
|
30
30
|
import { IconSearch } from "./search-icon";
|
|
31
31
|
import { IconUpAndDownArror } from "./up-down-arrow";
|
|
32
32
|
import { IconCheck } from "./check-icon";
|
|
33
|
-
|
|
33
|
+
import { IconPrint } from "./print-icon";
|
|
34
|
+
import { IconUploadFile } from "./upload-file";
|
|
35
|
+
export { IconPrint, IconDownload, IconVisibility, IconEdit, IconDelete, IconCalendar, IconProfile, IconUpload, IconNewTab, IconWarning, IconCheckCircle, IconEventAvaliable, IconLogout, IconCLose, IconAdd, IconRemove, IconCircleExpland, IconCircleRecall, IconArrowExpland, IconArrowRecall, IconTriangleExpand, IconTriangleRecall, IconSwap, IconAddCell, MenuIcon, LogoRhDigital, LogoPGERG, IconInvisibility, IconPdf, IconHourglass, IconSearch, IconUpAndDownArror, IconCheck, IconUploadFile };
|
package/lib/index.d.ts
CHANGED
|
@@ -2,12 +2,12 @@ import * as React$1 from 'react';
|
|
|
2
2
|
import React__default, { InputHTMLAttributes, ReactNode, HtmlHTMLAttributes, ChangeEvent, SVGProps } from 'react';
|
|
3
3
|
import { Control } from 'react-hook-form';
|
|
4
4
|
|
|
5
|
-
interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
5
|
+
interface ButtonProps$1 extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
6
6
|
variant: "primary" | "secondary";
|
|
7
7
|
text: string;
|
|
8
8
|
leftIcon?: React__default.ReactNode;
|
|
9
9
|
}
|
|
10
|
-
declare function Button({ variant, text, leftIcon, ...props }: ButtonProps): React__default.JSX.Element;
|
|
10
|
+
declare function Button({ variant, text, leftIcon, ...props }: ButtonProps$1): React__default.JSX.Element;
|
|
11
11
|
|
|
12
12
|
interface InputBaseProps extends InputHTMLAttributes<HTMLInputElement> {
|
|
13
13
|
customClass?: string;
|
|
@@ -54,6 +54,28 @@ interface PasswordInputProps extends InputProps {
|
|
|
54
54
|
}
|
|
55
55
|
declare const PasswordInput: React__default.FC<PasswordInputProps>;
|
|
56
56
|
|
|
57
|
+
type ButtonVariant = "primary" | "secondary" | "tertiary";
|
|
58
|
+
type WidthType = "full-width" | "fit-content";
|
|
59
|
+
type ButtonProps = {
|
|
60
|
+
variant: ButtonVariant;
|
|
61
|
+
danger?: boolean;
|
|
62
|
+
disabled?: boolean;
|
|
63
|
+
title: string;
|
|
64
|
+
leftIcon?: React.ReactNode;
|
|
65
|
+
rightIcon?: React.ReactNode;
|
|
66
|
+
widthType?: WidthType;
|
|
67
|
+
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
|
|
68
|
+
|
|
69
|
+
declare const PgeButton: ({ variant, danger, disabled, widthType, leftIcon, rightIcon, title, className, ...props }: ButtonProps) => React__default.JSX.Element;
|
|
70
|
+
|
|
71
|
+
interface UploadFileProps {
|
|
72
|
+
fileTypes: string[];
|
|
73
|
+
onFileSelect: (file: File | null) => void;
|
|
74
|
+
title?: string;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
declare const FileUpload: ({ fileTypes, onFileSelect, title }: UploadFileProps) => React__default.JSX.Element;
|
|
78
|
+
|
|
57
79
|
type TextAlignType = "start" | "end" | "center";
|
|
58
80
|
interface TextareaBaseProps extends Partial<HTMLTextAreaElement> {
|
|
59
81
|
label?: string;
|
|
@@ -296,4 +318,8 @@ declare const IconUpAndDownArror: (props?: SVGProps<SVGSVGElement>) => React__de
|
|
|
296
318
|
|
|
297
319
|
declare const IconCheck: (props?: SVGProps<SVGSVGElement>) => React__default.JSX.Element;
|
|
298
320
|
|
|
299
|
-
|
|
321
|
+
declare const IconPrint: (props?: SVGProps<SVGSVGElement>) => React__default.JSX.Element;
|
|
322
|
+
|
|
323
|
+
declare const IconUploadFile: (props?: SVGProps<SVGSVGElement>) => React__default.JSX.Element;
|
|
324
|
+
|
|
325
|
+
export { Accordion, AccordionItem, type AccordionItemProps, BoxError, BoxSuccess, Button, type ButtonProps$1 as ButtonProps, Checkbox, type Column, FileUpload, FooterComponent as Footer, Header, IconAdd, IconAddCell, IconArrowExpland, IconArrowRecall, IconCLose, IconCalendar, IconCheck, IconCheckCircle, IconCircleExpland, IconCircleRecall, IconDelete, IconDownload, IconEdit, IconEventAvaliable, IconHourglass, IconInvisibility, IconLogout, IconNewTab, IconPdf, IconPrint, IconProfile, IconRemove, IconSearch, IconSwap, IconTriangleExpand, IconTriangleRecall, IconUpAndDownArror, IconUpload, IconUploadFile, IconVisibility, IconWarning, InformativeBox, type InformativeBoxProps, InputBase, type InputProps, LoadingSpinner, SelectMult as Multiselect, type OptionsProps, PaginationTable, Pagination as PaginationV2, PasswordInput, PgeButton, RadioGroupBase, type RadioGroupBaseProps, type SelectMultProps, TableComponent, type TableComponentProps, TextareaBase, type TextareaBaseProps, Title };
|
package/lib/index.esm.js
CHANGED
|
@@ -74,35 +74,35 @@ function styleInject(css, ref) {
|
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
|
|
77
|
-
var css_248z$
|
|
78
|
-
var styles$
|
|
79
|
-
styleInject(css_248z$
|
|
77
|
+
var css_248z$p = ".button-module__button___JyfZW {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 4px;\r\n cursor: pointer;\r\n padding: 12px 16px;\r\n border-radius: 8px;\r\n min-width: 70px;\r\n height: 38px;\r\n width: 100%;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO {\r\n border: 1px solid #005a92;\r\n background: #005a92;\r\n color: #ffffff;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO:hover {\r\n opacity: 1;\r\n background-color: rgb(0 67 109);\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__secondary___Q4I1z {\r\n border: 1px solid #005a92;\r\n background: transparent;\r\n color: #005a92;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW:disabled {\r\n cursor: not-allowed;\r\n}\r\n";
|
|
78
|
+
var styles$k = {"button":"button-module__button___JyfZW","primary":"button-module__primary___ggjlO","secondary":"button-module__secondary___Q4I1z"};
|
|
79
|
+
styleInject(css_248z$p);
|
|
80
80
|
|
|
81
81
|
function Button(_a) {
|
|
82
82
|
var variant = _a.variant, _b = _a.text, text = _b === void 0 ? "" : _b, leftIcon = _a.leftIcon, props = __rest(_a, ["variant", "text", "leftIcon"]);
|
|
83
|
-
return (React__default.createElement("button", __assign({ className: "".concat(styles$
|
|
83
|
+
return (React__default.createElement("button", __assign({ className: "".concat(styles$k.button, " ").concat(styles$k[variant]) }, props),
|
|
84
84
|
leftIcon,
|
|
85
85
|
text));
|
|
86
86
|
}
|
|
87
87
|
|
|
88
88
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
89
89
|
|
|
90
|
-
var css_248z$
|
|
91
|
-
var styles$
|
|
92
|
-
styleInject(css_248z$
|
|
90
|
+
var css_248z$o = ".styles-module__textInput___zRDx3 {\r\n width: 100%;\r\n height: 40px;\r\n padding: 14px 8px 14px 8px;\r\n border-radius: 8px;\r\n gap: 4px;\r\n font-size: 13px;\r\n border: 1px solid #cfcfcffc;\r\n color: #363632;\r\n outline: none;\r\n transition: all 0.5s;\r\n margin-right: 0.25rem;\r\n}\r\n\r\n.styles-module__inputContainer___fTYpT {\r\n width: 100%;\r\n color: #30303090;\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 2px;\r\n}\r\n\r\n.styles-module__iconWrapper___5jskS {\r\n position: absolute;\r\n left: 8px;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.styles-module__inputContent___jakTk {\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n height: fit-content;\r\n\r\n > svg {\r\n position: fixed;\r\n }\r\n}\r\n.styles-module__titleLabel___9RzJM {\r\n display: flex;\r\n align-items: center;\r\n margin-bottom: 5px;\r\n justify-content: space-between;\r\n}\r\n\r\n.styles-module__labelInput___LHLDU {\r\n color: #303030;\r\n line-height: 21px;\r\n font-size: 16px;\r\n bottom: 5px;\r\n font-weight: 700;\r\n}\r\n\r\n.styles-module__textInput___zRDx3:disabled {\r\n background: #eeeeee;\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__textInput___zRDx3:focus {\r\n color: #495057;\r\n outline: none;\r\n border: 1px solid #1a95b0;\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n}\r\n\r\n.styles-module__textInput___zRDx3::placeholder {\r\n font-weight: bold;\r\n color: #30303033;\r\n}\r\n\r\n.styles-module__textInputDanger___s-nLl {\r\n border: 1px solid #cb0a0a;\r\n box-shadow: 0px 0px 0px 2px #dc354580;\r\n}\r\n\r\n.styles-module__password-input-container___9tvR7 {\r\n position: relative;\r\n width: 360px;\r\n}\r\n\r\n.styles-module__inputTextPswUser___KYL7T:focus {\r\n border-color: #005a92;\r\n box-shadow: none;\r\n}\r\n\r\n.styles-module__inputTextPswUser___KYL7T:disabled {\r\n background-color: #c3c3c3;\r\n border: #cfcfcffc;\r\n}\r\n\r\n.styles-module__inputTextPswUser___KYL7T::placeholder {\r\n font-weight: 587;\r\n color: #c3c3c3;\r\n}\r\n\r\n.styles-module__buttonTextPswUser___j2bLn {\r\n position: absolute;\r\n top: 50%;\r\n right: 15px;\r\n transform: translateY(-50%);\r\n cursor: pointer;\r\n background: none;\r\n border: none;\r\n padding: 0;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.styles-module__buttonTextPswUser___j2bLn.styles-module__error___PCtVt {\r\n top: 35%;\r\n}\r\n\r\n.styles-module__iconEye___pj-wO {\r\n width: 24px;\r\n height: 24px;\r\n color: #c3c3c3;\r\n}\r\n\r\n.styles-module__restrictionMessage___eCquS {\r\n color: #cb0a0a;\r\n margin-top: 6px;\r\n font-size: 14px;\r\n font-weight: 700;\r\n line-height: 15px;\r\n text-align: left;\r\n}\r\n\r\n.styles-module__iconWrapperLeft___AIWNV {\r\n position: absolute;\r\n left: 8px;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.styles-module__iconWrapperRight___WV43d {\r\n position: absolute;\r\n right: 8px;\r\n display: flex;\r\n align-items: center;\r\n background: none;\r\n border: none;\r\n padding: 0;\r\n cursor: pointer;\r\n color: inherit;\r\n}\r\n";
|
|
91
|
+
var styles$j = {"textInput":"styles-module__textInput___zRDx3","inputContainer":"styles-module__inputContainer___fTYpT","iconWrapper":"styles-module__iconWrapper___5jskS","inputContent":"styles-module__inputContent___jakTk","titleLabel":"styles-module__titleLabel___9RzJM","labelInput":"styles-module__labelInput___LHLDU","textInputDanger":"styles-module__textInputDanger___s-nLl","password-input-container":"styles-module__password-input-container___9tvR7","inputTextPswUser":"styles-module__inputTextPswUser___KYL7T","buttonTextPswUser":"styles-module__buttonTextPswUser___j2bLn","error":"styles-module__error___PCtVt","iconEye":"styles-module__iconEye___pj-wO","restrictionMessage":"styles-module__restrictionMessage___eCquS","iconWrapperLeft":"styles-module__iconWrapperLeft___AIWNV","iconWrapperRight":"styles-module__iconWrapperRight___WV43d"};
|
|
92
|
+
styleInject(css_248z$o);
|
|
93
93
|
|
|
94
94
|
var InputBase = function (_a) {
|
|
95
95
|
var _b;
|
|
96
96
|
var customClass = _a.customClass, restrictionMessage = _a.restrictionMessage, label = _a.label, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, onRightIconClick = _a.onRightIconClick, style = _a.style, props = __rest(_a, ["customClass", "restrictionMessage", "label", "leftIcon", "rightIcon", "onRightIconClick", "style"]);
|
|
97
|
-
return (React__default.createElement("div", { className: styles$
|
|
98
|
-
label && (React__default.createElement("label", { htmlFor: props.name, className: styles$
|
|
99
|
-
React__default.createElement("div", { className: styles$
|
|
100
|
-
leftIcon && React__default.createElement("div", { className: styles$
|
|
101
|
-
React__default.createElement("input", __assign({ className: clsx(styles$
|
|
102
|
-
_b[styles$
|
|
97
|
+
return (React__default.createElement("div", { className: styles$j.inputContainer },
|
|
98
|
+
label && (React__default.createElement("label", { htmlFor: props.name, className: styles$j.labelInput }, label)),
|
|
99
|
+
React__default.createElement("div", { className: styles$j.inputContent },
|
|
100
|
+
leftIcon && React__default.createElement("div", { className: styles$j.iconWrapperLeft }, leftIcon),
|
|
101
|
+
React__default.createElement("input", __assign({ className: clsx(styles$j.textInput, customClass, (_b = {},
|
|
102
|
+
_b[styles$j.textInputDanger] = restrictionMessage,
|
|
103
103
|
_b)), style: __assign({ paddingLeft: leftIcon ? "36px" : "8px", paddingRight: rightIcon ? "36px" : "8px" }, style), id: props.name }, props)),
|
|
104
|
-
rightIcon && (React__default.createElement("button", { type: "button", className: styles$
|
|
105
|
-
restrictionMessage && (React__default.createElement("div", { className: styles$
|
|
104
|
+
rightIcon && (React__default.createElement("button", { type: "button", className: styles$j.iconWrapperRight, onClick: function () { return onRightIconClick === null || onRightIconClick === void 0 ? void 0 : onRightIconClick(); }, "aria-label": "A\u00E7\u00E3o ao clicar no \u00EDcone ao lado direito" }, rightIcon))),
|
|
105
|
+
restrictionMessage && (React__default.createElement("div", { className: styles$j.restrictionMessage }, restrictionMessage))));
|
|
106
106
|
};
|
|
107
107
|
|
|
108
108
|
var IconDownload = function (props) { return (React__default.createElement("svg", __assign({ width: "17", height: "17", viewBox: "0 0 17 17", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
|
|
@@ -334,14 +334,29 @@ var IconUpAndDownArror = function (props) { return (React__default.createElement
|
|
|
334
334
|
var IconCheck = function (props) { return (React__default.createElement("svg", __assign({ width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
|
|
335
335
|
React__default.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.468 1.67573L3.99303 9.83025L0.792969 6.63019L2.20718 5.21597L3.9302 6.93899L9.99369 0.32428L11.468 1.67573Z", fill: "white" }))); };
|
|
336
336
|
|
|
337
|
-
var
|
|
338
|
-
|
|
339
|
-
|
|
337
|
+
var IconPrint = function (props) { return (React__default.createElement("svg", __assign({ width: "16", height: "14", viewBox: "0 0 16 14", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props),
|
|
338
|
+
React__default.createElement("path", { d: "M12.2595 3.01279H3.09292V0.787938C3.09292 0.577813 3.17205 0.393959 3.33031 0.236375C3.48856 0.0787918 3.6733 0 3.88452 0H11.4646C11.6794 0 11.8656 0.0791253 12.0231 0.237375C12.1807 0.395625 12.2595 0.579729 12.2595 0.789688V3.01279ZM12.516 7.31244C12.7521 7.31244 12.9569 7.22563 13.1305 7.05202C13.3042 6.87841 13.391 6.67355 13.391 6.43744C13.391 6.20133 13.3042 5.99647 13.1305 5.82285C12.9569 5.64924 12.7521 5.56244 12.516 5.56244C12.2798 5.56244 12.075 5.64924 11.9014 5.82285C11.7278 5.99647 11.641 6.20133 11.641 6.43744C11.641 6.67355 11.7278 6.87841 11.9014 7.05202C12.075 7.22563 12.2798 7.31244 12.516 7.31244ZM4.68267 12.5769H10.6698C10.7446 12.5769 10.806 12.5528 10.8541 12.5048C10.9022 12.4567 10.9262 12.3952 10.9262 12.3204V9.43583H4.42623V12.3204C4.42623 12.3952 4.45027 12.4567 4.49835 12.5048C4.54644 12.5528 4.60787 12.5769 4.68267 12.5769ZM4.68267 13.9102C4.24549 13.9102 3.87124 13.7545 3.55992 13.4432C3.24858 13.1319 3.09292 12.7576 3.09292 12.3204V10.8477H0.789688C0.579729 10.8477 0.395625 10.7686 0.237375 10.6103C0.0791249 10.452 0 10.263 0 10.043V5.93744C0 5.34717 0.207729 4.84197 0.623187 4.42183C1.03865 4.00171 1.54618 3.79165 2.14579 3.79165H13.2067C13.7969 3.79165 14.3021 4.00171 14.7223 4.42183C15.1424 4.84197 15.3525 5.34717 15.3525 5.93744V10.043C15.3525 10.263 15.2733 10.452 15.1151 10.6103C14.9568 10.7686 14.7727 10.8477 14.5628 10.8477H12.2595V12.3204C12.2595 12.7576 12.1039 13.1319 11.7925 13.4432C11.4812 13.7545 11.107 13.9102 10.6698 13.9102H4.68267Z", fill: "currentColor" }))); };
|
|
339
|
+
|
|
340
|
+
var IconUploadFile = function (props) { return (React__default.createElement("svg", { width: "16", height: "17", viewBox: "0 0 16 17", fill: "#fff", xmlns: "http://www.w3.org/2000/svg" },
|
|
341
|
+
React__default.createElement("g", { "clip-path": "url(#clip0_1357_403)" },
|
|
342
|
+
React__default.createElement("rect", { width: "16", height: "16", transform: "translate(0 0.5)", fill: "#fff", "fill-opacity": "0.01" }),
|
|
343
|
+
React__default.createElement("g", { "clip-path": "url(#clip1_1357_403)" },
|
|
344
|
+
React__default.createElement("path", { d: "M0.5 10.3992C0.632608 10.3992 0.759785 10.4519 0.853553 10.5456C0.947322 10.6394 1 10.7666 1 10.8992V13.3992C1 13.6644 1.10536 13.9188 1.29289 14.1063C1.48043 14.2938 1.73478 14.3992 2 14.3992H14C14.2652 14.3992 14.5196 14.2938 14.7071 14.1063C14.8946 13.9188 15 13.6644 15 13.3992V10.8992C15 10.7666 15.0527 10.6394 15.1464 10.5456C15.2402 10.4519 15.3674 10.3992 15.5 10.3992C15.6326 10.3992 15.7598 10.4519 15.8536 10.5456C15.9473 10.6394 16 10.7666 16 10.8992V13.3992C16 13.9296 15.7893 14.4383 15.4142 14.8134C15.0391 15.1885 14.5304 15.3992 14 15.3992H2C1.46957 15.3992 0.960859 15.1885 0.585786 14.8134C0.210714 14.4383 0 13.9296 0 13.3992V10.8992C0 10.7666 0.0526784 10.6394 0.146447 10.5456C0.240215 10.4519 0.367392 10.3992 0.5 10.3992Z", fill: "#fff" }),
|
|
345
|
+
React__default.createElement("path", { d: "M7.646 1.64518C7.69245 1.59862 7.74762 1.56168 7.80837 1.53647C7.86911 1.51127 7.93423 1.49829 8 1.49829C8.06577 1.49829 8.13089 1.51127 8.19163 1.53647C8.25238 1.56168 8.30755 1.59862 8.354 1.64518L11.354 4.64518C11.4479 4.73907 11.5006 4.86641 11.5006 4.99918C11.5006 5.13196 11.4479 5.2593 11.354 5.35318C11.2601 5.44707 11.1328 5.49982 11 5.49982C10.8672 5.49982 10.7399 5.44707 10.646 5.35318L8.5 3.20618V11.9992C8.5 12.1318 8.44732 12.259 8.35355 12.3527C8.25979 12.4465 8.13261 12.4992 8 12.4992C7.86739 12.4992 7.74021 12.4465 7.64645 12.3527C7.55268 12.259 7.5 12.1318 7.5 11.9992V3.20618L5.354 5.35318C5.30751 5.39967 5.25232 5.43655 5.19158 5.46171C5.13084 5.48687 5.06574 5.49982 5 5.49982C4.93426 5.49982 4.86916 5.48687 4.80842 5.46171C4.74768 5.43655 4.69249 5.39967 4.646 5.35318C4.59951 5.3067 4.56264 5.25151 4.53748 5.19077C4.51232 5.13003 4.49937 5.06493 4.49937 4.99918C4.49937 4.93344 4.51232 4.86834 4.53748 4.8076C4.56264 4.74686 4.59951 4.69167 4.646 4.64518L7.646 1.64518Z", fill: "#fff" }))),
|
|
346
|
+
React__default.createElement("defs", null,
|
|
347
|
+
React__default.createElement("clipPath", { id: "clip0_1357_403" },
|
|
348
|
+
React__default.createElement("rect", { width: "16", height: "16", fill: "#fff", transform: "translate(0 0.5)" })),
|
|
349
|
+
React__default.createElement("clipPath", { id: "clip1_1357_403" },
|
|
350
|
+
React__default.createElement("rect", { width: "16", height: "16", fill: "#fff", transform: "translate(0 0.5)" }))))); };
|
|
351
|
+
|
|
352
|
+
var css_248z$n = ".styles-module__toast___JCV9s {\r\n width: 100%;\r\n height: auto;\r\n border-radius: 8px;\r\n padding: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\r\n margin-bottom: 16px;\r\n }\r\n \r\n .styles-module__toast___JCV9s.styles-module__success___-BEJb {\r\n background-color: var(--background-color-success);\r\n }\r\n\r\n .styles-module__title___TK6Kt.styles-module__success___-BEJb {\r\n color: var(--success-color);\r\n }\r\n\r\n .styles-module__toast___JCV9s.styles-module__alert___Gum-6 {\r\n background-color: var(--background-color-error);\r\n }\r\n\r\n .styles-module__title___TK6Kt.styles-module__alert___Gum-6 {\r\n color: var(--alert-color);\r\n }\r\n \r\n .styles-module__toast___JCV9s.styles-module__warning___CVMAV {\r\n background-color: var(--background-color-warning);\r\n }\r\n\r\n .styles-module__title___TK6Kt.styles-module__warning___CVMAV {\r\n color: var(--warning-color);\r\n }\r\n \r\n .styles-module__toast___JCV9s.styles-module__informative___0nyLv {\r\n background-color: #005a9214;\r\n }\r\n\r\n .styles-module__title___TK6Kt.styles-module__informative___0nyLv {\r\n color: var(--information-color);\r\n }\r\n \r\n .styles-module__content___AING8 {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n width: 100%;\r\n gap: var(--small-space);\r\n }\r\n \r\n .styles-module__info___g8ce2 {\r\n display: flex;\r\n align-items: center;\r\n }\r\n \r\n .styles-module__icon___uiYA- {\r\n font-size: 24px;\r\n margin-right: 12px;\r\n }\r\n\r\n .styles-module__icon___uiYA-.styles-module__success___-BEJb {\r\n color: var(--success-color);\r\n }\r\n\r\n .styles-module__icon___uiYA-.styles-module__alert___Gum-6 {\r\n color: var(--alert-color);\r\n }\r\n\r\n .styles-module__icon___uiYA-.styles-module__warning___CVMAV {\r\n color: var(--warning-color);\r\n }\r\n\r\n .styles-module__icon___uiYA-.styles-module__informative___0nyLv {\r\n color: var(--information-color);\r\n }\r\n \r\n .styles-module__text___UCxPH {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n gap: 4px;\r\n }\r\n \r\n .styles-module__text___UCxPH strong {\r\n font-size: 16px;\r\n font-weight: 700;\r\n line-height: 16px;\r\n text-align: left;\r\n text-decoration-skip-ink: none;\r\n }\r\n \r\n .styles-module__text___UCxPH span {\r\n font-size: 14px;\r\n font-weight: 400;\r\n text-align: left;\r\n text-decoration-skip-ink: none;\r\n }\r\n\r\n .styles-module__textContent___S1KEv {\r\n color: var(--foreground);\r\n }\r\n \r\n .styles-module__closeButton___ELkqN {\r\n background: none;\r\n border: none;\r\n cursor: pointer;\r\n font-size: 20px;\r\n color: var(--foreground);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n \r\n .styles-module__closeButton___ELkqN:hover {\r\n color: var(--foreground);\r\n }\r\n\r\n ";
|
|
353
|
+
var styles$i = {"toast":"styles-module__toast___JCV9s","success":"styles-module__success___-BEJb","title":"styles-module__title___TK6Kt","alert":"styles-module__alert___Gum-6","warning":"styles-module__warning___CVMAV","informative":"styles-module__informative___0nyLv","content":"styles-module__content___AING8","info":"styles-module__info___g8ce2","icon":"styles-module__icon___uiYA-","text":"styles-module__text___UCxPH","textContent":"styles-module__textContent___S1KEv","closeButton":"styles-module__closeButton___ELkqN"};
|
|
354
|
+
styleInject(css_248z$n);
|
|
340
355
|
|
|
341
356
|
var InformativeBox = function (_a) {
|
|
342
357
|
var infoType = _a.infoType, title = _a.title, message = _a.message, onClose = _a.onClose, _b = _a.hasDismissButton, hasDismissButton = _b === void 0 ? false : _b, props = __rest(_a, ["infoType", "title", "message", "onClose", "hasDismissButton"]);
|
|
343
358
|
var getIcon = function () {
|
|
344
|
-
var iconClass = "".concat(styles$
|
|
359
|
+
var iconClass = "".concat(styles$i.icon, " ").concat(styles$i[infoType] || '');
|
|
345
360
|
switch (infoType) {
|
|
346
361
|
case 'success':
|
|
347
362
|
return React__default.createElement(IconCheckCircle, { className: iconClass });
|
|
@@ -355,21 +370,21 @@ var InformativeBox = function (_a) {
|
|
|
355
370
|
return null;
|
|
356
371
|
}
|
|
357
372
|
};
|
|
358
|
-
return (React__default.createElement("div", __assign({ className: styles$
|
|
359
|
-
React__default.createElement("div", { className: "".concat(styles$
|
|
360
|
-
React__default.createElement("div", { className: styles$
|
|
361
|
-
React__default.createElement("div", { className: styles$
|
|
373
|
+
return (React__default.createElement("div", __assign({ className: styles$i.inputContainer }, props),
|
|
374
|
+
React__default.createElement("div", { className: "".concat(styles$i.toast, " ").concat(styles$i[infoType]) },
|
|
375
|
+
React__default.createElement("div", { className: styles$i.content },
|
|
376
|
+
React__default.createElement("div", { className: styles$i.info },
|
|
362
377
|
getIcon(),
|
|
363
|
-
React__default.createElement("div", { className: styles$
|
|
364
|
-
React__default.createElement("strong", { className: "".concat(styles$
|
|
365
|
-
React__default.createElement("span", { className: styles$
|
|
366
|
-
hasDismissButton && (React__default.createElement("button", { className: styles$
|
|
378
|
+
React__default.createElement("div", { className: styles$i.text },
|
|
379
|
+
React__default.createElement("strong", { className: "".concat(styles$i.title, " ").concat(styles$i[infoType]) }, title),
|
|
380
|
+
React__default.createElement("span", { className: styles$i.textContent }, message))),
|
|
381
|
+
hasDismissButton && (React__default.createElement("button", { className: styles$i.closeButton, onClick: function () { return onClose === null || onClose === void 0 ? void 0 : onClose(); } },
|
|
367
382
|
React__default.createElement(IconCLose, null)))))));
|
|
368
383
|
};
|
|
369
384
|
|
|
370
|
-
var css_248z$
|
|
371
|
-
var styles$
|
|
372
|
-
styleInject(css_248z$
|
|
385
|
+
var css_248z$m = "\r\n.styles-module__checkbox___AOdO1 {\r\n width: 16px;\r\n height: 16px;\r\n border-radius: 2px;\r\n background: #FFFFFF;\r\n border: 1px solid var(--light-grey-color, #C3C3C3);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n}\r\n\r\n.styles-module__checkbox___AOdO1.styles-module__hover___a-QfL {\r\n background: var(--10-primary-color, #005A921A);\r\n border: 1px solid var(--light-grey-color, #C3C3C3);\r\n}\r\n\r\n.styles-module__checkbox___AOdO1.styles-module__checked___kDWfB.styles-module__hover___a-QfL {\r\n background: var(--primary-color, #005A92);\r\n border: 1px solid var(--primary-color, #005A92);\r\n}\r\n\r\n.styles-module__checkbox___AOdO1.styles-module__focus___yGjAN {\r\n box-shadow: 0px 0px 0px 2px #5E92B3;\r\n background: var(--10-primary-color, #005A921A);\r\n border: 1px solid var(--light-grey-color, #C3C3C3);\r\n}\r\n\r\n.styles-module__checkbox___AOdO1.styles-module__disabled___bTmRr {\r\n border: 1px solid var(--light-grey-color, #C3C3C3);\r\n background: var(--light-grey-color, #A0A0A01A);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__icon___F-Rd5 {\r\n width: 10px;\r\n height: 9px;\r\n}\r\n\r\n.styles-module__checkbox___AOdO1.styles-module__checked___kDWfB {\r\n background: var(--primary-color, #005A92);\r\n border: 1px solid var(--primary-color, #005A92);\r\n}";
|
|
386
|
+
var styles$h = {"checkbox":"styles-module__checkbox___AOdO1","hover":"styles-module__hover___a-QfL","checked":"styles-module__checked___kDWfB","focus":"styles-module__focus___yGjAN","disabled":"styles-module__disabled___bTmRr","icon":"styles-module__icon___F-Rd5"};
|
|
387
|
+
styleInject(css_248z$m);
|
|
373
388
|
|
|
374
389
|
var Checkbox = function (_a) {
|
|
375
390
|
var _b = _a.checked, checked = _b === void 0 ? false : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, onChange = _a.onChange;
|
|
@@ -380,12 +395,12 @@ var Checkbox = function (_a) {
|
|
|
380
395
|
onChange(!checked);
|
|
381
396
|
}
|
|
382
397
|
};
|
|
383
|
-
return (React__default.createElement("div", { className: "".concat(styles$
|
|
398
|
+
return (React__default.createElement("div", { className: "".concat(styles$h.checkbox, " ").concat(checked ? styles$h.checked : "", " ").concat(disabled ? styles$h.disabled : "", " \n ").concat(isHovered ? styles$h.hover : "", " ").concat(isFocused ? styles$h.focus : ""), tabIndex: disabled ? -1 : 0, role: "checkbox", "aria-checked": checked, "aria-disabled": disabled, onClick: handleClick, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onFocus: function () { return setIsFocused(true); }, onBlur: function () { return setIsFocused(false); } }, checked && React__default.createElement(IconCheck, { className: styles$h.icon })));
|
|
384
399
|
};
|
|
385
400
|
|
|
386
|
-
var css_248z$
|
|
387
|
-
var styles$
|
|
388
|
-
styleInject(css_248z$
|
|
401
|
+
var css_248z$l = ".styles-module__textInput___wHRWE {\r\n width: 100%;\r\n height: 40px;\r\n padding: 14px 8px 14px 8px;\r\n border-radius: 8px;\r\n gap: 4px;\r\n font-size: 13px;\r\n border: 1px solid #cfcfcffc;\r\n color: #363632;\r\n outline: none;\r\n transition: all 0.5s;\r\n}\r\n\r\n.styles-module__inputContainer___g57h7 {\r\n width: 100%;\r\n color: #30303090;\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 2px;\r\n}\r\n\r\n.styles-module__iconWrapper___E7smd {\r\n position: absolute;\r\n left: 8px;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.styles-module__inputContent___5TSoO {\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n height: 46px;\r\n\r\n > svg {\r\n position: fixed;\r\n }\r\n}\r\n.styles-module__titleLabel___Jsy6t {\r\n display: flex;\r\n align-items: center;\r\n margin-bottom: 5px;\r\n justify-content: space-between;\r\n}\r\n\r\n.styles-module__labelInput___eqPUg {\r\n color: #303030;\r\n line-height: 21px;\r\n font-size: 16px;\r\n bottom: 5px;\r\n font-weight: 700;\r\n}\r\n\r\n.styles-module__textInput___wHRWE:disabled {\r\n background: #eeeeee;\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__textInput___wHRWE:focus {\r\n color: #495057;\r\n outline: none;\r\n border: 1px solid #1a95b0;\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n}\r\n\r\n.styles-module__textInput___wHRWE::placeholder {\r\n font-weight: bold;\r\n color: #30303033;\r\n}\r\n\r\n.styles-module__textInputDanger___GDXT3 {\r\n border: 1px solid #cb0a0a;\r\n box-shadow: 0px 0px 0px 2px #dc354580;\r\n}\r\n\r\n.styles-module__passwordInputContainer___-De-m {\r\n position: relative;\r\n width: 100%;\r\n}\r\n\r\n.styles-module__inputTextPswUser___Ceign:focus {\r\n border-color: #005a92;\r\n box-shadow: none;\r\n}\r\n\r\n.styles-module__inputTextPswUser___Ceign:disabled {\r\n background-color: #c3c3c3;\r\n border: #cfcfcffc;\r\n}\r\n\r\n.styles-module__inputTextPswUser___Ceign::placeholder {\r\n font-weight: 587;\r\n color: #c3c3c3;\r\n}\r\n\r\n.styles-module__buttonTextPswUser___aK999 {\r\n position: absolute;\r\n top: 50%;\r\n right: 15px;\r\n transform: translateY(-50%);\r\n cursor: pointer;\r\n background: none;\r\n border: none;\r\n padding: 0;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.styles-module__buttonTextPswUser___aK999.styles-module__error___Rg4fj {\r\n top: 35%;\r\n}\r\n\r\n.styles-module__iconEye___-ywWa {\r\n width: 24px;\r\n height: 24px;\r\n color: #c3c3c3;\r\n}\r\n\r\n.styles-module__restrictionMessage___BhxxE {\r\n color: #cb0a0a;\r\n margin-top: 6px;\r\n font-size: 14px;\r\n font-weight: 700;\r\n line-height: 15px;\r\n text-align: left;\r\n}\r\n";
|
|
402
|
+
var styles$g = {"textInput":"styles-module__textInput___wHRWE","inputContainer":"styles-module__inputContainer___g57h7","iconWrapper":"styles-module__iconWrapper___E7smd","inputContent":"styles-module__inputContent___5TSoO","titleLabel":"styles-module__titleLabel___Jsy6t","labelInput":"styles-module__labelInput___eqPUg","textInputDanger":"styles-module__textInputDanger___GDXT3","passwordInputContainer":"styles-module__passwordInputContainer___-De-m","inputTextPswUser":"styles-module__inputTextPswUser___Ceign","buttonTextPswUser":"styles-module__buttonTextPswUser___aK999","error":"styles-module__error___Rg4fj","iconEye":"styles-module__iconEye___-ywWa","restrictionMessage":"styles-module__restrictionMessage___BhxxE"};
|
|
403
|
+
styleInject(css_248z$l);
|
|
389
404
|
|
|
390
405
|
var IconEyeOpen = function (props) { return (React__default.createElement("svg", __assign({ xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", fill: "currentColor" }, props),
|
|
391
406
|
React__default.createElement("path", { d: "M480-320q75 0 127.5-52.5T660-500q0-75-52.5-127.5T480-680q-75 0-127.5 52.5T300-500q0 75 52.5 127.5T480-320Zm0-72q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm0 192q-146 0-266-81.5T40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200Zm0-300Zm0 220q113 0 207.5-59.5T832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280Z" }))); };
|
|
@@ -401,16 +416,72 @@ var PasswordInput = function (_a) {
|
|
|
401
416
|
props.onChange(e);
|
|
402
417
|
}
|
|
403
418
|
};
|
|
404
|
-
return (React__default.createElement("div", { className: styles$
|
|
405
|
-
label && (React__default.createElement("label", { htmlFor: props.name, className: styles$
|
|
406
|
-
React__default.createElement("div", { className: styles$
|
|
407
|
-
React__default.createElement("input", __assign({ id: "psw", name: props.name || "psw", type: showPassword ? "text" : "password", autoComplete: "off", placeholder: "Digite sua senha", maxLength: 100, minLength: 5, onChange: handleInputChange, className: clsx(styles$
|
|
408
|
-
_b[styles$
|
|
419
|
+
return (React__default.createElement("div", { className: styles$g.inputContainer },
|
|
420
|
+
label && (React__default.createElement("label", { htmlFor: props.name, className: styles$g.labelInput }, label)),
|
|
421
|
+
React__default.createElement("div", { className: styles$g.passwordInputContainer },
|
|
422
|
+
React__default.createElement("input", __assign({ id: "psw", name: props.name || "psw", type: showPassword ? "text" : "password", autoComplete: "off", placeholder: "Digite sua senha", maxLength: 100, minLength: 5, onChange: handleInputChange, className: clsx(styles$g.textInput, customClass, (_b = {},
|
|
423
|
+
_b[styles$g.textInputDanger] = restrictionMessage,
|
|
409
424
|
_b)), ref: inputRef }, props)),
|
|
410
|
-
React__default.createElement("button", { type: "button", className: clsx(styles$
|
|
411
|
-
_c[styles$
|
|
412
|
-
_c)), onClick: togglePasswordVisibility, name: "icone", "aria-label": "icone" }, showPassword ? (React__default.createElement(IconEyeOpen, { className: styles$
|
|
413
|
-
restrictionMessage && (React__default.createElement("div", { className: clsx(styles$
|
|
425
|
+
React__default.createElement("button", { type: "button", className: clsx(styles$g.buttonTextPswUser, (_c = {},
|
|
426
|
+
_c[styles$g.error] = restrictionMessage,
|
|
427
|
+
_c)), onClick: togglePasswordVisibility, name: "icone", "aria-label": "icone" }, showPassword ? (React__default.createElement(IconEyeOpen, { className: styles$g.iconEye })) : (React__default.createElement(IconEyeClose, { className: styles$g.iconEye }))),
|
|
428
|
+
restrictionMessage && (React__default.createElement("div", { className: clsx(styles$g.restrictionMessage) }, restrictionMessage)))));
|
|
429
|
+
};
|
|
430
|
+
|
|
431
|
+
var css_248z$k = ".styles-module__button___ak3jK {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: 12px 16px;\r\n gap: var(--small-space, 8px);\r\n border-radius: 10px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n transition: all 0.2s ease-in-out;\r\n}\r\n\r\n.styles-module__fullWidth___hkrRe {\r\n width: 100%;\r\n}\r\n\r\n.styles-module__fitContent___h16Hv {\r\n width: fit-content;\r\n}\r\n\r\n.styles-module__primary___0Lugn {\r\n background-color: #005A92;\r\n color: #fff;\r\n border: none;\r\n}\r\n\r\n.styles-module__primary___0Lugn:hover {\r\n background-color: #00436DCC;\r\n}\r\n\r\n.styles-module__primary___0Lugn:active {\r\n border: 1.8px solid var(--Pressed-button, #3AB0F3);\r\n}\r\n\r\n.styles-module__primary___0Lugn:focus {\r\n box-shadow: 0px 4px 4px 0px #00000040;\r\n background: var(--hover-color, #00436d);\r\n}\r\n\r\n.styles-module__primary___0Lugn:disabled {\r\n background: var(--light-grey-color, #C3C3C3);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___C7rZE {\r\n border: 1px solid #005A92;\r\n background: var(--background-color);\r\n color: var(--primary-color);\r\n}\r\n\r\n.styles-module__secondary___C7rZE:hover {\r\n background: #00436D1A;\r\n border: 1px solid #00436DCC;\r\n}\r\n\r\n.styles-module__secondary___C7rZE:active {\r\n background: #00436D1A;\r\n border: 2px solid #3AB0F3CC;\r\n}\r\n\r\n.styles-module__secondary___C7rZE:focus {\r\n background: #52819E40;\r\n border: 2.5px solid #52819E;\r\n}\r\n\r\n.styles-module__secondary___C7rZE:disabled {\r\n border: 1px solid var(--light-grey-color, #C3C3C3);\r\n color: var(--light-grey-color, #C3C3C3);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___C7rZE.styles-module__danger___kcS09 {\r\n border: 1px solid var(--alert-color, #CB0A0A);\r\n color: var(--alert-color, #CB0A0A);\r\n}\r\n\r\n.styles-module__tertiary___xMgwD {\r\n border: none;\r\n background: var(--background-color);\r\n color: var(--primary-color);\r\n}\r\n\r\n.styles-module__tertiary___xMgwD:active {\r\n background: var(--terciary-button-background, #0B81CA47);\r\n}\r\n\r\n.styles-module__tertiary___xMgwD:focus {\r\n background: var(--terciary-button-background, #0B81CA47);\r\n border: 2.5px solid #52819E;\r\n}\r\n\r\n.styles-module__tertiary___xMgwD:disabled {\r\n background: var(--light-grey-color, #C3C3C3);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__tertiary___xMgwD.styles-module__danger___kcS09 {\r\n border: none;\r\n color: var(--alert-color, #CB0A0A);\r\n}\r\n";
|
|
432
|
+
var styles$f = {"button":"styles-module__button___ak3jK","fullWidth":"styles-module__fullWidth___hkrRe","fitContent":"styles-module__fitContent___h16Hv","primary":"styles-module__primary___0Lugn","secondary":"styles-module__secondary___C7rZE","danger":"styles-module__danger___kcS09","tertiary":"styles-module__tertiary___xMgwD"};
|
|
433
|
+
styleInject(css_248z$k);
|
|
434
|
+
|
|
435
|
+
var PgeButton = function (_a) {
|
|
436
|
+
var _b;
|
|
437
|
+
var variant = _a.variant, _c = _a.danger, danger = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.widthType, widthType = _e === void 0 ? "fit-content" : _e, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, _f = _a.title, title = _f === void 0 ? "" : _f, className = _a.className, props = __rest(_a, ["variant", "danger", "disabled", "widthType", "leftIcon", "rightIcon", "title", "className"]);
|
|
438
|
+
var buttonClass = clsx(styles$f.button, styles$f[variant], (_b = {},
|
|
439
|
+
_b[styles$f.danger] = danger && variant !== "primary",
|
|
440
|
+
_b[styles$f.disabled] = disabled,
|
|
441
|
+
_b[styles$f.fullWidth] = widthType === "full-width",
|
|
442
|
+
_b[styles$f.fitContent] = widthType === "fit-content",
|
|
443
|
+
_b), className);
|
|
444
|
+
return (React__default.createElement("button", __assign({ className: buttonClass, disabled: disabled }, props),
|
|
445
|
+
leftIcon && leftIcon,
|
|
446
|
+
title,
|
|
447
|
+
rightIcon && rightIcon));
|
|
448
|
+
};
|
|
449
|
+
|
|
450
|
+
var css_248z$j = ".styles-module__container___9pLua {\r\n width: 100%;\r\n height: fit-content;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n}\r\n\r\n.styles-module__label___AWyTG {\r\n font-size: 16px;\r\n font-weight: 600;\r\n line-height: 24px;\r\n text-align: left;\r\n color: #303030;\r\n}\r\n\r\n.styles-module__inputContainer___tsCfV {\r\n width: 100%;\r\n height: fit-content;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: 4px;\r\n border: 2px dashed var(--primary-color, #005a92);\r\n border-radius: 16px;\r\n padding: 10px;\r\n}\r\n\r\n@media screen and (max-width: 480px) {\r\n .styles-module__inputContainer___tsCfV {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n }\r\n \r\n}\r\n\r\n.styles-module__button___1GicM {\r\n width: fit-content;\r\n display: flex;\r\n align-items: center;\r\n padding: 7px 13px;\r\n gap: 8px;\r\n border-radius: 10px;\r\n color: #fff;\r\n background-color: var(--primary-color);\r\n cursor: pointer;\r\n}\r\n\r\n.styles-module__hiddenInput___lDoAG {\r\n display: none;\r\n}\r\n\r\n.styles-module__description___S1vZj {\r\n font-size: 16px;\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--foreground);\r\n}\r\n\r\n.styles-module__instructionText___fa9r4 {\r\n font-size: 16px;\r\n font-weight: 500;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--foreground);\r\n}\r\n\r\n.styles-module__errorText___1LAhk {\r\n font-size: 14px;\r\n font-weight: 400;\r\n line-height: 21px;\r\n text-align: left;\r\n color: var(--alert-color);\r\n}\r\n\r\n.styles-module__successText___s1G4K {\r\n font-size: 14px;\r\n font-weight: 400;\r\n line-height: 21px;\r\n text-align: left;\r\n color: var(--success-color);\r\n}\r\n";
|
|
451
|
+
var styles$e = {"container":"styles-module__container___9pLua","label":"styles-module__label___AWyTG","inputContainer":"styles-module__inputContainer___tsCfV","button":"styles-module__button___1GicM","hiddenInput":"styles-module__hiddenInput___lDoAG","description":"styles-module__description___S1vZj","instructionText":"styles-module__instructionText___fa9r4","errorText":"styles-module__errorText___1LAhk","successText":"styles-module__successText___s1G4K"};
|
|
452
|
+
styleInject(css_248z$j);
|
|
453
|
+
|
|
454
|
+
var FileUpload = function (_a) {
|
|
455
|
+
var fileTypes = _a.fileTypes, onFileSelect = _a.onFileSelect, _b = _a.title, title = _b === void 0 ? "Upload de Arquivos:" : _b;
|
|
456
|
+
var _c = useState(null), file = _c[0], setFile = _c[1];
|
|
457
|
+
var _d = useState(""), error = _d[0], setError = _d[1];
|
|
458
|
+
var handleFileChange = function (event) {
|
|
459
|
+
var _a, _b;
|
|
460
|
+
var selectedFile = ((_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0]) || null;
|
|
461
|
+
if (selectedFile) {
|
|
462
|
+
var fileExtension = (_b = selectedFile.name.split(".").pop()) === null || _b === void 0 ? void 0 : _b.toLowerCase();
|
|
463
|
+
if (fileExtension && fileTypes.includes(".".concat(fileExtension))) {
|
|
464
|
+
setFile(selectedFile);
|
|
465
|
+
setError("");
|
|
466
|
+
onFileSelect(selectedFile);
|
|
467
|
+
}
|
|
468
|
+
else {
|
|
469
|
+
setFile(null);
|
|
470
|
+
setError("Os arquivos devem ser no formato ".concat(fileTypes.join(", ")));
|
|
471
|
+
onFileSelect(null);
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
};
|
|
475
|
+
return (React__default.createElement("div", { className: styles$e.container },
|
|
476
|
+
React__default.createElement("label", { className: styles$e.label },
|
|
477
|
+
title,
|
|
478
|
+
React__default.createElement("div", { className: styles$e.inputContainer },
|
|
479
|
+
React__default.createElement("label", { className: styles$e.button },
|
|
480
|
+
React__default.createElement(IconUploadFile, null),
|
|
481
|
+
"Escolher arquivo",
|
|
482
|
+
React__default.createElement("input", { type: "file", className: styles$e.hiddenInput, onChange: handleFileChange, accept: fileTypes.join(",") })),
|
|
483
|
+
React__default.createElement("span", { className: styles$e.description }, file ? file === null || file === void 0 ? void 0 : file.name : "Nenhum arquivo selecionado"))),
|
|
484
|
+
React__default.createElement("p", { className: error ? styles$e.errorText : file ? styles$e.successText : styles$e.instructionText }, error || (file ? "Campo correto" : "Clique ou arraste os arquivos para cima do componente de Upload"))));
|
|
414
485
|
};
|
|
415
486
|
|
|
416
487
|
var css_248z$i = ".textarea-module__inputContainer___lpM5d {\r\n width: 306px;\r\n color: var(--color-input);\r\n}\r\n\r\n.textarea-module__label___qDTpX {\r\n color: var(--color-label);\r\n width: 100%;\r\n font-family: var(--font-open-sans-serif);\r\n font-size: var(--input-font-size);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n text-align: left;\r\n cursor: pointer;\r\n}\r\n\r\n.textarea-module__labelRequired___bl2ew::after {\r\n content: \" *\";\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__labelError___f0hpM {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P {\r\n background-color: #fff;\r\n cursor: pointer;\r\n width: 100%;\r\n border-radius: var(--input-border-radius);\r\n border: var(--input-border);\r\n font-family: \"Open Sans\", sans-serif;\r\n font-size: var(--input-font-size);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__inputWrapperError___0gA5w {\r\n border: var(--input-border-danger) !important;\r\n outline: var(--input-outline-danger) !important;\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P:focus,\r\n.textarea-module__inputWrapper___WFx7P:focus-visible,\r\n.textarea-module__inputWrapper___WFx7P:focus-within {\r\n border: var(--input-border-focus);\r\n outline: var(--input-outline-focus);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc {\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f {\r\n color: var(--color-input);\r\n cursor: pointer;\r\n width: 96%;\r\n border: none;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f::placeholder {\r\n color: var(--color-placeholder);\r\n line-height: 20px;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f:focus,\r\n.textarea-module__styledInput___fPp-f:focus-visible,\r\n.textarea-module__styledInput___fPp-f:focus-within {\r\n outline: none;\r\n}\r\n\r\n.textarea-module__message___ys-dL {\r\n color: var(--color-label);\r\n margin-left: 10px;\r\n margin-top: 4px;\r\n font-family: \"Open Sans\", sans-serif;\r\n font-size: 10px;\r\n font-weight: 700;\r\n line-height: 15px;\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__messageError___ubeLK {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc svg {\r\n margin-left: 8px;\r\n}\r\n";
|
|
@@ -8308,5 +8379,5 @@ var TableComponent = function (_a) {
|
|
|
8308
8379
|
var css_248z = "/* src/global.css */\r\n@import url(\"https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&display=swap\");\r\n*,\r\n*::before,\r\n*::after {\r\n box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n font-family: var(--font-open-sans-serif);\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n:root {\r\n /* fonts */\r\n --font-open-sans-serif: \"Open Sans\", \"sans-serif\";\r\n --font-open-sans-light: \"Open Sans\", 300;\r\n --font-open-sans-regular: \"Open Sans\", 400;\r\n --font-open-sans-bold: \"Open Sans\", 700;\r\n /* colors */\r\n --color-primary: #005a92;\r\n --color-secondary: #303030;\r\n --color-success: #198754;\r\n --color-warning: #cb8700;\r\n --color-information: #1a95b0;\r\n --color-danger: #cb0a0a;\r\n --color-focus: var(--color-information);\r\n --color-focus-outline: #0091ea80;\r\n --color-placeholder: #9ca4b47d;\r\n --color-border: #cfcfcffc;\r\n --color-label: #303030;\r\n --color-input: #30303090;\r\n --background-color-success: #1987541a;\r\n --background-color-error: #cb0a0a1a;\r\n --background-color-warning: #cb87001a;\r\n --background-color-table-primary: #eeeeee;\r\n --background-color-table-secondary: #f6f6f6;\r\n --background-color-table-hover: #e5f1f9;\r\n /* input */\r\n --input-border: 1px solid var(--color-border);\r\n --input-border-danger: 1px solid var(--color-danger);\r\n --input-border-radius: 8px;\r\n --input-border-focus: 1px solid var(--color-focus);\r\n --input-cursor: pointer;\r\n --input-font-size: 14px;\r\n --input-font-weight: 700;\r\n --input-line-height: 21px;\r\n --input-outline-focus: solid var(--color-focus-outline) 1.5px;\r\n --input-outline-danger: solid var(--color-danger) 1.5px;\r\n\r\n /* Theming colors */\r\n --background-color: #fff;\r\n --foreground: #303030;\r\n --success-color: #198754;\r\n --warning-color: #cb8700;\r\n --alert-color: #cb0a0a;\r\n --information-color: #1a95b0;\r\n\r\n --primary-color: #005a92;\r\n --pge-gold: #bb9b32;\r\n --hover-color: #00436d;\r\n --icon-color: #4a4a4b;\r\n --border-color: #d9d9d9;\r\n --light-grey-color: #c3c3c3;\r\n --grey-color: #a0a0a0;\r\n}\r\n\r\n/* TO-DO ajustar componentes para aplicar o dark mode */\r\n\r\n/* @media (prefers-color-scheme: dark) {\r\n html {\r\n color-scheme: dark;\r\n }\r\n\r\n :root {\r\n --background-color: #303030;\r\n --foreground: #fff;\r\n --success-color: #4feba3;\r\n --warning-color: #e3a833;\r\n --alert-color: #ff5858;\r\n --information-color: #37adf6;\r\n }\r\n \r\n} */\r\n\r\n.dark-mode {\r\n --background-color: #303030;\r\n --foreground: #fff;\r\n --success-color: #4feba3;\r\n --warning-color: #e3a833;\r\n --alert-color: #ff5858;\r\n --information-color: #37adf6;\r\n}\r\n";
|
|
8309
8380
|
styleInject(css_248z);
|
|
8310
8381
|
|
|
8311
|
-
export { Accordion, AccordionItem, BoxError, BoxSuccess, Button, Checkbox, FooterComponent as Footer, Header, IconAdd, IconAddCell, IconArrowExpland, IconArrowRecall, IconCLose, IconCalendar, IconCheck, IconCheckCircle, IconCircleExpland, IconCircleRecall, IconDelete, IconDownload, IconEdit, IconEventAvaliable, IconHourglass, IconInvisibility, IconLogout, IconNewTab, IconPdf, IconProfile, IconRemove, IconSearch, IconSwap, IconTriangleExpand, IconTriangleRecall, IconUpAndDownArror, IconUpload, IconVisibility, IconWarning, InformativeBox, InputBase, LoadingSpinner, SelectMult as Multiselect, PaginationTable, Pagination as PaginationV2, PasswordInput, RadioGroupBase, TableComponent, TextareaBase, Title };
|
|
8382
|
+
export { Accordion, AccordionItem, BoxError, BoxSuccess, Button, Checkbox, FileUpload, FooterComponent as Footer, Header, IconAdd, IconAddCell, IconArrowExpland, IconArrowRecall, IconCLose, IconCalendar, IconCheck, IconCheckCircle, IconCircleExpland, IconCircleRecall, IconDelete, IconDownload, IconEdit, IconEventAvaliable, IconHourglass, IconInvisibility, IconLogout, IconNewTab, IconPdf, IconPrint, IconProfile, IconRemove, IconSearch, IconSwap, IconTriangleExpand, IconTriangleRecall, IconUpAndDownArror, IconUpload, IconUploadFile, IconVisibility, IconWarning, InformativeBox, InputBase, LoadingSpinner, SelectMult as Multiselect, PaginationTable, Pagination as PaginationV2, PasswordInput, PgeButton, RadioGroupBase, TableComponent, TextareaBase, Title };
|
|
8312
8383
|
//# sourceMappingURL=index.esm.js.map
|