blue-web 1.17.0 → 1.17.2

package/dist/js/dialog.bundle.js.LICENSE.txt

@@ -0,0 +1,5 @@
+/*!
+  * Bootstrap v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */

package/dist/js/select-list.bundle.js

@@ -1 +1 @@
-(()=>{"use strict";class t extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML='<slot style="border-radius: inherit"></slot>',this.activeIndex=-1,this.items=[],this.inputElement=null}connectedCallback(){this.setAttribute("role","listbox"),this.tabIndex=-1,this.updateItems();const t=this.getAttribute("for");this.inputElement=t?document.getElementById(t):null,this.inputElement&&(this.inputElement.setAttribute("role","combobox"),this.inputElement.setAttribute("aria-controls",this.id),this.inputElement.setAttribute("aria-autocomplete","list"),this.inputElement.setAttribute("aria-expanded","true"),this.inputElement.addEventListener("keydown",this.onKeyDown.bind(this))),this.addEventListener("keydown",this.onKeyDown.bind(this)),this.addEventListener("click",(t=>{const e=t.target instanceof Element?t.target.closest("[data-blue-select-list-index]"):null;if(e&&e.hasAttribute("data-blue-select-list-index")){const t=Number(e.getAttribute("data-blue-select-list-index"));this.select(t)}}))}updateItems(){this.items=Array.from(this.children),this.items.forEach(((t,e)=>{t.hasAttribute("id")||t.setAttribute("id",`${this.id}-option-${e}`),t.setAttribute("data-blue-select-list-index",e.toString()),t.setAttribute("aria-selected","false"),t.setAttribute("role","option"),t.tabIndex=-1}))}onKeyDown(t){if(this.items.length)if("ArrowDown"===t.key)t.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.items.length,this.updateActiveItem();else if("ArrowUp"===t.key)t.preventDefault(),this.activeIndex=(this.activeIndex-1+this.items.length)%this.items.length,this.updateActiveItem();else if("Enter"===t.key&&this.activeIndex>=0){const t=this.items[this.activeIndex];t?.click()}}updateActiveItem(){this.items.forEach(((t,e)=>{const i=e===this.activeIndex;t.classList.toggle("active",i),t.setAttribute("aria-selected",i.toString())}));const t=this.items[this.activeIndex];t&&this.inputElement&&(this.inputElement.setAttribute("aria-activedescendant",t.id),t.scrollIntoView({block:"nearest"}))}select(t){this.activeIndex=t,this.updateActiveItem();const e=this.items[t];e&&(this.dispatchEvent(new CustomEvent("bl-select",{detail:{index:t,item:e},bubbles:!0,composed:!0})),e.click())}}customElements.define("bl-select-list",t)})();
+(()=>{"use strict";class t extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML='<slot style="border-radius: inherit"></slot>',this.activeIndex=-1,this.items=[],this.inputElement=null}connectedCallback(){this.setAttribute("role","listbox"),this.tabIndex=-1,this.updateItems();const t=this.getAttribute("for");this.inputElement=t?document.getElementById(t):null,this.inputElement&&(this.inputElement.setAttribute("role","combobox"),this.inputElement.setAttribute("aria-controls",this.id),this.inputElement.setAttribute("aria-expanded","true"),this.inputElement.addEventListener("keydown",this.onKeyDown.bind(this))),this.addEventListener("keydown",this.onKeyDown.bind(this)),this.addEventListener("click",(t=>{const e=t.target instanceof Element?t.target.closest("[data-blue-select-list-index]"):null;if(e&&e.hasAttribute("data-blue-select-list-index")){const t=Number(e.getAttribute("data-blue-select-list-index"));this.select(t)}}))}updateItems(){this.items=Array.from(this.children),this.items.forEach(((t,e)=>{t.hasAttribute("id")||t.setAttribute("id",`${this.id}-option-${e}`),t.setAttribute("data-blue-select-list-index",e.toString()),t.setAttribute("aria-selected","false"),t.setAttribute("role","option"),t.tabIndex=-1}))}onKeyDown(t){if(console.log("select-list onKeyDown"),this.items.length)if("ArrowDown"===t.key)t.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.items.length,this.updateActiveItem();else if("ArrowUp"===t.key)t.preventDefault(),this.activeIndex=(this.activeIndex-1+this.items.length)%this.items.length,this.updateActiveItem();else if("Enter"===t.key&&this.activeIndex>=0){const t=this.items[this.activeIndex];t?.click()}}updateActiveItem(){this.items.forEach(((t,e)=>{const i=e===this.activeIndex;t.classList.toggle("active",i),t.setAttribute("aria-selected",i.toString())}));const t=this.items[this.activeIndex];t&&this.inputElement&&(this.inputElement.setAttribute("aria-activedescendant",t.id),t.scrollIntoView({block:"nearest"}))}select(t){this.activeIndex=t,this.updateActiveItem();const e=this.items[t];e&&(this.dispatchEvent(new CustomEvent("bl-select",{detail:{index:t,item:e},bubbles:!0,composed:!0})),e.click())}}customElements.define("bl-select-list",t)})();

