@nasa-terra/components 0.0.179 → 0.0.181

package/cdn/vscode.html-custom-data.json

@@ -1014,6 +1014,26 @@
         }
       ]
     },
+    {
+      "name": "terra-harmony-history",
+      "description": "Displays a horizontal scrolling strip of a user's recent Harmony job requests,\nfetching additional pages on demand as the user scrolls.\n---\n\n\n### **Events:**\n - **terra-harmony-job-select** - Emitted when a thumbnail is clicked.\n- **terra-harmony-job-delete** - Emitted when the delete button on a thumbnail is clicked (only when `removeLabelsOnDelete` is false).\n\n### **CSS Parts:**\n - **nav-button** - The left/right navigation arrow buttons.\n- **viewport** - The overflow-hidden container that clips the thumbnail track.\n- **track** - The inner flex container that translates to implement scrolling.\n- **thumbnail** - Each individual job thumbnail wrapper.",
+      "attributes": [
+        { "name": "bearer-token", "values": [] },
+        { "name": "limit", "values": [] },
+        { "name": "filter-by-labels", "values": [] },
+        {
+          "name": "remove-labels-on-delete",
+          "description": "When true and `filter-by-labels` is set, clicking the delete button on a thumbnail\nwill call the Harmony /labels DELETE endpoint to remove the active filter labels from\nthat job (causing it to disappear from the filtered list). When false, a\n`terra-harmony-job-delete` event is emitted instead and the consumer handles deletion.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://terra-ui.netlify.app/components/harmony-history"
+        }
+      ]
+    },
     {
       "name": "terra-icon",
       "description": "Icons are symbols that can be used to represent various options within an application.\n---\n\n\n### **Events:**\n - **terra-load** - Emitted when the icon has loaded.\n- **terra-error** - Emitted when the icon fails to load due to an error.\n\n### **CSS Parts:**\n - **svg** - The internal SVG element.",
@@ -2340,7 +2360,7 @@
     },
     {
       "name": "terra-time-average-map",
-      "description": "\n---\n",
+      "description": "\n---\n\n\n### **Methods:**\n - **captureMapThumbnail(thumbWidth, thumbHeight): _Promise<Blob | undefined>_** - Captures the current map view as a thumbnail Blob (JPEG, 200×200).\nComposites all OpenLayers canvas layers without text overlay or legend.\nReturns undefined if the map is not ready.",
       "attributes": [
         { "name": "collection", "values": [] },
         { "name": "variable", "values": [] },
@@ -2350,7 +2370,12 @@
         { "name": "bearer-token", "values": [] },
         { "name": "long_name", "values": [] },
         { "name": "color-map-name", "values": [] },
-        { "name": "opacity", "values": [] }
+        { "name": "opacity", "values": [] },
+        {
+          "name": "application-id",
+          "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -2416,7 +2441,12 @@
         },
         { "name": "mobile-view", "values": [] },
         { "name": "hide-toolbar", "values": [] },
-        { "name": "product-label", "values": [] }
+        { "name": "product-label", "values": [] },
+        {
+          "name": "application-id",
+          "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -2583,6 +2613,11 @@
           "name": "hoist",
           "description": "Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with\n`overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all,\nscenarios.",
           "values": []
+        },
+        {
+          "name": "interactive",
+          "description": "Allows text inside the tooltip to be selected and copied. Also enables pointer events on the tooltip body\nso the user can interact with its content.",
+          "values": []
         }
       ],
       "references": [

package/cdn/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@nasa-terra/components",
-  "version": "0.0.179",
+  "version": "0.0.181",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -2311,6 +2311,69 @@
             ]
           }
         },
