@diwauhris/ui 1.7.7 → 1.7.8

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/lib/assets/ui.css CHANGED
@@ -913,10 +913,6 @@
913
913
  min-height: 320px;
914
914
  }
915
915
 
916
- .min-h-\[32px\] {
917
- min-height: 32px;
918
- }
919
-
920
916
  .min-h-\[360px\] {
921
917
  min-height: 360px;
922
918
  }
@@ -4560,9 +4556,6 @@ body {
4560
4556
  .last\:border-b-0:last-child {
4561
4557
  border-bottom-width: 0px;
4562
4558
  }
4563
- .last\:pb-0:last-child {
4564
- padding-bottom: 0px;
4565
- }
4566
4559
  .focus-within\:border-brand-blue\/50:focus-within {
4567
4560
  border-color: rgb(3 78 162 / 0.5);
4568
4561
  }
package/lib/index.cjs CHANGED
@@ -3552,6 +3552,8 @@ function Stepper({ steps, currentStep, completedSteps = [], disabledSteps = [],
3552
3552
  const state = resolveState(step.id, currentStep, completedSteps, disabledSteps);
3553
3553
  const isCurrent = state === "current";
3554
3554
  const isLast = idx === steps.length - 1;
3555
+ const connectorDone = state === "completed";
3556
+ const connectorColor = dark ? connectorDone ? "bg-[#2D8ACA]/50" : "bg-white/15" : connectorDone ? "bg-brand-blue/50" : "bg-slate-200";
3555
3557
  const labelColor = dark ? {
3556
3558
  completed: "text-[#2D8ACA]",
3557
3559
  current: "text-white font-bold",
@@ -3563,23 +3565,22 @@ function Stepper({ steps, currentStep, completedSteps = [], disabledSteps = [],
3563
3565
  upcoming: "text-slate-500",
3564
3566
  disabled: "text-slate-300"
3565
3567
  };
3566
- const connectorColor = dark ? state === "completed" ? "bg-[#2D8ACA]/50" : "bg-white/15" : state === "completed" ? "bg-brand-blue/50" : "bg-slate-200";
3567
3568
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
3568
3569
  "aria-current": isCurrent ? "step" : void 0,
3569
- className: "flex items-start gap-4 pb-8 last:pb-0",
3570
+ className: "flex items-stretch gap-4",
3570
3571
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
3571
- className: "relative flex flex-col items-center",
3572
+ className: "relative flex w-9 shrink-0 flex-col items-center",
3572
3573
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StepCircle, {
3573
3574
  state,
3574
3575
  number: idx + 1,
3575
3576
  icon: step.icon,
3576
3577
  dark
3577
3578
  }), !isLast && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
3578
- className: `mt-1 w-0.5 flex-1 min-h-[32px] ${connectorColor}`,
3579
+ className: `w-0.5 flex-1 ${connectorColor}`,
3579
3580
  "aria-hidden": "true"
3580
3581
  })]
3581
3582
  }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
3582
- className: "min-w-0 flex-1 pt-1",
3583
+ className: `min-w-0 flex-1 pt-1 ${!isLast ? "pb-6" : ""}`,
3583
3584
  children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
3584
3585
  className: `text-sm leading-tight ${labelColor[state]}`,
3585
3586
  children: step.label
package/lib/index.mjs CHANGED
@@ -3528,6 +3528,8 @@ function Stepper({ steps, currentStep, completedSteps = [], disabledSteps = [],
3528
3528
  const state = resolveState(step.id, currentStep, completedSteps, disabledSteps);
3529
3529
  const isCurrent = state === "current";
3530
3530
  const isLast = idx === steps.length - 1;
3531
+ const connectorDone = state === "completed";
3532
+ const connectorColor = dark ? connectorDone ? "bg-[#2D8ACA]/50" : "bg-white/15" : connectorDone ? "bg-brand-blue/50" : "bg-slate-200";
3531
3533
  const labelColor = dark ? {
3532
3534
  completed: "text-[#2D8ACA]",
3533
3535
  current: "text-white font-bold",
@@ -3539,23 +3541,22 @@ function Stepper({ steps, currentStep, completedSteps = [], disabledSteps = [],
3539
3541
  upcoming: "text-slate-500",
3540
3542
  disabled: "text-slate-300"
3541
3543
  };
3542
- const connectorColor = dark ? state === "completed" ? "bg-[#2D8ACA]/50" : "bg-white/15" : state === "completed" ? "bg-brand-blue/50" : "bg-slate-200";
3543
3544
  return /* @__PURE__ */ jsxs("li", {
3544
3545
  "aria-current": isCurrent ? "step" : void 0,
3545
- className: "flex items-start gap-4 pb-8 last:pb-0",
3546
+ className: "flex items-stretch gap-4",
3546
3547
  children: [/* @__PURE__ */ jsxs("div", {
3547
- className: "relative flex flex-col items-center",
3548
+ className: "relative flex w-9 shrink-0 flex-col items-center",
3548
3549
  children: [/* @__PURE__ */ jsx(StepCircle, {
3549
3550
  state,
3550
3551
  number: idx + 1,
3551
3552
  icon: step.icon,
3552
3553
  dark
3553
3554
  }), !isLast && /* @__PURE__ */ jsx("div", {
3554
- className: `mt-1 w-0.5 flex-1 min-h-[32px] ${connectorColor}`,
3555
+ className: `w-0.5 flex-1 ${connectorColor}`,
3555
3556
  "aria-hidden": "true"
3556
3557
  })]
3557
3558
  }), /* @__PURE__ */ jsxs("div", {
3558
- className: "min-w-0 flex-1 pt-1",
3559
+ className: `min-w-0 flex-1 pt-1 ${!isLast ? "pb-6" : ""}`,
3559
3560
  children: [/* @__PURE__ */ jsx("p", {
3560
3561
  className: `text-sm leading-tight ${labelColor[state]}`,
3561
3562
  children: step.label
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@diwauhris/ui",
3
3
  "private": false,
4
- "version": "1.7.7",
4
+ "version": "1.7.8",
5
5
  "type": "module",
6
6
  "description": "DIWA UHRIS UI component library — React + Tailwind CSS",
7
7
  "keywords": [