@gravitee/ui-components 3.25.3-typescript-ad6021f → 3.25.3-typescript-bfd8f67

package/src/molecules/gv-card-full.js

@@ -1,218 +1 @@
-/*
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *         http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import { css, html, LitElement } from 'lit';
-import { skeleton } from '../styles/skeleton';
-import { classMap } from 'lit/directives/class-map';
-import '../atoms/gv-image';
-import '../atoms/gv-button';
-import '../molecules/gv-metrics';
-import '../molecules/gv-rating';
-import '../atoms/gv-state';
-import '../atoms/gv-tag';
-import { truncate } from '../lib/utils';
-import { i18n } from '../lib/i18n';
-import { ItemResource } from '../mixins/item-resource';
-import { dispatchCustomEvent } from '../lib/events';
-import { getVersion, getTitle, getDescription, getOwner } from '../lib/item';
-
-/**
- * Full Card component
- *
- * ## Details
- * * has @theme facet
- *
- * @fires gv-card-full:click - Custom click event
- * @fires gv-tag:click - Custom click event on card labels
- *
- * @attr {Promise<Object>} item - An item.
- * @attr {Promise<Metrics>} metrics - A Metrics.
- *
- * @cssprop {Color} [--gv-card-full--bgc=var(--gv-theme-neutral-color-lightest, #ffffff)] - Background color
- * @cssprop {Length} [--gv-card-full-image--h=65px] - Image height
- * @cssprop {Length} [--gv-card-full-image--w=110px] - Image width
- */
-export class GvCardFull extends ItemResource(LitElement) {
-  static get properties() {
-    return {
-      metrics: { type: Object },
-    };
-  }
-
-  static get styles() {
-    return [
-      ...super.styles,
-      // language=CSS
-      css`
-        :host {
-          box-sizing: border-box;
-          display: inline-block;
-          margin: 0.2rem;
-
-          vertical-align: middle;
-          width: 100%;
-          max-height: 281px;
-          line-height: 22px;
-          font-size: var(--gv-theme-font-size-m, 14px);
-        }
-
-        gv-identity-picture {
-          height: var(--gv-card-full-image--h, 65px);
-          width: var(--gv-card-full-image--w, 110px);
-          --gv-image--of: contain;
-        }
-
-        .card {
-          display: flex;
-          flex-direction: column;
-          height: 250px;
-          border-radius: 4px;
-          background-color: var(--gv-card-full--bgc, var(--gv-theme-neutral-color-lightest, #ffffff));
-          color: var(--gv-theme-font-color-dark, #262626);
-          padding: 16px;
-          box-shadow: 0 0 0 1px var(--gv-theme-neutral-color, #f5f5f5), 0 1px 3px var(--gv-theme-neutral-color-dark, #bfbfbf);
-          transition: transform 0.3s;
-        }
-
-        .card:hover {
-          transform: translateY(-4px);
-          box-shadow: 0 20px 40px -14px var(--gv-theme-neutral-color-dark, #bfbfbf);
-          cursor: pointer;
-        }
-
-        .card > div {
-          display: flex;
-        }
-
-        .image {
-          min-height: 65px;
-          min-width: 0;
-          position: relative;
-          padding-top: 0.2rem;
-        }
-
-        .title {
-          line-height: 22px;
-          font-size: var(--gv-theme-font-size-l, 16px);
-          text-transform: capitalize;
-          font-weight: bold;
-          padding-bottom: 5px;
-        }
-
-        .owner {
-          --gv-icon--c: var(--gv-theme-neutral-color-dark, #bfbfbf);
-          --gv-icon--s: 16px;
-          color: var(--gv-theme-neutral-color-dark, #bfbfbf);
-          display: flex;
-          padding-bottom: 2px;
-          line-height: initial;
-        }
-
-        .content {
-          flex: 1;
-          padding: 0 10px 10px 10px;
-        }
-
-        .version {
-          color: var(--gv-theme-neutral-color-dark, #d9d9d9);
-          padding: 10px 8px;
-          font-size: var(--gv-theme-font-size-s, 12px);
-        }
-
-        .description {
-          padding: 0 16px;
-          margin: 6px 0;
-          flex: 1;
-          flex-grow: 1;
-          max-height: 150px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-        }
-
-        .infos {
-          display: flex;
-          border-bottom: 1px solid var(--gv-theme-neutral-color-dark, #d9d9d9);
-          padding: 0.5rem 0;
-          justify-content: flex-end;
-        }
-
-        gv-metrics {
-          display: flex;
-          height: 100%;
-          justify-content: flex-end;
-          align-items: stretch;
-        }
-
-        .skeleton .infos {
-          border-bottom: none;
-        }
-
-        .labels {
-          padding: 0 16px;
-        }
-
-        .error .labels,
-        .error .infos,
-        .error .states {
-          visibility: hidden;
-        }
-      `,
-      skeleton,
-    ];
-  }
-
-  constructor() {
-    super();
-    this.limit = 150;
-  }
-
-  _onClick(e) {
-    if (!this._empty && !this._error && !this._skeleton && !e.target.tagName.toLowerCase().startsWith('gv-metrics')) {
-      dispatchCustomEvent(this, 'click', this._item);
-    }
-  }
-
-  render() {
-    const title = getTitle(this._item);
-    const owner = getOwner(this._item);
-    const classes = { error: this._error || this._empty, card: true };
-    return html`<div class="${classMap(classes)}" title="${title}" @click="${this._onClick}">
-      <div class="${classMap({ skeleton: this._skeleton })}">
-        <div class="${classMap({ image: true })}">${this._renderImage()}</div>
-        <div class="content">
-          <div class="${classMap({ title: true })}">${title}</div>
-          ${owner != null && owner.trim().length > 0
-            ? html`<div class="owner"><gv-icon shape="general:user" size="8px"></gv-icon>${owner}</div>`
-            : ''}
-          <div class="states">${this._renderStates()}</div>
-        </div>
-        <div class="version"><span class="${classMap({ skeleton: this._skeleton })}">${getVersion(this._item)}</span></div>
-      </div>
-      <div class="${classMap({ skeleton: this._skeleton, description: true })}">
-        ${truncate(
-          this._error ? i18n('gv-card-full.error') : this._empty ? i18n('gv-card-full.empty') : getDescription(this._item),
-          this.limit,
-        )}
-      </div>
-      <span class="${classMap({ skeleton: this._skeleton })}">
-        <div class="infos">${this._renderMetricsWithRating()}</div>
-
-        <div class="labels">${this._renderLabels(true)}</div>
-      </span>
-    </div>`;
-  }
-}
-
-window.customElements.define('gv-card-full', GvCardFull);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.GvCardFull=void 0;const e=require("lit"),t=require("../styles/skeleton"),i=require("lit/directives/class-map");require("../atoms/gv-image"),require("../atoms/gv-button"),require("../molecules/gv-metrics"),require("../molecules/gv-rating"),require("../atoms/gv-state"),require("../atoms/gv-tag");const r=require("../lib/utils"),s=require("../lib/i18n"),l=require("../mixins/item-resource"),a=require("../lib/events"),o=require("../lib/item");class n extends((0,l.ItemResource)(e.LitElement)){static get properties(){return{metrics:{type:Object}}}static get styles(){return[...super.styles,e.css`:host{box-sizing:border-box;display:inline-block;margin:.2rem;vertical-align:middle;width:100%;max-height:281px;line-height:22px;font-size:var(--gv-theme-font-size-m,14px)}gv-identity-picture{height:var(--gv-card-full-image--h,65px);width:var(--gv-card-full-image--w,110px);--gv-image--of:contain}.card{display:flex;flex-direction:column;height:250px;border-radius:4px;background-color:var(--gv-card-full--bgc,var(--gv-theme-neutral-color-lightest,#fff));color:var(--gv-theme-font-color-dark,#262626);padding:16px;box-shadow:0 0 0 1px var(--gv-theme-neutral-color,#f5f5f5),0 1px 3px var(--gv-theme-neutral-color-dark,#bfbfbf);transition:transform .3s}.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -14px var(--gv-theme-neutral-color-dark,#bfbfbf);cursor:pointer}.card>div{display:flex}.image{min-height:65px;min-width:0;position:relative;padding-top:.2rem}.title{line-height:22px;font-size:var(--gv-theme-font-size-l,16px);text-transform:capitalize;font-weight:700;padding-bottom:5px}.owner{--gv-icon--c:var(--gv-theme-neutral-color-dark, #bfbfbf);--gv-icon--s:16px;color:var(--gv-theme-neutral-color-dark,#bfbfbf);display:flex;padding-bottom:2px;line-height:initial}.content{flex:1;padding:0 10px 10px 10px}.version{color:var(--gv-theme-neutral-color-dark,#d9d9d9);padding:10px 8px;font-size:var(--gv-theme-font-size-s,12px)}.description{padding:0 16px;margin:6px 0;flex:1;flex-grow:1;max-height:150px;overflow:hidden;text-overflow:ellipsis}.infos{display:flex;border-bottom:1px solid var(--gv-theme-neutral-color-dark,#d9d9d9);padding:.5rem 0;justify-content:flex-end}gv-metrics{display:flex;height:100%;justify-content:flex-end;align-items:stretch}.skeleton .infos{border-bottom:none}.labels{padding:0 16px}.error .infos,.error .labels,.error .states{visibility:hidden}`,t.skeleton]}constructor(){super(),this.limit=150}_onClick(e){this._empty||this._error||this._skeleton||e.target.tagName.toLowerCase().startsWith("gv-metrics")||(0,a.dispatchCustomEvent)(this,"click",this._item)}render(){const t=(0,o.getTitle)(this._item),l=(0,o.getOwner)(this._item),a={error:this._error||this._empty,card:!0};return e.html`<div class="${(0,i.classMap)(a)}" title="${t}" @click="${this._onClick}"><div class="${(0,i.classMap)({skeleton:this._skeleton})}"><div class="${(0,i.classMap)({image:!0})}">${this._renderImage()}</div><div class="content"><div class="${(0,i.classMap)({title:!0})}">${t}</div>${null!=l&&l.trim().length>0?e.html`<div class="owner"><gv-icon shape="general:user" size="8px"></gv-icon>${l}</div>`:""}<div class="states">${this._renderStates()}</div></div><div class="version"><span class="${(0,i.classMap)({skeleton:this._skeleton})}">${(0,o.getVersion)(this._item)}</span></div></div><div class="${(0,i.classMap)({skeleton:this._skeleton,description:!0})}">${(0,r.truncate)(this._error?(0,s.i18n)("gv-card-full.error"):this._empty?(0,s.i18n)("gv-card-full.empty"):(0,o.getDescription)(this._item),this.limit)}</div><span class="${(0,i.classMap)({skeleton:this._skeleton})}"><div class="infos">${this._renderMetricsWithRating()}</div><div class="labels">${this._renderLabels(!0)}</div></span></div>`}}exports.GvCardFull=n,window.customElements.define("gv-card-full",n);

