@cnc-ti/layout-basic 5.0.0 → 6.0.0

package/src/components/Header/index.tsx

@@ -1,88 +1,88 @@
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../DropDownMenu";
-
-export type HeaderProps = {
-  userName: string;
-  imageUrl?: string;
-  entityName?: string;
-};
-
-function getInitials(fullName: string): string {
-  if (!fullName) {
-    return '';
-  }
-  const nameParts = fullName.trim().split(' ');
-
-  if (nameParts.length < 2) {
-    return nameParts[0][0].toUpperCase();
-  }
-
-  const firstNameInitial = nameParts[0][0].toUpperCase();
-  const lastNameInitial = nameParts[nameParts.length - 1][0].toUpperCase();
-
-  return `${firstNameInitial}${lastNameInitial}`;
-}
-
-export const Header = ({
-  userName,
-  entityName
-}: HeaderProps) => {
-  const initials = getInitials(userName);
-
-  return (
-    <header className="h-[60px] flex items-center justify-end gap-4 px-4 w-full shadow-custom">
-      <div className="flex lg:flex-1 lg:justify-end">
-        {/* User */}
-        <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <div id="border-lateral" className="border-solid border-l-2 border-brand-blue-60">
-         
-            <div className="flex flex-row gap-2 items-center justify-center hover:bg-gray-100 transition duration-300 ease-in-out cursor-pointer px-4 py-2 rounded-lg ml-8">              
-              <div className="flex flex-col justify-end text-end">
-              <p className="text-xs font-extrabold text-brand-blue-900">{entityName}</p>
-              <p className="text-xs font-normal text-brand-gray-700">{userName}</p>
-              </div>
-              <div>
-              <div className="flex items-center justify-center w-10 h-10 rounded-full bg-brand-white text-white text-sm font-normal border-solid border-2">
-                
-              </div>
-              </div>
-            </div>    
-          </div>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent>
-        
-          <DropdownMenuItem onClick={() => alert('Trocar Entidade')}>
-            <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M320 120l48 48-48 48"></path><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M352 168H144a80.24 80.24 0 00-80 80v16m128 128l-48-48 48-48"></path><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M160 344h208a80.24 80.24 0 0080-80v-16"></path></svg>
-            Trocar Entidade
-          </DropdownMenuItem>
-                    
-          <DropdownMenuItem onClick={() => alert('Sair')}>
-            <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M304 336v40a40 40 0 01-40 40H104a40 40 0 01-40-40V136a40 40 0 0140-40h152c22.09 0 48 17.91 48 40v40m64 160l80-80-80-80m-192 80h256"></path></svg>
-            Sair
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
-       
-        
-
-        {/* Aplications */}
-        <div className="flex flex-row items-center justify-center hover:bg-gray-100 transition duration-300 ease-in-out cursor-pointer p-2 rounded-lg">
-          <div className="flex flex-row items-center justify-center rounded-full w-10 h-10 text-sm font-normal">
-            <svg
-              width="18"
-              height="18"
-              viewBox="0 0 16 16"
-              fill="none"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M2 4C3.1 4 4 3.1 4 2C4 0.9 3.1 0 2 0C0.9 0 0 0.9 0 2C0 3.1 0.9 4 2 4ZM8 16C9.1 16 10 15.1 10 14C10 12.9 9.1 12 8 12C6.9 12 6 12.9 6 14C6 15.1 6.9 16 8 16ZM2 16C3.1 16 4 15.1 4 14C4 12.9 3.1 12 2 12C0.9 12 0 12.9 0 14C0 15.1 0.9 16 2 16ZM2 10C3.1 10 4 9.1 4 8C4 6.9 3.1 6 2 6C0.9 6 0 6.9 0 8C0 9.1 0.9 10 2 10ZM8 10C9.1 10 10 9.1 10 8C10 6.9 9.1 6 8 6C6.9 6 6 6.9 6 8C6 9.1 6.9 10 8 10ZM12 2C12 3.1 12.9 4 14 4C15.1 4 16 3.1 16 2C16 0.9 15.1 0 14 0C12.9 0 12 0.9 12 2ZM8 4C9.1 4 10 3.1 10 2C10 0.9 9.1 0 8 0C6.9 0 6 0.9 6 2C6 3.1 6.9 4 8 4ZM14 10C15.1 10 16 9.1 16 8C16 6.9 15.1 6 14 6C12.9 6 12 6.9 12 8C12 9.1 12.9 10 14 10ZM14 16C15.1 16 16 15.1 16 14C16 12.9 15.1 12 14 12C12.9 12 12 12.9 12 14C12 15.1 12.9 16 14 16Z"
-                fill="black"
-              />
-            </svg>
-          </div>
-        </div>
-      </div>
-    </header>
-  );
-};
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../DropDownMenu";
+
+export type HeaderProps = {
+  userName: string;
+  imageUrl?: string;
+  entityName?: string;
+};
+
+function getInitials(fullName: string): string {
+  if (!fullName) {
+    return '';
+  }
+  const nameParts = fullName.trim().split(' ');
+
+  if (nameParts.length < 2) {
+    return nameParts[0][0].toUpperCase();
+  }
+
+  const firstNameInitial = nameParts[0][0].toUpperCase();
+  const lastNameInitial = nameParts[nameParts.length - 1][0].toUpperCase();
+
+  return `${firstNameInitial}${lastNameInitial}`;
+}
+
+export const Header = ({
+  userName,
+  entityName
+}: HeaderProps) => {
+  const initials = getInitials(userName);
+
+  return (
+    <header className="h-[60px] flex items-center justify-end gap-4 px-4 w-full shadow-custom">
+      <div className="flex lg:flex-1 lg:justify-end">
+        {/* User */}
+        <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <div id="border-lateral" className="border-solid border-l-2 border-brand-blue-60">
+         
+            <div className="flex flex-row gap-2 items-center justify-center hover:bg-gray-100 transition duration-300 ease-in-out cursor-pointer px-4 py-2 rounded-lg ml-8">              
+              <div className="flex flex-col justify-end text-end">
+              <p className="text-xs font-extrabold text-brand-blue-900">{entityName}</p>
+              <p className="text-xs font-normal text-brand-gray-700">{userName}</p>
+              </div>
+              <div>
+              <div className="flex items-center justify-center w-10 h-10 rounded-full bg-brand-white text-white text-sm font-normal border-solid border-2">
+                
+              </div>
+              </div>
+            </div>    
+          </div>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent>
+        
+          <DropdownMenuItem onClick={() => alert('Trocar Entidade')}>
+            <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M320 120l48 48-48 48"></path><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M352 168H144a80.24 80.24 0 00-80 80v16m128 128l-48-48 48-48"></path><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M160 344h208a80.24 80.24 0 0080-80v-16"></path></svg>
+            Trocar Entidade
+          </DropdownMenuItem>
+                    
+          <DropdownMenuItem onClick={() => alert('Sair')}>
+            <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 512 512" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M304 336v40a40 40 0 01-40 40H104a40 40 0 01-40-40V136a40 40 0 0140-40h152c22.09 0 48 17.91 48 40v40m64 160l80-80-80-80m-192 80h256"></path></svg>
+            Sair
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+       
+        
+
+        {/* Aplications */}
+        <div className="flex flex-row items-center justify-center hover:bg-gray-100 transition duration-300 ease-in-out cursor-pointer p-2 rounded-lg">
+          <div className="flex flex-row items-center justify-center rounded-full w-10 h-10 text-sm font-normal">
+            <svg
+              width="18"
+              height="18"
+              viewBox="0 0 16 16"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M2 4C3.1 4 4 3.1 4 2C4 0.9 3.1 0 2 0C0.9 0 0 0.9 0 2C0 3.1 0.9 4 2 4ZM8 16C9.1 16 10 15.1 10 14C10 12.9 9.1 12 8 12C6.9 12 6 12.9 6 14C6 15.1 6.9 16 8 16ZM2 16C3.1 16 4 15.1 4 14C4 12.9 3.1 12 2 12C0.9 12 0 12.9 0 14C0 15.1 0.9 16 2 16ZM2 10C3.1 10 4 9.1 4 8C4 6.9 3.1 6 2 6C0.9 6 0 6.9 0 8C0 9.1 0.9 10 2 10ZM8 10C9.1 10 10 9.1 10 8C10 6.9 9.1 6 8 6C6.9 6 6 6.9 6 8C6 9.1 6.9 10 8 10ZM12 2C12 3.1 12.9 4 14 4C15.1 4 16 3.1 16 2C16 0.9 15.1 0 14 0C12.9 0 12 0.9 12 2ZM8 4C9.1 4 10 3.1 10 2C10 0.9 9.1 0 8 0C6.9 0 6 0.9 6 2C6 3.1 6.9 4 8 4ZM14 10C15.1 10 16 9.1 16 8C16 6.9 15.1 6 14 6C12.9 6 12 6.9 12 8C12 9.1 12.9 10 14 10ZM14 16C15.1 16 16 15.1 16 14C16 12.9 15.1 12 14 12C12.9 12 12 12.9 12 14C12 15.1 12.9 16 14 16Z"
+                fill="black"
+              />
+            </svg>
+          </div>
+        </div>
+      </div>
+    </header>
+  );
+};

