@rolster/react-components 19.1.10 → 19.1.11
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/cjs/assets/{index-BaDqtd9t.css → index-CDqDWlee.css} +10 -10
- package/dist/cjs/index.js +15 -15
- package/dist/cjs/index.js.map +1 -1
- package/dist/es/assets/{index-BaDqtd9t.css → index-CDqDWlee.css} +10 -10
- package/dist/es/index.js +15 -15
- package/dist/es/index.js.map +1 -1
- package/dist/esm/components/atoms/Avatar/Avatar.css +1 -1
- package/dist/esm/components/atoms/Avatar/Avatar.css.map +1 -1
- package/dist/esm/components/atoms/Avatar/Avatar.d.ts +2 -2
- package/dist/esm/components/atoms/Avatar/Avatar.js +3 -3
- package/dist/esm/components/atoms/Avatar/Avatar.js.map +1 -1
- package/dist/esm/components/atoms/Badge/Badge.css +7 -7
- package/dist/esm/components/atoms/Badge/Badge.css.map +1 -1
- package/dist/esm/components/atoms/Badge/Badge.d.ts +2 -2
- package/dist/esm/components/atoms/Badge/Badge.js +3 -3
- package/dist/esm/components/atoms/Badge/Badge.js.map +1 -1
- package/dist/esm/components/atoms/Poster/Poster.css +2 -2
- package/dist/esm/components/atoms/Poster/Poster.css.map +1 -1
- package/dist/esm/components/atoms/Poster/Poster.d.ts +2 -2
- package/dist/esm/components/atoms/Poster/Poster.js +3 -3
- package/dist/esm/components/atoms/Poster/Poster.js.map +1 -1
- package/dist/esm/components/organisms/Datatable/Datatable.d.ts +1 -1
- package/dist/esm/components/organisms/Datatable/Datatable.js +6 -6
- package/dist/esm/components/organisms/Datatable/Datatable.js.map +1 -1
- package/package.json +2 -2
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
.rls-avatar--rounded {
|
|
95
95
|
border-radius: 50%;
|
|
96
96
|
}
|
|
97
|
-
.rls-avatar--
|
|
97
|
+
.rls-avatar--contrasted {
|
|
98
98
|
color: var(--rls-theme-color-500);
|
|
99
99
|
background: var(--rls-theme-color-100);
|
|
100
100
|
}
|
|
@@ -110,8 +110,8 @@
|
|
|
110
110
|
--pvt-dimension: var(--rlc-badge-dimension, var(--rls-sizing-x12));
|
|
111
111
|
--pvt-font-color: var(--rls-app-color-050);
|
|
112
112
|
--pvt-background: var(--rls-app-color-700);
|
|
113
|
-
--pvt-
|
|
114
|
-
--pvt-
|
|
113
|
+
--pvt-contrasted-font-color: var(--rls-app-color-600);
|
|
114
|
+
--pvt-contrasted-background: var(--rls-app-color-200);
|
|
115
115
|
position: relative;
|
|
116
116
|
display: inline-block;
|
|
117
117
|
width: auto;
|
|
@@ -131,15 +131,15 @@
|
|
|
131
131
|
background: var(--pvt-background);
|
|
132
132
|
border-radius: var(--rlc-badge-radius, calc(var(--pvt-dimension) / 2));
|
|
133
133
|
}
|
|
134
|
-
.rls-badge--
|
|
135
|
-
color: var(--pvt-
|
|
136
|
-
background: var(--pvt-
|
|
134
|
+
.rls-badge--contrasted {
|
|
135
|
+
color: var(--pvt-contrasted-font-color);
|
|
136
|
+
background: var(--pvt-contrasted-background);
|
|
137
137
|
}
|
|
138
138
|
.rls-badge[rls-theme] {
|
|
139
139
|
--pvt-font-color: var(--rls-theme-color-050);
|
|
140
140
|
--pvt-background: var(--rls-theme-color-500);
|
|
141
|
-
--pvt-
|
|
142
|
-
--pvt-
|
|
141
|
+
--pvt-contrasted-font-color: var(--rls-theme-color-700);
|
|
142
|
+
--pvt-contrasted-background: var(--rls-theme-color-100);
|
|
143
143
|
}
|
|
144
144
|
.rls-badge > span {
|
|
145
145
|
font-size: inherit;
|
|
@@ -975,11 +975,11 @@
|
|
|
975
975
|
color: var(--rls-theme-color-050);
|
|
976
976
|
background: var(--rls-theme-color-500);
|
|
977
977
|
}
|
|
978
|
-
.rls-poster--
|
|
978
|
+
.rls-poster--contrasted {
|
|
979
979
|
color: var(--rls-app-color-700);
|
|
980
980
|
background: var(--rls-app-color-200);
|
|
981
981
|
}
|
|
982
|
-
.rls-poster--
|
|
982
|
+
.rls-poster--contrasted[rls-theme] {
|
|
983
983
|
color: var(--rls-theme-color-700);
|
|
984
984
|
background: var(--rls-theme-color-100);
|
|
985
985
|
} /*# sourceMappingURL=Poster.css.map */
|
package/dist/es/index.js
CHANGED
|
@@ -464,17 +464,17 @@ function RlsAmount({ value, decimals, rlsTheme, symbol }) {
|
|
|
464
464
|
return (jsxRuntimeExports.jsxs("div", { className: "rls-amount", "rls-theme": rlsTheme, children: [symbol && jsxRuntimeExports.jsx("span", { className: "rls-amount__symbol", children: symbol }), jsxRuntimeExports.jsxs("div", { className: "rls-amount__content", children: [jsxRuntimeExports.jsx(RlsTabularText, { className: "rls-amount__integer", value: integer }), decimal && (jsxRuntimeExports.jsx(RlsTabularText, { className: "rls-amount__decimal", value: decimal }))] })] }));
|
|
465
465
|
}
|
|
466
466
|
|
|
467
|
-
function RlsAvatar({ children,
|
|
467
|
+
function RlsAvatar({ children, contrasted, rounded, skeleton, rlsTheme }) {
|
|
468
468
|
const className = useMemo(() => {
|
|
469
|
-
return renderClassStatus('rls-avatar', {
|
|
470
|
-
}, [
|
|
469
|
+
return renderClassStatus('rls-avatar', { contrasted, rounded, skeleton });
|
|
470
|
+
}, [contrasted, rounded, skeleton]);
|
|
471
471
|
return (jsxRuntimeExports.jsx("div", { className: className, "rls-theme": rlsTheme, children: children }));
|
|
472
472
|
}
|
|
473
473
|
|
|
474
|
-
function RlsBadge({ children,
|
|
474
|
+
function RlsBadge({ children, contrasted, rlsTheme }) {
|
|
475
475
|
const className = useMemo(() => {
|
|
476
|
-
return renderClassStatus('rls-badge', {
|
|
477
|
-
}, [
|
|
476
|
+
return renderClassStatus('rls-badge', { contrasted });
|
|
477
|
+
}, [contrasted]);
|
|
478
478
|
return (jsxRuntimeExports.jsx("span", { className: className, "rls-theme": rlsTheme, children: children }));
|
|
479
479
|
}
|
|
480
480
|
|
|
@@ -733,10 +733,10 @@ function RlsMessageIcon({ icon, children, rlsTheme }) {
|
|
|
733
733
|
return (jsxRuntimeExports.jsxs("div", { className: "rls-message-icon", "rls-theme": rlsTheme, children: [icon && jsxRuntimeExports.jsx(RlsIcon, { value: icon }), jsxRuntimeExports.jsx("span", { className: "truncate", children: children })] }));
|
|
734
734
|
}
|
|
735
735
|
|
|
736
|
-
function RlsPoster({ children,
|
|
736
|
+
function RlsPoster({ children, contrasted, rlsTheme }) {
|
|
737
737
|
const className = useMemo(() => {
|
|
738
|
-
return renderClassStatus('rls-poster', {
|
|
739
|
-
}, [
|
|
738
|
+
return renderClassStatus('rls-poster', { contrasted });
|
|
739
|
+
}, [contrasted]);
|
|
740
740
|
return (jsxRuntimeExports.jsx("div", { className: className, "rls-theme": rlsTheme, children: children }));
|
|
741
741
|
}
|
|
742
742
|
|
|
@@ -1708,10 +1708,10 @@ function RlsDatatable({ children, footer, header, identifier, rlsTheme, resizabl
|
|
|
1708
1708
|
function RlsDatatableHeader({ children, identifier, rlsTheme }) {
|
|
1709
1709
|
return (jsxRuntimeExports.jsx("tr", { id: identifier, className: "rls-datatable__header", "rls-theme": rlsTheme, children: children }));
|
|
1710
1710
|
}
|
|
1711
|
-
function RlsDatatableTitle({ children, className, control, identifier, rlsTheme }) {
|
|
1711
|
+
function RlsDatatableTitle({ children, className, contained, control, identifier, rlsTheme }) {
|
|
1712
1712
|
const classNameTitle = useMemo(() => {
|
|
1713
|
-
return renderClassStatus('rls-datatable__title', { control }, className);
|
|
1714
|
-
}, [className, control]);
|
|
1713
|
+
return renderClassStatus('rls-datatable__title', { contained, control }, className);
|
|
1714
|
+
}, [className, contained, control]);
|
|
1715
1715
|
return (jsxRuntimeExports.jsx("th", { id: identifier, className: classNameTitle, "rls-theme": rlsTheme, children: children }));
|
|
1716
1716
|
}
|
|
1717
1717
|
function RlsDatatableSubheader({ children, className, identifier, rlsTheme }) {
|
|
@@ -1723,19 +1723,19 @@ function RlsDatatableSubheader({ children, className, identifier, rlsTheme }) {
|
|
|
1723
1723
|
function RlsDatatableRecord({ children, className, contained, error, identifier, info, success, warning, rlsTheme }) {
|
|
1724
1724
|
const classNameRecord = useMemo(() => {
|
|
1725
1725
|
return renderClassStatus('rls-datatable__record', { error, info, contained, success, warning }, className);
|
|
1726
|
-
}, [className, error, info,
|
|
1726
|
+
}, [className, contained, error, info, success, warning]);
|
|
1727
1727
|
return (jsxRuntimeExports.jsx("tr", { id: identifier, className: classNameRecord, "rls-theme": rlsTheme, children: children }));
|
|
1728
1728
|
}
|
|
1729
1729
|
function RlsDatatableTotals({ children, className, contained, error, identifier, info, success, warning, rlsTheme }) {
|
|
1730
1730
|
const classNameTotals = useMemo(() => {
|
|
1731
1731
|
return renderClassStatus('rls-datatable__totals', { error, info, contained, success, warning }, className);
|
|
1732
|
-
}, [className, error, info,
|
|
1732
|
+
}, [className, contained, error, info, success, warning]);
|
|
1733
1733
|
return (jsxRuntimeExports.jsx("div", { id: identifier, className: classNameTotals, "rls-theme": rlsTheme, children: children }));
|
|
1734
1734
|
}
|
|
1735
1735
|
function RlsDatatableCell({ children, className, contained, control, identifier, rlsTheme }) {
|
|
1736
1736
|
const classNameCell = useMemo(() => {
|
|
1737
1737
|
return renderClassStatus('rls-datatable__cell', { control, contained }, className);
|
|
1738
|
-
}, [className,
|
|
1738
|
+
}, [className, contained, control]);
|
|
1739
1739
|
return (jsxRuntimeExports.jsx("td", { id: identifier, className: classNameCell, "rls-theme": rlsTheme, children: children }));
|
|
1740
1740
|
}
|
|
1741
1741
|
function RlsDatatableData({ children, className, contained, control, identifier }) {
|