Skip to content

Commit 0811386

Browse files
Piyush VashishtRajdeep Chandrapfulton
authored
feat(dialog)!: migrate to spectrum-tokens (#2168)
BREAKING CHANGE: migrates to use `@adobe/spectrum-tokens` Additionally: * feat(dialog): migrate to use spectrum-tokens BREAKING CHANGE: migrate dialog to use spectrum tokens * docs(dialog): regenerate mods file --------- Co-authored-by: Rajdeep Chandra <rajdeepc@adobe.com> Co-authored-by: Patrick Fulton <pfulton@adobe.com>
1 parent 0b83f13 commit 0811386

File tree

8 files changed

+149
-116
lines changed

8 files changed

+149
-116
lines changed

‎components/dialog/gulpfile.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
module.exports = require("@spectrum-css/component-builder");
1+
module.exports = require("@spectrum-css/component-builder-simple");

‎components/dialog/index.css

Lines changed: 91 additions & 92 deletions
Large diffs are not rendered by default.

‎components/dialog/metadata/mods.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
| Modifiable Custom Properties |
2+
| --------------------------------------------------- |
3+
| `--mod-dialog-confirm-border-radius` |
4+
| `--mod-dialog-confirm-buttongroup-padding-top` |
5+
| `--mod-dialog-confirm-close-button-padding` |
6+
| `--mod-dialog-confirm-close-button-size` |
7+
| `--mod-dialog-confirm-description-font-weight` |
8+
| `--mod-dialog-confirm-description-margin` |
9+
| `--mod-dialog-confirm-description-padding` |
10+
| `--mod-dialog-confirm-description-text-color` |
11+
| `--mod-dialog-confirm-description-text-line-height` |
12+
| `--mod-dialog-confirm-description-text-size` |
13+
| `--mod-dialog-confirm-divider-block-spacing-end` |
14+
| `--mod-dialog-confirm-divider-block-spacing-start` |
15+
| `--mod-dialog-confirm-divider-height` |
16+
| `--mod-dialog-confirm-footer-padding-top` |
17+
| `--mod-dialog-confirm-gap-size` |
18+
| `--mod-dialog-confirm-hero-height` |
19+
| `--mod-dialog-confirm-large-width` |
20+
| `--mod-dialog-confirm-medium-width` |
21+
| `--mod-dialog-confirm-padding-grid` |
22+
| `--mod-dialog-confirm-small-width` |
23+
| `--mod-dialog-confirm-title-text-color` |
24+
| `--mod-dialog-confirm-title-text-line-height` |
25+
| `--mod-dialog-confirm-title-text-size` |
26+
| `--mod-dialog-fullscreen-header-text-size` |
27+
| `--mod-dialog-heading-font-weight` |
28+
| `--mod-dialog-min-inline-size` |

‎components/dialog/package.json

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,14 +18,14 @@
1818
"build": "gulp"
1919
},
2020
"peerDependencies": {
21-
"@spectrum-css/button": ">=10",
22-
"@spectrum-css/buttongroup": ">=5 <=6",
21+
"@spectrum-css/button": ">=11",
22+
"@spectrum-css/buttongroup": ">=6 <=7",
2323
"@spectrum-css/closebutton": ">=4",
24-
"@spectrum-css/divider": ">=1 <=2",
25-
"@spectrum-css/icon": ">=3",
24+
"@spectrum-css/divider": ">=2 <=3",
25+
"@spectrum-css/icon": ">=4",
2626
"@spectrum-css/modal": ">=3",
27-
"@spectrum-css/underlay": ">=2",
28-
"@spectrum-css/vars": ">=9"
27+
"@spectrum-css/tokens": ">=11",
28+
"@spectrum-css/underlay": ">=3"
2929
},
3030
"devDependencies": {
3131
"@spectrum-css/button": "^11.0.12",
@@ -35,8 +35,8 @@
3535
"@spectrum-css/divider": "^2.1.29",
3636
"@spectrum-css/icon": "^4.0.3",
3737
"@spectrum-css/modal": "^3.0.49",
38-
"@spectrum-css/underlay": "^2.0.54",
39-
"@spectrum-css/vars": "^9.0.8",
38+
"@spectrum-css/tokens": "11.3.7",
39+
"@spectrum-css/underlay": "^3.0.6",
4040
"gulp": "^4.0.0"
4141
},
4242
"publishConfig": {

‎components/dialog/stories/template.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import { Template as CloseButton } from "@spectrum-css/closebutton/stories/templ
1111
import { Template as Button } from '@spectrum-css/button/stories/template.js';
1212

1313
import "../index.css";
14-
import "../skin.css";
1514

1615
export const Template = ({
1716
rootClass = "spectrum-Dialog",

‎components/dialog/skin.css renamed to ‎components/dialog/themes/express.css

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,13 @@
1-
/*!
1+
/*
22
Copyright 2023 Adobe. All rights reserved.
33
This file is licensed to you under the Apache License, Version 2.0 (the "License");
44
you may not use this file except in compliance with the License. You may obtain a copy
55
of the License at http://www.apache.org/licenses/LICENSE-2.0
6-
76
Unless required by applicable law or agreed to in writing, software distributed under
87
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
98
OF ANY KIND, either express or implied. See the License for the specific language
109
governing permissions and limitations under the License.
1110
*/
1211

13-
.spectrum-Dialog-heading {
14-
color: var(--spectrum-dialog-confirm-title-text-color);
15-
}
16-
17-
.spectrum-Dialog-content {
18-
color: var(--spectrum-dialog-confirm-description-text-color);
12+
@container (--system: express) {
1913
}
20-
21-
.spectrum-Dialog-footer {
22-
color: var(--spectrum-dialog-confirm-description-text-color);
23-
}
24-

‎components/dialog/themes/spectrum.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/*
2+
Copyright 2023 Adobe. All rights reserved.
3+
This file is licensed to you under the Apache License, Version 2.0 (the "License");
4+
you may not use this file except in compliance with the License. You may obtain a copy
5+
of the License at http://www.apache.org/licenses/LICENSE-2.0
6+
Unless required by applicable law or agreed to in writing, software distributed under
7+
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
8+
OF ANY KIND, either express or implied. See the License for the specific language
9+
governing permissions and limitations under the License.
10+
*/
11+
12+
@container (--system: spectrum) {
13+
}

‎yarn.lock

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2550,12 +2550,17 @@
25502550
resolved "https://registry.yarnpkg.com/@spectrum-css/stepper/-/stepper-4.0.59.tgz#e5501abd0755e0032277604e9196299279dced44"
25512551
integrity sha512-bE1T3+kHDPY4xPKtYd7cpFtS7odRiAlenZWU0HLNPhEZBfXou/jt86PQaDfZvD6smG3aiZOyuFGy7go2aoGhlQ==
25522552

2553+
"@spectrum-css/tokens@11.3.7":
2554+
version "11.3.7"
2555+
resolved "https://registry.yarnpkg.com/@spectrum-css/tokens/-/tokens-11.3.7.tgz#b4a32faa3febe1e0dc33a109e0ff5545a02bfac6"
2556+
integrity sha512-WX0dPqwb2t9u9WBzIRzzYXL/ZJc0r/cSBb7eJxw1xCyg5NQnUKIhGtRT+cMTTCQP0SERFgCk9CZEJcJkZDphGw==
2557+
25532558
"@spectrum-css/tokens@^10.1.2":
25542559
version "10.2.2"
25552560
resolved "https://registry.yarnpkg.com/@spectrum-css/tokens/-/tokens-10.2.2.tgz#461697381575446542bbce8ae6d8ea948195ab3f"
25562561
integrity sha512-ljNXDPIJiS2q58dYn1EsXYF78gZaUCrLkOv8T8A5RBy/hM8fI85BghgiRkM0Dvsh87ej0juw3fO71Vkv3fuWlg==
25572562

2558-
"@spectrum-css/underlay@^2.0.54", "@spectrum-css/underlay@^2.1.0":
2563+
"@spectrum-css/underlay@^2.1.0":
25592564
version "2.1.0"
25602565
resolved "https://registry.yarnpkg.com/@spectrum-css/underlay/-/underlay-2.1.0.tgz#00a30d527d29e8e1ce1567765dab363738e16fb9"
25612566
integrity sha512-KlOV7uel4C8HhYAoPlBvCReI+BIKpOmgRLLPo2XFVM4rTsFa1xxFVkmeP74uEPuVLcRtXGG3/6cL2+0OArhZmA==

0 commit comments

Comments
 (0)