@caratlogic/design-system 0.1.1 → 0.1.2

package/dist/index.cjs.js

@@ -5504,7 +5504,9 @@ const SquareSkeleton = ({ width, height, rounded = 'md', className, }) => {
         style.width = toCssSize(width);
     if (height !== undefined)
         style.height = toCssSize(height);
-    return (jsxRuntime.jsx("div", { "aria-hidden": "true", style: style, className: cn('animate-pulse bg-muted', ROUNDED_MAP[rounded], className) }));
+    return (jsxRuntime.jsx("div", { "aria-hidden": "true", style: style, className: cn(
+        // Shimmer wave: muted base with a light band sweeping across.
+        'relative isolate overflow-hidden bg-muted', 'before:absolute before:inset-0 before:-translate-x-full before:animate-shimmer', 'before:bg-gradient-to-r before:from-transparent before:via-white/50 before:to-transparent', ROUNDED_MAP[rounded], className) }));
 };
 
 const useSlider = ({ value, defaultValue, min, max, }) => {
@@ -5625,7 +5627,36 @@ const iconSizeMap = {
     'ex-lg': 16,
 };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$3 = ".Tabs-module_liftedTrigger__OkgpA[data-state=active]{border-bottom-color:var(--background);margin-bottom:-1px}.Tabs-module_folderTrigger__O7PmD[data-state=active]:after,.Tabs-module_folderTrigger__O7PmD[data-state=active]:before{background-repeat:no-repeat;background-size:100% 100%;bottom:0;content:\"\";height:8px;pointer-events:none;position:absolute;width:8px}.Tabs-module_folderTrigger__O7PmD[data-state=active]:before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M8 0a8 8 0 0 1-8 8h8Z' fill='%23fff'/%3E%3Cpath d='M8 0a8 8 0 0 1-8 8' fill='none' stroke='%23317A51'/%3E%3C/svg%3E\");left:-8px}.Tabs-module_folderTrigger__O7PmD[data-state=active]:after{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 0a8 8 0 0 0 8 8H0Z' fill='%23fff'/%3E%3Cpath d='M0 0a8 8 0 0 0 8 8' fill='none' stroke='%23317A51'/%3E%3C/svg%3E\");right:-8px}.dark .Tabs-module_folderTrigger__O7PmD[data-state=active]:before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M8 0a8 8 0 0 1-8 8h8Z' fill='%231E1E1E'/%3E%3Cpath d='M8 0a8 8 0 0 1-8 8' fill='none' stroke='%23317A51'/%3E%3C/svg%3E\")}.dark .Tabs-module_folderTrigger__O7PmD[data-state=active]:after{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 0a8 8 0 0 0 8 8H0Z' fill='%231E1E1E'/%3E%3Cpath d='M0 0a8 8 0 0 0 8 8' fill='none' stroke='%23317A51'/%3E%3C/svg%3E\")}";
 var styles = {"liftedTrigger":"Tabs-module_liftedTrigger__OkgpA"};
+styleInject(css_248z$3);
 
 const Tabs = ({ tabStyle = 'boxed', size = 'md', className, children, ...props }) => (jsxRuntime.jsx(TabsContextProvider, { value: { tabStyle, size }, children: jsxRuntime.jsx(TabsPrimitive__namespace.Root, { className: cn('w-full', className), ...props, children: children }) }));
 const TabsList = ({ loop, className, children }) => {
@@ -27704,9 +27735,36 @@ function DatePickerHeader({ monthDate, changeYear, changeMonth, decreaseMonth, i
     return (jsxRuntime.jsxs("div", { className: "date-range-picker-header", children: [hidePrev ? (jsxRuntime.jsx("span", { className: "date-range-picker-nav-spacer", "aria-hidden": true })) : (jsxRuntime.jsx("button", { type: "button", onClick: decreaseMonth, disabled: prevMonthButtonDisabled, "aria-label": "Previous month", className: "date-range-picker-nav", children: jsxRuntime.jsx(ChevronLeft, { className: "h-4 w-4", strokeWidth: 2 }) })), jsxRuntime.jsxs("div", { className: "date-range-picker-selects", children: [jsxRuntime.jsx("div", { className: "date-range-picker-select-wrap", children: jsxRuntime.jsx("select", { "aria-label": "Select month", className: "date-range-picker-select", value: shownMonth, onChange: (event) => changeMonth(Number(event.target.value)), children: MONTHS.map((label, index) => (jsxRuntime.jsx("option", { value: index, children: label }, label))) }) }), jsxRuntime.jsx("div", { className: "date-range-picker-select-wrap", children: jsxRuntime.jsx("select", { "aria-label": "Select year", className: "date-range-picker-select", value: shownYear, onChange: (event) => changeYear(Number(event.target.value)), children: years.map((year) => (jsxRuntime.jsx("option", { value: year, children: year }, year))) }) })] }), hideNext ? (jsxRuntime.jsx("span", { className: "date-range-picker-nav-spacer", "aria-hidden": true })) : (jsxRuntime.jsx("button", { type: "button", onClick: increaseMonth, disabled: nextMonthButtonDisabled, "aria-label": "Next month", className: "date-range-picker-nav", children: jsxRuntime.jsx(ChevronRight, { className: "h-4 w-4", strokeWidth: 2 }) }))] }));
 }
 
+var css_248z$2 = "@charset \"UTF-8\";.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow,.react-datepicker__navigation-icon:before,.react-datepicker__year-read-view--down-arrow{border-color:#ccc;border-style:solid;border-width:3px 3px 0 0;content:\"\";display:block;height:9px;position:absolute;top:6px;width:9px}.react-datepicker__sr-only{border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.react-datepicker-wrapper{border:0;display:inline-block;padding:0}.react-datepicker{background-color:#fff;border:1px solid #aeaeae;border-radius:.3rem;color:#000;display:inline-block;font-family:Helvetica Neue,helvetica,arial,sans-serif;font-size:.8rem;line-height:normal;position:relative}.react-datepicker--time-only .react-datepicker__time-container{border-left:0}.react-datepicker--time-only .react-datepicker__time,.react-datepicker--time-only .react-datepicker__time-box{border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker-popper{line-height:0;z-index:1}.react-datepicker-popper .react-datepicker__triangle{stroke:#aeaeae}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{fill:#f0f0f0;color:#f0f0f0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle{fill:#fff;color:#fff}.react-datepicker__header{background-color:#f0f0f0;border-bottom:1px solid #aeaeae;border-top-left-radius:.3rem;padding:8px 0;position:relative;text-align:center}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:0}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:.3rem}.react-datepicker__month-dropdown-container--scroll,.react-datepicker__month-dropdown-container--select,.react-datepicker__month-year-dropdown-container--scroll,.react-datepicker__month-year-dropdown-container--select,.react-datepicker__year-dropdown-container--scroll,.react-datepicker__year-dropdown-container--select{display:inline-block;margin:0 15px}.react-datepicker-time__header,.react-datepicker-year-header,.react-datepicker__current-month{color:#000;font-size:.944rem;font-weight:700;margin-top:0}h2.react-datepicker__current-month{margin:0;padding:0}.react-datepicker-time__header{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.react-datepicker__navigation{align-items:center;background:none;border:none;cursor:pointer;display:flex;height:32px;justify-content:center;overflow:hidden;padding:0;position:absolute;text-align:center;text-indent:-999em;top:2px;width:32px;z-index:1}.react-datepicker__navigation--previous{left:2px}.react-datepicker__navigation--next{right:2px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:85px}.react-datepicker__navigation--years{display:block;margin-left:auto;margin-right:auto;position:relative;top:0}.react-datepicker__navigation--years-previous{top:4px}.react-datepicker__navigation--years-upcoming{top:-4px}.react-datepicker__navigation:hover :before{border-color:#a6a6a6}.react-datepicker__navigation-icon{font-size:20px;position:relative;top:-1px;width:0}.react-datepicker__navigation-icon--next{left:-2px}.react-datepicker__navigation-icon--next:before{left:-7px;transform:rotate(45deg)}.react-datepicker__navigation-icon--previous{right:-2px}.react-datepicker__navigation-icon--previous:before{right:-7px;transform:rotate(225deg)}.react-datepicker__month-container{float:left}.react-datepicker__year{margin:.4rem;text-align:center}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:180px}.react-datepicker__year .react-datepicker__year-text{display:inline-block;margin:2px;width:4rem}.react-datepicker__month{margin:.4rem;text-align:center}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;margin:2px;width:4rem}.react-datepicker__input-time-container{clear:both;float:left;margin:5px 0 10px 15px;text-align:left;width:100%}.react-datepicker__input-time-container .react-datepicker-time__caption,.react-datepicker__input-time-container .react-datepicker-time__input-container{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input{display:inline-block;margin-left:10px}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input{width:auto}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]{-moz-appearance:textfield}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter{display:inline-block;margin-left:5px}.react-datepicker__time-container{border-left:1px solid #aeaeae;float:right;width:85px}.react-datepicker__time-container--with-today-button{border:1px solid #aeaeae;border-radius:.3rem;display:inline;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{background:#fff;border-bottom-right-radius:.3rem;position:relative}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{border-bottom-right-radius:.3rem;margin:0 auto;overflow-x:hidden;text-align:center;width:85px}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{box-sizing:content-box;height:calc(195px + .85rem);list-style:none;margin:0;overflow-y:scroll;padding-left:0;padding-right:0;width:100%}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{height:30px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{background-color:#f0f0f0;cursor:pointer}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:#216ba5;color:#fff;font-weight:700}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:#216ba5}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{background-color:transparent;cursor:default}.react-datepicker__week-number{color:#ccc;display:inline-block;line-height:1.7rem;margin:.166rem;text-align:center;width:1.7rem}.react-datepicker__week-number.react-datepicker__week-number--clickable{cursor:pointer}.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover{background-color:#f0f0f0;border-radius:.3rem}.react-datepicker__week-number--selected{background-color:#216ba5;border-radius:.3rem;color:#fff}.react-datepicker__week-number--selected:hover{background-color:#1d5d90}.react-datepicker__day-names{margin-bottom:-8px;text-align:center;white-space:nowrap}.react-datepicker__week{white-space:nowrap}.react-datepicker__day,.react-datepicker__day-name,.react-datepicker__time-name{color:#000;display:inline-block;line-height:1.7rem;margin:.166rem;text-align:center;width:1.7rem}.react-datepicker__day--disabled,.react-datepicker__day-name--disabled,.react-datepicker__time-name--disabled{color:#ccc;cursor:default}.react-datepicker__day,.react-datepicker__month-text,.react-datepicker__quarter-text,.react-datepicker__year-text{cursor:pointer}.react-datepicker__day:not([aria-disabled=true]):hover,.react-datepicker__month-text:not([aria-disabled=true]):hover,.react-datepicker__quarter-text:not([aria-disabled=true]):hover,.react-datepicker__year-text:not([aria-disabled=true]):hover{background-color:#f0f0f0;border-radius:.3rem}.react-datepicker__day--today,.react-datepicker__month-text--today,.react-datepicker__quarter-text--today,.react-datepicker__year-text--today{font-weight:700}.react-datepicker__day--highlighted,.react-datepicker__month-text--highlighted,.react-datepicker__quarter-text--highlighted,.react-datepicker__year-text--highlighted{background-color:#3dcc4a;border-radius:.3rem;color:#fff}.react-datepicker__day--highlighted:not([aria-disabled=true]):hover,.react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,.react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover{background-color:#32be3f}.react-datepicker__day--highlighted-custom-1,.react-datepicker__month-text--highlighted-custom-1,.react-datepicker__quarter-text--highlighted-custom-1,.react-datepicker__year-text--highlighted-custom-1{color:#f0f}.react-datepicker__day--highlighted-custom-2,.react-datepicker__month-text--highlighted-custom-2,.react-datepicker__quarter-text--highlighted-custom-2,.react-datepicker__year-text--highlighted-custom-2{color:green}.react-datepicker__day--holidays,.react-datepicker__month-text--holidays,.react-datepicker__quarter-text--holidays,.react-datepicker__year-text--holidays{background-color:#ff6803;border-radius:.3rem;color:#fff;position:relative}.react-datepicker__day--holidays .overlay,.react-datepicker__month-text--holidays .overlay,.react-datepicker__quarter-text--holidays .overlay,.react-datepicker__year-text--holidays .overlay{background-color:#333;border-radius:4px;bottom:100%;color:#fff;left:50%;opacity:0;padding:4px;position:absolute;transform:translateX(-50%);transition:visibility 0s,opacity .3s ease-in-out;visibility:hidden;white-space:nowrap}.react-datepicker__day--holidays:not([aria-disabled=true]):hover,.react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,.react-datepicker__year-text--holidays:not([aria-disabled=true]):hover{background-color:#cf5300}.react-datepicker__day--holidays:hover .overlay,.react-datepicker__month-text--holidays:hover .overlay,.react-datepicker__quarter-text--holidays:hover .overlay,.react-datepicker__year-text--holidays:hover .overlay{opacity:1;visibility:visible}.react-datepicker__day--in-range,.react-datepicker__day--in-selecting-range,.react-datepicker__day--selected,.react-datepicker__month-text--in-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__month-text--selected,.react-datepicker__quarter-text--in-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__quarter-text--selected,.react-datepicker__year-text--in-range,.react-datepicker__year-text--in-selecting-range,.react-datepicker__year-text--selected{background-color:#216ba5;border-radius:.3rem;color:#fff}.react-datepicker__day--in-range:not([aria-disabled=true]):hover,.react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__day--selected:not([aria-disabled=true]):hover,.react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,.react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__month-text--selected:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,.react-datepicker__year-text--in-range:not([aria-disabled=true]):hover,.react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,.react-datepicker__year-text--selected:not([aria-disabled=true]):hover{background-color:#1d5d90}.react-datepicker__day--keyboard-selected,.react-datepicker__month-text--keyboard-selected,.react-datepicker__quarter-text--keyboard-selected,.react-datepicker__year-text--keyboard-selected{background-color:#bad9f1;border-radius:.3rem;color:#000}.react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,.react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover{background-color:#1d5d90;color:#fff}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range){background-color:#f0f0f0;color:#000}.react-datepicker__day--disabled,.react-datepicker__month-text--disabled,.react-datepicker__quarter-text--disabled,.react-datepicker__year-text--disabled{color:#ccc;cursor:default}.react-datepicker__day--disabled .overlay,.react-datepicker__month-text--disabled .overlay,.react-datepicker__quarter-text--disabled .overlay,.react-datepicker__year-text--disabled .overlay{background-color:#333;border-radius:4px;bottom:70%;color:#fff;left:50%;opacity:0;padding:4px;position:absolute;transform:translateX(-50%);transition:visibility 0s,opacity .3s ease-in-out;visibility:hidden;white-space:nowrap}.react-datepicker__input-container{display:inline-block;position:relative;width:100%}.react-datepicker__input-container .react-datepicker__calendar-icon{box-sizing:content-box;padding:.5rem;position:absolute}.react-datepicker__view-calendar-icon input{padding:6px 10px 5px 25px}.react-datepicker__month-read-view,.react-datepicker__month-year-read-view,.react-datepicker__year-read-view{border:1px solid transparent;border-radius:.3rem;position:relative}.react-datepicker__month-read-view:hover,.react-datepicker__month-year-read-view:hover,.react-datepicker__year-read-view:hover{cursor:pointer}.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow{border-top-color:#b3b3b3}.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow{right:-16px;top:0;transform:rotate(135deg)}.react-datepicker__month-dropdown,.react-datepicker__month-year-dropdown,.react-datepicker__year-dropdown{background-color:#f0f0f0;border:1px solid #aeaeae;border-radius:.3rem;left:25%;position:absolute;text-align:center;top:30px;width:50%;z-index:1}.react-datepicker__month-dropdown:hover,.react-datepicker__month-year-dropdown:hover,.react-datepicker__year-dropdown:hover{cursor:pointer}.react-datepicker__month-dropdown--scrollable,.react-datepicker__month-year-dropdown--scrollable,.react-datepicker__year-dropdown--scrollable{height:150px;overflow-y:scroll}.react-datepicker__month-option,.react-datepicker__month-year-option,.react-datepicker__year-option{display:block;line-height:20px;margin-left:auto;margin-right:auto;width:100%}.react-datepicker__month-option:first-of-type,.react-datepicker__month-year-option:first-of-type,.react-datepicker__year-option:first-of-type{border-top-left-radius:.3rem;border-top-right-radius:.3rem}.react-datepicker__month-option:last-of-type,.react-datepicker__month-year-option:last-of-type,.react-datepicker__year-option:last-of-type{border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.react-datepicker__month-option:hover,.react-datepicker__month-year-option:hover,.react-datepicker__year-option:hover{background-color:#ccc}.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming{border-bottom-color:#b3b3b3}.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous{border-top-color:#b3b3b3}.react-datepicker__month-option--selected,.react-datepicker__month-year-option--selected,.react-datepicker__year-option--selected{left:15px;position:absolute}.react-datepicker__close-icon{background-color:transparent;border:0;cursor:pointer;display:table-cell;height:100%;outline:0;padding:0 6px 0 0;position:absolute;right:0;top:0;vertical-align:middle}.react-datepicker__close-icon:after{background-color:#216ba5;border-radius:50%;color:#fff;content:\"×\";cursor:pointer;display:table-cell;font-size:12px;height:16px;line-height:1;padding:2px;text-align:center;vertical-align:middle;width:16px}.react-datepicker__close-icon--disabled{cursor:default}.react-datepicker__close-icon--disabled:after{background-color:#ccc;cursor:default}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;clear:left;cursor:pointer;font-weight:700;padding:5px 0;text-align:center}.react-datepicker__portal{align-items:center;background-color:rgba(0,0,0,.8);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:2147483647}.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:3rem;width:3rem}@media (max-height:550px),(max-width:400px){.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:2rem;width:2rem}}.react-datepicker__portal .react-datepicker-time__header,.react-datepicker__portal .react-datepicker__current-month{font-size:1.44rem}.react-datepicker__children-container{height:auto;margin:.4rem;padding-left:.2rem;padding-right:.2rem;width:13.8rem}.react-datepicker__aria-live{border:0;clip-path:circle(0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.react-datepicker__calendar-icon{height:1em;vertical-align:-.125em;width:1em}";
+styleInject(css_248z$2);
+
+var css_248z$1 = ".date-range-picker-popover[data-slot=popover-content]{max-width:calc(100vw - 2rem);width:fit-content}.date-range-picker-calendar.react-datepicker{background:transparent;border:0;display:flex;flex-direction:column;font-family:inherit;font-size:.875rem}.date-range-picker-calendar .react-datepicker__month-container{float:none;width:auto}.date-range-picker-calendar .react-datepicker__header{background:transparent;border-bottom:0;padding:0}.date-range-picker-calendar .react-datepicker__current-month{display:none}.date-range-picker-header{align-items:center;display:flex;gap:.5rem;justify-content:space-between;padding:0 .25rem .25rem}.date-range-picker-selects{align-items:center;display:flex;gap:.375rem}.date-range-picker-select-wrap{align-items:center;display:inline-flex;position:relative}.date-range-picker-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:var(--background);background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");background-position:right .375rem center;background-repeat:no-repeat;background-size:.875rem;border:1px solid var(--input-border,var(--border));border-radius:.5rem;color:var(--foreground);cursor:pointer;font-size:.8125rem;font-weight:500;height:1.875rem;line-height:1.875rem;outline:none;padding:0 1.5rem 0 .625rem;transition:border-color .15s,box-shadow .15s}.date-range-picker-select:hover{background-color:var(--muted)}.date-range-picker-select:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in srgb,var(--ring) 30%,transparent)}.date-range-picker-select option{background-color:var(--popover,var(--background));color:var(--foreground)}.date-range-picker-nav-spacer{display:inline-block;height:1.75rem;width:1.75rem}.date-range-picker-nav{align-items:center;background-color:var(--muted);border:0;border-radius:.5rem;color:var(--muted-foreground);cursor:pointer;display:inline-flex;height:1.75rem;justify-content:center;padding:0;transition:background-color .15s,color .15s;width:1.75rem}.date-range-picker-nav:hover{background-color:var(--accent);color:var(--foreground)}.date-range-picker-nav:disabled{cursor:not-allowed;opacity:.4}.date-range-picker-calendar .react-datepicker__day-names{display:flex;justify-content:space-between;margin:.5rem 0 .25rem}.date-range-picker-calendar .react-datepicker__day-name{color:var(--muted-foreground);font-size:.75rem;font-weight:400;line-height:1.75rem;margin:0;width:2.25rem}.date-range-picker-calendar .react-datepicker__month{margin:0}.date-range-picker-calendar .react-datepicker__week{display:flex;justify-content:space-between}.date-range-picker-calendar .react-datepicker__day{align-items:center;border-radius:.5rem;color:var(--foreground);display:inline-flex;font-size:.875rem;height:2.25rem;justify-content:center;line-height:2.25rem;margin:.125rem 0;width:2.25rem}.date-range-picker-calendar .react-datepicker__day--outside-month{color:var(--muted-foreground);opacity:.55}.date-range-picker-calendar .react-datepicker__day:hover{background-color:var(--muted);border-radius:.5rem}.date-range-picker-calendar .react-datepicker__day--today{background-color:var(--muted);color:var(--foreground);font-weight:600}.date-range-picker-calendar .react-datepicker__day--keyboard-selected,.date-range-picker-calendar .react-datepicker__day--selected{background-color:var(--primary);color:var(--primary-foreground);font-weight:500}.date-range-picker-calendar .react-datepicker__day--keyboard-selected:hover,.date-range-picker-calendar .react-datepicker__day--selected:hover{background-color:var(--primary);color:var(--primary-foreground);filter:brightness(.95)}.date-range-picker-calendar .react-datepicker__day--in-range,.date-range-picker-calendar .react-datepicker__day--in-selecting-range{background-color:color-mix(in srgb,var(--primary) 18%,transparent);color:var(--primary)}.date-range-picker-calendar .react-datepicker__day--range-end,.date-range-picker-calendar .react-datepicker__day--range-start{background-color:var(--primary);color:var(--primary-foreground)}.date-range-picker-calendar .react-datepicker__day--disabled{color:var(--muted-foreground);cursor:not-allowed;opacity:.4}.date-range-picker-calendar .react-datepicker__children-container{margin:0;padding:0;width:auto}.date-range-picker-footer{align-items:center;display:flex;justify-content:space-between;margin-top:.75rem;padding-top:.75rem;width:100%}.date-range-picker-action{align-items:center;background-color:color-mix(in srgb,var(--primary) 10%,transparent);border:0;border-radius:.5rem;color:var(--primary);cursor:pointer;display:inline-flex;font-size:.8125rem;font-weight:500;height:2rem;justify-content:center;padding:0 .875rem;transition:background-color .15s}.date-range-picker-action:hover{background-color:color-mix(in srgb,var(--primary) 18%,transparent)}:is(.dark) .date-range-picker-calendar .react-datepicker__day--today{background-color:color-mix(in srgb,var(--muted) 80%,transparent)}:is(.dark) .date-range-picker-action{background-color:color-mix(in srgb,var(--primary) 18%,transparent)}:is(.dark) .date-range-picker-action:hover{background-color:color-mix(in srgb,var(--primary) 28%,transparent)}";
+styleInject(css_248z$1);
+
+// Only one DateInput popover should be open at a time. Because each instance is
+// its own `modal` Radix Popover, opening a second one does not dismiss the first
+// via outside-click. Instances coordinate through a window event: whoever opens
+// broadcasts its id, and every other open instance closes itself.
+const DATEINPUT_OPEN_EVENT = 'caratlogic:dateinput-open';
 function DateInput({ value, onChange, onBlur, name, className, min, max, disabled, placeholder = 'Select date', }) {
     const [open, setOpen] = React.useState(false);
+    const instanceId = React.useId();
     const { minDate, maxDate, minYear, maxYear } = computeDateBounds(min, max);
+    // Close this popover when any other DateInput announces it just opened.
+    React.useEffect(() => {
+        const onOtherOpen = (e) => {
+            if (e.detail !== instanceId)
+                setOpen(false);
+        };
+        window.addEventListener(DATEINPUT_OPEN_EVENT, onOtherOpen);
+        return () => window.removeEventListener(DATEINPUT_OPEN_EVENT, onOtherOpen);
+    }, [instanceId]);
+    const handleOpenChange = (next) => {
+        setOpen(next);
+        if (next) {
+            window.dispatchEvent(new CustomEvent(DATEINPUT_OPEN_EVENT, { detail: instanceId }));
+        }
+    };
     // NOTE: We drive `open` ourselves from the button's onClick instead of using
     // Radix's <PopoverTrigger> toggle. When this Popover is nested inside the
     // modal <SlideOut> (Radix Dialog), the trigger's built-in toggle does not
@@ -27715,9 +27773,9 @@ function DateInput({ value, onChange, onBlur, name, className, min, max, disable
     // source of truth — no double-fire, and it works across browsers. `modal`
     // lets the open popover own pointer events above the dialog so the calendar
     // (portalled to <body>) stays clickable.
-    return (jsxRuntime.jsxs(Popover, { open: open, onOpenChange: setOpen, modal: true, children: [jsxRuntime.jsx(PopoverAnchor, { asChild: true, children: jsxRuntime.jsxs("button", { type: "button", name: name, onBlur: onBlur, disabled: disabled, "aria-haspopup": "dialog", "aria-expanded": open, onClick: () => {
+    return (jsxRuntime.jsxs(Popover, { open: open, onOpenChange: handleOpenChange, modal: true, children: [jsxRuntime.jsx(PopoverAnchor, { asChild: true, children: jsxRuntime.jsxs("button", { type: "button", name: name, onBlur: onBlur, disabled: disabled, "aria-haspopup": "dialog", "aria-expanded": open, onClick: () => {
                         if (!disabled)
-                            setOpen((prev) => !prev);
+                            handleOpenChange(!open);
                     }, "data-slot": "input", "data-empty": !value || undefined, className: cn('border-input-border flex h-9 w-full min-w-0 cursor-pointer items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-1 text-left shadow-[0_1px_2px_0_#0000000d] transition-[color,box-shadow] outline-none', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 aria-invalid:border-destructive', disabled && 'cursor-not-allowed bg-muted text-label', className), children: [jsxRuntime.jsx("span", { className: cn('truncate text-sm md:text-sm', value ? 'text-foreground' : 'text-placeholder'), children: value ? moment(value).format('DD/MM/YYYY') : placeholder }), jsxRuntime.jsx("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground", children: jsxRuntime.jsx(CalendarDays, { className: "h-4 w-4 stroke-[1.75]" }) })] }) }), jsxRuntime.jsx(PopoverContent, { align: "start", className: "date-range-picker-popover w-auto p-4", children: jsxRuntime.jsx(DatePicker, { inline: true, selected: value ?? null, minDate: minDate ? moment(minDate, 'YYYY-MM-DD').toDate() : undefined, maxDate: maxDate ? moment(maxDate, 'YYYY-MM-DD').toDate() : undefined, onChange: (date) => {
                         onChange(date ?? undefined);
                         if (date)
@@ -28516,11 +28574,70 @@ function PageTabs({ value, onChange, tabs, ariaLabel, className, }) {
         })), variant: "bordered", ariaLabel: ariaLabel, className: className ?? 'w-auto' }));
 }
 
+const paginationSelectTriggerVariants = cva('inline-flex w-auto shrink-0 items-center justify-between gap-1.5 whitespace-nowrap font-medium font-sans transition-colors cursor-pointer select-none outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=open]:bg-muted', {
+    variants: {
+        size: {
+            xs: 'h-7 px-2 text-xs rounded-md',
+            sm: 'h-8 px-2.5 text-sm rounded-md',
+            md: 'h-9 px-3 text-sm rounded-md',
+            lg: 'h-10 px-4 text-base rounded-lg',
+        },
+        shape: {
+            square: '',
+            rounded: 'rounded-full',
+        },
+        variant: {
+            default: 'bg-transparent hover:bg-muted text-foreground',
+            solid: 'bg-muted hover:bg-muted/80 text-foreground',
+            outlined: 'border border-border bg-transparent hover:bg-muted text-foreground',
+            underline: 'bg-transparent hover:bg-muted text-foreground',
+        },
+    },
+    defaultVariants: { size: 'md', shape: 'square', variant: 'default' },
+});
+/**
+ * The popup is portalled to `document.body`, so it is styled purely from theme
+ * tokens — that is what keeps it identical on Windows, macOS and Linux instead
+ * of inheriting the OS's native listbox chrome.
+ */
+const paginationSelectContentClass = 'z-50 min-w-[var(--radix-select-trigger-width)] max-h-[--radix-select-content-available-height] overflow-hidden rounded-md border border-border bg-popover text-popover-foreground shadow-[0_10px_15px_-3px_rgba(0,0,0,0.10),0_4px_6px_-4px_rgba(0,0,0,0.10)] data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0';
+const paginationSelectItemClass = 'relative flex w-full cursor-pointer select-none items-center whitespace-nowrap rounded-sm py-1.5 pl-2 pr-7 font-sans text-popover-foreground outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[state=checked]:font-medium data-[disabled]:pointer-events-none data-[disabled]:opacity-50';
+const paginationSelectItemSizes = {
+    xs: 'text-xs',
+    sm: 'text-sm',
+    md: 'text-sm',
+    lg: 'text-base',
+};
+const paginationSelectIconSizes = {
+    xs: 12,
+    sm: 14,
+    md: 16,
+    lg: 18,
+};
+
+/**
+ * Compact dropdown for pagination controls (rows-per-page, jump-to-page).
+ *
+ * Replaces a native `<select>`: browsers hand the native option list to the OS,
+ * so on Windows it renders in system colours and ignores the app's dark theme.
+ * This one is a themed, portalled listbox, so it looks the same on every OS.
+ */
+const PaginationSelect = ({ value, options, onChange, ariaLabel, size = 'md', shape = 'square', variant = 'default', disabled = false, align = 'start', className, contentClassName, }) => (jsxRuntime.jsxs(SelectPrimitive__namespace.Root, { value: String(value), onValueChange: (next) => onChange(Number(next)), disabled: disabled, children: [jsxRuntime.jsxs(SelectPrimitive__namespace.Trigger, { "aria-label": ariaLabel, className: cn(paginationSelectTriggerVariants({ size, shape, variant }), className), children: [jsxRuntime.jsx(SelectPrimitive__namespace.Value, {}), jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: jsxRuntime.jsx(ChevronDown, { size: paginationSelectIconSizes[size] - 2, className: "shrink-0 opacity-70", "aria-hidden": "true" }) })] }), jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: jsxRuntime.jsx(SelectPrimitive__namespace.Content, { position: "popper", align: align, sideOffset: 4, className: cn(paginationSelectContentClass, contentClassName), children: jsxRuntime.jsx(SelectPrimitive__namespace.Viewport, { className: "p-1", children: options.map((option) => (jsxRuntime.jsxs(SelectPrimitive__namespace.Item, { value: String(option.value), className: cn(paginationSelectItemClass, paginationSelectItemSizes[size]), children: [jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children: option.label }), jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { className: "absolute right-2 flex items-center justify-center", children: jsxRuntime.jsx(Check, { size: 14, "aria-hidden": "true" }) })] }, option.value))) }) }) })] }));
+
 const PaginationContent = React__namespace.forwardRef(({ className, ...props }, ref) => (jsxRuntime.jsx("ul", { ref: ref, className: cn('flex flex-row items-center gap-1', className), ...props })));
 PaginationContent.displayName = 'PaginationContent';
 const PaginationItem = React__namespace.forwardRef(({ className, ...props }, ref) => (jsxRuntime.jsx("li", { ref: ref, className: cn('list-none', className), ...props })));
 PaginationItem.displayName = 'PaginationItem';
 
+function buildPageOptions(totalPages) {
+    return Array.from({ length: Math.max(0, totalPages) }, (_, i) => ({
+        value: i + 1,
+        label: `Page ${i + 1}`,
+    }));
+}
+function buildItemsPerPageOptions(options) {
+    return options.map((value) => ({ value, label: `${value}/page` }));
+}
 const pageButtonVariants = cva('inline-flex items-center justify-center font-medium font-sans transition-colors disabled:pointer-events-none disabled:opacity-50 select-none cursor-pointer', {
     variants: {
         size: {
@@ -28563,27 +28680,6 @@ const navButtonVariants = cva('inline-flex items-center justify-center gap-1.5 f
     },
     defaultVariants: { size: 'md', shape: 'square', variant: 'default' },
 });
-const itemsPerPageVariants = cva('inline-flex items-center font-medium font-sans transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', {
-    variants: {
-        size: {
-            xs: 'h-7 px-2 text-xs rounded-md',
-            sm: 'h-8 px-2.5 text-sm rounded-md',
-            md: 'h-9 px-3 text-sm rounded-md',
-            lg: 'h-10 px-4 text-base rounded-lg',
-        },
-        shape: {
-            square: '',
-            rounded: '!rounded-full',
-        },
-        variant: {
-            default: 'bg-transparent hover:bg-muted text-foreground',
-            solid: 'bg-muted hover:bg-muted/80 text-foreground',
-            outlined: 'border border-border bg-transparent hover:bg-muted text-foreground',
-            underline: 'bg-transparent hover:bg-muted text-foreground',
-        },
-    },
-    defaultVariants: { size: 'md', shape: 'square', variant: 'default' },
-});
 const navIconSizes = {
     xs: 12,
     sm: 14,
@@ -28685,7 +28781,7 @@ const Pagination = ({ currentPage, totalPages, onPageChange, size = 'md', varian
     // ── Center slot (used in combined + minimal layouts) ──────────────────────
     const centerSlot = () => {
         if (showPageDropdown) {
-            return (jsxRuntime.jsxs("span", { className: cn('inline-flex items-center gap-1 px-3 font-medium font-sans text-foreground cursor-pointer', pageInfoSizes[size], sizeHeights[size]), children: [jsxRuntime.jsx("select", { value: currentPage, onChange: (e) => goTo(Number(e.target.value)), "aria-label": paginationA11y.selectPageLabel, className: "appearance-none bg-transparent cursor-pointer focus:outline-none", children: Array.from({ length: totalPages }, (_, i) => (jsxRuntime.jsxs("option", { value: i + 1, children: ["Page ", i + 1] }, i + 1))) }), jsxRuntime.jsx(ChevronDown, { size: iconSize - 2, "aria-hidden": "true" })] }));
+            return (jsxRuntime.jsx(PaginationSelect, { value: currentPage, options: buildPageOptions(totalPages), onChange: goTo, ariaLabel: paginationA11y.selectPageLabel, size: size, shape: shape, variant: combined ? 'default' : variant, className: cn(combined && 'rounded-none border-0') }));
         }
         if (showPageInfo && combined) {
             return (jsxRuntime.jsx("span", { "aria-live": "polite", className: cn('inline-flex items-center px-3 font-sans text-foreground whitespace-nowrap', pageInfoSizes[size], sizeHeights[size]), children: pageInfo }));
@@ -28708,7 +28804,7 @@ const Pagination = ({ currentPage, totalPages, onPageChange, size = 'md', varian
     // ── Assemble ──────────────────────────────────────────────────────────────
     const coreContent = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [firstButton, prevButton, centerSlot(), pageList(), nextButton, lastButton] }));
     const coreGroup = combined ? (jsxRuntime.jsx("div", { className: combinedContainerClass, children: coreContent })) : (jsxRuntime.jsx(PaginationContent, { className: "gap-1", children: coreContent }));
-    return (jsxRuntime.jsxs("nav", { "aria-label": paginationA11y.navLabel, "aria-roledescription": paginationA11y.pageInfoLabel(currentPage, totalPages), className: cn('inline-flex items-center gap-3 flex-wrap', className), children: [showPageInfo && !combined && (jsxRuntime.jsx("span", { "aria-live": "polite", className: cn('font-sans text-muted-foreground whitespace-nowrap', pageInfoSizes[size]), children: pageInfo })), coreGroup, showItemsPerPage && (jsxRuntime.jsx("select", { value: itemsPerPage, onChange: (e) => onItemsPerPageChange?.(Number(e.target.value)), "aria-label": paginationA11y.itemsPerPageLabel, className: cn(itemsPerPageVariants({ size, shape, variant })), children: itemsPerPageOptions.map((opt) => (jsxRuntime.jsxs("option", { value: opt, children: [opt, "/page"] }, opt))) }))] }));
+    return (jsxRuntime.jsxs("nav", { "aria-label": paginationA11y.navLabel, "aria-roledescription": paginationA11y.pageInfoLabel(currentPage, totalPages), className: cn('inline-flex items-center gap-3 flex-wrap', className), children: [showPageInfo && !combined && (jsxRuntime.jsx("span", { "aria-live": "polite", className: cn('font-sans text-muted-foreground whitespace-nowrap', pageInfoSizes[size]), children: pageInfo })), coreGroup, showItemsPerPage && (jsxRuntime.jsx(PaginationSelect, { value: itemsPerPage ?? itemsPerPageOptions[0], options: buildItemsPerPageOptions(itemsPerPageOptions), onChange: (next) => onItemsPerPageChange?.(next), ariaLabel: paginationA11y.itemsPerPageLabel, size: size, shape: shape, variant: variant }))] }));
 };
 
 /**
@@ -57032,8 +57128,35 @@ TableHead.displayName = 'TableHead';
 const TableCell = React__namespace.forwardRef(({ className, ...props }, ref) => (jsxRuntime.jsx("td", { ref: ref, className: cn('px-4 py-2 text-sm text-foreground', className), ...props })));
 TableCell.displayName = 'TableCell';
 
+// Varied per-column widths for a natural, non-rigid look.
+const CELL_WIDTHS = ['70%', '50%', '65%', '45%', '60%', '55%'];
+const cellWidth = (col, cols) => {
+    if (col === 0)
+        return '80%';
+    if (col === cols - 1)
+        return '40%';
+    return CELL_WIDTHS[col % CELL_WIDTHS.length];
+};
 /** Loading placeholder for a data table: shimmering header + body cells. */
-const ShimmerTable = ({ columnCount = 5, rowCount = 5, enableSelection = false, }) => (jsxRuntime.jsx("div", { className: "w-full h-full overflow-auto rounded bg-card", children: jsxRuntime.jsxs(Table, { children: [jsxRuntime.jsx(TableHeader, { className: "sticky top-0 z-10 bg-background", children: jsxRuntime.jsxs(TableRow, { children: [enableSelection && (jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(SquareSkeleton, { width: 16, height: 16, rounded: "sm" }) })), Array.from({ length: columnCount }).map((_, i) => (jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(SquareSkeleton, { width: 80, height: 16, rounded: "sm" }) }, i)))] }) }), jsxRuntime.jsx(TableBody, { children: Array.from({ length: rowCount }).map((_, rowIndex) => (jsxRuntime.jsxs(TableRow, { children: [enableSelection && (jsxRuntime.jsx(TableCell, { children: jsxRuntime.jsx(SquareSkeleton, { width: 16, height: 16, rounded: "sm" }) })), Array.from({ length: columnCount }).map((_, colIndex) => (jsxRuntime.jsx(TableCell, { children: jsxRuntime.jsx(SquareSkeleton, { width: 96, height: 16, rounded: "sm" }) }, colIndex)))] }, rowIndex))) })] }) }));
+const ShimmerTable = ({ columnCount = 5, rowCount = 8, enableSelection = false, }) => (jsxRuntime.jsx("div", { className: "h-full w-full overflow-auto rounded-lg border border-border bg-card", children: jsxRuntime.jsxs(Table, { children: [jsxRuntime.jsx(TableHeader, { className: "sticky top-0 z-10 bg-muted/40", children: jsxRuntime.jsxs(TableRow, { className: "hover:bg-transparent", children: [enableSelection && (jsxRuntime.jsx(TableHead, { className: "w-10", children: jsxRuntime.jsx(SquareSkeleton, { width: 16, height: 16, rounded: "sm" }) })), Array.from({ length: columnCount }).map((_, i) => (jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(SquareSkeleton, { width: "45%", height: 10, rounded: "full" }) }, i)))] }) }), jsxRuntime.jsx(TableBody, { children: Array.from({ length: rowCount }).map((_, rowIndex) => (jsxRuntime.jsxs(TableRow, { className: "hover:bg-transparent", children: [enableSelection && (jsxRuntime.jsx(TableCell, { children: jsxRuntime.jsx(SquareSkeleton, { width: 16, height: 16, rounded: "sm" }) })), Array.from({ length: columnCount }).map((_, colIndex) => (jsxRuntime.jsx(TableCell, { children: jsxRuntime.jsx(SquareSkeleton, { width: cellWidth(colIndex, columnCount), height: 12, rounded: "full" }) }, colIndex)))] }, rowIndex))) })] }) }));
+
+/**
+ * Gives a `forwardRef` component its own readable ref to the DOM node while
+ * still honouring the ref handed down by the parent.
+ */
+function useForwardedRef(forwardedRef) {
+    const innerRef = React.useRef(null);
+    const setRef = React.useCallback((node) => {
+        innerRef.current = node;
+        if (typeof forwardedRef === 'function') {
+            forwardedRef(node);
+        }
+        else if (forwardedRef) {
+            forwardedRef.current = node;
+        }
+    }, [forwardedRef]);
+    return [innerRef, setRef];
+}
 
 const MOBILE_MAX = 767;
 const TABLET_MAX = 1025;
@@ -57057,12 +57180,67 @@ function useIsTablet() {
     return useMediaQuery(`(min-width: ${MOBILE_MAX + 1}px) and (max-width: ${TABLET_MAX}px)`);
 }
 
+// Sub-pixel layout rounding makes scrollWidth exceed clientWidth by a hair on
+// labels that are not actually clipped.
+const OVERFLOW_TOLERANCE_PX = 1;
+function findClippedLabel(root) {
+    const spans = root.querySelectorAll(':scope > span');
+    for (const span of Array.from(spans)) {
+        if (span.scrollWidth > span.clientWidth + OVERFLOW_TOLERANCE_PX) {
+            return span;
+        }
+    }
+    return null;
+}
+/**
+ * Returns the full text of the first direct-child `<span>` of `ref` that is
+ * clipped by its container (i.e. showing an ellipsis), else `null` — so callers
+ * can surface a tooltip only when the label is actually unreadable.
+ *
+ * Re-measures on element resize (sidebar expand/collapse, window resize) and on
+ * label text changes.
+ */
+function useTruncatedText(ref) {
+    const [text, setText] = React.useState(null);
+    React.useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        let frame = 0;
+        const measure = () => {
+            const label = findClippedLabel(el);
+            setText(label?.textContent?.trim() || null);
+        };
+        const schedule = () => {
+            cancelAnimationFrame(frame);
+            frame = requestAnimationFrame(measure);
+        };
+        schedule();
+        const resizeObserver = new ResizeObserver(schedule);
+        resizeObserver.observe(el);
+        const mutationObserver = new MutationObserver(schedule);
+        mutationObserver.observe(el, {
+            characterData: true,
+            childList: true,
+            subtree: true,
+        });
+        return () => {
+            cancelAnimationFrame(frame);
+            resizeObserver.disconnect();
+            mutationObserver.disconnect();
+        };
+    }, [ref]);
+    return text;
+}
+
 const SIDEBAR_COOKIE_NAME = 'sidebar_state';
 const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 const SIDEBAR_WIDTH = '16rem';
 const SIDEBAR_WIDTH_MOBILE = '18rem';
 const SIDEBAR_WIDTH_ICON = '68px';
 const SIDEBAR_KEYBOARD_SHORTCUT = 'b';
+/** Tooltip surfacing a clipped label: wraps instead of being clipped itself. */
+const TRUNCATION_TOOLTIP_CLASS = 'max-w-[280px] whitespace-normal break-words';
 const SidebarContext = React__namespace.createContext(null);
 function useSidebar() {
     const context = React__namespace.useContext(SidebarContext);
@@ -57185,7 +57363,7 @@ const SidebarMenu = React__namespace.forwardRef(({ className, ...props }, ref) =
 SidebarMenu.displayName = 'SidebarMenu';
 const SidebarMenuItem = React__namespace.forwardRef(({ className, ...props }, ref) => (jsxRuntime.jsx("li", { ref: ref, "data-sidebar": "menu-item", className: cn('group/menu-item relative', className), ...props })));
 SidebarMenuItem.displayName = 'SidebarMenuItem';
-const sidebarMenuButtonVariants = cva('peer/menu-button relative flex h-9 w-full cursor-pointer items-center gap-2 overflow-hidden rounded-sm px-2.5 py-1.5 text-left text-sm text-sidebar-foreground outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-active-bg data-[active=true]:text-sidebar-foreground data-[state=open]:hover:bg-sidebar-active-bg data-[state=open]:hover:text-sidebar-foreground group-data-[collapsible=icon]:!size-9 group-data-[collapsible=icon]:!p-2 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:[&>span]:hidden [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', {
+const sidebarMenuButtonVariants = cva('peer/menu-button relative flex h-9 w-full cursor-pointer items-center gap-2 overflow-hidden rounded-sm px-2.5 py-1.5 text-left text-sm text-sidebar-foreground outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-active-bg data-[active=true]:text-sidebar-foreground data-[state=open]:hover:bg-sidebar-active-bg data-[state=open]:hover:text-sidebar-foreground group-data-[collapsible=icon]:!size-9 group-data-[collapsible=icon]:!p-2 group-data-[collapsible=icon]:justify-center group-data-[collapsible=icon]:[&>span]:hidden [&>span]:truncate [&>svg]:size-4 [&>svg]:shrink-0', {
     variants: {
         variant: {
             default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
@@ -57205,12 +57383,15 @@ const sidebarMenuButtonVariants = cva('peer/menu-button relative flex h-9 w-full
 const SidebarMenuButton = React__namespace.forwardRef(({ asChild = false, isActive = false, variant = 'default', size = 'default', tooltip, className, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : 'button';
     const { state } = useSidebar();
-    const button = (jsxRuntime.jsx(Comp, { ref: ref, "data-sidebar": "menu-button", "data-size": size, "data-active": isActive, className: cn(sidebarMenuButtonVariants({ variant, size }), className), ...props }));
-    if (!tooltip || state !== 'collapsed') {
-        return button;
-    }
-    const tooltipProps = typeof tooltip === 'string' ? { children: tooltip } : tooltip;
-    return (jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: button }), jsxRuntime.jsx(TooltipContent, { side: "right", align: "center", ...tooltipProps })] }));
+    const [innerRef, setRef] = useForwardedRef(ref);
+    const truncatedText = useTruncatedText(innerRef);
+    const button = (jsxRuntime.jsx(Comp, { ref: setRef, "data-sidebar": "menu-button", "data-size": size, "data-active": isActive, className: cn(sidebarMenuButtonVariants({ variant, size }), className), ...props }));
+    // Tooltip when collapsed (icon-only) OR when the expanded label is clipped.
+    // The Tooltip structure stays mounted and only the content is conditional,
+    // so toggling it never remounts the button.
+    const collapsed = !!tooltip && state === 'collapsed';
+    const collapsedProps = typeof tooltip === 'string' ? { children: tooltip } : tooltip;
+    return (jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: button }), collapsed ? (jsxRuntime.jsx(TooltipContent, { side: "right", align: "center", className: TRUNCATION_TOOLTIP_CLASS, ...collapsedProps })) : truncatedText ? (jsxRuntime.jsx(TooltipContent, { side: "right", align: "center", className: TRUNCATION_TOOLTIP_CLASS, children: truncatedText })) : null] }));
 });
 SidebarMenuButton.displayName = 'SidebarMenuButton';
 const SidebarMenuAction = React__namespace.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
@@ -57232,7 +57413,11 @@ const SidebarMenuSubItem = React__namespace.forwardRef(({ className, ...props },
 SidebarMenuSubItem.displayName = 'SidebarMenuSubItem';
 const SidebarMenuSubButton = React__namespace.forwardRef(({ asChild = false, size = 'md', isActive, className, ...props }, ref) => {
     const Comp = asChild ? reactSlot.Slot : 'a';
-    return (jsxRuntime.jsx(Comp, { ref: ref, "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn('relative flex h-9 w-full min-w-0 items-center gap-2 overflow-hidden rounded-sm pl-3 pr-1 py-1.5 text-left text-sidebar-foreground/80 outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', 'data-[active=true]:bg-sidebar-primary data-[active=true]:text-sidebar-primary-foreground', size === 'sm' && 'text-xs', size === 'md' && 'text-sm', 'group-data-[collapsible=icon]:hidden', className), ...props }));
+    const [innerRef, setRef] = useForwardedRef(ref);
+    const truncatedText = useTruncatedText(innerRef);
+    const button = (jsxRuntime.jsx(Comp, { ref: setRef, "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn('relative flex h-9 w-full min-w-0 cursor-pointer items-center gap-2 overflow-hidden rounded-sm pl-3 pr-1 py-1.5 text-left text-sidebar-foreground/80 outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span]:truncate [&>svg]:size-4 [&>svg]:shrink-0', 'data-[active=true]:bg-sidebar-primary data-[active=true]:text-sidebar-primary-foreground', size === 'sm' && 'text-xs', size === 'md' && 'text-sm', 'group-data-[collapsible=icon]:hidden', className), ...props }));
+    // Keep the Tooltip mounted; render the content only when the label is clipped.
+    return (jsxRuntime.jsxs(Tooltip, { children: [jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: button }), truncatedText && (jsxRuntime.jsx(TooltipContent, { side: "right", align: "center", className: TRUNCATION_TOOLTIP_CLASS, children: truncatedText }))] }));
 });
 SidebarMenuSubButton.displayName = 'SidebarMenuSubButton';
 const Collapsible = CollapsiblePrimitive__namespace.Root;
@@ -64621,6 +64806,9 @@ m(x, "xOrds", ["e", "w"]), m(x, "yOrds", ["n", "s"]), m(x, "xyOrds", ["nw", "ne"
 });
 let S = x;
 
+var css_248z = "@keyframes marching-ants{0%{background-position:0 0,0 100%,0 0,100% 0}to{background-position:20px 0,-20px 100%,0 -20px,100% 20px}}:root{--rc-drag-handle-size:12px;--rc-drag-handle-mobile-size:24px;--rc-drag-handle-bg-colour:rgba(0,0,0,.2);--rc-drag-bar-size:6px;--rc-border-color:hsla(0,0%,100%,.7);--rc-focus-color:#08f}.ReactCrop{cursor:crosshair;display:inline-block;max-width:100%;position:relative}.ReactCrop *,.ReactCrop :after,.ReactCrop :before{box-sizing:border-box}.ReactCrop--disabled,.ReactCrop--locked{cursor:inherit}.ReactCrop__child-wrapper{max-height:inherit;overflow:hidden}.ReactCrop__child-wrapper>img,.ReactCrop__child-wrapper>video{display:block;max-height:inherit;max-width:100%}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection{touch-action:none}.ReactCrop__crop-mask{bottom:0;height:calc(100% + .5px);left:0;pointer-events:none;position:absolute;right:0;top:0;width:calc(100% + .5px)}.ReactCrop__crop-selection{cursor:move;left:0;position:absolute;top:0;transform:translateZ(0)}.ReactCrop--disabled .ReactCrop__crop-selection{cursor:inherit}.ReactCrop--circular-crop .ReactCrop__crop-selection{border-radius:50%}.ReactCrop--circular-crop .ReactCrop__crop-selection:after{border:1px solid var(--rc-border-color);bottom:-1px;content:\"\";left:-1px;opacity:.3;pointer-events:none;position:absolute;right:-1px;top:-1px}.ReactCrop--no-animate .ReactCrop__crop-selection{outline:1px dashed #fff}.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection){animation:marching-ants 1s;animation-iteration-count:infinite;animation-play-state:running;animation-timing-function:linear;background-image:linear-gradient(90deg,#fff 50%,#444 0),linear-gradient(90deg,#fff 50%,#444 0),linear-gradient(180deg,#fff 50%,#444 0),linear-gradient(180deg,#fff 50%,#444 0);background-position:0 0,0 100%,0 0,100% 0;background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;background-size:10px 1px,10px 1px,1px 10px,1px 10px;color:#fff}.ReactCrop__crop-selection:focus{outline:2px solid var(--rc-focus-color);outline-offset:-1px}.ReactCrop--invisible-crop .ReactCrop__crop-mask,.ReactCrop--invisible-crop .ReactCrop__crop-selection{display:none}.ReactCrop__rule-of-thirds-hz:after,.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-vt:after,.ReactCrop__rule-of-thirds-vt:before{background-color:#fff6;content:\"\";display:block;position:absolute}.ReactCrop__rule-of-thirds-vt:after,.ReactCrop__rule-of-thirds-vt:before{height:100%;width:1px}.ReactCrop__rule-of-thirds-vt:before{left:33.3333333333%}.ReactCrop__rule-of-thirds-vt:after{left:66.6666666667%}.ReactCrop__rule-of-thirds-hz:after,.ReactCrop__rule-of-thirds-hz:before{height:1px;width:100%}.ReactCrop__rule-of-thirds-hz:before{top:33.3333333333%}.ReactCrop__rule-of-thirds-hz:after{top:66.6666666667%}.ReactCrop__drag-handle{background-color:var(--rc-drag-handle-bg-colour);border:1px solid var(--rc-border-color);height:var(--rc-drag-handle-size);position:absolute;width:var(--rc-drag-handle-size)}.ReactCrop__drag-handle:focus{background:var(--rc-focus-color)}.ReactCrop .ord-nw{cursor:nw-resize;left:0;top:0;transform:translate(-50%,-50%)}.ReactCrop .ord-n{cursor:n-resize;left:50%;top:0;transform:translate(-50%,-50%)}.ReactCrop .ord-ne{cursor:ne-resize;top:0}.ReactCrop .ord-e,.ReactCrop .ord-ne{right:0;transform:translate(50%,-50%)}.ReactCrop .ord-e{cursor:e-resize;top:50%}.ReactCrop .ord-se{bottom:0;cursor:se-resize;right:0;transform:translate(50%,50%)}.ReactCrop .ord-s{cursor:s-resize;left:50%}.ReactCrop .ord-s,.ReactCrop .ord-sw{bottom:0;transform:translate(-50%,50%)}.ReactCrop .ord-sw{cursor:sw-resize;left:0}.ReactCrop .ord-w{cursor:w-resize;left:0;top:50%;transform:translate(-50%,-50%)}.ReactCrop__disabled .ReactCrop__drag-handle{cursor:inherit}.ReactCrop__drag-bar{position:absolute}.ReactCrop__drag-bar.ord-n{height:var(--rc-drag-bar-size);left:0;top:0;transform:translateY(-50%);width:100%}.ReactCrop__drag-bar.ord-e{height:100%;right:0;top:0;transform:translate(50%);width:var(--rc-drag-bar-size)}.ReactCrop__drag-bar.ord-s{bottom:0;height:var(--rc-drag-bar-size);left:0;transform:translateY(50%);width:100%}.ReactCrop__drag-bar.ord-w{height:100%;left:0;top:0;transform:translate(-50%);width:var(--rc-drag-bar-size)}.ReactCrop--fixed-aspect .ReactCrop__drag-bar,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w,.ReactCrop--new-crop .ReactCrop__drag-bar,.ReactCrop--new-crop .ReactCrop__drag-handle{display:none}@media (pointer:coarse){.ReactCrop .ord-e,.ReactCrop .ord-n,.ReactCrop .ord-s,.ReactCrop .ord-w{display:none}.ReactCrop__drag-handle{height:var(--rc-drag-handle-mobile-size);width:var(--rc-drag-handle-mobile-size)}}";
+styleInject(css_248z);
+
 const ASPECTS = [
     {
         key: 'freeform',
@@ -67463,6 +67651,7 @@ exports.PROFORMA_AUDIT_CONFIG = PROFORMA_AUDIT_CONFIG;
 exports.PageHeader = PageHeader;
 exports.PageTabs = PageTabs;
 exports.Pagination = Pagination;
+exports.PaginationSelect = PaginationSelect;
 exports.PartnerShareCard = PartnerShareCard;
 exports.PriceInput = PriceInput;
 exports.Protected = Protected;