@pinuts/bsr-uikit-relaunch 0.2.20 → 0.2.22

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 (8) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/items/BSRAddressSelector/BSRAddressButtons.d.ts.map +1 -1
  3. package/dist/items/BSRAddressSelector/BSRAddressButtons.js +5 -2
  4. package/dist/items/BSRAddressSelector/BSRStreetPlzSelector.d.ts.map +1 -1
  5. package/dist/items/BSRAddressSelector/BSRStreetPlzSelector.js +2 -1
  6. package/dist/items/NumberInputField/NumberInputField.js +1 -1
  7. package/dist/styles/variables/_buttons.scss +113 -112
  8. package/package.json +1 -1
package/dist/items/BSRAddressSelector/BSRAddressButtons.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BSRAddressButtons.d.ts","sourceRoot":"","sources":["../../../src/items/BSRAddressSelector/BSRAddressButtons.jsx"],"names":[],"mappings":";AAQA;;;;sBAuBC;;;;;;;kBA/BsD,OAAO;sBACxC,YAAY"}
1
+ {"version":3,"file":"BSRAddressButtons.d.ts","sourceRoot":"","sources":["../../../src/items/BSRAddressSelector/BSRAddressButtons.jsx"],"names":[],"mappings":";AAQA;;;;sBAwBC;;;;;;;kBAhCsD,OAAO;sBACxC,YAAY"}
package/dist/items/BSRAddressSelector/BSRAddressButtons.js CHANGED
@@ -39,7 +39,8 @@ const BSRAddressButtons = _ref => {
39
39
  inputProps: {
40
40
  ...inputProps,
41
41
  type: 'button'
42
- }
42
+ },
43
+ color: "secondary"
43
44
  }));
44
45
  };
45
46
  BSRAddressButtons.propTypes = {
@@ -58,6 +59,7 @@ const FormBuilderAddressResetButton = _ref2 => {
58
59
  return null;
59
60
  }
60
61
  return /*#__PURE__*/_react.default.createElement(BSRAddressButtons, _extends({}, otherProps, {
62
+ color: "primary",
61
63
  config: config
62
64
  }));
63
65
  };
@@ -100,7 +102,8 @@ const BSRAddressPLZSelectButton = _ref3 => {
100
102
  ...inputProps,
101
103
  type: 'button',
102
104
  disabled: showPlzSelectButton
103
- }
105
+ },
106
+ color: "secondary"
104
107
  }));
105
108
  };
106
109
  BSRAddressPLZSelectButton.propTypes = {
package/dist/items/BSRAddressSelector/BSRStreetPlzSelector.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BSRStreetPlzSelector.d.ts","sourceRoot":"","sources":["../../../src/items/BSRAddressSelector/BSRStreetPlzSelector.jsx"],"names":[],"mappings":";AA+LA,iFAA6E;kBA/LtB,OAAO"}
1
+ {"version":3,"file":"BSRStreetPlzSelector.d.ts","sourceRoot":"","sources":["../../../src/items/BSRAddressSelector/BSRStreetPlzSelector.jsx"],"names":[],"mappings":";AAgMA,iFAA6E;kBAhMtB,OAAO"}
package/dist/items/BSRAddressSelector/BSRStreetPlzSelector.js CHANGED
@@ -140,7 +140,8 @@ const BSRStreetPlzSelector = props => {
140
140
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, noResultsError, /*#__PURE__*/_react.default.createElement("div", {
141
141
  className: 'checkAddressBtn'
142
142
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
143
- onClick: onClickCheckAddressBtn
143
+ onClick: onClickCheckAddressBtn,
144
+ color: "secondary"
144
145
  }, checkAddressStr)));
145
146
  }