package/src/components/Modal/ModalMudancaEntidade/index.tsx

@@ -1,42 +1,42 @@
-// import { Button } from "../Button";
-import React from "react";
-import { Modal } from "..";
-import { Button } from "../../Button";
-import { DialogTitle } from "../../Dialog";
-
-type ModalMudancaEnntidadeProps = {
-  title?: string;
-  onClose?: any;
-  visibleModal?: boolean;
-  SelectComponent?: any;
-  buttonAction: React.MouseEventHandler<HTMLButtonElement>;
-};
-
-export const ModalMudancaEntidade = ({
-  title,
-  onClose,
-  visibleModal,
-  SelectComponent,
-  buttonAction,
-}: ModalMudancaEnntidadeProps) => {
-  return (
-    <Modal
-      title={title}
-      onClose={onClose}
-      visibleModal={visibleModal}
-      content={
-        <>
-          <DialogTitle className="DialogTitle mt-10 mb-4 ">
-            Selecionar a entidade
-          </DialogTitle>
-          <div className="flex mb-5 ">
-            <SelectComponent />
-            <Button className="text-white ml-5" onClick={buttonAction}>
-              Trocar entidade
-            </Button>
-          </div>
-        </>
-      }
-    ></Modal>
-  );
-};
+// import { Button } from "../Button";
+import React from "react";
+import { Modal } from "..";
+import { Button } from "../../Button";
+import { DialogTitle } from "../../Dialog";
+
+type ModalMudancaEnntidadeProps = {
+  title?: string;
+  onClose?: any;
+  visibleModal?: boolean;
+  SelectComponent?: any;
+  buttonAction: React.MouseEventHandler<HTMLButtonElement>;
+};
+
+export const ModalMudancaEntidade = ({
+  title,
+  onClose,
+  visibleModal,
+  SelectComponent,
+  buttonAction,
+}: ModalMudancaEnntidadeProps) => {
+  return (
+    <Modal
+      title={title}
+      onClose={onClose}
+      visibleModal={visibleModal}
+      content={
+        <>
+          <DialogTitle className="DialogTitle mt-10 mb-4 ">
+            Selecionar a entidade
+          </DialogTitle>
+          <div className="flex mb-5 ">
+            <SelectComponent />
+            <Button className="text-white ml-5" onClick={buttonAction}>
+              Trocar entidade
+            </Button>
+          </div>
+        </>
+      }
+    ></Modal>
+  );
+};

