@rolster/react-components 18.10.9 → 18.10.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.
Files changed (25) hide show
  1. package/dist/cjs/assets/{index-nrIFu6l7.css → index-_J97liwf.css} +26 -27
  2. package/dist/cjs/index.js +7 -5
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/es/assets/{index-nrIFu6l7.css → index-_J97liwf.css} +26 -27
  5. package/dist/es/index.js +7 -5
  6. package/dist/es/index.js.map +1 -1
  7. package/dist/esm/components/atoms/Avatar/Avatar.css +0 -1
  8. package/dist/esm/components/atoms/CheckBox/CheckBox.css +2 -2
  9. package/dist/esm/components/atoms/RadioButton/RadioButton.css +2 -2
  10. package/dist/esm/components/molecules/ButtonToggle/ButtonToggle.css +2 -2
  11. package/dist/esm/components/molecules/DayPicker/DayPicker.css +2 -2
  12. package/dist/esm/components/molecules/DayRangePicker/DayRangePicker.css +2 -2
  13. package/dist/esm/components/molecules/MonthPicker/MonthPicker.css +2 -2
  14. package/dist/esm/components/molecules/Toolbar/Toolbar.css +1 -1
  15. package/dist/esm/components/molecules/YearPicker/YearPicker.css +1 -1
  16. package/dist/esm/components/organisms/Confirmation/Confirmation.css +4 -4
  17. package/dist/esm/components/organisms/Datatable/Datatable.d.ts +3 -2
  18. package/dist/esm/components/organisms/Datatable/Datatable.js +7 -5
  19. package/dist/esm/components/organisms/Datatable/Datatable.js.map +1 -1
  20. package/dist/esm/components/organisms/DatePicker/DatePicker.css +3 -3
  21. package/dist/esm/components/organisms/DateRangePicker/DateRangePicker.css +2 -2
  22. package/dist/esm/components/organisms/FormNavigation/FormNavigation.css +1 -1
  23. package/dist/esm/components/organisms/Modal/Modal.css +1 -1
  24. package/dist/esm/components/organisms/Snackbar/Snackbar.css +1 -1
  25. package/package.json +2 -2
@@ -1,6 +1,5 @@
1
1
  .rls-avatar {
2
2
  position: relative;
3
- float: left;
4
3
  display: flex;
5
4
  justify-content: center;
6
5
  overflow: hidden;
@@ -23,8 +23,8 @@
23
23
  }
24
24
  .rls-checkbox__component {
25
25
  border-radius: var(--sizing-x1);
26
- width: 0.875rem;
27
- height: 0.875rem;
26
+ width: 7rem;
27
+ height: 7rem;
28
28
  margin: auto;
29
29
  background: var(--gradient-rolster-500);
30
30
  transform: var(--pvt-component-transform);
@@ -23,8 +23,8 @@
23
23
  }
24
24
  .rls-radiobutton__component {
25
25
  border-radius: 50%;
26
- width: 0.875rem;
27
- height: 0.875rem;
26
+ width: 7rem;
27
+ height: 7rem;
28
28
  margin: auto;
29
29
  background: var(--gradient-rolster-500);
30
30
  transform: var(--pvt-component-transform);
@@ -19,7 +19,7 @@
19
19
  --rls-button-toggle-ul-opacity: 0;
20
20
  --rls-button-toggle-ul-transform: none;
21
21
  position: absolute;
22
- top: 2.8125rem;
22
+ top: 22.5rem;
23
23
  left: 0rem;
24
24
  width: 100%;
25
25
  height: 0rem;
@@ -67,7 +67,7 @@
67
67
  line-height: var(--sizing-x20);
68
68
  cursor: default;
69
69
  font-weight: var(--font-weight-bold);
70
- font-size: 0.825rem;
70
+ font-size: 6.6rem;
71
71
  letter-spacing: 0.825px;
72
72
  text-transform: uppercase;
73
73
  color: var(--color-theme-300);
@@ -5,7 +5,7 @@
5
5
  position: relative;
6
6
  float: left;
7
7
  width: 100%;
8
- max-width: 17.5rem;
8
+ max-width: 140rem;
9
9
  box-sizing: border-box;
10
10
  user-select: none;
11
11
  }
@@ -39,7 +39,7 @@
39
39
  height: var(--sizing-x18);
40
40
  line-height: var(--sizing-x18);
41
41
  margin: var(--sizing-x1) 0rem;
42
- font-size: 0.875rem;
42
+ font-size: 7rem;
43
43
  font-weight: var(--font-weight-semibold);
44
44
  background: var(--pvt-span-background);
45
45
  }
@@ -5,7 +5,7 @@
5
5
  position: relative;
