@hashicorp/design-system-components 0.12.9 → 0.12.10
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/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @hashicorp/design-system-components
|
|
2
2
|
|
|
3
|
+
## 0.12.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#428](https://github.com/hashicorp/design-system/pull/428) [`599dca97`](https://github.com/hashicorp/design-system/commit/599dca971fba57b613f9a17588ebe0e569aafe4c) Thanks [@didoo](https://github.com/didoo)! - Fixed issue with "disabled" visual state for "Hds::Button" when is a link
|
|
8
|
+
|
|
3
9
|
## 0.12.9
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
<Hds::Form::Fieldset @layout={{@layout}} ...attributes as |F|>
|
|
2
|
+
{{! Notice: the order of the elements is not relevant here, because it's controlled at "Hds::Form::Fieldset" component level }}
|
|
3
|
+
{{yield (hash Legend=F.Legend HelperText=F.HelperText Error=F.Error)}}
|
|
4
|
+
<F.Control>
|
|
5
|
+
{{yield (hash Toggle::Field=(component "hds/form/toggle/field" contextualClass="hds-form-group__control-field"))}}
|
|
6
|
+
</F.Control>
|
|
7
|
+
</Hds::Form::Fieldset>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from '@hashicorp/design-system-components/components/hds/form/toggle/group';
|
|
@@ -32,11 +32,19 @@ $hds-button-focus-border-width: 3px;
|
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
// This covers all of the browsers and focus scenarios (due to the custom focus design).
|
|
35
|
+
//
|
|
36
|
+
// IMPORTANT: we need to use also the [disabled] selector because if the "disabled" attribute is applied to a "Button as link",
|
|
37
|
+
// the ":disabled" pseudo-selector is not applied to the element in the browser (rightly) because a link can't be disabled
|
|
38
|
+
// but from the product perspective there may be use cases where they need to have a "Button as link" that looks disabled anyway
|
|
39
|
+
//
|
|
35
40
|
&:disabled,
|
|
41
|
+
&[disabled],
|
|
36
42
|
&.mock-disabled,
|
|
37
43
|
&:disabled:focus,
|
|
44
|
+
&[disabled]:focus,
|
|
38
45
|
&.mock-disabled:focus,
|
|
39
46
|
&:disabled:hover,
|
|
47
|
+
&[disabled]:hover,
|
|
40
48
|
&.mock-disabled:hover {
|
|
41
49
|
background-color: var(--token-color-surface-faint);
|
|
42
50
|
border-color: var(--token-color-border-primary);
|
|
@@ -254,11 +262,19 @@ $size-props: (
|
|
|
254
262
|
}
|
|
255
263
|
}
|
|
256
264
|
|
|
265
|
+
//
|
|
266
|
+
// IMPORTANT: we need to use also the [disabled] selector because if the "disabled" attribute is applied to a "Button as link",
|
|
267
|
+
// the ":disabled" pseudo-selector is not applied to the element in the browser (rightly) because a link can't be disabled
|
|
268
|
+
// but from the product perspective there may be use cases where they need to have a "Button as link" that looks disabled anyway
|
|
269
|
+
//
|
|
257
270
|
&:disabled,
|
|
271
|
+
&[disabled],
|
|
258
272
|
&.mock-disabled,
|
|
259
273
|
&:disabled:focus,
|
|
274
|
+
&[disabled]:focus,
|
|
260
275
|
&.mock-disabled:focus,
|
|
261
276
|
&:disabled:hover,
|
|
277
|
+
&[disabled]:hover,
|
|
262
278
|
&.mock-disabled:hover {
|
|
263
279
|
background-color: transparent;
|
|
264
280
|
border-color: transparent;
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
|
|
19
19
|
.hds-form-group__control-fields-wrapper {
|
|
20
20
|
// when the group contains a "legend", we reduce the visual weight of the "label"
|
|
21
|
-
.hds-form-group__legend
|
|
21
|
+
.hds-form-group__legend ~ & {
|
|
22
22
|
.hds-form-label {
|
|
23
23
|
font-weight: var(--token-typography-font-weight-regular);
|
|
24
24
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hashicorp/design-system-components",
|
|
3
|
-
"version": "0.12.
|
|
3
|
+
"version": "0.12.10",
|
|
4
4
|
"description": "HashiCorp Design System Components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"hashicorp",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"@embroider/test-setup": "^1.5.0",
|
|
51
51
|
"@glimmer/component": "^1.0.4",
|
|
52
52
|
"@glimmer/tracking": "^1.0.4",
|
|
53
|
-
"@percy/cli": "^1.
|
|
53
|
+
"@percy/cli": "^1.5.1",
|
|
54
54
|
"@percy/ember": "^3.0.0",
|
|
55
55
|
"babel-eslint": "^10.1.0",
|
|
56
56
|
"broccoli-asset-rev": "^3.0.0",
|