package/dist/js/select-list.d.ts

@@ -1,5 +1,6 @@
 /**
  * A Web Component that provides a keyboard-accessible selectable list, typically used for dropdowns or autocomplete lists.
+ * Together with `popover` and CSS Anchoring, it's also useful to create a dropdown list.
  * Supports keyboard navigation and selection, and integrates with an input element for combobox behavior.
  *
  * The Web Component will automatically set attributes for accessibility.

package/dist/js/select-list.js

@@ -1,5 +1,6 @@
 /**
  * A Web Component that provides a keyboard-accessible selectable list, typically used for dropdowns or autocomplete lists.
+ * Together with `popover` and CSS Anchoring, it's also useful to create a dropdown list.
  * Supports keyboard navigation and selection, and integrates with an input element for combobox behavior.
  *
  * The Web Component will automatically set attributes for accessibility.
@@ -36,7 +37,6 @@ export class SelectList extends HTMLElement {
     if (this.inputElement) {
       this.inputElement.setAttribute("role", "combobox");
       this.inputElement.setAttribute("aria-controls", this.id);
-      this.inputElement.setAttribute("aria-autocomplete", "list");
       this.inputElement.setAttribute("aria-expanded", "true");
       this.inputElement.addEventListener("keydown", this.onKeyDown.bind(this));
     }
@@ -62,6 +62,7 @@ export class SelectList extends HTMLElement {
     });
   }
   onKeyDown(e) {
+    console.log("select-list onKeyDown");
     if (!this.items.length) return;
     if (e.key === "ArrowDown") {
       e.preventDefault();

package/dist/merged.scss

@@ -1,5 +1,5 @@
 /*!
- * Blue Web v1.17.0 (https://bruegmann.github.io/blue-web)
+ * Blue Web v1.17.2 (https://bruegmann.github.io/blue-web)
  * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
 */
 
@@ -11839,6 +11839,19 @@ body {
     @include make-grid-columns-cq();
 }
 
