Creating a Custom Build

1. Fork the CoralUI repository on GitHub.
2. Clone your fork.
3. Open package.json. Here you will see a JSON object that, among other things, manages which packages should be included in a build and the order in which they should be included.
4. Under the dependencies node you will see a list of packages. Remove the packages you would like excluded from the build. If you would like to add packages that aren't part of the standard build, add the package entries here.
5. Likewise, add or remove the name of the components in the coral.imports node.

   Below is an example of a package.json that has been configured to just include Autocomplete and Multifield. Note that Multifield is not part of the default CoralUI build and therefore has been added to the list. While not entirely necessary, we also recommend explicitly specifying coralui-core at the top of the coral.imports list. This will ensure that the version you specified as your NPM dependency is the version that gets leveraged.

   NOTE Since CoralUI 3.18.0 all components are available on Adobe's internal artifactory server. Please see CoralUI@artifactory.corp.adobe.com for more information.

                           {
                             "dependencies": {
                               "@coralui/coralui-core": "^4.2.0",
                               "@coralui/coralui-theme-spectrum": "^1.1.8",
                               "@coralui/coralui-component-autocomplete": "^3.4.0",
                               "@coralui/coralui-component-multifield": "^2.1.0"
                             },
                             "coral": {
                               "imports": [
                                 "@coralui/coralui-core",
                                 "@coralui/coralui-component-autocomplete",
                                 "@coralui/coralui-component-multifield"
                               ]
                             }
                           }

6. Now that package.json is configured, run npm install from the command line which will pull down the packages and place them under the node_modules directory.
7. Run grunt from the command line. This will generate the build under a build directory.

Changing Theme

If you want to change from CoralUI's default theme to an alternative theme, you will need to change the theme dependency in your build's package.json. For example, the default is:

                    {
                      "dependencies": {
                        ...
                        "@coralui/coralui-theme-cloudui": "^8.2.8",
                        ...
                    }
                    

This would be replaced with:

                    {
                      "dependencies": {
                        ...
                        "@coralui/coralui-theme-spectrum": "^1.1.8",
                        ...
                    }
                    

Consuming a Custom Build using NPM

With any luck, you've created a custom build and are now able to copy files out of the build directory to your own project. If you use npm to manage dependencies within your own project, you can tag your custom CoralUI build so it can be referenced as a dependency from your project's package.json.

1. Commit and push the CoralUI package.json changes to your fork of CoralUI.
2. Within the CoralUI directory, run grunt release --git-only from the command line.
3. You should receive a prompt asking "What is the kind of release for CoralUI?" Select "Custom".
4. You should receive a prompt asking "What specific version would you like?" Enter a name that describes your custom build. If the build were intended for use within Social and derived from the official CoralUI 2.0.1 build, an approriate name might be 2.0.1-social-1.
5. Once the release process completes, a tag will have been created and pushed to your CoralUI fork. At this point you can add the tag as a dependency to your project's package.json file. Below is an example of how your project's package.json might appear after the entry has been added.

                             {
                               "name": "Social",
                               "version": "0.0.1",
                               "dependencies": {
                                 "coralui": "git+ssh://git@git.corp.adobe.com:Social/coralui.git#2.0.1-social-1"
                               }
                             }

6. At this point you may run npm install from within your project directory and the custom CoralUI build will be placed within a node_modules subdirectory.