@wellingtonhlc/shared-ui 0.24.3 → 0.24.5

package/README.md

@@ -64,6 +64,33 @@ Nao inclua:
 | `npm run storybook` | Sobe o Storybook local. |
 | `npm run build-storybook` | Gera build estatico do Storybook. |
 
+## Validadores para consumidores
+
+O pacote publica o CLI `shared-ui-check-page-actions` para validar o contrato de actions em projetos consumidores.
+
+Contrato esperado:
+
+- `AppLayout.actions` e somente o slot de layout.
+- `Page.Actions` e o root visual da barra.
+- Props como `helpContent`, `helpLabel`, `position`, `align` e `size` pertencem ao `Page.Actions`.
+- Nao usar `ActionBar.*`, `Page.Root actions=...` dentro de `AppLayout`, Fragment, `div` ou `Page.ActionButton` solto como root de `AppLayout.actions`.
+
+Uso recomendado no consumidor:
+
+```json
+{
+  "scripts": {
+    "check:page-actions": "shared-ui-check-page-actions"
+  }
+}
+```
+
+Tambem e possivel apontar um diretorio explicitamente:
+
+```bash
+shared-ui-check-page-actions ./src
+```
+
 ## Storybook
 
 O Storybook esta na linha `10.4.6` (`storybook`, `@storybook/react-vite`, `@storybook/addon-docs` e `@storybook/addon-a11y`).

package/dist/cli/check-page-actions.d.ts

@@ -0,0 +1,9 @@
+#!/usr/bin/env node
+export interface PageActionsCheckResult {
+    errors: string[];
+    scannedFiles: number;
+    sourceRoot: string;
+}
+export declare function checkPageActionsContract(rootDir?: string): PageActionsCheckResult;
+export declare function runPageActionsContractCli(args?: string[]): PageActionsCheckResult;
+//# sourceMappingURL=check-page-actions.d.ts.map

package/dist/cli/check-page-actions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"check-page-actions.d.ts","sourceRoot":"","sources":["../../src/cli/check-page-actions.ts"],"names":[],"mappings":";AAQA,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;CACpB;AAqCD,wBAAgB,wBAAwB,CAAC,OAAO,SAAgB,GAAG,sBAAsB,CAyDxF;AAED,wBAAgB,yBAAyB,CAAC,IAAI,WAAwB,0BAerE"}

package/dist/cli/check-page-actions.js