6
6
  float: left;
7
7
  width: 100%;
8
- max-width: 17.5rem;
8
+ max-width: 140rem;
9
9
  box-sizing: border-box;
10
10
  user-select: none;
11
11
  }
@@ -39,7 +39,7 @@
39
39
  height: var(--sizing-x18);
40
40
  line-height: var(--sizing-x18);
41
41
  margin: var(--sizing-x1) 0rem;
42
- font-size: 0.875rem;
42
+ font-size: 7rem;
43
43
  font-weight: var(--font-weight-semibold);
44
44
  }
45
45
  .rls-day-range-picker__day__span:not(:hover) {
@@ -2,7 +2,7 @@
2
2
  position: relative;
3
3
  float: left;
4
4
  width: 100%;
5
- max-width: 17.5rem;
5
+ max-width: 140rem;
6
6
  display: grid;
7
7
  grid-template-columns: repeat(3, 1fr);
8
8
  gap: var(--sizing-x2);
@@ -32,7 +32,7 @@
32
32
  opacity: 0.5;
33
33
  }
34
34
  .rls-month-picker__span {
35
- font-size: 0.725rem;
35
+ font-size: 5.8rem;
36
36
  margin: auto;
37
37
  cursor: default;
38
38
  pointer-events: none;
@@ -32,7 +32,7 @@
32
32
  color: var(--color-theme-500);
33
33
  height: var(--sizing-x12);
34
34
  line-height: var(--sizing-x12);
35
- font-size: 1.0125rem;
35
+ font-size: 8.125rem;
36
36
  letter-spacing: var(--label-letter-spacing);
37
37
  font-weight: var(--font-weight-bold);
38
38
  }
@@ -2,7 +2,7 @@
2
2
  position: relative;
3
3
  float: left;
4
4
  width: 100%;
5
- max-width: 17.5rem;
5
+ max-width: 140rem;
6
6
  box-sizing: border-box;
7
7
  overflow: hidden;
8
8
  user-select: none;
@@ -11,9 +11,9 @@
11
11
  --pvt-subtitle-letter-spacing: var(--body-letter-spacing);
12
12
  --pvt-subtitle-line-height: var(--body-line-height);
13
13
  --pvt-subtitle-text-transform: initial;
14
- --pvt-content-font-size: 0.925rem;
14
+ --pvt-content-font-size: 7.4rem;
15
15
  --pvt-content-letter-spacing: 0.05em;
16
- --pvt-content-line-height: 1.325rem;
16
+ --pvt-content-line-height: 10.6rem;
17
17
  --pvt-backdrop-opacity: 0;
18
18
  --pvt-backdrop-bottom: initial;
19
19
  position: fixed;
@@ -42,7 +42,7 @@
42
42
  flex-direction: column;
43
43
  row-gap: var(--sizing-x8);
44
44
  width: calc(100% - var(--sizing-x16));
45
- max-width: 35rem;
45
+ max-width: 280rem;
46
46
  height: var(--pvt-component-height);
47
47
  opacity: var(--pvt-component-opacity);
48
48
  visibility: var(--pvt-component-visibility);
@@ -139,7 +139,7 @@
139
139
  --pvt-subtitle-font-size: var(--smalltext-font-size);
140
140
  --pvt-subtitle-letter-spacing: var(--smalltext-letter-spacing);
141
141
  --pvt-subtitle-line-height: var(--smalltext-line-height);
142
- --pvt-content-font-size: 0.9125rem;
142
+ --pvt-content-font-size: 7.325rem;
143
143
  }
