@design.estate/dees-catalog 3.60.0 → 3.61.0

package/dist_watch/bundle.js

@@ -156422,7 +156422,25 @@ var demoFunc26 = /* @__PURE__ */ __name(() => b2`
         ></dees-input-list>
       </dees-panel>
 
-      <dees-panel .title=${"11. Empty State"} .subtitle=${"How the component looks with no items"}>
+      <dees-panel .title=${"11. Freeform + Candidates"} .subtitle=${"Allow adding items not in the candidate list (shown with a question mark)"}>
+        <dees-input-list
+          .label=${"Tags"}
+          .placeholder=${"Type a tag... (freeform allowed)"}
+          .allowFreeform=${true}
+          .candidates=${[
+  { viewKey: "bug", payload: { color: "red" } },
+  { viewKey: "feature", payload: { color: "blue" } },
+  { viewKey: "docs", payload: { color: "green" } },
+  { viewKey: "refactor", payload: { color: "purple" } },
+  { viewKey: "performance", payload: { color: "orange" } },
+  { viewKey: "security", payload: { color: "red" } }
+]}
+          .value=${["bug", "my-custom-tag", "feature"]}
+          .description=${"Known tags get a checkmark, custom tags get a question mark. Tab to complete, Enter to add freeform."}
+        ></dees-input-list>
+      </dees-panel>
+
+      <dees-panel .title=${"12. Empty State"} .subtitle=${"How the component looks with no items"}>
         <dees-input-list
           .label=${"Your Ideas"}
           .placeholder=${"Share your ideas..."}
@@ -156438,9 +156456,9 @@ var demoFunc26 = /* @__PURE__ */ __name(() => b2`
 init_dist_ts30();
 init_dees_icon();
 init_theme();
-var _itemHeight_dec, _targetIndex_dec, _dragCurrentY_dec, _dragStartY_dec, _dragOverIndex_dec, _draggedIndex_dec, _editingValue_dec, _editingIndex_dec, _currentCandidateIndex_dec, _ghostText_dec, _inputValue_dec3, _validationText_dec3, _candidates_dec, _confirmDelete_dec, _sortable_dec, _allowDuplicates_dec, _minItems_dec, _maxItems_dec, _placeholder_dec4, _value_dec12, _a36, _DeesInputList_decorators, _init33, _value12, _placeholder4, _maxItems, _minItems, _allowDuplicates, _sortable, _confirmDelete, _candidates, _validationText3, _inputValue3, _ghostText, _currentCandidateIndex, _editingIndex, _editingValue, _draggedIndex, _dragOverIndex, _dragStartY, _dragCurrentY, _targetIndex, _itemHeight;
+var _itemHeight_dec, _targetIndex_dec, _dragCurrentY_dec, _dragStartY_dec, _dragOverIndex_dec, _draggedIndex_dec, _editingValue_dec, _editingIndex_dec, _currentCandidateIndex_dec, _ghostText_dec, _inputValue_dec3, _validationText_dec3, _allowFreeform_dec, _candidates_dec, _confirmDelete_dec, _sortable_dec, _allowDuplicates_dec, _minItems_dec, _maxItems_dec, _placeholder_dec4, _value_dec12, _a36, _DeesInputList_decorators, _init33, _value12, _placeholder4, _maxItems, _minItems, _allowDuplicates, _sortable, _confirmDelete, _candidates, _allowFreeform, _validationText3, _inputValue3, _ghostText, _currentCandidateIndex, _editingIndex, _editingValue, _draggedIndex, _dragOverIndex, _dragStartY, _dragCurrentY, _targetIndex, _itemHeight;
 _DeesInputList_decorators = [customElement("dees-input-list")];
-var _DeesInputList = class _DeesInputList extends (_a36 = DeesInputBase, _value_dec12 = [n5({ type: Array })], _placeholder_dec4 = [n5({ type: String })], _maxItems_dec = [n5({ type: Number })], _minItems_dec = [n5({ type: Number })], _allowDuplicates_dec = [n5({ type: Boolean })], _sortable_dec = [n5({ type: Boolean })], _confirmDelete_dec = [n5({ type: Boolean })], _candidates_dec = [n5({ type: Array })], _validationText_dec3 = [n5({ type: String })], _inputValue_dec3 = [r5()], _ghostText_dec = [r5()], _currentCandidateIndex_dec = [r5()], _editingIndex_dec = [r5()], _editingValue_dec = [r5()], _draggedIndex_dec = [r5()], _dragOverIndex_dec = [r5()], _dragStartY_dec = [r5()], _dragCurrentY_dec = [r5()], _targetIndex_dec = [r5()], _itemHeight_dec = [r5()], _a36) {
+var _DeesInputList = class _DeesInputList extends (_a36 = DeesInputBase, _value_dec12 = [n5({ type: Array })], _placeholder_dec4 = [n5({ type: String })], _maxItems_dec = [n5({ type: Number })], _minItems_dec = [n5({ type: Number })], _allowDuplicates_dec = [n5({ type: Boolean })], _sortable_dec = [n5({ type: Boolean })], _confirmDelete_dec = [n5({ type: Boolean })], _candidates_dec = [n5({ type: Array })], _allowFreeform_dec = [n5({ type: Boolean })], _validationText_dec3 = [n5({ type: String })], _inputValue_dec3 = [r5()], _ghostText_dec = [r5()], _currentCandidateIndex_dec = [r5()], _editingIndex_dec = [r5()], _editingValue_dec = [r5()], _draggedIndex_dec = [r5()], _dragOverIndex_dec = [r5()], _dragStartY_dec = [r5()], _dragCurrentY_dec = [r5()], _targetIndex_dec = [r5()], _itemHeight_dec = [r5()], _a36) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _value12, __runInitializers(_init33, 8, this, [])), __runInitializers(_init33, 11, this);
@@ -156451,20 +156469,21 @@ var _DeesInputList = class _DeesInputList extends (_a36 = DeesInputBase, _value_
     __privateAdd(this, _sortable, __runInitializers(_init33, 28, this, false)), __runInitializers(_init33, 31, this);
     __privateAdd(this, _confirmDelete, __runInitializers(_init33, 32, this, false)), __runInitializers(_init33, 35, this);
     __privateAdd(this, _candidates, __runInitializers(_init33, 36, this, [])), __runInitializers(_init33, 39, this);
-    __privateAdd(this, _validationText3, __runInitializers(_init33, 40, this, "")), __runInitializers(_init33, 43, this);
+    __privateAdd(this, _allowFreeform, __runInitializers(_init33, 40, this, false)), __runInitializers(_init33, 43, this);
+    __privateAdd(this, _validationText3, __runInitializers(_init33, 44, this, "")), __runInitializers(_init33, 47, this);
     __publicField(this, "addedCandidatesMap", /* @__PURE__ */ new Map());
     __publicField(this, "matchingCandidates", []);
-    __privateAdd(this, _inputValue3, __runInitializers(_init33, 44, this, "")), __runInitializers(_init33, 47, this);
-    __privateAdd(this, _ghostText, __runInitializers(_init33, 48, this, "")), __runInitializers(_init33, 51, this);
-    __privateAdd(this, _currentCandidateIndex, __runInitializers(_init33, 52, this, -1)), __runInitializers(_init33, 55, this);
-    __privateAdd(this, _editingIndex, __runInitializers(_init33, 56, this, -1)), __runInitializers(_init33, 59, this);
-    __privateAdd(this, _editingValue, __runInitializers(_init33, 60, this, "")), __runInitializers(_init33, 63, this);
-    __privateAdd(this, _draggedIndex, __runInitializers(_init33, 64, this, -1)), __runInitializers(_init33, 67, this);
-    __privateAdd(this, _dragOverIndex, __runInitializers(_init33, 68, this, -1)), __runInitializers(_init33, 71, this);
-    __privateAdd(this, _dragStartY, __runInitializers(_init33, 72, this, 0)), __runInitializers(_init33, 75, this);
-    __privateAdd(this, _dragCurrentY, __runInitializers(_init33, 76, this, 0)), __runInitializers(_init33, 79, this);
-    __privateAdd(this, _targetIndex, __runInitializers(_init33, 80, this, -1)), __runInitializers(_init33, 83, this);
-    __privateAdd(this, _itemHeight, __runInitializers(_init33, 84, this, 0)), __runInitializers(_init33, 87, this);
+    __privateAdd(this, _inputValue3, __runInitializers(_init33, 48, this, "")), __runInitializers(_init33, 51, this);
+    __privateAdd(this, _ghostText, __runInitializers(_init33, 52, this, "")), __runInitializers(_init33, 55, this);
+    __privateAdd(this, _currentCandidateIndex, __runInitializers(_init33, 56, this, -1)), __runInitializers(_init33, 59, this);
+    __privateAdd(this, _editingIndex, __runInitializers(_init33, 60, this, -1)), __runInitializers(_init33, 63, this);
+    __privateAdd(this, _editingValue, __runInitializers(_init33, 64, this, "")), __runInitializers(_init33, 67, this);
+    __privateAdd(this, _draggedIndex, __runInitializers(_init33, 68, this, -1)), __runInitializers(_init33, 71, this);
+    __privateAdd(this, _dragOverIndex, __runInitializers(_init33, 72, this, -1)), __runInitializers(_init33, 75, this);
+    __privateAdd(this, _dragStartY, __runInitializers(_init33, 76, this, 0)), __runInitializers(_init33, 79, this);
+    __privateAdd(this, _dragCurrentY, __runInitializers(_init33, 80, this, 0)), __runInitializers(_init33, 83, this);
+    __privateAdd(this, _targetIndex, __runInitializers(_init33, 84, this, -1)), __runInitializers(_init33, 87, this);
+    __privateAdd(this, _itemHeight, __runInitializers(_init33, 88, this, 0)), __runInitializers(_init33, 91, this);
     // Bound event handlers for cleanup
     __publicField(this, "boundHandleGlobalDragOver", null);
     __publicField(this, "boundHandleGlobalDragEnd", null);
@@ -156493,6 +156512,14 @@ var _DeesInputList = class _DeesInputList extends (_a36 = DeesInputBase, _value_
                   </div>
                 ` : ""}
                 
+                ${this.candidates.length > 0 ? b2`
+                  ${this.candidates.some((c11) => c11.viewKey === item) ? b2`
+                    <dees-icon class="candidate-check" .icon=${"lucide:check"}></dees-icon>
+                  ` : b2`
+                    <dees-icon class="candidate-unknown" .icon=${"lucide:helpCircle"}></dees-icon>
+                  `}
+                ` : ""}
+
                 <div class="item-content">
                   ${this.editingIndex === index3 ? b2`
                     <input
@@ -156631,6 +156658,11 @@ var _DeesInputList = class _DeesInputList extends (_a36 = DeesInputBase, _value_
         );
         if (match2) {
           this.selectCandidate(match2);
+        } else if (this.allowFreeform) {
+          this.ghostText = "";
+          this.currentCandidateIndex = -1;
+          this.matchingCandidates = [];
+          this.addItem();
         }
         return;
       }
@@ -156999,6 +157031,7 @@ _allowDuplicates = new WeakMap();
 _sortable = new WeakMap();
 _confirmDelete = new WeakMap();
 _candidates = new WeakMap();
+_allowFreeform = new WeakMap();
 _validationText3 = new WeakMap();
 _inputValue3 = new WeakMap();
 _ghostText = new WeakMap();
@@ -157019,6 +157052,7 @@ __decorateElement(_init33, 4, "allowDuplicates", _allowDuplicates_dec, _DeesInpu
 __decorateElement(_init33, 4, "sortable", _sortable_dec, _DeesInputList, _sortable);
 __decorateElement(_init33, 4, "confirmDelete", _confirmDelete_dec, _DeesInputList, _confirmDelete);
 __decorateElement(_init33, 4, "candidates", _candidates_dec, _DeesInputList, _candidates);
+__decorateElement(_init33, 4, "allowFreeform", _allowFreeform_dec, _DeesInputList, _allowFreeform);
 __decorateElement(_init33, 4, "validationText", _validationText_dec3, _DeesInputList, _validationText3);
 __decorateElement(_init33, 4, "inputValue", _inputValue_dec3, _DeesInputList, _inputValue3);
 __decorateElement(_init33, 4, "ghostText", _ghostText_dec, _DeesInputList, _ghostText);
@@ -157119,6 +157153,20 @@ __publicField(_DeesInputList, "styles", [
       }
 
 
+      .candidate-check {
+        width: 14px;
+        height: 14px;
+        color: ${cssManager.bdTheme("hsl(142.1 76.2% 36.3%)", "hsl(142.1 70.6% 45.3%)")};
+        flex-shrink: 0;
+      }
+
+      .candidate-unknown {
+        width: 14px;
+        height: 14px;
+        color: ${cssManager.bdTheme("hsl(45 93% 47%)", "hsl(45 93% 58%)")};
+        flex-shrink: 0;
+      }
+
       .drag-handle {
         display: flex;
         align-items: center;