@wellingtonhlc/shared-ui 0.30.0 → 0.30.1

package/README.md

@@ -208,6 +208,7 @@ Componentes disponiveis na API publica:
 | Layout | `AppShell`, `Page`, `Sidebar`, `Card`, `StatCard` |
 | Acoes | `Button`, `ActionPrimitives`, `AppShellActions`, `ConfirmationDialog` |
 | Feedback | `Badge`, `EmptyState`, `PageMessage`, `Tooltip`, `CopyableField`, `NotificationCard` |
+| Identidade | `Avatar` |
 | Formularios | `FieldControl`, `FieldGroup`, `TextField`, `TextareaField`, `SelectField`, `SelectionField`, `DateField`, `DecimalField`, `MultiSelectField`, `PasswordInput`, `Switch`, `RadioGroup` |
 | Consulta | `Filter`, `Workspace` |
 | Dados | `Table`, `Pagination`, `TabsUnderlined` |
@@ -261,7 +262,7 @@ import { RadioGroup } from '@wellingtonhlc/shared-ui';
 </RadioGroup>;
 ```
 
-## AppShell.Topbar.Button
+## AppShell.Topbar.Button
 
 Use `AppShell.Topbar.Button` para acoes de icone na barra superior, como notificacoes,
 configuracoes e atalhos globais. O componente reutiliza o mesmo contrato visual dos
@@ -277,6 +278,19 @@ import { Bell, Settings } from 'lucide-react';
 </AppShell.Actions>
 ```
 
+`AppShell.Topbar.Button` usa 32 px por padrão, a mesma escala do `Avatar size="md"`.
+
+## Avatar
+
+`Avatar` exibe uma imagem ou as iniciais acessíveis do nome informado. As cores do fallback
+usam `--avatar-background` e `--avatar-foreground`, com contraste mais escuro no tema dark.
+
+```tsx
+import { Avatar } from '@wellingtonhlc/shared-ui/components/Avatar';
+
+<Avatar name="Wellington Silva" src={avatarUrl} />
+```
+
 ## Sidebar
 
 Use `Sidebar.ActionButton`, `Sidebar.SubActionButton` e `Sidebar.NavGroup` para navegação.

package/dist/components/AppShell.js