package/src/components/Modal/index.tsx

@@ -1,44 +1,44 @@
-// import { Button } from "../Button";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogOverlay,
-  DialogTrigger,
-} from "../Dialog";
-
-type entidadeOptionsType = {
-  name: string;
-  value: string;
-};
-export type ModalProps = {
-  title?: string;
-  content?: React.ReactElement;
-  onClose?: any;
-  // entidadesOptions?: entidadeOptionsType[];
-  // entityName?: string;
-  visibleModal?: boolean;
-};
-
-export const Modal = ({
-  title,
-  content,
-  visibleModal,
-  onClose,
-}: ModalProps) => {
-  return (
-    <Dialog open={visibleModal} onOpenChange={onClose}>
-      <DialogOverlay className="inset-0 bg-blackA6= data-[state=open]:animate-overlayShow" />
-      <DialogContent className="  max-h-[85vh] w-[90vw] max-w-[40.625rem] p-0 rounded-sm bg-white  focus:outline-none data-[state=open]:animate-contentShow">
-        {title && (
-          <DialogHeader className="text-sm h-14 text-gray-500 font-thin border-b w-full px-6 py-3 leading-10">
-            {title}
-          </DialogHeader>
-        )}
-        <div className="flex flex-col mb-10 ml-20 align-middle items-left  justify-center">
-          {content}
-        </div>
-      </DialogContent>
-    </Dialog>
-  );
-};
+// import { Button } from "../Button";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogOverlay,
+  DialogTrigger,
+} from "../Dialog";
+
+type entidadeOptionsType = {
+  name: string;
+  value: string;
+};
+export type ModalProps = {
+  title?: string;
+  content?: React.ReactElement;
+  onClose?: any;
+  // entidadesOptions?: entidadeOptionsType[];
+  // entityName?: string;
+  visibleModal?: boolean;
+};
+
+export const Modal = ({
+  title,
+  content,
+  visibleModal,
+  onClose,
+}: ModalProps) => {
+  return (
+    <Dialog open={visibleModal} onOpenChange={onClose}>
+      <DialogOverlay className="inset-0 bg-blackA6= data-[state=open]:animate-overlayShow" />
+      <DialogContent className="  max-h-[85vh] w-[90vw] max-w-[40.625rem] p-0 rounded-sm bg-white  focus:outline-none data-[state=open]:animate-contentShow">
+        {title && (
+          <DialogHeader className="text-sm h-14 text-gray-500 font-thin border-b w-full px-6 py-3 leading-10">
+            {title}
+          </DialogHeader>
+        )}
+        <div className="flex flex-col mb-10 ml-20 align-middle items-left  justify-center">
+          {content}
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+};

package/src/components/Popover/index.tsx

@@ -1,32 +1,32 @@
-"use client"
-
-import * as PopoverPrimitive from "@radix-ui/react-popover"
-import * as React from "react"
-
-import { cn } from "../utils"
-
-const Popover = PopoverPrimitive.Root
-
-const PopoverTrigger = PopoverPrimitive.Trigger
-
-const PopoverContent = React.forwardRef<
-  React.ElementRef<typeof PopoverPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
->(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
-  <PopoverPrimitive.Portal>
-    <PopoverPrimitive.Content
-      ref={ref}
-      align={align}
-      sideOffset={sideOffset}
-      className={cn(
-        "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className
-      )}
-      {...props}
-    />
-  </PopoverPrimitive.Portal>
-))
-PopoverContent.displayName = PopoverPrimitive.Content.displayName
-
-export { Popover, PopoverContent, PopoverTrigger }
-
+"use client"
+
+import * as PopoverPrimitive from "@radix-ui/react-popover"
+import * as React from "react"
+
+import { cn } from "../utils"
+
+const Popover = PopoverPrimitive.Root
+
+const PopoverTrigger = PopoverPrimitive.Trigger
+
+const PopoverContent = React.forwardRef<
+  React.ElementRef<typeof PopoverPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
+>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
+  <PopoverPrimitive.Portal>
+    <PopoverPrimitive.Content
+      ref={ref}
+      align={align}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      )}
+      {...props}
+    />
+  </PopoverPrimitive.Portal>
+))
+PopoverContent.displayName = PopoverPrimitive.Content.displayName
+
+export { Popover, PopoverContent, PopoverTrigger }
+