144
144
  .rls-confirmation__footer__actions {
145
145
  flex-direction: column-reverse;
@@ -4,8 +4,9 @@ interface DatatableCellProps extends RlsComponent {
4
4
  control?: boolean;
5
5
  overflow?: boolean;
6
6
  }
7
- interface DatatableRowProps extends RlsComponent {
7
+ interface DatatableDateProps extends RlsComponent {
8
8
  className?: string;
9
+ error?: boolean;
9
10
  }
10
11
  interface DatatableProps extends RlsComponent {
11
12
  footer?: JSX.Element;
@@ -13,7 +14,7 @@ interface DatatableProps extends RlsComponent {
13
14
  }
14
15
  export declare function RlsDatatableHeader({ children }: RlsComponent): import("react/jsx-runtime").JSX.Element;
15
16
  export declare function RlsDatatableTitle({ children, className, control }: DatatableCellProps): import("react/jsx-runtime").JSX.Element;
16
- export declare function RlsDatatableData({ children, className }: DatatableRowProps): import("react/jsx-runtime").JSX.Element;
17
+ export declare function RlsDatatableData({ children, className, error }: DatatableDateProps): import("react/jsx-runtime").JSX.Element;
17
18
  export declare function RlsDatatableCell({ children, className, control, overflow }: DatatableCellProps): import("react/jsx-runtime").JSX.Element;
18
19
  export declare function RlsDatatable({ children, footer, header, rlsTheme }: DatatableProps): import("react/jsx-runtime").JSX.Element;
19
20
  export {};
@@ -4,14 +4,16 @@ export function RlsDatatableHeader({ children }) {
4
4
  return _jsx("tr", { className: "rls-datatable__header", children: children });
5
5
  }
6
6
  export function RlsDatatableTitle({ children, className, control }) {
7
- return (_jsx("th", { className: `${className} ` + renderClassStatus('rls-datatable__title', { control }), children: children }));
7
+ return (_jsx("th", { className: (renderClassStatus('rls-datatable__title', { control }) +
8
+ ` ${className || ''}`).trim(), children: children }));
8
9
  }
9
- export function RlsDatatableData({ children, className }) {
10
- return _jsx("tr", { className: `rls-datatable__data ${className}`, children: children });
10
+ export function RlsDatatableData({ children, className, error }) {
11
+ return (_jsx("tr", { className: (renderClassStatus('rls-datatable__data', { error }) +
12
+ ` ${className || ''}`).trim(), children: children }));
11
13
  }
12
14
  export function RlsDatatableCell({ children, className, control, overflow }) {
13
- return (_jsx("th", { className: `${className} ` +
14
- renderClassStatus('rls-datatable__cell', { control, overflow }), children: children }));
15
+ return (_jsx("th", { className: (renderClassStatus('rls-datatable__cell', { control, overflow }) +
16
+ ` ${className || ''}`).trim(), children: children }));
15
17
  }
16
18
  export function RlsDatatable({ children, footer, header, rlsTheme }) {
17
19
  return (_jsxs("div", { className: "rls-datatable", "rls-theme": rlsTheme, children: [_jsxs("table", { children: [header && _jsx("thead", { className: "rls-datatable__thead", children: header }), _jsx("tbody", { className: "rls-datatable__tbody", children: children })] }), footer && _jsx("div", { className: "rls-datatable__tfooter", children: footer })] }));
@@ -1 +1 @@
1
- {"version":3,"file":"Datatable.js","sourceRoot":"","sources":["../../../../../src/components/organisms/Datatable/Datatable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAkBvD,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAgB;IAC3D,OAAO,aAAI,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAM,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,OAAO,EACY;IACnB,OAAO,CACL,aACE,SAAS,EACP,GAAG,SAAS,GAAG,GAAG,iBAAiB,CAAC,sBAAsB,EAAE,EAAE,OAAO,EAAE,CAAC,YAGzE,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAqB;IACzE,OAAO,aAAI,SAAS,EAAE,uBAAuB,SAAS,EAAE,YAAG,QAAQ,GAAM,CAAC;AAC5E,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,aACE,SAAS,EACP,GAAG,SAAS,GAAG;YACf,iBAAiB,CAAC,qBAAqB,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,YAGhE,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,MAAM,EACN,QAAQ,EACO;IACf,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,eAAY,QAAQ,aAChD,4BACG,MAAM,IAAI,gBAAO,SAAS,EAAC,sBAAsB,YAAE,MAAM,GAAS,EAEnE,gBAAO,SAAS,EAAC,sBAAsB,YAAE,QAAQ,GAAS,IACpD,EAEP,MAAM,IAAI,cAAK,SAAS,EAAC,wBAAwB,YAAE,MAAM,GAAO,IAC7D,CACP,CAAC;AACJ,CAAC"}
1
+ {"version":3,"file":"Datatable.js","sourceRoot":"","sources":["../../../../../src/components/organisms/Datatable/Datatable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAmBvD,MAAM,UAAU,kBAAkB,CAAC,EAAE,QAAQ,EAAgB;IAC3D,OAAO,aAAI,SAAS,EAAC,uBAAuB,YAAE,QAAQ,GAAM,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,EAChC,QAAQ,EACR,SAAS,EACT,OAAO,EACY;IACnB,OAAO,CACL,aACE,SAAS,EAAE,CACT,iBAAiB,CAAC,sBAAsB,EAAE,EAAE,OAAO,EAAE,CAAC;YACtD,IAAI,SAAS,IAAI,EAAE,EAAE,CACtB,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,KAAK,EACc;IACnB,OAAO,CACL,aACE,SAAS,EAAE,CACT,iBAAiB,CAAC,qBAAqB,EAAE,EAAE,KAAK,EAAE,CAAC;YACnD,IAAI,SAAS,IAAI,EAAE,EAAE,CACtB,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,OAAO,EACP,QAAQ,EACW;IACnB,OAAO,CACL,aACE,SAAS,EAAE,CACT,iBAAiB,CAAC,qBAAqB,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC;YAC/D,IAAI,SAAS,IAAI,EAAE,EAAE,CACtB,CAAC,IAAI,EAAE,YAEP,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,EAC3B,QAAQ,EACR,MAAM,EACN,MAAM,EACN,QAAQ,EACO;IACf,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,eAAY,QAAQ,aAChD,4BACG,MAAM,IAAI,gBAAO,SAAS,EAAC,sBAAsB,YAAE,MAAM,GAAS,EAEnE,gBAAO,SAAS,EAAC,sBAAsB,YAAE,QAAQ,GAAS,IACpD,EAEP,MAAM,IAAI,cAAK,SAAS,EAAC,wBAAwB,YAAE,MAAM,GAAO,IAC7D,CACP,CAAC;AACJ,CAAC"}
@@ -3,7 +3,7 @@
3
3
  display: flex;
4
4
  flex-direction: column;
5
5
  overflow: hidden;
6
- max-width: 18.75rem;
6
+ max-width: 150rem;
7
7
  }
8
8
  .rls-date-picker__header {
9
9
  background: var(--color-rolster-100);
@@ -23,7 +23,7 @@
23
23
  .rls-date-picker__title--description {
24
24
  height: var(--sizing-x16);
25
25
  line-height: var(--sizing-x16);
26
- font-size: 1.15rem;
26
+ font-size: 9.25rem;
27
27
  }
28
28
  .rls-date-picker__title--year {
29
29
  margin: var(--sizing-x4) 0rem var(--sizing-x2) 0rem;
@@ -34,7 +34,7 @@
34
34
  }
35
35
  .rls-date-picker__component {
36
36
  display: flex;
37
- width: 18.75rem;
37
+ width: 150rem;
38
38
  padding: 0rem var(--sizing-x2);
39
39
  box-sizing: border-box;
40
40
  margin-bottom: var(--sizing-x4);
@@ -1,7 +1,7 @@
1
1
  .rls-date-range-picker {
2
2
  position: relative;
3
3
  float: left;
4
- max-width: 18.75rem;
4
+ max-width: 150rem;
5
5
  overflow: hidden;
6
6
  }
7
7
  .rls-date-range-picker__header {
@@ -22,7 +22,7 @@
22
22
  .rls-date-range-picker__title--description {
23
23
  height: var(--sizing-x16);
24
24
  line-height: var(--sizing-x16);
25
- font-size: 1.15rem;
25
+ font-size: 9.25rem;
26
26
  }
27
27
  .rls-date-range-picker__title--year {
28
28
  margin: var(--sizing-x4) 0rem var(--sizing-x2) 0rem;
@@ -3,7 +3,7 @@
3
3
  top: var(--sizing-x8);
4
4
  right: var(--sizing-x8);
5
5
  width: calc(100% - var(--sizing-x16));
6
- max-width: 20rem;
6
+ max-width: 160rem;
7
7
  height: auto;
8
8
  max-height: calc(100vh - var(--sizing-x16));
9
9
  z-index: var(--z-index-12);
@@ -1,5 +1,5 @@
1
1
  .rls-modal {
2
- --pvt-component-transform: translateY(10rem) scale(0.6);
2
+ --pvt-component-transform: translateY(80rem) scale(0.6);
3
3
  --pvt-component-height: 0rem;
4
4
  --pvt-component-opacity: 0;
5
5
  --pvt-component-visibility: hidden;
@@ -7,7 +7,7 @@
7
7
  z-index: 32;
8
8
  width: auto;
9
9
  height: auto;
10
- max-width: 30rem;
10
+ max-width: 240rem;
11
11
  padding: var(--sizing-x6);
12
12
  box-sizing: border-box;
13
13
  border-radius: var(--sizing-x4);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rolster/react-components",
3
- "version": "18.10.9",
3
+ "version": "18.10.11",
4
4
  "type": "module",
5
5
  "description": "Package containing UI components for React Project.",
6
6
  "module": "dist/esm/index.js",
@@ -58,7 +58,7 @@
58
58
  "@rollup/plugin-commonjs": "^25.0.4",
59
59
  "@rollup/plugin-node-resolve": "^15.2.1",
60
60
  "@rollup/plugin-typescript": "^11.1.3",
61
- "@rolster/styles-foundations": "^1.1.0",
61
+ "@rolster/styles-foundations": "^1.1.3",
62
62
  "@rolster/types": "^1.0.4",
63
63
  "@types/node-sass": "^4.11.4",
64
64
  "@types/react": "^18.0.28",