You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
*[Changing an exisiting variant](#changing-an-existing-variant)
16
+
*[Documentation](#documentation)
12
17
*[Other contributions](#other-contributions)
13
18
14
19
@@ -61,6 +66,20 @@ _`optionList` reused inside the select component_
61
66
62
67
In the case presented above the `select` will be the outer component and the `optionList` will be the nested one. For more infomation about the terminology and how to work with nested components you can check [nested components](https://helpx.adobe.com/xd/help/work-with-nested-components.html) article.
63
68
69
+
70
+
### New and deprecated components
71
+
72
+
In order to identify wich components in the UI-Kit are new and wich ones are deprecated, we have a color legend that comes with the component when is searched across the document assets search bar:
| 🔴 | Waiting to be removed | The component will be removed soon. If you have any instance of this component in your files, replace for the new ones |
77
+
| 🟠 | Deprecated | The component has been deprecated |
78
+
| 🟡 | Variant changed | There are changes on this component variant |
79
+
| 🟣 | New variant | New component variant in the UI-Kit. Changes are not available yet in CDK's |
80
+
| 🟢 | CDK Available | New component variant available in CDK |
81
+
82
+
64
83
### Working with previous versions
65
84
66
85
If you development team is working with a **previous version of the latest released Halstack CDK**, you can find all the UI Kit files in the [previous releases folder](https://github.com/dxc-technology/halstack-style-guide/tree/master/previous-releases) (Note that if you need to upgrade the version of the components you are using you will need to delete all the instances and relink the again with the proper version/public library)
@@ -173,6 +192,38 @@ Since Adobe XD doesn't support variants, we create them as separate components,
173
192
174
193
There are specific cases where the differences between component variants aren't big and it is not worthy to use different components, in this case we modify the instances (e.g. icon usage in every button variant)
175
194
195
+
## Adding component features
196
+
197
+
When the component already exists but there is a missing feature or changes in a current one the proccess varies depending if it's a new variant of the component or the changes affect an existing one.
198
+
199
+
### New variant
200
+
201
+
If you identify a new variant of the component that is not covered by our guidelines you can submit the variant file and the documentation changes in a Pull request to the upstream repository so we can review it and add the variant to the UI-Kit library.
202
+
203
+
1. Bring the existing component to a new XD file named `component-xyz_variant.xd`
204
+
2. Ungroup the component (<kbd>⇧ Shift</kbd><kbd>⌘ Command</kbd><kbd>G</kbd>)
205
+
3. Make the component local (<kbd>⌘ Command</kbd><kbd>K</kbd>) and name the variant following the naming convention and adding "🟣 /" as a prefix
206
+
4. Work on the new variant
207
+
5. Create a new branch in your fork named `component-xyz-variant`
208
+
6. Save the file in `contributing/assets/components/variants` folder
209
+
210
+
### Changing an existing variant
211
+
212
+
Sometimes the changes affect a variant of the component that already exist, in order to incorporate those changes in our component library we need the to have the new component variant and deprecate the previous to make everyone aware wich component should use.
213
+
214
+
1. Bring the existing component from the library to a new XD file named `component-xyz_update.xd`
215
+
2. Ungroup the component (<kbd>⇧ Shift</kbd><kbd>⌘ Command</kbd><kbd>G</kbd>)
216
+
3. Make the component local (<kbd>⌘ Command</kbd><kbd>K</kbd>) and keep the previous naming adding "🟡 /" as a prefix
217
+
4. Work on the variant changes
218
+
5. Create a new branch in your fork named `component-xyz-update`
219
+
6. Save the file in `contributing/assets/components/updates` folder
220
+
221
+
### Documentation
222
+
223
+
Changes on a component need to be properly documented, before making a PR from your for to the upstream repository ensure you are changing the component README.md file, updating the needed images in order to help other designers and developers understand the changes made in the component.
224
+
225
+
The [content](https://github.com/dxc-technology/halstack-style-guide/blob/master/contributing/content.md) and [image](https://github.com/dxc-technology/halstack-style-guide/blob/master/contributing/images.md) contribution guidelines will help you in the process of updating documentation of a component.
226
+
176
227
## Other contributions
177
228
178
229
We are a small team and maintaining more than one library is time-consuming, although we know that a UI Kit in other design software rather than Adobe XD would be an interesting asset to have. So... if you are interested in bringing those to the halstack ecosystem, our priorities are:
0 commit comments