@muraldevkit/ui-toolkit 2.27.0 → 2.28.0

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 (15) hide show
  1. package/dist/components/index.d.ts +1 -0
  2. package/dist/components/pagination/MrlPagination/MrlPagination.d.ts +15 -0
  3. package/dist/components/pagination/MrlPagination/index.d.ts +1 -0
  4. package/dist/components/pagination/MrlPaginationButton/MrlPaginationButton.d.ts +30 -0
  5. package/dist/components/pagination/MrlPaginationButton/index.d.ts +1 -0
  6. package/dist/components/pagination/MrlPaginationText/MrlPaginationText.d.ts +21 -0
  7. package/dist/components/pagination/MrlPaginationText/index.d.ts +1 -0
  8. package/dist/components/pagination/constants.d.ts +1 -0
  9. package/dist/components/pagination/index.d.ts +3 -0
  10. package/dist/index.js +1 -1
  11. package/dist/styles/MrlButton/global.scss +2 -0
  12. package/dist/styles/MrlPagination/module.scss +29 -0
  13. package/dist/styles/button/mixins.scss +0 -1
  14. package/dist/styles/button/variables.scss +10 -10
  15. package/package.json +2 -2
package/dist/styles/MrlButton/global.scss CHANGED
@@ -43,6 +43,7 @@
43
43
  &.mrlButton--ghost,
44
44
  &.mrlButton--ghost-inverse {
45
45
  padding-left: calc(var(--mrl-spacing-01) + var(--mrl-spacing-02));
46
+ padding-right: var(--mrl-spacing-03);
46
47
  }
47
48
  }
48
49
  .mrlButton--icon-after {
@@ -53,6 +54,7 @@
53
54
  }
54
55
  &.mrlButton--ghost,
55
56
  &.mrlButton--ghost-inverse {
57
+ padding-left: var(--mrl-spacing-03);
56
58
  padding-right: calc(var(--mrl-spacing-01) + var(--mrl-spacing-02));
57
59
  }
58
60
  .MrlSvgContainer,
package/dist/styles/MrlPagination/module.scss ADDED
@@ -0,0 +1,29 @@
1
+ .MrlPagination {
2
+ display: block;
3
+ }
4
+ .MrlPaginationList {
5
+ align-items: center;
6
+ display: flex;
7
+ margin: 0;
8
+ padding: 0;
9
+ }
10
+ .MrlPaginationItem {
11
+ height: var(--mrl-spacing-06);
12
+ margin: 0;
13
+ padding: 0;
14
+ }
15
+ .MrlPaginationText {
16
+ display: block;
17
+ font-size: var(--mrl-font-size-03);
18
+ padding-top: 0.1875rem;
19
+ }
20
+ .MrlPaginationRange {
21
+ font-weight: var(--mrl-font-weight-04);
22
+ padding: 0 var(--mrl-spacing-02);
23
+ }
24
+ .MrlPaginationDash {
25
+ font-weight: var(--mrl-font-weight-04);
26
+ }
27
+ .MrlPaginationTotal {
28
+ padding: 0 var(--mrl-spacing-02);
29
+ }
package/dist/styles/button/mixins.scss CHANGED
@@ -2,7 +2,6 @@
2
2
  $mrl-button-toggle-selector: '[aria-pressed="true"],[aria-expanded="true"],[aria-selected="true"],[aria-checked="true"]';
3
3
  @mixin mrl-button-common-motion() {
4
4
  transition: all var(--mrl-duration-03) var(--mrl-timing-m1);
5
- transition-property: background-color, border-color, color;
6
5
  }
7
6
  @mixin mrl-button-common() {
8
7
  background: var(--mrl-button-background-color);
package/dist/styles/button/variables.scss CHANGED
@@ -3,13 +3,13 @@
3
3
  .mrlIconButton,
4
4
  .mrlButton {
5
5
  --mrl-button-background-color: var(--mrl-color-background);
6
- --mrl-button-background-color-active: rgba(var(--mrl-gray-30), 1);
6
+ --mrl-button-background-color-active: rgba(var(--mrl-gray-20), 1);
7
7
  --mrl-button-background-color-disabled: var(--mrl-color-background);
8
- --mrl-button-background-color-hover: rgba(var(--mrl-gray-20), 1);
9
- --mrl-button-border-color: rgba(var(--mrl-gray-80), 1);
10
- --mrl-button-border-color-active: rgba(var(--mrl-black), 1);
11
- --mrl-button-border-color-disabled: var(--mrl-color-line-disabled);
12
- --mrl-button-border-color-hover: rgba(var(--mrl-gray-90), 1);
8
+ --mrl-button-background-color-hover: rgba(var(--mrl-gray-10), 1);
9
+ --mrl-button-border-color: rgba(var(--mrl-gray-30), 1);
10
+ --mrl-button-border-color-active: rgba(var(--mrl-gray-50), 1);
11
+ --mrl-button-border-color-disabled: rgba(var(--mrl-gray-20), 1);
12
+ --mrl-button-border-color-hover: rgba(var(--mrl-gray-40), 1);
13
13
  --mrl-button-border-width: var(--mrl-line-width-border);
14
14
  --mrl-button-icon-size: var(--mrl-spacing-07);
15
15
  --mrl-button-text-color: rgba(var(--mrl-gray-80), 1);
@@ -143,10 +143,10 @@
143
143
  --mrl-button-background-color-active: var(--mrl-white-opacity-06);
144
144
  --mrl-button-background-color-hover: var(--mrl-white-opacity-08);
145
145
  --mrl-button-background-color-disabled: var(--mrl-white-opacity-03);
146
- --mrl-button-border-color: rgba(var(--mrl-gray-20), 1);
147
- --mrl-button-border-color-active: var(--mrl-black-opacity-00);
148
- --mrl-button-border-color-hover: var(--mrl-black-opacity-00);
149
- --mrl-button-border-color-disabled: var(--mrl-black-opacity-00);
146
+ --mrl-button-border-color: transparent;
147
+ --mrl-button-border-color-active: transparent;
148
+ --mrl-button-border-color-hover: transparent;
149
+ --mrl-button-border-color-disabled: transparent;
150
150
  --mrl-button-text-color: rgba(var(--mrl-gray-100), 1);
151
151
  --mrl-button-text-color-active: rgba(var(--mrl-gray-100), 1);
152
152
  --mrl-button-text-color-disabled: var(--mrl-black-opacity-03);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@muraldevkit/ui-toolkit",
3
- "version": "2.27.0",
3
+ "version": "2.28.0",
4
4
  "description": "Mural's UI Toolkit",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -58,7 +58,7 @@
58
58
  "@babel/preset-env": "7.21.4",
59
59
  "@babel/preset-react": "7.18.6",
60
60
  "@babel/preset-typescript": "7.21.4",
61
- "@muraldevkit/ds-foundation": "2.3.0",
61
+ "@muraldevkit/ds-foundation": "2.3.2",
62
62
  "@muraldevkit/ds-icons": "3.0.1",
63
63
  "@storybook/addon-a11y": "7.0.26",
64
64
  "@storybook/addon-docs": "7.0.26",