@beweco/aurora-ui 0.1.64 → 0.1.66
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/dist/assets/css/styles.css +1 -1
- package/dist/index.cjs.js +534 -13
- package/dist/index.esm.js +532 -16
- package/dist/types/components/input/Input.d.ts.map +1 -1
- package/dist/types/components/phone/Phone.d.ts.map +1 -1
- package/dist/types/components/phone/Phone.types.d.ts +8 -0
- package/dist/types/components/phone/Phone.types.d.ts.map +1 -1
- package/dist/types/components/phone/index.d.ts +2 -1
- package/dist/types/components/phone/index.d.ts.map +1 -1
- package/dist/types/components/segmentation-builder/SegmentationBuilder.constants.d.ts +8 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.constants.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.d.ts +4 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.types.d.ts +123 -0
- package/dist/types/components/segmentation-builder/SegmentationBuilder.types.d.ts.map +1 -0
- package/dist/types/components/segmentation-builder/index.d.ts +5 -0
- package/dist/types/components/segmentation-builder/index.d.ts.map +1 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/index.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -337,6 +337,7 @@ var Input = function (_a) {
|
|
|
337
337
|
label: "text-default-600 text-tiny group-data-[filled=true]:text-default-600",
|
|
338
338
|
inputWrapper: "focus-within:!border-primary-500",
|
|
339
339
|
errorMessage: "text-left",
|
|
340
|
+
description: "text-left"
|
|
340
341
|
} })));
|
|
341
342
|
};
|
|
342
343
|
|
|
@@ -1733,12 +1734,12 @@ var NotificationButton = function (_a) {
|
|
|
1733
1734
|
};
|
|
1734
1735
|
NotificationButton.displayName = "NotificationButton";
|
|
1735
1736
|
|
|
1736
|
-
var DEFAULT_TRANSLATIONS$
|
|
1737
|
+
var DEFAULT_TRANSLATIONS$6 = {
|
|
1737
1738
|
logout: "Cerrar sesión",
|
|
1738
1739
|
};
|
|
1739
1740
|
var HeaderComponent = function (_a) {
|
|
1740
1741
|
var notificationCount = _a.notificationCount, options = _a.options, onMenuClick = _a.onMenuClick, onLogout = _a.onLogout, _b = _a.translations, translations = _b === void 0 ? {} : _b, breadcrumbs = _a.breadcrumbs, onNotificationClick = _a.onNotificationClick, onOptionSelect = _a.onOptionSelect, onBreadcrumbClick = _a.onBreadcrumbClick;
|
|
1741
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1742
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$6), translations);
|
|
1742
1743
|
return (jsxRuntime.jsx("header", { className: "header__container", children: jsxRuntime.jsxs("div", { className: "flex items-center justify-between w-full", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(react.Button, { className: "sm:hidden", isIconOnly: true, variant: "light", startContent: jsxRuntime.jsx(IconComponent, { icon: "solar:hamburger-menu-linear" }), onPress: onMenuClick }), breadcrumbs && breadcrumbs.length > 0 && (jsxRuntime.jsx(BreadcrumbsComponent, { items: breadcrumbs, onItemClick: onBreadcrumbClick }))] }), jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(NotificationButton, { notificationCount: notificationCount, onPress: onNotificationClick }), jsxRuntime.jsx(ConfigMenu, { options: options, onLogout: onLogout, onOptionSelect: onOptionSelect, translations: t })] })] }) }));
|
|
1743
1744
|
};
|
|
1744
1745
|
HeaderComponent.displayName = "Header";
|
|
@@ -1862,7 +1863,7 @@ KanbanColumn.displayName = "KanbanColumn";
|
|
|
1862
1863
|
* Traducciones por defecto en español.
|
|
1863
1864
|
* Se mezclan con las traducciones proporcionadas por el usuario.
|
|
1864
1865
|
*/
|
|
1865
|
-
var DEFAULT_TRANSLATIONS$
|
|
1866
|
+
var DEFAULT_TRANSLATIONS$5 = {
|
|
1866
1867
|
dropHere: "Soltar aquí",
|
|
1867
1868
|
emptyMessage: "No hay elementos",
|
|
1868
1869
|
};
|
|
@@ -1896,7 +1897,7 @@ var columnGapClasses = {
|
|
|
1896
1897
|
var KanbanComponent = function (_a) {
|
|
1897
1898
|
var columns = _a.columns, renderItem = _a.renderItem, onCardClick = _a.onCardClick, onItemMove = _a.onItemMove, isDraggable = _a.isDraggable, cardClassName = _a.cardClassName, isCardClickable = _a.isCardClickable, className = _a.className, _b = _a.columnWidth, columnWidth = _b === void 0 ? "280px" : _b, _c = _a.columnGap, columnGap = _c === void 0 ? "md" : _c, _d = _a.horizontalScroll, horizontalScroll = _d === void 0 ? true : _d, columnMaxHeight = _a.columnMaxHeight, renderColumnHeader = _a.renderColumnHeader, renderEmptyState = _a.renderEmptyState, _e = _a.translations, translations = _e === void 0 ? {} : _e, onLoadMore = _a.onLoadMore;
|
|
1898
1899
|
// Mezclar traducciones del usuario con las por defecto
|
|
1899
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
1900
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$5), translations);
|
|
1900
1901
|
// Determinar si drag está habilitado
|
|
1901
1902
|
var dragEnabled = isDraggable !== null && isDraggable !== void 0 ? isDraggable : !!onItemMove;
|
|
1902
1903
|
// Estado del drag actual
|
|
@@ -2214,7 +2215,7 @@ var MenuNavList = React.forwardRef(function (_a, ref) {
|
|
|
2214
2215
|
});
|
|
2215
2216
|
MenuNavList.displayName = "MenuNavList";
|
|
2216
2217
|
|
|
2217
|
-
var DEFAULT_TRANSLATIONS$
|
|
2218
|
+
var DEFAULT_TRANSLATIONS$4 = {
|
|
2218
2219
|
menuLabel: "Menú",
|
|
2219
2220
|
closeSidebarAriaLabel: "Cerrar menú lateral",
|
|
2220
2221
|
mobileNavAriaLabel: "Navegación móvil",
|
|
@@ -2232,7 +2233,7 @@ var MenuComponent = React.memo(function Menu(_a) {
|
|
|
2232
2233
|
var commerceInfo = _a.commerceInfo, userInfo = _a.userInfo, helpButton = _a.helpButton, isOpenSidebar = _a.isOpenSidebar, onOpenSidebarChange = _a.onOpenSidebarChange, menuItems = _a.menuItems, mobileBottomBarGroupKey = _a.mobileBottomBarGroupKey, _d = _a.showNativeMenu, showNativeMenu = _d === void 0 ? true : _d, _e = _a.translations, translations = _e === void 0 ? {} : _e;
|
|
2233
2234
|
var _f = React.useState(false), isCollapsed = _f[0], setIsCollapsed = _f[1];
|
|
2234
2235
|
var _g = React.useState(false), logoError = _g[0], setLogoError = _g[1];
|
|
2235
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
2236
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$4), translations);
|
|
2236
2237
|
var selectedKey = React.useMemo(function () {
|
|
2237
2238
|
var _a, _b, _c;
|
|
2238
2239
|
if (menuItems.selectedPath) {
|
|
@@ -2608,7 +2609,7 @@ var MultiStepSidebar = React.forwardRef(function (_a, ref) {
|
|
|
2608
2609
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
2609
2610
|
}
|
|
2610
2611
|
};
|
|
2611
|
-
return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.cn("flex h-full w-full max-w-4xl overflow-hidden rounded-lg bg-background shadow-lg lg:h-
|
|
2612
|
+
return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-content3/50 backdrop-blur-sm", onClick: handleOverlayClick, children: jsxRuntime.jsxs("div", __assign({ ref: ref, className: react.cn("flex h-full w-full max-w-4xl overflow-hidden rounded-lg bg-background shadow-lg lg:h-auto lg:max-h-[85vh]", className) }, props, { children: [jsxRuntime.jsx("div", { className: react.cn("hidden h-full w-1/3 flex-col gap-y-8 overflow-y-auto p-8 md:flex [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", steps.length < 5 ? "justify-center" : "items-start"), children: jsxRuntime.jsx(VerticalSteps, { className: stepperClasses, color: "primary", currentStep: currentPage, steps: steps, onStepChange: onChangePage, hideInactiveDescriptions: hideInactiveDescriptions }) }), jsxRuntime.jsxs("div", { className: "relative flex h-full w-full flex-col items-center justify-between gap-4 md:p-4 lg:w-2/3", children: [jsxRuntime.jsx(Button, { isIconOnly: true, className: "absolute right-4 top-4", size: "sm", variant: "light", color: "default", onPress: onClose, startContent: jsxRuntime.jsx(IconComponent, { className: "text-foreground", icon: "material-symbols:close-rounded", size: "lg" }) }), jsxRuntime.jsx("div", { className: "pt-9 w-10/12 md:hidden", children: jsxRuntime.jsx("div", { className: "flex w-full justify-center", children: jsxRuntime.jsx(StepIndicator, { className: react.cn(stepperClasses), currentStep: currentPage + 1, totalSteps: steps.length }) }) }), jsxRuntime.jsx("div", { className: "flex flex-col h-full w-full justify-between p-4 sm:max-w-md md:max-w-lg overflow-y-auto [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] [scrollbar-width:none]", children: children })] })] })) }));
|
|
2612
2613
|
});
|
|
2613
2614
|
MultiStepSidebar.displayName = "MultiStepSidebar";
|
|
2614
2615
|
|
|
@@ -3156,6 +3157,7 @@ var Phone = function (_a) {
|
|
|
3156
3157
|
var _l = React.useState({}), dropdownPosition = _l[0], setDropdownPosition = _l[1];
|
|
3157
3158
|
var _m = React.useState(uniqueCountries), filteredCountries = _m[0], setFilteredCountries = _m[1];
|
|
3158
3159
|
var t = __assign(__assign({}, defaultTranslations$6), translations);
|
|
3160
|
+
var getCountryName = function (country) { var _a, _b; return (_b = (_a = t.countries) === null || _a === void 0 ? void 0 : _a[country.country]) !== null && _b !== void 0 ? _b : country.name; };
|
|
3159
3161
|
var finalLabel = label || t.label;
|
|
3160
3162
|
React.useEffect(function () {
|
|
3161
3163
|
if (value) {
|
|
@@ -3225,13 +3227,14 @@ var Phone = function (_a) {
|
|
|
3225
3227
|
reactDom.createPortal(jsxRuntime.jsxs("div", { ref: portalDropdownRef, style: dropdownPosition, className: "bg-content1 border border-default-200 rounded-lg shadow-lg z-50", children: [jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsx("input", { type: "text", className: "w-full px-3 py-2 text-sm bg-default-100 border-medium border-default-200 text-default-500 rounded-lg focus:outline-none focus:border-primary-500", placeholder: t.searchPlaceholder, onChange: function (e) {
|
|
3226
3228
|
var searchTerm = e.target.value.toLowerCase();
|
|
3227
3229
|
var filtered = uniqueCountries.filter(function (country) {
|
|
3228
|
-
return country.
|
|
3230
|
+
return getCountryName(country).toLowerCase().includes(searchTerm) ||
|
|
3231
|
+
country.name.toLowerCase().includes(searchTerm) ||
|
|
3229
3232
|
country.code.toLowerCase().includes(searchTerm);
|
|
3230
3233
|
});
|
|
3231
3234
|
setFilteredCountries(filtered);
|
|
3232
3235
|
} }) }), jsxRuntime.jsx("div", { className: "max-h-60 overflow-y-auto", children: filteredCountries.length > 0 ? (filteredCountries.map(function (country) { return (jsxRuntime.jsxs("button", { type: "button", className: "flex items-center w-full px-4 py-2.5 text-sm hover:bg-default-200 ".concat(country.code === selectedCountry.code
|
|
3233
3236
|
? "bg-primary-50"
|
|
3234
|
-
: ""), onClick: function () { return handleCountrySelect(country); }, children: [jsxRuntime.jsx("span", { className: "mr-3", children: jsxRuntime.jsx(FlagIcon, { countryCode: country.country, size: "md" }) }), jsxRuntime.jsx("span", { className: "flex-1 text-left text-default-500", children: country
|
|
3237
|
+
: ""), onClick: function () { return handleCountrySelect(country); }, children: [jsxRuntime.jsx("span", { className: "mr-3", children: jsxRuntime.jsx(FlagIcon, { countryCode: country.country, size: "md" }) }), jsxRuntime.jsx("span", { className: "flex-1 text-left text-default-500", children: getCountryName(country) }), jsxRuntime.jsx("span", { className: "text-xs text-default-500", children: country.code })] }, "".concat(country.code, "-").concat(country.country))); })) : (jsxRuntime.jsx("div", { className: "px-4 py-2 text-sm text-default-500", children: t.noCountriesFound })) })] }), document.body)] }));
|
|
3235
3238
|
};
|
|
3236
3239
|
|
|
3237
3240
|
var defaultTranslations$5 = {
|
|
@@ -4281,7 +4284,7 @@ var AURORAS = [
|
|
|
4281
4284
|
duration: 55,
|
|
4282
4285
|
},
|
|
4283
4286
|
];
|
|
4284
|
-
var DEFAULT_TRANSLATIONS$
|
|
4287
|
+
var DEFAULT_TRANSLATIONS$3 = {
|
|
4285
4288
|
backButtonLabel: "Atras",
|
|
4286
4289
|
};
|
|
4287
4290
|
var BackButton = function (_a) {
|
|
@@ -4317,7 +4320,7 @@ var TwoColumnLayoutAgent = function (_a) {
|
|
|
4317
4320
|
var _b = _a.assistantState, assistantState = _b === void 0 ? "happy" : _b, assistantSpeech = _a.assistantSpeech, _c = _a.assistantSize, assistantSize = _c === void 0 ? "xl" : _c, assistantHint = _a.assistantHint, _d = _a.enableSequence, enableSequence = _d === void 0 ? true : _d, children = _a.children, _e = _a.showBackButton, showBackButton = _e === void 0 ? false : _e, onBack = _a.onBack, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g;
|
|
4318
4321
|
var _h = React.useState(!enableSequence), showRightContent = _h[0], setShowRightContent = _h[1];
|
|
4319
4322
|
var isDesktop = useMediaQuery("(min-width: ".concat(DESKTOP_BREAKPOINT_PX, "px)"));
|
|
4320
|
-
var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4323
|
+
var t = React.useMemo(function () { return (__assign(__assign({}, DEFAULT_TRANSLATIONS$3), translations)); }, [translations]);
|
|
4321
4324
|
var handleBackPress = onBack !== null && onBack !== void 0 ? onBack : (function () { return undefined; });
|
|
4322
4325
|
React.useEffect(function () {
|
|
4323
4326
|
if (enableSequence && !showRightContent) {
|
|
@@ -4872,7 +4875,7 @@ var UploadFile = function (_a) {
|
|
|
4872
4875
|
};
|
|
4873
4876
|
UploadFile.displayName = "UploadFile";
|
|
4874
4877
|
|
|
4875
|
-
var DEFAULT_TRANSLATIONS$
|
|
4878
|
+
var DEFAULT_TRANSLATIONS$2 = {
|
|
4876
4879
|
businessName: "Tu Negocio",
|
|
4877
4880
|
businessInitials: "TN",
|
|
4878
4881
|
onlineStatus: "en linea",
|
|
@@ -4897,7 +4900,7 @@ var DEFAULT_TRANSLATIONS$1 = {
|
|
|
4897
4900
|
*/
|
|
4898
4901
|
var WhatsAppPreview = function (_a) {
|
|
4899
4902
|
var imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "compact" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? false : _c, maxCaptionLength = _a.maxCaptionLength, onToggleCaption = _a.onToggleCaption, _d = _a.showFullCaption, showFullCaption = _d === void 0 ? false : _d, ctaType = _a.ctaType, ctaLabel = _a.ctaLabel, ctaValue = _a.ctaValue, _e = _a.campaignView, campaignView = _e === void 0 ? false : _e, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.timeLocale, timeLocale = _h === void 0 ? "es-ES" : _h;
|
|
4900
|
-
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$
|
|
4903
|
+
var t = __assign(__assign({}, DEFAULT_TRANSLATIONS$2), translations);
|
|
4901
4904
|
var shouldTruncate = maxCaptionLength && caption.length > maxCaptionLength;
|
|
4902
4905
|
var displayCaption = campaignView
|
|
4903
4906
|
? caption
|
|
@@ -5766,6 +5769,519 @@ var SimpleLineChart = function (_a) {
|
|
|
5766
5769
|
})] }) })] }));
|
|
5767
5770
|
};
|
|
5768
5771
|
|
|
5772
|
+
var DEFAULT_OPERATOR_LABELS = {
|
|
5773
|
+
equals: "es",
|
|
5774
|
+
notEquals: "no es",
|
|
5775
|
+
contains: "contiene",
|
|
5776
|
+
notContains: "no contiene",
|
|
5777
|
+
startsWith: "empieza con",
|
|
5778
|
+
endsWith: "termina con",
|
|
5779
|
+
greaterThan: "mayor que",
|
|
5780
|
+
lessThan: "menor que",
|
|
5781
|
+
between: "esta entre",
|
|
5782
|
+
before: "antes de",
|
|
5783
|
+
after: "despues de",
|
|
5784
|
+
in: "es uno de",
|
|
5785
|
+
notIn: "no es ninguno de",
|
|
5786
|
+
isNull: "esta vacio",
|
|
5787
|
+
isNotNull: "tiene valor",
|
|
5788
|
+
withinLastDays: "en los ultimos (dias)",
|
|
5789
|
+
beforeDays: "hace mas de (dias)",
|
|
5790
|
+
};
|
|
5791
|
+
var DEFAULT_TRANSLATIONS$1 = {
|
|
5792
|
+
includeItemsText: "Incluir los que cumplan",
|
|
5793
|
+
allConditionsLabel: "Y todas",
|
|
5794
|
+
anyConditionLabel: "O alguna",
|
|
5795
|
+
theseConditionsText: "estas condiciones:",
|
|
5796
|
+
thisConditionText: "esta condición:",
|
|
5797
|
+
nestedConditionsPrefix: "Cumplan",
|
|
5798
|
+
nestedConditionsSuffix: "de estas condiciones:",
|
|
5799
|
+
addConditionLabel: "+ Condicion",
|
|
5800
|
+
addGroupLabel: "+ Grupo de condiciones",
|
|
5801
|
+
selectPlaceholder: "Seleccionar...",
|
|
5802
|
+
selectTagPlaceholder: "Seleccionar etiqueta...",
|
|
5803
|
+
selectTagsPlaceholder: "Seleccionar etiquetas...",
|
|
5804
|
+
selectValuesPlaceholder: "Seleccionar valores...",
|
|
5805
|
+
searchPlaceholder: "Buscar...",
|
|
5806
|
+
selectedCountSingular: "seleccionado",
|
|
5807
|
+
selectedCountPlural: "seleccionados",
|
|
5808
|
+
deleteConditionTitle: "Eliminar condicion",
|
|
5809
|
+
deleteGroupTitle: "Eliminar grupo",
|
|
5810
|
+
automaticLabel: "(automatico)",
|
|
5811
|
+
fromPlaceholder: "Desde",
|
|
5812
|
+
toPlaceholder: "Hasta",
|
|
5813
|
+
betweenSeparator: "y",
|
|
5814
|
+
daysPlaceholder: "Cantidad de dias",
|
|
5815
|
+
valuePlaceholder: "Valor",
|
|
5816
|
+
textValuePlaceholder: "Escribe un valor...",
|
|
5817
|
+
maxDepthWarning: "Maximo {max} niveles de anidacion permitidos",
|
|
5818
|
+
filterSummaryTitle: "Resumen del filtro",
|
|
5819
|
+
filterSummaryPrefix: "Donde:",
|
|
5820
|
+
noConditionsText: "Sin condiciones definidas",
|
|
5821
|
+
andConnectorLabel: "Y",
|
|
5822
|
+
orConnectorLabel: "O",
|
|
5823
|
+
showJsonLabel: "Ver JSON",
|
|
5824
|
+
hideJsonLabel: "Ocultar JSON",
|
|
5825
|
+
operatorLabels: DEFAULT_OPERATOR_LABELS,
|
|
5826
|
+
};
|
|
5827
|
+
var NO_VALUE_OPERATORS = ["isNull", "isNotNull"];
|
|
5828
|
+
var MULTI_VALUE_OPERATORS = ["in", "notIn"];
|
|
5829
|
+
var BETWEEN_OPERATOR = "between";
|
|
5830
|
+
var DAYS_OPERATORS = [
|
|
5831
|
+
"withinLastDays",
|
|
5832
|
+
"beforeDays",
|
|
5833
|
+
];
|
|
5834
|
+
|
|
5835
|
+
// ─── Field Configuration ───────────────────────────────────────────
|
|
5836
|
+
// ─── Helper to check if item is a group ────────────────────────────
|
|
5837
|
+
function isGroupState(item) {
|
|
5838
|
+
return item.type === "group";
|
|
5839
|
+
}
|
|
5840
|
+
function isSegmentationGroup(item) {
|
|
5841
|
+
return "rules" in item && Array.isArray(item.rules);
|
|
5842
|
+
}
|
|
5843
|
+
|
|
5844
|
+
// ─── Helpers ───────────────────────────────────────────────────────
|
|
5845
|
+
var _idCounter = 0;
|
|
5846
|
+
function uid() {
|
|
5847
|
+
_idCounter += 1;
|
|
5848
|
+
return "seg_".concat(_idCounter, "_").concat(Date.now());
|
|
5849
|
+
}
|
|
5850
|
+
function buildFieldMap(fields) {
|
|
5851
|
+
var map = new Map();
|
|
5852
|
+
for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) {
|
|
5853
|
+
var f = fields_1[_i];
|
|
5854
|
+
map.set(f.value, f);
|
|
5855
|
+
}
|
|
5856
|
+
return map;
|
|
5857
|
+
}
|
|
5858
|
+
function buildTagMap(tags) {
|
|
5859
|
+
var map = new Map();
|
|
5860
|
+
for (var _i = 0, tags_1 = tags; _i < tags_1.length; _i++) {
|
|
5861
|
+
var t = tags_1[_i];
|
|
5862
|
+
map.set(t.id, t.title);
|
|
5863
|
+
}
|
|
5864
|
+
return map;
|
|
5865
|
+
}
|
|
5866
|
+
// ─── Convert between internal state and JSON ───────────────────────
|
|
5867
|
+
function stateToGroup(state) {
|
|
5868
|
+
return {
|
|
5869
|
+
operator: state.operator,
|
|
5870
|
+
rules: state.rules.map(function (item) {
|
|
5871
|
+
if (isGroupState(item))
|
|
5872
|
+
return stateToGroup(item);
|
|
5873
|
+
var rule = {
|
|
5874
|
+
field: item.field,
|
|
5875
|
+
operator: item.operator,
|
|
5876
|
+
};
|
|
5877
|
+
if (item.value !== undefined)
|
|
5878
|
+
rule.value = item.value;
|
|
5879
|
+
return rule;
|
|
5880
|
+
}),
|
|
5881
|
+
};
|
|
5882
|
+
}
|
|
5883
|
+
function groupToState(group) {
|
|
5884
|
+
return {
|
|
5885
|
+
id: uid(),
|
|
5886
|
+
type: "group",
|
|
5887
|
+
operator: group.operator,
|
|
5888
|
+
rules: group.rules.map(function (item) {
|
|
5889
|
+
if (isSegmentationGroup(item))
|
|
5890
|
+
return groupToState(item);
|
|
5891
|
+
var rule = {
|
|
5892
|
+
id: uid(),
|
|
5893
|
+
type: "rule",
|
|
5894
|
+
field: item.field,
|
|
5895
|
+
operator: item.operator,
|
|
5896
|
+
};
|
|
5897
|
+
if (item.value !== undefined)
|
|
5898
|
+
rule.value = item.value;
|
|
5899
|
+
return rule;
|
|
5900
|
+
}),
|
|
5901
|
+
};
|
|
5902
|
+
}
|
|
5903
|
+
function createEmptyRule(fields) {
|
|
5904
|
+
var _a, _b;
|
|
5905
|
+
var first = fields[0];
|
|
5906
|
+
return {
|
|
5907
|
+
id: uid(),
|
|
5908
|
+
type: "rule",
|
|
5909
|
+
field: (_a = first === null || first === void 0 ? void 0 : first.value) !== null && _a !== void 0 ? _a : "",
|
|
5910
|
+
operator: (_b = first === null || first === void 0 ? void 0 : first.operators[0]) !== null && _b !== void 0 ? _b : "equals",
|
|
5911
|
+
value: undefined,
|
|
5912
|
+
};
|
|
5913
|
+
}
|
|
5914
|
+
function createEmptyGroup(fields) {
|
|
5915
|
+
return {
|
|
5916
|
+
id: uid(),
|
|
5917
|
+
type: "group",
|
|
5918
|
+
operator: "OR",
|
|
5919
|
+
rules: [createEmptyRule(fields)],
|
|
5920
|
+
};
|
|
5921
|
+
}
|
|
5922
|
+
var ChipMultiSelect = function (_a) {
|
|
5923
|
+
var options = _a.options, value = _a.value, onChange = _a.onChange, _b = _a.placeholder, placeholder = _b === void 0 ? "Seleccionar..." : _b, _c = _a.searchPlaceholder, searchPlaceholder = _c === void 0 ? "Buscar..." : _c, _d = _a.selectedCountSingular, selectedCountSingular = _d === void 0 ? "seleccionado" : _d, _e = _a.selectedCountPlural, selectedCountPlural = _e === void 0 ? "seleccionados" : _e, _f = _a.isDisabled, isDisabled = _f === void 0 ? false : _f;
|
|
5924
|
+
var _g = React.useState(false), isOpen = _g[0], setIsOpen = _g[1];
|
|
5925
|
+
var _h = React.useState(""), search = _h[0], setSearch = _h[1];
|
|
5926
|
+
var wrapperRef = React.useRef(null);
|
|
5927
|
+
React.useEffect(function () {
|
|
5928
|
+
var handler = function (e) {
|
|
5929
|
+
if (wrapperRef.current &&
|
|
5930
|
+
!wrapperRef.current.contains(e.target)) {
|
|
5931
|
+
setIsOpen(false);
|
|
5932
|
+
}
|
|
5933
|
+
};
|
|
5934
|
+
document.addEventListener("click", handler);
|
|
5935
|
+
return function () { return document.removeEventListener("click", handler); };
|
|
5936
|
+
}, []);
|
|
5937
|
+
var filteredOptions = React.useMemo(function () {
|
|
5938
|
+
return search
|
|
5939
|
+
? options.filter(function (o) {
|
|
5940
|
+
return o.l.toLowerCase().includes(search.toLowerCase());
|
|
5941
|
+
})
|
|
5942
|
+
: options;
|
|
5943
|
+
}, [options, search]);
|
|
5944
|
+
var toggleValue = function (v) {
|
|
5945
|
+
if (value.includes(v))
|
|
5946
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5947
|
+
else
|
|
5948
|
+
onChange(__spreadArray(__spreadArray([], value, true), [v], false));
|
|
5949
|
+
};
|
|
5950
|
+
var removeChip = function (v) {
|
|
5951
|
+
onChange(value.filter(function (x) { return x !== v; }));
|
|
5952
|
+
};
|
|
5953
|
+
return (jsxRuntime.jsxs("div", { ref: wrapperRef, className: "seg-chip-select relative flex-1", children: [jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-1 h-9 min-h-9 px-3 py-1.5 border rounded-lg cursor-pointer transition-colors ".concat(isOpen
|
|
5954
|
+
? "border-primary-500 bg-default-50"
|
|
5955
|
+
: "border-default-100 hover:border-default-200", " ").concat(isDisabled ? "opacity-50 pointer-events-none" : ""), onClick: function () { return !isDisabled && setIsOpen(!isOpen); }, onKeyDown: function (e) {
|
|
5956
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5957
|
+
e.preventDefault();
|
|
5958
|
+
if (!isDisabled)
|
|
5959
|
+
setIsOpen(!isOpen);
|
|
5960
|
+
}
|
|
5961
|
+
}, role: "combobox", "aria-expanded": isOpen, tabIndex: isDisabled ? -1 : 0, children: value.length === 0 ? (jsxRuntime.jsx("span", { className: "text-default-400 text-sm", children: placeholder })) : (value.map(function (v) {
|
|
5962
|
+
var _a;
|
|
5963
|
+
var opt = options.find(function (o) { return o.v === v; });
|
|
5964
|
+
return (jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: "primary", onClose: function () { return removeChip(v); }, children: (_a = opt === null || opt === void 0 ? void 0 : opt.l) !== null && _a !== void 0 ? _a : v }, v));
|
|
5965
|
+
})) }), isOpen && (jsxRuntime.jsxs("div", { className: "flex items-center w-full min-h-[56px] transition-colors shadow-sm border-medium border-default-200 rounded-xl focus-within:border-primary-500 border-default-200", children: [options.length > 5 && (jsxRuntime.jsx("div", { className: "p-2 border-b border-default-100", children: jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", placeholder: searchPlaceholder, value: search, onValueChange: setSearch, onClick: function (e) { return e.stopPropagation(); }, classNames: {
|
|
5966
|
+
inputWrapper: "h-8 min-h-8",
|
|
5967
|
+
} }) })), jsxRuntime.jsx("div", { className: "overflow-y-auto flex-1 py-1", children: filteredOptions.map(function (opt) { return (jsxRuntime.jsx("div", { className: "flex items-center px-3 py-1.5 cursor-pointer hover:bg-default-50 transition-colors ".concat(value.includes(opt.v) ? "bg-primary-50" : ""), onClick: function (e) {
|
|
5968
|
+
e.stopPropagation();
|
|
5969
|
+
toggleValue(opt.v);
|
|
5970
|
+
}, onKeyDown: function (e) {
|
|
5971
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
5972
|
+
e.preventDefault();
|
|
5973
|
+
toggleValue(opt.v);
|
|
5974
|
+
}
|
|
5975
|
+
}, role: "option", "aria-selected": value.includes(opt.v), tabIndex: 0, children: jsxRuntime.jsx(react.Checkbox, { size: "sm", isSelected: value.includes(opt.v), onValueChange: function () { return toggleValue(opt.v); }, classNames: { label: "text-sm" }, children: opt.l }) }, opt.v)); }) }), jsxRuntime.jsxs("div", { className: "px-3 py-1.5 text-xs text-default-400 border-t border-default-100", children: [value.length, " ", value.length === 1
|
|
5976
|
+
? selectedCountSingular
|
|
5977
|
+
: selectedCountPlural] })] }))] }));
|
|
5978
|
+
};
|
|
5979
|
+
var ValueInput = function (_a) {
|
|
5980
|
+
var _b, _c, _d, _e;
|
|
5981
|
+
var field = _a.field, operator = _a.operator, value = _a.value, tags = _a.tags, onChange = _a.onChange, t = _a.translations, _f = _a.isDisabled, isDisabled = _f === void 0 ? false : _f;
|
|
5982
|
+
if (!field)
|
|
5983
|
+
return null;
|
|
5984
|
+
// No value operators
|
|
5985
|
+
if (NO_VALUE_OPERATORS.includes(operator)) {
|
|
5986
|
+
return (jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: "default", children: t.automaticLabel }));
|
|
5987
|
+
}
|
|
5988
|
+
// Enum field — multi-select (in / notIn)
|
|
5989
|
+
if (field.type === "enum" && MULTI_VALUE_OPERATORS.includes(operator)) {
|
|
5990
|
+
return (jsxRuntime.jsx(ChipMultiSelect, { options: (_b = field.enumValues) !== null && _b !== void 0 ? _b : [], value: Array.isArray(value) ? value : [], onChange: onChange, placeholder: t.selectValuesPlaceholder, searchPlaceholder: t.searchPlaceholder, selectedCountSingular: t.selectedCountSingular, selectedCountPlural: t.selectedCountPlural, isDisabled: isDisabled }));
|
|
5991
|
+
}
|
|
5992
|
+
// Enum field — single select
|
|
5993
|
+
if (field.type === "enum") {
|
|
5994
|
+
return (jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", placeholder: t.selectPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
5995
|
+
var selected = Array.from(keys)[0];
|
|
5996
|
+
onChange(selected || undefined);
|
|
5997
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
5998
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
5999
|
+
}, "aria-label": field.label, children: ((_c = field.enumValues) !== null && _c !== void 0 ? _c : []).map(function (ev) { return (jsxRuntime.jsx(react.SelectItem, { children: ev.l }, ev.v)); }) }));
|
|
6000
|
+
}
|
|
6001
|
+
// Tag single
|
|
6002
|
+
if (field.type === "tag-single") {
|
|
6003
|
+
return (jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", placeholder: t.selectTagPlaceholder, selectedKeys: value ? [String(value)] : [], onSelectionChange: function (keys) {
|
|
6004
|
+
var selected = Array.from(keys)[0];
|
|
6005
|
+
onChange(selected || undefined);
|
|
6006
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[160px] h-9", classNames: {
|
|
6007
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6008
|
+
}, "aria-label": field.label, children: tags.map(function (tag) { return (jsxRuntime.jsx(react.SelectItem, { children: tag.title }, tag.id)); }) }));
|
|
6009
|
+
}
|
|
6010
|
+
// Tag multi
|
|
6011
|
+
if (field.type === "tag-multi") {
|
|
6012
|
+
var tagOpts = tags.map(function (tag) { return ({ v: tag.id, l: tag.title }); });
|
|
6013
|
+
return (jsxRuntime.jsx(ChipMultiSelect, { options: tagOpts, value: Array.isArray(value) ? value : [], onChange: onChange, placeholder: t.selectTagsPlaceholder, searchPlaceholder: t.searchPlaceholder, selectedCountSingular: t.selectedCountSingular, selectedCountPlural: t.selectedCountPlural, isDisabled: isDisabled }));
|
|
6014
|
+
}
|
|
6015
|
+
// Between operator
|
|
6016
|
+
if (operator === BETWEEN_OPERATOR) {
|
|
6017
|
+
var isDate_1 = field.type === "date";
|
|
6018
|
+
var arr_1 = Array.isArray(value) ? value : [undefined, undefined];
|
|
6019
|
+
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-1", children: [jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: isDate_1 ? "date" : "number", placeholder: isDate_1 ? "" : t.fromPlaceholder, value: arr_1[0] !== undefined ? String(arr_1[0]) : "", onValueChange: function (v) {
|
|
6020
|
+
var _a;
|
|
6021
|
+
var parsed = isDate_1
|
|
6022
|
+
? v
|
|
6023
|
+
: v !== ""
|
|
6024
|
+
? Number(v)
|
|
6025
|
+
: undefined;
|
|
6026
|
+
onChange([
|
|
6027
|
+
parsed,
|
|
6028
|
+
(_a = arr_1[1]) !== null && _a !== void 0 ? _a : "",
|
|
6029
|
+
]);
|
|
6030
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.fromPlaceholder, classNames: {
|
|
6031
|
+
inputWrapper: "h-9 min-h-9",
|
|
6032
|
+
input: "text-center",
|
|
6033
|
+
} }), jsxRuntime.jsx("span", { className: "text-default-400 text-sm shrink-0", children: t.betweenSeparator }), jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: isDate_1 ? "date" : "number", placeholder: isDate_1 ? "" : t.toPlaceholder, value: arr_1[1] !== undefined ? String(arr_1[1]) : "", onValueChange: function (v) {
|
|
6034
|
+
var _a;
|
|
6035
|
+
var parsed = isDate_1
|
|
6036
|
+
? v
|
|
6037
|
+
: v !== ""
|
|
6038
|
+
? Number(v)
|
|
6039
|
+
: undefined;
|
|
6040
|
+
onChange([
|
|
6041
|
+
(_a = arr_1[0]) !== null && _a !== void 0 ? _a : "",
|
|
6042
|
+
parsed,
|
|
6043
|
+
]);
|
|
6044
|
+
}, isDisabled: isDisabled, className: "flex-1", "aria-label": t.toPlaceholder, classNames: {
|
|
6045
|
+
inputWrapper: "h-9 min-h-9",
|
|
6046
|
+
input: "text-center",
|
|
6047
|
+
} })] }));
|
|
6048
|
+
}
|
|
6049
|
+
// Days operators
|
|
6050
|
+
if (DAYS_OPERATORS.includes(operator)) {
|
|
6051
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.daysPlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6052
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6053
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[140px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.daysPlaceholder }));
|
|
6054
|
+
}
|
|
6055
|
+
// Number field
|
|
6056
|
+
if (field.type === "number") {
|
|
6057
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "number", min: 0, placeholder: t.valuePlaceholder, value: value !== undefined ? String(value) : "", onValueChange: function (v) {
|
|
6058
|
+
return onChange(v !== "" ? Number(v) : undefined);
|
|
6059
|
+
}, isDisabled: isDisabled, className: "flex-1 min-w-[120px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": t.valuePlaceholder }));
|
|
6060
|
+
}
|
|
6061
|
+
// Date field
|
|
6062
|
+
if (field.type === "date") {
|
|
6063
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "date", value: (_d = value) !== null && _d !== void 0 ? _d : "", onValueChange: function (v) { return onChange(v || undefined); }, isDisabled: isDisabled, className: "flex-1 min-w-[160px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": field.label }));
|
|
6064
|
+
}
|
|
6065
|
+
// Text field (default)
|
|
6066
|
+
return (jsxRuntime.jsx(react.Input, { size: "sm", variant: "faded", type: "text", placeholder: t.textValuePlaceholder, value: (_e = value) !== null && _e !== void 0 ? _e : "", onValueChange: function (v) { return onChange(v || undefined); }, isDisabled: isDisabled, className: "flex-1 min-w-[160px]", classNames: { inputWrapper: "h-9 min-h-9" }, "aria-label": field.label }));
|
|
6067
|
+
};
|
|
6068
|
+
// ─── ConnectorPill Sub-component (compact: text only) ─────────────────
|
|
6069
|
+
var ConnectorPill = function (_a) {
|
|
6070
|
+
var isAnd = _a.isAnd, label = _a.label;
|
|
6071
|
+
return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 py-1", children: [jsxRuntime.jsx("div", { className: "flex-1 h-px bg-default-200" }), jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: isAnd ? "secondary" : "success", children: label }), jsxRuntime.jsx("div", { className: "flex-1 h-px bg-default-200" })] }));
|
|
6072
|
+
};
|
|
6073
|
+
var RuleRow = function (_a) {
|
|
6074
|
+
var _b;
|
|
6075
|
+
var rule = _a.rule, fields = _a.fields, fieldMap = _a.fieldMap, tags = _a.tags, onUpdate = _a.onUpdate, onDelete = _a.onDelete, t = _a.translations, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c;
|
|
6076
|
+
var meta = fieldMap.get(rule.field);
|
|
6077
|
+
var operators = (_b = meta === null || meta === void 0 ? void 0 : meta.operators) !== null && _b !== void 0 ? _b : [];
|
|
6078
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6079
|
+
// Group fields by category
|
|
6080
|
+
var categories = React.useMemo(function () {
|
|
6081
|
+
var cats = [];
|
|
6082
|
+
var last = "";
|
|
6083
|
+
for (var _i = 0, fields_2 = fields; _i < fields_2.length; _i++) {
|
|
6084
|
+
var f = fields_2[_i];
|
|
6085
|
+
if (f.category !== last) {
|
|
6086
|
+
cats.push({ category: f.category, fields: [f] });
|
|
6087
|
+
last = f.category;
|
|
6088
|
+
}
|
|
6089
|
+
else {
|
|
6090
|
+
cats[cats.length - 1].fields.push(f);
|
|
6091
|
+
}
|
|
6092
|
+
}
|
|
6093
|
+
return cats;
|
|
6094
|
+
}, [fields]);
|
|
6095
|
+
var handleFieldChange = function (newField) {
|
|
6096
|
+
var _a;
|
|
6097
|
+
var newMeta = fieldMap.get(newField);
|
|
6098
|
+
var newOp = (_a = newMeta === null || newMeta === void 0 ? void 0 : newMeta.operators[0]) !== null && _a !== void 0 ? _a : "equals";
|
|
6099
|
+
onUpdate(__assign(__assign({}, rule), { field: newField, operator: newOp, value: undefined }));
|
|
6100
|
+
};
|
|
6101
|
+
var handleOperatorChange = function (newOp) {
|
|
6102
|
+
onUpdate(__assign(__assign({}, rule), { operator: newOp, value: undefined }));
|
|
6103
|
+
};
|
|
6104
|
+
var handleValueChange = function (newValue) {
|
|
6105
|
+
onUpdate(__assign(__assign({}, rule), { value: newValue }));
|
|
6106
|
+
};
|
|
6107
|
+
return (jsxRuntime.jsxs("div", { className: "seg-rule-row flex flex-col gap-2 p-3 border border-default-100 rounded-xl min-h-[52px] w-full sm:flex-row sm:items-center sm:gap-2 sm:w-auto", children: [jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", selectedKeys: [rule.field], onSelectionChange: function (keys) {
|
|
6108
|
+
var selected = Array.from(keys)[0];
|
|
6109
|
+
if (selected)
|
|
6110
|
+
handleFieldChange(selected);
|
|
6111
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[170px] sm:max-w-[200px] sm:shrink-0", classNames: {
|
|
6112
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6113
|
+
}, "aria-label": "Campo", children: categories.map(function (cat) { return (jsxRuntime.jsx(react.SelectSection, { title: cat.category, children: cat.fields.map(function (f) { return (jsxRuntime.jsx(react.SelectItem, { children: f.label }, f.value)); }) }, cat.category)); }) }), jsxRuntime.jsx(react.Select, { size: "sm", variant: "faded", selectedKeys: [rule.operator], onSelectionChange: function (keys) {
|
|
6114
|
+
var selected = Array.from(keys)[0];
|
|
6115
|
+
if (selected)
|
|
6116
|
+
handleOperatorChange(selected);
|
|
6117
|
+
}, isDisabled: isDisabled, className: "w-full sm:min-w-[140px] sm:max-w-[180px] sm:shrink-0", classNames: {
|
|
6118
|
+
trigger: "h-9 min-h-9 border border-default-100 rounded-lg data-[hover=true]:border-default-200 data-[focus=true]:border-primary-500",
|
|
6119
|
+
}, "aria-label": "Operador", children: operators.map(function (op) {
|
|
6120
|
+
var _a;
|
|
6121
|
+
return (jsxRuntime.jsx(react.SelectItem, { children: (_a = opLabels[op]) !== null && _a !== void 0 ? _a : op }, op));
|
|
6122
|
+
}) }), jsxRuntime.jsx("div", { className: "w-full sm:flex-1 sm:min-w-0 flex items-center", children: jsxRuntime.jsx(ValueInput, { field: meta, operator: rule.operator, value: rule.value, tags: tags, onChange: handleValueChange, translations: t, isDisabled: isDisabled }) }), jsxRuntime.jsx(react.Button, { isIconOnly: true, size: "sm", variant: "light", color: "danger", onPress: onDelete, isDisabled: isDisabled, "aria-label": t.deleteConditionTitle, className: "shrink-0 self-end sm:self-center", children: "\u2715" })] }));
|
|
6123
|
+
};
|
|
6124
|
+
var FilterGroup = function (_a) {
|
|
6125
|
+
var group = _a.group, fields = _a.fields, fieldMap = _a.fieldMap, tags = _a.tags, depth = _a.depth, maxDepth = _a.maxDepth, onUpdate = _a.onUpdate, t = _a.translations, _b = _a.isDisabled, isDisabled = _b === void 0 ? false : _b;
|
|
6126
|
+
var isAnd = group.operator === "AND";
|
|
6127
|
+
var connectorLabel = isAnd ? t.andConnectorLabel : t.orConnectorLabel;
|
|
6128
|
+
var toggleOperator = function (op) {
|
|
6129
|
+
onUpdate(__assign(__assign({}, group), { operator: op }));
|
|
6130
|
+
};
|
|
6131
|
+
var updateRule = function (index, updated) {
|
|
6132
|
+
var newRules = __spreadArray([], group.rules, true);
|
|
6133
|
+
newRules[index] = updated;
|
|
6134
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6135
|
+
};
|
|
6136
|
+
var deleteRule = function (index) {
|
|
6137
|
+
var newRules = group.rules.filter(function (_, i) { return i !== index; });
|
|
6138
|
+
onUpdate(__assign(__assign({}, group), { rules: newRules }));
|
|
6139
|
+
};
|
|
6140
|
+
var addRule = function () {
|
|
6141
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyRule(fields)], false) }));
|
|
6142
|
+
};
|
|
6143
|
+
var addGroup = function () {
|
|
6144
|
+
if (depth >= maxDepth)
|
|
6145
|
+
return;
|
|
6146
|
+
onUpdate(__assign(__assign({}, group), { rules: __spreadArray(__spreadArray([], group.rules, true), [createEmptyGroup(fields)], false) }));
|
|
6147
|
+
};
|
|
6148
|
+
return (jsxRuntime.jsxs("div", { className: "seg-filter-group w-full min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2 mb-3 text-sm text-default-700", children: [jsxRuntime.jsx("span", { children: depth === 1
|
|
6149
|
+
? t.includeItemsText
|
|
6150
|
+
: t.nestedConditionsPrefix }), jsxRuntime.jsxs("span", { className: "inline-flex rounded-md overflow-hidden border border-default-200", children: [jsxRuntime.jsx(react.Button, { size: "sm", radius: "none", variant: isAnd ? "solid" : "light", color: isAnd ? "secondary" : "default", className: "min-w-0 px-2.5 text-xs ".concat(isAnd
|
|
6151
|
+
? "font-semibold"
|
|
6152
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("AND"); }, isDisabled: isDisabled, "aria-label": t.allConditionsLabel, children: t.andConnectorLabel }), jsxRuntime.jsx(react.Button, { size: "sm", radius: "none", variant: !isAnd ? "solid" : "light", color: !isAnd ? "success" : "default", className: "min-w-0 px-2.5 text-xs ".concat(!isAnd
|
|
6153
|
+
? "font-semibold"
|
|
6154
|
+
: "text-default-500 font-semibold"), onPress: function () { return toggleOperator("OR"); }, isDisabled: isDisabled, "aria-label": t.anyConditionLabel, children: t.orConnectorLabel })] }), jsxRuntime.jsx("span", { children: depth === 1
|
|
6155
|
+
? group.rules.length >= 2
|
|
6156
|
+
? t.theseConditionsText
|
|
6157
|
+
: t.thisConditionText
|
|
6158
|
+
: t.nestedConditionsSuffix })] }), jsxRuntime.jsx("div", { className: "seg-rules-list flex flex-col gap-0", children: group.rules.map(function (item, index) { return (jsxRuntime.jsxs("div", { children: [index > 0 && (jsxRuntime.jsx(ConnectorPill, { isAnd: isAnd, label: connectorLabel })), isGroupState(item) ? (jsxRuntime.jsxs("div", { className: "seg-nested-wrap relative border-2 rounded-xl p-4 ".concat(item.operator === "AND"
|
|
6159
|
+
? "border-secondary/30 bg-secondary-50"
|
|
6160
|
+
: "border-success/30 bg-success-50"), children: [jsxRuntime.jsx(react.Button, { isIconOnly: true, size: "sm", variant: "light", color: "danger", className: "absolute top-2 right-2", onPress: function () { return deleteRule(index); }, isDisabled: isDisabled, "aria-label": t.deleteGroupTitle, children: "\u2715" }), jsxRuntime.jsx(FilterGroup, { group: item, fields: fields, fieldMap: fieldMap, tags: tags, depth: depth + 1, maxDepth: maxDepth, onUpdate: function (updated) {
|
|
6161
|
+
return updateRule(index, updated);
|
|
6162
|
+
}, translations: t, isDisabled: isDisabled })] })) : (jsxRuntime.jsx(RuleRow, { rule: item, fields: fields, fieldMap: fieldMap, tags: tags, onUpdate: function (updated) {
|
|
6163
|
+
return updateRule(index, updated);
|
|
6164
|
+
}, onDelete: function () { return deleteRule(index); }, translations: t, isDisabled: isDisabled }))] }, item.id)); }) }), jsxRuntime.jsxs("div", { className: "seg-add-actions flex flex-wrap gap-2 mt-3", children: [jsxRuntime.jsx(react.Button, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addRule, isDisabled: isDisabled, children: t.addConditionLabel }), depth < maxDepth && (jsxRuntime.jsx(react.Button, { variant: "bordered", size: "sm", className: "border-dashed text-default-500", onPress: addGroup, isDisabled: isDisabled, children: t.addGroupLabel }))] })] }));
|
|
6165
|
+
};
|
|
6166
|
+
var FilterSummary = function (_a) {
|
|
6167
|
+
var group = _a.group, fieldMap = _a.fieldMap, tagMap = _a.tagMap, t = _a.translations;
|
|
6168
|
+
var opLabels = __assign(__assign({}, DEFAULT_OPERATOR_LABELS), t.operatorLabels);
|
|
6169
|
+
var humanValue = function (field, operator, value) {
|
|
6170
|
+
var _a, _b;
|
|
6171
|
+
if (operator === "isNull" || operator === "isNotNull")
|
|
6172
|
+
return "";
|
|
6173
|
+
if (value === undefined || value === null)
|
|
6174
|
+
return "(sin valor)";
|
|
6175
|
+
var meta = fieldMap.get(field);
|
|
6176
|
+
if (!meta)
|
|
6177
|
+
return String(value);
|
|
6178
|
+
if (meta.type === "tag-single")
|
|
6179
|
+
return (_a = tagMap.get(value)) !== null && _a !== void 0 ? _a : String(value);
|
|
6180
|
+
if (meta.type === "tag-multi" && Array.isArray(value)) {
|
|
6181
|
+
return value
|
|
6182
|
+
.map(function (v) { var _a; return (_a = tagMap.get(v)) !== null && _a !== void 0 ? _a : String(v); })
|
|
6183
|
+
.join(", ");
|
|
6184
|
+
}
|
|
6185
|
+
if (meta.type === "enum" && meta.enumValues) {
|
|
6186
|
+
var enumMap_1 = new Map(meta.enumValues.map(function (ev) { return [ev.v, ev.l]; }));
|
|
6187
|
+
if (Array.isArray(value))
|
|
6188
|
+
return value
|
|
6189
|
+
.map(function (v) { var _a; return (_a = enumMap_1.get(v)) !== null && _a !== void 0 ? _a : v; })
|
|
6190
|
+
.join(", ");
|
|
6191
|
+
return (_b = enumMap_1.get(value)) !== null && _b !== void 0 ? _b : String(value);
|
|
6192
|
+
}
|
|
6193
|
+
if (operator === "between" && Array.isArray(value))
|
|
6194
|
+
return "".concat(value[0], " ").concat(t.betweenSeparator, " ").concat(value[1]);
|
|
6195
|
+
if (operator === "withinLastDays" || operator === "beforeDays")
|
|
6196
|
+
return "".concat(value, " dias");
|
|
6197
|
+
if (Array.isArray(value))
|
|
6198
|
+
return value.join(", ");
|
|
6199
|
+
return String(value);
|
|
6200
|
+
};
|
|
6201
|
+
var translateRule = function (rule) {
|
|
6202
|
+
var _a, _b;
|
|
6203
|
+
var meta = fieldMap.get(rule.field);
|
|
6204
|
+
var fieldLabel = (_a = meta === null || meta === void 0 ? void 0 : meta.label) !== null && _a !== void 0 ? _a : rule.field;
|
|
6205
|
+
var opLabel = (_b = opLabels[rule.operator]) !== null && _b !== void 0 ? _b : rule.operator;
|
|
6206
|
+
var val = humanValue(rule.field, rule.operator, rule.value);
|
|
6207
|
+
return "".concat(fieldLabel, " ").concat(opLabel).concat(val ? " ".concat(val) : "");
|
|
6208
|
+
};
|
|
6209
|
+
var translateGroup = function (grp, d) {
|
|
6210
|
+
var conn = grp.operator === "AND"
|
|
6211
|
+
? " ".concat(t.andConnectorLabel, " ")
|
|
6212
|
+
: " ".concat(t.orConnectorLabel, " ");
|
|
6213
|
+
var parts = grp.rules.map(function (item) {
|
|
6214
|
+
if (isSegmentationGroup(item))
|
|
6215
|
+
return "(".concat(translateGroup(item), ")");
|
|
6216
|
+
return translateRule(item);
|
|
6217
|
+
});
|
|
6218
|
+
if (!parts.length)
|
|
6219
|
+
return t.noConditionsText;
|
|
6220
|
+
return parts.join(conn);
|
|
6221
|
+
};
|
|
6222
|
+
if (!group.rules.length)
|
|
6223
|
+
return null;
|
|
6224
|
+
return (jsxRuntime.jsxs("div", { className: "seg-summary mt-4 p-4 bg-success-50 border border-success/20 rounded-xl", children: [jsxRuntime.jsx("div", { className: "text-sm font-semibold text-success-600 mb-1", children: t.filterSummaryTitle }), jsxRuntime.jsxs("div", { className: "text-sm text-default-700", children: [t.filterSummaryPrefix, " ", translateGroup(group)] })] }));
|
|
6225
|
+
};
|
|
6226
|
+
// ─── Main Component ────────────────────────────────────────────────
|
|
6227
|
+
var SegmentationBuilder = React.forwardRef(function (_a, ref) {
|
|
6228
|
+
var fields = _a.fields, _b = _a.tags, tags = _b === void 0 ? [] : _b, value = _a.value, onChange = _a.onChange, _c = _a.maxDepth, maxDepth = _c === void 0 ? 5 : _c, _d = _a.showSummary, showSummary = _d === void 0 ? true : _d, _e = _a.showJsonPreview, showJsonPreview = _e === void 0 ? false : _e, translations = _a.translations, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.isDisabled, isDisabled = _g === void 0 ? false : _g;
|
|
6229
|
+
var t = React.useMemo(function () { return (__assign(__assign(__assign({}, DEFAULT_TRANSLATIONS$1), translations), { operatorLabels: __assign(__assign({}, DEFAULT_OPERATOR_LABELS), translations === null || translations === void 0 ? void 0 : translations.operatorLabels) })); }, [translations]);
|
|
6230
|
+
var fMap = React.useMemo(function () { return buildFieldMap(fields); }, [fields]);
|
|
6231
|
+
var tMap = React.useMemo(function () { return buildTagMap(tags); }, [tags]);
|
|
6232
|
+
// Internal state
|
|
6233
|
+
var _h = React.useState(function () {
|
|
6234
|
+
if (value)
|
|
6235
|
+
return groupToState(value);
|
|
6236
|
+
return {
|
|
6237
|
+
id: uid(),
|
|
6238
|
+
type: "group",
|
|
6239
|
+
operator: "AND",
|
|
6240
|
+
rules: [createEmptyRule(fields)],
|
|
6241
|
+
};
|
|
6242
|
+
}), internalState = _h[0], setInternalState = _h[1];
|
|
6243
|
+
var _j = React.useState(false), isJsonVisible = _j[0], setIsJsonVisible = _j[1];
|
|
6244
|
+
// Sync from controlled value
|
|
6245
|
+
var isControlled = value !== undefined;
|
|
6246
|
+
var prevValueRef = React.useRef(value);
|
|
6247
|
+
React.useEffect(function () {
|
|
6248
|
+
if (isControlled && value && value !== prevValueRef.current) {
|
|
6249
|
+
setInternalState(groupToState(value));
|
|
6250
|
+
prevValueRef.current = value;
|
|
6251
|
+
}
|
|
6252
|
+
}, [value, isControlled]);
|
|
6253
|
+
// Build the output filter
|
|
6254
|
+
var currentFilter = React.useMemo(function () { return stateToGroup(internalState); }, [internalState]);
|
|
6255
|
+
// Notify onChange on state change
|
|
6256
|
+
var isFirstRender = React.useRef(true);
|
|
6257
|
+
React.useEffect(function () {
|
|
6258
|
+
if (isFirstRender.current) {
|
|
6259
|
+
isFirstRender.current = false;
|
|
6260
|
+
return;
|
|
6261
|
+
}
|
|
6262
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(currentFilter);
|
|
6263
|
+
}, [currentFilter, onChange]);
|
|
6264
|
+
// Expose imperative handle
|
|
6265
|
+
React.useImperativeHandle(ref, function () { return ({
|
|
6266
|
+
getFilter: function () { return stateToGroup(internalState); },
|
|
6267
|
+
getPayload: function () { return ({ filter: stateToGroup(internalState) }); },
|
|
6268
|
+
reset: function () {
|
|
6269
|
+
var newState = {
|
|
6270
|
+
id: uid(),
|
|
6271
|
+
type: "group",
|
|
6272
|
+
operator: "AND",
|
|
6273
|
+
rules: [createEmptyRule(fields)],
|
|
6274
|
+
};
|
|
6275
|
+
setInternalState(newState);
|
|
6276
|
+
},
|
|
6277
|
+
}); }, [internalState, fields]);
|
|
6278
|
+
var handleGroupUpdate = React.useCallback(function (updated) {
|
|
6279
|
+
setInternalState(updated);
|
|
6280
|
+
}, []);
|
|
6281
|
+
return (jsxRuntime.jsxs("div", { className: "seg-builder relative w-full min-w-0 ".concat(showJsonPreview ? "pr-10" : "", " ").concat(className), children: [showJsonPreview && (jsxRuntime.jsx(react.Button, { isIconOnly: true, size: "sm", variant: "light", className: "absolute top-0 right-0 z-10 text-default-500 hover:text-default-700", onPress: function () { return setIsJsonVisible(function (v) { return !v; }); }, "aria-expanded": isJsonVisible, "aria-label": isJsonVisible ? t.hideJsonLabel : t.showJsonLabel, title: isJsonVisible ? t.hideJsonLabel : t.showJsonLabel, children: isJsonVisible ? (jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [jsxRuntime.jsx("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }), jsxRuntime.jsx("line", { x1: "1", y1: "1", x2: "23", y2: "23" })] })) : (jsxRuntime.jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: [jsxRuntime.jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3" })] })) })), jsxRuntime.jsx(FilterGroup, { group: internalState, fields: fields, fieldMap: fMap, tags: tags, depth: 1, maxDepth: maxDepth, onUpdate: handleGroupUpdate, translations: t, isDisabled: isDisabled }), showSummary && (jsxRuntime.jsx(FilterSummary, { group: currentFilter, fieldMap: fMap, tagMap: tMap, translations: t })), showJsonPreview && isJsonVisible && (jsxRuntime.jsx("div", { className: "seg-json-preview mt-4", children: jsxRuntime.jsx("pre", { className: "p-4 bg-default-900 text-default-100 rounded-xl text-xs overflow-x-auto max-h-[300px] border border-default-700 [color-scheme:dark]", children: JSON.stringify({ filter: currentFilter }, null, 2) }) }))] }));
|
|
6282
|
+
});
|
|
6283
|
+
SegmentationBuilder.displayName = "SegmentationBuilder";
|
|
6284
|
+
|
|
5769
6285
|
var DEFAULT_TRANSLATIONS = {
|
|
5770
6286
|
placeholder: "Nombre de la etiqueta",
|
|
5771
6287
|
labelSelect: "Selecciona etiqueta",
|
|
@@ -6282,8 +6798,10 @@ exports.Phone = Phone;
|
|
|
6282
6798
|
exports.PromotionalBanner = PromotionalBanner;
|
|
6283
6799
|
exports.RangeFilter = RangeFilter;
|
|
6284
6800
|
exports.RowSteps = RowSteps;
|
|
6801
|
+
exports.SEGMENTATION_DEFAULT_TRANSLATIONS = DEFAULT_TRANSLATIONS$1;
|
|
6285
6802
|
exports.ScheduleRow = ScheduleRow;
|
|
6286
6803
|
exports.SearchInput = SearchInput;
|
|
6804
|
+
exports.SegmentationBuilder = SegmentationBuilder;
|
|
6287
6805
|
exports.Select = Select;
|
|
6288
6806
|
exports.SimpleLineChart = SimpleLineChart;
|
|
6289
6807
|
exports.SocialMediaBar = SocialMediaBar;
|
|
@@ -6307,6 +6825,7 @@ exports.Wizard = Wizard;
|
|
|
6307
6825
|
exports.WizardNavigation = WizardNavigation;
|
|
6308
6826
|
exports.WizardSidebar = WizardSidebar;
|
|
6309
6827
|
exports.applyCustomPrimaryColor = applyCustomPrimaryColor;
|
|
6828
|
+
exports.defaultCountries = uniqueCountries;
|
|
6310
6829
|
exports.defaultTranslations = defaultTranslations$4;
|
|
6311
6830
|
exports.generateThemeColorScale = generateThemeColorScale;
|
|
6312
6831
|
exports.getContrastForeground = getContrastForeground;
|
|
@@ -6314,7 +6833,9 @@ exports.getSelectedKeyFromPath = getSelectedKeyFromPath;
|
|
|
6314
6833
|
exports.hexToThemeColor = hexToThemeColor;
|
|
6315
6834
|
exports.hslToCssValue = hslToCssValue;
|
|
6316
6835
|
exports.isExactThemeColor = isExactThemeColor;
|
|
6836
|
+
exports.isGroupState = isGroupState;
|
|
6317
6837
|
exports.isHexColor = isHexColor;
|
|
6838
|
+
exports.isSegmentationGroup = isSegmentationGroup;
|
|
6318
6839
|
exports.removeCustomPrimaryColor = removeCustomPrimaryColor;
|
|
6319
6840
|
exports.sizeMap = sizeMap;
|
|
6320
6841
|
exports.themeColors = themeColors;
|