wj-elements 0.7.6 → 0.8.0
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/dist/animations.js +28 -51
- package/dist/animations.js.map +1 -1
- package/dist/base-path.js +19 -31
- package/dist/base-path.js.map +1 -1
- package/dist/custom-elements.json +9053 -9048
- package/dist/dark.css +1 -302
- package/dist/date.js +16 -36
- package/dist/date.js.map +1 -1
- package/dist/element-utils.js +20 -81
- package/dist/element-utils.js.map +1 -1
- package/dist/event.js +49 -165
- package/dist/event.js.map +1 -1
- package/dist/form-associated-element-BjeJn7j8.js +101 -0
- package/dist/{form-associated-element-DEQ4y-jn.js.map → form-associated-element-BjeJn7j8.js.map} +1 -1
- package/dist/icon-DmsqtDpL.js +102 -0
- package/dist/{icon-CReYMzAK.js.map → icon-DmsqtDpL.js.map} +1 -1
- package/dist/light.css +1 -731
- package/dist/localize.js +36 -111
- package/dist/localize.js.map +1 -1
- package/dist/packages/wje-accordion-item/accordion-item.element.d.ts +3 -2
- package/dist/packages/wje-img/img.element.d.ts +4 -4
- package/dist/permissions.js +14 -41
- package/dist/permissions.js.map +1 -1
- package/dist/popup.element-CbkhthPP.js +806 -0
- package/dist/{popup.element-CwXvVFK7.js.map → popup.element-CbkhthPP.js.map} +1 -1
- package/dist/router-links-CNsJ-elb.js +105 -0
- package/dist/{router-links-wjqCnncc.js.map → router-links-CNsJ-elb.js.map} +1 -1
- package/dist/skeleton.css +1 -197
- package/dist/styles.css +1 -866
- package/dist/universal-service.js +48 -109
- package/dist/universal-service.js.map +1 -1
- package/dist/utils.js +11 -18
- package/dist/utils.js.map +1 -1
- package/dist/web-types.json +698 -698
- package/dist/wje-accordion-item.js +33 -106
- package/dist/wje-accordion-item.js.map +1 -1
- package/dist/wje-accordion.js +19 -84
- package/dist/wje-accordion.js.map +1 -1
- package/dist/wje-animation.js +37 -4258
- package/dist/wje-animation.js.map +1 -1
- package/dist/wje-aside.js +9 -34
- package/dist/wje-aside.js.map +1 -1
- package/dist/wje-avatar.js +36 -126
- package/dist/wje-avatar.js.map +1 -1
- package/dist/wje-badge.js +10 -52
- package/dist/wje-badge.js.map +1 -1
- package/dist/wje-breadcrumb.js +205 -668
- package/dist/wje-breadcrumb.js.map +1 -1
- package/dist/wje-breadcrumbs.js +177 -633
- package/dist/wje-breadcrumbs.js.map +1 -1
- package/dist/wje-button-group.js +48 -153
- package/dist/wje-button-group.js.map +1 -1
- package/dist/wje-button.js +92 -413
- package/dist/wje-button.js.map +1 -1
- package/dist/wje-card-content.js +7 -30
- package/dist/wje-card-content.js.map +1 -1
- package/dist/wje-card-controls.js +7 -30
- package/dist/wje-card-controls.js.map +1 -1
- package/dist/wje-card-header.js +7 -30
- package/dist/wje-card-header.js.map +1 -1
- package/dist/wje-card-subtitle.js +7 -34
- package/dist/wje-card-subtitle.js.map +1 -1
- package/dist/wje-card-title.js +7 -34
- package/dist/wje-card-title.js.map +1 -1
- package/dist/wje-card.js +15 -71
- package/dist/wje-card.js.map +1 -1
- package/dist/wje-carousel-item.js +12 -56
- package/dist/wje-carousel-item.js.map +1 -1
- package/dist/wje-carousel.js +154 -509
- package/dist/wje-carousel.js.map +1 -1
- package/dist/wje-checkbox.js +50 -227
- package/dist/wje-checkbox.js.map +1 -1
- package/dist/wje-chip.js +43 -160
- package/dist/wje-chip.js.map +1 -1
- package/dist/wje-col.js +7 -20
- package/dist/wje-col.js.map +1 -1
- package/dist/wje-color-picker.js +445 -1464
- package/dist/wje-color-picker.js.map +1 -1
- package/dist/wje-container.js +9 -35
- package/dist/wje-container.js.map +1 -1
- package/dist/wje-copy-button.js +64 -204
- package/dist/wje-copy-button.js.map +1 -1
- package/dist/wje-dialog.js +85 -553
- package/dist/wje-dialog.js.map +1 -1
- package/dist/wje-divider.js +7 -34
- package/dist/wje-divider.js.map +1 -1
- package/dist/wje-dropdown.js +78 -305
- package/dist/wje-dropdown.js.map +1 -1
- package/dist/wje-element.js +191 -700
- package/dist/wje-element.js.map +1 -1
- package/dist/wje-file-upload-item.js +51 -156
- package/dist/wje-file-upload-item.js.map +1 -1
- package/dist/wje-file-upload.js +181 -619
- package/dist/wje-file-upload.js.map +1 -1
- package/dist/wje-footer.js +7 -31
- package/dist/wje-footer.js.map +1 -1
- package/dist/wje-form.js +7 -32
- package/dist/wje-form.js.map +1 -1
- package/dist/wje-format-digital.js +26 -118
- package/dist/wje-format-digital.js.map +1 -1
- package/dist/wje-grid.js +7 -33
- package/dist/wje-grid.js.map +1 -1
- package/dist/wje-header.js +9 -35
- package/dist/wje-header.js.map +1 -1
- package/dist/wje-icon-library.js +12 -18
- package/dist/wje-icon-library.js.map +1 -1
- package/dist/wje-icon-picker.js +65 -320
- package/dist/wje-icon-picker.js.map +1 -1
- package/dist/wje-icon.js +1 -1
- package/dist/wje-img-comparer.js +37 -114
- package/dist/wje-img-comparer.js.map +1 -1
- package/dist/wje-img.js +50 -197
- package/dist/wje-img.js.map +1 -1
- package/dist/wje-infinite-scroll.js +94 -346
- package/dist/wje-infinite-scroll.js.map +1 -1
- package/dist/wje-input-file.js +23 -84
- package/dist/wje-input-file.js.map +1 -1
- package/dist/wje-input.js +78 -392
- package/dist/wje-input.js.map +1 -1
- package/dist/wje-item.js +11 -64
- package/dist/wje-item.js.map +1 -1
- package/dist/wje-kanban.js +124 -401
- package/dist/wje-kanban.js.map +1 -1
- package/dist/wje-label.js +9 -32
- package/dist/wje-label.js.map +1 -1
- package/dist/wje-level-indicator.js +38 -157
- package/dist/wje-level-indicator.js.map +1 -1
- package/dist/wje-list.js +10 -40
- package/dist/wje-list.js.map +1 -1
- package/dist/wje-main.js +7 -31
- package/dist/wje-main.js.map +1 -1
- package/dist/wje-masonry.js +66 -211
- package/dist/wje-masonry.js.map +1 -1
- package/dist/wje-master.js +45 -161
- package/dist/wje-master.js.map +1 -1
- package/dist/wje-menu-button.js +10 -38
- package/dist/wje-menu-button.js.map +1 -1
- package/dist/wje-menu-item.js +127 -577
- package/dist/wje-menu-item.js.map +1 -1
- package/dist/wje-menu-label.js +9 -35
- package/dist/wje-menu-label.js.map +1 -1
- package/dist/wje-menu.js +14 -49
- package/dist/wje-menu.js.map +1 -1
- package/dist/wje-option.js +48 -279
- package/dist/wje-option.js.map +1 -1
- package/dist/wje-options.js +130 -384
- package/dist/wje-options.js.map +1 -1
- package/dist/wje-orgchart-group.js +16 -52
- package/dist/wje-orgchart-group.js.map +1 -1
- package/dist/wje-orgchart-item.js +24 -93
- package/dist/wje-orgchart-item.js.map +1 -1
- package/dist/wje-orgchart.js +18 -68
- package/dist/wje-orgchart.js.map +1 -1
- package/dist/wje-pagination.js +113 -397
- package/dist/wje-pagination.js.map +1 -1
- package/dist/wje-popup.js +3 -3
- package/dist/wje-popup.js.map +1 -1
- package/dist/wje-progress-bar.js +53 -205
- package/dist/wje-progress-bar.js.map +1 -1
- package/dist/wje-qr-code.js +398 -2980
- package/dist/wje-qr-code.js.map +1 -1
- package/dist/wje-radio-group.js +52 -190
- package/dist/wje-radio-group.js.map +1 -1
- package/dist/wje-radio.js +24 -118
- package/dist/wje-radio.js.map +1 -1
- package/dist/wje-rate.js +62 -266
- package/dist/wje-rate.js.map +1 -1
- package/dist/wje-relative-time.js +24 -99
- package/dist/wje-relative-time.js.map +1 -1
- package/dist/wje-reorder-dropzone.js +9 -31
- package/dist/wje-reorder-dropzone.js.map +1 -1
- package/dist/wje-reorder-handle.js +67 -204
- package/dist/wje-reorder-handle.js.map +1 -1
- package/dist/wje-reorder-item.js +14 -44
- package/dist/wje-reorder-item.js.map +1 -1
- package/dist/wje-reorder.js +61 -246
- package/dist/wje-reorder.js.map +1 -1
- package/dist/wje-route.js +6 -24
- package/dist/wje-route.js.map +1 -1
- package/dist/wje-router-link.js +11 -39
- package/dist/wje-router-link.js.map +1 -1
- package/dist/wje-router-outlet.js +76 -172
- package/dist/wje-router-outlet.js.map +1 -1
- package/dist/wje-routerx.js +537 -1331
- package/dist/wje-routerx.js.map +1 -1
- package/dist/wje-row.js +9 -31
- package/dist/wje-row.js.map +1 -1
- package/dist/wje-select.js +326 -1152
- package/dist/wje-select.js.map +1 -1
- package/dist/wje-slider.js +44 -225
- package/dist/wje-slider.js.map +1 -1
- package/dist/wje-sliding-container.js +295 -1319
- package/dist/wje-sliding-container.js.map +1 -1
- package/dist/wje-split-view.js +35 -121
- package/dist/wje-split-view.js.map +1 -1
- package/dist/wje-status.js +14 -45
- package/dist/wje-status.js.map +1 -1
- package/dist/wje-step.js +9 -32
- package/dist/wje-step.js.map +1 -1
- package/dist/wje-stepper.js +109 -357
- package/dist/wje-stepper.js.map +1 -1
- package/dist/wje-store.js +67 -360
- package/dist/wje-store.js.map +1 -1
- package/dist/wje-tab-group.js +85 -314
- package/dist/wje-tab-group.js.map +1 -1
- package/dist/wje-tab-panel.js +7 -28
- package/dist/wje-tab-panel.js.map +1 -1
- package/dist/wje-tab.js +21 -198
- package/dist/wje-tab.js.map +1 -1
- package/dist/wje-textarea.js +64 -264
- package/dist/wje-textarea.js.map +1 -1
- package/dist/wje-thumbnail.js +10 -51
- package/dist/wje-thumbnail.js.map +1 -1
- package/dist/wje-toast.js +127 -632
- package/dist/wje-toast.js.map +1 -1
- package/dist/wje-toggle.js +52 -177
- package/dist/wje-toggle.js.map +1 -1
- package/dist/wje-toolbar-action.js +128 -456
- package/dist/wje-toolbar-action.js.map +1 -1
- package/dist/wje-toolbar.js +75 -270
- package/dist/wje-toolbar.js.map +1 -1
- package/dist/wje-tooltip.js +50 -161
- package/dist/wje-tooltip.js.map +1 -1
- package/dist/wje-tree-item.js +70 -301
- package/dist/wje-tree-item.js.map +1 -1
- package/dist/wje-tree.js +145 -489
- package/dist/wje-tree.js.map +1 -1
- package/dist/wje-visually-hidden.js +7 -34
- package/dist/wje-visually-hidden.js.map +1 -1
- package/package.json +4 -2
- package/dist/form-associated-element-DEQ4y-jn.js +0 -245
- package/dist/icon-CReYMzAK.js +0 -245
- package/dist/popup.element-CwXvVFK7.js +0 -2133
- package/dist/router-links-wjqCnncc.js +0 -156
package/dist/wje-card.js
CHANGED
|
@@ -1,93 +1,37 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
class Card extends WJElement {
|
|
7
|
-
/**
|
|
8
|
-
* Card constructor method.
|
|
9
|
-
* @class
|
|
10
|
-
*/
|
|
4
|
+
import r from "./wje-element.js";
|
|
5
|
+
class o extends r {
|
|
11
6
|
constructor() {
|
|
12
7
|
super();
|
|
13
|
-
/**
|
|
14
|
-
* Class name for the Card element.
|
|
15
|
-
* @type {string}
|
|
16
|
-
*/
|
|
17
8
|
__publicField(this, "className", "Card");
|
|
18
9
|
}
|
|
19
|
-
/**
|
|
20
|
-
* Get CSS stylesheet for the Card element.
|
|
21
|
-
* @static
|
|
22
|
-
* @returns {object} styles - The CSS styles
|
|
23
|
-
*/
|
|
24
10
|
static get cssStyleSheet() {
|
|
25
|
-
return
|
|
11
|
+
return ":host{width:100%}.native-card{background:var(--wje-card-background);color:var(--wje-card-color);margin:0;box-shadow:var(--wje-card-shadow);border-color:var(--wje-card-border-color);border-style:var(--wje-card-border-style);border-width:var(--wje-card-border-width);border-radius:var(--wje-card-border-radius);font-family:var(--wje-font-family);font-size:var(--wje-font-size);line-height:var(--wje-line-height-normal);position:relative;width:100%;word-wrap:normal;display:flex;flex-direction:column;overflow:hidden;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.native-card.wje-color-primary{background:var(--wje-color-primary-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-primary-9)}.native-card.wje-color-complete{background:var(--wje-color-complete-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-complete-9)}.native-card.wje-color-success{background:var(--wje-color-success-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-success-9)}.native-card.wje-color-warning{background:var(--wje-color-warning-9);color:var(--wje-color);border-color:var(--wje-color-warning-9)}.native-card.wje-color-danger{background:var(--wje-color-danger-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-danger-9)}.native-card.wje-color-info{background:var(--wje-color-info-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-info-9)}.native-card.wje-color-menu{background:var(--wje-color-contrast-9);color:var(--wje-color-contrast-0);border-color:var(--wje-color-contrast-9)}";
|
|
26
12
|
}
|
|
27
|
-
/**
|
|
28
|
-
* Get observed attributes for the Card element.
|
|
29
|
-
* @static
|
|
30
|
-
* @returns {Array<string>} observedAttributes - The observed attributes array
|
|
31
|
-
*/
|
|
32
13
|
static get observedAttributes() {
|
|
33
14
|
return ["label", "aria-label", "aria-labelledby"];
|
|
34
15
|
}
|
|
35
|
-
/**
|
|
36
|
-
* Setup attributes for the Card element.
|
|
37
|
-
*/
|
|
38
16
|
setupAttributes() {
|
|
39
|
-
this.isShadowRoot = "open";
|
|
40
|
-
this.syncAria();
|
|
17
|
+
this.isShadowRoot = "open", this.syncAria();
|
|
41
18
|
}
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
* @param {string} name
|
|
45
|
-
* @param {string|null} oldValue
|
|
46
|
-
* @param {string|null} newValue
|
|
47
|
-
*/
|
|
48
|
-
attributeChangedCallback(name, oldValue, newValue) {
|
|
49
|
-
if (super.attributeChangedCallback) {
|
|
50
|
-
super.attributeChangedCallback(name, oldValue, newValue);
|
|
51
|
-
}
|
|
52
|
-
if (oldValue !== newValue) {
|
|
53
|
-
this.syncAria();
|
|
54
|
-
}
|
|
19
|
+
attributeChangedCallback(r2, o2, e) {
|
|
20
|
+
super.attributeChangedCallback && super.attributeChangedCallback(r2, o2, e), o2 !== e && this.syncAria();
|
|
55
21
|
}
|
|
56
|
-
/**
|
|
57
|
-
* Sync ARIA attributes on host only when labeling is provided.
|
|
58
|
-
*/
|
|
59
22
|
syncAria() {
|
|
60
|
-
const
|
|
61
|
-
|
|
62
|
-
const labelledBy = this.getAttribute("aria-labelledby");
|
|
63
|
-
if ((ariaLabel || label || labelledBy) && !this.hasAttribute("role")) {
|
|
64
|
-
this.setAriaState({ role: "region" });
|
|
65
|
-
}
|
|
66
|
-
if (!ariaLabel && label) {
|
|
67
|
-
this.setAriaState({ label });
|
|
68
|
-
}
|
|
23
|
+
const r2 = this.getAttribute("aria-label"), o2 = this.getAttribute("label"), e = this.getAttribute("aria-labelledby");
|
|
24
|
+
(r2 || o2 || e) && !this.hasAttribute("role") && this.setAriaState({ role: "region" }), !r2 && o2 && this.setAriaState({ label: o2 });
|
|
69
25
|
}
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
* @returns {object} fragment - The document fragment
|
|
76
|
-
*/
|
|
77
|
-
draw(context, store, params) {
|
|
78
|
-
let fragment = document.createDocumentFragment();
|
|
79
|
-
let native = document.createElement("div");
|
|
80
|
-
native.setAttribute("part", "native");
|
|
81
|
-
native.classList.add("native-card");
|
|
82
|
-
let slot = document.createElement("slot");
|
|
83
|
-
if (params.color) native.classList.add("wje-color-" + params.color);
|
|
84
|
-
native.appendChild(slot);
|
|
85
|
-
fragment.appendChild(native);
|
|
86
|
-
return fragment;
|
|
26
|
+
draw(r2, o2, e) {
|
|
27
|
+
let a = document.createDocumentFragment(), t = document.createElement("div");
|
|
28
|
+
t.setAttribute("part", "native"), t.classList.add("native-card");
|
|
29
|
+
let c = document.createElement("slot");
|
|
30
|
+
return e.color && t.classList.add("wje-color-" + e.color), t.appendChild(c), a.appendChild(t), a;
|
|
87
31
|
}
|
|
88
32
|
}
|
|
89
|
-
|
|
33
|
+
r.define("wje-card", o);
|
|
90
34
|
export {
|
|
91
|
-
|
|
35
|
+
o as default
|
|
92
36
|
};
|
|
93
37
|
//# sourceMappingURL=wje-card.js.map
|
package/dist/wje-card.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-card.js","sources":["../packages/wje-card/card.element.js","../packages/wje-card/card.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents Card element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/card\n * @status stable\n * @augments WJElement\n * @slot - The card main content.\n * @cssproperty [--wje-card-background=#fff] - Background of the component;\n * @cssproperty [--wje-card-color=#000] - Color of the component;\n * @cssproperty [--wje-card-border-color=transparent] - Border color of the component;\n * @cssproperty [--wje-card-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-card-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-card-border-radius=0.5rem] - Border radius of the component;\n * @cssproperty [--wje-card-shadow=var(--wje-shadow-x-large)] - Shadow of the component;\n */\nexport default class Card extends WJElement {\n /**\n * Card constructor method.\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * Class name for the Card element.\n * @type {string}\n */\n className = 'Card';\n\n /**\n * Get CSS stylesheet for the Card element.\n * @static\n * @returns {object} styles - The CSS styles\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Get observed attributes for the Card element.\n * @static\n * @returns {Array<string>} observedAttributes - The observed attributes array\n */\n static get observedAttributes() {\n return ['label', 'aria-label', 'aria-labelledby'];\n }\n\n /**\n * Setup attributes for the Card element.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.syncAria();\n }\n\n /**\n * Handles attribute changes for ARIA sync.\n * @param {string} name\n * @param {string|null} oldValue\n * @param {string|null} newValue\n */\n attributeChangedCallback(name, oldValue, newValue) {\n if (super.attributeChangedCallback) {\n super.attributeChangedCallback(name, oldValue, newValue);\n }\n\n if (oldValue !== newValue) {\n this.syncAria();\n }\n }\n\n /**\n * Sync ARIA attributes on host only when labeling is provided.\n */\n syncAria() {\n const ariaLabel = this.getAttribute('aria-label');\n const label = this.getAttribute('label');\n const labelledBy = this.getAttribute('aria-labelledby');\n\n if ((ariaLabel || label || labelledBy) && !this.hasAttribute('role')) {\n this.setAriaState({ role: 'region' });\n }\n\n if (!ariaLabel && label) {\n this.setAriaState({ label });\n }\n }\n\n /**\n * Draw method for the Card element.\n * @param {object} context The context object\n * @param {object} store The store object\n * @param {object} params The parameters\n * @returns {object} fragment - The document fragment\n */\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-card');\n\n let slot = document.createElement('slot');\n\n if (params.color) native.classList.add('wje-color-' + params.color);\n\n native.appendChild(slot);\n\n fragment.appendChild(native);\n\n return fragment;\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Card from './card.element.js';\n\n// export * from \"./card.element.js\";\nexport default Card;\n\nWJElement.define('wje-card', Card);\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"wje-card.js","sources":["../packages/wje-card/card.element.js","../packages/wje-card/card.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents Card element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/card\n * @status stable\n * @augments WJElement\n * @slot - The card main content.\n * @cssproperty [--wje-card-background=#fff] - Background of the component;\n * @cssproperty [--wje-card-color=#000] - Color of the component;\n * @cssproperty [--wje-card-border-color=transparent] - Border color of the component;\n * @cssproperty [--wje-card-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-card-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-card-border-radius=0.5rem] - Border radius of the component;\n * @cssproperty [--wje-card-shadow=var(--wje-shadow-x-large)] - Shadow of the component;\n */\nexport default class Card extends WJElement {\n /**\n * Card constructor method.\n * @class\n */\n constructor() {\n super();\n }\n\n /**\n * Class name for the Card element.\n * @type {string}\n */\n className = 'Card';\n\n /**\n * Get CSS stylesheet for the Card element.\n * @static\n * @returns {object} styles - The CSS styles\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Get observed attributes for the Card element.\n * @static\n * @returns {Array<string>} observedAttributes - The observed attributes array\n */\n static get observedAttributes() {\n return ['label', 'aria-label', 'aria-labelledby'];\n }\n\n /**\n * Setup attributes for the Card element.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n this.syncAria();\n }\n\n /**\n * Handles attribute changes for ARIA sync.\n * @param {string} name\n * @param {string|null} oldValue\n * @param {string|null} newValue\n */\n attributeChangedCallback(name, oldValue, newValue) {\n if (super.attributeChangedCallback) {\n super.attributeChangedCallback(name, oldValue, newValue);\n }\n\n if (oldValue !== newValue) {\n this.syncAria();\n }\n }\n\n /**\n * Sync ARIA attributes on host only when labeling is provided.\n */\n syncAria() {\n const ariaLabel = this.getAttribute('aria-label');\n const label = this.getAttribute('label');\n const labelledBy = this.getAttribute('aria-labelledby');\n\n if ((ariaLabel || label || labelledBy) && !this.hasAttribute('role')) {\n this.setAriaState({ role: 'region' });\n }\n\n if (!ariaLabel && label) {\n this.setAriaState({ label });\n }\n }\n\n /**\n * Draw method for the Card element.\n * @param {object} context The context object\n * @param {object} store The store object\n * @param {object} params The parameters\n * @returns {object} fragment - The document fragment\n */\n draw(context, store, params) {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.setAttribute('part', 'native');\n native.classList.add('native-card');\n\n let slot = document.createElement('slot');\n\n if (params.color) native.classList.add('wje-color-' + params.color);\n\n native.appendChild(slot);\n\n fragment.appendChild(native);\n\n return fragment;\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Card from './card.element.js';\n\n// export * from \"./card.element.js\";\nexport default Card;\n\nWJElement.define('wje-card', Card);\n"],"names":["Card","WJElement","constructor","super","className","cssStyleSheet","observedAttributes","setupAttributes","this","isShadowRoot","syncAria","name","oldValue","newValue","attributeChangedCallback","ariaLabel","getAttribute","label","labelledBy","hasAttribute","setAriaState","role","context","store","params","fragment","document","createDocumentFragment","native","createElement","setAttribute","classList","add","slot","color","appendChild","define"],"mappings":";;;;AAiBe,MAAMA,UAAaC,EAAAA;AAAAA,EAK9B,cAAAC;AACIC,UAAAA;AAOJC,qCAAY;AAAA,EANZ;AAAA,EAaA,WAAA,gBAAWC;AACP;EACJ;AAAA,EAOA,WAAA,qBAAWC;AACP,WAAO,CAAC,SAAS,cAAc,iBAAA;AAAA,EACnC;AAAA,EAKA,kBAAAC;AACIC,SAAKC,eAAe,QACpBD,KAAKE,SAAAA;AAAAA,EACT;AAAA,EAQA,yBAAyBC,IAAMC,IAAUC,GAAAA;AACjCV,UAAMW,4BACNX,MAAMW,yBAAyBH,IAAMC,IAAUC,CAAAA,GAG/CD,OAAaC,KACbL,KAAKE,SAAAA;AAAAA,EAEb;AAAA,EAKA,WAAAA;AACI,UAAMK,KAAYP,KAAKQ,aAAa,YAAA,GAC9BC,KAAQT,KAAKQ,aAAa,OAAA,GAC1BE,IAAaV,KAAKQ,aAAa,iBAAA;AAAA,KAEhCD,MAAaE,MAASC,MAAAA,CAAgBV,KAAKW,aAAa,MAAA,KACzDX,KAAKY,aAAa,EAAEC,MAAM,SAAA,CAAA,GAAA,CAGzBN,MAAaE,MACdT,KAAKY,aAAa,EAAEH,OAAAA,GAAAA,CAAAA;AAAAA,EAE5B;AAAA,EASA,KAAKK,IAASC,IAAOC,GAAAA;AACjB,QAAIC,IAAWC,SAASC,uBAAAA,GAEpBC,IAASF,SAASG,cAAc;AACpCD,MAAOE,aAAa,QAAQ,QAAA,GAC5BF,EAAOG,UAAUC,IAAI,aAAA;AAErB,QAAIC,IAAOP,SAASG,cAAc,MAAA;AAQlC,WANIL,EAAOU,SAAON,EAAOG,UAAUC,IAAI,eAAeR,EAAOU,KAAAA,GAE7DN,EAAOO,YAAYF,CAAAA,GAEnBR,EAASU,YAAYP,CAAAA,GAEdH;AAAAA,EACX;AAAA;AC5GJxB,EAAUmC,OAAO,YAAYpC,CAAAA;"}
|
|
@@ -1,82 +1,38 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
|
-
import
|
|
5
|
-
import { event } from "./event.js";
|
|
6
|
-
|
|
7
|
-
class CarouselItem extends WJElement {
|
|
8
|
-
/**
|
|
9
|
-
* CarouselItem constructor method.
|
|
10
|
-
*/
|
|
4
|
+
import t from "./wje-element.js";
|
|
5
|
+
import { event as e } from "./event.js";
|
|
6
|
+
class s extends t {
|
|
11
7
|
constructor() {
|
|
12
8
|
super();
|
|
13
|
-
/**
|
|
14
|
-
* Class name for the CarouselItem element.
|
|
15
|
-
* @type {string}
|
|
16
|
-
*/
|
|
17
9
|
__publicField(this, "className", "CarouselItem");
|
|
18
10
|
}
|
|
19
|
-
/**
|
|
20
|
-
* Getter for the CSS stylesheet.
|
|
21
|
-
* @returns {*}
|
|
22
|
-
*/
|
|
23
11
|
static get cssStyleSheet() {
|
|
24
|
-
return
|
|
12
|
+
return ":host{display:flex;align-items:stretch;justify-content:flex-start;flex-direction:column;width:var(--wje-carousel-item-basis, var(--wje-carousel-size, 100%));min-width:0;max-width:100%;max-height:100%;align-self:stretch;aspect-ratio:var(--wje-carousel-item-aspect-ratio, inherit);scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box}.native-carousel-item{width:100%;height:100%;display:flex;flex:1 1 auto;align-items:stretch;justify-content:flex-start;min-width:0;box-sizing:border-box}slot{display:flex;width:100%;height:100%;flex:1 1 auto;align-items:stretch;justify-content:center;min-width:0}:host([single-content]) ::slotted(*){width:100%;min-width:0;flex:1 1 auto}::slotted(wje-img){width:100%!important;height:100%!important;object-fit:contain;display:flex}";
|
|
25
13
|
}
|
|
26
|
-
/**
|
|
27
|
-
* Getter for the observed attributes.
|
|
28
|
-
* @returns {*[]}
|
|
29
|
-
*/
|
|
30
14
|
static get observedAttributes() {
|
|
31
15
|
return [];
|
|
32
16
|
}
|
|
33
|
-
/**
|
|
34
|
-
* Sets up the attributes for the CarouselItem.
|
|
35
|
-
*/
|
|
36
17
|
setupAttributes() {
|
|
37
18
|
this.isShadowRoot = "open";
|
|
38
19
|
}
|
|
39
|
-
/**
|
|
40
|
-
* Draws the CarouselItem element.
|
|
41
|
-
* @returns {DocumentFragment}
|
|
42
|
-
*/
|
|
43
20
|
draw() {
|
|
44
|
-
let
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
let slot = document.createElement("slot");
|
|
49
|
-
this.defaultSlot = slot;
|
|
50
|
-
native.appendChild(slot);
|
|
51
|
-
fragment.appendChild(native);
|
|
52
|
-
return fragment;
|
|
21
|
+
let t2 = document.createDocumentFragment(), e2 = document.createElement("div");
|
|
22
|
+
e2.classList.add("native-carousel-item"), e2.setAttribute("part", "native");
|
|
23
|
+
let s2 = document.createElement("slot");
|
|
24
|
+
return this.defaultSlot = s2, e2.appendChild(s2), t2.appendChild(e2), t2;
|
|
53
25
|
}
|
|
54
|
-
/**
|
|
55
|
-
* After draw event for the CarouselItem element.
|
|
56
|
-
*/
|
|
57
26
|
afterDraw() {
|
|
58
|
-
|
|
59
|
-
this.syncContentLayoutMode();
|
|
60
|
-
if (this.defaultSlot && !this.defaultSlot.dataset.wjeCarouselItemBound) {
|
|
61
|
-
this.defaultSlot.addEventListener("slotchange", () => this.syncContentLayoutMode());
|
|
62
|
-
this.defaultSlot.dataset.wjeCarouselItemBound = "true";
|
|
63
|
-
}
|
|
27
|
+
e.addListener(this, "click", "wje-carousel-item:click"), this.syncContentLayoutMode(), this.defaultSlot && !this.defaultSlot.dataset.wjeCarouselItemBound && (this.defaultSlot.addEventListener("slotchange", () => this.syncContentLayoutMode()), this.defaultSlot.dataset.wjeCarouselItemBound = "true");
|
|
64
28
|
}
|
|
65
|
-
/**
|
|
66
|
-
* Keeps a simple layout hint for single-wrapper content.
|
|
67
|
-
*/
|
|
68
29
|
syncContentLayoutMode() {
|
|
69
30
|
var _a;
|
|
70
|
-
|
|
71
|
-
if (assignedElements.length === 1) {
|
|
72
|
-
this.setAttribute("single-content", "");
|
|
73
|
-
return;
|
|
74
|
-
}
|
|
75
|
-
this.removeAttribute("single-content");
|
|
31
|
+
1 !== (((_a = this.defaultSlot) == null ? void 0 : _a.assignedElements({ flatten: true })) || []).length ? this.removeAttribute("single-content") : this.setAttribute("single-content", "");
|
|
76
32
|
}
|
|
77
33
|
}
|
|
78
|
-
|
|
34
|
+
t.define("wje-carousel-item", s);
|
|
79
35
|
export {
|
|
80
|
-
|
|
36
|
+
s as default
|
|
81
37
|
};
|
|
82
38
|
//# sourceMappingURL=wje-carousel-item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wje-carousel-item.js","sources":["../packages/wje-carousel-item/carousel-item.element.js","../packages/wje-carousel-item/carousel-item.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\n\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents CarouselItem element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/carousel-item\n * @status stable\n * @augments WJElement\n * @slot - The carousel item main content.\n * @csspart native - The component's native wrapper.\n * @cssproperty [--wje-carousel-item-background-color=transparent] - Background color of the component;\n * @cssproperty [--wje-carousel-item-border-color=--wje-color-contrast-4] - Border color of the component;\n * @cssproperty [--wje-carousel-item-color=--wje-color-contrast-11] - Color of the component;\n * @cssproperty [--wje-carousel-item-border-radius=--wje-border-radius-medium] - Border radius of the component;\n * @cssproperty [--wje-carousel-item-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-carousel-item-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-carousel-item-border-color=--wje-color-contrast-1] - Border color of the component;\n * @cssproperty [--wje-carousel-item-margin-inline=0] - Margin inline of the component;\n */\nexport default class CarouselItem extends WJElement {\n /**\n * CarouselItem constructor method.\n */\n constructor() {\n super();\n }\n\n /**\n * Class name for the CarouselItem element.\n * @type {string}\n */\n className = 'CarouselItem';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for the observed attributes.\n * @returns {*[]}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the CarouselItem.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the CarouselItem element.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-carousel-item');\n native.setAttribute('part', 'native');\n\n let slot = document.createElement('slot');\n this.defaultSlot = slot;\n\n native.appendChild(slot);\n\n fragment.appendChild(native);\n\n return fragment;\n }\n\n /**\n * After draw event for the CarouselItem element.\n */\n afterDraw() {\n event.addListener(this, 'click', 'wje-carousel-item:click');\n this.syncContentLayoutMode();\n\n if (this.defaultSlot && !this.defaultSlot.dataset.wjeCarouselItemBound) {\n this.defaultSlot.addEventListener('slotchange', () => this.syncContentLayoutMode());\n this.defaultSlot.dataset.wjeCarouselItemBound = 'true';\n }\n }\n\n /**\n * Keeps a simple layout hint for single-wrapper content.\n */\n syncContentLayoutMode() {\n const assignedElements = this.defaultSlot?.assignedElements({ flatten: true }) || [];\n\n if (assignedElements.length === 1) {\n this.setAttribute('single-content', '');\n return;\n }\n\n this.removeAttribute('single-content');\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport CarouselItem from './carousel-item.element.js';\n\n// export * from \"./carousel-item.element.js\";\nexport default CarouselItem;\n\nWJElement.define('wje-carousel-item', CarouselItem);\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"wje-carousel-item.js","sources":["../packages/wje-carousel-item/carousel-item.element.js","../packages/wje-carousel-item/carousel-item.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\n\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents CarouselItem element, extending the WJElement class.\n * @documentation https://elements.webjet.sk/components/carousel-item\n * @status stable\n * @augments WJElement\n * @slot - The carousel item main content.\n * @csspart native - The component's native wrapper.\n * @cssproperty [--wje-carousel-item-background-color=transparent] - Background color of the component;\n * @cssproperty [--wje-carousel-item-border-color=--wje-color-contrast-4] - Border color of the component;\n * @cssproperty [--wje-carousel-item-color=--wje-color-contrast-11] - Color of the component;\n * @cssproperty [--wje-carousel-item-border-radius=--wje-border-radius-medium] - Border radius of the component;\n * @cssproperty [--wje-carousel-item-border-width=1px] - Border width of the component;\n * @cssproperty [--wje-carousel-item-border-style=solid] - Border style of the component;\n * @cssproperty [--wje-carousel-item-border-color=--wje-color-contrast-1] - Border color of the component;\n * @cssproperty [--wje-carousel-item-margin-inline=0] - Margin inline of the component;\n */\nexport default class CarouselItem extends WJElement {\n /**\n * CarouselItem constructor method.\n */\n constructor() {\n super();\n }\n\n /**\n * Class name for the CarouselItem element.\n * @type {string}\n */\n className = 'CarouselItem';\n\n /**\n * Getter for the CSS stylesheet.\n * @returns {*}\n */\n static get cssStyleSheet() {\n return styles;\n }\n\n /**\n * Getter for the observed attributes.\n * @returns {*[]}\n */\n static get observedAttributes() {\n return [];\n }\n\n /**\n * Sets up the attributes for the CarouselItem.\n */\n setupAttributes() {\n this.isShadowRoot = 'open';\n }\n\n /**\n * Draws the CarouselItem element.\n * @returns {DocumentFragment}\n */\n draw() {\n let fragment = document.createDocumentFragment();\n\n let native = document.createElement('div');\n native.classList.add('native-carousel-item');\n native.setAttribute('part', 'native');\n\n let slot = document.createElement('slot');\n this.defaultSlot = slot;\n\n native.appendChild(slot);\n\n fragment.appendChild(native);\n\n return fragment;\n }\n\n /**\n * After draw event for the CarouselItem element.\n */\n afterDraw() {\n event.addListener(this, 'click', 'wje-carousel-item:click');\n this.syncContentLayoutMode();\n\n if (this.defaultSlot && !this.defaultSlot.dataset.wjeCarouselItemBound) {\n this.defaultSlot.addEventListener('slotchange', () => this.syncContentLayoutMode());\n this.defaultSlot.dataset.wjeCarouselItemBound = 'true';\n }\n }\n\n /**\n * Keeps a simple layout hint for single-wrapper content.\n */\n syncContentLayoutMode() {\n const assignedElements = this.defaultSlot?.assignedElements({ flatten: true }) || [];\n\n if (assignedElements.length === 1) {\n this.setAttribute('single-content', '');\n return;\n }\n\n this.removeAttribute('single-content');\n }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport CarouselItem from './carousel-item.element.js';\n\n// export * from \"./carousel-item.element.js\";\nexport default CarouselItem;\n\nWJElement.define('wje-carousel-item', CarouselItem);\n"],"names":["CarouselItem","WJElement","constructor","super","className","cssStyleSheet","observedAttributes","setupAttributes","this","isShadowRoot","draw","fragment","document","createDocumentFragment","native","createElement","classList","add","setAttribute","slot","defaultSlot","appendChild","afterDraw","event","addListener","syncContentLayoutMode","dataset","wjeCarouselItemBound","addEventListener","assignedElements","flatten","length","removeAttribute","define"],"mappings":";;;;;AAoBe,MAAMA,UAAqBC;EAItC,cAAAC;AACIC,UAAAA;AAOJC,qCAAY;AAAA,EANZ;AAAA,EAYA,2BAAWC;AACP;EACJ;AAAA,EAMA,WAAA,qBAAWC;AACP,WAAO,CAAA;AAAA,EACX;AAAA,EAKA,kBAAAC;AACIC,SAAKC,eAAe;AAAA,EACxB;AAAA,EAMA,OAAAC;AACI,QAAIC,KAAWC,SAASC,uBAAAA,GAEpBC,KAASF,SAASG,cAAc,KAAA;AACpCD,IAAAA,GAAOE,UAAUC,IAAI,yBACrBH,GAAOI,aAAa,QAAQ,QAAA;AAE5B,QAAIC,KAAOP,SAASG,cAAc,MAAA;AAOlC,WANAP,KAAKY,cAAcD,IAEnBL,GAAOO,YAAYF,EAAAA,GAEnBR,GAASU,YAAYP,EAAAA,GAEdH;AAAAA,EACX;AAAA,EAKA,YAAAW;AACIC,MAAMC,YAAYhB,MAAM,SAAS,yBAAA,GACjCA,KAAKiB,sBAAAA,GAEDjB,KAAKY,eAAAA,CAAgBZ,KAAKY,YAAYM,QAAQC,yBAC9CnB,KAAKY,YAAYQ,iBAAiB,cAAc,MAAMpB,KAAKiB,sBAAAA,CAAAA,GAC3DjB,KAAKY,YAAYM,QAAQC,uBAAuB;AAAA,EAExD;AAAA,EAKA,wBAAAF;;AAGoC,aAFPjB,UAAKY,gBAALZ,mBAAkBqB,iBAAiB,EAAEC,SAAAA,KAAS,OAAW,IAE7DC,SAKrBvB,KAAKwB,gBAAgB,gBAAA,IAJjBxB,KAAKU,aAAa,kBAAkB,EAAA;AAAA,EAK5C;AAAA;ACjGJjB,EAAUgC,OAAO,qBAAqBjC,CAAAA;"}
|