@mahatisystems/mahati-ui-components 5.3.0 → 5.3.2

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.
Files changed (7) hide show
  1. package/dist/index.css +12 -5
  2. package/dist/index.css.map +1 -1
  3. package/dist/index.js +61 -35
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +119 -93
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -697,6 +697,17 @@ var ButtonBase = import_react2.default.forwardRef(function(_0, _1) {
697
697
  "style"
698
698
  ]), _rest1 = _sliced_to_array(_rest, 1), ref = _rest1[0];
699
699
  var color = getColorByName(name);
700
+ var getHoverStyles = function getHoverStyles() {
701
+ if (iconButtonHoverBgClass) return {};
702
+ if (iconButtonHoverIntensity) {
703
+ var opacity = iconButtonHoverIntensity / 100;
704
+ return {
705
+ "--hover-bg": "rgba(0,0,0,".concat(opacity, ")"),
706
+ "--active-bg": "rgba(0,0,0,".concat(Math.min(opacity + 0.2, 1), ")")
707
+ };
708
+ }
709
+ return {};
710
+ };
700
711
  if (iconButton) {
701
712
  var height = parseHeightWidth(iconButtonHeightClass);
702
713
  var width = parseHeightWidth(iconButtonWidthClass);
@@ -708,8 +719,11 @@ var ButtonBase = import_react2.default.forwardRef(function(_0, _1) {
708
719
  minHeight: height,
709
720
  minWidth: width,
710
721
  color: color.startsWith("linear") ? "white" : color
722
+ }, iconButtonHoverIntensity && {
723
+ "--hover-bg": "rgba(0,0,0,".concat(iconButtonHoverIntensity / 100, ")"),
724
+ "--active-bg": "rgba(0,0,0,".concat(Math.min(iconButtonHoverIntensity / 100 + 0.2, 1), ")")
711
725
  }, style),
712
- className: "\n inline-flex items-center justify-center\n transition-all duration-200\n focus-visible:outline focus-visible:outline-2 focus-visible:outline-white\n ".concat(iconButtonRadiusClass || "rounded-md", "\n ").concat(iconButtonBgPaddingClass || "p-[2px]", "\n ").concat(iconButtonBgClass || "bg-white/10", "\n hover:opacity-85 active:opacity-70\n ").concat(className || "", "\n ")
726
+ className: "\n inline-flex items-center justify-center\n transition-all duration-200\n ".concat(iconButtonRadiusClass || "rounded-md", "\n ").concat(iconButtonBgPaddingClass || "p-[2px]", "\n ").concat(iconButtonBgClass || "bg-white/10", "\n\n ").concat(iconButtonHoverBgClass ? iconButtonHoverBgClass : iconButtonHoverIntensity ? "hover:bg-[var(--hover-bg)] active:bg-[var(--active-bg)]" : "hover:opacity-85 active:opacity-70", "\n\n ").concat(className || "", "\n")
713
727
  }, props), {
714
728
  children: children
715
729
  }));
@@ -724,7 +738,10 @@ var ButtonBase = import_react2.default.forwardRef(function(_0, _1) {
724
738
  }, style) : style,
725
739
  className: "\n inline-flex items-center justify-center\n whitespace-nowrap\n font-medium\n text-[14px]\n transition-all duration-200\n cursor-pointer\n focus-visible:outline focus-visible:outline-2 focus-visible:outline-blue-400\n disabled:pointer-events-none disabled:opacity-50\n ".concat(!name ? variantClasses[variant] : "", "\n ").concat(sizeClasses[size], "\n ").concat(className || "", "\n ")
726
740
  }, props), {
727
- children: children
741
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", {
742
+ className: "".concat(iconButtonBgPaddingClass || "p-[2px]", " flex items-center justify-center"),
743
+ children: children
744
+ })
728
745
  }));
729
746
  });
730
747
  ButtonBase.displayName = "Button";
