diff --git a/README.md b/README.md index f62fc574..b9c1c9dd 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,8 @@ - + Logo +[![View Design Library](https://img.shields.io/badge/view-design_library-F2709C)](https://weekly.ci.jenkins.io/design-library) [![Join the chat at https://gitter.im/jenkinsci/ux-sig](https://badges.gitter.im/jenkinsci/ux-sig.svg)](https://gitter.im/jenkinsci/ux-sig) [![Jenkins Plugin](https://img.shields.io/jenkins/plugin/v/design-library.svg)](https://plugins.jenkins.io/design-library/) [![Jenkins Plugin Installs](https://img.shields.io/jenkins/plugin/i/design-library.svg?color=blue)](https://plugins.jenkins.io/design-library/) @@ -13,7 +14,7 @@ This plugin contains: - demonstration of UI components available in Jenkins - snippets of Jelly ready-to-use examples -## Usage +## Contributing You can open this project as a [Gitpod workspace](https://www.gitpod.io/) which comes pre-configured with all the tools you will need. @@ -25,5 +26,3 @@ which will open the workspace in IntelliJ IDEA using JetBrains Gateway. Alternatively clone this project and run `mvn hpi:run`. Go to the **Design Library** menu item or straight to http://localhost:8080/jenkins/design-library/ and play with UI components. - -If you just want to see this plugin in action then you can also visit the latest version of this plugin in our [Jenkins "weekly" live installation](https://weekly.ci.jenkins.io/design-library/). diff --git a/logo.svg b/logo.svg index 4730bc4a..1827ce6a 100644 --- a/logo.svg +++ b/logo.svg @@ -1,7 +1,7 @@ - + - + diff --git a/src/main/java/io/jenkins/plugins/designlibrary/AppBar.java b/src/main/java/io/jenkins/plugins/designlibrary/AppBar.java index 768392dd..cb882a45 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/AppBar.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/AppBar.java @@ -1,11 +1,13 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; @Extension public class AppBar extends UISample { + @Override - public String getDisplayName() { + public @NonNull String getDisplayName() { return "App bars"; } @@ -14,6 +16,11 @@ public String getIconFileName() { return "symbol-app-bar"; } + @Override + public String getDescription() { + return "Frames your page and contains your most important actions."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Banner.java b/src/main/java/io/jenkins/plugins/designlibrary/Banner.java index 9dee676b..76293d24 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Banner.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Banner.java @@ -4,16 +4,17 @@ @Extension public class Banner extends UISample { - @Override - public String getDisplayName() { - return "Banner"; - } @Override public String getIconFileName() { return "symbol-information-circle-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Banners are a handy way to display small snippets of text and actions."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Buttons.java b/src/main/java/io/jenkins/plugins/designlibrary/Buttons.java index faf2171a..cf84c35b 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Buttons.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Buttons.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-buttons"; } + @Override + public String getDescription() { + return "Triggers specific actions with a click or tap."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Cards.java b/src/main/java/io/jenkins/plugins/designlibrary/Cards.java index 69e60b43..192182f7 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Cards.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Cards.java @@ -6,13 +6,18 @@ public class Cards extends UISample { @Override - public String getDisplayName() { - return "Cards"; + public String getIconFileName() { + return "symbol-cards"; } @Override - public String getIconFileName() { - return "symbol-cards"; + public String getDescription() { + return "Use cards to surface related information and controls to users."; + } + + @Override + public String getSince() { + return "2.479.1"; } @Extension diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Category.java b/src/main/java/io/jenkins/plugins/designlibrary/Category.java new file mode 100644 index 00000000..64ce81fc --- /dev/null +++ b/src/main/java/io/jenkins/plugins/designlibrary/Category.java @@ -0,0 +1,16 @@ +package io.jenkins.plugins.designlibrary; + +public enum Category { + COMPONENT("Components"), + PATTERN("Patterns"); + + Category(String displayName) { + this.displayName = displayName; + } + + private final String displayName; + + public String getDisplayName() { + return displayName; + } +} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Checkboxes.java b/src/main/java/io/jenkins/plugins/designlibrary/Checkboxes.java index 8b84f2e0..ea9087c5 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Checkboxes.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Checkboxes.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-checkbox-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Allows users to select one or more options from a list."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Colors.java b/src/main/java/io/jenkins/plugins/designlibrary/Colors.java index 659fc518..fdfd225d 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Colors.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Colors.java @@ -11,6 +11,16 @@ public String getIconFileName() { return "symbol-water-outline plugins-ionicons-api"; } + @Override + public String getDescription() { + return "Defines the palette for consistent use of color throughout the design system."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + public List getSemantics() { return List.of( new Semantic("Accent", "Use for branding", "accent-color"), diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Conventions.java b/src/main/java/io/jenkins/plugins/designlibrary/Conventions.java deleted file mode 100644 index b18050d3..00000000 --- a/src/main/java/io/jenkins/plugins/designlibrary/Conventions.java +++ /dev/null @@ -1,14 +0,0 @@ -package io.jenkins.plugins.designlibrary; - -import hudson.Extension; - -@Extension -public class Conventions extends UISample { - @Override - public String getIconFileName() { - return "symbol-school-outline plugin-ionicons-api"; - } - - @Extension - public static final class DescriptorImpl extends UISampleDescriptor {} -} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Dialogs.java b/src/main/java/io/jenkins/plugins/designlibrary/Dialogs.java index 83fea867..f94253a3 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Dialogs.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Dialogs.java @@ -1,15 +1,28 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; import hudson.util.ListBoxModel; @Extension public class Dialogs extends UISample { + + @NonNull + @Override + public String getDisplayName() { + return super.getDisplayName(); + } + @Override public String getIconFileName() { return "symbol-chatbox-ellipses-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Displays overlay windows for additional information or user input without navigating away."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor { public ListBoxModel doFillFlavorItems() { diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Dropdowns.java b/src/main/java/io/jenkins/plugins/designlibrary/Dropdowns.java deleted file mode 100644 index d426f5e0..00000000 --- a/src/main/java/io/jenkins/plugins/designlibrary/Dropdowns.java +++ /dev/null @@ -1,14 +0,0 @@ -package io.jenkins.plugins.designlibrary; - -import hudson.Extension; - -@Extension -public class Dropdowns extends UISample { - @Override - public String getIconFileName() { - return "symbol-dropdowns"; - } - - @Extension - public static final class DescriptorImpl extends UISampleDescriptor {} -} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/File.java b/src/main/java/io/jenkins/plugins/designlibrary/File.java index daae3bcd..dbb1f2e5 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/File.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/File.java @@ -4,16 +4,17 @@ @Extension public class File extends UISample { - @Override - public String getDisplayName() { - return "File"; - } @Override public String getIconFileName() { return "symbol-cloud-upload-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Enables file upload or management functionality."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Home.java b/src/main/java/io/jenkins/plugins/designlibrary/Home.java new file mode 100644 index 00000000..16f82420 --- /dev/null +++ b/src/main/java/io/jenkins/plugins/designlibrary/Home.java @@ -0,0 +1,48 @@ +package io.jenkins.plugins.designlibrary; + +import hudson.Extension; +import hudson.model.RootAction; +import java.util.List; +import java.util.Map; + +/** + * Entry point to all the UI samples. + * + * @author Kohsuke Kawaguchi + */ +@Extension +public class Home implements RootAction { + + public String getIconFileName() { + return "symbol-design-library plugin-design-library"; + } + + public String getDisplayName() { + return "Design Library"; + } + + public String getUrlName() { + return "design-library"; + } + + public List getAll() { + return UISample.getAll(); + } + + public static Map> getGrouped() { + return UISample.getGrouped(); + } + + /** + * Dynamically retrieves the appropriate UI sample based on the current URL + */ + public UISample getDynamic(String name) { + for (UISample ui : getAll()) { + String urlName = ui.getUrlName(); + if (urlName != null && urlName.equals(name)) { + return ui; + } + } + return null; + } +} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Inputs.java b/src/main/java/io/jenkins/plugins/designlibrary/Inputs.java index 3de2a12f..cc7f874d 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Inputs.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Inputs.java @@ -24,13 +24,10 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; -import hudson.model.AutoCompletionCandidates; import hudson.util.ComboBoxModel; import hudson.util.ListBoxModel; -import java.util.Arrays; -import java.util.HashSet; -import java.util.Set; import org.kohsuke.stapler.QueryParameter; /** @@ -40,45 +37,29 @@ */ @Extension public class Inputs extends UISample { + + @NonNull + @Override + public String getDisplayName() { + return super.getDisplayName(); + } + @Override public String getIconFileName() { return "symbol-textbox"; } @Override - public String getDisplayName() { - return "Input Fields"; + public String getDescription() { + return "Captures user input through various text or data entry formats."; } public String getShell() { return "echo \"Hello World\""; } - public String getHtml() { - return "Jenkins"; - } - @Extension public static final class DescriptorImpl extends UISampleDescriptor { - /** - * This method provides auto-completion items for the 'state' field. - * Stapler finds this method via the naming convention. - * - * @param value - * The text that the user entered. - */ - public AutoCompletionCandidates doAutoCompleteState(@QueryParameter String value) { - AutoCompletionCandidates c = new AutoCompletionCandidates(); - for (String state : STATES) - if (state.toLowerCase().startsWith(value.toLowerCase())) { - c.add(state); - } - return c; - } - - public ComboBoxModel doFillStateItems() { - return new ComboBoxModel(STATES); - } public ListBoxModel doFillAlbumItems() { ListBoxModel m = new ListBoxModel(); @@ -102,61 +83,4 @@ public ComboBoxModel doFillTitleItems(@QueryParameter int album) { } } } - - public Set getStatesNames() { - return new HashSet<>(Arrays.asList(STATES)); - } - - private static final String[] STATES = new String[] { - "Alabama", - "Alaska", - "Arizona", - "Arkansas", - "California", - "Colorado", - "Connecticut", - "Delaware", - "Florida", - "Georgia", - "Hawaii", - "Idaho", - "Illinois", - "Indiana", - "Iowa", - "Kansas", - "Kentucky", - "Louisiana", - "Maine", - "Maryland", - "Massachusetts", - "Michigan", - "Minnesota", - "Mississippi", - "Missouri", - "Montana", - "Nebraska", - "Nevada", - "New Hampshire", - "New Jersey", - "New Mexico", - "New York", - "North Carolina", - "North Dakota", - "Ohio", - "Oklahoma", - "Oregon", - "Pennsylvania", - "Rhode Island", - "South Carolina", - "South Dakota", - "Tennessee", - "Texas", - "Utah", - "Vermont", - "Virginia", - "Washington", - "West Virginia", - "Wisconsin", - "Wyoming" - }; } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/JavaScriptProxy.java b/src/main/java/io/jenkins/plugins/designlibrary/JavaScriptProxy.java index 1b7b7e1e..cd285550 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/JavaScriptProxy.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/JavaScriptProxy.java @@ -1,5 +1,6 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; import org.kohsuke.stapler.bind.JavaScriptMethod; @@ -14,10 +15,25 @@ public class JavaScriptProxy extends UISample { private int i; @Override - public String getDisplayName() { + public String getIconFileName() { + return "symbol-logo-javascript plugin-ionicons-api"; + } + + @Override + public @NonNull String getDisplayName() { return "JavaScript Proxy"; } + @Override + public String getDescription() { + return "Export arbitrary server-side Java object to JavaScript and invoke their methods from JavaScript."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + /** * The annotation exposes this method to JavaScript proxy. */ diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Layouts.java b/src/main/java/io/jenkins/plugins/designlibrary/Layouts.java index 744bef6e..fd8bce06 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Layouts.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Layouts.java @@ -5,16 +5,22 @@ @Extension public class Layouts extends UISample { - @Override - public String getDisplayName() { - return "Layouts"; - } @Override public String getIconFileName() { return "symbol-layouts"; } + @Override + public String getDescription() { + return "Predefined layout structures and patterns to organize page content."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + public Badge getBadge() { return new Badge("123", "A tooltip describing the badge", Badge.Severity.INFO); } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Links.java b/src/main/java/io/jenkins/plugins/designlibrary/Links.java index 636f313a..e0275df0 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Links.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Links.java @@ -16,6 +16,16 @@ public String getIconFileName() { return "symbol-at-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Creates navigational connections to internal or external destinations."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + /** * This method is called via AJAX to obtain the context menu for this model object. */ diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Menu.java b/src/main/java/io/jenkins/plugins/designlibrary/Menu.java new file mode 100644 index 00000000..7c4a7ba7 --- /dev/null +++ b/src/main/java/io/jenkins/plugins/designlibrary/Menu.java @@ -0,0 +1,20 @@ +package io.jenkins.plugins.designlibrary; + +import hudson.Extension; + +@Extension +public class Menu extends UISample { + + @Override + public String getIconFileName() { + return "symbol-dropdown-menu plugin-design-library"; + } + + @Override + public String getDescription() { + return "Menus allow you to group similar controls under one roof. They're an effective way to de-clutter your page whilst offering users the actions they need."; + } + + @Extension + public static final class DescriptorImpl extends UISampleDescriptor {} +} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Notifications.java b/src/main/java/io/jenkins/plugins/designlibrary/Notifications.java index 9c400b19..df9494a5 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Notifications.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Notifications.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-notifications-outline plugins-ionicons-api"; } + @Override + public String getDescription() { + return "Jenkins can display in-page notifications with a simple-to-use JavaScript API."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Progress.java b/src/main/java/io/jenkins/plugins/designlibrary/Progress.java index 108d4157..52a65f1b 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Progress.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Progress.java @@ -18,6 +18,11 @@ public String getIconFileName() { return "symbol-hourglass-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Indicates the completion status of a task or operation."; + } + public ProgressiveRendering factor(final String numberS) { return new ProgressiveRendering() { final List newFactors = new LinkedList(); diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Radios.java b/src/main/java/io/jenkins/plugins/designlibrary/Radios.java index 7af1d8c2..bbba5597 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Radios.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Radios.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-radio-button-on-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Allows users to select a single option from a group."; + } + public List getRadios() { return new ArrayList<>(Jenkins.get().getExtensionList(UISample.class)).subList(0, 4); } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/HeteroList.java b/src/main/java/io/jenkins/plugins/designlibrary/RepeatableList.java similarity index 75% rename from src/main/java/io/jenkins/plugins/designlibrary/HeteroList.java rename to src/main/java/io/jenkins/plugins/designlibrary/RepeatableList.java index c169b4cd..f63004fe 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/HeteroList.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/RepeatableList.java @@ -25,60 +25,44 @@ package io.jenkins.plugins.designlibrary; import com.google.common.collect.ImmutableList; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; -import hudson.XmlFile; import hudson.model.AbstractDescribableImpl; import hudson.model.Descriptor; -import hudson.util.FormApply; import hudson.util.ListBoxModel; -import java.io.File; -import java.io.IOException; import java.util.ArrayList; import java.util.Collections; import java.util.List; -import javax.servlet.ServletException; import jenkins.model.Jenkins; +import org.kohsuke.accmod.Restricted; +import org.kohsuke.accmod.restrictions.NoExternalUse; import org.kohsuke.stapler.DataBoundConstructor; -import org.kohsuke.stapler.HttpResponse; -import org.kohsuke.stapler.StaplerRequest; @Extension -public final class HeteroList extends UISample { +public class RepeatableList extends UISample { - @Extension - public static final class DescriptorImpl extends UISampleDescriptor {} - - public XmlFile getConfigFile() { - return new XmlFile(new File(Jenkins.get().getRootDir(), "stuff.xml")); - } - - private Config config; - - public HeteroList() throws IOException { - XmlFile xml = getConfigFile(); - if (xml.exists()) { - xml.unmarshal(this); - } + @Override + public String getIconFileName() { + return "symbol-list-outline plugin-ionicons-api"; } + @NonNull @Override public String getDisplayName() { - return "Hetero List"; + return "Repeatable list"; } - public Config getConfig() { - return config; + @Override + public String getDescription() { + return "Displays lists with varying content types within the same container."; } - public void setConfig(Config config) { - this.config = config; - } + @Extension + public static final class DescriptorImpl extends UISampleDescriptor {} - public HttpResponse doConfigSubmit(StaplerRequest req) throws ServletException, IOException { - config = null; // otherwise bindJSON will never clear it once set - req.bindJSON(this, req.getSubmittedForm()); - getConfigFile().write(this); - return FormApply.success("."); + @Restricted(NoExternalUse.class) + public Config getConfig() { + return new Config(List.of(new ChoiceEntry(""), new SimpleEntry(""), new HeteroRadioEntry(new ChoiceEntry("")))); } public static final class Config extends AbstractDescribableImpl { @@ -87,7 +71,7 @@ public static final class Config extends AbstractDescribableImpl { @DataBoundConstructor public Config(List entries) { - this.entries = entries != null ? new ArrayList(entries) : Collections.emptyList(); + this.entries = entries != null ? new ArrayList<>(entries) : Collections.emptyList(); } public List getEntries() { @@ -117,7 +101,7 @@ public String getText() { public static class DescriptorImpl extends Descriptor { @Override public String getDisplayName() { - return "Simple Entry"; + return "Textbox"; } } } @@ -140,7 +124,7 @@ public static class DescriptorImpl extends Descriptor { @Override public String getDisplayName() { - return "Choice Entry"; + return "Select"; } public ListBoxModel doFillChoiceItems() { @@ -166,10 +150,10 @@ public static class DescriptorImpl extends Descriptor { @Override public String getDisplayName() { - return "Hetero-Radio"; + return "Radio"; } - public List getEntryDescriptors() { + public List> getEntryDescriptors() { Jenkins jenkins = Jenkins.get(); return ImmutableList.of( jenkins.getDescriptorOrDie(ChoiceEntry.class), jenkins.getDescriptorOrDie(SimpleEntry.class)); diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Root.java b/src/main/java/io/jenkins/plugins/designlibrary/Root.java deleted file mode 100644 index 4ff75859..00000000 --- a/src/main/java/io/jenkins/plugins/designlibrary/Root.java +++ /dev/null @@ -1,54 +0,0 @@ -package io.jenkins.plugins.designlibrary; - -import hudson.Extension; -import hudson.model.RootAction; -import java.util.List; -import jenkins.model.ModelObjectWithContextMenu; -import org.kohsuke.stapler.StaplerRequest; -import org.kohsuke.stapler.StaplerResponse; - -/** - * Entry point to all the UI samples. - * - * @author Kohsuke Kawaguchi - */ -@Extension -public class Root implements RootAction, ModelObjectWithContextMenu { - public String getIconFileName() { - return "symbol-design-library plugin-design-library"; - } - - public String getDisplayName() { - return "Design Library"; - } - - public String getUrlName() { - return "design-library"; - } - - @Override - public ContextMenu doContextMenu(StaplerRequest request, StaplerResponse response) throws Exception { - ContextMenu menu = new ContextMenu(); - for (UISample s : getAll()) { - String iconFilename = s.getIconFileName() + " plugin-design-library"; - menu.add(new MenuItem() - .withDisplayName(s.getDisplayName()) - .withIconClass(iconFilename) - .withContextRelativeUrl("/" + getUrlName() + "/" + s.getUrlName())); - } - - return menu.from(this, request, response); - } - - public UISample getDynamic(String name) { - for (UISample ui : getAll()) { - String urlName = ui.getUrlName(); - if (urlName != null && urlName.equals(name)) return ui; - } - return null; - } - - public List getAll() { - return UISample.getAll(); - } -} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Select.java b/src/main/java/io/jenkins/plugins/designlibrary/Select.java index 6a4dd64d..7597a062 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Select.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Select.java @@ -5,17 +5,13 @@ import hudson.DescriptorExtensionList; import hudson.Extension; import hudson.ExtensionPoint; +import hudson.model.AutoCompletionCandidates; import hudson.model.Describable; import hudson.model.Descriptor; import hudson.util.ListBoxModel; -import hudson.util.XStream2; -import java.io.IOException; -import javax.servlet.ServletException; import jenkins.model.Jenkins; import org.kohsuke.stapler.DataBoundConstructor; import org.kohsuke.stapler.QueryParameter; -import org.kohsuke.stapler.StaplerRequest; -import org.kohsuke.stapler.StaplerResponse; /** * @author Alan.Harder@oracle.com @@ -27,6 +23,11 @@ public String getIconFileName() { return "symbol-select"; } + @Override + public String getDescription() { + return "Provides a dropdown for choosing one option from a predefined list."; + } + public Fruit getFruit() { // Could return currently configured/saved item here to initialized form with this data return null; @@ -36,15 +37,6 @@ public DescriptorExtensionList> getFruitDescriptors() { return Jenkins.get().getDescriptorList(Fruit.class); } - // Process form data and show it as serialized XML - public void doSubmit(StaplerRequest req, StaplerResponse rsp) throws ServletException, IOException { - // '$class' in form data tells Stapler which Fruit subclass to use, - // older versions of Jenkins/Stapler used 'stapler-class' - Fruit fruit = req.bindJSON(Fruit.class, req.getSubmittedForm().getJSONObject("fruit")); - rsp.setContentType("text/plain"); - new XStream2().toXML(fruit, rsp.getWriter()); - } - @Extension public static final class DescriptorImpl extends UISampleDescriptor { @@ -52,19 +44,37 @@ public ListBoxModel doFillFruitItems() { return new ListBoxModel(new ListBoxModel.Option("Apple"), new ListBoxModel.Option("Banana")); } - public ListBoxModel doFillStateItems(@QueryParameter String country) { + public ListBoxModel doFillStateItems() { ListBoxModel m = new ListBoxModel(); - for (String s : asList("A", "B", "C")) - m.add(String.format("State %s in %s", s, country), country + ':' + s); + for (String s : asList("A", "B", "C")) { + m.add(String.format("State %s", s), s); + } return m; } - public ListBoxModel doFillCityItems(@QueryParameter String country, @QueryParameter String state) { + public ListBoxModel doFillCityItems(@QueryParameter String state) { ListBoxModel m = new ListBoxModel(); - for (String s : asList("X", "Y", "Z")) - m.add(String.format("City %s in %s %s", s, state, country), state + ':' + s); + for (String s : asList("X", "Y", "Z")) { + m.add(String.format("City %s in %s", s, state), state + ':' + s); + } return m; } + + /** + * This method provides auto-completion items for the 'state' field. + * Stapler finds this method via the naming convention. + * + * @param value + * The text that the user entered. + */ + public AutoCompletionCandidates doAutoCompleteState(@QueryParameter String value) { + AutoCompletionCandidates c = new AutoCompletionCandidates(); + for (String state : STATES) + if (state.toLowerCase().startsWith(value.toLowerCase())) { + c.add(state); + } + return c; + } } public abstract static class Fruit implements ExtensionPoint, Describable { @@ -114,4 +124,57 @@ public boolean isYellow() { @Extension public static final class DescriptorImpl extends FruitDescriptor {} } + + private static final String[] STATES = new String[] { + "Alabama", + "Alaska", + "Arizona", + "Arkansas", + "California", + "Colorado", + "Connecticut", + "Delaware", + "Florida", + "Georgia", + "Hawaii", + "Idaho", + "Illinois", + "Indiana", + "Iowa", + "Kansas", + "Kentucky", + "Louisiana", + "Maine", + "Maryland", + "Massachusetts", + "Michigan", + "Minnesota", + "Mississippi", + "Missouri", + "Montana", + "Nebraska", + "Nevada", + "New Hampshire", + "New Jersey", + "New Mexico", + "New York", + "North Carolina", + "North Dakota", + "Ohio", + "Oklahoma", + "Oregon", + "Pennsylvania", + "Rhode Island", + "South Carolina", + "South Dakota", + "Tennessee", + "Texas", + "Utah", + "Vermont", + "Virginia", + "Washington", + "West Virginia", + "Wisconsin", + "Wyoming" + }; } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Spacing.java b/src/main/java/io/jenkins/plugins/designlibrary/Spacing.java index 2c84cd5d..e09e3da3 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Spacing.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Spacing.java @@ -9,6 +9,16 @@ public String getIconFileName() { return "symbol-filter-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Defines consistent padding, margins, and gaps between elements."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + @Extension public static class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Stylesheets.java b/src/main/java/io/jenkins/plugins/designlibrary/Stylesheets.java new file mode 100644 index 00000000..09bca27a --- /dev/null +++ b/src/main/java/io/jenkins/plugins/designlibrary/Stylesheets.java @@ -0,0 +1,25 @@ +package io.jenkins.plugins.designlibrary; + +import hudson.Extension; + +@Extension +public class Stylesheets extends UISample { + + @Override + public String getIconFileName() { + return "symbol-school-outline plugin-ionicons-api"; + } + + @Override + public String getDescription() { + return "Provides reusable stylesheet principles and standards for maintaining consistency."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; + } + + @Extension + public static final class DescriptorImpl extends UISampleDescriptor {} +} diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Symbols.java b/src/main/java/io/jenkins/plugins/designlibrary/Symbols.java index 790cdb8e..6fb73f93 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Symbols.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Symbols.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-star-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Jenkins Symbols are an extensive and consistent collection of icons for use in Jenkins and plugins."; + } + public Stack getSymbols() { Stack symbols = new Stack<>(); symbols.addAll(Arrays.asList( diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Table.java b/src/main/java/io/jenkins/plugins/designlibrary/Table.java index 93d46cf2..38996d5f 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Table.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Table.java @@ -12,6 +12,11 @@ public String getIconFileName() { return "symbol-table"; } + @Override + public String getDescription() { + return "Displays structured data in rows and columns, with support for sorting and badges."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/ToggleSwitch.java b/src/main/java/io/jenkins/plugins/designlibrary/ToggleSwitch.java index e16b28f3..71c05d94 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/ToggleSwitch.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/ToggleSwitch.java @@ -1,11 +1,13 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.Extension; @Extension public class ToggleSwitch extends UISample { + @Override - public String getDisplayName() { + public @NonNull String getDisplayName() { return "Toggle switch"; } @@ -14,6 +16,11 @@ public String getIconFileName() { return "symbol-toggle-outline plugin-ionicons-api"; } + @Override + public String getDescription() { + return "Enables users to switch between two states, such as on or off."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Tooltips.java b/src/main/java/io/jenkins/plugins/designlibrary/Tooltips.java index 01b3957a..62e5a6a2 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Tooltips.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Tooltips.java @@ -33,6 +33,11 @@ public String getIconFileName() { return "symbol-tooltips"; } + @Override + public String getDescription() { + return "Offers brief, contextual information when hovering over an element."; + } + @Extension public static final class DescriptorImpl extends UISampleDescriptor {} } diff --git a/src/main/java/io/jenkins/plugins/designlibrary/UISample.java b/src/main/java/io/jenkins/plugins/designlibrary/UISample.java index 4b9d302d..1fd4e0c3 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/UISample.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/UISample.java @@ -1,11 +1,17 @@ package io.jenkins.plugins.designlibrary; +import edu.umd.cs.findbugs.annotations.NonNull; import hudson.ExtensionPoint; import hudson.model.Action; import hudson.model.Describable; import io.jenkins.plugins.prism.PrismConfiguration; import java.util.ArrayList; +import java.util.Collection; +import java.util.Comparator; import java.util.List; +import java.util.Map; +import java.util.TreeMap; +import java.util.stream.Collectors; import jenkins.model.Jenkins; import org.kohsuke.accmod.Restricted; import org.kohsuke.accmod.restrictions.NoExternalUse; @@ -14,21 +20,55 @@ * @author Kohsuke Kawaguchi */ public abstract class UISample implements ExtensionPoint, Action, Describable { - public String getIconFileName() { - return "symbol-document-outline plugin-ionicons-api"; - } + /** + * Gets the URL-friendly name of the UI sample. + * Converts the display name to lowercase and replaces spaces with dashes. + * + * @return a URL-friendly string representation of the display name. + */ public String getUrlName() { - return getClass().getSimpleName(); + return getDisplayName().replaceAll(" ", "-").toLowerCase(); } /** - * Default display name. + * Gets the default display name for the UI sample. + * This is typically the simple class name of the implementing class. + * + * @return the display name. */ - public String getDisplayName() { + public @NonNull String getDisplayName() { return getClass().getSimpleName(); } + /** + * Retrieves the category of this UI sample. + * Defaults to {@link Category#COMPONENT}. + * + * @return the category of the UI sample. + */ + public Category getCategory() { + return Category.COMPONENT; + } + + /** + * Provides a description for the UI sample. + * The description is displayed at the top of every UI page for the sample. + * + * @return the description of the UI sample. + */ + public abstract String getDescription(); + + /** + * Gets the version of Jenkins where this UI sample was introduced. + * By default, returns null if version information is irrelevant. + * + * @return the version as a string, or null if irrelevant. + */ + public String getSince() { + return null; + } + public UISampleDescriptor getDescriptor() { return (UISampleDescriptor) Jenkins.get().getDescriptorOrDie(getClass()); } @@ -39,7 +79,15 @@ public PrismConfiguration getPrismConfiguration() { } public static List getAll() { - return new ArrayList<>(Jenkins.get().getExtensionList(UISample.class)); + return getGrouped().values().stream().flatMap(Collection::stream).toList(); + } + + public static Map> getGrouped() { + List uiSamples = new ArrayList<>(Jenkins.get().getExtensionList(UISample.class)); + + uiSamples.sort(Comparator.comparing(UISample::getDisplayName)); + + return new TreeMap<>(uiSamples.stream().collect(Collectors.groupingBy(UISample::getCategory))); } public UISample getPreviousPage() { diff --git a/src/main/java/io/jenkins/plugins/designlibrary/Validation.java b/src/main/java/io/jenkins/plugins/designlibrary/Validation.java index 816c7093..0a1b830a 100644 --- a/src/main/java/io/jenkins/plugins/designlibrary/Validation.java +++ b/src/main/java/io/jenkins/plugins/designlibrary/Validation.java @@ -20,7 +20,17 @@ public class Validation extends UISample { @Override public String getIconFileName() { - return "symbol-checkmark-circle-outline plugin-ionicons-api"; + return "symbol-checkmark-done-outline plugin-ionicons-api"; + } + + @Override + public String getDescription() { + return "Ensures user inputs meet specified criteria or rules before submission."; + } + + @Override + public Category getCategory() { + return Category.PATTERN; } private List states = new ArrayList(Arrays.asList( diff --git a/src/main/resources/images/symbols/app-bar.svg b/src/main/resources/images/symbols/app-bar.svg index 3f9eca3e..2166d8f4 100644 --- a/src/main/resources/images/symbols/app-bar.svg +++ b/src/main/resources/images/symbols/app-bar.svg @@ -1,7 +1,15 @@ - - - - + + + + + + + + + + + + \ No newline at end of file diff --git a/src/main/resources/images/symbols/dropdowns.svg b/src/main/resources/images/symbols/dropdown-menu.svg similarity index 100% rename from src/main/resources/images/symbols/dropdowns.svg rename to src/main/resources/images/symbols/dropdown-menu.svg diff --git a/src/main/resources/images/symbols/layouts.svg b/src/main/resources/images/symbols/layouts.svg index 00e0c1b5..f5d38042 100644 --- a/src/main/resources/images/symbols/layouts.svg +++ b/src/main/resources/images/symbols/layouts.svg @@ -1,10 +1,8 @@ - - - - - - - + + + + + \ No newline at end of file diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.jelly index 70bd9bc9..22b8e729 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.jelly @@ -1,50 +1,50 @@ - -

${%topAppBar.description}

-
-
- - - - - - -
- -
- - - - ${%topAppBar.do.1} - ${%topAppBar.dont.1} - - - ${%topAppBar.do.2} - ${%topAppBar.dont.2} - - - -
- -

${%bottomAppBar.description}

-
-
-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse lobortis accumsan lorem vel maximus. Vestibulum malesuada velit elementum, finibus arcu nec, maximus eros. Donec varius lacus at orci ultrices volutpat. Nulla ex dui, fringilla a sem a, imperdiet auctor enim. Aliquam ipsum orci, volutpat quis porta sit amet, commodo et sem.

-

Maecenas a elit eget est aliquam consectetur dapibus eu nibh. Suspendisse potenti. Fusce tristique nisl ut malesuada sollicitudin. Praesent sed nisl nibh. Etiam tincidunt enim sit amet eleifend maximus. Aenean molestie congue est, eu vehicula ex vulputate nec. Duis commodo, arcu a malesuada facilisis, purus ex imperdiet dolor, nec rhoncus nibh nisi eu ex. Vivamus varius eleifend sollicitudin.

- -
+ + + + + -
- -
- -
- + + + + + + + + + + ${%topAppBar.do.1} + ${%topAppBar.dont.1} + + + ${%topAppBar.do.2} + ${%topAppBar.dont.2} + + + + + + + +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse lobortis accumsan lorem vel maximus. Vestibulum malesuada velit elementum, finibus arcu nec, maximus eros. Donec varius lacus at orci ultrices volutpat. Nulla ex dui, fringilla a sem a, imperdiet auctor enim. Aliquam ipsum orci, volutpat quis porta sit amet, commodo et sem.

+

Maecenas a elit eget est aliquam consectetur dapibus eu nibh. Suspendisse potenti. Fusce tristique nisl ut malesuada sollicitudin. Praesent sed nisl nibh. Etiam tincidunt enim sit amet eleifend maximus. Aenean molestie congue est, eu vehicula ex vulputate nec. Duis commodo, arcu a malesuada facilisis, purus ex imperdiet dolor, nec rhoncus nibh nisi eu ex. Vivamus varius eleifend sollicitudin.

+ +
+ + +
+ + + + + + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.properties b/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.properties index 363ed4a1..32b36c7f 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.properties +++ b/src/main/resources/io/jenkins/plugins/designlibrary/AppBar/index.properties @@ -1,7 +1,9 @@ -topAppBar.description=App bars provide the page heading as well as important actions for the current page. -topAppBar.do.1=Place your most important actions in the app bar +topAppBar=Top app bar +topAppBar.description=Top app bar provides the page heading as well as important actions. +topAppBar.do.1=Place your most important actions in the top app bar topAppBar.do.2=Show a count subtitle if it explicitly relates to your page topAppBar.dont.1=Avoid showing more than four actions at once, relegate less used actions to an overflow menu topAppBar.dont.2=Avoid showing a count subtitle if it could relate to multiple things on your page +bottomAppBar=Bottom app bar bottomAppBar.description=Bottom app bars are great for forms, they provide important actions for the current page, such as "Save" and "Apply". Bottom app bars stick to the bottom of the screen so that they''re always present. diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.jelly index 27bc80ee..79ce6a2d 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.jelly @@ -1,29 +1,55 @@ - -
- Banners are a handy way to display small snippets of text and actions. -
-
-
-
- Hello world -
-
- Hello world -
-
- Hello world -
-
- Hello world -
+ + + + +
+ Hello world +
+ + + + + + + + +
+ Hello world +
+ + + + + + + + +
+ Hello world +
+ + + + + + + + +
+ Hello world +
+ + + + + + +
+ Since 2.459. The css classes have the jenkins- prefix. Older versions should use the non prefixed form which interfere with + classes defined in bootstrap.
- -
-
- Since 2.459. The css classes have the jenkins- prefix. Older versions should use the non prefixed form which interfere with - classes defined in bootstrap. -
- + + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.properties b/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.properties new file mode 100644 index 00000000..a3d8783c --- /dev/null +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Banner/index.properties @@ -0,0 +1,4 @@ +info=Info +warning=Warning +danger=Danger +success=Success diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.jelly index 51b0cafc..efeef98b 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.jelly @@ -24,85 +24,71 @@ THE SOFTWARE. - -

${%description.1}

- -

${%description.2}

- -
-
- -
- -
- -
-
- -
- -
- -

- You can pair buttons with color modifier classes, like so: -

- -
-
- -
- -
- -

- Tertiary buttons should be used for buttons which have minimal interaction or for those where - a background creates too much visual clutter: -

- -
-
- -
- -
- -

- Buttons can include symbols and they'll be automatically sized to fit correctly: -

- -
-
- -
- -
- -

${%copy}

-

${%copy.description}

-
-
- -
- -
- -

${%copy.parameters}

-
    -
  • text - ${%copy.parameters.text}
    • -
  • message - ${%copy.parameters.message}
    • -
- -

${%help}

-
-
- -
- -
- -

${%help.parameters}

-
    -
  • href - ${%help.parameters.1}
    • -
- + + + + + + + + + + + + + + + + + + + + + + + + + + +

+ ${%destructive.description} +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.properties b/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.properties index a64ff2d4..f020f593 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.properties +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Buttons/index.properties @@ -1,15 +1,20 @@ -description.1=Buttons are created with the .jenkins-button CSS class. \ - There are a number of different styles that can be added by adding another class alongside, \ - such as .jenkins-button--primary. Styling links as buttons is also supported. -description.2=Each form should have only one primary button. Most other buttons should just be the default one. \ - Destructive buttons should be used when something will be deleted or not easily undone. Generally these should have a confirmation page. -symbol=With Symbol -copy=Copy Button +default=Default + +primary=Primary +primary.description=Only use one primary button per page. + +modifiers=Modifiers +modifiers.description=Buttons work with color modifier classes, allowing for easy customization. +destructive.description=Destructive buttons should be used when something will be deleted or not easily undone. Generally these should have a confirmation dialog or page. + +tertiary=Tertiary +tertiary.description=Tertiary buttons should be used for buttons which have minimal interaction or for those where a background creates too much visual clutter. + +symbol=Symbol +symbol.description=Buttons can include symbols and they''ll be automatically sized to fit correctly. + +copy=Copy copy.description=A small button to copy text into a clipboard. -copy.parameters=The tag creates a small button that allows users to paste text into the clipboard. The tag requires two mandatory attributes: -copy.parameters.1=The text to be copied into the clipboard. -copy.parameters.2=Message to be displayed upon the successful copying into the clipboard. -help=Help Button -help.parameters=The tag creates a custom button to get help about a page. The button should always be in the top right \ - of a page, last in the row of components. The tag has one mandatory attribute: -help.parameters.1=The page to navigate to on click. + +help=Help +help.description=The button should always be in the top right of a page, last in the row of components, or in an overflow menu. diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.jelly index 62c855dc..3be78736 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.jelly @@ -1,128 +1,143 @@ - -

${%description}

- -
- -
-
-

Start

-
-
-
-

Parallel

-
- -
-
-
-

Deploy

-
- + + + +
+ +
+
+

Start

+
+
+
+

Parallel

+
+ +
+
+
+

Deploy

+
+ +
+
+
+

Linux publishing

+
+ +
+
+
+

End

+
+
-
-
-

Linux publishing

-
- + + +

+ + Last success 16 hours ago + #375 +

+

+ + Last failure One day ago + #370 +

+

+ + Last duration 30 seconds + #375 +

+

+ + jenkinsci/jenkins +

+ + +
+ +

All tests passed

+

0 failures (±0), 273 skipped (+273), 56,679 ran

+

Took 15 hours

-
-
-

End

-
-
+ + + + + + + + 03:27:50 [INFO] Building Jenkins Design Library 322.vd4663a_6c03f8 + 03:27:50 [INFO] from pom.xml + 03:27:50 [INFO] --------------------------------[ hpi ]--------------------------------- + 03:27:52 [INFO] + 03:27:52 [INFO] --- clean:3.4.0:clean (default-clean) @ design-library --- + 03:27:52 [INFO] + 03:27:52 [INFO] --- hpi:3.57:validate (default-validate) @ design-library --- + 03:27:52 [INFO] Created marker file + /home/jenkins/agent/workspace/ins_design-library-plugin_master/target/java-level/11 + 03:27:52 [INFO] + 03:27:52 [INFO] --- hpi:3.57:validate-hpi (default-validate-hpi) @ design-library --- + 03:27:52 [INFO] + 03:27:52 [INFO] --- enforcer:3.5.0:enforce (display-info) @ design-library --- + 03:27:52 [INFO] Rule 0: io.jenkins.tools.incrementals.enforcer.RequireExtensionVersion passed + 03:27:52 [INFO] Rule 1: org.apache.maven.enforcer.rules.version.RequireMavenVersion passed + 03:27:52 [INFO] Rule 2: org.apache.maven.enforcer.rules.version.RequireJavaVersion passed + 03:27:53 [INFO] Rule 3: org.codehaus.mojo.extraenforcer.dependencies.EnforceBytecodeVersion passed + 03:27:53 [INFO] Rule 4: org.apache.maven.enforcer.rules.dependency.BannedDependencies passed + 03:27:53 [INFO] Ignoring requireUpperBoundDeps in org.ow2.asm:asm + 03:27:53 [INFO] Rule 5: org.apache.maven.enforcer.rules.dependency.RequireUpperBoundDeps passed + +
- - -

- - Last success 16 hours ago - #375 -

-

- - Last failure One day ago - #370 -

-

- - Last duration 30 seconds - #375 -

-

- - jenkinsci/jenkins -

- - -
- -

All tests passed

-

0 failures (±0), 273 skipped (+273), 56,679 ran

-

Took 15 hours

-
- - - - - - - - 03:27:50 [INFO] Building Jenkins Design Library 322.vd4663a_6c03f8 - 03:27:50 [INFO] from pom.xml - 03:27:50 [INFO] --------------------------------[ hpi ]--------------------------------- - 03:27:52 [INFO] - 03:27:52 [INFO] --- clean:3.4.0:clean (default-clean) @ design-library --- - 03:27:52 [INFO] - 03:27:52 [INFO] --- hpi:3.57:validate (default-validate) @ design-library --- - 03:27:52 [INFO] Created marker file - /home/jenkins/agent/workspace/ins_design-library-plugin_master/target/java-level/11 - 03:27:52 [INFO] - 03:27:52 [INFO] --- hpi:3.57:validate-hpi (default-validate-hpi) @ design-library --- - 03:27:52 [INFO] - 03:27:52 [INFO] --- enforcer:3.5.0:enforce (display-info) @ design-library --- - 03:27:52 [INFO] Rule 0: io.jenkins.tools.incrementals.enforcer.RequireExtensionVersion passed - 03:27:52 [INFO] Rule 1: org.apache.maven.enforcer.rules.version.RequireMavenVersion passed - 03:27:52 [INFO] Rule 2: org.apache.maven.enforcer.rules.version.RequireJavaVersion passed - 03:27:53 [INFO] Rule 3: org.codehaus.mojo.extraenforcer.dependencies.EnforceBytecodeVersion passed - 03:27:53 [INFO] Rule 4: org.apache.maven.enforcer.rules.dependency.BannedDependencies passed - 03:27:53 [INFO] Ignoring requireUpperBoundDeps in org.ow2.asm:asm - 03:27:53 [INFO] Rule 5: org.apache.maven.enforcer.rules.dependency.RequireUpperBoundDeps passed - - -
+ + + + + ${%do.1} + ${%dont.1} + + + ${%do.2} + ${%dont.2} + + + ${%do.3} + + + -
+ + + + + Card content + + + + - - - ${%do.1} - ${%dont.1} - - - ${%do.2} - ${%dont.2} - - - ${%do.3} - - +

${%creating-a-card.description}

+ -
+ + + + + + + + + + Card content + + + + -
-
- - - - - - - Card content - -
- -
- +

${%setting-actions-on-a-card.description}

+ + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.properties b/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.properties index 8ed80a46..ed0c2973 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.properties +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Cards/index.properties @@ -1,6 +1,9 @@ -description=Use cards to surface related information and controls to users. do.1=Keep your card glanceable, let the user expand your card for more information do.2=Make your cards scalable to different screen sizes do.3=Do use hierarchy and symbols to add visual context dont.1=Don''t add unnecessary visual elements that clutter the card dont.2=Don''t have too many actions on one card +creating-a-card.title=Creating a card +creating-a-card.description=Cards are designed to automatically expand and fill the available space within their container, making them flexible and easy to use in different layouts. \n\nSince Jenkins doesn''t currently have a built-in grid system, you''ll need to create your own if you want to arrange multiple cards in a grid-like structure. You can do this by utilizing Flexbox or Grid to manage the positioning and spacing of your cards within the parent container. +setting-actions-on-a-card.title=Setting actions on a card +setting-actions-on-a-card.description=Actions are a great way to show key controls right on your card. These controls are tied to the card''s purpose and are placed in the top-right corner, so they''re easy to spot at a glance.\n\nThe expandable property always shows up last, and when you click it, it takes you to your card''s specific page for quick access to more details. diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Checkboxes/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Checkboxes/index.jelly index 7106f4f8..38736e8b 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Checkboxes/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Checkboxes/index.jelly @@ -24,22 +24,24 @@ THE SOFTWARE. - -

${%checkbox.parameters}

-
    -
  • id (optional) - ${%checkbox.parameters.id}
    • -
  • default (optional) - ${%checkbox.parameters.default}
    • -
  • field - ${%checkbox.parameters.field}
    • -
  • title - ${%checkbox.parameters.title}
    • -
+ + + + + + + + -

${%checkbox.additionalParameters}

+

${%checkbox.parameters}

+
    +
  • id (optional) - ${%checkbox.parameters.id}
    • +
  • default (optional) - ${%checkbox.parameters.default}
    • +
  • field - ${%checkbox.parameters.field}
    • +
  • title - ${%checkbox.parameters.title}
    • +
-
-
- -
- -
- +

${%checkbox.additionalParameters}

+ + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Colors/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Colors/index.jelly index d8f66da9..a084662d 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Colors/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Colors/index.jelly @@ -27,14 +27,14 @@ THE SOFTWARE.
  • -
    -
    +
    +

    -

    + ${item.name} +

    -

    ${item.name}

    ${item.description}

     @@ -52,24 +52,36 @@ THE SOFTWARE. - -

    ${%tip-first}

    -

    ${%tip-second}

    -

    ${%tip-third}

    -

    ${%tip-fourth}

    + + + + + ${%tip-first} + ${%tip-second} + + + ${%tip-third} + + + ${%tip-fourth} + + + -

    ${%Semantics}

    -
      - - - -
    + +
      + + + +
    +     -

    ${%Palette}

    -
      - - - -
    -     + +
      + + + +
    +     + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Conventions/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Conventions/index.jelly deleted file mode 100644 index 4f36c037..00000000 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Conventions/index.jelly +++ /dev/null @@ -1,84 +0,0 @@ - - - - - -

    Stylesheets (CSS/SCSS)

    - -

    Naming

    - -

    Classnames should follow Block Element Modifier (BEM) methodology and be prefixed.

    - -
    -
    -
    Block
    -
    Standalone entity that is meaningful on its own
    -
    e.g. header, container, menu, checkbox, input
    -
    -
    -
    Element
    -
    A part of a block that has no standalone meaning and is semantically tied to its block
    -
    e.g. __item, __checkbox-caption, __header
    -
    -
    -
    Modifier
    -
    A flag on a block or element. Use them to change appearance or behavior
    -
    e.g. --disabled, --selected, --large
    -
    -
    - -

    An example classname following this strategy could be .jenkins-cards__item--large or .jenkins-button--disabled.

    - -

    - Not every class falls neatly into BEM, for example a class that does not belong to a particular component - such as a spacing or color class. For those classes we use the -!- convention to indicate that the classes can be used on any component. -

    - -

    - Examples include: .jenkins-!-padding-6, .jenkins-!-margin-6 and .jenkins-!-destructive-color. -

    - -

    Prefixes

    - -

    - Classes should be prefixed in a way that is unique to your service or plugin. We use prefixes due to the extensible nature of Jenkins, without prefixing we couldn't be certain a plugin class wouldn't interfere with a Jenkins class. We also use prefixing to prevent clashes with other libraries, such as Bootstrap. -

    - -

    - Jenkins uses the prefixes jenkins- and app- to namespace CSS classes, these prefixes should not be used in your plugins. Due to legacy reasons, some classes in use in Jenkins aren't namespaced however they are okay to use in your plugin. -

    - -

    - Classes prefixed with jenkins- indicate that they can be used in your plugin with confidence that they will only receive minimal changes. -

    - -

    - Classes prefixed with app- indicate that they should not be used in your plugin as these classes are internal to Jenkins and may change at any time. -

    - -

    - A simple way to come up with a prefix for your plugin is to abbreviate your plugin name, e.g. Jenkins Design Library becomes jdl-. -

    -     -     diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/form.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/form.jelly index 3d83147a..8eeac19c 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/form.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/form.jelly @@ -1,5 +1,5 @@ - + diff --git a/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/index.jelly b/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/index.jelly index d8d9e985..96d5f458 100644 --- a/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/index.jelly +++ b/src/main/resources/io/jenkins/plugins/designlibrary/Dialogs/index.jelly @@ -1,15 +1,180 @@ - - -

    ${%description}

    + + + + + + +
    Error
    +
    This doesn't work.
    +
    + + +
    +     +     + +     +

    ${%alerts}

    +     + + + + + +
    Welcome to the Dialog demo
    +
    How should I call you?
    +
    + +
    +
    + + +
    +     +     + +     +

    ${%prompts}

    +     + + + + + +
    Do it
    +
    Are you sure?
    +
    + + +
    +     +     + +     +

    ${%confirmations}

    +     + + + + + +
    Modal
    +
    +
    +

    Behaviour

    + Click on the "X" in the top right or outside to close me. +

    You can include icons

    + + Dialogs are cool. +
    +
    + +     +     + + + + + + + + +     +

    ${%modals}

    +     + + + + + +
    Order your ice cream
    +
    +
    +
    +
    Name
    +
    + + + +
    +
    +
    +
    +
    Quantity
    +
    + +
    +
    +
    +
    +
    Choose flavor
    +
    + + + +
    + +
    +
    +
    +
    +
    +
    + + +
    +
    +     +     + + + + + + + + +     + + +

    ${%forms}

    +     + +
    @@ -24,65 +189,64 @@
    - -

    ${%alerts}

    - -     - -

    ${%prompts}

    - -     - -

    ${%confirmations}

    - -     - -

    ${%modals}

    - - -     - -

    ${%forms}

    -

    - - - -     -
    -
    -

    Customizing the appearance and behaviour

    - All dialogs take a second optional parameter with options that allow to change certain aspects. -
      -
    • message: Adds a message to the dialog
      • -
    • okText: Adjust the text of the OK button, the default depends on the type of dialog
      • -
    • cancelText: Adjust the text of the Cancel button, defaults to Cancel
      • -
    • type: Change the color of the OK button. Allowed values: destructive
      • -
    • minWidth: Set the minimum width of the dialog, the default depends on the type of dialog
      • -
    • maxWidth: Set the maximum width of the dialog, defaults to 475px
      • -
    • hideCloseButton: Hides the close button in modal dialogs, defaults to false
      • + +
      All dialogs take a second optional parameter with options that allow to change certain + aspects. +
      +
        +
      • message: Adds a message to the dialog +
        • +
      • okText: Adjust the text of the OK button, the default depends on the type of dialog +
        • +
      • cancelText: Adjust the text of the Cancel button, defaults to + Cancel +
        • +
      • type: Change the color of the OK button. Allowed values: + destructive +
        • +
      • minWidth: Set the minimum width of the dialog, the default depends on the type of dialog +
        • +
      • maxWidth: Set the maximum width of the dialog, defaults to + 475px +
        • +
      • hideCloseButton: Hides the close button in modal dialogs, defaults to + false +
      • allowEmpty: When set to false the OK button will be disabled in the - prompt dialog as long as the input field is empty or contains only whitespace, defaults to false
        • -
      • submitButton: Change the behaviour of the submit button in a form dialog. When true + prompt dialog as long as the input field is empty or contains only whitespace, defaults to + false +
        • +
      • submitButton: Change the behaviour of the submit button in a form dialog. When + true the form will be submitted to the action attribute of the form. When false, a - FormData object is passed to the resolve method of the Promise. - Defaults to true
        • + FormData + object is passed to the resolve method of the Promise. + Defaults to + true +
      -
      -

      ${%OK Button texts}

      - ${%buttontexts} -
        -
      • ok: OK
        • -
      • cancel: Cancel
        • -
      • yes: Yes
        • -
      • no: No
        • -
      • add: Add
        • -
      • save: Save
        • -
      • apply: Apply
        • -
      • submit: Submit
        • + + + +
        ${%buttontexts}
        +
          +
        • ok: OK +
          • +
        • cancel: Cancel +
          • +
        • yes: Yes +
          • +
        • no: No +
          • +
        • add: Add +
          • +
        • save: Save +
          • +
        • apply: Apply +
          • +
        • submit: Submit +
        -
    -