@charlesgomes/leafcode-shared-lib-react 1.0.12 → 1.0.17

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.
@@ -1,3 +1,3 @@
1
- <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M16.6925 7.94254L10.4425 14.1926C10.3845 14.2507 10.3156 14.2968 10.2397 14.3282C10.1638 14.3597 10.0825 14.3759 10.0003 14.3759C9.91821 14.3759 9.83689 14.3597 9.76101 14.3282C9.68514 14.2968 9.61621 14.2507 9.55816 14.1926L3.30816 7.94254C3.19089 7.82526 3.125 7.6662 3.125 7.50035C3.125 7.3345 3.19089 7.17544 3.30816 7.05816C3.42544 6.94089 3.5845 6.875 3.75035 6.875C3.9162 6.875 4.07526 6.94089 4.19254 7.05816L10.0003 12.8668L15.8082 7.05816C15.8662 7.00009 15.9352 6.95403 16.011 6.92261C16.0869 6.89118 16.1682 6.875 16.2504 6.875C16.3325 6.875 16.4138 6.89118 16.4897 6.92261C16.5655 6.95403 16.6345 7.00009 16.6925 7.05816C16.7506 7.11623 16.7967 7.18517 16.8281 7.26104C16.8595 7.33691 16.8757 7.41823 16.8757 7.50035C16.8757 7.58247 16.8595 7.66379 16.8281 7.73966C16.7967 7.81553 16.7506 7.88447 16.6925 7.94254Z" fill="black"/>
3
- </svg>
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16.6925 7.94254L10.4425 14.1926C10.3845 14.2507 10.3156 14.2968 10.2397 14.3282C10.1638 14.3597 10.0825 14.3759 10.0003 14.3759C9.91821 14.3759 9.83689 14.3597 9.76101 14.3282C9.68514 14.2968 9.61621 14.2507 9.55816 14.1926L3.30816 7.94254C3.19089 7.82526 3.125 7.6662 3.125 7.50035C3.125 7.3345 3.19089 7.17544 3.30816 7.05816C3.42544 6.94089 3.5845 6.875 3.75035 6.875C3.9162 6.875 4.07526 6.94089 4.19254 7.05816L10.0003 12.8668L15.8082 7.05816C15.8662 7.00009 15.9352 6.95403 16.011 6.92261C16.0869 6.89118 16.1682 6.875 16.2504 6.875C16.3325 6.875 16.4138 6.89118 16.4897 6.92261C16.5655 6.95403 16.6345 7.00009 16.6925 7.05816C16.7506 7.11623 16.7967 7.18517 16.8281 7.26104C16.8595 7.33691 16.8757 7.41823 16.8757 7.50035C16.8757 7.58247 16.8595 7.66379 16.8281 7.73966C16.7967 7.81553 16.7506 7.88447 16.6925 7.94254Z" fill="black"/>
3
+ </svg>
package/dist/index.css CHANGED
@@ -132,7 +132,7 @@ td {
132
132
  appearance: none;
133
133
  -webkit-appearance: none;
134
134
  -moz-appearance: none;
135
- background: #fff url("./seta-T37FWQKV.svg") no-repeat right 6px center;
135
+ background: #fff url("./seta-E7LTVAWJ.svg") no-repeat right 6px center;
136
136
  }
