karsten-design-system 1.2.56 → 1.2.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -503,7 +503,7 @@ function Header({ sidebarItems, sidebarTopItems, username, userConfigItems, setO
503
503
  document.removeEventListener('mousedown', handleClickOutside);
504
504
  };
505
505
  }, [openUserConfig]);
506
- return (jsxs(Fragment, { children: [jsxs("div", { className: "w-100 min-h-16 border-b border-b-light-200 flex flex-row justify-between items-center px-8 shadow-header dark:bg-dark-100 dark:border-b-dark-400", children: [jsxs("div", { className: "flex flex-row items-center gap-4", children: [jsx("button", { className: "bg-transparent border-none", onClick: () => setOpenSidebar(!openSidebar), "aria-label": "Abrir menu lateral", children: jsx("i", { className: `${openSidebar ? 'pi pi-list' : 'pi pi-bars'} text-light-950 cursor-pointer hover:text-light-900 text-xl mt-1 }` }) }), jsx(Link$1, { className: "cursor-pointer", to: redirect, "aria-label": "Ir para p\u00E1gina inicial", children: jsx(LogoSmall, {}) }, "logo-link")] }), jsxs("div", { className: "relative flex flex-row gap-4 items-center", children: [isRenderNotifications && (jsx("button", { className: "bg-transparent border-none mt-1", onClick: () => setOpenNotifications(true), "aria-label": "Abrir notifica\u00E7\u00E3o", children: jsx("i", { className: "pi pi-bell text-light-950 cursor-pointer hover:text-light-900" }) })), jsxs("div", { ref: userConfigRef, className: "relative", children: [jsx("button", { className: "bg-transparent border-none", onClick: () => setOpenUserConfig(!openUserConfig), "aria-label": "Abrir menu de configura\u00E7\u00F5es do usu\u00E1rio", children: jsxs("p", { className: "text-light-950 hover:text-light-900 font-roboto font-bold cursor-pointer transition-colors duration-200", children: [helloTranslation, ", ", username] }) }), openUserConfig && (jsx("div", { className: `absolute w-100 bg-light-500 shadow-md border border-light-400 z-20 rounded-md p-2 -bottom-1 translate-y-full dark:bg-dark-100`, children: jsx("ul", { children: userConfigItems.map(({ id, title, onClick, path }) => (jsx("li", { className: "p-2 hover:bg-light-300 dark:bg-dark-100 dark:text-light-500 dark:hover:bg-dark-400", children: jsx("a", { onClick: () => {
506
+ return (jsxs(Fragment, { children: [jsxs("div", { className: "w-100 min-h-16 border-b border-b-light-200 flex flex-row justify-between items-center px-8 shadow-header dark:bg-dark-100 dark:border-b-dark-400", children: [jsxs("div", { className: "flex flex-row items-center gap-4", children: [jsx("button", { className: "bg-transparent border-none", onClick: () => setOpenSidebar(!openSidebar), "aria-label": "Abrir menu lateral", children: jsx("i", { className: `${openSidebar ? 'pi pi-list' : 'pi pi-bars'} text-light-950 cursor-pointer hover:text-light-900 text-xl mt-1 }` }) }), jsx(Link$1, { className: "cursor-pointer", to: redirect, "aria-label": "Ir para p\u00E1gina inicial", children: jsx(LogoSmall, {}) }, "logo-link")] }), jsxs("div", { className: "relative flex flex-row gap-4 items-center", children: [isRenderNotifications && (jsx("button", { className: "bg-transparent border-none mt-1", onClick: () => setOpenNotifications(true), "aria-label": "Abrir notifica\u00E7\u00E3o", children: jsx("i", { className: "pi pi-bell text-light-950 cursor-pointer hover:text-light-900" }) })), jsxs("div", { ref: userConfigRef, className: "relative", children: [jsx("button", { className: "bg-transparent border-none", onClick: () => setOpenUserConfig(!openUserConfig), "aria-label": "Abrir menu de configura\u00E7\u00F5es do usu\u00E1rio", children: jsxs("p", { className: "text-light-950 hover:text-light-900 font-roboto font-bold cursor-pointer transition-colors duration-200", children: [helloTranslation, ", ", username] }) }), openUserConfig && (jsx("div", { className: `absolute w-100 z-20 p-2 -bottom-1 translate-y-full shadow-container rounded-md bg-light-500 dark:text-light-500 dark:bg-dark-100 dark:border dark:border-dark-500 dark:shadow-dark-400`, children: jsx("ul", { children: userConfigItems.map(({ id, title, onClick, path }) => (jsx("li", { className: "p-2 rounded hover:bg-light-300 dark:bg-dark-100 dark:text-light-500 dark:hover:bg-dark-400", children: jsx("a", { onClick: () => {
507
507
  if (onClick)
508
508
  onClick();
509
509
  setOpenUserConfig(false);
@@ -742,7 +742,7 @@ function LanguageDropdown({ selected = 'pt', onChange, }) {
742
742
  document.addEventListener('mousedown', handleClickOutside);
743
743
  return () => document.removeEventListener('mousedown', handleClickOutside);
744
744
  }, []);
745
- return (jsxs("div", { ref: ref, className: "relative inline-block", children: [jsxs("button", { type: "button", className: clsx('p-1 rounded-md cursor-pointer hover:bg-light-300 dark:hover:bg-dark-400'), onClick: () => setOpen(!open), "aria-haspopup": "listbox", "aria-expanded": open, "aria-label": "Selecionar idioma", children: [languageOptions.find((lang) => lang.code === selected)?.icon || null, jsx("span", { className: "sr-only", children: selected })] }), open && (jsx("div", { className: clsx('absolute right-0 mt-2 w-40 rounded-md border border-light-700 bg-light-500 p-2 dark:bg-dark-100 shadow-md z-40'), role: "listbox", children: jsx("ul", { children: languageOptions.map((option) => (jsxs("li", { className: clsx('p-2 cursor-pointer rounded hover:bg-light-300 hover:font-bold dark:bg-dark-100 dark:text-light-500 dark:hover:bg-dark-400 mt-1', option.code === selected &&
745
+ return (jsxs("div", { ref: ref, className: "relative inline-block", children: [jsxs("button", { type: "button", className: clsx('p-1 rounded-md cursor-pointer hover:bg-light-300 dark:hover:bg-dark-400'), onClick: () => setOpen(!open), "aria-haspopup": "listbox", "aria-expanded": open, "aria-label": "Selecionar idioma", children: [languageOptions.find((lang) => lang.code === selected)?.icon || null, jsx("span", { className: "sr-only", children: selected })] }), open && (jsx("div", { className: clsx('absolute right-0 mt-2 w-40 rounded-md p-2 z-40 shadow-container bg-light-500 dark:text-light-500 dark:bg-dark-100 dark:border dark:border-dark-500 dark:shadow-dark-400'), role: "listbox", children: jsx("ul", { children: languageOptions.map((option) => (jsxs("li", { className: clsx('p-2 cursor-pointer rounded hover:bg-light-300 hover:font-bold dark:bg-dark-100 dark:text-light-500 dark:hover:bg-dark-400 mt-1', option.code === selected &&
746
746
  'font-bold bg-light-300 dark:bg-dark-400'), role: "option", "aria-selected": option.code === selected, tabIndex: 0, onClick: () => {
747
747
  onChange(option);
748
748
  setOpen(false);