pge-front-common 14.2.25 → 14.2.26

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/README.md CHANGED
@@ -1,10 +1,10 @@
1
1
  # 🖼️ Biblioteca de componentes da PGE
2
2
 
3
- [![npm version](https://badge.fury.io/js/my-component-library.svg)](https://badge.fury.io/js/my-component-library) [![Storybook](https://raw.githubusercontent.com/storybookjs/brand/master/badge/badge-storybook.svg)](https://my-component-library/storybook)
3
+ [![npm version](https://badge.fury.io/js/my-component-library.svg)](https://badge.fury.io/js/my-component-library) [![Storybook](https://raw.githubusercontent.com/storybookjs/brand/master/badge/badge-storybook.svg)](https://componentes-dev.in.pge.rj.gov.br/)
4
4
 
5
5
  Essa biblioteca consiste de componentes reutilizáveis entre os diversos projetos da PGE-RJ. Oferecendo componentes reutilizáveis e testados para ajudar a acelerar o desenvolvimento de interfaces de usuário.
6
6
 
7
- Você pode visitá-la [nesse link](http://componentes-dev.apps.ocppge.in.pge.rj.gov.br/)
7
+ O Storybook desta biblioteca é publicado no ambiente de desenvolvimento: [https://componentes-dev.in.pge.rj.gov.br/](https://componentes-dev.in.pge.rj.gov.br/)
8
8
 
9
9
  ## Índice
10
10
 
@@ -80,7 +80,7 @@ Inicie o Storybook para visualizar e desenvolver componentes:
80
80
  npm run storybook
81
81
  ```
82
82
 
83
- O Storybook estará disponível em http://localhost:6006.
83
+ O Storybook estará disponível em http://localhost:6006. A versão implantada no ambiente de desenvolvimento fica em [https://componentes-dev.in.pge.rj.gov.br/](https://componentes-dev.in.pge.rj.gov.br/).
84
84
 
85
85
  ## 🖌️ FIGMA
86
86
 
@@ -4,3 +4,4 @@ declare const meta: Meta<typeof FileUpload>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof meta>;
6
6
  export declare const Default: Story;
7
+ export declare const WithDowloadAndRightIcon: Story;
@@ -11,6 +11,9 @@ export declare const FileUpload: React.ForwardRefExoticComponent<{
11
11
  noSelectedFileText?: string;
12
12
  maxFileSize?: `${number}KB` | `${number}MB` | `${number}GB`;
13
13
  helperText?: React.ReactNode;
14
+ rightIcon?: React.ReactNode;
15
+ isDownloadable?: boolean;
16
+ onDownload?: () => void;
14
17
  } & {
15
18
  disabled?: boolean | undefined | undefined;
16
19
  form?: string | undefined | undefined;
@@ -12,6 +12,9 @@ export type UploadFileProps = {
12
12
  noSelectedFileText?: string;
13
13
  maxFileSize?: `${number}KB` | `${number}MB` | `${number}GB`;
14
14
  helperText?: ReactNode;
15
+ rightIcon?: React.ReactNode;
16
+ isDownloadable?: boolean;
17
+ onDownload?: () => void;
15
18
  } & ButtonAttrs;
16
19
  export type FileUploadHandle = {
17
20
  reset: () => void;
package/lib/index.d.ts CHANGED
@@ -91,7 +91,23 @@ declare const FileUpload: React__default.ForwardRefExoticComponent<{
91
91
  noSelectedFileText?: string;
92
92
  maxFileSize?: `${number}KB` | `${number}MB` | `${number}GB`;
93
93
  helperText?: React__default.ReactNode;
94
+ rightIcon?: React__default.ReactNode;
95
+ isDownloadable?: boolean;
96
+ onDownload?: () => void;
94
97
  } & {
98
+ style?: React__default.CSSProperties | undefined;
99
+ disabled?: boolean | undefined | undefined;
100
+ className?: string | undefined | undefined;
101
+ value?: string | number | readonly string[] | undefined;
102
+ form?: string | undefined | undefined;
103
+ formAction?: string | ((formData: FormData) => void | Promise<void>) | undefined;
104
+ formEncType?: string | undefined | undefined;
105
+ formMethod?: string | undefined | undefined;
106
+ formNoValidate?: boolean | undefined | undefined;
107
+ formTarget?: string | undefined | undefined;
108
+ name?: string | undefined | undefined;
109
+ type?: "submit" | "reset" | "button" | undefined | undefined;
110
+ onChange?: React__default.FormEventHandler<HTMLButtonElement> | undefined;
95
111
  defaultChecked?: boolean | undefined | undefined;
96
112
  defaultValue?: string | number | readonly string[] | undefined;
97
113
  suppressContentEditableWarning?: boolean | undefined | undefined;
@@ -99,7 +115,6 @@ declare const FileUpload: React__default.ForwardRefExoticComponent<{
99
115
  accessKey?: string | undefined | undefined;
100
116
  autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
101
117
  autoFocus?: boolean | undefined | undefined;
102
- className?: string | undefined | undefined;
103
118
  contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
104
119
  contextMenu?: string | undefined | undefined;
105
120
  dir?: string | undefined | undefined;
@@ -111,7 +126,6 @@ declare const FileUpload: React__default.ForwardRefExoticComponent<{
111
126
  nonce?: string | undefined | undefined;
112
127
  slot?: string | undefined | undefined;
113
128
  spellCheck?: (boolean | "true" | "false") | undefined;
114
- style?: React__default.CSSProperties | undefined;
115
129
  tabIndex?: number | undefined | undefined;
116
130
  translate?: "yes" | "no" | undefined | undefined;
117
131
  radioGroup?: string | undefined | undefined;
@@ -219,7 +233,6 @@ declare const FileUpload: React__default.ForwardRefExoticComponent<{
219
233
  onFocusCapture?: React__default.FocusEventHandler<HTMLButtonElement> | undefined;
220
234
  onBlur?: React__default.FocusEventHandler<HTMLButtonElement> | undefined;
221
235
  onBlurCapture?: React__default.FocusEventHandler<HTMLButtonElement> | undefined;
222
- onChange?: React__default.FormEventHandler<HTMLButtonElement> | undefined;
223
236
  onChangeCapture?: React__default.FormEventHandler<HTMLButtonElement> | undefined;
224
237
  onBeforeInput?: React__default.InputEventHandler<HTMLButtonElement> | undefined;
225
238
  onBeforeInputCapture?: React__default.FormEventHandler<HTMLButtonElement> | undefined;
@@ -388,16 +401,6 @@ declare const FileUpload: React__default.ForwardRefExoticComponent<{
388
401
  'data-pr-hidedelay'?: number | undefined | undefined;
389
402
  'data-pr-autohide'?: boolean | undefined | undefined;
390
403
  'data-pr-showondisabled'?: boolean | undefined | undefined;
391
- disabled?: boolean | undefined | undefined;
392
- form?: string | undefined | undefined;
393
- formAction?: string | ((formData: FormData) => void | Promise<void>) | undefined;
394
- formEncType?: string | undefined | undefined;
395
- formMethod?: string | undefined | undefined;
396
- formNoValidate?: boolean | undefined | undefined;
397
- formTarget?: string | undefined | undefined;
398
- name?: string | undefined | undefined;
399
- type?: "submit" | "reset" | "button" | undefined | undefined;
400
- value?: string | number | readonly string[] | undefined;
401
404
  } & React__default.RefAttributes<FileUploadHandle>>;
402
405
 
403
406
  interface TooltipProps$1 {
package/lib/index.esm.js CHANGED
@@ -743,8 +743,8 @@ var PgeButton = React__default.forwardRef(function (_a, ref) {
743
743
  });
744
744
  PgeButton.displayName = "PgeButton";
745
745
 
746
- var css_248z$E = ".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: var(--font-size-16);\r\n font-weight: 600;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n}\r\n\r\n.styles-module__labelUpload___LOAO- {\r\n font-size: var(--font-size-16);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__label___AWyTG {\r\n font-size: var(--font-size-12);\r\n font-weight: 600;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n }\r\n\r\n .styles-module__labelUpload___LOAO- {\r\n font-size: var(--font-size-12);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n }\r\n}\r\n\r\n.styles-module__inputContainer___tsCfV {\r\n width: 100%;\r\n height: 58px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: 10px;\r\n border: 2px dotted var(--upload-border-color, #005a9280);\r\n border-radius: 16px;\r\n padding: 10px;\r\n margin-top: 5px;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__inputContainer___tsCfV {\r\n height: 52px;\r\n }\r\n}\r\n\r\n.styles-module__button___1GicM {\r\n width: fit-content;\r\n height: 38px;\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 cursor: pointer;\r\n white-space: nowrap;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__button___1GicM {\r\n min-width: 91px;\r\n height: 32px;\r\n }\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: var(--font-size-16);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--input-placeholder-focus);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__description___S1vZj {\r\n font-size: var(--font-size-12);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--input-placeholder-focus);\r\n }\r\n}\r\n\r\n.styles-module__instructionText___fa9r4 {\r\n font-size: var(--font-size-16);\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__primary___AtNI- {\r\n background-color: var(--btn-bg-primary-color);\r\n color: var(--btn-text-primary-color);\r\n border: none;\r\n}\r\n\r\n.styles-module__primary___AtNI-:hover {\r\n background-color: var(--btn-bg-primary-color);\r\n color: var(--btn-text-hover-primary-color);\r\n outline: 3px solid var(--btn-bg-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:active {\r\n border: 1.8px solid var(--Pressed-button, #3ab0f3);\r\n}\r\n\r\n.styles-module__primary___AtNI-:focus {\r\n box-shadow: 0px 4px 4px 0px #00000040;\r\n background: var(--btn-bg-focus-primary-color, #00436d);\r\n color: var(--btn-text-focus-primary-color);\r\n outline: 2px solid var(--btn-text-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:disabled {\r\n background: var(--light-grey-color, #c3c3c3);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq {\r\n border: 1px solid var(--btn-up-border-secondary-color);\r\n background: var(--btn-up-bg-secondary-color);\r\n color: var(--btn-up-text-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:hover {\r\n background: var(--btn-up-bg-hover-secondary-color);\r\n border: 1px solid var(--btn-up-border-secondary-color);\r\n color: var(--btn-up-text-hover-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:active {\r\n background: #00436d1a;\r\n border: 2px solid #3ab0f3cc;\r\n}\r\n\r\n.styles-module__secondary___-anJq:focus {\r\n background: var(--btn-up-bg-focus-secondary-color);\r\n color: var(--btn-up-text-focus-secondary-color);\r\n outline: 2.5px solid var(--btn-up-border-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq: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___-anJq.styles-module__danger___RwQhk {\r\n border: 1px solid var(--btn-up-border-danger-secondary-color, #cb0a0a);\r\n color: var(--btn-up-text-danger-secondary-color, #cb0a0a);\r\n}\r\n\r\n.styles-module__errorText___1LAhk {\r\n font-size: var(--font-size-14);\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: var(--font-size-14);\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\r\n@media (max-width: 480px) {\r\n .styles-module__errorText___1LAhk {\r\n font-size: var(--font-size-10);\r\n }\r\n\r\n .styles-module__successText___s1G4K {\r\n font-size: var(--font-size-10);\r\n }\r\n}\r\n";
747
- var styles$A = {"container":"styles-module__container___9pLua","label":"styles-module__label___AWyTG","labelUpload":"styles-module__labelUpload___LOAO-","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","primary":"styles-module__primary___AtNI-","secondary":"styles-module__secondary___-anJq","danger":"styles-module__danger___RwQhk","errorText":"styles-module__errorText___1LAhk","successText":"styles-module__successText___s1G4K"};
746
+ var css_248z$E = ".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: var(--font-size-16);\r\n font-weight: 600;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n}\r\n\r\n.styles-module__labelUpload___LOAO- {\r\n font-size: var(--font-size-16);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__label___AWyTG {\r\n font-size: var(--font-size-12);\r\n font-weight: 600;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n }\r\n\r\n .styles-module__labelUpload___LOAO- {\r\n font-size: var(--font-size-12);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--color-label);\r\n }\r\n}\r\n\r\n.styles-module__inputContainer___tsCfV {\r\n width: 100%;\r\n height: 58px;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: 10px;\r\n border: 2px dotted var(--upload-border-color, #005a9280);\r\n border-radius: 16px;\r\n padding: 10px;\r\n margin-top: 5px;\r\n}\r\n\r\n\r\n\r\n.styles-module__rightIcon___UN4xe {\r\n margin-left: auto;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__inputContainer___tsCfV {\r\n height: 52px;\r\n }\r\n}\r\n\r\n.styles-module__button___1GicM {\r\n width: fit-content;\r\n height: 38px;\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 cursor: pointer;\r\n white-space: nowrap;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__button___1GicM {\r\n min-width: 91px;\r\n height: 32px;\r\n }\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: var(--font-size-16);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--input-placeholder-focus);\r\n}\r\n\r\n.styles-module__linkDescription___T2DrY {\r\n font-size: var(--font-size-16);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n text-decoration: underline;\r\n color: var(--color-primary);\r\n cursor: pointer;\r\n}\r\n\r\n.styles-module__linkDescription___T2DrY:hover {\r\n opacity: 0.75;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .styles-module__description___S1vZj {\r\n font-size: var(--font-size-12);\r\n font-weight: 400;\r\n line-height: 24px;\r\n text-align: left;\r\n color: var(--input-placeholder-focus);\r\n }\r\n}\r\n\r\n.styles-module__instructionText___fa9r4 {\r\n font-size: var(--font-size-16);\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__primary___AtNI- {\r\n background-color: var(--btn-bg-primary-color);\r\n color: var(--btn-text-primary-color);\r\n border: none;\r\n}\r\n\r\n.styles-module__primary___AtNI-:hover {\r\n background-color: var(--btn-bg-primary-color);\r\n color: var(--btn-text-hover-primary-color);\r\n outline: 3px solid var(--btn-bg-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:active {\r\n border: 1.8px solid var(--Pressed-button, #3ab0f3);\r\n}\r\n\r\n.styles-module__primary___AtNI-:focus {\r\n box-shadow: 0px 4px 4px 0px #00000040;\r\n background: var(--btn-bg-focus-primary-color, #00436d);\r\n color: var(--btn-text-focus-primary-color);\r\n outline: 2px solid var(--btn-text-focus-primary-color);\r\n}\r\n\r\n.styles-module__primary___AtNI-:disabled {\r\n background: var(--light-grey-color, #c3c3c3);\r\n cursor: not-allowed;\r\n}\r\n\r\n.styles-module__secondary___-anJq {\r\n border: 1px solid var(--btn-up-border-secondary-color);\r\n background: var(--btn-up-bg-secondary-color);\r\n color: var(--btn-up-text-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:hover {\r\n background: var(--btn-up-bg-hover-secondary-color);\r\n border: 1px solid var(--btn-up-border-secondary-color);\r\n color: var(--btn-up-text-hover-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq:active {\r\n background: #00436d1a;\r\n border: 2px solid #3ab0f3cc;\r\n}\r\n\r\n.styles-module__secondary___-anJq:focus {\r\n background: var(--btn-up-bg-focus-secondary-color);\r\n color: var(--btn-up-text-focus-secondary-color);\r\n outline: 2.5px solid var(--btn-up-border-secondary-color);\r\n}\r\n\r\n.styles-module__secondary___-anJq: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___-anJq.styles-module__danger___RwQhk {\r\n border: 1px solid var(--btn-up-border-danger-secondary-color, #cb0a0a);\r\n color: var(--btn-up-text-danger-secondary-color, #cb0a0a);\r\n}\r\n\r\n.styles-module__errorText___1LAhk {\r\n font-size: var(--font-size-14);\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: var(--font-size-14);\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\r\n@media (max-width: 480px) {\r\n .styles-module__errorText___1LAhk {\r\n font-size: var(--font-size-10);\r\n }\r\n\r\n .styles-module__successText___s1G4K {\r\n font-size: var(--font-size-10);\r\n }\r\n}\r\n";
747
+ var styles$A = {"container":"styles-module__container___9pLua","label":"styles-module__label___AWyTG","labelUpload":"styles-module__labelUpload___LOAO-","inputContainer":"styles-module__inputContainer___tsCfV","rightIcon":"styles-module__rightIcon___UN4xe","button":"styles-module__button___1GicM","hiddenInput":"styles-module__hiddenInput___lDoAG","description":"styles-module__description___S1vZj","linkDescription":"styles-module__linkDescription___T2DrY","instructionText":"styles-module__instructionText___fa9r4","primary":"styles-module__primary___AtNI-","secondary":"styles-module__secondary___-anJq","danger":"styles-module__danger___RwQhk","errorText":"styles-module__errorText___1LAhk","successText":"styles-module__successText___s1G4K"};
748
748
  styleInject(css_248z$E);
749
749
 
750
750
  var parseSizeToBytes = function (size) {
@@ -768,14 +768,14 @@ var parseSizeToBytes = function (size) {
768
768
  };
769
769
  var FileUpload = forwardRef(function (_a, ref) {
770
770
  var _b;
771
- var _c = _a.variant, variant = _c === void 0 ? "primary" : _c, _d = _a.danger, danger = _d === void 0 ? false : _d, fileTypes = _a.fileTypes, onFileSelect = _a.onFileSelect, _e = _a.title, title = _e === void 0 ? React__default.createElement(React__default.Fragment, null, "Upload de Arquivos:") : _e, _f = _a.descricaoLabel, descricaoLabel = _f === void 0 ? "Escolher arquivo" : _f, className = _a.className, _g = _a.errorText, errorText = _g === void 0 ? "" : _g, _h = _a.noSelectedFileText, noSelectedFileText = _h === void 0 ? "Nenhum arquivo selecionado" : _h, _j = _a.helperText, helperText = _j === void 0 ? "" : _j, _k = _a.maxFileSize, maxFileSize = _k === void 0 ? "" : _k; __rest(_a, ["variant", "danger", "fileTypes", "onFileSelect", "title", "descricaoLabel", "className", "errorText", "noSelectedFileText", "helperText", "maxFileSize"]);
771
+ var _c = _a.variant, variant = _c === void 0 ? "primary" : _c, _d = _a.danger, danger = _d === void 0 ? false : _d, fileTypes = _a.fileTypes, onFileSelect = _a.onFileSelect, _e = _a.title, title = _e === void 0 ? React__default.createElement(React__default.Fragment, null, "Upload de Arquivos:") : _e, _f = _a.descricaoLabel, descricaoLabel = _f === void 0 ? "Escolher arquivo" : _f, className = _a.className, _g = _a.errorText, errorText = _g === void 0 ? "" : _g, _h = _a.noSelectedFileText, noSelectedFileText = _h === void 0 ? "Nenhum arquivo selecionado" : _h, _j = _a.helperText, helperText = _j === void 0 ? "" : _j, _k = _a.maxFileSize, maxFileSize = _k === void 0 ? "" : _k, _l = _a.rightIcon, rightIcon = _l === void 0 ? null : _l, _m = _a.isDownloadable, isDownloadable = _m === void 0 ? false : _m, onDownload = _a.onDownload; __rest(_a, ["variant", "danger", "fileTypes", "onFileSelect", "title", "descricaoLabel", "className", "errorText", "noSelectedFileText", "helperText", "maxFileSize", "rightIcon", "isDownloadable", "onDownload"]);
772
772
  var buttonClass = clsx(styles$A.labelUpload, styles$A.button, styles$A[variant], (_b = {},
773
773
  _b[styles$A.danger] = danger && variant !== "primary",
774
774
  _b), className);
775
775
  var inputId = useId$1();
776
776
  var helperId = useId$1();
777
777
  var errorId = useId$1();
778
- var _l = React__default.useState(""), fileName = _l[0], setFileName = _l[1];
778
+ var _o = React__default.useState(""), fileName = _o[0], setFileName = _o[1];
779
779
  var fileInputRef = useRef(null);
780
780
  var handleFileChange = function (event) {
781
781
  var _a, _b;
@@ -828,7 +828,9 @@ var FileUpload = forwardRef(function (_a, ref) {
828
828
  React__default.createElement(IconUploadFile, { "aria-hidden": "true" }),
829
829
  descricaoLabel),
830
830
  React__default.createElement("input", { id: inputId, type: "file", ref: fileInputRef, className: styles$A.hiddenInput, onChange: handleFileChange, accept: fileTypes.join(","), "aria-describedby": "".concat(helperId, " ").concat(errorText ? errorId : ""), "aria-label": "Campo de input para selecionar arquivo", "aria-invalid": !!errorText }),
831
- React__default.createElement("span", { className: styles$A.description }, fileName || noSelectedFileText)),
831
+ React__default.createElement("span", { className: isDownloadable ? styles$A.linkDescription : styles$A.description, onClick: isDownloadable && onDownload ? onDownload : undefined, role: isDownloadable && onDownload ? "button" : undefined, tabIndex: isDownloadable && onDownload ? 0 : undefined, onKeyDown: isDownloadable && onDownload ? function (e) { if (e.key === "Enter" || e.key === " ")
832
+ onDownload(); } : undefined }, fileName || noSelectedFileText),
833
+ rightIcon && (React__default.createElement("div", { className: styles$A.rightIcon }, rightIcon))),
832
834
  React__default.createElement("span", { id: errorText ? errorId : helperId, role: "alert", "aria-live": "polite", className: errorText
833
835
  ? styles$A.errorText
834
836
  : fileName