+// Customize style of Bootstrap's nav-underline
+.nav-underline {
+    .nav-link {
+        --#{$prefix}nav-link-color: var(--#{$prefix}list-group-action-color);
+    }
+
+    .nav-link.active,
+    .show > .nav-link {
+        font-weight: var(--blue-tabs-underline-active-font-weight, $font-weight-semibold);
+        border-bottom-color: var(--blue-tabs-underline-active-border-bottom-color, $primary);
+    }
+}
+
 .blue-tabs {
     display: flex;
     flex-wrap: wrap;
@@ -11893,9 +11906,9 @@ input.blue-tab:checked + .blue-tab-content {
 .blue-tabs.nav-underline {
     row-gap: 0;
     .blue-tab:checked {
-        font-weight: var(--blue-tabs-underline-active-font-weight, 700);
+        font-weight: var(--blue-tabs-underline-active-font-weight, $font-weight-semibold);
         color: var(--bs-nav-underline-link-active-color);
-        border-bottom-color: var(--blue-tabs-underline-active-border-bottom-color, currentcolor);
+        border-bottom-color: var(--blue-tabs-underline-active-border-bottom-color, $primary);
     }
 }
 
@@ -12159,16 +12172,6 @@ dialog.blue-modal:has(.offcanvas-start) {
     &[open] > summary > .blue-collapse-header > .blue-collapse-chevron,
     &[open] > summary > .blue-collapse-chevron {
         --blue-collapse-chevron-rotate: 90deg;
-
-        // If chevron is on the end, rotate has to be -90deg
-        &:is(:last-child) {
-            --blue-collapse-chevron-rotate: -90deg;
-        }
-
-        &:is(:first-child) {
-            --blue-collapse-chevron-rotate: 90deg;
-        }
-
         transform: rotate(var(--blue-collapse-chevron-rotate));
     }
 
@@ -12366,8 +12369,64 @@ dialog.blue-modal:has(.offcanvas-start) {
     --dxbl-toolbar-btn-border-radius: var(--bs-border-radius) !important;
     --dxbl-dropdown-border-radius: var(--bs-border-radius) !important;
     --dxbl-btn-border-radius: var(--bs-border-radius) !important;
+    --dxbl-context-menu-border-radius: var(--bs-border-radius) !important;
     --dxbl-btn-padding-x: 0.75rem !important;
     --dxbl-btn-padding-y: 0.375rem !important;
+
+    --dxbl-btn-font-size: 1rem;
+    --dxbl-checkbox-font-size: 1rem;
+    --dxbl-calendar-font-size: 1rem;
+    --dxbl-listbox-font-size: 1rem;
+    --dxbl-list-box-font-size: 1rem;
+    --dxbl-list-box-item-drag-hint-font-size: 1rem;
+    --dxbl-color-palette-font-size: 1rem;
+    --dxbl-text-edit-font-size: 1rem;
+    --dxbl-edit-dropdown-font-size: 1rem;
+    --dxbl-pager-font-size: 1rem;
+    --dxbl-grid-font-size: 1rem;
+    --dxbl-grid-draggable-header-font-size: 1rem;
+    --dxbl-grid-row-drag-hint-font-size: 1rem;
+    --dxbl-flyout-font-size: 1rem;
+    --dxbl-popup-font-size: 1rem;
+    --dxbl-dropdown-font-size: 1rem;
+    --dxbl-window-font-size: 1rem;
+    --dxbl-group-font-size: 1rem;
+    --dxbl-fl-font-size: 1rem;
+    --dxbl-fl-group-font-size: 1rem;
+    --dxbl-fl-tab-group-font-size: 1rem;
+    --dxbl-fl-tab-group-content-font-size: 1rem;
+    --dxbl-toolbar-font-size: 1rem;
+    --dxbl-tabs-font-size: 1rem;
+    --dxbl-tabs-content-font-size: 1rem;
+    --dxbl-accordion-group-font-size: 1rem;
+    --dxbl-accordion-group-item-font-size: 1rem;
+    --dxbl-accordion-group-header-font-size: 1rem;
+    --dxbl-treeview-font-size: 1rem;
+    --dxbl-navigation-badge-font-size: 1rem;
+    --dxbl-radio-group-font-size: 1rem;
+    --dxbl-context-menu-font-size: 1rem;
+    --dxbl-menu-item-font-size: 1rem;
+    --dxbl-scheduler-font-size: 1rem;
+    --dxbl-toast-text-font-size: 1rem;
+    --dxbl-toast-header-font-size: 1rem;
+    --dxbl-drawer-panel-font-size: 1rem;
+    --dxbl-progress-bar-label-font-size: 1rem;
+    --dxbl-pivot-font-size: 1rem;
+    --dxbl-pivot-field-font-size: 1rem;
+    --dxbl-pivot-header-font-size: 1rem;
+    --dxbl-pivot-total-font-size: 1rem;
+    --dxbl-pivot-table-font-size: 1rem;
+    --dxbl-pivot-table-header-field-font-size: 1rem;
+    --dxbl-pivot-table-row-field-font-size: 1rem;
+    --dxbl-pivot-table-total-font-size: 1rem;
+    --dx-chatui-message-font-size: 1rem;
+    --dx-chatui-suggestion-item-title-font-size: 1rem;
+    --dx-chatui-attachment-list-item-font-size: 1rem;
+    --dx-chatui-suggestion-item-text-font-size: 1rem;
+    --dxbl-message-box-body-text-font-size: 1rem;
+    --dxbl-message-box-header-font-size: 1rem;
+    --dxbl-splitter-font-size: 1rem;
+    --dxbl-filter-builder-font-size: 1rem;
 }
 
 .dxbl-grid {
@@ -12375,10 +12434,6 @@ dialog.blue-modal:has(.offcanvas-start) {
     border: none;
 }
 
-.dxbl-text-edit {
-    font-size: 1rem;
-}
-
 .dxbl-pager-page-edit {
     min-width: 2.5em;
 }
@@ -12392,6 +12447,21 @@ body.modal-open .dxbl-popup-cell[style="z-index: 1050;"] {
     z-index: 1056 !important;
 }
 
+@if ($enable-button-pointers: false) {
+    .dxbl-context-menu.dxbl-context-menu-dropdown
+        > .dxbl-dropdown-body
+        ul
+        li:not(.dxbl-context-menu-separator)
+        > .dxbl-context-menu-item,
+    .dxbl-context-menu-submenu.dxbl-context-menu-dropdown
+        > .dxbl-dropdown-body
+        ul
+        li:not(.dxbl-context-menu-separator)
+        > .dxbl-context-menu-item {
+        cursor: default;
+    }
+}
+
 :root {
     --bs-font-sans-serif: Inter, #{$font-family-sans-serif};
     font-feature-settings: