@getflip/swirl-components 0.363.4 → 0.363.6
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/components.json +1 -1
- package/dist/cjs/swirl-icon-check-small_2.cjs.entry.js +1 -1
- package/dist/cjs/swirl-shell-navigation-item.cjs.entry.js +2 -2
- package/dist/collection/components/swirl-option-list-item/swirl-option-list-item.css +0 -2
- package/dist/collection/components/swirl-shell-navigation-item/swirl-shell-navigation-item.js +2 -2
- package/dist/components/assets/pdfjs/pdf.worker.min.mjs +1 -4
- package/dist/components/swirl-option-list-item2.js +1 -1
- package/dist/components/swirl-shell-navigation-item.js +2 -2
- package/dist/esm/swirl-icon-check-small_2.entry.js +1 -1
- package/dist/esm/swirl-shell-navigation-item.entry.js +2 -2
- package/dist/swirl-components/{p-73494f93.entry.js → p-0d272c91.entry.js} +1 -1
- package/dist/swirl-components/p-a2aba920.entry.js +1 -0
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/package.json +1 -1
- package/dist/swirl-components/p-5e243452.entry.js +0 -1
|
@@ -6,7 +6,7 @@ import { d as defineCustomElement$2 } from './swirl-icon-check-strong2.js';
|
|
|
6
6
|
import { d as defineCustomElement$1 } from './swirl-icon-drag-handle2.js';
|
|
7
7
|
import { v as v4 } from './v4.js';
|
|
8
8
|
|
|
9
|
-
const swirlOptionListItemCss = ".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;
|
|
9
|
+
const swirlOptionListItemCss = ".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;flex-shrink:0}.option-list-item__icon.sc-swirl-option-list-item{display:inline-flex;position:relative;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__icon.sc-swirl-option-list-item{width:1.25rem;height:1.25rem}}.option-list-item__icon-badge.sc-swirl-option-list-item{position:absolute;display:grid;bottom:0;right:0}.option-list-item__selection-icon.sc-swirl-option-list-item{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox.sc-swirl-option-list-item{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__checkbox.sc-swirl-option-list-item{width:1.375rem;height:1.375rem}}.option-list-item__checkbox-box.sc-swirl-option-list-item{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon.sc-swirl-option-list-item{display:inline-flex}.option-list-item__drag-handle.sc-swirl-option-list-item{position:absolute;z-index:1;top:50%;right:var(--s-space-4);display:inline-flex;margin:0;padding:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.option-list-item__drag-handle.sc-swirl-option-list-item:active{cursor:grabbing}.option-list-item__drag-handle.sc-swirl-option-list-item:focus:not(:focus-visible){outline:none}.option-list-item__drag-handle.sc-swirl-option-list-item:focus-visible{outline-color:var(--s-focus-default)}";
|
|
10
10
|
|
|
11
11
|
const SwirlOptionListItem = /*@__PURE__*/ proxyCustomElement(class SwirlOptionListItem extends HTMLElement {
|
|
12
12
|
constructor() {
|
|
@@ -65,9 +65,9 @@ const SwirlShellNavigationItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlS
|
|
|
65
65
|
const tooltipContent = this.description
|
|
66
66
|
? `${this.label} ${this.description}`
|
|
67
67
|
: this.label;
|
|
68
|
-
return (h(Host, { key: '8cdedcd426b2b2e2009c935f803d63426c4e4515' }, h("swirl-tooltip", { key: 'ef8e5f86988bbba1cfbe8c1dc446b6d3bb500446', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: '
|
|
68
|
+
return (h(Host, { key: '8cdedcd426b2b2e2009c935f803d63426c4e4515' }, h("swirl-tooltip", { key: 'ef8e5f86988bbba1cfbe8c1dc446b6d3bb500446', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: 'c0e7008e92689e61f70d644541d8520f58731783', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'c78cb91aae92b6dff68038a16d304ee3a4304c78', class: "shell-navigation-item__icon" }, h("slot", { key: '31478c066302a3a54ffc18d1702bf296bf279940', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: 'beaa48fff9d31f5e6bd0c700d1518703035417ef', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: '209480b493dc2cf33c27d8794ff872849108d982', "aria-label": this.badgeLabel, class: classNames("shell-navigation-item__badge", {
|
|
69
69
|
"shell-navigation-item__badge--dot": this.badgeLabel === "",
|
|
70
|
-
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '
|
|
70
|
+
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '0d394f4d45fd5a6db4bd4fbd654696bf6017b030', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: '9d3f39f372a5fcaefb7113b4191eccd726e36a1f', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
|
|
71
71
|
}
|
|
72
72
|
get el() { return this; }
|
|
73
73
|
static get style() { return swirlShellNavigationItemCss; }
|
|
@@ -22,7 +22,7 @@ const SwirlIconCheckSmall = class {
|
|
|
22
22
|
};
|
|
23
23
|
SwirlIconCheckSmall.style = swirlIconCss;
|
|
24
24
|
|
|
25
|
-
const swirlOptionListItemCss = ".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;
|
|
25
|
+
const swirlOptionListItemCss = ".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;flex-shrink:0}.option-list-item__icon.sc-swirl-option-list-item{display:inline-flex;position:relative;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__icon.sc-swirl-option-list-item{width:1.25rem;height:1.25rem}}.option-list-item__icon-badge.sc-swirl-option-list-item{position:absolute;display:grid;bottom:0;right:0}.option-list-item__selection-icon.sc-swirl-option-list-item{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox.sc-swirl-option-list-item{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__checkbox.sc-swirl-option-list-item{width:1.375rem;height:1.375rem}}.option-list-item__checkbox-box.sc-swirl-option-list-item{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon.sc-swirl-option-list-item{display:inline-flex}.option-list-item__drag-handle.sc-swirl-option-list-item{position:absolute;z-index:1;top:50%;right:var(--s-space-4);display:inline-flex;margin:0;padding:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.option-list-item__drag-handle.sc-swirl-option-list-item:active{cursor:grabbing}.option-list-item__drag-handle.sc-swirl-option-list-item:focus:not(:focus-visible){outline:none}.option-list-item__drag-handle.sc-swirl-option-list-item:focus-visible{outline-color:var(--s-focus-default)}";
|
|
26
26
|
|
|
27
27
|
const SwirlOptionListItem = class {
|
|
28
28
|
constructor(hostRef) {
|
|
@@ -58,9 +58,9 @@ const SwirlShellNavigationItem = class {
|
|
|
58
58
|
const tooltipContent = this.description
|
|
59
59
|
? `${this.label} ${this.description}`
|
|
60
60
|
: this.label;
|
|
61
|
-
return (h(Host, { key: '8cdedcd426b2b2e2009c935f803d63426c4e4515' }, h("swirl-tooltip", { key: 'ef8e5f86988bbba1cfbe8c1dc446b6d3bb500446', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: '
|
|
61
|
+
return (h(Host, { key: '8cdedcd426b2b2e2009c935f803d63426c4e4515' }, h("swirl-tooltip", { key: 'ef8e5f86988bbba1cfbe8c1dc446b6d3bb500446', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: 'c0e7008e92689e61f70d644541d8520f58731783', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'c78cb91aae92b6dff68038a16d304ee3a4304c78', class: "shell-navigation-item__icon" }, h("slot", { key: '31478c066302a3a54ffc18d1702bf296bf279940', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: 'beaa48fff9d31f5e6bd0c700d1518703035417ef', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: '209480b493dc2cf33c27d8794ff872849108d982', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
|
|
62
62
|
"shell-navigation-item__badge--dot": this.badgeLabel === "",
|
|
63
|
-
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '
|
|
63
|
+
}), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '0d394f4d45fd5a6db4bd4fbd654696bf6017b030', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: '9d3f39f372a5fcaefb7113b4191eccd726e36a1f', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
|
|
64
64
|
}
|
|
65
65
|
get el() { return getElement(this); }
|
|
66
66
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as i,h as t,F as s,c as e,H as o,d as l}from"./p-CWOhMVtL.js";import{c as n}from"./p-orsBiyT_.js";import{D as a}from"./p-LU4x678Z.js";import{v as r}from"./p-DD3477fe.js";import"./p-D_MUFqkF.js";const c=class{constructor(t){i(this,t),this.size=24}render(){const i=20===this.size?24:this.size,e={color:Boolean(this.color)?`var(--s-icon-${this.color})`:void 0},o=n("swirl-icon",`swirl-icon--size-${this.size}`);return t("svg",{key:"86c65881a19e81f25345239840884e0f8365b020","aria-hidden":"true",class:o,fill:"none",height:this.size,part:"icon",style:e,viewBox:`0 0 ${i} ${i}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,{key:"32a20c7ebf4c7d14fb0923257ee41bda9154c096"},t("path",{key:"bce3f131dd7b0c18a3d90980cc4977628793bac9","fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4142 4.91924C12.8047 5.30976 12.8047 5.94293 12.4142 6.33345L7.08086 11.6667C6.69033 12.0572 6.05717 12.0572 5.66664 11.6667L3.70711 9.70707C3.31658 9.31655 3.31658 8.68338 3.70711 8.29286C4.09763 7.90233 4.7308 7.90233 5.12132 8.29286L6.37375 9.54539L11 4.91924C11.3905 4.52871 12.0237 4.52871 12.4142 4.91924Z",fill:"currentColor"})),(20===this.size||24===this.size)&&t(s,{key:"f8fdd1dc701ef3ec3463726fdfdcc77ec65218e1"},t("path",{key:"a3dd6757827c6887efea1f3edc3d23b63b9f1c6e","fill-rule":"evenodd","clip-rule":"evenodd",d:"M18.6213 7.37879C19.2071 7.96458 19.2071 8.91433 18.6213 9.50011L10.6213 17.5C10.0355 18.0858 9.08577 18.0858 8.49998 17.5L5.56068 14.5605C4.97489 13.9748 4.97489 13.025 5.56068 12.4392C6.14646 11.8534 7.09621 11.8534 7.682 12.4392L9.56064 14.318L16.5 7.37879C17.0858 6.79301 18.0355 6.79301 18.6213 7.37879Z",fill:"currentColor"})),28===this.size&&t(s,{key:"67fa72f7fe9590fb0882cf516a6c2ba68fe7f175"},t("path",{key:"5c7451a7104842b97c66b74bd4d4ba11f20f3d04","fill-rule":"evenodd","clip-rule":"evenodd",d:"M21.7248 8.60863C22.4083 9.29205 22.4083 10.4001 21.7248 11.0835L12.3915 20.4167C11.7081 21.1001 10.6001 21.1001 9.91663 20.4167L6.48744 16.9873C5.80403 16.3039 5.80403 15.1959 6.48744 14.5125C7.17086 13.8291 8.2789 13.8291 8.96232 14.5125L11.1541 16.7044L19.25 8.60863C19.9334 7.92521 21.0414 7.92521 21.7248 8.60863Z",fill:"currentColor"})))}};c.style=":host{display:inline-flex;max-width:100%;max-height:100%}.swirl-icon{max-width:100%;max-height:100%}";const d=class{constructor(t){i(this,t),this.toggleDrag=e(this,"toggleDrag",7),this.context="single-select",this.dragHandleDescription="Press spacebar to toggle grab",this.dragHandleLabel="Move option",this.selected=!1,this.swirlAriaRole="option",this.iconSize=24,this.elementId=r(),this.mediaQueryUnsubscribe=()=>{},this.onDragHandleKeyDown=i=>{"Space"!==i.code&&"Enter"!==i.code||(i.preventDefault(),this.toggleDrag.emit(this.el))},this.onBlur=()=>{this.focused=!1},this.onFocus=()=>{this.focused=!0}}componentDidLoad(){this.mediaQueryUnsubscribe=a.subscribe((i=>{this.forceIconProps(i),this.updateIconSize(i)}))}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(i){const t=this.iconEl?.children[0];t?.setAttribute("size",i?"20":"24")}updateIconSize(i){this.iconSize=i?20:24}render(){const i=this.disabled?"true":void 0,s=String(this.selected),e="multi-select"===this.context,l=Boolean(this.icon)&&"single-select"===this.context,a=Boolean(this.iconBadge),r=this.el.querySelector('[slot="avatar"]'),c=this.selected&&"single-select"===this.context,d=n("option-list-item",`option-list-item--context-${this.context}`,{"option-list-item--disabled":this.disabled,"option-list-item--draggable":this.allowDrag,"option-list-item--dragging":this.dragging,"option-list-item--selected":this.selected,"option-list-item--show-avatar":r});return t(o,{key:"56c07efaa3f0d283d157c8f8bb0addfe930b4293"},t("div",{key:"4542378bd31546f0551e237d4df5ee3701e3c199","aria-checked":"menuitemradio"===this.swirlAriaRole?s:void 0,"aria-describedby":Boolean(this.description)?`option-list-item-${this.elementId}-description`:void 0,"aria-disabled":i,"aria-labelledby":`option-list-item-${this.elementId}-label`,"aria-selected":"option"===this.swirlAriaRole?s:void 0,class:d,id:`option-list-item-${this.elementId}`,onBlur:this.onBlur,onFocus:this.onFocus,part:"option-list-item",role:this.swirlAriaRole},l&&t("span",{key:"df3f3af40e854f02ba688aa54dd834b9e77ac738",class:"option-list-item__icon",innerHTML:this.icon,ref:i=>this.iconEl=i},a&&t("span",{key:"c21077d165c5d7869d99b5321dbab13d4005ad85",class:"option-list-item__icon-badge",innerHTML:this.iconBadge})),e&&t("span",{key:"26a71ace947042fb21e1abf05c6402e8539c773c",class:"option-list-item__checkbox"},t("span",{key:"de7da45be1f25839f26ae02df9082d56e5f2d0df",class:"option-list-item__checkbox-box"},this.selected&&t("swirl-icon-check-strong",{key:"692c1642e9f035b2267b60bdd064477da25f1b60",class:"option-list-item__checkbox-icon",size:16}))),t("span",{key:"f88effa897b9752dd5f02f9e7f73df5bd0714e04",class:"option-list-item__avatar"},t("slot",{key:"f412533bd41ed61784d341e25d90d3d0860f1406",name:"avatar"})),t("span",{key:"b1091ff43a18a3095d9c20ecbd43d3642ed22bef",class:"option-list-item__label-container"},t("span",{key:"efbd6424c68e71884a26d8bf868921e006422f9d",class:"option-list-item__label",id:`option-list-item-${this.elementId}-label`,part:"option-list-item__label"},this.label),this.description&&t("span",{key:"ac57368d8364c458fa7a330ff5b4a7e816c94c12",class:"option-list-item__description",id:`option-list-item-${this.elementId}-description`},this.description)),c&&t("span",{key:"e6caa3b02cba778b6d6031e12f376effb0c703e3",class:"option-list-item__selection-icon"},t("swirl-icon-check-small",{key:"20a94203bea74ec7e2a926145ba49b0042824a6a",size:this.iconSize}))),this.allowDrag&&t("button",{key:"9565e02956129bdb87316c8d96086556f6c5961a","aria-describedby":this.dragHandleDescription,"aria-label":`${this.dragHandleLabel} "${this.label}"`,class:"option-list-item__drag-handle",onKeyDown:this.onDragHandleKeyDown,tabIndex:this.focused?0:-1,type:"button"},t("swirl-icon-drag-handle",{key:"2fc4af86dacaa1a0057c4231fc73f02cce3b0c6e",size:this.iconSize})))}get el(){return l(this)}};d.style=".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;width:2.5rem;height:2.5rem;flex-shrink:0}.option-list-item__icon.sc-swirl-option-list-item{display:inline-flex;position:relative;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__icon.sc-swirl-option-list-item{width:1.25rem;height:1.25rem}}.option-list-item__icon-badge.sc-swirl-option-list-item{position:absolute;display:grid;bottom:0;right:0}.option-list-item__selection-icon.sc-swirl-option-list-item{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox.sc-swirl-option-list-item{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__checkbox.sc-swirl-option-list-item{width:1.375rem;height:1.375rem}}.option-list-item__checkbox-box.sc-swirl-option-list-item{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon.sc-swirl-option-list-item{display:inline-flex}.option-list-item__drag-handle.sc-swirl-option-list-item{position:absolute;z-index:1;top:50%;right:var(--s-space-4);display:inline-flex;margin:0;padding:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.option-list-item__drag-handle.sc-swirl-option-list-item:active{cursor:grabbing}.option-list-item__drag-handle.sc-swirl-option-list-item:focus:not(:focus-visible){outline:none}.option-list-item__drag-handle.sc-swirl-option-list-item:focus-visible{outline-color:var(--s-focus-default)}";export{c as swirl_icon_check_small,d as swirl_option_list_item}
|
|
1
|
+
import{r as i,h as t,F as s,c as e,H as o,d as l}from"./p-CWOhMVtL.js";import{c as n}from"./p-orsBiyT_.js";import{D as a}from"./p-LU4x678Z.js";import{v as r}from"./p-DD3477fe.js";import"./p-D_MUFqkF.js";const c=class{constructor(t){i(this,t),this.size=24}render(){const i=20===this.size?24:this.size,e={color:Boolean(this.color)?`var(--s-icon-${this.color})`:void 0},o=n("swirl-icon",`swirl-icon--size-${this.size}`);return t("svg",{key:"86c65881a19e81f25345239840884e0f8365b020","aria-hidden":"true",class:o,fill:"none",height:this.size,part:"icon",style:e,viewBox:`0 0 ${i} ${i}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},16===this.size&&t(s,{key:"32a20c7ebf4c7d14fb0923257ee41bda9154c096"},t("path",{key:"bce3f131dd7b0c18a3d90980cc4977628793bac9","fill-rule":"evenodd","clip-rule":"evenodd",d:"M12.4142 4.91924C12.8047 5.30976 12.8047 5.94293 12.4142 6.33345L7.08086 11.6667C6.69033 12.0572 6.05717 12.0572 5.66664 11.6667L3.70711 9.70707C3.31658 9.31655 3.31658 8.68338 3.70711 8.29286C4.09763 7.90233 4.7308 7.90233 5.12132 8.29286L6.37375 9.54539L11 4.91924C11.3905 4.52871 12.0237 4.52871 12.4142 4.91924Z",fill:"currentColor"})),(20===this.size||24===this.size)&&t(s,{key:"f8fdd1dc701ef3ec3463726fdfdcc77ec65218e1"},t("path",{key:"a3dd6757827c6887efea1f3edc3d23b63b9f1c6e","fill-rule":"evenodd","clip-rule":"evenodd",d:"M18.6213 7.37879C19.2071 7.96458 19.2071 8.91433 18.6213 9.50011L10.6213 17.5C10.0355 18.0858 9.08577 18.0858 8.49998 17.5L5.56068 14.5605C4.97489 13.9748 4.97489 13.025 5.56068 12.4392C6.14646 11.8534 7.09621 11.8534 7.682 12.4392L9.56064 14.318L16.5 7.37879C17.0858 6.79301 18.0355 6.79301 18.6213 7.37879Z",fill:"currentColor"})),28===this.size&&t(s,{key:"67fa72f7fe9590fb0882cf516a6c2ba68fe7f175"},t("path",{key:"5c7451a7104842b97c66b74bd4d4ba11f20f3d04","fill-rule":"evenodd","clip-rule":"evenodd",d:"M21.7248 8.60863C22.4083 9.29205 22.4083 10.4001 21.7248 11.0835L12.3915 20.4167C11.7081 21.1001 10.6001 21.1001 9.91663 20.4167L6.48744 16.9873C5.80403 16.3039 5.80403 15.1959 6.48744 14.5125C7.17086 13.8291 8.2789 13.8291 8.96232 14.5125L11.1541 16.7044L19.25 8.60863C19.9334 7.92521 21.0414 7.92521 21.7248 8.60863Z",fill:"currentColor"})))}};c.style=":host{display:inline-flex;max-width:100%;max-height:100%}.swirl-icon{max-width:100%;max-height:100%}";const d=class{constructor(t){i(this,t),this.toggleDrag=e(this,"toggleDrag",7),this.context="single-select",this.dragHandleDescription="Press spacebar to toggle grab",this.dragHandleLabel="Move option",this.selected=!1,this.swirlAriaRole="option",this.iconSize=24,this.elementId=r(),this.mediaQueryUnsubscribe=()=>{},this.onDragHandleKeyDown=i=>{"Space"!==i.code&&"Enter"!==i.code||(i.preventDefault(),this.toggleDrag.emit(this.el))},this.onBlur=()=>{this.focused=!1},this.onFocus=()=>{this.focused=!0}}componentDidLoad(){this.mediaQueryUnsubscribe=a.subscribe((i=>{this.forceIconProps(i),this.updateIconSize(i)}))}disconnectedCallback(){this.mediaQueryUnsubscribe()}forceIconProps(i){const t=this.iconEl?.children[0];t?.setAttribute("size",i?"20":"24")}updateIconSize(i){this.iconSize=i?20:24}render(){const i=this.disabled?"true":void 0,s=String(this.selected),e="multi-select"===this.context,l=Boolean(this.icon)&&"single-select"===this.context,a=Boolean(this.iconBadge),r=this.el.querySelector('[slot="avatar"]'),c=this.selected&&"single-select"===this.context,d=n("option-list-item",`option-list-item--context-${this.context}`,{"option-list-item--disabled":this.disabled,"option-list-item--draggable":this.allowDrag,"option-list-item--dragging":this.dragging,"option-list-item--selected":this.selected,"option-list-item--show-avatar":r});return t(o,{key:"56c07efaa3f0d283d157c8f8bb0addfe930b4293"},t("div",{key:"4542378bd31546f0551e237d4df5ee3701e3c199","aria-checked":"menuitemradio"===this.swirlAriaRole?s:void 0,"aria-describedby":Boolean(this.description)?`option-list-item-${this.elementId}-description`:void 0,"aria-disabled":i,"aria-labelledby":`option-list-item-${this.elementId}-label`,"aria-selected":"option"===this.swirlAriaRole?s:void 0,class:d,id:`option-list-item-${this.elementId}`,onBlur:this.onBlur,onFocus:this.onFocus,part:"option-list-item",role:this.swirlAriaRole},l&&t("span",{key:"df3f3af40e854f02ba688aa54dd834b9e77ac738",class:"option-list-item__icon",innerHTML:this.icon,ref:i=>this.iconEl=i},a&&t("span",{key:"c21077d165c5d7869d99b5321dbab13d4005ad85",class:"option-list-item__icon-badge",innerHTML:this.iconBadge})),e&&t("span",{key:"26a71ace947042fb21e1abf05c6402e8539c773c",class:"option-list-item__checkbox"},t("span",{key:"de7da45be1f25839f26ae02df9082d56e5f2d0df",class:"option-list-item__checkbox-box"},this.selected&&t("swirl-icon-check-strong",{key:"692c1642e9f035b2267b60bdd064477da25f1b60",class:"option-list-item__checkbox-icon",size:16}))),t("span",{key:"f88effa897b9752dd5f02f9e7f73df5bd0714e04",class:"option-list-item__avatar"},t("slot",{key:"f412533bd41ed61784d341e25d90d3d0860f1406",name:"avatar"})),t("span",{key:"b1091ff43a18a3095d9c20ecbd43d3642ed22bef",class:"option-list-item__label-container"},t("span",{key:"efbd6424c68e71884a26d8bf868921e006422f9d",class:"option-list-item__label",id:`option-list-item-${this.elementId}-label`,part:"option-list-item__label"},this.label),this.description&&t("span",{key:"ac57368d8364c458fa7a330ff5b4a7e816c94c12",class:"option-list-item__description",id:`option-list-item-${this.elementId}-description`},this.description)),c&&t("span",{key:"e6caa3b02cba778b6d6031e12f376effb0c703e3",class:"option-list-item__selection-icon"},t("swirl-icon-check-small",{key:"20a94203bea74ec7e2a926145ba49b0042824a6a",size:this.iconSize}))),this.allowDrag&&t("button",{key:"9565e02956129bdb87316c8d96086556f6c5961a","aria-describedby":this.dragHandleDescription,"aria-label":`${this.dragHandleLabel} "${this.label}"`,class:"option-list-item__drag-handle",onKeyDown:this.onDragHandleKeyDown,tabIndex:this.focused?0:-1,type:"button"},t("swirl-icon-drag-handle",{key:"2fc4af86dacaa1a0057c4231fc73f02cce3b0c6e",size:this.iconSize})))}get el(){return l(this)}};d.style=".sc-swirl-option-list-item-h{position:relative;display:block;width:100%}.sc-swirl-option-list-item-h *.sc-swirl-option-list-item{box-sizing:border-box}.option-list-item.sc-swirl-option-list-item{display:inline-flex;position:relative;width:100%;min-width:15rem;min-height:3rem;padding:var(--s-space-12) var(--s-space-16);border-radius:var(--s-border-radius-sm);align-items:center;background-color:var(--s-surface-overlay-default);cursor:pointer;gap:var(--s-space-12)}.option-list-item.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-hovered)}.option-list-item.sc-swirl-option-list-item:active:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item.sc-swirl-option-list-item:focus{outline:none}.option-list-item.sc-swirl-option-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered);outline-color:var(--s-focus-default);outline-style:solid;outline-width:0.125rem;z-index:1}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item.sc-swirl-option-list-item{min-height:0;padding:var(--s-space-8) var(--s-space-12);gap:var(--s-space-8)}}.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1.5rem)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item--draggable.sc-swirl-option-list-item .option-list-item__label-container.sc-swirl-option-list-item{padding-right:calc(var(--s-space-16) + 1rem)}}.option-list-item--dragging.sc-swirl-option-list-item{z-index:1;border-radius:var(--s-border-radius-s);background-color:var(--s-surface-overlay-pressed);box-shadow:0 0.0625rem 0.125rem rgba(25, 26, 28, 0.08),\n 0 0.25rem 2rem rgba(25, 26, 28, 0.16)}.option-list-item--dragging.sc-swirl-option-list-item:hover:not(.option-list-item--disabled){background-color:var(--s-surface-overlay-pressed)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item{color:var(--s-icon-highlight)}.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-highlight);color:var(--s-text-on-status);background-color:var(--s-icon-highlight)}.option-list-item--disabled.sc-swirl-option-list-item{cursor:default}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{background-color:var(--s-icon-disabled)}.option-list-item--disabled.option-list-item--selected.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-text-on-status)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__label.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__selection-icon.sc-swirl-option-list-item,.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-icon.sc-swirl-option-list-item{color:var(--s-icon-disabled)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__checkbox-box.sc-swirl-option-list-item{border-color:var(--s-icon-disabled);background-color:var(--s-surface-overlay-default)}.option-list-item--disabled.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{filter:grayscale(100%)}.option-list-item--show-avatar.sc-swirl-option-list-item .option-list-item__avatar.sc-swirl-option-list-item{display:inline-flex}.option-list-item__label-container.sc-swirl-option-list-item{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.option-list-item__label-container.sc-swirl-option-list-item>*.sc-swirl-option-list-item{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.option-list-item__label.sc-swirl-option-list-item{color:var(--s-text-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__label.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__description.sc-swirl-option-list-item{color:var(--s-text-subdued);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);text-align:left}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__description.sc-swirl-option-list-item{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.option-list-item__avatar.sc-swirl-option-list-item{display:none;flex-shrink:0}.option-list-item__icon.sc-swirl-option-list-item{display:inline-flex;position:relative;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__icon.sc-swirl-option-list-item{width:1.25rem;height:1.25rem}}.option-list-item__icon-badge.sc-swirl-option-list-item{position:absolute;display:grid;bottom:0;right:0}.option-list-item__selection-icon.sc-swirl-option-list-item{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}.option-list-item__checkbox.sc-swirl-option-list-item{display:inline-flex;width:1.5rem;height:1.5rem;padding:var(--s-space-2);flex-shrink:0}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.option-list-item__checkbox.sc-swirl-option-list-item{width:1.375rem;height:1.375rem}}.option-list-item__checkbox-box.sc-swirl-option-list-item{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center;border:0.125rem solid var(--s-icon-default);border-radius:var(--s-border-radius-s)}.option-list-item__checkbox-icon.sc-swirl-option-list-item{display:inline-flex}.option-list-item__drag-handle.sc-swirl-option-list-item{position:absolute;z-index:1;top:50%;right:var(--s-space-4);display:inline-flex;margin:0;padding:0;padding:var(--s-space-8);flex-shrink:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:grab;transform:translateY(-50%)}.option-list-item__drag-handle.sc-swirl-option-list-item:active{cursor:grabbing}.option-list-item__drag-handle.sc-swirl-option-list-item:focus:not(:focus-visible){outline:none}.option-list-item__drag-handle.sc-swirl-option-list-item:focus-visible{outline-color:var(--s-focus-default)}";export{c as swirl_icon_check_small,d as swirl_option_list_item}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as n,h as i,H as e,d as a}from"./p-CWOhMVtL.js";import{c as t}from"./p-orsBiyT_.js";const l=class{constructor(i){n(this,i),this.hideLabel=!1,this.inlineLabelColor="default",this.markAsNewLabel="New",this.variant="default"}componentWillLoad(){this.forceIconProps()}componentDidRender(){this.forceIconProps()}forceIconProps(){const n=this.el.querySelector("[slot='icon']"),i=this.hideLabel&&"app-icon"===this.variant||"default"===this.variant;n&&(n.tagName.startsWith("SWIRL-ICON")||n.tagName.startsWith("SWIRL-EMOJI")||n.tagName.startsWith("SWIRL-SYMBOL"))&&n.setAttribute("size",i?"20":"24")}render(){const n=Boolean(this.el.querySelector("swirl-app-icon")),a=t("shell-navigation-item",`shell-navigation-item--${this.variant}`,{"shell-navigation-item--active":this.active,"shell-navigation-item--boxed":this.boxed,"shell-navigation-item--filled":this.filled,"shell-navigation-item--inline-label":this.inlineLabel,"shell-navigation-item--gradient":this.withGradient,"shell-navigation-item--hide-label":this.hideLabel,"shell-navigation-item--has-app-icon":n}),l=t("shell-navigation-item__label",{"shell-navigation-item__label--light":"light"===this.inlineLabelColor,"shell-navigation-item__label--dark":"dark"===this.inlineLabelColor,"shell-navigation-item__label--inline":this.inlineLabel}),s=null!=this.badgeLabel,o=!s&&this.markAsNew&&!this.hideLabel&&"default"===this.variant,r=!s&&this.markAsNew&&this.hideLabel&&"default"===this.variant,h=Boolean(this.href);return i(e,{key:"8cdedcd426b2b2e2009c935f803d63426c4e4515"},i("swirl-tooltip",{key:"ef8e5f86988bbba1cfbe8c1dc446b6d3bb500446",active:this.hideLabel,content:this.description?`${this.label} ${this.description}`:this.label,delay:100,position:"right",positioning:"fixed"},i(h?"a":"button",{key:"c0e7008e92689e61f70d644541d8520f58731783",class:a,href:this.href,target:this.target,type:h?void 0:"button",title:this.hideLabel?void 0:this.label},i("span",{key:"c78cb91aae92b6dff68038a16d304ee3a4304c78",class:"shell-navigation-item__icon"},i("slot",{key:"31478c066302a3a54ffc18d1702bf296bf279940",name:"icon"})),this.hideLabel?i("swirl-visually-hidden",null,i("span",{class:l},this.label)):"default"!==this.variant?i("span",{class:l},this.label):i("div",{class:"shell-navigation-item__text-wrapper"},i("span",{class:l},this.label),this.description&&i("span",{class:"shell-navigation-item__description"},this.description)),s&&i("span",{key:"beaa48fff9d31f5e6bd0c700d1518703035417ef",class:"shell-navigation-item__badge-wrapper"},i("swirl-badge",{key:"209480b493dc2cf33c27d8794ff872849108d982","aria-label":this.badgeLabel,class:t("shell-navigation-item__badge",{"shell-navigation-item__badge--dot":""===this.badgeLabel}),label:this.badgeLabel,size:"xs",variant:""===this.badgeLabel?"dot":"default"})),o&&i("swirl-tag",{key:"0d394f4d45fd5a6db4bd4fbd654696bf6017b030",class:"shell-navigation-item__is-new-tag",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"s",variant:"strong"}),r&&i("swirl-badge",{key:"9d3f39f372a5fcaefb7113b4191eccd726e36a1f",class:"shell-navigation-item__is-new-badge",intent:"info",label:this.markAsNewLabel.toLocaleUpperCase(),size:"xs",variant:"dot"}))))}get el(){return a(this)}};l.style='/**\n* seems the container query does not work as expected\n*/\n\n:host {\n display: inline-flex;\n width: 100%;\n}\n\n:host * {\n box-sizing: border-box;\n }\n\n.shell-navigation-item {\n --swirl-app-icon-size: 2rem;\n --swirl-shell-navigation-item-gradient: linear-gradient(\n rgba(0, 0, 0, 0),\n rgba(0, 0, 0, 0.8)\n );\n\n position: relative;\n display: flex;\n width: 100%;\n height: 3rem;\n padding: var(--s-space-8);\n flex-shrink: 0;\n justify-content: flex-start;\n align-items: center;\n border: none;\n border-radius: var(--s-border-radius-sm);\n color: var(--s-text-default);\n background-color: var(--s-surface-overlay-default);\n font: inherit;\n font-size: var(--s-font-size-sm);\n font-weight: var(--s-font-weight-medium);\n line-height: var(--s-line-height-sm);\n text-decoration: none;\n cursor: pointer;\n container-type: size;\n gap: var(--s-space-12);\n}\n\n.shell-navigation-item:hover {\n background-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item:hover .shell-navigation-item__badge,\n .shell-navigation-item:hover .shell-navigation-item__is-new-badge {\n --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item:active {\n background-color: var(--s-surface-sunken-pressed);\n }\n\n.shell-navigation-item:active .shell-navigation-item__badge,\n .shell-navigation-item:active .shell-navigation-item__is-new-badge {\n --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n }\n\n.shell-navigation-item:focus {\n outline: none;\n }\n\n.shell-navigation-item:focus-visible {\n z-index: 1;\n box-shadow: 0 0 0 0.125rem var(--s-focus-default);\n }\n\n.shell-navigation-item.shell-navigation-item--boxed {\n --swirl-app-icon-size: 2rem;\n }\n\n.shell-navigation-item.shell-navigation-item--boxed .shell-navigation-item__icon {\n overflow: hidden;\n border-radius: var(--s-border-radius-sm);\n background-color: var(--s-background-default);\n box-shadow: 0 0 0 var(--s-border-width-default) var(--s-border-default);\n }\n\n.shell-navigation-item.shell-navigation-item--default.shell-navigation-item--filled .shell-navigation-item__icon {\n border-radius: var(--s-border-radius-sm);\n width: 2rem;\n min-width: 2rem;\n height: 2rem;\n min-height: 2rem;\n }\n\n.shell-navigation-item.shell-navigation-item--filled {\n padding: var(--s-space-8);\n }\n\n.shell-navigation-item.shell-navigation-item--filled:not(.shell-navigation-item--has-app-icon) .shell-navigation-item__icon {\n color: var(--s-icon-on-action-primary);\n background-color: var(--s-action-primary-default);\n }\n\n.shell-navigation-item.shell-navigation-item--filled ::slotted(swirl-app-icon) {\n position: inherit;\n width: 100%;\n height: 100%;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled {\n --swirl-app-icon-size: 100%;\n\n height: auto;\n padding: 0;\n align-items: start;\n border-radius: var(--s-border-radius-base);\n flex-direction: column;\n container-type: inline-size;\n gap: var(--s-space-8);\n }\n\n.shell-navigation-item.shell-navigation-item--tiled:hover {\n background-color: transparent;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled:hover .shell-navigation-item__label {\n text-decoration: underline;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled ::slotted(*) {\n position: absolute;\n top: var(--s-space-12);\n left: var(--s-space-12);\n }\n\n.shell-navigation-item.shell-navigation-item--tiled ::slotted(swirl-app-icon) {\n position: inherit;\n width: 100%;\n height: 100%;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__icon {\n overflow: hidden;\n width: 100%;\n min-width: 100%;\n height: auto;\n min-height: auto;\n border-radius: var(--s-border-radius-base);\n background-color: var(--s-surface-sunken-hovered);\n aspect-ratio: 1;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled.shell-navigation-item--gradient .shell-navigation-item__icon::after {\n position: absolute;\n display: inline-block;\n width: 100%;\n border-radius: var(--s-border-radius-base);\n background-image: var(--swirl-shell-navigation-item-gradient);\n content: "";\n aspect-ratio: 1;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label {\n color: var(--s-text-default);\n font-weight: var(--s-font-weight-semibold);\n text-align: start;\n }\n\n.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline {\n position: absolute;\n bottom: var(--s-space-12);\n left: var(--s-space-12);\n margin-right: var(--s-space-12);\n }\n\n.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--light {\n color: rgba(242, 242, 242, 1);\n }\n\n.shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label--inline.shell-navigation-item__label--dark {\n color: rgb(25, 25, 25);\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon {\n --swirl-app-icon-size: 100%;\n font-size: var(--s-font-size-xs);\n padding: var(--s-space-8) var(--s-space-4);\n align-items: center;\n height: auto;\n border-radius: var(--s-border-radius-sm);\n flex-direction: column;\n container-type: inline-size;\n gap: var(--s-space-8);\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label {\n align-items: start;\n padding: var(--s-space-8);\n --swirl-app-icon-size: 2rem;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__icon {\n border-radius: var(--s-border-radius-sm);\n max-width: 2rem;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon.shell-navigation-item--hide-label .shell-navigation-item__badge-wrapper {\n max-width: 2rem;\n max-height: 2rem;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__icon {\n overflow: hidden;\n width: 100%;\n max-width: 3.5rem;\n height: auto;\n border-radius: var(--s-border-radius-base);\n\n color: var(--s-icon-on-action-primary);\n aspect-ratio: 1;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper {\n max-width: 3.5rem;\n max-height: 3.5rem;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label {\n line-height: var(--s-line-height-xs);\n text-align: center;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge-wrapper, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge-wrapper {\n position: absolute;\n width: 100%;\n height: 100%;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__label, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__label {\n display: -webkit-box;\n overflow: hidden;\n white-space: normal;\n text-overflow: unset;\n overflow-wrap: anywhere;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n }\n\n.shell-navigation-item.shell-navigation-item--app-icon .shell-navigation-item__badge, .shell-navigation-item.shell-navigation-item--tiled .shell-navigation-item__badge {\n position: absolute;\n top: -0.375rem;\n right: -0.375rem;\n padding: var(--s-space-2);\n }\n\n.shell-navigation-item.shell-navigation-item--active {\n background-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__icon {\n color: var(--s-icon-highlight);\n }\n\n.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__label {\n color: var(--s-text-highlight);\n }\n\n.shell-navigation-item.shell-navigation-item--active .shell-navigation-item__badge {\n --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item.shell-navigation-item--active:hover {\n background-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item.shell-navigation-item--active:hover .shell-navigation-item__badge {\n --swirl-badge-border-color: var(--s-surface-sunken-hovered);\n }\n\n.shell-navigation-item.shell-navigation-item--active:active {\n background-color: var(--s-surface-sunken-pressed);\n }\n\n.shell-navigation-item.shell-navigation-item--active:active .shell-navigation-item__badge {\n --swirl-badge-border-color: var(--s-surface-sunken-pressed);\n }\n\n@media (min-width: 992px) {\n\n.shell-navigation-item {\n background-color: var(--s-surface-sunken-default)\n}\n }\n\n.shell-navigation-item__icon {\n display: inline-flex;\n width: 2rem;\n min-width: 2rem;\n height: 2rem;\n min-height: 2rem;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n border-radius: var(--s-border-radius-base);\n}\n\n.shell-navigation-item__text-wrapper {\n overflow: hidden;\n min-width: 0;\n flex-grow: 1;\n text-align: start;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n\n.shell-navigation-item__description {\n margin-left: var(--s-space-8);\n font-weight: var(--s-font-weight-normal);\n color: var(--s-text-subdued);\n}\n\n.shell-navigation-item__badge {\n flex-shrink: 0;\n --swirl-badge-border-color: var(--swirl-shell-background);\n}\n\n.shell-navigation-item__is-new-tag {\n flex-shrink: 0;\n}\n\n.shell-navigation-item__is-new-badge {\n position: absolute;\n top: 0.625rem;\n right: 0.625rem;\n flex-shrink: 0;\n --swirl-badge-border-color: var(--swirl-shell-background);\n}\n\n@container (max-width: 4rem) {\n .shell-navigation-item__badge {\n position: absolute;\n top: var(--s-space-4);\n right: var(--s-space-4);\n padding: var(--s-space-2);\n }\n\n .shell-navigation-item--gradient .shell-navigation-item__icon {\n --swirl-shell-navigation-item-gradient: none;\n }\n\n .shell-navigation-item__badge--dot {\n top: var(--s-space-8);\n right: var(--s-space-8);\n }\n}\n\n@container (min-width: 10rem) {\n .shell-navigation-item__badge--dot {\n padding-right: var(--s-space-4);\n }\n}\n';export{l as swirl_shell_navigation_item}
|