@rolster/react-components 18.24.2 → 18.24.4

package/dist/es/assets/{index-C0VgKdqS.css → index-CHKvQAp7.css}

@@ -63,6 +63,8 @@
 } /*# sourceMappingURL=Amount.css.map */
 
 .rls-avatar {
+  --rlc-image-width: var(--rlc-avatar-width);
+  --rlc-image-height: var(--rlc-avatar-height);
   position: relative;
   display: flex;
   justify-content: center;
@@ -117,6 +119,15 @@
 .rls-breadcrumb {
   --pvt-height: var(--rlc-breadcrumb-height, var(--rls-sizing-x18));
   --pvt-link-font-color: var(--rls-app-color-600);
+  --pvt-label-font-size: var(
+    --rlc-breadcrumb-font-size,
+    var(--rls-body-font-size)
+  );
+  --pvt-label-font-weight: var(--rlc-breadcrumb-font-weight, inherit);
+  --pvt-label-letter-spacing: var(
+    --rlc-breadcrumb-letter-spacing,
+    var(--rls-body-letter-spacing)
+  );
   display: -webkit-box;
   width: 100%;
   height: var(--pvt-height);
@@ -136,11 +147,11 @@
 .rls-breadcrumb__label {
   display: block;
   height: inherit;
-  line-height: inherit;
-  font-weight: inherit;
   color: inherit;
-  font-size: var(--rls-body-font-size);
-  letter-spacing: var(--rls-body-letter-spacing);
+  line-height: inherit;
+  font-weight: var(--pvt-label-font-weight);
+  font-size: var(--pvt-label--font-size);
+  letter-spacing: var(--pvt-label--letter-spacing);
 }
 .rls-breadcrumb__label:first-child::before {
   display: none;
@@ -1964,8 +1975,8 @@
   display: flex;
   top: 0rem;
   left: 0rem;
-  width: 100vw;
-  height: 100vh;
+  width: var(--rls-html-max-width);
+  height: var(--rls-html-max-height);
   justify-content: center;
   align-items: center;
   z-index: var(--rls-z-index-24);
@@ -2091,7 +2102,7 @@
   .rls-confirmation__actions {
     flex-direction: column-reverse;
     column-gap: 0rem;
-    row-gap: var(--rls-sizing-x8);
+    row-gap: var(--rls-sizing-x4);
   }
 } /*# sourceMappingURL=Confirmation.css.map */
 
@@ -2517,7 +2528,7 @@
   width: calc(100% - var(--rls-sizing-x16));
   max-width: 160rem;
   height: auto;
-  max-height: calc(100vh - var(--rls-sizing-x16));
+  max-height: calc(var(--rls-html-max-height) - var(--rls-sizing-x16));
   z-index: var(--rls-z-index-12);
   padding: var(--rls-sizing-x8) var(--rls-sizing-x8) var(--rls-sizing-x12)
     var(--rls-sizing-x8);

package/dist/es/index.js

@@ -1406,7 +1406,7 @@ function RlsBreadcrumbLabel({ label }) {
             actionable: !!label.onClick
         });
     }, [label.onClick]);
-    return (jsxRuntimeExports.jsx("label", { className: "rls-breadcrumb__label", onClick: label.onClick, children: jsxRuntimeExports.jsx("a", { className: className, "rls-theme": label.rlsTheme, children: label.label }) }));
+    return (jsxRuntimeExports.jsx("span", { className: "rls-breadcrumb__label", onClick: label.onClick, children: jsxRuntimeExports.jsx("a", { className: className, "rls-theme": label.rlsTheme, children: label.label }) }));
 }
 function RlsBreadcrumb({ labels }) {
     const children = useMemo(() => {
@@ -2086,7 +2086,9 @@ function RlsPickerDay({ date: _date, disabled, formControl, maxDate, month, minD
     return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-day", "rls-theme": rlsTheme, children: [headers, component] }));
 }
 
-const formatRange = '{dd}/{mx}/{aa}';
+const DATE_FORMAT = '{dd}/{mx}/{yy}';
+const DATE_RANGE_FORMAT = '{dd}/{mx}/{yy}';
+
 function RlsPickerDayRangeHeaders() {
     return (jsxRuntimeExports.jsx("div", { className: "rls-picker-day__header", children: DAY_LABELS().map((title, index) => (jsxRuntimeExports.jsx("label", { className: "rls-picker-day__label", children: title }, index))) }));
 }
@@ -2144,7 +2146,7 @@ function RlsPickerDayRange({ date: _date, disabled, formControl, maxDate, minDat
         }));
     }, [date, range, minDate, maxDate]);
     const title = useMemo(() => {
-        return (jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__title", children: dateFormatTemplate(sourceDate.current, formatRange) }));
+        return (jsxRuntimeExports.jsx("div", { className: "rls-picker-day-range__title", children: dateFormatTemplate(sourceDate.current, DATE_FORMAT) }));
     }, [sourceDate.current]);
     return (jsxRuntimeExports.jsxs("div", { className: "rls-picker-day-range", "rls-theme": rlsTheme, children: [title, headers, component] }));
 }
@@ -2828,9 +2830,6 @@ function RlsFieldAutocomplete(props) {
     return jsxRuntimeExports.jsx(RlsFieldAutocompleteTemplate, { ...props, render: render });
 }
 
-const DATE_FORMAT = '{dd}/{mx}/{yy}';
-const DATE_RANGE_FORMAT = '{dd}/{mx}/{yy}';
-
 function RlsModal({ children, className, overflow, visible, rlsTheme }) {
     const classNameModal = useMemo(() => {
         return renderClassStatus('rls-modal', { overflow, visible }, className);
@@ -3730,13 +3729,13 @@ function RlsApplication({ children }) {
     const { RlsConfirmation, confirmation } = useConfirmation();
     const { RlsSnackbar, snackbar } = useSnackbar();
     const [hasNavbar, setNavbarInApp] = useState(false);
-    const [isNavbarCondense, setNavbarIsCondense] = useState(false);
+    const [navbarIsCondense, setNavbarIsCondense] = useState(false);
     const className = useMemo(() => {
         return renderClassStatus('rls-app__body', {
             snackbar: hasNavbar,
-            'navbar-condense': isNavbarCondense
+            'navbar-condense': navbarIsCondense
         });
-    }, [hasNavbar, isNavbarCondense]);
+    }, [hasNavbar, navbarIsCondense]);
     return (jsxRuntimeExports.jsxs(RlsContext.Provider, { value: {
             confirmation,
             snackbar,