dhre-component-lib 0.10.0 → 0.11.0

package/dist/components/Stepper/Stepper.d.ts

@@ -8,6 +8,7 @@ interface StepperData {
     value?: string;
     img?: React.ReactNode;
 }
+type StepperWeight = "BOLD" | "SEMI_BOLD" | "MEDIUM" | "REGULAR" | "LIGHT";
 interface StepperInterface {
     stepperData: StepperData[];
     type: string;
@@ -23,6 +24,7 @@ interface StepperInterface {
     variant?: any;
     displayRightContent?: boolean;
     isPaymentPlanFlow?: boolean;
+    weight?: StepperWeight;
 }
 declare const Stepper: React.FC<StepperInterface>;
 export default Stepper;

package/dist/index.d.ts

@@ -557,6 +557,7 @@ interface StepperData {
     value?: string;
     img?: React.ReactNode;
 }
+type StepperWeight = "BOLD" | "SEMI_BOLD" | "MEDIUM" | "REGULAR" | "LIGHT";
 interface StepperInterface {
     stepperData: StepperData[];
     type: string;
@@ -572,6 +573,7 @@ interface StepperInterface {
     variant?: any;
     displayRightContent?: boolean;
     isPaymentPlanFlow?: boolean;
+    weight?: StepperWeight;
 }
 declare const Stepper: React.FC<StepperInterface>;
 

package/dist/index.esm.js

@@ -22644,7 +22644,7 @@ const Carousel = ({ items }) => {
 var css = ".stepperCircle {\n  width: 1.75rem;\n  height: 1.75rem;\n  border-radius: 50%;\n  border: 1px solid #000000;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0 !important;\n}\n\n.contentSecondary {\n  color: #686868;\n}\n\n.stepperSuccessBorder {\n  border: none;\n}\n\n.stepperNotReachedBorder {\n  border: 1px solid #a7a7a7;\n}\n\n.stepperAlignment {\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  align-items: baseline;\n  justify-content: space-between;\n}\n\n.stepperItem {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin-bottom: 1rem;\n}\n\n.marginRight1 {\n  margin-inline-end: 1rem;\n}\n\n.stepperVerticalItem {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  justify-content: space-between;\n}\n\n.stepperDivider {\n  width: 88%;\n  border: 1px dashed #898989;\n  height: 0.125rem;\n  margin: 0 1rem;\n}\n\n.stepperDisabledDivider {\n  width: 88%;\n  border: 1px dashed #898989;\n  height: 0.125rem;\n  margin: 0 1rem;\n}\n\n.stepperPlainDivider {\n  width: 88%;\n  border: 1px solid var(--content-primary);\n  height: 0.125rem;\n  margin: 0 1rem;\n}\n\n.stepperVerticalDivider {\n  border-inline-start: 2px solid var(--content-primary);\n  min-height: 2rem;\n  max-height: 100%;\n  margin-inline-start: 1.25rem;\n  padding-inline-start: 2rem;\n  margin-top: 0.5rem;\n  margin-bottom: 0.5rem;\n}\n\n.stepperVerticalCircle {\n  min-width: 2.5rem;\n  height: 2.5rem;\n  border-radius: 50%;\n  border: 2px solid var(--content-primary);\n  color: #ffffff;\n  background: var(--surface-inverted);\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  margin-inline-end: 1rem;\n}\n\n.stepperVerticalDisabledDivider {\n  width: 1.75rem;\n  min-height: 2rem;\n  max-height: 100%;\n  margin: 0.75rem 0;\n  background-image: linear-gradient(#686868 50%, rgba(255, 255, 255, 0) 0%);\n  background-position: center;\n  background-size: 0.5px 10px;\n  background-repeat: repeat-y;\n}\n\n.stepperVerticalPlainDivider {\n  width: 2px;\n  border-inline-start: 1px solid #008256;\n  min-height: 2rem;\n  max-height: 100%;\n  margin: 0.75rem 0;\n  margin-inline-start: 0.875rem;\n}\n\n.stepperVerticalAlignment {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n}\n\n.flex {\n  display: flex;\n  flex-direction: row;\n}\n\n.warning {\n  color: var(--semantic-warning2);\n}\n\n.error {\n  color: var(--semantic-error);\n}\n\n.stepperWarningCircle {\n  border: 2px solid var(--semantic-warning2);\n}\n\n.stepperErrorCircle {\n  border: 2px solid var(--semantic-error);\n}\n\n.flexCenter {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.marginRight {\n  margin-inline-end: 1rem;\n  margin-top: -0.3rem;\n}\n\n.column {\n  display: flex;\n  flex-direction: column;\n}\n\n.typoClass {\n  color: #686868;\n  margin-top: 4px;\n}\n\n.contentPrimary {\n  color: var(--content-primary);\n}";
 n(css,{});
 
-const Stepper = ({ variant, dividerWidth, submittedDate, component, status, statusIcon, successIcon, currentStep, stepperData, type, alignment, showLabelIndex, displayRightContent, isPaymentPlanFlow, }) => {
+const Stepper = ({ variant, dividerWidth, submittedDate, component, status, statusIcon, successIcon, currentStep, stepperData, type, alignment, showLabelIndex, displayRightContent, isPaymentPlanFlow, weight = "SEMI_BOLD", }) => {
     return (React__default.createElement(React__default.Fragment, null,
         alignment !== "vertical" && (React__default.createElement(React__default.Fragment, null,
             type === "static" && (React__default.createElement("div", { className: "stepperAlignment" }, stepperData?.map((val) => (React__default.createElement("div", { key: val.id, style: {
@@ -22654,7 +22654,7 @@ const Stepper = ({ variant, dividerWidth, submittedDate, component, status, stat
                 } },
                 React__default.createElement("div", { className: "stepperItem" },
                     React__default.createElement("div", { style: { flexShrink: 0 }, className: "stepperCircle" }, showLabelIndex ? val.id : "")),
-                React__default.createElement(Typography, { variant: variant, weight: "SEMI_BOLD" }, val?.name)))))),
+                React__default.createElement(Typography, { variant: variant, weight: weight }, val?.name)))))),
             type === "dynamic" && (React__default.createElement("div", { className: "stepperAlignment" }, stepperData?.map((val) => (React__default.createElement("div", { key: val.id, style: {
                     width: val.id < stepperData.length
                         ? 100 / (stepperData.length - 1) + "%"
@@ -22671,7 +22671,7 @@ const Stepper = ({ variant, dividerWidth, submittedDate, component, status, stat
                             : "stepperDisabledDivider", style: { width: dividerWidth ?? "" } }, " "))),
                 React__default.createElement(Typography, { className: currentStep && currentStep < val.id
                         ? "contentSecondary"
-                        : "contentPrimary", variant: variant, weight: "SEMI_BOLD" }, val?.name)))))))),
+                        : "contentPrimary", variant: variant, weight: weight }, val?.name)))))))),
         alignment === "vertical" && (React__default.createElement(React__default.Fragment, null,
             type === "dynamic" && (React__default.createElement("div", { className: "stepperVerticalAlignment" }, stepperData?.map((val) => (React__default.createElement(React__default.Fragment, null,
                 React__default.createElement("div", { className: "stepperVerticalItem" },
@@ -22693,11 +22693,11 @@ const Stepper = ({ variant, dividerWidth, submittedDate, component, status, stat
                         React__default.createElement(Typography, { className: currentStep &&
                                 (currentStep === val.id || currentStep < val.id)
                                 ? "contentSecondary"
-                                : "", variant: "B2", weight: "SEMI_BOLD" }, val?.name)),
+                                : "", variant: "B2", weight: weight }, val?.name)),
                     currentStep === val.id && (React__default.createElement("div", { className: `${"flex"} ${status === "Rejected" ? "error" : "warning"}` },
                         statusIcon,
                         status)),
-                    displayRightContent && (React__default.createElement(Typography, { variant: "B2", weight: "SEMI_BOLD" }, val?.value))),
+                    displayRightContent && (React__default.createElement(Typography, { variant: "B2", weight: weight }, val?.value))),
                 React__default.createElement("div", null,
                     React__default.createElement("div", { className: val.id < stepperData.length
                             ? currentStep && currentStep > val.id
@@ -22715,8 +22715,8 @@ const Stepper = ({ variant, dividerWidth, submittedDate, component, status, stat
                     React__default.createElement("div", { className: "flexCenter" },
                         React__default.createElement("div", { className: "stepperVerticalCircle" }, showLabelIndex ? val.id : ""),
                         React__default.createElement("div", { className: "column" },
-                            React__default.createElement(Typography, { variant: variant ?? "B2", weight: "SEMI_BOLD", className: "contentPrimary" }, val?.name),
-                            React__default.createElement(Typography, { variant: variant ? "L2" : "B3", weight: "SEMI_BOLD", className: "typoClass" }, val?.value)))),
+                            React__default.createElement(Typography, { variant: variant ?? "B2", weight: weight, className: "contentPrimary" }, val?.name),
+                            React__default.createElement(Typography, { variant: variant ? "L2" : "B3", weight: weight, className: "typoClass" }, val?.value)))),
                 React__default.createElement("div", null, val.id < stepperData.length && (React__default.createElement("div", { className: "stepperVerticalDivider" }, " "))))))))))));
 };