dhre-component-lib 0.7.3 → 0.7.5
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/index.esm.js +3 -3
- package/dist/index.js +3 -3
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -9512,7 +9512,7 @@ const Search = ({ searchIcon, crossIcon, disabled = false, onSearch, onSelectSug
|
|
|
9512
9512
|
React__default.createElement("div", { className: "underline" }))))) : (React__default.createElement(Typography, { variant: "B4", weight: "SEMI_BOLD", className: "no-suggestions" }, "No results found"))))));
|
|
9513
9513
|
};
|
|
9514
9514
|
|
|
9515
|
-
var css$c = ".modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.6);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n}\n\n.modal-container {\n background-color: white;\n padding: 40px;\n border-radius: 20px;\n width: 560px;\n max-width: 560px;\n box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);\n position: relative;\n transition: transform 0.3s ease, opacity 0.3s ease;\n}\n@media (min-width: 768px) {\n .modal-container {\n width: 80%;\n }\n}\n@media (min-width: 1024px) {\n .modal-container {\n width: 60%;\n }\n}\n\n.modal-header {\n font-size: 1.5rem;\n font-weight: bold;\n margin-bottom: 15px;\n}\n\n.modal-content {\n margin-bottom: 20px;\n}\n\n.modal-close {\n position: absolute;\n top: 40px;\n right: 40px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n}\n\n@media (max-width: 767px) {\n .modal-container {\n width: 95%;\n }\n}";
|
|
9515
|
+
var css$c = ".modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.6);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n backdrop-filter: blur(3px);\n}\n\n.modal-container {\n background-color: white;\n padding: 40px;\n border-radius: 20px;\n width: 560px;\n max-width: 560px;\n box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);\n position: relative;\n transition: transform 0.3s ease, opacity 0.3s ease;\n}\n@media (min-width: 768px) {\n .modal-container {\n width: 80%;\n }\n}\n@media (min-width: 1024px) {\n .modal-container {\n width: 60%;\n }\n}\n\n.modal-header {\n font-size: 1.5rem;\n font-weight: bold;\n margin-bottom: 15px;\n}\n\n.modal-content {\n margin-bottom: 20px;\n}\n\n.modal-close {\n position: absolute;\n top: 40px;\n right: 40px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n}\n\n@media (max-width: 767px) {\n .modal-container {\n width: 95%;\n }\n}";
|
|
9516
9516
|
n(css$c,{});
|
|
9517
9517
|
|
|
9518
9518
|
const Modal = ({ isOpen, onClose, title, children, crossIcon, className }) => {
|
|
@@ -9667,7 +9667,7 @@ function TextArea(props) {
|
|
|
9667
9667
|
charText)));
|
|
9668
9668
|
}
|
|
9669
9669
|
|
|
9670
|
-
var css$7 = ".backdrop {\n position: fixed;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n z-index:
|
|
9670
|
+
var css$7 = ".backdrop {\n position: fixed;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n z-index: 5;\n backdrop-filter: blur(3px);\n}\n\n.sideDrawerContainer {\n min-height: 100%;\n background: #ffffff;\n position: fixed;\n z-index: 5;\n padding: 1.5rem;\n height: 100vh;\n transition: transform 0.3s ease;\n box-shadow: 0.5px 0 4px #000000;\n}\n@media (max-width: 768px) {\n .sideDrawerContainer {\n width: 100vw;\n height: 100vh;\n }\n}\n\n.sideDrawerRight {\n right: 0;\n top: 0;\n}\n\n.sideDrawerLeft {\n left: 0;\n top: 0;\n}\n\n.sideDrawerTop {\n top: 0;\n left: 0;\n width: 100%;\n height: auto;\n}\n\n.sideDrawerBottom {\n bottom: 0;\n left: 0;\n width: 100%;\n height: auto;\n}";
|
|
9671
9671
|
n(css$7,{});
|
|
9672
9672
|
|
|
9673
9673
|
const Drawer = ({ openSideDrawer, closeSideDrawer, width = "", component, anchor, // Default anchor is right
|
|
@@ -9906,7 +9906,7 @@ const Carousel = ({ items }) => {
|
|
|
9906
9906
|
React__default.createElement("div", { className: "carousel-dots" }, items?.map((_, index) => (React__default.createElement("span", { key: index, "data-testid": `dot-${index}`, className: `dot ${index === currentIndex ? "active" : ""}`, onClick: () => handleDotClick(index) }))))));
|
|
9907
9907
|
};
|
|
9908
9908
|
|
|
9909
|
-
var css = ".stepperCircle {\n width: 1.75rem;\n height: 1.75rem;\n border-radius: 50%;\n border: 2px solid #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n aspect-ratio: 1;\n}\n\n.contentSecondary {\n color: #686868;\n}\n\n.stepperSuccessBorder {\n border: none;\n}\n\n.stepperNotReachedBorder {\n border: 2px 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-right: 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: 2px dashed #898989;\n height: 0.125rem;\n margin-left: 1rem;\n margin-right: 1rem;\n}\n\n.stepperDisabledDivider {\n width:
|
|
9909
|
+
var css = ".stepperCircle {\n width: 1.75rem;\n height: 1.75rem;\n border-radius: 50%;\n border: 2px solid #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n aspect-ratio: 1;\n}\n\n.contentSecondary {\n color: #686868;\n}\n\n.stepperSuccessBorder {\n border: none;\n}\n\n.stepperNotReachedBorder {\n border: 2px 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-right: 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: 2px dashed #898989;\n height: 0.125rem;\n margin-left: 1rem;\n margin-right: 1rem;\n}\n\n.stepperDisabledDivider {\n width: 100%;\n margin: 0 0.75rem;\n background-image: linear-gradient(to right, #686868 50%, rgba(255, 255, 255, 0) 0%);\n background-size: 10px 0.5px;\n background-repeat: repeat-x;\n height: 1px;\n}\n\n.stepperPlainDivider {\n width: 100%;\n border-top: 1px solid #000000;\n margin: 0 0.75rem;\n height: 1px;\n}\n\n.stepperVerticalDivider {\n border-left: 2px solid #000000;\n min-height: 2rem;\n max-height: 100%;\n margin-left: 1rem;\n padding-left: 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 #000000;\n color: #ffffff;\n background: #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n margin-right: 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-left: 1px solid #00b578;\n min-height: 2rem;\n max-height: 100%;\n margin: 0.75rem 0;\n margin-left: 0.875rem;\n}\n\n.paddingLeft2 {\n padding-left: 2.7rem;\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: #eb8425;\n}\n\n.error {\n color: #eb0542;\n}\n\n.stepperWarningCircle {\n border: 2px solid #eb8425;\n}\n\n.stepperErrorCircle {\n border: 2px solid #eb0542;\n}\n\n.flexCenter {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.marginRight {\n margin-right: 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}";
|
|
9910
9910
|
n(css,{});
|
|
9911
9911
|
|
|
9912
9912
|
const common = {
|
package/dist/index.js
CHANGED
|
@@ -9535,7 +9535,7 @@ const Search = ({ searchIcon, crossIcon, disabled = false, onSearch, onSelectSug
|
|
|
9535
9535
|
React__namespace.default.createElement("div", { className: "underline" }))))) : (React__namespace.default.createElement(Typography, { variant: "B4", weight: "SEMI_BOLD", className: "no-suggestions" }, "No results found"))))));
|
|
9536
9536
|
};
|
|
9537
9537
|
|
|
9538
|
-
var css$c = ".modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.6);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n}\n\n.modal-container {\n background-color: white;\n padding: 40px;\n border-radius: 20px;\n width: 560px;\n max-width: 560px;\n box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);\n position: relative;\n transition: transform 0.3s ease, opacity 0.3s ease;\n}\n@media (min-width: 768px) {\n .modal-container {\n width: 80%;\n }\n}\n@media (min-width: 1024px) {\n .modal-container {\n width: 60%;\n }\n}\n\n.modal-header {\n font-size: 1.5rem;\n font-weight: bold;\n margin-bottom: 15px;\n}\n\n.modal-content {\n margin-bottom: 20px;\n}\n\n.modal-close {\n position: absolute;\n top: 40px;\n right: 40px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n}\n\n@media (max-width: 767px) {\n .modal-container {\n width: 95%;\n }\n}";
|
|
9538
|
+
var css$c = ".modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.6);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n backdrop-filter: blur(3px);\n}\n\n.modal-container {\n background-color: white;\n padding: 40px;\n border-radius: 20px;\n width: 560px;\n max-width: 560px;\n box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);\n position: relative;\n transition: transform 0.3s ease, opacity 0.3s ease;\n}\n@media (min-width: 768px) {\n .modal-container {\n width: 80%;\n }\n}\n@media (min-width: 1024px) {\n .modal-container {\n width: 60%;\n }\n}\n\n.modal-header {\n font-size: 1.5rem;\n font-weight: bold;\n margin-bottom: 15px;\n}\n\n.modal-content {\n margin-bottom: 20px;\n}\n\n.modal-close {\n position: absolute;\n top: 40px;\n right: 40px;\n background: none;\n border: none;\n font-size: 1.5rem;\n cursor: pointer;\n}\n\n@media (max-width: 767px) {\n .modal-container {\n width: 95%;\n }\n}";
|
|
9539
9539
|
n(css$c,{});
|
|
9540
9540
|
|
|
9541
9541
|
const Modal = ({ isOpen, onClose, title, children, crossIcon, className }) => {
|
|
@@ -9690,7 +9690,7 @@ function TextArea(props) {
|
|
|
9690
9690
|
charText)));
|
|
9691
9691
|
}
|
|
9692
9692
|
|
|
9693
|
-
var css$7 = ".backdrop {\n position: fixed;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n z-index:
|
|
9693
|
+
var css$7 = ".backdrop {\n position: fixed;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.4);\n top: 0;\n left: 0;\n z-index: 5;\n backdrop-filter: blur(3px);\n}\n\n.sideDrawerContainer {\n min-height: 100%;\n background: #ffffff;\n position: fixed;\n z-index: 5;\n padding: 1.5rem;\n height: 100vh;\n transition: transform 0.3s ease;\n box-shadow: 0.5px 0 4px #000000;\n}\n@media (max-width: 768px) {\n .sideDrawerContainer {\n width: 100vw;\n height: 100vh;\n }\n}\n\n.sideDrawerRight {\n right: 0;\n top: 0;\n}\n\n.sideDrawerLeft {\n left: 0;\n top: 0;\n}\n\n.sideDrawerTop {\n top: 0;\n left: 0;\n width: 100%;\n height: auto;\n}\n\n.sideDrawerBottom {\n bottom: 0;\n left: 0;\n width: 100%;\n height: auto;\n}";
|
|
9694
9694
|
n(css$7,{});
|
|
9695
9695
|
|
|
9696
9696
|
const Drawer = ({ openSideDrawer, closeSideDrawer, width = "", component, anchor, // Default anchor is right
|
|
@@ -9929,7 +9929,7 @@ const Carousel = ({ items }) => {
|
|
|
9929
9929
|
React__namespace.default.createElement("div", { className: "carousel-dots" }, items?.map((_, index) => (React__namespace.default.createElement("span", { key: index, "data-testid": `dot-${index}`, className: `dot ${index === currentIndex ? "active" : ""}`, onClick: () => handleDotClick(index) }))))));
|
|
9930
9930
|
};
|
|
9931
9931
|
|
|
9932
|
-
var css = ".stepperCircle {\n width: 1.75rem;\n height: 1.75rem;\n border-radius: 50%;\n border: 2px solid #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n aspect-ratio: 1;\n}\n\n.contentSecondary {\n color: #686868;\n}\n\n.stepperSuccessBorder {\n border: none;\n}\n\n.stepperNotReachedBorder {\n border: 2px 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-right: 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: 2px dashed #898989;\n height: 0.125rem;\n margin-left: 1rem;\n margin-right: 1rem;\n}\n\n.stepperDisabledDivider {\n width:
|
|
9932
|
+
var css = ".stepperCircle {\n width: 1.75rem;\n height: 1.75rem;\n border-radius: 50%;\n border: 2px solid #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n aspect-ratio: 1;\n}\n\n.contentSecondary {\n color: #686868;\n}\n\n.stepperSuccessBorder {\n border: none;\n}\n\n.stepperNotReachedBorder {\n border: 2px 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-right: 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: 2px dashed #898989;\n height: 0.125rem;\n margin-left: 1rem;\n margin-right: 1rem;\n}\n\n.stepperDisabledDivider {\n width: 100%;\n margin: 0 0.75rem;\n background-image: linear-gradient(to right, #686868 50%, rgba(255, 255, 255, 0) 0%);\n background-size: 10px 0.5px;\n background-repeat: repeat-x;\n height: 1px;\n}\n\n.stepperPlainDivider {\n width: 100%;\n border-top: 1px solid #000000;\n margin: 0 0.75rem;\n height: 1px;\n}\n\n.stepperVerticalDivider {\n border-left: 2px solid #000000;\n min-height: 2rem;\n max-height: 100%;\n margin-left: 1rem;\n padding-left: 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 #000000;\n color: #ffffff;\n background: #000000;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n margin-right: 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-left: 1px solid #00b578;\n min-height: 2rem;\n max-height: 100%;\n margin: 0.75rem 0;\n margin-left: 0.875rem;\n}\n\n.paddingLeft2 {\n padding-left: 2.7rem;\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: #eb8425;\n}\n\n.error {\n color: #eb0542;\n}\n\n.stepperWarningCircle {\n border: 2px solid #eb8425;\n}\n\n.stepperErrorCircle {\n border: 2px solid #eb0542;\n}\n\n.flexCenter {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n.marginRight {\n margin-right: 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}";
|
|
9933
9933
|
n(css,{});
|
|
9934
9934
|
|
|
9935
9935
|
const common = {
|