@swisspost/design-system-components 2.0.3 → 7.0.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/README.md +1 -1
- package/dist/cjs/app-globals-3a1e7e63.js +5 -0
- package/dist/cjs/check-one-of-f4f5d0c0.js +8 -0
- package/dist/cjs/{index-f243643b.js → index-3b732d59.js} +89 -25
- package/dist/cjs/{index-8c288b1a.js → index-a1440961.js} +2 -6
- package/dist/cjs/index.cjs.js +21 -14
- package/dist/cjs/loader.cjs.js +5 -3
- package/dist/cjs/{package-628f6e9c.js → package-45af106a.js} +1 -1
- package/dist/cjs/{post-accordion-da546aa2.js → post-accordion-7507f838.js} +22 -20
- package/dist/cjs/post-accordion-item-5bf4d98b.js +53 -0
- package/dist/cjs/post-accordion-item.cjs.entry.js +5 -4
- package/dist/cjs/post-accordion.cjs.entry.js +3 -3
- package/dist/cjs/post-alert-9c39c854.js +98 -0
- package/dist/cjs/post-alert.cjs.entry.js +5 -4
- package/dist/cjs/post-card-control-4a16b3d7.js +311 -0
- package/dist/cjs/post-card-control.cjs.entry.js +14 -0
- package/dist/cjs/{post-collapsible-278b2a71.js → post-collapsible-00319f1f.js} +7 -7
- package/dist/cjs/post-collapsible.cjs.entry.js +5 -4
- package/dist/cjs/post-components.cjs.js +6 -4
- package/dist/cjs/{post-icon-fd09bc54.js → post-icon-09845341.js} +5 -5
- package/dist/cjs/post-icon.cjs.entry.js +5 -4
- package/dist/cjs/post-popover-3b6aaeae.js +104 -0
- package/dist/cjs/post-popover.cjs.entry.js +3 -3
- package/dist/cjs/{post-popovercontainer-5e355de3.js → post-popovercontainer-0b8343ac.js} +26 -45
- package/dist/cjs/post-popovercontainer.cjs.entry.js +3 -3
- package/dist/cjs/post-rating-285f966e.js +88 -0
- package/dist/cjs/post-rating.cjs.entry.js +11 -0
- package/dist/cjs/post-tab-header-f1c16656.js +32 -0
- package/dist/cjs/post-tab-header.cjs.entry.js +3 -3
- package/dist/cjs/{post-tab-panel-67ba226d.js → post-tab-panel-9c20a84e.js} +3 -3
- package/dist/cjs/post-tab-panel.cjs.entry.js +3 -3
- package/dist/cjs/{post-tabs-71510ced.js → post-tabs-75e71078.js} +23 -21
- package/dist/cjs/post-tabs.cjs.entry.js +3 -3
- package/dist/cjs/post-tag-942085fd.js +43 -0
- package/dist/cjs/post-tag.cjs.entry.js +11 -0
- package/dist/cjs/{post-tooltip-b6bbb3e4.js → post-tooltip-94d4f21f.js} +12 -9
- package/dist/cjs/post-tooltip.cjs.entry.js +3 -3
- package/dist/collection/collection-manifest.json +6 -3
- package/dist/collection/components/post-accordion/post-accordion.js +22 -20
- package/dist/collection/components/post-accordion-item/post-accordion-item.css +1 -1
- package/dist/collection/components/post-accordion-item/post-accordion-item.js +7 -5
- package/dist/collection/components/post-alert/alert-types.js +1 -1
- package/dist/collection/components/post-alert/post-alert.css +2 -2
- package/dist/collection/components/post-alert/post-alert.js +6 -6
- package/dist/collection/components/post-card-control/post-card-control.css +31 -0
- package/dist/collection/components/post-card-control/post-card-control.js +520 -0
- package/dist/collection/components/post-collapsible/post-collapsible.css +1 -1
- package/dist/collection/components/post-collapsible/post-collapsible.js +4 -4
- package/dist/collection/components/post-icon/post-icon.js +2 -2
- package/dist/collection/components/post-popover/post-popover.css +29 -1
- package/dist/collection/components/post-popover/post-popover.js +2 -2
- package/dist/collection/components/post-popovercontainer/post-popovercontainer.js +6 -6
- package/dist/collection/components/post-rating/post-rating.css +31 -0
- package/dist/collection/components/post-rating/post-rating.js +202 -0
- package/dist/collection/components/post-tab-header/post-tab-header.css +29 -1
- package/dist/collection/components/post-tab-header/post-tab-header.js +1 -1
- package/dist/collection/components/post-tab-panel/post-tab-panel.js +1 -1
- package/dist/collection/components/post-tabs/post-tabs.css +1 -1
- package/dist/collection/components/post-tabs/post-tabs.js +21 -19
- package/dist/collection/components/post-tag/post-tag.css +31 -0
- package/dist/collection/components/post-tag/post-tag.js +115 -0
- package/dist/collection/components/post-tooltip/post-tooltip.js +11 -8
- package/dist/collection/index.js +3 -0
- package/dist/collection/utils/index.js +1 -0
- package/dist/collection/utils/sass-export.js +16 -0
- package/dist/components/index.js +3 -0
- package/dist/components/index2.js +1 -1
- package/dist/components/package.js +1 -1
- package/dist/components/post-accordion-item2.js +7 -5
- package/dist/components/post-accordion2.js +21 -19
- package/dist/components/post-alert2.js +7 -7
- package/dist/components/post-card-control.d.ts +11 -0
- package/dist/components/post-card-control.js +6 -0
- package/dist/components/post-card-control2.js +342 -0
- package/dist/components/post-collapsible2.js +5 -5
- package/dist/components/post-icon2.js +3 -3
- package/dist/components/post-popover2.js +2 -2
- package/dist/components/post-popovercontainer2.js +24 -43
- package/dist/components/post-rating.d.ts +11 -0
- package/dist/components/post-rating.js +6 -0
- package/dist/components/post-rating2.js +113 -0
- package/dist/components/post-tab-header2.js +2 -2
- package/dist/components/post-tab-panel2.js +1 -1
- package/dist/components/post-tabs2.js +21 -19
- package/dist/components/post-tag.d.ts +11 -0
- package/dist/components/post-tag.js +6 -0
- package/dist/components/post-tag2.js +70 -0
- package/dist/components/post-tooltip2.js +10 -7
- package/dist/docs.json +622 -16
- package/dist/esm/app-globals-0f993ce5.js +3 -0
- package/dist/esm/check-one-of-6b3ef8eb.js +6 -0
- package/dist/esm/{index-1708db56.js → index-961099d2.js} +89 -25
- package/dist/esm/{index-b444db27.js → index-d1eba94c.js} +1 -5
- package/dist/esm/index.js +18 -14
- package/dist/esm/loader.js +6 -4
- package/dist/esm/{package-15929f57.js → package-1242b80d.js} +1 -1
- package/dist/esm/{post-accordion-be080240.js → post-accordion-bfd058bc.js} +22 -20
- package/dist/esm/post-accordion-item-4fa44842.js +51 -0
- package/dist/esm/post-accordion-item.entry.js +5 -4
- package/dist/esm/post-accordion.entry.js +3 -3
- package/dist/esm/post-alert-192d0176.js +96 -0
- package/dist/esm/post-alert.entry.js +5 -4
- package/dist/esm/post-card-control-b23e1e6f.js +309 -0
- package/dist/esm/post-card-control.entry.js +6 -0
- package/dist/esm/{post-collapsible-967bb191.js → post-collapsible-d848eb2a.js} +7 -7
- package/dist/esm/post-collapsible.entry.js +5 -4
- package/dist/esm/post-components.js +7 -5
- package/dist/esm/{post-icon-ba163099.js → post-icon-811654f7.js} +5 -5
- package/dist/esm/post-icon.entry.js +5 -4
- package/dist/esm/post-popover-b48a9d7c.js +102 -0
- package/dist/esm/post-popover.entry.js +3 -3
- package/dist/esm/{post-popovercontainer-da870ff0.js → post-popovercontainer-7413bb41.js} +26 -45
- package/dist/esm/post-popovercontainer.entry.js +3 -3
- package/dist/esm/post-rating-806de800.js +86 -0
- package/dist/esm/post-rating.entry.js +3 -0
- package/dist/esm/post-tab-header-95f0dc6a.js +30 -0
- package/dist/esm/post-tab-header.entry.js +3 -3
- package/dist/esm/{post-tab-panel-d89c4c50.js → post-tab-panel-d7145a70.js} +3 -3
- package/dist/esm/post-tab-panel.entry.js +3 -3
- package/dist/esm/{post-tabs-e995886a.js → post-tabs-f130a7d8.js} +23 -21
- package/dist/esm/post-tabs.entry.js +3 -3
- package/dist/esm/post-tag-7c329d6c.js +41 -0
- package/dist/esm/post-tag.entry.js +3 -0
- package/dist/esm/{post-tooltip-0ec6a388.js → post-tooltip-942bd014.js} +12 -9
- package/dist/esm/post-tooltip.entry.js +3 -3
- package/dist/post-components/index.esm.js +1 -1
- package/dist/post-components/p-0d4e50a9.js +1 -0
- package/dist/post-components/p-1c780bac.entry.js +1 -0
- package/dist/post-components/p-2524b6b9.entry.js +1 -0
- package/dist/post-components/p-2ee23269.entry.js +1 -0
- package/dist/post-components/p-416426cc.js +1 -0
- package/dist/post-components/p-41c9c59f.js +1 -0
- package/dist/post-components/p-46cea7ee.js +1 -0
- package/dist/post-components/p-4aa14704.js +1 -0
- package/dist/post-components/p-579f55af.js +1 -0
- package/dist/post-components/p-5b2cdcf0.js +2 -0
- package/dist/post-components/p-60b02cbb.entry.js +1 -0
- package/dist/post-components/p-611b3c41.js +1 -0
- package/dist/post-components/p-62407836.entry.js +1 -0
- package/dist/post-components/p-6308fd47.js +1 -0
- package/dist/post-components/p-6fba8cb2.entry.js +1 -0
- package/dist/post-components/p-86acda91.entry.js +1 -0
- package/dist/post-components/{p-94256868.js → p-93ba2827.js} +3 -3
- package/dist/post-components/p-94b5c41e.entry.js +1 -0
- package/dist/post-components/p-a3b54b5f.js +1 -0
- package/dist/post-components/p-a4b6b950.js +1 -0
- package/dist/post-components/p-b4abbb28.js +1 -0
- package/dist/post-components/p-c0f8e385.entry.js +1 -0
- package/dist/post-components/p-c4fe5052.entry.js +1 -0
- package/dist/post-components/p-c9004503.js +1 -0
- package/dist/post-components/p-cd9c10dd.entry.js +1 -0
- package/dist/post-components/p-d4cd7bb0.js +1 -0
- package/dist/post-components/p-d8d76dd1.entry.js +1 -0
- package/dist/post-components/p-e1255160.js +1 -0
- package/dist/post-components/p-e819d5fb.entry.js +1 -0
- package/dist/post-components/p-f44c172a.js +1 -0
- package/dist/post-components/p-f91c0e1b.js +1 -0
- package/dist/post-components/p-f9e58309.js +1 -0
- package/dist/post-components/p-ffb9a651.entry.js +1 -0
- package/dist/post-components/post-components.esm.js +1 -1
- package/dist/types/components/post-accordion/post-accordion.d.ts +1 -1
- package/dist/types/components/post-accordion-item/post-accordion-item.d.ts +1 -1
- package/dist/types/components/post-alert/alert-types.d.ts +2 -2
- package/dist/types/components/post-alert/post-alert.d.ts +2 -2
- package/dist/types/components/post-card-control/post-card-control.d.ts +109 -0
- package/dist/types/components/post-collapsible/post-collapsible.d.ts +1 -1
- package/dist/types/components/post-popovercontainer/post-popovercontainer.d.ts +1 -1
- package/dist/types/components/post-rating/post-rating.d.ts +43 -0
- package/dist/types/components/post-tabs/post-tabs.d.ts +1 -1
- package/dist/types/components/post-tag/post-tag.d.ts +27 -0
- package/dist/types/components.d.ts +243 -8
- package/dist/types/css-modules.js +0 -0
- package/dist/types/home/runner/work/design-system/design-system/packages/components/.stencil/types/css-modules.d.ts +6 -0
- package/dist/types/index.d.ts +3 -0
- package/dist/types/utils/index.d.ts +1 -0
- package/dist/types/utils/sass-export.d.ts +2 -0
- package/package.json +18 -18
- package/dist/cjs/post-accordion-item-33d5593a.js +0 -51
- package/dist/cjs/post-alert-26c1bcda.js +0 -98
- package/dist/cjs/post-popover-1e454296.js +0 -104
- package/dist/cjs/post-tab-header-5c8b9a0d.js +0 -32
- package/dist/esm/post-accordion-item-7b3c726b.js +0 -49
- package/dist/esm/post-alert-37f853eb.js +0 -96
- package/dist/esm/post-popover-69694fa6.js +0 -102
- package/dist/esm/post-tab-header-14ed99cd.js +0 -30
- package/dist/post-components/p-00ab91d9.entry.js +0 -1
- package/dist/post-components/p-04f47e54.entry.js +0 -1
- package/dist/post-components/p-10b4cf7a.js +0 -2
- package/dist/post-components/p-1f284e66.js +0 -1
- package/dist/post-components/p-209e33a5.js +0 -1
- package/dist/post-components/p-282e21c2.entry.js +0 -1
- package/dist/post-components/p-34a772e3.entry.js +0 -1
- package/dist/post-components/p-46c47aa4.entry.js +0 -1
- package/dist/post-components/p-51fe19e0.js +0 -1
- package/dist/post-components/p-557f0f10.entry.js +0 -1
- package/dist/post-components/p-5ecceba0.js +0 -1
- package/dist/post-components/p-61d98756.js +0 -1
- package/dist/post-components/p-6b3ba10a.js +0 -1
- package/dist/post-components/p-82f4f464.entry.js +0 -1
- package/dist/post-components/p-98cb0bbd.entry.js +0 -1
- package/dist/post-components/p-9ee95668.entry.js +0 -1
- package/dist/post-components/p-a0d342e4.entry.js +0 -1
- package/dist/post-components/p-a9d59b04.js +0 -1
- package/dist/post-components/p-ac7b779e.js +0 -1
- package/dist/post-components/p-d9c9ed63.js +0 -1
- package/dist/post-components/p-e1bf894f.entry.js +0 -1
- package/dist/post-components/p-e8d17225.js +0 -1
- package/dist/post-components/p-f0e82e63.js +0 -1
- package/dist/post-components/p-f47b0207.js +0 -1
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
|
+
import { g as getAttributeObserver } from './attribute-observer-37fa950a.js';
|
|
4
|
+
|
|
5
|
+
const postPopoverCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.btn-close{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;-webkit-appearance:button;appearance:button;border-radius:4px;color:var(--post-gray-80);transition:opacity 250ms,border-color 250ms,background-color 250ms,color 250ms;cursor:pointer}.btn-close{outline-style:none !important;outline-offset:2px !important;outline-width:2px !important;outline-color:var(--post-focus-color) !important}.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:solid !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-style:solid !important;border-radius:4px}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.btn-close::before{-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m16.267 16.667 6.667-6.533-.933-1.067-6.667 6.667-6.667-6.667-.933 1.067 6.667 6.533-6.667 6.667 1.067.933 6.533-6.667 6.667 6.667.933-1.067z'/%3E%3C/svg%3E\");background-color:currentColor;color:currentColor;forced-color-adjust:preserve-parent-color;content:\"\";display:block;height:1.5rem;width:1.5rem}:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .btn-close{color:var(--post-contrast-color)}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:var(--post-contrast-color)}.btn-close:disabled{color:var(--post-gray-40)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.btn-close{color:CanvasText;forced-color-adjust:none}.btn-close:focus,.btn-close:not(:disabled):hover,.pretend-hover.btn-close{color:Highlight}}.btn-close-white{color:#e6e6e6}.btn-close-white:focus,.btn-close-white:not(:disabled):hover,.btn-close-white.pretend-hover{color:#fff}.btn-close-white:disabled{color:#999}*{box-sizing:border-box}:host{--post-contrast-color:#fff;--post-bg-rgb:51, 51, 51;display:block}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.popover-container{display:flex;align-items:self-start;padding:.5em;max-width:min(66vw,60rem)}@media (max-width: 599.98px){.popover-container{max-width:100%}}.popover-content{padding:.5em}";
|
|
6
|
+
const PostPopoverStyle0 = postPopoverCss;
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* @slot default - Slot for placing content inside the popover.
|
|
10
|
+
*/
|
|
11
|
+
let popoverInstances = 0;
|
|
12
|
+
const popoverTargetAttribute = 'data-popover-target';
|
|
13
|
+
const globalToggleHandler = (e) => {
|
|
14
|
+
const target = e.target;
|
|
15
|
+
if (!target || !('getAttribute' in target))
|
|
16
|
+
return;
|
|
17
|
+
const popoverTarget = target.getAttribute(popoverTargetAttribute);
|
|
18
|
+
if (!popoverTarget || ('key' in e && e.key !== 'Enter'))
|
|
19
|
+
return;
|
|
20
|
+
const popover = document.getElementById(popoverTarget);
|
|
21
|
+
popover === null || popover === void 0 ? void 0 : popover.toggle(target);
|
|
22
|
+
};
|
|
23
|
+
// Initialize a mutation observer for patching accessibility features
|
|
24
|
+
const triggerObserver = getAttributeObserver(popoverTargetAttribute, trigger => {
|
|
25
|
+
const force = trigger.hasAttribute(popoverTargetAttribute);
|
|
26
|
+
trigger.setAttribute('aria-expanded', force ? 'false' : null);
|
|
27
|
+
});
|
|
28
|
+
const PostPopover = class {
|
|
29
|
+
constructor(hostRef) {
|
|
30
|
+
registerInstance(this, hostRef);
|
|
31
|
+
this.placement = 'top';
|
|
32
|
+
this.closeButtonCaption = undefined;
|
|
33
|
+
this.arrow = true;
|
|
34
|
+
this.localBeforeToggleHandler = this.beforeToggleHandler.bind(this);
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
// Set up accessibility patcher and event listeners for the first component
|
|
38
|
+
if (popoverInstances === 0) {
|
|
39
|
+
window.addEventListener('pointerup', globalToggleHandler);
|
|
40
|
+
window.addEventListener('keydown', globalToggleHandler);
|
|
41
|
+
triggerObserver.observe(document.body, {
|
|
42
|
+
subtree: true,
|
|
43
|
+
childList: true,
|
|
44
|
+
attributeFilter: [popoverTargetAttribute],
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
popoverInstances++;
|
|
48
|
+
this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));
|
|
49
|
+
}
|
|
50
|
+
componentDidLoad() {
|
|
51
|
+
this.popoverRef.addEventListener('beforetoggle', this.localBeforeToggleHandler);
|
|
52
|
+
}
|
|
53
|
+
disconnectedCallback() {
|
|
54
|
+
popoverInstances--;
|
|
55
|
+
// Remove listeners and observer after the last popover has been destructed
|
|
56
|
+
if (popoverInstances === 0) {
|
|
57
|
+
window.removeEventListener('click', globalToggleHandler);
|
|
58
|
+
window.removeEventListener('keydown', globalToggleHandler);
|
|
59
|
+
triggerObserver.disconnect();
|
|
60
|
+
}
|
|
61
|
+
this.popoverRef.removeEventListener('beforetoggle', this.localBeforeToggleHandler);
|
|
62
|
+
this.triggers.forEach(trigger => trigger.removeAttribute('aria-expanded'));
|
|
63
|
+
}
|
|
64
|
+
/**
|
|
65
|
+
* Programmatically display the popover
|
|
66
|
+
* @param target An element with [data-popover-target="id"] where the popover should be shown
|
|
67
|
+
*/
|
|
68
|
+
async show(target) {
|
|
69
|
+
this.popoverRef.show(target);
|
|
70
|
+
target.setAttribute('aria-expanded', 'true');
|
|
71
|
+
}
|
|
72
|
+
/**
|
|
73
|
+
* Programmatically hide this popover
|
|
74
|
+
*/
|
|
75
|
+
async hide() {
|
|
76
|
+
this.popoverRef.hide();
|
|
77
|
+
this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));
|
|
78
|
+
}
|
|
79
|
+
/**
|
|
80
|
+
* Toggle popover display
|
|
81
|
+
* @param target An element with [data-popover-target="id"] where the popover should be anchored to
|
|
82
|
+
* @param force Pass true to always show or false to always hide
|
|
83
|
+
*/
|
|
84
|
+
async toggle(target, force) {
|
|
85
|
+
const newState = await this.popoverRef.toggle(target, force);
|
|
86
|
+
this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));
|
|
87
|
+
target.setAttribute('aria-expanded', `${newState}`);
|
|
88
|
+
}
|
|
89
|
+
get triggers() {
|
|
90
|
+
return document.querySelectorAll(`[${popoverTargetAttribute}="${this.host.id}"]`);
|
|
91
|
+
}
|
|
92
|
+
beforeToggleHandler() {
|
|
93
|
+
this.triggers.forEach(trigger => trigger.setAttribute('aria-expanded', 'false'));
|
|
94
|
+
}
|
|
95
|
+
render() {
|
|
96
|
+
return (h(Host, { key: '0ff53c82fb4ea06b0112cce0845e3ae06bdec959', "data-version": version }, h("post-popovercontainer", { key: '7375b83987e86015ee3892c5a9a829c6d04f78d3', arrow: this.arrow, placement: this.placement, ref: e => (this.popoverRef = e) }, h("div", { key: '6c6859eeb8d6abdf82757d8ea785e52ba2640243', class: "popover-container" }, h("div", { key: '7c28716d8b3c1d0322cf59781ae514e99ea5360f', class: "popover-content" }, h("slot", { key: 'e2c1f5166b2212f408932680cf6b33372404e28e' })), h("button", { key: 'ced34214917296d0b2f24a4584c409d9f3ee2d2d', class: "btn-close", onClick: () => this.hide() }, h("span", { key: '36ad0884209774bf95ab0cef26ae27a531eca2f8', class: "visually-hidden" }, this.closeButtonCaption))))));
|
|
97
|
+
}
|
|
98
|
+
get host() { return getElement(this); }
|
|
99
|
+
};
|
|
100
|
+
PostPopover.style = PostPopoverStyle0;
|
|
101
|
+
|
|
102
|
+
export { PostPopover as P };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { P as post_popover } from './post-popover-
|
|
2
|
-
import './index-
|
|
3
|
-
import './package-
|
|
1
|
+
export { P as post_popover } from './post-popover-b48a9d7c.js';
|
|
2
|
+
import './index-961099d2.js';
|
|
3
|
+
import './package-1242b80d.js';
|
|
4
4
|
import './attribute-observer-37fa950a.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-
|
|
2
|
-
import { v as version } from './package-
|
|
1
|
+
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Custom positioning reference element.
|
|
@@ -1199,8 +1199,9 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
|
|
|
1199
1199
|
if (domElement) {
|
|
1200
1200
|
const win = getWindow(domElement);
|
|
1201
1201
|
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1202
|
-
let
|
|
1203
|
-
|
|
1202
|
+
let currentWin = win;
|
|
1203
|
+
let currentIFrame = currentWin.frameElement;
|
|
1204
|
+
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
1204
1205
|
const iframeScale = getScale(currentIFrame);
|
|
1205
1206
|
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1206
1207
|
const css = getComputedStyle(currentIFrame);
|
|
@@ -1212,7 +1213,8 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
|
|
|
1212
1213
|
height *= iframeScale.y;
|
|
1213
1214
|
x += left;
|
|
1214
1215
|
y += top;
|
|
1215
|
-
|
|
1216
|
+
currentWin = getWindow(currentIFrame);
|
|
1217
|
+
currentIFrame = currentWin.frameElement;
|
|
1216
1218
|
}
|
|
1217
1219
|
}
|
|
1218
1220
|
return rectToClientRect({
|
|
@@ -1224,27 +1226,14 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
|
|
|
1224
1226
|
}
|
|
1225
1227
|
|
|
1226
1228
|
const topLayerSelectors = [':popover-open', ':modal'];
|
|
1227
|
-
function
|
|
1228
|
-
|
|
1229
|
-
let x = 0;
|
|
1230
|
-
let y = 0;
|
|
1231
|
-
function setIsTopLayer(selector) {
|
|
1229
|
+
function isTopLayer(floating) {
|
|
1230
|
+
return topLayerSelectors.some(selector => {
|
|
1232
1231
|
try {
|
|
1233
|
-
|
|
1234
|
-
} catch (e) {
|
|
1235
|
-
|
|
1236
|
-
topLayerSelectors.forEach(selector => {
|
|
1237
|
-
setIsTopLayer(selector);
|
|
1238
|
-
});
|
|
1239
|
-
if (isTopLayer) {
|
|
1240
|
-
const containingBlock = getContainingBlock(floating);
|
|
1241
|
-
if (containingBlock) {
|
|
1242
|
-
const rect = containingBlock.getBoundingClientRect();
|
|
1243
|
-
x = rect.x;
|
|
1244
|
-
y = rect.y;
|
|
1232
|
+
return floating.matches(selector);
|
|
1233
|
+
} catch (e) {
|
|
1234
|
+
return false;
|
|
1245
1235
|
}
|
|
1246
|
-
}
|
|
1247
|
-
return [isTopLayer, x, y];
|
|
1236
|
+
});
|
|
1248
1237
|
}
|
|
1249
1238
|
|
|
1250
1239
|
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
@@ -1254,9 +1243,10 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
|
1254
1243
|
offsetParent,
|
|
1255
1244
|
strategy
|
|
1256
1245
|
} = _ref;
|
|
1246
|
+
const isFixed = strategy === 'fixed';
|
|
1257
1247
|
const documentElement = getDocumentElement(offsetParent);
|
|
1258
|
-
const
|
|
1259
|
-
if (offsetParent === documentElement ||
|
|
1248
|
+
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
1249
|
+
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
1260
1250
|
return rect;
|
|
1261
1251
|
}
|
|
1262
1252
|
let scroll = {
|
|
@@ -1266,7 +1256,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
|
1266
1256
|
let scale = createCoords(1);
|
|
1267
1257
|
const offsets = createCoords(0);
|
|
1268
1258
|
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1269
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement &&
|
|
1259
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1270
1260
|
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1271
1261
|
scroll = getNodeScroll(offsetParent);
|
|
1272
1262
|
}
|
|
@@ -1457,7 +1447,7 @@ function getDimensions(element) {
|
|
|
1457
1447
|
};
|
|
1458
1448
|
}
|
|
1459
1449
|
|
|
1460
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy
|
|
1450
|
+
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1461
1451
|
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1462
1452
|
const documentElement = getDocumentElement(offsetParent);
|
|
1463
1453
|
const isFixed = strategy === 'fixed';
|
|
@@ -1479,17 +1469,8 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy, floating
|
|
|
1479
1469
|
offsets.x = getWindowScrollBarX(documentElement);
|
|
1480
1470
|
}
|
|
1481
1471
|
}
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
const [isTopLayer, topLayerX, topLayerY] = topLayer(floating);
|
|
1485
|
-
if (isTopLayer) {
|
|
1486
|
-
x += topLayerX;
|
|
1487
|
-
y += topLayerY;
|
|
1488
|
-
if (isOffsetParentAnElement) {
|
|
1489
|
-
x += offsetParent.clientLeft;
|
|
1490
|
-
y += offsetParent.clientTop;
|
|
1491
|
-
}
|
|
1492
|
-
}
|
|
1472
|
+
const x = rect.left + scroll.scrollLeft - offsets.x;
|
|
1473
|
+
const y = rect.top + scroll.scrollTop - offsets.y;
|
|
1493
1474
|
return {
|
|
1494
1475
|
x,
|
|
1495
1476
|
y,
|
|
@@ -1512,7 +1493,7 @@ function getTrueOffsetParent(element, polyfill) {
|
|
|
1512
1493
|
// such as table ancestors and cross browser bugs.
|
|
1513
1494
|
function getOffsetParent(element, polyfill) {
|
|
1514
1495
|
const window = getWindow(element);
|
|
1515
|
-
if (!isHTMLElement(element)) {
|
|
1496
|
+
if (!isHTMLElement(element) || isTopLayer(element)) {
|
|
1516
1497
|
return window;
|
|
1517
1498
|
}
|
|
1518
1499
|
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
@@ -1529,7 +1510,7 @@ const getElementRects = async function (data) {
|
|
|
1529
1510
|
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1530
1511
|
const getDimensionsFn = this.getDimensions;
|
|
1531
1512
|
return {
|
|
1532
|
-
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy
|
|
1513
|
+
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
1533
1514
|
floating: {
|
|
1534
1515
|
x: 0,
|
|
1535
1516
|
y: 0,
|
|
@@ -1844,7 +1825,7 @@ const SIDE_MAP = {
|
|
|
1844
1825
|
const PostPopovercontainer = class {
|
|
1845
1826
|
constructor(hostRef) {
|
|
1846
1827
|
registerInstance(this, hostRef);
|
|
1847
|
-
this.
|
|
1828
|
+
this.postToggle = createEvent(this, "postToggle", 7);
|
|
1848
1829
|
this.placement = 'top';
|
|
1849
1830
|
this.arrow = false;
|
|
1850
1831
|
}
|
|
@@ -1909,7 +1890,7 @@ const PostPopovercontainer = class {
|
|
|
1909
1890
|
if (typeof this.clearAutoUpdate === 'function')
|
|
1910
1891
|
this.clearAutoUpdate();
|
|
1911
1892
|
}
|
|
1912
|
-
this.
|
|
1893
|
+
this.postToggle.emit(isOpen);
|
|
1913
1894
|
}
|
|
1914
1895
|
/**
|
|
1915
1896
|
* Start listening for DOM updates, scroll events etc. that have
|
|
@@ -1968,9 +1949,9 @@ const PostPopovercontainer = class {
|
|
|
1968
1949
|
}
|
|
1969
1950
|
}
|
|
1970
1951
|
render() {
|
|
1971
|
-
return (h(Host, { key: '
|
|
1952
|
+
return (h(Host, { key: '885b256b85ee57c3114243c980db51bb4c7eef92', "data-version": version }, h("div", { key: 'e3ae342b6c0bb6b241141c5ee0d2a95ab0ba169e', class: "popover", part: "popover", ref: (el) => (this.popoverRef = el) }, this.arrow && (h("span", { class: "arrow", ref: el => {
|
|
1972
1953
|
this.arrowRef = el;
|
|
1973
|
-
} })), h("slot", { key: '
|
|
1954
|
+
} })), h("slot", { key: 'bc8d1e026b248c4c3cafa28c8cbdabe3610604e7' }))));
|
|
1974
1955
|
}
|
|
1975
1956
|
get host() { return getElement(this); }
|
|
1976
1957
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { P as post_popovercontainer } from './post-popovercontainer-
|
|
2
|
-
import './index-
|
|
3
|
-
import './package-
|
|
1
|
+
export { P as post_popovercontainer } from './post-popovercontainer-7413bb41.js';
|
|
2
|
+
import './index-961099d2.js';
|
|
3
|
+
import './package-1242b80d.js';
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
|
+
|
|
4
|
+
const postRatingCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:inline-block}.rating{display:flex;flex-wrap:wrap;overflow:hidden;margin:0 -0.25rem;border-radius:4px}.rating .star{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fff;position:relative;width:2rem;height:2rem;cursor:pointer}.rating .star .stroke,.rating .star .fill{display:block;width:100%;height:100%;transition:all ease 100ms}.rating .star .stroke{position:absolute;inset:auto;z-index:1;color:var(--post-rating-star-stroke)}.rating .star .fill{margin:1px;width:calc(100% - 2px);height:calc(100% - 2px);color:var(--post-rating-star-fill)}.rating .star.before-hover{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fc0}.rating .star.active{--post-rating-star-stroke:hsl(0, 0%, 20%);--post-rating-star-fill:#fc0}.rating .star.hover{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:#fc0}.rating .star.after-active{--post-rating-star-stroke:hsl(0, 0%, 40%);--post-rating-star-fill:hsl(0, 0%, 80%)}.rating :focus{outline:none}.rating:focus-visible{outline-offset:2px;outline:2px solid #1976c8}.rating[aria-readonly=true] .star,.rating[aria-disabled=true] .star{cursor:default}.rating[aria-disabled=true] .star{--post-rating-star-stroke:hsl(0, 0%, 60%);--post-rating-star-fill:#fff}.rating[aria-disabled=true] .star.active{cursor:default;--post-rating-star-stroke:hsl(0, 0%, 60%);--post-rating-star-fill:hsl(0, 0%, 90%)}";
|
|
5
|
+
const PostRatingStyle0 = postRatingCss;
|
|
6
|
+
|
|
7
|
+
const PostRating = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
registerInstance(this, hostRef);
|
|
10
|
+
this.postInput = createEvent(this, "postInput", 7);
|
|
11
|
+
this.postChange = createEvent(this, "postChange", 7);
|
|
12
|
+
this.hasChanged = false;
|
|
13
|
+
this.hoveredIndex = undefined;
|
|
14
|
+
this.label = 'Rating';
|
|
15
|
+
this.stars = 5;
|
|
16
|
+
this.currentRating = 0;
|
|
17
|
+
this.readonly = false;
|
|
18
|
+
this.keydownHandler = this.keydownHandler.bind(this);
|
|
19
|
+
this.blurHandler = this.blurHandler.bind(this);
|
|
20
|
+
this.hoverHandler = this.hoverHandler.bind(this);
|
|
21
|
+
}
|
|
22
|
+
update(value) {
|
|
23
|
+
if (this.readonly || value < 0 || value > this.stars)
|
|
24
|
+
return;
|
|
25
|
+
this.currentRating = this.currentRating !== value ? value : 0; // If a star is clicked the second time, the rating gets set to 0.
|
|
26
|
+
this.postInput.emit({ value: this.currentRating });
|
|
27
|
+
this.hasChanged = true;
|
|
28
|
+
}
|
|
29
|
+
keydownHandler(e) {
|
|
30
|
+
switch (e.key) {
|
|
31
|
+
case 'ArrowDown':
|
|
32
|
+
case 'ArrowLeft':
|
|
33
|
+
e.preventDefault();
|
|
34
|
+
this.update(this.currentRating - 1);
|
|
35
|
+
break;
|
|
36
|
+
case 'ArrowUp':
|
|
37
|
+
case 'ArrowRight':
|
|
38
|
+
e.preventDefault();
|
|
39
|
+
this.update(this.currentRating + 1);
|
|
40
|
+
break;
|
|
41
|
+
case 'Home':
|
|
42
|
+
e.preventDefault();
|
|
43
|
+
this.update(0);
|
|
44
|
+
break;
|
|
45
|
+
case 'End':
|
|
46
|
+
e.preventDefault();
|
|
47
|
+
this.update(this.stars);
|
|
48
|
+
break;
|
|
49
|
+
case 'Enter':
|
|
50
|
+
case ' ':
|
|
51
|
+
this.blurHandler();
|
|
52
|
+
break;
|
|
53
|
+
default:
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
blurHandler() {
|
|
58
|
+
if (this.hasChanged) {
|
|
59
|
+
this.postChange.emit({ value: this.currentRating });
|
|
60
|
+
this.hasChanged = false;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
hoverHandler(index, e) {
|
|
64
|
+
if (this.readonly)
|
|
65
|
+
return;
|
|
66
|
+
if (e.type === 'mouseenter') {
|
|
67
|
+
this.hoveredIndex = index;
|
|
68
|
+
}
|
|
69
|
+
else if (e.type === 'mouseleave') {
|
|
70
|
+
this.hoveredIndex = undefined;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
render() {
|
|
74
|
+
return (h(Host, { key: '9423629ce4f05cacb20fb3476d036dc175d21f98', "data-version": version }, h("div", { key: '99efcd3cad667d24ea27a4c592d5c3b202191ed4', role: "slider", class: "rating", tabindex: "0", "aria-label": this.label, "aria-valuemin": "0", "aria-valuemax": this.stars, "aria-valuenow": this.currentRating, "aria-valuetext": `${this.currentRating} out of ${this.stars}`, "aria-readonly": this.readonly ? 'true' : 'false', onKeyDown: this.keydownHandler, onBlur: this.blurHandler }, Array.from({ length: this.stars }).map((v, i) => (h("div", { key: `star-${v}`, "aria-hidden": "true", class: {
|
|
75
|
+
'star': true,
|
|
76
|
+
'before-hover': i < this.hoveredIndex,
|
|
77
|
+
'active': i < Math.round(this.currentRating),
|
|
78
|
+
'hover': i === this.hoveredIndex,
|
|
79
|
+
'after-active': i > this.hoveredIndex && i < this.currentRating,
|
|
80
|
+
}, onClick: () => this.update(i + 1), onMouseEnter: e => this.hoverHandler(i, e), onMouseLeave: e => this.hoverHandler(i, e) }, h("post-icon", { name: "2062", class: "stroke" }), h("post-icon", { name: "2574", class: "fill" })))))));
|
|
81
|
+
}
|
|
82
|
+
get host() { return getElement(this); }
|
|
83
|
+
};
|
|
84
|
+
PostRating.style = PostRatingStyle0;
|
|
85
|
+
|
|
86
|
+
export { PostRating as P };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
|
+
import { c as checkNonEmpty } from './check-non-empty-58bd6b17.js';
|
|
4
|
+
|
|
5
|
+
const postTabHeaderCss = ".tab-title[role=tab]{display:inline-block;cursor:pointer;position:relative;box-sizing:border-box;padding:1rem;transition:background-color 100ms;border-right:1px solid rgba(0,0,0,0);border-left:1px solid rgba(0,0,0,0);outline-color:currentColor;opacity:.7;color:var(--post-contrast-color);text-decoration:none;background-color:var(--post-contrast-color-inverted)}.tab-title[role=tab]:focus{background-color:unset;color:var(--post-contrast-color)}.tab-title[role=tab]:hover{opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted)}.tab-title[role=tab]:focus-visible{outline:rgba(0,0,0,0);opacity:1;background-color:rgba(var(--post-contrast-color-rgb), 0.6);color:var(--post-contrast-color-inverted);box-shadow:none}.tab-title[role=tab]:focus-visible::after{content:\"\";display:block;position:absolute;top:2px;right:1px;bottom:0;left:1px;box-shadow:0 0 0 1px #fff,0 0 0 2px #333}.tab-title[role=tab].active{z-index:1;border-right-color:#ccc;border-left-color:#ccc;opacity:1;background-color:var(--post-contrast-color-inverted);color:var(--post-contrast-color);font-weight:700}.tab-title[role=tab].active::before{content:\"\";display:block;position:absolute;top:0;right:-1px;left:-1px;height:.25rem;background-color:#fc0}:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .tab-title[role=tab]:hover{background-color:rgba(255,255,255,.2)}:is(.bg-dark,.bg-black,.bg-primary,.bg-secondary,.bg-success,.bg-error,.bg-nightblue,.bg-nightblue-bright,.bg-petrol,.bg-coral,.bg-olive,.bg-purple,.bg-purple-bright,.bg-aubergine,.bg-aubergine-bright,.alert-primary,post-alert[type=primary],.alert-success,post-alert[type=success],.alert-danger,post-alert[type=danger],.alert-notification,post-alert[type=notification],.alert-error,post-alert[type=error]) .tab-title[role=tab]:focus-visible{background-color:rgba(255,255,255,.2)}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tab-title[role=tab]{opacity:1;border-left-color:Canvas;border-right-color:Canvas;color:LinkText}.tab-title[role=tab]:hover,.tab-title[role=tab]:focus,.tab-title[role=tab]:focus-within,.tab-title[role=tab]:focus-visible{outline:2px solid Highlight;outline-offset:-0.25rem}.tab-title[role=tab].active{border-left-color:ButtonText;border-right-color:ButtonText;color:Highlight}.tab-title[role=tab].active::before{background-color:Highlight}}.bg-yellow .tab-title{background-color:#fc0}.bg-yellow .tab-title.active{background-color:#fc0}.bg-yellow .nav-item{background-color:#fc0}.bg-white .tab-title{background-color:#fff}.bg-white .tab-title.active{background-color:#fff}.bg-white .nav-item{background-color:#fff}.bg-light .tab-title{background-color:#faf9f8}.bg-light .tab-title.active{background-color:#faf9f8}.bg-light .nav-item{background-color:#faf9f8}.bg-gray .tab-title{background-color:#f4f3f1}.bg-gray .tab-title.active{background-color:#f4f3f1}.bg-gray .nav-item{background-color:#f4f3f1}.bg-dark .tab-title{background-color:#333}.bg-dark .tab-title.active{background-color:#333}.bg-dark .nav-item{background-color:#333}.bg-black .tab-title{background-color:#000}.bg-black .tab-title.active{background-color:#000}.bg-black .nav-item{background-color:#000}.bg-primary .tab-title{background-color:#333}.bg-primary .tab-title.active{background-color:#333}.bg-primary .nav-item{background-color:#333}.bg-secondary .tab-title{background-color:#666}.bg-secondary .tab-title.active{background-color:#666}.bg-secondary .nav-item{background-color:#666}.bg-success .tab-title{background-color:#2c871d}.bg-success .tab-title.active{background-color:#2c871d}.bg-success .nav-item{background-color:#2c871d}.bg-warning .tab-title{background-color:#f49e00}.bg-warning .tab-title.active{background-color:#f49e00}.bg-warning .nav-item{background-color:#f49e00}.bg-error .tab-title{background-color:#a51728}.bg-error .tab-title.active{background-color:#a51728}.bg-error .nav-item{background-color:#a51728}.bg-info .tab-title{background-color:#cce4ee}.bg-info .tab-title.active{background-color:#cce4ee}.bg-info .nav-item{background-color:#cce4ee}.bg-success-background .tab-title{background-color:#c0debb}.bg-success-background .tab-title.active{background-color:#c0debb}.bg-success-background .nav-item{background-color:#c0debb}.bg-warning-background .tab-title{background-color:#fce2b2}.bg-warning-background .tab-title.active{background-color:#fce2b2}.bg-warning-background .nav-item{background-color:#fce2b2}.bg-error-background .tab-title{background-color:#ffdade}.bg-error-background .tab-title.active{background-color:#ffdade}.bg-error-background .nav-item{background-color:#ffdade}.bg-nightblue .tab-title{background-color:#004976}.bg-nightblue .tab-title.active{background-color:#004976}.bg-nightblue .nav-item{background-color:#004976}.bg-nightblue-bright .tab-title{background-color:#0076a8}.bg-nightblue-bright .tab-title.active{background-color:#0076a8}.bg-nightblue-bright .nav-item{background-color:#0076a8}.bg-petrol .tab-title{background-color:#006d68}.bg-petrol .tab-title.active{background-color:#006d68}.bg-petrol .nav-item{background-color:#006d68}.bg-petrol-bright .tab-title{background-color:#00968f}.bg-petrol-bright .tab-title.active{background-color:#00968f}.bg-petrol-bright .nav-item{background-color:#00968f}.bg-coral .tab-title{background-color:#9e2a2f}.bg-coral .tab-title.active{background-color:#9e2a2f}.bg-coral .nav-item{background-color:#9e2a2f}.bg-coral-bright .tab-title{background-color:#e03c31}.bg-coral-bright .tab-title.active{background-color:#e03c31}.bg-coral-bright .nav-item{background-color:#e03c31}.bg-olive .tab-title{background-color:#716135}.bg-olive .tab-title.active{background-color:#716135}.bg-olive .nav-item{background-color:#716135}.bg-olive-bright .tab-title{background-color:#aa9d2e}.bg-olive-bright .tab-title.active{background-color:#aa9d2e}.bg-olive-bright .nav-item{background-color:#aa9d2e}.bg-purple .tab-title{background-color:#80276c}.bg-purple .tab-title.active{background-color:#80276c}.bg-purple .nav-item{background-color:#80276c}.bg-purple-bright .tab-title{background-color:#c5299b}.bg-purple-bright .tab-title.active{background-color:#c5299b}.bg-purple-bright .nav-item{background-color:#c5299b}.bg-aubergine .tab-title{background-color:#523178}.bg-aubergine .tab-title.active{background-color:#523178}.bg-aubergine .nav-item{background-color:#523178}.bg-aubergine-bright .tab-title{background-color:#7566a0}.bg-aubergine-bright .tab-title.active{background-color:#7566a0}.bg-aubergine-bright .nav-item{background-color:#7566a0}[class*=bg-] .tab-title.active:focus::after{background-color:rgba(255,255,255,.2)}@supports selector(*:focus-visible){[class*=bg-] .tab-title.active:focus::after{background-color:unset}[class*=bg-] .tab-title.active:focus-visible::after{background-color:rgba(255,255,255,.2)}}/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */:host{display:block}.tab-title{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;-webkit-user-select:none;user-select:none;-webkit-appearance:button;appearance:button}";
|
|
6
|
+
const PostTabHeaderStyle0 = postTabHeaderCss;
|
|
7
|
+
|
|
8
|
+
const PostTabHeader = class {
|
|
9
|
+
constructor(hostRef) {
|
|
10
|
+
registerInstance(this, hostRef);
|
|
11
|
+
this.tabId = undefined;
|
|
12
|
+
this.panel = undefined;
|
|
13
|
+
}
|
|
14
|
+
validateFor(newValue) {
|
|
15
|
+
checkNonEmpty(newValue, 'The "panel" prop is required for the post-tab-header.');
|
|
16
|
+
}
|
|
17
|
+
componentWillLoad() {
|
|
18
|
+
this.tabId = `tab-${this.host.id || crypto.randomUUID()}`;
|
|
19
|
+
}
|
|
20
|
+
render() {
|
|
21
|
+
return (h(Host, { key: '7574d4ab05fae64a57f718e8c185c3aec1690e0f', id: this.tabId, role: "tab", "data-version": version, "aria-selected": "false", tabindex: "-1", class: "tab-title" }, h("slot", { key: 'c8af8275935433eba2d673fe283412a2a9266340' })));
|
|
22
|
+
}
|
|
23
|
+
get host() { return getElement(this); }
|
|
24
|
+
static get watchers() { return {
|
|
25
|
+
"panel": ["validateFor"]
|
|
26
|
+
}; }
|
|
27
|
+
};
|
|
28
|
+
PostTabHeader.style = PostTabHeaderStyle0;
|
|
29
|
+
|
|
30
|
+
export { PostTabHeader as P };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { P as post_tab_header } from './post-tab-header-
|
|
2
|
-
import './index-
|
|
3
|
-
import './package-
|
|
1
|
+
export { P as post_tab_header } from './post-tab-header-95f0dc6a.js';
|
|
2
|
+
import './index-961099d2.js';
|
|
3
|
+
import './package-1242b80d.js';
|
|
4
4
|
import './check-non-empty-58bd6b17.js';
|
|
5
5
|
import './constants-8d548297.js';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, g as getElement } from './index-
|
|
2
|
-
import { v as version } from './package-
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
3
|
|
|
4
4
|
const postTabPanelCss = ":host{display:none}";
|
|
5
5
|
const PostTabPanelStyle0 = postTabPanelCss;
|
|
@@ -15,7 +15,7 @@ const PostTabPanel = class {
|
|
|
15
15
|
this.panelId = `panel-${this.host.id || crypto.randomUUID()}`;
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
-
return (h(Host, { key: '
|
|
18
|
+
return (h(Host, { key: '3833b2f565d457ea6f8c35273f0fe310b56b2d00', "data-version": version, id: this.panelId, role: "tabpanel" }, h("slot", { key: '299c354b73a8d04ebab94ad7bc10cb703127ee65' })));
|
|
19
19
|
}
|
|
20
20
|
get host() { return getElement(this); }
|
|
21
21
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { P as post_tab_panel } from './post-tab-panel-
|
|
2
|
-
import './index-
|
|
3
|
-
import './package-
|
|
1
|
+
export { P as post_tab_panel } from './post-tab-panel-d7145a70.js';
|
|
2
|
+
import './index-961099d2.js';
|
|
3
|
+
import './package-1242b80d.js';
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-
|
|
2
|
-
import { v as version } from './package-
|
|
1
|
+
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
3
|
import { f as fadeOut, a as fadeIn } from './fade-7fd71785.js';
|
|
4
4
|
|
|
5
|
-
const postTabsCss = ".tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color
|
|
5
|
+
const postTabsCss = ".tabs-wrapper{position:relative;padding-top:1rem;border:0;background-color:rgba(var(--post-contrast-color-rgb), 0.02)}.tabs-wrapper::after{content:\"\";position:absolute;bottom:0;width:100%;height:1px;background-color:#ccc}.tabs-wrapper .tabs{background-color:rgba(0,0,0,0) !important}@media (forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.tabs-wrapper::after{background-color:ButtonBorder}}.tabs{margin:0;padding:0;list-style:none;display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;white-space:nowrap}.tabs::after{content:\"\";display:block;flex:1 0 auto;width:1rem}.tab-content{padding-top:1rem}.bg-yellow .tabs-wrapper{background-color:#fc0}.bg-white .tabs-wrapper{background-color:#fff}.bg-light .tabs-wrapper{background-color:#faf9f8}.bg-gray .tabs-wrapper{background-color:#f4f3f1}.bg-dark .tabs-wrapper{background-color:#333}.bg-black .tabs-wrapper{background-color:#000}.bg-primary .tabs-wrapper{background-color:#333}.bg-secondary .tabs-wrapper{background-color:#666}.bg-success .tabs-wrapper{background-color:#2c871d}.bg-warning .tabs-wrapper{background-color:#f49e00}.bg-error .tabs-wrapper{background-color:#a51728}.bg-info .tabs-wrapper{background-color:#cce4ee}.bg-success-background .tabs-wrapper{background-color:#c0debb}.bg-warning-background .tabs-wrapper{background-color:#fce2b2}.bg-error-background .tabs-wrapper{background-color:#ffdade}.bg-nightblue .tabs-wrapper{background-color:#004976}.bg-nightblue-bright .tabs-wrapper{background-color:#0076a8}.bg-petrol .tabs-wrapper{background-color:#006d68}.bg-petrol-bright .tabs-wrapper{background-color:#00968f}.bg-coral .tabs-wrapper{background-color:#9e2a2f}.bg-coral-bright .tabs-wrapper{background-color:#e03c31}.bg-olive .tabs-wrapper{background-color:#716135}.bg-olive-bright .tabs-wrapper{background-color:#aa9d2e}.bg-purple .tabs-wrapper{background-color:#80276c}.bg-purple-bright .tabs-wrapper{background-color:#c5299b}.bg-aubergine .tabs-wrapper{background-color:#523178}.bg-aubergine-bright .tabs-wrapper{background-color:#7566a0}:host{display:block}";
|
|
6
6
|
const PostTabsStyle0 = postTabsCss;
|
|
7
7
|
|
|
8
8
|
const PostTabs = class {
|
|
9
9
|
constructor(hostRef) {
|
|
10
10
|
registerInstance(this, hostRef);
|
|
11
|
-
this.
|
|
11
|
+
this.postChange = createEvent(this, "postChange", 7);
|
|
12
12
|
this.isLoaded = false;
|
|
13
13
|
this.activePanel = undefined;
|
|
14
14
|
}
|
|
@@ -53,7 +53,7 @@ const PostTabs = class {
|
|
|
53
53
|
if (this.showing) {
|
|
54
54
|
await this.showing.finished;
|
|
55
55
|
}
|
|
56
|
-
this.
|
|
56
|
+
this.postChange.emit(this.activeTab.panel);
|
|
57
57
|
}
|
|
58
58
|
moveMisplacedTabs() {
|
|
59
59
|
if (!this.tabs)
|
|
@@ -69,16 +69,21 @@ const PostTabs = class {
|
|
|
69
69
|
return;
|
|
70
70
|
this.tabs.forEach(async (tab) => {
|
|
71
71
|
await tab.componentOnReady();
|
|
72
|
-
const tabTitle = tab.shadowRoot.querySelector('.tab-title');
|
|
73
72
|
// if the tab has an "aria-controls" attribute it was already linked to its panel: do nothing
|
|
74
|
-
if (
|
|
73
|
+
if (tab.getAttribute('aria-controls'))
|
|
75
74
|
return;
|
|
76
|
-
const tabPanel = this.getPanel(tab.panel)
|
|
77
|
-
|
|
78
|
-
tabPanel.setAttribute('aria-labelledby',
|
|
75
|
+
const tabPanel = this.getPanel(tab.panel);
|
|
76
|
+
tab.setAttribute('aria-controls', tabPanel.id);
|
|
77
|
+
tabPanel.setAttribute('aria-labelledby', tab.id);
|
|
79
78
|
tab.addEventListener('click', () => {
|
|
80
79
|
void this.show(tab.panel);
|
|
81
80
|
});
|
|
81
|
+
tab.addEventListener('keydown', (e) => {
|
|
82
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
83
|
+
e.preventDefault();
|
|
84
|
+
void this.show(tab.panel);
|
|
85
|
+
}
|
|
86
|
+
});
|
|
82
87
|
tab.addEventListener('keydown', ({ key }) => {
|
|
83
88
|
if (key === 'ArrowRight' || key === 'ArrowLeft')
|
|
84
89
|
this.navigateTabs(tab, key);
|
|
@@ -91,15 +96,13 @@ const PostTabs = class {
|
|
|
91
96
|
}
|
|
92
97
|
activateTab(tab) {
|
|
93
98
|
if (this.activeTab) {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
tabTitle.classList.remove('active');
|
|
99
|
+
this.activeTab.setAttribute('aria-selected', 'false');
|
|
100
|
+
this.activeTab.setAttribute('tabindex', '-1');
|
|
101
|
+
this.activeTab.classList.remove('active');
|
|
98
102
|
}
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
tabTitle.classList.add('active');
|
|
103
|
+
tab.setAttribute('aria-selected', 'true');
|
|
104
|
+
tab.setAttribute('tabindex', '0');
|
|
105
|
+
tab.classList.add('active');
|
|
103
106
|
this.activeTab = tab;
|
|
104
107
|
}
|
|
105
108
|
hidePanel(panelName) {
|
|
@@ -137,11 +140,10 @@ const PostTabs = class {
|
|
|
137
140
|
}
|
|
138
141
|
if (!nextTab)
|
|
139
142
|
return;
|
|
140
|
-
|
|
141
|
-
nextTabTitle.focus();
|
|
143
|
+
nextTab.focus();
|
|
142
144
|
}
|
|
143
145
|
render() {
|
|
144
|
-
return (h(Host, { key: '
|
|
146
|
+
return (h(Host, { key: '3af6b715a2ff43314fbc6c436a7693345baabbdb', "data-version": version }, h("div", { key: 'a63850f142b198057a11039101c9ca3c3793f564', class: "tabs-wrapper" }, h("div", { key: '3c3592ea6241f07d672bc4cc049e7f582ba35fef', class: "tabs", role: "tablist" }, h("slot", { key: 'da38ec0fc7cd43588b151f6675458eb0f34b911e', name: "tabs", onSlotchange: () => this.enableTabs() }))), h("div", { key: '451cc4a29b77f3055f469ff18081c5292e21bf36', class: "tab-content" }, h("slot", { key: '32902b5e314c29e74bf4f6c5f02e22c301a47f6f', onSlotchange: () => this.moveMisplacedTabs() }))));
|
|
145
147
|
}
|
|
146
148
|
get host() { return getElement(this); }
|
|
147
149
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { P as post_tabs } from './post-tabs-
|
|
2
|
-
import './index-
|
|
3
|
-
import './package-
|
|
1
|
+
export { P as post_tabs } from './post-tabs-f130a7d8.js';
|
|
2
|
+
import './index-961099d2.js';
|
|
3
|
+
import './package-1242b80d.js';
|
|
4
4
|
import './fade-7fd71785.js';
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { r as registerInstance, h, H as Host, g as getElement } from './index-961099d2.js';
|
|
2
|
+
import { v as version } from './package-1242b80d.js';
|
|
3
|
+
|
|
4
|
+
const postTagCss = "/*!\n * Bootstrap Utilities v5.1.3 (https://getbootstrap.com/)\n * Copyright 2011-2021 The Bootstrap Authors\n * Copyright 2011-2021 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)\n\n * The MIT License (MIT)\n\n * Copyright (c) 2011-2020 Twitter, Inc.\n * Copyright (c) 2011-2020 The Bootstrap Authors\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *//*!\n * Copyright 2021 by Swiss Post, Information Technology\n */.tag,.tag:where(:has(:not(pre))){--post-tag-bg:hsl(0, 0%, 90%);--post-tag-fg:#000;display:inline-flex;align-items:center;gap:.25rem;padding:0 .5rem;max-width:18.5rem;background-color:var(--post-tag-bg);border:1px solid rgba(0,0,0,0);border-radius:.25rem;font-size:1rem;line-height:1.875rem;white-space:nowrap;color:var(--post-tag-fg)}.tag post-icon,.tag:where(:has(:not(pre))) post-icon{flex:0 0 auto;width:1.25rem;height:1.25rem}.tag .tag-text,.tag:where(:has(:not(pre))) .tag-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tag .tag-text svg,.tag .tag-text img,.tag:where(:has(:not(pre))) .tag-text svg,.tag:where(:has(:not(pre))) .tag-text img{display:inline-block;height:1.25rem !important;vertical-align:text-top}.tag.tag-sm,.tag:where(:has(:not(pre))).tag-sm{line-height:1.5rem}.tag.tag-sm .tag-icon,.tag:where(:has(:not(pre))).tag-sm .tag-icon{width:1rem;height:1rem}.tag.tag-white,.tag:where(:has(:not(pre))).tag-white{--post-tag-bg:#fff;--post-tag-fg:#000}.tag.tag-yellow,.tag:where(:has(:not(pre))).tag-yellow{--post-tag-bg:#fc0;--post-tag-fg:#000}.tag.tag-success,.tag:where(:has(:not(pre))).tag-success{--post-tag-bg:#2c871d;--post-tag-fg:#fff}.tag.tag-warning,.tag:where(:has(:not(pre))).tag-warning{--post-tag-bg:#f49e00;--post-tag-fg:#000}.tag.tag-danger,.tag:where(:has(:not(pre))).tag-danger{--post-tag-bg:#a51728;--post-tag-fg:#fff}.tag.tag-info,.tag:where(:has(:not(pre))).tag-info{--post-tag-bg:#cce4ee;--post-tag-fg:#000}.tag.tag-white,.tag:where(:has(:not(pre))).tag-white{border-color:var(--post-contrast-color)}pre .tag,pre .tag:where(:has(:not(pre))){display:inline;padding:initial;max-width:initial;background:initial;border:initial;border-radius:initial;font-size:inherit;line-height:inherit;white-space:unset}*,*:before,*:after{box-sizing:border-box}.tag-text ::slotted(svg),.tag-text ::slotted(img){display:inline-block !important;height:1.25rem !important;vertical-align:text-top !important}";
|
|
5
|
+
const PostTagStyle0 = postTagCss;
|
|
6
|
+
|
|
7
|
+
const PostTag = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
registerInstance(this, hostRef);
|
|
10
|
+
this.classes = undefined;
|
|
11
|
+
this.variant = undefined;
|
|
12
|
+
this.size = null;
|
|
13
|
+
this.icon = null;
|
|
14
|
+
this.setClasses = this.setClasses.bind(this);
|
|
15
|
+
}
|
|
16
|
+
variantChanged() {
|
|
17
|
+
this.setClasses();
|
|
18
|
+
}
|
|
19
|
+
sizeChanged() {
|
|
20
|
+
this.setClasses();
|
|
21
|
+
}
|
|
22
|
+
setClasses() {
|
|
23
|
+
this.classes = ['tag', this.size ? `tag-${this.size}` : null, this.variant ? `tag-${this.variant}` : null]
|
|
24
|
+
.filter(c => c !== null)
|
|
25
|
+
.join(' ');
|
|
26
|
+
}
|
|
27
|
+
connectedCallback() {
|
|
28
|
+
this.setClasses();
|
|
29
|
+
}
|
|
30
|
+
render() {
|
|
31
|
+
return (h(Host, { key: '2b5b8cf859417949329040bad1f03d94b090fcaa', "data-version": version }, h("div", { key: 'b3e8e5b78959b3036e708faa209d57c75c570e60', class: this.classes }, this.icon ? h("post-icon", { name: this.icon }) : null, h("div", { key: '152f8db8aa831d05545ae3f5555083299132ad2f', class: "tag-text" }, h("slot", { key: '043aa0a1f6bceb3757c1bc7a528fb29eaa1b6b22' })))));
|
|
32
|
+
}
|
|
33
|
+
get host() { return getElement(this); }
|
|
34
|
+
static get watchers() { return {
|
|
35
|
+
"variant": ["variantChanged"],
|
|
36
|
+
"size": ["sizeChanged"]
|
|
37
|
+
}; }
|
|
38
|
+
};
|
|
39
|
+
PostTag.style = PostTagStyle0;
|
|
40
|
+
|
|
41
|
+
export { PostTag as P };
|