package/src/molecules/gv-card-list.js

@@ -1,113 +1 @@
-/*
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *         http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import { css, LitElement, html } from 'lit';
-import { repeat } from 'lit/directives/repeat';
-import { withResizeObserver } from '../mixins/with-resize-observer';
-import { i18n } from '../lib/i18n';
-import './gv-card-full';
-
-/**
- * List of cards
- *
- * ## Details
- * * has @theme facet
- */
-export class GvCardList extends withResizeObserver(LitElement) {
-  static get properties() {
-    return {
-      items: { type: Array },
-    };
-  }
-
-  constructor() {
-    super();
-    this.breakpoints = {
-      width: [845, 1270],
-    };
-  }
-
-  static get styles() {
-    return [
-      // language=CSS
-      css`
-        :host {
-          box-sizing: border-box;
-          display: grid;
-          grid-template-columns: repeat(3, 1fr);
-          grid-gap: 0.5rem;
-        }
-
-        :host([w-lt-1270]) .container {
-          grid-template-columns: repeat(2, 1fr);
-        }
-
-        :host([w-lt-845]) .container {
-          display: flex;
-          flex-direction: column;
-        }
-
-        :host([w-lt-845]) .container > .item {
-          flex: 0 1 auto;
-        }
-
-        .item {
-          opacity: 0;
-          transition: opacity 100ms ease-in-out;
-        }
-
-        .item.show {
-          opacity: 1;
-        }
-      `,
-    ];
-  }
-
-  renderItem(item, index) {
-    const _item = item && item.item ? item.item : null;
-    const _metrics = item && item.metrics ? item.metrics : null;
-    return html`<gv-card-full class="item" .item="${_item}" .metrics="${_metrics}"> </gv-card-full>`;
-  }
-
-  render() {
-    if (this._error) {
-      return html`<div>${i18n('gv-card-list.error')}</div>`;
-    }
-
-    if (this.items) {
-      return html`${repeat(
-        this.items,
-        (item) => item,
-        (item, index) => this.renderItem(item, index),
-      )}`;
-    }
-    return '';
-  }
-
-  updated(changedProperties) {
-    if (changedProperties.has('items')) {
-      if (this.items && this.items.length > 0) {
-        const items = this.shadowRoot.querySelectorAll('.item');
-        items.forEach((item, index) => {
-          setTimeout(() => {
-            item.classList.add('show');
-          }, index * 100);
-        });
-      }
-    }
-  }
-}
-
-window.customElements.define('gv-card-list', GvCardList);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.GvCardList=void 0;const e=require("lit"),t=require("lit/directives/repeat"),i=require("../mixins/with-resize-observer"),r=require("../lib/i18n");require("./gv-card-full");class s extends((0,i.withResizeObserver)(e.LitElement)){static get properties(){return{items:{type:Array}}}constructor(){super(),this.breakpoints={width:[845,1270]}}static get styles(){return[e.css`:host{box-sizing:border-box;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:.5rem}:host([w-lt-1270]) .container{grid-template-columns:repeat(2,1fr)}:host([w-lt-845]) .container{display:flex;flex-direction:column}:host([w-lt-845]) .container>.item{flex:0 1 auto}.item{opacity:0;transition:opacity .1s ease-in-out}.item.show{opacity:1}`]}renderItem(t,i){const r=t&&t.item?t.item:null,s=t&&t.metrics?t.metrics:null;return e.html`<gv-card-full class="item" .item="${r}" .metrics="${s}"></gv-card-full>`}render(){return this._error?e.html`<div>${(0,r.i18n)("gv-card-list.error")}</div>`:this.items?e.html`${(0,t.repeat)(this.items,(e=>e),((e,t)=>this.renderItem(e,t)))}`:""}updated(e){if(e.has("items")&&this.items&&this.items.length>0){this.shadowRoot.querySelectorAll(".item").forEach(((e,t)=>{setTimeout((()=>{e.classList.add("show")}),100*t)}))}}}exports.GvCardList=s,window.customElements.define("gv-card-list",s);

