@kodaris/krubble-app-components 1.0.81 → 1.0.83

package/dist/krubble-app.umd.js

@@ -6503,6 +6503,13 @@
       }
       /** Insert `/code ` into the composer and focus it, ready for the message. */
       _handleSkillSelect(skill) {
+          // A global skill must be installed before it can be chosen — inserting /code
+          // for one not enabled on this instance would just fail. `enabled` is only set
+          // on global skills (false = not installed); org skills leave it undefined and
+          // are always selectable. So an uninstalled global card click does nothing.
+          if (skill.enabled === false) {
+              return;
+          }
           this._inputValue = `/${skill.code} `;
           this._saveState();
           this._skillMenuOpened = false;
@@ -7106,28 +7113,32 @@
           }
           return b `
       <div class="skill-browse__grid">
-        ${skills.map((skill) => {
-            // A global skill must be installed before it can be chosen — inserting
-            // /code for a skill not enabled on this instance would just fail. So an
-            // uninstalled global card does nothing on click; only its Install button
-            // is interactive.
-            const selectable = !global || !!skill.enabled;
-            return b `
-            <div
-              class="skill-card"
-              role=${selectable ? 'button' : A}
-              tabindex=${selectable ? 0 : A}
-              @click=${selectable ? () => this._handleSkillSelect(skill) : A}
-              @keydown=${selectable ? (e) => this._handleSkillCardKeydown(e, skill) : A}
-            >
-              <span class="skill-card__name">${skill.name}</span>
-              ${skill.description ? b `
-                <span class="skill-card__desc">${skill.description}</span>
-              ` : A}
-              ${global ? this._renderSkillToggle(skill) : A}
-            </div>
-          `;
-        })}
+        ${skills.map((skill) => b `
+          <div
+            class="skill-card"
+            role="button"
+            tabindex="0"
+            @click=${() => this._handleSkillSelect(skill)}
+            @keydown=${(e) => this._handleSkillCardKeydown(e, skill)}
+          >
+            <span class="skill-card__name">${skill.name}</span>
+            ${skill.description ? b `
+              <span class="skill-card__desc">${skill.description}</span>
+            ` : A}
+            ${global ? b `
+              <div class="skill-card__footer" @click=${this._stopFooterClick}>
+                <span class="skill-card__price">Free</span>
+                <kr-button
+                  class="skill-card__install-btn"
+                  size="small"
+                  variant=${skill.enabled ? 'outline' : 'flat'}
+                  color=${skill.enabled ? 'secondary' : 'primary'}
+                  @click=${(e) => this._handleGlobalSkillEnable(skill, e)}
+                >${skill.enabled ? 'Uninstall' : 'Install'}</kr-button>
+              </div>
+            ` : A}
+          </div>
+        `)}
       </div>
     `;
       }
@@ -7135,31 +7146,6 @@
       _stopFooterClick(e) {
           e.stopPropagation();
       }
-      /**
-       * The install affordance on a global skill card: a footer row with an
-       * install/remove button. The button owns its own spinner via KRButton's
-       * showLoading()/showError() while the enable/disable request is in flight, so
-       * the async call has clear feedback. Clicks are stopped from bubbling so the
-       * button never also inserts the skill (the card body does that).
-       */
-      _renderSkillToggle(skill) {
-          const on = !!skill.enabled;
-          return b `
-      <div
-        class="skill-card__footer"
-        @click=${this._stopFooterClick}
-      >
-        <span class="skill-card__price">Free</span>
-        <kr-button
-          class="skill-card__install-btn"
-          size="small"
-          variant=${on ? 'outline' : 'flat'}
-          color=${on ? 'secondary' : 'primary'}
-          @click=${(e) => this._handleGlobalSkillEnable(skill, e)}
-        >${on ? 'Uninstall' : 'Install'}</kr-button>
-      </div>
-    `;
-      }
       /**
        * Render a user message, highlighting a leading `/skill-code` token (like the
        * way Claude highlights slash commands). The composer only inserts valid skill