You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by hn...@apache.org on 2022/11/04 13:09:00 UTC
[myfaces-tobago] 01/02: feat(selectMany): disabled inline
This is an automated email from the ASF dual-hosted git repository.
hnoeth pushed a commit to branch t5_selectMany
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git
commit 1b12ebedc9d32fbbbdc680ef1aa99f58de47186d
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Fri Nov 4 13:15:34 2022 +0100
feat(selectMany): disabled inline
* use $form-select-disabled-color variable from bootstrap
* use list-group border-color for border between select field and table
Issue: TOBAGO-2159
---
.../renderkit/renderer/SelectManyRenderer.java | 25 ++++++++++------
tobago-theme/src/main/scss/_tobago.scss | 33 ++++++++++++++++------
2 files changed, 42 insertions(+), 16 deletions(-)
diff --git a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyRenderer.java b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyRenderer.java
index 8e02772d5e..5aecfb275f 100644
--- a/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyRenderer.java
+++ b/tobago-core/src/main/java/org/apache/myfaces/tobago/internal/renderkit/renderer/SelectManyRenderer.java
@@ -39,6 +39,7 @@ import org.apache.myfaces.tobago.webapp.TobagoResponseWriter;
import javax.faces.context.FacesContext;
import javax.faces.model.SelectItem;
import java.io.IOException;
+import java.util.ArrayList;
import java.util.List;
public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectManyRendererBase<T> {
@@ -50,7 +51,19 @@ public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectMa
@Override
protected CssItem[] getComponentCss(final FacesContext facesContext, final T component) {
final boolean inline = component.isInline();
- return inline ? new CssItem[]{BootstrapClass.LIST_GROUP} : new CssItem[]{BootstrapClass.DROPDOWN};
+ final List<SelectItem> items = SelectItemUtils.getItemList(facesContext, component);
+ final boolean disabled = !items.iterator().hasNext() || component.isDisabled() || component.isReadonly();
+
+ List<CssItem> cssItems = new ArrayList<>();
+ if (disabled) {
+ cssItems.add(TobagoClass.DISABLED);
+ }
+ if (inline) {
+ cssItems.add(BootstrapClass.LIST_GROUP);
+ } else {
+ cssItems.add(BootstrapClass.DROPDOWN);
+ }
+ return cssItems.toArray(new CssItem[0]);
}
@Override
@@ -73,7 +86,7 @@ public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectMa
final String title = HtmlRendererUtils.getTitleFromTipAndMessages(facesContext, component);
renderHiddenSelect(facesContext, component);
- renderFilterInput(facesContext, component);
+ renderSelectField(facesContext, component);
writer.startElement(HtmlElements.DIV);
writer.writeClassAttribute(
@@ -104,15 +117,12 @@ public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectMa
writer.writeAttribute(DataAttributes.VALUE, formattedValue, true);
writer.writeClassAttribute(
contains ? BootstrapClass.TABLE_ACTIVE : null,
- item.isDisabled() ? BootstrapClass.TEXT_MUTED : null);
+ disabled || item.isDisabled() ? TobagoClass.DISABLED : null);
writer.startElement(HtmlElements.TD);
writer.writeAttribute(HtmlAttributes.VALUE, formattedValue, true);
writer.writeText(item.getLabel());
writer.endElement(HtmlElements.TD);
-// writer.startElement(HtmlElements.TD);
-// writer.writeText("dummy column");
-// writer.endElement(HtmlElements.TD);
writer.endElement(HtmlElements.TR);
}
@@ -150,7 +160,7 @@ public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectMa
writer.endElement(HtmlElements.SELECT);
}
- private void renderFilterInput(FacesContext facesContext, T component) throws IOException {
+ private void renderSelectField(FacesContext facesContext, T component) throws IOException {
final TobagoResponseWriter writer = getResponseWriter(facesContext);
final String clientId = component.getClientId(facesContext);
@@ -171,7 +181,6 @@ public class SelectManyRenderer<T extends AbstractUISelectMany> extends SelectMa
inline ? BootstrapClass.FORM_CONTROL : BootstrapClass.FORM_SELECT,
TobagoClass.SELECT__FIELD,
inline ? BootstrapClass.LIST_GROUP_ITEM : BootstrapClass.DROPDOWN_TOGGLE,
- disabled ? TobagoClass.DISABLED : null,
BootstrapClass.borderColor(ComponentUtils.getMaximumSeverity(component)),
component.getCustomClass());
writer.writeAttribute(HtmlAttributes.TITLE, title, true);
diff --git a/tobago-theme/src/main/scss/_tobago.scss b/tobago-theme/src/main/scss/_tobago.scss
index 998aac2a65..eec7f2eeac 100644
--- a/tobago-theme/src/main/scss/_tobago.scss
+++ b/tobago-theme/src/main/scss/_tobago.scss
@@ -42,12 +42,15 @@ $icon-sort-8: "\f7c1";
$icon-sort-9: "\f7c7";
/* non-bootstrap variables --------------------------------------- */
-
$tobago-form-disabled-alpha: 0.5;
$tobago-page-padding-top: 1rem;
$tobago-header-margin-bottom: $tobago-page-padding-top;
$tobago-flex-layout-spacing: 0.5rem;
+/* bootstrap variables --------------------------------------- */
+$input-disabled-color: rgba($input-color, $tobago-form-disabled-alpha) !default;
+$form-select-disabled-color: rgba($form-select-color, $tobago-form-disabled-alpha) !default;
+
/* utilities ----------------------------------------------------- */
.tobago-display-inline-block {
display: inline-block;
@@ -1191,7 +1194,7 @@ tobago-select-many {
&.list-group {
.tobago-options {
- border-top: ($table-border-width * 2) solid $table-group-separator-color;
+ border-top-width: ($list-group-border-width * 2);
overflow: auto;
}
}
@@ -1206,6 +1209,14 @@ tobago-select-many {
}
}
+ &.tobago-disabled {
+ .tobago-select-field {
+ color: $form-select-disabled-color;
+ background-color: $form-select-disabled-bg;
+ border-color: $form-select-disabled-border-color;
+ }
+ }
+
.tobago-select-field {
display: flex;
flex-wrap: wrap;
@@ -1222,12 +1233,6 @@ tobago-select-many {
padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
}
- &.tobago-disabled {
- color: $form-select-disabled-color;
- background-color: $form-select-disabled-bg;
- border-color: $form-select-disabled-border-color;
- }
-
.btn-group + .tobago-filter {
margin-left: 0.25rem;
}
@@ -1258,6 +1263,18 @@ tobago-select-many {
.table {
margin-bottom: 0;
+
+ tr {
+ cursor: pointer;
+
+ &.tobago-disabled {
+ color: $form-select-disabled-color;
+ background-color: $form-select-disabled-bg;
+ border-color: $form-select-disabled-border-color;
+ cursor: initial;
+ pointer-events: none;
+ }
+ }
}
}
}