forlogic-core 1.16.3 → 1.16.5

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.
Files changed (134) hide show
  1. package/README.md +113 -109
  2. package/dist/README.md +113 -109
  3. package/dist/components/modules/AccessDeniedDialog.d.ts +41 -0
  4. package/dist/components/modules/ModuleAccessGuard.d.ts +3 -1
  5. package/dist/components/modules/ModuleOfferContent.d.ts +20 -0
  6. package/dist/components/modules/ModulesContent.d.ts +15 -0
  7. package/dist/components/modules/ModulesFooterCards.d.ts +6 -0
  8. package/dist/components/modules/index.d.ts +8 -0
  9. package/dist/components/modules/types.d.ts +2 -0
  10. package/dist/index.css +1 -1
  11. package/dist/index.css.map +1 -1
  12. package/dist/index.esm.js +1 -1
  13. package/dist/index.js +1 -1
  14. package/docs/DESIGN_SYSTEM.md +17 -32
  15. package/package.json +4 -2
  16. package/dist/assets/AccordionDoc-BnfxyOi9.js +0 -31
  17. package/dist/assets/ActionButtonDoc-b4F_J8gn.js +0 -47
  18. package/dist/assets/AlertDoc-PkiHguSJ.js +0 -37
  19. package/dist/assets/AppHeaderDoc-CsFMZGV0.js +0 -67
  20. package/dist/assets/AppSidebarDoc-Bg71N-zq.js +0 -196
  21. package/dist/assets/AuthDoc-DDm57y_J.js +0 -192
  22. package/dist/assets/AvatarDoc-C6wiZIZR.js +0 -11
  23. package/dist/assets/BadgeDoc-Bsg7cfm0.js +0 -36
  24. package/dist/assets/BaseFormDoc-DeIlV273.js +0 -169
  25. package/dist/assets/BodyContentDoc-Q3DGvyN9.js +0 -83
  26. package/dist/assets/BreadcrumbDoc-ChsVFjMF.js +0 -75
  27. package/dist/assets/ButtonDoc-C7Q31Bh3.js +0 -41
  28. package/dist/assets/ButtonGroupDoc-Bn5vhjBq.js +0 -7
  29. package/dist/assets/CalendarDoc-iVjNyxyr.js +0 -81
  30. package/dist/assets/CardDoc-D511dll7.js +0 -49
  31. package/dist/assets/ChartDoc-CQyYOEHL.js +0 -111
  32. package/dist/assets/CheckboxDoc-Cjsy4XAq.js +0 -55
  33. package/dist/assets/ColorPickerDoc-hnYJUWpF.js +0 -10
  34. package/dist/assets/ColorsFoundationDoc-B8Z4tAyZ.js +0 -13
  35. package/dist/assets/ComboTreeDoc-ChEbW4a3.js +0 -21
  36. package/dist/assets/ComboboxDoc-CHWeGE_F.js +0 -134
  37. package/dist/assets/ComponentDocTemplate-BtOCnlM2.js +0 -1
  38. package/dist/assets/ContextMenuDoc-C3mFO_Yx.js +0 -182
  39. package/dist/assets/ContextsDoc-ChEbQxom.js +0 -184
  40. package/dist/assets/CreateCrudPageDoc-C9tXisCF.js +0 -106
  41. package/dist/assets/CrudActionBarDoc-Cp1L4gpO.js +0 -112
  42. package/dist/assets/CrudGridDoc-D-kSFBAQ.js +0 -85
  43. package/dist/assets/CrudOverviewDoc-CeLBwg-B.js +0 -14
  44. package/dist/assets/CrudPrimitivesDoc-B2u1vZog.js +0 -164
  45. package/dist/assets/CrudTableDoc-CvV-II_X.js +0 -95
  46. package/dist/assets/DataListDoc-BLRii0jB.js +0 -13
  47. package/dist/assets/DesignSystemHome-TE0Ubaup.js +0 -1
  48. package/dist/assets/DialogDoc--LC5Jvat.js +0 -981
  49. package/dist/assets/DropdownMenuDoc-oPlEriRY.js +0 -175
  50. package/dist/assets/EmptyStateDoc-rNqfWKok.js +0 -35
  51. package/dist/assets/EnvironmentsDoc-CT7l5s2u.js +0 -96
  52. package/dist/assets/ErrorBoundaryDoc-rPHOUygA.js +0 -111
  53. package/dist/assets/ExampleCard-DfuMYM6E.js +0 -1
  54. package/dist/assets/FormDoc-B0L_QaCT.js +0 -81
  55. package/dist/assets/FoundationOverview-Dbb8rBsU.js +0 -1
  56. package/dist/assets/GridDoc-ifcGA2Yw.js +0 -28
  57. package/dist/assets/HooksDoc-CUOT_3Du.js +0 -665
  58. package/dist/assets/HoverCardDoc-CdTU2QkI.js +0 -31
  59. package/dist/assets/I18nDoc-CMEvFqsz.js +0 -232
  60. package/dist/assets/IconPickerDoc-DF9hEwnJ.js +0 -10
  61. package/dist/assets/IconsFoundationDoc-D4Y0wKbm.js +0 -33
  62. package/dist/assets/InputDoc-d_IL4dsq.js +0 -211
  63. package/dist/assets/LabelDoc-Dr64ISiJ.js +0 -42
  64. package/dist/assets/LeadershipDoc-BnrTuaeV.js +0 -416
  65. package/dist/assets/MediaDoc-CLuVprAr.js +0 -459
  66. package/dist/assets/MenubarDoc-CW7L4QJ4.js +0 -165
  67. package/dist/assets/ModulesDialogDoc-CUb_g4X-.js +0 -71
  68. package/dist/assets/NavigationMenuDoc-Csc0U6bV.js +0 -116
  69. package/dist/assets/OnboardingDialogDoc-3RtjNH1O.js +0 -55
  70. package/dist/assets/PaginationDoc-BGurD4xQ.js +0 -27
  71. package/dist/assets/PaginationDoc-DqFyou6O.js +0 -98
  72. package/dist/assets/PlacesDoc-Dyx8gsqb.js +0 -226
  73. package/dist/assets/PopoverDoc-DHF-ItUX.js +0 -64
  74. package/dist/assets/ProgressDoc-DXKV-fkI.js +0 -29
  75. package/dist/assets/QualiexUserFieldDoc-BbP7w-Pu.js +0 -149
  76. package/dist/assets/RadioGroupDoc-D845uweM.js +0 -57
  77. package/dist/assets/RadiusDoc-vN4tTsay.js +0 -7
  78. package/dist/assets/RequiredFieldsCounterDoc-TzR9r-U9.js +0 -58
  79. package/dist/assets/ResizableDoc-Bkfz_25O.js +0 -104
  80. package/dist/assets/RichTextEditorDoc-BUQrg7M8.js +0 -24
  81. package/dist/assets/ScrollAreaDoc-B6ODYHMX.js +0 -28
  82. package/dist/assets/SecurityDoc-Chbt6w1s.js +0 -204
  83. package/dist/assets/SelectDoc-BhcpBIAO.js +0 -80
  84. package/dist/assets/SeparatorDoc-C3fhatb0.js +0 -4
  85. package/dist/assets/ServicesDoc-_uao-HA_.js +0 -308
  86. package/dist/assets/ShadowsDoc-DpkO_TZQ.js +0 -9
  87. package/dist/assets/SignDoc-BJtnoT6I.js +0 -66
  88. package/dist/assets/SkeletonDoc-BZS07PJh.js +0 -54
  89. package/dist/assets/SliderDoc-D2ApV3XT.js +0 -41
  90. package/dist/assets/SpacingDoc-PNrU24B2.js +0 -12
  91. package/dist/assets/SplitButtonDoc-D5tUF2Ja.js +0 -53
  92. package/dist/assets/StepSelectorDoc-Cj0ALYar.js +0 -41
  93. package/dist/assets/SwitchDoc-DtsT8oh_.js +0 -56
  94. package/dist/assets/TableDoc-BC-jQnXu.js +0 -128
  95. package/dist/assets/TableOfContents-DBMJMbI4.js +0 -1
  96. package/dist/assets/TabsDoc-DtXJ0xY5.js +0 -42
  97. package/dist/assets/TextareaDoc-nuW5tqBQ.js +0 -46
  98. package/dist/assets/ToastDoc-D1aX5zda.js +0 -157
  99. package/dist/assets/ToggleDoc-ILass4CS.js +0 -51
  100. package/dist/assets/TooltipDoc-lPbdWe_9.js +0 -58
  101. package/dist/assets/TruncatedCellDoc-DOAzbF2F.js +0 -12
  102. package/dist/assets/TypographyFoundationDoc-3ZD-rQZw.js +0 -7
  103. package/dist/assets/UtilitiesDoc-D7lkYhuz.js +0 -145
  104. package/dist/assets/blocks-Jy49RoqJ.js +0 -1
  105. package/dist/assets/calendar-days-Cvf2zLJl.js +0 -1
  106. package/dist/assets/circle-plus-MnG9kjyq.js +0 -1
  107. package/dist/assets/circle-x-B9ouupla.js +0 -1
  108. package/dist/assets/crown-BweN5jpI.js +0 -1
  109. package/dist/assets/date-picker-ttyYeYvC.js +0 -1
  110. package/dist/assets/disabled-menu-item-WlpPOqxg.js +0 -1
  111. package/dist/assets/drawer-DvU6_eK5.js +0 -3
  112. package/dist/assets/file-pen-line-C0VV-QjF.js +0 -1
  113. package/dist/assets/git-branch-DCjGGwvF.js +0 -1
  114. package/dist/assets/globe-BdFDFP_k.js +0 -1
  115. package/dist/assets/grip-vertical-CgXp0oI-.js +0 -1
  116. package/dist/assets/hash-BAYi_wfk.js +0 -1
  117. package/dist/assets/index-BtX5DZqb.js +0 -310
  118. package/dist/assets/index-C1So5Sai.css +0 -1
  119. package/dist/assets/life-buoy-BydIgTyJ.js +0 -1
  120. package/dist/assets/lucide-react-ZIMhRYmb.js +0 -1
  121. package/dist/assets/monitor-B6txWJPg.js +0 -1
  122. package/dist/assets/package-DNe3FsCh.js +0 -1
  123. package/dist/assets/pen-CzTmQ16z.js +0 -1
  124. package/dist/assets/pin-CJJgLEBz.js +0 -1
  125. package/dist/assets/radio-group-Btv_BY60.js +0 -1
  126. package/dist/assets/server-XQDXtrjm.js +0 -1
  127. package/dist/assets/share-2-Dz_89MJb.js +0 -1
  128. package/dist/assets/step-selector-D0_Y1dow.js +0 -1
  129. package/dist/assets/text-align-start-WsHo7CNJ.js +0 -1
  130. package/dist/assets/trash-CeK-mWnM.js +0 -1
  131. package/dist/assets/useMockCrud-RV9z9n5x.js +0 -1
  132. package/dist/assets/user-check-CrbWcnPN.js +0 -1
  133. package/dist/assets/user-plus-Dce9DbqQ.js +0 -1
  134. package/dist/index.html +0 -35