@@ -0,0 +1,66 @@
+#!/usr/bin/env node
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+const extensions = new Set(['.ts', '.tsx']);
+const ignoredDirectories = new Set(['node_modules', 'dist', 'build', 'coverage']);
+function normalizePath(root, filePath) {
+    return path.relative(root, filePath).split(path.sep).join('/');
+}
+function* walk(directory) {
+    if (!fs.existsSync(directory))
+        return;
+    for (const entry of fs.readdirSync(directory, { withFileTypes: true })) {
+        if (ignoredDirectories.has(entry.name))
+            continue;
+        const fullPath = path.join(directory, entry.name);
+        if (entry.isDirectory()) {
+            yield* walk(fullPath);
+            continue;
+        }
+        if (extensions.has(path.extname(entry.name))) {
+            yield fullPath;
+        }
+    }
+}
+function collectMatches(text, pattern, message, root, filePath, errors) {
+    for (const match of text.matchAll(pattern)) {
+        const before = text.slice(0, match.index);
+        const line = before.split(/\r?\n/).length;
+        errors.push(`${normalizePath(root, filePath)}:${line}: ${message}`);
+    }
+}
+export function checkPageActionsContract(rootDir = process.cwd()) {
+    const root = path.resolve(rootDir);
+    const sourceRoot = fs.existsSync(path.join(root, 'src')) ? path.join(root, 'src') : root;
+    const errors = [];
+    let scannedFiles = 0;
+    for (const filePath of walk(sourceRoot)) {
+        scannedFiles += 1;
+        const text = fs.readFileSync(filePath, 'utf8');
+        collectMatches(text, /ActionBar\./g, 'use Page.Actions, Page.ActionButton e Page.ActionsSeparator no lugar de ActionBar.*', root, filePath, errors);
+        collectMatches(text, /<Page\.Root\b[^>]*\bactions\s*=/gs, 'nao aninhe Page.Root actions dentro de AppLayout; use AppLayout.actions com Page.Actions', root, filePath, errors);
+        collectMatches(text, /<AppLayout\b[\s\S]*?\bactions\s*=\s*{\s*<>/g, 'AppLayout.actions nao deve receber Fragment como root; use Page.Actions ou componente *Actions', root, filePath, errors);
+        collectMatches(text, /<AppLayout\b[\s\S]*?\bactions\s*=\s*{\s*<div\b/g, 'AppLayout.actions nao deve receber div como root; use Page.Actions ou componente *Actions', root, filePath, errors);
+        collectMatches(text, /<AppLayout\b[\s\S]*?\bactions\s*=\s*{\s*<Page\.ActionButton\b/g, 'AppLayout.actions nao deve receber Page.ActionButton solto; envolva em Page.Actions', root, filePath, errors);
+    }
+    return { errors, scannedFiles, sourceRoot };
+}
+export function runPageActionsContractCli(args = process.argv.slice(2)) {
+    const rootDir = args[0] ?? process.cwd();
+    const result = checkPageActionsContract(rootDir);
+    if (result.errors.length > 0) {
+        console.error('Falha na verificacao de Page Actions:');
+        for (const error of result.errors)
+            console.error('- ' + error);
+        process.exitCode = 1;
+        return result;
+    }
+    console.log(`Page Actions OK: ${result.scannedFiles} arquivo(s) verificado(s); AppLayout.actions usa Page.Actions direta ou indiretamente.`);
+    return result;
+}
+const currentFilePath = fileURLToPath(import.meta.url);
+const entryFilePath = process.argv[1] ? path.resolve(process.argv[1]) : '';
+if (entryFilePath === currentFilePath) {
+    runPageActionsContractCli();
+}

package/dist/components/Page.d.ts

@@ -9,11 +9,21 @@ export interface PageActionsProps {
     position?: PageActionsPosition;
     align?: PageActionsAlign;
     size?: PageActionsSize;
+    helpContent?: ReactNode;
+    helpLabel?: string;
+    helpClassName?: string;
 }
 export type PageActionsElement = ReactElement<PageActionsProps, typeof Actions>;
 export type PageActionsSeparatorProps = ActionSeparatorPrimitiveProps;
 export type PageActionButtonProps = ActionButtonPrimitiveProps;
-declare function Actions({ align, children, className, position, size }: PageActionsProps): import("react").JSX.Element;
+export interface PageActionsHelpContentProps {
+    children?: ReactNode;
+    className?: string;
+    items?: ReactNode[];
+    title?: ReactNode;
+}
+declare function ActionsHelpContent({ children, className, items, title }: PageActionsHelpContentProps): import("react").JSX.Element;
+declare function Actions({ align, children, className, helpClassName, helpContent, helpLabel, position, size, }: PageActionsProps): import("react").JSX.Element;
 declare function ActionsSeparator(props: PageActionsSeparatorProps): import("react").JSX.Element;
 interface PageRootProps extends HTMLAttributes<HTMLElement> {
     children: ReactNode;
@@ -46,6 +56,7 @@ export declare const Page: {
     Title: typeof Title;
     Description: typeof Description;
     Actions: typeof Actions;
+    ActionsHelpContent: typeof ActionsHelpContent;
     ActionButton: import("react").ForwardRefExoticComponent<ActionButtonPrimitiveProps & import("react").RefAttributes<HTMLButtonElement>>;
     ActionsSeparator: typeof ActionsSeparator;
     ActionsProvider: typeof ActionsProvider;

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

@@ -1 +1 @@
-{"version":3,"file":"Page.d.ts","sourceRoot":"","sources":["../../src/components/Page.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAIL,KAAK,0BAA0B,EAC/B,KAAK,gBAAgB,EACrB,KAAK,eAAe,EACpB,KAAK,6BAA6B,EACnC,MAAM,oBAAoB,CAAC;AAG5B,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AACtE,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,CAAC;AAChD,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC;AAE9C,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB;AAED,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC,gBAAgB,EAAE,OAAO,OAAO,CAAC,CAAC;AAChF,MAAM,MAAM,yBAAyB,GAAG,6BAA6B,CAAC;AACtE,MAAM,MAAM,qBAAqB,GAAG,0BAA0B,CAAC;AAS/D,iBAAS,OAAO,CAAC,EAAE,KAAe,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAgB,EAAE,IAAW,EAAE,EAAE,gBAAgB,+BAsBzG;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,yBAAyB,+BAEzD;AAID,UAAU,aAAc,SAAQ,cAAc,CAAC,WAAW,CAAC;IACzD,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED,iBAAS,IAAI,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,+BA+CtE;AAED,UAAU,wBAAwB;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,iBAAS,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,wBAAwB,+BAK9D;AAED,UAAU,oBAAoB;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,mBAAmB,CAAC;CAC/B;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,oBAAoB,sCAmBjE;AAED,UAAU,eAAe;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,kBAAkB,CAAC,CAAC;AAChE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,oBAAoB,CAAC,CAAC;AAExE,iBAAS,KAAK,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,+BAM/D;AAED,iBAAS,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,+BAM3E;AAED,iBAAS,MAAM,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,eAAe,+BAexE;AAED,eAAO,MAAM,IAAI;;;;;;;;;;CAUhB,CAAC"}
+{"version":3,"file":"Page.d.ts","sourceRoot":"","sources":["../../src/components/Page.tsx"],"names":[],"mappings":"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"}

package/dist/components/Page.js

@@ -1,9 +1,26 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createContext, useContext, useLayoutEffect, useMemo, useState, } from 'react';
+import { CircleHelpIcon } from 'lucide-react';
 import { ActionButtonPrimitive, ActionGroupPrimitive, ActionSeparatorPrimitive, } from './ActionPrimitives';
+import { Tooltip } from './Tooltip';
 import { cn } from '../utils/cn';
 const PageActionsContext = createContext(null);
-function Actions({ align = 'start', children, className, position = 'top', size = 'md' }) {
+function ActionsHelpContent({ children, className, items, title }) {
+    return (_jsxs("div", { className: cn('max-w-[22rem] space-y-2 text-xs leading-5 [overflow-wrap:anywhere]', className), children: [title && _jsx("p", { className: "font-semibold text-foreground", children: title }), children && _jsx("div", { className: "text-foreground-muted", children: children }), items?.length ? (_jsx("ul", { className: "list-disc space-y-1 pl-4 text-foreground-muted", children: items.map((item, index) => (_jsx("li", { children: item }, index))) })) : null] }));
+}
+function getHelpSide(position) {
+    const sideByPosition = {
+        top: 'bottom',
+        bottom: 'top',
+        left: 'right',
+        right: 'left',
+    };
+    return sideByPosition[position];
+}
+function hasHelpContent(helpContent) {
+    return helpContent !== null && helpContent !== undefined && helpContent !== false && helpContent !== '';
+}
+function Actions({ align = 'start', children, className, helpClassName, helpContent, helpLabel = 'Ajuda da tela', position = 'top', size = 'md', }) {
     const positionClasses = {
         top: 'w-full max-w-full self-stretch border-b border-app-border bg-background-secondary p-1',
         bottom: 'w-full border-t border-app-border bg-background-secondary p-1',
@@ -14,6 +31,13 @@ function Actions({ align = 'start', children, className, position = 'top', size
         start: position === 'left' || position === 'right' ? 'justify-start' : 'justify-start',
         end: position === 'left' || position === 'right' ? 'justify-end' : 'ml-auto justify-end self-end',
     };
+    const helpVisible = hasHelpContent(helpContent);
+    if (helpVisible) {
+        const isVertical = position === 'left' || position === 'right';
+        const actions = (_jsx(ActionGroupPrimitive, { align: align, size: size, className: cn('min-w-0', isVertical ? 'w-full flex-col items-stretch' : 'min-w-0 flex-1 overflow-x-auto overflow-y-hidden', alignClasses[align]), children: children }));
+        const helpButton = (_jsx("div", { className: cn('flex shrink-0', isVertical && 'mt-auto w-full justify-center pt-2', !isVertical && align === 'start' && 'ml-auto pl-2', !isVertical && align === 'end' && 'mr-auto pr-2'), children: _jsx(Tooltip, { className: cn('max-w-[22rem] px-3 py-2', helpClassName), content: helpContent, delayDuration: 120, openOnClick: true, side: getHelpSide(position), children: _jsx(ActionButtonPrimitive, { "aria-label": helpLabel, icon: _jsx(CircleHelpIcon, { "aria-hidden": "true" }), tooltip: helpLabel }) }) }));
+        return (_jsxs("div", { className: cn('flex min-w-0', positionClasses[position], isVertical ? 'flex-col' : 'items-center', className), children: [align === 'end' && !isVertical ? helpButton : null, actions, align === 'start' || isVertical ? helpButton : null] }));
+    }
     return (_jsx(ActionGroupPrimitive, { align: align, size: size, className: cn('min-w-0', positionClasses[position], alignClasses[align], className), children: children }));
 }
 function ActionsSeparator(props) {
@@ -74,6 +98,7 @@ export const Page = {
     Title,
     Description,
     Actions,
+    ActionsHelpContent,
     ActionButton,
     ActionsSeparator,
     ActionsProvider,

package/dist/components/Tooltip.d.ts

@@ -5,8 +5,9 @@ export interface TooltipProps {
     className?: string;
     content: ReactNode;
     delayDuration?: number;
+    openOnClick?: boolean;
     side?: TooltipSide;
     sideOffset?: number;
 }
-export declare function Tooltip({ children, className, content, delayDuration, side, sideOffset, }: TooltipProps): React.JSX.Element;
+export declare function Tooltip({ children, className, content, delayDuration, openOnClick, side, sideOffset, }: TooltipProps): React.JSX.Element;
 //# sourceMappingURL=Tooltip.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAK9C,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,OAAO,EACP,aAAmB,EACnB,IAAe,EACf,UAAc,GACf,EAAE,YAAY,qBAsBd"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAK3E,MAAM,MAAM,WAAW,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,YAAY;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,OAAO,EACP,aAAmB,EACnB,WAAmB,EACnB,IAAe,EACf,UAAc,GACf,EAAE,YAAY,qBA+Dd"}

package/dist/components/Tooltip.js

@@ -1,6 +1,40 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { cn } from '../utils/cn';
-export function Tooltip({ children, className, content, delayDuration = 300, side = 'bottom', sideOffset = 6, }) {
-    return (_jsx(TooltipPrimitive.Provider, { delayDuration: delayDuration, children: _jsxs(TooltipPrimitive.Root, { children: [_jsx(TooltipPrimitive.Trigger, { asChild: true, children: children }), _jsx(TooltipPrimitive.Portal, { children: _jsxs(TooltipPrimitive.Content, { className: cn('border-app-border bg-surface text-foreground z-50 rounded-md border px-3 py-1.5 text-xs shadow-lg', 'data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0', className), side: side, sideOffset: sideOffset, children: [content, _jsx(TooltipPrimitive.Arrow, { className: "fill-surface" })] }) })] }) }));
+export function Tooltip({ children, className, content, delayDuration = 300, openOnClick = false, side = 'bottom', sideOffset = 6, }) {
+    const [open, setOpen] = useState(false);
+    const triggerRef = useRef(null);
+    const contentRef = useRef(null);
+    useEffect(() => {
+        if (!openOnClick || !open)
+            return undefined;
+        function handlePointerDown(event) {
+            const target = event.target;
+            if (!target)
+                return;
+            if (triggerRef.current?.contains(target) || contentRef.current?.contains(target))
+                return;
+            setOpen(false);
+        }
+        function handleKeyDown(event) {
+            if (event.key === 'Escape')
+                setOpen(false);
+        }
+        document.addEventListener('pointerdown', handlePointerDown);
+        document.addEventListener('keydown', handleKeyDown);
+        return () => {
+            document.removeEventListener('pointerdown', handlePointerDown);
+            document.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [open, openOnClick]);
+    function handleOpenChange(nextOpen) {
+        setOpen(nextOpen);
+    }
+    function handleTriggerClick() {
+        if (!openOnClick)
+            return;
+        setOpen((current) => !current);
+    }
+    return (_jsx(TooltipPrimitive.Provider, { delayDuration: delayDuration, children: _jsxs(TooltipPrimitive.Root, { open: openOnClick ? open : undefined, onOpenChange: openOnClick ? handleOpenChange : undefined, children: [_jsx(TooltipPrimitive.Trigger, { asChild: true, ref: triggerRef, onClick: handleTriggerClick, children: children }), _jsx(TooltipPrimitive.Portal, { children: _jsxs(TooltipPrimitive.Content, { ref: contentRef, className: cn('border-app-border bg-surface text-foreground z-50 rounded-md border px-3 py-1.5 text-xs shadow-lg', 'data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0', className), side: side, sideOffset: sideOffset, children: [content, _jsx(TooltipPrimitive.Arrow, { className: "fill-surface" })] }) })] }) }));
 }

package/dist/index.d.ts

@@ -23,7 +23,7 @@ export { TextareaField, type TextareaFieldProps } from './components/TextareaFie
 export { DateField, type DateFieldProps } from './components/DateField';
 export { DecimalField, type DecimalFieldProps } from './components/DecimalField';
 export { Pagination, type PaginationProps, type PaginationSize } from './components/Pagination';
-export { Page, type PageActionButtonProps, type PageActionsAlign, type PageActionsElement, type PageActionsPosition, type PageActionsProps, type PageActionsSeparatorProps, type PageActionsSize, type PageDescriptionProps, type PageTitleProps, } from './components/Page';
+export { Page, type PageActionButtonProps, type PageActionsAlign, type PageActionsElement, type PageActionsHelpContentProps, type PageActionsPosition, type PageActionsProps, type PageActionsSeparatorProps, type PageActionsSize, type PageDescriptionProps, type PageTitleProps, } from './components/Page';
 export { PageMessage, type PageMessageProps, type PageMessageVariant } from './components/PageMessage';
 export { PasswordInput, type PasswordInputProps } from './components/PasswordInput';
 export { Filter, type FilterFooterProps, type FilterRootProps } from './components/Filter';

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/styles.css

@@ -990,6 +990,9 @@ h2.react-datepicker__current-month {
   .mt-3 {
     margin-top: calc(var(--spacing) * 3);
   }
+  .mt-auto {
+    margin-top: auto;
+  }
   .mt-px {
     margin-top: 1px;
   }
@@ -1147,6 +1150,9 @@ h2.react-datepicker__current-month {
   .h-72 {
     height: calc(var(--spacing) * 72);
   }
+  .h-80 {
+    height: calc(var(--spacing) * 80);
+  }
   .h-96 {
     height: calc(var(--spacing) * 96);
   }
@@ -1336,6 +1342,9 @@ h2.react-datepicker__current-month {
   .max-w-40 {
     max-width: calc(var(--spacing) * 40);
   }
+  .max-w-\[22rem\] {
+    max-width: 22rem;
+  }
   .max-w-\[120px\] {
     max-width: 120px;
   }
@@ -1460,6 +1469,9 @@ h2.react-datepicker__current-month {
   .cursor-wait {
     cursor: wait;
   }
+  .list-disc {
+    list-style-type: disc;
+  }
   .appearance-none {
     appearance: none;
   }
@@ -2017,6 +2029,9 @@ h2.react-datepicker__current-month {
   .pr-1 {
     padding-right: calc(var(--spacing) * 1);
   }
+  .pr-2 {
+    padding-right: calc(var(--spacing) * 2);
+  }
   .pr-4 {
     padding-right: calc(var(--spacing) * 4);
   }
@@ -2038,6 +2053,12 @@ h2.react-datepicker__current-month {
   .pb-4 {
     padding-bottom: calc(var(--spacing) * 4);
   }
+  .pl-2 {
+    padding-left: calc(var(--spacing) * 2);
+  }
+  .pl-4 {
+    padding-left: calc(var(--spacing) * 4);
+  }
   .pl-8 {
     padding-left: calc(var(--spacing) * 8);
   }

package/package.json

@@ -1,10 +1,13 @@
 {
     "name": "@wellingtonhlc/shared-ui",
-    "version": "0.24.3",
+    "version": "0.24.5",
     "private": false,
     "type": "module",
     "main": "./dist/index.js",
     "types": "./dist/index.d.ts",
+    "bin": {
+        "shared-ui-check-page-actions": "dist/cli/check-page-actions.js"
+    },
     "files": [
         "dist",
         "README.md"
@@ -41,8 +44,8 @@
         "typecheck": "tsc -p tsconfig.json --noEmit",
         "test": "vitest run",
         "test:watch": "vitest",
-        "check:storybook-static": "node scripts/check-storybook-static.mjs",
-        "check": "npm run typecheck && npm run test && npm run build && npm run build-storybook && npm run check:storybook-static && npm pack --dry-run",
+        "check:storybook-static": "node scripts/check-storybook-static.mjs",
+        "check": "npm run typecheck && npm run test && npm run build && npm run build-storybook && npm run check:storybook-static && npm pack --dry-run",
         "storybook": "storybook dev -p 6006",
         "build-storybook": "storybook build"
     },
@@ -58,6 +61,7 @@
         "@testing-library/jest-dom": "^6.9.1",
         "@testing-library/react": "^16.3.2",
         "@testing-library/user-event": "^14.6.1",
+        "@types/node": "^26.0.0",
         "@types/react": "^19.1.2",
         "@types/react-dom": "^19.1.2",
         "autoprefixer": "^10.5.0",