146
147
  if (showNoResultsError) {
package/dist/items/NumberInputField/NumberInputField.js CHANGED
@@ -107,7 +107,7 @@ const NumberInputField = _ref => {
107
107
  stroke: "white",
108
108
  fill: "white"
109
109
  })), /*#__PURE__*/_react.default.createElement("input", _extends({
110
- className: getClassNames(['input mx-2 ps-4', formControlClassNames]),
110
+ className: getClassNames(['input ps-3', formControlClassNames]),
111
111
  type: "number",
112
112
  step: step
113
113
  }, field, ariaAttributes, inputProps, {
package/dist/styles/variables/_buttons.scss CHANGED
@@ -2,80 +2,83 @@ $btn-border-radius: $border-radius-lg;
2
2
  $btn-padding-x: $base-gap * 6;
3
3
  $btn-padding-y: calc($base-gap * 2 - 1px);
4
4
 
5
- .btn, .pi-form-button button {
6
- text-decoration: underline;
7
- text-decoration-color: transparent;
8
- transition-duration: 0.15s;
9
- transition-timing-function: ease-in-out;
10
- display: inline-flex;
11
- align-items: center;
12
- border-width: $bsr-border-width-m;
13
-
14
- &[class*="btn-outline-"]:not([class*="btn-outline-light"]){
15
- --bs-btn-bg: #{$bsr-white-100};
16
-
17
- &:hover:not([aria-disabled="true"]){
18
- border-color: $bsr-white-100;
19
- }
20
- }
21
- &.btn-outline-light:hover {
22
- background-color: $bsr-white-100;;
23
- color: $text-secondary;
24
- border-color: $bsr-white-100;
5
+ .btn,
6
+ .pi-form-button button {
7
+ text-decoration: underline;
8
+ text-decoration-color: transparent;
9
+ transition-duration: 0.15s;
10
+ transition-timing-function: ease-in-out;
11
+ display: inline-flex;
12
+ align-items: center;
13
+ border-width: $bsr-border-width-m;
14
+
15
+ &[class*="btn-outline-"]:not([class*="btn-outline-light"]) {
16
+ --bs-btn-bg: #{$bsr-white-100};
17
+
18
+ &:hover:not([aria-disabled="true"]) {
19
+ border-color: $bsr-white-100;
25
20
  }
26
- &.btn-outline-light:focus-visible {
21
+ }
22
+ &.btn-outline-light:hover {
23
+ background-color: $bsr-white-100;
24
+ color: $text-secondary;
25
+ border-color: $bsr-white-100;
26
+ }
27
+ &.btn-outline-light:focus-visible {
28
+ color: $bsr-white-100;
29
+ }
30
+
31
+ &:hover {
32
+ text-decoration-color: currentColor;
33
+
34
+ &:not([class*="btn-outline-"]):not([class*="teaserBtnAtom"]):not(
35
+ [class*="editingBtnAtom"]
36
+ ):not([class*="iconOnlyBtnAtom"]) {
37
+ background-color: $bsr-white-100;
38
+ color: $bsr-brick-100;
39
+ border-color: var(--bs-btn-bg);
40
+
41
+ &[class*="btn-light"] {
42
+ background-color: $bsr-brick-100;
27
43
  color: $bsr-white-100;
28
- }
29
-
30
- &:hover {
31
- text-decoration-color: currentColor;
32
-
33
- &:not([class*="btn-outline-"]):not([class*="teaserBtnAtom"]):not([class*="editingBtnAtom"]):not([class*="iconOnlyBtnAtom"]) {
34
-
35
- background-color: $bsr-white-100;
36
- color: $bsr-brick-100;
37
- border-color: var(--bs-btn-bg);
38
-
39
- &[class*="btn-light"] {
40
- background-color: $bsr-brick-100;
41
- color: $bsr-white-100;
42
- }
43
-
44
- &[aria-disabled="true"]:not([class*="btn-outline-light"]) {
45
- background-color: $bsr-black-90;
46
- color: $bsr-white-100;
47
- border-color: $bsr-black-90;
48
- }
49
- }
44
+ }
50
45
 
46
+ &[aria-disabled="true"]:not([class*="btn-outline-light"]) {
47
+ background-color: $bsr-black-90;
48
+ color: $bsr-white-100;
49
+ border-color: $bsr-black-90;
50
+ }
51
51
  }
52
+ }
52
53
 
53
- &:active {
54
- text-decoration: none;
55
- }
54
+ &:active {
55
+ text-decoration: none;
56
+ }
56
57
 
57
- &[aria-disabled="true"], .disabled, &:disabled {
58
- text-decoration: none;
58
+ &[aria-disabled="true"],
59
+ .disabled,
60
+ &:disabled {
61
+ text-decoration: none;
59
62
 
60
- @each $color, $value in $theme-colors {
61
- @if $color == "light" {
62
- &.btn-light {
63
- background-color: $value;
64
- border-color: currentColor;
65
- color: $bsr-brick-100;
66
- opacity: .4;
67
- cursor: not-allowed;
68
- }
63
+ @each $color, $value in $theme-colors {
64
+ @if $color == "light" {
65
+ &.btn-light {
66
+ background-color: $value;
67
+ border-color: currentColor;
68
+ color: $bsr-brick-100;
69
+ opacity: 0.4;
70
+ cursor: not-allowed;
71
+ }
69
72
 
70
- &.btn-outline-light {
71
- background-color: transparent;
72
- border-color: $value;
73
- color: $value;
74
- opacity: .4;
75
- cursor: not-allowed;
76
- }
77
- } @else {
78
- /*
73
+ &.btn-outline-light {
74
+ background-color: transparent;
75
+ border-color: $value;
76
+ color: $value;
77
+ opacity: 0.4;
78
+ cursor: not-allowed;
79
+ }
80
+ } @else {
81
+ /*
79
82
  &.btn-#{$color} {
80
83
  background-color: shade-color($value, 100%) !important;
81
84
  border-color: shade-color($value, 100%);
@@ -92,67 +95,65 @@ $btn-padding-y: calc($base-gap * 2 - 1px);
92
95
  cursor: not-allowed;
93
96
  }
94
97
  */
95
- }
96
- }
97
-
98
+ }
98
99
  }
100
+ }
99
101
  }
100
102
 
101
103
  .btn.btn-light {
102
- --bs-btn-color: #{$bsr-brick-100};
103
- &:hover {
104
- &[aria-disabled="true"]{
105
- background-color: $bsr-white-100 !important;
106
- color: $bsr-brick-100 !important;
107
- border-color: $bsr-brick-100 !important;
108
- }
109
- }
110
- &:focus {
111
- background-color: $bsr-white-100 !important;
112
- color: $bsr-black-90!important;
113
- box-shadow: 0 0 0 0.25rem rgba($bsr-white-100, .5)!important;
104
+ --bs-btn-color: #{$bsr-brick-100};
105
+ &:hover {
106
+ &[aria-disabled="true"] {
107
+ background-color: $bsr-white-100 !important;
108
+ color: $bsr-brick-100 !important;
109
+ border-color: $bsr-brick-100 !important;
114
110
  }
111
+ }
112
+ &:focus {
113
+ background-color: $bsr-white-100 !important;
114
+ color: $bsr-black-90 !important;
115
+ box-shadow: 0 0 0 0.25rem rgba($bsr-white-100, 0.5) !important;
116
+ }
115
117
  }
116
118
 
117
119
  .btn.btn-outline-light {
118
- --bs-btn-hover-color: #{$bsr-brick-100} !important;
119
- background: $bsr-brick-100;
120
+ --bs-btn-hover-color: #{$bsr-brick-100} !important;
121
+ background: $bsr-brick-100;
120
122
 
121
- &.btn:active {
122
- --bs-btn-active-color: #{$bsr-brick-100};
123
- }
123
+ &.btn:active {
124
+ --bs-btn-active-color: #{$bsr-brick-100};
125
+ }
124
126
  }
125
127
 
126
128
  .btn[class*="editingBtnAtom"] {
127
- font-size: $editingBtn-font-size;
128
- line-height: $editingBtnAtom-line-height;
129
- letter-spacing: $letter-spacing-xs;
130
- font-weight: $fontweight-bold;
131
- &[aria-disabled="true"] {
132
- opacity: 0.4;
133
- }
129
+ font-size: $editingBtn-font-size;
130
+ line-height: $editingBtnAtom-line-height;
131
+ letter-spacing: $letter-spacing-xs;
132
+ font-weight: $fontweight-bold;
133
+ &[aria-disabled="true"] {
134
+ opacity: 0.4;
135
+ }
134
136
  }
135
137
 
136
138
  .btn[class*="iconOnlyBtnAtom"]:not([class*="btn-outline-brick"]) {
137
- padding: 0;
138
- background-color: $secondary !important;
139
- color: $light !important;
139
+ padding: 0;
140
+ background-color: $secondary !important;
141
+ color: $light !important;
142
+ border-color: $secondary !important;
143
+ text-decoration: none;
144
+
145
+ &:hover,
146
+ &:focus,
147
+ &:active {
148
+ background-color: $white !important;
149
+ color: $text-secondary !important;
140
150
  border-color: $secondary !important;
141
- text-decoration: none;
142
-
143
- &:hover,
144
- &:focus,
145
- &:active {
146
- background-color: $white !important;
147
- color: $text-secondary !important;
148
- border-color: $secondary !important;
149
- text-decoration: underline;
150
- border-width: $bsr-border-width-m !important;
151
- }
152
-
153
- &:disabled {
154
- opacity: 0.4;
155
- cursor: not-allowed;
156
- }
151
+ text-decoration: underline;
152
+ border-width: $bsr-border-width-m !important;
153
+ }
157
154
 
155
+ &:disabled {
156
+ opacity: 0.4;
157
+ cursor: not-allowed;
158
+ }
158
159
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pinuts/bsr-uikit-relaunch",
3
- "version": "0.2.20",
3
+ "version": "0.2.22",
4
4
  "private": false,
5
5
  "description": "BSR UI-KIT Relaunch",
6
6
  "main": "dist/index.js",