@gravitee/ui-components 3.25.2 → 3.25.3-typescript-5a46c7d
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +13 -4
- package/src/atoms/gv-autocomplete.js +1 -437
- package/src/atoms/gv-button.js +1 -235
- package/src/atoms/gv-checkbox.js +1 -129
- package/src/atoms/gv-date-picker-calendar.js +1 -813
- package/src/atoms/gv-date-picker-cell.js +1 -166
- package/src/atoms/gv-date-picker.js +1 -532
- package/src/atoms/gv-file-upload.js +1 -257
- package/src/atoms/gv-icon.js +1 -82
- package/src/atoms/gv-image.js +1 -109
- package/src/atoms/gv-input-message.js +1 -59
- package/src/atoms/gv-input.js +1 -530
- package/src/atoms/gv-link.js +1 -132
- package/src/atoms/gv-message.js +1 -77
- package/src/atoms/gv-metric.js +1 -68
- package/src/atoms/gv-relative-time.js +1 -185
- package/src/atoms/gv-select-native.js +1 -269
- package/src/atoms/gv-select.js +1 -317
- package/src/atoms/gv-spinner.js +1 -36
- package/src/atoms/gv-state.js +1 -89
- package/src/atoms/gv-switch.js +1 -123
- package/src/atoms/gv-tag.js +1 -116
- package/src/atoms/gv-text.js +1 -107
- package/src/charts/gv-chart-bar.js +1 -107
- package/src/charts/gv-chart-gauge.js +1 -97
- package/src/charts/gv-chart-histogram.js +1 -91
- package/src/charts/gv-chart-line.js +1 -235
- package/src/charts/gv-chart-map.js +1 -114
- package/src/charts/gv-chart-pie.js +1 -95
- package/src/index.js +1 -78
- package/src/lib/cron-expression.js +1 -210
- package/src/lib/date.js +1 -53
- package/src/lib/events.js +1 -28
- package/src/lib/http-client-schema-form.js +1 -68
- package/src/lib/http.js +1 -238
- package/src/lib/i18n.js +1 -111
- package/src/lib/item.js +1 -119
- package/src/lib/properties.js +1 -224
- package/src/lib/schema-form.js +1 -43
- package/src/lib/studio.js +1 -94
- package/src/lib/style.js +1 -41
- package/src/lib/text-format.js +1 -76
- package/src/lib/theme.js +1 -66
- package/src/lib/utils.js +1 -110
- package/src/mixins/chart-element.js +1 -142
- package/src/mixins/input-element.js +1 -157
- package/src/mixins/item-resource.js +1 -122
- package/src/mixins/keyboard-element.js +1 -70
- package/src/mixins/update-after-browser.js +1 -33
- package/src/mixins/with-resize-observer.js +1 -78
- package/src/mixins/with-skeleton-attribute.js +1 -118
- package/src/molecules/gv-card-full.js +1 -97
- package/src/molecules/gv-card-list.js +1 -84
- package/src/molecules/gv-card.js +1 -59
- package/src/molecules/gv-category-list.js +1 -49
- package/src/molecules/gv-category.js +1 -90
- package/src/molecules/gv-code.js +1 -297
- package/src/molecules/gv-confirm.js +1 -158
- package/src/molecules/gv-cron-editor.js +1 -464
- package/src/molecules/gv-dropdown-menu.js +1 -84
- package/src/molecules/gv-expandable.js +1 -94
- package/src/molecules/gv-expression-language.js +1 -308
- package/src/molecules/gv-identity-picture.js +1 -125
- package/src/molecules/gv-list.js +1 -135
- package/src/molecules/gv-metrics.js +1 -150
- package/src/molecules/gv-modal.js +1 -146
- package/src/molecules/gv-nav.js +1 -170
- package/src/molecules/gv-option.js +1 -169
- package/src/molecules/gv-plans.js +1 -306
- package/src/molecules/gv-popover.js +1 -231
- package/src/molecules/gv-promote.js +1 -91
- package/src/molecules/gv-rating-list.js +1 -239
- package/src/molecules/gv-rating.js +1 -200
- package/src/molecules/gv-row-expandable.js +1 -39
- package/src/molecules/gv-row.js +1 -84
- package/src/molecules/gv-stats.js +1 -96
- package/src/molecules/gv-stepper.js +1 -144
- package/src/molecules/gv-table.js +1 -575
- package/src/molecules/gv-tree.js +1 -127
- package/src/organisms/gv-documentation.js +1 -132
- package/src/organisms/gv-header.js +1 -130
- package/src/organisms/gv-http-client.js +1 -139
- package/src/organisms/gv-menu.js +1 -142
- package/src/organisms/gv-newsletter-subscription.js +1 -130
- package/src/organisms/gv-pagination.js +1 -170
- package/src/organisms/gv-properties.js +1 -699
- package/src/organisms/gv-resizable-views.js +1 -178
- package/src/organisms/gv-resources.js +1 -428
- package/src/organisms/gv-schema-form-array.js +1 -140
- package/src/organisms/gv-schema-form-control-object.js +1 -140
- package/src/organisms/gv-schema-form-control.js +1 -416
- package/src/organisms/gv-schema-form.js +1 -646
- package/src/organisms/gv-tabs.js +1 -178
- package/src/organisms/gv-user-menu.js +1 -149
- package/src/organisms/gv-vertical-menu.js +1 -82
- package/src/policy-studio/gv-flow-step.js +1 -304
- package/src/policy-studio/gv-flow.js +1 -442
- package/src/policy-studio/gv-policy-studio-menu.js +1 -436
- package/src/policy-studio/gv-policy-studio.js +1 -1778
- package/src/styles/empty.js +1 -19
- package/src/styles/input.js +1 -19
- package/src/styles/link.js +1 -19
- package/src/styles/shapes.js +1 -18
- package/src/styles/skeleton.js +1 -19
- package/src/styles/zoom.js +1 -19
- package/src/theme/gv-theme.js +1 -164
- package/wc/gv-autocomplete.js +1 -1
- package/wc/gv-button.js +1 -1
- package/wc/gv-card-full.js +1 -1
- package/wc/gv-card-list.js +1 -1
- package/wc/gv-card.js +1 -1
- package/wc/gv-category-list.js +1 -1
- package/wc/gv-category.js +1 -1
- package/wc/gv-chart-bar.js +1 -1
- package/wc/gv-chart-gauge.js +1 -1
- package/wc/gv-chart-histogram.js +1 -1
- package/wc/gv-chart-line.js +1 -1
- package/wc/gv-chart-map.js +1 -1
- package/wc/gv-chart-pie.js +1 -1
- package/wc/gv-checkbox.js +1 -1
- package/wc/gv-code.js +1 -1
- package/wc/gv-confirm.js +1 -1
- package/wc/gv-cron-editor.js +1 -1
- package/wc/gv-date-picker-calendar.js +1 -1
- package/wc/gv-date-picker-cell.js +1 -1
- package/wc/gv-date-picker.js +1 -1
- package/wc/gv-documentation.js +1 -1
- package/wc/gv-dropdown-menu.js +1 -1
- package/wc/gv-expandable.js +1 -1
- package/wc/gv-expression-language.js +1 -1
- package/wc/gv-file-upload.js +1 -1
- package/wc/gv-flow-step.js +1 -1
- package/wc/gv-flow.js +1 -1
- package/wc/gv-header.js +1 -1
- package/wc/gv-http-client.js +1 -1
- package/wc/gv-icon.js +1 -1
- package/wc/gv-identity-picture.js +1 -1
- package/wc/gv-image.js +1 -1
- package/wc/gv-input-message.js +1 -1
- package/wc/gv-input.js +1 -1
- package/wc/gv-link.js +1 -1
- package/wc/gv-list.js +1 -1
- package/wc/gv-menu.js +1 -1
- package/wc/gv-message.js +1 -1
- package/wc/gv-metric.js +1 -1
- package/wc/gv-metrics.js +1 -1
- package/wc/gv-modal.js +1 -1
- package/wc/gv-nav.js +1 -1
- package/wc/gv-newsletter-subscription.js +1 -1
- package/wc/gv-option.js +1 -1
- package/wc/gv-pagination.js +1 -1
- package/wc/gv-plans.js +1 -1
- package/wc/gv-policy-studio-menu.js +1 -1
- package/wc/gv-policy-studio.js +1 -1
- package/wc/gv-popover.js +1 -1
- package/wc/gv-promote.js +1 -1
- package/wc/gv-properties.js +1 -1
- package/wc/gv-rating-list.js +1 -1
- package/wc/gv-rating.js +1 -1
- package/wc/gv-relative-time.js +1 -1
- package/wc/gv-resizable-views.js +1 -1
- package/wc/gv-resources.js +1 -1
- package/wc/gv-row-expandable.js +1 -1
- package/wc/gv-row.js +1 -1
- package/wc/gv-schema-form-array.js +1 -1
- package/wc/gv-schema-form-control-object.js +1 -1
- package/wc/gv-schema-form-control.js +1 -1
- package/wc/gv-schema-form.js +1 -1
- package/wc/gv-select-native.js +1 -1
- package/wc/gv-select.js +1 -1
- package/wc/gv-spinner.js +1 -1
- package/wc/gv-state.js +1 -1
- package/wc/gv-stats.js +1 -1
- package/wc/gv-stepper.js +1 -1
- package/wc/gv-switch.js +1 -1
- package/wc/gv-table.js +1 -1
- package/wc/gv-tabs.js +1 -1
- package/wc/gv-tag.js +1 -1
- package/wc/gv-text.js +1 -1
- package/wc/gv-theme.js +1 -1
- package/wc/gv-tree.js +1 -1
- package/wc/gv-user-menu.js +1 -1
- package/wc/gv-vertical-menu.js +1 -1
|
@@ -1,84 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Copyright (C) 2015 The Gravitee team (http://gravitee.io)
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { css, LitElement, html } from 'lit';
|
|
17
|
-
import { repeat } from 'lit/directives/repeat';
|
|
18
|
-
import { withResizeObserver } from '../mixins/with-resize-observer';
|
|
19
|
-
import { i18n } from '../lib/i18n';
|
|
20
|
-
import './gv-card-full';
|
|
21
|
-
/**
|
|
22
|
-
* List of cards
|
|
23
|
-
*
|
|
24
|
-
* ## Details
|
|
25
|
-
* * has @theme facet
|
|
26
|
-
*/
|
|
27
|
-
|
|
28
|
-
export class GvCardList extends withResizeObserver(LitElement) {
|
|
29
|
-
static get properties() {
|
|
30
|
-
return {
|
|
31
|
-
items: {
|
|
32
|
-
type: Array
|
|
33
|
-
}
|
|
34
|
-
};
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
constructor() {
|
|
38
|
-
super();
|
|
39
|
-
this.breakpoints = {
|
|
40
|
-
width: [845, 1270]
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
static get styles() {
|
|
45
|
-
return [// language=CSS
|
|
46
|
-
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}`];
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
renderItem(item, index) {
|
|
50
|
-
const _item = item && item.item ? item.item : null;
|
|
51
|
-
|
|
52
|
-
const _metrics = item && item.metrics ? item.metrics : null;
|
|
53
|
-
|
|
54
|
-
return html`<gv-card-full class="item" .item="${_item}" .metrics="${_metrics}"> </gv-card-full>`;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
render() {
|
|
58
|
-
if (this._error) {
|
|
59
|
-
return html`<div>${i18n('gv-card-list.error')}</div>`;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
if (this.items) {
|
|
63
|
-
return html`${repeat(this.items, item => item, (item, index) => this.renderItem(item, index))}`;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
return '';
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
updated(changedProperties) {
|
|
70
|
-
if (changedProperties.has('items')) {
|
|
71
|
-
if (this.items && this.items.length > 0) {
|
|
72
|
-
const items = this.shadowRoot.querySelectorAll('.item');
|
|
73
|
-
items.forEach((item, index) => {
|
|
74
|
-
setTimeout(() => {
|
|
75
|
-
item.classList.add('show');
|
|
76
|
-
}, index * 100);
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
}
|
|
83
|
-
window.customElements.define('gv-card-list', GvCardList);
|
|
84
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL21vbGVjdWxlcy9ndi1jYXJkLWxpc3QuanMiXSwibmFtZXMiOlsiY3NzIiwiTGl0RWxlbWVudCIsImh0bWwiLCJyZXBlYXQiLCJ3aXRoUmVzaXplT2JzZXJ2ZXIiLCJpMThuIiwiR3ZDYXJkTGlzdCIsInByb3BlcnRpZXMiLCJpdGVtcyIsInR5cGUiLCJBcnJheSIsImNvbnN0cnVjdG9yIiwiYnJlYWtwb2ludHMiLCJ3aWR0aCIsInN0eWxlcyIsInJlbmRlckl0ZW0iLCJpdGVtIiwiaW5kZXgiLCJfaXRlbSIsIl9tZXRyaWNzIiwibWV0cmljcyIsInJlbmRlciIsIl9lcnJvciIsInVwZGF0ZWQiLCJjaGFuZ2VkUHJvcGVydGllcyIsImhhcyIsImxlbmd0aCIsInNoYWRvd1Jvb3QiLCJxdWVyeVNlbGVjdG9yQWxsIiwiZm9yRWFjaCIsInNldFRpbWVvdXQiLCJjbGFzc0xpc3QiLCJhZGQiLCJ3aW5kb3ciLCJjdXN0b21FbGVtZW50cyIsImRlZmluZSJdLCJtYXBwaW5ncyI6IkFBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EsU0FBU0EsR0FBVCxFQUFjQyxVQUFkLEVBQTBCQyxJQUExQixRQUFzQyxLQUF0QztBQUNBLFNBQVNDLE1BQVQsUUFBdUIsdUJBQXZCO0FBQ0EsU0FBU0Msa0JBQVQsUUFBbUMsZ0NBQW5DO0FBQ0EsU0FBU0MsSUFBVCxRQUFxQixhQUFyQjtBQUNBLE9BQU8sZ0JBQVA7QUFFQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7O0FBQ0EsT0FBTyxNQUFNQyxVQUFOLFNBQXlCRixrQkFBa0IsQ0FBQ0gsVUFBRCxDQUEzQyxDQUF3RDtBQUN4QyxhQUFWTSxVQUFVLEdBQUc7QUFDdEIsV0FBTztBQUNMQyxNQUFBQSxLQUFLLEVBQUU7QUFBRUMsUUFBQUEsSUFBSSxFQUFFQztBQUFSO0FBREYsS0FBUDtBQUdEOztBQUVEQyxFQUFBQSxXQUFXLEdBQUc7QUFDWjtBQUNBLFNBQUtDLFdBQUwsR0FBbUI7QUFDakJDLE1BQUFBLEtBQUssRUFBRSxDQUFDLEdBQUQsRUFBTSxJQUFOO0FBRFUsS0FBbkI7QUFHRDs7QUFFZ0IsYUFBTkMsTUFBTSxHQUFHO0FBQ2xCLFdBQU8sQ0FDTDtBQUNBZCxJQUFBQSxHQUFHLHlWQUZFLENBQVA7QUFpQ0Q7O0FBRURlLEVBQUFBLFVBQVUsQ0FBQ0MsSUFBRCxFQUFPQyxLQUFQLEVBQWM7QUFDdEIsVUFBTUMsS0FBSyxHQUFHRixJQUFJLElBQUlBLElBQUksQ0FBQ0EsSUFBYixHQUFvQkEsSUFBSSxDQUFDQSxJQUF6QixHQUFnQyxJQUE5Qzs7QUFDQSxVQUFNRyxRQUFRLEdBQUdILElBQUksSUFBSUEsSUFBSSxDQUFDSSxPQUFiLEdBQXVCSixJQUFJLENBQUNJLE9BQTVCLEdBQXNDLElBQXZEOztBQUNBLFdBQU9sQixJQUFJLHFDQUFxQ2dCLEtBQXJDLGVBQXlEQyxRQUF6RCxvQkFBWDtBQUNEOztBQUVERSxFQUFBQSxNQUFNLEdBQUc7QUFDUCxRQUFJLEtBQUtDLE1BQVQsRUFBaUI7QUFDZixhQUFPcEIsSUFBSSxRQUFRRyxJQUFJLENBQUMsb0JBQUQsQ0FBWixRQUFYO0FBQ0Q7O0FBRUQsUUFBSSxLQUFLRyxLQUFULEVBQWdCO0FBQ2QsYUFBT04sSUFBSSxHQUFHQyxNQUFNLENBQ2xCLEtBQUtLLEtBRGEsRUFFakJRLElBQUQsSUFBVUEsSUFGUSxFQUdsQixDQUFDQSxJQUFELEVBQU9DLEtBQVAsS0FBaUIsS0FBS0YsVUFBTCxDQUFnQkMsSUFBaEIsRUFBc0JDLEtBQXRCLENBSEMsQ0FBVCxFQUFYO0FBS0Q7O0FBQ0QsV0FBTyxFQUFQO0FBQ0Q7O0FBRURNLEVBQUFBLE9BQU8sQ0FBQ0MsaUJBQUQsRUFBb0I7QUFDekIsUUFBSUEsaUJBQWlCLENBQUNDLEdBQWxCLENBQXNCLE9BQXRCLENBQUosRUFBb0M7QUFDbEMsVUFBSSxLQUFLakIsS0FBTCxJQUFjLEtBQUtBLEtBQUwsQ0FBV2tCLE1BQVgsR0FBb0IsQ0FBdEMsRUFBeUM7QUFDdkMsY0FBTWxCLEtBQUssR0FBRyxLQUFLbUIsVUFBTCxDQUFnQkMsZ0JBQWhCLENBQWlDLE9BQWpDLENBQWQ7QUFDQXBCLFFBQUFBLEtBQUssQ0FBQ3FCLE9BQU4sQ0FBYyxDQUFDYixJQUFELEVBQU9DLEtBQVAsS0FBaUI7QUFDN0JhLFVBQUFBLFVBQVUsQ0FBQyxNQUFNO0FBQ2ZkLFlBQUFBLElBQUksQ0FBQ2UsU0FBTCxDQUFlQyxHQUFmLENBQW1CLE1BQW5CO0FBQ0QsV0FGUyxFQUVQZixLQUFLLEdBQUcsR0FGRCxDQUFWO0FBR0QsU0FKRDtBQUtEO0FBQ0Y7QUFDRjs7QUFsRjREO0FBcUYvRGdCLE1BQU0sQ0FBQ0MsY0FBUCxDQUFzQkMsTUFBdEIsQ0FBNkIsY0FBN0IsRUFBNkM3QixVQUE3QyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTUgVGhlIEdyYXZpdGVlIHRlYW0gKGh0dHA6Ly9ncmF2aXRlZS5pbylcbiAqXG4gKiBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG5pbXBvcnQgeyBjc3MsIExpdEVsZW1lbnQsIGh0bWwgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgcmVwZWF0IH0gZnJvbSAnbGl0L2RpcmVjdGl2ZXMvcmVwZWF0JztcbmltcG9ydCB7IHdpdGhSZXNpemVPYnNlcnZlciB9IGZyb20gJy4uL21peGlucy93aXRoLXJlc2l6ZS1vYnNlcnZlcic7XG5pbXBvcnQgeyBpMThuIH0gZnJvbSAnLi4vbGliL2kxOG4nO1xuaW1wb3J0ICcuL2d2LWNhcmQtZnVsbCc7XG5cbi8qKlxuICogTGlzdCBvZiBjYXJkc1xuICpcbiAqICMjIERldGFpbHNcbiAqICogaGFzIEB0aGVtZSBmYWNldFxuICovXG5leHBvcnQgY2xhc3MgR3ZDYXJkTGlzdCBleHRlbmRzIHdpdGhSZXNpemVPYnNlcnZlcihMaXRFbGVtZW50KSB7XG4gIHN0YXRpYyBnZXQgcHJvcGVydGllcygpIHtcbiAgICByZXR1cm4ge1xuICAgICAgaXRlbXM6IHsgdHlwZTogQXJyYXkgfSxcbiAgICB9O1xuICB9XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICB0aGlzLmJyZWFrcG9pbnRzID0ge1xuICAgICAgd2lkdGg6IFs4NDUsIDEyNzBdLFxuICAgIH07XG4gIH1cblxuICBzdGF0aWMgZ2V0IHN0eWxlcygpIHtcbiAgICByZXR1cm4gW1xuICAgICAgLy8gbGFuZ3VhZ2U9Q1NTXG4gICAgICBjc3NgXG4gICAgICAgIDpob3N0IHtcbiAgICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoMywgMWZyKTtcbiAgICAgICAgICBncmlkLWdhcDogMC41cmVtO1xuICAgICAgICB9XG5cbiAgICAgICAgOmhvc3QoW3ctbHQtMTI3MF0pIC5jb250YWluZXIge1xuICAgICAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogcmVwZWF0KDIsIDFmcik7XG4gICAgICAgIH1cblxuICAgICAgICA6aG9zdChbdy1sdC04NDVdKSAuY29udGFpbmVyIHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgIH1cblxuICAgICAgICA6aG9zdChbdy1sdC04NDVdKSAuY29udGFpbmVyID4gLml0ZW0ge1xuICAgICAgICAgIGZsZXg6IDAgMSBhdXRvO1xuICAgICAgICB9XG5cbiAgICAgICAgLml0ZW0ge1xuICAgICAgICAgIG9wYWNpdHk6IDA7XG4gICAgICAgICAgdHJhbnNpdGlvbjogb3BhY2l0eSAxMDBtcyBlYXNlLWluLW91dDtcbiAgICAgICAgfVxuXG4gICAgICAgIC5pdGVtLnNob3cge1xuICAgICAgICAgIG9wYWNpdHk6IDE7XG4gICAgICAgIH1cbiAgICAgIGAsXG4gICAgXTtcbiAgfVxuXG4gIHJlbmRlckl0ZW0oaXRlbSwgaW5kZXgpIHtcbiAgICBjb25zdCBfaXRlbSA9IGl0ZW0gJiYgaXRlbS5pdGVtID8gaXRlbS5pdGVtIDogbnVsbDtcbiAgICBjb25zdCBfbWV0cmljcyA9IGl0ZW0gJiYgaXRlbS5tZXRyaWNzID8gaXRlbS5tZXRyaWNzIDogbnVsbDtcbiAgICByZXR1cm4gaHRtbGA8Z3YtY2FyZC1mdWxsIGNsYXNzPVwiaXRlbVwiIC5pdGVtPVwiJHtfaXRlbX1cIiAubWV0cmljcz1cIiR7X21ldHJpY3N9XCI+IDwvZ3YtY2FyZC1mdWxsPmA7XG4gIH1cblxuICByZW5kZXIoKSB7XG4gICAgaWYgKHRoaXMuX2Vycm9yKSB7XG4gICAgICByZXR1cm4gaHRtbGA8ZGl2PiR7aTE4bignZ3YtY2FyZC1saXN0LmVycm9yJyl9PC9kaXY+YDtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5pdGVtcykge1xuICAgICAgcmV0dXJuIGh0bWxgJHtyZXBlYXQoXG4gICAgICAgIHRoaXMuaXRlbXMsXG4gICAgICAgIChpdGVtKSA9PiBpdGVtLFxuICAgICAgICAoaXRlbSwgaW5kZXgpID0+IHRoaXMucmVuZGVySXRlbShpdGVtLCBpbmRleCksXG4gICAgICApfWA7XG4gICAgfVxuICAgIHJldHVybiAnJztcbiAgfVxuXG4gIHVwZGF0ZWQoY2hhbmdlZFByb3BlcnRpZXMpIHtcbiAgICBpZiAoY2hhbmdlZFByb3BlcnRpZXMuaGFzKCdpdGVtcycpKSB7XG4gICAgICBpZiAodGhpcy5pdGVtcyAmJiB0aGlzLml0ZW1zLmxlbmd0aCA+IDApIHtcbiAgICAgICAgY29uc3QgaXRlbXMgPSB0aGlzLnNoYWRvd1Jvb3QucXVlcnlTZWxlY3RvckFsbCgnLml0ZW0nKTtcbiAgICAgICAgaXRlbXMuZm9yRWFjaCgoaXRlbSwgaW5kZXgpID0+IHtcbiAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgIGl0ZW0uY2xhc3NMaXN0LmFkZCgnc2hvdycpO1xuICAgICAgICAgIH0sIGluZGV4ICogMTAwKTtcbiAgICAgICAgfSk7XG4gICAgICB9XG4gICAgfVxuICB9XG59XG5cbndpbmRvdy5jdXN0b21FbGVtZW50cy5kZWZpbmUoJ2d2LWNhcmQtbGlzdCcsIEd2Q2FyZExpc3QpO1xuIl19
|
|
1
|
+
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
CHANGED
|
@@ -1,59 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Copyright (C) 2015 The Gravitee team (http://gravitee.io)
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { css, LitElement, html } from 'lit';
|
|
17
|
-
import { skeleton } from '../styles/skeleton';
|
|
18
|
-
import { classMap } from 'lit/directives/class-map';
|
|
19
|
-
import '../atoms/gv-image';
|
|
20
|
-
import '../atoms/gv-button';
|
|
21
|
-
import { i18n } from '../lib/i18n';
|
|
22
|
-
import { ItemResource } from '../mixins/item-resource';
|
|
23
|
-
import { getVersion, getTitle } from '../lib/item';
|
|
24
|
-
/**
|
|
25
|
-
* Card component
|
|
26
|
-
*
|
|
27
|
-
* ## Details
|
|
28
|
-
* * has @theme facet
|
|
29
|
-
*
|
|
30
|
-
* @attr {Promise<any>} item - An item.
|
|
31
|
-
*
|
|
32
|
-
* @cssprop {Color} [--gv-card--bgc=var(--gv-theme-neutral-color-lightest, #ffffff)] - Background color
|
|
33
|
-
*/
|
|
34
|
-
|
|
35
|
-
export class GvCard extends ItemResource(LitElement) {
|
|
36
|
-
static get styles() {
|
|
37
|
-
return [...super.styles, // language=CSS
|
|
38
|
-
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}`, skeleton];
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
render() {
|
|
42
|
-
const title = getTitle(this._item);
|
|
43
|
-
return html`<div class="card" title="${title}"> <span class="${classMap({
|
|
44
|
-
skeleton: this._skeleton,
|
|
45
|
-
version: true
|
|
46
|
-
})}">${getVersion(this._item)}</span> <div class="${classMap({
|
|
47
|
-
image: true,
|
|
48
|
-
skeleton: this._skeleton
|
|
49
|
-
})}">${this._renderImage()}</div> <div class="${classMap({
|
|
50
|
-
content: true,
|
|
51
|
-
empty: this._error || this._empty
|
|
52
|
-
})}"> ${this._error || this._empty ? html` <span>${this._error ? i18n('gv-card.error') : i18n('gv-card.empty')}</span> ` : html` <div class="${classMap({
|
|
53
|
-
skeleton: this._skeleton
|
|
54
|
-
})}"> <span class="title">${title}</span> </div> <div>${this._renderStates()}</div>`} </div> </div>`;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
}
|
|
58
|
-
window.customElements.define('gv-card', GvCard);
|
|
59
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL21vbGVjdWxlcy9ndi1jYXJkLmpzIl0sIm5hbWVzIjpbImNzcyIsIkxpdEVsZW1lbnQiLCJodG1sIiwic2tlbGV0b24iLCJjbGFzc01hcCIsImkxOG4iLCJJdGVtUmVzb3VyY2UiLCJnZXRWZXJzaW9uIiwiZ2V0VGl0bGUiLCJHdkNhcmQiLCJzdHlsZXMiLCJyZW5kZXIiLCJ0aXRsZSIsIl9pdGVtIiwiX3NrZWxldG9uIiwidmVyc2lvbiIsImltYWdlIiwiX3JlbmRlckltYWdlIiwiY29udGVudCIsImVtcHR5IiwiX2Vycm9yIiwiX2VtcHR5IiwiX3JlbmRlclN0YXRlcyIsIndpbmRvdyIsImN1c3RvbUVsZW1lbnRzIiwiZGVmaW5lIl0sIm1hcHBpbmdzIjoiQUFBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQSxTQUFTQSxHQUFULEVBQWNDLFVBQWQsRUFBMEJDLElBQTFCLFFBQXNDLEtBQXRDO0FBQ0EsU0FBU0MsUUFBVCxRQUF5QixvQkFBekI7QUFDQSxTQUFTQyxRQUFULFFBQXlCLDBCQUF6QjtBQUNBLE9BQU8sbUJBQVA7QUFDQSxPQUFPLG9CQUFQO0FBQ0EsU0FBU0MsSUFBVCxRQUFxQixhQUFyQjtBQUNBLFNBQVNDLFlBQVQsUUFBNkIseUJBQTdCO0FBQ0EsU0FBU0MsVUFBVCxFQUFxQkMsUUFBckIsUUFBcUMsYUFBckM7QUFFQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTs7QUFDQSxPQUFPLE1BQU1DLE1BQU4sU0FBcUJILFlBQVksQ0FBQ0wsVUFBRCxDQUFqQyxDQUE4QztBQUNsQyxhQUFOUyxNQUFNLEdBQUc7QUFDbEIsV0FBTyxDQUNMLEdBQUcsTUFBTUEsTUFESixFQUVMO0FBQ0FWLElBQUFBLEdBQUcseW1DQUhFLEVBMEVMRyxRQTFFSyxDQUFQO0FBNEVEOztBQUVEUSxFQUFBQSxNQUFNLEdBQUc7QUFDUCxVQUFNQyxLQUFLLEdBQUdKLFFBQVEsQ0FBQyxLQUFLSyxLQUFOLENBQXRCO0FBQ0EsV0FBT1gsSUFBSSw0QkFBNEJVLEtBQTVCLG1CQUNNUixRQUFRLENBQUM7QUFBRUQsTUFBQUEsUUFBUSxFQUFFLEtBQUtXLFNBQWpCO0FBQTRCQyxNQUFBQSxPQUFPLEVBQUU7QUFBckMsS0FBRCxDQURkLEtBQ2dFUixVQUFVLENBQUMsS0FBS00sS0FBTixDQUQxRSx1QkFFS1QsUUFBUSxDQUFDO0FBQUVZLE1BQUFBLEtBQUssRUFBRSxJQUFUO0FBQWViLE1BQUFBLFFBQVEsRUFBRSxLQUFLVztBQUE5QixLQUFELENBRmIsS0FFNkQsS0FBS0csWUFBTCxFQUY3RCxzQkFJS2IsUUFBUSxDQUFDO0FBQUVjLE1BQUFBLE9BQU8sRUFBRSxJQUFYO0FBQWlCQyxNQUFBQSxLQUFLLEVBQUUsS0FBS0MsTUFBTCxJQUFlLEtBQUtDO0FBQTVDLEtBQUQsQ0FKYixNQUtMLEtBQUtELE1BQUwsSUFBZSxLQUFLQyxNQUFwQixHQUNFbkIsSUFBSSxVQUFVLEtBQUtrQixNQUFMLEdBQWNmLElBQUksQ0FBQyxlQUFELENBQWxCLEdBQXNDQSxJQUFJLENBQUMsZUFBRCxDQUFwRCxVQUROLEdBRUVILElBQUksZ0JBQWdCRSxRQUFRLENBQUM7QUFBRUQsTUFBQUEsUUFBUSxFQUFFLEtBQUtXO0FBQWpCLEtBQUQsQ0FBeEIsMEJBQ3NCRixLQUR0Qix1QkFHSyxLQUFLVSxhQUFMLEVBSEwsUUFQRCxnQkFBWDtBQWFEOztBQS9Ga0Q7QUFrR3JEQyxNQUFNLENBQUNDLGNBQVAsQ0FBc0JDLE1BQXRCLENBQTZCLFNBQTdCLEVBQXdDaEIsTUFBeEMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChDKSAyMDE1IFRoZSBHcmF2aXRlZSB0ZWFtIChodHRwOi8vZ3Jhdml0ZWUuaW8pXG4gKlxuICogTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuaW1wb3J0IHsgY3NzLCBMaXRFbGVtZW50LCBodG1sIH0gZnJvbSAnbGl0JztcbmltcG9ydCB7IHNrZWxldG9uIH0gZnJvbSAnLi4vc3R5bGVzL3NrZWxldG9uJztcbmltcG9ydCB7IGNsYXNzTWFwIH0gZnJvbSAnbGl0L2RpcmVjdGl2ZXMvY2xhc3MtbWFwJztcbmltcG9ydCAnLi4vYXRvbXMvZ3YtaW1hZ2UnO1xuaW1wb3J0ICcuLi9hdG9tcy9ndi1idXR0b24nO1xuaW1wb3J0IHsgaTE4biB9IGZyb20gJy4uL2xpYi9pMThuJztcbmltcG9ydCB7IEl0ZW1SZXNvdXJjZSB9IGZyb20gJy4uL21peGlucy9pdGVtLXJlc291cmNlJztcbmltcG9ydCB7IGdldFZlcnNpb24sIGdldFRpdGxlIH0gZnJvbSAnLi4vbGliL2l0ZW0nO1xuXG4vKipcbiAqIENhcmQgY29tcG9uZW50XG4gKlxuICogIyMgRGV0YWlsc1xuICogKiBoYXMgQHRoZW1lIGZhY2V0XG4gKlxuICogQGF0dHIge1Byb21pc2U8YW55Pn0gaXRlbSAtIEFuIGl0ZW0uXG4gKlxuICogQGNzc3Byb3Age0NvbG9yfSBbLS1ndi1jYXJkLS1iZ2M9dmFyKC0tZ3YtdGhlbWUtbmV1dHJhbC1jb2xvci1saWdodGVzdCwgI2ZmZmZmZildIC0gQmFja2dyb3VuZCBjb2xvclxuICovXG5leHBvcnQgY2xhc3MgR3ZDYXJkIGV4dGVuZHMgSXRlbVJlc291cmNlKExpdEVsZW1lbnQpIHtcbiAgc3RhdGljIGdldCBzdHlsZXMoKSB7XG4gICAgcmV0dXJuIFtcbiAgICAgIC4uLnN1cGVyLnN0eWxlcyxcbiAgICAgIC8vIGxhbmd1YWdlPUNTU1xuICAgICAgY3NzYFxuICAgICAgICA6aG9zdCB7XG4gICAgICAgICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICAgICAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gICAgICAgICAgbWFyZ2luOiAwLjJyZW07XG4gICAgICAgICAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbiAgICAgICAgICB3aWR0aDogMTQ0cHg7XG4gICAgICAgICAgbWF4LWhlaWdodDogMTQ0cHg7XG4gICAgICAgIH1cblxuICAgICAgICBndi1pZGVudGl0eS1waWN0dXJlIHtcbiAgICAgICAgICB3aWR0aDogNjVweDtcbiAgICAgICAgICBoZWlnaHQ6IDY1cHg7XG4gICAgICAgICAgLS1ndi1pbWFnZS0tb2Y6IGNvbnRhaW47XG4gICAgICAgIH1cblxuICAgICAgICAuY2FyZCB7XG4gICAgICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICAgICAgICBtYXgtd2lkdGg6IDE0NHB4O1xuICAgICAgICAgIG1pbi1oZWlnaHQ6IDE0NHB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDJweDtcbiAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1ndi1jYXJkLS1iZ2MsIHZhcigtLWd2LXRoZW1lLW5ldXRyYWwtY29sb3ItbGlnaHRlc3QsICNmZmZmZmYpKTtcbiAgICAgICAgICBjb2xvcjogdmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1kYXJrLCAjMjYyNjI2KTtcbiAgICAgICAgICBib3gtc2hhZG93OiAwIDAgMCAxcHggdmFyKC0tZ3YtdGhlbWUtbmV1dHJhbC1jb2xvciwgI2Y1ZjVmNSksIDAgMXB4IDNweCB2YXIoLS1ndi10aGVtZS1uZXV0cmFsLWNvbG9yLWRhcmssICNiZmJmYmYpO1xuICAgICAgICAgIHRyYW5zaXRpb246IGFsbCAwLjNzO1xuICAgICAgICB9XG5cbiAgICAgICAgLmNhcmQ6aG92ZXIge1xuICAgICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgtNHB4KTtcbiAgICAgICAgICBib3gtc2hhZG93OiAwIDEwcHggMjBweCAtMTBweCB2YXIoLS1ndi10aGVtZS1uZXV0cmFsLWNvbG9yLWRhcmssICNiZmJmYmYpO1xuICAgICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgfVxuXG4gICAgICAgIC5jb250ZW50ID4gZGl2IHtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICAgIG1hcmdpbi1ib3R0b206IDAuMnJlbTtcbiAgICAgICAgfVxuXG4gICAgICAgIC5pbWFnZSB7XG4gICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICBmbGV4OiAxO1xuICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgICAgIHBhZGRpbmctdG9wOiAwLjJyZW07XG4gICAgICAgIH1cblxuICAgICAgICAudGl0bGUge1xuICAgICAgICAgIGxpbmUtaGVpZ2h0OiAyMnB4O1xuICAgICAgICAgIGZvbnQtc2l6ZTogdmFyKC0tZ3YtdGhlbWUtZm9udC1zaXplLXMsIDEycHgpO1xuICAgICAgICAgIHRleHQtdHJhbnNmb3JtOiBjYXBpdGFsaXplO1xuICAgICAgICAgIGZvbnQtd2VpZ2h0OiBib2xkO1xuICAgICAgICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgICAgICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICAgICAgfVxuXG4gICAgICAgIC5jb250ZW50IHtcbiAgICAgICAgICBmbGV4OiAxO1xuICAgICAgICAgIHBhZGRpbmc6IDZweCAxNnB4IDEycHg7XG4gICAgICAgIH1cblxuICAgICAgICAudmVyc2lvbiB7XG4gICAgICAgICAgY29sb3I6IHZhcigtLWd2LXRoZW1lLW5ldXRyYWwtY29sb3ItZGFyaywgI2Q5ZDlkOSk7XG4gICAgICAgICAgdG9wOiAwLjRyZW07XG4gICAgICAgICAgcmlnaHQ6IDAuNHJlbTtcbiAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgIH1cbiAgICAgIGAsXG4gICAgICBza2VsZXRvbixcbiAgICBdO1xuICB9XG5cbiAgcmVuZGVyKCkge1xuICAgIGNvbnN0IHRpdGxlID0gZ2V0VGl0bGUodGhpcy5faXRlbSk7XG4gICAgcmV0dXJuIGh0bWxgPGRpdiBjbGFzcz1cImNhcmRcIiB0aXRsZT1cIiR7dGl0bGV9XCI+XG4gICAgICA8c3BhbiBjbGFzcz1cIiR7Y2xhc3NNYXAoeyBza2VsZXRvbjogdGhpcy5fc2tlbGV0b24sIHZlcnNpb246IHRydWUgfSl9XCI+JHtnZXRWZXJzaW9uKHRoaXMuX2l0ZW0pfTwvc3Bhbj5cbiAgICAgIDxkaXYgY2xhc3M9XCIke2NsYXNzTWFwKHsgaW1hZ2U6IHRydWUsIHNrZWxldG9uOiB0aGlzLl9za2VsZXRvbiB9KX1cIj4ke3RoaXMuX3JlbmRlckltYWdlKCl9PC9kaXY+XG5cbiAgICAgIDxkaXYgY2xhc3M9XCIke2NsYXNzTWFwKHsgY29udGVudDogdHJ1ZSwgZW1wdHk6IHRoaXMuX2Vycm9yIHx8IHRoaXMuX2VtcHR5IH0pfVwiPlxuICAgICAgICAke3RoaXMuX2Vycm9yIHx8IHRoaXMuX2VtcHR5XG4gICAgICAgICAgPyBodG1sYCA8c3Bhbj4ke3RoaXMuX2Vycm9yID8gaTE4bignZ3YtY2FyZC5lcnJvcicpIDogaTE4bignZ3YtY2FyZC5lbXB0eScpfTwvc3Bhbj4gYFxuICAgICAgICAgIDogaHRtbGAgPGRpdiBjbGFzcz1cIiR7Y2xhc3NNYXAoeyBza2VsZXRvbjogdGhpcy5fc2tlbGV0b24gfSl9XCI+XG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJ0aXRsZVwiPiR7dGl0bGV9PC9zcGFuPlxuICAgICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgICAgPGRpdj4ke3RoaXMuX3JlbmRlclN0YXRlcygpfTwvZGl2PmB9XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5gO1xuICB9XG59XG5cbndpbmRvdy5jdXN0b21FbGVtZW50cy5kZWZpbmUoJ2d2LWNhcmQnLCBHdkNhcmQpO1xuIl19
|
|
1
|
+
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);
|
|
@@ -1,49 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Copyright (C) 2015 The Gravitee team (http://gravitee.io)
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { css, html } from 'lit';
|
|
17
|
-
import './gv-category';
|
|
18
|
-
import { GvCardList } from './gv-card-list';
|
|
19
|
-
/**
|
|
20
|
-
* List of categories
|
|
21
|
-
*
|
|
22
|
-
* ## Details
|
|
23
|
-
* * has @theme facet
|
|
24
|
-
*
|
|
25
|
-
* @cssprop {Color} [--gv-category-list--bgc-1=#cce6eb] - Category background color 1
|
|
26
|
-
* @cssprop {Color} [--gv-category-list--bgc-2=#fcf1a8] - Category background color 2
|
|
27
|
-
* @cssprop {Color} [--gv-category-list--bgc-3=#d9d4f1] - Category background color 3
|
|
28
|
-
* @cssprop {Color} [--gv-category-list--bgc-4=#f9c15e] - Category background color 4
|
|
29
|
-
* @cssprop {Color} [--gv-category-list--bgc-5=#d4fccd] - Category background color 5
|
|
30
|
-
* @cssprop {Color} [--gv-category-list--bgc-6=#e0c8b2] - Category background color 6
|
|
31
|
-
*/
|
|
32
|
-
|
|
33
|
-
export class GvCategoryList extends GvCardList {
|
|
34
|
-
static get styles() {
|
|
35
|
-
return [...super.styles, // language=CSS
|
|
36
|
-
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)}`];
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
renderItem(item, index) {
|
|
40
|
-
return html`<gv-category class="item" .category="${item || null}" style="${this._getCategoryBackgroundColor(index)}"> </gv-category>`;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
_getCategoryBackgroundColor(index) {
|
|
44
|
-
return `--gv-category--bgc: var(--bgc-${index % 6 + 1})`;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
}
|
|
48
|
-
window.customElements.define('gv-category-list', GvCategoryList);
|
|
49
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL21vbGVjdWxlcy9ndi1jYXRlZ29yeS1saXN0LmpzIl0sIm5hbWVzIjpbImNzcyIsImh0bWwiLCJHdkNhcmRMaXN0IiwiR3ZDYXRlZ29yeUxpc3QiLCJzdHlsZXMiLCJyZW5kZXJJdGVtIiwiaXRlbSIsImluZGV4IiwiX2dldENhdGVnb3J5QmFja2dyb3VuZENvbG9yIiwid2luZG93IiwiY3VzdG9tRWxlbWVudHMiLCJkZWZpbmUiXSwibWFwcGluZ3MiOiJBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBLFNBQVNBLEdBQVQsRUFBY0MsSUFBZCxRQUEwQixLQUExQjtBQUNBLE9BQU8sZUFBUDtBQUNBLFNBQVNDLFVBQVQsUUFBMkIsZ0JBQTNCO0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7O0FBQ0EsT0FBTyxNQUFNQyxjQUFOLFNBQTZCRCxVQUE3QixDQUF3QztBQUM1QixhQUFORSxNQUFNLEdBQUc7QUFDbEIsV0FBTyxDQUNMLEdBQUcsTUFBTUEsTUFESixFQUVMO0FBQ0FKLElBQUFBLEdBQUcsd1NBSEUsQ0FBUDtBQWNEOztBQUVESyxFQUFBQSxVQUFVLENBQUNDLElBQUQsRUFBT0MsS0FBUCxFQUFjO0FBQ3RCLFdBQU9OLElBQUksd0NBQXdDSyxJQUFJLElBQUksSUFBaEQsWUFBZ0UsS0FBS0UsMkJBQUwsQ0FBaUNELEtBQWpDLENBQWhFLG1CQUFYO0FBQ0Q7O0FBRURDLEVBQUFBLDJCQUEyQixDQUFDRCxLQUFELEVBQVE7QUFDakMsV0FBUSxpQ0FBaUNBLEtBQUssR0FBRyxDQUFULEdBQWMsQ0FBRSxHQUF4RDtBQUNEOztBQXhCNEM7QUEyQi9DRSxNQUFNLENBQUNDLGNBQVAsQ0FBc0JDLE1BQXRCLENBQTZCLGtCQUE3QixFQUFpRFIsY0FBakQiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChDKSAyMDE1IFRoZSBHcmF2aXRlZSB0ZWFtIChodHRwOi8vZ3Jhdml0ZWUuaW8pXG4gKlxuICogTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuaW1wb3J0IHsgY3NzLCBodG1sIH0gZnJvbSAnbGl0JztcbmltcG9ydCAnLi9ndi1jYXRlZ29yeSc7XG5pbXBvcnQgeyBHdkNhcmRMaXN0IH0gZnJvbSAnLi9ndi1jYXJkLWxpc3QnO1xuXG4vKipcbiAqIExpc3Qgb2YgY2F0ZWdvcmllc1xuICpcbiAqICMjIERldGFpbHNcbiAqICogaGFzIEB0aGVtZSBmYWNldFxuICpcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTE9I2NjZTZlYl0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDFcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTI9I2ZjZjFhOF0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDJcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTM9I2Q5ZDRmMV0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDNcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTQ9I2Y5YzE1ZV0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDRcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTU9I2Q0ZmNjZF0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDVcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTY9I2UwYzhiMl0gLSBDYXRlZ29yeSBiYWNrZ3JvdW5kIGNvbG9yIDZcbiAqL1xuZXhwb3J0IGNsYXNzIEd2Q2F0ZWdvcnlMaXN0IGV4dGVuZHMgR3ZDYXJkTGlzdCB7XG4gIHN0YXRpYyBnZXQgc3R5bGVzKCkge1xuICAgIHJldHVybiBbXG4gICAgICAuLi5zdXBlci5zdHlsZXMsXG4gICAgICAvLyBsYW5ndWFnZT1DU1NcbiAgICAgIGNzc2BcbiAgICAgICAgOmhvc3Qge1xuICAgICAgICAgIC0tYmdjLTE6IHZhcigtLWd2LWNhdGVnb3J5LWxpc3QtLWJnYy0xLCAjY2NlNmViKTtcbiAgICAgICAgICAtLWJnYy0yOiB2YXIoLS1ndi1jYXRlZ29yeS1saXN0LS1iZ2MtMiwgI2ZjZjFhOCk7XG4gICAgICAgICAgLS1iZ2MtMzogdmFyKC0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTMsICNkOWQ0ZjEpO1xuICAgICAgICAgIC0tYmdjLTQ6IHZhcigtLWd2LWNhdGVnb3J5LWxpc3QtLWJnYy00LCAjZjljMTVlKTtcbiAgICAgICAgICAtLWJnYy01OiB2YXIoLS1ndi1jYXRlZ29yeS1saXN0LS1iZ2MtNSwgI2Q0ZmNjZCk7XG4gICAgICAgICAgLS1iZ2MtNjogdmFyKC0tZ3YtY2F0ZWdvcnktbGlzdC0tYmdjLTYsICNlMGM4YjIpO1xuICAgICAgICB9XG4gICAgICBgLFxuICAgIF07XG4gIH1cblxuICByZW5kZXJJdGVtKGl0ZW0sIGluZGV4KSB7XG4gICAgcmV0dXJuIGh0bWxgPGd2LWNhdGVnb3J5IGNsYXNzPVwiaXRlbVwiIC5jYXRlZ29yeT1cIiR7aXRlbSB8fCBudWxsfVwiIHN0eWxlPVwiJHt0aGlzLl9nZXRDYXRlZ29yeUJhY2tncm91bmRDb2xvcihpbmRleCl9XCI+IDwvZ3YtY2F0ZWdvcnk+YDtcbiAgfVxuXG4gIF9nZXRDYXRlZ29yeUJhY2tncm91bmRDb2xvcihpbmRleCkge1xuICAgIHJldHVybiBgLS1ndi1jYXRlZ29yeS0tYmdjOiB2YXIoLS1iZ2MtJHsoaW5kZXggJSA2KSArIDF9KWA7XG4gIH1cbn1cblxud2luZG93LmN1c3RvbUVsZW1lbnRzLmRlZmluZSgnZ3YtY2F0ZWdvcnktbGlzdCcsIEd2Q2F0ZWdvcnlMaXN0KTtcbiJdfQ==
|
|
1
|
+
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);
|
|
@@ -1,90 +1 @@
|
|
|
1
|
-
|
|
2
|
-
* Copyright (C) 2015 The Gravitee team (http://gravitee.io)
|
|
3
|
-
*
|
|
4
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
-
* you may not use this file except in compliance with the License.
|
|
6
|
-
* You may obtain a copy of the License at
|
|
7
|
-
*
|
|
8
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
-
* See the License for the specific language governing permissions and
|
|
14
|
-
* limitations under the License.
|
|
15
|
-
*/
|
|
16
|
-
import { LitElement, html, css } from 'lit';
|
|
17
|
-
import { truncate } from '../lib/utils';
|
|
18
|
-
import { classMap } from 'lit/directives/class-map';
|
|
19
|
-
import { dispatchCustomEvent } from '../lib/events';
|
|
20
|
-
import { i18n } from '../lib/i18n';
|
|
21
|
-
import { withSkeletonAttribute } from '../mixins/with-skeleton-attribute';
|
|
22
|
-
/**
|
|
23
|
-
* A card used to display a category
|
|
24
|
-
*
|
|
25
|
-
* ## Details
|
|
26
|
-
* * has @theme facet
|
|
27
|
-
*
|
|
28
|
-
* @fires gv-category:click - Custom click event
|
|
29
|
-
*
|
|
30
|
-
* @attr {Promise<{name, description, _links: { picture }, total_apis}>} category - A category object
|
|
31
|
-
* @attr {Length} limit - number of characters that can be display in the description. If _description_ is greater, it will be truncated.
|
|
32
|
-
*
|
|
33
|
-
* @cssprop {Color} [--gv-category--bgc=var(--gv-theme-neutral-color-lightest, #ffffff)] - Background color
|
|
34
|
-
* @cssprop {Color} [--gv-category--c=var(--gv-theme-font-color-dark, #262626)] - Color
|
|
35
|
-
* @cssprop {Length} [--gv-category--h=200px] - Height
|
|
36
|
-
*/
|
|
37
|
-
|
|
38
|
-
export class GvCategory extends withSkeletonAttribute(LitElement) {
|
|
39
|
-
static get properties() {
|
|
40
|
-
return {
|
|
41
|
-
category: {
|
|
42
|
-
type: Object
|
|
43
|
-
},
|
|
44
|
-
limit: {
|
|
45
|
-
type: Number
|
|
46
|
-
},
|
|
47
|
-
_category: {
|
|
48
|
-
type: Object,
|
|
49
|
-
attribute: false
|
|
50
|
-
}
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
static get styles() {
|
|
55
|
-
return [...super.styles, // language=CSS
|
|
56
|
-
css`:host{box-sizing:border-box;display:inline-block;margin:.2rem;vertical-align:middle;min-width:415px}.card{background-color:var(--gv-category--bgc,var(--gv-theme-neutral-color-lightest,#fff));border-radius:4px;display:flex;flex-direction:column;height:var(--gv-category--h,200px);padding:2rem;box-shadow:0 0 0 1px var(--gv-theme-neutral-color-dark,#bfbfbf),0 1px 3px var(--gv-theme-neutral-color-dark,#bfbfbf);transition:all .3s;position:relative}.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -14px var(--gv-theme-neutral-color,#f5f5f5);cursor:pointer}.box{display:flex}.title{flex:1;align-self:center}.title span{font-size:var(--gv-theme-font-size-s);font-weight:600;line-height:var(--gv-theme-font-size-s);margin-left:8px;opacity:.7}gv-identity-picture{height:80px;width:80px;margin:.5rem 1rem .5rem 0}.title{color:var(--gv-category--c,var(--gv-theme-font-color-dark,#262626));font-size:var(--gv-theme-font-size-xxl,30px);font-style:normal;font-weight:600;line-height:calc(var(--gv-theme-font-size-xxl,30px) + 6px)}.description{color:var(--gv-category--c,var(--gv-theme-font-color-dark,#262626));font-size:var(--gv-theme-font-size-l,16px);font-style:normal;font-weight:400;line-height:24px;opacity:.7;max-height:150px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}`];
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
constructor() {
|
|
60
|
-
super();
|
|
61
|
-
this._skeletonAttribute = 'category';
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
_get(property) {
|
|
65
|
-
if (this._category) {
|
|
66
|
-
return this._category[property];
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
return '';
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
_onClick() {
|
|
73
|
-
dispatchCustomEvent(this, 'click', this._category);
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
render() {
|
|
77
|
-
const total = this._get('total_apis');
|
|
78
|
-
|
|
79
|
-
return html`<div @click="${this._onClick}" class="${classMap({
|
|
80
|
-
card: true,
|
|
81
|
-
skeleton: this._skeleton,
|
|
82
|
-
empty: this._error || this._empty
|
|
83
|
-
})}"> ${this._error || this._empty ? html` <div class="${classMap({
|
|
84
|
-
skeleton: this._skeleton
|
|
85
|
-
})}"> <span>${this._error ? i18n('gv-category.error') : i18n('gv-category.empty')}</span> </div> ` : html` <div class="box"> <gv-identity-picture .skeleton="${this._skeleton}" display_name="${this._get('name')}" picture="${this._get('_links') ? this._get('_links').picture : ''}"></gv-identity-picture> <div class="title">${this._get('name')}${total ? html`<span>(${total})</span>` : ''}</div> </div> <div class="description">${truncate(this._get('description'), this.limit)}</div>`} </div> `;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
}
|
|
89
|
-
window.customElements.define('gv-category', GvCategory);
|
|
90
|
-
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4vbm9kZV9tb2R1bGVzL0BncmF2aXRlZS91aS1jb21wb25lbnRzL21vbGVjdWxlcy9ndi1jYXRlZ29yeS5qcyJdLCJuYW1lcyI6WyJMaXRFbGVtZW50IiwiaHRtbCIsImNzcyIsInRydW5jYXRlIiwiY2xhc3NNYXAiLCJkaXNwYXRjaEN1c3RvbUV2ZW50IiwiaTE4biIsIndpdGhTa2VsZXRvbkF0dHJpYnV0ZSIsIkd2Q2F0ZWdvcnkiLCJwcm9wZXJ0aWVzIiwiY2F0ZWdvcnkiLCJ0eXBlIiwiT2JqZWN0IiwibGltaXQiLCJOdW1iZXIiLCJfY2F0ZWdvcnkiLCJhdHRyaWJ1dGUiLCJzdHlsZXMiLCJjb25zdHJ1Y3RvciIsIl9za2VsZXRvbkF0dHJpYnV0ZSIsIl9nZXQiLCJwcm9wZXJ0eSIsIl9vbkNsaWNrIiwicmVuZGVyIiwidG90YWwiLCJjYXJkIiwic2tlbGV0b24iLCJfc2tlbGV0b24iLCJlbXB0eSIsIl9lcnJvciIsIl9lbXB0eSIsInBpY3R1cmUiLCJ3aW5kb3ciLCJjdXN0b21FbGVtZW50cyIsImRlZmluZSJdLCJtYXBwaW5ncyI6IkFBQUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EsU0FBU0EsVUFBVCxFQUFxQkMsSUFBckIsRUFBMkJDLEdBQTNCLFFBQXNDLEtBQXRDO0FBQ0EsU0FBU0MsUUFBVCxRQUF5QixjQUF6QjtBQUNBLFNBQVNDLFFBQVQsUUFBeUIsMEJBQXpCO0FBQ0EsU0FBU0MsbUJBQVQsUUFBb0MsZUFBcEM7QUFDQSxTQUFTQyxJQUFULFFBQXFCLGFBQXJCO0FBQ0EsU0FBU0MscUJBQVQsUUFBc0MsbUNBQXRDO0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOztBQUNBLE9BQU8sTUFBTUMsVUFBTixTQUF5QkQscUJBQXFCLENBQUNQLFVBQUQsQ0FBOUMsQ0FBMkQ7QUFDM0MsYUFBVlMsVUFBVSxHQUFHO0FBQ3RCLFdBQU87QUFDTEMsTUFBQUEsUUFBUSxFQUFFO0FBQUVDLFFBQUFBLElBQUksRUFBRUM7QUFBUixPQURMO0FBRUxDLE1BQUFBLEtBQUssRUFBRTtBQUFFRixRQUFBQSxJQUFJLEVBQUVHO0FBQVIsT0FGRjtBQUdMQyxNQUFBQSxTQUFTLEVBQUU7QUFBRUosUUFBQUEsSUFBSSxFQUFFQyxNQUFSO0FBQWdCSSxRQUFBQSxTQUFTLEVBQUU7QUFBM0I7QUFITixLQUFQO0FBS0Q7O0FBRWdCLGFBQU5DLE1BQU0sR0FBRztBQUNsQixXQUFPLENBQ0wsR0FBRyxNQUFNQSxNQURKLEVBRUw7QUFDQWYsSUFBQUEsR0FBRywweUNBSEUsQ0FBUDtBQThFRDs7QUFFRGdCLEVBQUFBLFdBQVcsR0FBRztBQUNaO0FBQ0EsU0FBS0Msa0JBQUwsR0FBMEIsVUFBMUI7QUFDRDs7QUFFREMsRUFBQUEsSUFBSSxDQUFDQyxRQUFELEVBQVc7QUFDYixRQUFJLEtBQUtOLFNBQVQsRUFBb0I7QUFDbEIsYUFBTyxLQUFLQSxTQUFMLENBQWVNLFFBQWYsQ0FBUDtBQUNEOztBQUNELFdBQU8sRUFBUDtBQUNEOztBQUVEQyxFQUFBQSxRQUFRLEdBQUc7QUFDVGpCLElBQUFBLG1CQUFtQixDQUFDLElBQUQsRUFBTyxPQUFQLEVBQWdCLEtBQUtVLFNBQXJCLENBQW5CO0FBQ0Q7O0FBRURRLEVBQUFBLE1BQU0sR0FBRztBQUNQLFVBQU1DLEtBQUssR0FBRyxLQUFLSixJQUFMLENBQVUsWUFBVixDQUFkOztBQUNBLFdBQU9uQixJQUFJLGdCQUNBLEtBQUtxQixRQURMLFlBRUFsQixRQUFRLENBQUM7QUFBRXFCLE1BQUFBLElBQUksRUFBRSxJQUFSO0FBQWNDLE1BQUFBLFFBQVEsRUFBRSxLQUFLQyxTQUE3QjtBQUF3Q0MsTUFBQUEsS0FBSyxFQUFFLEtBQUtDLE1BQUwsSUFBZSxLQUFLQztBQUFuRSxLQUFELENBRlIsTUFJUCxLQUFLRCxNQUFMLElBQWUsS0FBS0MsTUFBcEIsR0FDRTdCLElBQUksZ0JBQ1lHLFFBQVEsQ0FBQztBQUFFc0IsTUFBQUEsUUFBUSxFQUFFLEtBQUtDO0FBQWpCLEtBQUQsQ0FEcEIsWUFFUSxLQUFLRSxNQUFMLEdBQWN2QixJQUFJLENBQUMsbUJBQUQsQ0FBbEIsR0FBMENBLElBQUksQ0FBQyxtQkFBRCxDQUZ0RCxpQkFETixHQU1FTCxJQUFJLHNEQUVlLEtBQUswQixTQUZwQixtQkFHa0IsS0FBS1AsSUFBTCxDQUFVLE1BQVYsQ0FIbEIsY0FJYSxLQUFLQSxJQUFMLENBQVUsUUFBVixJQUFzQixLQUFLQSxJQUFMLENBQVUsUUFBVixFQUFvQlcsT0FBMUMsR0FBb0QsRUFKakUsK0NBTXFCLEtBQUtYLElBQUwsQ0FBVSxNQUFWLENBTnJCLEdBTXlDSSxLQUFLLEdBQUd2QixJQUFJLFVBQVV1QixLQUFWLFVBQVAsR0FBbUMsRUFOakYsMENBU3lCckIsUUFBUSxDQUFDLEtBQUtpQixJQUFMLENBQVUsYUFBVixDQUFELEVBQTJCLEtBQUtQLEtBQWhDLENBVGpDLFFBVkMsVUFBWDtBQXFCRDs7QUFqSStEO0FBb0lsRW1CLE1BQU0sQ0FBQ0MsY0FBUCxDQUFzQkMsTUFBdEIsQ0FBNkIsYUFBN0IsRUFBNEMxQixVQUE1QyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgKEMpIDIwMTUgVGhlIEdyYXZpdGVlIHRlYW0gKGh0dHA6Ly9ncmF2aXRlZS5pbylcbiAqXG4gKiBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG5pbXBvcnQgeyBMaXRFbGVtZW50LCBodG1sLCBjc3MgfSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgdHJ1bmNhdGUgfSBmcm9tICcuLi9saWIvdXRpbHMnO1xuaW1wb3J0IHsgY2xhc3NNYXAgfSBmcm9tICdsaXQvZGlyZWN0aXZlcy9jbGFzcy1tYXAnO1xuaW1wb3J0IHsgZGlzcGF0Y2hDdXN0b21FdmVudCB9IGZyb20gJy4uL2xpYi9ldmVudHMnO1xuaW1wb3J0IHsgaTE4biB9IGZyb20gJy4uL2xpYi9pMThuJztcbmltcG9ydCB7IHdpdGhTa2VsZXRvbkF0dHJpYnV0ZSB9IGZyb20gJy4uL21peGlucy93aXRoLXNrZWxldG9uLWF0dHJpYnV0ZSc7XG5cbi8qKlxuICogQSBjYXJkIHVzZWQgdG8gZGlzcGxheSBhIGNhdGVnb3J5XG4gKlxuICogIyMgRGV0YWlsc1xuICogKiBoYXMgQHRoZW1lIGZhY2V0XG4gKlxuICogQGZpcmVzIGd2LWNhdGVnb3J5OmNsaWNrIC0gQ3VzdG9tIGNsaWNrIGV2ZW50XG4gKlxuICogQGF0dHIge1Byb21pc2U8e25hbWUsIGRlc2NyaXB0aW9uLCBfbGlua3M6IHsgcGljdHVyZSB9LCB0b3RhbF9hcGlzfT59IGNhdGVnb3J5IC0gQSBjYXRlZ29yeSBvYmplY3RcbiAqIEBhdHRyIHtMZW5ndGh9IGxpbWl0IC0gbnVtYmVyIG9mIGNoYXJhY3RlcnMgdGhhdCBjYW4gYmUgZGlzcGxheSBpbiB0aGUgZGVzY3JpcHRpb24uIElmIF9kZXNjcmlwdGlvbl8gaXMgZ3JlYXRlciwgaXQgd2lsbCBiZSB0cnVuY2F0ZWQuXG4gKlxuICogQGNzc3Byb3Age0NvbG9yfSBbLS1ndi1jYXRlZ29yeS0tYmdjPXZhcigtLWd2LXRoZW1lLW5ldXRyYWwtY29sb3ItbGlnaHRlc3QsICNmZmZmZmYpXSAtIEJhY2tncm91bmQgY29sb3JcbiAqIEBjc3Nwcm9wIHtDb2xvcn0gWy0tZ3YtY2F0ZWdvcnktLWM9dmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1kYXJrLCAjMjYyNjI2KV0gLSBDb2xvclxuICogQGNzc3Byb3Age0xlbmd0aH0gWy0tZ3YtY2F0ZWdvcnktLWg9MjAwcHhdIC0gSGVpZ2h0XG4gKi9cbmV4cG9ydCBjbGFzcyBHdkNhdGVnb3J5IGV4dGVuZHMgd2l0aFNrZWxldG9uQXR0cmlidXRlKExpdEVsZW1lbnQpIHtcbiAgc3RhdGljIGdldCBwcm9wZXJ0aWVzKCkge1xuICAgIHJldHVybiB7XG4gICAgICBjYXRlZ29yeTogeyB0eXBlOiBPYmplY3QgfSxcbiAgICAgIGxpbWl0OiB7IHR5cGU6IE51bWJlciB9LFxuICAgICAgX2NhdGVnb3J5OiB7IHR5cGU6IE9iamVjdCwgYXR0cmlidXRlOiBmYWxzZSB9LFxuICAgIH07XG4gIH1cblxuICBzdGF0aWMgZ2V0IHN0eWxlcygpIHtcbiAgICByZXR1cm4gW1xuICAgICAgLi4uc3VwZXIuc3R5bGVzLFxuICAgICAgLy8gbGFuZ3VhZ2U9Q1NTXG4gICAgICBjc3NgXG4gICAgICAgIDpob3N0IHtcbiAgICAgICAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgICAgICAgIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgICAgICAgICBtYXJnaW46IDAuMnJlbTtcbiAgICAgICAgICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlO1xuICAgICAgICAgIG1pbi13aWR0aDogNDE1cHg7XG4gICAgICAgIH1cblxuICAgICAgICAuY2FyZCB7XG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tZ3YtY2F0ZWdvcnktLWJnYywgdmFyKC0tZ3YtdGhlbWUtbmV1dHJhbC1jb2xvci1saWdodGVzdCwgI2ZmZmZmZikpO1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgICAgaGVpZ2h0OiB2YXIoLS1ndi1jYXRlZ29yeS0taCwgMjAwcHgpO1xuICAgICAgICAgIHBhZGRpbmc6IDJyZW07XG4gICAgICAgICAgYm94LXNoYWRvdzogMCAwIDAgMXB4IHZhcigtLWd2LXRoZW1lLW5ldXRyYWwtY29sb3ItZGFyaywgI2JmYmZiZiksIDAgMXB4IDNweCB2YXIoLS1ndi10aGVtZS1uZXV0cmFsLWNvbG9yLWRhcmssICNiZmJmYmYpO1xuICAgICAgICAgIHRyYW5zaXRpb246IGFsbCAwLjNzO1xuICAgICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgICAgfVxuXG4gICAgICAgIC5jYXJkOmhvdmVyIHtcbiAgICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoLTRweCk7XG4gICAgICAgICAgYm94LXNoYWRvdzogMCAyMHB4IDQwcHggLTE0cHggdmFyKC0tZ3YtdGhlbWUtbmV1dHJhbC1jb2xvciwgI2Y1ZjVmNSk7XG4gICAgICAgICAgY3Vyc29yOiBwb2ludGVyO1xuICAgICAgICB9XG5cbiAgICAgICAgLmJveCB7XG4gICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgfVxuXG4gICAgICAgIC50aXRsZSB7XG4gICAgICAgICAgZmxleDogMTtcbiAgICAgICAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XG4gICAgICAgIH1cblxuICAgICAgICAudGl0bGUgc3BhbiB7XG4gICAgICAgICAgZm9udC1zaXplOiB2YXIoLS1ndi10aGVtZS1mb250LXNpemUtcyk7XG4gICAgICAgICAgZm9udC13ZWlnaHQ6IDYwMDtcbiAgICAgICAgICBsaW5lLWhlaWdodDogdmFyKC0tZ3YtdGhlbWUtZm9udC1zaXplLXMpO1xuICAgICAgICAgIG1hcmdpbi1sZWZ0OiA4cHg7XG4gICAgICAgICAgb3BhY2l0eTogMC43O1xuICAgICAgICB9XG5cbiAgICAgICAgZ3YtaWRlbnRpdHktcGljdHVyZSB7XG4gICAgICAgICAgaGVpZ2h0OiA4MHB4O1xuICAgICAgICAgIHdpZHRoOiA4MHB4O1xuICAgICAgICAgIG1hcmdpbjogMC41cmVtIDFyZW0gMC41cmVtIDA7XG4gICAgICAgIH1cblxuICAgICAgICAudGl0bGUge1xuICAgICAgICAgIGNvbG9yOiB2YXIoLS1ndi1jYXRlZ29yeS0tYywgdmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1kYXJrLCAjMjYyNjI2KSk7XG4gICAgICAgICAgZm9udC1zaXplOiB2YXIoLS1ndi10aGVtZS1mb250LXNpemUteHhsLCAzMHB4KTtcbiAgICAgICAgICBmb250LXN0eWxlOiBub3JtYWw7XG4gICAgICAgICAgZm9udC13ZWlnaHQ6IDYwMDtcbiAgICAgICAgICBsaW5lLWhlaWdodDogY2FsYyh2YXIoLS1ndi10aGVtZS1mb250LXNpemUteHhsLCAzMHB4KSArIDZweCk7XG4gICAgICAgIH1cblxuICAgICAgICAuZGVzY3JpcHRpb24ge1xuICAgICAgICAgIGNvbG9yOiB2YXIoLS1ndi1jYXRlZ29yeS0tYywgdmFyKC0tZ3YtdGhlbWUtZm9udC1jb2xvci1kYXJrLCAjMjYyNjI2KSk7XG4gICAgICAgICAgZm9udC1zaXplOiB2YXIoLS1ndi10aGVtZS1mb250LXNpemUtbCwgMTZweCk7XG4gICAgICAgICAgZm9udC1zdHlsZTogbm9ybWFsO1xuICAgICAgICAgIGZvbnQtd2VpZ2h0OiBub3JtYWw7XG4gICAgICAgICAgbGluZS1oZWlnaHQ6IDI0cHg7XG4gICAgICAgICAgb3BhY2l0eTogMC43O1xuXG4gICAgICAgICAgLyoqIHRleHQtb3ZlcmZsb3cgKiovXG4gICAgICAgICAgbWF4LWhlaWdodDogMTUwcHg7XG4gICAgICAgICAgZGlzcGxheTogLXdlYmtpdC1ib3g7XG4gICAgICAgICAgLXdlYmtpdC1saW5lLWNsYW1wOiA0O1xuICAgICAgICAgIC13ZWJraXQtYm94LW9yaWVudDogdmVydGljYWw7XG4gICAgICAgICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICAgICAgfVxuICAgICAgYCxcbiAgICBdO1xuICB9XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgc3VwZXIoKTtcbiAgICB0aGlzLl9za2VsZXRvbkF0dHJpYnV0ZSA9ICdjYXRlZ29yeSc7XG4gIH1cblxuICBfZ2V0KHByb3BlcnR5KSB7XG4gICAgaWYgKHRoaXMuX2NhdGVnb3J5KSB7XG4gICAgICByZXR1cm4gdGhpcy5fY2F0ZWdvcnlbcHJvcGVydHldO1xuICAgIH1cbiAgICByZXR1cm4gJyc7XG4gIH1cblxuICBfb25DbGljaygpIHtcbiAgICBkaXNwYXRjaEN1c3RvbUV2ZW50KHRoaXMsICdjbGljaycsIHRoaXMuX2NhdGVnb3J5KTtcbiAgfVxuXG4gIHJlbmRlcigpIHtcbiAgICBjb25zdCB0b3RhbCA9IHRoaXMuX2dldCgndG90YWxfYXBpcycpO1xuICAgIHJldHVybiBodG1sYDxkaXZcbiAgICAgIEBjbGljaz0ke3RoaXMuX29uQ2xpY2t9XG4gICAgICBjbGFzcz1cIiR7Y2xhc3NNYXAoeyBjYXJkOiB0cnVlLCBza2VsZXRvbjogdGhpcy5fc2tlbGV0b24sIGVtcHR5OiB0aGlzLl9lcnJvciB8fCB0aGlzLl9lbXB0eSB9KX1cIlxuICAgID5cbiAgICAgICR7dGhpcy5fZXJyb3IgfHwgdGhpcy5fZW1wdHlcbiAgICAgICAgPyBodG1sYFxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cIiR7Y2xhc3NNYXAoeyBza2VsZXRvbjogdGhpcy5fc2tlbGV0b24gfSl9XCI+XG4gICAgICAgICAgICAgIDxzcGFuPiR7dGhpcy5fZXJyb3IgPyBpMThuKCdndi1jYXRlZ29yeS5lcnJvcicpIDogaTE4bignZ3YtY2F0ZWdvcnkuZW1wdHknKX08L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICBgXG4gICAgICAgIDogaHRtbGAgPGRpdiBjbGFzcz1cImJveFwiPlxuICAgICAgICAgICAgICA8Z3YtaWRlbnRpdHktcGljdHVyZVxuICAgICAgICAgICAgICAgIC5za2VsZXRvbj1cIiR7dGhpcy5fc2tlbGV0b259XCJcbiAgICAgICAgICAgICAgICBkaXNwbGF5X25hbWU9XCIke3RoaXMuX2dldCgnbmFtZScpfVwiXG4gICAgICAgICAgICAgICAgcGljdHVyZT1cIiR7dGhpcy5fZ2V0KCdfbGlua3MnKSA/IHRoaXMuX2dldCgnX2xpbmtzJykucGljdHVyZSA6ICcnfVwiXG4gICAgICAgICAgICAgID48L2d2LWlkZW50aXR5LXBpY3R1cmU+XG4gICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJ0aXRsZVwiPiR7dGhpcy5fZ2V0KCduYW1lJyl9JHt0b3RhbCA/IGh0bWxgPHNwYW4+KCR7dG90YWx9KTwvc3Bhbj5gIDogJyd9PC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cblxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImRlc2NyaXB0aW9uXCI+JHt0cnVuY2F0ZSh0aGlzLl9nZXQoJ2Rlc2NyaXB0aW9uJyksIHRoaXMubGltaXQpfTwvZGl2PmB9XG4gICAgPC9kaXY+IGA7XG4gIH1cbn1cblxud2luZG93LmN1c3RvbUVsZW1lbnRzLmRlZmluZSgnZ3YtY2F0ZWdvcnknLCBHdkNhdGVnb3J5KTtcbiJdfQ==
|
|
1
|
+
Object.defineProperty(exports,"__esModule",{value:!0}),exports.GvCategory=void 0;const e=require("lit"),t=require("../lib/utils"),i=require("lit/directives/class-map"),r=require("../lib/events"),s=require("../lib/i18n"),o=require("../mixins/with-skeleton-attribute");class a extends((0,o.withSkeletonAttribute)(e.LitElement)){static get properties(){return{category:{type:Object},limit:{type:Number},_category:{type:Object,attribute:!1}}}static get styles(){return[...super.styles,e.css`:host{box-sizing:border-box;display:inline-block;margin:.2rem;vertical-align:middle;min-width:415px}.card{background-color:var(--gv-category--bgc,var(--gv-theme-neutral-color-lightest,#fff));border-radius:4px;display:flex;flex-direction:column;height:var(--gv-category--h,200px);padding:2rem;box-shadow:0 0 0 1px var(--gv-theme-neutral-color-dark,#bfbfbf),0 1px 3px var(--gv-theme-neutral-color-dark,#bfbfbf);transition:all .3s;position:relative}.card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -14px var(--gv-theme-neutral-color,#f5f5f5);cursor:pointer}.box{display:flex}.title{flex:1;align-self:center}.title span{font-size:var(--gv-theme-font-size-s);font-weight:600;line-height:var(--gv-theme-font-size-s);margin-left:8px;opacity:.7}gv-identity-picture{height:80px;width:80px;margin:.5rem 1rem .5rem 0}.title{color:var(--gv-category--c,var(--gv-theme-font-color-dark,#262626));font-size:var(--gv-theme-font-size-xxl,30px);font-style:normal;font-weight:600;line-height:calc(var(--gv-theme-font-size-xxl,30px) + 6px)}.description{color:var(--gv-category--c,var(--gv-theme-font-color-dark,#262626));font-size:var(--gv-theme-font-size-l,16px);font-style:normal;font-weight:400;line-height:24px;opacity:.7;max-height:150px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}`]}constructor(){super(),this._skeletonAttribute="category"}_get(e){return this._category?this._category[e]:""}_onClick(){(0,r.dispatchCustomEvent)(this,"click",this._category)}render(){const r=this._get("total_apis");return e.html`<div @click="${this._onClick}" class="${(0,i.classMap)({card:!0,skeleton:this._skeleton,empty:this._error||this._empty})}">${this._error||this._empty?e.html`<div class="${(0,i.classMap)({skeleton:this._skeleton})}"><span>${this._error?(0,s.i18n)("gv-category.error"):(0,s.i18n)("gv-category.empty")}</span></div>`:e.html`<div class="box"><gv-identity-picture .skeleton="${this._skeleton}" display_name="${this._get("name")}" picture="${this._get("_links")?this._get("_links").picture:""}"></gv-identity-picture><div class="title">${this._get("name")}${r?e.html`<span>(${r})</span>`:""}</div></div><div class="description">${(0,t.truncate)(this._get("description"),this.limit)}</div>`}</div>`}}exports.GvCategory=a,window.customElements.define("gv-category",a);
|