@@ -24,7 +24,7 @@ const ContentColumn = forwardRef(({ children, className }, ref) => (_jsx("div",
 ContentColumn.displayName = 'AppShell.ContentColumn';
 const WorkArea = forwardRef(({ children, className }, ref) => (_jsx("div", { ref: ref, className: cn('flex min-h-0 min-w-0 flex-1 flex-col-reverse overflow-hidden md:flex-col', className), children: children })));
 WorkArea.displayName = 'AppShell.WorkArea';
-const TopbarButton = forwardRef(({ className, ...props }, ref) => (_jsx(AppShellActionButton, { ref: ref, className: cn('relative size-10 min-h-10 min-w-10 !rounded-full', className), ...props })));
+const TopbarButton = forwardRef(({ className, ...props }, ref) => (_jsx(AppShellActionButton, { ref: ref, className: cn('relative size-8 min-h-8 min-w-8 !rounded-full', className), ...props })));
 TopbarButton.displayName = 'AppShell.Topbar.Button';
 const TopbarRoot = forwardRef(({ actions, actionsClassName, children, className, icon, mobileToggle, pageTitle, titleContainerClassName, }, ref) => (_jsxs("header", { ref: ref, className: cn('border-app-border bg-[var(--topbar-background)] flex min-h-16 items-center justify-between border-b px-4 pr-4 shadow-[var(--shadow-topbar)] max-md:pl-0', className), role: "banner", children: [_jsxs("div", { className: cn('flex min-w-0 items-center gap-2.5 max-md:gap-3', titleContainerClassName), children: [mobileToggle, icon && _jsx("span", { className: "shrink-0 text-foreground-muted", "aria-hidden": "true", children: icon }), _jsx("span", { className: "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-lg font-semibold leading-7 tracking-[var(--letter-spacing-title)] text-foreground-muted", children: pageTitle })] }), (children || actions) && (_jsxs("div", { className: cn('flex shrink-0 items-center gap-4', actionsClassName), children: [children, actions] }))] })));
 TopbarRoot.displayName = 'AppShell.Topbar';

package/dist/components/Avatar.d.ts

@@ -0,0 +1,9 @@
+import type { HTMLAttributes } from 'react';
+export type AvatarSize = 'sm' | 'md' | 'lg';
+export interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
+    name: string;
+    size?: AvatarSize;
+    src?: string | null;
+}
+export declare function Avatar({ className, name, size, src, ...props }: AvatarProps): import("react").JSX.Element;
+//# sourceMappingURL=Avatar.d.ts.map

package/dist/components/Avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/components/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,eAAe,CAAC;IAClE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrB;AAiBD,wBAAgB,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAW,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,+BAoBlF"}

package/dist/components/Avatar.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../utils/cn';
+const sizeClasses = {
+    sm: 'size-7 text-xs',
+    md: 'size-8 text-sm',
+    lg: 'size-10 text-sm',
+};
+function getInitials(name) {
+    const parts = name.trim().split(/\s+/).filter(Boolean);
+    if (parts.length === 0)
+        return '?';
+    if (parts.length === 1)
+        return parts[0].charAt(0).toUpperCase();
+    return `${parts[0].charAt(0)}${parts[parts.length - 1].charAt(0)}`.toUpperCase();
+}
+export function Avatar({ className, name, size = 'md', src, ...props }) {
+    const classes = cn('inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full bg-[var(--avatar-background)] font-semibold text-[var(--avatar-foreground)] select-none', sizeClasses[size], className);
+    if (src) {
+        return (_jsx("span", { className: classes, ...props, children: _jsx("img", { className: "size-full object-cover", src: src, alt: name }) }));
+    }
+    return (_jsx("span", { className: classes, role: "img", "aria-label": name, ...props, children: getInitials(name) }));
+}

package/dist/components/ConfirmationDialog.js

@@ -26,8 +26,8 @@ const dialogVariantStyles = {
     },
     destructive: {
         icon: AlertCircleIcon,
-        iconClassName: 'text-[var(--status-danger-icon)]',
-        titleClassName: 'text-[var(--status-danger-text)]',
+        iconClassName: 'text-[var(--destructive)]',
+        titleClassName: 'text-[var(--destructive)]',
     },
 };
 const buttonVariantDefaults = {

package/dist/components/Table.js

@@ -86,8 +86,8 @@ const ActionCell = forwardRef(({ children, className, style, ...props }, ref) =>
     }, ...props, children: _jsx("div", { className: "flex min-h-7 items-center justify-center", children: children }) })));
 ActionCell.displayName = 'Table.ActionCell';
 /**
- * Os tons usam os tokens semanticos de icone, que preservam saturacao e contraste
- * nos temas claro e escuro sem repetir hexadecimais no componente.
+ * Success usa o token de status. Danger representa uma acao destrutiva e usa o
+ * token forte `--destructive`, sem herdar o rosa dos status sobre fundo escuro.
  *
  * `!` obrigatorio: o cn do pacote nao usa tailwind-merge, entao sem ele o
  * `text-foreground-muted`/`hover:bg` do ghost venceria pela ordem do CSS.
@@ -95,7 +95,7 @@ ActionCell.displayName = 'Table.ActionCell';
 const actionToneClasses = {
     default: '',
     success: 'text-[var(--status-success-icon)]! hover:bg-[color-mix(in_srgb,var(--status-success-icon)_10%,transparent)]! hover:text-[var(--status-success-icon)]! dark:hover:bg-[color-mix(in_srgb,var(--status-success-icon)_16%,transparent)]!',
-    danger: 'text-[var(--status-danger-icon)]! hover:bg-[color-mix(in_srgb,var(--status-danger-icon)_10%,transparent)]! hover:text-[var(--status-danger-icon)]! dark:hover:bg-[color-mix(in_srgb,var(--status-danger-icon)_16%,transparent)]!',
+    danger: 'text-[var(--destructive)]! hover:bg-[color-mix(in_srgb,var(--destructive)_10%,transparent)]! hover:text-[var(--destructive)]! dark:hover:bg-[color-mix(in_srgb,var(--destructive)_16%,transparent)]!',
 };
 const Action = forwardRef(({ className, size = 'xs', tone = 'default', tooltip, ...props }, ref) => (
 // `props` vem primeiro: o corpo (variant/size/className) e do Table.Action, e nao

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export { cn } from './utils/cn';
 export { AppShell, type AppShellContentMode, type AppShellMainProps, type AppShellOverlayProps, type AppShellOverlayVariant, type AppShellTopbarButtonProps, type AppShellTopbarProps, } from './components/AppShell';
 export { AppShellActionButton, AppShellActions, AppShellActionsSeparator, type AppShellActionButtonProps, type AppShellActionButtonVariant, type AppShellActionsAlign, type AppShellActionsProps, type AppShellActionsRegion, type AppShellActionsSeparatorProps, } from './components/AppShellActions';
 export { Badge, type BadgeProps, type BadgeVariant } from './components/Badge';
+export { Avatar, type AvatarProps, type AvatarSize } from './components/Avatar';
 export { Banner, type BannerProps, type BannerSize, type BannerVariant } from './components/Banner';
 export { Button, type ButtonProps, type ButtonSize, type ButtonVariant } from './components/Button';
 export { Loading, type LoadingProps, type LoadingSize } from './components/Loading';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -2,6 +2,7 @@ export { cn } from './utils/cn';
 export { AppShell, } from './components/AppShell';
 export { AppShellActionButton, AppShellActions, AppShellActionsSeparator, } from './components/AppShellActions';
 export { Badge } from './components/Badge';
+export { Avatar } from './components/Avatar';
 export { Banner } from './components/Banner';
 export { Button } from './components/Button';
 export { Loading } from './components/Loading';

package/dist/styles.css

@@ -1159,6 +1159,10 @@ h2.react-datepicker__current-month {
     width: calc(var(--spacing) * 14);
     height: calc(var(--spacing) * 14);
   }
+  .size-full {
+    width: 100%;
+    height: 100%;
+  }
   .\!h-4 {
     height: calc(var(--spacing) * 4) !important;
   }
@@ -2086,6 +2090,9 @@ h2.react-datepicker__current-month {
       background-color: color-mix(in srgb,var(--foreground-muted) 18%,var(--surface));
     }
   }
+  .bg-\[var\(--avatar-background\)\] {
+    background-color: var(--avatar-background);
+  }
   .bg-\[var\(--brand\)\] {
     background-color: var(--brand);
   }
@@ -2200,6 +2207,9 @@ h2.react-datepicker__current-month {
   .fill-surface {
     fill: var(--color-surface);
   }
+  .object-cover {
+    object-fit: cover;
+  }
   .\!p-0 {
     padding: calc(var(--spacing) * 0) !important;
   }
@@ -2580,9 +2590,18 @@ h2.react-datepicker__current-month {
       color: color-mix(in srgb,var(--destructive) 86%,var(--foreground));
     }
   }
+  .text-\[var\(--avatar-foreground\)\] {
+    color: var(--avatar-foreground);
+  }
   .text-\[var\(--brand\)\] {
     color: var(--brand);
   }
+  .text-\[var\(--destructive\)\] {
+    color: var(--destructive);
+  }
+  .text-\[var\(--destructive\)\]\! {
+    color: var(--destructive) !important;
+  }
   .text-\[var\(--on-solid\)\] {
     color: var(--on-solid);
   }
@@ -2592,9 +2611,6 @@ h2.react-datepicker__current-month {
   .text-\[var\(--status-danger-icon\)\] {
     color: var(--status-danger-icon);
   }
-  .text-\[var\(--status-danger-icon\)\]\! {
-    color: var(--status-danger-icon) !important;
-  }
   .text-\[var\(--status-danger-text\)\] {
     color: var(--status-danger-text);
   }
@@ -3186,32 +3202,32 @@ h2.react-datepicker__current-month {
       }
     }
   }
-  .hover\:bg-\[color-mix\(in_srgb\,var\(--foreground-muted\)_8\%\,var\(--tabs-background\)\)\] {
+  .hover\:bg-\[color-mix\(in_srgb\,var\(--destructive\)_10\%\,transparent\)\]\! {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--foreground-muted);
+        background-color: var(--destructive) !important;
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in srgb,var(--foreground-muted) 8%,var(--tabs-background));
+          background-color: color-mix(in srgb,var(--destructive) 10%,transparent) !important;
         }
       }
     }
   }
-  .hover\:bg-\[color-mix\(in_srgb\,var\(--status-danger-bg\)_78\%\,var\(--status-danger-border\)\)\] {
+  .hover\:bg-\[color-mix\(in_srgb\,var\(--foreground-muted\)_8\%\,var\(--tabs-background\)\)\] {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--status-danger-bg);
+        background-color: var(--foreground-muted);
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in srgb,var(--status-danger-bg) 78%,var(--status-danger-border));
+          background-color: color-mix(in srgb,var(--foreground-muted) 8%,var(--tabs-background));
         }
       }
     }
   }
-  .hover\:bg-\[color-mix\(in_srgb\,var\(--status-danger-icon\)_10\%\,transparent\)\]\! {
+  .hover\:bg-\[color-mix\(in_srgb\,var\(--status-danger-bg\)_78\%\,var\(--status-danger-border\)\)\] {
     &:hover {
       @media (hover: hover) {
-        background-color: var(--status-danger-icon) !important;
+        background-color: var(--status-danger-bg);
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in srgb,var(--status-danger-icon) 10%,transparent) !important;
+          background-color: color-mix(in srgb,var(--status-danger-bg) 78%,var(--status-danger-border));
         }
       }
     }
@@ -3385,17 +3401,17 @@ h2.react-datepicker__current-month {
       }
     }
   }
-  .hover\:text-\[var\(--on-solid\)\] {
+  .hover\:text-\[var\(--destructive\)\]\! {
     &:hover {
       @media (hover: hover) {
-        color: var(--on-solid);
+        color: var(--destructive) !important;
       }
     }
   }
-  .hover\:text-\[var\(--status-danger-icon\)\]\! {
+  .hover\:text-\[var\(--on-solid\)\] {
     &:hover {
       @media (hover: hover) {
-        color: var(--status-danger-icon) !important;
+        color: var(--on-solid);
       }
     }
   }
@@ -4121,13 +4137,13 @@ h2.react-datepicker__current-month {
       }
     }
   }
-  .dark\:hover\:bg-\[color-mix\(in_srgb\,var\(--status-danger-icon\)_16\%\,transparent\)\]\! {
+  .dark\:hover\:bg-\[color-mix\(in_srgb\,var\(--destructive\)_16\%\,transparent\)\]\! {
     @media (prefers-color-scheme: dark) {
       &:hover {
         @media (hover: hover) {
-          background-color: var(--status-danger-icon) !important;
+          background-color: var(--destructive) !important;
           @supports (color: color-mix(in lab, red, red)) {
-            background-color: color-mix(in srgb,var(--status-danger-icon) 16%,transparent) !important;
+            background-color: color-mix(in srgb,var(--destructive) 16%,transparent) !important;
           }
         }
       }
@@ -4606,6 +4622,11 @@ h2.react-datepicker__current-month {
   @supports (color: color-mix(in lab, red, red)) {
     --brand-surface-active: color-mix(in srgb, var(--brand) 16%, transparent);
   }
+  --avatar-background: var(--brand);
+  @supports (color: color-mix(in lab, red, red)) {
+    --avatar-background: color-mix(in srgb, var(--brand) 88%, #000);
+  }
+  --avatar-foreground: var(--on-solid);
   --contrast-hover: color-mix(in srgb, #000 10%, transparent);
   --sidebar-background: var(--surface);
   --sidebar-flyout-background: var(--surface);
@@ -4722,6 +4743,10 @@ h2.react-datepicker__current-month {
   @supports (color: color-mix(in lab, red, red)) {
     --brand-surface-active: color-mix(in srgb, var(--brand) 21%, transparent);
   }
+  --avatar-background: var(--brand);
+  @supports (color: color-mix(in lab, red, red)) {
+    --avatar-background: color-mix(in srgb, var(--brand) 42%, #000);
+  }
   --contrast-hover: var(--on-solid);
   @supports (color: color-mix(in lab, red, red)) {
     --contrast-hover: color-mix(in srgb, var(--on-solid) 10%, transparent);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wellingtonhlc/shared-ui",
-    "version": "0.30.0",
+    "version": "0.30.1",
     "private": false,
     "type": "module",
     "packageManager": "npm@11.12.1",
@@ -49,6 +49,7 @@
         "prepare": "npm run setup:hooks",
         "build": "node scripts/clean-dist.mjs && tsc -p tsconfig.json && node scripts/copy-assets.mjs",
         "prepack": "npm run build",
+        "prepublishOnly": "node scripts/validate-release.mjs --require-tag",
         "typecheck": "tsc -p tsconfig.json --noEmit",
         "test": "vitest run",
         "test:watch": "vitest",