package/src/molecules/gv-card.js

@@ -1,133 +1 @@
-/*
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *         http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import { css, LitElement, html } from 'lit';
-import { skeleton } from '../styles/skeleton';
-import { classMap } from 'lit/directives/class-map';
-import '../atoms/gv-image';
-import '../atoms/gv-button';
-import { i18n } from '../lib/i18n';
-import { ItemResource } from '../mixins/item-resource';
-import { getVersion, getTitle } from '../lib/item';
-
-/**
- * Card component
- *
- * ## Details
- * * has @theme facet
- *
- * @attr {Promise<any>} item - An item.
- *
- * @cssprop {Color} [--gv-card--bgc=var(--gv-theme-neutral-color-lightest, #ffffff)] - Background color
- */
-export class GvCard extends ItemResource(LitElement) {
-  static get styles() {
-    return [
-      ...super.styles,
-      // language=CSS
-      css`
-        :host {
-          box-sizing: border-box;
-          display: inline-block;
-          margin: 0.2rem;
-          vertical-align: middle;
-          width: 144px;
-          max-height: 144px;
-        }
-
-        gv-identity-picture {
-          width: 65px;
-          height: 65px;
-          --gv-image--of: contain;
-        }
-
-        .card {
-          position: relative;
-          display: flex;
-          flex-direction: column;
-          max-width: 144px;
-          min-height: 144px;
-          border-radius: 2px;
-          background-color: var(--gv-card--bgc, var(--gv-theme-neutral-color-lightest, #ffffff));
-          color: var(--gv-theme-font-color-dark, #262626);
-          box-shadow: 0 0 0 1px var(--gv-theme-neutral-color, #f5f5f5), 0 1px 3px var(--gv-theme-neutral-color-dark, #bfbfbf);
-          transition: all 0.3s;
-        }
-
-        .card:hover {
-          transform: translateY(-4px);
-          box-shadow: 0 10px 20px -10px var(--gv-theme-neutral-color-dark, #bfbfbf);
-          cursor: pointer;
-        }
-
-        .content > div {
-          display: flex;
-          justify-content: center;
-          margin-bottom: 0.2rem;
-        }
-
-        .image {
-          display: flex;
-          flex: 1;
-          align-items: center;
-          justify-content: center;
-          position: relative;
-          padding-top: 0.2rem;
-        }
-
-        .title {
-          line-height: 22px;
-          font-size: var(--gv-theme-font-size-s, 12px);
-          text-transform: capitalize;
-          font-weight: bold;
-          white-space: nowrap;
-          overflow: hidden;
-        }
-
-        .content {
-          flex: 1;
-          padding: 6px 16px 12px;
-        }
-
-        .version {
-          color: var(--gv-theme-neutral-color-dark, #d9d9d9);
-          top: 0.4rem;
-          right: 0.4rem;
-          position: absolute;
-        }
-      `,
-      skeleton,
-    ];
-  }
-
-  render() {
-    const title = getTitle(this._item);
-    return html`<div class="card" title="${title}">
-      <span class="${classMap({ skeleton: this._skeleton, version: true })}">${getVersion(this._item)}</span>
-      <div class="${classMap({ image: true, skeleton: this._skeleton })}">${this._renderImage()}</div>
-
-      <div class="${classMap({ content: true, empty: this._error || this._empty })}">
-        ${this._error || this._empty
-          ? html` <span>${this._error ? i18n('gv-card.error') : i18n('gv-card.empty')}</span> `
-          : html` <div class="${classMap({ skeleton: this._skeleton })}">
-                <span class="title">${title}</span>
-              </div>
-              <div>${this._renderStates()}</div>`}
-      </div>
-    </div>`;
-  }
-}
-
-window.customElements.define('gv-card', GvCard);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.GvCard=void 0;const e=require("lit"),t=require("../styles/skeleton"),r=require("lit/directives/class-map");require("../atoms/gv-image"),require("../atoms/gv-button");const i=require("../lib/i18n"),s=require("../mixins/item-resource"),o=require("../lib/item");class a extends((0,s.ItemResource)(e.LitElement)){static get styles(){return[...super.styles,e.css`:host{box-sizing:border-box;display:inline-block;margin:.2rem;vertical-align:middle;width:144px;max-height:144px}gv-identity-picture{width:65px;height:65px;--gv-image--of:contain}.card{position:relative;display:flex;flex-direction:column;max-width:144px;min-height:144px;border-radius:2px;background-color:var(--gv-card--bgc,var(--gv-theme-neutral-color-lightest,#fff));color:var(--gv-theme-font-color-dark,#262626);box-shadow:0 0 0 1px var(--gv-theme-neutral-color,#f5f5f5),0 1px 3px var(--gv-theme-neutral-color-dark,#bfbfbf);transition:all .3s}.card:hover{transform:translateY(-4px);box-shadow:0 10px 20px -10px var(--gv-theme-neutral-color-dark,#bfbfbf);cursor:pointer}.content>div{display:flex;justify-content:center;margin-bottom:.2rem}.image{display:flex;flex:1;align-items:center;justify-content:center;position:relative;padding-top:.2rem}.title{line-height:22px;font-size:var(--gv-theme-font-size-s,12px);text-transform:capitalize;font-weight:700;white-space:nowrap;overflow:hidden}.content{flex:1;padding:6px 16px 12px}.version{color:var(--gv-theme-neutral-color-dark,#d9d9d9);top:.4rem;right:.4rem;position:absolute}`,t.skeleton]}render(){const t=(0,o.getTitle)(this._item);return e.html`<div class="card" title="${t}"><span class="${(0,r.classMap)({skeleton:this._skeleton,version:!0})}">${(0,o.getVersion)(this._item)}</span><div class="${(0,r.classMap)({image:!0,skeleton:this._skeleton})}">${this._renderImage()}</div><div class="${(0,r.classMap)({content:!0,empty:this._error||this._empty})}">${this._error||this._empty?e.html`<span>${this._error?(0,i.i18n)("gv-card.error"):(0,i.i18n)("gv-card.empty")}</span>`:e.html`<div class="${(0,r.classMap)({skeleton:this._skeleton})}"><span class="title">${t}</span></div><div>${this._renderStates()}</div>`}</div></div>`}}exports.GvCard=a,window.customElements.define("gv-card",a);

