@limetech/lime-crm-building-blocks 1.100.1 → 1.101.0

package/dist/collection/components/lime-query-builder/order-by/order-by-item.css

@@ -0,0 +1,45 @@
+:host(limebb-lime-query-order-by-item) {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  width: 100%;
+}
+
+.order-by-controls {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 0.5rem;
+  width: 100%;
+}
+
+.property-path {
+  flex-grow: 1;
+  min-width: min(20rem, 100%);
+}
+
+.control-buttons {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: row;
+  gap: 0.25rem;
+  align-items: center;
+  padding-top: 0.5rem;
+}
+.control-buttons limel-icon-button {
+  opacity: 0.6;
+  transition: opacity 0.2s ease;
+}
+.control-buttons limel-icon-button:hover {
+  opacity: 1;
+}
+
+@media (max-width: 768px) {
+  .order-by-controls {
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+  .control-buttons {
+    padding-top: 0;
+  }
+}

package/dist/collection/components/lime-query-builder/order-by/order-by-item.js

@@ -0,0 +1,173 @@
+import { h } from "@stencil/core";
+/**
+ * Order By Item Component
+ *
+ * Represents a single order by specification with property selection and direction toggle
+ * Part of the order by editor
+ * @private
+ */
+export class OrderByItemComponent {
+    constructor() {
+        this.handlePathChange = (event) => {
+            event.stopPropagation();
+            const newPath = event.detail;
+            if (!newPath) {
+                // If path is cleared, keep the current item but with empty path
+                const currentDirection = this.item[Object.keys(this.item)[0]] || 'ASC';
+                this.itemChange.emit({ '': currentDirection });
+                return;
+            }
+            // Get current direction
+            const currentPath = Object.keys(this.item)[0];
+            const currentDirection = this.item[currentPath] || 'ASC';
+            // Create new item with new path but same direction
+            const newItem = { [newPath]: currentDirection };
+            this.itemChange.emit(newItem);
+        };
+        this.handleToggleDirection = () => {
+            const propertyPath = Object.keys(this.item)[0] || '';
+            const currentDirection = this.item[propertyPath] || 'ASC';
+            const newDirection = currentDirection === 'ASC' ? 'DESC' : 'ASC';
+            const newItem = { [propertyPath]: newDirection };
+            this.itemChange.emit(newItem);
+        };
+        this.handleRemove = () => {
+            this.itemChange.emit(null);
+        };
+    }
+    render() {
+        const propertyPath = Object.keys(this.item)[0] || '';
+        const direction = this.item[propertyPath] || 'ASC';
+        return (h("div", { key: 'e0faeb5b370d8aba00a668f0861e8e1cb4eec495', class: "order-by-controls" }, h("div", { key: 'd013e829ca193b6ce9cc3756c3700584984f4478', class: "property-path" }, h("limebb-property-selector", { key: '11dee28e5de28d0dc6934abdfe613e87a8b8fbed', platform: this.platform, context: this.context, limetype: this.limetype, label: "Property", value: propertyPath, required: true, onChange: this.handlePathChange })), h("div", { key: '66aa416b1f9683a15357d609e3685379d8993733', class: "control-buttons" }, h("limel-icon-button", { key: '360f271ecd3cf42581ae21617d297c84ee93569e', icon: direction === 'ASC'
+                ? 'sort_ascending'
+                : 'sort_descending', label: direction === 'ASC' ? 'Ascending' : 'Descending', onClick: this.handleToggleDirection }), h("limel-icon-button", { key: '3cbb13bff679a0ca95bb30b7853551b8bc276520', icon: "trash", label: "Remove", onClick: this.handleRemove }))));
+    }
+    static get is() { return "limebb-lime-query-order-by-item"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["order-by-item.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["order-by-item.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "platform": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LimeWebComponentPlatform",
+                    "resolved": "LimeWebComponentPlatform",
+                    "references": {
+                        "LimeWebComponentPlatform": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::LimeWebComponentPlatform"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Platform service provider"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "context": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "LimeWebComponentContext",
+                    "resolved": "LimeWebComponentContext",
+                    "references": {
+                        "LimeWebComponentContext": {
+                            "location": "import",
+                            "path": "@limetech/lime-web-components",
+                            "id": "node_modules::LimeWebComponentContext"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Component context"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "limetype": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The limetype to select properties from"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "limetype",
+                "reflect": false
+            },
+            "item": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "OrderByItem",
+                    "resolved": "{ [propertyPath: string]: \"ASC\" | \"DESC\"; }",
+                    "references": {
+                        "OrderByItem": {
+                            "location": "import",
+                            "path": "../lime-query.types",
+                            "id": "src/components/lime-query-builder/lime-query.types.ts::OrderByItem"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The order by item (e.g., { \"company.name\": \"ASC\" })"
+                },
+                "getter": false,
+                "setter": false
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "itemChange",
+                "name": "itemChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the item changes or should be removed"
+                },
+                "complexType": {
+                    "original": "OrderByItem | null",
+                    "resolved": "null | { [propertyPath: string]: \"ASC\" | \"DESC\"; }",
+                    "references": {
+                        "OrderByItem": {
+                            "location": "import",
+                            "path": "../lime-query.types",
+                            "id": "src/components/lime-query-builder/lime-query.types.ts::OrderByItem"
+                        }
+                    }
+                }
+            }];
+    }
+}

package/dist/collection/components/limeobject/file-viewer/live-docs-info.js

@@ -5,8 +5,8 @@ import { h } from "@stencil/core";
 export class LiveDocsInfo {
     render() {
         return [
-            h("div", { key: 'f215884110f6647cf6c0b501d6bec3d0475c7eb5', class: "header" }, h("limel-icon", { key: '483ac1d1166621d9ec91d430b58fe37d720ef740', name: "not_showing_video_frames" }), h("h2", { key: 'c9d8894b11a48ebecb3cac470df3b292e41f7c8e' }, "Viewing this file type requires ", h("em", { key: 'cc8b9bf7005a24ec608e7e14d86fe5047c543251' }, "Live Docs"))),
-            h("p", { key: '091075e3ffebbd89142b0466474977e05a6f8086' }, h("em", { key: 'b7393f26c3a1e5737b920389a8dab5ca5d5f591c' }, "Live Docs"), " not only enables you to view many file formats such as Microsoft Office documents, but it also empowers you to edit them right in the CRM. No need to download anything on your device!", h("a", { key: '67f751f807d209c7bf5c752bda39f4e4911b332b', target: "_blank", href: "https://www.lime-technologies.com/en/lime-crm/live-docs/" }, "Learn more")),
+            h("div", { key: '7e6645d68a1fe53d0acc1b3dee259fe184515cee', class: "header" }, h("limel-icon", { key: 'b08f3f80ea09bf9dfb30fec69db91b58f52748bc', name: "not_showing_video_frames" }), h("h2", { key: '984c39002d8dc456df904ed631472ab5c7e434f7' }, "Viewing this file type requires ", h("em", { key: 'cc3aa66537ef0ca8bb201595fba8b63f0d287730' }, "Live Docs"))),
+            h("p", { key: '38669b0342f36b1faee7599c0fd28fcebf993351' }, h("em", { key: '7e605cc3e057a8daffe575104272e9aa2634673a' }, "Live Docs"), " not only enables you to view many file formats such as Microsoft Office documents, but it also empowers you to edit them right in the CRM. No need to download anything on your device!", h("a", { key: 'ada35e1e88af734d219f03b7d68417c95ea837a5', target: "_blank", href: "https://www.lime-technologies.com/en/lime-crm/live-docs/" }, "Learn more")),
         ];
     }
     static get is() { return "limebb-live-docs-info"; }

package/dist/collection/components/locale-picker/locale-picker.js

@@ -53,7 +53,7 @@ export class LocalePicker {
             const value = this.value;
             selectedOptions = options.find((option) => option.value === value);
         }
-        return (h("limel-select", { key: 'd8592dd9e39e3dba64e2ee11cd223a66138ef57d', value: selectedOptions, options: sortBy(options, 'text'), helperText: this.helperText, label: this.label, required: this.required, disabled: this.disabled, readonly: this.readonly, onChange: this.handleChange, multiple: this.multipleChoice }));
+        return (h("limel-select", { key: 'f0be5c869ed7ad1a32e2c0604584f26cc5a40522', value: selectedOptions, options: sortBy(options, 'text'), helperText: this.helperText, label: this.label, required: this.required, disabled: this.disabled, readonly: this.readonly, onChange: this.handleChange, multiple: this.multipleChoice }));
     }
     static get is() { return "limebb-locale-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/notification-list/notification-item/notification-item.js

@@ -56,7 +56,7 @@ export class NotificationListItem {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: 'bcbac9d93025efeaf1d6f6cde3ab7632b527b5a0', id: this.item.id, class: {
+        return (h(Host, { key: '17b7219101660b7f6bab37072d5de5d9f212863f', id: this.item.id, class: {
                 'is-clickable': this.isItemClickable(),
                 'is-read': !!((_a = this.item) === null || _a === void 0 ? void 0 : _a.read),
                 'is-selected': !!((_b = this.item) === null || _b === void 0 ? void 0 : _b.selected),

package/dist/collection/components/percentage-visualizer/percentage-visualizer.js

@@ -91,11 +91,11 @@ export class PercentageVisualizer {
     render() {
         const normalizedValue = this.getNormalizedValue();
         const zeroPoint = this.getZeroPointPosition();
-        return (h(Host, { key: '85bcdba3b1ba660f32eebcdc0e46dd8652ae9b48', class: this.getContainerClassList(), style: {
+        return (h(Host, { key: '728bef6c27bd5879d971411f812db124c3ac53b3', class: this.getContainerClassList(), style: {
                 '--limebb-percentage-visualizer-zero-point-position': `${zeroPoint}%`,
                 '--limebb-percentage-visualizer-width': `${Math.abs(normalizedValue)}%`,
                 '--limebb-percentage-visualizer-rotate': `${normalizedValue >= 0 ? '0deg' : '180deg'}`,
-            } }, h("limel-notched-outline", { key: 'ef664323cf5a8a6a091394e8dffa291959c9e3f3', tabIndex: 0, role: "meter", "aria-valuemin": this.rangeMin, "aria-valuemax": this.rangeMax, "aria-valuenow": this.numValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperTextId, label: this.label, labelId: this.labelId, invalid: this.invalid, required: this.required, hasValue: true, hasFloatingLabel: true, "aria-controls": this.helperTextId }, h("div", { key: '20b55181865c993677fec5fc86a66ea9cd817cd0', slot: "content" }, this.renderVisualization())), this.renderHelperLine()));
+            } }, h("limel-notched-outline", { key: '0cf575a7e896955572000dd906d98441dec808b1', tabIndex: 0, role: "meter", "aria-valuemin": this.rangeMin, "aria-valuemax": this.rangeMax, "aria-valuenow": this.numValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperTextId, label: this.label, labelId: this.labelId, invalid: this.invalid, required: this.required, hasValue: true, hasFloatingLabel: true, "aria-controls": this.helperTextId }, h("div", { key: '6dc2beefea4d1a5b0a967fd1087db3fe88c8cdf5', slot: "content" }, this.renderVisualization())), this.renderHelperLine()));
     }
     renderVisualization() {
         if (this.reducePresence && (this.numValue === 0 || !this.hasValue())) {

package/dist/collection/components/summary-popover/summary-popover.js

@@ -118,14 +118,14 @@ export class SummaryPopover {
             top: '0.125rem',
             right: '0.125rem',
         };
-        return (h("limel-popover", { key: '2fb3afb6c2a05cfbd4e1991b3204c5b495c20c03', style: {
+        return (h("limel-popover", { key: '3ddac967d05644e0e3b18979a051561e08f316c4', style: {
                 '--limebb-summary-popover-timeout': `${this.triggerDelay}ms`,
-            }, open: this.isPopoverOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("div", { key: 'fbd08fbebaed580db3aaaf3b1bbba4e52605bced', slot: "trigger", tabIndex: 0, onMouseEnter: this.openPopoverWithDelay, onMouseLeave: this.resetTimeout, onFocus: this.openPopoverWithDelay }, h("slot", { key: 'd16285c72329080ecde42bc6f7c3966f27a66968', name: "trigger" }), h("div", { key: '77c127616635768db8012adf936c56f75d2bccb3', class: "opening-countdown-indicator" })), h("limel-card", { key: '2d3c9a55b1292945422af4783b29d37ea9570fde', style: {
+            }, open: this.isPopoverOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("div", { key: '6187ae07695296c905f2d0bf782b515d15183f05', slot: "trigger", tabIndex: 0, onMouseEnter: this.openPopoverWithDelay, onMouseLeave: this.resetTimeout, onFocus: this.openPopoverWithDelay }, h("slot", { key: '2b338b6ba353104031e0ae9bb1f1380a2f528f1c', name: "trigger" }), h("div", { key: 'ccce297cd4c8a6640a81a0ec54d1b17cafd090a4', class: "opening-countdown-indicator" })), h("limel-card", { key: 'c786b96ad260240ad28b45746f7f3974efe92670', style: {
                 'max-width': this.popoverMaxWidth,
                 'max-height': this.popoverMaxHeight,
                 'min-width': '7rem',
                 'min-height': '3rem',
-            }, orientation: "landscape", heading: this.heading, subheading: this.subheading, icon: this.icon, value: this.value, image: this.image, actions: this.actions, onActionSelected: this.handleSelected }, h("limebb-navigation-button", { key: '234309cf2f82f6493a5d72944d320a902618c83b', slot: "component", type: "close", style: closeButtonStyle, tooltipLabel: "Close", tooltipHelperLabel: "Esc", onClick: this.handleCloseClick }))));
+            }, orientation: "landscape", heading: this.heading, subheading: this.subheading, icon: this.icon, value: this.value, image: this.image, actions: this.actions, onActionSelected: this.handleSelected }, h("limebb-navigation-button", { key: 'de2b607312164f264c0a344662a69754e1afb7d9', slot: "component", type: "close", style: closeButtonStyle, tooltipLabel: "Close", tooltipHelperLabel: "Esc", onClick: this.handleCloseClick }))));
     }
     static get is() { return "limebb-summary-popover"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/text-editor/mention-group-counter.js

@@ -13,8 +13,8 @@ export class MentionGroupCounter {
     render() {
         const label = this.getLabel();
         return [
-            h("span", { key: '32727487e0750dad1e08b94915af9b33e562ba9d', id: this.tooltipId }, label),
-            h("limel-tooltip", { key: 'a9c062dca4f2f46fb187c902de8ecab4993e456d', elementId: this.tooltipId, label: label, helperLabel: this.helperLabel }),
+            h("span", { key: 'bb868b62f71fe65927d1cd9bad6ee08648a33c73', id: this.tooltipId }, label),
+            h("limel-tooltip", { key: '5018e97cb9d5522b91ed1c55643ad33c3d7fd51d', elementId: this.tooltipId, label: label, helperLabel: this.helperLabel }),
         ];
     }
     getLabel() {

package/dist/collection/components/text-editor/text-editor.js

@@ -389,7 +389,7 @@ export class LimeBBTextEditor {
     }
     render() {
         return [
-            h("limel-text-editor", { key: '42b8630e5e15e4e7ca20277687695a245f2ea267', ref: (el) => (this.textEditor = el), tabindex: this.disabled ? -1 : 0, value: this.value, contentType: this.contentType, customElements: this.registeredCustomElements, "aria-disabled": this.disabled, language: this.language, triggers: this.registeredTriggers, onTriggerStart: this.handleTriggerStart, onTriggerStop: this.handleTriggerStop, onTriggerChange: this.handleTriggerChange, onImagePasted: this.handleImagePasted, onMetadataChange: this.handleMetadataChange, ui: this.ui, allowResize: this.allowResize, required: this.required, disabled: this.disabled, readonly: this.readonly, helperText: this.helperText, placeholder: this.placeholder, label: this.label, invalid: this.invalid }),
+            h("limel-text-editor", { key: '3ad4c2bac61f34439bf94b42e0aa7ccceeff9c33', ref: (el) => (this.textEditor = el), tabindex: this.disabled ? -1 : 0, value: this.value, contentType: this.contentType, customElements: this.registeredCustomElements, "aria-disabled": this.disabled, language: this.language, triggers: this.registeredTriggers, onTriggerStart: this.handleTriggerStart, onTriggerStop: this.handleTriggerStop, onTriggerChange: this.handleTriggerChange, onImagePasted: this.handleImagePasted, onMetadataChange: this.handleMetadataChange, ui: this.ui, allowResize: this.allowResize, required: this.required, disabled: this.disabled, readonly: this.readonly, helperText: this.helperText, placeholder: this.placeholder, label: this.label, invalid: this.invalid }),
             this.renderPicker(),
         ];
     }

package/dist/collection/components/trend-indicator/trend-indicator.js

@@ -52,7 +52,7 @@ export class TrendIndicator {
         this.numValue = this.parseValue(this.value);
     }
     render() {
-        return (h(Host, { key: '33119aa80ea39fbe4ad0fd7da3c89d844efd7bd6', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '9357919d89ea26063f9c0bbf85a48e3e235364c7', id: this.tooltipId, label: this.label, labelId: this.labelId, invalid: this.invalid, required: this.required, hasValue: true, hasFloatingLabel: true, "aria-labelledby": this.labelId, "aria-describedby": this.helperTextId, "aria-controls": this.helperTextId }, h("div", { key: 'b29c00421943e45fed684e63dfebf895686f6d45', slot: "content", tabIndex: 0 }, this.renderVisualization())), this.renderHelperLine(), this.renderTooltip()));
+        return (h(Host, { key: '976bce0393bfff47ba599dc0d534ec9992cec3f8', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '86a89b3773d2fbf3aa9009fd27ce9cb2410f03b5', id: this.tooltipId, label: this.label, labelId: this.labelId, invalid: this.invalid, required: this.required, hasValue: true, hasFloatingLabel: true, "aria-labelledby": this.labelId, "aria-describedby": this.helperTextId, "aria-controls": this.helperTextId }, h("div", { key: '0b9e048eeea62c452671b74db468aa5587e8ddbf', slot: "content", tabIndex: 0 }, this.renderVisualization())), this.renderHelperLine(), this.renderTooltip()));
     }
     renderVisualization() {
         if (this.reducePresence && (this.numValue === 0 || !this.hasValue())) {

package/dist/components/lime-query-value-input.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { T as Te, Z as Zt } from './index.esm.js';
-import { a as getPropertyFromPath, d as defineCustomElement$1 } from './property-selector.js';
+import { g as getPropertyFromPath, d as defineCustomElement$1 } from './property-selector.js';
 
 const limeQueryValueInputCss = ":host{display:block}.value-input-container{display:flex;flex-direction:row;align-items:flex-start;gap:0.5rem;width:100%}.mode-toggle{flex-shrink:0;margin-top:0.5rem;opacity:0.7;transition:opacity 0.2s ease}.mode-toggle:hover{opacity:1}.placeholder-input{flex-grow:1;display:flex;flex-direction:column;gap:0.5rem}.placeholder-preview{display:flex;align-items:center;gap:0.5rem;padding:0.5rem;background-color:rgba(var(--color-blue-light), 0.1);border-radius:var(--border-radius-small);font-size:0.875rem;color:rgb(var(--color-blue-default));border-left:3px solid rgb(var(--color-blue-default))}.placeholder-preview limel-icon{flex-shrink:0;color:rgb(var(--color-blue-default))}.placeholder-preview span{font-family:var(--font-monospace);word-break:break-all}";
 const LimebbLimeQueryValueInputStyle0 = limeQueryValueInputCss;

package/dist/components/limebb-lime-query-builder.js

@@ -1,9 +1,11 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { Z as Zt, T as Te } from './index.esm.js';
-import { g as getNormalizedProperties, a as getPropertyFromPath, d as defineCustomElement$4 } from './property-selector.js';
-import { d as defineCustomElement$b } from './lime-query-filter-builder.js';
-import { d as defineCustomElement$a } from './lime-query-filter-comparison.js';
-import { d as defineCustomElement$7, a as defineCustomElement$8, b as defineCustomElement$9 } from './lime-query-filter-expression.js';
+import { g as getPropertyFromPath, a as getNormalizedProperties, d as defineCustomElement$4 } from './property-selector.js';
+import { d as defineCustomElement$d } from './lime-query-filter-builder.js';
+import { d as defineCustomElement$c } from './lime-query-filter-comparison.js';
+import { d as defineCustomElement$9, a as defineCustomElement$a, b as defineCustomElement$b } from './lime-query-filter-expression.js';
+import { d as defineCustomElement$8 } from './order-by-editor.js';
+import { d as defineCustomElement$7 } from './order-by-item.js';
 import { d as defineCustomElement$6 } from './lime-query-value-input.js';
 import { d as defineCustomElement$5 } from './limetype-field.js';
 import { d as defineCustomElement$3 } from './response-format-editor.js';
@@ -336,6 +338,113 @@ function validateLimeQueryFilterInternal(filter, activeLimetype, limetypes, guiM
     }
     return errors;
 }
+/**
+ * Validate orderBy specification
+ * @param orderBy Array of orderBy items to validate
+ * @param limetypes Record of all available limetypes
+ * @param limetype The limetype for this Lime Query
+ * @returns Array of validation error messages
+ */
+function validateOrderBy(orderBy, limetypes, limetype) {
+    const errors = [];
+    if (!Array.isArray(orderBy)) {
+        errors.push('orderBy must be an array');
+        return errors;
+    }
+    if (!limetype || !limetypes[limetype]) {
+        // Can't validate property paths without limetype
+        return errors;
+    }
+    for (const [index, item] of orderBy.entries()) {
+        const itemErrors = validateOrderByItem(item, index, limetypes, limetype);
+        errors.push(...itemErrors);
+    }
+    return errors;
+}
+/**
+ * Validate a single orderBy item
+ * @param item The orderBy item to validate
+ * @param index The index of the item in the array (for error messages)
+ * @param limetypes Record of all available limetypes
+ * @param limetype The limetype for this Lime Query
+ * @returns Array of validation error messages for this item
+ */
+function validateOrderByItem(item, index, limetypes, limetype) {
+    const errors = [];
+    const objectError = validateOrderByItemIsObject(item, index);
+    if (objectError) {
+        return [objectError];
+    }
+    const keys = Object.keys(item);
+    const keyError = validateOrderByItemHasSingleKey(keys, index);
+    if (keyError) {
+        return [keyError];
+    }
+    const propertyPath = keys[0];
+    const direction = item[propertyPath];
+    const directionError = validateOrderByDirection(direction, index);
+    if (directionError) {
+        errors.push(directionError);
+    }
+    const pathError = validateOrderByPropertyPath(propertyPath, limetypes, limetype, index);
+    if (pathError) {
+        errors.push(pathError);
+    }
+    return errors;
+}
+/**
+ * Validate that the orderBy item is an object
+ * @param item
+ * @param index
+ */
+function validateOrderByItemIsObject(item, index) {
+    if (typeof item !== 'object' || item === null) {
+        return `orderBy[${index}] must be an object`;
+    }
+    return null;
+}
+/**
+ * Validate that the orderBy item has exactly one property key
+ * @param keys
+ * @param index
+ */
+function validateOrderByItemHasSingleKey(keys, index) {
+    if (keys.length === 0) {
+        return `orderBy[${index}] must have a property path`;
+    }
+    if (keys.length > 1) {
+        return `orderBy[${index}] must have exactly one property, got ${keys.length}`;
+    }
+    return null;
+}
+/**
+ * Validate that the sort direction is either ASC or DESC
+ * @param direction
+ * @param index
+ */
+function validateOrderByDirection(direction, index) {
+    if (direction !== 'ASC' && direction !== 'DESC') {
+        return `orderBy[${index}]: direction must be 'ASC' or 'DESC', got '${direction}'`;
+    }
+    return null;
+}
+/**
+ * Validate that the property path exists on the limetype
+ * @param propertyPath
+ * @param limetypes
+ * @param limetype
+ * @param index
+ */
+function validateOrderByPropertyPath(propertyPath, limetypes, limetype, index) {
+    if (!propertyPath || propertyPath === '') {
+        return null;
+    }
+    const property = getPropertyFromPath(limetypes, limetype, propertyPath);
+    if (!property) {
+        return `orderBy[${index}]: property path '${propertyPath}' does not exist on limetype '${limetype}'`;
+    }
+    return null;
+}
 /**
  * Validate Lime Query response format and collect errors/limitations
  * @param responseFormat The response format to validate
@@ -385,14 +494,14 @@ function isLimeQuerySupported(limeQuery, limetypes, activeLimetype, guiModeEnabl
     if (limeQuery.offset !== undefined && !limeQuery.orderBy) {
         validationErrors.push('offset requires orderBy to be specified');
     }
+    // Validate orderBy
+    if (limeQuery.orderBy) {
+        const orderByErrors = validateOrderBy(limeQuery.orderBy, limetypes, limeQuery.limetype);
+        validationErrors.push(...orderByErrors);
+    }
     // Check for GUI-unsupported top-level properties
-    if (guiModeEnabled) {
-        if (limeQuery.orderBy) {
-            guiLimitations.push('orderBy is not yet supported in GUI mode');
-        }
-        if (limeQuery.offset !== undefined) {
-            guiLimitations.push('offset is not yet supported in GUI mode');
-        }
+    if (guiModeEnabled && limeQuery.offset !== undefined) {
+        guiLimitations.push('offset is not yet supported in GUI mode');
     }
     // Validate filter
     if (limeQuery.filter) {
@@ -413,7 +522,7 @@ function isLimeQuerySupported(limeQuery, limetypes, activeLimetype, guiModeEnabl
     };
 }
 
-const limeQueryBuilderCss = ":host(limebb-lime-lime-query-builder){display:block;width:100%}.lime-query-builder{display:flex;flex-direction:column;gap:2rem}.mode-controls{display:flex;align-items:center;gap:0.5rem;padding:0.5rem}.mode-switch{display:flex;align-items:center;gap:0.5rem}.mode-switch limel-button{min-width:5rem}.mode-switch limel-helper-text{margin-left:1rem;color:rgb(var(--color-red-default))}.gui-mode,.code-mode{display:block}.code-editor-container{--code-editor-max-height:70vh;display:flex;flex-direction:column;gap:1rem}.code-editor-container .validation-errors{padding:0.75rem 1rem;color:rgb(var(--color-red-default));background-color:rgb(var(--color-red-lighter));border-left:0.25rem solid rgb(var(--color-red-default));border-radius:0.25rem;font-size:0.875rem}.code-editor-container .validation-errors strong{display:block;margin-bottom:0.5rem;font-weight:600}.code-editor-container .validation-errors ul{margin:0;padding-left:1.5rem}.code-editor-container .validation-errors li{margin:0.25rem 0}.code-editor-container .gui-limitations{padding:0.75rem 1rem;color:rgb(var(--color-blue-dark));background-color:rgb(var(--color-blue-lighter));border-left:0.25rem solid rgb(var(--color-blue-default));border-radius:0.25rem;font-size:0.875rem}.code-editor-container .gui-limitations strong{display:block;margin-bottom:0.5rem;font-weight:600}.code-editor-container .gui-limitations ul{margin:0;padding-left:1.5rem}.code-editor-container .gui-limitations li{margin:0.25rem 0}.lime-query-builder-label{margin:0;font-size:1.5rem;font-weight:600;color:rgb(var(--contrast-1100))}.limetype-section{display:flex;flex-direction:column}.filter-section,.query-options-section{display:flex;flex-direction:column;gap:1rem}.section-label{margin:0;font-size:1.125rem;font-weight:600;color:rgb(var(--contrast-1000))}.query-options-controls{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:1rem}@media (max-width: 768px){.lime-query-builder{gap:1.5rem}.query-options-controls{grid-template-columns:1fr}}";
+const limeQueryBuilderCss = ":host(limebb-lime-lime-query-builder){display:block;width:100%}.lime-query-builder{display:flex;flex-direction:column;gap:2rem}.mode-controls{display:flex;align-items:center;gap:0.5rem;padding:0.5rem}.mode-switch{display:flex;align-items:center;gap:0.5rem}.mode-switch limel-button{min-width:5rem}.mode-switch limel-helper-text{margin-left:1rem;color:rgb(var(--color-red-default))}.gui-mode,.code-mode{display:block}.code-editor-container{--code-editor-max-height:70vh;display:flex;flex-direction:column;gap:1rem}.code-editor-container .validation-errors{padding:0.75rem 1rem;color:rgb(var(--color-red-default));background-color:rgb(var(--color-red-lighter));border-left:0.25rem solid rgb(var(--color-red-default));border-radius:0.25rem;font-size:0.875rem}.code-editor-container .validation-errors strong{display:block;margin-bottom:0.5rem;font-weight:600}.code-editor-container .validation-errors ul{margin:0;padding-left:1.5rem}.code-editor-container .validation-errors li{margin:0.25rem 0}.code-editor-container .gui-limitations{padding:0.75rem 1rem;color:rgb(var(--color-blue-dark));background-color:rgb(var(--color-blue-lighter));border-left:0.25rem solid rgb(var(--color-blue-default));border-radius:0.25rem;font-size:0.875rem}.code-editor-container .gui-limitations strong{display:block;margin-bottom:0.5rem;font-weight:600}.code-editor-container .gui-limitations ul{margin:0;padding-left:1.5rem}.code-editor-container .gui-limitations li{margin:0.25rem 0}.lime-query-builder-label{margin:0;font-size:1.5rem;font-weight:600;color:rgb(var(--contrast-1100))}.limetype-section{display:flex;flex-direction:column}.filter-section,.query-options-section{display:flex;flex-direction:column;gap:1rem}.section-label{margin:0;font-size:1.125rem;font-weight:600;color:rgb(var(--contrast-1000))}.query-options-controls{display:flex;flex-direction:column;gap:1rem}@media (max-width: 768px){.lime-query-builder{gap:1.5rem}}";
 const LimebbLimeQueryBuilderStyle0 = limeQueryBuilderCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -465,6 +574,11 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
             this.limit = value ? Number.parseInt(value, 10) : undefined;
             this.emitChange();
         };
+        this.handleOrderByChange = (event) => {
+            event.stopPropagation();
+            this.orderBy = event.detail;
+            this.emitChange();
+        };
         this.switchToGui = () => {
             // Validate JSON before switching
             try {
@@ -480,6 +594,7 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
                 this.filter = parsed.filter;
                 this.internalResponseFormat = parsed.responseFormat;
                 this.limit = parsed.limit;
+                this.orderBy = parsed.orderBy;
                 this.mode = 'gui';
                 this.change.emit(parsed);
             }
@@ -521,6 +636,7 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
             this.filter = this.value.filter;
             this.internalResponseFormat = this.value.responseFormat;
             this.limit = this.value.limit;
+            this.orderBy = this.value.orderBy;
         }
         // Initialize code value from prop
         this.updateCodeValue();
@@ -533,7 +649,7 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
     render() {
         const guiSupported = this.checkGuiSupport();
         const showCodeMode = !this.guiModeEnabled || this.mode === 'code';
-        return (h("div", { key: '0b4d2bb5b4d503a775d8d3215e1e4c74fdb1eceb', class: "lime-query-builder" }, this.renderLabel(), this.renderModeControls(guiSupported), showCodeMode
+        return (h("div", { key: 'f51ae0459c1c7f482f3a790abb4cc3bd60b83e70', class: "lime-query-builder" }, this.renderLabel(), this.renderModeControls(guiSupported), showCodeMode
             ? this.renderCodeMode(guiSupported)
             : this.renderGuiMode()));
     }
@@ -545,27 +661,16 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
         if (!this.limetype) {
             return;
         }
-        // Use internal state, then default to returning just _id
-        const responseFormat = this.internalResponseFormat || {
-            object: {
-                _id: null,
-            },
-        };
-        const limeQuery = {
-            limetype: this.limetype,
-            responseFormat: responseFormat,
-            filter: this.filter,
-        };
-        if (this.limit !== undefined && this.limit > 0) {
-            limeQuery.limit = this.limit;
-        }
-        this.change.emit(limeQuery);
+        this.change.emit(this.buildLimeQuery());
     }
     updateCodeValue() {
         if (!this.limetype) {
             this.codeValue = JSON.stringify(this.value || {}, null, 2);
             return;
         }
+        this.codeValue = JSON.stringify(this.buildLimeQuery(), null, 2);
+    }
+    buildLimeQuery() {
         // Use internal state, then default to returning just _id
         const responseFormat = this.internalResponseFormat || {
             object: {
@@ -580,7 +685,10 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
         if (this.limit !== undefined && this.limit > 0) {
             limeQuery.limit = this.limit;
         }
-        this.codeValue = JSON.stringify(limeQuery, null, 2);
+        if (this.orderBy && this.orderBy.length > 0) {
+            limeQuery.orderBy = this.orderBy;
+        }
+        return limeQuery;
     }
     checkGuiSupport() {
         if (!this.limetypes) {
@@ -665,7 +773,7 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
         if (!this.limetype) {
             return;
         }
-        return (h("div", { class: "query-options-section" }, h("h4", { class: "section-label" }, "Query Options"), h("div", { class: "query-options-controls" }, h("limel-input-field", { label: "Limit", type: "number", value: ((_a = this.limit) === null || _a === void 0 ? void 0 : _a.toString()) || '', placeholder: "No limit", helperText: "Maximum number of results", onChange: this.handleLimitChange }))));
+        return (h("div", { class: "query-options-section" }, h("h4", { class: "section-label" }, "Query Options"), h("div", { class: "query-options-controls" }, h("limel-input-field", { label: "Limit", type: "number", value: ((_a = this.limit) === null || _a === void 0 ? void 0 : _a.toString()) || '', placeholder: "No limit", helperText: "Maximum number of results", onChange: this.handleLimitChange }), h("limebb-lime-query-order-by-editor", { platform: this.platform, context: this.context, limetype: this.limetype, value: this.orderBy, onChange: this.handleOrderByChange }))));
     }
     renderGuiMode() {
         return (h("div", { class: "gui-mode" }, this.renderLimetypeSection(), this.renderResponseFormatSection(), this.renderFilterSection(), this.renderQueryOptionsSection()));
@@ -698,7 +806,8 @@ const LimeQueryBuilder = /*@__PURE__*/ proxyCustomElement(class LimeQueryBuilder
         "limetype": [32],
         "filter": [32],
         "internalResponseFormat": [32],
-        "limit": [32]
+        "limit": [32],
+        "orderBy": [32]
     }]);
 __decorate([
     Te()
@@ -707,7 +816,7 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["limebb-lime-query-builder", "limebb-lime-query-filter-builder", "limebb-lime-query-filter-comparison", "limebb-lime-query-filter-expression", "limebb-lime-query-filter-group", "limebb-lime-query-filter-not", "limebb-lime-query-value-input", "limebb-limetype-field", "limebb-property-selector", "limebb-response-format-editor", "limebb-response-format-item"];
+    const components = ["limebb-lime-query-builder", "limebb-lime-query-filter-builder", "limebb-lime-query-filter-comparison", "limebb-lime-query-filter-expression", "limebb-lime-query-filter-group", "limebb-lime-query-filter-not", "limebb-lime-query-order-by-editor", "limebb-lime-query-order-by-item", "limebb-lime-query-value-input", "limebb-limetype-field", "limebb-property-selector", "limebb-response-format-editor", "limebb-response-format-item"];
     components.forEach(tagName => { switch (tagName) {
         case "limebb-lime-query-builder":
             if (!customElements.get(tagName)) {
@@ -716,25 +825,35 @@ function defineCustomElement$1() {
             break;
         case "limebb-lime-query-filter-builder":
             if (!customElements.get(tagName)) {
-                defineCustomElement$b();
+                defineCustomElement$d();
             }
             break;
         case "limebb-lime-query-filter-comparison":
             if (!customElements.get(tagName)) {
-                defineCustomElement$a();
+                defineCustomElement$c();
             }
             break;
         case "limebb-lime-query-filter-expression":
             if (!customElements.get(tagName)) {
-                defineCustomElement$9();
+                defineCustomElement$b();
             }
             break;
         case "limebb-lime-query-filter-group":
             if (!customElements.get(tagName)) {
-                defineCustomElement$8();
+                defineCustomElement$a();
             }
             break;
         case "limebb-lime-query-filter-not":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "limebb-lime-query-order-by-editor":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "limebb-lime-query-order-by-item":
             if (!customElements.get(tagName)) {
                 defineCustomElement$7();
             }