@l3mpire/ui 2.19.1 → 2.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/USAGE.md +1 -1
- package/dist/index.d.mts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +195 -125
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +195 -125
- package/dist/index.mjs.map +1 -1
- package/package.json +5 -5
- package/src/styles/globals.css +1 -0
package/dist/index.js
CHANGED
|
@@ -207,7 +207,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
207
207
|
var badgeVariants = (0, import_class_variance_authority.cva)(
|
|
208
208
|
[
|
|
209
209
|
"inline-flex items-center justify-center whitespace-nowrap",
|
|
210
|
-
"font-
|
|
210
|
+
"font-medium",
|
|
211
211
|
"border border-transparent"
|
|
212
212
|
],
|
|
213
213
|
{
|
|
@@ -296,7 +296,7 @@ var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
|
296
296
|
var buttonVariants = (0, import_class_variance_authority2.cva)(
|
|
297
297
|
[
|
|
298
298
|
"inline-flex items-center justify-center whitespace-nowrap",
|
|
299
|
-
"font-
|
|
299
|
+
"font-medium transition-colors",
|
|
300
300
|
"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
|
|
301
301
|
"disabled:pointer-events-none",
|
|
302
302
|
"border",
|
|
@@ -600,7 +600,7 @@ var BrowserTabItem = React3.forwardRef(
|
|
|
600
600
|
},
|
|
601
601
|
onClick: (e) => e.stopPropagation(),
|
|
602
602
|
className: cn(
|
|
603
|
-
"text-sm font-
|
|
603
|
+
"text-sm font-medium leading-sm bg-transparent outline-none p-0 m-0",
|
|
604
604
|
"border-b border-browser-tab-item-border border-dashed border-t-0 border-l-0 border-r-0",
|
|
605
605
|
isActive ? "text-browser-tab-item-active-text" : "text-browser-tab-item-inactive-text"
|
|
606
606
|
),
|
|
@@ -610,7 +610,7 @@ var BrowserTabItem = React3.forwardRef(
|
|
|
610
610
|
"span",
|
|
611
611
|
{
|
|
612
612
|
className: cn(
|
|
613
|
-
"text-sm font-
|
|
613
|
+
"text-sm font-medium leading-sm whitespace-nowrap",
|
|
614
614
|
isActive ? "text-browser-tab-item-active-text" : "text-browser-tab-item-inactive-text"
|
|
615
615
|
),
|
|
616
616
|
onDoubleClick: (e) => {
|
|
@@ -799,7 +799,7 @@ var BrowserTab = React3.forwardRef(
|
|
|
799
799
|
"span",
|
|
800
800
|
{
|
|
801
801
|
className: cn(
|
|
802
|
-
"text-sm font-
|
|
802
|
+
"text-sm font-medium leading-sm whitespace-nowrap",
|
|
803
803
|
item.isActive ? "text-browser-tab-item-active-text" : "text-browser-tab-item-inactive-text"
|
|
804
804
|
),
|
|
805
805
|
children: item.label
|
|
@@ -843,8 +843,8 @@ var import_icons4 = require("@l3mpire/icons");
|
|
|
843
843
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
844
844
|
var textSm = "text-sm font-regular leading-sm";
|
|
845
845
|
var textXs = "text-xs font-regular leading-xs";
|
|
846
|
-
var textXsMedium = "text-xs font-
|
|
847
|
-
var textSmMedium = "text-sm font-
|
|
846
|
+
var textXsMedium = "text-xs font-medium leading-xs";
|
|
847
|
+
var textSmMedium = "text-sm font-medium leading-sm";
|
|
848
848
|
var containerStyle = [
|
|
849
849
|
"flex flex-col gap-base overflow-clip",
|
|
850
850
|
"bg-dropdown-bg",
|
|
@@ -1268,7 +1268,7 @@ var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
|
1268
1268
|
var linkVariants = (0, import_class_variance_authority4.cva)(
|
|
1269
1269
|
[
|
|
1270
1270
|
"inline-flex items-center",
|
|
1271
|
-
"font-
|
|
1271
|
+
"font-medium",
|
|
1272
1272
|
"transition-colors cursor-pointer",
|
|
1273
1273
|
"disabled:pointer-events-none",
|
|
1274
1274
|
"[&_svg]:pointer-events-none [&_svg]:shrink-0"
|
|
@@ -1400,7 +1400,7 @@ var InputLabel = React8.forwardRef(({ className, type = "default", disabled, inf
|
|
|
1400
1400
|
className: cn(
|
|
1401
1401
|
"inline-flex items-center gap-xs",
|
|
1402
1402
|
"text-xs",
|
|
1403
|
-
"font-
|
|
1403
|
+
"font-medium",
|
|
1404
1404
|
"leading-xs",
|
|
1405
1405
|
textColor2,
|
|
1406
1406
|
className
|
|
@@ -1472,7 +1472,7 @@ var typeIconMap = {
|
|
|
1472
1472
|
warning: { icon: import_icons8.faTriangleExclamationSolid, color: "text-info-message-warning-icon" },
|
|
1473
1473
|
empty: { icon: import_icons8.faCircleInfoSolid, color: "text-info-message-empty-icon" }
|
|
1474
1474
|
};
|
|
1475
|
-
var titleStyle = "text-sm font-
|
|
1475
|
+
var titleStyle = "text-sm font-medium leading-sm text-info-message-title";
|
|
1476
1476
|
var descriptionStyle = "text-xs font-regular leading-xs text-info-message-description";
|
|
1477
1477
|
var closeButtonStyle = "inline-flex shrink-0 items-center justify-center p-xs rounded-base text-info-message-close hover:bg-black/5 transition-colors";
|
|
1478
1478
|
var typeLinkIntentMap = {
|
|
@@ -1570,7 +1570,7 @@ var typeIconMap2 = {
|
|
|
1570
1570
|
alert: { icon: import_icons9.faCircleExclamationSolid, color: "text-toast-alert-icon" },
|
|
1571
1571
|
warning: { icon: import_icons9.faTriangleExclamationSolid, color: "text-toast-warning-icon" }
|
|
1572
1572
|
};
|
|
1573
|
-
var titleStyle2 = "text-sm font-
|
|
1573
|
+
var titleStyle2 = "text-sm font-medium leading-sm text-toast-title";
|
|
1574
1574
|
var subtitleStyle = "text-sm font-regular leading-sm text-toast-subtitle";
|
|
1575
1575
|
var closeButtonStyle2 = "inline-flex shrink-0 items-center justify-center self-start p-sm rounded-md text-toast-close hover:bg-black/5 transition-colors";
|
|
1576
1576
|
var ToastProvider = ToastPrimitive.Provider;
|
|
@@ -1645,7 +1645,7 @@ var trackStyles = {
|
|
|
1645
1645
|
]
|
|
1646
1646
|
};
|
|
1647
1647
|
var thumbStyle = "pointer-events-none block rounded-full size-3 translate-x-0.5 bg-switch-thumb-bg shadow-md transition-transform data-[state=checked]:translate-x-[13px]";
|
|
1648
|
-
var labelBase = "cursor-pointer select-none text-sm font-
|
|
1648
|
+
var labelBase = "cursor-pointer select-none text-sm font-medium leading-sm";
|
|
1649
1649
|
var labelColor = {
|
|
1650
1650
|
default: "text-switch-label-text",
|
|
1651
1651
|
disabled: "pointer-events-none text-switch-label-disabled"
|
|
@@ -2190,7 +2190,7 @@ var Avatar = React15.forwardRef(({ className, size = "xl", shape = "rounded", sr
|
|
|
2190
2190
|
{
|
|
2191
2191
|
delayMs: 0,
|
|
2192
2192
|
className: cn(
|
|
2193
|
-
"font-
|
|
2193
|
+
"font-medium",
|
|
2194
2194
|
"text-avatar-fallback-text",
|
|
2195
2195
|
"select-none text-center",
|
|
2196
2196
|
initialsFontSize[size ?? "xl"]
|
|
@@ -2239,7 +2239,7 @@ var iconStyle = {
|
|
|
2239
2239
|
default: "text-checkbox-checked-icon",
|
|
2240
2240
|
disabled: "text-checkbox-disabled-icon"
|
|
2241
2241
|
};
|
|
2242
|
-
var labelBase2 = "cursor-pointer select-none overflow-hidden text-ellipsis whitespace-nowrap text-sm font-
|
|
2242
|
+
var labelBase2 = "cursor-pointer select-none overflow-hidden text-ellipsis whitespace-nowrap text-sm font-medium leading-sm";
|
|
2243
2243
|
var labelColor2 = {
|
|
2244
2244
|
default: "text-checkbox-label-default",
|
|
2245
2245
|
disabled: "pointer-events-none text-checkbox-label-disabled"
|
|
@@ -2327,7 +2327,7 @@ var dotStyle = {
|
|
|
2327
2327
|
default: "bg-radio-selected-dot",
|
|
2328
2328
|
disabled: "bg-radio-disabled-dot"
|
|
2329
2329
|
};
|
|
2330
|
-
var labelBase3 = "cursor-pointer select-none overflow-hidden text-ellipsis whitespace-nowrap text-sm font-
|
|
2330
|
+
var labelBase3 = "cursor-pointer select-none overflow-hidden text-ellipsis whitespace-nowrap text-sm font-medium leading-sm";
|
|
2331
2331
|
var labelColor3 = {
|
|
2332
2332
|
default: "text-radio-label-default",
|
|
2333
2333
|
disabled: "pointer-events-none text-radio-label-disabled"
|
|
@@ -2396,7 +2396,7 @@ var SidebarHeadingItem = React18.forwardRef(
|
|
|
2396
2396
|
ref,
|
|
2397
2397
|
className: cn(
|
|
2398
2398
|
"flex items-center w-full",
|
|
2399
|
-
"text-xs leading-xs font-
|
|
2399
|
+
"text-xs leading-xs font-medium text-sidebar-heading-text mb-base",
|
|
2400
2400
|
className
|
|
2401
2401
|
),
|
|
2402
2402
|
...props,
|
|
@@ -2486,7 +2486,7 @@ var SidebarItem = React19.forwardRef(
|
|
|
2486
2486
|
"span",
|
|
2487
2487
|
{
|
|
2488
2488
|
className: cn(
|
|
2489
|
-
"flex-1 min-w-0 truncate text-sm leading-sm font-
|
|
2489
|
+
"flex-1 min-w-0 truncate text-sm leading-sm font-medium",
|
|
2490
2490
|
textColorClass
|
|
2491
2491
|
),
|
|
2492
2492
|
children: label
|
|
@@ -2574,7 +2574,7 @@ var iconColor = {
|
|
|
2574
2574
|
};
|
|
2575
2575
|
var errorGuidance = {
|
|
2576
2576
|
icon: "shrink-0 text-select-error-icon",
|
|
2577
|
-
text: "text-xs font-
|
|
2577
|
+
text: "text-xs font-medium leading-xs text-select-error-text"
|
|
2578
2578
|
};
|
|
2579
2579
|
function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
2580
2580
|
const containerRef = React20.useRef(null);
|
|
@@ -2619,7 +2619,7 @@ function SelectChips({ tags, onTagRemove, chipHeightPx }) {
|
|
|
2619
2619
|
"inline-flex items-center gap-xs shrink-0",
|
|
2620
2620
|
"px-sm rounded-base",
|
|
2621
2621
|
"bg-tag-neutral-bg text-tag-neutral-text",
|
|
2622
|
-
"text-xs font-
|
|
2622
|
+
"text-xs font-medium leading-xs",
|
|
2623
2623
|
"whitespace-nowrap"
|
|
2624
2624
|
);
|
|
2625
2625
|
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-1 items-center gap-xs min-w-0 overflow-hidden relative", children: [
|
|
@@ -2783,11 +2783,6 @@ var Select = React20.forwardRef(
|
|
|
2783
2783
|
children: hasValue ? value : placeholder
|
|
2784
2784
|
}
|
|
2785
2785
|
),
|
|
2786
|
-
!hasTags && multiCount != null && multiCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "shrink-0 text-xs leading-normal text-select-text-multi", children: [
|
|
2787
|
-
"+",
|
|
2788
|
-
multiCount,
|
|
2789
|
-
" others"
|
|
2790
|
-
] }),
|
|
2791
2786
|
/* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
2792
2787
|
import_icons14.Icon,
|
|
2793
2788
|
{
|
|
@@ -2869,7 +2864,7 @@ var TabTrigger = React21.forwardRef(({ className, badge, children, ...props }, r
|
|
|
2869
2864
|
"span",
|
|
2870
2865
|
{
|
|
2871
2866
|
className: cn(
|
|
2872
|
-
"text-sm font-
|
|
2867
|
+
"text-sm font-medium leading-sm whitespace-nowrap",
|
|
2873
2868
|
"text-tab-item-default-text",
|
|
2874
2869
|
"group-data-[state=active]:text-tab-item-active-text"
|
|
2875
2870
|
),
|
|
@@ -2903,7 +2898,7 @@ var tagVariants = (0, import_class_variance_authority12.cva)(
|
|
|
2903
2898
|
"inline-flex items-center",
|
|
2904
2899
|
"gap-xs",
|
|
2905
2900
|
"rounded-base",
|
|
2906
|
-
"font-
|
|
2901
|
+
"font-medium",
|
|
2907
2902
|
"whitespace-nowrap"
|
|
2908
2903
|
],
|
|
2909
2904
|
{
|
|
@@ -3008,7 +3003,7 @@ var fieldStates = {
|
|
|
3008
3003
|
};
|
|
3009
3004
|
var errorGuidance2 = {
|
|
3010
3005
|
icon: "shrink-0 text-textarea-error-icon",
|
|
3011
|
-
text: "text-xs font-
|
|
3006
|
+
text: "text-xs font-medium leading-xs text-textarea-error-text"
|
|
3012
3007
|
};
|
|
3013
3008
|
var charLimitStyle = "shrink-0 text-right text-xs font-regular leading-xs text-textarea-char-limit";
|
|
3014
3009
|
function resolveState(error, success, disabled) {
|
|
@@ -3135,7 +3130,7 @@ var attachedButtonStyles = {
|
|
|
3135
3130
|
};
|
|
3136
3131
|
var errorGuidance3 = {
|
|
3137
3132
|
icon: "shrink-0 text-text-input-error-icon",
|
|
3138
|
-
text: "text-xs font-
|
|
3133
|
+
text: "text-xs font-medium leading-xs text-text-input-error-text"
|
|
3139
3134
|
};
|
|
3140
3135
|
function resolveState2(error, success, disabled) {
|
|
3141
3136
|
if (disabled) return "disabled";
|
|
@@ -3299,12 +3294,12 @@ var chipStyle = [
|
|
|
3299
3294
|
"inline-flex items-center gap-xs shrink-0",
|
|
3300
3295
|
"h-6 px-sm rounded-base",
|
|
3301
3296
|
"bg-tag-neutral-bg text-tag-neutral-text",
|
|
3302
|
-
"text-xs font-
|
|
3297
|
+
"text-xs font-medium leading-xs",
|
|
3303
3298
|
"whitespace-nowrap"
|
|
3304
3299
|
];
|
|
3305
3300
|
var errorGuidance4 = {
|
|
3306
3301
|
icon: "shrink-0 text-text-input-error-icon",
|
|
3307
|
-
text: "text-xs font-
|
|
3302
|
+
text: "text-xs font-medium leading-xs text-text-input-error-text"
|
|
3308
3303
|
};
|
|
3309
3304
|
var ChipInput = React25.forwardRef(
|
|
3310
3305
|
({
|
|
@@ -3494,7 +3489,7 @@ var wrapperStates3 = {
|
|
|
3494
3489
|
};
|
|
3495
3490
|
var errorGuidance5 = {
|
|
3496
3491
|
icon: "shrink-0 text-text-input-error-icon",
|
|
3497
|
-
text: "text-xs font-
|
|
3492
|
+
text: "text-xs font-medium leading-xs text-text-input-error-text"
|
|
3498
3493
|
};
|
|
3499
3494
|
var NumberInput = React26.forwardRef(
|
|
3500
3495
|
({
|
|
@@ -3675,6 +3670,7 @@ var typographyVariants = (0, import_class_variance_authority16.cva)("", {
|
|
|
3675
3670
|
},
|
|
3676
3671
|
weight: {
|
|
3677
3672
|
regular: "font-regular",
|
|
3673
|
+
medium: "font-medium",
|
|
3678
3674
|
semibold: "font-semibold",
|
|
3679
3675
|
bold: "font-bold"
|
|
3680
3676
|
}
|
|
@@ -3695,12 +3691,14 @@ var defaultElementMap = {
|
|
|
3695
3691
|
};
|
|
3696
3692
|
var Typography = React27.forwardRef(
|
|
3697
3693
|
({ className, variant = "md", weight, as, asChild = false, ...props }, ref) => {
|
|
3694
|
+
const isHeading = variant === "h1" || variant === "h2" || variant === "h3";
|
|
3695
|
+
const resolvedWeight = weight ?? (isHeading ? "semibold" : "regular");
|
|
3698
3696
|
const Comp = asChild ? import_react_slot3.Slot : as ?? defaultElementMap[variant ?? "md"] ?? "p";
|
|
3699
3697
|
return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
3700
3698
|
Comp,
|
|
3701
3699
|
{
|
|
3702
3700
|
ref,
|
|
3703
|
-
className: cn(typographyVariants({ variant, weight }), className),
|
|
3701
|
+
className: cn(typographyVariants({ variant, weight: resolvedWeight }), className),
|
|
3704
3702
|
...props
|
|
3705
3703
|
}
|
|
3706
3704
|
);
|
|
@@ -3741,7 +3739,7 @@ var UserMenuInfoRow = React28.forwardRef(
|
|
|
3741
3739
|
children: [
|
|
3742
3740
|
avatar,
|
|
3743
3741
|
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-1 flex-col min-w-0", children: [
|
|
3744
|
-
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-sm font-
|
|
3742
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-sm font-medium leading-sm text-user-menu-name truncate", children: name }),
|
|
3745
3743
|
subtitle && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-xs font-regular leading-xs text-user-menu-subtitle truncate", children: subtitle })
|
|
3746
3744
|
] }),
|
|
3747
3745
|
action
|
|
@@ -3850,7 +3848,7 @@ var ModalTitle = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
3850
3848
|
DialogPrimitive.Title,
|
|
3851
3849
|
{
|
|
3852
3850
|
ref,
|
|
3853
|
-
className: cn("text-base font-
|
|
3851
|
+
className: cn("text-base font-medium leading-base text-modal-header-title", className),
|
|
3854
3852
|
...props
|
|
3855
3853
|
}
|
|
3856
3854
|
));
|
|
@@ -4012,7 +4010,7 @@ var EmptyState = React31.forwardRef(
|
|
|
4012
4010
|
"p",
|
|
4013
4011
|
{
|
|
4014
4012
|
className: cn(
|
|
4015
|
-
"font-
|
|
4013
|
+
"font-medium text-table-cell-text-primary",
|
|
4016
4014
|
isMd ? "text-base leading-base" : "text-sm leading-sm"
|
|
4017
4015
|
),
|
|
4018
4016
|
children: title
|
|
@@ -4081,7 +4079,7 @@ var AvatarCell = ({
|
|
|
4081
4079
|
}) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cn("flex items-center gap-md", className), children: [
|
|
4082
4080
|
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Avatar, { initials: getInitials(name), src, alt: name, size: "lg", shape: "rounded" }),
|
|
4083
4081
|
/* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex flex-col", children: [
|
|
4084
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-sm font-
|
|
4082
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-sm font-medium text-table-cell-text-primary leading-sm", children: name }),
|
|
4085
4083
|
subtitle && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-xs font-regular text-table-cell-text-secondary leading-xs", children: subtitle })
|
|
4086
4084
|
] })
|
|
4087
4085
|
] });
|
|
@@ -4119,7 +4117,7 @@ var NumberCell = ({
|
|
|
4119
4117
|
className
|
|
4120
4118
|
),
|
|
4121
4119
|
children: [
|
|
4122
|
-
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-sm font-
|
|
4120
|
+
/* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-sm font-medium text-table-cell-text-primary", children: formatted }),
|
|
4123
4121
|
secondaryStat && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
4124
4122
|
"span",
|
|
4125
4123
|
{
|
|
@@ -4187,7 +4185,7 @@ var TextCell = ({
|
|
|
4187
4185
|
{
|
|
4188
4186
|
className: cn(
|
|
4189
4187
|
"text-sm",
|
|
4190
|
-
secondary ? "font-regular text-table-cell-text-secondary" : "font-
|
|
4188
|
+
secondary ? "font-regular text-table-cell-text-secondary" : "font-medium text-table-cell-text-primary",
|
|
4191
4189
|
className
|
|
4192
4190
|
),
|
|
4193
4191
|
children: value
|
|
@@ -4236,7 +4234,7 @@ var EditableCell = ({
|
|
|
4236
4234
|
{
|
|
4237
4235
|
ref: inputRef,
|
|
4238
4236
|
className: cn(
|
|
4239
|
-
"w-full bg-transparent text-sm font-
|
|
4237
|
+
"w-full bg-transparent text-sm font-medium text-table-cell-text-primary",
|
|
4240
4238
|
"outline-none border-b border-table-border py-0 h-[20px]",
|
|
4241
4239
|
className
|
|
4242
4240
|
),
|
|
@@ -4253,7 +4251,7 @@ var EditableCell = ({
|
|
|
4253
4251
|
role: "button",
|
|
4254
4252
|
tabIndex: 0,
|
|
4255
4253
|
className: cn(
|
|
4256
|
-
"text-sm font-
|
|
4254
|
+
"text-sm font-medium text-table-cell-text-primary cursor-text leading-sm h-[20px] inline-block",
|
|
4257
4255
|
className
|
|
4258
4256
|
),
|
|
4259
4257
|
onDoubleClick: () => setIsEditing(true),
|
|
@@ -4319,7 +4317,7 @@ var TableFooter = React33.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
4319
4317
|
{
|
|
4320
4318
|
ref,
|
|
4321
4319
|
className: cn(
|
|
4322
|
-
"border-t border-table-border bg-table-bg font-
|
|
4320
|
+
"border-t border-table-border bg-table-bg font-medium",
|
|
4323
4321
|
className
|
|
4324
4322
|
),
|
|
4325
4323
|
...props
|
|
@@ -4345,7 +4343,7 @@ var TableHead = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
4345
4343
|
{
|
|
4346
4344
|
ref,
|
|
4347
4345
|
className: cn(
|
|
4348
|
-
"group/head h-10 px-md py-md text-left align-middle text-xs font-
|
|
4346
|
+
"group/head h-10 px-md py-md text-left align-middle text-xs font-medium leading-xs",
|
|
4349
4347
|
"text-table-head-text bg-table-head-bg-default",
|
|
4350
4348
|
"hover:bg-table-head-bg-hover",
|
|
4351
4349
|
"border-b border-r border-table-border last:border-r-0",
|
|
@@ -4361,7 +4359,7 @@ var TableCell = React33.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
4361
4359
|
{
|
|
4362
4360
|
ref,
|
|
4363
4361
|
className: cn(
|
|
4364
|
-
"px-md py-md align-middle text-sm font-
|
|
4362
|
+
"px-md py-md align-middle text-sm font-medium max-h-[52px]",
|
|
4365
4363
|
"text-table-cell-text-primary",
|
|
4366
4364
|
"border-b border-r border-table-border last:border-r-0",
|
|
4367
4365
|
"[&:has([role=checkbox])]:pr-0",
|
|
@@ -4460,7 +4458,7 @@ function ColumnFilterPopover({
|
|
|
4460
4458
|
),
|
|
4461
4459
|
onClick: (e) => e.stopPropagation(),
|
|
4462
4460
|
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col gap-sm", children: [
|
|
4463
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-xs font-
|
|
4461
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-xs font-medium text-table-head-text", children: "Filter" }),
|
|
4464
4462
|
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
4465
4463
|
"select",
|
|
4466
4464
|
{
|
|
@@ -5194,13 +5192,13 @@ var FilterChipSegment = React36.forwardRef(
|
|
|
5194
5192
|
"span",
|
|
5195
5193
|
{
|
|
5196
5194
|
className: cn(
|
|
5197
|
-
"text-sm font-
|
|
5195
|
+
"text-sm font-medium leading-sm whitespace-nowrap",
|
|
5198
5196
|
segmentType === "placeholder" ? "text-filter-chip-segment-placeholder" : "text-filter-chip-segment-text"
|
|
5199
5197
|
),
|
|
5200
5198
|
children: label
|
|
5201
5199
|
}
|
|
5202
5200
|
),
|
|
5203
|
-
badgeCount != null && badgeCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "flex items-center gap-2xs p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-[10px] font-
|
|
5201
|
+
badgeCount != null && badgeCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "flex items-center gap-2xs p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: badgeCount }) }),
|
|
5204
5202
|
children
|
|
5205
5203
|
]
|
|
5206
5204
|
}
|
|
@@ -5601,7 +5599,7 @@ var SortButton = ({
|
|
|
5601
5599
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
5602
5600
|
}
|
|
5603
5601
|
),
|
|
5604
|
-
!iconOnly && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("span", { className: "text-sm font-
|
|
5602
|
+
!iconOnly && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap", children: [
|
|
5605
5603
|
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("span", { className: "text-[var(--color-muted-foreground)]", children: [
|
|
5606
5604
|
"Sort by",
|
|
5607
5605
|
" "
|
|
@@ -5779,8 +5777,8 @@ var FilterBarButton = React40.forwardRef(({ className, count, iconOnly = false,
|
|
|
5779
5777
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
5780
5778
|
}
|
|
5781
5779
|
),
|
|
5782
|
-
!iconOnly && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-sm font-
|
|
5783
|
-
count != null && count > 0 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-[10px] font-
|
|
5780
|
+
!iconOnly && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: children ?? "Filters" }),
|
|
5781
|
+
count != null && count > 0 && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
5784
5782
|
]
|
|
5785
5783
|
}
|
|
5786
5784
|
));
|
|
@@ -5818,7 +5816,7 @@ var SaveViewButton = React41.forwardRef(
|
|
|
5818
5816
|
"rounded-l-md -mr-px"
|
|
5819
5817
|
),
|
|
5820
5818
|
children: [
|
|
5821
|
-
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-sm font-
|
|
5819
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-btn-solid-brand-text-default)]", children: label }),
|
|
5822
5820
|
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "absolute inset-0 rounded-l-[11px] border border-[var(--color-btn-solid-brand-inner-border-default)] shadow-sm pointer-events-none" })
|
|
5823
5821
|
]
|
|
5824
5822
|
}
|
|
@@ -5896,7 +5894,7 @@ var OperatorSelector = ({
|
|
|
5896
5894
|
{
|
|
5897
5895
|
className: cn(
|
|
5898
5896
|
"text-sm font-regular leading-sm",
|
|
5899
|
-
op === activeOperator ? "text-[var(--color-foreground)] font-
|
|
5897
|
+
op === activeOperator ? "text-[var(--color-foreground)] font-medium" : "text-[var(--color-dropdown-item-text)]"
|
|
5900
5898
|
),
|
|
5901
5899
|
children: op
|
|
5902
5900
|
}
|
|
@@ -5932,7 +5930,7 @@ var OperatorList = ({
|
|
|
5932
5930
|
{
|
|
5933
5931
|
className: cn(
|
|
5934
5932
|
"text-sm font-regular leading-sm",
|
|
5935
|
-
op === activeOperator ? "text-[var(--color-foreground)] font-
|
|
5933
|
+
op === activeOperator ? "text-[var(--color-foreground)] font-medium" : "text-[var(--color-dropdown-item-text)]"
|
|
5936
5934
|
),
|
|
5937
5935
|
children: op
|
|
5938
5936
|
}
|
|
@@ -5955,7 +5953,7 @@ var halfInputClasses = [
|
|
|
5955
5953
|
"bg-[var(--color-background)] text-sm font-regular leading-sm text-[var(--color-foreground)]",
|
|
5956
5954
|
"focus:outline-none focus:ring-2 focus:ring-[var(--color-ring)]"
|
|
5957
5955
|
].join(" ");
|
|
5958
|
-
var applyBtnClasses = "self-end px-md py-sm text-sm font-
|
|
5956
|
+
var applyBtnClasses = "self-end px-md py-sm text-sm font-medium leading-sm text-[var(--color-primary-foreground)] bg-[var(--color-primary)] rounded-base cursor-pointer hover:opacity-90 transition-opacity";
|
|
5959
5957
|
|
|
5960
5958
|
// src/components/ui/filter/value-inputs/text-value-input.tsx
|
|
5961
5959
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
@@ -6263,7 +6261,7 @@ var DatePickerDay = ({ date, isOutside }) => {
|
|
|
6263
6261
|
disabled: isOutside,
|
|
6264
6262
|
className: cn(
|
|
6265
6263
|
"relative flex flex-col items-center justify-center w-9 rounded-full p-2 cursor-pointer transition-colors",
|
|
6266
|
-
"text-sm font-
|
|
6264
|
+
"text-sm font-medium leading-sm text-center",
|
|
6267
6265
|
// Default
|
|
6268
6266
|
!isOutside && !isSelected && !isInRangeOrPreview && "text-datepicker-day-text-default hover:bg-datepicker-day-bg-hover",
|
|
6269
6267
|
// Outside month (disabled)
|
|
@@ -6334,7 +6332,7 @@ var DatePickerCalendar = React42.forwardRef(({ className, header, ...props }, re
|
|
|
6334
6332
|
header,
|
|
6335
6333
|
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "flex flex-col gap-lg p-lg", children: [
|
|
6336
6334
|
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
6337
|
-
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("span", { className: "text-base font-
|
|
6335
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("span", { className: "text-base font-medium leading-base text-datepicker-header-text", children: [
|
|
6338
6336
|
MONTH_NAMES[month],
|
|
6339
6337
|
" ",
|
|
6340
6338
|
year
|
|
@@ -6421,7 +6419,7 @@ var DatePickerSuggestions = React42.forwardRef(
|
|
|
6421
6419
|
),
|
|
6422
6420
|
...props,
|
|
6423
6421
|
children: [
|
|
6424
|
-
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "pt-lg px-base", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "flex items-center p-base rounded-base", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "flex-1 text-xs font-
|
|
6422
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "pt-lg px-base", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "flex items-center p-base rounded-base", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "flex-1 text-xs font-medium leading-xs text-datepicker-suggestion-heading uppercase truncate", children: "Suggestions" }) }) }),
|
|
6425
6423
|
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "flex flex-1 flex-col p-base min-w-[222px]", children: suggestions.map((suggestion, i) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
6426
6424
|
"button",
|
|
6427
6425
|
{
|
|
@@ -6615,7 +6613,7 @@ var PresetTagsValueInput = ({
|
|
|
6615
6613
|
onSubmit,
|
|
6616
6614
|
className
|
|
6617
6615
|
}) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: cn("flex flex-col gap-base p-base max-w-[280px]", className), children: RELATIVE_DATE_PRESETS.map((group) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex flex-col gap-xs", children: [
|
|
6618
|
-
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "text-xs font-
|
|
6616
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)] uppercase px-xs", children: group.group }),
|
|
6619
6617
|
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex flex-wrap gap-xs", children: group.options.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
6620
6618
|
"button",
|
|
6621
6619
|
{
|
|
@@ -7076,7 +7074,7 @@ var PropertySelector = ({
|
|
|
7076
7074
|
}
|
|
7077
7075
|
),
|
|
7078
7076
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-sm font-regular leading-sm text-[var(--color-dropdown-item-text)] text-left truncate", children: g.groupLabel }),
|
|
7079
|
-
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xs font-
|
|
7077
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: g.count }),
|
|
7080
7078
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
7081
7079
|
import_icons29.Icon,
|
|
7082
7080
|
{
|
|
@@ -7114,7 +7112,7 @@ var PropertySelector = ({
|
|
|
7114
7112
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
7115
7113
|
}
|
|
7116
7114
|
),
|
|
7117
|
-
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-xs font-
|
|
7115
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "flex-1 text-xs font-medium leading-xs text-[var(--color-muted-foreground)] text-left truncate", children: activeGroupInfo?.groupLabel })
|
|
7118
7116
|
]
|
|
7119
7117
|
}
|
|
7120
7118
|
),
|
|
@@ -7333,7 +7331,7 @@ var FilterEditor = ({
|
|
|
7333
7331
|
className: "shrink-0 text-[var(--color-dropdown-item-icon)]"
|
|
7334
7332
|
}
|
|
7335
7333
|
),
|
|
7336
|
-
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "text-sm font-
|
|
7334
|
+
/* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "text-sm font-medium leading-sm text-[var(--color-foreground)]", children: propertyDef.label }),
|
|
7337
7335
|
localOperator && view === "value" && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
|
|
7338
7336
|
"button",
|
|
7339
7337
|
{
|
|
@@ -7628,8 +7626,8 @@ var AdvancedChip = React47.forwardRef(
|
|
|
7628
7626
|
className: "shrink-0 text-[var(--color-foreground)]"
|
|
7629
7627
|
}
|
|
7630
7628
|
),
|
|
7631
|
-
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-sm font-
|
|
7632
|
-
count > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-[10px] font-
|
|
7629
|
+
/* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: "Advanced filters" }),
|
|
7630
|
+
count > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
7633
7631
|
]
|
|
7634
7632
|
}
|
|
7635
7633
|
),
|
|
@@ -7662,6 +7660,7 @@ var import_icons36 = require("@l3mpire/icons");
|
|
|
7662
7660
|
// src/components/ui/filter/advanced-row.tsx
|
|
7663
7661
|
var React49 = __toESM(require("react"));
|
|
7664
7662
|
var PopoverPrimitive11 = __toESM(require("@radix-ui/react-popover"));
|
|
7663
|
+
var TooltipPrimitive3 = __toESM(require("@radix-ui/react-tooltip"));
|
|
7665
7664
|
var import_icons34 = require("@l3mpire/icons");
|
|
7666
7665
|
|
|
7667
7666
|
// src/components/ui/filter/filter-node-actions.tsx
|
|
@@ -7809,22 +7808,20 @@ var AdvancedRow = ({
|
|
|
7809
7808
|
const badgeCount = getBadgeCount(condition.value);
|
|
7810
7809
|
const hasValue = displayValue != null;
|
|
7811
7810
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex items-center gap-base w-full min-w-0", children: [
|
|
7812
|
-
connector === "Where" ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-xs font-
|
|
7813
|
-
"
|
|
7814
|
-
{
|
|
7815
|
-
|
|
7816
|
-
|
|
7817
|
-
|
|
7818
|
-
|
|
7819
|
-
|
|
7820
|
-
|
|
7821
|
-
|
|
7822
|
-
|
|
7823
|
-
|
|
7824
|
-
|
|
7825
|
-
|
|
7826
|
-
}
|
|
7827
|
-
),
|
|
7811
|
+
connector === "Where" ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: "Where" }) }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Provider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(TooltipPrimitive3.Root, { children: [
|
|
7812
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)] cursor-default", children: connector }) }),
|
|
7813
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
|
|
7814
|
+
TooltipPrimitive3.Content,
|
|
7815
|
+
{
|
|
7816
|
+
sideOffset: 4,
|
|
7817
|
+
className: "z-50 px-base py-sm rounded-md shadow-lg bg-tooltip-default-bg text-tooltip-default-text text-sm font-regular leading-sm data-[state=delayed-open]:animate-[tooltip-in_150ms_ease-out] data-[state=closed]:animate-[tooltip-out_100ms_ease-in]",
|
|
7818
|
+
children: [
|
|
7819
|
+
'"Or" operator coming soon',
|
|
7820
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Arrow, { className: "fill-tooltip-default-bg" })
|
|
7821
|
+
]
|
|
7822
|
+
}
|
|
7823
|
+
) })
|
|
7824
|
+
] }) }) }),
|
|
7828
7825
|
/* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(PopoverPrimitive11.Root, { open: propertyOpen, onOpenChange: setPropertyOpen, children: [
|
|
7829
7826
|
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("button", { type: "button", className: cn(selectBtnStyle, "min-w-0"), children: [
|
|
7830
7827
|
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_icons34.Icon, { icon: propertyDef.icon, size: "sm", className: "shrink-0 text-[var(--color-muted-foreground)]" }),
|
|
@@ -7918,14 +7915,19 @@ var AdvancedRow = ({
|
|
|
7918
7915
|
);
|
|
7919
7916
|
}
|
|
7920
7917
|
const dateWide = inputType === "DatePicker" || inputType === "DateRange";
|
|
7918
|
+
const isMulti = inputType === "MultiSelect" || inputType === "MultiRelationPicker";
|
|
7919
|
+
const multiTags = isMulti && Array.isArray(condition.value) ? condition.value.map((v) => {
|
|
7920
|
+
const dyn = propertyDef.dynamicOptions?.find((o) => o.value === v);
|
|
7921
|
+
return dyn ? dyn.label : v;
|
|
7922
|
+
}) : null;
|
|
7921
7923
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(PopoverPrimitive11.Root, { open: valueOpen, onOpenChange: setValueOpen, children: [
|
|
7922
7924
|
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PopoverPrimitive11.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
|
|
7923
7925
|
"button",
|
|
7924
7926
|
{
|
|
7925
7927
|
type: "button",
|
|
7926
|
-
className: cn(selectBtnStyle, "flex-1 min-w-[80px] justify-between"),
|
|
7928
|
+
className: cn(selectBtnStyle, "flex-1 min-w-[80px] justify-between overflow-hidden"),
|
|
7927
7929
|
children: [
|
|
7928
|
-
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
7930
|
+
multiTags && multiTags.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ValueTagRow, { tags: multiTags }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
7929
7931
|
"span",
|
|
7930
7932
|
{
|
|
7931
7933
|
className: cn(
|
|
@@ -7936,20 +7938,14 @@ var AdvancedRow = ({
|
|
|
7936
7938
|
children: hasValue ? displayValue : "Select a value"
|
|
7937
7939
|
}
|
|
7938
7940
|
),
|
|
7939
|
-
/* @__PURE__ */ (0, import_jsx_runtime56.
|
|
7940
|
-
|
|
7941
|
-
|
|
7942
|
-
|
|
7943
|
-
|
|
7944
|
-
|
|
7945
|
-
|
|
7946
|
-
|
|
7947
|
-
icon: import_icons34.faChevronDownOutline,
|
|
7948
|
-
size: "xs",
|
|
7949
|
-
className: "text-[var(--color-foreground)]"
|
|
7950
|
-
}
|
|
7951
|
-
)
|
|
7952
|
-
] })
|
|
7941
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
7942
|
+
import_icons34.Icon,
|
|
7943
|
+
{
|
|
7944
|
+
icon: import_icons34.faChevronDownOutline,
|
|
7945
|
+
size: "xs",
|
|
7946
|
+
className: "shrink-0 text-[var(--color-foreground)]"
|
|
7947
|
+
}
|
|
7948
|
+
)
|
|
7953
7949
|
]
|
|
7954
7950
|
}
|
|
7955
7951
|
) }),
|
|
@@ -7995,9 +7991,85 @@ var AdvancedRow = ({
|
|
|
7995
7991
|
] });
|
|
7996
7992
|
};
|
|
7997
7993
|
AdvancedRow.displayName = "AdvancedRow";
|
|
7994
|
+
var tagChip = cn(
|
|
7995
|
+
"inline-flex items-center shrink-0 px-sm rounded-base",
|
|
7996
|
+
"bg-tag-neutral-bg text-tag-neutral-text",
|
|
7997
|
+
"text-xs font-medium leading-xs whitespace-nowrap",
|
|
7998
|
+
"h-5"
|
|
7999
|
+
);
|
|
8000
|
+
function ValueTagRow({ tags }) {
|
|
8001
|
+
const containerRef = React49.useRef(null);
|
|
8002
|
+
const measureRef = React49.useRef(null);
|
|
8003
|
+
const [visibleCount, setVisibleCount] = React49.useState(tags.length);
|
|
8004
|
+
React49.useLayoutEffect(() => {
|
|
8005
|
+
const container = containerRef.current;
|
|
8006
|
+
const measureRow = measureRef.current;
|
|
8007
|
+
if (!container || !measureRow) return;
|
|
8008
|
+
const measure = () => {
|
|
8009
|
+
const containerWidth = container.getBoundingClientRect().width;
|
|
8010
|
+
const chips = Array.from(measureRow.children);
|
|
8011
|
+
const overflowBadgeWidth = 32;
|
|
8012
|
+
let usedWidth = 0;
|
|
8013
|
+
let count = 0;
|
|
8014
|
+
for (const chip of chips) {
|
|
8015
|
+
const chipWidth = chip.getBoundingClientRect().width;
|
|
8016
|
+
const gap = count > 0 ? 4 : 0;
|
|
8017
|
+
const projected = usedWidth + gap + chipWidth;
|
|
8018
|
+
const remaining = tags.length - (count + 1);
|
|
8019
|
+
const total = projected + (remaining > 0 ? 4 + overflowBadgeWidth : 0);
|
|
8020
|
+
if (total <= containerWidth) {
|
|
8021
|
+
usedWidth = projected;
|
|
8022
|
+
count++;
|
|
8023
|
+
} else {
|
|
8024
|
+
break;
|
|
8025
|
+
}
|
|
8026
|
+
}
|
|
8027
|
+
setVisibleCount(Math.max(1, count));
|
|
8028
|
+
};
|
|
8029
|
+
measure();
|
|
8030
|
+
const observer = new ResizeObserver(measure);
|
|
8031
|
+
observer.observe(container);
|
|
8032
|
+
return () => observer.disconnect();
|
|
8033
|
+
}, [tags]);
|
|
8034
|
+
const overflowCount = tags.length - visibleCount;
|
|
8035
|
+
const overflowTags = tags.slice(visibleCount);
|
|
8036
|
+
return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex flex-1 items-center gap-xs min-w-0 overflow-hidden relative", children: [
|
|
8037
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
8038
|
+
"div",
|
|
8039
|
+
{
|
|
8040
|
+
ref: measureRef,
|
|
8041
|
+
"aria-hidden": true,
|
|
8042
|
+
className: "absolute flex items-center gap-xs pointer-events-none",
|
|
8043
|
+
style: { visibility: "hidden", whiteSpace: "nowrap", top: 0, left: 0 },
|
|
8044
|
+
children: tags.map((t) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: tagChip, children: t }, t))
|
|
8045
|
+
}
|
|
8046
|
+
),
|
|
8047
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { ref: containerRef, className: "flex flex-1 items-center gap-xs overflow-hidden", children: [
|
|
8048
|
+
tags.slice(0, visibleCount).map((t) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: tagChip, children: t }, t)),
|
|
8049
|
+
overflowCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Provider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(TooltipPrimitive3.Root, { children: [
|
|
8050
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: cn(tagChip, "cursor-default bg-filter-chip-badge-bg text-filter-chip-badge-text"), children: [
|
|
8051
|
+
"+",
|
|
8052
|
+
overflowCount
|
|
8053
|
+
] }) }),
|
|
8054
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
|
|
8055
|
+
TooltipPrimitive3.Content,
|
|
8056
|
+
{
|
|
8057
|
+
sideOffset: 4,
|
|
8058
|
+
className: "z-50 px-base py-sm rounded-md shadow-lg bg-tooltip-default-bg text-tooltip-default-text text-xs font-regular leading-xs flex flex-col gap-xs data-[state=delayed-open]:animate-[tooltip-in_150ms_ease-out] data-[state=closed]:animate-[tooltip-out_100ms_ease-in]",
|
|
8059
|
+
children: [
|
|
8060
|
+
overflowTags.map((t) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: t }, t)),
|
|
8061
|
+
/* @__PURE__ */ (0, import_jsx_runtime56.jsx)(TooltipPrimitive3.Arrow, { className: "fill-tooltip-default-bg" })
|
|
8062
|
+
]
|
|
8063
|
+
}
|
|
8064
|
+
) })
|
|
8065
|
+
] }) })
|
|
8066
|
+
] })
|
|
8067
|
+
] });
|
|
8068
|
+
}
|
|
7998
8069
|
|
|
7999
8070
|
// src/components/ui/filter/advanced-group.tsx
|
|
8000
8071
|
var React50 = __toESM(require("react"));
|
|
8072
|
+
var TooltipPrimitive4 = __toESM(require("@radix-ui/react-tooltip"));
|
|
8001
8073
|
var import_icons35 = require("@l3mpire/icons");
|
|
8002
8074
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
8003
8075
|
var AdvancedGroup = ({
|
|
@@ -8012,22 +8084,20 @@ var AdvancedGroup = ({
|
|
|
8012
8084
|
}) => {
|
|
8013
8085
|
const [addOpen, setAddOpen] = React50.useState(false);
|
|
8014
8086
|
return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex items-start gap-base w-full min-w-0", children: [
|
|
8015
|
-
connector === "Where" ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end pt-base", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-xs font-
|
|
8016
|
-
"
|
|
8017
|
-
{
|
|
8018
|
-
|
|
8019
|
-
|
|
8020
|
-
|
|
8021
|
-
|
|
8022
|
-
|
|
8023
|
-
|
|
8024
|
-
|
|
8025
|
-
|
|
8026
|
-
|
|
8027
|
-
|
|
8028
|
-
|
|
8029
|
-
}
|
|
8030
|
-
) }),
|
|
8087
|
+
connector === "Where" ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end pt-base", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: "Where" }) }) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end pt-base", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TooltipPrimitive4.Provider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(TooltipPrimitive4.Root, { children: [
|
|
8088
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TooltipPrimitive4.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)] cursor-default", children: connector }) }),
|
|
8089
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TooltipPrimitive4.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
|
|
8090
|
+
TooltipPrimitive4.Content,
|
|
8091
|
+
{
|
|
8092
|
+
sideOffset: 4,
|
|
8093
|
+
className: "z-50 px-base py-sm rounded-md shadow-lg bg-tooltip-default-bg text-tooltip-default-text text-sm font-regular leading-sm data-[state=delayed-open]:animate-[tooltip-in_150ms_ease-out] data-[state=closed]:animate-[tooltip-out_100ms_ease-in]",
|
|
8094
|
+
children: [
|
|
8095
|
+
'"Or" operator coming soon',
|
|
8096
|
+
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(TooltipPrimitive4.Arrow, { className: "fill-tooltip-default-bg" })
|
|
8097
|
+
]
|
|
8098
|
+
}
|
|
8099
|
+
) })
|
|
8100
|
+
] }) }) }),
|
|
8031
8101
|
/* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex-1 min-w-0 flex flex-col gap-base p-base border border-[var(--color-border)] rounded-md bg-[var(--color-secondary,var(--color-accent))]", children: [
|
|
8032
8102
|
children,
|
|
8033
8103
|
onAddFilter && properties && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
|
|
@@ -8044,7 +8114,7 @@ var AdvancedGroup = ({
|
|
|
8044
8114
|
"button",
|
|
8045
8115
|
{
|
|
8046
8116
|
type: "button",
|
|
8047
|
-
className: "flex items-center gap-sm px-base py-sm text-sm font-
|
|
8117
|
+
className: "flex items-center gap-sm px-base py-sm text-sm font-medium leading-sm text-[var(--color-muted-foreground)] cursor-pointer transition-colors rounded-md hover:bg-[var(--color-accent)] hover:text-[var(--color-foreground)] w-fit",
|
|
8048
8118
|
children: [
|
|
8049
8119
|
/* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_icons35.Icon, { icon: import_icons35.faPlusOutline, size: "sm" }),
|
|
8050
8120
|
"Add filter"
|
|
@@ -8075,7 +8145,7 @@ var import_jsx_runtime58 = (
|
|
|
8075
8145
|
var ghostBtn = [
|
|
8076
8146
|
"flex items-center gap-sm px-base py-sm",
|
|
8077
8147
|
"min-h-[32px]",
|
|
8078
|
-
"cursor-pointer transition-colors text-sm font-
|
|
8148
|
+
"cursor-pointer transition-colors text-sm font-medium leading-sm",
|
|
8079
8149
|
"rounded-md hover:bg-[var(--color-accent)]"
|
|
8080
8150
|
];
|
|
8081
8151
|
var AdvancedPopover = ({
|
|
@@ -8314,7 +8384,7 @@ var DraftRow = ({
|
|
|
8314
8384
|
onOpenChange?.(v);
|
|
8315
8385
|
};
|
|
8316
8386
|
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "flex items-center gap-base w-full min-w-0", children: [
|
|
8317
|
-
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "text-xs font-
|
|
8387
|
+
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: "Where" }) }),
|
|
8318
8388
|
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
8319
8389
|
PropertySelector,
|
|
8320
8390
|
{
|
|
@@ -8357,13 +8427,13 @@ var DraftRow = ({
|
|
|
8357
8427
|
// src/components/ui/filter/summary-chip.tsx
|
|
8358
8428
|
var React52 = __toESM(require("react"));
|
|
8359
8429
|
var PopoverPrimitive13 = __toESM(require("@radix-ui/react-popover"));
|
|
8360
|
-
var
|
|
8430
|
+
var TooltipPrimitive5 = __toESM(require("@radix-ui/react-tooltip"));
|
|
8361
8431
|
var import_icons37 = require("@l3mpire/icons");
|
|
8362
8432
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
8363
8433
|
var ghostBtn2 = [
|
|
8364
8434
|
"flex items-center gap-sm px-base py-sm",
|
|
8365
8435
|
"min-h-[32px]",
|
|
8366
|
-
"cursor-pointer transition-colors text-sm font-
|
|
8436
|
+
"cursor-pointer transition-colors text-sm font-medium leading-sm",
|
|
8367
8437
|
"rounded-md hover:bg-[var(--color-accent)]"
|
|
8368
8438
|
];
|
|
8369
8439
|
var SummaryChip = ({
|
|
@@ -8533,22 +8603,22 @@ var SummaryChip = ({
|
|
|
8533
8603
|
),
|
|
8534
8604
|
children: [
|
|
8535
8605
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_icons37.Icon, { icon: import_icons37.faFilterOutline, size: "sm", className: "shrink-0 text-[var(--color-foreground)]" }),
|
|
8536
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-sm font-
|
|
8537
|
-
count > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-[10px] font-
|
|
8606
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-sm font-medium leading-sm whitespace-nowrap text-[var(--color-foreground)]", children: "Filters" }),
|
|
8607
|
+
count > 0 && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "flex items-center p-2xs rounded-xs bg-filter-chip-badge-bg", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-[10px] font-medium leading-2xs text-filter-chip-badge-text", children: count }) })
|
|
8538
8608
|
]
|
|
8539
8609
|
}
|
|
8540
8610
|
);
|
|
8541
8611
|
const hasTooltip = tooltipContent && !open;
|
|
8542
|
-
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
8543
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
8544
|
-
hasTooltip && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
8545
|
-
|
|
8612
|
+
return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TooltipPrimitive5.Provider, { delayDuration: 300, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TooltipPrimitive5.Root, { open: hasTooltip ? void 0 : false, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(PopoverPrimitive13.Root, { open, onOpenChange: setOpen, children: [
|
|
8613
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TooltipPrimitive5.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(PopoverPrimitive13.Trigger, { asChild: true, children: trigger }) }),
|
|
8614
|
+
hasTooltip && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TooltipPrimitive5.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
|
|
8615
|
+
TooltipPrimitive5.Content,
|
|
8546
8616
|
{
|
|
8547
8617
|
sideOffset: 4,
|
|
8548
8618
|
className: "z-50 px-base py-sm rounded-md shadow-lg bg-tooltip-default-bg text-tooltip-default-text text-sm font-regular leading-sm max-w-[320px] data-[state=delayed-open]:animate-[tooltip-in_150ms_ease-out] data-[state=closed]:animate-[tooltip-out_100ms_ease-in]",
|
|
8549
8619
|
children: [
|
|
8550
8620
|
tooltipContent,
|
|
8551
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
|
|
8621
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(TooltipPrimitive5.Arrow, { className: "fill-tooltip-default-bg" })
|
|
8552
8622
|
]
|
|
8553
8623
|
}
|
|
8554
8624
|
) }),
|
|
@@ -8629,7 +8699,7 @@ var DraftRow2 = ({ properties, onSelect, open: openProp, onOpenChange }) => {
|
|
|
8629
8699
|
onOpenChange?.(v);
|
|
8630
8700
|
};
|
|
8631
8701
|
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { className: "flex items-center gap-base w-full min-w-0", children: [
|
|
8632
|
-
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-xs font-
|
|
8702
|
+
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)("div", { className: "shrink-0 w-[64px] flex items-center justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-xs font-medium leading-xs text-[var(--color-muted-foreground)]", children: "Where" }) }),
|
|
8633
8703
|
/* @__PURE__ */ (0, import_jsx_runtime59.jsx)(PropertySelector, { properties, onSelect: (p) => {
|
|
8634
8704
|
onSelect(p);
|
|
8635
8705
|
setOpen(false);
|
|
@@ -8886,7 +8956,7 @@ var FilterSystem = ({
|
|
|
8886
8956
|
type: "button",
|
|
8887
8957
|
onClick: handleClearAll,
|
|
8888
8958
|
className: "shrink-0 flex items-center gap-sm px-base py-sm min-h-[32px] max-h-[32px] rounded-md cursor-pointer transition-colors text-btn-ghost-brand-text-default hover:bg-btn-ghost-brand-bg-hover hover:text-btn-ghost-brand-text-hover active:bg-btn-ghost-brand-bg-pressed active:text-btn-ghost-brand-text-pressed",
|
|
8889
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "text-sm font-
|
|
8959
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "text-sm font-medium leading-sm", children: "Clear" })
|
|
8890
8960
|
}
|
|
8891
8961
|
)
|
|
8892
8962
|
] }),
|
|
@@ -8918,7 +8988,7 @@ function buildFilterTooltip(nodes, properties) {
|
|
|
8918
8988
|
connector,
|
|
8919
8989
|
" "
|
|
8920
8990
|
] }),
|
|
8921
|
-
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "font-
|
|
8991
|
+
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "font-medium", children: prop.label }),
|
|
8922
8992
|
" ",
|
|
8923
8993
|
/* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { className: "opacity-60", children: f.operator }),
|
|
8924
8994
|
" ",
|