package/src/molecules/gv-category-list.js

@@ -1,60 +1 @@
-/*
- * Copyright (C) 2015 The Gravitee team (http://gravitee.io)
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *         http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-import { css, html } from 'lit';
-import './gv-category';
-import { GvCardList } from './gv-card-list';
-
-/**
- * List of categories
- *
- * ## Details
- * * has @theme facet
- *
- * @cssprop {Color} [--gv-category-list--bgc-1=#cce6eb] - Category background color 1
- * @cssprop {Color} [--gv-category-list--bgc-2=#fcf1a8] - Category background color 2
- * @cssprop {Color} [--gv-category-list--bgc-3=#d9d4f1] - Category background color 3
- * @cssprop {Color} [--gv-category-list--bgc-4=#f9c15e] - Category background color 4
- * @cssprop {Color} [--gv-category-list--bgc-5=#d4fccd] - Category background color 5
- * @cssprop {Color} [--gv-category-list--bgc-6=#e0c8b2] - Category background color 6
- */
-export class GvCategoryList extends GvCardList {
-  static get styles() {
-    return [
-      ...super.styles,
-      // language=CSS
-      css`
-        :host {
-          --bgc-1: var(--gv-category-list--bgc-1, #cce6eb);
-          --bgc-2: var(--gv-category-list--bgc-2, #fcf1a8);
-          --bgc-3: var(--gv-category-list--bgc-3, #d9d4f1);
-          --bgc-4: var(--gv-category-list--bgc-4, #f9c15e);
-          --bgc-5: var(--gv-category-list--bgc-5, #d4fccd);
-          --bgc-6: var(--gv-category-list--bgc-6, #e0c8b2);
-        }
-      `,
-    ];
-  }
-
-  renderItem(item, index) {
-    return html`<gv-category class="item" .category="${item || null}" style="${this._getCategoryBackgroundColor(index)}"> </gv-category>`;
-  }
-
-  _getCategoryBackgroundColor(index) {
-    return `--gv-category--bgc: var(--bgc-${(index % 6) + 1})`;
-  }
-}
-
-window.customElements.define('gv-category-list', GvCategoryList);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.GvCategoryList=void 0;const e=require("lit");require("./gv-category");const t=require("./gv-card-list");class r extends t.GvCardList{static get styles(){return[...super.styles,e.css`:host{--bgc-1:var(--gv-category-list--bgc-1, #cce6eb);--bgc-2:var(--gv-category-list--bgc-2, #fcf1a8);--bgc-3:var(--gv-category-list--bgc-3, #d9d4f1);--bgc-4:var(--gv-category-list--bgc-4, #f9c15e);--bgc-5:var(--gv-category-list--bgc-5, #d4fccd);--bgc-6:var(--gv-category-list--bgc-6, #e0c8b2)}`]}renderItem(t,r){return e.html`<gv-category class="item" .category="${t||null}" style="${this._getCategoryBackgroundColor(r)}"></gv-category>`}_getCategoryBackgroundColor(e){return`--gv-category--bgc: var(--bgc-${e%6+1})`}}exports.GvCategoryList=r,window.customElements.define("gv-category-list",r);