@wellingtonhlc/shared-ui 0.29.1 → 0.29.4

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

@@ -1 +1 @@
-{"version":3,"file":"DismissiblePopover.d.ts","sourceRoot":"","sources":["../../src/components/DismissiblePopover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIpF,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,OAAO,EACP,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,UAAiB,EACjB,iBAAuB,GACxB,EAAE,uBAAuB,+BA6EzB"}
+{"version":3,"file":"DismissiblePopover.d.ts","sourceRoot":"","sources":["../../src/components/DismissiblePopover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAChD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,OAAO,EACP,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,UAAiB,EACjB,iBAAuB,GACxB,EAAE,uBAAuB,+BA4FzB"}

package/dist/components/DismissiblePopover.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef, useState, } from 'react';
 import { cn } from '../utils/cn';
 export function DismissiblePopover({ open, onOpenChange, trigger, content, className, contentClassName, containerRef, closeDelay = 1500, animationDuration = 180, }) {
     const closeTimerRef = useRef(null);
@@ -17,7 +17,7 @@ export function DismissiblePopover({ open, onOpenChange, trigger, content, class
         animationTimerRef.current = window.setTimeout(() => {
             setContentVisible(false);
             animationTimerRef.current = null;
-        }, animationDuration);
+        }, animationDuration + 50);
         return () => {
             if (animationTimerRef.current !== null) {
                 window.clearTimeout(animationTimerRef.current);
@@ -37,6 +37,12 @@ export function DismissiblePopover({ open, onOpenChange, trigger, content, class
             closeTimerRef.current = null;
         }
     }
+    function clearAnimationTimer() {
+        if (animationTimerRef.current !== null) {
+            window.clearTimeout(animationTimerRef.current);
+            animationTimerRef.current = null;
+        }
+    }
     function handleMouseEnter() {
         clearCloseTimer();
     }
@@ -47,5 +53,11 @@ export function DismissiblePopover({ open, onOpenChange, trigger, content, class
             closeTimerRef.current = null;
         }, closeDelay);
     }
-    return (_jsxs("div", { ref: containerRef, className: cn('relative', className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onFocus: handleMouseEnter, children: [trigger, contentVisible ? (_jsx("div", { "data-state": open ? 'open' : 'closed', className: cn('transition-[opacity,transform] ease-out', open ? 'translate-x-0 opacity-100' : 'pointer-events-none translate-x-2 opacity-0', contentClassName), style: { transitionDuration: `${animationDuration}ms` }, children: content })) : null] }));
+    function handleTransitionEnd(event) {
+        if (open || event.currentTarget !== event.target || event.propertyName !== 'opacity')
+            return;
+        clearAnimationTimer();
+        setContentVisible(false);
+    }
+    return (_jsxs("div", { ref: containerRef, className: cn('relative', className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onFocus: handleMouseEnter, children: [trigger, contentVisible ? (_jsx("div", { "data-state": open ? 'open' : 'closed', className: cn('transition-[opacity,transform,translate,scale] ease-out', open ? 'translate-x-0 opacity-100' : 'pointer-events-none translate-x-2 opacity-0', contentClassName), style: { transitionDuration: `${animationDuration}ms` }, onTransitionEnd: handleTransitionEnd, children: content })) : null] }));
 }

package/dist/components/Sidebar.js

@@ -33,7 +33,7 @@ const ActionButton = forwardRef(function SidebarActionButton({ active = false, c
     return (_jsxs("button", { ref: ref, type: type, title: title ? (typeof label === 'string' && !isOpen ? label : undefined) : undefined, "data-open": isOpen, "data-sidebar-active": active ? 'true' : undefined, className: cn(sidebarButtonClasses(active, size, tone), showChevron && isOpen && 'pr-2', className), ...props, children: [_jsx("span", { className: cn('grid w-16 min-w-16 flex-none place-items-center transition-colors', size === 'compact' ? 'h-9' : 'h-11', active ? 'text-current' : 'text-current'), children: icon }), _jsx("span", { className: cn('min-w-0 flex-1 truncate text-left font-medium whitespace-nowrap transition-opacity duration-[var(--duration-normal)]', size === 'compact' ? 'text-xs max-md:text-base' : 'text-[length:var(--font-size-compact)] max-md:text-base', isOpen ? 'opacity-100' : 'pointer-events-none w-0 opacity-0', labelClassName), children: label }), _jsx("span", { className: cn('flex-none place-items-center', isOpen ? 'grid' : 'hidden', size === 'compact' ? 'h-9 w-6' : 'h-11 w-7', showChevron && isOpen ? 'opacity-100' : 'opacity-0'), children: _jsx(ChevronIcon, { expanded: expanded }) })] }));
 });
 const SubActionButton = forwardRef(function SidebarSubActionButton({ active = false, className, isOpen, label, size = 'compact', title, type = 'button', ...props }, ref) {
-    return (_jsx("button", { ref: ref, type: type, title: title ? (typeof label === 'string' && !isOpen ? label : undefined) : undefined, "data-sidebar-active": active ? 'true' : undefined, className: cn('focus-visible:ring-brand/35 flex w-full cursor-pointer items-center rounded-xl font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none', size === 'compact' ? 'h-9 min-h-9 text-xs' : 'h-11 min-h-11 text-[length:var(--font-size-compact)]', isOpen ? 'justify-start pl-14' : 'justify-center', subActionButtonTone(active, size), className), ...props, children: _jsx("span", { className: cn('truncate', isOpen ? 'opacity-100' : 'sr-only'), children: label }) }));
+    return (_jsx("button", { ref: ref, type: type, title: title ? (typeof label === 'string' && !isOpen ? label : undefined) : undefined, "data-sidebar-active": active ? 'true' : undefined, className: cn('focus-visible:ring-brand/35 flex w-full cursor-pointer items-center rounded-xl font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none', size === 'compact' ? 'h-9 min-h-9 text-xs' : 'h-11 min-h-11 text-[length:var(--font-size-compact)]', isOpen ? 'justify-start pl-16' : 'justify-center', subActionButtonTone(active, size), className), ...props, children: _jsx("span", { className: cn('truncate', isOpen ? 'opacity-100' : 'sr-only'), children: label }) }));
 });
 function NavGroup({ active = false, className, collapsible = false, defaultExpanded, icon, isOpen, items, subItemSize = 'compact', title, }) {
     const itemByKey = useMemo(() => new Map(items.map((item) => [item.key, item])), [items]);
@@ -92,7 +92,7 @@ function NavGroup({ active = false, className, collapsible = false, defaultExpan
     if (singleItem) {
         return (_jsx("li", { className: cn('w-full', className), children: _jsx(ActionButton, { active: singleItem.active, icon: singleItem.icon ?? icon, isOpen: isOpen, label: singleItem.label, onClick: handleSingleItemClick, title: singleItem.title, tone: "subtle" }) }));
     }
-    return (_jsxs("li", { className: cn('relative w-full', className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [_jsx(ActionButton, { active: groupActive, "aria-expanded": isOpen ? expanded : undefined, icon: icon, isOpen: isOpen, label: title, labelClassName: labelVisible ? 'opacity-100' : 'opacity-0', onClick: handleGroupClick, expanded: expanded, showChevron: collapsible && isOpen, tone: "subtle" }), isOpen ? (_jsx("div", { className: "grid grid-rows-[0fr] opacity-0 transition-[grid-template-rows,opacity] duration-[var(--duration-normal)] ease-out data-[expanded=true]:grid-rows-[1fr] data-[expanded=true]:opacity-100", "data-expanded": expanded, children: _jsx("div", { className: "relative min-h-0 overflow-hidden", children: _jsx("ul", { className: "flex w-full flex-col", children: items.map((item, index) => (_jsxs("li", { className: "relative w-full", children: [_jsx("span", { "aria-hidden": "true", className: cn('bg-app-border absolute left-7 top-0 w-px', index === items.length - 1 ? 'h-1/2' : 'bottom-0') }), _jsx("span", { "aria-hidden": "true", className: "bg-app-border absolute left-7 top-1/2 h-px w-5" }), _jsx(SubActionButton, { active: item.active, "data-sidebar-item-key": item.key, isOpen: isOpen, label: item.label, onClick: handleItemSelect, size: subItemSize, title: item.title })] }, item.key))) }) }) })) : (_jsx(Flyout, { open: hovered, title: title, items: items, onItemSelect: handleItemSelect }))] }));
+    return (_jsxs("li", { className: cn('relative w-full', className), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [_jsx(ActionButton, { active: groupActive, "aria-expanded": isOpen ? expanded : undefined, icon: icon, isOpen: isOpen, label: title, labelClassName: labelVisible ? 'opacity-100' : 'opacity-0', onClick: handleGroupClick, expanded: expanded, showChevron: collapsible && isOpen, tone: "subtle" }), isOpen ? (_jsx("div", { className: "grid grid-rows-[0fr] opacity-0 transition-[grid-template-rows,opacity] duration-[var(--duration-normal)] ease-out data-[expanded=true]:grid-rows-[1fr] data-[expanded=true]:opacity-100", "data-expanded": expanded, children: _jsx("div", { className: "relative min-h-0 overflow-hidden", children: _jsx("ul", { className: "flex w-full flex-col", children: items.map((item, index) => (_jsxs("li", { className: "relative w-full", children: [_jsx("span", { "aria-hidden": "true", className: cn('bg-app-border absolute left-8 top-0 w-px', index === items.length - 1 ? 'h-1/2' : 'bottom-0') }), _jsx("span", { "aria-hidden": "true", className: "bg-app-border absolute left-8 top-1/2 h-px w-5" }), _jsx(SubActionButton, { active: item.active, "data-sidebar-item-key": item.key, isOpen: isOpen, label: item.label, onClick: handleItemSelect, size: subItemSize, title: item.title })] }, item.key))) }) }) })) : (_jsx(Flyout, { open: hovered, title: title, items: items, onItemSelect: handleItemSelect }))] }));
 }
 function Flyout({ items, onItemSelect, open, title }) {
     return (_jsxs("div", { className: "border-app-border bg-[var(--sidebar-flyout-background)] invisible pointer-events-none absolute left-[calc(100%+0.375rem)] top-0 z-[var(--z-flyout)] min-w-52 -translate-x-2 overflow-hidden rounded-xl border p-2 opacity-0 shadow-[var(--shadow-flyout)] transition-[opacity,transform,visibility] duration-[var(--duration-fast)] data-[open=true]:visible data-[open=true]:pointer-events-auto data-[open=true]:translate-x-0 data-[open=true]:opacity-100", "data-open": open, children: [_jsx("span", { "aria-hidden": "true", className: "absolute right-full top-0 h-full w-2.5" }), _jsx("p", { className: "text-foreground-muted mb-2 text-[length:var(--font-size-caption)] font-semibold uppercase tracking-[var(--letter-spacing-caps)]", children: title }), _jsx("div", { className: "flex max-h-[calc(100vh-5rem)] flex-col overflow-y-auto", children: items.map((item) => (_jsxs("button", { type: "button", "data-sidebar-item-key": item.key, onClick: onItemSelect, className: cn('group focus-visible:ring-brand/35 flex h-9 min-h-9 w-full cursor-pointer items-center gap-2 rounded-lg text-left text-xs font-medium leading-none transition-colors focus-visible:ring-2 focus-visible:outline-none', item.active

package/dist/styles.css

@@ -596,6 +596,9 @@ h2.react-datepicker__current-month {
     --color-red-500: oklch(63.7% 0.237 25.331);
     --color-red-600: oklch(57.7% 0.245 27.325);
     --color-red-950: oklch(25.8% 0.092 26.042);
+    --color-amber-600: oklch(66.6% 0.179 58.318);
+    --color-green-600: oklch(62.7% 0.194 149.214);
+    --color-sky-600: oklch(58.8% 0.158 241.966);
     --spacing: 0.25rem;
     --container-xs: 20rem;
     --container-sm: 24rem;
@@ -859,6 +862,9 @@ h2.react-datepicker__current-month {
   .inset-y-0 {
     inset-block: calc(var(--spacing) * 0);
   }
+  .-top-1 {
+    top: calc(var(--spacing) * -1);
+  }
   .top-0 {
     top: calc(var(--spacing) * 0);
   }
@@ -880,6 +886,9 @@ h2.react-datepicker__current-month {
   .top-full {
     top: 100%;
   }
+  .-right-1 {
+    right: calc(var(--spacing) * -1);
+  }
   .right-0 {
     right: calc(var(--spacing) * 0);
   }
@@ -919,8 +928,8 @@ h2.react-datepicker__current-month {
   .left-4 {
     left: calc(var(--spacing) * 4);
   }
-  .left-7 {
-    left: calc(var(--spacing) * 7);
+  .left-8 {
+    left: calc(var(--spacing) * 8);
   }
   .left-\[50\%\] {
     left: 50%;
@@ -931,6 +940,9 @@ h2.react-datepicker__current-month {
   .left-full {
     left: 100%;
   }
+  .z-10 {
+    z-index: 10;
+  }
   .z-\[var\(--z-critical-dialog\)\] {
     z-index: var(--z-critical-dialog);
   }
@@ -1097,6 +1109,10 @@ h2.react-datepicker__current-month {
     width: calc(var(--spacing) * 10) !important;
     height: calc(var(--spacing) * 10) !important;
   }
+  .size-2 {
+    width: calc(var(--spacing) * 2);
+    height: calc(var(--spacing) * 2);
+  }
   .size-3 {
     width: calc(var(--spacing) * 3);
     height: calc(var(--spacing) * 3);
@@ -1231,6 +1247,9 @@ h2.react-datepicker__current-month {
   .h-\[32rem\] {
     height: 32rem;
   }
+  .h-\[40rem\] {
+    height: 40rem;
+  }
   .h-\[calc\(100\%-1rem\)\] {
     height: calc(100% - 1rem);
   }
@@ -1255,6 +1274,9 @@ h2.react-datepicker__current-month {
   .max-h-\[95vh\] {
     max-height: 95vh;
   }
+  .max-h-\[560px\] {
+    max-height: 560px;
+  }
   .max-h-\[calc\(100vh-5rem\)\] {
     max-height: calc(100vh - 5rem);
   }
@@ -1420,6 +1442,9 @@ h2.react-datepicker__current-month {
   .w-\[34rem\] {
     width: 34rem;
   }
+  .w-\[38rem\] {
+    width: 38rem;
+  }
   .w-\[42rem\] {
     width: 42rem;
   }
@@ -1438,6 +1463,9 @@ h2.react-datepicker__current-month {
   .w-\[min\(10rem\,24vw\)\] {
     width: min(10rem, 24vw);
   }
+  .w-\[min\(24rem\,calc\(100vw-2rem\)\)\] {
+    width: min(24rem, calc(100vw - 2rem));
+  }
   .w-auto {
     width: auto;
   }
@@ -1587,6 +1615,9 @@ h2.react-datepicker__current-month {
     --tw-border-spacing-y: calc(var(--spacing) * 0);
     border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
   }
+  .origin-top-right {
+    transform-origin: top right;
+  }
   .-translate-x-1\/2 {
     --tw-translate-x: calc(calc(1/2 * 100%) * -1);
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -1669,6 +1700,9 @@ h2.react-datepicker__current-month {
   .grid-rows-\[0fr\] {
     grid-template-rows: 0fr;
   }
+  .grid-rows-\[auto_1fr\] {
+    grid-template-rows: auto 1fr;
+  }
   .grid-rows-\[auto_minmax\(0\,1fr\)\] {
     grid-template-rows: auto minmax(0,1fr);
   }
@@ -1951,6 +1985,12 @@ h2.react-datepicker__current-month {
   .border-brand {
     border-color: var(--color-brand);
   }
+  .border-brand\/40 {
+    border-color: var(--color-brand);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-brand) 40%, transparent);
+    }
+  }
   .border-brand\/50 {
     border-color: var(--color-brand);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2104,6 +2144,12 @@ h2.react-datepicker__current-month {
   .bg-brand {
     background-color: var(--color-brand);
   }
+  .bg-brand\/5 {
+    background-color: var(--color-brand);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-brand) 5%, transparent);
+    }
+  }
   .bg-brand\/10 {
     background-color: var(--color-brand);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2290,6 +2336,9 @@ h2.react-datepicker__current-month {
   .pb-2 {
     padding-bottom: calc(var(--spacing) * 2);
   }
+  .pb-3 {
+    padding-bottom: calc(var(--spacing) * 3);
+  }
   .pb-4 {
     padding-bottom: calc(var(--spacing) * 4);
   }
@@ -2329,6 +2378,9 @@ h2.react-datepicker__current-month {
   .pl-14 {
     padding-left: calc(var(--spacing) * 14);
   }
+  .pl-16 {
+    padding-left: calc(var(--spacing) * 16);
+  }
   .text-center {
     text-align: center;
   }
@@ -2381,6 +2433,12 @@ h2.react-datepicker__current-month {
     font-size: var(--text-xs);
     line-height: var(--tw-leading, var(--text-xs--line-height));
   }
+  .text-\[10px\] {
+    font-size: 10px;
+  }
+  .text-\[11px\] {
+    font-size: 11px;
+  }
   .text-\[length\:var\(--font-size-2xs\)\] {
     font-size: var(--font-size-2xs);
   }
@@ -2547,6 +2605,9 @@ h2.react-datepicker__current-month {
   .text-\[var\(--status-warning-text\)\] {
     color: var(--status-warning-text);
   }
+  .text-amber-600 {
+    color: var(--color-amber-600);
+  }
   .text-brand {
     color: var(--color-brand);
   }
@@ -2571,6 +2632,9 @@ h2.react-datepicker__current-month {
       color: color-mix(in oklab, var(--color-foreground-muted) 90%, transparent);
     }
   }
+  .text-green-600 {
+    color: var(--color-green-600);
+  }
   .text-primary {
     color: var(--color-primary);
   }
@@ -2580,6 +2644,9 @@ h2.react-datepicker__current-month {
   .text-red-600 {
     color: var(--color-red-600);
   }
+  .text-sky-600 {
+    color: var(--color-sky-600);
+  }
   .uppercase {
     text-transform: uppercase;
   }
@@ -2700,6 +2767,10 @@ h2.react-datepicker__current-month {
     --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-xl {
+    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .outline {
     outline-style: var(--tw-outline-style);
     outline-width: 1px;
@@ -2786,13 +2857,13 @@ h2.react-datepicker__current-month {
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
-  .transition-\[opacity\,transform\,visibility\] {
-    transition-property: opacity,transform,visibility;
+  .transition-\[opacity\,transform\,translate\,scale\] {
+    transition-property: opacity,transform,translate,scale;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
-  .transition-\[opacity\,transform\] {
-    transition-property: opacity,transform;
+  .transition-\[opacity\,transform\,visibility\] {
+    transition-property: opacity,transform,visibility;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
@@ -3258,6 +3329,16 @@ h2.react-datepicker__current-month {
       }
     }
   }
+  .hover\:bg-brand\/10 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-brand);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--color-brand) 10%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-destructive {
     &:hover {
       @media (hover: hover) {
@@ -3682,6 +3763,22 @@ h2.react-datepicker__current-month {
       color: var(--color-foreground);
     }
   }
+  .data-\[state\=closed\]\:scale-95 {
+    &[data-state="closed"] {
+      --tw-scale-x: 95%;
+      --tw-scale-y: 95%;
+      --tw-scale-z: 95%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
+  .data-\[state\=open\]\:scale-100 {
+    &[data-state="open"] {
+      --tw-scale-x: 100%;
+      --tw-scale-y: 100%;
+      --tw-scale-z: 100%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
   .data-\[state\=open\]\:bg-\[var\(--status-danger-bg\)\] {
     &[data-state="open"] {
       background-color: var(--status-danger-bg);
@@ -5098,6 +5195,21 @@ h2.react-datepicker__current-month {
   initial-value: "";
   inherits: false;
 }
+@property --tw-scale-x {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-y {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
+@property --tw-scale-z {
+  syntax: "*";
+  inherits: false;
+  initial-value: 1;
+}
 @keyframes spin {
   to {
     transform: rotate(360deg);
@@ -5167,6 +5279,9 @@ h2.react-datepicker__current-month {
       --tw-duration: initial;
       --tw-ease: initial;
       --tw-content: "";
+      --tw-scale-x: 1;
+      --tw-scale-y: 1;
+      --tw-scale-z: 1;
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wellingtonhlc/shared-ui",
-    "version": "0.29.1",
+    "version": "0.29.4",
     "private": false,
     "type": "module",
     "packageManager": "npm@11.12.1",