@brickclay-org/ui 0.1.49 → 0.1.51

package/index.d.ts

@@ -840,6 +840,7 @@ declare class BkSelect implements ControlValueAccessor {
     items: i0.InputSignal<any[]>;
     bindLabel: i0.InputSignal<string>;
     bindValue: i0.InputSignal<string>;
+    bindIcon: i0.InputSignal<string>;
     placeholder: i0.InputSignal<string>;
     notFoundText: i0.InputSignal<string>;
     loadingText: i0.InputSignal<string>;
@@ -860,7 +861,7 @@ declare class BkSelect implements ControlValueAccessor {
     disabled: i0.ModelSignal<boolean>;
     loading: i0.InputSignal<boolean>;
     closeOnSelect: i0.InputSignal<boolean>;
-    dropdownPosition: i0.InputSignal<"top" | "bottom">;
+    dropdownPosition: i0.InputSignal<"bottom" | "top">;
     hasError: boolean;
     errorMessage: string;
     appendToBody: i0.InputSignal<boolean>;
@@ -934,10 +935,11 @@ declare class BkSelect implements ControlValueAccessor {
         items: any[];
     }[]>;
     resolveColor(item: any): string | null;
+    resolveIcon(item: any): string | null;
     getRemainingItems(): string[];
     getTooltipIfEllipsed(el: HTMLElement, text: string): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<BkSelect, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BkSelect, "bk-select", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "notFoundText": { "alias": "notFoundText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "clearAllText": { "alias": "clearAllText"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "colorKey": { "alias": "colorKey"; "required": false; "isSignal": true; }; "iconAlt": { "alias": "iconAlt"; "required": false; }; "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "variation": { "alias": "variation"; "required": false; }; "iconSrc": { "alias": "iconSrc"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxLabels": { "alias": "maxLabels"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "allSelect": { "alias": "allSelect"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "clear": "clear"; "change": "change"; "scrollToEnd": "scrollToEnd"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BkSelect, "bk-select", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "bindIcon": { "alias": "bindIcon"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "notFoundText": { "alias": "notFoundText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "clearAllText": { "alias": "clearAllText"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "colorKey": { "alias": "colorKey"; "required": false; "isSignal": true; }; "iconAlt": { "alias": "iconAlt"; "required": false; }; "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "variation": { "alias": "variation"; "required": false; }; "iconSrc": { "alias": "iconSrc"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxLabels": { "alias": "maxLabels"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "allSelect": { "alias": "allSelect"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "clear": "clear"; "change": "change"; "scrollToEnd": "scrollToEnd"; }, never, never, true, never>;
 }
 
 type BkInputType = 'text' | 'email' | 'password' | 'number' | 'url' | 'tel';
@@ -1917,7 +1919,7 @@ declare class BkHierarchicalSelect implements ControlValueAccessor {
     /** When true, dropdown is positioned fixed and sized to the trigger (use inside modals/popups). */
     appendToBody: i0.InputSignal<boolean>;
     /** Open above or below the trigger (also used when appendToBody is true for fixed coordinates). */
-    dropdownPosition: i0.InputSignal<"top" | "bottom">;
+    dropdownPosition: i0.InputSignal<"bottom" | "top">;
     /** Key for option color (e.g. "color"). When set, option label and selected value use this color. */
     colorKey: i0.InputSignal<string>;
     /** Whether to show clear button when a value is selected. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brickclay-org/ui",
-  "version": "0.1.49",
+  "version": "0.1.51",
   "schematics": "./schematics/collection.json",
   "ng-add": {
     "save": "dependencies"

package/src/lib/column-select/components/column-select/column-select.css

@@ -16,7 +16,7 @@
 
 @media (min-height: 701px) and (max-height: 900px) {
   .column-select-options-list {
-    max-height: 165px;
+    max-height: 166px;
   }
 }
 

package/src/lib/hierarchical-select/hierarchical-select.css

@@ -82,6 +82,10 @@
   @apply w-full outline-none font-normal text-sm text-[#141414] placeholder-[#A1A3AE] bg-transparent;
 }
 
+.hierarchical-search-input:-moz-focusring {
+  outline: none;
+}
+
 .hierarchical-back {
   @apply w-full text-left px-2.5 py-2 text-sm text-[#141414] bg-[#F8F8F8] rounded-md transition-colors mt-1 flex items-center gap-1.5;
 }

package/src/lib/input-chips/input-chips.css

@@ -127,6 +127,10 @@
   @apply text-[#A1A3AE] cursor-not-allowed;
 }
 
+.input-badge-input:-moz-focusring {
+  outline: none;
+}
+
 /* Footer */
 .input-badge-footer {
   @apply flex justify-between items-start font-normal text-sm;

package/src/lib/select/select.css

@@ -129,19 +129,19 @@
 
 @media (max-height: 700px) {
   .bk-options-list {
-    max-height: 125px;
+    max-height: 125px ;
   }
 }
 
 @media (min-height: 701px) and (max-height: 900px) {
   .bk-options-list {
-    max-height: 165px;
+    max-height: 166px ;
   }
 }
 
 @media (min-height: 901px) {
   .bk-options-list {
-    max-height: 210px;
+    max-height: 210px ;
   }
 }
 
@@ -251,3 +251,13 @@
 .bk-search-input:focus-visible {
   outline: 2px solid transparent;
 }
+
+/* Option icon (in dropdown rows and selected value) */
+.bk-option-icon {
+  @apply w-4 h-4 object-contain rounded-sm;
+}
+
+/* Badge icon (in multi-select chips) */
+.bk-chip-icon {
+  @apply w-3 h-3 object-contain rounded-sm;
+}