137
137
  .react-tooltip {
138
138
  z-index: 99 !important;
package/dist/index.d.mts CHANGED
@@ -15,65 +15,65 @@ interface ButtonProps {
15
15
  }
16
16
  declare function Button({ disabled, loading, color, type, onClick, title, ...rest }: ButtonProps): react_jsx_runtime.JSX.Element;
17
17
 
18
- type IDataTableProps<T extends object> = {
19
- queryKey: string;
20
- mutationFn: (
21
- page: number,
22
- limit: number,
23
- sort: string,
24
- order: number,
25
- filters: DataTableFilterMeta,
26
- globalFilterFields: string[]
27
- ) => Promise<PaginatedResponse<T>>;
28
- columns: ColumnCustom<T>[];
29
- initFilters: DataTableFilterMeta;
30
- onNew?: () => void;
31
- onEdit?: (selected: T[]) => void;
32
- onDelete?: (selected: T[]) => void;
33
- customActions?: TableAction<T>[] | ((selectedRows: T[]) => TableAction<T>[]);
34
- customActionsColums?:
35
- | TableAction<T>[]
36
- | ((selectedRows: T[]) => TableAction<T>[]);
37
- disablePagination?: boolean;
38
- sortFieldInitial: string;
39
- sortOrderInitial?: 1 | -1;
40
- isMultiSelectionMode?: boolean;
41
- isLanguagePtBr?: boolean;
42
- };
43
-
44
- interface PaginatedResponse<T> {
45
- items: T[];
46
- totalCount: number;
47
- }
48
-
49
- interface ColumnCustom<T> {
50
- field: keyof T | "acoes" | "actions" | string;
51
- header: string;
52
- enableSorting?: boolean;
53
- size?: number;
54
- dataType?: "boolean" | "string" | "date" | "dateTime" | "numeric";
55
- filterGlobal?: boolean;
56
- filterElement?: ReactNode;
57
- filterMatchModeOptions?: {
58
- label: string;
59
- value: FilterMatchModeType | string;
60
- }[];
61
- body?: (rowData: T) => ReactNode;
62
- enableResizeable?: boolean;
63
- enableFilter?: boolean;
64
- mask?: (value: any) => any;
65
- filterClear?: () => void;
66
- filterApply?: () => void;
67
- filterFooter?: () => void;
68
- frozen?: boolean;
69
- alignFrozen?: "left" | "right";
18
+ type IDataTableProps<T extends object> = {
19
+ queryKey: string;
20
+ mutationFn: (
21
+ page: number,
22
+ limit: number,
23
+ sort: string,
24
+ order: number,
25
+ filters: DataTableFilterMeta,
26
+ globalFilterFields: string[]
27
+ ) => Promise<PaginatedResponse<T>>;
28
+ columns: ColumnCustom<T>[];
29
+ initFilters: DataTableFilterMeta;
30
+ onNew?: () => void;
31
+ onEdit?: (selected: T[]) => void;
32
+ onDelete?: (selected: T[]) => void;
33
+ customActions?: TableAction<T>[] | ((selectedRows: T[]) => TableAction<T>[]);
34
+ customActionsColums?:
35
+ | TableAction<T>[]
36
+ | ((selectedRows: T[]) => TableAction<T>[]);
37
+ disablePagination?: boolean;
38
+ sortFieldInitial: string;
39
+ sortOrderInitial?: 1 | -1;
40
+ isMultiSelectionMode?: boolean;
41
+ isLanguagePtBr?: boolean;
42
+ };
43
+
44
+ interface PaginatedResponse<T> {
45
+ items: T[];
46
+ totalCount: number;
47
+ }
48
+
49
+ interface ColumnCustom<T> {
50
+ field: keyof T | "acoes" | "actions" | string;
51
+ header: string;
52
+ enableSorting?: boolean;
53
+ size?: number;
54
+ dataType?: "boolean" | "string" | "date" | "dateTime" | "numeric";
55
+ filterGlobal?: boolean;
56
+ filterElement?: ReactNode;
57
+ filterMatchModeOptions?: {
58
+ label: string;
59
+ value: FilterMatchModeType | string;
60
+ }[];
61
+ body?: (rowData: T) => ReactNode;
62
+ enableResizeable?: boolean;
63
+ enableFilter?: boolean;
64
+ mask?: (value: any) => any;
65
+ filterClear?: () => void;
66
+ filterApply?: () => void;
67
+ filterFooter?: () => void;
68
+ frozen?: boolean;
69
+ alignFrozen?: "left" | "right";
70
70
  }
71
71
 
72
72
  declare function DataTableAdvancedFilter<T extends object>({ queryKey, mutationFn, columns, initFilters, onNew, onEdit, onDelete, customActions, customActionsColums, disablePagination, sortFieldInitial, sortOrderInitial, isMultiSelectionMode, isLanguagePtBr, }: IDataTableProps<T>): react_jsx_runtime.JSX.Element;
73
73
 
74
- interface IItemProps {
75
- value: string;
76
- label: string;
74
+ interface IItemProps {
75
+ value: string;
76
+ label: string;
77
77
  }
78
78
 
79
79
  declare const DateFilterTemplate: (options: any, mask?: (value: any) => string | number) => react_jsx_runtime.JSX.Element;
package/dist/index.d.ts CHANGED
@@ -15,65 +15,65 @@ interface ButtonProps {
15
15
  }
16
16
  declare function Button({ disabled, loading, color, type, onClick, title, ...rest }: ButtonProps): react_jsx_runtime.JSX.Element;
17
17
 
18
- type IDataTableProps<T extends object> = {
19
- queryKey: string;
20
- mutationFn: (
21
- page: number,
22
- limit: number,
23
- sort: string,
24
- order: number,
25
- filters: DataTableFilterMeta,
26
- globalFilterFields: string[]
27
- ) => Promise<PaginatedResponse<T>>;
28
- columns: ColumnCustom<T>[];
29
- initFilters: DataTableFilterMeta;
30
- onNew?: () => void;
31
- onEdit?: (selected: T[]) => void;
32
- onDelete?: (selected: T[]) => void;
33
- customActions?: TableAction<T>[] | ((selectedRows: T[]) => TableAction<T>[]);
34
- customActionsColums?:
35
- | TableAction<T>[]
36
- | ((selectedRows: T[]) => TableAction<T>[]);
37
- disablePagination?: boolean;
38
- sortFieldInitial: string;
39
- sortOrderInitial?: 1 | -1;
40
- isMultiSelectionMode?: boolean;
41
- isLanguagePtBr?: boolean;
42
- };
43
-
44
- interface PaginatedResponse<T> {
45
- items: T[];
46
- totalCount: number;
47
- }
48
-
49
- interface ColumnCustom<T> {
50
- field: keyof T | "acoes" | "actions" | string;
51
- header: string;
52
- enableSorting?: boolean;
53
- size?: number;
54
- dataType?: "boolean" | "string" | "date" | "dateTime" | "numeric";
55
- filterGlobal?: boolean;
56
- filterElement?: ReactNode;
57
- filterMatchModeOptions?: {
58
- label: string;
59
- value: FilterMatchModeType | string;
60
- }[];
61
- body?: (rowData: T) => ReactNode;
62
- enableResizeable?: boolean;
63
- enableFilter?: boolean;
64
- mask?: (value: any) => any;
65
- filterClear?: () => void;
66
- filterApply?: () => void;
67
- filterFooter?: () => void;
68
- frozen?: boolean;
69
- alignFrozen?: "left" | "right";
18
+ type IDataTableProps<T extends object> = {
19
+ queryKey: string;
20
+ mutationFn: (
21
+ page: number,
22
+ limit: number,
23
+ sort: string,
24
+ order: number,
25
+ filters: DataTableFilterMeta,
26
+ globalFilterFields: string[]
27
+ ) => Promise<PaginatedResponse<T>>;
28
+ columns: ColumnCustom<T>[];
29
+ initFilters: DataTableFilterMeta;
30
+ onNew?: () => void;
31
+ onEdit?: (selected: T[]) => void;
32
+ onDelete?: (selected: T[]) => void;
33
+ customActions?: TableAction<T>[] | ((selectedRows: T[]) => TableAction<T>[]);
34
+ customActionsColums?:
35
+ | TableAction<T>[]
36
+ | ((selectedRows: T[]) => TableAction<T>[]);
37
+ disablePagination?: boolean;
38
+ sortFieldInitial: string;
39
+ sortOrderInitial?: 1 | -1;
40
+ isMultiSelectionMode?: boolean;
41
+ isLanguagePtBr?: boolean;
42
+ };
43
+
44
+ interface PaginatedResponse<T> {
45
+ items: T[];
46
+ totalCount: number;
47
+ }
48
+
49
+ interface ColumnCustom<T> {
50
+ field: keyof T | "acoes" | "actions" | string;
51
+ header: string;
52
+ enableSorting?: boolean;
53
+ size?: number;
54
+ dataType?: "boolean" | "string" | "date" | "dateTime" | "numeric";
55
+ filterGlobal?: boolean;
56
+ filterElement?: ReactNode;
57
+ filterMatchModeOptions?: {
58
+ label: string;
59
+ value: FilterMatchModeType | string;
60
+ }[];
61
+ body?: (rowData: T) => ReactNode;
62
+ enableResizeable?: boolean;
63
+ enableFilter?: boolean;
64
+ mask?: (value: any) => any;
65
+ filterClear?: () => void;
66
+ filterApply?: () => void;
67
+ filterFooter?: () => void;
68
+ frozen?: boolean;
69
+ alignFrozen?: "left" | "right";
70
70
  }
71
71
 
72
72
  declare function DataTableAdvancedFilter<T extends object>({ queryKey, mutationFn, columns, initFilters, onNew, onEdit, onDelete, customActions, customActionsColums, disablePagination, sortFieldInitial, sortOrderInitial, isMultiSelectionMode, isLanguagePtBr, }: IDataTableProps<T>): react_jsx_runtime.JSX.Element;
73
73
 
74
- interface IItemProps {
75
- value: string;
76
- label: string;
74
+ interface IItemProps {
75
+ value: string;
76
+ label: string;
77
77
  }
78
78
 
79
79
  declare const DateFilterTemplate: (options: any, mask?: (value: any) => string | number) => react_jsx_runtime.JSX.Element;
package/dist/index.js CHANGED
@@ -556,7 +556,7 @@ function DataTableAdvancedFilterWrapper({
556
556
  }, [customers?.items, selectedRowsData]);
557
557
  const TableHeaderAndTableActions = (0, import_react4.useMemo)(
558
558
  () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
559
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
559
+ globalFilterFields.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
560
560
  TableHeader_default,
561
561
  {
562
562
  isLanguagePtBr,
@@ -577,6 +577,7 @@ function DataTableAdvancedFilterWrapper({
577
577
  )
578
578
  ] }),
579
579
  [
580
+ globalFilterFields,
580
581
  searchText,
581
582
  onGlobalFilterChange,
582
583
  selectedRowsData,
@@ -587,7 +588,7 @@ function DataTableAdvancedFilterWrapper({
587
588
  ]
588
589
  );
589
590
  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { children: isClient && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
590
- disablePagination && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "disablePagination", children: globalFilterFields.length > 0 && TableHeaderAndTableActions }),
591
+ disablePagination && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "disablePagination", children: TableHeaderAndTableActions }),
591
592
  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
592
593
  import_datatable.DataTable,
593
594
  {
@@ -659,7 +660,7 @@ function DataTableAdvancedFilterWrapper({
659
660
  )
660
661
  },
661
662
  paginatorPosition: "top",
662
- paginatorLeft: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "paginatorLeft", children: globalFilterFields.length > 0 && TableHeaderAndTableActions }),
663
+ paginatorLeft: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "paginatorLeft", children: TableHeaderAndTableActions }),
663
664
  currentPageReportTemplate: "Mostrando {first} a {last} de {totalRecords}",
664
665
  emptyMessage: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "mensagem-nenhum-dado", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { children: isLanguagePtBr ? "Nenhum dado encontrado" : "No data found" }) }),
665
666
  onFilter: (e) => setFilters(e.filters),
package/dist/index.mjs CHANGED
@@ -511,7 +511,7 @@ function DataTableAdvancedFilterWrapper({
511
511
  }, [customers?.items, selectedRowsData]);
512
512
  const TableHeaderAndTableActions = useMemo(
513
513
  () => /* @__PURE__ */ jsxs4(Fragment3, { children: [
514
- /* @__PURE__ */ jsx7(
514
+ globalFilterFields.length > 0 && /* @__PURE__ */ jsx7(
515
515
  TableHeader_default,
516
516
  {
517
517
  isLanguagePtBr,
@@ -532,6 +532,7 @@ function DataTableAdvancedFilterWrapper({
532
532
  )
533
533
  ] }),
534
534
  [
535
+ globalFilterFields,
535
536
  searchText,
536
537
  onGlobalFilterChange,
537
538
  selectedRowsData,
@@ -542,7 +543,7 @@ function DataTableAdvancedFilterWrapper({
542
543
  ]
543
544
  );
544
545
  return /* @__PURE__ */ jsx7(Fragment3, { children: isClient && /* @__PURE__ */ jsxs4("div", { children: [
545
- disablePagination && /* @__PURE__ */ jsx7("div", { className: "disablePagination", children: globalFilterFields.length > 0 && TableHeaderAndTableActions }),
546
+ disablePagination && /* @__PURE__ */ jsx7("div", { className: "disablePagination", children: TableHeaderAndTableActions }),
546
547
  /* @__PURE__ */ jsxs4(
547
548
  DataTable,
548
549
  {
@@ -614,7 +615,7 @@ function DataTableAdvancedFilterWrapper({
614
615
  )
615
616
  },
616
617
  paginatorPosition: "top",
617
- paginatorLeft: /* @__PURE__ */ jsx7("div", { className: "paginatorLeft", children: globalFilterFields.length > 0 && TableHeaderAndTableActions }),
618
+ paginatorLeft: /* @__PURE__ */ jsx7("div", { className: "paginatorLeft", children: TableHeaderAndTableActions }),
618
619
  currentPageReportTemplate: "Mostrando {first} a {last} de {totalRecords}",
619
620
  emptyMessage: /* @__PURE__ */ jsx7("div", { className: "mensagem-nenhum-dado", children: /* @__PURE__ */ jsx7("p", { children: isLanguagePtBr ? "Nenhum dado encontrado" : "No data found" }) }),
620
621
  onFilter: (e) => setFilters(e.filters),
@@ -1,3 +1,3 @@
1
- <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M16.6925 7.94254L10.4425 14.1926C10.3845 14.2507 10.3156 14.2968 10.2397 14.3282C10.1638 14.3597 10.0825 14.3759 10.0003 14.3759C9.91821 14.3759 9.83689 14.3597 9.76101 14.3282C9.68514 14.2968 9.61621 14.2507 9.55816 14.1926L3.30816 7.94254C3.19089 7.82526 3.125 7.6662 3.125 7.50035C3.125 7.3345 3.19089 7.17544 3.30816 7.05816C3.42544 6.94089 3.5845 6.875 3.75035 6.875C3.9162 6.875 4.07526 6.94089 4.19254 7.05816L10.0003 12.8668L15.8082 7.05816C15.8662 7.00009 15.9352 6.95403 16.011 6.92261C16.0869 6.89118 16.1682 6.875 16.2504 6.875C16.3325 6.875 16.4138 6.89118 16.4897 6.92261C16.5655 6.95403 16.6345 7.00009 16.6925 7.05816C16.7506 7.11623 16.7967 7.18517 16.8281 7.26104C16.8595 7.33691 16.8757 7.41823 16.8757 7.50035C16.8757 7.58247 16.8595 7.66379 16.8281 7.73966C16.7967 7.81553 16.7506 7.88447 16.6925 7.94254Z" fill="black"/>
3
- </svg>
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16.6925 7.94254L10.4425 14.1926C10.3845 14.2507 10.3156 14.2968 10.2397 14.3282C10.1638 14.3597 10.0825 14.3759 10.0003 14.3759C9.91821 14.3759 9.83689 14.3597 9.76101 14.3282C9.68514 14.2968 9.61621 14.2507 9.55816 14.1926L3.30816 7.94254C3.19089 7.82526 3.125 7.6662 3.125 7.50035C3.125 7.3345 3.19089 7.17544 3.30816 7.05816C3.42544 6.94089 3.5845 6.875 3.75035 6.875C3.9162 6.875 4.07526 6.94089 4.19254 7.05816L10.0003 12.8668L15.8082 7.05816C15.8662 7.00009 15.9352 6.95403 16.011 6.92261C16.0869 6.89118 16.1682 6.875 16.2504 6.875C16.3325 6.875 16.4138 6.89118 16.4897 6.92261C16.5655 6.95403 16.6345 7.00009 16.6925 7.05816C16.7506 7.11623 16.7967 7.18517 16.8281 7.26104C16.8595 7.33691 16.8757 7.41823 16.8757 7.50035C16.8757 7.58247 16.8595 7.66379 16.8281 7.73966C16.7967 7.81553 16.7506 7.88447 16.6925 7.94254Z" fill="black"/>
3
+ </svg>
@@ -1,107 +1,107 @@
1
- .box-button {
2
- display: flex;
3
- align-items: center;
4
- justify-content: center;
5
- position: relative;
6
- }
7
-
8
- .button-primary {
9
- font-size: 14px;
10
- cursor: pointer;
11
- font-family: sans-serif;
12
- font-weight: 600;
13
- color: #fff;
14
- transition: all 300ms ease-in-out;
15
- background-color: #175dbf;
16
- border-radius: 0.375rem;
17
- padding-left: 1.5rem;
18
- padding-right: 1.5rem;
19
- height: 2.5rem;
20
- width: 100%;
21
- min-width: 8rem;
22
- border: none;
23
- }
24
-
25
- .button-primary:hover {
26
- background-color: #70a3ff;
27
- color: #fff;
28
- }
29
-
30
- .button-secundary {
31
- font-size: 14px;
32
- cursor: pointer;
33
- font-family: sans-serif;
34
- font-weight: 600;
35
- color: #fff;
36
- transition: all 300ms ease-in-out;
37
- background-color: #bf1717;
38
- border-radius: 0.375rem;
39
- padding-left: 1.5rem;
40
- padding-right: 1.5rem;
41
- height: 2.5rem;
42
- width: 100%;
43
- min-width: 8rem;
44
- border: none;
45
- }
46
-
47
- .button-secundary:hover {
48
- background-color: #f35353;
49
- color: #fff;
50
- }
51
-
52
- .button-primary-disabled {
53
- font-size: 14px;
54
- font-family: sans-serif;
55
- font-weight: 600;
56
- color: #fff;
57
- transition: all 300ms ease-in-out;
58
- border: 1px solid #b6b9d3;
59
- background-color: #b6b9d3;
60
- cursor: not-allowed;
61
- border-radius: 0.375rem;
62
- padding-left: 1.5rem;
63
- padding-right: 1.5rem;
64
- padding-top: 0.375rem;
65
- padding-bottom: 0.5rem;
66
- height: 2.5rem;
67
- width: 100%;
68
- min-width: 8rem;
69
- line-height: normal;
70
- border: none;
71
- }
72
-
73
- .box-loading {
74
- position: absolute;
75
- display: flex;
76
- align-items: center;
77
- justify-content: center;
78
- inset: 0;
79
- }
80
-
81
- .animate-spin {
82
- height: 1.25rem;
83
- width: 1.25rem;
84
- color: #fff;
85
- }
86
-
87
- .opacity-01 {
88
- opacity: 0.25;
89
- }
90
-
91
- .opacity-02 {
92
- opacity: 0.75;
93
- }
94
-
95
- @media (min-width: 640px) {
96
- .button-primary {
97
- width: fit-content;
98
- }
99
-
100
- .button-secundary {
101
- width: fit-content;
102
- }
103
-
104
- .button-primary-disabled {
105
- width: fit-content;
106
- }
107
- }
1
+ .box-button {
2
+ display: flex;
3
+ align-items: center;
4
+ justify-content: center;
5
+ position: relative;
6
+ }
7
+
8
+ .button-primary {
9
+ font-size: 14px;
10
+ cursor: pointer;
11
+ font-family: sans-serif;
12
+ font-weight: 600;
13
+ color: #fff;
14
+ transition: all 300ms ease-in-out;
15
+ background-color: #175dbf;
16
+ border-radius: 0.375rem;
17
+ padding-left: 1.5rem;
18
+ padding-right: 1.5rem;
19
+ height: 2.5rem;
20
+ width: 100%;
21
+ min-width: 8rem;
22
+ border: none;
23
+ }
24
+
25
+ .button-primary:hover {
26
+ background-color: #70a3ff;
27
+ color: #fff;
28
+ }
29
+
30
+ .button-secundary {
31
+ font-size: 14px;
32
+ cursor: pointer;
33
+ font-family: sans-serif;
34
+ font-weight: 600;
35
+ color: #fff;
36
+ transition: all 300ms ease-in-out;
37
+ background-color: #bf1717;
38
+ border-radius: 0.375rem;
39
+ padding-left: 1.5rem;
40
+ padding-right: 1.5rem;
41
+ height: 2.5rem;
42
+ width: 100%;
43
+ min-width: 8rem;
44
+ border: none;
45
+ }
46
+
47
+ .button-secundary:hover {
48
+ background-color: #f35353;
49
+ color: #fff;
50
+ }
51
+
52
+ .button-primary-disabled {
53
+ font-size: 14px;
54
+ font-family: sans-serif;
55
+ font-weight: 600;
56
+ color: #fff;
57
+ transition: all 300ms ease-in-out;
58
+ border: 1px solid #b6b9d3;
59
+ background-color: #b6b9d3;
60
+ cursor: not-allowed;
61
+ border-radius: 0.375rem;
62
+ padding-left: 1.5rem;
63
+ padding-right: 1.5rem;
64
+ padding-top: 0.375rem;
65
+ padding-bottom: 0.5rem;
66
+ height: 2.5rem;
67
+ width: 100%;
68
+ min-width: 8rem;
69
+ line-height: normal;
70
+ border: none;
71
+ }
72
+
73
+ .box-loading {
74
+ position: absolute;
75
+ display: flex;
76
+ align-items: center;
77
+ justify-content: center;
78
+ inset: 0;
79
+ }
80
+
81
+ .animate-spin {
82
+ height: 1.25rem;
83
+ width: 1.25rem;
84
+ color: #fff;
85
+ }
86
+
87
+ .opacity-01 {
88
+ opacity: 0.25;
89
+ }
90
+
91
+ .opacity-02 {
92
+ opacity: 0.75;
93
+ }
94
+
95
+ @media (min-width: 640px) {
96
+ .button-primary {
97
+ width: fit-content;
98
+ }
99
+
100
+ .button-secundary {
101
+ width: fit-content;
102
+ }
103
+
104
+ .button-primary-disabled {
105
+ width: fit-content;
106
+ }
107
+ }