@@ -1,98 +0,0 @@
1
- import{r as m,j as e,C as a,a as t,b as r,d as i,cd as C,ce as I,cf as x,t as w,ba as y,cg as u,dR as h,B as v,aD as T,aM as A,f}from"./index-BtX5DZqb.js";function k(){const[n,c]=m.useState(1),[l,g]=m.useState(10),d=157,j=Math.ceil(d/l),[p,b]=m.useState(1),[o,D]=m.useState(10),P=45,S=Math.ceil(P/o),E=Array.from({length:P},(s,N)=>({id:N+1,name:`Item ${N+1}`,status:N%3===0?"active":"inactive"})).slice((p-1)*o,p*o);return e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-3xl font-bold",children:"Pagination"}),e.jsx("p",{className:"text-lg text-muted-foreground mt-2",children:"Componente de paginação padronizado com layout de 3 colunas, seletor de itens por página e navegação completa."})]}),e.jsxs(a,{children:[e.jsx(t,{children:e.jsx(r,{className:"text-base",children:"Índice"})}),e.jsx(i,{children:e.jsxs("ul",{className:"grid grid-cols-2 gap-2 text-sm",children:[e.jsx("li",{children:e.jsx("a",{href:"#instalacao",className:"text-primary hover:underline",children:"Instalação"})}),e.jsx("li",{children:e.jsx("a",{href:"#uso-basico",className:"text-primary hover:underline",children:"Uso Básico"})}),e.jsx("li",{children:e.jsx("a",{href:"#variantes",className:"text-primary hover:underline",children:"Variantes"})}),e.jsx("li",{children:e.jsx("a",{href:"#com-dados",className:"text-primary hover:underline",children:"Com Dados Reais"})}),e.jsx("li",{children:e.jsx("a",{href:"#props",className:"text-primary hover:underline",children:"Propriedades"})}),e.jsx("li",{children:e.jsx("a",{href:"#erros-comuns",className:"text-primary hover:underline",children:"Erros Comuns"})}),e.jsx("li",{children:e.jsx("a",{href:"#acessibilidade",className:"text-primary hover:underline",children:"Acessibilidade"})})]})})]}),e.jsxs(a,{id:"instalacao",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Instalação"})}),e.jsx(i,{children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`import { CrudPrimitivePagination } from 'forlogic-core';
2
-
3
- // Alias para uso mais curto
4
- import { CrudPrimitivePagination as Pagination } from 'forlogic-core';`})})]}),e.jsxs(a,{id:"uso-basico",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Uso Básico"})}),e.jsx(i,{children:e.jsxs(C,{defaultValue:"preview",className:"w-full",children:[e.jsxs(I,{className:"mb-4",children:[e.jsxs(x,{value:"preview",className:"gap-2",children:[e.jsx(w,{size:16}),"Preview"]}),e.jsxs(x,{value:"code",className:"gap-2",children:[e.jsx(y,{size:16}),"Código"]})]}),e.jsxs(u,{value:"preview",className:"mt-0",children:[e.jsx("div",{className:"border rounded-lg bg-muted/30",children:e.jsx(h,{currentPage:n,totalPages:j,totalItems:d,itemsPerPage:l,onPageChange:c,onItemsPerPageChange:s=>{g(s),c(1)},variant:"full"})}),e.jsxs("p",{className:"text-xs text-muted-foreground mt-2",children:["Página atual: ",n," | Itens por página: ",l," | Total: ",d]})]}),e.jsx(u,{value:"code",className:"mt-0",children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`import { useState } from 'react';
5
- import { CrudPrimitivePagination } from 'forlogic-core';
6
-
7
- function MyComponent() {
8
- const [currentPage, setCurrentPage] = useState(1);
9
- const [itemsPerPage, setItemsPerPage] = useState(10);
10
- const totalItems = 157;
11
- const totalPages = Math.ceil(totalItems / itemsPerPage);
12
-
13
- return (
14
- <CrudPrimitivePagination
15
- currentPage={currentPage}
16
- totalPages={totalPages}
17
- totalItems={totalItems}
18
- itemsPerPage={itemsPerPage}
19
- onPageChange={setCurrentPage}
20
- onItemsPerPageChange={(value) => {
21
- setItemsPerPage(value);
22
- setCurrentPage(1); // Reset para primeira página
23
- }}
24
- variant="full"
25
- />
26
- );
27
- }`})})]})})]}),e.jsxs(a,{id:"variantes",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Variantes"})}),e.jsxs(i,{className:"space-y-6",children:[e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(v,{children:'variant="full"'}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"Padrão - com seletor de itens"})]}),e.jsx("div",{className:"border rounded-lg bg-muted/30",children:e.jsx(h,{currentPage:n,totalPages:j,totalItems:d,itemsPerPage:l,onPageChange:c,onItemsPerPageChange:g,variant:"full"})})]}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(v,{variant:"secondary",children:'variant="compact"'}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"Sem seletor de itens"})]}),e.jsx("div",{className:"border rounded-lg bg-muted/30",children:e.jsx(h,{currentPage:n,totalPages:j,totalItems:d,itemsPerPage:l,onPageChange:c,onItemsPerPageChange:g,variant:"compact"})})]}),e.jsxs("div",{className:"p-4 border rounded-lg bg-muted/30",children:[e.jsx("p",{className:"text-sm font-medium mb-2",children:"Layout Visual (3 colunas):"}),e.jsx("pre",{className:"text-xs text-muted-foreground",children:`┌────────────────────────────────────────────────────────────────┐
28
- │ [Itens: 10 ▼] │ 1-10 de 157 itens │ [<<] [<] 1 de 16 [>] [>>] │
29
- │ ESQUERDA │ CENTRO │ DIREITA │
30
- └────────────────────────────────────────────────────────────────┘`})]})]})]}),e.jsxs(a,{id:"com-dados",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Com Dados Reais"})}),e.jsxs(i,{children:[e.jsx("p",{className:"text-muted-foreground mb-4",children:"Exemplo prático de paginação integrada com uma lista de dados."}),e.jsxs(C,{defaultValue:"preview",className:"w-full",children:[e.jsxs(I,{className:"mb-4",children:[e.jsxs(x,{value:"preview",className:"gap-2",children:[e.jsx(w,{size:16}),"Preview"]}),e.jsxs(x,{value:"code",className:"gap-2",children:[e.jsx(y,{size:16}),"Código"]})]}),e.jsxs(u,{value:"preview",className:"mt-0 space-y-4",children:[e.jsx("div",{className:"border rounded-lg divide-y",children:E.map(s=>e.jsxs("div",{className:"flex items-center justify-between p-3",children:[e.jsx("span",{className:"font-medium",children:s.name}),e.jsx(v,{variant:s.status==="active"?"default":"secondary",children:s.status==="active"?"Ativo":"Inativo"})]},s.id))}),e.jsx("div",{className:"border rounded-lg",children:e.jsx(h,{currentPage:p,totalPages:S,totalItems:P,itemsPerPage:o,onPageChange:b,onItemsPerPageChange:s=>{D(s),b(1)},variant:"full"})})]}),e.jsx(u,{value:"code",className:"mt-0",children:e.jsx("pre",{className:"bg-muted p-4 rounded-lg text-sm overflow-x-auto",children:`import { useState } from 'react';
31
- import { CrudPrimitivePagination } from 'forlogic-core';
32
-
33
- function DataList({ items }) {
34
- const [currentPage, setCurrentPage] = useState(1);
35
- const [itemsPerPage, setItemsPerPage] = useState(10);
36
-
37
- const totalItems = items.length;
38
- const totalPages = Math.ceil(totalItems / itemsPerPage);
39
-
40
- // Paginar dados
41
- const paginatedItems = items.slice(
42
- (currentPage - 1) * itemsPerPage,
43
- currentPage * itemsPerPage
44
- );
45
-
46
- return (
47
- <>
48
- {/* Lista */}
49
- <div className="divide-y">
50
- {paginatedItems.map((item) => (
51
- <div key={item.id} className="p-3">
52
- {item.name}
53
- </div>
54
- ))}
55
- </div>
56
-
57
- {/* Paginação */}
58
- <CrudPrimitivePagination
59
- currentPage={currentPage}
60
- totalPages={totalPages}
61
- totalItems={totalItems}
62
- itemsPerPage={itemsPerPage}
63
- onPageChange={setCurrentPage}
64
- onItemsPerPageChange={(value) => {
65
- setItemsPerPage(value);
66
- setCurrentPage(1); // Importante: resetar página
67
- }}
68
- variant="full"
69
- />
70
- </>
71
- );
72
- }`})})]})]})]}),e.jsxs(a,{id:"props",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Propriedades"})}),e.jsx(i,{children:e.jsx("div",{className:"overflow-x-auto",children:e.jsxs("table",{className:"w-full text-sm",children:[e.jsx("thead",{children:e.jsxs("tr",{className:"border-b",children:[e.jsx("th",{className:"text-left p-2 font-medium",children:"Prop"}),e.jsx("th",{className:"text-left p-2 font-medium",children:"Tipo"}),e.jsx("th",{className:"text-left p-2 font-medium",children:"Default"}),e.jsx("th",{className:"text-left p-2 font-medium",children:"Descrição"})]})}),e.jsxs("tbody",{children:[e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"currentPage"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"number"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:"Página atual (1-indexed)"})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"totalPages"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"number"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:"Total de páginas"})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"totalItems"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"number"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:'Total de itens (para exibir "X-Y de Z")'})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"itemsPerPage"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"number"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:"Itens por página (10, 25, 50, 100)"})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"onPageChange"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"(page: number) => void"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:"Callback ao mudar página"})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"onItemsPerPageChange"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"(value: number) => void"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"-"}),e.jsx("td",{className:"p-2",children:"Callback ao mudar itens por página"})]}),e.jsxs("tr",{className:"border-b",children:[e.jsx("td",{className:"p-2",children:e.jsx("code",{children:"variant"})}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"'full' | 'compact'"}),e.jsx("td",{className:"p-2 text-muted-foreground",children:"'full'"}),e.jsx("td",{className:"p-2",children:"Variante de exibição"})]})]})]})})})]}),e.jsxs(a,{id:"erros-comuns",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Erros Comuns"})}),e.jsxs(i,{className:"space-y-4",children:[e.jsxs("div",{className:"p-4 border rounded-lg border-destructive/50 bg-destructive/5",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(T,{className:"h-4 w-4 text-destructive"}),e.jsx("h4",{className:"font-medium text-destructive",children:"❌ Paginação Manual"})]}),e.jsx("pre",{className:"bg-muted p-3 rounded text-xs overflow-x-auto",children:`// ❌ NUNCA faça isso
73
- <div className="flex items-center justify-between">
74
- <span>{total} itens</span>
75
- <Button onClick={() => setPage(page - 1)}>
76
- <ChevronLeft />
77
- </Button>
78
- <span>Página {page} de {pages}</span>
79
- <Button onClick={() => setPage(page + 1)}>
80
- <ChevronRight />
81
- </Button>
82
- </div>`})]}),e.jsxs("div",{className:"p-4 border rounded-lg border-green-500/50 bg-green-500/5",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(A,{className:"h-4 w-4 text-green-600"}),e.jsx("h4",{className:"font-medium text-green-600",children:"✅ Use o Componente Padronizado"})]}),e.jsx("pre",{className:"bg-muted p-3 rounded text-xs overflow-x-auto",children:`// ✅ SEMPRE use o componente da lib
83
- <CrudPrimitivePagination
84
- currentPage={page}
85
- totalPages={pages}
86
- totalItems={total}
87
- itemsPerPage={perPage}
88
- onPageChange={setPage}
89
- onItemsPerPageChange={setPerPage}
90
- variant="full"
91
- />`})]}),e.jsxs("div",{className:"p-4 border rounded-lg border-destructive/50 bg-destructive/5",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-2",children:[e.jsx(T,{className:"h-4 w-4 text-destructive"}),e.jsx("h4",{className:"font-medium text-destructive",children:"❌ Não Resetar Página ao Mudar Itens"})]}),e.jsx("pre",{className:"bg-muted p-3 rounded text-xs overflow-x-auto",children:`// ❌ Pode causar página inválida
92
- onItemsPerPageChange={setItemsPerPage}
93
-
94
- // ✅ SEMPRE reset para página 1
95
- onItemsPerPageChange={(value) => {
96
- setItemsPerPage(value);
97
- setCurrentPage(1); // Importante!
98
- }}`})]})]})]}),e.jsxs(a,{id:"acessibilidade",className:"scroll-mt-4",children:[e.jsx(t,{children:e.jsx(r,{children:"Acessibilidade"})}),e.jsx(i,{children:e.jsxs("ul",{className:"list-disc list-inside space-y-2 text-sm text-muted-foreground",children:[e.jsx("li",{children:"Navegação por teclado entre botões (Tab/Shift+Tab)"}),e.jsx("li",{children:"Botões de navegação com aria-labels descritivos"}),e.jsx("li",{children:"Estados desabilitados visualmente distintos"}),e.jsx("li",{children:"Contraste adequado para texto e ícones (WCAG AA)"}),e.jsx("li",{children:"Select de itens por página acessível via teclado"}),e.jsx("li",{children:'Informação de posição clara ("X-Y de Z itens")'})]})})]}),e.jsxs(a,{children:[e.jsx(t,{children:e.jsx(r,{children:"Ver Também"})}),e.jsxs(i,{children:[e.jsx("p",{className:"text-muted-foreground mb-4",children:"Componentes relacionados:"}),e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx(f,{variant:"outline",size:"sm",onClick:()=>window.location.href="/ds/crud-bulk-action-bar",children:"BulkActionBar →"}),e.jsx(f,{variant:"outline",size:"sm",onClick:()=>window.location.href="/ds/crud-primitives",children:"CRUD Primitives →"}),e.jsx(f,{variant:"outline",size:"sm",onClick:()=>window.location.href="/ds/crud-table",children:"CrudTable →"})]})]})]})]})}export{k as CrudPaginationDoc};
@@ -1,226 +0,0 @@
1
- import{j as e,r as n,a8 as o,a9 as i,a7 as l,h as d,a$ as s,c7 as a,B as c,ab as m,aq as p,f as u,v as g}from"./index-BtX5DZqb.js";import{C as x}from"./ComponentDocTemplate-BtOCnlM2.js";import{C as h}from"./crown-BweN5jpI.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function S(){return e.jsx(x,{title:"Places",description:"Módulo para gerenciar estruturas hierárquicas de locais integrado com a API Qualiex. Inclui visualização em árvore, gestão de acessos e componentes reutilizáveis.",installation:`import {
2
- PlacesList,
3
- PlaceCard,
4
- ManageAccessModal,
5
- placeService
6
- } from 'forlogic-core';
7
-
8
- // Tipos
9
- import type {
10
- Place,
11
- PlacesListProps,
12
- PlaceCardProps,
13
- ManageAccessModalProps
14
- } from 'forlogic-core';`,component:e.jsx(f,{}),usage:`// =====================
15
- // BUSCAR LOCAIS
16
- // =====================
17
- import { placeService } from 'forlogic-core';
18
-
19
- async function loadPlaces() {
20
- const places = await placeService.getPlaces(alias, companyId);
21
- // places já vem em estrutura hierárquica
22
- console.log(places);
23
- }
24
-
25
- // =====================
26
- // LISTA SIMPLES (SEM GESTÃO DE ACESSOS)
27
- // =====================
28
- import { PlacesList } from 'forlogic-core';
29
-
30
- function MyPlacesPage() {
31
- const [places, setPlaces] = useState<Place[]>([]);
32
- const [isLoading, setIsLoading] = useState(true);
33
-
34
- useEffect(() => {
35
- placeService.getPlaces(alias, companyId)
36
- .then(setPlaces)
37
- .finally(() => setIsLoading(false));
38
- }, [alias, companyId]);
39
-
40
- return (
41
- <PlacesList
42
- places={places}
43
- isLoading={isLoading}
44
- />
45
- );
46
- }
47
-
48
- // =====================
49
- // COM GESTÃO DE ACESSOS
50
- // =====================
51
- import { PlacesList, PlaceCard } from 'forlogic-core';
52
-
53
- function PlacesWithAccess() {
54
- const [places, setPlaces] = useState<Place[]>([]);
55
- const [managers, setManagers] = useState<Record<string, string>>({});
56
- const [members, setMembers] = useState<Record<string, string[]>>({});
57
-
58
- const manageAccessConfig = {
59
- onMakeManager: async (userId, placeId) => {
60
- setManagers(prev => ({ ...prev, [placeId]: userId }));
61
- // Chamar API para salvar
62
- },
63
- onMakeMembers: async (userIds, placeId) => {
64
- setMembers(prev => ({ ...prev, [placeId]: userIds }));
65
- // Chamar API para salvar
66
- },
67
- getCurrentManagerId: (placeId) => managers[placeId],
68
- getCurrentMemberIds: (placeId) => members[placeId] || []
69
- };
70
-
71
- return (
72
- <PlacesList
73
- places={places}
74
- isLoading={false}
75
- manageAccessConfig={manageAccessConfig}
76
- />
77
- );
78
- }
79
-
80
- // =====================
81
- // PLACECARD INDIVIDUAL
82
- // =====================
83
- import { PlaceCard } from 'forlogic-core';
84
-
85
- <PlaceCard
86
- place={myPlace}
87
- level={0}
88
- manageAccessConfig={manageAccessConfig}
89
- />`,examples:[{title:"Estrutura de Tipos",description:"Tipos principais usados no módulo de locais.",preview:e.jsx(v,{}),code:`interface Place {
90
- id: string;
91
- name: string;
92
- usersCount?: number; // Quantidade de usuários no local
93
- hasChild?: boolean; // Se tem sub-locais
94
- isActive?: boolean; // Status do local
95
- parentId?: string; // ID do local pai
96
- parentName?: string; // Nome do local pai
97
- subPlaces?: Place[]; // Sub-locais (estrutura aninhada)
98
- }
99
-
100
- // A estrutura hierárquica é montada automaticamente
101
- // pelo placeService.getPlaces()`},{title:"PlacesList",description:"Componente que renderiza a lista completa de locais com suporte a hierarquia.",preview:e.jsx(j,{}),code:`import { PlacesList } from 'forlogic-core';
102
-
103
- function MyPlaces() {
104
- const [places, setPlaces] = useState<Place[]>([]);
105
- const [isLoading, setIsLoading] = useState(true);
106
-
107
- useEffect(() => {
108
- placeService.getPlaces(alias, companyId)
109
- .then(setPlaces)
110
- .finally(() => setIsLoading(false));
111
- }, []);
112
-
113
- return (
114
- <PlacesList
115
- places={places}
116
- isLoading={isLoading}
117
- />
118
- );
119
- }
120
-
121
- // Com gestão de acessos
122
- <PlacesList
123
- places={places}
124
- isLoading={false}
125
- manageAccessConfig={{
126
- onMakeManager: handleMakeManager,
127
- onMakeMembers: handleMakeMembers,
128
- getCurrentManagerId: (placeId) => managers[placeId],
129
- getCurrentMemberIds: (placeId) => members[placeId]
130
- }}
131
- />`},{title:"PlaceCard",description:"Componente individual de local com expansão/colapso e ações.",preview:e.jsx(N,{}),code:`import { PlaceCard } from 'forlogic-core';
132
-
133
- // Uso básico
134
- <PlaceCard
135
- place={{
136
- id: '1',
137
- name: 'Matriz',
138
- usersCount: 42,
139
- isActive: true,
140
- subPlaces: [
141
- { id: '2', name: 'Filial SP', usersCount: 15 },
142
- { id: '3', name: 'Filial RJ', usersCount: 10 }
143
- ]
144
- }}
145
- />
146
-
147
- // Com nível de indentação (para sub-locais)
148
- <PlaceCard
149
- place={subPlace}
150
- level={1} // Indentação aumenta
151
- />
152
-
153
- // Com gestão de acessos
154
- <PlaceCard
155
- place={place}
156
- manageAccessConfig={{
157
- onMakeManager: (userId, placeId) => console.log('Gestor:', userId),
158
- onMakeMembers: (userIds, placeId) => console.log('Membros:', userIds),
159
- getCurrentManagerId: (placeId) => currentManager,
160
- getCurrentMemberIds: (placeId) => currentMembers
161
- }}
162
- />`},{title:"ManageAccessModal",description:"Modal para gerenciar gestores e membros de um local.",preview:e.jsx(I,{}),code:`import { ManageAccessModal } from 'forlogic-core';
163
-
164
- function AccessManager() {
165
- const [open, setOpen] = useState(false);
166
- const [managerId, setManagerId] = useState<string>();
167
- const [memberIds, setMemberIds] = useState<string[]>([]);
168
-
169
- return (
170
- <>
171
- <Button onClick={() => setOpen(true)}>
172
- Gerenciar Acessos
173
- </Button>
174
-
175
- <ManageAccessModal
176
- open={open}
177
- onOpenChange={setOpen}
178
- placeId="place-123"
179
- placeName="Matriz"
180
- currentManagerId={managerId}
181
- currentMemberIds={memberIds}
182
- onMakeManager={async (userId, placeId) => {
183
- setManagerId(userId);
184
- // Salvar na API
185
- }}
186
- onMakeMembers={async (userIds, placeId) => {
187
- setMemberIds(userIds);
188
- // Salvar na API
189
- }}
190
- />
191
- </>
192
- );
193
- }
194
-
195
- // Props do ManageAccessModal:
196
- // - open: boolean
197
- // - onOpenChange: (open: boolean) => void
198
- // - placeId: string
199
- // - placeName: string
200
- // - onMakeManager?: (userId, placeId) => void | Promise<void>
201
- // - onMakeMembers?: (userIds[], placeId) => void | Promise<void>
202
- // - currentManagerId?: string
203
- // - currentMemberIds?: string[]`},{title:"placeService",description:"Serviço para buscar locais da API Qualiex.",preview:e.jsx(M,{}),code:`import { placeService } from 'forlogic-core';
204
-
205
- // Buscar todos os locais (retorna hierarquia montada)
206
- const places = await placeService.getPlaces(alias, companyId);
207
-
208
- // O serviço:
209
- // 1. Faz a chamada à API Qualiex
210
- // 2. Valida e renova token automaticamente se necessário
211
- // 3. Converte lista plana em hierarquia
212
- // 4. Retorna Place[] com subPlaces aninhados
213
-
214
- // Estrutura retornada:
215
- [
216
- {
217
- id: '1',
218
- name: 'Matriz',
219
- usersCount: 42,
220
- isActive: true,
221
- subPlaces: [
222
- { id: '2', name: 'Filial SP', ... },
223
- { id: '3', name: 'Filial RJ', ... }
224
- ]
225
- }
226
- ]`}],props:[{name:"PlacesList.places",type:"Place[]",description:"Lista de locais a serem exibidos (já em estrutura hierárquica)."},{name:"PlacesList.isLoading",type:"boolean",description:"Exibe skeleton de loading."},{name:"PlacesList.manageAccessConfig",type:"object",description:"Configuração para habilitar gestão de acessos."},{name:"PlaceCard.place",type:"Place",description:"Dados do local a ser renderizado."},{name:"PlaceCard.level",type:"number",default:"0",description:"Nível de indentação (0 = raiz)."},{name:"PlaceCard.manageAccessConfig",type:"object",description:"Configuração para habilitar botão de gestão de acessos."},{name:"ManageAccessModal.open",type:"boolean",description:"Controla visibilidade do modal."},{name:"ManageAccessModal.onOpenChange",type:"(open: boolean) => void",description:"Callback quando visibilidade muda."},{name:"ManageAccessModal.placeId",type:"string",description:"ID do local sendo gerenciado."},{name:"ManageAccessModal.placeName",type:"string",description:"Nome do local (exibido no título)."},{name:"ManageAccessModal.onMakeManager",type:"(userId, placeId) => void | Promise<void>",description:"Callback ao tornar usuário gestor."},{name:"ManageAccessModal.onMakeMembers",type:"(userIds[], placeId) => void | Promise<void>",description:"Callback ao tornar usuários membros."},{name:"ManageAccessModal.currentManagerId",type:"string",description:"ID do gestor atual (para destacar)."},{name:"ManageAccessModal.currentMemberIds",type:"string[]",description:"IDs dos membros atuais (para destacar)."}],accessibility:["Botões de expandir/colapsar acessíveis via teclado.","Modal segue padrões WAI-ARIA.","Checkboxes navegáveis por Tab.","Estados de loading anunciados para leitores de tela.","Busca de usuários com feedback visual."],notes:["Requer integração com API Qualiex configurada.","O placeService monta a hierarquia automaticamente.","O ManageAccessModal usa o hook useQualiexUsers internamente.","A gestão de acessos é opcional - sem manageAccessConfig, apenas exibe.","Níveis de hierarquia são controlados pela prop level no PlaceCard."]})}function f(){return e.jsxs("div",{className:"p-6 border rounded-lg bg-card space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(s,{className:"h-6 w-6 text-primary"}),e.jsx("h3",{className:"text-lg font-semibold",children:"Módulo de Locais"})]}),e.jsx("p",{className:"text-muted-foreground",children:"Sistema para gerenciar estrutura hierárquica de locais:"}),e.jsxs("ul",{className:"list-disc list-inside space-y-1 text-sm",children:[e.jsx("li",{children:"Visualização em árvore expansível"}),e.jsx("li",{children:"Contagem de usuários por local"}),e.jsx("li",{children:"Status ativo/inativo"}),e.jsx("li",{children:"Gestão de gestores e membros"}),e.jsx("li",{children:"Integração com usuários Qualiex"})]})]})}function v(){return e.jsxs("div",{className:"p-4 border rounded-lg bg-muted/30 font-mono text-xs space-y-2",children:[e.jsx("div",{className:"text-primary",children:"Place"}),e.jsx("div",{className:"pl-4 text-muted-foreground",children:"id, name, usersCount, hasChild, isActive, parentId, subPlaces[]"})]})}function j(){const[r,t]=n.useState(!0);return e.jsxs("div",{className:"border rounded-lg overflow-hidden",children:[e.jsx("div",{className:"p-3 bg-muted/30 border-b",children:e.jsx("h3",{className:"text-sm font-semibold",children:"Estrutura de Locais"})}),e.jsxs("div",{className:"divide-y",children:[e.jsxs(o,{open:r,onOpenChange:t,children:[e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",children:[e.jsxs(i,{className:"flex items-center gap-2 flex-1",children:[r?e.jsx(l,{className:"h-4 w-4"}):e.jsx(d,{className:"h-4 w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Matriz"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"(2)"})]}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"42"})]}),e.jsx(c,{children:"Ativo"})]})]}),e.jsxs(m,{children:[e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",style:{paddingLeft:"3rem"},children:[e.jsx("div",{className:"w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Filial SP"}),e.jsxs("div",{className:"ml-auto flex items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"15"})]}),e.jsx(c,{children:"Ativo"})]})]}),e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",style:{paddingLeft:"3rem"},children:[e.jsx("div",{className:"w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Filial RJ"}),e.jsxs("div",{className:"ml-auto flex items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"10"})]}),e.jsx(c,{variant:"secondary",children:"Inativo"})]})]})]})]}),e.jsx(p,{})]})]})}function N(){const[r,t]=n.useState(!1);return e.jsx("div",{className:"border rounded-lg overflow-hidden",children:e.jsxs(o,{open:r,onOpenChange:t,children:[e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",children:[e.jsxs(i,{className:"flex items-center gap-2 flex-1",children:[r?e.jsx(l,{className:"h-4 w-4"}):e.jsx(d,{className:"h-4 w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Departamento TI"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"(3)"})]}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"25"})]}),e.jsx(c,{children:"Ativo"}),e.jsx(u,{variant:"ghost",size:"sm",children:e.jsx(g,{className:"h-4 w-4"})})]})]}),e.jsxs(m,{children:[e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",style:{paddingLeft:"3rem"},children:[e.jsx("div",{className:"w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Desenvolvimento"}),e.jsxs("div",{className:"ml-auto flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"12"})]})]}),e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",style:{paddingLeft:"3rem"},children:[e.jsx("div",{className:"w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Infraestrutura"}),e.jsxs("div",{className:"ml-auto flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"8"})]})]}),e.jsxs("div",{className:"flex items-center gap-2 py-3 px-4 hover:bg-accent/50",style:{paddingLeft:"3rem"},children:[e.jsx("div",{className:"w-4"}),e.jsx(s,{className:"h-4 w-4 text-muted-foreground"}),e.jsx("span",{className:"font-medium",children:"Suporte"}),e.jsxs("div",{className:"ml-auto flex items-center gap-1.5",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-muted-foreground"}),e.jsx("span",{className:"text-sm text-muted-foreground",children:"5"})]})]})]})]})})}function I(){return e.jsxs("div",{className:"p-4 border rounded-lg space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 text-sm font-medium",children:[e.jsx(a,{className:"h-4 w-4"}),"ManageAccessModal"]}),e.jsxs("div",{className:"grid grid-cols-2 gap-3 text-xs",children:[e.jsxs("div",{className:"p-3 bg-muted/50 rounded-lg space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(h,{className:"h-3.5 w-3.5 text-yellow-500"}),e.jsx("span",{className:"font-medium",children:"Gestor"})]}),e.jsx("p",{className:"text-muted-foreground",children:"Selecione 1 usuário"})]}),e.jsxs("div",{className:"p-3 bg-muted/50 rounded-lg space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(a,{className:"h-3.5 w-3.5 text-primary"}),e.jsx("span",{className:"font-medium",children:"Membros"})]}),e.jsx("p",{className:"text-muted-foreground",children:"Selecione N usuários"})]})]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Usa o hook useQualiexUsers para listar usuários disponíveis."})]})}function M(){return e.jsxs("div",{className:"p-4 border rounded-lg font-mono text-xs space-y-2",children:[e.jsx("div",{className:"text-muted-foreground",children:"// placeService"}),e.jsxs("div",{children:[e.jsx("span",{className:"text-primary",children:"getPlaces"}),e.jsx("span",{className:"text-muted-foreground",children:"(alias, companyId)"})]}),e.jsx("div",{className:"pl-4 text-muted-foreground",children:"→ Place[] (hierarquia montada)"})]})}export{S as PlacesDoc};
@@ -1,64 +0,0 @@
1
- import{j as e,cj as t,ck as r,f as i,cl as s,L as o,I as a}from"./index-BtX5DZqb.js";import{C as n}from"./ComponentDocTemplate-BtOCnlM2.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function l(){return e.jsxs(t,{children:[e.jsx(r,{asChild:!0,children:e.jsx(i,{variant:"outline",children:"Abrir popover"})}),e.jsx(s,{className:"w-80",children:e.jsxs("div",{className:"grid gap-4",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("h4",{className:"font-medium leading-none",children:"Dimensões"}),e.jsx("p",{className:"text-sm text-muted-foreground",children:"Defina as dimensões para a camada."})]}),e.jsxs("div",{className:"grid gap-2",children:[e.jsxs("div",{className:"grid grid-cols-3 items-center gap-4",children:[e.jsx(o,{htmlFor:"width",children:"Largura"}),e.jsx(a,{id:"width",defaultValue:"100%",className:"col-span-2 h-8"})]}),e.jsxs("div",{className:"grid grid-cols-3 items-center gap-4",children:[e.jsx(o,{htmlFor:"maxWidth",children:"Máx. largura"}),e.jsx(a,{id:"maxWidth",defaultValue:"300px",className:"col-span-2 h-8"})]}),e.jsxs("div",{className:"grid grid-cols-3 items-center gap-4",children:[e.jsx(o,{htmlFor:"height",children:"Altura"}),e.jsx(a,{id:"height",defaultValue:"25px",className:"col-span-2 h-8"})]}),e.jsxs("div",{className:"grid grid-cols-3 items-center gap-4",children:[e.jsx(o,{htmlFor:"maxHeight",children:"Máx. altura"}),e.jsx(a,{id:"maxHeight",defaultValue:"none",className:"col-span-2 h-8"})]})]})]})})]})}function d(){return e.jsxs(t,{children:[e.jsx(r,{asChild:!0,children:e.jsx(i,{variant:"outline",children:"Abrir"})}),e.jsx(s,{children:e.jsx("p",{className:"text-sm",children:"Conteúdo simples do popover."})})]})}const c=`import {
2
- Popover,
3
- PopoverContent,
4
- PopoverTrigger,
5
- Button,
6
- Input,
7
- Label
8
- } from 'forlogic-core';
9
-
10
- function DimensionsPopover() {
11
- return (
12
- <Popover>
13
- <PopoverTrigger asChild>
14
- <Button variant="outline">Abrir popover</Button>
15
- </PopoverTrigger>
16
- <PopoverContent className="w-80">
17
- <div className="grid gap-4">
18
- <div className="space-y-2">
19
- <h4 className="font-medium leading-none">Dimensões</h4>
20
- <p className="text-sm text-muted-foreground">
21
- Defina as dimensões para a camada.
22
- </p>
23
- </div>
24
- <div className="grid gap-2">
25
- <div className="grid grid-cols-3 items-center gap-4">
26
- <Label htmlFor="width">Largura</Label>
27
- <Input id="width" defaultValue="100%" className="col-span-2 h-8" />
28
- </div>
29
- <div className="grid grid-cols-3 items-center gap-4">
30
- <Label htmlFor="maxWidth">Máx. largura</Label>
31
- <Input id="maxWidth" defaultValue="300px" className="col-span-2 h-8" />
32
- </div>
33
- <div className="grid grid-cols-3 items-center gap-4">
34
- <Label htmlFor="height">Altura</Label>
35
- <Input id="height" defaultValue="25px" className="col-span-2 h-8" />
36
- </div>
37
- <div className="grid grid-cols-3 items-center gap-4">
38
- <Label htmlFor="maxHeight">Máx. altura</Label>
39
- <Input id="maxHeight" defaultValue="none" className="col-span-2 h-8" />
40
- </div>
41
- </div>
42
- </div>
43
- </PopoverContent>
44
- </Popover>
45
- );
46
- }`,p=`import {
47
- Popover,
48
- PopoverContent,
49
- PopoverTrigger,
50
- Button
51
- } from 'forlogic-core';
52
-
53
- function BasicPopover() {
54
- return (
55
- <Popover>
56
- <PopoverTrigger asChild>
57
- <Button variant="outline">Abrir</Button>
58
- </PopoverTrigger>
59
- <PopoverContent>
60
- <p className="text-sm">Conteúdo simples do popover.</p>
61
- </PopoverContent>
62
- </Popover>
63
- );
64
- }`;function v(){return e.jsx(n,{title:"Popover",description:"Exibe conteúdo rico em um portal, acionado por um botão.",component:e.jsx(l,{}),usage:c,examples:[{title:"Uso Básico",description:"Popover simples com conteúdo de texto.",preview:e.jsx(d,{}),code:p}],props:[{name:"defaultOpen",type:"boolean",default:"false",description:"Estado aberto inicial (não controlado)."},{name:"open",type:"boolean",default:"-",description:"Estado aberto controlado."},{name:"onOpenChange",type:"(open: boolean) => void",default:"-",description:"Callback quando o estado muda."},{name:"modal",type:"boolean",default:"false",description:"Define comportamento modal (bloqueia interação externa)."},{name:"asChild (Trigger)",type:"boolean",default:"false",description:"Mescla props com o elemento filho."},{name:"side",type:'"top" | "right" | "bottom" | "left"',default:'"bottom"',description:"Lado preferido de posicionamento."},{name:"sideOffset",type:"number",default:"4",description:"Distância em pixels do trigger."},{name:"align",type:'"start" | "center" | "end"',default:'"center"',description:"Alinhamento em relação ao trigger."},{name:"alignOffset",type:"number",default:"0",description:"Deslocamento do alinhamento em pixels."},{name:"avoidCollisions",type:"boolean",default:"true",description:"Evita colisões com bordas da viewport."},{name:"collisionPadding",type:"number | Padding",default:"0",description:"Espaçamento da borda de colisão."},{name:"sticky",type:'"partial" | "always"',default:'"partial"',description:"Comportamento de aderência durante scroll."},{name:"hideWhenDetached",type:"boolean",default:"false",description:"Oculta quando desconectado do trigger."},{name:"container",type:"HTMLElement | null",default:"document.body",description:"Container do portal."}],accessibility:["Segue o padrão WAI-ARIA Dialog (non-modal).","Enter/Space: Abre/fecha o popover quando o trigger está focado.","Escape: Fecha o popover e retorna o foco ao trigger.","Tab: Navega entre elementos focáveis dentro do popover.","Foco é automaticamente movido para o conteúdo ao abrir.","Foco retorna ao trigger ao fechar.","Atributos ARIA: aria-expanded, aria-haspopup.","Data attributes: [data-state], [data-side], [data-align]."],notes:["Use Popover para exibir conteúdo rico como formulários, detalhes ou ações secundárias.","Prefira Dialog para conteúdo que requer atenção total do usuário.","O prop asChild permite usar qualquer elemento como trigger.","Combine com formulários para edição inline de campos."]})}export{v as PopoverDoc};
@@ -1,29 +0,0 @@
1
- import{j as e,ap as s}from"./index-BtX5DZqb.js";import{C as a}from"./ComponentDocTemplate-BtOCnlM2.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function l(){return e.jsx(a,{title:"Progress",description:"Exibe um indicador mostrando o progresso de conclusão de uma tarefa, tipicamente exibido como uma barra de progresso.",component:e.jsx(s,{value:60,className:"w-[60%]"}),usage:`import { Progress } from "forlogic-core"
2
-
3
- <Progress value={60} />`,examples:[{title:"Default",description:"Barra de progresso com valor definido.",preview:e.jsx(s,{value:60,className:"w-[60%]"}),code:"<Progress value={60} />"},{title:"Valores Variados",description:"Progresso em diferentes estágios de conclusão.",preview:e.jsxs("div",{className:"space-y-4 w-[60%]",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-sm text-muted-foreground",children:"25% concluído"}),e.jsx(s,{value:25})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-sm text-muted-foreground",children:"50% concluído"}),e.jsx(s,{value:50})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-sm text-muted-foreground",children:"75% concluído"}),e.jsx(s,{value:75})]})]}),code:`<div className="space-y-1">
4
- <span className="text-sm">25% concluído</span>
5
- <Progress value={25} />
6
- </div>`},{title:"Completo",description:"Estado de progresso 100% concluído.",preview:e.jsxs("div",{className:"space-y-1 w-[60%]",children:[e.jsxs("div",{className:"flex justify-between text-sm",children:[e.jsx("span",{children:"Download concluído"}),e.jsx("span",{className:"text-muted-foreground",children:"100%"})]}),e.jsx(s,{value:100})]}),code:`<div className="space-y-1">
7
- <div className="flex justify-between text-sm">
8
- <span>Download concluído</span>
9
- <span>100%</span>
10
- </div>
11
- <Progress value={100} />
12
- </div>`},{title:"Upload de Arquivo",description:"Exemplo de uso em upload com percentual.",preview:e.jsxs("div",{className:"space-y-2 w-[60%] p-4 border rounded-lg",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("div",{className:"flex-1",children:[e.jsx("p",{className:"text-sm font-medium",children:"documento.pdf"}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"2.4 MB de 4.8 MB"})]}),e.jsx("span",{className:"text-sm font-medium",children:"50%"})]}),e.jsx(s,{value:50})]}),code:`<div className="space-y-2 p-4 border rounded-lg">
13
- <div className="flex items-center gap-2">
14
- <div className="flex-1">
15
- <p className="text-sm font-medium">documento.pdf</p>
16
- <p className="text-xs text-muted-foreground">2.4 MB de 4.8 MB</p>
17
- </div>
18
- <span className="text-sm font-medium">50%</span>
19
- </div>
20
- <Progress value={50} />
21
- </div>`},{title:"Progresso de Etapas",description:"Indicando progresso em um wizard ou processo multi-etapas.",preview:e.jsxs("div",{className:"space-y-2 w-[60%]",children:[e.jsxs("div",{className:"flex justify-between text-sm",children:[e.jsx("span",{children:"Etapa 2 de 5"}),e.jsx("span",{className:"text-muted-foreground",children:"40%"})]}),e.jsx(s,{value:40}),e.jsxs("div",{className:"flex justify-between text-xs text-muted-foreground",children:[e.jsx("span",{children:"Dados pessoais"}),e.jsx("span",{children:"Endereço"}),e.jsx("span",{children:"Pagamento"}),e.jsx("span",{children:"Revisão"}),e.jsx("span",{children:"Confirmação"})]})]}),code:`<div className="space-y-2">
22
- <div className="flex justify-between text-sm">
23
- <span>Etapa 2 de 5</span>
24
- <span>40%</span>
25
- </div>
26
- <Progress value={40} />
27
- </div>`},{title:"Tamanhos",description:"Progress bar com diferentes alturas via className.",preview:e.jsxs("div",{className:"space-y-4 w-[60%]",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-xs text-muted-foreground",children:"Pequeno (h-1)"}),e.jsx(s,{value:60,className:"h-1"})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-xs text-muted-foreground",children:"Padrão (h-2)"}),e.jsx(s,{value:60,className:"h-2"})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsx("span",{className:"text-xs text-muted-foreground",children:"Grande (h-4)"}),e.jsx(s,{value:60,className:"h-4"})]})]}),code:`<Progress value={60} className="h-1" /> {/* Pequeno */}
28
- <Progress value={60} className="h-2" /> {/* Padrão */}
29
- <Progress value={60} className="h-4" /> {/* Grande */}`}],props:[{name:"value",type:"number",default:"0",description:"O valor de progresso (0-100)."},{name:"max",type:"number",default:"100",description:"O valor máximo de progresso."},{name:"getValueLabel",type:"(value: number, max: number) => string",default:"-",description:"Função para gerar label acessível."},{name:"className",type:"string",default:"-",description:"Classes CSS para estilização."}],accessibility:['Usa atributos ARIA apropriados (role="progressbar")',"Anuncia o progresso para leitores de tela via aria-valuenow","aria-valuemin e aria-valuemax definidos automaticamente","Use getValueLabel para descrições customizadas","Indicador visual claro para estado de progresso"],notes:["Use Progress para indicar conclusão de tarefas de longa duração","Combine com textos descritivos para fornecer contexto adicional","Prefira Spinner para loading de curta duração ou indeterminado","Ajuste a altura via className (h-1, h-2, h-4) para diferentes contextos","Para uploads, mostre tamanho atual e total junto com o percentual"]})}export{l as ProgressDoc};
@@ -1,149 +0,0 @@
1
- import{j as e,r,ey as i,B as u,c7 as c,dS as m,dT as p,f as x,dU as g,dV as f,dW as h}from"./index-BtX5DZqb.js";import{C as v}from"./ComponentDocTemplate-BtOCnlM2.js";import{U}from"./user-check-CrbWcnPN.js";import"./ExampleCard-DfuMYM6E.js";import"./TableOfContents-DBMJMbI4.js";function I(){const[s,a]=r.useState("");return e.jsxs("div",{className:"w-[300px]",children:[e.jsx(i,{value:s,onChange:o=>a(o),placeholder:"Selecione um usuário..."}),s&&e.jsxs("p",{className:"mt-2 text-sm text-muted-foreground",children:["ID selecionado: ",e.jsx(u,{variant:"secondary",children:s})]})]})}function b(){const[s,a]=r.useState("");return e.jsx("div",{className:"w-[300px]",children:e.jsx(i,{label:"Responsável",required:!0,value:s,onChange:o=>a(o),placeholder:"Selecione o responsável...",icon:U})})}function y(){const[s,a]=r.useState([]);return e.jsxs("div",{className:"w-[350px]",children:[e.jsx(i,{multiple:!0,label:"Avaliadores",required:!0,value:s,onChange:o=>a(o),placeholder:"Selecione os avaliadores...",icon:c,maxDisplayedBadges:3}),s.length>0&&e.jsxs("p",{className:"mt-2 text-sm text-muted-foreground",children:[s.length," usuário(s) selecionado(s)"]})]})}function j(){const[s,a]=r.useState(""),[o,n]=r.useState(""),[t,d]=r.useState("");return e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"w-[300px]",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground mb-2",children:"Formato: name (padrão)"}),e.jsx(i,{displayFormat:"name",value:s,onChange:l=>a(l),placeholder:"Apenas nome..."})]}),e.jsxs("div",{className:"w-[350px]",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground mb-2",children:"Formato: name-email"}),e.jsx(i,{displayFormat:"name-email",value:o,onChange:l=>n(l),placeholder:"Nome e email..."})]}),e.jsxs("div",{className:"w-[300px]",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground mb-2",children:"Formato: name-role"}),e.jsx(i,{displayFormat:"name-role",value:t,onChange:l=>d(l),placeholder:"Nome e cargo..."})]})]})}function C(){const[s,a]=r.useState(!1),[o,n]=r.useState(""),t=r.useRef(null);return e.jsxs(m,{open:s,onOpenChange:a,children:[e.jsx(p,{asChild:!0,children:e.jsx(x,{variant:"outline",children:"Abrir Dialog com QualiexUserField"})}),e.jsxs(g,{ref:t,className:"max-h-[90vh] overflow-visible",children:[e.jsx(f,{children:e.jsx(h,{children:"Selecionar Usuário"})}),e.jsxs("div",{className:"mt-4 max-h-[60vh] overflow-auto pr-1",children:[e.jsx(i,{label:"Responsável",required:!0,value:o,onChange:d=>n(d),placeholder:"Selecione...",popoverContainer:t.current}),e.jsxs("p",{className:"mt-4 text-sm text-muted-foreground",children:["O ",e.jsx("code",{className:"text-xs bg-muted px-1 py-0.5 rounded",children:"popoverContainer"}),"garante que o dropdown funcione corretamente dentro do Dialog."]})]})]})]})}function E(){return e.jsx(v,{title:"QualiexUserField",description:"Campo de seleção de usuários integrado com a API Qualiex. Suporta seleção única ou múltipla, display customizado, filtros e funciona perfeitamente dentro de Dialogs.",component:e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Uso básico"}),e.jsx(I,{})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Com label e ícone"}),e.jsx(b,{})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Seleção múltipla"}),e.jsx(y,{})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Formatos de exibição"}),e.jsx(j,{})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-sm font-medium text-muted-foreground",children:"Uso em Dialog"}),e.jsx(C,{})]})]}),usage:`import { QualiexUserField } from "forlogic-core"
2
-
3
- // =====================
4
- // USO BÁSICO
5
- // =====================
6
- <QualiexUserField
7
- value={userId}
8
- onChange={setUserId}
9
- placeholder="Selecione..."
10
- />
11
-
12
- // =====================
13
- // COM LABEL E REQUIRED
14
- // =====================
15
- import { UserCheck } from "lucide-react"
16
-
17
- <QualiexUserField
18
- label="Responsável"
19
- required
20
- icon={UserCheck}
21
- value={userId}
22
- onChange={setUserId}
23
- />
24
-
25
- // =====================
26
- // SELEÇÃO MÚLTIPLA
27
- // =====================
28
- const [userIds, setUserIds] = useState<string[]>([])
29
-
30
- <QualiexUserField
31
- multiple
32
- label="Avaliadores"
33
- required
34
- value={userIds}
35
- onChange={setUserIds}
36
- maxDisplayedBadges={3}
37
- />
38
-
39
- // =====================
40
- // DISPLAY CUSTOMIZADO
41
- // =====================
42
-
43
- // Exibir nome + email
44
- <QualiexUserField
45
- displayFormat="name-email"
46
- value={userId}
47
- onChange={setUserId}
48
- />
49
-
50
- // Exibir nome + cargo
51
- <QualiexUserField
52
- displayFormat="name-role"
53
- value={userId}
54
- onChange={setUserId}
55
- />
56
-
57
- // Custom display function
58
- <QualiexUserField
59
- displayFormat="custom"
60
- customDisplayFn={(user) => \`\${user.userName} - \${user.placeName || 'Sem local'}\`}
61
- value={userId}
62
- onChange={setUserId}
63
- />
64
-
65
- // =====================
66
- // FILTRO DE USUÁRIOS
67
- // =====================
68
-
69
- // Apenas admins
70
- <QualiexUserField
71
- filterFn={(user) => user.roleName === 'Admin'}
72
- value={userId}
73
- onChange={setUserId}
74
- />
75
-
76
- // Excluir usuário atual
77
- <QualiexUserField
78
- filterFn={(user) => user.userId !== currentUserId}
79
- value={userId}
80
- onChange={setUserId}
81
- />
82
-
83
- // =====================
84
- // USO EM DIALOG/MODAL
85
- // =====================
86
- import { useRef } from "react"
87
- import { Dialog, DialogContent, DialogTrigger } from "forlogic-core"
88
-
89
- function MyDialog() {
90
- const dialogRef = useRef<HTMLDivElement>(null)
91
- const [userId, setUserId] = useState('')
92
-
93
- return (
94
- <Dialog>
95
- <DialogTrigger asChild>
96
- <Button>Abrir</Button>
97
- </DialogTrigger>
98
- <DialogContent ref={dialogRef} className="overflow-visible">
99
- <QualiexUserField
100
- value={userId}
101
- onChange={setUserId}
102
- popoverContainer={dialogRef.current}
103
- />
104
- </DialogContent>
105
- </Dialog>
106
- )
107
- }
108
-
109
- // =====================
110
- // USO EM BASEFORM (type: user-select)
111
- // =====================
112
- const fields: FormField[] = [
113
- {
114
- name: 'responsible_id',
115
- label: 'Responsável',
116
- type: 'user-select',
117
- required: true,
118
- placeholder: 'Selecione o responsável...'
119
- }
120
- ]
121
-
122
- // =====================
123
- // HOOK useQualiexUsers
124
- // =====================
125
- // O QualiexUserField usa internamente o hook useQualiexUsers
126
-
127
- import { useQualiexUsers } from "forlogic-core"
128
-
129
- // Busca automática (padrão)
130
- const { data: users, isLoading, error } = useQualiexUsers()
131
-
132
- // Busca condicional (ex: quando modal abre)
133
- const { data: users } = useQualiexUsers({ enabled: isModalOpen })
134
-
135
- // Lazy loading com refetch manual
136
- const { data: users, refetch } = useQualiexUsers({ enabled: false })
137
- await refetch() // Chama quando necessário
138
-
139
- // Tipo QualiexUser retornado:
140
- interface QualiexUser {
141
- userId: string
142
- userName: string
143
- userEmail: string
144
- roleName?: string
145
- roleId?: string
146
- placeName?: string
147
- placeId?: string
148
- isActive?: boolean
149
- }`,props:[{name:"value",type:"string | string[]",default:"''",description:"ID(s) do(s) usuário(s) selecionado(s)."},{name:"onChange",type:"(value: string | string[]) => void",default:"-",description:"Callback quando seleção muda."},{name:"multiple",type:"boolean",default:"false",description:"Habilita seleção múltipla."},{name:"label",type:"string",default:"-",description:"Label do campo."},{name:"required",type:"boolean",default:"false",description:"Adiciona asterisco ao label."},{name:"placeholder",type:"string",default:'t("search_placeholder")',description:"Placeholder quando vazio."},{name:"icon",type:"LucideIcon",default:"-",description:"Ícone exibido no campo."},{name:"disabled",type:"boolean",default:"false",description:"Desabilita o campo."},{name:"enabled",type:"boolean",default:"true",description:"Controla se o hook busca dados da API."},{name:"displayFormat",type:"'name' | 'name-email' | 'name-role' | 'custom'",default:"'name'",description:"Formato de exibição do usuário."},{name:"customDisplayFn",type:"(user: QualiexUser) => string",default:"-",description:'Função customizada de exibição (requer displayFormat="custom").'},{name:"filterFn",type:"(user: QualiexUser) => boolean",default:"-",description:"Função para filtrar usuários."},{name:"maxDisplayedBadges",type:"number",default:"-",description:"Limite de badges no modo múltiplo."},{name:"sortOptions",type:"boolean",default:"true",description:"Ordena usuários alfabeticamente."},{name:"popoverContainer",type:"HTMLElement | null",default:"-",description:"Container para portal (útil em Dialog)."},{name:"onOpen",type:"() => void",default:"-",description:"Callback ao abrir o popover."},{name:"onClose",type:"() => void",default:"-",description:"Callback ao fechar o popover."},{name:"className",type:"string",default:"-",description:"Classes CSS adicionais."}],accessibility:["Navegação completa por teclado","Busca inteligente (sem acentos, case-insensitive)","Segue padrão WAI-ARIA combobox","Badges removíveis com teclado (modo múltiplo)","Estados de loading e erro acessíveis","Labels associados corretamente"],notes:["Requer configuração Qualiex (apiUrl e apiToken) no projeto","Use enabled={false} para lazy loading e chame refetch() manualmente","Em Dialogs, sempre passe popoverContainer para evitar problemas de z-index","O hook useQualiexUsers é usado internamente para buscar os usuários",'Integrado automaticamente com BaseForm via type="user-select"']})}export{E as QualiexUserFieldDoc};