@kumori/aurora-wui-components 0.0.4 → 0.0.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/dist/components/axebow-icon/axebow-icon.d.ts +12 -0
- package/dist/components/axebow-icon/axebow-icon.d.ts.map +1 -0
- package/dist/components/{cards/aurora-more-actions.d.ts → axebow-more-actions/axebow-more-actions.d.ts} +3 -3
- package/dist/components/axebow-more-actions/axebow-more-actions.d.ts.map +1 -0
- package/dist/components/cards/{aurora-base-card.d.ts → axebow-base-card.d.ts} +6 -3
- package/dist/components/cards/axebow-base-card.d.ts.map +1 -0
- package/dist/components/cards/{card.types.d.ts → card.models.d.ts} +5 -1
- package/dist/components/cards/card.models.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-action-banner.d.ts → axebow-card-action-banner.d.ts} +2 -2
- package/dist/components/cards/parts/axebow-card-action-banner.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-attention-banner.d.ts → axebow-card-attention-banner.d.ts} +3 -3
- package/dist/components/cards/parts/{aurora-card-attention-banner.d.ts.map → axebow-card-attention-banner.d.ts.map} +1 -1
- package/dist/components/cards/parts/{aurora-card-cloud-logo.d.ts → axebow-card-cloud-logo.d.ts} +2 -2
- package/dist/components/cards/parts/{aurora-card-cloud-logo.d.ts.map → axebow-card-cloud-logo.d.ts.map} +1 -1
- package/dist/components/cards/parts/{aurora-card-filter-item.d.ts → axebow-card-filter-item.d.ts} +2 -2
- package/dist/components/cards/parts/axebow-card-filter-item.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-filter.d.ts → axebow-card-filter.d.ts} +3 -3
- package/dist/components/cards/parts/axebow-card-filter.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-footer.d.ts → axebow-card-footer.d.ts} +3 -3
- package/dist/components/cards/parts/{aurora-card-footer.d.ts.map → axebow-card-footer.d.ts.map} +1 -1
- package/dist/components/cards/parts/{aurora-card-header.d.ts → axebow-card-header.d.ts} +7 -3
- package/dist/components/cards/parts/axebow-card-header.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-resource-row.d.ts → axebow-card-resource-row.d.ts} +3 -3
- package/dist/components/cards/parts/axebow-card-resource-row.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-resource-table.d.ts → axebow-card-resource-table.d.ts} +3 -3
- package/dist/components/cards/parts/{aurora-card-resource-table.d.ts.map → axebow-card-resource-table.d.ts.map} +1 -1
- package/dist/components/cards/parts/{aurora-card-special-link.d.ts → axebow-card-special-link.d.ts} +2 -2
- package/dist/components/cards/parts/axebow-card-special-link.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-stat-item.d.ts → axebow-card-stat-item.d.ts} +2 -2
- package/dist/components/cards/parts/{aurora-card-stat-item.d.ts.map → axebow-card-stat-item.d.ts.map} +1 -1
- package/dist/components/cards/parts/{aurora-card-stats-row.d.ts → axebow-card-stats-row.d.ts} +3 -3
- package/dist/components/cards/parts/axebow-card-stats-row.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-status.d.ts → axebow-card-status.d.ts} +2 -2
- package/dist/components/cards/parts/axebow-card-status.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-table-header.d.ts → axebow-card-table-header.d.ts} +3 -3
- package/dist/components/cards/parts/axebow-card-table-header.d.ts.map +1 -0
- package/dist/components/cards/parts/{aurora-card-version-selector.d.ts → axebow-card-version-selector.d.ts} +3 -3
- package/dist/components/cards/parts/axebow-card-version-selector.d.ts.map +1 -0
- package/dist/components/cards/parts/axebow-role-tooltip.d.ts +9 -0
- package/dist/components/cards/parts/axebow-role-tooltip.d.ts.map +1 -0
- package/dist/index.d.ts +21 -20
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +400 -322
- package/dist/index.js.map +1 -1
- package/dist/styles/{aurora-theme.d.ts → axebow-theme.d.ts} +2 -2
- package/dist/styles/axebow-theme.d.ts.map +1 -0
- package/package.json +2 -1
- package/dist/components/aurora-button.d.ts +0 -12
- package/dist/components/aurora-button.d.ts.map +0 -1
- package/dist/components/cards/aurora-base-card.d.ts.map +0 -1
- package/dist/components/cards/aurora-more-actions.d.ts.map +0 -1
- package/dist/components/cards/card.types.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-action-banner.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-filter-item.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-filter.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-header.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-resource-row.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-special-link.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-stats-row.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-status.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-table-header.d.ts.map +0 -1
- package/dist/components/cards/parts/aurora-card-version-selector.d.ts.map +0 -1
- package/dist/styles/aurora-theme.d.ts.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,57 +1,9 @@
|
|
|
1
1
|
import { LitElement, css, html, unsafeCSS } from "lit";
|
|
2
2
|
import { customElement, property, state } from "lit/decorators.js";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
8
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
9
|
-
}
|
|
10
|
-
//#endregion
|
|
11
|
-
//#region src/components/aurora-button.ts
|
|
12
|
-
var AuroraButton = class AuroraButton extends LitElement {
|
|
13
|
-
constructor(..._args) {
|
|
14
|
-
super(..._args);
|
|
15
|
-
this.disabled = false;
|
|
16
|
-
}
|
|
17
|
-
static {
|
|
18
|
-
this.styles = css`
|
|
19
|
-
:host {
|
|
20
|
-
display: inline-block;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
button {
|
|
24
|
-
font: inherit;
|
|
25
|
-
cursor: pointer;
|
|
26
|
-
border-radius: 6px;
|
|
27
|
-
border: 1px solid transparent;
|
|
28
|
-
padding: 0.5em 1.2em;
|
|
29
|
-
background-color: var(--aurora-button-bg, #1a1a1a);
|
|
30
|
-
color: var(--aurora-button-color, #ffffff);
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
button:disabled {
|
|
34
|
-
cursor: not-allowed;
|
|
35
|
-
opacity: 0.5;
|
|
36
|
-
}
|
|
37
|
-
`;
|
|
38
|
-
}
|
|
39
|
-
render() {
|
|
40
|
-
return html`
|
|
41
|
-
<button ?disabled=${this.disabled}>
|
|
42
|
-
<slot></slot>
|
|
43
|
-
</button>
|
|
44
|
-
`;
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
|
-
__decorate([property({
|
|
48
|
-
type: Boolean,
|
|
49
|
-
reflect: true
|
|
50
|
-
})], AuroraButton.prototype, "disabled", void 0);
|
|
51
|
-
AuroraButton = __decorate([customElement("aurora-button")], AuroraButton);
|
|
52
|
-
//#endregion
|
|
53
|
-
//#region src/styles/aurora-theme.ts
|
|
54
|
-
var auroraTheme = css`
|
|
3
|
+
import "@shoelace-style/shoelace/dist/components/tooltip/tooltip.js";
|
|
4
|
+
import "@shoelace-style/shoelace/dist/components/badge/badge.js";
|
|
5
|
+
//#region src/styles/axebow-theme.ts
|
|
6
|
+
var axebowTheme = css`
|
|
55
7
|
.theme {
|
|
56
8
|
--axebow-primary: var(--color-primary, #34495e);
|
|
57
9
|
--axebow-primary-light: var(--color-primary-light, #b4cded);
|
|
@@ -94,10 +46,52 @@ var STATUS_COLORS = {
|
|
|
94
46
|
};
|
|
95
47
|
//#endregion
|
|
96
48
|
//#region src/styles/tailwind.css?inline
|
|
97
|
-
var tailwind_default = "/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n@layer properties {\n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *, :before, :after, ::backdrop {\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .75rem;\n --text-xs--line-height: calc(1 / .75);\n --text-sm: .875rem;\n --text-sm--line-height: calc(1.25 / .875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --font-weight-normal: 400;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --leading-snug: 1.375;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n\n .absolute {\n position: absolute;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .top-full {\n top: 100%;\n }\n\n .right-0 {\n right: 0;\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mt-1 {\n margin-top: var(--spacing);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .line-clamp-1 {\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .flex {\n display: flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n\n .h-\\[4\\.5rem\\] {\n height: 4.5rem;\n }\n\n .h-full {\n height: 100%;\n }\n\n .max-h-10 {\n max-height: calc(var(--spacing) * 10);\n }\n\n .max-h-40 {\n max-height: calc(var(--spacing) * 40);\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-10 {\n min-height: calc(var(--spacing) * 10);\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-full {\n width: 100%;\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .min-w-0 {\n min-width: 0;\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .transform {\n transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );\n }\n\n .cursor-default {\n cursor: default;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .grid-cols-\\[auto_auto_1fr_auto\\] {\n grid-template-columns: auto auto 1fr auto;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .items-center {\n align-items: center;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .gap-0\\.5 {\n gap: calc(var(--spacing) * .5);\n }\n\n .gap-1 {\n gap: var(--spacing);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n\n .rounded-md {\n border-radius: var(--radius-md);\n }\n\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-b-lg {\n border-bottom-right-radius: var(--radius-lg);\n border-bottom-left-radius: var(--radius-lg);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-\\[var\\(--axebow-gray\\)\\] {\n border-color: var(--axebow-gray);\n }\n\n .border-\\[var\\(--axebow-light-gray\\)\\] {\n border-color: var(--axebow-light-gray);\n }\n\n .border-\\[var\\(--axebow-secondary\\)\\] {\n border-color: var(--axebow-secondary);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .bg-\\[var\\(--axebow-anti-flash-white\\)\\] {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\[var\\(--axebow-error\\)\\] {\n background-color: var(--axebow-error);\n }\n\n .bg-\\[var\\(--axebow-gray\\)\\] {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\[var\\(--axebow-light-gray\\)\\] {\n background-color: var(--axebow-light-gray);\n }\n\n .bg-\\[var\\(--axebow-white\\)\\] {\n background-color: var(--axebow-white);\n }\n\n .bg-transparent {\n background-color: #0000;\n }\n\n .bg-white {\n background-color: var(--color-white);\n }\n\n .object-contain {\n object-fit: contain;\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .px-1 {\n padding-inline: var(--spacing);\n }\n\n .px-1\\.5 {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .py-0\\.5 {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .py-1 {\n padding-block: var(--spacing);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-\\[var\\(--axebow-gray\\)\\] {\n color: var(--axebow-gray);\n }\n\n .text-\\[var\\(--axebow-primary\\)\\] {\n color: var(--axebow-primary);\n }\n\n .text-\\[var\\(--axebow-rich-black\\)\\] {\n color: var(--axebow-rich-black);\n }\n\n .text-\\[var\\(--axebow-secondary\\)\\] {\n color: var(--axebow-secondary);\n }\n\n .text-\\[var\\(--axebow-tertiary\\)\\] {\n color: var(--axebow-tertiary);\n }\n\n .italic {\n font-style: italic;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[2px_2px_25px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 2px 25px 0px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .grayscale {\n --tw-grayscale: grayscale(100%);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n @media (hover: hover) {\n .hover\\:rounded-lg:hover {\n border-radius: var(--radius-lg);\n }\n\n .hover\\:bg-\\[var\\(--axebow-anti-flash-white\\)\\]:hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-\\[var\\(--axebow-light-gray\\)\\]:hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:text-\\[var\\(--axebow-gray\\)\\]:hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:shadow-\\[0_4px_12px_0_rgba\\(13\\,24\\,33\\,0\\.08\\)\\]:hover {\n --tw-shadow: 0 4px 12px 0 var(--tw-shadow-color, #0d182114);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n\n .disabled\\:pointer-events-none:disabled {\n pointer-events: none;\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n}\n\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n";
|
|
49
|
+
var tailwind_default = "/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n@layer properties {\n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *, :before, :after, ::backdrop {\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .75rem;\n --text-xs--line-height: calc(1 / .75);\n --text-sm: .875rem;\n --text-sm--line-height: calc(1.25 / .875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-2xl: 1.5rem;\n --text-4xl: 2.25rem;\n --text-6xl: 3.75rem;\n --font-weight-normal: 400;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --leading-snug: 1.375;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n\n .absolute {\n position: absolute;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .top-full {\n top: 100%;\n }\n\n .right-0 {\n right: 0;\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mt-0\\.5 {\n margin-top: calc(var(--spacing) * .5);\n }\n\n .mt-1 {\n margin-top: var(--spacing);\n }\n\n .mt-1\\.5 {\n margin-top: calc(var(--spacing) * 1.5);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .line-clamp-1 {\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .flex {\n display: flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-full {\n height: 100%;\n }\n\n .max-h-10 {\n max-height: calc(var(--spacing) * 10);\n }\n\n .max-h-40 {\n max-height: calc(var(--spacing) * 40);\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-10 {\n min-height: calc(var(--spacing) * 10);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-full {\n width: 100%;\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .min-w-0 {\n min-width: 0;\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .transform {\n transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );\n }\n\n .cursor-default {\n cursor: default;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .grid-cols-\\[auto_auto_1fr_auto\\] {\n grid-template-columns: auto auto 1fr auto;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .items-center {\n align-items: center;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .gap-0\\.5 {\n gap: calc(var(--spacing) * .5);\n }\n\n .gap-1 {\n gap: var(--spacing);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n\n .rounded-md {\n border-radius: var(--radius-md);\n }\n\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-b-lg {\n border-bottom-right-radius: var(--radius-lg);\n border-bottom-left-radius: var(--radius-lg);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-\\(--axebow-gray\\) {\n border-color: var(--axebow-gray);\n }\n\n .border-\\(--axebow-light-gray\\) {\n border-color: var(--axebow-light-gray);\n }\n\n .border-\\(--axebow-secondary\\) {\n border-color: var(--axebow-secondary);\n }\n\n .border-\\[var\\(--axebow-light-gray\\)\\] {\n border-color: var(--axebow-light-gray);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .bg-\\(--axebow-anti-flash-white\\) {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\(--axebow-error\\) {\n background-color: var(--axebow-error);\n }\n\n .bg-\\(--axebow-gray\\) {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\(--axebow-light-gray\\) {\n background-color: var(--axebow-light-gray);\n }\n\n .bg-\\(--axebow-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-transparent {\n background-color: #0000;\n }\n\n .bg-white {\n background-color: var(--color-white);\n }\n\n .object-contain {\n object-fit: contain;\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .px-1 {\n padding-inline: var(--spacing);\n }\n\n .px-1\\.5 {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .py-0\\.5 {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .py-1 {\n padding-block: var(--spacing);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .align-middle {\n vertical-align: middle;\n }\n\n .font-\\[Material_Symbols_Outlined\\] {\n font-family: Material Symbols Outlined;\n }\n\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\(--axebow-error\\) {\n color: var(--axebow-error);\n }\n\n .text-\\(--axebow-gray\\) {\n color: var(--axebow-gray);\n }\n\n .text-\\(--axebow-primary\\) {\n color: var(--axebow-primary);\n }\n\n .text-\\(--axebow-rich-black\\) {\n color: var(--axebow-rich-black);\n }\n\n .text-\\(--axebow-secondary\\) {\n color: var(--axebow-secondary);\n }\n\n .text-\\(--axebow-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[2px_2px_25px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 2px 2px 25px 0px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .grayscale {\n --tw-grayscale: grayscale(100%);\n filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_0\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 0,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n .\\[font-variation-settings\\:\\'FILL\\'_1\\,\\'wght\\'_400\\,\\'GRAD\\'_0\\,\\'opsz\\'_24\\] {\n font-variation-settings: \"FILL\" 1,\"wght\" 400,\"GRAD\" 0,\"opsz\" 24;\n }\n\n @media (hover: hover) {\n .hover\\:rounded-lg:hover {\n border-radius: var(--radius-lg);\n }\n\n .hover\\:bg-\\(--axebow-light-gray\\):hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-\\[var\\(--axebow-anti-flash-white\\)\\]:hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:text-\\[var\\(--axebow-gray\\)\\]:hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:shadow-\\[0_4px_12px_0_rgba\\(13\\,24\\,33\\,0\\.08\\)\\]:hover {\n --tw-shadow: 0 4px 12px 0 var(--tw-shadow-color, #0d182114);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n\n .disabled\\:pointer-events-none:disabled {\n pointer-events: none;\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n}\n\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n";
|
|
50
|
+
//#endregion
|
|
51
|
+
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/decorate.js
|
|
52
|
+
function __decorate(decorators, target, key, desc) {
|
|
53
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
54
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
55
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
56
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
57
|
+
}
|
|
58
|
+
//#endregion
|
|
59
|
+
//#region src/components/axebow-icon/axebow-icon.ts
|
|
60
|
+
var AxebowIcon = class AxebowIcon extends LitElement {
|
|
61
|
+
constructor(..._args) {
|
|
62
|
+
super(..._args);
|
|
63
|
+
this.iconName = "home";
|
|
64
|
+
this.iconColor = "var(--axebow-primary)";
|
|
65
|
+
this.rotate = 0;
|
|
66
|
+
this.filled = false;
|
|
67
|
+
this.size = "medium";
|
|
68
|
+
this.marginBottom = 0;
|
|
69
|
+
}
|
|
70
|
+
static {
|
|
71
|
+
this.styles = unsafeCSS(tailwind_default);
|
|
72
|
+
}
|
|
73
|
+
render() {
|
|
74
|
+
return html`
|
|
75
|
+
<span
|
|
76
|
+
class="font-[Material_Symbols_Outlined] inline-block align-middle whitespace-nowrap ${this.filled ? "[font-variation-settings:'FILL'_1,'wght'_400,'GRAD'_0,'opsz'_24]" : "[font-variation-settings:'FILL'_0,'wght'_400,'GRAD'_0,'opsz'_24]"}"
|
|
77
|
+
style="color: ${this.iconColor}; transform: rotate(${this.rotate}deg); font-size: ${this.size === "xx-small" ? "var(--text-sm)" : this.size === "x-small" ? "var(--text-base)" : this.size === "small" ? "var(--text-lg)" : this.size === "medium" ? "var(--text-2xl)" : this.size === "large" ? "var(--text-4xl)" : this.size === "x-large" ? "var(--text-6xl)" : "var(--text-2xl)"};
|
|
78
|
+
margin-bottom: ${this.size === "xx-small" ? "0" : this.size === "x-small" ? "0" : this.size === "small" ? "0" : this.size === "medium" ? "0" : this.size === "large" ? "0.375rem" : this.size === "x-large" ? "0.5rem" : `${this.marginBottom}px`};"
|
|
79
|
+
>
|
|
80
|
+
${this.iconName}
|
|
81
|
+
</span>
|
|
82
|
+
`;
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
__decorate([property({ type: String })], AxebowIcon.prototype, "iconName", void 0);
|
|
86
|
+
__decorate([property({ type: String })], AxebowIcon.prototype, "iconColor", void 0);
|
|
87
|
+
__decorate([property({ type: Number })], AxebowIcon.prototype, "rotate", void 0);
|
|
88
|
+
__decorate([property({ type: Boolean })], AxebowIcon.prototype, "filled", void 0);
|
|
89
|
+
__decorate([property({ type: String })], AxebowIcon.prototype, "size", void 0);
|
|
90
|
+
__decorate([property({ type: Number })], AxebowIcon.prototype, "marginBottom", void 0);
|
|
91
|
+
AxebowIcon = __decorate([customElement("axebow-icon")], AxebowIcon);
|
|
98
92
|
//#endregion
|
|
99
|
-
//#region src/components/
|
|
100
|
-
var
|
|
93
|
+
//#region src/components/axebow-more-actions/axebow-more-actions.ts
|
|
94
|
+
var AxebowMoreActions = class AxebowMoreActions extends LitElement {
|
|
101
95
|
constructor(..._args) {
|
|
102
96
|
super(..._args);
|
|
103
97
|
this.open = false;
|
|
@@ -165,7 +159,7 @@ var AuroraMoreActions = class AuroraMoreActions extends LitElement {
|
|
|
165
159
|
return html`
|
|
166
160
|
<div class="relative w-full h-full flex justify-end">
|
|
167
161
|
<button
|
|
168
|
-
class="trigger relative font-semibold text-xs text-
|
|
162
|
+
class="trigger relative font-semibold text-xs text-(--axebow-tertiary) cursor-pointer py-1 px-2 h-full bg-transparent border-none transition-all duration-200 flex items-center hover:text-[var(--axebow-gray)] hover:bg-[var(--axebow-anti-flash-white)] hover:rounded-lg disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-none"
|
|
169
163
|
?disabled=${this.disabled}
|
|
170
164
|
@click=${this._toggle}
|
|
171
165
|
>
|
|
@@ -173,7 +167,7 @@ var AuroraMoreActions = class AuroraMoreActions extends LitElement {
|
|
|
173
167
|
</button>
|
|
174
168
|
${this.open ? html`
|
|
175
169
|
<div
|
|
176
|
-
class="absolute right-0 z-10 bg-white border border-
|
|
170
|
+
class="absolute right-0 z-10 bg-white border border-(--axebow-gray) rounded-lg shadow-[2px_2px_25px_0px_rgba(0,0,0,0.1)] p-2 min-w-44 flex flex-col ${placementClass}"
|
|
177
171
|
style=${dropdownStyle}
|
|
178
172
|
@click=${this._handleSlotClick}
|
|
179
173
|
>
|
|
@@ -199,20 +193,20 @@ var AuroraMoreActions = class AuroraMoreActions extends LitElement {
|
|
|
199
193
|
`;
|
|
200
194
|
}
|
|
201
195
|
};
|
|
202
|
-
__decorate([property({ type: Boolean })],
|
|
203
|
-
__decorate([property({ type: String })],
|
|
204
|
-
__decorate([property({ type: Boolean })],
|
|
205
|
-
__decorate([property({ type: Array })],
|
|
206
|
-
__decorate([property({ type: String })],
|
|
207
|
-
__decorate([property({ type: String })],
|
|
208
|
-
__decorate([property({ type: Boolean })],
|
|
209
|
-
__decorate([property({ type: String })],
|
|
210
|
-
__decorate([property({ type: String })],
|
|
211
|
-
__decorate([state()],
|
|
212
|
-
|
|
196
|
+
__decorate([property({ type: Boolean })], AxebowMoreActions.prototype, "open", void 0);
|
|
197
|
+
__decorate([property({ type: String })], AxebowMoreActions.prototype, "placement", void 0);
|
|
198
|
+
__decorate([property({ type: Boolean })], AxebowMoreActions.prototype, "disabled", void 0);
|
|
199
|
+
__decorate([property({ type: Array })], AxebowMoreActions.prototype, "options", void 0);
|
|
200
|
+
__decorate([property({ type: String })], AxebowMoreActions.prototype, "title", void 0);
|
|
201
|
+
__decorate([property({ type: String })], AxebowMoreActions.prototype, "iconName", void 0);
|
|
202
|
+
__decorate([property({ type: Boolean })], AxebowMoreActions.prototype, "openToRight", void 0);
|
|
203
|
+
__decorate([property({ type: String })], AxebowMoreActions.prototype, "closeLabel", void 0);
|
|
204
|
+
__decorate([property({ type: String })], AxebowMoreActions.prototype, "moreActionsLabel", void 0);
|
|
205
|
+
__decorate([state()], AxebowMoreActions.prototype, "_fixedPos", void 0);
|
|
206
|
+
AxebowMoreActions = __decorate([customElement("axebow-more-actions")], AxebowMoreActions);
|
|
213
207
|
//#endregion
|
|
214
|
-
//#region src/components/cards/parts/
|
|
215
|
-
var
|
|
208
|
+
//#region src/components/cards/parts/axebow-card-cloud-logo.ts
|
|
209
|
+
var AxebowCardCloudLogo = class AxebowCardCloudLogo extends LitElement {
|
|
216
210
|
constructor(..._args) {
|
|
217
211
|
super(..._args);
|
|
218
212
|
this.src = null;
|
|
@@ -223,15 +217,15 @@ var AuroraCardCloudLogo = class AuroraCardCloudLogo extends LitElement {
|
|
|
223
217
|
}
|
|
224
218
|
render() {
|
|
225
219
|
if (!this.src) return html``;
|
|
226
|
-
return this.size === "small" ? html`<div class="
|
|
220
|
+
return this.size === "small" ? html`<div class="flex items-center justify-center shrink-0" style="height:1.125rem;width:1.125rem;"><img src=${this.src} class="max-h-full max-w-full object-contain" /></div>` : html`<div class="flex items-center justify-center shrink-0" style="height:3.125rem;width:3.125rem;"><img src=${this.src} class="max-h-full max-w-full object-contain" /></div>`;
|
|
227
221
|
}
|
|
228
222
|
};
|
|
229
|
-
__decorate([property({ type: String })],
|
|
230
|
-
__decorate([property({ type: String })],
|
|
231
|
-
|
|
223
|
+
__decorate([property({ type: String })], AxebowCardCloudLogo.prototype, "src", void 0);
|
|
224
|
+
__decorate([property({ type: String })], AxebowCardCloudLogo.prototype, "size", void 0);
|
|
225
|
+
AxebowCardCloudLogo = __decorate([customElement("axebow-card-cloud-logo")], AxebowCardCloudLogo);
|
|
232
226
|
//#endregion
|
|
233
|
-
//#region src/components/cards/parts/
|
|
234
|
-
var
|
|
227
|
+
//#region src/components/cards/parts/axebow-card-version-selector.ts
|
|
228
|
+
var AxebowCardVersionSelector = class AxebowCardVersionSelector extends LitElement {
|
|
235
229
|
constructor(..._args) {
|
|
236
230
|
super(..._args);
|
|
237
231
|
this.revisions = [];
|
|
@@ -257,8 +251,9 @@ var AuroraCardVersionSelector = class AuroraCardVersionSelector extends LitEleme
|
|
|
257
251
|
min-width: 0;
|
|
258
252
|
display: inline-block;
|
|
259
253
|
}
|
|
260
|
-
sl-select::part(display-input) { padding: 0
|
|
261
|
-
sl-select::part(combobox) { padding: 0; }
|
|
254
|
+
sl-select::part(display-input) { padding: 0; font-size: 0.75rem; color: var(--axebow-tertiary); }
|
|
255
|
+
sl-select::part(combobox) { padding: 0; gap: 0.5rem; }
|
|
256
|
+
sl-select::part(expand-icon) { color: var(--axebow-tertiary); }
|
|
262
257
|
`];
|
|
263
258
|
}
|
|
264
259
|
_formatRevision(id) {
|
|
@@ -282,12 +277,61 @@ var AuroraCardVersionSelector = class AuroraCardVersionSelector extends LitEleme
|
|
|
282
277
|
}));
|
|
283
278
|
}
|
|
284
279
|
};
|
|
285
|
-
__decorate([property({ type: Array })],
|
|
286
|
-
__decorate([property({ type: String })],
|
|
287
|
-
|
|
280
|
+
__decorate([property({ type: Array })], AxebowCardVersionSelector.prototype, "revisions", void 0);
|
|
281
|
+
__decorate([property({ type: String })], AxebowCardVersionSelector.prototype, "displayedRevision", void 0);
|
|
282
|
+
AxebowCardVersionSelector = __decorate([customElement("axebow-card-version-selector")], AxebowCardVersionSelector);
|
|
288
283
|
//#endregion
|
|
289
|
-
//#region src/components/cards/parts/
|
|
290
|
-
var
|
|
284
|
+
//#region src/components/cards/parts/axebow-role-tooltip.ts
|
|
285
|
+
var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
|
|
286
|
+
constructor(..._args) {
|
|
287
|
+
super(..._args);
|
|
288
|
+
this.heading = "";
|
|
289
|
+
this.items = [];
|
|
290
|
+
this.color = "var(--axebow-primary)";
|
|
291
|
+
}
|
|
292
|
+
static {
|
|
293
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
294
|
+
:host { display: contents; }
|
|
295
|
+
sl-tooltip::part(body) {
|
|
296
|
+
background-color: var(--axebow-white);
|
|
297
|
+
color: var(--axebow-primary);
|
|
298
|
+
padding: 1rem;
|
|
299
|
+
border: 3px solid var(--axebow-table-border);
|
|
300
|
+
width: 280px;
|
|
301
|
+
}
|
|
302
|
+
ul {
|
|
303
|
+
margin: 0.5rem 0 0;
|
|
304
|
+
padding-left: 1.2rem;
|
|
305
|
+
list-style: disc;
|
|
306
|
+
}
|
|
307
|
+
li {
|
|
308
|
+
font-size: 0.8rem;
|
|
309
|
+
line-height: 1.5;
|
|
310
|
+
}
|
|
311
|
+
`];
|
|
312
|
+
}
|
|
313
|
+
render() {
|
|
314
|
+
if (!this.heading) return html``;
|
|
315
|
+
return html`
|
|
316
|
+
<sl-tooltip placement="right" hoist>
|
|
317
|
+
<div slot="content">
|
|
318
|
+
<strong>${this.heading}</strong>
|
|
319
|
+
<ul>
|
|
320
|
+
${this.items.map((item) => html`<li>${item}</li>`)}
|
|
321
|
+
</ul>
|
|
322
|
+
</div>
|
|
323
|
+
<axebow-icon iconName="info" size="small" class="cursor-pointer" iconColor=${this.color}></axebow-icon>
|
|
324
|
+
</sl-tooltip>
|
|
325
|
+
`;
|
|
326
|
+
}
|
|
327
|
+
};
|
|
328
|
+
__decorate([property({ type: String })], AxebowRoleTooltip.prototype, "heading", void 0);
|
|
329
|
+
__decorate([property({ type: Array })], AxebowRoleTooltip.prototype, "items", void 0);
|
|
330
|
+
__decorate([property({ type: String })], AxebowRoleTooltip.prototype, "color", void 0);
|
|
331
|
+
AxebowRoleTooltip = __decorate([customElement("axebow-role-tooltip")], AxebowRoleTooltip);
|
|
332
|
+
//#endregion
|
|
333
|
+
//#region src/components/cards/parts/axebow-card-header.ts
|
|
334
|
+
var AxebowCardHeader = class AxebowCardHeader extends LitElement {
|
|
291
335
|
constructor(..._args) {
|
|
292
336
|
super(..._args);
|
|
293
337
|
this.logoSrc = null;
|
|
@@ -303,6 +347,9 @@ var AuroraCardHeader = class AuroraCardHeader extends LitElement {
|
|
|
303
347
|
this.freeIaasDesc = "This environment uses free infrastructure.";
|
|
304
348
|
this.haLabel = "Highly Available";
|
|
305
349
|
this.haTitle = "High Availability enabled";
|
|
350
|
+
this.role = "";
|
|
351
|
+
this.roleTooltips = {};
|
|
352
|
+
this.roleTooltipColor = "var(--axebow-primary)";
|
|
306
353
|
}
|
|
307
354
|
static {
|
|
308
355
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
@@ -319,7 +366,7 @@ var AuroraCardHeader = class AuroraCardHeader extends LitElement {
|
|
|
319
366
|
</div>
|
|
320
367
|
<div class="flex items-center gap-2 cursor-pointer">
|
|
321
368
|
<axebow-icon iconName="info" iconColor="var(--axebow-gray)" size="small"></axebow-icon>
|
|
322
|
-
<span class="text-
|
|
369
|
+
<span class="text-(--axebow-rich-black)">${this.freeIaasLabel}</span>
|
|
323
370
|
</div>
|
|
324
371
|
</sl-tooltip>
|
|
325
372
|
`;
|
|
@@ -330,45 +377,64 @@ var AuroraCardHeader = class AuroraCardHeader extends LitElement {
|
|
|
330
377
|
`;
|
|
331
378
|
return html``;
|
|
332
379
|
}
|
|
380
|
+
_headerHeight() {
|
|
381
|
+
switch (this.cardType) {
|
|
382
|
+
case "tenant": return "4.5625rem";
|
|
383
|
+
case "environment": return "3.6875rem";
|
|
384
|
+
default: return "4.125rem";
|
|
385
|
+
}
|
|
386
|
+
}
|
|
333
387
|
render() {
|
|
334
388
|
const isTenant = this.cardType === "tenant";
|
|
335
389
|
const isCompact = this.cardType === "environment" || isTenant;
|
|
336
390
|
const isRuntime = this.cardType === "runtime";
|
|
391
|
+
const heightStyle = `height:${this._headerHeight()}`;
|
|
337
392
|
if (isCompact) return html`
|
|
338
|
-
<div class="w-full bg-
|
|
393
|
+
<div class="w-full bg-(--axebow-anti-flash-white) rounded-lg flex flex-col justify-center px-5 py-3 box-border" style=${heightStyle}>
|
|
339
394
|
<div class="flex flex-col flex-1 min-w-0">
|
|
340
395
|
${this.tenantOrAccount || this.logoSrc ? html`
|
|
341
396
|
<div class="flex gap-2 items-center leading-none mt-1">
|
|
342
|
-
<
|
|
343
|
-
<span class="font-semibold
|
|
397
|
+
<axebow-card-cloud-logo .src=${this.logoSrc} size="small"></axebow-card-cloud-logo>
|
|
398
|
+
<span class="text-xs font-semibold text-(--axebow-gray) leading-none">${this.tenantOrAccount}</span>
|
|
344
399
|
</div>
|
|
345
400
|
` : ""}
|
|
346
401
|
<div class="flex justify-between items-center">
|
|
347
|
-
<span class="font-bold text-
|
|
402
|
+
<span class="font-bold text-lg text-(--axebow-primary) leading-snug pt-0.5">${this.name}</span>
|
|
348
403
|
${this._renderBadge()}
|
|
349
404
|
</div>
|
|
350
|
-
${this.subtitle ? html
|
|
405
|
+
${this.subtitle ? html`
|
|
406
|
+
<div class="text-xs text-(--axebow-gray) flex items-center gap-1 mt-1">
|
|
407
|
+
${this.subtitle}
|
|
408
|
+
${isTenant && this.roleTooltips[this.role] ? html`
|
|
409
|
+
<axebow-role-tooltip
|
|
410
|
+
.heading=${this.roleTooltips[this.role].title}
|
|
411
|
+
.items=${this.roleTooltips[this.role].items}
|
|
412
|
+
color=${this.roleTooltipColor}
|
|
413
|
+
></axebow-role-tooltip>
|
|
414
|
+
` : html`<slot name="subtitle-tooltip"></slot>`}
|
|
415
|
+
</div>
|
|
416
|
+
` : ""}
|
|
351
417
|
</div>
|
|
352
418
|
</div>
|
|
353
419
|
`;
|
|
354
420
|
return html`
|
|
355
|
-
<div class="w-full bg-
|
|
356
|
-
<
|
|
421
|
+
<div class="w-full bg-(--axebow-anti-flash-white) rounded-lg flex items-center gap-3 py-2 px-3 box-border" style=${heightStyle}>
|
|
422
|
+
<axebow-card-cloud-logo .src=${this.logoSrc} size="large"></axebow-card-cloud-logo>
|
|
357
423
|
<div class="flex flex-col flex-1 min-w-0 ${isRuntime ? "justify-center" : ""}">
|
|
358
|
-
${!isRuntime && this.tenantOrAccount ? html`<span class="font-semibold text-
|
|
359
|
-
<div class="flex justify-between items-center">
|
|
360
|
-
<span class="font-bold text-
|
|
424
|
+
${!isRuntime && this.tenantOrAccount ? html`<span class="text-xs font-semibold text-(--axebow-gray) leading-none">${this.tenantOrAccount}</span>` : ""}
|
|
425
|
+
<div class="flex justify-between items-center ${isRuntime ? "mt-1.5" : ""}">
|
|
426
|
+
<span class="font-bold ${isRuntime ? "text-base" : "text-lg"} text-(--axebow-primary) leading-snug ${isRuntime ? "" : "pt-0.5"}">${this.name}</span>
|
|
361
427
|
${this._renderBadge()}
|
|
362
428
|
</div>
|
|
363
429
|
${isRuntime ? html`
|
|
364
|
-
<div class="revision-wrap
|
|
365
|
-
<
|
|
430
|
+
<div class="revision-wrap flex items-center mt-0.5">
|
|
431
|
+
<axebow-card-version-selector
|
|
366
432
|
.revisions=${this.revisions}
|
|
367
433
|
.displayedRevision=${this.displayedRevision}
|
|
368
434
|
@revision-change=${this._onRevisionChange}
|
|
369
|
-
></
|
|
435
|
+
></axebow-card-version-selector>
|
|
370
436
|
</div>
|
|
371
|
-
` : this.subtitle ? html`<div class="
|
|
437
|
+
` : this.subtitle ? html`<div class="text-xs text-(--axebow-gray) flex items-center gap-1 mt-1">${this.subtitle}<slot name="subtitle-tooltip"></slot></div>` : ""}
|
|
372
438
|
</div>
|
|
373
439
|
</div>
|
|
374
440
|
`;
|
|
@@ -381,23 +447,26 @@ var AuroraCardHeader = class AuroraCardHeader extends LitElement {
|
|
|
381
447
|
}));
|
|
382
448
|
}
|
|
383
449
|
};
|
|
384
|
-
__decorate([property({ type: String })],
|
|
385
|
-
__decorate([property({ type: String })],
|
|
386
|
-
__decorate([property({ type: String })],
|
|
387
|
-
__decorate([property({ type: String })],
|
|
388
|
-
__decorate([property({ type: String })],
|
|
389
|
-
__decorate([property({ type: String })],
|
|
390
|
-
__decorate([property({ type: Array })],
|
|
391
|
-
__decorate([property({ type: String })],
|
|
392
|
-
__decorate([property({ type: String })],
|
|
393
|
-
__decorate([property({ type: String })],
|
|
394
|
-
__decorate([property({ type: String })],
|
|
395
|
-
__decorate([property({ type: String })],
|
|
396
|
-
__decorate([property({ type: String })],
|
|
397
|
-
|
|
450
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "logoSrc", void 0);
|
|
451
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "tenantOrAccount", void 0);
|
|
452
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "name", void 0);
|
|
453
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "badge", void 0);
|
|
454
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "subtitle", void 0);
|
|
455
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "cardType", void 0);
|
|
456
|
+
__decorate([property({ type: Array })], AxebowCardHeader.prototype, "revisions", void 0);
|
|
457
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "displayedRevision", void 0);
|
|
458
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "freeIaasLabel", void 0);
|
|
459
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "freeIaasTitle", void 0);
|
|
460
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "freeIaasDesc", void 0);
|
|
461
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "haLabel", void 0);
|
|
462
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "haTitle", void 0);
|
|
463
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "role", void 0);
|
|
464
|
+
__decorate([property({ type: Object })], AxebowCardHeader.prototype, "roleTooltips", void 0);
|
|
465
|
+
__decorate([property({ type: String })], AxebowCardHeader.prototype, "roleTooltipColor", void 0);
|
|
466
|
+
AxebowCardHeader = __decorate([customElement("axebow-card-header")], AxebowCardHeader);
|
|
398
467
|
//#endregion
|
|
399
|
-
//#region src/components/cards/parts/
|
|
400
|
-
var
|
|
468
|
+
//#region src/components/cards/parts/axebow-card-stat-item.ts
|
|
469
|
+
var AxebowCardStatItem = class AxebowCardStatItem extends LitElement {
|
|
401
470
|
constructor(..._args) {
|
|
402
471
|
super(..._args);
|
|
403
472
|
this.value = 0;
|
|
@@ -412,10 +481,10 @@ var AuroraCardStatItem = class AuroraCardStatItem extends LitElement {
|
|
|
412
481
|
render() {
|
|
413
482
|
return html`
|
|
414
483
|
<div class="flex flex-col items-center text-center gap-0.5">
|
|
415
|
-
<h4 class="text-lg text-
|
|
484
|
+
<h4 class="text-lg text-(--axebow-primary) font-bold leading-snug m-0">${this.value}</h4>
|
|
416
485
|
<p class="m-0 leading-snug">${this.title}</p>
|
|
417
486
|
<span
|
|
418
|
-
class="text-
|
|
487
|
+
class="text-(--axebow-gray) font-semibold text-xs ${this.active ? "cursor-pointer opacity-100" : "cursor-not-allowed opacity-50"}"
|
|
419
488
|
@click=${this._onClick}
|
|
420
489
|
>${this.label}</span>
|
|
421
490
|
</div>
|
|
@@ -428,15 +497,15 @@ var AuroraCardStatItem = class AuroraCardStatItem extends LitElement {
|
|
|
428
497
|
}));
|
|
429
498
|
}
|
|
430
499
|
};
|
|
431
|
-
__decorate([property({ type: Number })],
|
|
432
|
-
__decorate([property({ type: String })],
|
|
433
|
-
__decorate([property({ type: String })],
|
|
434
|
-
__decorate([property({ type: Boolean })],
|
|
435
|
-
__decorate([property({ type: Boolean })],
|
|
436
|
-
|
|
500
|
+
__decorate([property({ type: Number })], AxebowCardStatItem.prototype, "value", void 0);
|
|
501
|
+
__decorate([property({ type: String })], AxebowCardStatItem.prototype, "title", void 0);
|
|
502
|
+
__decorate([property({ type: String })], AxebowCardStatItem.prototype, "label", void 0);
|
|
503
|
+
__decorate([property({ type: Boolean })], AxebowCardStatItem.prototype, "active", void 0);
|
|
504
|
+
__decorate([property({ type: Boolean })], AxebowCardStatItem.prototype, "compact", void 0);
|
|
505
|
+
AxebowCardStatItem = __decorate([customElement("axebow-card-stat-item")], AxebowCardStatItem);
|
|
437
506
|
//#endregion
|
|
438
|
-
//#region src/components/cards/parts/
|
|
439
|
-
var
|
|
507
|
+
//#region src/components/cards/parts/axebow-card-stats-row.ts
|
|
508
|
+
var AxebowCardStatsRow = class AxebowCardStatsRow extends LitElement {
|
|
440
509
|
constructor(..._args) {
|
|
441
510
|
super(..._args);
|
|
442
511
|
this.stats = [];
|
|
@@ -449,14 +518,14 @@ var AuroraCardStatsRow = class AuroraCardStatsRow extends LitElement {
|
|
|
449
518
|
return html`
|
|
450
519
|
<div class="grid grid-cols-3 gap-1 px-2">
|
|
451
520
|
${this.stats.map((stat, index) => html`
|
|
452
|
-
<
|
|
521
|
+
<axebow-card-stat-item
|
|
453
522
|
.value=${stat.value}
|
|
454
523
|
.title=${stat.title}
|
|
455
524
|
.label=${stat.label}
|
|
456
525
|
.active=${stat.active !== false}
|
|
457
526
|
.compact=${this.compact}
|
|
458
527
|
@label-click=${() => this._handleLabelClick(index)}
|
|
459
|
-
></
|
|
528
|
+
></axebow-card-stat-item>
|
|
460
529
|
`)}
|
|
461
530
|
</div>
|
|
462
531
|
`;
|
|
@@ -469,12 +538,12 @@ var AuroraCardStatsRow = class AuroraCardStatsRow extends LitElement {
|
|
|
469
538
|
}));
|
|
470
539
|
}
|
|
471
540
|
};
|
|
472
|
-
__decorate([property({ type: Array })],
|
|
473
|
-
__decorate([property({ type: Boolean })],
|
|
474
|
-
|
|
541
|
+
__decorate([property({ type: Array })], AxebowCardStatsRow.prototype, "stats", void 0);
|
|
542
|
+
__decorate([property({ type: Boolean })], AxebowCardStatsRow.prototype, "compact", void 0);
|
|
543
|
+
AxebowCardStatsRow = __decorate([customElement("axebow-card-stats-row")], AxebowCardStatsRow);
|
|
475
544
|
//#endregion
|
|
476
|
-
//#region src/components/cards/parts/
|
|
477
|
-
var
|
|
545
|
+
//#region src/components/cards/parts/axebow-card-filter-item.ts
|
|
546
|
+
var AxebowCardFilterItem = class AxebowCardFilterItem extends LitElement {
|
|
478
547
|
constructor(..._args) {
|
|
479
548
|
super(..._args);
|
|
480
549
|
this.name = "";
|
|
@@ -486,7 +555,7 @@ var AuroraCardFilterItem = class AuroraCardFilterItem extends LitElement {
|
|
|
486
555
|
render() {
|
|
487
556
|
return html`
|
|
488
557
|
<div
|
|
489
|
-
class="w-full py-1 px-2 flex justify-between items-center border-t border-
|
|
558
|
+
class="w-full py-1 px-2 flex justify-between items-center border-t border-(--axebow-light-gray) cursor-pointer hover:bg-(--axebow-light-gray)"
|
|
490
559
|
@click=${this._onClick}
|
|
491
560
|
>
|
|
492
561
|
<p class="m-0">${this.name}</p>
|
|
@@ -502,12 +571,12 @@ var AuroraCardFilterItem = class AuroraCardFilterItem extends LitElement {
|
|
|
502
571
|
}));
|
|
503
572
|
}
|
|
504
573
|
};
|
|
505
|
-
__decorate([property({ type: String })],
|
|
506
|
-
__decorate([property({ type: Boolean })],
|
|
507
|
-
|
|
574
|
+
__decorate([property({ type: String })], AxebowCardFilterItem.prototype, "name", void 0);
|
|
575
|
+
__decorate([property({ type: Boolean })], AxebowCardFilterItem.prototype, "showAttention", void 0);
|
|
576
|
+
AxebowCardFilterItem = __decorate([customElement("axebow-card-filter-item")], AxebowCardFilterItem);
|
|
508
577
|
//#endregion
|
|
509
|
-
//#region src/components/cards/parts/
|
|
510
|
-
var
|
|
578
|
+
//#region src/components/cards/parts/axebow-card-filter.ts
|
|
579
|
+
var AxebowCardFilter = class AxebowCardFilter extends LitElement {
|
|
511
580
|
constructor(..._args) {
|
|
512
581
|
super(..._args);
|
|
513
582
|
this.items = [];
|
|
@@ -526,10 +595,10 @@ var AuroraCardFilter = class AuroraCardFilter extends LitElement {
|
|
|
526
595
|
render() {
|
|
527
596
|
return html`
|
|
528
597
|
<div class="relative">
|
|
529
|
-
<div class="flex justify-between items-center border-b border-
|
|
598
|
+
<div class="flex justify-between items-center border-b border-(--axebow-light-gray) w-full px-2 cursor-pointer h-7">
|
|
530
599
|
${!this.selected && this.items.length === 0 ? html`
|
|
531
600
|
<p
|
|
532
|
-
class="m-0 ${this.isPlainRole || this.isDisabled ? "text-
|
|
601
|
+
class="m-0 ${this.isPlainRole || this.isDisabled ? "text-(--axebow-gray) cursor-default opacity-50" : "text-(--axebow-tertiary) cursor-pointer"}"
|
|
533
602
|
@click=${this.isPlainRole || this.isDisabled ? void 0 : this._onEmptyAction}
|
|
534
603
|
>
|
|
535
604
|
${this.emptyActionLabel}
|
|
@@ -539,23 +608,23 @@ var AuroraCardFilter = class AuroraCardFilter extends LitElement {
|
|
|
539
608
|
class="flex w-full justify-between items-center ${this.isDisabled ? "opacity-50 cursor-not-allowed" : ""}"
|
|
540
609
|
@click=${this.isDisabled ? void 0 : this._onToggle}
|
|
541
610
|
>
|
|
542
|
-
<span class="text-
|
|
611
|
+
<span class="text-(--axebow-tertiary)">${this.selected ?? this.emptyLabel}</span>
|
|
543
612
|
<div class="flex items-center gap-2">
|
|
544
|
-
${this.showAttention ? html`<p class="text-
|
|
613
|
+
${this.showAttention ? html`<p class="text-(--axebow-error) m-0 text-xs">${this.attentionLabel}</p>` : ""}
|
|
545
614
|
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="small"></axebow-icon>
|
|
546
615
|
</div>
|
|
547
616
|
</div>
|
|
548
617
|
`}
|
|
549
618
|
</div>
|
|
550
619
|
|
|
551
|
-
<div class="${this.opened ? "" : "hidden"} absolute top-full left-0 right-0 z-10 flex flex-col bg-white rounded-b-lg border border-
|
|
552
|
-
<p class="w-full p-2 cursor-pointer m-0 hover:bg-
|
|
620
|
+
<div class="${this.opened ? "" : "hidden"} absolute top-full left-0 right-0 z-10 flex flex-col bg-white rounded-b-lg border border-(--axebow-light-gray) shadow-[2px_2px_25px_0px_rgba(0,0,0,0.1)] max-h-40 overflow-y-auto">
|
|
621
|
+
<p class="w-full p-2 cursor-pointer m-0 hover:bg-(--axebow-light-gray)" @click=${() => this._onSelect(null)}>${this.emptyLabel}</p>
|
|
553
622
|
${this.items.map((item) => html`
|
|
554
|
-
<
|
|
623
|
+
<axebow-card-filter-item
|
|
555
624
|
.name=${item.name}
|
|
556
625
|
.showAttention=${item.showAttention}
|
|
557
626
|
@item-select=${(e) => this._onSelect(e.detail.name)}
|
|
558
|
-
></
|
|
627
|
+
></axebow-card-filter-item>
|
|
559
628
|
`)}
|
|
560
629
|
</div>
|
|
561
630
|
</div>
|
|
@@ -581,19 +650,19 @@ var AuroraCardFilter = class AuroraCardFilter extends LitElement {
|
|
|
581
650
|
}));
|
|
582
651
|
}
|
|
583
652
|
};
|
|
584
|
-
__decorate([property({ type: Array })],
|
|
585
|
-
__decorate([property({ type: String })],
|
|
586
|
-
__decorate([property({ type: String })],
|
|
587
|
-
__decorate([property({ type: String })],
|
|
588
|
-
__decorate([property({ type: String })],
|
|
589
|
-
__decorate([property({ type: Boolean })],
|
|
590
|
-
__decorate([property({ type: Boolean })],
|
|
591
|
-
__decorate([property({ type: Boolean })],
|
|
592
|
-
__decorate([property({ type: Boolean })],
|
|
593
|
-
|
|
653
|
+
__decorate([property({ type: Array })], AxebowCardFilter.prototype, "items", void 0);
|
|
654
|
+
__decorate([property({ type: String })], AxebowCardFilter.prototype, "selected", void 0);
|
|
655
|
+
__decorate([property({ type: String })], AxebowCardFilter.prototype, "emptyLabel", void 0);
|
|
656
|
+
__decorate([property({ type: String })], AxebowCardFilter.prototype, "emptyActionLabel", void 0);
|
|
657
|
+
__decorate([property({ type: String })], AxebowCardFilter.prototype, "attentionLabel", void 0);
|
|
658
|
+
__decorate([property({ type: Boolean })], AxebowCardFilter.prototype, "showAttention", void 0);
|
|
659
|
+
__decorate([property({ type: Boolean })], AxebowCardFilter.prototype, "opened", void 0);
|
|
660
|
+
__decorate([property({ type: Boolean })], AxebowCardFilter.prototype, "isPlainRole", void 0);
|
|
661
|
+
__decorate([property({ type: Boolean })], AxebowCardFilter.prototype, "isDisabled", void 0);
|
|
662
|
+
AxebowCardFilter = __decorate([customElement("axebow-card-filter")], AxebowCardFilter);
|
|
594
663
|
//#endregion
|
|
595
|
-
//#region src/components/cards/parts/
|
|
596
|
-
var
|
|
664
|
+
//#region src/components/cards/parts/axebow-card-table-header.ts
|
|
665
|
+
var AxebowCardTableHeader = class AxebowCardTableHeader extends LitElement {
|
|
597
666
|
constructor(..._args) {
|
|
598
667
|
super(..._args);
|
|
599
668
|
this.opened = false;
|
|
@@ -610,21 +679,21 @@ var AuroraCardTableHeader = class AuroraCardTableHeader extends LitElement {
|
|
|
610
679
|
return html`
|
|
611
680
|
<div class="relative">
|
|
612
681
|
<div
|
|
613
|
-
class="flex justify-between items-center border-b border-
|
|
682
|
+
class="flex justify-between items-center border-b border-(--axebow-light-gray) w-full px-2 cursor-pointer h-7"
|
|
614
683
|
@click=${this._onToggle}
|
|
615
684
|
>
|
|
616
|
-
<span class="text-
|
|
685
|
+
<span class="text-(--axebow-tertiary)">${this.filterDisplayText || this.allLabel}</span>
|
|
617
686
|
<div class="flex items-center gap-2">
|
|
618
|
-
${this.showAttention ? html`<p class="text-
|
|
687
|
+
${this.showAttention ? html`<p class="text-(--axebow-error) m-0 text-xs">${this.attentionLabel}</p>` : ""}
|
|
619
688
|
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="small"></axebow-icon>
|
|
620
689
|
</div>
|
|
621
690
|
</div>
|
|
622
691
|
|
|
623
|
-
<div class="${this.opened ? "" : "hidden"} absolute top-full left-0 right-0 z-10 flex flex-col bg-white rounded-b-lg border border-
|
|
624
|
-
<p class="w-full p-2 cursor-pointer m-0 hover:bg-
|
|
692
|
+
<div class="${this.opened ? "" : "hidden"} absolute top-full left-0 right-0 z-10 flex flex-col bg-white rounded-b-lg border border-(--axebow-light-gray) shadow-[2px_2px_25px_0px_rgba(0,0,0,0.1)] max-h-40 overflow-y-auto">
|
|
693
|
+
<p class="w-full p-2 cursor-pointer m-0 hover:bg-(--axebow-light-gray)" @click=${() => this._onSelect("", "all")}>${this.allLabel}</p>
|
|
625
694
|
${this.filterRoles.map((role) => html`
|
|
626
695
|
<div
|
|
627
|
-
class="w-full py-1 px-2 flex justify-between items-center border-t border-
|
|
696
|
+
class="w-full py-1 px-2 flex justify-between items-center border-t border-(--axebow-light-gray) cursor-pointer hover:bg-(--axebow-light-gray)"
|
|
628
697
|
@click=${() => this._onSelect(role.name, "role")}
|
|
629
698
|
>
|
|
630
699
|
<div class="flex items-center gap-2">
|
|
@@ -634,7 +703,7 @@ var AuroraCardTableHeader = class AuroraCardTableHeader extends LitElement {
|
|
|
634
703
|
</div>
|
|
635
704
|
${role.instances.map((inst) => html`
|
|
636
705
|
<div
|
|
637
|
-
class="w-full py-1 px-2 pl-6 flex justify-between items-center border-t border-
|
|
706
|
+
class="w-full py-1 px-2 pl-6 flex justify-between items-center border-t border-(--axebow-light-gray) cursor-pointer hover:bg-(--axebow-light-gray)"
|
|
638
707
|
@click=${() => this._onSelect(inst.name, "instance")}
|
|
639
708
|
>
|
|
640
709
|
<div class="flex items-center gap-2">
|
|
@@ -666,16 +735,16 @@ var AuroraCardTableHeader = class AuroraCardTableHeader extends LitElement {
|
|
|
666
735
|
}));
|
|
667
736
|
}
|
|
668
737
|
};
|
|
669
|
-
__decorate([property({ type: Boolean })],
|
|
670
|
-
__decorate([property({ type: String })],
|
|
671
|
-
__decorate([property({ type: String })],
|
|
672
|
-
__decorate([property({ type: String })],
|
|
673
|
-
__decorate([property({ type: Boolean })],
|
|
674
|
-
__decorate([property({ type: Array })],
|
|
675
|
-
|
|
738
|
+
__decorate([property({ type: Boolean })], AxebowCardTableHeader.prototype, "opened", void 0);
|
|
739
|
+
__decorate([property({ type: String })], AxebowCardTableHeader.prototype, "filterDisplayText", void 0);
|
|
740
|
+
__decorate([property({ type: String })], AxebowCardTableHeader.prototype, "allLabel", void 0);
|
|
741
|
+
__decorate([property({ type: String })], AxebowCardTableHeader.prototype, "attentionLabel", void 0);
|
|
742
|
+
__decorate([property({ type: Boolean })], AxebowCardTableHeader.prototype, "showAttention", void 0);
|
|
743
|
+
__decorate([property({ type: Array })], AxebowCardTableHeader.prototype, "filterRoles", void 0);
|
|
744
|
+
AxebowCardTableHeader = __decorate([customElement("axebow-card-table-header")], AxebowCardTableHeader);
|
|
676
745
|
//#endregion
|
|
677
|
-
//#region src/components/cards/parts/
|
|
678
|
-
var
|
|
746
|
+
//#region src/components/cards/parts/axebow-card-special-link.ts
|
|
747
|
+
var AxebowCardSpecialLink = class AxebowCardSpecialLink extends LitElement {
|
|
679
748
|
constructor(..._args) {
|
|
680
749
|
super(..._args);
|
|
681
750
|
this.label = "";
|
|
@@ -700,13 +769,13 @@ var AuroraCardSpecialLink = class AuroraCardSpecialLink extends LitElement {
|
|
|
700
769
|
}));
|
|
701
770
|
}
|
|
702
771
|
};
|
|
703
|
-
__decorate([property({ type: String })],
|
|
704
|
-
__decorate([property({ type: String })],
|
|
705
|
-
__decorate([property({ type: String })],
|
|
706
|
-
|
|
772
|
+
__decorate([property({ type: String })], AxebowCardSpecialLink.prototype, "label", void 0);
|
|
773
|
+
__decorate([property({ type: String })], AxebowCardSpecialLink.prototype, "color", void 0);
|
|
774
|
+
__decorate([property({ type: String })], AxebowCardSpecialLink.prototype, "icon", void 0);
|
|
775
|
+
AxebowCardSpecialLink = __decorate([customElement("axebow-card-special-link")], AxebowCardSpecialLink);
|
|
707
776
|
//#endregion
|
|
708
|
-
//#region src/components/cards/parts/
|
|
709
|
-
var
|
|
777
|
+
//#region src/components/cards/parts/axebow-card-attention-banner.ts
|
|
778
|
+
var AxebowCardAttentionBanner = class AxebowCardAttentionBanner extends LitElement {
|
|
710
779
|
constructor(..._args) {
|
|
711
780
|
super(..._args);
|
|
712
781
|
this.cardType = "account";
|
|
@@ -740,14 +809,14 @@ var AuroraCardAttentionBanner = class AuroraCardAttentionBanner extends LitEleme
|
|
|
740
809
|
if (exceeded.length === 0 && !this.invalidCredentials) return html``;
|
|
741
810
|
return html`
|
|
742
811
|
<div class="error-bg flex flex-wrap items-center justify-center gap-1 w-full px-1 text-center">
|
|
743
|
-
${this.isPlainRole ? html`<span class="text-
|
|
744
|
-
<p class="text-
|
|
812
|
+
${this.isPlainRole ? html`<span class="text-(--axebow-error)">${this.askOwnerLabel}</span>` : html`
|
|
813
|
+
<p class="text-(--axebow-error) m-0">
|
|
745
814
|
${this.invalidCredentials ? this.invalidCredsLabel : `${this.limitReachedLabel} ${this._formatList(exceeded)}.`}
|
|
746
|
-
<
|
|
815
|
+
<axebow-card-special-link
|
|
747
816
|
.label=${this.manageLabel}
|
|
748
817
|
color="var(--axebow-error)"
|
|
749
818
|
@link-click=${this._onManage}
|
|
750
|
-
></
|
|
819
|
+
></axebow-card-special-link>
|
|
751
820
|
</p>
|
|
752
821
|
`}
|
|
753
822
|
</div>
|
|
@@ -760,20 +829,20 @@ var AuroraCardAttentionBanner = class AuroraCardAttentionBanner extends LitEleme
|
|
|
760
829
|
}));
|
|
761
830
|
}
|
|
762
831
|
};
|
|
763
|
-
__decorate([property({ type: String })],
|
|
764
|
-
__decorate([property({ type: Array })],
|
|
765
|
-
__decorate([property({ type: Number })],
|
|
766
|
-
__decorate([property({ type: Boolean })],
|
|
767
|
-
__decorate([property({ type: Boolean })],
|
|
768
|
-
__decorate([property({ type: String })],
|
|
769
|
-
__decorate([property({ type: String })],
|
|
770
|
-
__decorate([property({ type: String })],
|
|
771
|
-
__decorate([property({ type: String })],
|
|
772
|
-
__decorate([property({ type: String })],
|
|
773
|
-
|
|
832
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "cardType", void 0);
|
|
833
|
+
__decorate([property({ type: Array })], AxebowCardAttentionBanner.prototype, "tableStats", void 0);
|
|
834
|
+
__decorate([property({ type: Number })], AxebowCardAttentionBanner.prototype, "threshold", void 0);
|
|
835
|
+
__decorate([property({ type: Boolean })], AxebowCardAttentionBanner.prototype, "isPlainRole", void 0);
|
|
836
|
+
__decorate([property({ type: Boolean })], AxebowCardAttentionBanner.prototype, "invalidCredentials", void 0);
|
|
837
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "manageLabel", void 0);
|
|
838
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "askOwnerLabel", void 0);
|
|
839
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "invalidCredsLabel", void 0);
|
|
840
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "limitReachedLabel", void 0);
|
|
841
|
+
__decorate([property({ type: String })], AxebowCardAttentionBanner.prototype, "andLabel", void 0);
|
|
842
|
+
AxebowCardAttentionBanner = __decorate([customElement("axebow-card-attention-banner")], AxebowCardAttentionBanner);
|
|
774
843
|
//#endregion
|
|
775
|
-
//#region src/components/cards/parts/
|
|
776
|
-
var
|
|
844
|
+
//#region src/components/cards/parts/axebow-card-action-banner.ts
|
|
845
|
+
var AxebowCardActionBanner = class AxebowCardActionBanner extends LitElement {
|
|
777
846
|
constructor(..._args) {
|
|
778
847
|
super(..._args);
|
|
779
848
|
this.label = "View details";
|
|
@@ -803,11 +872,11 @@ var AuroraCardActionBanner = class AuroraCardActionBanner extends LitElement {
|
|
|
803
872
|
}));
|
|
804
873
|
}
|
|
805
874
|
};
|
|
806
|
-
__decorate([property({ type: String })],
|
|
807
|
-
|
|
875
|
+
__decorate([property({ type: String })], AxebowCardActionBanner.prototype, "label", void 0);
|
|
876
|
+
AxebowCardActionBanner = __decorate([customElement("axebow-card-action-banner")], AxebowCardActionBanner);
|
|
808
877
|
//#endregion
|
|
809
|
-
//#region src/components/cards/parts/
|
|
810
|
-
var
|
|
878
|
+
//#region src/components/cards/parts/axebow-card-resource-row.ts
|
|
879
|
+
var AxebowCardResourceRow = class AxebowCardResourceRow extends LitElement {
|
|
811
880
|
constructor(..._args) {
|
|
812
881
|
super(..._args);
|
|
813
882
|
this.attentionThreshold = 90;
|
|
@@ -838,9 +907,9 @@ var AuroraCardResourceRow = class AuroraCardResourceRow extends LitElement {
|
|
|
838
907
|
</div>
|
|
839
908
|
|
|
840
909
|
<div class="flex items-center justify-end w-full px-2 h-8 ${borderClass}">
|
|
841
|
-
<div class="h-2 w-full bg-
|
|
910
|
+
<div class="h-2 w-full bg-(--axebow-light-gray) rounded-md relative overflow-hidden">
|
|
842
911
|
<div
|
|
843
|
-
class="absolute h-full ${stat.percentage >= this.attentionThreshold ? "bg-
|
|
912
|
+
class="absolute h-full ${stat.percentage >= this.attentionThreshold ? "bg-(--axebow-error)" : "bg-(--axebow-gray)"}"
|
|
844
913
|
style="width:${stat.percentage}%;"
|
|
845
914
|
></div>
|
|
846
915
|
</div>
|
|
@@ -854,13 +923,13 @@ var AuroraCardResourceRow = class AuroraCardResourceRow extends LitElement {
|
|
|
854
923
|
`;
|
|
855
924
|
}
|
|
856
925
|
};
|
|
857
|
-
__decorate([property({ type: Object })],
|
|
858
|
-
__decorate([property({ type: Number })],
|
|
859
|
-
__decorate([property({ type: Boolean })],
|
|
860
|
-
|
|
926
|
+
__decorate([property({ type: Object })], AxebowCardResourceRow.prototype, "stat", void 0);
|
|
927
|
+
__decorate([property({ type: Number })], AxebowCardResourceRow.prototype, "attentionThreshold", void 0);
|
|
928
|
+
__decorate([property({ type: Boolean })], AxebowCardResourceRow.prototype, "isLast", void 0);
|
|
929
|
+
AxebowCardResourceRow = __decorate([customElement("axebow-card-resource-row")], AxebowCardResourceRow);
|
|
861
930
|
//#endregion
|
|
862
|
-
//#region src/components/cards/parts/
|
|
863
|
-
var
|
|
931
|
+
//#region src/components/cards/parts/axebow-card-resource-table.ts
|
|
932
|
+
var AxebowCardResourceTable = class AxebowCardResourceTable extends LitElement {
|
|
864
933
|
constructor(..._args) {
|
|
865
934
|
super(..._args);
|
|
866
935
|
this.rows = [];
|
|
@@ -891,17 +960,17 @@ var AuroraCardResourceTable = class AuroraCardResourceTable extends LitElement {
|
|
|
891
960
|
const lastVisible = visibleRows[visibleRows.length - 1];
|
|
892
961
|
return html`
|
|
893
962
|
<div>
|
|
894
|
-
<div class="grid grid-cols-[auto_auto_1fr_auto] border-b border-
|
|
963
|
+
<div class="grid grid-cols-[auto_auto_1fr_auto] border-b border-(--axebow-light-gray)">
|
|
895
964
|
${this.rows.map((stat) => html`
|
|
896
|
-
<
|
|
965
|
+
<axebow-card-resource-row
|
|
897
966
|
.stat=${stat}
|
|
898
967
|
.attentionThreshold=${this.attentionThreshold}
|
|
899
968
|
.isLast=${stat === lastVisible}
|
|
900
|
-
></
|
|
969
|
+
></axebow-card-resource-row>
|
|
901
970
|
`)}
|
|
902
971
|
</div>
|
|
903
972
|
|
|
904
|
-
${showWarning ? html`<
|
|
973
|
+
${showWarning ? html`<axebow-card-attention-banner
|
|
905
974
|
.invalidCredentials=${true}
|
|
906
975
|
.isPlainRole=${this.isPlainRole}
|
|
907
976
|
.manageLabel=${this.manageLabel}
|
|
@@ -909,7 +978,7 @@ var AuroraCardResourceTable = class AuroraCardResourceTable extends LitElement {
|
|
|
909
978
|
.invalidCredsLabel=${this.invalidCredsLabel}
|
|
910
979
|
.limitReachedLabel=${this.limitReachedLabel}
|
|
911
980
|
.andLabel=${this.andLabel}
|
|
912
|
-
></
|
|
981
|
+
></axebow-card-attention-banner>` : showAttention ? html`<axebow-card-attention-banner
|
|
913
982
|
.cardType=${this.cardType}
|
|
914
983
|
.tableStats=${this.rows}
|
|
915
984
|
.threshold=${this.attentionThreshold}
|
|
@@ -919,30 +988,30 @@ var AuroraCardResourceTable = class AuroraCardResourceTable extends LitElement {
|
|
|
919
988
|
.invalidCredsLabel=${this.invalidCredsLabel}
|
|
920
989
|
.limitReachedLabel=${this.limitReachedLabel}
|
|
921
990
|
.andLabel=${this.andLabel}
|
|
922
|
-
></
|
|
991
|
+
></axebow-card-attention-banner>` : showAction ? html`<axebow-card-action-banner .label=${this.actionBannerLabel} @action-click=${() => this.dispatchEvent(new CustomEvent("action-click", {
|
|
923
992
|
bubbles: true,
|
|
924
993
|
composed: true
|
|
925
|
-
}))}></
|
|
994
|
+
}))}></axebow-card-action-banner>` : ""}
|
|
926
995
|
</div>
|
|
927
996
|
`;
|
|
928
997
|
}
|
|
929
998
|
};
|
|
930
|
-
__decorate([property({ type: Array })],
|
|
931
|
-
__decorate([property({ type: Number })],
|
|
932
|
-
__decorate([property({ type: String })],
|
|
933
|
-
__decorate([property({ type: Boolean })],
|
|
934
|
-
__decorate([property({ type: Boolean })],
|
|
935
|
-
__decorate([property({ type: Boolean })],
|
|
936
|
-
__decorate([property({ type: String })],
|
|
937
|
-
__decorate([property({ type: String })],
|
|
938
|
-
__decorate([property({ type: String })],
|
|
939
|
-
__decorate([property({ type: String })],
|
|
940
|
-
__decorate([property({ type: String })],
|
|
941
|
-
__decorate([property({ type: String })],
|
|
942
|
-
|
|
999
|
+
__decorate([property({ type: Array })], AxebowCardResourceTable.prototype, "rows", void 0);
|
|
1000
|
+
__decorate([property({ type: Number })], AxebowCardResourceTable.prototype, "attentionThreshold", void 0);
|
|
1001
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "cardType", void 0);
|
|
1002
|
+
__decorate([property({ type: Boolean })], AxebowCardResourceTable.prototype, "isPlainRole", void 0);
|
|
1003
|
+
__decorate([property({ type: Boolean })], AxebowCardResourceTable.prototype, "showActionBanner", void 0);
|
|
1004
|
+
__decorate([property({ type: Boolean })], AxebowCardResourceTable.prototype, "showWarningBanner", void 0);
|
|
1005
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "manageLabel", void 0);
|
|
1006
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "askOwnerLabel", void 0);
|
|
1007
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "invalidCredsLabel", void 0);
|
|
1008
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "limitReachedLabel", void 0);
|
|
1009
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "andLabel", void 0);
|
|
1010
|
+
__decorate([property({ type: String })], AxebowCardResourceTable.prototype, "actionBannerLabel", void 0);
|
|
1011
|
+
AxebowCardResourceTable = __decorate([customElement("axebow-card-resource-table")], AxebowCardResourceTable);
|
|
943
1012
|
//#endregion
|
|
944
|
-
//#region src/components/cards/parts/
|
|
945
|
-
var
|
|
1013
|
+
//#region src/components/cards/parts/axebow-card-status.ts
|
|
1014
|
+
var AxebowCardStatus = class AxebowCardStatus extends LitElement {
|
|
946
1015
|
constructor(..._args) {
|
|
947
1016
|
super(..._args);
|
|
948
1017
|
this.statusCode = "";
|
|
@@ -969,14 +1038,14 @@ var AuroraCardStatus = class AuroraCardStatus extends LitElement {
|
|
|
969
1038
|
`;
|
|
970
1039
|
}
|
|
971
1040
|
};
|
|
972
|
-
__decorate([property({ type: String })],
|
|
973
|
-
__decorate([property({ type: String })],
|
|
974
|
-
__decorate([property({ type: String })],
|
|
975
|
-
__decorate([property({ type: Boolean })],
|
|
976
|
-
|
|
1041
|
+
__decorate([property({ type: String })], AxebowCardStatus.prototype, "statusCode", void 0);
|
|
1042
|
+
__decorate([property({ type: String })], AxebowCardStatus.prototype, "statusMessage", void 0);
|
|
1043
|
+
__decorate([property({ type: String })], AxebowCardStatus.prototype, "borderColor", void 0);
|
|
1044
|
+
__decorate([property({ type: Boolean })], AxebowCardStatus.prototype, "showSpinner", void 0);
|
|
1045
|
+
AxebowCardStatus = __decorate([customElement("axebow-card-status")], AxebowCardStatus);
|
|
977
1046
|
//#endregion
|
|
978
|
-
//#region src/components/cards/parts/
|
|
979
|
-
var
|
|
1047
|
+
//#region src/components/cards/parts/axebow-card-footer.ts
|
|
1048
|
+
var AxebowCardFooter = class AxebowCardFooter extends LitElement {
|
|
980
1049
|
constructor(..._args) {
|
|
981
1050
|
super(..._args);
|
|
982
1051
|
this.isFreeIaaS = false;
|
|
@@ -999,16 +1068,16 @@ var AuroraCardFooter = class AuroraCardFooter extends LitElement {
|
|
|
999
1068
|
const showAction = !showDropdown && !!this.actionLabel;
|
|
1000
1069
|
return html`
|
|
1001
1070
|
<div class="flex justify-between items-center relative h-6 gap-2 text-xs">
|
|
1002
|
-
<
|
|
1071
|
+
<axebow-card-status
|
|
1003
1072
|
.statusCode=${this.statusCode}
|
|
1004
1073
|
.statusMessage=${this.statusMessage}
|
|
1005
1074
|
.borderColor=${this.borderColor}
|
|
1006
1075
|
.showSpinner=${this.showSpinner}
|
|
1007
1076
|
>
|
|
1008
1077
|
<slot></slot>
|
|
1009
|
-
</
|
|
1078
|
+
</axebow-card-status>
|
|
1010
1079
|
${showDropdown ? html`
|
|
1011
|
-
<
|
|
1080
|
+
<axebow-more-actions
|
|
1012
1081
|
class="shrink-0 mr-2"
|
|
1013
1082
|
placement="top"
|
|
1014
1083
|
.open=${this.moreActionsOpen}
|
|
@@ -1016,7 +1085,7 @@ var AuroraCardFooter = class AuroraCardFooter extends LitElement {
|
|
|
1016
1085
|
.closeLabel=${this.closeLabel}
|
|
1017
1086
|
.moreActionsLabel=${this.moreActionsLabel}
|
|
1018
1087
|
@toggled=${this._onToggled}
|
|
1019
|
-
></
|
|
1088
|
+
></axebow-more-actions>
|
|
1020
1089
|
` : showAction ? html`<axebow-button variant="text" size="medium" @click=${this._onAction}>${this.actionLabel}</axebow-button>` : ""}
|
|
1021
1090
|
</div>
|
|
1022
1091
|
`;
|
|
@@ -1035,21 +1104,21 @@ var AuroraCardFooter = class AuroraCardFooter extends LitElement {
|
|
|
1035
1104
|
}));
|
|
1036
1105
|
}
|
|
1037
1106
|
};
|
|
1038
|
-
__decorate([property({ type: Boolean })],
|
|
1039
|
-
__decorate([property({ type: Boolean })],
|
|
1040
|
-
__decorate([property({ type: String })],
|
|
1041
|
-
__decorate([property({ type: String })],
|
|
1042
|
-
__decorate([property({ type: String })],
|
|
1043
|
-
__decorate([property({ type: Boolean })],
|
|
1044
|
-
__decorate([property({ type: Boolean })],
|
|
1045
|
-
__decorate([property({ type: Array })],
|
|
1046
|
-
__decorate([property({ type: String })],
|
|
1047
|
-
__decorate([property({ type: String })],
|
|
1048
|
-
__decorate([property({ type: String })],
|
|
1049
|
-
|
|
1107
|
+
__decorate([property({ type: Boolean })], AxebowCardFooter.prototype, "isFreeIaaS", void 0);
|
|
1108
|
+
__decorate([property({ type: Boolean })], AxebowCardFooter.prototype, "isPlainRole", void 0);
|
|
1109
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "statusCode", void 0);
|
|
1110
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "statusMessage", void 0);
|
|
1111
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "borderColor", void 0);
|
|
1112
|
+
__decorate([property({ type: Boolean })], AxebowCardFooter.prototype, "showSpinner", void 0);
|
|
1113
|
+
__decorate([property({ type: Boolean })], AxebowCardFooter.prototype, "moreActionsOpen", void 0);
|
|
1114
|
+
__decorate([property({ type: Array })], AxebowCardFooter.prototype, "moreActionsOptions", void 0);
|
|
1115
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "closeLabel", void 0);
|
|
1116
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "moreActionsLabel", void 0);
|
|
1117
|
+
__decorate([property({ type: String })], AxebowCardFooter.prototype, "actionLabel", void 0);
|
|
1118
|
+
AxebowCardFooter = __decorate([customElement("axebow-card-footer")], AxebowCardFooter);
|
|
1050
1119
|
//#endregion
|
|
1051
|
-
//#region src/components/cards/
|
|
1052
|
-
var
|
|
1120
|
+
//#region src/components/cards/axebow-base-card.ts
|
|
1121
|
+
var AxebowBaseCard = class AxebowBaseCard extends LitElement {
|
|
1053
1122
|
constructor(..._args) {
|
|
1054
1123
|
super(..._args);
|
|
1055
1124
|
this.cardType = "account";
|
|
@@ -1101,6 +1170,9 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1101
1170
|
this.freeIaasDesc = "This environment uses free infrastructure.";
|
|
1102
1171
|
this.haLabel = "Highly Available";
|
|
1103
1172
|
this.haTitle = "High Availability enabled";
|
|
1173
|
+
this.role = "";
|
|
1174
|
+
this.roleTooltips = {};
|
|
1175
|
+
this.roleTooltipColor = "var(--axebow-primary)";
|
|
1104
1176
|
}
|
|
1105
1177
|
static {
|
|
1106
1178
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
@@ -1126,12 +1198,12 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1126
1198
|
const isRuntime = this.cardType === "runtime";
|
|
1127
1199
|
return html`
|
|
1128
1200
|
<div
|
|
1129
|
-
class="w-full h-full bg-
|
|
1201
|
+
class="w-full h-full bg-(--axebow-white) rounded-lg px-2 pt-2 pb-4 flex flex-col justify-between gap-2 box-border ${isRuntime ? "border-t-4" : ""} transition-shadow duration-200 ease-in-out hover:shadow-[0_4px_12px_0_rgba(13,24,33,0.08)] ${this.isDeleting ? "pointer-events-none cursor-not-allowed grayscale" : ""}"
|
|
1130
1202
|
style=${isRuntime ? `border-top-color:${this.borderColor};` : ""}
|
|
1131
1203
|
?inert=${this.isDeleting}
|
|
1132
1204
|
>
|
|
1133
1205
|
<div class="flex flex-col gap-2">
|
|
1134
|
-
<
|
|
1206
|
+
<axebow-card-header
|
|
1135
1207
|
.cardType=${this.cardType}
|
|
1136
1208
|
.logoSrc=${this.logoSrc}
|
|
1137
1209
|
.tenantOrAccount=${this.tenantOrAccount}
|
|
@@ -1145,6 +1217,9 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1145
1217
|
.freeIaasDesc=${this.freeIaasDesc}
|
|
1146
1218
|
.haLabel=${this.haLabel}
|
|
1147
1219
|
.haTitle=${this.haTitle}
|
|
1220
|
+
.role=${this.role}
|
|
1221
|
+
.roleTooltips=${this.roleTooltips}
|
|
1222
|
+
.roleTooltipColor=${this.roleTooltipColor}
|
|
1148
1223
|
@revision-change=${(e) => this.dispatchEvent(new CustomEvent("revision-change", {
|
|
1149
1224
|
detail: e.detail,
|
|
1150
1225
|
bubbles: true,
|
|
@@ -1152,16 +1227,16 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1152
1227
|
}))}
|
|
1153
1228
|
>
|
|
1154
1229
|
<slot slot="subtitle-tooltip" name="subtitle-tooltip"></slot>
|
|
1155
|
-
</
|
|
1230
|
+
</axebow-card-header>
|
|
1156
1231
|
|
|
1157
1232
|
<div class="w-full px-2 flex flex-col gap-2">
|
|
1158
1233
|
${isRuntime ? html`
|
|
1159
1234
|
<div class="flex flex-row justify-between items-center min-h-10 max-h-10 overflow-hidden">
|
|
1160
|
-
<span class="deploy-time text-
|
|
1161
|
-
${this.isDeployed ? html`<span class="text-
|
|
1235
|
+
<span class="deploy-time text-(--axebow-secondary)"><slot name="time-elapsed"></slot></span>
|
|
1236
|
+
${this.isDeployed ? html`<span class="text-(--axebow-secondary) border-2 border-(--axebow-secondary) rounded-lg py-0.5 px-1.5 whitespace-nowrap text-xs">${this.deployedLabel}</span>` : ""}
|
|
1162
1237
|
</div>
|
|
1163
1238
|
` : html`
|
|
1164
|
-
<
|
|
1239
|
+
<axebow-card-stats-row
|
|
1165
1240
|
.stats=${this.mainStats}
|
|
1166
1241
|
.compact=${this.compact}
|
|
1167
1242
|
@stat-label-click=${(e) => !this.isDeleting && this.dispatchEvent(new CustomEvent("stat-label-click", {
|
|
@@ -1169,12 +1244,12 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1169
1244
|
bubbles: true,
|
|
1170
1245
|
composed: true
|
|
1171
1246
|
}))}
|
|
1172
|
-
></
|
|
1247
|
+
></axebow-card-stats-row>
|
|
1173
1248
|
`}
|
|
1174
1249
|
|
|
1175
|
-
<div class="w-full h-full border border-
|
|
1250
|
+
<div class="w-full h-full border border-(--axebow-light-gray) rounded-md">
|
|
1176
1251
|
${isRuntime ? html`
|
|
1177
|
-
<
|
|
1252
|
+
<axebow-card-table-header
|
|
1178
1253
|
.opened=${this.filterOpened}
|
|
1179
1254
|
.filterDisplayText=${this.filterDisplayText}
|
|
1180
1255
|
.allLabel=${this.allLabel}
|
|
@@ -1190,9 +1265,9 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1190
1265
|
bubbles: true,
|
|
1191
1266
|
composed: true
|
|
1192
1267
|
}))}
|
|
1193
|
-
></
|
|
1268
|
+
></axebow-card-table-header>
|
|
1194
1269
|
` : html`
|
|
1195
|
-
<
|
|
1270
|
+
<axebow-card-filter
|
|
1196
1271
|
.items=${this.filterItems}
|
|
1197
1272
|
.selected=${this.selected}
|
|
1198
1273
|
.emptyLabel=${this.emptyLabel}
|
|
@@ -1215,10 +1290,10 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1215
1290
|
bubbles: true,
|
|
1216
1291
|
composed: true
|
|
1217
1292
|
}))}
|
|
1218
|
-
></
|
|
1293
|
+
></axebow-card-filter>
|
|
1219
1294
|
`}
|
|
1220
1295
|
|
|
1221
|
-
<
|
|
1296
|
+
<axebow-card-resource-table
|
|
1222
1297
|
.rows=${this.tableStats}
|
|
1223
1298
|
.attentionThreshold=${this.attentionThreshold}
|
|
1224
1299
|
.cardType=${this.cardType}
|
|
@@ -1239,14 +1314,14 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1239
1314
|
bubbles: true,
|
|
1240
1315
|
composed: true
|
|
1241
1316
|
}))}
|
|
1242
|
-
></
|
|
1317
|
+
></axebow-card-resource-table>
|
|
1243
1318
|
</div>
|
|
1244
1319
|
|
|
1245
1320
|
<slot name="extra-features"></slot>
|
|
1246
1321
|
</div>
|
|
1247
1322
|
</div>
|
|
1248
1323
|
|
|
1249
|
-
<
|
|
1324
|
+
<axebow-card-footer
|
|
1250
1325
|
class="mb-1 pl-2"
|
|
1251
1326
|
.isFreeIaaS=${this.isFreeIaaS}
|
|
1252
1327
|
.isPlainRole=${this.isPlainRole}
|
|
@@ -1270,7 +1345,7 @@ var AuroraBaseCard = class AuroraBaseCard extends LitElement {
|
|
|
1270
1345
|
}))}
|
|
1271
1346
|
>
|
|
1272
1347
|
<slot name="status-footer"></slot>
|
|
1273
|
-
</
|
|
1348
|
+
</axebow-card-footer>
|
|
1274
1349
|
|
|
1275
1350
|
<slot name="dialogs"></slot>
|
|
1276
1351
|
</div>
|
|
@@ -1281,57 +1356,60 @@ __decorate([property({
|
|
|
1281
1356
|
type: String,
|
|
1282
1357
|
reflect: true,
|
|
1283
1358
|
attribute: "card-type"
|
|
1284
|
-
})],
|
|
1285
|
-
__decorate([property({ type: String })],
|
|
1286
|
-
__decorate([property({ type: String })],
|
|
1287
|
-
__decorate([property({ type: String })],
|
|
1288
|
-
__decorate([property({ type: String })],
|
|
1289
|
-
__decorate([property({ type: String })],
|
|
1290
|
-
__decorate([property({ type: Array })],
|
|
1291
|
-
__decorate([property({ type: Boolean })],
|
|
1292
|
-
__decorate([property({ type: Array })],
|
|
1293
|
-
__decorate([property({ type: Number })],
|
|
1294
|
-
__decorate([property({ type: Array })],
|
|
1295
|
-
__decorate([property({ type: String })],
|
|
1296
|
-
__decorate([property({ type: Boolean })],
|
|
1297
|
-
__decorate([property({ type: String })],
|
|
1298
|
-
__decorate([property({ type: String })],
|
|
1299
|
-
__decorate([property({ type: String })],
|
|
1300
|
-
__decorate([property({ type: Boolean })],
|
|
1301
|
-
__decorate([property({ type: Boolean })],
|
|
1302
|
-
__decorate([property({ type: Boolean })],
|
|
1303
|
-
__decorate([property({ type: Boolean })],
|
|
1304
|
-
__decorate([property({ type: Array })],
|
|
1305
|
-
__decorate([property({ type: String })],
|
|
1306
|
-
__decorate([property({ type: Boolean })],
|
|
1307
|
-
__decorate([property({ type: String })],
|
|
1308
|
-
__decorate([property({ type: Array })],
|
|
1309
|
-
__decorate([property({ type: String })],
|
|
1310
|
-
__decorate([property({ type: String })],
|
|
1311
|
-
__decorate([property({ type: String })],
|
|
1312
|
-
__decorate([property({ type: String })],
|
|
1313
|
-
__decorate([property({ type: String })],
|
|
1314
|
-
__decorate([property({ type: String })],
|
|
1315
|
-
__decorate([property({ type: Boolean })],
|
|
1316
|
-
__decorate([property({ type: Boolean })],
|
|
1317
|
-
__decorate([property({ type: String })],
|
|
1318
|
-
__decorate([property({ type: String })],
|
|
1319
|
-
__decorate([property({ type: String })],
|
|
1320
|
-
__decorate([property({ type: String })],
|
|
1321
|
-
__decorate([property({ type: String })],
|
|
1322
|
-
__decorate([property({ type: String })],
|
|
1323
|
-
__decorate([property({ type: Boolean })],
|
|
1324
|
-
__decorate([property({ type: Array })],
|
|
1325
|
-
__decorate([property({ type: Boolean })],
|
|
1326
|
-
__decorate([property({ type: String })],
|
|
1327
|
-
__decorate([property({ type: String })],
|
|
1328
|
-
__decorate([property({ type: String })],
|
|
1329
|
-
__decorate([property({ type: String })],
|
|
1330
|
-
__decorate([property({ type: String })],
|
|
1331
|
-
__decorate([property({ type: String })],
|
|
1332
|
-
__decorate([property({ type: String })],
|
|
1333
|
-
|
|
1359
|
+
})], AxebowBaseCard.prototype, "cardType", void 0);
|
|
1360
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "name", void 0);
|
|
1361
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "logoSrc", void 0);
|
|
1362
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "tenantOrAccount", void 0);
|
|
1363
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "badge", void 0);
|
|
1364
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "subtitle", void 0);
|
|
1365
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "mainStats", void 0);
|
|
1366
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "compact", void 0);
|
|
1367
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "tableStats", void 0);
|
|
1368
|
+
__decorate([property({ type: Number })], AxebowBaseCard.prototype, "attentionThreshold", void 0);
|
|
1369
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "filterItems", void 0);
|
|
1370
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "selected", void 0);
|
|
1371
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "filterOpened", void 0);
|
|
1372
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "emptyLabel", void 0);
|
|
1373
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "emptyActionLabel", void 0);
|
|
1374
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "attentionLabel", void 0);
|
|
1375
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "showAttention", void 0);
|
|
1376
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "isPlainRole", void 0);
|
|
1377
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "isDeleting", void 0);
|
|
1378
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "isDisabled", void 0);
|
|
1379
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "revisions", void 0);
|
|
1380
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "displayedRevision", void 0);
|
|
1381
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "isDeployed", void 0);
|
|
1382
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "deployedLabel", void 0);
|
|
1383
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "filterRoles", void 0);
|
|
1384
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "filterDisplayText", void 0);
|
|
1385
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "allLabel", void 0);
|
|
1386
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "borderColor", void 0);
|
|
1387
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "statusCode", void 0);
|
|
1388
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "statusMessage", void 0);
|
|
1389
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "serviceDetailLabel", void 0);
|
|
1390
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "showActionBanner", void 0);
|
|
1391
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "showWarningBanner", void 0);
|
|
1392
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "manageLabel", void 0);
|
|
1393
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "askOwnerLabel", void 0);
|
|
1394
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "invalidCredsLabel", void 0);
|
|
1395
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "limitReachedLabel", void 0);
|
|
1396
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "andLabel", void 0);
|
|
1397
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "actionBannerLabel", void 0);
|
|
1398
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "moreActionsOpen", void 0);
|
|
1399
|
+
__decorate([property({ type: Array })], AxebowBaseCard.prototype, "moreActionsOptions", void 0);
|
|
1400
|
+
__decorate([property({ type: Boolean })], AxebowBaseCard.prototype, "isFreeIaaS", void 0);
|
|
1401
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "closeLabel", void 0);
|
|
1402
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "moreActionsLabel", void 0);
|
|
1403
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "freeIaasLabel", void 0);
|
|
1404
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "freeIaasTitle", void 0);
|
|
1405
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "freeIaasDesc", void 0);
|
|
1406
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "haLabel", void 0);
|
|
1407
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "haTitle", void 0);
|
|
1408
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "role", void 0);
|
|
1409
|
+
__decorate([property({ type: Object })], AxebowBaseCard.prototype, "roleTooltips", void 0);
|
|
1410
|
+
__decorate([property({ type: String })], AxebowBaseCard.prototype, "roleTooltipColor", void 0);
|
|
1411
|
+
AxebowBaseCard = __decorate([customElement("axebow-base-card")], AxebowBaseCard);
|
|
1334
1412
|
//#endregion
|
|
1335
|
-
export {
|
|
1413
|
+
export { AxebowBaseCard, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowIcon, AxebowMoreActions, AxebowRoleTooltip, STATUS_COLORS, axebowTheme };
|
|
1336
1414
|
|
|
1337
1415
|
//# sourceMappingURL=index.js.map
|