+        {
+          "name": "terra-harmony-history",
+          "description": "Displays a horizontal scrolling strip of a user's recent Harmony job requests,\nfetching additional pages on demand as the user scrolls.\n---\n\n\n### **Events:**\n - **terra-harmony-job-select** - Emitted when a thumbnail is clicked.\n- **terra-harmony-job-delete** - Emitted when the delete button on a thumbnail is clicked (only when `removeLabelsOnDelete` is false).\n\n### **CSS Parts:**\n - **nav-button** - The left/right navigation arrow buttons.\n- **viewport** - The overflow-hidden container that clips the thumbnail track.\n- **track** - The inner flex container that translates to implement scrolling.\n- **thumbnail** - Each individual job thumbnail wrapper.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "bearer-token",
+              "value": { "type": "string | undefined" }
+            },
+            { "name": "limit", "value": { "type": "number", "default": "10" } },
+            {
+              "name": "filter-by-labels",
+              "value": { "type": "string | undefined" }
+            },
+            {
+              "name": "remove-labels-on-delete",
+              "description": "When true and `filter-by-labels` is set, clicking the delete button on a thumbnail\nwill call the Harmony /labels DELETE endpoint to remove the active filter labels from\nthat job (causing it to disappear from the filtered list). When false, a\n`terra-harmony-job-delete` event is emitted instead and the consumer handles deletion.",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "events": [
+            {
+              "name": "terra-harmony-job-select",
+              "type": "{ job: SubsetJobStatus }",
+              "description": "Emitted when a thumbnail is clicked."
+            },
+            {
+              "name": "terra-harmony-job-delete",
+              "type": "{ jobId: string }",
+              "description": "Emitted when the delete button on a thumbnail is clicked (only when `removeLabelsOnDelete` is false)."
+            }
+          ],
+          "js": {
+            "properties": [
+              { "name": "bearerToken", "type": "string | undefined" },
+              { "name": "limit", "type": "number" },
+              { "name": "filterByLabels", "type": "string | undefined" },
+              {
+                "name": "removeLabelsOnDelete",
+                "description": "When true and `filter-by-labels` is set, clicking the delete button on a thumbnail\nwill call the Harmony /labels DELETE endpoint to remove the active filter labels from\nthat job (causing it to disappear from the filtered list). When false, a\n`terra-harmony-job-delete` event is emitted instead and the consumer handles deletion.",
+                "type": "boolean"
+              },
+              { "name": "_authController" },
+              { "name": "_removeLabelsOnDeleteMutation" },
+              {
+                "name": "jobsQuery",
+                "description": "Page 1 is always managed by this QueryController (includes polling for non-final jobs).\nOther pages are fetched imperatively via _fetchPage()."
+              }
+            ],
+            "events": [
+              {
+                "name": "terra-harmony-job-select",
+                "type": "{ job: SubsetJobStatus }",
+                "description": "Emitted when a thumbnail is clicked."
+              },
+              {
+                "name": "terra-harmony-job-delete",
+                "type": "{ jobId: string }",
+                "description": "Emitted when the delete button on a thumbnail is clicked (only when `removeLabelsOnDelete` is false)."
+              }
+            ]
+          }
+        },
         {
           "name": "terra-icon",
           "description": "Icons are symbols that can be used to represent various options within an application.\n---\n\n\n### **Events:**\n - **terra-load** - Emitted when the icon has loaded.\n- **terra-error** - Emitted when the icon fails to load due to an error.\n\n### **CSS Parts:**\n - **svg** - The internal SVG element.",
@@ -5306,7 +5369,7 @@
         },
         {
           "name": "terra-time-average-map",
-          "description": "\n---\n",
+          "description": "\n---\n\n\n### **Methods:**\n - **captureMapThumbnail(thumbWidth, thumbHeight): _Promise<Blob | undefined>_** - Captures the current map view as a thumbnail Blob (JPEG, 200×200).\nComposites all OpenLayers canvas layers without text overlay or legend.\nReturns undefined if the map is not ready.",
           "doc-url": "",
           "attributes": [
             { "name": "collection", "value": { "type": "string | undefined" } },
@@ -5323,7 +5386,15 @@
               "name": "color-map-name",
               "value": { "type": "string", "default": "'viridis'" }
             },
-            { "name": "opacity", "value": { "type": "number", "default": "1" } }
+            {
+              "name": "opacity",
+              "value": { "type": "number", "default": "1" }
+            },
+            {
+              "name": "application-id",
+              "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+              "value": { "type": "string | undefined" }
+            }
           ],
           "events": [],
           "js": {
@@ -5337,6 +5408,11 @@
               { "name": "long_name", "type": "string" },
               { "name": "colorMapName", "type": "string" },
               { "name": "opacity", "type": "number" },
+              {
+                "name": "applicationId",
+                "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+                "type": "string | undefined"
+              },
               { "name": "catalogVariable", "type": "Variable" },
               { "name": "pixelValue", "type": "string" },
               { "name": "pixelCoordinates", "type": "string" },
@@ -5433,6 +5509,11 @@
             {
               "name": "product-label",
               "value": { "type": "string | undefined" }
+            },
+            {
+              "name": "application-id",
+              "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+              "value": { "type": "string | undefined" }
             }
           ],
           "events": [
@@ -5506,6 +5587,11 @@
               { "name": "mobileView", "type": "boolean" },
               { "name": "hideToolbar", "type": "boolean" },
               { "name": "productLabel", "type": "string | undefined" },
+              {
+                "name": "applicationId",
+                "description": "the application ID is used for tracking purposes and will be included in the labels of Harmony jobs created by this component",
+                "type": "string | undefined"
+              },
               { "name": "plot", "type": "TerraPlot" },
               { "name": "plotToolbar", "type": "TerraPlotToolbar" },
               { "name": "catalogVariable", "type": "Variable" },
@@ -5854,6 +5940,11 @@
               "name": "hoist",
               "description": "Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with\n`overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all,\nscenarios.",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "interactive",
+              "description": "Allows text inside the tooltip to be selected and copied. Also enables pointer events on the tooltip body\nso the user can interact with its content.",
+              "value": { "type": "boolean", "default": "false" }
             }
           ],
           "slots": [
@@ -5937,6 +6028,11 @@
                 "name": "hoist",
                 "description": "Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with\n`overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all,\nscenarios.",
                 "type": "boolean"
+              },
+              {
+                "name": "interactive",
+                "description": "Allows text inside the tooltip to be selected and copied. Also enables pointer events on the tooltip body\nso the user can interact with its content.",
+                "type": "boolean"
               }
             ],
             "events": [

package/dist/apis/harmony.api.d.ts

@@ -1,6 +1,6 @@
 import { type RequestOptions } from '../lib/api.client.js';
 import type { HarmonyRequest } from '../lib/harmony/harmony.request.js';
-import type { SubsetJobStatus, SearchOptions } from '../data-services/types.js';
+import type { SubsetJobStatus, SearchOptions, SubsetJobLink } from '../data-services/types.js';
 export declare const Environments: {
     readonly PROD: "PROD";
     readonly UAT: "UAT";
@@ -114,6 +114,18 @@ declare class HarmonyApi {
      * from the Harmony /capabilities endpoint
      */
     getCollectionCapabilities(conceptId?: string, options?: RequestOptions): Promise<HarmonyCapabilitiesResponse>;
+    /**
+     * Gets a user's Harmony jobs
+     */
+    getJobs(params?: {
+        page?: number;
+        limit?: number;
+        label?: string;
+    }, options?: SearchOptions): Promise<{
+        count: number;
+        jobs: SubsetJobStatus[];
+        links: SubsetJobLink[];
+    }>;
     /**
      * Create a subset job by sending a GET request to the Harmony OGC API endpoint.
      * The harmonyRequest.requestUrl contains the full URL with all subset parameters.
@@ -124,6 +136,17 @@ declare class HarmonyApi {
      * Intended for polling until the job reaches a final state.
      */
     getJobStatus(jobId: string, options?: SearchOptions): Promise<SubsetJobStatus>;
+    /**
+     * Removes one or more labels from one or more Harmony jobs.
+     * After removal, the jobs will no longer match label-based filters.
+     *
+     * @example
+     * await harmonyApi.removeJobLabels({ jobIDs: ['abc', 'def'], labels: ['my-label'] }, { bearerToken })
+     */
+    removeJobLabels(params: {
+        jobIDs: string[];
+        labels: string[];
+    }, options?: SearchOptions): Promise<void>;
     /**
      * Given a jobId for a running job, send a cancellation request to the Harmony API.
      * Returns the updated job status after cancellation.

package/dist/chunks/chunk.244CTE3T.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.S3WSRAXA.js";import*as r from"react";import{createComponent as t}from"@lit/react";import"@lit/react";var o="terra-icon";e.define("terra-icon");var a=t({tagName:o,elementClass:e,react:r,events:{onTerraLoad:"terra-load",onTerraError:"terra-error"},displayName:"TerraIcon"}),f=a;export{f as a};

package/dist/chunks/chunk.27Y756GG.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.OAYJFXJ7.js";import*as r from"react";import{createComponent as t}from"@lit/react";import"@lit/react";var a="terra-alert";e.define("terra-alert");var n=t({tagName:a,elementClass:e,react:r,events:{onTerraShow:"terra-show",onTerraAfterShow:"terra-after-show",onTerraHide:"terra-hide",onTerraAfterHide:"terra-after-hide"},displayName:"TerraAlert"}),i=n;export{i as a};

package/dist/chunks/chunk.2BHAYNPS.js

@@ -0,0 +1,33 @@
+import{a as c}from"./chunk.ACIJ7WID.js";import{a as r,b as a}from"./chunk.OILCN37O.js";import{e as t,f as o,g as m}from"./chunk.INFVQQSJ.js";import{property as i}from"lit/decorators.js";import{html as n,nothing as p}from"lit";import{classMap as l}from"lit/directives/class-map.js";var s,e=class extends a{constructor(){super(...arguments);this.size="medium";this.closeable=!1;this.stack=!1;m(this,s,()=>{this.emit("terra-remove"),this.remove()})}render(){return n`
+            <div
+                class="${l({"chip--small":this.size==="small","chip--medium":this.size==="medium","chip--large":this.size==="large"})}
+                chip"
+            >
+                <div
+                    class="${l({"chip-content--small":this.size==="small","chip-content--medium":this.size==="medium","chip-content--large":this.size==="large"})}
+                    chip-content"
+                >
+                    <slot part="content" class="tag__content"></slot>
+                </div>
+                ${this.closeable?n`
+                          <button
+                              class="chip-close"
+                              @click="${o(this,s)}"
+                          >
+                              <svg
+                                  class="${l({"chip-svg--small":this.size==="small","chip-svg--medium":this.size==="medium","chip-svg--large":this.size==="large"})}
+                        chip-svg"
+                                  focusable="false"
+                                  viewBox="0 0 500 500"
+                                  aria-hidden="true"
+                              >
+                                  <path
+                                      d="M 227 56.036 H 265 V 227.037 H 436 V 265.036 H 265 V 436.036 H 227 V 265.036 H 56 V 227.037 H 227 Z"
+                                      style="paint-order: fill; fill-rule: nonzero; stroke-width: 0px; transform-origin: 246px 246.036px;"
+                                      transform="matrix(0.707107007504, 0.707107007504, -0.707107007504, 0.707107007504, -9.98393e-7, -0.000026419743)"
+                                  ></path>
+                              </svg>
+                          </button>
+                      `:p}
+            </div>
+        `}};s=new WeakMap,e.styles=[r,c],t([i({reflect:!0})],e.prototype,"size",2),t([i({type:Boolean,reflect:!0})],e.prototype,"closeable",2),t([i({type:Boolean,reflect:!0})],e.prototype,"stack",2);export{e as a};

package/dist/chunks/chunk.2C5SN5KH.js

@@ -0,0 +1,74 @@
+import{b as W,c as u,d as v}from"./chunk.6WTTSLOK.js";import{a as w}from"./chunk.Q6Y44MV7.js";import{a as Q}from"./chunk.6VRE7YNG.js";import{a as O}from"./chunk.36AZ2XCI.js";import{a as N}from"./chunk.EDBJ4VFC.js";import{a as U}from"./chunk.J5Q4TWEG.js";import{a as R,b as F}from"./chunk.OILCN37O.js";import{a as q,b as C,e as o,f as t,g as l,h as m,i as d}from"./chunk.INFVQQSJ.js";import j from"fuse.js";import{LitElement as z,html as E,nothing as B}from"lit";import{property as b,state as $}from"lit/decorators.js";import{map as D}from"lit/directives/map.js";import{ref as A}from"lit/directives/ref.js";var a,x,r,L,c,k,M,H,f,y,p,g,T,P,s=class s extends F{constructor(){super(...arguments);l(this,p);l(this,T);l(this,a,null);l(this,x,new w(this));l(this,r,null);l(this,L,null);l(this,c,null);this.label="Enter search terms (e.g., precipitation, AOD)";this.hideLabel=!0;this.searchConfig={keys:["id"],useExtendedSearch:!0};this.isExpanded=!1;this.query=s.initialQuery;this.searchResults=[];l(this,k,i=>{var n;let e=i.target;this.query=e.value,e.value&&(this.isExpanded=!0),this.searchResults=(n=t(this,L))==null?void 0:n.search(e.value).map(({item:h})=>h)});l(this,M,i=>{let e=i.composedPath(),[n]=e.filter(h=>h.role==="option");n&&(t(this,y).call(this,n),d(this,p,g).call(this,this.query))});l(this,H,i=>{var e;switch(i.key){case"ArrowDown":{if(!this.isExpanded)return;u(t(this,a),t(this,r)),v(t(this,c),t(this,a),"next");break}case"ArrowUp":{if(!this.isExpanded)return;u(t(this,a),t(this,r)),v(t(this,c),t(this,a),"previous");break}case"Enter":{let n=(e=t(this,c))==null?void 0:e.currentNode;n.role==="option"&&t(this,y).call(this,n),d(this,p,g).call(this,this.query);break}case"Escape":{u(t(this,a),t(this,r)),this.isExpanded?(this.isExpanded=!1,this.dispatchEvent(new Event("cancel"))):this.query=s.initialQuery;break}default:break}});l(this,f,i=>{i.composedPath().some(h=>h.localName===s.tagName)||(this.isExpanded=!1)});l(this,y,i=>{this.query=i.id,this.emit("terra-variable-keyword-search-change",{detail:i.id}),this.isExpanded=!1,u(t(this,a),t(this,r))})}async valueChanged(i,e){this.query=e}connectedCallback(){super.connectedCallback(),globalThis.addEventListener("click",t(this,f))}disconnectedCallback(){super.disconnectedCallback(),globalThis.removeEventListener("click",t(this,f))}clear(){this.query=s.initialQuery}close(){this.isExpanded=!1}toggle(){this.isExpanded=!this.isExpanded}render(){var i;return E`<search part="base" title="Search through the list.">
+            <label for="combobox" class=${this.hideLabel?"sr-only":"input-label"}
+                >${this.label}</label
+            >
+            <div class="search-input-group">
+                <terra-button
+                    @click=${()=>d(this,p,g).call(this,this.query)}
+                    aria-label=${this.query?`Search for ${this.query}.`:"Enter search term to enable search."}
+                    circle
+                    class="search-button search-input-button"
+                    outline
+                    tabindex="-1"
+                    type="button"
+                >
+                    <slot name="label">
+                        <terra-icon
+                            font-size="1.5em"
+                            library="heroicons"
+                            name="outline-magnifying-glass"
+                        ></terra-icon>
+                    </slot>
+                </terra-button>
+
+                <input
+                    ${A(e=>{var n;e&&((n=t(this,a))!=null||m(this,a,e))})}
+                    aria-autocomplete="list"
+                    aria-controls="listbox"
+                    aria-haspopup="list"
+                    aria-expanded=${this.isExpanded}
+                    autocomplete="off"
+                    class="combobox"
+                    id="combobox"
+                    part="combobox"
+                    role="combobox"
+                    type="text"
+                    .placeholder=${(i=this.placeholder)!=null?i:`${this.label}\u2026`}
+                    .value=${this.query}
+                    @input=${t(this,k)}
+                    @keydown=${t(this,H)}
+                />
+
+                ${this.query.length?E`<terra-button
+                          @click=${()=>d(this,T,P).call(this)}
+                          aria-label="Clear the searched term and start over."
+                          circle
+                          class="clear-button search-input-button"
+                          outline
+                          tabindex="-1"
+                          type="button"
+                      >
+                          <slot name="label">
+                              <terra-icon
+                                  font-size="1.5em"
+                                  library="heroicons"
+                                  name="outline-x-circle"
+                              ></terra-icon>
+                          </slot>
+                      </terra-button>`:B}
+            </div>
+
+            <ul
+                ${A(e=>{var n;e&&((n=t(this,r))!=null||m(this,r,e))})}
+                ?inert=${!this.isExpanded}
+                ?open=${this.isExpanded}
+                @click=${t(this,M)}
+                aria-label=${this.query?`Keywords Matching ${this.query}`:"Keywords"}
+                id="listbox"
+                part="listbox"
+                role="listbox"
+                class="search-results"
+            >
+                ${t(this,x).render({initial:()=>E`<li class="updating">Updating List of Keywords</li>`,pending:()=>E`<li class="updating">Updating List of Keywords</li>`,complete:e=>(m(this,L,new j(e,this.searchConfig)),m(this,c,document.createTreeWalker(t(this,r),NodeFilter.SHOW_ELEMENT,n=>{var h;return["option","listbox"].includes((h=n.role)!=null?h:"")?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_SKIP})),D(this.searchResults,W)),error:e=>E`<li class="error">${e}</li>`})}
+            </ul>
+        </search>`}};a=new WeakMap,x=new WeakMap,r=new WeakMap,L=new WeakMap,c=new WeakMap,k=new WeakMap,M=new WeakMap,H=new WeakMap,f=new WeakMap,y=new WeakMap,p=new WeakSet,g=function(i){i.length&&this.emit("terra-search",{detail:this.query})},T=new WeakSet,P=function(){var i;this.query=s.initialQuery,this.emit("terra-search",{detail:this.query}),u(t(this,a),t(this,r)),(i=t(this,a))==null||i.focus()},s.dependencies={"terra-button":N,"terra-icon":O},s.styles=[R,Q],s.shadowRootOptions=C(q({},z.shadowRootOptions),{delegatesFocus:!0}),s.tagName="terra-variable-keyword-search",s.initialQuery="",o([b()],s.prototype,"label",2),o([b()],s.prototype,"placeholder",2),o([b({attribute:"hide-label",type:Boolean})],s.prototype,"hideLabel",2),o([b({reflect:!1,type:Object})],s.prototype,"searchConfig",2),o([b()],s.prototype,"value",2),o([$()],s.prototype,"isExpanded",2),o([$()],s.prototype,"query",2),o([$()],s.prototype,"searchResults",2),o([U("value")],s.prototype,"valueChanged",1);var I=s;export{I as a};

package/dist/chunks/chunk.2ENSAFQB.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.NFM5IDJR.js";var T=e;e.define("terra-tab");export{T as a};

package/dist/chunks/chunk.2FKZOYDM.js

@@ -0,0 +1,170 @@
+import{css as r}from"lit";var a=r`
+    :host {
+        display: flex;
+        align-items: center;
+        height: 80px;
+        background: var(--terra-color-neutral-0, #ffffff);
+        border-top: 1px solid var(--terra-color-neutral-200, #e2e8f0);
+        gap: 4px;
+        padding: 0 4px;
+    }
+
+    .nav-button {
+        flex-shrink: 0;
+        width: 32px;
+        height: 32px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border: none;
+        background: transparent;
+        cursor: pointer;
+        color: var(--terra-color-neutral-600, #4a5568);
+        border-radius: var(--terra-border-radius-medium, 4px);
+        transition:
+            background-color 0.2s,
+            color 0.2s;
+        padding: 0;
+    }
+
+    .nav-button:hover:not(:disabled) {
+        background-color: var(--terra-color-neutral-100, #f7fafc);
+        color: var(--terra-color-neutral-900, #1a202c);
+    }
+
+    .nav-button:disabled {
+        opacity: 0.4;
+        cursor: not-allowed;
+    }
+
+    .viewport {
+        flex: 1;
+        overflow: hidden;
+        position: relative;
+        height: 100%;
+        display: flex;
+        align-items: center;
+    }
+
+    .track {
+        display: flex;
+        gap: 12px;
+        align-items: center;
+        transition: transform 0.3s ease-in-out;
+    }
+
+    .thumbnail {
+        flex-shrink: 0;
+        width: 96px;
+        height: 64px;
+        position: relative;
+        cursor: pointer;
+        border-radius: var(--terra-border-radius-medium, 6px);
+        transition: transform 0.2s ease-in-out;
+    }
+
+    .thumbnail:hover {
+        transform: translateY(-2px);
+    }
+
+    .thumbnail:hover .delete-button {
+        opacity: 1;
+    }
+
+    .thumbnail-inner {
+        width: 100%;
+        height: 100%;
+        background: var(--terra-color-primary-50, #ebf5ff);
+        border: 1px solid var(--terra-color-neutral-200, #e2e8f0);
+        border-radius: var(--terra-border-radius-medium, 6px);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        overflow: hidden;
+        position: relative;
+        transition:
+            border-color 0.2s,
+            box-shadow 0.2s;
+        color: var(--terra-color-primary-500, #4a90e2);
+    }
+
+    .thumbnail-img {
+        width: 100%;
+        height: 100%;
+        object-fit: fit;
+        display: block;
+    }
+
+    .thumbnail:hover .thumbnail-inner {
+        border-color: var(--terra-color-primary-300, #63b3ed);
+        box-shadow: 0 2px 8px rgba(0, 102, 204, 0.15);
+    }
+
+    .loading-overlay {
+        position: absolute;
+        inset: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: rgba(255, 255, 255, 0.7);
+        border-radius: inherit;
+        z-index: 1;
+    }
+
+    .delete-button {
+        position: absolute;
+        top: -6px;
+        right: -6px;
+        width: 16px;
+        height: 16px;
+        border-radius: 50%;
+        background: var(--terra-color-danger-500, #e53e3e);
+        color: white;
+        border: none;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 11px;
+        font-weight: bold;
+        line-height: 1;
+        padding: 0;
+        opacity: 0;
+        transition:
+            opacity 0.15s,
+            background-color 0.15s;
+        z-index: 2;
+    }
+
+    .delete-button:hover {
+        background: var(--terra-color-danger-600, #c53030);
+    }
+
+    .empty-state {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0 16px;
+    }
+
+    .font-weight-semibold {
+        font-weight: 600;
+    }
+
+    .text-gray-300 {
+        color: var(--terra-color-neutral-400, #d1d5dc);
+    }
+
+    .mb-1 {
+        margin-bottom: 4px;
+    }
+
+    .tooltip-row {
+        display: flex;
+        align-items: center;
+    }
+
+    .tooltip-row terra-icon {
+        margin-right: 4px;
+    }
+`;export{a};

package/dist/chunks/chunk.2IEYXOYV.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.VBIWDPIC.js";var n=e;e.define("terra-tab-panel");export{n as a};

package/dist/chunks/chunk.2MLS3BXA.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.ODZ5RFHN.js";import*as r from"react";import{createComponent as a}from"@lit/react";var t="terra-breadcrumb";e.define("terra-breadcrumb");var m=a({tagName:t,elementClass:e,react:r,events:{},displayName:"TerraBreadcrumb"}),d=m;export{d as a};