@@ -1024,14 +1041,12 @@ var Input = import_react4.default.forwardRef(function(_0, _1) {
1024
1041
  if (props.disabled) return;
1025
1042
  onChange === null || onChange === void 0 ? void 0 : onChange(e);
1026
1043
  };
1027
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", {
1028
- "data-testid": testId,
1029
- className: "flex flex-col w-full mb-4",
1044
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, {
1030
1045
  children: [
1031
1046
  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("input", _object_spread({
1032
1047
  ref: ref,
1033
- onChange: handleChange,
1034
1048
  "data-testid": testId ? "".concat(testId, "-input") : void 0,
1049
+ onChange: handleChange,
1035
1050
  className: "\n w-full max-w-full min-w-0\n h-[44px]\n px-3\n text-base\n rounded-md\n border\n outline-none\n box-border\n transition-all duration-200\n\n ".concat(hasError ? "border-red-500 focus:border-red-600 focus:ring-2 focus:ring-red-100" : "border-[#D9D9D9] focus:border-blue-500 focus:ring-2 focus:ring-blue-100 hover:border-gray-400 focus:border-blue-500", "\n\n disabled:bg-gray-100\n disabled:text-gray-400\n disabled:border-gray-200\n disabled:cursor-not-allowed\n\n file:py-2 file:px-3 file:cursor-pointer\n\n placeholder:text-gray-400\n\n ").concat(className, "\n ")
1036
1051
  }, props)),
1037
1052
  hasError && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", {
@@ -7453,6 +7468,12 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
7453
7468
  var _ref = _sliced_to_array((0, import_react17.useState)(initialChartType), 2), chartType = _ref[0], setChartType = _ref[1];
7454
7469
  var _ref1 = _sliced_to_array((0, import_react17.useState)("Project 1"), 2), selectedGanttProject = _ref1[0], setSelectedGanttProject = _ref1[1];
7455
7470
  var _ref2 = _sliced_to_array((0, import_react17.useState)("Project 1"), 2), selectedCalendarHeatmapProject = _ref2[0], setSelectedCalendarHeatmapProject = _ref2[1];
7471
+ var _ref3 = _sliced_to_array((0, import_react17.useState)(selectedFilters), 2), localFilters = _ref3[0], setLocalFilters = _ref3[1];
7472
+ (0, import_react17.useEffect)(function() {
7473
+ setLocalFilters(selectedFilters);
7474
+ }, [
7475
+ selectedFilters
7476
+ ]);
7456
7477
  var currentFilters = (0, import_react17.useMemo)(function() {
7457
7478
  if (chartFilters && chartFilters[chartType]) return chartFilters[chartType] || [];
7458
7479
  return filters;
@@ -7491,8 +7512,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
7491
7512
  var currentGanttData = (0, import_react17.useMemo)(function() {
7492
7513
  if (chartType === "gantt" && ganttData) {
7493
7514
  var _ganttData_year;
7494
- var year = selectedFilters["SelectYear"] || "2026";
7495
- var type = selectedFilters["SelectType"] || "Development";
7515
+ var year = localFilters["SelectYear"] || "2026";
7516
+ var type = localFilters["SelectType"] || "Development";
7496
7517
  var baseData = (_ganttData_year = ganttData[year]) === null || _ganttData_year === void 0 ? void 0 : _ganttData_year[type];
7497
7518
  if (!baseData) return void 0;
7498
7519
  if (selectedGanttProject === "Project 2") {
@@ -7524,8 +7545,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
7524
7545
  ]);
7525
7546
  var currentHorizontalBarTopPerformer = (0, import_react17.useMemo)(function() {
7526
7547
  if (chartType !== "horizontalbar" || !horizontalBarData) return void 0;
7527
- var selectedYear = selectedFilters["SelectYear"] || "2026";
7528
- var selectedMonth = selectedFilters["SelectMonth"] || "January";
7548
+ var selectedYear = localFilters["SelectYear"] || "2026";
7549
+ var selectedMonth = localFilters["SelectMonth"] || "January";
7529
7550
  var yearData = horizontalBarData[selectedYear];
7530
7551
  var monthData = yearData === null || yearData === void 0 ? void 0 : yearData[selectedMonth];
7531
7552
  if (!monthData) return void 0;
@@ -7599,8 +7620,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
7599
7620
  }
7600
7621
  };
7601
7622
  if (chartType !== "calendarheatmap" || !calendarheatmapData) return empty;
7602
- var year = selectedFilters["SelectYear"] || "2026";
7603
- var type = selectedFilters["SelectType"] || "Development";
7623
+ var year = localFilters["SelectYear"] || "2026";
7624
+ var type = localFilters["SelectType"] || "Development";
7604
7625
  var project = selectedCalendarHeatmapProject;
7605
7626
  if (!((_calendarheatmapData_project = calendarheatmapData[project]) === null || _calendarheatmapData_project === void 0 ? void 0 : (_calendarheatmapData_project_year = _calendarheatmapData_project[year]) === null || _calendarheatmapData_project_year === void 0 ? void 0 : _calendarheatmapData_project_year[type])) return empty;
7606
7627
  var yearData = calendarheatmapData[project][year][type];
@@ -7713,9 +7734,9 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
7713
7734
  };
7714
7735
  var currentBulletData = (0, import_react17.useMemo)(function() {
7715
7736
  if (!bulletData) return null;
7716
- var year = selectedFilters.SelectYear || "2026";
7717
- var month = selectedFilters.SelectMonth || "January";
7718
- var type = selectedFilters.SelectType || "Sales";
7737
+ var year = localFilters.SelectYear || "2026";
7738
+ var month = localFilters.SelectMonth || "January";
7739
+ var type = localFilters.SelectType || "Sales";
7719
7740
  var yearData = bulletData[year];
7720
7741
  if (yearData) {
7721
7742
  var typeData = yearData[type];
@@ -8000,9 +8021,10 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
8000
8021
  },
8001
8022
  children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChartDropdown, {
8002
8023
  options: options,
8003
- value: selectedFilters[filter.id],
8024
+ value: localFilters[filter.id],
8004
8025
  onSelect: function onSelect(val) {
8005
- return onFiltersChange(_object_spread_props(_object_spread({}, selectedFilters), _define_property({}, filter.id, String(val))));
8026
+ var updated = _object_spread_props(_object_spread({}, localFilters), _define_property({}, filter.id, String(val)));
8027
+ setLocalFilters(updated);
8006
8028
  },
8007
8029
  variant: "mahatiFilter",
8008
8030
  label: filter.label
@@ -8012,7 +8034,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
8012
8034
  /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("button", {
8013
8035
  type: "button",
8014
8036
  onClick: function onClick() {
8015
- return onApplyFilters === null || onApplyFilters === void 0 ? void 0 : onApplyFilters(selectedFilters);
8037
+ onApplyFilters === null || onApplyFilters === void 0 ? void 0 : onApplyFilters(localFilters);
8038
+ onFiltersChange(localFilters);
8016
8039
  },
8017
8040
  className: "w-[77px] h-[30px] rounded border border-[rgba(23,97,163,1)] bg-gradient-to-r from-[rgba(23,97,163,1)] to-[rgba(77,175,131,1)] text-white text-sm font-medium cursor-pointer transition-opacity hover:opacity-90",
8018
8041
  children: "Apply"
@@ -8295,8 +8318,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
8295
8318
  children: [
8296
8319
  function() {
8297
8320
  var _gaugeData_gauges, _gaugeData_sy_sm2, _gaugeData_sy;
8298
- var sy = selectedFilters["SelectYear"] || "2026";
8299
- var sm2 = selectedFilters["SelectMonth"] || "January";
8321
+ var sy = localFilters["SelectYear"] || "2026";
8322
+ var sm2 = localFilters["SelectMonth"] || "January";
8300
8323
  var currentGauge = ((_gaugeData_gauges = gaugeData.gauges) === null || _gaugeData_gauges === void 0 ? void 0 : _gaugeData_gauges.length) > 0 ? gaugeData.gauges[0] : null;
8301
8324
  if (((_gaugeData_sy = gaugeData[sy]) === null || _gaugeData_sy === void 0 ? void 0 : (_gaugeData_sy_sm2 = _gaugeData_sy[sm2]) === null || _gaugeData_sy_sm2 === void 0 ? void 0 : _gaugeData_sy_sm2.length) > 0) currentGauge = gaugeData[sy][sm2][0];
8302
8325
  if (!currentGauge) return null;
@@ -8446,9 +8469,9 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
8446
8469
  children: [
8447
8470
  function() {
8448
8471
  var _riskGaugeData_gauges, _riskGaugeData_sy_sm2_st, _riskGaugeData_sy_sm2, _riskGaugeData_sy;
8449
- var sy = selectedFilters["SelectYear"] || "2026";
8450
- var sm2 = selectedFilters["SelectMonth"] || "January";
8451
- var st = selectedFilters["SelectType"] || "Credit Score";
8472
+ var sy = localFilters["SelectYear"] || "2026";
8473
+ var sm2 = localFilters["SelectMonth"] || "January";
8474
+ var st = localFilters["SelectType"] || "Credit Score";
8452
8475
  var currentRiskGauge = ((_riskGaugeData_gauges = riskGaugeData.gauges) === null || _riskGaugeData_gauges === void 0 ? void 0 : _riskGaugeData_gauges.length) > 0 ? riskGaugeData.gauges[0] : null;
8453
8476
  if (((_riskGaugeData_sy = riskGaugeData[sy]) === null || _riskGaugeData_sy === void 0 ? void 0 : (_riskGaugeData_sy_sm2 = _riskGaugeData_sy[sm2]) === null || _riskGaugeData_sy_sm2 === void 0 ? void 0 : (_riskGaugeData_sy_sm2_st = _riskGaugeData_sy_sm2[st]) === null || _riskGaugeData_sy_sm2_st === void 0 ? void 0 : _riskGaugeData_sy_sm2_st.length) > 0) currentRiskGauge = riskGaugeData[sy][sm2][st][0];
8454
8477
  if (!currentRiskGauge) return null;
@@ -9167,9 +9190,9 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
9167
9190
  function() {
9168
9191
  var _columnChartData_sy_sm2, _columnChartData_sy, _columnChartData_prevYear_prevMonth, _columnChartData_prevYear;
9169
9192
  if (!columnChartData) return null;
9170
- var sy = selectedFilters["SelectYear"] || "2026";
9171
- var sm2 = selectedFilters["SelectMonth"] || "January";
9172
- var st = selectedFilters["SelectType"] || "Category A";
9193
+ var sy = localFilters["SelectYear"] || "2026";
9194
+ var sm2 = localFilters["SelectMonth"] || "January";
9195
+ var st = localFilters["SelectType"] || "Category A";
9173
9196
  var typeData = (columnChartData === null || columnChartData === void 0 ? void 0 : (_columnChartData_sy = columnChartData[sy]) === null || _columnChartData_sy === void 0 ? void 0 : (_columnChartData_sy_sm2 = _columnChartData_sy[sm2]) === null || _columnChartData_sy_sm2 === void 0 ? void 0 : _columnChartData_sy_sm2[st]) || [];
9174
9197
  var currentTotal = typeData.reduce(function(sum, item) {
9175
9198
  return sum + item.value;
@@ -9328,8 +9351,8 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
9328
9351
  function() {
9329
9352
  var _groupBarData_sy, _groupBarData_prevYear;
9330
9353
  if (!groupBarData) return null;
9331
- var sy = selectedFilters["SelectYear"] || "2026";
9332
- var sm2 = selectedFilters["SelectMonth"] || "January";
9354
+ var sy = localFilters["SelectYear"] || "2026";
9355
+ var sm2 = localFilters["SelectMonth"] || "January";
9333
9356
  var groups = (groupBarData === null || groupBarData === void 0 ? void 0 : (_groupBarData_sy = groupBarData[sy]) === null || _groupBarData_sy === void 0 ? void 0 : _groupBarData_sy[sm2]) || [];
9334
9357
  if (!groups.length) return null;
9335
9358
  var legends = groupBarData.legends || [];
@@ -9824,9 +9847,9 @@ var MahatiChartAnalyticsWidget = function MahatiChartAnalyticsWidget(param) {
9824
9847
  function() {
9825
9848
  var _currentFilters_, _currentFilters_1, _currentFilters_2, _currentFilters_3, _currentFilters_4, _currentFilters_5, _yearData_month;
9826
9849
  var f0 = (_currentFilters_ = currentFilters[0]) === null || _currentFilters_ === void 0 ? void 0 : _currentFilters_.id, f1 = (_currentFilters_1 = currentFilters[1]) === null || _currentFilters_1 === void 0 ? void 0 : _currentFilters_1.id, f2 = (_currentFilters_2 = currentFilters[2]) === null || _currentFilters_2 === void 0 ? void 0 : _currentFilters_2.id;
9827
- var year = selectedFilters[f0] || ((_currentFilters_3 = currentFilters[0]) === null || _currentFilters_3 === void 0 ? void 0 : _currentFilters_3.options[0]) || "2026";
9828
- var month = selectedFilters[f1] || ((_currentFilters_4 = currentFilters[1]) === null || _currentFilters_4 === void 0 ? void 0 : _currentFilters_4.options[0]) || "January";
9829
- var category = selectedFilters[f2] || ((_currentFilters_5 = currentFilters[2]) === null || _currentFilters_5 === void 0 ? void 0 : _currentFilters_5.options[0]) || "Category A";
9850
+ var year = localFilters[f0] || ((_currentFilters_3 = currentFilters[0]) === null || _currentFilters_3 === void 0 ? void 0 : _currentFilters_3.options[0]) || "2026";
9851
+ var month = localFilters[f1] || ((_currentFilters_4 = currentFilters[1]) === null || _currentFilters_4 === void 0 ? void 0 : _currentFilters_4.options[0]) || "January";
9852
+ var category = localFilters[f2] || ((_currentFilters_5 = currentFilters[2]) === null || _currentFilters_5 === void 0 ? void 0 : _currentFilters_5.options[0]) || "Category A";
9830
9853
  var yearData = (lollipopData === null || lollipopData === void 0 ? void 0 : lollipopData[year]) || {};
9831
9854
  var catData = (yearData === null || yearData === void 0 ? void 0 : (_yearData_month = yearData[month]) === null || _yearData_month === void 0 ? void 0 : _yearData_month[category]) || [];
9832
9855
  var bestItem = catData.length ? catData.reduce(function(max, i) {
@@ -10978,10 +11001,12 @@ var CircularSpinner = function CircularSpinner(param) {
10978
11001
  left: offset,
10979
11002
  opacity: opacity,
10980
11003
  borderWidth: Math.max(2, ringSize / 12),
11004
+ borderColor: "rgba(0,0,0,0.1)",
10981
11005
  borderTopColor: color,
10982
- animation: "circularSpin ".concat(speed + i * 0.3, "s linear infinite")
11006
+ animation: "spin ".concat(speed + i * 0.3, "s linear infinite"),
11007
+ animationDelay: "".concat(i * 0.2, "s")
10983
11008
  },
10984
- className: "absolute border border-transparent rounded-full"
11009
+ className: "absolute border border-solid rounded-full"
10985
11010
  }, i);
10986
11011
  }),
10987
11012
  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SrOnly, {
@@ -12784,7 +12809,8 @@ var MahatiCameraAccessModal = function MahatiCameraAccessModal(param) {
12784
12809
  onClick: onClose,
12785
12810
  className: "absolute right-5 top-5 flex h-8 w-8 items-center justify-center rounded-full bg-white shadow-[0_2px_6px_rgba(0,0,0,0.15)]",
12786
12811
  children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react6.X, {
12787
- size: 16
12812
+ size: 16,
12813
+ color: "black"
12788
12814
  })
12789
12815
  }),
12790
12816
  image && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", {
@@ -13020,7 +13046,7 @@ var MahatiPromotionModal = function MahatiPromotionModal(_0) {
13020
13046
  var handleCta = function handleCta() {
13021
13047
  onCtaClick === null || onCtaClick === void 0 ? void 0 : onCtaClick(email);
13022
13048
  if (ctaLink) {
13023
- openInNewTab ? window.open(ctaLink, "_blank") : window.location.href = ctaLink;
13049
+ openInNewTab ? window.open(ctaLink, "_blank") : window.location.assign(ctaLink);
13024
13050
  }
13025
13051
  onClose();
13026
13052
  };