@kumori/aurora-wui-components 0.0.273-dev4131.3 → 0.0.273-dev4131.31
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-actions-footer/axebow-actions-footer.d.ts.map +1 -1
- package/dist/components/axebow-box-form/axebow-box-form.d.ts +5 -1
- package/dist/components/axebow-box-form/axebow-box-form.d.ts.map +1 -1
- package/dist/components/axebow-collaborators-dialog/axebow-collaborators-dialog.d.ts.map +1 -1
- package/dist/components/axebow-deploy-summary/axebow-deploy-summary.d.ts.map +1 -1
- package/dist/components/axebow-divider/axebow-divider.d.ts +17 -0
- package/dist/components/axebow-divider/axebow-divider.d.ts.map +1 -0
- package/dist/components/axebow-empty-state/axebow-empty-state.d.ts +11 -0
- package/dist/components/axebow-empty-state/axebow-empty-state.d.ts.map +1 -0
- package/dist/components/axebow-expandable-header/axebow-expandable-header.d.ts.map +1 -1
- package/dist/components/axebow-form-panel-field/axebow-form-panel-field.d.ts +5 -0
- package/dist/components/axebow-form-panel-field/axebow-form-panel-field.d.ts.map +1 -1
- package/dist/components/axebow-getting-started-card/axebow-getting-started-card.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-input-base.d.ts +2 -0
- package/dist/components/axebow-input/axebow-input-base.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-input.d.ts +2 -0
- package/dist/components/axebow-input/axebow-input.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-providers-input.d.ts +1 -0
- package/dist/components/axebow-input/axebow-providers-input.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-switch-input.d.ts +1 -0
- package/dist/components/axebow-input/axebow-switch-input.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-text-input.d.ts.map +1 -1
- package/dist/components/axebow-manage-hyperlinks/axebow-manage-hyperlinks.d.ts +1 -0
- package/dist/components/axebow-manage-hyperlinks/axebow-manage-hyperlinks.d.ts.map +1 -1
- package/dist/components/axebow-mesh-node-renderer/axebow-mesh-node-renderer.d.ts +0 -9
- package/dist/components/axebow-mesh-node-renderer/axebow-mesh-node-renderer.d.ts.map +1 -1
- package/dist/components/axebow-modals-confirmation/axebow-modals-confirmation.d.ts.map +1 -1
- package/dist/components/axebow-observability-container/axebow-observability-container.d.ts.map +1 -1
- package/dist/components/axebow-pill/axebow-pill.d.ts +4 -4
- package/dist/components/axebow-pill/axebow-pill.d.ts.map +1 -1
- package/dist/components/axebow-refresh-period-panel/axebow-refresh-period-panel.d.ts.map +1 -1
- package/dist/components/axebow-registry-selector/axebow-registry-selector.d.ts.map +1 -1
- package/dist/components/axebow-resource-limits/axebow-resource-limits-panel.d.ts.map +1 -1
- package/dist/components/axebow-resource-limits/axebow-resource-limits.models.d.ts +1 -0
- package/dist/components/axebow-resource-limits/axebow-resource-limits.models.d.ts.map +1 -1
- package/dist/components/axebow-resource-limits/parts/axebow-resource-limit-input.d.ts.map +1 -1
- package/dist/components/axebow-role-card/axebow-role-card.d.ts.map +1 -1
- package/dist/components/axebow-runtime-zip-dialog/axebow-runtime-zip-dialog.d.ts.map +1 -1
- package/dist/components/axebow-selector-card/axebow-selector-card.d.ts +15 -0
- package/dist/components/axebow-selector-card/axebow-selector-card.d.ts.map +1 -0
- package/dist/components/axebow-sidebar/axebow-sidebar.d.ts.map +1 -1
- package/dist/components/axebow-status/axebow-status.d.ts +3 -0
- package/dist/components/axebow-status/axebow-status.d.ts.map +1 -1
- package/dist/components/axebow-summary/axebow-summary-card.d.ts.map +1 -1
- package/dist/components/axebow-summary/axebow-summary-flavors.d.ts +0 -3
- package/dist/components/axebow-summary/axebow-summary-flavors.d.ts.map +1 -1
- package/dist/components/axebow-summary/axebow-summary-limits.d.ts +1 -0
- package/dist/components/axebow-summary/axebow-summary-limits.d.ts.map +1 -1
- package/dist/components/axebow-summary/axebow-summary-step-header.d.ts +1 -0
- package/dist/components/axebow-summary/axebow-summary-step-header.d.ts.map +1 -1
- package/dist/components/axebow-summary/axebow-summary-step.d.ts +1 -0
- package/dist/components/axebow-summary/axebow-summary-step.d.ts.map +1 -1
- package/dist/components/axebow-tabs-submenu/axebow-tabs-submenu.d.ts +2 -2
- package/dist/components/axebow-tenant-card/axebow-tenant-card.d.ts.map +1 -1
- package/dist/components/axebow-tenant-resource-table/axebow-tenant-resource-table.d.ts.map +1 -1
- package/dist/components/axebow-usage-tooltip/axebow-usage-tooltip.d.ts.map +1 -1
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +700 -336
- package/dist/index.js.map +1 -1
- package/dist/playground/schemas/axebow-divider.schema.d.ts +9 -0
- package/dist/playground/schemas/axebow-divider.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-empty-state.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-empty-state.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-input.schema.d.ts.map +1 -1
- package/dist/playground/schemas/axebow-manage-hyperlinks.schema.d.ts.map +1 -1
- package/dist/playground/schemas/axebow-selector-card.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-selector-card.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-tenant-resource-table.schema.d.ts.map +1 -1
- package/dist/playground/schemas/axebow-text-input.schema.d.ts.map +1 -1
- package/dist/styles/axebow-theme.d.ts.map +1 -1
- package/dist/styles/shoelace-style.css +24 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -11,7 +11,6 @@ import "@shoelace-style/shoelace/dist/components/switch/switch.js";
|
|
|
11
11
|
import "@shoelace-style/shoelace/dist/components/tab-group/tab-group.js";
|
|
12
12
|
import "@shoelace-style/shoelace/dist/components/tab/tab.js";
|
|
13
13
|
import "@shoelace-style/shoelace/dist/components/tab-panel/tab-panel.js";
|
|
14
|
-
import "@shoelace-style/shoelace/dist/components/divider/divider.js";
|
|
15
14
|
import { live } from "lit/directives/live.js";
|
|
16
15
|
import "@shoelace-style/shoelace/dist/components/checkbox/checkbox.js";
|
|
17
16
|
import "@shoelace-style/shoelace/dist/components/carousel/carousel.js";
|
|
@@ -84,12 +83,31 @@ var axebowTheme = css`
|
|
|
84
83
|
border-color: var(--axebow-tertiary);
|
|
85
84
|
}
|
|
86
85
|
|
|
87
|
-
/** Axebow select and
|
|
86
|
+
/** Axebow select, input and textarea global focus */
|
|
87
|
+
sl-input,
|
|
88
|
+
sl-select,
|
|
89
|
+
sl-textarea {
|
|
90
|
+
--sl-input-border-color-focus: var(--axebow-black, #000000);
|
|
91
|
+
--sl-input-focus-ring-color: transparent;
|
|
92
|
+
--sl-focus-ring-color: transparent;
|
|
93
|
+
--sl-focus-ring-style: none;
|
|
94
|
+
--sl-focus-ring-width: 0;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
sl-input::part(base),
|
|
98
|
+
sl-select::part(combobox),
|
|
99
|
+
sl-textarea::part(base) {
|
|
100
|
+
--sl-input-focus-ring-color: transparent;
|
|
101
|
+
--sl-input-border-color-focus: var(--axebow-black, #000000);
|
|
102
|
+
}
|
|
103
|
+
|
|
88
104
|
sl-input:focus-within::part(base),
|
|
89
|
-
sl-select:focus-within::part(combobox)
|
|
90
|
-
|
|
105
|
+
sl-select:focus-within::part(combobox),
|
|
106
|
+
sl-textarea:focus-within::part(base) {
|
|
107
|
+
border-color: var(--axebow-black, #000000) !important;
|
|
91
108
|
border-width: 1px !important;
|
|
92
109
|
box-shadow: none !important;
|
|
110
|
+
outline: none !important;
|
|
93
111
|
}
|
|
94
112
|
sl-select sl-option:hover::part(base) {
|
|
95
113
|
background-color: #e9ecef;
|
|
@@ -198,7 +216,7 @@ var STATUS_COLORS = {
|
|
|
198
216
|
};
|
|
199
217
|
//#endregion
|
|
200
218
|
//#region src/styles/tailwind.css?inline
|
|
201
|
-
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-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\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-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: 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-outline-style: solid;\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 --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: \"Open Sans\", sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-50: oklch(97.1% .013 17.38);\n --color-red-100: oklch(93.6% .032 17.717);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-800: oklch(44.4% .177 26.899);\n --color-yellow-600: oklch(68.1% .162 75.834);\n --color-yellow-800: oklch(47.6% .114 61.907);\n --color-green-50: oklch(98.2% .018 155.826);\n --color-green-200: oklch(92.5% .084 155.995);\n --color-green-600: oklch(62.7% .194 149.214);\n --color-green-800: oklch(44.8% .119 151.328);\n --color-sky-50: oklch(97.7% .013 236.62);\n --color-sky-100: oklch(95.1% .026 236.824);\n --color-blue-50: oklch(97% .014 254.604);\n --color-blue-100: oklch(93.2% .032 255.585);\n --color-blue-200: oklch(88.2% .059 254.128);\n --color-blue-500: oklch(62.3% .214 259.815);\n --color-blue-600: oklch(54.6% .245 262.881);\n --color-blue-800: oklch(42.4% .199 265.638);\n --color-gray-50: oklch(98.5% .002 247.839);\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-gray-200: oklch(92.8% .006 264.531);\n --color-gray-300: oklch(87.2% .01 258.338);\n --color-gray-400: oklch(70.7% .022 261.325);\n --color-gray-500: oklch(55.1% .027 264.364);\n --color-gray-600: oklch(44.6% .03 256.802);\n --color-gray-700: oklch(37.3% .034 259.733);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-3xl: 1.875rem;\n --text-5xl: 3rem;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-black: 900;\n --tracking-wider: .05em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-relaxed: 1.625;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --ease-out: cubic-bezier(0, 0, .2, 1);\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 --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --spacing-18: 4.5rem;\n --spacing-30: 7.5rem;\n --spacing-38: 9.5rem;\n --spacing-43: 10.75rem;\n --spacing-50: 12.5rem;\n --spacing-75: 18.75rem;\n --spacing-117: 29.25rem;\n --spacing-120: 30rem;\n --spacing-150: 37.5rem;\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-auto {\n pointer-events: auto;\n }\n\n .pointer-events-none {\n pointer-events: none;\n }\n\n .visible {\n visibility: visible;\n }\n\n .absolute {\n position: absolute;\n }\n\n .fixed {\n position: fixed;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .-top-2\\.25 {\n top: calc(var(--spacing) * -2.25);\n }\n\n .top-0 {\n top: 0;\n }\n\n .top-1 {\n top: var(--spacing);\n }\n\n .top-1\\/2 {\n top: 50%;\n }\n\n .top-3 {\n top: calc(var(--spacing) * 3);\n }\n\n .top-25 {\n top: calc(var(--spacing) * 25);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-full {\n top: 100%;\n }\n\n .-right-2\\.25 {\n right: calc(var(--spacing) * -2.25);\n }\n\n .right-0 {\n right: 0;\n }\n\n .right-0\\.5 {\n right: calc(var(--spacing) * .5);\n }\n\n .right-1 {\n right: var(--spacing);\n }\n\n .right-1\\.5 {\n right: calc(var(--spacing) * 1.5);\n }\n\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n\n .right-\\[calc\\(100\\%\\+10px\\)\\] {\n right: calc(100% + 10px);\n }\n\n .bottom-0 {\n bottom: 0;\n }\n\n .bottom-0\\.5 {\n bottom: calc(var(--spacing) * .5);\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .left-1\\/2 {\n left: 50%;\n }\n\n .left-\\[-7px\\] {\n left: -7px;\n }\n\n .left-\\[calc\\(100\\%\\+10px\\)\\] {\n left: calc(100% + 10px);\n }\n\n .left-full {\n left: 100%;\n }\n\n .z-5 {\n z-index: 5;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-2000 {\n z-index: 2000;\n }\n\n .z-2001 {\n z-index: 2001;\n }\n\n .z-9999 {\n z-index: 9999;\n }\n\n .row-1 {\n grid-row: 1;\n }\n\n .container {\n width: 100%;\n }\n\n @media (min-width: 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n\n @media (min-width: 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n\n @media (min-width: 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n\n @media (min-width: 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n\n @media (min-width: 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mx-2 {\n margin-inline: calc(var(--spacing) * 2);\n }\n\n .mx-6 {\n margin-inline: calc(var(--spacing) * 6);\n }\n\n .mx-12 {\n margin-inline: calc(var(--spacing) * 12);\n }\n\n .mx-auto {\n margin-inline: auto;\n }\n\n .my-0\\.5 {\n margin-block: calc(var(--spacing) * .5);\n }\n\n .my-1\\.5 {\n margin-block: calc(var(--spacing) * 1.5);\n }\n\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n\n .my-4 {\n margin-block: calc(var(--spacing) * 4);\n }\n\n .ms-auto {\n margin-inline-start: auto;\n }\n\n .mt-0 {\n margin-top: 0;\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-1\\.75 {\n margin-top: calc(var(--spacing) * 1.75);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mt-2\\.25 {\n margin-top: calc(var(--spacing) * 2.25);\n }\n\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n\n .mt-4\\.5 {\n margin-top: calc(var(--spacing) * 4.5);\n }\n\n .mt-5 {\n margin-top: calc(var(--spacing) * 5);\n }\n\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n\n .mt-6\\.75 {\n margin-top: calc(var(--spacing) * 6.75);\n }\n\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n\n .mr-0\\.5 {\n margin-right: calc(var(--spacing) * .5);\n }\n\n .mr-1 {\n margin-right: var(--spacing);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mr-4 {\n margin-right: calc(var(--spacing) * 4);\n }\n\n .mr-8 {\n margin-right: calc(var(--spacing) * 8);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n }\n\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n\n .mb-6\\.5 {\n margin-bottom: calc(var(--spacing) * 6.5);\n }\n\n .mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n }\n\n .ml-1 {\n margin-left: var(--spacing);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n\n .ml-12 {\n margin-left: calc(var(--spacing) * 12);\n }\n\n .ml-\\[0\\.5rem\\] {\n margin-left: .5rem;\n }\n\n .ml-\\[1\\.265625rem\\] {\n margin-left: 1.26563rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .box-content {\n box-sizing: content-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 .line-clamp-2 {\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-11 {\n -webkit-line-clamp: 11;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .block {\n display: block;\n }\n\n .contents {\n display: contents;\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 {\n display: inline;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .table {\n display: table;\n }\n\n .aspect-square {\n aspect-ratio: 1;\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-2\\.25 {\n height: calc(var(--spacing) * 2.25);\n }\n\n .h-2\\.75 {\n height: calc(var(--spacing) * 2.75);\n }\n\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-4\\.5 {\n height: calc(var(--spacing) * 4.5);\n }\n\n .h-4\\.25 {\n height: calc(var(--spacing) * 4.25);\n }\n\n .h-4\\.75 {\n height: calc(var(--spacing) * 4.75);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-5\\.5 {\n height: calc(var(--spacing) * 5.5);\n }\n\n .h-5\\.25 {\n height: calc(var(--spacing) * 5.25);\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-7\\.5 {\n height: calc(var(--spacing) * 7.5);\n }\n\n .h-7\\.25 {\n height: calc(var(--spacing) * 7.25);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-8\\.5 {\n height: calc(var(--spacing) * 8.5);\n }\n\n .h-8\\.75 {\n height: calc(var(--spacing) * 8.75);\n }\n\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n\n .h-9\\.5 {\n height: calc(var(--spacing) * 9.5);\n }\n\n .h-9\\.75 {\n height: calc(var(--spacing) * 9.75);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-10\\.5 {\n height: calc(var(--spacing) * 10.5);\n }\n\n .h-10\\.25 {\n height: calc(var(--spacing) * 10.25);\n }\n\n .h-11 {\n height: calc(var(--spacing) * 11);\n }\n\n .h-11\\.5 {\n height: calc(var(--spacing) * 11.5);\n }\n\n .h-11\\.25 {\n height: calc(var(--spacing) * 11.25);\n }\n\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n\n .h-12\\.5 {\n height: calc(var(--spacing) * 12.5);\n }\n\n .h-12\\.25 {\n height: calc(var(--spacing) * 12.25);\n }\n\n .h-12\\.75 {\n height: calc(var(--spacing) * 12.75);\n }\n\n .h-14 {\n height: calc(var(--spacing) * 14);\n }\n\n .h-14\\.25 {\n height: calc(var(--spacing) * 14.25);\n }\n\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n\n .h-17\\.75 {\n height: calc(var(--spacing) * 17.75);\n }\n\n .h-19\\.75 {\n height: calc(var(--spacing) * 19.75);\n }\n\n .h-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-20\\.75 {\n height: calc(var(--spacing) * 20.75);\n }\n\n .h-21\\.25 {\n height: calc(var(--spacing) * 21.25);\n }\n\n .h-22\\.75 {\n height: calc(var(--spacing) * 22.75);\n }\n\n .h-24\\.75 {\n height: calc(var(--spacing) * 24.75);\n }\n\n .h-32\\.75 {\n height: calc(var(--spacing) * 32.75);\n }\n\n .h-49\\.5 {\n height: calc(var(--spacing) * 49.5);\n }\n\n .h-52\\.75 {\n height: calc(var(--spacing) * 52.75);\n }\n\n .h-57\\.5 {\n height: calc(var(--spacing) * 57.5);\n }\n\n .h-77\\.25 {\n height: calc(var(--spacing) * 77.25);\n }\n\n .h-79 {\n height: calc(var(--spacing) * 79);\n }\n\n .h-83\\.25 {\n height: calc(var(--spacing) * 83.25);\n }\n\n .h-89\\.25 {\n height: calc(var(--spacing) * 89.25);\n }\n\n .h-112 {\n height: calc(var(--spacing) * 112);\n }\n\n .h-\\[8\\.26375rem\\] {\n height: 8.26375rem;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-fit {\n height: fit-content;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-px {\n height: 1px;\n }\n\n .h-screen {\n height: 100vh;\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-48 {\n max-height: calc(var(--spacing) * 48);\n }\n\n .max-h-75 {\n max-height: var(--spacing-75);\n }\n\n .max-h-\\[40vh\\] {\n max-height: 40vh;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-0 {\n min-height: 0;\n }\n\n .min-h-5 {\n min-height: calc(var(--spacing) * 5);\n }\n\n .min-h-9 {\n min-height: calc(var(--spacing) * 9);\n }\n\n .min-h-10 {\n min-height: calc(var(--spacing) * 10);\n }\n\n .min-h-12 {\n min-height: calc(var(--spacing) * 12);\n }\n\n .min-h-35 {\n min-height: calc(var(--spacing) * 35);\n }\n\n .min-h-102\\.5 {\n min-height: calc(var(--spacing) * 102.5);\n }\n\n .min-h-107\\.5 {\n min-height: calc(var(--spacing) * 107.5);\n }\n\n .min-h-113\\.25 {\n min-height: calc(var(--spacing) * 113.25);\n }\n\n .w-1\\.75 {\n width: calc(var(--spacing) * 1.75);\n }\n\n .w-1\\/3 {\n width: 33.3333%;\n }\n\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-4\\.5 {\n width: calc(var(--spacing) * 4.5);\n }\n\n .w-4\\.25 {\n width: calc(var(--spacing) * 4.25);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n\n .w-7 {\n width: calc(var(--spacing) * 7);\n }\n\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n\n .w-9\\.5 {\n width: calc(var(--spacing) * 9.5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-10\\.5 {\n width: calc(var(--spacing) * 10.5);\n }\n\n .w-11\\.5 {\n width: calc(var(--spacing) * 11.5);\n }\n\n .w-11\\.25 {\n width: calc(var(--spacing) * 11.25);\n }\n\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n\n .w-12\\.5 {\n width: calc(var(--spacing) * 12.5);\n }\n\n .w-12\\.75 {\n width: calc(var(--spacing) * 12.75);\n }\n\n .w-15\\.25 {\n width: calc(var(--spacing) * 15.25);\n }\n\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n\n .w-16\\.5 {\n width: calc(var(--spacing) * 16.5);\n }\n\n .w-17 {\n width: calc(var(--spacing) * 17);\n }\n\n .w-18 {\n width: var(--spacing-18);\n }\n\n .w-18\\.5 {\n width: calc(var(--spacing) * 18.5);\n }\n\n .w-18\\.75 {\n width: calc(var(--spacing) * 18.75);\n }\n\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n\n .w-20\\.5 {\n width: calc(var(--spacing) * 20.5);\n }\n\n .w-21\\.5 {\n width: calc(var(--spacing) * 21.5);\n }\n\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n\n .w-24\\.75 {\n width: calc(var(--spacing) * 24.75);\n }\n\n .w-25 {\n width: calc(var(--spacing) * 25);\n }\n\n .w-25\\.5 {\n width: calc(var(--spacing) * 25.5);\n }\n\n .w-25\\.25 {\n width: calc(var(--spacing) * 25.25);\n }\n\n .w-26\\.25 {\n width: calc(var(--spacing) * 26.25);\n }\n\n .w-27 {\n width: calc(var(--spacing) * 27);\n }\n\n .w-27\\.5 {\n width: calc(var(--spacing) * 27.5);\n }\n\n .w-30 {\n width: var(--spacing-30);\n }\n\n .w-30\\.75 {\n width: calc(var(--spacing) * 30.75);\n }\n\n .w-32 {\n width: calc(var(--spacing) * 32);\n }\n\n .w-33\\.25 {\n width: calc(var(--spacing) * 33.25);\n }\n\n .w-34\\.25 {\n width: calc(var(--spacing) * 34.25);\n }\n\n .w-35 {\n width: calc(var(--spacing) * 35);\n }\n\n .w-36 {\n width: calc(var(--spacing) * 36);\n }\n\n .w-37 {\n width: calc(var(--spacing) * 37);\n }\n\n .w-38\\.5 {\n width: calc(var(--spacing) * 38.5);\n }\n\n .w-39\\.5 {\n width: calc(var(--spacing) * 39.5);\n }\n\n .w-41 {\n width: calc(var(--spacing) * 41);\n }\n\n .w-41\\.75 {\n width: calc(var(--spacing) * 41.75);\n }\n\n .w-45 {\n width: calc(var(--spacing) * 45);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\n }\n\n .w-48 {\n width: calc(var(--spacing) * 48);\n }\n\n .w-48\\.5 {\n width: calc(var(--spacing) * 48.5);\n }\n\n .w-53 {\n width: calc(var(--spacing) * 53);\n }\n\n .w-53\\.25 {\n width: calc(var(--spacing) * 53.25);\n }\n\n .w-56\\.5 {\n width: calc(var(--spacing) * 56.5);\n }\n\n .w-57\\.5 {\n width: calc(var(--spacing) * 57.5);\n }\n\n .w-60\\.5 {\n width: calc(var(--spacing) * 60.5);\n }\n\n .w-62\\.5 {\n width: calc(var(--spacing) * 62.5);\n }\n\n .w-63\\.5 {\n width: calc(var(--spacing) * 63.5);\n }\n\n .w-63\\.75 {\n width: calc(var(--spacing) * 63.75);\n }\n\n .w-66 {\n width: calc(var(--spacing) * 66);\n }\n\n .w-68 {\n width: calc(var(--spacing) * 68);\n }\n\n .w-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\n }\n\n .w-74\\.75 {\n width: calc(var(--spacing) * 74.75);\n }\n\n .w-87 {\n width: calc(var(--spacing) * 87);\n }\n\n .w-88\\.5 {\n width: calc(var(--spacing) * 88.5);\n }\n\n .w-91 {\n width: calc(var(--spacing) * 91);\n }\n\n .w-95 {\n width: calc(var(--spacing) * 95);\n }\n\n .w-99\\.75 {\n width: calc(var(--spacing) * 99.75);\n }\n\n .w-100\\.5 {\n width: calc(var(--spacing) * 100.5);\n }\n\n .w-102 {\n width: calc(var(--spacing) * 102);\n }\n\n .w-117 {\n width: var(--spacing-117);\n }\n\n .w-120 {\n width: var(--spacing-120);\n }\n\n .w-120\\.75 {\n width: calc(var(--spacing) * 120.75);\n }\n\n .w-121 {\n width: calc(var(--spacing) * 121);\n }\n\n .w-127\\.75 {\n width: calc(var(--spacing) * 127.75);\n }\n\n .w-130\\.25 {\n width: calc(var(--spacing) * 130.25);\n }\n\n .w-131 {\n width: calc(var(--spacing) * 131);\n }\n\n .w-139 {\n width: calc(var(--spacing) * 139);\n }\n\n .w-140\\.75 {\n width: calc(var(--spacing) * 140.75);\n }\n\n .w-144\\.75 {\n width: calc(var(--spacing) * 144.75);\n }\n\n .w-148\\.75 {\n width: calc(var(--spacing) * 148.75);\n }\n\n .w-186\\.5 {\n width: calc(var(--spacing) * 186.5);\n }\n\n .w-186\\.25 {\n width: calc(var(--spacing) * 186.25);\n }\n\n .w-194\\.25 {\n width: calc(var(--spacing) * 194.25);\n }\n\n .w-198\\.25 {\n width: calc(var(--spacing) * 198.25);\n }\n\n .w-270 {\n width: calc(var(--spacing) * 270);\n }\n\n .w-282 {\n width: calc(var(--spacing) * 282);\n }\n\n .w-286 {\n width: calc(var(--spacing) * 286);\n }\n\n .w-293\\.5 {\n width: calc(var(--spacing) * 293.5);\n }\n\n .w-294 {\n width: calc(var(--spacing) * 294);\n }\n\n .w-\\[10\\.5rem\\] {\n width: 10.5rem;\n }\n\n .w-\\[calc\\(100\\%-10px\\)\\] {\n width: calc(100% - 10px);\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-px {\n width: 1px;\n }\n\n .max-w-36 {\n max-width: calc(var(--spacing) * 36);\n }\n\n .max-w-38 {\n max-width: var(--spacing-38);\n }\n\n .max-w-43 {\n max-width: var(--spacing-43);\n }\n\n .max-w-44 {\n max-width: calc(var(--spacing) * 44);\n }\n\n .max-w-51\\.5 {\n max-width: calc(var(--spacing) * 51.5);\n }\n\n .max-w-65 {\n max-width: calc(var(--spacing) * 65);\n }\n\n .max-w-95 {\n max-width: calc(var(--spacing) * 95);\n }\n\n .max-w-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\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-4 {\n min-width: calc(var(--spacing) * 4);\n }\n\n .min-w-10 {\n min-width: calc(var(--spacing) * 10);\n }\n\n .min-w-20 {\n min-width: calc(var(--spacing) * 20);\n }\n\n .min-w-30 {\n min-width: var(--spacing-30);\n }\n\n .min-w-32 {\n min-width: calc(var(--spacing) * 32);\n }\n\n .min-w-36 {\n min-width: calc(var(--spacing) * 36);\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .min-w-50 {\n min-width: var(--spacing-50);\n }\n\n .min-w-53\\.25 {\n min-width: calc(var(--spacing) * 53.25);\n }\n\n .min-w-55 {\n min-width: calc(var(--spacing) * 55);\n }\n\n .min-w-160 {\n min-width: calc(var(--spacing) * 160);\n }\n\n .min-w-\\[8\\.2rem\\] {\n min-width: 8.2rem;\n }\n\n .min-w-fit {\n min-width: fit-content;\n }\n\n .min-w-full {\n min-width: 100%;\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .flex-shrink {\n flex-shrink: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .border-collapse {\n border-collapse: collapse;\n }\n\n .-translate-x-1 {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-x-1 {\n --tw-translate-x: var(--spacing);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .scale-\\[1\\.02\\] {\n scale: 1.02;\n }\n\n .rotate-180 {\n rotate: 180deg;\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-grab {\n cursor: grab;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .cursor-text {\n cursor: text;\n }\n\n .touch-none {\n touch-action: none;\n }\n\n .resize {\n resize: both;\n }\n\n .appearance-none {\n appearance: none;\n }\n\n .grid-cols-\\[7\\.5rem_7\\.5rem_7\\.5rem\\] {\n grid-template-columns: 7.5rem 7.5rem 7.5rem;\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-baseline {\n align-items: baseline;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-start {\n align-items: flex-start;\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 {\n gap: 0;\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-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n\n .gap-1\\.25 {\n gap: calc(var(--spacing) * 1.25);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .gap-2\\.25 {\n gap: calc(var(--spacing) * 2.25);\n }\n\n .gap-2\\.75 {\n gap: calc(var(--spacing) * 2.75);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n\n .gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n\n .gap-8\\.75 {\n gap: calc(var(--spacing) * 8.75);\n }\n\n .gap-12 {\n gap: calc(var(--spacing) * 12);\n }\n\n .gap-19 {\n gap: calc(var(--spacing) * 19);\n }\n\n .gap-\\[0\\.625rem\\] {\n gap: .625rem;\n }\n\n .gap-\\[0\\.53125rem\\] {\n gap: .53125rem;\n }\n\n .gap-\\[2\\%\\] {\n gap: 2%;\n }\n\n :where(.space-y-1 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));\n margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-2 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-3 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n .gap-x-1 {\n column-gap: var(--spacing);\n }\n\n .gap-x-2 {\n column-gap: calc(var(--spacing) * 2);\n }\n\n .gap-x-4 {\n column-gap: calc(var(--spacing) * 4);\n }\n\n .gap-x-6 {\n column-gap: calc(var(--spacing) * 6);\n }\n\n .gap-y-0\\.75 {\n row-gap: calc(var(--spacing) * .75);\n }\n\n .gap-y-1 {\n row-gap: var(--spacing);\n }\n\n .self-end {\n align-self: flex-end;\n }\n\n .self-start {\n align-self: flex-start;\n }\n\n .truncate {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-visible {\n overflow: visible;\n }\n\n .overflow-x-auto {\n overflow-x: auto;\n }\n\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-y-hidden {\n overflow-y: hidden;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-full {\n border-radius: 3.40282e38px;\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-none {\n border-radius: 0;\n }\n\n .rounded-none\\! {\n border-radius: 0 !important;\n }\n\n .rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n }\n\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n\n .rounded-t-xl {\n border-top-left-radius: var(--radius-xl);\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-l-xl {\n border-top-left-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .rounded-tl-xl {\n border-top-left-radius: var(--radius-xl);\n }\n\n .rounded-r-md {\n border-top-right-radius: var(--radius-md);\n border-bottom-right-radius: var(--radius-md);\n }\n\n .rounded-tr-xl {\n border-top-right-radius: var(--radius-xl);\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 .rounded-b-md {\n border-bottom-right-radius: var(--radius-md);\n border-bottom-left-radius: var(--radius-md);\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-x {\n border-inline-style: var(--tw-border-style);\n border-inline-width: 1px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-0 {\n border-top-style: var(--tw-border-style);\n border-top-width: 0;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0;\n }\n\n .border-l-4 {\n border-left-style: var(--tw-border-style);\n border-left-width: 4px;\n }\n\n .border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n\n .border-\\(--axebow-border-gray\\) {\n border-color: var(--axebow-border-gray);\n }\n\n .border-\\(--axebow-dark-yellow\\) {\n border-color: var(--axebow-dark-yellow);\n }\n\n .border-\\(--axebow-error-border\\) {\n border-color: var(--axebow-error-border);\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-premium-text\\) {\n border-color: var(--axebow-premium-text);\n }\n\n .border-\\(--axebow-primary\\) {\n border-color: var(--axebow-primary);\n }\n\n .border-\\(--axebow-secondary\\) {\n border-color: var(--axebow-secondary);\n }\n\n .border-\\(--axebow-table-border\\) {\n border-color: var(--axebow-table-border);\n }\n\n .border-\\(--axebow-table-header-border\\) {\n border-color: var(--axebow-table-header-border);\n }\n\n .border-\\(--axebow-tertiary\\) {\n border-color: var(--axebow-tertiary);\n }\n\n .border-\\[\\#344966\\] {\n border-color: #344966;\n }\n\n .border-\\[\\#DBDDE4\\] {\n border-color: #dbdde4;\n }\n\n .border-\\[var\\(--axebow-error\\)\\] {\n border-color: var(--axebow-error);\n }\n\n .border-\\[var\\(--axebow-gray\\)\\] {\n border-color: var(--axebow-gray);\n }\n\n .border-\\[var\\(--axebow-tertiary\\)\\] {\n border-color: var(--axebow-tertiary);\n }\n\n .border-black\\/10 {\n border-color: #0000001a;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n\n .border-blue-200 {\n border-color: var(--color-blue-200);\n }\n\n .border-gray-100 {\n border-color: var(--color-gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--color-gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--color-gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--color-gray-500);\n }\n\n .border-green-200 {\n border-color: var(--color-green-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-white {\n border-color: var(--color-white);\n }\n\n .bg-\\(--axebow-anti-flash-white\\) {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\(--axebow-base\\) {\n background-color: var(--axebow-base);\n }\n\n .bg-\\(--axebow-error\\) {\n background-color: var(--axebow-error);\n }\n\n .bg-\\(--axebow-error-bg\\) {\n background-color: var(--axebow-error-bg);\n }\n\n .bg-\\(--axebow-gray\\) {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\(--axebow-light-gray\\), .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: var(--axebow-light-gray);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: color-mix(in oklab, var(--axebow-light-gray) 80%, transparent);\n }\n }\n\n .bg-\\(--axebow-primary\\) {\n background-color: var(--axebow-primary);\n }\n\n .bg-\\(--axebow-primary-light\\) {\n background-color: var(--axebow-primary-light);\n }\n\n .bg-\\(--axebow-success\\) {\n background-color: var(--axebow-success);\n }\n\n .bg-\\(--axebow-tertiary\\), .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: var(--axebow-tertiary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: color-mix(in oklab, var(--axebow-tertiary) 15%, transparent);\n }\n }\n\n .bg-\\(--axebow-warning\\) {\n background-color: var(--axebow-warning);\n }\n\n .bg-\\(--axebow-warning-bg\\) {\n background-color: var(--axebow-warning-bg);\n }\n\n .bg-\\(--axebow-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-\\[\\#006BFF\\] {\n background-color: #006bff;\n }\n\n .bg-\\[\\#C7DCFA\\] {\n background-color: #c7dcfa;\n }\n\n .bg-\\[\\#F0F1F5\\] {\n background-color: #f0f1f5;\n }\n\n .bg-blue-50 {\n background-color: var(--color-blue-50);\n }\n\n .bg-gray-50 {\n background-color: var(--color-gray-50);\n }\n\n .bg-gray-50\\/50 {\n background-color: #f9fafb80;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-gray-50\\/50 {\n background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent);\n }\n }\n\n .bg-gray-100 {\n background-color: var(--color-gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--color-gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n\n .bg-green-50 {\n background-color: var(--color-green-50);\n }\n\n .bg-red-50 {\n background-color: var(--color-red-50);\n }\n\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n\n .bg-sky-50 {\n background-color: var(--color-sky-50);\n }\n\n .bg-sky-100 {\n background-color: var(--color-sky-100);\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-0 {\n padding: 0;\n }\n\n .p-1 {\n padding: var(--spacing);\n }\n\n .p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n\n .p-3\\.25 {\n padding: calc(var(--spacing) * 3.25);\n }\n\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n\n .p-5 {\n padding: calc(var(--spacing) * 5);\n }\n\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n\n .px-0\\.5 {\n padding-inline: calc(var(--spacing) * .5);\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-3\\.5 {\n padding-inline: calc(var(--spacing) * 3.5);\n }\n\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\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-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .py-1\\.25 {\n padding-block: calc(var(--spacing) * 1.25);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n\n .py-2\\.75 {\n padding-block: calc(var(--spacing) * 2.75);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n\n .py-4\\.75 {\n padding-block: calc(var(--spacing) * 4.75);\n }\n\n .py-8 {\n padding-block: calc(var(--spacing) * 8);\n }\n\n .ps-4 {\n padding-inline-start: calc(var(--spacing) * 4);\n }\n\n .ps-8 {\n padding-inline-start: calc(var(--spacing) * 8);\n }\n\n .pe-4 {\n padding-inline-end: calc(var(--spacing) * 4);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-1 {\n padding-top: var(--spacing);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n\n .pt-6 {\n padding-top: calc(var(--spacing) * 6);\n }\n\n .pt-8 {\n padding-top: calc(var(--spacing) * 8);\n }\n\n .pt-px {\n padding-top: 1px;\n }\n\n .pr-1 {\n padding-right: var(--spacing);\n }\n\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .pr-3\\.25 {\n padding-right: calc(var(--spacing) * 3.25);\n }\n\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n\n .pr-4\\.5 {\n padding-right: calc(var(--spacing) * 4.5);\n }\n\n .pr-5 {\n padding-right: calc(var(--spacing) * 5);\n }\n\n .pb-0 {\n padding-bottom: 0;\n }\n\n .pb-1 {\n padding-bottom: var(--spacing);\n }\n\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .pb-3\\.5 {\n padding-bottom: calc(var(--spacing) * 3.5);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n\n .pl-1 {\n padding-left: var(--spacing);\n }\n\n .pl-1\\.5 {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n\n .pl-4\\.25 {\n padding-left: calc(var(--spacing) * 4.25);\n }\n\n .pl-5 {\n padding-left: calc(var(--spacing) * 5);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .pl-11\\.75 {\n padding-left: calc(var(--spacing) * 11.75);\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-right {\n text-align: right;\n }\n\n .text-start {\n text-align: start;\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 .font-\\[inherit\\] {\n font-family: inherit;\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-md {\n font-size: var(--text-md);\n line-height: var(--tw-leading, var(--text-md--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 .text-\\[0\\.9375rem\\] {\n font-size: .9375rem;\n }\n\n .text-\\[1\\.25rem\\] {\n font-size: 1.25rem;\n }\n\n .text-\\[18px\\] {\n font-size: 18px;\n }\n\n .leading-3\\.5 {\n --tw-leading: calc(var(--spacing) * 3.5);\n line-height: calc(var(--spacing) * 3.5);\n }\n\n .leading-4\\.5 {\n --tw-leading: calc(var(--spacing) * 4.5);\n line-height: calc(var(--spacing) * 4.5);\n }\n\n .leading-4\\.25 {\n --tw-leading: calc(var(--spacing) * 4.25);\n line-height: calc(var(--spacing) * 4.25);\n }\n\n .leading-\\[1\\.0625rem\\] {\n --tw-leading: 1.0625rem;\n line-height: 1.0625rem;\n }\n\n .leading-\\[1\\.21875rem\\] {\n --tw-leading: 1.21875rem;\n line-height: 1.21875rem;\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n }\n\n .font-black {\n --tw-font-weight: var(--font-weight-black);\n font-weight: var(--font-weight-black);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\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 .tracking-wider {\n --tw-tracking: var(--tracking-wider);\n letter-spacing: var(--tracking-wider);\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .break-all {\n word-break: break-all;\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-normal {\n white-space: normal;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\(--axebow-anti-flash-white\\) {\n color: var(--axebow-anti-flash-white);\n }\n\n .text-\\(--axebow-black\\) {\n color: var(--axebow-black);\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-strong-gray\\) {\n color: var(--axebow-strong-gray);\n }\n\n .text-\\(--axebow-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\(--axebow-text-gray\\) {\n color: var(--axebow-text-gray);\n }\n\n .text-\\[\\#006BFF\\] {\n color: #006bff;\n }\n\n .text-\\[\\#8A94AE\\] {\n color: #8a94ae;\n }\n\n .text-\\[\\#78787A\\] {\n color: #78787a;\n }\n\n .text-\\[\\#344966\\] {\n color: #344966;\n }\n\n .text-\\[\\#E93A3A\\] {\n color: #e93a3a;\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-\\[var\\(--axebow-tertiary\\)\\] {\n color: var(--axebow-tertiary);\n }\n\n .text-black {\n color: var(--color-black);\n }\n\n .text-blue-600 {\n color: var(--color-blue-600);\n }\n\n .text-blue-800 {\n color: var(--color-blue-800);\n }\n\n .text-gray-300 {\n color: var(--color-gray-300);\n }\n\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n\n .text-gray-500 {\n color: var(--color-gray-500);\n }\n\n .text-gray-600 {\n color: var(--color-gray-600);\n }\n\n .text-gray-700 {\n color: var(--color-gray-700);\n }\n\n .text-green-600 {\n color: var(--color-green-600);\n }\n\n .text-green-800 {\n color: var(--color-green-800);\n }\n\n .text-inherit {\n color: inherit;\n }\n\n .text-red-800 {\n color: var(--color-red-800);\n }\n\n .text-white {\n color: var(--color-white);\n }\n\n .text-yellow-600 {\n color: var(--color-yellow-600);\n }\n\n .text-yellow-800 {\n color: var(--color-yellow-800);\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .italic {\n font-style: italic;\n }\n\n .not-italic {\n font-style: normal;\n }\n\n .no-underline {\n text-decoration-line: none;\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .decoration-\\(--axebow-error\\) {\n -webkit-text-decoration-color: var(--axebow-error);\n -webkit-text-decoration-color: var(--axebow-error);\n text-decoration-color: var(--axebow-error);\n }\n\n .placeholder-gray-400::placeholder {\n color: var(--color-gray-400);\n }\n\n .opacity-0 {\n opacity: 0;\n }\n\n .opacity-40 {\n opacity: .4;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-60 {\n opacity: .6;\n }\n\n .opacity-70 {\n opacity: .7;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[0_-8px_8px_-8px_rgba\\(13\\,24\\,33\\,0\\.15\\)\\] {\n --tw-shadow: 0 -8px 8px -8px var(--tw-shadow-color, #0d182126);\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 .shadow-\\[0_2px_6px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\] {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0003);\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 .shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 0 4px 12px 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 .shadow-\\[0_6px_16px_rgba\\(13\\,24\\,33\\,0\\.18\\)\\] {\n --tw-shadow: 0 6px 16px var(--tw-shadow-color, #0d18212e);\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 .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 .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px 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 .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px 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 .shadow-none {\n --tw-shadow: 0 0 #0000;\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 .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px 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 .axebow-shadow-hover {\n transition: box-shadow .2s ease-in-out;\n }\n\n .axebow-shadow-hover:hover {\n box-shadow: 0 4px 12px #0d182114;\n }\n\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .blur {\n --tw-blur: blur(8px);\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 .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 .filter {\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 {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\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-\\[filter\\] {\n transition-property: filter;\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-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-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\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-opacity {\n transition-property: opacity;\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 .transition-transform {\n transition-property: transform, translate, scale, rotate;\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 .delay-100 {\n transition-delay: .1s;\n }\n\n .duration-120 {\n --tw-duration: .12s;\n transition-duration: .12s;\n }\n\n .duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .duration-300 {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .select-none {\n -webkit-user-select: none;\n user-select: none;\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 .group-hover\\:translate-x-0:is(:where(.group):hover *) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-hover\\:rotate-15:is(:where(.group):hover *) {\n rotate: 15deg;\n }\n\n .group-hover\\:font-semibold:is(:where(.group):hover *) {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .group-hover\\:text-\\(--axebow-primary\\):is(:where(.group):hover *) {\n color: var(--axebow-primary);\n }\n\n .group-hover\\:opacity-100:is(:where(.group):hover *) {\n opacity: 1;\n }\n\n .group-hover\\:invert:is(:where(.group):hover *) {\n --tw-invert: invert(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\n .last\\:border-b-0:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .focus-within\\:border-\\(--axebow-tertiary\\):focus-within {\n border-color: var(--axebow-tertiary);\n }\n\n .focus-within\\:border-blue-500:focus-within {\n border-color: var(--color-blue-500);\n }\n\n .focus-within\\:ring-2:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\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 .focus-within\\:ring-blue-100:focus-within {\n --tw-ring-color: var(--color-blue-100);\n }\n\n @media (hover: hover) {\n .hover\\:scale-105:hover {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .hover\\:border-2:hover {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .hover\\:border-solid:hover {\n --tw-border-style: solid;\n border-style: solid;\n }\n\n .hover\\:border-\\(--axebow-gray\\):hover {\n border-color: var(--axebow-gray);\n }\n\n .hover\\:border-\\(--axebow-primary\\):hover {\n border-color: var(--axebow-primary);\n }\n\n .hover\\:border-\\(--axebow-tertiary\\):hover, .hover\\:border-\\[var\\(--axebow-tertiary\\)\\]:hover {\n border-color: var(--axebow-tertiary);\n }\n\n .hover\\:border-red-300:hover {\n border-color: var(--color-red-300);\n }\n\n .hover\\:bg-\\(--axebow-anti-flash-white\\):hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-\\(--axebow-base\\):hover {\n background-color: var(--axebow-base);\n }\n\n .hover\\:bg-\\(--axebow-gray\\):hover {\n background-color: var(--axebow-gray);\n }\n\n .hover\\:bg-\\(--axebow-light-gray\\):hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-\\(--axebow-primary\\):hover {\n background-color: var(--axebow-primary);\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-50:hover {\n background-color: var(--color-gray-50);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:bg-gray-200:hover {\n background-color: var(--color-gray-200);\n }\n\n .hover\\:bg-red-50:hover {\n background-color: var(--color-red-50);\n }\n\n .hover\\:bg-white:hover {\n background-color: var(--color-white);\n }\n\n .hover\\:px-5\\.5:hover {\n padding-inline: calc(var(--spacing) * 5.5);\n }\n\n .hover\\:text-\\(--axebow-gray\\):hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:text-\\(--axebow-primary\\):hover {\n color: var(--axebow-primary);\n }\n\n .hover\\:text-\\(--axebow-tertiary\\):hover {\n color: var(--axebow-tertiary);\n }\n\n .hover\\:text-black:hover {\n color: var(--color-black);\n }\n\n .hover\\:text-gray-700:hover {\n color: var(--color-gray-700);\n }\n\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .hover\\:opacity-80:hover {\n opacity: .8;\n }\n\n .hover\\:opacity-100:hover {\n opacity: 1;\n }\n\n .hover\\:shadow-\\[0_2px_6px_rgba\\(13\\,24\\,33\\,0\\.14\\)\\]:hover {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0d182124);\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 .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 .hover\\:shadow-lg:hover {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px 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\n .focus\\:outline-2:focus {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus\\:outline-offset-1:focus {\n outline-offset: 1px;\n }\n\n .focus\\:outline-blue-500:focus {\n outline-color: var(--color-blue-500);\n }\n\n .focus\\:outline-none:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\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 .focus-visible\\:ring-\\[\\#006BFF\\]:focus-visible {\n --tw-ring-color: #006bff;\n }\n\n .focus-visible\\:outline-2:focus-visible {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus-visible\\:outline-\\(--axebow-tertiary\\):focus-visible {\n outline-color: var(--axebow-tertiary);\n }\n\n .active\\:cursor-grabbing:active {\n cursor: grabbing;\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 @media (min-width: 48rem) {\n .md\\:gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n }\n\n @media (min-width: 64rem) {\n .lg\\:sticky {\n position: sticky;\n }\n\n .lg\\:block {\n display: block;\n }\n\n .lg\\:flex {\n display: flex;\n }\n\n .lg\\:hidden {\n display: none;\n }\n\n .lg\\:inline {\n display: inline;\n }\n\n .lg\\:min-h-\\(--card-height\\) {\n min-height: var(--card-height);\n }\n\n .lg\\:min-h-\\[calc\\(100vh-6\\.25rem\\)\\] {\n min-height: calc(100vh - 6.25rem);\n }\n\n .lg\\:w-\\(--card-width\\) {\n width: var(--card-width);\n }\n\n .lg\\:min-w-150 {\n min-width: var(--spacing-150);\n }\n\n .lg\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:rounded-md {\n border-radius: var(--radius-md);\n }\n\n .lg\\:border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .lg\\:text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .lg\\:text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .lg\\:shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px 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}\n\n:host {\n font-family: var(--font-sans);\n font-size: var(--text-base);\n line-height: var(--text-base--line-height);\n --font-sans: \"Open Sans\", sans-serif;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-2xl: 1.5rem;\n --text-2xl--line-height: 2rem;\n --text-3xl: 1.875rem;\n --text-3xl--line-height: 2.25rem;\n --text-4xl: 2.25rem;\n --text-4xl--line-height: 2.5rem;\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 4.625rem;\n --text-8xl--line-height: 1;\n --text-9xl: 6.125rem;\n --text-9xl--line-height: 1;\n}\n\n:root {\n --sl-font-sans: \"Open Sans\", sans-serif;\n --sl-font-size-2x-small: var(--text-xs);\n --sl-font-size-x-small: var(--text-xs);\n --sl-font-size-small: var(--text-sm);\n --sl-font-size-medium: var(--text-base);\n --sl-font-size-large: var(--text-md);\n --sl-font-size-x-large: var(--text-lg);\n --sl-font-size-2x-large: var(--text-xl);\n --sl-font-size-3x-large: var(--text-3xl);\n --sl-font-size-4x-large: var(--text-5xl);\n --sl-input-font-size-small: var(--text-sm);\n --sl-input-font-size-medium: var(--text-base);\n --sl-input-font-size-large: var(--text-md);\n --sl-button-font-size-small: var(--text-sm);\n --sl-button-font-size-medium: var(--text-base);\n --sl-button-font-size-large: var(--text-md);\n --sl-tooltip-font-size: var(--text-base);\n}\n\nbutton, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n}\n\ninput, select, textarea, sl-menu-item::part(label), sl-option::part(label) {\n font-size: var(--text-base);\n}\n\n:root {\n --axebow-scrollbar-line-color: var(--axebow-tertiary, #e51c8e);\n --axebow-scrollbar-track-color: #f0f1f5;\n --axebow-scrollbar-thumb-color: #cbd5e1;\n --axebow-scrollbar-thumb-hover-color: #94a3b8;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-select::part(listbox), sl-dropdown::part(panel), sl-menu::part(base) {\n scrollbar-width: thin;\n scrollbar-color: var(--axebow-scrollbar-thumb-color) transparent;\n}\n\nsl-select::part(listbox), sl-select::part(menu) {\n width: max-content !important;\n min-width: 100% !important;\n max-width: 90vw !important;\n}\n\n.axebow-blue-button::part(base) {\n background-color: var(--axebow-tertiary);\n}\n\n.info-container-page {\n flex-wrap: wrap;\n gap: 2rem;\n display: flex;\n}\n\nsl-divider {\n background: var(--axebow-light-gray);\n height: 1px;\n margin-top: .5rem;\n margin-bottom: .5rem;\n}\n\n.axebow-shadow {\n box-shadow: 2px 2px 25px #0000001a;\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\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-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\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-tracking {\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-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\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\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n";
|
|
219
|
+
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-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\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-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: 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-outline-style: solid;\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 --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: \"Open Sans\", sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-50: oklch(97.1% .013 17.38);\n --color-red-100: oklch(93.6% .032 17.717);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-800: oklch(44.4% .177 26.899);\n --color-yellow-600: oklch(68.1% .162 75.834);\n --color-yellow-800: oklch(47.6% .114 61.907);\n --color-green-50: oklch(98.2% .018 155.826);\n --color-green-200: oklch(92.5% .084 155.995);\n --color-green-600: oklch(62.7% .194 149.214);\n --color-green-800: oklch(44.8% .119 151.328);\n --color-sky-50: oklch(97.7% .013 236.62);\n --color-sky-100: oklch(95.1% .026 236.824);\n --color-blue-50: oklch(97% .014 254.604);\n --color-blue-100: oklch(93.2% .032 255.585);\n --color-blue-200: oklch(88.2% .059 254.128);\n --color-blue-500: oklch(62.3% .214 259.815);\n --color-blue-600: oklch(54.6% .245 262.881);\n --color-blue-800: oklch(42.4% .199 265.638);\n --color-gray-50: oklch(98.5% .002 247.839);\n --color-gray-100: oklch(96.7% .003 264.542);\n --color-gray-200: oklch(92.8% .006 264.531);\n --color-gray-300: oklch(87.2% .01 258.338);\n --color-gray-400: oklch(70.7% .022 261.325);\n --color-gray-500: oklch(55.1% .027 264.364);\n --color-gray-600: oklch(44.6% .03 256.802);\n --color-gray-700: oklch(37.3% .034 259.733);\n --color-black: #000;\n --color-white: #fff;\n --spacing: .25rem;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-3xl: 1.875rem;\n --text-5xl: 3rem;\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --font-weight-black: 900;\n --tracking-wider: .05em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-relaxed: 1.625;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --ease-out: cubic-bezier(0, 0, .2, 1);\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 --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --spacing-18: 4.5rem;\n --spacing-30: 7.5rem;\n --spacing-38: 9.5rem;\n --spacing-43: 10.75rem;\n --spacing-50: 12.5rem;\n --spacing-75: 18.75rem;\n --spacing-117: 29.25rem;\n --spacing-120: 30rem;\n --spacing-150: 37.5rem;\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-auto {\n pointer-events: auto;\n }\n\n .pointer-events-none {\n pointer-events: none;\n }\n\n .visible {\n visibility: visible;\n }\n\n .absolute {\n position: absolute;\n }\n\n .fixed {\n position: fixed;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .-top-2\\.25 {\n top: calc(var(--spacing) * -2.25);\n }\n\n .top-0 {\n top: 0;\n }\n\n .top-1 {\n top: var(--spacing);\n }\n\n .top-1\\/2 {\n top: 50%;\n }\n\n .top-3 {\n top: calc(var(--spacing) * 3);\n }\n\n .top-25 {\n top: calc(var(--spacing) * 25);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-full {\n top: 100%;\n }\n\n .-right-2\\.25 {\n right: calc(var(--spacing) * -2.25);\n }\n\n .right-0 {\n right: 0;\n }\n\n .right-0\\.5 {\n right: calc(var(--spacing) * .5);\n }\n\n .right-1 {\n right: var(--spacing);\n }\n\n .right-1\\.5 {\n right: calc(var(--spacing) * 1.5);\n }\n\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n\n .right-\\[calc\\(100\\%\\+10px\\)\\] {\n right: calc(100% + 10px);\n }\n\n .bottom-0 {\n bottom: 0;\n }\n\n .bottom-0\\.5 {\n bottom: calc(var(--spacing) * .5);\n }\n\n .bottom-full {\n bottom: 100%;\n }\n\n .left-0 {\n left: 0;\n }\n\n .left-1\\/2 {\n left: 50%;\n }\n\n .left-\\[-7px\\] {\n left: -7px;\n }\n\n .left-\\[calc\\(100\\%\\+10px\\)\\] {\n left: calc(100% + 10px);\n }\n\n .left-full {\n left: 100%;\n }\n\n .z-5 {\n z-index: 5;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-2000 {\n z-index: 2000;\n }\n\n .z-2001 {\n z-index: 2001;\n }\n\n .z-9999 {\n z-index: 9999;\n }\n\n .row-1 {\n grid-row: 1;\n }\n\n .row-2 {\n grid-row: 2;\n }\n\n .container {\n width: 100%;\n }\n\n @media (min-width: 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n\n @media (min-width: 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n\n @media (min-width: 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n\n @media (min-width: 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n\n @media (min-width: 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n\n .m-0 {\n margin: 0;\n }\n\n .mx-2 {\n margin-inline: calc(var(--spacing) * 2);\n }\n\n .mx-6 {\n margin-inline: calc(var(--spacing) * 6);\n }\n\n .mx-12 {\n margin-inline: calc(var(--spacing) * 12);\n }\n\n .mx-auto {\n margin-inline: auto;\n }\n\n .my-0\\.5 {\n margin-block: calc(var(--spacing) * .5);\n }\n\n .my-1\\.5 {\n margin-block: calc(var(--spacing) * 1.5);\n }\n\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n\n .my-4 {\n margin-block: calc(var(--spacing) * 4);\n }\n\n .ms-auto {\n margin-inline-start: auto;\n }\n\n .mt-0 {\n margin-top: 0;\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-1\\.75 {\n margin-top: calc(var(--spacing) * 1.75);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mt-2\\.25 {\n margin-top: calc(var(--spacing) * 2.25);\n }\n\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n\n .mt-4\\.5 {\n margin-top: calc(var(--spacing) * 4.5);\n }\n\n .mt-5 {\n margin-top: calc(var(--spacing) * 5);\n }\n\n .mt-6 {\n margin-top: calc(var(--spacing) * 6);\n }\n\n .mt-6\\.75 {\n margin-top: calc(var(--spacing) * 6.75);\n }\n\n .mt-8 {\n margin-top: calc(var(--spacing) * 8);\n }\n\n .mr-0\\.5 {\n margin-right: calc(var(--spacing) * .5);\n }\n\n .mr-1 {\n margin-right: var(--spacing);\n }\n\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mr-4 {\n margin-right: calc(var(--spacing) * 4);\n }\n\n .mr-8 {\n margin-right: calc(var(--spacing) * 8);\n }\n\n .mb-1 {\n margin-bottom: var(--spacing);\n }\n\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .mb-3 {\n margin-bottom: calc(var(--spacing) * 3);\n }\n\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n\n .mb-6\\.5 {\n margin-bottom: calc(var(--spacing) * 6.5);\n }\n\n .mb-8 {\n margin-bottom: calc(var(--spacing) * 8);\n }\n\n .ml-1 {\n margin-left: var(--spacing);\n }\n\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .ml-4 {\n margin-left: calc(var(--spacing) * 4);\n }\n\n .ml-12 {\n margin-left: calc(var(--spacing) * 12);\n }\n\n .ml-\\[0\\.5rem\\] {\n margin-left: .5rem;\n }\n\n .ml-\\[1\\.265625rem\\] {\n margin-left: 1.26563rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .box-border {\n box-sizing: border-box;\n }\n\n .box-content {\n box-sizing: content-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 .line-clamp-2 {\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-11 {\n -webkit-line-clamp: 11;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .block {\n display: block;\n }\n\n .contents {\n display: contents;\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 {\n display: inline;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .table {\n display: table;\n }\n\n .aspect-square {\n aspect-ratio: 1;\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-2\\.25 {\n height: calc(var(--spacing) * 2.25);\n }\n\n .h-2\\.75 {\n height: calc(var(--spacing) * 2.75);\n }\n\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-4\\.5 {\n height: calc(var(--spacing) * 4.5);\n }\n\n .h-4\\.25 {\n height: calc(var(--spacing) * 4.25);\n }\n\n .h-4\\.75 {\n height: calc(var(--spacing) * 4.75);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-5\\.5 {\n height: calc(var(--spacing) * 5.5);\n }\n\n .h-5\\.25 {\n height: calc(var(--spacing) * 5.25);\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-7\\.5 {\n height: calc(var(--spacing) * 7.5);\n }\n\n .h-7\\.25 {\n height: calc(var(--spacing) * 7.25);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-8\\.75 {\n height: calc(var(--spacing) * 8.75);\n }\n\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n\n .h-9\\.5 {\n height: calc(var(--spacing) * 9.5);\n }\n\n .h-9\\.75 {\n height: calc(var(--spacing) * 9.75);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-10\\.5 {\n height: calc(var(--spacing) * 10.5);\n }\n\n .h-10\\.25 {\n height: calc(var(--spacing) * 10.25);\n }\n\n .h-11 {\n height: calc(var(--spacing) * 11);\n }\n\n .h-11\\.5 {\n height: calc(var(--spacing) * 11.5);\n }\n\n .h-11\\.25 {\n height: calc(var(--spacing) * 11.25);\n }\n\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n\n .h-12\\.5 {\n height: calc(var(--spacing) * 12.5);\n }\n\n .h-12\\.25 {\n height: calc(var(--spacing) * 12.25);\n }\n\n .h-12\\.75 {\n height: calc(var(--spacing) * 12.75);\n }\n\n .h-14 {\n height: calc(var(--spacing) * 14);\n }\n\n .h-14\\.25 {\n height: calc(var(--spacing) * 14.25);\n }\n\n .h-16 {\n height: calc(var(--spacing) * 16);\n }\n\n .h-17\\.75 {\n height: calc(var(--spacing) * 17.75);\n }\n\n .h-19\\.75 {\n height: calc(var(--spacing) * 19.75);\n }\n\n .h-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-20\\.75 {\n height: calc(var(--spacing) * 20.75);\n }\n\n .h-21\\.25 {\n height: calc(var(--spacing) * 21.25);\n }\n\n .h-22\\.75 {\n height: calc(var(--spacing) * 22.75);\n }\n\n .h-24\\.75 {\n height: calc(var(--spacing) * 24.75);\n }\n\n .h-32\\.75 {\n height: calc(var(--spacing) * 32.75);\n }\n\n .h-49\\.5 {\n height: calc(var(--spacing) * 49.5);\n }\n\n .h-52\\.75 {\n height: calc(var(--spacing) * 52.75);\n }\n\n .h-57\\.5 {\n height: calc(var(--spacing) * 57.5);\n }\n\n .h-77\\.25 {\n height: calc(var(--spacing) * 77.25);\n }\n\n .h-79 {\n height: calc(var(--spacing) * 79);\n }\n\n .h-83\\.25 {\n height: calc(var(--spacing) * 83.25);\n }\n\n .h-89\\.25 {\n height: calc(var(--spacing) * 89.25);\n }\n\n .h-112 {\n height: calc(var(--spacing) * 112);\n }\n\n .h-\\[8\\.26375rem\\] {\n height: 8.26375rem;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-fit {\n height: fit-content;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-px {\n height: 1px;\n }\n\n .h-screen {\n height: 100vh;\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-48 {\n max-height: calc(var(--spacing) * 48);\n }\n\n .max-h-75 {\n max-height: var(--spacing-75);\n }\n\n .max-h-\\[40vh\\] {\n max-height: 40vh;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-0 {\n min-height: 0;\n }\n\n .min-h-5 {\n min-height: calc(var(--spacing) * 5);\n }\n\n .min-h-9 {\n min-height: calc(var(--spacing) * 9);\n }\n\n .min-h-10 {\n min-height: calc(var(--spacing) * 10);\n }\n\n .min-h-12 {\n min-height: calc(var(--spacing) * 12);\n }\n\n .min-h-14 {\n min-height: calc(var(--spacing) * 14);\n }\n\n .min-h-35 {\n min-height: calc(var(--spacing) * 35);\n }\n\n .min-h-102\\.5 {\n min-height: calc(var(--spacing) * 102.5);\n }\n\n .min-h-107\\.5 {\n min-height: calc(var(--spacing) * 107.5);\n }\n\n .min-h-113\\.25 {\n min-height: calc(var(--spacing) * 113.25);\n }\n\n .w-1\\.75 {\n width: calc(var(--spacing) * 1.75);\n }\n\n .w-1\\/3 {\n width: 33.3333%;\n }\n\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-4\\.5 {\n width: calc(var(--spacing) * 4.5);\n }\n\n .w-4\\.25 {\n width: calc(var(--spacing) * 4.25);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n\n .w-7 {\n width: calc(var(--spacing) * 7);\n }\n\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n\n .w-9\\.5 {\n width: calc(var(--spacing) * 9.5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-10\\.5 {\n width: calc(var(--spacing) * 10.5);\n }\n\n .w-11\\.5 {\n width: calc(var(--spacing) * 11.5);\n }\n\n .w-11\\.25 {\n width: calc(var(--spacing) * 11.25);\n }\n\n .w-12 {\n width: calc(var(--spacing) * 12);\n }\n\n .w-12\\.5 {\n width: calc(var(--spacing) * 12.5);\n }\n\n .w-12\\.75 {\n width: calc(var(--spacing) * 12.75);\n }\n\n .w-15\\.25 {\n width: calc(var(--spacing) * 15.25);\n }\n\n .w-16 {\n width: calc(var(--spacing) * 16);\n }\n\n .w-16\\.5 {\n width: calc(var(--spacing) * 16.5);\n }\n\n .w-17 {\n width: calc(var(--spacing) * 17);\n }\n\n .w-18 {\n width: var(--spacing-18);\n }\n\n .w-18\\.5 {\n width: calc(var(--spacing) * 18.5);\n }\n\n .w-18\\.75 {\n width: calc(var(--spacing) * 18.75);\n }\n\n .w-20 {\n width: calc(var(--spacing) * 20);\n }\n\n .w-20\\.5 {\n width: calc(var(--spacing) * 20.5);\n }\n\n .w-21\\.5 {\n width: calc(var(--spacing) * 21.5);\n }\n\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n\n .w-24\\.75 {\n width: calc(var(--spacing) * 24.75);\n }\n\n .w-25 {\n width: calc(var(--spacing) * 25);\n }\n\n .w-25\\.5 {\n width: calc(var(--spacing) * 25.5);\n }\n\n .w-25\\.25 {\n width: calc(var(--spacing) * 25.25);\n }\n\n .w-26\\.25 {\n width: calc(var(--spacing) * 26.25);\n }\n\n .w-27 {\n width: calc(var(--spacing) * 27);\n }\n\n .w-27\\.5 {\n width: calc(var(--spacing) * 27.5);\n }\n\n .w-28\\.25 {\n width: calc(var(--spacing) * 28.25);\n }\n\n .w-30 {\n width: var(--spacing-30);\n }\n\n .w-30\\.75 {\n width: calc(var(--spacing) * 30.75);\n }\n\n .w-32 {\n width: calc(var(--spacing) * 32);\n }\n\n .w-33\\.25 {\n width: calc(var(--spacing) * 33.25);\n }\n\n .w-34\\.25 {\n width: calc(var(--spacing) * 34.25);\n }\n\n .w-35 {\n width: calc(var(--spacing) * 35);\n }\n\n .w-36 {\n width: calc(var(--spacing) * 36);\n }\n\n .w-37 {\n width: calc(var(--spacing) * 37);\n }\n\n .w-38\\.5 {\n width: calc(var(--spacing) * 38.5);\n }\n\n .w-39\\.5 {\n width: calc(var(--spacing) * 39.5);\n }\n\n .w-41 {\n width: calc(var(--spacing) * 41);\n }\n\n .w-41\\.75 {\n width: calc(var(--spacing) * 41.75);\n }\n\n .w-45 {\n width: calc(var(--spacing) * 45);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\n }\n\n .w-48 {\n width: calc(var(--spacing) * 48);\n }\n\n .w-48\\.5 {\n width: calc(var(--spacing) * 48.5);\n }\n\n .w-53 {\n width: calc(var(--spacing) * 53);\n }\n\n .w-53\\.25 {\n width: calc(var(--spacing) * 53.25);\n }\n\n .w-56\\.5 {\n width: calc(var(--spacing) * 56.5);\n }\n\n .w-57\\.5 {\n width: calc(var(--spacing) * 57.5);\n }\n\n .w-60\\.5 {\n width: calc(var(--spacing) * 60.5);\n }\n\n .w-62\\.5 {\n width: calc(var(--spacing) * 62.5);\n }\n\n .w-63\\.5 {\n width: calc(var(--spacing) * 63.5);\n }\n\n .w-63\\.75 {\n width: calc(var(--spacing) * 63.75);\n }\n\n .w-66 {\n width: calc(var(--spacing) * 66);\n }\n\n .w-68 {\n width: calc(var(--spacing) * 68);\n }\n\n .w-70 {\n width: calc(var(--spacing) * 70);\n }\n\n .w-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\n }\n\n .w-74\\.75 {\n width: calc(var(--spacing) * 74.75);\n }\n\n .w-87 {\n width: calc(var(--spacing) * 87);\n }\n\n .w-88\\.5 {\n width: calc(var(--spacing) * 88.5);\n }\n\n .w-91 {\n width: calc(var(--spacing) * 91);\n }\n\n .w-95 {\n width: calc(var(--spacing) * 95);\n }\n\n .w-99\\.75 {\n width: calc(var(--spacing) * 99.75);\n }\n\n .w-100\\.5 {\n width: calc(var(--spacing) * 100.5);\n }\n\n .w-102 {\n width: calc(var(--spacing) * 102);\n }\n\n .w-117 {\n width: var(--spacing-117);\n }\n\n .w-120 {\n width: var(--spacing-120);\n }\n\n .w-120\\.75 {\n width: calc(var(--spacing) * 120.75);\n }\n\n .w-121 {\n width: calc(var(--spacing) * 121);\n }\n\n .w-127\\.75 {\n width: calc(var(--spacing) * 127.75);\n }\n\n .w-130\\.25 {\n width: calc(var(--spacing) * 130.25);\n }\n\n .w-131 {\n width: calc(var(--spacing) * 131);\n }\n\n .w-139 {\n width: calc(var(--spacing) * 139);\n }\n\n .w-140\\.75 {\n width: calc(var(--spacing) * 140.75);\n }\n\n .w-144\\.75 {\n width: calc(var(--spacing) * 144.75);\n }\n\n .w-148\\.75 {\n width: calc(var(--spacing) * 148.75);\n }\n\n .w-186\\.5 {\n width: calc(var(--spacing) * 186.5);\n }\n\n .w-186\\.25 {\n width: calc(var(--spacing) * 186.25);\n }\n\n .w-194\\.25 {\n width: calc(var(--spacing) * 194.25);\n }\n\n .w-198\\.25 {\n width: calc(var(--spacing) * 198.25);\n }\n\n .w-270 {\n width: calc(var(--spacing) * 270);\n }\n\n .w-282 {\n width: calc(var(--spacing) * 282);\n }\n\n .w-286 {\n width: calc(var(--spacing) * 286);\n }\n\n .w-293\\.5 {\n width: calc(var(--spacing) * 293.5);\n }\n\n .w-294 {\n width: calc(var(--spacing) * 294);\n }\n\n .w-\\[10\\.5rem\\] {\n width: 10.5rem;\n }\n\n .w-\\[calc\\(100\\%-10px\\)\\] {\n width: calc(100% - 10px);\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-px {\n width: 1px;\n }\n\n .max-w-36 {\n max-width: calc(var(--spacing) * 36);\n }\n\n .max-w-38 {\n max-width: var(--spacing-38);\n }\n\n .max-w-43 {\n max-width: var(--spacing-43);\n }\n\n .max-w-44 {\n max-width: calc(var(--spacing) * 44);\n }\n\n .max-w-51\\.5 {\n max-width: calc(var(--spacing) * 51.5);\n }\n\n .max-w-65 {\n max-width: calc(var(--spacing) * 65);\n }\n\n .max-w-95 {\n max-width: calc(var(--spacing) * 95);\n }\n\n .max-w-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\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-4 {\n min-width: calc(var(--spacing) * 4);\n }\n\n .min-w-10 {\n min-width: calc(var(--spacing) * 10);\n }\n\n .min-w-20 {\n min-width: calc(var(--spacing) * 20);\n }\n\n .min-w-30 {\n min-width: var(--spacing-30);\n }\n\n .min-w-32 {\n min-width: calc(var(--spacing) * 32);\n }\n\n .min-w-36 {\n min-width: calc(var(--spacing) * 36);\n }\n\n .min-w-44 {\n min-width: calc(var(--spacing) * 44);\n }\n\n .min-w-50 {\n min-width: var(--spacing-50);\n }\n\n .min-w-53\\.25 {\n min-width: calc(var(--spacing) * 53.25);\n }\n\n .min-w-55 {\n min-width: calc(var(--spacing) * 55);\n }\n\n .min-w-160 {\n min-width: calc(var(--spacing) * 160);\n }\n\n .min-w-\\[8\\.2rem\\] {\n min-width: 8.2rem;\n }\n\n .min-w-fit {\n min-width: fit-content;\n }\n\n .min-w-full {\n min-width: 100%;\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .flex-shrink {\n flex-shrink: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .border-collapse {\n border-collapse: collapse;\n }\n\n .-translate-x-1 {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-x-1 {\n --tw-translate-x: var(--spacing);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .scale-\\[1\\.02\\] {\n scale: 1.02;\n }\n\n .rotate-180 {\n rotate: 180deg;\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-grab {\n cursor: grab;\n }\n\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .cursor-text {\n cursor: text;\n }\n\n .touch-none {\n touch-action: none;\n }\n\n .resize {\n resize: both;\n }\n\n .appearance-none {\n appearance: none;\n }\n\n .grid-cols-\\[7\\.5rem_7\\.5rem_7\\.5rem\\] {\n grid-template-columns: 7.5rem 7.5rem 7.5rem;\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-baseline {\n align-items: baseline;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-start {\n align-items: flex-start;\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 {\n gap: 0;\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-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n\n .gap-1\\.25 {\n gap: calc(var(--spacing) * 1.25);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .gap-2\\.25 {\n gap: calc(var(--spacing) * 2.25);\n }\n\n .gap-2\\.75 {\n gap: calc(var(--spacing) * 2.75);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n\n .gap-5 {\n gap: calc(var(--spacing) * 5);\n }\n\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n\n .gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n\n .gap-8\\.75 {\n gap: calc(var(--spacing) * 8.75);\n }\n\n .gap-12 {\n gap: calc(var(--spacing) * 12);\n }\n\n .gap-19 {\n gap: calc(var(--spacing) * 19);\n }\n\n .gap-\\[0\\.625rem\\] {\n gap: .625rem;\n }\n\n .gap-\\[0\\.53125rem\\] {\n gap: .53125rem;\n }\n\n .gap-\\[2\\%\\] {\n gap: 2%;\n }\n\n .gap-px {\n gap: 1px;\n }\n\n :where(.space-y-1 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));\n margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-2 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.space-y-3 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n .gap-x-1 {\n column-gap: var(--spacing);\n }\n\n .gap-x-2 {\n column-gap: calc(var(--spacing) * 2);\n }\n\n .gap-x-4 {\n column-gap: calc(var(--spacing) * 4);\n }\n\n .gap-x-6 {\n column-gap: calc(var(--spacing) * 6);\n }\n\n .gap-y-0\\.75 {\n row-gap: calc(var(--spacing) * .75);\n }\n\n .gap-y-1 {\n row-gap: var(--spacing);\n }\n\n .self-end {\n align-self: flex-end;\n }\n\n .self-start {\n align-self: flex-start;\n }\n\n .truncate {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-visible {\n overflow: visible;\n }\n\n .overflow-x-auto {\n overflow-x: auto;\n }\n\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-y-hidden {\n overflow-y: hidden;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-full {\n border-radius: 3.40282e38px;\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-none {\n border-radius: 0;\n }\n\n .rounded-none\\! {\n border-radius: 0 !important;\n }\n\n .rounded-t-lg {\n border-top-left-radius: var(--radius-lg);\n border-top-right-radius: var(--radius-lg);\n }\n\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n\n .rounded-t-xl {\n border-top-left-radius: var(--radius-xl);\n border-top-right-radius: var(--radius-xl);\n }\n\n .rounded-l-xl {\n border-top-left-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .rounded-tl-xl {\n border-top-left-radius: var(--radius-xl);\n }\n\n .rounded-r-md {\n border-top-right-radius: var(--radius-md);\n border-bottom-right-radius: var(--radius-md);\n }\n\n .rounded-tr-xl {\n border-top-right-radius: var(--radius-xl);\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 .rounded-b-md {\n border-bottom-right-radius: var(--radius-md);\n border-bottom-left-radius: var(--radius-md);\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: var(--radius-xl);\n border-bottom-left-radius: var(--radius-xl);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .border-2 {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n\n .border-x {\n border-inline-style: var(--tw-border-style);\n border-inline-width: 1px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-t-0 {\n border-top-style: var(--tw-border-style);\n border-top-width: 0;\n }\n\n .border-t-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\n }\n\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .border-r-0 {\n border-right-style: var(--tw-border-style);\n border-right-width: 0;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-b-0 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .border-b-2 {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 2px;\n }\n\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .border-l-0 {\n border-left-style: var(--tw-border-style);\n border-left-width: 0;\n }\n\n .border-l-4 {\n border-left-style: var(--tw-border-style);\n border-left-width: 4px;\n }\n\n .border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n\n .border-\\(--axebow-border-gray\\) {\n border-color: var(--axebow-border-gray);\n }\n\n .border-\\(--axebow-dark-yellow\\) {\n border-color: var(--axebow-dark-yellow);\n }\n\n .border-\\(--axebow-error-border\\) {\n border-color: var(--axebow-error-border);\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-premium-text\\) {\n border-color: var(--axebow-premium-text);\n }\n\n .border-\\(--axebow-primary\\) {\n border-color: var(--axebow-primary);\n }\n\n .border-\\(--axebow-secondary\\) {\n border-color: var(--axebow-secondary);\n }\n\n .border-\\(--axebow-table-border\\) {\n border-color: var(--axebow-table-border);\n }\n\n .border-\\(--axebow-table-header-border\\) {\n border-color: var(--axebow-table-header-border);\n }\n\n .border-\\(--axebow-tertiary\\) {\n border-color: var(--axebow-tertiary);\n }\n\n .border-\\[\\#344966\\] {\n border-color: #344966;\n }\n\n .border-\\[\\#DBDDE4\\] {\n border-color: #dbdde4;\n }\n\n .border-\\[var\\(--axebow-error\\)\\] {\n border-color: var(--axebow-error);\n }\n\n .border-\\[var\\(--axebow-gray\\)\\] {\n border-color: var(--axebow-gray);\n }\n\n .border-\\[var\\(--axebow-tertiary\\)\\] {\n border-color: var(--axebow-tertiary);\n }\n\n .border-black {\n border-color: var(--color-black);\n }\n\n .border-black\\/10 {\n border-color: #0000001a;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-black\\/10 {\n border-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n\n .border-blue-200 {\n border-color: var(--color-blue-200);\n }\n\n .border-gray-100 {\n border-color: var(--color-gray-100);\n }\n\n .border-gray-200 {\n border-color: var(--color-gray-200);\n }\n\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n\n .border-gray-400 {\n border-color: var(--color-gray-400);\n }\n\n .border-gray-500 {\n border-color: var(--color-gray-500);\n }\n\n .border-green-200 {\n border-color: var(--color-green-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-white {\n border-color: var(--color-white);\n }\n\n .bg-\\(--axebow-anti-flash-white\\) {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .bg-\\(--axebow-base\\) {\n background-color: var(--axebow-base);\n }\n\n .bg-\\(--axebow-error\\) {\n background-color: var(--axebow-error);\n }\n\n .bg-\\(--axebow-error-bg\\) {\n background-color: var(--axebow-error-bg);\n }\n\n .bg-\\(--axebow-gray\\) {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\(--axebow-light-gray\\), .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: var(--axebow-light-gray);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-light-gray\\)\\/80 {\n background-color: color-mix(in oklab, var(--axebow-light-gray) 80%, transparent);\n }\n }\n\n .bg-\\(--axebow-primary\\) {\n background-color: var(--axebow-primary);\n }\n\n .bg-\\(--axebow-primary-light\\) {\n background-color: var(--axebow-primary-light);\n }\n\n .bg-\\(--axebow-success\\) {\n background-color: var(--axebow-success);\n }\n\n .bg-\\(--axebow-tertiary\\), .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: var(--axebow-tertiary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-\\(--axebow-tertiary\\)\\/15 {\n background-color: color-mix(in oklab, var(--axebow-tertiary) 15%, transparent);\n }\n }\n\n .bg-\\(--axebow-warning\\) {\n background-color: var(--axebow-warning);\n }\n\n .bg-\\(--axebow-warning-bg\\) {\n background-color: var(--axebow-warning-bg);\n }\n\n .bg-\\(--axebow-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-\\[\\#006BFF\\] {\n background-color: #006bff;\n }\n\n .bg-\\[\\#C7DCFA\\] {\n background-color: #c7dcfa;\n }\n\n .bg-\\[\\#F0F1F5\\] {\n background-color: #f0f1f5;\n }\n\n .bg-blue-50 {\n background-color: var(--color-blue-50);\n }\n\n .bg-gray-50 {\n background-color: var(--color-gray-50);\n }\n\n .bg-gray-50\\/50 {\n background-color: #f9fafb80;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-gray-50\\/50 {\n background-color: color-mix(in oklab, var(--color-gray-50) 50%, transparent);\n }\n }\n\n .bg-gray-100 {\n background-color: var(--color-gray-100);\n }\n\n .bg-gray-200 {\n background-color: var(--color-gray-200);\n }\n\n .bg-gray-300 {\n background-color: var(--color-gray-300);\n }\n\n .bg-green-50 {\n background-color: var(--color-green-50);\n }\n\n .bg-red-50 {\n background-color: var(--color-red-50);\n }\n\n .bg-red-100 {\n background-color: var(--color-red-100);\n }\n\n .bg-sky-50 {\n background-color: var(--color-sky-50);\n }\n\n .bg-sky-100 {\n background-color: var(--color-sky-100);\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-0 {\n padding: 0;\n }\n\n .p-1 {\n padding: var(--spacing);\n }\n\n .p-1\\.5 {\n padding: calc(var(--spacing) * 1.5);\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n\n .p-3\\.25 {\n padding: calc(var(--spacing) * 3.25);\n }\n\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n\n .p-5 {\n padding: calc(var(--spacing) * 5);\n }\n\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n\n .px-0\\.5 {\n padding-inline: calc(var(--spacing) * .5);\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-3\\.5 {\n padding-inline: calc(var(--spacing) * 3.5);\n }\n\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\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-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .py-1\\.25 {\n padding-block: calc(var(--spacing) * 1.25);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n\n .py-2\\.75 {\n padding-block: calc(var(--spacing) * 2.75);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n\n .py-4\\.75 {\n padding-block: calc(var(--spacing) * 4.75);\n }\n\n .py-8 {\n padding-block: calc(var(--spacing) * 8);\n }\n\n .ps-4 {\n padding-inline-start: calc(var(--spacing) * 4);\n }\n\n .ps-8 {\n padding-inline-start: calc(var(--spacing) * 8);\n }\n\n .pe-4 {\n padding-inline-end: calc(var(--spacing) * 4);\n }\n\n .pt-0\\.5 {\n padding-top: calc(var(--spacing) * .5);\n }\n\n .pt-1 {\n padding-top: var(--spacing);\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n\n .pt-6 {\n padding-top: calc(var(--spacing) * 6);\n }\n\n .pt-8 {\n padding-top: calc(var(--spacing) * 8);\n }\n\n .pt-px {\n padding-top: 1px;\n }\n\n .pr-1 {\n padding-right: var(--spacing);\n }\n\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .pr-3\\.25 {\n padding-right: calc(var(--spacing) * 3.25);\n }\n\n .pr-4 {\n padding-right: calc(var(--spacing) * 4);\n }\n\n .pr-4\\.5 {\n padding-right: calc(var(--spacing) * 4.5);\n }\n\n .pr-5 {\n padding-right: calc(var(--spacing) * 5);\n }\n\n .pb-0 {\n padding-bottom: 0;\n }\n\n .pb-1 {\n padding-bottom: var(--spacing);\n }\n\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .pb-3\\.5 {\n padding-bottom: calc(var(--spacing) * 3.5);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n\n .pl-1 {\n padding-left: var(--spacing);\n }\n\n .pl-1\\.5 {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n\n .pl-4\\.25 {\n padding-left: calc(var(--spacing) * 4.25);\n }\n\n .pl-5 {\n padding-left: calc(var(--spacing) * 5);\n }\n\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n\n .pl-11\\.75 {\n padding-left: calc(var(--spacing) * 11.75);\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-right {\n text-align: right;\n }\n\n .text-start {\n text-align: start;\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 .font-\\[inherit\\] {\n font-family: inherit;\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-md {\n font-size: var(--text-md);\n line-height: var(--tw-leading, var(--text-md--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 .text-\\[0\\.9375rem\\] {\n font-size: .9375rem;\n }\n\n .text-\\[1\\.25rem\\] {\n font-size: 1.25rem;\n }\n\n .text-\\[18px\\] {\n font-size: 18px;\n }\n\n .leading-3\\.5 {\n --tw-leading: calc(var(--spacing) * 3.5);\n line-height: calc(var(--spacing) * 3.5);\n }\n\n .leading-4\\.5 {\n --tw-leading: calc(var(--spacing) * 4.5);\n line-height: calc(var(--spacing) * 4.5);\n }\n\n .leading-4\\.25 {\n --tw-leading: calc(var(--spacing) * 4.25);\n line-height: calc(var(--spacing) * 4.25);\n }\n\n .leading-\\[1\\.21875rem\\] {\n --tw-leading: 1.21875rem;\n line-height: 1.21875rem;\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n }\n\n .font-black {\n --tw-font-weight: var(--font-weight-black);\n font-weight: var(--font-weight-black);\n }\n\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\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 .tracking-wider {\n --tw-tracking: var(--tracking-wider);\n letter-spacing: var(--tracking-wider);\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .break-all {\n word-break: break-all;\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-normal {\n white-space: normal;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\(--axebow-anti-flash-white\\) {\n color: var(--axebow-anti-flash-white);\n }\n\n .text-\\(--axebow-black\\) {\n color: var(--axebow-black);\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-strong-gray\\) {\n color: var(--axebow-strong-gray);\n }\n\n .text-\\(--axebow-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\(--axebow-text-gray\\) {\n color: var(--axebow-text-gray);\n }\n\n .text-\\[\\#8A94AE\\] {\n color: #8a94ae;\n }\n\n .text-\\[\\#78787A\\] {\n color: #78787a;\n }\n\n .text-\\[\\#344966\\] {\n color: #344966;\n }\n\n .text-\\[\\#E93A3A\\] {\n color: #e93a3a;\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-black {\n color: var(--color-black);\n }\n\n .text-blue-600 {\n color: var(--color-blue-600);\n }\n\n .text-blue-800 {\n color: var(--color-blue-800);\n }\n\n .text-gray-300 {\n color: var(--color-gray-300);\n }\n\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n\n .text-gray-500 {\n color: var(--color-gray-500);\n }\n\n .text-gray-600 {\n color: var(--color-gray-600);\n }\n\n .text-gray-700 {\n color: var(--color-gray-700);\n }\n\n .text-green-600 {\n color: var(--color-green-600);\n }\n\n .text-green-800 {\n color: var(--color-green-800);\n }\n\n .text-inherit {\n color: inherit;\n }\n\n .text-red-800 {\n color: var(--color-red-800);\n }\n\n .text-white {\n color: var(--color-white);\n }\n\n .text-yellow-600 {\n color: var(--color-yellow-600);\n }\n\n .text-yellow-800 {\n color: var(--color-yellow-800);\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .italic {\n font-style: italic;\n }\n\n .not-italic {\n font-style: normal;\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .decoration-\\(--axebow-error\\) {\n -webkit-text-decoration-color: var(--axebow-error);\n -webkit-text-decoration-color: var(--axebow-error);\n text-decoration-color: var(--axebow-error);\n }\n\n .placeholder-gray-400::placeholder {\n color: var(--color-gray-400);\n }\n\n .opacity-0 {\n opacity: 0;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-60 {\n opacity: .6;\n }\n\n .opacity-70 {\n opacity: .7;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .shadow-\\[0_-8px_8px_-8px_rgba\\(13\\,24\\,33\\,0\\.15\\)\\] {\n --tw-shadow: 0 -8px 8px -8px var(--tw-shadow-color, #0d182126);\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 .shadow-\\[0_2px_6px_rgba\\(0\\,0\\,0\\,0\\.2\\)\\] {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0003);\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 .shadow-\\[0_4px_12px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 0 4px 12px 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 .shadow-\\[0_6px_16px_rgba\\(13\\,24\\,33\\,0\\.18\\)\\] {\n --tw-shadow: 0 6px 16px var(--tw-shadow-color, #0d18212e);\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 .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 .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px 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 .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px 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 .shadow-none {\n --tw-shadow: 0 0 #0000;\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 .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px 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 .axebow-shadow-hover {\n transition: box-shadow .2s ease-in-out;\n }\n\n .axebow-shadow-hover:hover {\n box-shadow: 0 4px 12px #0d182114;\n }\n\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .blur {\n --tw-blur: blur(8px);\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 .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 .filter {\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 {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\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-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-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\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-opacity {\n transition-property: opacity;\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 .transition-transform {\n transition-property: transform, translate, scale, rotate;\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 .delay-100 {\n transition-delay: .1s;\n }\n\n .duration-120 {\n --tw-duration: .12s;\n transition-duration: .12s;\n }\n\n .duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .duration-300 {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .select-none {\n -webkit-user-select: none;\n user-select: none;\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 .group-hover\\:translate-x-0:is(:where(.group):hover *) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-hover\\:rotate-15:is(:where(.group):hover *) {\n rotate: 15deg;\n }\n\n .group-hover\\:font-semibold:is(:where(.group):hover *) {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .group-hover\\:text-\\(--axebow-gray\\):is(:where(.group):hover *) {\n color: var(--axebow-gray);\n }\n\n .group-hover\\:text-\\(--axebow-primary\\):is(:where(.group):hover *) {\n color: var(--axebow-primary);\n }\n\n .group-hover\\:opacity-100:is(:where(.group):hover *) {\n opacity: 1;\n }\n }\n\n .last\\:border-b-0:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .focus-within\\:border-black:focus-within {\n border-color: var(--color-black);\n }\n\n .focus-within\\:border-blue-500:focus-within {\n border-color: var(--color-blue-500);\n }\n\n .focus-within\\:ring-2:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\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 .focus-within\\:ring-blue-100:focus-within {\n --tw-ring-color: var(--color-blue-100);\n }\n\n @media (hover: hover) {\n .hover\\:scale-105:hover {\n --tw-scale-x: 105%;\n --tw-scale-y: 105%;\n --tw-scale-z: 105%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .hover\\:border-\\(--axebow-gray\\):hover {\n border-color: var(--axebow-gray);\n }\n\n .hover\\:border-\\(--axebow-tertiary\\):hover, .hover\\:border-\\[var\\(--axebow-tertiary\\)\\]:hover {\n border-color: var(--axebow-tertiary);\n }\n\n .hover\\:border-red-300:hover {\n border-color: var(--color-red-300);\n }\n\n .hover\\:bg-\\(--axebow-anti-flash-white\\):hover {\n background-color: var(--axebow-anti-flash-white);\n }\n\n .hover\\:bg-\\(--axebow-base\\):hover {\n background-color: var(--axebow-base);\n }\n\n .hover\\:bg-\\(--axebow-gray\\):hover {\n background-color: var(--axebow-gray);\n }\n\n .hover\\:bg-\\(--axebow-light-gray\\):hover {\n background-color: var(--axebow-light-gray);\n }\n\n .hover\\:bg-\\(--axebow-primary\\):hover {\n background-color: var(--axebow-primary);\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-50:hover {\n background-color: var(--color-gray-50);\n }\n\n .hover\\:bg-gray-100:hover {\n background-color: var(--color-gray-100);\n }\n\n .hover\\:bg-gray-200:hover {\n background-color: var(--color-gray-200);\n }\n\n .hover\\:bg-red-50:hover {\n background-color: var(--color-red-50);\n }\n\n .hover\\:bg-white:hover {\n background-color: var(--color-white);\n }\n\n .hover\\:font-semibold:hover {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .hover\\:text-\\(--axebow-error\\):hover {\n color: var(--axebow-error);\n }\n\n .hover\\:text-\\(--axebow-gray\\):hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:text-\\(--axebow-primary\\):hover {\n color: var(--axebow-primary);\n }\n\n .hover\\:text-\\(--axebow-tertiary\\):hover {\n color: var(--axebow-tertiary);\n }\n\n .hover\\:text-black:hover {\n color: var(--color-black);\n }\n\n .hover\\:text-gray-700:hover {\n color: var(--color-gray-700);\n }\n\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .hover\\:opacity-80:hover {\n opacity: .8;\n }\n\n .hover\\:opacity-100:hover {\n opacity: 1;\n }\n\n .hover\\:shadow-\\[0_2px_6px_rgba\\(13\\,24\\,33\\,0\\.14\\)\\]:hover {\n --tw-shadow: 0 2px 6px var(--tw-shadow-color, #0d182124);\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 .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 .focus\\:outline-2:focus {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus\\:outline-offset-1:focus {\n outline-offset: 1px;\n }\n\n .focus\\:outline-blue-500:focus {\n outline-color: var(--color-blue-500);\n }\n\n .focus\\:outline-none:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\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 .focus-visible\\:ring-\\[\\#006BFF\\]:focus-visible {\n --tw-ring-color: #006bff;\n }\n\n .focus-visible\\:outline-2:focus-visible {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n\n .focus-visible\\:outline-\\(--axebow-tertiary\\):focus-visible {\n outline-color: var(--axebow-tertiary);\n }\n\n .active\\:cursor-grabbing:active {\n cursor: grabbing;\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 @media (min-width: 48rem) {\n .md\\:gap-8 {\n gap: calc(var(--spacing) * 8);\n }\n }\n\n @media (min-width: 64rem) {\n .lg\\:sticky {\n position: sticky;\n }\n\n .lg\\:block {\n display: block;\n }\n\n .lg\\:flex {\n display: flex;\n }\n\n .lg\\:hidden {\n display: none;\n }\n\n .lg\\:inline {\n display: inline;\n }\n\n .lg\\:min-h-\\(--card-height\\) {\n min-height: var(--card-height);\n }\n\n .lg\\:min-h-\\[calc\\(100vh-7\\.25rem\\)\\] {\n min-height: calc(100vh - 7.25rem);\n }\n\n .lg\\:w-\\(--card-width\\) {\n width: var(--card-width);\n }\n\n .lg\\:min-w-150 {\n min-width: var(--spacing-150);\n }\n\n .lg\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:rounded-md {\n border-radius: var(--radius-md);\n }\n\n .lg\\:border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .lg\\:text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .lg\\:text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n\n .lg\\:shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px 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}\n\n:host {\n font-family: var(--font-sans);\n font-size: var(--text-base);\n line-height: var(--text-base--line-height);\n --font-sans: \"Open Sans\", sans-serif;\n --text-xs: .625rem;\n --text-xs--line-height: .875rem;\n --text-sm: .75rem;\n --text-sm--line-height: 1rem;\n --text-base: .875rem;\n --text-base--line-height: 1.25rem;\n --text-md: 1rem;\n --text-md--line-height: 1.5rem;\n --text-lg: 1.125rem;\n --text-lg--line-height: 1.75rem;\n --text-xl: 1.25rem;\n --text-xl--line-height: 1.75rem;\n --text-2xl: 1.5rem;\n --text-2xl--line-height: 2rem;\n --text-3xl: 1.875rem;\n --text-3xl--line-height: 2.25rem;\n --text-4xl: 2.25rem;\n --text-4xl--line-height: 2.5rem;\n --text-5xl: 3rem;\n --text-5xl--line-height: 1;\n --text-6xl: 3.75rem;\n --text-6xl--line-height: 1;\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --text-8xl: 4.625rem;\n --text-8xl--line-height: 1;\n --text-9xl: 6.125rem;\n --text-9xl--line-height: 1;\n}\n\n:root {\n --sl-font-sans: \"Open Sans\", sans-serif;\n --sl-font-size-2x-small: var(--text-xs);\n --sl-font-size-x-small: var(--text-xs);\n --sl-font-size-small: var(--text-sm);\n --sl-font-size-medium: var(--text-base);\n --sl-font-size-large: var(--text-md);\n --sl-font-size-x-large: var(--text-lg);\n --sl-font-size-2x-large: var(--text-xl);\n --sl-font-size-3x-large: var(--text-3xl);\n --sl-font-size-4x-large: var(--text-5xl);\n --sl-input-font-size-small: var(--text-sm);\n --sl-input-font-size-medium: var(--text-base);\n --sl-input-font-size-large: var(--text-md);\n --sl-button-font-size-small: var(--text-sm);\n --sl-button-font-size-medium: var(--text-base);\n --sl-button-font-size-large: var(--text-md);\n --sl-tooltip-font-size: var(--text-base);\n}\n\nbutton, input, select, textarea {\n font-family: inherit;\n font-size: inherit;\n}\n\ninput, select, textarea, sl-menu-item::part(label), sl-option::part(label) {\n font-size: var(--text-base);\n}\n\n:root {\n --axebow-scrollbar-line-color: var(--axebow-tertiary, #e51c8e);\n --axebow-scrollbar-track-color: #f0f1f5;\n --axebow-scrollbar-thumb-color: #cbd5e1;\n --axebow-scrollbar-thumb-hover-color: #94a3b8;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar {\n border-left: 2px solid var(--axebow-scrollbar-line-color);\n width: 11px;\n height: 11px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-button {\n display: none;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-track {\n background-color: var(--axebow-scrollbar-track-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb {\n background-color: var(--axebow-scrollbar-thumb-color);\n background-clip: padding-box;\n border: 2px solid #0000;\n border-left-width: 3px;\n border-radius: 9999px;\n}\n\nsl-select::part(listbox)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-dropdown::part(panel)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-menu::part(base)::-webkit-scrollbar-thumb:hover {\n background-color: var(--axebow-scrollbar-thumb-hover-color);\n}\n\nsl-select::part(listbox), sl-dropdown::part(panel), sl-menu::part(base) {\n scrollbar-width: thin;\n scrollbar-color: var(--axebow-scrollbar-thumb-color) transparent;\n}\n\nsl-select::part(listbox), sl-select::part(menu) {\n width: max-content !important;\n min-width: 100% !important;\n max-width: 90vw !important;\n}\n\n:root, sl-input::part(base), sl-select::part(combobox), sl-textarea::part(base) {\n --sl-input-focus-ring-color: transparent;\n --sl-input-border-color-focus: var(--axebow-black, #000);\n --sl-focus-ring-color: transparent;\n}\n\nsl-input:focus-within::part(base), sl-select:focus-within::part(combobox), sl-textarea:focus-within::part(base) {\n border-color: var(--axebow-black, #000) !important;\n box-shadow: none !important;\n outline: none !important;\n}\n\n.axebow-blue-button::part(base) {\n background-color: var(--axebow-tertiary);\n}\n\n.info-container-page {\n flex-wrap: wrap;\n gap: 2rem;\n display: flex;\n}\n\nsl-divider {\n background: var(--axebow-light-gray);\n height: 1px;\n margin-top: .5rem;\n margin-bottom: .5rem;\n}\n\n.axebow-shadow {\n box-shadow: 2px 2px 25px #0000001a;\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\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-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\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-tracking {\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-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\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\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n";
|
|
202
220
|
//#endregion
|
|
203
221
|
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/decorate.js
|
|
204
222
|
function __decorate(decorators, target, key, desc) {
|
|
@@ -1576,6 +1594,65 @@ __decorate([property({ type: String })], AxebowHeader.prototype, "markAllAsReadL
|
|
|
1576
1594
|
__decorate([property({ attribute: false })], AxebowHeader.prototype, "onMarkAllAsRead", void 0);
|
|
1577
1595
|
AxebowHeader = __decorate([customElement("axebow-header")], AxebowHeader);
|
|
1578
1596
|
//#endregion
|
|
1597
|
+
//#region src/components/axebow-divider/axebow-divider.ts
|
|
1598
|
+
var AxebowDivider = class AxebowDivider extends LitElement {
|
|
1599
|
+
constructor(..._args) {
|
|
1600
|
+
super(..._args);
|
|
1601
|
+
this.type = "solid";
|
|
1602
|
+
this.width = "100%";
|
|
1603
|
+
this.color = "var(--axebow-light-gray)";
|
|
1604
|
+
this.margin = "0.5rem 0";
|
|
1605
|
+
this.thickness = "1px";
|
|
1606
|
+
}
|
|
1607
|
+
static {
|
|
1608
|
+
this.styles = [
|
|
1609
|
+
unsafeCSS(tailwind_default),
|
|
1610
|
+
axebowTheme,
|
|
1611
|
+
css`
|
|
1612
|
+
:host {
|
|
1613
|
+
display: block;
|
|
1614
|
+
width: 100%;
|
|
1615
|
+
}
|
|
1616
|
+
.divider {
|
|
1617
|
+
box-sizing: border-box;
|
|
1618
|
+
border: none;
|
|
1619
|
+
}
|
|
1620
|
+
.divider.solid {
|
|
1621
|
+
height: var(--divider-thickness, 1px);
|
|
1622
|
+
background-color: var(--divider-color, var(--axebow-light-gray));
|
|
1623
|
+
}
|
|
1624
|
+
.divider.dashed {
|
|
1625
|
+
height: 0;
|
|
1626
|
+
border-top: var(--divider-thickness, 1px) dashed var(--divider-color, var(--axebow-light-gray));
|
|
1627
|
+
}
|
|
1628
|
+
.divider.dotted {
|
|
1629
|
+
height: 0;
|
|
1630
|
+
border-top: var(--divider-thickness, 1px) dotted var(--divider-color, var(--axebow-light-gray));
|
|
1631
|
+
}
|
|
1632
|
+
`
|
|
1633
|
+
];
|
|
1634
|
+
}
|
|
1635
|
+
render() {
|
|
1636
|
+
return html`
|
|
1637
|
+
<div
|
|
1638
|
+
class="divider ${this.type}"
|
|
1639
|
+
style="
|
|
1640
|
+
width: ${this.width};
|
|
1641
|
+
margin: ${this.margin};
|
|
1642
|
+
--divider-color: ${this.color};
|
|
1643
|
+
--divider-thickness: ${this.thickness};
|
|
1644
|
+
"
|
|
1645
|
+
></div>
|
|
1646
|
+
`;
|
|
1647
|
+
}
|
|
1648
|
+
};
|
|
1649
|
+
__decorate([property({ type: String })], AxebowDivider.prototype, "type", void 0);
|
|
1650
|
+
__decorate([property({ type: String })], AxebowDivider.prototype, "width", void 0);
|
|
1651
|
+
__decorate([property({ type: String })], AxebowDivider.prototype, "color", void 0);
|
|
1652
|
+
__decorate([property({ type: String })], AxebowDivider.prototype, "margin", void 0);
|
|
1653
|
+
__decorate([property({ type: String })], AxebowDivider.prototype, "thickness", void 0);
|
|
1654
|
+
AxebowDivider = __decorate([customElement("axebow-divider")], AxebowDivider);
|
|
1655
|
+
//#endregion
|
|
1579
1656
|
//#region src/components/axebow-sidebar/axebow-sidebar.ts
|
|
1580
1657
|
var AxebowSidebar = class AxebowSidebar extends LitElement {
|
|
1581
1658
|
constructor(..._args) {
|
|
@@ -1659,8 +1736,8 @@ var AxebowSidebar = class AxebowSidebar extends LitElement {
|
|
|
1659
1736
|
class="sidebar-nav h-full flex flex-col justify-between overflow-hidden pt-2"
|
|
1660
1737
|
>
|
|
1661
1738
|
<ul class="flex flex-col gap-0 w-full pb-1">
|
|
1662
|
-
${this.items.map((entry) => "divider" in entry ? html` <
|
|
1663
|
-
<
|
|
1739
|
+
${this.items.map((entry) => "divider" in entry ? html` <axebow-divider class="sidebar-divider w-[calc(100%-10px)] mx-auto my-1.5" margin="0"></axebow-divider> ` : this._renderNavItem(entry, this._isSelected(entry)))}
|
|
1740
|
+
<axebow-divider class="compact-divider hidden w-[calc(100%-10px)] mx-auto my-1.5" margin="0"></axebow-divider>
|
|
1664
1741
|
</ul>
|
|
1665
1742
|
<ul class="flex flex-col gap-0 w-full">
|
|
1666
1743
|
${this.bottomItems.map((item) => this._renderBottomItem(item))}
|
|
@@ -1886,6 +1963,7 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1886
1963
|
constructor(..._args) {
|
|
1887
1964
|
super(..._args);
|
|
1888
1965
|
this.value = "";
|
|
1966
|
+
this.type = "text";
|
|
1889
1967
|
this.placeholder = "";
|
|
1890
1968
|
this.label = "";
|
|
1891
1969
|
this.description = "";
|
|
@@ -1895,6 +1973,7 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1895
1973
|
this.errorMessage = "";
|
|
1896
1974
|
this.compact = false;
|
|
1897
1975
|
this.wrapDescription = false;
|
|
1976
|
+
this.descriptionLines = 2;
|
|
1898
1977
|
}
|
|
1899
1978
|
static {
|
|
1900
1979
|
this.baseStyles = [
|
|
@@ -1908,8 +1987,8 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1908
1987
|
sl-input::part(base),
|
|
1909
1988
|
sl-select::part(combobox) {
|
|
1910
1989
|
--sl-input-focus-ring-color: transparent;
|
|
1911
|
-
--sl-color-primary-600:
|
|
1912
|
-
--sl-input-border-color-focus:
|
|
1990
|
+
--sl-color-primary-600: var(--axebow-black, #000000);
|
|
1991
|
+
--sl-input-border-color-focus: var(--axebow-black, #000000);
|
|
1913
1992
|
border-radius: 0.375rem;
|
|
1914
1993
|
}
|
|
1915
1994
|
.input-error sl-input,
|
|
@@ -1940,25 +2019,29 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1940
2019
|
width: 100%;
|
|
1941
2020
|
min-width: 16.59375rem;
|
|
1942
2021
|
}
|
|
1943
|
-
.fixed-field .field-label
|
|
1944
|
-
.fixed-field .field-description {
|
|
2022
|
+
.fixed-field .field-label {
|
|
1945
2023
|
width: 100%;
|
|
1946
2024
|
height: 1.0625rem;
|
|
1947
2025
|
overflow: hidden;
|
|
1948
2026
|
white-space: nowrap;
|
|
1949
2027
|
text-overflow: ellipsis;
|
|
1950
|
-
}
|
|
1951
|
-
.fixed-field .field-label {
|
|
1952
2028
|
margin-bottom: 0.25rem;
|
|
1953
2029
|
}
|
|
1954
2030
|
.fixed-field .field-description {
|
|
2031
|
+
width: 100%;
|
|
1955
2032
|
margin-bottom: 0.5rem;
|
|
2033
|
+
overflow: hidden;
|
|
2034
|
+
white-space: normal;
|
|
2035
|
+
display: -webkit-box;
|
|
2036
|
+
-webkit-box-orient: vertical;
|
|
2037
|
+
-webkit-line-clamp: var(--axebow-input-description-lines, 2);
|
|
2038
|
+
line-clamp: var(--axebow-input-description-lines, 2);
|
|
2039
|
+
text-overflow: ellipsis;
|
|
2040
|
+
font-weight: normal;
|
|
1956
2041
|
}
|
|
1957
2042
|
.fixed-field.wrap-description .field-description {
|
|
1958
|
-
height: 2.125rem;
|
|
1959
2043
|
white-space: normal;
|
|
1960
2044
|
display: -webkit-box;
|
|
1961
|
-
-webkit-line-clamp: 2;
|
|
1962
2045
|
-webkit-box-orient: vertical;
|
|
1963
2046
|
}
|
|
1964
2047
|
`
|
|
@@ -1974,18 +2057,24 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1974
2057
|
return html`
|
|
1975
2058
|
<div class="flex flex-col justify-end w-full relative">
|
|
1976
2059
|
${!this.compact || this.label ? html`<div
|
|
1977
|
-
class="flex items-baseline gap-
|
|
2060
|
+
class="flex items-baseline gap-px"
|
|
1978
2061
|
style="margin-bottom: ${this.description ? "var(--axebow-input-label-gap, 1rem)" : "var(--axebow-input-field-gap, 0.5rem)"}"
|
|
1979
2062
|
>
|
|
1980
|
-
${this.required ? html`<p class="text-(--axebow-error)">*</p>` : ""}
|
|
1981
|
-
<h4 class="
|
|
2063
|
+
${this.required ? html`<p class="text-(--axebow-error) m-0 leading-none">*</p>` : ""}
|
|
2064
|
+
<h4 class="font-semibold text-base m-0">${this.label}</h4>
|
|
1982
2065
|
</div>` : ""}
|
|
1983
2066
|
${this.description ? html`<p
|
|
1984
|
-
class="
|
|
2067
|
+
class="overflow-hidden font-normal text-base"
|
|
1985
2068
|
style="
|
|
1986
2069
|
margin-bottom: var(--axebow-input-description-gap, 0.75rem);
|
|
1987
|
-
height: var(--axebow-input-description-height,
|
|
2070
|
+
height: var(--axebow-input-description-height, auto);
|
|
1988
2071
|
width: var(--axebow-input-description-width, 100%);
|
|
2072
|
+
display: -webkit-box;
|
|
2073
|
+
-webkit-box-orient: vertical;
|
|
2074
|
+
-webkit-line-clamp: ${this.descriptionLines};
|
|
2075
|
+
line-clamp: ${this.descriptionLines};
|
|
2076
|
+
text-overflow: ellipsis;
|
|
2077
|
+
white-space: normal;
|
|
1989
2078
|
"
|
|
1990
2079
|
title="${this.description}"
|
|
1991
2080
|
>
|
|
@@ -2007,15 +2096,20 @@ var AxebowInputBase = class extends LitElement {
|
|
|
2007
2096
|
renderFixedField(content) {
|
|
2008
2097
|
return html`
|
|
2009
2098
|
<div class="fixed-field ${this.wrapDescription ? "wrap-description" : ""}">
|
|
2010
|
-
${this.label ? html`<div class="flex items-baseline gap-
|
|
2099
|
+
${this.label ? html`<div class="flex items-baseline gap-px field-label">
|
|
2011
2100
|
${this.required ? html`<p class="text-(--axebow-error) text-base leading-4.25 m-0">*</p>` : ""}
|
|
2012
2101
|
<h4 class="font-semibold text-base leading-4.25 m-0 overflow-hidden text-ellipsis">
|
|
2013
2102
|
${this.label}
|
|
2014
2103
|
</h4>
|
|
2015
2104
|
</div>` : ""}
|
|
2016
2105
|
${this.description ? html`<p
|
|
2017
|
-
class="field-description text-base font-
|
|
2018
|
-
|
|
2106
|
+
class="field-description text-base font-normal leading-4.25 m-0"
|
|
2107
|
+
style="
|
|
2108
|
+
--axebow-input-description-lines: ${this.descriptionLines};
|
|
2109
|
+
-webkit-line-clamp: ${this.descriptionLines};
|
|
2110
|
+
line-clamp: ${this.descriptionLines};
|
|
2111
|
+
"
|
|
2112
|
+
title="${this.description}"
|
|
2019
2113
|
>
|
|
2020
2114
|
${this.description}
|
|
2021
2115
|
</p>` : ""}
|
|
@@ -2031,6 +2125,7 @@ var AxebowInputBase = class extends LitElement {
|
|
|
2031
2125
|
}
|
|
2032
2126
|
};
|
|
2033
2127
|
__decorate([property({ type: String })], AxebowInputBase.prototype, "value", void 0);
|
|
2128
|
+
__decorate([property({ type: String })], AxebowInputBase.prototype, "type", void 0);
|
|
2034
2129
|
__decorate([property({ type: String })], AxebowInputBase.prototype, "placeholder", void 0);
|
|
2035
2130
|
__decorate([property({ type: String })], AxebowInputBase.prototype, "label", void 0);
|
|
2036
2131
|
__decorate([property({ type: String })], AxebowInputBase.prototype, "description", void 0);
|
|
@@ -2042,6 +2137,7 @@ __decorate([property({ type: Number })], AxebowInputBase.prototype, "maxlength",
|
|
|
2042
2137
|
__decorate([property({ attribute: false })], AxebowInputBase.prototype, "callback", void 0);
|
|
2043
2138
|
__decorate([property({ type: Boolean })], AxebowInputBase.prototype, "compact", void 0);
|
|
2044
2139
|
__decorate([property({ type: Boolean })], AxebowInputBase.prototype, "wrapDescription", void 0);
|
|
2140
|
+
__decorate([property({ type: Number })], AxebowInputBase.prototype, "descriptionLines", void 0);
|
|
2045
2141
|
//#endregion
|
|
2046
2142
|
//#region src/components/axebow-input/axebow-text-input.ts
|
|
2047
2143
|
var AxebowTextInput = class AxebowTextInput extends AxebowInputBase {
|
|
@@ -2062,6 +2158,8 @@ var AxebowTextInput = class AxebowTextInput extends AxebowInputBase {
|
|
|
2062
2158
|
const inputContent = html`
|
|
2063
2159
|
<div class="${this.hasError ? "input-error" : ""}">
|
|
2064
2160
|
<sl-input
|
|
2161
|
+
type="${this.type}"
|
|
2162
|
+
?password-toggle="${this.type === "password"}"
|
|
2065
2163
|
@sl-input="${this.handleChange}"
|
|
2066
2164
|
placeholder="${this.placeholder}"
|
|
2067
2165
|
.value="${this.value}"
|
|
@@ -2324,6 +2422,7 @@ var AxebowSwitchInput = class AxebowSwitchInput extends LitElement {
|
|
|
2324
2422
|
this.label = "";
|
|
2325
2423
|
this.description = "";
|
|
2326
2424
|
this.disabled = false;
|
|
2425
|
+
this.descriptionLines = 2;
|
|
2327
2426
|
}
|
|
2328
2427
|
static {
|
|
2329
2428
|
this.styles = [
|
|
@@ -2346,7 +2445,20 @@ var AxebowSwitchInput = class AxebowSwitchInput extends LitElement {
|
|
|
2346
2445
|
return html`
|
|
2347
2446
|
<div class="flex flex-col">
|
|
2348
2447
|
<h4 class="font-semibold text-base leading-4.25 m-0 h-4.25 overflow-hidden text-ellipsis">${this.label}</h4>
|
|
2349
|
-
<p
|
|
2448
|
+
<p
|
|
2449
|
+
class="text-base font-normal leading-4.25 m-0 mt-1 overflow-hidden"
|
|
2450
|
+
style="
|
|
2451
|
+
display: -webkit-box;
|
|
2452
|
+
-webkit-box-orient: vertical;
|
|
2453
|
+
-webkit-line-clamp: ${this.descriptionLines};
|
|
2454
|
+
line-clamp: ${this.descriptionLines};
|
|
2455
|
+
text-overflow: ellipsis;
|
|
2456
|
+
white-space: normal;
|
|
2457
|
+
"
|
|
2458
|
+
title="${this.description}"
|
|
2459
|
+
>
|
|
2460
|
+
${this.description}
|
|
2461
|
+
</p>
|
|
2350
2462
|
<sl-switch
|
|
2351
2463
|
class="mt-4.5"
|
|
2352
2464
|
style="--sl-color-primary-600: var(--axebow-success);"
|
|
@@ -2363,6 +2475,7 @@ __decorate([property({ type: String })], AxebowSwitchInput.prototype, "label", v
|
|
|
2363
2475
|
__decorate([property({ type: String })], AxebowSwitchInput.prototype, "description", void 0);
|
|
2364
2476
|
__decorate([property({ type: Boolean })], AxebowSwitchInput.prototype, "disabled", void 0);
|
|
2365
2477
|
__decorate([property({ attribute: false })], AxebowSwitchInput.prototype, "callback", void 0);
|
|
2478
|
+
__decorate([property({ type: Number })], AxebowSwitchInput.prototype, "descriptionLines", void 0);
|
|
2366
2479
|
AxebowSwitchInput = __decorate([customElement("axebow-switch-input")], AxebowSwitchInput);
|
|
2367
2480
|
//#endregion
|
|
2368
2481
|
//#region src/components/axebow-input/axebow-carousel-input.ts
|
|
@@ -2370,7 +2483,7 @@ var SELECTOR_MAX_WIDTH_PX = 720;
|
|
|
2370
2483
|
var CARD_HEIGHT_PX = 54;
|
|
2371
2484
|
var CARD_GAP_PX = 12;
|
|
2372
2485
|
function slidesPerPageFor$1(containerWidthPx) {
|
|
2373
|
-
return (containerWidthPx + CARD_GAP_PX) /
|
|
2486
|
+
return (containerWidthPx + CARD_GAP_PX) / 142;
|
|
2374
2487
|
}
|
|
2375
2488
|
var AxebowCarouselInput = class AxebowCarouselInput extends AxebowInputBase {
|
|
2376
2489
|
constructor(..._args) {
|
|
@@ -2448,31 +2561,117 @@ __decorate([state()], AxebowCarouselInput.prototype, "_slidesPerPage", void 0);
|
|
|
2448
2561
|
__decorate([query("sl-carousel")], AxebowCarouselInput.prototype, "_carouselEl", void 0);
|
|
2449
2562
|
AxebowCarouselInput = __decorate([customElement("axebow-carousel-input")], AxebowCarouselInput);
|
|
2450
2563
|
//#endregion
|
|
2451
|
-
//#region src/components/axebow-
|
|
2452
|
-
var
|
|
2564
|
+
//#region src/components/axebow-selector-card/axebow-selector-card.ts
|
|
2565
|
+
var AxebowSelectorCard = class AxebowSelectorCard extends LitElement {
|
|
2453
2566
|
constructor(..._args) {
|
|
2454
2567
|
super(..._args);
|
|
2455
|
-
this.
|
|
2568
|
+
this.cardId = "";
|
|
2569
|
+
this.logoSrc = "";
|
|
2570
|
+
this.selected = false;
|
|
2571
|
+
this.disabled = false;
|
|
2456
2572
|
}
|
|
2457
2573
|
static {
|
|
2458
|
-
this.styles = [
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2574
|
+
this.styles = [
|
|
2575
|
+
unsafeCSS(tailwind_default),
|
|
2576
|
+
axebowTheme,
|
|
2577
|
+
css`
|
|
2578
|
+
:host {
|
|
2579
|
+
display: block;
|
|
2580
|
+
width: 100%;
|
|
2581
|
+
height: 100%;
|
|
2582
|
+
}
|
|
2583
|
+
.card-wrapper {
|
|
2584
|
+
position: relative;
|
|
2585
|
+
gap: calc(var(--spacing) * 0.5);
|
|
2586
|
+
border-color: var(--color-gray-200);
|
|
2587
|
+
background-color: transparent;
|
|
2588
|
+
width: 100%;
|
|
2589
|
+
height: 100%;
|
|
2590
|
+
box-sizing: border-box;
|
|
2591
|
+
}
|
|
2592
|
+
@media (min-width: 48rem) {
|
|
2593
|
+
.card-wrapper {
|
|
2594
|
+
gap: var(--spacing);
|
|
2595
|
+
}
|
|
2596
|
+
}
|
|
2597
|
+
@media (min-width: 64rem) {
|
|
2598
|
+
.card-wrapper {
|
|
2599
|
+
gap: calc(var(--spacing) * 2);
|
|
2600
|
+
}
|
|
2462
2601
|
}
|
|
2463
|
-
.
|
|
2602
|
+
.card-wrapper:not(.selected):hover {
|
|
2464
2603
|
border-color: var(--axebow-tertiary);
|
|
2465
2604
|
}
|
|
2466
|
-
.
|
|
2605
|
+
.card-wrapper.selected {
|
|
2467
2606
|
border-color: var(--axebow-primary);
|
|
2468
2607
|
background-color: var(--axebow-white);
|
|
2469
|
-
cursor: default;
|
|
2470
2608
|
}
|
|
2471
|
-
.
|
|
2472
|
-
|
|
2473
|
-
|
|
2609
|
+
.registry-logo {
|
|
2610
|
+
height: calc(var(--spacing) * 3);
|
|
2611
|
+
aspect-ratio: 1 / 1;
|
|
2612
|
+
object-fit: contain;
|
|
2613
|
+
flex-shrink: 0;
|
|
2474
2614
|
}
|
|
2475
|
-
|
|
2615
|
+
@media (min-width: 64rem) {
|
|
2616
|
+
.registry-logo {
|
|
2617
|
+
height: calc(var(--spacing) * 6);
|
|
2618
|
+
}
|
|
2619
|
+
}
|
|
2620
|
+
p {
|
|
2621
|
+
margin: 0;
|
|
2622
|
+
white-space: nowrap;
|
|
2623
|
+
overflow: hidden;
|
|
2624
|
+
text-overflow: ellipsis;
|
|
2625
|
+
}
|
|
2626
|
+
`
|
|
2627
|
+
];
|
|
2628
|
+
}
|
|
2629
|
+
render() {
|
|
2630
|
+
return html`
|
|
2631
|
+
<div
|
|
2632
|
+
class="card-wrapper rounded-lg border border-solid p-2 text-center transition-all duration-300 ease-in-out flex items-center justify-center ${this.selected ? "selected" : ""} ${this.disabled ? "opacity-60 pointer-events-none" : "cursor-pointer"}"
|
|
2633
|
+
>
|
|
2634
|
+
<img class="registry-logo" src="${this.logoSrc}" alt="${this.cardId}" />
|
|
2635
|
+
<p class="m-0">${this.cardId}</p>
|
|
2636
|
+
${this.selected ? html`
|
|
2637
|
+
<div
|
|
2638
|
+
class="absolute -top-2.25 -right-2.25 z-10 w-4.5 h-4.5 rounded-full bg-(--axebow-white) flex items-center justify-center"
|
|
2639
|
+
>
|
|
2640
|
+
<axebow-icon iconName="check_circle" filled iconColor="var(--axebow-primary)" size="xl"></axebow-icon>
|
|
2641
|
+
</div>
|
|
2642
|
+
` : ""}
|
|
2643
|
+
</div>
|
|
2644
|
+
`;
|
|
2645
|
+
}
|
|
2646
|
+
};
|
|
2647
|
+
__decorate([property({ type: String })], AxebowSelectorCard.prototype, "cardId", void 0);
|
|
2648
|
+
__decorate([property({ type: String })], AxebowSelectorCard.prototype, "logoSrc", void 0);
|
|
2649
|
+
__decorate([property({ type: Boolean })], AxebowSelectorCard.prototype, "selected", void 0);
|
|
2650
|
+
__decorate([property({ type: Boolean })], AxebowSelectorCard.prototype, "disabled", void 0);
|
|
2651
|
+
AxebowSelectorCard = __decorate([customElement("axebow-selector-card")], AxebowSelectorCard);
|
|
2652
|
+
//#endregion
|
|
2653
|
+
//#region src/components/axebow-input/axebow-providers-input.ts
|
|
2654
|
+
var AxebowProvidersInput = class AxebowProvidersInput extends AxebowInputBase {
|
|
2655
|
+
constructor(..._args) {
|
|
2656
|
+
super(..._args);
|
|
2657
|
+
this.carouselItems = [];
|
|
2658
|
+
}
|
|
2659
|
+
static {
|
|
2660
|
+
this.styles = [...AxebowInputBase.baseStyles];
|
|
2661
|
+
}
|
|
2662
|
+
_handleSelect(item) {
|
|
2663
|
+
if (this.disabled) return;
|
|
2664
|
+
this.value = item.id;
|
|
2665
|
+
const event = new Event("change", {
|
|
2666
|
+
bubbles: true,
|
|
2667
|
+
composed: true
|
|
2668
|
+
});
|
|
2669
|
+
Object.defineProperty(event, "target", {
|
|
2670
|
+
value: { value: item.id },
|
|
2671
|
+
writable: false
|
|
2672
|
+
});
|
|
2673
|
+
this.dispatchEvent(event);
|
|
2674
|
+
this.callback?.(event);
|
|
2476
2675
|
}
|
|
2477
2676
|
render() {
|
|
2478
2677
|
return this.renderWrapper(html`
|
|
@@ -2480,12 +2679,13 @@ var AxebowProvidersInput = class AxebowProvidersInput extends AxebowInputBase {
|
|
|
2480
2679
|
${this.carouselItems.map((item) => {
|
|
2481
2680
|
const isSelected = this.value === item.id || this.value === item.name;
|
|
2482
2681
|
return this.carouselItemRenderer ? this.carouselItemRenderer(item) : html`
|
|
2483
|
-
<
|
|
2484
|
-
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
|
|
2488
|
-
|
|
2682
|
+
<axebow-selector-card
|
|
2683
|
+
.cardId=${item.id}
|
|
2684
|
+
.logoSrc=${item.content}
|
|
2685
|
+
.selected=${isSelected}
|
|
2686
|
+
.disabled=${this.disabled}
|
|
2687
|
+
@click=${() => this._handleSelect(item)}
|
|
2688
|
+
></axebow-selector-card>
|
|
2489
2689
|
`;
|
|
2490
2690
|
})}
|
|
2491
2691
|
</div>
|
|
@@ -2745,6 +2945,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2745
2945
|
constructor(..._args) {
|
|
2746
2946
|
super(..._args);
|
|
2747
2947
|
this.value = "";
|
|
2948
|
+
this.type = "text";
|
|
2748
2949
|
this.placeholder = "";
|
|
2749
2950
|
this.label = "";
|
|
2750
2951
|
this.description = "";
|
|
@@ -2768,6 +2969,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2768
2969
|
this.stepAmount = 1;
|
|
2769
2970
|
this.fixedField = false;
|
|
2770
2971
|
this.wrapDescription = false;
|
|
2972
|
+
this.descriptionLines = 2;
|
|
2771
2973
|
}
|
|
2772
2974
|
static {
|
|
2773
2975
|
this.styles = [
|
|
@@ -2785,6 +2987,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2785
2987
|
switch (this.controlType) {
|
|
2786
2988
|
case "input": return html`
|
|
2787
2989
|
<axebow-text-input
|
|
2990
|
+
.type=${this.type}
|
|
2788
2991
|
.value=${this.value}
|
|
2789
2992
|
.placeholder=${this.placeholder}
|
|
2790
2993
|
.label=${this.label}
|
|
@@ -2796,6 +2999,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2796
2999
|
.callback=${this.callback}
|
|
2797
3000
|
.maxlength=${this.maxlength}
|
|
2798
3001
|
.compact=${this.compact}
|
|
3002
|
+
.descriptionLines=${this.descriptionLines}
|
|
2799
3003
|
></axebow-text-input>
|
|
2800
3004
|
`;
|
|
2801
3005
|
case "numeric": return html`
|
|
@@ -2818,6 +3022,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2818
3022
|
.stepAmount=${this.stepAmount}
|
|
2819
3023
|
.fixedField=${this.fixedField}
|
|
2820
3024
|
.minWidth=${this.minWidth}
|
|
3025
|
+
.descriptionLines=${this.descriptionLines}
|
|
2821
3026
|
></axebow-numeric-input>
|
|
2822
3027
|
`;
|
|
2823
3028
|
case "integer": return html`
|
|
@@ -2841,6 +3046,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2841
3046
|
.stepAmount=${this.stepAmount}
|
|
2842
3047
|
.fixedField=${this.fixedField}
|
|
2843
3048
|
.minWidth=${this.minWidth}
|
|
3049
|
+
.descriptionLines=${this.descriptionLines}
|
|
2844
3050
|
></axebow-numeric-input>
|
|
2845
3051
|
`;
|
|
2846
3052
|
case "select": return html`
|
|
@@ -2865,6 +3071,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2865
3071
|
.minWidth=${this.minWidth}
|
|
2866
3072
|
.fixedHeight=${this.fixedHeight}
|
|
2867
3073
|
.wrapDescription=${this.wrapDescription}
|
|
3074
|
+
.descriptionLines=${this.descriptionLines}
|
|
2868
3075
|
></axebow-select-input>
|
|
2869
3076
|
`;
|
|
2870
3077
|
case "checkbox": return html`
|
|
@@ -2878,6 +3085,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2878
3085
|
.errorMessage=${this.errorMessage}
|
|
2879
3086
|
.callback=${this.callback}
|
|
2880
3087
|
.options=${this.options}
|
|
3088
|
+
.descriptionLines=${this.descriptionLines}
|
|
2881
3089
|
></axebow-checkbox-input>
|
|
2882
3090
|
`;
|
|
2883
3091
|
case "switch": return html`
|
|
@@ -2887,6 +3095,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2887
3095
|
.description=${this.description}
|
|
2888
3096
|
.disabled=${this.disabled}
|
|
2889
3097
|
.callback=${this.callback}
|
|
3098
|
+
.descriptionLines=${this.descriptionLines}
|
|
2890
3099
|
></axebow-switch-input>
|
|
2891
3100
|
`;
|
|
2892
3101
|
case "carousel": return html`
|
|
@@ -2901,6 +3110,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2901
3110
|
.callback=${this.callback}
|
|
2902
3111
|
.carouselItems=${this.carouselItems}
|
|
2903
3112
|
.carouselItemRenderer=${this.carouselItemRenderer}
|
|
3113
|
+
.descriptionLines=${this.descriptionLines}
|
|
2904
3114
|
></axebow-carousel-input>
|
|
2905
3115
|
`;
|
|
2906
3116
|
case "providers": return html`
|
|
@@ -2915,6 +3125,7 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2915
3125
|
.callback=${this.callback}
|
|
2916
3126
|
.carouselItems=${this.carouselItems}
|
|
2917
3127
|
.carouselItemRenderer=${this.carouselItemRenderer}
|
|
3128
|
+
.descriptionLines=${this.descriptionLines}
|
|
2918
3129
|
></axebow-providers-input>
|
|
2919
3130
|
`;
|
|
2920
3131
|
default: return html`
|
|
@@ -2930,12 +3141,14 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2930
3141
|
.callback=${this.callback}
|
|
2931
3142
|
.maxlength=${this.maxlength}
|
|
2932
3143
|
.compact=${this.compact}
|
|
3144
|
+
.descriptionLines=${this.descriptionLines}
|
|
2933
3145
|
></axebow-text-input>
|
|
2934
3146
|
`;
|
|
2935
3147
|
}
|
|
2936
3148
|
}
|
|
2937
3149
|
};
|
|
2938
3150
|
__decorate([property({ type: String })], AxebowInput.prototype, "value", void 0);
|
|
3151
|
+
__decorate([property({ type: String })], AxebowInput.prototype, "type", void 0);
|
|
2939
3152
|
__decorate([property({ type: String })], AxebowInput.prototype, "placeholder", void 0);
|
|
2940
3153
|
__decorate([property({ type: String })], AxebowInput.prototype, "label", void 0);
|
|
2941
3154
|
__decorate([property({ type: String })], AxebowInput.prototype, "description", void 0);
|
|
@@ -2969,6 +3182,7 @@ __decorate([property({ type: Boolean })], AxebowInput.prototype, "showStepper",
|
|
|
2969
3182
|
__decorate([property({ type: Number })], AxebowInput.prototype, "stepAmount", void 0);
|
|
2970
3183
|
__decorate([property({ type: Boolean })], AxebowInput.prototype, "fixedField", void 0);
|
|
2971
3184
|
__decorate([property({ type: Boolean })], AxebowInput.prototype, "wrapDescription", void 0);
|
|
3185
|
+
__decorate([property({ type: Number })], AxebowInput.prototype, "descriptionLines", void 0);
|
|
2972
3186
|
AxebowInput = __decorate([customElement("axebow-input")], AxebowInput);
|
|
2973
3187
|
//#endregion
|
|
2974
3188
|
//#region src/components/axebow-input/axebow-plan-select-field.ts
|
|
@@ -3173,7 +3387,7 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
3173
3387
|
bottom: 0;
|
|
3174
3388
|
left: 0;
|
|
3175
3389
|
right: 0;
|
|
3176
|
-
height:
|
|
3390
|
+
height: 1px;
|
|
3177
3391
|
background-color: var(--axebow-tertiary);
|
|
3178
3392
|
border-radius: 0.25rem;
|
|
3179
3393
|
}
|
|
@@ -3240,7 +3454,7 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
3240
3454
|
class="flex-1 h-8 flex items-center justify-center gap-2 transition-colors duration-200 font-medium
|
|
3241
3455
|
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
3242
3456
|
${isDisabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}
|
|
3243
|
-
${active ? `bg-white text-(--axebow-primary) rounded-t-lg tab-active ${this.bordered ? "border-t border-l border-r border-(--axebow-table-header-border)" : "border-none"}` : "bg-transparent text-(--axebow-secondary) rounded-md tab-inactive border-none"}"
|
|
3457
|
+
${active ? `bg-white text-(--axebow-primary) font-semibold rounded-t-lg tab-active ${this.bordered ? "border-t border-l border-r border-(--axebow-table-header-border)" : "border-none"}` : "bg-transparent text-(--axebow-secondary) rounded-md tab-inactive border-none hover:font-semibold"}"
|
|
3244
3458
|
?disabled=${isDisabled}
|
|
3245
3459
|
@click=${() => this._selectTab(i)}
|
|
3246
3460
|
>
|
|
@@ -3275,11 +3489,11 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
3275
3489
|
const isDisabled = this._tabDisabled[i];
|
|
3276
3490
|
return html`
|
|
3277
3491
|
<button
|
|
3278
|
-
class="${this.stretch ? "flex-1" : "px-4"} h-8 flex items-center justify-center text-sm
|
|
3279
|
-
transition-
|
|
3492
|
+
class="${this.stretch ? "flex-1" : "px-4"} h-8 flex items-center justify-center text-sm bg-transparent
|
|
3493
|
+
transition-all duration-200
|
|
3280
3494
|
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
3281
3495
|
${isDisabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}
|
|
3282
|
-
${active ? "text-[#344966] border-b
|
|
3496
|
+
${active ? "text-[#344966] font-semibold border-b border-solid border-[#344966] border-t-0 border-l-0 border-r-0" : "text-(--axebow-secondary) font-medium border-b border-solid border-(--axebow-light-gray) border-t-0 border-l-0 border-r-0 hover:text-(--axebow-tertiary) hover:border-(--axebow-tertiary) hover:font-semibold"}"
|
|
3283
3497
|
?disabled=${isDisabled}
|
|
3284
3498
|
@click=${() => this._selectTab(i)}
|
|
3285
3499
|
>
|
|
@@ -3361,55 +3575,16 @@ var AxebowRegistrySelector = class AxebowRegistrySelector extends LitElement {
|
|
|
3361
3575
|
_renderRegistryItem(registry) {
|
|
3362
3576
|
const isSelected = this._isRegistrySelected(registry);
|
|
3363
3577
|
return html`
|
|
3364
|
-
<style>
|
|
3365
|
-
.registry-card {
|
|
3366
|
-
position: relative;
|
|
3367
|
-
gap: calc(var(--spacing) * 0.5);
|
|
3368
|
-
border-color: var(--color-gray-200);
|
|
3369
|
-
background-color: transparent;
|
|
3370
|
-
}
|
|
3371
|
-
@media (min-width: 48rem) {
|
|
3372
|
-
.registry-card {
|
|
3373
|
-
gap: var(--spacing);
|
|
3374
|
-
}
|
|
3375
|
-
}
|
|
3376
|
-
@media (min-width: 64rem) {
|
|
3377
|
-
.registry-card {
|
|
3378
|
-
gap: calc(var(--spacing) * 2);
|
|
3379
|
-
}
|
|
3380
|
-
}
|
|
3381
|
-
.registry-card.selected {
|
|
3382
|
-
border-color: var(--axebow-primary);
|
|
3383
|
-
background-color: var(--axebow-white);
|
|
3384
|
-
}
|
|
3385
|
-
.registry-logo {
|
|
3386
|
-
height: calc(var(--spacing) * 3);
|
|
3387
|
-
aspect-ratio: 1 / 1;
|
|
3388
|
-
object-fit: contain;
|
|
3389
|
-
}
|
|
3390
|
-
@media (min-width: 64rem) {
|
|
3391
|
-
.registry-logo {
|
|
3392
|
-
height: calc(var(--spacing) * 6);
|
|
3393
|
-
}
|
|
3394
|
-
}
|
|
3395
|
-
</style>
|
|
3396
3578
|
<sl-carousel-item>
|
|
3397
|
-
<
|
|
3398
|
-
|
|
3579
|
+
<axebow-selector-card
|
|
3580
|
+
.cardId=${registry.id}
|
|
3581
|
+
.logoSrc=${registry.content}
|
|
3582
|
+
.selected=${isSelected}
|
|
3583
|
+
.disabled=${this.disabled}
|
|
3399
3584
|
@click=${() => {
|
|
3400
3585
|
if (!this.disabled) this.onRegistrySelect?.(registry);
|
|
3401
3586
|
}}
|
|
3402
|
-
>
|
|
3403
|
-
<img class="registry-logo" src="${registry.content}" alt="${registry.id}" />
|
|
3404
|
-
<p>${registry.id}</p>
|
|
3405
|
-
${isSelected ? html`
|
|
3406
|
-
<div
|
|
3407
|
-
class="absolute -top-2.25 -right-2.25 z-10 w-4.5 h-4.5 rounded-full bg-(--axebow-white) flex items-center justify-center"
|
|
3408
|
-
>
|
|
3409
|
-
<axebow-icon iconName="check_circle" filled iconColor="var(--axebow-primary)" size="xl"></axebow-icon>
|
|
3410
|
-
</div>
|
|
3411
|
-
` : ""}
|
|
3412
|
-
</div>
|
|
3587
|
+
></axebow-selector-card>
|
|
3413
3588
|
</sl-carousel-item>
|
|
3414
3589
|
`;
|
|
3415
3590
|
}
|
|
@@ -3469,7 +3644,7 @@ var AxebowRegistrySelector = class AxebowRegistrySelector extends LitElement {
|
|
|
3469
3644
|
<axebow-icon iconName="add" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
3470
3645
|
${this.labels.createNewSecretLabel}
|
|
3471
3646
|
</div>
|
|
3472
|
-
${secretOptions.length > 0 ? html`<
|
|
3647
|
+
${secretOptions.length > 0 ? html`<axebow-divider margin="0.25rem 0"></axebow-divider>` : ""}
|
|
3473
3648
|
${secretOptions.map((s) => html`<sl-option value="${s.name}">${s.name}</sl-option>`)}
|
|
3474
3649
|
${secretOptions.length === 0 ? html`<sl-option disabled>${this.labels.noSecretsAvailableLabel}</sl-option>` : ""}
|
|
3475
3650
|
</sl-select>
|
|
@@ -3685,9 +3860,6 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
3685
3860
|
padding: 1rem;
|
|
3686
3861
|
}
|
|
3687
3862
|
}
|
|
3688
|
-
sl-divider.nomargin {
|
|
3689
|
-
margin: 0 !important;
|
|
3690
|
-
}
|
|
3691
3863
|
.collaborators-scroll::-webkit-scrollbar {
|
|
3692
3864
|
width: 4px;
|
|
3693
3865
|
}
|
|
@@ -3794,12 +3966,12 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
3794
3966
|
</div>
|
|
3795
3967
|
</div>
|
|
3796
3968
|
<div class="flex flex-col flex-1 min-h-0 mt-5">
|
|
3797
|
-
<
|
|
3969
|
+
<axebow-divider></axebow-divider>
|
|
3798
3970
|
<h3 class="text-base font-medium text-black mb-3 mt-4 shrink-0">${this.labels.actualCollaborators}</h3>
|
|
3799
3971
|
<div class="collaborators-scroll flex-1 min-h-0 overflow-y-auto">
|
|
3800
3972
|
${this.collaborators.length > 0 ? html`
|
|
3801
3973
|
<div class="mr-2">
|
|
3802
|
-
<
|
|
3974
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
3803
3975
|
${this.collaborators.map((c, index) => html`
|
|
3804
3976
|
<div
|
|
3805
3977
|
class="flex items-center justify-between py-2.5
|
|
@@ -3863,7 +4035,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
3863
4035
|
`)}
|
|
3864
4036
|
</div>
|
|
3865
4037
|
|
|
3866
|
-
<
|
|
4038
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
3867
4039
|
|
|
3868
4040
|
<div class="py-1">
|
|
3869
4041
|
${this.selectedRole[c.email] && this.selectedRole[c.email] !== c.permission ? html` <sl-menu-item
|
|
@@ -3918,7 +4090,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
3918
4090
|
`}
|
|
3919
4091
|
</div>
|
|
3920
4092
|
</div>
|
|
3921
|
-
<
|
|
4093
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
3922
4094
|
`)}
|
|
3923
4095
|
</div>
|
|
3924
4096
|
` : html`
|
|
@@ -3979,6 +4151,75 @@ __decorate([property({ attribute: false })], AxebowCollaboratorsDialog.prototype
|
|
|
3979
4151
|
__decorate([property({ attribute: false })], AxebowCollaboratorsDialog.prototype, "onClose", void 0);
|
|
3980
4152
|
AxebowCollaboratorsDialog = __decorate([customElement("axebow-collaborators-dialog")], AxebowCollaboratorsDialog);
|
|
3981
4153
|
//#endregion
|
|
4154
|
+
//#region src/components/axebow-manage-hyperlinks/axebow-manage-hyperlinks.ts
|
|
4155
|
+
var AxebowManageHyperlinks = class AxebowManageHyperlinks extends LitElement {
|
|
4156
|
+
constructor(..._args) {
|
|
4157
|
+
super(..._args);
|
|
4158
|
+
this.text = "";
|
|
4159
|
+
this.icon = "";
|
|
4160
|
+
this.color = "";
|
|
4161
|
+
this.iconColor = "";
|
|
4162
|
+
this.disabled = false;
|
|
4163
|
+
this.reverse = false;
|
|
4164
|
+
}
|
|
4165
|
+
static {
|
|
4166
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
4167
|
+
:host {
|
|
4168
|
+
display: inline-block;
|
|
4169
|
+
}
|
|
4170
|
+
button:hover:not(:disabled) {
|
|
4171
|
+
color: var(--axebow-gray) !important;
|
|
4172
|
+
}
|
|
4173
|
+
:host([reverse]) button {
|
|
4174
|
+
color: var(--hyperlink-reverse-color, var(--axebow-primary-light, #b4cded));
|
|
4175
|
+
}
|
|
4176
|
+
:host([reverse]) button:hover:not(:disabled),
|
|
4177
|
+
button.reverse:hover:not(:disabled) {
|
|
4178
|
+
color: var(--axebow-tertiary, #006bff) !important;
|
|
4179
|
+
}
|
|
4180
|
+
`];
|
|
4181
|
+
}
|
|
4182
|
+
_handleClick(e) {
|
|
4183
|
+
if (this.disabled) {
|
|
4184
|
+
e.preventDefault();
|
|
4185
|
+
e.stopPropagation();
|
|
4186
|
+
return;
|
|
4187
|
+
}
|
|
4188
|
+
this.dispatchEvent(new CustomEvent("hyperlink-click", {
|
|
4189
|
+
bubbles: true,
|
|
4190
|
+
composed: true,
|
|
4191
|
+
detail: { text: this.text }
|
|
4192
|
+
}));
|
|
4193
|
+
}
|
|
4194
|
+
render() {
|
|
4195
|
+
const defaultColor = this.reverse ? "var(--hyperlink-reverse-color, var(--axebow-primary-light))" : "var(--axebow-tertiary)";
|
|
4196
|
+
const buttonColor = this.color || defaultColor;
|
|
4197
|
+
const iconColorProp = this.iconColor || "currentColor";
|
|
4198
|
+
return html`
|
|
4199
|
+
<button
|
|
4200
|
+
type="button"
|
|
4201
|
+
?disabled=${this.disabled}
|
|
4202
|
+
@click=${this._handleClick}
|
|
4203
|
+
style="color: ${buttonColor};"
|
|
4204
|
+
class="inline-flex items-center gap-1.5 bg-transparent border-none p-0 cursor-pointer font-semibold text-sm focus:outline-none transition-colors disabled:opacity-50 disabled:cursor-not-allowed ${this.reverse ? "reverse" : ""}"
|
|
4205
|
+
>
|
|
4206
|
+
<span>${this.text}</span>
|
|
4207
|
+
${this.icon ? html`<axebow-icon iconName="${this.icon}" iconColor="${iconColorProp}" size="sm"></axebow-icon>` : ""}
|
|
4208
|
+
</button>
|
|
4209
|
+
`;
|
|
4210
|
+
}
|
|
4211
|
+
};
|
|
4212
|
+
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "text", void 0);
|
|
4213
|
+
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "icon", void 0);
|
|
4214
|
+
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "color", void 0);
|
|
4215
|
+
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "iconColor", void 0);
|
|
4216
|
+
__decorate([property({ type: Boolean })], AxebowManageHyperlinks.prototype, "disabled", void 0);
|
|
4217
|
+
__decorate([property({
|
|
4218
|
+
type: Boolean,
|
|
4219
|
+
reflect: true
|
|
4220
|
+
})], AxebowManageHyperlinks.prototype, "reverse", void 0);
|
|
4221
|
+
AxebowManageHyperlinks = __decorate([customElement("axebow-manage-hyperlinks")], AxebowManageHyperlinks);
|
|
4222
|
+
//#endregion
|
|
3982
4223
|
//#region src/components/axebow-modals-confirmation/axebow-modals-confirmation.ts
|
|
3983
4224
|
var AxebowModalsConfirmation = class AxebowModalsConfirmation extends LitElement {
|
|
3984
4225
|
constructor(..._args) {
|
|
@@ -4255,8 +4496,7 @@ var AxebowModalsConfirmation = class AxebowModalsConfirmation extends LitElement
|
|
|
4255
4496
|
}));
|
|
4256
4497
|
}
|
|
4257
4498
|
_handleHyperlinkClick(e) {
|
|
4258
|
-
if (this.hyperlinkHref)
|
|
4259
|
-
e.preventDefault();
|
|
4499
|
+
if (this.hyperlinkHref) window.open(this.hyperlinkHref, "_blank");
|
|
4260
4500
|
this.dispatchEvent(new CustomEvent("axebow-hyperlink-click", {
|
|
4261
4501
|
bubbles: true,
|
|
4262
4502
|
composed: true
|
|
@@ -4288,7 +4528,7 @@ var AxebowModalsConfirmation = class AxebowModalsConfirmation extends LitElement
|
|
|
4288
4528
|
${this.canClose ? html`
|
|
4289
4529
|
<button
|
|
4290
4530
|
type="button"
|
|
4291
|
-
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center shrink-0 text-
|
|
4531
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center shrink-0 text-(--axebow-gray) hover:text-(--axebow-error) transition-colors ml-4"
|
|
4292
4532
|
aria-label="Close dialog"
|
|
4293
4533
|
@click=${this._handleClose}
|
|
4294
4534
|
>
|
|
@@ -4399,13 +4639,10 @@ var AxebowModalsConfirmation = class AxebowModalsConfirmation extends LitElement
|
|
|
4399
4639
|
<div>
|
|
4400
4640
|
${this.showHyperlink ? html`
|
|
4401
4641
|
<slot name="hyperlink">
|
|
4402
|
-
<
|
|
4403
|
-
|
|
4404
|
-
|
|
4405
|
-
|
|
4406
|
-
>
|
|
4407
|
-
${this.hyperlinkText}
|
|
4408
|
-
</a>
|
|
4642
|
+
<axebow-manage-hyperlinks
|
|
4643
|
+
.text=${this.hyperlinkText}
|
|
4644
|
+
@hyperlink-click=${this._handleHyperlinkClick}
|
|
4645
|
+
></axebow-manage-hyperlinks>
|
|
4409
4646
|
</slot>
|
|
4410
4647
|
` : ""}
|
|
4411
4648
|
</div>
|
|
@@ -4688,7 +4925,7 @@ var AxebowAdjustmentResourcesCounter = class AxebowAdjustmentResourcesCounter ex
|
|
|
4688
4925
|
<axebow-tooltip
|
|
4689
4926
|
class="absolute top-1 right-1"
|
|
4690
4927
|
icon="info"
|
|
4691
|
-
color="
|
|
4928
|
+
color="var(--color-gray)"
|
|
4692
4929
|
size="xl"
|
|
4693
4930
|
.content=${this.tooltipText}
|
|
4694
4931
|
></axebow-tooltip>
|
|
@@ -5085,7 +5322,7 @@ var AxebowRuntimeZipDialog = class AxebowRuntimeZipDialog extends LitElement {
|
|
|
5085
5322
|
<axebow-icon iconName="cancel" iconColor="var(--axebow-gray)" size="xl"></axebow-icon>
|
|
5086
5323
|
</div>
|
|
5087
5324
|
</div>
|
|
5088
|
-
<p class="w-120.75 h-21.25 leading-
|
|
5325
|
+
<p class="w-120.75 h-21.25 leading-4.25 m-0">
|
|
5089
5326
|
${this.labels.uploadDescriptionPrefix}<br /><br />
|
|
5090
5327
|
"${this.tenantName} > ${this.accountName} >
|
|
5091
5328
|
<span class="text-(--axebow-primary)">${this.environmentName}</span>".<br /><br />
|
|
@@ -5109,9 +5346,12 @@ var AxebowRuntimeZipDialog = class AxebowRuntimeZipDialog extends LitElement {
|
|
|
5109
5346
|
</p>
|
|
5110
5347
|
</axebow-banner>
|
|
5111
5348
|
|
|
5112
|
-
<
|
|
5113
|
-
|
|
5114
|
-
|
|
5349
|
+
<axebow-divider
|
|
5350
|
+
width="100%"
|
|
5351
|
+
color="var(--axebow-gray)"
|
|
5352
|
+
margin="0"
|
|
5353
|
+
style="max-width: 30.25rem;"
|
|
5354
|
+
></axebow-divider>
|
|
5115
5355
|
|
|
5116
5356
|
<axebow-input
|
|
5117
5357
|
style="width: 30.25rem;"
|
|
@@ -7090,7 +7330,7 @@ function buildAddButton(channelType) {
|
|
|
7090
7330
|
return container;
|
|
7091
7331
|
}
|
|
7092
7332
|
function buildDivider() {
|
|
7093
|
-
const divider = document.createElement("
|
|
7333
|
+
const divider = document.createElement("axebow-divider");
|
|
7094
7334
|
divider.classList.add("mesh-node-divider");
|
|
7095
7335
|
return divider;
|
|
7096
7336
|
}
|
|
@@ -7262,8 +7502,10 @@ var AxebowPill = class AxebowPill extends LitElement {
|
|
|
7262
7502
|
this.icon = "";
|
|
7263
7503
|
this.image = "";
|
|
7264
7504
|
this.label = "";
|
|
7505
|
+
this.title = "";
|
|
7265
7506
|
this.buttonText = "";
|
|
7266
7507
|
this.buttonIcon = "";
|
|
7508
|
+
this.large = false;
|
|
7267
7509
|
}
|
|
7268
7510
|
static {
|
|
7269
7511
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
@@ -7271,55 +7513,68 @@ var AxebowPill = class AxebowPill extends LitElement {
|
|
|
7271
7513
|
display: block;
|
|
7272
7514
|
flex: 1 1 0%;
|
|
7273
7515
|
min-width: 0;
|
|
7516
|
+
height: 100%;
|
|
7274
7517
|
}
|
|
7275
|
-
.
|
|
7276
|
-
|
|
7518
|
+
.pill {
|
|
7519
|
+
transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out;
|
|
7520
|
+
}
|
|
7521
|
+
.pill:hover {
|
|
7522
|
+
background-color: white !important;
|
|
7523
|
+
--axebow-icon-color: var(--axebow-primary) !important;
|
|
7524
|
+
--hyperlink-reverse-color: var(--axebow-tertiary, #006bff) !important;
|
|
7525
|
+
box-shadow: 0 8px 20px -4px rgba(13, 24, 33, 0.12);
|
|
7277
7526
|
}
|
|
7278
|
-
.pill:hover
|
|
7527
|
+
.pill:hover p {
|
|
7279
7528
|
color: var(--axebow-primary) !important;
|
|
7280
7529
|
}
|
|
7530
|
+
.pill:hover img {
|
|
7531
|
+
filter: brightness(0.2);
|
|
7532
|
+
}
|
|
7281
7533
|
`];
|
|
7282
7534
|
}
|
|
7283
7535
|
render() {
|
|
7536
|
+
const textLabel = this.label || this.title;
|
|
7284
7537
|
return html`
|
|
7285
7538
|
<div
|
|
7286
|
-
class="pill group flex flex-col items-center justify-
|
|
7287
|
-
|
|
7288
|
-
|
|
7289
|
-
|
|
7290
|
-
hover:bg-white hover:text-(--axebow-primary) hover:shadow-lg"
|
|
7291
|
-
@click=${() => this.onClick?.()}
|
|
7292
|
-
@mouseenter=${this._handleMouseEnter}
|
|
7293
|
-
@mouseleave=${this._handleMouseLeave}
|
|
7539
|
+
class="pill group flex flex-col items-center justify-between gap-4 p-6 box-border
|
|
7540
|
+
bg-(--axebow-primary) rounded-md text-white cursor-pointer shadow-sm
|
|
7541
|
+
h-full"
|
|
7542
|
+
@click=${this._handleClick}
|
|
7294
7543
|
>
|
|
7295
|
-
|
|
7296
|
-
|
|
7297
|
-
|
|
7298
|
-
|
|
7299
|
-
|
|
7300
|
-
|
|
7301
|
-
|
|
7302
|
-
|
|
7303
|
-
|
|
7544
|
+
<div class="flex flex-col items-center gap-3 w-full">
|
|
7545
|
+
${this.image ? html`<img
|
|
7546
|
+
src="${this.image}"
|
|
7547
|
+
class="w-12 h-12 object-contain transition-all duration-200"
|
|
7548
|
+
/>` : html`<axebow-icon iconName="${this.icon}" iconColor="white" size="3xl"></axebow-icon>`}
|
|
7549
|
+
<p class="text-center text-white font-medium text-base leading-snug m-0 px-2 transition-colors duration-200">${textLabel}</p>
|
|
7550
|
+
</div>
|
|
7551
|
+
<axebow-manage-hyperlinks
|
|
7552
|
+
.text=${this.buttonText}
|
|
7553
|
+
.icon=${this.buttonIcon}
|
|
7554
|
+
?reverse=${true}
|
|
7555
|
+
@hyperlink-click=${(e) => {
|
|
7556
|
+
e.stopPropagation();
|
|
7557
|
+
this._handleClick();
|
|
7558
|
+
}}
|
|
7559
|
+
></axebow-manage-hyperlinks>
|
|
7304
7560
|
</div>
|
|
7305
7561
|
`;
|
|
7306
7562
|
}
|
|
7307
|
-
|
|
7308
|
-
|
|
7309
|
-
|
|
7310
|
-
|
|
7311
|
-
|
|
7312
|
-
|
|
7313
|
-
event.currentTarget.querySelectorAll("axebow-icon").forEach((icon) => {
|
|
7314
|
-
icon.setAttribute("iconColor", "white");
|
|
7315
|
-
});
|
|
7563
|
+
_handleClick() {
|
|
7564
|
+
this.dispatchEvent(new CustomEvent("pill-click", {
|
|
7565
|
+
bubbles: true,
|
|
7566
|
+
composed: true
|
|
7567
|
+
}));
|
|
7568
|
+
this.onClick?.();
|
|
7316
7569
|
}
|
|
7317
7570
|
};
|
|
7318
7571
|
__decorate([property({ type: String })], AxebowPill.prototype, "icon", void 0);
|
|
7319
7572
|
__decorate([property({ type: String })], AxebowPill.prototype, "image", void 0);
|
|
7320
7573
|
__decorate([property({ type: String })], AxebowPill.prototype, "label", void 0);
|
|
7574
|
+
__decorate([property({ type: String })], AxebowPill.prototype, "title", void 0);
|
|
7321
7575
|
__decorate([property({ type: String })], AxebowPill.prototype, "buttonText", void 0);
|
|
7322
7576
|
__decorate([property({ type: String })], AxebowPill.prototype, "buttonIcon", void 0);
|
|
7577
|
+
__decorate([property({ type: Boolean })], AxebowPill.prototype, "large", void 0);
|
|
7323
7578
|
__decorate([property({ attribute: false })], AxebowPill.prototype, "onClick", void 0);
|
|
7324
7579
|
AxebowPill = __decorate([customElement("axebow-pill")], AxebowPill);
|
|
7325
7580
|
//#endregion
|
|
@@ -7473,7 +7728,7 @@ var AxebowGettingStartedCard = class AxebowGettingStartedCard extends LitElement
|
|
|
7473
7728
|
<div class="w-294 flex flex-col bg-white rounded-md shadow-sm">
|
|
7474
7729
|
<h2 class="text-md font-bold text-center mt-6 mx-6 mb-4 text-(--axebow-primary)">${this.heading}</h2>
|
|
7475
7730
|
<div class="w-282 mx-6">
|
|
7476
|
-
<
|
|
7731
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
7477
7732
|
</div>
|
|
7478
7733
|
<div class="w-282 h-52.75 mx-6 flex flex-col">
|
|
7479
7734
|
<p class="text-base text-center my-4 text-black">${this.description}</p>
|
|
@@ -7491,7 +7746,7 @@ var AxebowGettingStartedCard = class AxebowGettingStartedCard extends LitElement
|
|
|
7491
7746
|
</div>
|
|
7492
7747
|
</div>
|
|
7493
7748
|
<div class="w-282 mx-6 mt-4 mb-4">
|
|
7494
|
-
<
|
|
7749
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
7495
7750
|
</div>
|
|
7496
7751
|
<div class="w-139 h-9.5 mx-auto mb-6 flex items-center justify-center gap-4">
|
|
7497
7752
|
${this.contactUrl ? html`
|
|
@@ -8027,6 +8282,13 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
8027
8282
|
:host {
|
|
8028
8283
|
display: block;
|
|
8029
8284
|
}
|
|
8285
|
+
.expand-icon {
|
|
8286
|
+
color: var(--axebow-tertiary);
|
|
8287
|
+
transition: color 0.15s ease;
|
|
8288
|
+
}
|
|
8289
|
+
.expandable-row:hover .expand-icon {
|
|
8290
|
+
color: var(--axebow-gray);
|
|
8291
|
+
}
|
|
8030
8292
|
`
|
|
8031
8293
|
];
|
|
8032
8294
|
}
|
|
@@ -8121,9 +8383,9 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
8121
8383
|
</div>
|
|
8122
8384
|
`;
|
|
8123
8385
|
return html`
|
|
8124
|
-
<div class="flex items-center justify-center gap-6">
|
|
8386
|
+
<div class="flex items-center justify-center gap-6 px-2">
|
|
8125
8387
|
<usage-chart
|
|
8126
|
-
class="
|
|
8388
|
+
class="flex-1 shrink-0"
|
|
8127
8389
|
height=${ifDefined(this.chartHeight)}
|
|
8128
8390
|
chartId=${idPrefix}
|
|
8129
8391
|
chartType="line"
|
|
@@ -8156,20 +8418,20 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
8156
8418
|
return html`
|
|
8157
8419
|
<div class="border-b border-solid border-(--axebow-light-gray) last:border-b-0">
|
|
8158
8420
|
<div
|
|
8159
|
-
class="${c.rowWidth} min-w-160 min-h-12 flex items-center ${c.rowGap} ${hasSubRows ? "cursor-pointer hover:bg-gray-50" : ""} py-1.5 px-4 box-border"
|
|
8421
|
+
class="${c.rowWidth} min-w-160 min-h-12 flex items-center ${c.rowGap} ${hasSubRows ? "cursor-pointer hover:bg-gray-50 expandable-row group" : ""} py-1.5 px-4 box-border"
|
|
8160
8422
|
@click=${hasSubRows ? () => this._toggle(row.id) : null}
|
|
8161
8423
|
>
|
|
8162
8424
|
<div class="${c.name} shrink-0 flex items-center gap-2">
|
|
8163
8425
|
${hasSubRows ? html`
|
|
8164
8426
|
<axebow-icon
|
|
8165
8427
|
iconName=${isExpanded ? "keyboard_arrow_down" : "keyboard_arrow_right"}
|
|
8166
|
-
iconColor="
|
|
8428
|
+
iconColor="currentColor"
|
|
8167
8429
|
size="md"
|
|
8168
|
-
class="shrink-0"
|
|
8430
|
+
class="shrink-0 expand-icon text-(--axebow-tertiary) group-hover:text-(--axebow-gray) transition-colors"
|
|
8169
8431
|
></axebow-icon>
|
|
8170
8432
|
` : html`<span class="w-4 inline-block"></span>`}
|
|
8171
8433
|
${row.logoUrl ? html`<img src=${row.logoUrl} class="w-5 h-5 object-contain shrink-0" />` : ""}
|
|
8172
|
-
<span class="
|
|
8434
|
+
<span class="truncate">${row.name}</span>
|
|
8173
8435
|
${this._renderStatusIcon(row.statusIcon)}
|
|
8174
8436
|
<span class="flex-1"></span>
|
|
8175
8437
|
${this._renderStatusIcon(row.warningIcon)}
|
|
@@ -8755,7 +9017,7 @@ var AxebowTenantCard = class AxebowTenantCard extends LitElement {
|
|
|
8755
9017
|
</div>
|
|
8756
9018
|
|
|
8757
9019
|
<div class="w-full">
|
|
8758
|
-
<
|
|
9020
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
8759
9021
|
</div>
|
|
8760
9022
|
|
|
8761
9023
|
${this._renderContent()}
|
|
@@ -9049,14 +9311,11 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
|
|
|
9049
9311
|
:host {
|
|
9050
9312
|
display: block;
|
|
9051
9313
|
}
|
|
9052
|
-
sl-divider {
|
|
9053
|
-
margin: 0;
|
|
9054
|
-
}
|
|
9055
9314
|
`];
|
|
9056
9315
|
}
|
|
9057
9316
|
render() {
|
|
9058
9317
|
return html`
|
|
9059
|
-
<
|
|
9318
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
9060
9319
|
<div
|
|
9061
9320
|
class="flex items-center gap-2 flex-wrap pt-4"
|
|
9062
9321
|
style="padding-bottom: ${this.expanded ? "1.09375rem" : "1rem"};"
|
|
@@ -9081,7 +9340,7 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
|
|
|
9081
9340
|
<div class="${this.expanded ? "block pb-4" : "hidden"}">
|
|
9082
9341
|
<slot></slot>
|
|
9083
9342
|
</div>
|
|
9084
|
-
<
|
|
9343
|
+
<axebow-divider margin="0"></axebow-divider>
|
|
9085
9344
|
`;
|
|
9086
9345
|
}
|
|
9087
9346
|
};
|
|
@@ -9128,7 +9387,7 @@ var AxebowActionsFooter = class AxebowActionsFooter extends LitElement {
|
|
|
9128
9387
|
<div
|
|
9129
9388
|
class="w-full bg-(--axebow-base) box-border ${this.isOverlappingContent ? "shadow-[0_-8px_8px_-8px_rgba(13,24,33,0.15)]" : ""}"
|
|
9130
9389
|
>
|
|
9131
|
-
<
|
|
9390
|
+
<axebow-divider margin="1rem 0"></axebow-divider>
|
|
9132
9391
|
<div class="h-10 box-content flex items-center pb-6">
|
|
9133
9392
|
<div class="flex items-center gap-8 shrink-0 mr-8">
|
|
9134
9393
|
<axebow-button
|
|
@@ -9366,10 +9625,6 @@ var AxebowRoleCard = class AxebowRoleCard extends LitElement {
|
|
|
9366
9625
|
:host {
|
|
9367
9626
|
display: block;
|
|
9368
9627
|
}
|
|
9369
|
-
sl-divider {
|
|
9370
|
-
--color: var(--axebow-gray);
|
|
9371
|
-
--width: 1px;
|
|
9372
|
-
}
|
|
9373
9628
|
sl-input::part(base) {
|
|
9374
9629
|
width: 100%;
|
|
9375
9630
|
height: 2.5rem;
|
|
@@ -9395,7 +9650,7 @@ var AxebowRoleCard = class AxebowRoleCard extends LitElement {
|
|
|
9395
9650
|
<div class="w-87 h-4.25 flex items-center">
|
|
9396
9651
|
<h1 class="m-0 uppercase text-left text-base font-semibold text-(--axebow-gray) truncate">${this.name}</h1>
|
|
9397
9652
|
</div>
|
|
9398
|
-
<
|
|
9653
|
+
<axebow-divider color="var(--axebow-gray)"></axebow-divider>
|
|
9399
9654
|
<div class="w-12.5 h-12.5 shrink-0">
|
|
9400
9655
|
<img src=${this.logoUrl} class="w-full h-full object-contain" />
|
|
9401
9656
|
</div>
|
|
@@ -9801,7 +10056,7 @@ var AxebowRefreshPeriodPanel = class AxebowRefreshPeriodPanel extends LitElement
|
|
|
9801
10056
|
<sl-menu-item @click=${() => this._handleSelect(null)} ?selected=${this.offSelected}>
|
|
9802
10057
|
<div class="flex items-center gap-2">${this.offLabel}</div>
|
|
9803
10058
|
</sl-menu-item>
|
|
9804
|
-
<
|
|
10059
|
+
<axebow-divider margin="0.25rem 0"></axebow-divider>
|
|
9805
10060
|
${this.periods.map((period) => html`
|
|
9806
10061
|
<sl-menu-item @click=${() => this._handleSelect(period.value)} ?selected=${period.selected}>
|
|
9807
10062
|
<div class="flex items-center gap-2">${period.label}</div>
|
|
@@ -9810,7 +10065,7 @@ var AxebowRefreshPeriodPanel = class AxebowRefreshPeriodPanel extends LitElement
|
|
|
9810
10065
|
</sl-menu>
|
|
9811
10066
|
</sl-dropdown>
|
|
9812
10067
|
<button
|
|
9813
|
-
class="text-
|
|
10068
|
+
class="text-(--axebow-tertiary) flex items-center gap-2 cursor-pointer hover:opacity-80 transition-opacity ${this.isManualRefreshing ? "opacity-70" : ""}"
|
|
9814
10069
|
@click=${this._handleRefreshNow}
|
|
9815
10070
|
?disabled=${this.isManualRefreshing}
|
|
9816
10071
|
>
|
|
@@ -9854,14 +10109,12 @@ var AxebowResourceLimitInput = class AxebowResourceLimitInput extends LitElement
|
|
|
9854
10109
|
}
|
|
9855
10110
|
render() {
|
|
9856
10111
|
return html`
|
|
9857
|
-
<div class="flex flex-col items-center
|
|
9858
|
-
<div class="flex items-center gap-1">
|
|
9859
|
-
${this.required ? html`<span class="text-(--axebow-error)">*</span>` : ""}
|
|
9860
|
-
<span class="text-sm font-semibold text-center">${this.label}</span>
|
|
9861
|
-
</div>
|
|
10112
|
+
<div class="flex flex-col items-center w-28.25 shrink-0">
|
|
9862
10113
|
<axebow-input
|
|
9863
|
-
controlType="
|
|
10114
|
+
controlType="numeric"
|
|
9864
10115
|
.compact=${true}
|
|
10116
|
+
.label=${this.label}
|
|
10117
|
+
.required=${this.required}
|
|
9865
10118
|
.value=${this.value}
|
|
9866
10119
|
.max=${this.max}
|
|
9867
10120
|
.min=${this.min}
|
|
@@ -9871,7 +10124,7 @@ var AxebowResourceLimitInput = class AxebowResourceLimitInput extends LitElement
|
|
|
9871
10124
|
fixedWidth="6.1875rem"
|
|
9872
10125
|
fixedHeight="2.5rem"
|
|
9873
10126
|
></axebow-input>
|
|
9874
|
-
<span class="text-sm text-(--axebow-
|
|
10127
|
+
<span class="text-sm text-(--axebow-gray, #6b7280) text-center mt-1">${this.unit}</span>
|
|
9875
10128
|
</div>
|
|
9876
10129
|
`;
|
|
9877
10130
|
}
|
|
@@ -9898,9 +10151,9 @@ var AxebowResourceLimitsPanel = class AxebowResourceLimitsPanel extends LitEleme
|
|
|
9898
10151
|
}
|
|
9899
10152
|
_handleChange(field, e) {
|
|
9900
10153
|
const target = e.target;
|
|
9901
|
-
let value =
|
|
9902
|
-
if (value > field.max) value = field.max;
|
|
9903
|
-
|
|
10154
|
+
let value = Number(target.value) || 0;
|
|
10155
|
+
if (field.max !== void 0 && field.max !== Number.MAX_SAFE_INTEGER && value > field.max) value = field.max;
|
|
10156
|
+
if (field.min !== void 0 && value < field.min) value = field.min;
|
|
9904
10157
|
this.dispatchEvent(new CustomEvent("resource-limit-change", {
|
|
9905
10158
|
detail: {
|
|
9906
10159
|
key: field.key,
|
|
@@ -9912,17 +10165,24 @@ var AxebowResourceLimitsPanel = class AxebowResourceLimitsPanel extends LitEleme
|
|
|
9912
10165
|
}
|
|
9913
10166
|
_renderField(field) {
|
|
9914
10167
|
return html`
|
|
9915
|
-
<
|
|
9916
|
-
|
|
9917
|
-
|
|
9918
|
-
|
|
9919
|
-
|
|
9920
|
-
|
|
9921
|
-
|
|
9922
|
-
|
|
9923
|
-
|
|
9924
|
-
|
|
9925
|
-
|
|
10168
|
+
<div class="flex flex-col items-center w-28.25 shrink-0">
|
|
10169
|
+
<axebow-input
|
|
10170
|
+
controlType="numeric"
|
|
10171
|
+
.compact=${true}
|
|
10172
|
+
.label=${field.label}
|
|
10173
|
+
.required=${field.required}
|
|
10174
|
+
.value=${field.value?.toString() ?? ""}
|
|
10175
|
+
.max=${field.max}
|
|
10176
|
+
.min=${field.min ?? 0}
|
|
10177
|
+
?disabled=${field.disabled}
|
|
10178
|
+
?hasError=${field.hasError}
|
|
10179
|
+
.errorMessage=${field.errorMessage ?? ""}
|
|
10180
|
+
.callback=${(e) => this._handleChange(field, e)}
|
|
10181
|
+
fixedWidth="6.1875rem"
|
|
10182
|
+
fixedHeight="2.5rem"
|
|
10183
|
+
></axebow-input>
|
|
10184
|
+
${field.hasError && field.errorMessage ? html`<span class="text-sm text-(--axebow-error) text-center mt-1 leading-tight">${field.errorMessage}</span>` : html`<span class="text-sm text-(--axebow-gray, #6b7280) text-center mt-1">${field.unit}</span>`}
|
|
10185
|
+
</div>
|
|
9926
10186
|
`;
|
|
9927
10187
|
}
|
|
9928
10188
|
render() {
|
|
@@ -9930,7 +10190,7 @@ var AxebowResourceLimitsPanel = class AxebowResourceLimitsPanel extends LitEleme
|
|
|
9930
10190
|
return html`
|
|
9931
10191
|
<div class="flex items-center flex-wrap gap-19">
|
|
9932
10192
|
<div class="flex items-start gap-6">${this._renderField(this.cpu)} ${this._renderField(this.memory)}</div>
|
|
9933
|
-
<div class="flex items-
|
|
10193
|
+
<div class="flex items-center justify-center gap-4 w-100.5 p-4 border border-(--axebow-table-header-border) rounded-md box-border">
|
|
9934
10194
|
${this.storageFields.map((field) => this._renderField(field))}
|
|
9935
10195
|
</div>
|
|
9936
10196
|
</div>
|
|
@@ -10152,18 +10412,6 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
10152
10412
|
display: block;
|
|
10153
10413
|
height: 100%;
|
|
10154
10414
|
}
|
|
10155
|
-
/* The plain, solid divider used between every summary section -
|
|
10156
|
-
matches whatever separates the step titles. */
|
|
10157
|
-
sl-divider.summary-title-divider {
|
|
10158
|
-
--color: var(--axebow-table-header-border, #dbdde4);
|
|
10159
|
-
--spacing: 0.75rem;
|
|
10160
|
-
}
|
|
10161
|
-
/* Dashed variant used inside the autoscaling summary. */
|
|
10162
|
-
sl-divider.summary-dashed-divider {
|
|
10163
|
-
--color: var(--axebow-base);
|
|
10164
|
-
--spacing: 0.75rem;
|
|
10165
|
-
border-top-style: dashed !important;
|
|
10166
|
-
}
|
|
10167
10415
|
`
|
|
10168
10416
|
];
|
|
10169
10417
|
}
|
|
@@ -10198,7 +10446,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
10198
10446
|
${this._renderDeploymentInfo()}
|
|
10199
10447
|
<div class="h-px border-t border-dashed border-gray-400 my-4"></div>
|
|
10200
10448
|
${this._renderResourceLimits()}
|
|
10201
|
-
<
|
|
10449
|
+
<axebow-divider color="var(--axebow-table-header-border, #dbdde4)" margin="0.75rem 0"></axebow-divider>
|
|
10202
10450
|
<div class="flex-1 overflow-y-auto flex flex-col">
|
|
10203
10451
|
${this._renderIdentificationStep()} ${this._renderResourcesStep()} ${this._renderScalingStep()}
|
|
10204
10452
|
${this._renderChannelsStep()} ${this._renderConfigurationStep()}
|
|
@@ -10381,11 +10629,11 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
10381
10629
|
<p class="font-semibold text-base lg:text-lg text-(--axebow-black) mb-2">${config.title}</p>
|
|
10382
10630
|
${config.minReplicas ? this._field(config.minLabel, config.minReplicas.value, config.minReplicas.hasError) : ""}
|
|
10383
10631
|
${config.maxReplicas ? this._field(config.maxLabel, config.maxReplicas.value) : ""}
|
|
10384
|
-
${hasScaleDownInfo ? html`<
|
|
10632
|
+
${hasScaleDownInfo ? html`<axebow-divider type="dashed" color="var(--axebow-base)" margin="0.75rem 0"></axebow-divider>` : ""}
|
|
10385
10633
|
${config.cpuDown ? this._field(config.scaleDownCpuLabel, `${config.cpuDown}%`) : ""}
|
|
10386
10634
|
${config.cpuDown && config.memoryDown ? html`<p class="text-base text-(--axebow-black)">${config.andLabel}</p>` : ""}
|
|
10387
10635
|
${config.memoryDown ? this._field(config.scaleDownMemoryLabel, `${config.memoryDown}%`) : ""}
|
|
10388
|
-
${hasScaleDownInfo ? html`<
|
|
10636
|
+
${hasScaleDownInfo ? html`<axebow-divider type="dashed" color="var(--axebow-base)" margin="0.75rem 0"></axebow-divider>` : ""}
|
|
10389
10637
|
${config.histeresys ? this._field(config.cooldownLabel, config.histeresys) : ""}
|
|
10390
10638
|
</div>
|
|
10391
10639
|
`;
|
|
@@ -10477,7 +10725,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
10477
10725
|
<div>
|
|
10478
10726
|
${step.items.length ? html`
|
|
10479
10727
|
${plainItems.length ? this._renderNameValueGrid(plainItems, step.variableNameLabel, step.variableValueLabel) : ""}
|
|
10480
|
-
${pathItems.length && plainItems.length ? html`<
|
|
10728
|
+
${pathItems.length && plainItems.length ? html`<axebow-divider color="var(--axebow-table-header-border, #dbdde4)" margin="0.75rem 0"></axebow-divider>` : ""}
|
|
10481
10729
|
${pathItems.length ? this._renderNameValueGrid(pathItems.map((item) => ({
|
|
10482
10730
|
name: item.name,
|
|
10483
10731
|
value: item.path
|
|
@@ -10665,6 +10913,7 @@ var AxebowSummaryStepHeader = class AxebowSummaryStepHeader extends LitElement {
|
|
|
10665
10913
|
this.editLabel = "Edit";
|
|
10666
10914
|
this.editingLabel = "Editing";
|
|
10667
10915
|
this.enabled = true;
|
|
10916
|
+
this.hasWarning = false;
|
|
10668
10917
|
}
|
|
10669
10918
|
static {
|
|
10670
10919
|
this.styles = [unsafeCSS(tailwind_default), axebowTheme];
|
|
@@ -10673,7 +10922,7 @@ var AxebowSummaryStepHeader = class AxebowSummaryStepHeader extends LitElement {
|
|
|
10673
10922
|
return html`
|
|
10674
10923
|
<div class="flex gap-2 items-center justify-between">
|
|
10675
10924
|
<div class="flex items-center gap-0.5 min-w-0">
|
|
10676
|
-
${this.valid && this.enabled ? html`
|
|
10925
|
+
${(this.valid || this.hasWarning) && this.enabled ? html`
|
|
10677
10926
|
<axebow-icon
|
|
10678
10927
|
iconName="${this.collapsed ? "expand_all" : "collapse_all"}"
|
|
10679
10928
|
iconColor="var(--axebow-tertiary)"
|
|
@@ -10688,7 +10937,12 @@ var AxebowSummaryStepHeader = class AxebowSummaryStepHeader extends LitElement {
|
|
|
10688
10937
|
>
|
|
10689
10938
|
STEP ${this.stepNumber}: ${this.stepTitle}
|
|
10690
10939
|
</h5>
|
|
10691
|
-
${this.
|
|
10940
|
+
${this.hasWarning ? html`<axebow-icon
|
|
10941
|
+
class="shrink-0"
|
|
10942
|
+
iconName="error"
|
|
10943
|
+
iconColor="var(--axebow-error)"
|
|
10944
|
+
size="md"
|
|
10945
|
+
></axebow-icon>` : this.valid && this.enabled && !this.isEditing ? html`<axebow-icon
|
|
10692
10946
|
class="shrink-0"
|
|
10693
10947
|
iconName="check_circle"
|
|
10694
10948
|
iconColor="var(--axebow-success)"
|
|
@@ -10732,6 +10986,7 @@ __decorate([property({ type: Boolean })], AxebowSummaryStepHeader.prototype, "is
|
|
|
10732
10986
|
__decorate([property({ type: String })], AxebowSummaryStepHeader.prototype, "editLabel", void 0);
|
|
10733
10987
|
__decorate([property({ type: String })], AxebowSummaryStepHeader.prototype, "editingLabel", void 0);
|
|
10734
10988
|
__decorate([property({ type: Boolean })], AxebowSummaryStepHeader.prototype, "enabled", void 0);
|
|
10989
|
+
__decorate([property({ type: Boolean })], AxebowSummaryStepHeader.prototype, "hasWarning", void 0);
|
|
10735
10990
|
AxebowSummaryStepHeader = __decorate([customElement("axebow-summary-step-header")], AxebowSummaryStepHeader);
|
|
10736
10991
|
//#endregion
|
|
10737
10992
|
//#region src/components/axebow-summary/axebow-summary-step.ts
|
|
@@ -10743,6 +10998,7 @@ var AxebowSummaryStep = class AxebowSummaryStep extends LitElement {
|
|
|
10743
10998
|
this.collapsed = false;
|
|
10744
10999
|
this.visible = false;
|
|
10745
11000
|
this.isEditing = false;
|
|
11001
|
+
this.hasWarning = false;
|
|
10746
11002
|
this.enabled = true;
|
|
10747
11003
|
}
|
|
10748
11004
|
static {
|
|
@@ -10757,6 +11013,7 @@ var AxebowSummaryStep = class AxebowSummaryStep extends LitElement {
|
|
|
10757
11013
|
.valid=${this.valid}
|
|
10758
11014
|
.collapsed=${this.collapsed}
|
|
10759
11015
|
.isEditing=${this.isEditing}
|
|
11016
|
+
.hasWarning=${this.hasWarning}
|
|
10760
11017
|
.enabled=${this.enabled}
|
|
10761
11018
|
@toggle=${this._handleToggle}
|
|
10762
11019
|
@edit=${this._handleEdit}
|
|
@@ -10766,7 +11023,7 @@ var AxebowSummaryStep = class AxebowSummaryStep extends LitElement {
|
|
|
10766
11023
|
<slot></slot>
|
|
10767
11024
|
</div>
|
|
10768
11025
|
` : ""}
|
|
10769
|
-
<
|
|
11026
|
+
<axebow-divider></axebow-divider>
|
|
10770
11027
|
`;
|
|
10771
11028
|
}
|
|
10772
11029
|
_handleToggle() {
|
|
@@ -10791,6 +11048,7 @@ __decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "valid",
|
|
|
10791
11048
|
__decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "collapsed", void 0);
|
|
10792
11049
|
__decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "visible", void 0);
|
|
10793
11050
|
__decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "isEditing", void 0);
|
|
11051
|
+
__decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "hasWarning", void 0);
|
|
10794
11052
|
__decorate([property({ type: Boolean })], AxebowSummaryStep.prototype, "enabled", void 0);
|
|
10795
11053
|
AxebowSummaryStep = __decorate([customElement("axebow-summary-step")], AxebowSummaryStep);
|
|
10796
11054
|
//#endregion
|
|
@@ -10829,7 +11087,7 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
10829
11087
|
render() {
|
|
10830
11088
|
return html`
|
|
10831
11089
|
<div
|
|
10832
|
-
class="w-full lg:w-(--card-width) lg:sticky static top-25 h-auto ${this.cardHeight ? "lg:min-h-(--card-height)" : "lg:min-h-[calc(100vh-
|
|
11090
|
+
class="w-full lg:w-(--card-width) lg:sticky static top-25 h-auto ${this.cardHeight ? "lg:min-h-(--card-height)" : "lg:min-h-[calc(100vh-7.25rem)]"} rounded-md z-10 transition-all duration-300"
|
|
10833
11091
|
style="--card-width: ${this.cardWidth}; --card-height: ${this.cardHeight};"
|
|
10834
11092
|
>
|
|
10835
11093
|
<sl-card
|
|
@@ -10837,7 +11095,7 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
10837
11095
|
>
|
|
10838
11096
|
<div class="h-full flex flex-col">
|
|
10839
11097
|
${this._renderHeader()}
|
|
10840
|
-
<
|
|
11098
|
+
<axebow-divider></axebow-divider>
|
|
10841
11099
|
<div class="${this.isSummaryOpen ? "" : "hidden"} lg:block flex-1 mt-4">
|
|
10842
11100
|
<slot></slot>
|
|
10843
11101
|
</div>
|
|
@@ -10887,6 +11145,7 @@ var AxebowSummaryLimits = class AxebowSummaryLimits extends LitElement {
|
|
|
10887
11145
|
constructor(..._args) {
|
|
10888
11146
|
super(..._args);
|
|
10889
11147
|
this.supportedStorage = [];
|
|
11148
|
+
this.showSoftErrors = false;
|
|
10890
11149
|
}
|
|
10891
11150
|
static {
|
|
10892
11151
|
this.styles = [
|
|
@@ -10901,33 +11160,46 @@ var AxebowSummaryLimits = class AxebowSummaryLimits extends LitElement {
|
|
|
10901
11160
|
];
|
|
10902
11161
|
}
|
|
10903
11162
|
renderSection(title, limitKey) {
|
|
11163
|
+
const isMin = limitKey === "min";
|
|
11164
|
+
const isCpuError = isMin && this.showSoftErrors && this.limits.cpu && this.limits.cpu.min > this.limits.cpu.max;
|
|
11165
|
+
const isMemError = isMin && this.showSoftErrors && this.limits.memory && this.limits.memory.min > this.limits.memory.max;
|
|
11166
|
+
const isVolatileError = isMin && this.showSoftErrors && this.limits.volatileStorage && this.limits.volatileStorage.min > this.limits.volatileStorage.max;
|
|
11167
|
+
const isNonRepError = isMin && this.showSoftErrors && this.limits.nonReplicatedStorage && this.limits.nonReplicatedStorage.min > this.limits.nonReplicatedStorage.max;
|
|
11168
|
+
const isPersError = isMin && this.showSoftErrors && this.limits.persistentStorage && this.limits.persistentStorage.min > this.limits.persistentStorage.max;
|
|
10904
11169
|
return html`
|
|
10905
11170
|
<div class="w-full flex flex-col gap-2">
|
|
10906
11171
|
<p class="font-semibold text-base m-0">${title}</p>
|
|
10907
11172
|
<div class="flex gap-1.5">
|
|
10908
|
-
<div class="w-41 h-4.25 text-base">
|
|
10909
|
-
|
|
11173
|
+
<div class="w-41 h-4.25 text-base flex items-center gap-1">
|
|
11174
|
+
<span>${this.labels.vcpus}:</span>
|
|
11175
|
+
<span class="${isCpuError ? "text-(--axebow-error)" : "text-(--axebow-gray)"}">${this.limits.cpu ? this.limits.cpu[limitKey] : 0}</span>
|
|
11176
|
+
${isCpuError ? html`<axebow-icon iconName="error" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
10910
11177
|
</div>
|
|
10911
|
-
<div class="w-41 h-4.25 text-base">
|
|
10912
|
-
|
|
11178
|
+
<div class="w-41 h-4.25 text-base flex items-center gap-1">
|
|
11179
|
+
<span>${this.labels.memory}</span>
|
|
11180
|
+
<span class="${isMemError ? "text-(--axebow-error)" : "text-(--axebow-gray)"}">${this.limits.memory ? this.limits.memory[limitKey] : 0} GB</span>
|
|
11181
|
+
${isMemError ? html`<axebow-icon iconName="error" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
10913
11182
|
</div>
|
|
10914
11183
|
</div>
|
|
10915
|
-
${this.supportedStorage.includes("volatile") ? html`
|
|
10916
|
-
<p class="text-base m-0">
|
|
10917
|
-
|
|
10918
|
-
<span class="text-(--axebow-gray)">${this.limits.volatileStorage[limitKey]} GB</span>
|
|
11184
|
+
${this.supportedStorage.includes("volatile") && this.limits.volatileStorage ? html`
|
|
11185
|
+
<p class="text-base m-0 flex items-center gap-1">
|
|
11186
|
+
<span>${this.labels.volatile}:</span>
|
|
11187
|
+
<span class="${isVolatileError ? "text-(--axebow-error)" : "text-(--axebow-gray)"}">${this.limits.volatileStorage[limitKey]} GB</span>
|
|
11188
|
+
${isVolatileError ? html`<axebow-icon iconName="error" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
10919
11189
|
</p>
|
|
10920
11190
|
` : ""}
|
|
10921
|
-
${this.supportedStorage.includes("nonReplicated") ? html`
|
|
10922
|
-
<p class="text-base m-0">
|
|
10923
|
-
|
|
10924
|
-
<span class="text-(--axebow-gray)">${this.limits.nonReplicatedStorage[limitKey]} GB</span>
|
|
11191
|
+
${this.supportedStorage.includes("nonReplicated") && this.limits.nonReplicatedStorage ? html`
|
|
11192
|
+
<p class="text-base m-0 flex items-center gap-1">
|
|
11193
|
+
<span>${this.labels.nonReplicated}:</span>
|
|
11194
|
+
<span class="${isNonRepError ? "text-(--axebow-error)" : "text-(--axebow-gray)"}">${this.limits.nonReplicatedStorage[limitKey]} GB</span>
|
|
11195
|
+
${isNonRepError ? html`<axebow-icon iconName="error" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
10925
11196
|
</p>
|
|
10926
11197
|
` : ""}
|
|
10927
|
-
${this.supportedStorage.includes("persistent") ? html`
|
|
10928
|
-
<p class="text-base m-0">
|
|
10929
|
-
|
|
10930
|
-
<span class="text-(--axebow-gray)">${this.limits.persistentStorage[limitKey]} GB</span>
|
|
11198
|
+
${this.supportedStorage.includes("persistent") && this.limits.persistentStorage ? html`
|
|
11199
|
+
<p class="text-base m-0 flex items-center gap-1">
|
|
11200
|
+
<span>${this.labels.persistent}:</span>
|
|
11201
|
+
<span class="${isPersError ? "text-(--axebow-error)" : "text-(--axebow-gray)"}">${this.limits.persistentStorage[limitKey]} GB</span>
|
|
11202
|
+
${isPersError ? html`<axebow-icon iconName="error" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
10931
11203
|
</p>
|
|
10932
11204
|
` : ""}
|
|
10933
11205
|
</div>
|
|
@@ -10937,7 +11209,7 @@ var AxebowSummaryLimits = class AxebowSummaryLimits extends LitElement {
|
|
|
10937
11209
|
if (!this.limits || !this.labels) return html``;
|
|
10938
11210
|
return html`
|
|
10939
11211
|
${this.renderSection(this.labels.hardLimits, "max")}
|
|
10940
|
-
<
|
|
11212
|
+
<axebow-divider></axebow-divider>
|
|
10941
11213
|
${this.renderSection(this.labels.softLimits, "min")}
|
|
10942
11214
|
`;
|
|
10943
11215
|
}
|
|
@@ -10945,6 +11217,7 @@ var AxebowSummaryLimits = class AxebowSummaryLimits extends LitElement {
|
|
|
10945
11217
|
__decorate([property({ type: Object })], AxebowSummaryLimits.prototype, "limits", void 0);
|
|
10946
11218
|
__decorate([property({ type: Array })], AxebowSummaryLimits.prototype, "supportedStorage", void 0);
|
|
10947
11219
|
__decorate([property({ type: Object })], AxebowSummaryLimits.prototype, "labels", void 0);
|
|
11220
|
+
__decorate([property({ type: Boolean })], AxebowSummaryLimits.prototype, "showSoftErrors", void 0);
|
|
10948
11221
|
AxebowSummaryLimits = __decorate([customElement("axebow-summary-limits")], AxebowSummaryLimits);
|
|
10949
11222
|
//#endregion
|
|
10950
11223
|
//#region src/components/axebow-summary/axebow-summary-flavors.ts
|
|
@@ -10963,43 +11236,40 @@ var AxebowSummaryFlavors = class AxebowSummaryFlavors extends LitElement {
|
|
|
10963
11236
|
${this.hasFlavors || this.nodes || this.highAvailable !== void 0 || this.autoscale !== void 0 || this.supportedStorage.some((s) => this.flavors?.[s]?.[0]) ? html`
|
|
10964
11237
|
<div class="flex w-full gap-[2%]">
|
|
10965
11238
|
<div class="flex-1 flex flex-col gap-2">
|
|
10966
|
-
<p><strong>${this.labels.workload}</strong></p>
|
|
10967
11239
|
${this.hasFlavors && this.flavors?.small?.[0] ? html`<p>${this.labels.runtimePlane}</p>` : ""}
|
|
10968
11240
|
<p>${this.labels.numberOfVms}</p>
|
|
10969
11241
|
${this.hasFlavors && this.flavors?.medium?.[0] ? html`<p>${this.labels.controlPlane}</p>` : ""}
|
|
10970
11242
|
${this.highAvailable !== void 0 ? html`<p>${this.labels.highAvailable}</p>` : ""}
|
|
10971
11243
|
</div>
|
|
10972
11244
|
<div class="flex-1 flex flex-col gap-2">
|
|
10973
|
-
|
|
10974
|
-
|
|
10975
|
-
<p><strong class="text-(--axebow-primary)">${this.nodes?.max || "0"}</strong></p>
|
|
11245
|
+
${this.hasFlavors && this.flavors?.small?.[0] ? html`<p><span class="text-(--axebow-primary)">${this.flavors?.small?.[0]}</span></p>` : ""}
|
|
11246
|
+
<p><span class="text-(--axebow-primary)">${this.nodes?.max || "0"}</span></p>
|
|
10976
11247
|
|
|
10977
|
-
${this.hasFlavors && this.flavors?.medium?.[0] ? html`<p><
|
|
11248
|
+
${this.hasFlavors && this.flavors?.medium?.[0] ? html`<p><span class="text-(--axebow-primary)">${this.flavors?.medium?.[0]}</span></p>` : ""}
|
|
10978
11249
|
${this.highAvailable !== void 0 ? html`<p>
|
|
10979
|
-
<
|
|
10980
|
-
>${this.highAvailable ? this.labels.yes : this.labels.no}</
|
|
11250
|
+
<span class="text-(--axebow-primary)"
|
|
11251
|
+
>${this.highAvailable ? this.labels.yes : this.labels.no}</span
|
|
10981
11252
|
>
|
|
10982
11253
|
</p>` : ""}
|
|
10983
11254
|
</div>
|
|
10984
11255
|
</div>
|
|
10985
11256
|
${this.supportedStorage.some((s) => this.flavors?.[s]?.[0]) ? html`
|
|
11257
|
+
<axebow-divider type="dashed"></axebow-divider>
|
|
10986
11258
|
<div class="flex w-full gap-[2%] mt-2">
|
|
10987
11259
|
<div class="flex-1 flex flex-col gap-2">
|
|
10988
|
-
<p><strong>${this.labels.storage}</strong></p>
|
|
10989
11260
|
${this.supportedStorage.includes("volatile") && this.flavors?.volatile?.[0] ? html`<p>${this.labels.volatile}</p>` : ""}
|
|
10990
11261
|
${this.supportedStorage.includes("nonReplicated") && this.flavors?.nonReplicated?.[0] ? html`<p>${this.labels.nonReplPersistent}</p>` : ""}
|
|
10991
11262
|
${this.supportedStorage.includes("persistent") && this.flavors?.persistent?.[0] ? html`<p>${this.labels.persistentReplicated}</p>` : ""}
|
|
10992
11263
|
</div>
|
|
10993
11264
|
<div class="flex-1 flex flex-col gap-2">
|
|
10994
|
-
<p><strong>${this.labels.selectedFlavor}</strong></p>
|
|
10995
11265
|
${this.supportedStorage.includes("volatile") && this.flavors?.volatile?.[0] ? html`<p>
|
|
10996
|
-
<
|
|
11266
|
+
<span class="text-(--axebow-primary)">${this.flavors?.volatile?.[0]}</span>
|
|
10997
11267
|
</p>` : ""}
|
|
10998
11268
|
${this.supportedStorage.includes("nonReplicated") && this.flavors?.nonReplicated?.[0] ? html`<p>
|
|
10999
|
-
<
|
|
11269
|
+
<span class="text-(--axebow-primary)">${this.flavors?.nonReplicated?.[0]}</span>
|
|
11000
11270
|
</p>` : ""}
|
|
11001
11271
|
${this.supportedStorage.includes("persistent") && this.flavors?.persistent?.[0] ? html`<p>
|
|
11002
|
-
<
|
|
11272
|
+
<span class="text-(--axebow-primary)">${this.flavors?.persistent?.[0]}</span>
|
|
11003
11273
|
</p>` : ""}
|
|
11004
11274
|
</div>
|
|
11005
11275
|
</div>
|
|
@@ -11160,6 +11430,7 @@ var AxebowStatus = class AxebowStatus extends LitElement {
|
|
|
11160
11430
|
this.statusText = "Free";
|
|
11161
11431
|
this.statusColor = "var(--axebow-success)";
|
|
11162
11432
|
this.deleting = false;
|
|
11433
|
+
this._isTrashHovered = false;
|
|
11163
11434
|
}
|
|
11164
11435
|
static {
|
|
11165
11436
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
@@ -11176,20 +11447,44 @@ var AxebowStatus = class AxebowStatus extends LitElement {
|
|
|
11176
11447
|
composed: true
|
|
11177
11448
|
}));
|
|
11178
11449
|
}
|
|
11450
|
+
_handleTrashMouseEnter() {
|
|
11451
|
+
if (this.deleting) return;
|
|
11452
|
+
this._isTrashHovered = true;
|
|
11453
|
+
this.dispatchEvent(new CustomEvent("trash-hover", {
|
|
11454
|
+
detail: { hovered: true },
|
|
11455
|
+
bubbles: true,
|
|
11456
|
+
composed: true
|
|
11457
|
+
}));
|
|
11458
|
+
}
|
|
11459
|
+
_handleTrashMouseLeave() {
|
|
11460
|
+
if (this.deleting) return;
|
|
11461
|
+
this._isTrashHovered = false;
|
|
11462
|
+
this.dispatchEvent(new CustomEvent("trash-hover", {
|
|
11463
|
+
detail: { hovered: false },
|
|
11464
|
+
bubbles: true,
|
|
11465
|
+
composed: true
|
|
11466
|
+
}));
|
|
11467
|
+
}
|
|
11179
11468
|
render() {
|
|
11469
|
+
const isDeleting = this.deleting;
|
|
11470
|
+
const currentText = isDeleting ? "Deleting" : this.statusText;
|
|
11471
|
+
const currentColor = isDeleting || this._isTrashHovered ? "var(--axebow-error)" : this.statusColor;
|
|
11472
|
+
const showTrashIcon = this.showTrash && !isDeleting;
|
|
11180
11473
|
return html`
|
|
11181
11474
|
<div class="flex items-center justify-between h-fit gap-2">
|
|
11182
11475
|
<div class="flex items-center gap-1.5">
|
|
11183
|
-
${
|
|
11184
|
-
<span class="font-medium text-(--axebow-strong-gray)">${
|
|
11476
|
+
${currentColor ? html`<div class="h-2 w-2 rounded-full shrink-0 transition-colors duration-200" style="background-color: ${currentColor};"></div>` : ""}
|
|
11477
|
+
<span class="font-medium text-(--axebow-strong-gray)">${currentText}</span>
|
|
11185
11478
|
</div>
|
|
11186
|
-
${
|
|
11479
|
+
${showTrashIcon ? html`
|
|
11187
11480
|
<button
|
|
11188
11481
|
type="button"
|
|
11189
|
-
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-(--axebow-error) hover:text-(--axebow-gray) transition-colors
|
|
11482
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-(--axebow-error) hover:text-(--axebow-gray) transition-colors"
|
|
11483
|
+
@mouseenter=${this._handleTrashMouseEnter}
|
|
11484
|
+
@mouseleave=${this._handleTrashMouseLeave}
|
|
11190
11485
|
@click=${this._handleDelete}
|
|
11191
11486
|
>
|
|
11192
|
-
<axebow-icon iconName="delete"
|
|
11487
|
+
<axebow-icon iconName="delete" iconColor="currentColor" size="lg"></axebow-icon>
|
|
11193
11488
|
</button>
|
|
11194
11489
|
` : ""}
|
|
11195
11490
|
</div>
|
|
@@ -11200,6 +11495,7 @@ __decorate([property({ type: Boolean })], AxebowStatus.prototype, "showTrash", v
|
|
|
11200
11495
|
__decorate([property({ type: String })], AxebowStatus.prototype, "statusText", void 0);
|
|
11201
11496
|
__decorate([property({ type: String })], AxebowStatus.prototype, "statusColor", void 0);
|
|
11202
11497
|
__decorate([property({ type: Boolean })], AxebowStatus.prototype, "deleting", void 0);
|
|
11498
|
+
__decorate([state()], AxebowStatus.prototype, "_isTrashHovered", void 0);
|
|
11203
11499
|
AxebowStatus = __decorate([customElement("axebow-status")], AxebowStatus);
|
|
11204
11500
|
//#endregion
|
|
11205
11501
|
//#region src/components/axebow-form-panel-field/axebow-form-panel-field.ts
|
|
@@ -11221,6 +11517,10 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11221
11517
|
this.secondaryActionIcon = "open_in_new";
|
|
11222
11518
|
this.options = [];
|
|
11223
11519
|
this._isDropdownOpen = false;
|
|
11520
|
+
this._openUpwards = false;
|
|
11521
|
+
this._handleWindowChange = () => {
|
|
11522
|
+
if (this._isDropdownOpen) this._checkPlacement();
|
|
11523
|
+
};
|
|
11224
11524
|
this._handleOutsideClick = (e) => {
|
|
11225
11525
|
if (this._isDropdownOpen && !e.composedPath().includes(this)) this._isDropdownOpen = false;
|
|
11226
11526
|
};
|
|
@@ -11245,10 +11545,24 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11245
11545
|
connectedCallback() {
|
|
11246
11546
|
super.connectedCallback();
|
|
11247
11547
|
window.addEventListener("click", this._handleOutsideClick);
|
|
11548
|
+
window.addEventListener("resize", this._handleWindowChange);
|
|
11549
|
+
window.addEventListener("scroll", this._handleWindowChange, true);
|
|
11248
11550
|
}
|
|
11249
11551
|
disconnectedCallback() {
|
|
11250
11552
|
super.disconnectedCallback();
|
|
11251
11553
|
window.removeEventListener("click", this._handleOutsideClick);
|
|
11554
|
+
window.removeEventListener("resize", this._handleWindowChange);
|
|
11555
|
+
window.removeEventListener("scroll", this._handleWindowChange, true);
|
|
11556
|
+
}
|
|
11557
|
+
_checkPlacement() {
|
|
11558
|
+
const rect = this.getBoundingClientRect();
|
|
11559
|
+
const estimatedHeight = Math.min((this.options?.length || 0) * 36 + 10, 200);
|
|
11560
|
+
const spaceBelow = window.innerHeight - rect.bottom;
|
|
11561
|
+
const spaceAbove = rect.top;
|
|
11562
|
+
this._openUpwards = spaceBelow < estimatedHeight && spaceAbove > spaceBelow;
|
|
11563
|
+
}
|
|
11564
|
+
get _isSelector() {
|
|
11565
|
+
return Boolean(this.showDropdown || this.options && this.options.length > 0);
|
|
11252
11566
|
}
|
|
11253
11567
|
_handleFocus(_e) {
|
|
11254
11568
|
if (this.disabled) return;
|
|
@@ -11267,7 +11581,7 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11267
11581
|
}));
|
|
11268
11582
|
}
|
|
11269
11583
|
_handleInput(e) {
|
|
11270
|
-
if (this.disabled) return;
|
|
11584
|
+
if (this.disabled || this._isSelector) return;
|
|
11271
11585
|
const target = e.target;
|
|
11272
11586
|
this.value = target.value;
|
|
11273
11587
|
this.dispatchEvent(new CustomEvent("change", {
|
|
@@ -11276,6 +11590,35 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11276
11590
|
composed: true
|
|
11277
11591
|
}));
|
|
11278
11592
|
}
|
|
11593
|
+
_handleKeyDown(e) {
|
|
11594
|
+
if (this.disabled) return;
|
|
11595
|
+
if (this._isSelector) {
|
|
11596
|
+
if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") {
|
|
11597
|
+
e.preventDefault();
|
|
11598
|
+
this._handleDropdownClick(e);
|
|
11599
|
+
} else if (e.key === "Escape" && this._isDropdownOpen) {
|
|
11600
|
+
e.preventDefault();
|
|
11601
|
+
this._isDropdownOpen = false;
|
|
11602
|
+
}
|
|
11603
|
+
} else if (e.key === "Enter") {
|
|
11604
|
+
e.preventDefault();
|
|
11605
|
+
const target = e.target;
|
|
11606
|
+
if (target) {
|
|
11607
|
+
this.value = target.value;
|
|
11608
|
+
this.dispatchEvent(new CustomEvent("change", {
|
|
11609
|
+
detail: { value: this.value },
|
|
11610
|
+
bubbles: true,
|
|
11611
|
+
composed: true
|
|
11612
|
+
}));
|
|
11613
|
+
target.blur();
|
|
11614
|
+
}
|
|
11615
|
+
this.dispatchEvent(new CustomEvent("submit", {
|
|
11616
|
+
detail: { value: this.value },
|
|
11617
|
+
bubbles: true,
|
|
11618
|
+
composed: true
|
|
11619
|
+
}));
|
|
11620
|
+
}
|
|
11621
|
+
}
|
|
11279
11622
|
_handleActionClick(e) {
|
|
11280
11623
|
e.stopPropagation();
|
|
11281
11624
|
const textToCopy = this.copyValue !== void 0 && this.copyValue !== "" ? this.copyValue : this.value;
|
|
@@ -11305,7 +11648,10 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11305
11648
|
_handleDropdownClick(e) {
|
|
11306
11649
|
e.stopPropagation();
|
|
11307
11650
|
if (this.disabled) return;
|
|
11308
|
-
if (this.options && this.options.length > 0)
|
|
11651
|
+
if (this.options && this.options.length > 0) {
|
|
11652
|
+
if (!this._isDropdownOpen) this._checkPlacement();
|
|
11653
|
+
this._isDropdownOpen = !this._isDropdownOpen;
|
|
11654
|
+
}
|
|
11309
11655
|
this.dispatchEvent(new CustomEvent("dropdown-click", {
|
|
11310
11656
|
detail: { isOpen: this._isDropdownOpen },
|
|
11311
11657
|
bubbles: true,
|
|
@@ -11328,15 +11674,17 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11328
11674
|
}));
|
|
11329
11675
|
}
|
|
11330
11676
|
render() {
|
|
11677
|
+
const isSelector = this._isSelector;
|
|
11331
11678
|
const isFilled = this.styleVariant && this.styleVariant.toLowerCase() === "filled" || !!this.value;
|
|
11332
|
-
const bgClass = this.disabled ? "bg-(--axebow-base) border border-solid border-(--axebow-border-gray)" :
|
|
11679
|
+
const bgClass = this.disabled ? "bg-(--axebow-base) border border-solid border-(--axebow-border-gray)" : `bg-white border border-solid ${this._isDropdownOpen ? "border-black" : "border-(--axebow-border-gray)"} focus-within:border-black`;
|
|
11333
11680
|
const textColor = this.disabled ? "text-(--axebow-gray)" : isFilled ? "text-(--axebow-strong-gray)" : "text-(--axebow-gray)";
|
|
11334
11681
|
return html`
|
|
11335
11682
|
<div class="relative w-full">
|
|
11336
11683
|
<!-- Field Container -->
|
|
11337
11684
|
<div
|
|
11338
|
-
class="field-container border flex items-center justify-between gap-2 ${bgClass} ${
|
|
11339
|
-
@click=${
|
|
11685
|
+
class="field-container border flex items-center justify-between gap-2 ${bgClass} ${isSelector && !this.disabled ? "cursor-pointer select-none" : ""}"
|
|
11686
|
+
@click=${isSelector ? this._handleDropdownClick : null}
|
|
11687
|
+
@keydown=${this._handleKeyDown}
|
|
11340
11688
|
>
|
|
11341
11689
|
<div class="flex flex-col justify-center flex-1 min-w-0">
|
|
11342
11690
|
<!-- Top Label -->
|
|
@@ -11348,13 +11696,15 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11348
11696
|
<!-- Value / Input -->
|
|
11349
11697
|
<input
|
|
11350
11698
|
type="text"
|
|
11351
|
-
class="w-full bg-transparent border-0 p-0 text-sm font-normal ${textColor} focus:outline-none truncate"
|
|
11699
|
+
class="w-full bg-transparent border-0 p-0 text-sm font-normal ${textColor} focus:outline-none truncate ${isSelector && !this.disabled ? "cursor-pointer select-none" : ""}"
|
|
11352
11700
|
.value=${this.value}
|
|
11353
11701
|
placeholder=${this.placeholderCopy}
|
|
11354
11702
|
?disabled=${this.disabled}
|
|
11703
|
+
?readonly=${isSelector}
|
|
11355
11704
|
@input=${this._handleInput}
|
|
11356
11705
|
@focus=${this._handleFocus}
|
|
11357
11706
|
@blur=${this._handleBlur}
|
|
11707
|
+
@keydown=${this._handleKeyDown}
|
|
11358
11708
|
/>
|
|
11359
11709
|
</div>
|
|
11360
11710
|
|
|
@@ -11387,7 +11737,7 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11387
11737
|
<axebow-icon iconName="cancel" iconColor="currentColor" size="lg"></axebow-icon>
|
|
11388
11738
|
</button>
|
|
11389
11739
|
` : ""}
|
|
11390
|
-
${
|
|
11740
|
+
${isSelector ? html`
|
|
11391
11741
|
<button
|
|
11392
11742
|
type="button"
|
|
11393
11743
|
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-(--axebow-tertiary) hover:text-(--axebow-gray) transition-colors"
|
|
@@ -11405,9 +11755,9 @@ var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
|
11405
11755
|
</div>
|
|
11406
11756
|
|
|
11407
11757
|
<!-- Dropdown Menu Overlay -->
|
|
11408
|
-
${
|
|
11758
|
+
${isSelector && this._isDropdownOpen && this.options && this.options.length > 0 ? html`
|
|
11409
11759
|
<div
|
|
11410
|
-
class="absolute left-0 top-full mt-1 w-full bg-white border border-solid border-(--axebow-border-gray) rounded-md shadow-lg z-50 max-h-48 overflow-y-auto py-1 box-border"
|
|
11760
|
+
class="absolute left-0 ${this._openUpwards ? "bottom-full mb-1" : "top-full mt-1"} w-full bg-white border border-solid border-(--axebow-border-gray) rounded-md shadow-lg z-50 max-h-48 overflow-y-auto py-1 box-border"
|
|
11411
11761
|
>
|
|
11412
11762
|
${this.options.map((opt) => {
|
|
11413
11763
|
const isSelected = opt === this.value;
|
|
@@ -11442,6 +11792,7 @@ __decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "showS
|
|
|
11442
11792
|
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "secondaryActionIcon", void 0);
|
|
11443
11793
|
__decorate([property({ type: Array })], AxebowFormPanelField.prototype, "options", void 0);
|
|
11444
11794
|
__decorate([state()], AxebowFormPanelField.prototype, "_isDropdownOpen", void 0);
|
|
11795
|
+
__decorate([state()], AxebowFormPanelField.prototype, "_openUpwards", void 0);
|
|
11445
11796
|
AxebowFormPanelField = __decorate([customElement("axebow-form-panel-field")], AxebowFormPanelField);
|
|
11446
11797
|
//#endregion
|
|
11447
11798
|
//#region src/components/axebow-box-form/axebow-box-form.ts
|
|
@@ -11454,12 +11805,22 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11454
11805
|
this.deleting = false;
|
|
11455
11806
|
this.items = [];
|
|
11456
11807
|
this._openMenuId = null;
|
|
11808
|
+
this._menuOpenUpwards = false;
|
|
11809
|
+
this._isTrashHovered = false;
|
|
11457
11810
|
this._handleOutsideClick = (e) => {
|
|
11458
11811
|
if (!e.composedPath().includes(this)) this._closeMenu();
|
|
11459
11812
|
};
|
|
11813
|
+
this._handleTrashHover = (e) => {
|
|
11814
|
+
this._isTrashHovered = Boolean(e.detail?.hovered);
|
|
11815
|
+
};
|
|
11460
11816
|
}
|
|
11461
11817
|
static {
|
|
11462
|
-
this.styles = unsafeCSS(tailwind_default)
|
|
11818
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
11819
|
+
:host {
|
|
11820
|
+
display: flex;
|
|
11821
|
+
flex-direction: column;
|
|
11822
|
+
}
|
|
11823
|
+
`];
|
|
11463
11824
|
}
|
|
11464
11825
|
connectedCallback() {
|
|
11465
11826
|
super.connectedCallback();
|
|
@@ -11469,6 +11830,13 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11469
11830
|
super.disconnectedCallback();
|
|
11470
11831
|
window.removeEventListener("click", this._handleOutsideClick);
|
|
11471
11832
|
}
|
|
11833
|
+
_checkMenuPlacement(target) {
|
|
11834
|
+
const rect = (target || this).getBoundingClientRect();
|
|
11835
|
+
const estimatedHeight = 250;
|
|
11836
|
+
const spaceBelow = window.innerHeight - rect.bottom;
|
|
11837
|
+
const spaceAbove = rect.top;
|
|
11838
|
+
this._menuOpenUpwards = spaceBelow < estimatedHeight && spaceAbove > spaceBelow;
|
|
11839
|
+
}
|
|
11472
11840
|
_copyToClipboard(text, e) {
|
|
11473
11841
|
e?.stopPropagation();
|
|
11474
11842
|
if (!text) return;
|
|
@@ -11527,7 +11895,10 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11527
11895
|
return;
|
|
11528
11896
|
}
|
|
11529
11897
|
if (this._openMenuId === item.menuId) this._closeMenu();
|
|
11530
|
-
else
|
|
11898
|
+
else {
|
|
11899
|
+
this._checkMenuPlacement(e.currentTarget);
|
|
11900
|
+
this._openMenuId = item.menuId;
|
|
11901
|
+
}
|
|
11531
11902
|
}
|
|
11532
11903
|
_handleMenuOption(item, option, textToCopy, e) {
|
|
11533
11904
|
e.stopPropagation();
|
|
@@ -11588,7 +11959,7 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11588
11959
|
</button>
|
|
11589
11960
|
${isMenuOpen ? html`
|
|
11590
11961
|
<div
|
|
11591
|
-
class="absolute right-0 top-full mt-1 z-50 min-w-50 bg-white rounded-md shadow-[0_4px_12px_rgba(0,0,0,0.1)] border border-solid border-(--axebow-border-gray) py-1.5 flex flex-col axebow-scrollbar"
|
|
11962
|
+
class="absolute right-0 ${this._menuOpenUpwards ? "bottom-full mb-1" : "top-full mt-1"} z-50 min-w-50 bg-white rounded-md shadow-[0_4px_12px_rgba(0,0,0,0.1)] border border-solid border-(--axebow-border-gray) py-1.5 flex flex-col axebow-scrollbar"
|
|
11592
11963
|
style="max-height: 250px; overflow-y: auto;"
|
|
11593
11964
|
>
|
|
11594
11965
|
${item.menuOptions.map((option) => html`
|
|
@@ -11671,6 +12042,13 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11671
12042
|
composed: true
|
|
11672
12043
|
}));
|
|
11673
12044
|
}}
|
|
12045
|
+
@submit=${(_e) => {
|
|
12046
|
+
this.dispatchEvent(new CustomEvent("item-submit", {
|
|
12047
|
+
detail: { item },
|
|
12048
|
+
bubbles: true,
|
|
12049
|
+
composed: true
|
|
12050
|
+
}));
|
|
12051
|
+
}}
|
|
11674
12052
|
@change=${(e) => {
|
|
11675
12053
|
item.value = e.detail?.value ?? e.target.value;
|
|
11676
12054
|
this.dispatchEvent(new CustomEvent("item-change", {
|
|
@@ -11687,7 +12065,7 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11687
12065
|
></axebow-form-panel-field>
|
|
11688
12066
|
${hasMenu && isMenuOpen ? html`
|
|
11689
12067
|
<div
|
|
11690
|
-
class="absolute right-0 top-full mt-1 z-50 min-w-50 bg-white rounded-md shadow-[0_4px_12px_rgba(0,0,0,0.1)] border border-solid border-(--axebow-border-gray) py-1.5 flex flex-col axebow-scrollbar"
|
|
12068
|
+
class="absolute right-0 ${this._menuOpenUpwards ? "bottom-full mb-1" : "top-full mt-1"} z-50 min-w-50 bg-white rounded-md shadow-[0_4px_12px_rgba(0,0,0,0.1)] border border-solid border-(--axebow-border-gray) py-1.5 flex flex-col axebow-scrollbar"
|
|
11691
12069
|
style="max-height: 250px; overflow-y: auto;"
|
|
11692
12070
|
>
|
|
11693
12071
|
${item.menuOptions.map((option) => html`
|
|
@@ -11701,7 +12079,7 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11701
12079
|
size="md"
|
|
11702
12080
|
></axebow-icon>
|
|
11703
12081
|
<span
|
|
11704
|
-
class="
|
|
12082
|
+
class="${option.variant === "danger" ? "text-(--axebow-error)" : "text-[#344966]"}"
|
|
11705
12083
|
>
|
|
11706
12084
|
${option.label}
|
|
11707
12085
|
</span>
|
|
@@ -11714,23 +12092,26 @@ var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
|
11714
12092
|
}
|
|
11715
12093
|
render() {
|
|
11716
12094
|
const isDeleting = this.deleting;
|
|
11717
|
-
const
|
|
12095
|
+
const isDanger = isDeleting || this._isTrashHovered;
|
|
12096
|
+
const computedStatusColor = isDanger ? "var(--axebow-error)" : this.statusColor;
|
|
12097
|
+
const computedStatusText = isDeleting ? "Deleting" : this.statusText;
|
|
11718
12098
|
return html`
|
|
11719
12099
|
<div
|
|
11720
|
-
class="flex flex-col gap-3 w-70
|
|
12100
|
+
class="flex flex-col gap-3 w-70 h-full p-4 bg-white rounded-md ${isDanger ? "border border-solid border-[var(--axebow-error)]" : "border border-solid border-transparent"} ${isDeleting ? "pointer-events-none opacity-70 select-none" : ""} axebow-shadow-hover box-border transition-colors duration-200"
|
|
11721
12101
|
>
|
|
11722
12102
|
<!-- Top Status Header -->
|
|
11723
12103
|
<axebow-status
|
|
11724
|
-
.statusText=${
|
|
12104
|
+
.statusText=${computedStatusText}
|
|
11725
12105
|
.statusColor=${computedStatusColor}
|
|
11726
|
-
?showTrash=${this.showTrash}
|
|
12106
|
+
?showTrash=${this.showTrash && !isDeleting}
|
|
11727
12107
|
?deleting=${this.deleting}
|
|
12108
|
+
@trash-hover=${this._handleTrashHover}
|
|
11728
12109
|
@delete=${this._handleDelete}
|
|
11729
12110
|
></axebow-status>
|
|
11730
12111
|
|
|
11731
12112
|
<!-- Form Fields List -->
|
|
11732
12113
|
<div class="flex flex-col gap-2.5 w-full">
|
|
11733
|
-
${this.items && this.items.length > 0 ? this.items.map((item) => this._renderField(isDeleting ? {
|
|
12114
|
+
${this.items && this.items.length > 0 ? this.items.map((item) => this._renderField(isDeleting && item.type !== "text" ? {
|
|
11734
12115
|
...item,
|
|
11735
12116
|
type: "disabled"
|
|
11736
12117
|
} : item)) : html`
|
|
@@ -11751,63 +12132,10 @@ __decorate([property({ type: Boolean })], AxebowResourceBoxForm.prototype, "show
|
|
|
11751
12132
|
__decorate([property({ type: Boolean })], AxebowResourceBoxForm.prototype, "deleting", void 0);
|
|
11752
12133
|
__decorate([property({ type: Array })], AxebowResourceBoxForm.prototype, "items", void 0);
|
|
11753
12134
|
__decorate([state()], AxebowResourceBoxForm.prototype, "_openMenuId", void 0);
|
|
12135
|
+
__decorate([state()], AxebowResourceBoxForm.prototype, "_menuOpenUpwards", void 0);
|
|
12136
|
+
__decorate([state()], AxebowResourceBoxForm.prototype, "_isTrashHovered", void 0);
|
|
11754
12137
|
AxebowResourceBoxForm = __decorate([customElement("axebow-resource-box-form")], AxebowResourceBoxForm);
|
|
11755
12138
|
//#endregion
|
|
11756
|
-
//#region src/components/axebow-manage-hyperlinks/axebow-manage-hyperlinks.ts
|
|
11757
|
-
var AxebowManageHyperlinks = class AxebowManageHyperlinks extends LitElement {
|
|
11758
|
-
constructor(..._args) {
|
|
11759
|
-
super(..._args);
|
|
11760
|
-
this.text = "";
|
|
11761
|
-
this.icon = "";
|
|
11762
|
-
this.color = "var(--axebow-tertiary)";
|
|
11763
|
-
this.iconColor = "";
|
|
11764
|
-
this.disabled = false;
|
|
11765
|
-
}
|
|
11766
|
-
static {
|
|
11767
|
-
this.styles = [unsafeCSS(tailwind_default), css`
|
|
11768
|
-
:host {
|
|
11769
|
-
display: inline-block;
|
|
11770
|
-
}
|
|
11771
|
-
button:hover:not(:disabled) {
|
|
11772
|
-
color: var(--axebow-gray) !important;
|
|
11773
|
-
}
|
|
11774
|
-
`];
|
|
11775
|
-
}
|
|
11776
|
-
_handleClick(e) {
|
|
11777
|
-
if (this.disabled) {
|
|
11778
|
-
e.preventDefault();
|
|
11779
|
-
e.stopPropagation();
|
|
11780
|
-
return;
|
|
11781
|
-
}
|
|
11782
|
-
this.dispatchEvent(new CustomEvent("hyperlink-click", {
|
|
11783
|
-
bubbles: true,
|
|
11784
|
-
composed: true,
|
|
11785
|
-
detail: { text: this.text }
|
|
11786
|
-
}));
|
|
11787
|
-
}
|
|
11788
|
-
render() {
|
|
11789
|
-
const buttonColor = this.color || "var(--axebow-tertiary)";
|
|
11790
|
-
const iconColorProp = this.iconColor || "currentColor";
|
|
11791
|
-
return html`
|
|
11792
|
-
<button
|
|
11793
|
-
type="button"
|
|
11794
|
-
?disabled=${this.disabled}
|
|
11795
|
-
@click=${this._handleClick}
|
|
11796
|
-
style="color: ${buttonColor};"
|
|
11797
|
-
class="inline-flex items-center gap-1.5 bg-transparent border-none p-0 cursor-pointer font-semibold text-sm focus:outline-none transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
|
|
11798
|
-
>
|
|
11799
|
-
<span>${this.text}</span>
|
|
11800
|
-
${this.icon ? html`<axebow-icon iconName="${this.icon}" iconColor="${iconColorProp}"></axebow-icon>` : ""}
|
|
11801
|
-
</button>`;
|
|
11802
|
-
}
|
|
11803
|
-
};
|
|
11804
|
-
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "text", void 0);
|
|
11805
|
-
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "icon", void 0);
|
|
11806
|
-
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "color", void 0);
|
|
11807
|
-
__decorate([property({ type: String })], AxebowManageHyperlinks.prototype, "iconColor", void 0);
|
|
11808
|
-
__decorate([property({ type: Boolean })], AxebowManageHyperlinks.prototype, "disabled", void 0);
|
|
11809
|
-
AxebowManageHyperlinks = __decorate([customElement("axebow-manage-hyperlinks")], AxebowManageHyperlinks);
|
|
11810
|
-
//#endregion
|
|
11811
12139
|
//#region src/components/axebow-box-section/axebow-box-section.ts
|
|
11812
12140
|
var AxebowBoxSection = class AxebowBoxSection extends LitElement {
|
|
11813
12141
|
constructor(..._args) {
|
|
@@ -12061,9 +12389,6 @@ var AxebowUsageTooltip = class AxebowUsageTooltip extends LitElement {
|
|
|
12061
12389
|
border: 3px solid var(--axebow-table-border);
|
|
12062
12390
|
width: 300px;
|
|
12063
12391
|
}
|
|
12064
|
-
sl-divider.dotted-divider {
|
|
12065
|
-
border-top: 1.5px dashed var(--axebow-light-gray);
|
|
12066
|
-
}
|
|
12067
12392
|
`];
|
|
12068
12393
|
}
|
|
12069
12394
|
render() {
|
|
@@ -12077,19 +12402,19 @@ var AxebowUsageTooltip = class AxebowUsageTooltip extends LitElement {
|
|
|
12077
12402
|
<span>${this.storageLabel} </span>
|
|
12078
12403
|
<span class="tooltip-value"> ${current.storage} / ${limit.storage.max} GB</span>
|
|
12079
12404
|
</div>
|
|
12080
|
-
<
|
|
12405
|
+
<axebow-divider type="dashed"></axebow-divider>
|
|
12081
12406
|
<div class="flex space-between ml-2 items-center gap-1">
|
|
12082
12407
|
<axebow-icon iconName="subdirectory_arrow_right" size="xl"></axebow-icon>
|
|
12083
12408
|
<span>${this.volatileLabel} </span>
|
|
12084
12409
|
<span class="tooltip-value"> ${current.volatileStorage} / ${limit.volatileStorage.max} GB</span>
|
|
12085
12410
|
</div>
|
|
12086
|
-
<
|
|
12411
|
+
<axebow-divider type="dashed"></axebow-divider>
|
|
12087
12412
|
<div class="flex space-between ml-2 items-center gap-1">
|
|
12088
12413
|
<axebow-icon iconName="subdirectory_arrow_right" size="xl"></axebow-icon>
|
|
12089
12414
|
<span>${this.nonRepPersLabel} </span>
|
|
12090
12415
|
<span class="tooltip-value"> ${current.nonReplicatedStorage} / ${limit.nonReplicatedStorage.max} GB</span>
|
|
12091
12416
|
</div>
|
|
12092
|
-
<
|
|
12417
|
+
<axebow-divider type="dashed"></axebow-divider>
|
|
12093
12418
|
<div class="flex space-between ml-2 items-center gap-1">
|
|
12094
12419
|
<axebow-icon iconName="subdirectory_arrow_right" size="xl"></axebow-icon>
|
|
12095
12420
|
<span>${this.persistentRepLabel} </span>
|
|
@@ -12583,12 +12908,6 @@ var AxebowObservabilityContainer = class AxebowObservabilityContainer extends Li
|
|
|
12583
12908
|
.log-filter-dropdown::part(panel) {
|
|
12584
12909
|
width: 17rem !important;
|
|
12585
12910
|
}
|
|
12586
|
-
sl-divider {
|
|
12587
|
-
height: 0.0625rem !important;
|
|
12588
|
-
border-top: none !important;
|
|
12589
|
-
background-color: var(--axebow-light-gray);
|
|
12590
|
-
margin-bottom: 0.90625rem !important;
|
|
12591
|
-
}
|
|
12592
12911
|
`
|
|
12593
12912
|
];
|
|
12594
12913
|
}
|
|
@@ -12738,7 +13057,7 @@ var AxebowObservabilityContainer = class AxebowObservabilityContainer extends Li
|
|
|
12738
13057
|
</div>
|
|
12739
13058
|
</div>
|
|
12740
13059
|
</div>
|
|
12741
|
-
<
|
|
13060
|
+
<axebow-divider margin="0.5rem 0 0.90625rem 0"></axebow-divider>
|
|
12742
13061
|
<iframe
|
|
12743
13062
|
id="${this.logsIframeId}"
|
|
12744
13063
|
allow="storage-access"
|
|
@@ -12768,7 +13087,7 @@ var AxebowObservabilityContainer = class AxebowObservabilityContainer extends Li
|
|
|
12768
13087
|
<div class="flex justify-between items-center">
|
|
12769
13088
|
<h1 class="m-0 text-base uppercase font-semibold text-(--axebow-gray)">${this.terminalTitle}</h1>
|
|
12770
13089
|
</div>
|
|
12771
|
-
<
|
|
13090
|
+
<axebow-divider margin="0.5rem 0 0.90625rem 0"></axebow-divider>
|
|
12772
13091
|
<iframe
|
|
12773
13092
|
id="${this.terminalIframeId}"
|
|
12774
13093
|
allow="storage-access"
|
|
@@ -12852,6 +13171,51 @@ __decorate([property({ type: String })], AxebowObservabilityContainer.prototype,
|
|
|
12852
13171
|
__decorate([property({ type: String })], AxebowObservabilityContainer.prototype, "terminalIframeId", void 0);
|
|
12853
13172
|
AxebowObservabilityContainer = __decorate([customElement("axebow-observability-container")], AxebowObservabilityContainer);
|
|
12854
13173
|
//#endregion
|
|
12855
|
-
|
|
13174
|
+
//#region src/components/axebow-empty-state/axebow-empty-state.ts
|
|
13175
|
+
var AxebowEmptyState = class AxebowEmptyState extends LitElement {
|
|
13176
|
+
constructor(..._args) {
|
|
13177
|
+
super(..._args);
|
|
13178
|
+
this.message = "";
|
|
13179
|
+
this.messageBefore = "";
|
|
13180
|
+
this.actionText = "";
|
|
13181
|
+
this.messageAfter = "";
|
|
13182
|
+
}
|
|
13183
|
+
static {
|
|
13184
|
+
this.styles = unsafeCSS(tailwind_default);
|
|
13185
|
+
}
|
|
13186
|
+
_handleActionClick(e) {
|
|
13187
|
+
e.preventDefault();
|
|
13188
|
+
e.stopPropagation();
|
|
13189
|
+
this.dispatchEvent(new CustomEvent("action-click", {
|
|
13190
|
+
bubbles: true,
|
|
13191
|
+
composed: true
|
|
13192
|
+
}));
|
|
13193
|
+
}
|
|
13194
|
+
render() {
|
|
13195
|
+
return html`
|
|
13196
|
+
<div class="w-full min-h-14 py-4 px-4 rounded-md bg-(--axebow-base) flex items-center justify-center text-center box-border">
|
|
13197
|
+
<slot>
|
|
13198
|
+
${Boolean(this.messageBefore || this.actionText || this.messageAfter) ? html`
|
|
13199
|
+
<span class="text-(--axebow-secondary) font-normal">
|
|
13200
|
+
${this.messageBefore ? html`${this.messageBefore} ` : ""}
|
|
13201
|
+
${this.actionText ? html`<axebow-button
|
|
13202
|
+
variant="text"
|
|
13203
|
+
@click=${this._handleActionClick}
|
|
13204
|
+
>${this.actionText}</axebow-button>` : ""}
|
|
13205
|
+
${this.messageAfter ? html` ${this.messageAfter}` : ""}
|
|
13206
|
+
</span>
|
|
13207
|
+
` : html`<span class="text-(--axebow-secondary) font-normal">${this.message}</span>`}
|
|
13208
|
+
</slot>
|
|
13209
|
+
</div>
|
|
13210
|
+
`;
|
|
13211
|
+
}
|
|
13212
|
+
};
|
|
13213
|
+
__decorate([property({ type: String })], AxebowEmptyState.prototype, "message", void 0);
|
|
13214
|
+
__decorate([property({ type: String })], AxebowEmptyState.prototype, "messageBefore", void 0);
|
|
13215
|
+
__decorate([property({ type: String })], AxebowEmptyState.prototype, "actionText", void 0);
|
|
13216
|
+
__decorate([property({ type: String })], AxebowEmptyState.prototype, "messageAfter", void 0);
|
|
13217
|
+
AxebowEmptyState = __decorate([customElement("axebow-empty-state")], AxebowEmptyState);
|
|
13218
|
+
//#endregion
|
|
13219
|
+
export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBanner, AxebowBaseCard, AxebowBoxSection, AxebowBreadcrumbHeader, AxebowButton, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarouselInput, AxebowCarouselSelectorItem, AxebowCarouselSelectorTenant, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowCopyBox, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDivider, AxebowDragDropUploadFile, AxebowDraggableService, AxebowEmptyState, AxebowExpandableCard, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowHeader, AxebowHelpBubble, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowInstancesTable, AxebowLimitsCounter, AxebowManageHyperlinks, AxebowMarketplaceCard, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowObservabilityContainer, AxebowPill, AxebowPlanSelectField, AxebowProgressBar, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowRefreshPeriodPanel, AxebowRegistrySelector, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourceLimitInput, AxebowResourceLimitsPanel, AxebowResourcesCounter, AxebowRoleCard, AxebowRoleContainerDropdown, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSearchBarFilters, AxebowSelectInput, AxebowSelectInputWithDivider, AxebowSelectorCard, AxebowSelectorSlider, AxebowServiceDetailHeader, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryFlavors, AxebowSummaryKeyValue, AxebowSummaryLimits, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowSwitchInput, AxebowTabSelector, AxebowTabsSubmenu, AxebowTagsInput, AxebowTenantCard, AxebowTenantResourceTable, AxebowTenantsTable, AxebowTextInput, AxebowTimeRangePanel, AxebowTooltip, AxebowUndeployCard, AxebowUnderlineTabSelector, AxebowUsageTooltip, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, TableChart, axebowTheme, buildAddButton, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon };
|
|
12856
13220
|
|
|
12857
13221
|
//# sourceMappingURL=index.js.map
|