@kumori/aurora-wui-components 0.0.253 → 0.0.255-dev4009.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/axebow-actions-footer/axebow-actions-footer.d.ts +0 -4
- package/dist/components/axebow-actions-footer/axebow-actions-footer.d.ts.map +1 -1
- package/dist/components/axebow-adjustment-resources-counter/axebow-adjustment-resources-counter.d.ts +13 -0
- package/dist/components/axebow-adjustment-resources-counter/axebow-adjustment-resources-counter.d.ts.map +1 -0
- package/dist/components/axebow-box-form/axebow-box-form.d.ts +22 -0
- package/dist/components/axebow-box-form/axebow-box-form.d.ts.map +1 -0
- package/dist/components/axebow-box-form/axebow-box-form.models.d.ts +12 -0
- package/dist/components/axebow-box-form/axebow-box-form.models.d.ts.map +1 -0
- package/dist/components/axebow-deploy-summary/axebow-deploy-summary.d.ts.map +1 -1
- 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 +36 -0
- package/dist/components/axebow-form-panel-field/axebow-form-panel-field.d.ts.map +1 -0
- package/dist/components/axebow-icon/axebow-icon.d.ts +2 -1
- package/dist/components/axebow-icon/axebow-icon.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-input-base.d.ts +17 -0
- package/dist/components/axebow-input/axebow-input-base.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-input.d.ts +0 -2
- package/dist/components/axebow-input/axebow-input.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-numeric-input.d.ts +10 -2
- package/dist/components/axebow-input/axebow-numeric-input.d.ts.map +1 -1
- package/dist/components/axebow-input/axebow-select-input.d.ts +7 -3
- package/dist/components/axebow-input/axebow-select-input.d.ts.map +1 -1
- package/dist/components/axebow-modals-confirmation/axebow-modals-confirmation.d.ts +90 -0
- package/dist/components/axebow-modals-confirmation/axebow-modals-confirmation.d.ts.map +1 -0
- package/dist/components/axebow-modals-confirmation/axebow-modals-confirmation.models.d.ts +14 -0
- package/dist/components/axebow-modals-confirmation/axebow-modals-confirmation.models.d.ts.map +1 -0
- package/dist/components/axebow-selector-slider/axebow-selector-slider.d.ts +27 -0
- package/dist/components/axebow-selector-slider/axebow-selector-slider.d.ts.map +1 -0
- package/dist/components/axebow-status/axebow-status.d.ts +11 -0
- package/dist/components/axebow-status/axebow-status.d.ts.map +1 -0
- package/dist/components/axebow-summary/axebow-summary-card.d.ts +0 -2
- package/dist/components/axebow-summary/axebow-summary-card.d.ts.map +1 -1
- package/dist/components/axebow-tab-selector/axebow-tab-selector.d.ts +6 -2
- package/dist/components/axebow-tab-selector/axebow-tab-selector.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-tooltip/axebow-tooltip.d.ts +14 -0
- package/dist/components/axebow-tooltip/axebow-tooltip.d.ts.map +1 -0
- package/dist/components/cards/parts/axebow-card-header.d.ts.map +1 -1
- package/dist/components/cards/parts/axebow-card-status.d.ts.map +1 -1
- package/dist/components/cards/parts/axebow-role-tooltip.d.ts.map +1 -1
- package/dist/index.d.ts +9 -7
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1449 -676
- package/dist/index.js.map +1 -1
- package/dist/playground/schemas/axebow-adjustment-resources-counter.schema.d.ts +6 -0
- package/dist/playground/schemas/axebow-adjustment-resources-counter.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-form-panel-field.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-form-panel-field.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-modals-confirmation.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-modals-confirmation.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-resource-box-form.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-resource-box-form.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-selector-slider.schema.d.ts +6 -0
- package/dist/playground/schemas/axebow-selector-slider.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-status.schema.d.ts +8 -0
- package/dist/playground/schemas/axebow-status.schema.d.ts.map +1 -0
- package/dist/playground/schemas/axebow-tooltip.schema.d.ts +6 -0
- package/dist/playground/schemas/axebow-tooltip.schema.d.ts.map +1 -0
- package/package.json +1 -1
- package/dist/components/axebow-carousel-selector-tenant/axebow-carousel-selector-tenant.d.ts +0 -28
- package/dist/components/axebow-carousel-selector-tenant/axebow-carousel-selector-tenant.d.ts.map +0 -1
- package/dist/components/axebow-carousel-selector-tenant/parts/axebow-carousel-selector-item.d.ts +0 -22
- package/dist/components/axebow-carousel-selector-tenant/parts/axebow-carousel-selector-item.d.ts.map +0 -1
- package/dist/components/axebow-resource-limits/axebow-resource-limits-panel.d.ts +0 -13
- package/dist/components/axebow-resource-limits/axebow-resource-limits-panel.d.ts.map +0 -1
- package/dist/components/axebow-resource-limits/axebow-resource-limits.models.d.ts +0 -12
- package/dist/components/axebow-resource-limits/axebow-resource-limits.models.d.ts.map +0 -1
- package/dist/components/axebow-resource-limits/parts/axebow-resource-limit-input.d.ts +0 -15
- package/dist/components/axebow-resource-limits/parts/axebow-resource-limit-input.d.ts.map +0 -1
- package/dist/components/axebow-summary/axebow-summary-flavors.d.ts +0 -30
- package/dist/components/axebow-summary/axebow-summary-flavors.d.ts.map +0 -1
- package/dist/components/axebow-summary/axebow-summary-limits.d.ts +0 -41
- package/dist/components/axebow-summary/axebow-summary-limits.d.ts.map +0 -1
package/dist/index.js
CHANGED
|
@@ -18,8 +18,8 @@ import "@shoelace-style/shoelace/dist/components/carousel/carousel.js";
|
|
|
18
18
|
import "@shoelace-style/shoelace/dist/components/carousel-item/carousel-item.js";
|
|
19
19
|
import "@shoelace-style/shoelace/dist/components/dialog/dialog.js";
|
|
20
20
|
import "@shoelace-style/shoelace/dist/components/menu-item/menu-item.js";
|
|
21
|
-
import "@shoelace-style/shoelace/dist/components/icon/icon.js";
|
|
22
21
|
import "@shoelace-style/shoelace/dist/components/tooltip/tooltip.js";
|
|
22
|
+
import "@shoelace-style/shoelace/dist/components/icon/icon.js";
|
|
23
23
|
import "@shoelace-style/shoelace/dist/components/badge/badge.js";
|
|
24
24
|
import "@shoelace-style/shoelace/dist/components/spinner/spinner.js";
|
|
25
25
|
import { unsafeHTML } from "lit/directives/unsafe-html.js";
|
|
@@ -124,7 +124,7 @@ var STATUS_COLORS = {
|
|
|
124
124
|
};
|
|
125
125
|
//#endregion
|
|
126
126
|
//#region src/styles/tailwind.css?inline
|
|
127
|
-
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 }\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-200: oklch(88.5% .062 18.334);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-500: oklch(63.7% .237 25.331);\n --color-red-600: oklch(57.7% .245 27.325);\n --color-yellow-50: oklch(98.7% .026 102.212);\n --color-yellow-200: oklch(94.5% .129 101.54);\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-gray-900: oklch(21% .034 264.665);\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-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 --tracking-widest: .1em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --radius-2xl: 1rem;\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-75: 18.75rem;\n --spacing-117: 29.25rem;\n --spacing-120: 30rem;\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n\n .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-0 {\n top: 0;\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-30 {\n top: var(--spacing-30);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-full {\n top: 100%;\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\\.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-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-100 {\n z-index: 100;\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 .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-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-4 {\n margin-top: calc(var(--spacing) * 4);\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-8 {\n margin-top: calc(var(--spacing) * 8);\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 .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-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-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 .\\!hidden {\n display: none !important;\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-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-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-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-21\\.25 {\n height: calc(var(--spacing) * 21.25);\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-\\[0\\.0625rem\\] {\n height: .0625rem;\n }\n\n .h-\\[8\\.26375rem\\] {\n height: 8.26375rem;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-px {\n height: 1px;\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-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-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-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-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-15\\.25 {\n width: calc(var(--spacing) * 15.25);\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\\.75 {\n width: calc(var(--spacing) * 24.75);\n }\n\n .w-25 {\n width: calc(var(--spacing) * 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-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-40\\.25 {\n width: calc(var(--spacing) * 40.25);\n }\n\n .w-41 {\n width: calc(var(--spacing) * 41);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\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-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\n }\n\n .w-83\\.5 {\n width: calc(var(--spacing) * 83.5);\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-100\\.5 {\n width: calc(var(--spacing) * 100.5);\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-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-194\\.25 {\n width: calc(var(--spacing) * 194.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-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-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-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\n }\n\n .max-w-\\[23\\.75rem\\] {\n max-width: 23.75rem;\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-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-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-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-\\[8\\.2rem\\] {\n min-width: 8.2rem;\n }\n\n .min-w-fit {\n min-width: fit-content;\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 .-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 .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-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-\\[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-1 {\n row-gap: var(--spacing);\n }\n\n .gap-y-\\[0\\.1875rem\\] {\n row-gap: .1875rem;\n }\n\n .self-end {\n align-self: flex-end;\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-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-2xl {\n border-radius: var(--radius-2xl);\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-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-xl {\n border-radius: var(--radius-xl);\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-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-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-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-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-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-\\[\\#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-blue-200 {\n border-color: var(--color-blue-200);\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-red-200 {\n border-color: var(--color-red-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-yellow-200 {\n border-color: var(--color-yellow-200);\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-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-white\\) {\n background-color: var(--axebow-white);\n }\n\n .bg-\\[var\\(--axebow-gray\\)\\] {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\[var\\(--axebow-tertiary\\)\\] {\n background-color: var(--axebow-tertiary);\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-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-400 {\n background-color: var(--color-gray-400);\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-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 .bg-yellow-50 {\n background-color: var(--color-yellow-50);\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-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-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 .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-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-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-2 {\n padding-bottom: calc(var(--spacing) * 2);\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-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-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-\\[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\\.25 {\n --tw-leading: calc(var(--spacing) * 4.25);\n line-height: calc(var(--spacing) * 4.25);\n }\n\n .leading-\\[1\\.125rem\\] {\n --tw-leading: 1.125rem;\n line-height: 1.125rem;\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-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-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 .tracking-widest {\n --tw-tracking: var(--tracking-widest);\n letter-spacing: var(--tracking-widest);\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .text-ellipsis {\n text-overflow: ellipsis;\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-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\[var\\(--axebow-error\\)\\] {\n color: var(--axebow-error);\n }\n\n .text-\\[var\\(--axebow-gray\\)\\] {\n color: var(--axebow-gray);\n }\n\n .text-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-gray-900 {\n color: var(--color-gray-900);\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-500 {\n color: var(--color-red-500);\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 .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 {\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 .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_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 .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 .outline-none {\n --tw-outline-style: none;\n outline-style: 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 .\\[writing-mode\\:vertical-lr\\] {\n writing-mode: vertical-lr;\n }\n\n @media (hover: hover) {\n .group-hover\\:-translate-x-1:is(:where(.group):hover *) {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\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\\:text-red-500:is(:where(.group):hover *) {\n color: var(--color-red-500);\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 .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\\:rounded-md:hover {\n border-radius: var(--radius-md);\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-\\[1\\.375rem\\]:hover {\n padding-inline: 1.375rem;\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-\\[var\\(--axebow-gray\\)\\]:hover {\n color: var(--axebow-gray);\n }\n\n .hover\\:text-gray-700:hover {\n color: var(--color-gray-700);\n }\n\n .hover\\:text-red-600:hover {\n color: var(--color-red-600);\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-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 .disabled\\:pointer-events-none:disabled {\n pointer-events: none;\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n\n @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\\:inline-flex {\n display: inline-flex;\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\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:rounded-xl {\n border-radius: var(--radius-xl);\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.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";
|
|
127
|
+
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-200: oklch(88.5% .062 18.334);\n --color-red-300: oklch(80.8% .114 19.571);\n --color-red-500: oklch(63.7% .237 25.331);\n --color-red-600: oklch(57.7% .245 27.325);\n --color-yellow-50: oklch(98.7% .026 102.212);\n --color-yellow-200: oklch(94.5% .129 101.54);\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-gray-900: oklch(21% .034 264.665);\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-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 --tracking-widest: .1em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-relaxed: 1.625;\n --radius-sm: .25rem;\n --radius-md: .375rem;\n --radius-lg: .5rem;\n --radius-xl: .75rem;\n --radius-2xl: 1rem;\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-75: 18.75rem;\n --spacing-117: 29.25rem;\n --spacing-120: 30rem;\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .pointer-events-none {\n pointer-events: none;\n }\n\n .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-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-25 {\n top: calc(var(--spacing) * 25);\n }\n\n .top-30 {\n top: var(--spacing-30);\n }\n\n .top-\\[-7px\\] {\n top: -7px;\n }\n\n .top-full {\n top: 100%;\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-\\[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-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-100 {\n z-index: 100;\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 .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-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-4 {\n margin-top: calc(var(--spacing) * 4);\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-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-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n\n .mr-4 {\n margin-right: calc(var(--spacing) * 4);\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-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 .\\!hidden {\n display: none !important;\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-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-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\\.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-20 {\n height: calc(var(--spacing) * 20);\n }\n\n .h-21\\.25 {\n height: calc(var(--spacing) * 21.25);\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-\\[0\\.0625rem\\] {\n height: .0625rem;\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 .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-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\\/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-15\\.25 {\n width: calc(var(--spacing) * 15.25);\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-25 {\n width: calc(var(--spacing) * 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-35 {\n width: calc(var(--spacing) * 35);\n }\n\n .w-37 {\n width: calc(var(--spacing) * 37);\n }\n\n .w-40\\.25 {\n width: calc(var(--spacing) * 40.25);\n }\n\n .w-47\\.75 {\n width: calc(var(--spacing) * 47.75);\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-70\\.5 {\n width: calc(var(--spacing) * 70.5);\n }\n\n .w-71 {\n width: calc(var(--spacing) * 71);\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-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-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-194\\.25 {\n width: calc(var(--spacing) * 194.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-294 {\n width: calc(var(--spacing) * 294);\n }\n\n .w-\\[10\\.5rem\\] {\n width: 10.5rem;\n }\n\n .w-\\[270px\\] {\n width: 270px;\n }\n\n .w-\\[calc\\(100\\%-10px\\)\\] {\n width: calc(100% - 10px);\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-194\\.25 {\n max-width: calc(var(--spacing) * 194.25);\n }\n\n .max-w-\\[23\\.75rem\\] {\n max-width: 23.75rem;\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-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-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-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-\\[8\\.2rem\\] {\n min-width: 8.2rem;\n }\n\n .min-w-fit {\n min-width: fit-content;\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 .-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-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 :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-1 {\n row-gap: var(--spacing);\n }\n\n .gap-y-\\[0\\.1875rem\\] {\n row-gap: .1875rem;\n }\n\n .self-end {\n align-self: flex-end;\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-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-2xl {\n border-radius: var(--radius-2xl);\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-sm {\n border-radius: var(--radius-sm);\n }\n\n .rounded-xl {\n border-radius: var(--radius-xl);\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-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-4 {\n border-top-style: var(--tw-border-style);\n border-top-width: 4px;\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-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-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-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-\\[\\#CBD5E1\\] {\n border-color: #cbd5e1;\n }\n\n .border-\\[\\#DBDDE4\\] {\n border-color: #dbdde4;\n }\n\n .border-\\[\\#E2E8F0\\] {\n border-color: #e2e8f0;\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-blue-200 {\n border-color: var(--color-blue-200);\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-red-200 {\n border-color: var(--color-red-200);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-white {\n border-color: var(--color-white);\n }\n\n .border-yellow-200 {\n border-color: var(--color-yellow-200);\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-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-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-\\[var\\(--axebow-gray\\)\\] {\n background-color: var(--axebow-gray);\n }\n\n .bg-\\[var\\(--axebow-tertiary\\)\\] {\n background-color: var(--axebow-tertiary);\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-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-400 {\n background-color: var(--color-gray-400);\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-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 .bg-yellow-50 {\n background-color: var(--color-yellow-50);\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-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-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 .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-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-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-2 {\n padding-bottom: calc(var(--spacing) * 2);\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-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-\\[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\\.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-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 .tracking-widest {\n --tw-tracking: var(--tracking-widest);\n letter-spacing: var(--tracking-widest);\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-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-tertiary\\) {\n color: var(--axebow-tertiary);\n }\n\n .text-\\[\\#000000\\] {\n color: #000;\n }\n\n .text-\\[\\#1E293B\\] {\n color: #1e293b;\n }\n\n .text-\\[\\#006BFF\\] {\n color: #006bff;\n }\n\n .text-\\[\\#94A3B8\\] {\n color: #94a3b8;\n }\n\n .text-\\[\\#64748B\\] {\n color: #64748b;\n }\n\n .text-\\[\\#78787A\\] {\n color: #78787a;\n }\n\n .text-\\[\\#344966\\] {\n color: #344966;\n }\n\n .text-\\[\\#475569\\] {\n color: #475569;\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-gray\\)\\] {\n color: var(--axebow-gray);\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-gray-900 {\n color: var(--color-gray-900);\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-500 {\n color: var(--color-red-500);\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 .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-70 {\n opacity: .7;\n }\n\n .opacity-100 {\n opacity: 1;\n }\n\n .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 .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_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 .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 .\\[writing-mode\\:vertical-lr\\] {\n writing-mode: vertical-lr;\n }\n\n @media (hover: hover) {\n .group-hover\\:-translate-x-1:is(:where(.group):hover *) {\n --tw-translate-x: calc(var(--spacing) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\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\\:text-red-500:is(:where(.group):hover *) {\n color: var(--color-red-500);\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 .focus-within\\:border-\\[\\#006BFF\\]:focus-within {\n border-color: #006bff;\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\\:rounded-md:hover {\n border-radius: var(--radius-md);\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-\\[\\#F0F1F5\\]:hover {\n background-color: #f0f1f5;\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-\\[1\\.375rem\\]:hover {\n padding-inline: 1.375rem;\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-\\[var\\(--axebow-gray\\)\\]:hover {\n color: var(--axebow-gray);\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\\:text-red-600:hover {\n color: var(--color-red-600);\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\\:pointer-events-none:disabled {\n pointer-events: none;\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n\n @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\\:inline-flex {\n display: inline-flex;\n }\n\n .lg\\:h-full {\n height: 100%;\n }\n\n .lg\\:min-h-\\[calc\\(100vh-6\\.25rem\\)\\] {\n min-height: calc(100vh - 6.25rem);\n }\n\n .lg\\:w-96\\.5 {\n width: calc(var(--spacing) * 96.5);\n }\n\n .lg\\:cursor-default {\n cursor: default;\n }\n\n .lg\\:rounded-xl {\n border-radius: var(--radius-xl);\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.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";
|
|
128
128
|
//#endregion
|
|
129
129
|
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/decorate.js
|
|
130
130
|
function __decorate(decorators, target, key, desc) {
|
|
@@ -148,12 +148,35 @@ var AxebowIcon = class AxebowIcon extends LitElement {
|
|
|
148
148
|
static {
|
|
149
149
|
this.styles = unsafeCSS(tailwind_default);
|
|
150
150
|
}
|
|
151
|
+
_getFontSize() {
|
|
152
|
+
switch (this.size.replace(/^text-/, "")) {
|
|
153
|
+
case "xs": return "var(--text-xs, 0.75rem)";
|
|
154
|
+
case "sm":
|
|
155
|
+
case "xx-small": return "var(--text-sm, 0.875rem)";
|
|
156
|
+
case "base":
|
|
157
|
+
case "x-small": return "var(--text-base, 1rem)";
|
|
158
|
+
case "md":
|
|
159
|
+
case "small": return "var(--text-md, 0.875rem)";
|
|
160
|
+
case "lg": return "var(--text-lg, 1.125rem)";
|
|
161
|
+
case "xl":
|
|
162
|
+
case "medium": return "18px";
|
|
163
|
+
case "2xl": return "1.5rem";
|
|
164
|
+
case "3xl":
|
|
165
|
+
case "large": return "var(--text-3xl, 1.875rem)";
|
|
166
|
+
case "4xl": return "2.25rem";
|
|
167
|
+
case "5xl":
|
|
168
|
+
case "x-large": return "var(--text-5xl, 3rem)";
|
|
169
|
+
default: return this.size;
|
|
170
|
+
}
|
|
171
|
+
}
|
|
151
172
|
render() {
|
|
173
|
+
const filled = "[font-variation-settings:'FILL'_1,'wght'_400,'GRAD'_0,'opsz'_24]";
|
|
174
|
+
const outlined = "[font-variation-settings:'FILL'_0,'wght'_400,'GRAD'_0,'opsz'_24]";
|
|
175
|
+
const fontSize = this._getFontSize();
|
|
152
176
|
return html`
|
|
153
177
|
<span
|
|
154
|
-
class="font-[Material_Symbols_Outlined] inline-block align-middle whitespace-nowrap ${this.filled ?
|
|
155
|
-
style="color: ${this.iconColor}; transform: rotate(${this.rotate}deg); font-size: ${
|
|
156
|
-
margin-bottom: ${this.size === "xx-small" ? "0" : this.size === "x-small" ? "0" : this.size === "small" ? "0" : this.size === "medium" ? "0" : this.size === "large" ? "0.375rem" : this.size === "x-large" ? "0.5rem" : `${this.marginBottom}px`};"
|
|
178
|
+
class="font-[Material_Symbols_Outlined] cursor-default inline-block align-middle whitespace-nowrap ${this.filled ? filled : outlined}"
|
|
179
|
+
style="color: ${this.iconColor}; transform: rotate(${this.rotate}deg); font-size: ${fontSize}; margin-bottom: ${this.size === "large" || this.size === "3xl" ? "0.375rem" : this.size === "x-large" || this.size === "5xl" ? "0.5rem" : `${this.marginBottom}px`};"
|
|
157
180
|
>
|
|
158
181
|
${this.iconName}
|
|
159
182
|
</span>
|
|
@@ -277,7 +300,7 @@ var AxebowFilterBar = class AxebowFilterBar extends LitElement {
|
|
|
277
300
|
slot="expand-icon"
|
|
278
301
|
iconName="chevron_right"
|
|
279
302
|
rotate="90"
|
|
280
|
-
size="
|
|
303
|
+
size="md"
|
|
281
304
|
iconColor="var(--axebow-secondary)"
|
|
282
305
|
></axebow-icon>
|
|
283
306
|
${item.options.map((option) => html`<sl-option value=${option.value}>${option.label}</sl-option>`)}
|
|
@@ -312,7 +335,7 @@ var AxebowQuickActionCard = class AxebowQuickActionCard extends LitElement {
|
|
|
312
335
|
class="flex flex-col items-center justify-center gap-1 w-[10.5rem] px-4 py-3 rounded bg-white hover:bg-(--axebow-base) cursor-pointer transition-colors duration-150"
|
|
313
336
|
@click=${this._onClick}
|
|
314
337
|
>
|
|
315
|
-
<axebow-icon iconName=${this.icon} iconColor="var(--axebow-primary)" size="
|
|
338
|
+
<axebow-icon iconName=${this.icon} iconColor="var(--axebow-primary)" size="xl"></axebow-icon>
|
|
316
339
|
<span class="text-base font-semibold text-(--axebow-primary) text-center whitespace-nowrap">${this.label}</span>
|
|
317
340
|
</div>
|
|
318
341
|
`;
|
|
@@ -371,7 +394,7 @@ var AxebowQuickActions = class AxebowQuickActions extends LitElement {
|
|
|
371
394
|
<span
|
|
372
395
|
class="flex flex-col items-center justify-center gap-1 ${this.open ? "text-(--axebow-primary)" : "text-white group-hover:text-(--axebow-primary)"}"
|
|
373
396
|
>
|
|
374
|
-
<axebow-icon iconName=${this.open ? "close" : "apps"} iconColor="currentColor" size="
|
|
397
|
+
<axebow-icon iconName=${this.open ? "close" : "apps"} iconColor="currentColor" size="xl"></axebow-icon>
|
|
375
398
|
<span
|
|
376
399
|
class="text-xs whitespace-nowrap ${this.open ? "font-semibold" : "font-normal group-hover:font-semibold"}"
|
|
377
400
|
>${this.label}</span
|
|
@@ -530,7 +553,7 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
|
|
|
530
553
|
class="group flex items-center gap-2 h-9 px-3 rounded-lg text-white font-semibold cursor-pointer whitespace-nowrap transition-all duration-150 hover:bg-white hover:text-(--axebow-primary) hover:shadow-[0_2px_6px_rgba(13,24,33,0.14)] text-base"
|
|
531
554
|
>
|
|
532
555
|
<span class="text-white group-hover:text-(--axebow-primary) transition-colors duration-150">
|
|
533
|
-
<axebow-icon iconName="account_circle" iconColor="currentColor" size="
|
|
556
|
+
<axebow-icon iconName="account_circle" iconColor="currentColor" size="xl"></axebow-icon>
|
|
534
557
|
</span>
|
|
535
558
|
${this.userName}
|
|
536
559
|
</div>
|
|
@@ -541,7 +564,7 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
|
|
|
541
564
|
@click=${() => item.onClick()}
|
|
542
565
|
>
|
|
543
566
|
<span class="text-(--axebow-primary)">${item.name}</span>
|
|
544
|
-
<axebow-icon iconName="arrow_right_alt" size="
|
|
567
|
+
<axebow-icon iconName="arrow_right_alt" size="xl"></axebow-icon>
|
|
545
568
|
</button>
|
|
546
569
|
`)}
|
|
547
570
|
<button
|
|
@@ -549,7 +572,7 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
|
|
|
549
572
|
@click=${() => this.onLogout()}
|
|
550
573
|
>
|
|
551
574
|
<span class="text-(--axebow-error) mt-1">${this.logoutLabel}</span>
|
|
552
|
-
<axebow-icon iconName="mode_off_on" iconColor="var(--axebow-error)" size="
|
|
575
|
+
<axebow-icon iconName="mode_off_on" iconColor="var(--axebow-error)" size="md"></axebow-icon>
|
|
553
576
|
</button>
|
|
554
577
|
</sl-menu>
|
|
555
578
|
</sl-dropdown>
|
|
@@ -565,7 +588,7 @@ var AxebowHeaderActions = class AxebowHeaderActions extends LitElement {
|
|
|
565
588
|
${item.status === "unread" ? html` <div class="absolute top-[-7px] left-[-7px] h-3.5 w-3.5 rounded-full bg-(--axebow-success)"></div>` : ""}
|
|
566
589
|
<axebow-icon
|
|
567
590
|
iconName=${item.icon}
|
|
568
|
-
size="
|
|
591
|
+
size="xl"
|
|
569
592
|
iconColor=${item.status === "unread" ? item.color : "gray"}
|
|
570
593
|
></axebow-icon>
|
|
571
594
|
<div class="flex flex-1 flex-col gap-1 py-1.25 min-w-0 overflow-hidden">
|
|
@@ -771,7 +794,7 @@ var AxebowSidebar = class AxebowSidebar extends LitElement {
|
|
|
771
794
|
>
|
|
772
795
|
<span
|
|
773
796
|
class="flex items-center gap-1 px-2 py-1 bg-white rounded-lg text-base border border-solid border-(--axebow-gray) shadow-lg"
|
|
774
|
-
>${this.hoveredItem.label}${this.hoveredItem.openInNewTab ? html`<axebow-icon iconName="open_in_new" size="
|
|
797
|
+
>${this.hoveredItem.label}${this.hoveredItem.openInNewTab ? html`<axebow-icon iconName="open_in_new" size="sm"></axebow-icon>` : ""}</span
|
|
775
798
|
>
|
|
776
799
|
</div>
|
|
777
800
|
` : ""}
|
|
@@ -787,7 +810,7 @@ var AxebowSidebar = class AxebowSidebar extends LitElement {
|
|
|
787
810
|
title="${item.label}"
|
|
788
811
|
>
|
|
789
812
|
<div class="flex flex-col items-center justify-center">
|
|
790
|
-
<axebow-icon iconName="${item.icon}" size="
|
|
813
|
+
<axebow-icon iconName="${item.icon}" size="xl"></axebow-icon>
|
|
791
814
|
<span class="text-xs overflow-hidden whitespace-nowrap opacity-100 max-w-full">${item.label}</span>
|
|
792
815
|
</div>
|
|
793
816
|
|
|
@@ -809,9 +832,9 @@ var AxebowSidebar = class AxebowSidebar extends LitElement {
|
|
|
809
832
|
title="${item.label}"
|
|
810
833
|
>
|
|
811
834
|
<div class="flex flex-col items-center justify-center py-3">
|
|
812
|
-
<axebow-icon iconName="${item.icon}" size="
|
|
835
|
+
<axebow-icon iconName="${item.icon}" size="xl"></axebow-icon>
|
|
813
836
|
<span class="text-sm overflow-hidden whitespace-nowrap opacity-100 max-w-full"
|
|
814
|
-
>${item.label}${item.openInNewTab ? html`<axebow-icon iconName="open_in_new" size="
|
|
837
|
+
>${item.label}${item.openInNewTab ? html`<axebow-icon iconName="open_in_new" size="sm"></axebow-icon>` : ""}</span
|
|
815
838
|
>
|
|
816
839
|
</div>
|
|
817
840
|
|
|
@@ -887,7 +910,7 @@ var AxebowFooter = class AxebowFooter extends LitElement {
|
|
|
887
910
|
@click=${link.onClick}
|
|
888
911
|
>
|
|
889
912
|
${link.label}
|
|
890
|
-
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-anti-flash-white)" size="
|
|
913
|
+
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-anti-flash-white)" size="md"></axebow-icon>
|
|
891
914
|
</button>
|
|
892
915
|
`)}
|
|
893
916
|
</footer>
|
|
@@ -931,7 +954,7 @@ var AxebowBreadcrumbHeader = class AxebowBreadcrumbHeader extends LitElement {
|
|
|
931
954
|
<axebow-icon
|
|
932
955
|
iconName="home"
|
|
933
956
|
iconColor="var(--axebow-primary)"
|
|
934
|
-
size="
|
|
957
|
+
size="xl"
|
|
935
958
|
style="display: inline-flex; align-items: center; justify-content: center; transform: scale(0.6665, 0.75);"
|
|
936
959
|
></axebow-icon>
|
|
937
960
|
<span class="font-normal">/</span>
|
|
@@ -1321,7 +1344,7 @@ var AxebowSearch = class AxebowSearch extends LitElement {
|
|
|
1321
1344
|
render() {
|
|
1322
1345
|
return html`
|
|
1323
1346
|
<sl-input placeholder=${this.placeholder} .value=${this.value} clearable @sl-input=${this._onInput} @sl-clear=${this._onClear}>
|
|
1324
|
-
<axebow-icon slot="prefix" iconName="search" iconColor="var(--axebow-gray)" size="
|
|
1347
|
+
<axebow-icon slot="prefix" iconName="search" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
|
|
1325
1348
|
</sl-input>
|
|
1326
1349
|
`;
|
|
1327
1350
|
}
|
|
@@ -1332,6 +1355,12 @@ __decorate([property({ type: String })], AxebowSearch.prototype, "width", void 0
|
|
|
1332
1355
|
AxebowSearch = __decorate([customElement("axebow-search")], AxebowSearch);
|
|
1333
1356
|
//#endregion
|
|
1334
1357
|
//#region src/components/axebow-input/axebow-input-base.ts
|
|
1358
|
+
/**
|
|
1359
|
+
* Template-method base for every axebow-*-input control: owns the shared
|
|
1360
|
+
* label/description/error wrapper markup and the disabled-aware value
|
|
1361
|
+
* change plumbing. Concrete inputs only implement their own field markup
|
|
1362
|
+
* via render().
|
|
1363
|
+
*/
|
|
1335
1364
|
var AxebowInputBase = class extends LitElement {
|
|
1336
1365
|
constructor(..._args) {
|
|
1337
1366
|
super(..._args);
|
|
@@ -1411,6 +1440,17 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1411
1440
|
this.value = target.value;
|
|
1412
1441
|
this.callback?.(e);
|
|
1413
1442
|
}
|
|
1443
|
+
/**
|
|
1444
|
+
* Every inter-element gap here is a single explicit margin (no
|
|
1445
|
+
* contributing flex `gap` on the container) so each one is an
|
|
1446
|
+
* independently overridable CSS custom property. Defaults reproduce
|
|
1447
|
+
* the historical spacing (16px label->description, 12px
|
|
1448
|
+
* description->content/content->error, 8px label->content when there's
|
|
1449
|
+
* no description) - concrete inputs that need different spacing (e.g.
|
|
1450
|
+
* the carousel's tighter label/description rhythm) just set
|
|
1451
|
+
* `--axebow-input-label-gap` / `--axebow-input-description-gap` on
|
|
1452
|
+
* their own :host.
|
|
1453
|
+
*/
|
|
1414
1454
|
renderWrapper(content) {
|
|
1415
1455
|
return html`
|
|
1416
1456
|
<div class="flex flex-col justify-end w-full relative">
|
|
@@ -1449,12 +1489,12 @@ var AxebowInputBase = class extends LitElement {
|
|
|
1449
1489
|
return html`
|
|
1450
1490
|
<div class="fixed-field">
|
|
1451
1491
|
${this.label ? html`<div class="flex items-baseline gap-2 field-label">
|
|
1452
|
-
${this.required ? html`<p class="text-(--axebow-error) text-base leading-
|
|
1453
|
-
<h4 class="font-semibold text-base leading-
|
|
1492
|
+
${this.required ? html`<p class="text-(--axebow-error) text-base leading-[1.0625rem] m-0">*</p>` : ""}
|
|
1493
|
+
<h4 class="font-semibold text-base leading-[1.0625rem] m-0 overflow-hidden text-ellipsis">
|
|
1454
1494
|
${this.label}
|
|
1455
1495
|
</h4>
|
|
1456
1496
|
</div>` : ""}
|
|
1457
|
-
${this.description ? html`<p class="field-description text-base leading-
|
|
1497
|
+
${this.description ? html`<p class="field-description text-base leading-[1.0625rem] m-0" title="${this.description}">
|
|
1458
1498
|
${this.description}
|
|
1459
1499
|
</p>` : ""}
|
|
1460
1500
|
${content}
|
|
@@ -1521,7 +1561,6 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1521
1561
|
this.integerOnly = false;
|
|
1522
1562
|
this.showStepper = true;
|
|
1523
1563
|
this.stepAmount = 1;
|
|
1524
|
-
this.fixedField = false;
|
|
1525
1564
|
}
|
|
1526
1565
|
static {
|
|
1527
1566
|
this.styles = [...AxebowInputBase.baseStyles, css`
|
|
@@ -1529,6 +1568,10 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1529
1568
|
display: block;
|
|
1530
1569
|
width: 100%;
|
|
1531
1570
|
}
|
|
1571
|
+
/* Always off, unconditionally - the +/- stepper is the app-wide
|
|
1572
|
+
replacement for the browser's native number spinner, so the native
|
|
1573
|
+
one should never show regardless of whether the stepper itself is
|
|
1574
|
+
opted out for a given instance. */
|
|
1532
1575
|
sl-input::part(input)::-webkit-outer-spin-button,
|
|
1533
1576
|
sl-input::part(input)::-webkit-inner-spin-button {
|
|
1534
1577
|
-webkit-appearance: none;
|
|
@@ -1537,6 +1580,15 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1537
1580
|
sl-input::part(input) {
|
|
1538
1581
|
-moz-appearance: textfield;
|
|
1539
1582
|
}
|
|
1583
|
+
/* All three guarded by their own host class - absent unless the
|
|
1584
|
+
matching property is set - so none ever touch sl-input's own
|
|
1585
|
+
default sizing/padding for every existing caller that doesn't opt
|
|
1586
|
+
in. fixedWidth only constrains the field itself (not the host, so
|
|
1587
|
+
the label above keeps its full width and doesn't wrap).
|
|
1588
|
+
!important is needed on the sizing declarations - Shoelace sets its
|
|
1589
|
+
own height internally off --sl-input-height-medium (not just the
|
|
1590
|
+
exposed 'base' part), so both are overridden together to reliably
|
|
1591
|
+
win regardless of which one actually drives the rendered size. */
|
|
1540
1592
|
:host(.axebow-fixed-width) sl-input {
|
|
1541
1593
|
width: var(--axebow-input-width) !important;
|
|
1542
1594
|
}
|
|
@@ -1555,12 +1607,11 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1555
1607
|
margin: 0;
|
|
1556
1608
|
padding: 0;
|
|
1557
1609
|
}
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
}
|
|
1610
|
+
|
|
1611
|
+
/* Only a left border (separating the stepper from the typed number)
|
|
1612
|
+
and a divider between the two buttons - the top/right/bottom edges
|
|
1613
|
+
coincide with sl-input's own border, so drawing our own there
|
|
1614
|
+
would just double it up. */
|
|
1564
1615
|
.axebow-numeric-stepper {
|
|
1565
1616
|
display: flex;
|
|
1566
1617
|
flex-direction: column;
|
|
@@ -1609,13 +1660,6 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1609
1660
|
this.classList.remove("axebow-fixed-height");
|
|
1610
1661
|
}
|
|
1611
1662
|
if (changed.has("showStepper")) this.classList.toggle("axebow-has-stepper", this.showStepper);
|
|
1612
|
-
if (changed.has("minWidth")) if (this.minWidth) {
|
|
1613
|
-
this.style.setProperty("--axebow-input-min-width", this.minWidth);
|
|
1614
|
-
this.classList.add("axebow-fixed-min-width");
|
|
1615
|
-
} else {
|
|
1616
|
-
this.style.removeProperty("--axebow-input-min-width");
|
|
1617
|
-
this.classList.remove("axebow-fixed-min-width");
|
|
1618
|
-
}
|
|
1619
1663
|
}
|
|
1620
1664
|
handleChange(e) {
|
|
1621
1665
|
if (this.disabled) return;
|
|
@@ -1658,7 +1702,7 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1658
1702
|
aria-label="increment"
|
|
1659
1703
|
@click=${() => this._bumpValue(1)}
|
|
1660
1704
|
>
|
|
1661
|
-
<axebow-icon iconName="add" iconColor="var(--axebow-tertiary)" size="
|
|
1705
|
+
<axebow-icon iconName="add" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
1662
1706
|
</button>
|
|
1663
1707
|
<button
|
|
1664
1708
|
type="button"
|
|
@@ -1667,14 +1711,15 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1667
1711
|
aria-label="decrement"
|
|
1668
1712
|
@click=${() => this._bumpValue(-1)}
|
|
1669
1713
|
>
|
|
1670
|
-
<axebow-icon iconName="remove" iconColor="var(--axebow-tertiary)" size="
|
|
1714
|
+
<axebow-icon iconName="remove" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
1671
1715
|
</button>
|
|
1672
1716
|
</div>
|
|
1673
1717
|
`;
|
|
1674
1718
|
}
|
|
1675
1719
|
render() {
|
|
1676
|
-
const
|
|
1677
|
-
|
|
1720
|
+
const containerClass = this.hasError ? "input-error" : "";
|
|
1721
|
+
return this.renderWrapper(html`
|
|
1722
|
+
<div class="${containerClass}">
|
|
1678
1723
|
<sl-input
|
|
1679
1724
|
type="number"
|
|
1680
1725
|
placeholder="${this.placeholder}"
|
|
@@ -1689,8 +1734,7 @@ var AxebowNumericInput = class AxebowNumericInput extends AxebowInputBase {
|
|
|
1689
1734
|
${this._renderStepper()}
|
|
1690
1735
|
</sl-input>
|
|
1691
1736
|
</div>
|
|
1692
|
-
|
|
1693
|
-
return this.fixedField ? this.renderFixedField(content) : this.renderWrapper(content);
|
|
1737
|
+
`);
|
|
1694
1738
|
}
|
|
1695
1739
|
};
|
|
1696
1740
|
__decorate([property({ type: Number })], AxebowNumericInput.prototype, "max", void 0);
|
|
@@ -1700,8 +1744,6 @@ __decorate([property({ type: String })], AxebowNumericInput.prototype, "fixedWid
|
|
|
1700
1744
|
__decorate([property({ type: String })], AxebowNumericInput.prototype, "fixedHeight", void 0);
|
|
1701
1745
|
__decorate([property({ type: Boolean })], AxebowNumericInput.prototype, "showStepper", void 0);
|
|
1702
1746
|
__decorate([property({ type: Number })], AxebowNumericInput.prototype, "stepAmount", void 0);
|
|
1703
|
-
__decorate([property({ type: Boolean })], AxebowNumericInput.prototype, "fixedField", void 0);
|
|
1704
|
-
__decorate([property({ type: String })], AxebowNumericInput.prototype, "minWidth", void 0);
|
|
1705
1747
|
AxebowNumericInput = __decorate([customElement("axebow-numeric-input")], AxebowNumericInput);
|
|
1706
1748
|
//#endregion
|
|
1707
1749
|
//#region src/components/axebow-input/axebow-checkbox-input.ts
|
|
@@ -1757,14 +1799,14 @@ AxebowCheckboxInput = __decorate([customElement("axebow-checkbox-input")], Axebo
|
|
|
1757
1799
|
var SELECTOR_MAX_WIDTH_PX = 720;
|
|
1758
1800
|
var CARD_HEIGHT_PX = 54;
|
|
1759
1801
|
var CARD_GAP_PX = 12;
|
|
1760
|
-
function slidesPerPageFor
|
|
1802
|
+
function slidesPerPageFor(containerWidthPx) {
|
|
1761
1803
|
return (containerWidthPx + CARD_GAP_PX) / 132;
|
|
1762
1804
|
}
|
|
1763
1805
|
var AxebowCarouselInput = class AxebowCarouselInput extends AxebowInputBase {
|
|
1764
1806
|
constructor(..._args) {
|
|
1765
1807
|
super(..._args);
|
|
1766
1808
|
this.carouselItems = [];
|
|
1767
|
-
this._slidesPerPage = slidesPerPageFor
|
|
1809
|
+
this._slidesPerPage = slidesPerPageFor(SELECTOR_MAX_WIDTH_PX);
|
|
1768
1810
|
}
|
|
1769
1811
|
static {
|
|
1770
1812
|
this.styles = [...AxebowInputBase.baseStyles, css`
|
|
@@ -1797,7 +1839,7 @@ var AxebowCarouselInput = class AxebowCarouselInput extends AxebowInputBase {
|
|
|
1797
1839
|
super.connectedCallback();
|
|
1798
1840
|
this._resizeObserver = new ResizeObserver((entries) => {
|
|
1799
1841
|
const width = entries[0]?.contentRect.width;
|
|
1800
|
-
if (width) this._slidesPerPage = slidesPerPageFor
|
|
1842
|
+
if (width) this._slidesPerPage = slidesPerPageFor(width);
|
|
1801
1843
|
});
|
|
1802
1844
|
}
|
|
1803
1845
|
disconnectedCallback() {
|
|
@@ -1903,21 +1945,8 @@ var AxebowSelectInput = class AxebowSelectInput extends AxebowInputBase {
|
|
|
1903
1945
|
.fixed-field sl-select::part(display-input) {
|
|
1904
1946
|
font-size: 0.875rem;
|
|
1905
1947
|
}
|
|
1906
|
-
:host(.axebow-fixed-min-width) .fixed-field {
|
|
1907
|
-
min-width: var(--axebow-input-min-width) !important;
|
|
1908
|
-
}
|
|
1909
1948
|
`];
|
|
1910
1949
|
}
|
|
1911
|
-
updated(changed) {
|
|
1912
|
-
super.updated(changed);
|
|
1913
|
-
if (changed.has("minWidth")) if (this.minWidth) {
|
|
1914
|
-
this.style.setProperty("--axebow-input-min-width", this.minWidth);
|
|
1915
|
-
this.classList.add("axebow-fixed-min-width");
|
|
1916
|
-
} else {
|
|
1917
|
-
this.style.removeProperty("--axebow-input-min-width");
|
|
1918
|
-
this.classList.remove("axebow-fixed-min-width");
|
|
1919
|
-
}
|
|
1920
|
-
}
|
|
1921
1950
|
handleSelectChange(e) {
|
|
1922
1951
|
if (this.disabled) return;
|
|
1923
1952
|
const target = e.target;
|
|
@@ -2033,7 +2062,6 @@ var AxebowSelectInput = class AxebowSelectInput extends AxebowInputBase {
|
|
|
2033
2062
|
return this.compact ? this.renderWrapper(content) : this.renderFixedField(content);
|
|
2034
2063
|
}
|
|
2035
2064
|
};
|
|
2036
|
-
__decorate([property({ type: String })], AxebowSelectInput.prototype, "minWidth", void 0);
|
|
2037
2065
|
__decorate([property({ type: Array })], AxebowSelectInput.prototype, "options", void 0);
|
|
2038
2066
|
__decorate([property({ type: Boolean })], AxebowSelectInput.prototype, "allowAddNew", void 0);
|
|
2039
2067
|
__decorate([property({ type: String })], AxebowSelectInput.prototype, "addNewLabel", void 0);
|
|
@@ -2073,7 +2101,6 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2073
2101
|
this.compact = false;
|
|
2074
2102
|
this.showStepper = true;
|
|
2075
2103
|
this.stepAmount = 1;
|
|
2076
|
-
this.fixedField = false;
|
|
2077
2104
|
}
|
|
2078
2105
|
static {
|
|
2079
2106
|
this.styles = [
|
|
@@ -2122,8 +2149,6 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2122
2149
|
.fixedHeight=${this.fixedHeight}
|
|
2123
2150
|
.showStepper=${this.showStepper}
|
|
2124
2151
|
.stepAmount=${this.stepAmount}
|
|
2125
|
-
.fixedField=${this.fixedField}
|
|
2126
|
-
.minWidth=${this.minWidth}
|
|
2127
2152
|
></axebow-numeric-input>
|
|
2128
2153
|
`;
|
|
2129
2154
|
case "integer": return html`
|
|
@@ -2145,8 +2170,6 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2145
2170
|
.fixedHeight=${this.fixedHeight}
|
|
2146
2171
|
.showStepper=${this.showStepper}
|
|
2147
2172
|
.stepAmount=${this.stepAmount}
|
|
2148
|
-
.fixedField=${this.fixedField}
|
|
2149
|
-
.minWidth=${this.minWidth}
|
|
2150
2173
|
></axebow-numeric-input>
|
|
2151
2174
|
`;
|
|
2152
2175
|
case "select": return html`
|
|
@@ -2168,7 +2191,6 @@ var AxebowInput = class AxebowInput extends LitElement {
|
|
|
2168
2191
|
.clearable=${this.clearable}
|
|
2169
2192
|
.onAddNew=${this.onAddNew}
|
|
2170
2193
|
.addDialogLabels=${this.addDialogLabels}
|
|
2171
|
-
.minWidth=${this.minWidth}
|
|
2172
2194
|
></axebow-select-input>
|
|
2173
2195
|
`;
|
|
2174
2196
|
case "checkbox": return html`
|
|
@@ -2259,10 +2281,8 @@ __decorate([property({ attribute: false })], AxebowInput.prototype, "addDialogLa
|
|
|
2259
2281
|
__decorate([property({ type: Boolean })], AxebowInput.prototype, "compact", void 0);
|
|
2260
2282
|
__decorate([property({ type: String })], AxebowInput.prototype, "fixedWidth", void 0);
|
|
2261
2283
|
__decorate([property({ type: String })], AxebowInput.prototype, "fixedHeight", void 0);
|
|
2262
|
-
__decorate([property({ type: String })], AxebowInput.prototype, "minWidth", void 0);
|
|
2263
2284
|
__decorate([property({ type: Boolean })], AxebowInput.prototype, "showStepper", void 0);
|
|
2264
2285
|
__decorate([property({ type: Number })], AxebowInput.prototype, "stepAmount", void 0);
|
|
2265
|
-
__decorate([property({ type: Boolean })], AxebowInput.prototype, "fixedField", void 0);
|
|
2266
2286
|
AxebowInput = __decorate([customElement("axebow-input")], AxebowInput);
|
|
2267
2287
|
//#endregion
|
|
2268
2288
|
//#region src/components/axebow-dialog/axebow-dialog.ts
|
|
@@ -2330,7 +2350,7 @@ var AxebowDialog = class AxebowDialog extends LitElement {
|
|
|
2330
2350
|
aria-label=${this.closeLabel}
|
|
2331
2351
|
@click=${() => this.onClose?.()}
|
|
2332
2352
|
>
|
|
2333
|
-
<axebow-icon iconName=${this.closeIcon} iconColor=${this.closeIconColor} size="
|
|
2353
|
+
<axebow-icon iconName=${this.closeIcon} iconColor=${this.closeIconColor} size="xl"></axebow-icon>
|
|
2334
2354
|
</button>
|
|
2335
2355
|
` : ""}
|
|
2336
2356
|
</div>
|
|
@@ -2518,7 +2538,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2518
2538
|
<axebow-icon
|
|
2519
2539
|
iconName="person_add"
|
|
2520
2540
|
iconColor="var(--axebow-primary)"
|
|
2521
|
-
size="
|
|
2541
|
+
size="3xl"
|
|
2522
2542
|
class="shrink-0"
|
|
2523
2543
|
></axebow-icon>
|
|
2524
2544
|
<div class="flex flex-col gap-6 flex-1 min-w-0">
|
|
@@ -2529,7 +2549,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2529
2549
|
aria-label="${this.labels.closeAriaLabel}"
|
|
2530
2550
|
@click=${() => this.onClose?.()}
|
|
2531
2551
|
>
|
|
2532
|
-
<axebow-icon iconName="close" size="
|
|
2552
|
+
<axebow-icon iconName="close" size="xl"></axebow-icon>
|
|
2533
2553
|
</button>
|
|
2534
2554
|
</div>
|
|
2535
2555
|
<p class="m-0 text-base text-gray-500">
|
|
@@ -2657,7 +2677,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2657
2677
|
<span class="flex-1 text-center">${this._roleLabel(c.permission)}</span>
|
|
2658
2678
|
<axebow-icon
|
|
2659
2679
|
iconName="expand_more"
|
|
2660
|
-
size="
|
|
2680
|
+
size="md"
|
|
2661
2681
|
iconColor="var(--axebow-tertiary)"
|
|
2662
2682
|
></axebow-icon>
|
|
2663
2683
|
</button>
|
|
@@ -2678,7 +2698,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2678
2698
|
${(this.selectedRole[c.email] || c.permission) === opt.value ? html`<axebow-icon
|
|
2679
2699
|
iconName="check"
|
|
2680
2700
|
iconColor="var(--axebow-primary)"
|
|
2681
|
-
size="
|
|
2701
|
+
size="md"
|
|
2682
2702
|
></axebow-icon>` : ""}
|
|
2683
2703
|
</div>
|
|
2684
2704
|
</sl-menu-item>
|
|
@@ -2695,7 +2715,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2695
2715
|
<axebow-icon
|
|
2696
2716
|
iconName="sync"
|
|
2697
2717
|
iconColor="var(--axebow-tertiary)"
|
|
2698
|
-
size="
|
|
2718
|
+
size="md"
|
|
2699
2719
|
></axebow-icon>
|
|
2700
2720
|
<span class="text-blue-[var(--axebow-tertiary)] font-medium"
|
|
2701
2721
|
>${this.labels.updateUserAction}</span
|
|
@@ -2709,7 +2729,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2709
2729
|
<axebow-icon
|
|
2710
2730
|
iconName="send"
|
|
2711
2731
|
iconColor="var(--axebow-tertiary)"
|
|
2712
|
-
size="
|
|
2732
|
+
size="md"
|
|
2713
2733
|
></axebow-icon>
|
|
2714
2734
|
<span class="text-blue-[var(--axebow-tertiary)]"
|
|
2715
2735
|
>${this.labels.resendInviteAction}</span
|
|
@@ -2723,7 +2743,7 @@ var AxebowCollaboratorsDialog = class AxebowCollaboratorsDialog extends LitEleme
|
|
|
2723
2743
|
<axebow-icon
|
|
2724
2744
|
iconName="delete"
|
|
2725
2745
|
iconColor="var(--axebow-error)"
|
|
2726
|
-
size="
|
|
2746
|
+
size="md"
|
|
2727
2747
|
></axebow-icon>
|
|
2728
2748
|
<span class="text-red-[var(--axebow-error)]"
|
|
2729
2749
|
>${this.labels.removeAction}</span
|
|
@@ -2801,6 +2821,548 @@ __decorate([property({ attribute: false })], AxebowCollaboratorsDialog.prototype
|
|
|
2801
2821
|
__decorate([property({ attribute: false })], AxebowCollaboratorsDialog.prototype, "onClose", void 0);
|
|
2802
2822
|
AxebowCollaboratorsDialog = __decorate([customElement("axebow-collaborators-dialog")], AxebowCollaboratorsDialog);
|
|
2803
2823
|
//#endregion
|
|
2824
|
+
//#region src/components/axebow-modals-confirmation/axebow-modals-confirmation.ts
|
|
2825
|
+
var AxebowModalsConfirmation = class AxebowModalsConfirmation extends LitElement {
|
|
2826
|
+
constructor(..._args) {
|
|
2827
|
+
super(..._args);
|
|
2828
|
+
this.open = true;
|
|
2829
|
+
this.inline = false;
|
|
2830
|
+
this.severity = "Neutral";
|
|
2831
|
+
this.intent = "Decisional";
|
|
2832
|
+
this.popUpTittle = "Pop-up tittle";
|
|
2833
|
+
this.textBody = "This account will consume all resources declared in the limits section after the first service is created.";
|
|
2834
|
+
this.showIconOnTitle = true;
|
|
2835
|
+
this.showForm = true;
|
|
2836
|
+
this.showHyperlink = false;
|
|
2837
|
+
this.hyperlinkText = "Need help?";
|
|
2838
|
+
this.showFooter = true;
|
|
2839
|
+
this.showSecondaryCTA = true;
|
|
2840
|
+
this.showPrimaryCTA = true;
|
|
2841
|
+
this.secondaryButtonText = "Secondary Button";
|
|
2842
|
+
this.primaryButtonText = "Primary Button";
|
|
2843
|
+
this.secondaryButtonDisabled = false;
|
|
2844
|
+
this.primaryButtonDisabled = false;
|
|
2845
|
+
this.canClose = true;
|
|
2846
|
+
this.entityName = "entity-name";
|
|
2847
|
+
this._providerUsername = "";
|
|
2848
|
+
this._providerPassword = "";
|
|
2849
|
+
this._domain = "";
|
|
2850
|
+
this._confirmText = "";
|
|
2851
|
+
this._showPassword = false;
|
|
2852
|
+
}
|
|
2853
|
+
static {
|
|
2854
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
2855
|
+
:host {
|
|
2856
|
+
display: block;
|
|
2857
|
+
font-family: 'Open Sans', system-ui, -apple-system, sans-serif;
|
|
2858
|
+
}
|
|
2859
|
+
|
|
2860
|
+
/* Shoelace Dialog Custom Overrides */
|
|
2861
|
+
sl-dialog::part(panel) {
|
|
2862
|
+
background-color: var(--axebow-confirmation-modal-bg, #f0f1f5);
|
|
2863
|
+
border-radius: 6px;
|
|
2864
|
+
box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.1);
|
|
2865
|
+
padding: 0;
|
|
2866
|
+
width: 100%;
|
|
2867
|
+
max-width: 579px;
|
|
2868
|
+
overflow: hidden;
|
|
2869
|
+
}
|
|
2870
|
+
|
|
2871
|
+
sl-dialog::part(header),
|
|
2872
|
+
sl-dialog::part(header-actions) {
|
|
2873
|
+
display: none;
|
|
2874
|
+
}
|
|
2875
|
+
|
|
2876
|
+
sl-dialog::part(body) {
|
|
2877
|
+
padding: 24px;
|
|
2878
|
+
}
|
|
2879
|
+
|
|
2880
|
+
sl-dialog::part(footer) {
|
|
2881
|
+
padding: 0;
|
|
2882
|
+
}
|
|
2883
|
+
|
|
2884
|
+
/* Standalone container styles (when rendered inline or without dialog) */
|
|
2885
|
+
.modal-card {
|
|
2886
|
+
background-color: var(--axebow-confirmation-modal-bg, #f0f1f5);
|
|
2887
|
+
border-radius: 6px;
|
|
2888
|
+
box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.1);
|
|
2889
|
+
padding: 24px;
|
|
2890
|
+
width: 100%;
|
|
2891
|
+
max-width: 579px;
|
|
2892
|
+
box-sizing: border-box;
|
|
2893
|
+
}
|
|
2894
|
+
|
|
2895
|
+
/* Form Input Styling */
|
|
2896
|
+
.form-field-input::part(base) {
|
|
2897
|
+
height: 40px;
|
|
2898
|
+
border-radius: 6px;
|
|
2899
|
+
border: 1px solid #dbdde4;
|
|
2900
|
+
background-color: #ffffff;
|
|
2901
|
+
padding-left: 12px;
|
|
2902
|
+
padding-right: 12px;
|
|
2903
|
+
font-size: 14px;
|
|
2904
|
+
font-family: 'Open Sans', sans-serif;
|
|
2905
|
+
color: #000000;
|
|
2906
|
+
box-shadow: none;
|
|
2907
|
+
transition: border-color 0.2s ease, box-shadow 0.2s ease;
|
|
2908
|
+
}
|
|
2909
|
+
|
|
2910
|
+
.form-field-input::part(base):hover {
|
|
2911
|
+
border-color: #b0b4be;
|
|
2912
|
+
}
|
|
2913
|
+
|
|
2914
|
+
.form-field-input::part(base):focus-within {
|
|
2915
|
+
border-color: #006bff;
|
|
2916
|
+
box-shadow: 0 0 0 2px rgba(0, 107, 255, 0.15);
|
|
2917
|
+
}
|
|
2918
|
+
|
|
2919
|
+
.form-field-input::part(input) {
|
|
2920
|
+
font-size: 14px;
|
|
2921
|
+
font-family: 'Open Sans', sans-serif;
|
|
2922
|
+
color: #000000;
|
|
2923
|
+
}
|
|
2924
|
+
|
|
2925
|
+
.form-field-input::part(input)::placeholder {
|
|
2926
|
+
color: #78787a;
|
|
2927
|
+
}
|
|
2928
|
+
|
|
2929
|
+
/* Buttons Styling */
|
|
2930
|
+
.modal-btn {
|
|
2931
|
+
width: 150px;
|
|
2932
|
+
height: 40px;
|
|
2933
|
+
border-radius: 6px;
|
|
2934
|
+
font-size: 14px;
|
|
2935
|
+
font-weight: 600;
|
|
2936
|
+
font-family: 'Open Sans', sans-serif;
|
|
2937
|
+
cursor: pointer;
|
|
2938
|
+
display: inline-flex;
|
|
2939
|
+
align-items: center;
|
|
2940
|
+
justify-content: center;
|
|
2941
|
+
transition: all 0.2s ease;
|
|
2942
|
+
box-sizing: border-box;
|
|
2943
|
+
}
|
|
2944
|
+
|
|
2945
|
+
.modal-btn:disabled {
|
|
2946
|
+
opacity: 0.5;
|
|
2947
|
+
cursor: not-allowed;
|
|
2948
|
+
}
|
|
2949
|
+
|
|
2950
|
+
/* Blue Primary Button */
|
|
2951
|
+
.btn-primary-blue {
|
|
2952
|
+
background-color: #006bff;
|
|
2953
|
+
color: #ffffff;
|
|
2954
|
+
border: none;
|
|
2955
|
+
}
|
|
2956
|
+
.btn-primary-blue:hover:not(:disabled) {
|
|
2957
|
+
background-color: #0056cc;
|
|
2958
|
+
}
|
|
2959
|
+
|
|
2960
|
+
/* Blue Secondary Button */
|
|
2961
|
+
.btn-secondary-blue {
|
|
2962
|
+
background-color: transparent;
|
|
2963
|
+
color: #006bff;
|
|
2964
|
+
border: 1px solid #006bff;
|
|
2965
|
+
}
|
|
2966
|
+
.btn-secondary-blue:hover:not(:disabled) {
|
|
2967
|
+
background-color: rgba(0, 107, 255, 0.05);
|
|
2968
|
+
}
|
|
2969
|
+
|
|
2970
|
+
/* Red Primary Button (Destructive) */
|
|
2971
|
+
.btn-primary-red {
|
|
2972
|
+
background-color: #e93a3a;
|
|
2973
|
+
color: #ffffff;
|
|
2974
|
+
border: none;
|
|
2975
|
+
}
|
|
2976
|
+
.btn-primary-red:hover:not(:disabled) {
|
|
2977
|
+
background-color: #d12b2b;
|
|
2978
|
+
}
|
|
2979
|
+
|
|
2980
|
+
/* Red Secondary Button (Destructive) */
|
|
2981
|
+
.btn-secondary-red {
|
|
2982
|
+
background-color: transparent;
|
|
2983
|
+
color: #e93a3a;
|
|
2984
|
+
border: 1px solid #e93a3a;
|
|
2985
|
+
}
|
|
2986
|
+
.btn-secondary-red:hover:not(:disabled) {
|
|
2987
|
+
background-color: rgba(233, 58, 58, 0.05);
|
|
2988
|
+
}
|
|
2989
|
+
|
|
2990
|
+
.modal-btn:disabled {
|
|
2991
|
+
opacity: 0.5;
|
|
2992
|
+
cursor: not-allowed;
|
|
2993
|
+
}
|
|
2994
|
+
`];
|
|
2995
|
+
}
|
|
2996
|
+
/** Alias for popUpTittle */
|
|
2997
|
+
get popUpTitle() {
|
|
2998
|
+
return this.popUpTittle;
|
|
2999
|
+
}
|
|
3000
|
+
set popUpTitle(value) {
|
|
3001
|
+
this.popUpTittle = value;
|
|
3002
|
+
}
|
|
3003
|
+
/**
|
|
3004
|
+
* Returns severity configuration according to design specifications:
|
|
3005
|
+
* - Success: green check_circle icon, standard blue buttons
|
|
3006
|
+
* - Error: red error icon, standard blue buttons
|
|
3007
|
+
* - Neutral: blue info icon, standard blue buttons
|
|
3008
|
+
* - Destructive: red error icon, RED buttons (#E93A3A)
|
|
3009
|
+
*/
|
|
3010
|
+
get _severityConfig() {
|
|
3011
|
+
if (this.iconName) return {
|
|
3012
|
+
icon: this.iconName,
|
|
3013
|
+
iconColor: this.iconColor ?? (this.severity === "Destructive" || this.severity === "Error" ? "#E93A3A" : "#006BFF"),
|
|
3014
|
+
isRedButtons: this.severity === "Destructive"
|
|
3015
|
+
};
|
|
3016
|
+
switch (this.severity) {
|
|
3017
|
+
case "Success": return {
|
|
3018
|
+
icon: "check_circle",
|
|
3019
|
+
iconColor: "#10B981",
|
|
3020
|
+
isRedButtons: false
|
|
3021
|
+
};
|
|
3022
|
+
case "Error": return {
|
|
3023
|
+
icon: "error",
|
|
3024
|
+
iconColor: "#E93A3A",
|
|
3025
|
+
isRedButtons: false
|
|
3026
|
+
};
|
|
3027
|
+
case "Destructive": return {
|
|
3028
|
+
icon: "error",
|
|
3029
|
+
iconColor: "#E93A3A",
|
|
3030
|
+
isRedButtons: true
|
|
3031
|
+
};
|
|
3032
|
+
default: return {
|
|
3033
|
+
icon: "info",
|
|
3034
|
+
iconColor: "#006BFF",
|
|
3035
|
+
isRedButtons: false
|
|
3036
|
+
};
|
|
3037
|
+
}
|
|
3038
|
+
}
|
|
3039
|
+
/**
|
|
3040
|
+
* Helper to retrieve current form payload object
|
|
3041
|
+
*/
|
|
3042
|
+
getFormData() {
|
|
3043
|
+
return {
|
|
3044
|
+
providerUsername: this._providerUsername,
|
|
3045
|
+
providerPassword: this._providerPassword,
|
|
3046
|
+
domain: this._domain,
|
|
3047
|
+
confirmText: this._confirmText
|
|
3048
|
+
};
|
|
3049
|
+
}
|
|
3050
|
+
/**
|
|
3051
|
+
* Reset form fields to initial empty state
|
|
3052
|
+
*/
|
|
3053
|
+
resetForm() {
|
|
3054
|
+
this._providerUsername = "";
|
|
3055
|
+
this._providerPassword = "";
|
|
3056
|
+
this._domain = "";
|
|
3057
|
+
this._confirmText = "";
|
|
3058
|
+
this._showPassword = false;
|
|
3059
|
+
}
|
|
3060
|
+
_notifyFormChange() {
|
|
3061
|
+
const formData = this.getFormData();
|
|
3062
|
+
this.dispatchEvent(new CustomEvent("axebow-form-change", {
|
|
3063
|
+
detail: formData,
|
|
3064
|
+
bubbles: true,
|
|
3065
|
+
composed: true
|
|
3066
|
+
}));
|
|
3067
|
+
}
|
|
3068
|
+
_handleClose() {
|
|
3069
|
+
this.dispatchEvent(new CustomEvent("axebow-close", {
|
|
3070
|
+
bubbles: true,
|
|
3071
|
+
composed: true
|
|
3072
|
+
}));
|
|
3073
|
+
if (!this.inline) this.open = false;
|
|
3074
|
+
}
|
|
3075
|
+
_handleSecondaryClick() {
|
|
3076
|
+
const payload = {
|
|
3077
|
+
severity: this.severity,
|
|
3078
|
+
intent: this.intent,
|
|
3079
|
+
formData: this.showForm ? this.getFormData() : void 0
|
|
3080
|
+
};
|
|
3081
|
+
this.dispatchEvent(new CustomEvent("axebow-cancel", {
|
|
3082
|
+
detail: payload,
|
|
3083
|
+
bubbles: true,
|
|
3084
|
+
composed: true
|
|
3085
|
+
}));
|
|
3086
|
+
}
|
|
3087
|
+
_handlePrimaryClick() {
|
|
3088
|
+
const payload = {
|
|
3089
|
+
severity: this.severity,
|
|
3090
|
+
intent: this.intent,
|
|
3091
|
+
formData: this.showForm ? this.getFormData() : void 0
|
|
3092
|
+
};
|
|
3093
|
+
this.dispatchEvent(new CustomEvent("axebow-confirm", {
|
|
3094
|
+
detail: payload,
|
|
3095
|
+
bubbles: true,
|
|
3096
|
+
composed: true
|
|
3097
|
+
}));
|
|
3098
|
+
}
|
|
3099
|
+
_handleHyperlinkClick(e) {
|
|
3100
|
+
if (this.hyperlinkHref) return;
|
|
3101
|
+
e.preventDefault();
|
|
3102
|
+
this.dispatchEvent(new CustomEvent("axebow-hyperlink-click", {
|
|
3103
|
+
bubbles: true,
|
|
3104
|
+
composed: true
|
|
3105
|
+
}));
|
|
3106
|
+
}
|
|
3107
|
+
/**
|
|
3108
|
+
* Renders the top header section (Icon 32x32 + Title + Close icon 24x24)
|
|
3109
|
+
*/
|
|
3110
|
+
_renderHeader() {
|
|
3111
|
+
const { icon, iconColor } = this._severityConfig;
|
|
3112
|
+
return html`
|
|
3113
|
+
<div class="flex items-start justify-between w-full">
|
|
3114
|
+
<div class="flex items-start gap-4 min-w-0 flex-1">
|
|
3115
|
+
${this.showIconOnTitle ? html`
|
|
3116
|
+
<div class="shrink-0 flex items-center justify-center w-8 h-8">
|
|
3117
|
+
<axebow-icon iconName=${icon} iconColor=${iconColor} size="3xl"></axebow-icon>
|
|
3118
|
+
</div>
|
|
3119
|
+
` : html`<div class="shrink-0 w-8 h-8" aria-hidden="true"></div>`}
|
|
3120
|
+
<div class="flex flex-col gap-6 flex-1 min-w-0">
|
|
3121
|
+
<h3 class="m-0 text-xl font-semibold text-black leading-tight truncate">
|
|
3122
|
+
${this.popUpTittle}
|
|
3123
|
+
</h3>
|
|
3124
|
+
${this.textBody ? html`<p class="m-0 text-sm text-black font-normal leading-relaxed">${this.textBody}</p>` : html`<slot name="body"></slot>`}
|
|
3125
|
+
</div>
|
|
3126
|
+
</div>
|
|
3127
|
+
|
|
3128
|
+
${this.canClose ? html`
|
|
3129
|
+
<button
|
|
3130
|
+
type="button"
|
|
3131
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center shrink-0 text-[#78787A] hover:text-black transition-colors ml-4"
|
|
3132
|
+
aria-label="Close dialog"
|
|
3133
|
+
@click=${this._handleClose}
|
|
3134
|
+
>
|
|
3135
|
+
<axebow-icon iconName="cancel" iconColor="currentColor" size="2xl"></axebow-icon>
|
|
3136
|
+
</button>
|
|
3137
|
+
` : ""}
|
|
3138
|
+
</div>
|
|
3139
|
+
`;
|
|
3140
|
+
}
|
|
3141
|
+
/**
|
|
3142
|
+
* Renders the 4-field confirmation form (indented 47px from left, gap 16px between fields)
|
|
3143
|
+
*/
|
|
3144
|
+
_renderForm() {
|
|
3145
|
+
if (!this.showForm) return "";
|
|
3146
|
+
const expectedConfirmPlaceholder = `delete+[${this.entityName}]`;
|
|
3147
|
+
return html`
|
|
3148
|
+
<div class="pl-11.75 flex flex-col gap-4 w-full box-border">
|
|
3149
|
+
<slot name="form">
|
|
3150
|
+
<!-- Field 1: Provider username -->
|
|
3151
|
+
<div class="flex flex-col gap-2 w-full">
|
|
3152
|
+
<label class="text-sm font-semibold text-black m-0">Provider username</label>
|
|
3153
|
+
<sl-input
|
|
3154
|
+
class="form-field-input"
|
|
3155
|
+
placeholder="Enter user"
|
|
3156
|
+
.value=${this._providerUsername}
|
|
3157
|
+
@sl-input=${(e) => {
|
|
3158
|
+
this._providerUsername = e.target.value;
|
|
3159
|
+
this._notifyFormChange();
|
|
3160
|
+
}}
|
|
3161
|
+
></sl-input>
|
|
3162
|
+
</div>
|
|
3163
|
+
|
|
3164
|
+
<!-- Field 2: Provider password with toggle eye icon -->
|
|
3165
|
+
<div class="flex flex-col gap-2 w-full">
|
|
3166
|
+
<label class="text-sm font-semibold text-black m-0">Provider password</label>
|
|
3167
|
+
<sl-input
|
|
3168
|
+
class="form-field-input"
|
|
3169
|
+
type=${this._showPassword ? "text" : "password"}
|
|
3170
|
+
placeholder="Enter password"
|
|
3171
|
+
.value=${this._providerPassword}
|
|
3172
|
+
@sl-input=${(e) => {
|
|
3173
|
+
this._providerPassword = e.target.value;
|
|
3174
|
+
this._notifyFormChange();
|
|
3175
|
+
}}
|
|
3176
|
+
>
|
|
3177
|
+
<button
|
|
3178
|
+
slot="suffix"
|
|
3179
|
+
type="button"
|
|
3180
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#78787A] hover:text-black transition-colors"
|
|
3181
|
+
@click=${() => this._showPassword = !this._showPassword}
|
|
3182
|
+
aria-label=${this._showPassword ? "Hide password" : "Show password"}
|
|
3183
|
+
>
|
|
3184
|
+
<axebow-icon
|
|
3185
|
+
iconName=${this._showPassword ? "visibility_off" : "visibility"}
|
|
3186
|
+
iconColor="currentColor"
|
|
3187
|
+
size="xl"
|
|
3188
|
+
></axebow-icon>
|
|
3189
|
+
</button>
|
|
3190
|
+
</sl-input>
|
|
3191
|
+
</div>
|
|
3192
|
+
|
|
3193
|
+
<!-- Field 3: Domain -->
|
|
3194
|
+
<div class="flex flex-col gap-2 w-full">
|
|
3195
|
+
<label class="text-sm font-semibold text-black m-0">Domain</label>
|
|
3196
|
+
<sl-input
|
|
3197
|
+
class="form-field-input"
|
|
3198
|
+
placeholder="Enter domain"
|
|
3199
|
+
.value=${this._domain}
|
|
3200
|
+
@sl-input=${(e) => {
|
|
3201
|
+
this._domain = e.target.value;
|
|
3202
|
+
this._notifyFormChange();
|
|
3203
|
+
}}
|
|
3204
|
+
></sl-input>
|
|
3205
|
+
</div>
|
|
3206
|
+
|
|
3207
|
+
<!-- Field 4: Confirmation delete field -->
|
|
3208
|
+
<div class="flex flex-col gap-2 w-full">
|
|
3209
|
+
<label class="text-sm font-semibold text-black m-0 flex items-center gap-1">
|
|
3210
|
+
<span class="text-[#E93A3A] font-bold">*</span>
|
|
3211
|
+
<span>Type "${expectedConfirmPlaceholder}" to confirm:</span>
|
|
3212
|
+
</label>
|
|
3213
|
+
<sl-input
|
|
3214
|
+
class="form-field-input"
|
|
3215
|
+
placeholder=${expectedConfirmPlaceholder}
|
|
3216
|
+
.value=${this._confirmText}
|
|
3217
|
+
@sl-input=${(e) => {
|
|
3218
|
+
this._confirmText = e.target.value;
|
|
3219
|
+
this._notifyFormChange();
|
|
3220
|
+
}}
|
|
3221
|
+
></sl-input>
|
|
3222
|
+
</div>
|
|
3223
|
+
</slot>
|
|
3224
|
+
</div>
|
|
3225
|
+
`;
|
|
3226
|
+
}
|
|
3227
|
+
/**
|
|
3228
|
+
* Renders the action footer (Width 483px, indented 47px, hyperlink + buttons)
|
|
3229
|
+
*/
|
|
3230
|
+
_renderFooter() {
|
|
3231
|
+
if (!this.showFooter) return "";
|
|
3232
|
+
const isDestructive = this.severity === "Destructive";
|
|
3233
|
+
const primaryVariant = isDestructive ? "danger" : "primary";
|
|
3234
|
+
const secondaryVariant = isDestructive ? "danger" : "primary";
|
|
3235
|
+
return html`
|
|
3236
|
+
<div class="pl-11.75 w-full flex items-center justify-between gap-4 box-border">
|
|
3237
|
+
<slot name="footer">
|
|
3238
|
+
<!-- Optional Hyperlink -->
|
|
3239
|
+
<div>
|
|
3240
|
+
${this.showHyperlink ? html`
|
|
3241
|
+
<slot name="hyperlink">
|
|
3242
|
+
<a
|
|
3243
|
+
href=${this.hyperlinkHref ?? "#"}
|
|
3244
|
+
class="text-sm font-semibold text-[#006BFF] hover:underline cursor-pointer no-underline"
|
|
3245
|
+
@click=${this._handleHyperlinkClick}
|
|
3246
|
+
>
|
|
3247
|
+
${this.hyperlinkText}
|
|
3248
|
+
</a>
|
|
3249
|
+
</slot>
|
|
3250
|
+
` : ""}
|
|
3251
|
+
</div>
|
|
3252
|
+
|
|
3253
|
+
<!-- Action Buttons -->
|
|
3254
|
+
<div class="flex items-center gap-4 ml-auto">
|
|
3255
|
+
${this.showSecondaryCTA ? html`
|
|
3256
|
+
<axebow-button
|
|
3257
|
+
variant=${secondaryVariant}
|
|
3258
|
+
?outline=${true}
|
|
3259
|
+
fixedHeight="40px"
|
|
3260
|
+
.disabled=${this.secondaryButtonDisabled}
|
|
3261
|
+
@click=${this._handleSecondaryClick}
|
|
3262
|
+
>
|
|
3263
|
+
<span class="flex items-center justify-center gap-1">
|
|
3264
|
+
<span>${this.secondaryButtonText}</span>
|
|
3265
|
+
${this.secondaryButtonTooltip ? html`
|
|
3266
|
+
<axebow-tooltip content=${this.secondaryButtonTooltip} placement="top">
|
|
3267
|
+
<axebow-icon iconName="info" iconColor="currentColor" size="md" class="shrink-0 cursor-pointer ml-1"></axebow-icon>
|
|
3268
|
+
</axebow-tooltip>
|
|
3269
|
+
` : ""}
|
|
3270
|
+
</span>
|
|
3271
|
+
</axebow-button>
|
|
3272
|
+
` : ""}
|
|
3273
|
+
${this.showPrimaryCTA ? html`
|
|
3274
|
+
<axebow-button
|
|
3275
|
+
variant=${primaryVariant}
|
|
3276
|
+
fixedHeight="40px"
|
|
3277
|
+
.disabled=${this.primaryButtonDisabled}
|
|
3278
|
+
@click=${this._handlePrimaryClick}
|
|
3279
|
+
>
|
|
3280
|
+
<span class="flex items-center justify-center gap-1">
|
|
3281
|
+
<span>${this.primaryButtonText}</span>
|
|
3282
|
+
${this.primaryButtonTooltip ? html`
|
|
3283
|
+
<axebow-tooltip content=${this.primaryButtonTooltip} placement="top">
|
|
3284
|
+
<axebow-icon iconName="info" iconColor="currentColor" size="md" class="shrink-0 cursor-pointer ml-1"></axebow-icon>
|
|
3285
|
+
</axebow-tooltip>
|
|
3286
|
+
` : ""}
|
|
3287
|
+
</span>
|
|
3288
|
+
</axebow-button>
|
|
3289
|
+
` : ""}
|
|
3290
|
+
</div>
|
|
3291
|
+
</slot>
|
|
3292
|
+
</div>
|
|
3293
|
+
`;
|
|
3294
|
+
}
|
|
3295
|
+
/**
|
|
3296
|
+
* Renders the complete modal content layout (flex column, gap 32px)
|
|
3297
|
+
*/
|
|
3298
|
+
_renderContent() {
|
|
3299
|
+
return html`
|
|
3300
|
+
<div class="flex flex-col gap-8 w-full">
|
|
3301
|
+
${this._renderHeader()}
|
|
3302
|
+
${this._renderForm()}
|
|
3303
|
+
${this._renderFooter()}
|
|
3304
|
+
</div>
|
|
3305
|
+
`;
|
|
3306
|
+
}
|
|
3307
|
+
render() {
|
|
3308
|
+
const bgStyle = this.backgroundColor ? `--axebow-confirmation-modal-bg: ${this.backgroundColor}; background-color: ${this.backgroundColor};` : "";
|
|
3309
|
+
if (this.inline) return html`
|
|
3310
|
+
<div class="modal-card" style=${bgStyle}>
|
|
3311
|
+
${this._renderContent()}
|
|
3312
|
+
</div>
|
|
3313
|
+
`;
|
|
3314
|
+
return html`
|
|
3315
|
+
<sl-dialog
|
|
3316
|
+
?open=${this.open}
|
|
3317
|
+
no-header
|
|
3318
|
+
label=${this.popUpTittle}
|
|
3319
|
+
style=${bgStyle}
|
|
3320
|
+
@sl-request-close=${(e) => {
|
|
3321
|
+
e.preventDefault();
|
|
3322
|
+
this._handleClose();
|
|
3323
|
+
}}
|
|
3324
|
+
>
|
|
3325
|
+
${this._renderContent()}
|
|
3326
|
+
</sl-dialog>
|
|
3327
|
+
`;
|
|
3328
|
+
}
|
|
3329
|
+
};
|
|
3330
|
+
__decorate([property({
|
|
3331
|
+
type: Boolean,
|
|
3332
|
+
reflect: true
|
|
3333
|
+
})], AxebowModalsConfirmation.prototype, "open", void 0);
|
|
3334
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "inline", void 0);
|
|
3335
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "backgroundColor", void 0);
|
|
3336
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "severity", void 0);
|
|
3337
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "intent", void 0);
|
|
3338
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "popUpTittle", void 0);
|
|
3339
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "popUpTitle", null);
|
|
3340
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "textBody", void 0);
|
|
3341
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showIconOnTitle", void 0);
|
|
3342
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showForm", void 0);
|
|
3343
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showHyperlink", void 0);
|
|
3344
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "hyperlinkText", void 0);
|
|
3345
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "hyperlinkHref", void 0);
|
|
3346
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showFooter", void 0);
|
|
3347
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showSecondaryCTA", void 0);
|
|
3348
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "showPrimaryCTA", void 0);
|
|
3349
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "secondaryButtonText", void 0);
|
|
3350
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "primaryButtonText", void 0);
|
|
3351
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "secondaryButtonTooltip", void 0);
|
|
3352
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "secondaryButtonDisabled", void 0);
|
|
3353
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "primaryButtonTooltip", void 0);
|
|
3354
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "primaryButtonDisabled", void 0);
|
|
3355
|
+
__decorate([property({ type: Boolean })], AxebowModalsConfirmation.prototype, "canClose", void 0);
|
|
3356
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "entityName", void 0);
|
|
3357
|
+
__decorate([state()], AxebowModalsConfirmation.prototype, "_providerUsername", void 0);
|
|
3358
|
+
__decorate([state()], AxebowModalsConfirmation.prototype, "_providerPassword", void 0);
|
|
3359
|
+
__decorate([state()], AxebowModalsConfirmation.prototype, "_domain", void 0);
|
|
3360
|
+
__decorate([state()], AxebowModalsConfirmation.prototype, "_confirmText", void 0);
|
|
3361
|
+
__decorate([state()], AxebowModalsConfirmation.prototype, "_showPassword", void 0);
|
|
3362
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "iconName", void 0);
|
|
3363
|
+
__decorate([property({ type: String })], AxebowModalsConfirmation.prototype, "iconColor", void 0);
|
|
3364
|
+
AxebowModalsConfirmation = __decorate([customElement("axebow-modals-confirmation")], AxebowModalsConfirmation);
|
|
3365
|
+
//#endregion
|
|
2804
3366
|
//#region src/components/axebow-limits-counter/axebow-limits-counter.ts
|
|
2805
3367
|
var AxebowLimitsCounter = class AxebowLimitsCounter extends LitElement {
|
|
2806
3368
|
constructor(..._args) {
|
|
@@ -2871,48 +3433,160 @@ var AxebowResourcesCounter = class AxebowResourcesCounter extends LitElement {
|
|
|
2871
3433
|
__decorate([property({ type: Array })], AxebowResourcesCounter.prototype, "items", void 0);
|
|
2872
3434
|
AxebowResourcesCounter = __decorate([customElement("axebow-resources-counter")], AxebowResourcesCounter);
|
|
2873
3435
|
//#endregion
|
|
2874
|
-
//#region src/components/axebow-
|
|
2875
|
-
var
|
|
3436
|
+
//#region src/components/axebow-tooltip/axebow-tooltip.ts
|
|
3437
|
+
var AxebowTooltip = class AxebowTooltip extends LitElement {
|
|
2876
3438
|
constructor(..._args) {
|
|
2877
3439
|
super(..._args);
|
|
2878
|
-
this.
|
|
2879
|
-
this.
|
|
2880
|
-
this.
|
|
2881
|
-
this.
|
|
2882
|
-
this.
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
this._handleFileSelection = (e) => {
|
|
2886
|
-
const input = e.target;
|
|
2887
|
-
this.onFileSelected?.(input.files?.[0] || null);
|
|
2888
|
-
};
|
|
2889
|
-
this._handleDrop = (e) => {
|
|
2890
|
-
e.preventDefault();
|
|
2891
|
-
e.stopPropagation();
|
|
2892
|
-
this._isDragging = false;
|
|
2893
|
-
this.onFileSelected?.(e.dataTransfer?.files?.[0] || null);
|
|
2894
|
-
};
|
|
2895
|
-
this._handleDragOver = (e) => {
|
|
2896
|
-
e.preventDefault();
|
|
2897
|
-
e.stopPropagation();
|
|
2898
|
-
this._isDragging = true;
|
|
2899
|
-
};
|
|
2900
|
-
this._handleDragLeave = (e) => {
|
|
2901
|
-
e.preventDefault();
|
|
2902
|
-
e.stopPropagation();
|
|
2903
|
-
this._isDragging = false;
|
|
2904
|
-
};
|
|
3440
|
+
this.icon = "info";
|
|
3441
|
+
this.color = "var(--axebow-primary)";
|
|
3442
|
+
this.size = "xl";
|
|
3443
|
+
this.content = "";
|
|
3444
|
+
this.placement = "top";
|
|
3445
|
+
this.hoist = true;
|
|
3446
|
+
this.disabled = false;
|
|
2905
3447
|
}
|
|
2906
3448
|
static {
|
|
2907
|
-
this.styles = [
|
|
2908
|
-
unsafeCSS(tailwind_default),
|
|
2909
|
-
axebowTheme,
|
|
2910
|
-
css`
|
|
3449
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
2911
3450
|
:host {
|
|
2912
|
-
display:
|
|
3451
|
+
display: inline-flex;
|
|
3452
|
+
align-items: center;
|
|
2913
3453
|
}
|
|
2914
|
-
|
|
2915
|
-
|
|
3454
|
+
`];
|
|
3455
|
+
}
|
|
3456
|
+
render() {
|
|
3457
|
+
return html`
|
|
3458
|
+
<sl-tooltip
|
|
3459
|
+
placement=${this.placement}
|
|
3460
|
+
?hoist=${this.hoist}
|
|
3461
|
+
?disabled=${this.disabled}
|
|
3462
|
+
exportparts="body, base, popup, arrow"
|
|
3463
|
+
>
|
|
3464
|
+
<div slot="content">
|
|
3465
|
+
${this.content ? this.content : html`<slot name="content"></slot>`}
|
|
3466
|
+
</div>
|
|
3467
|
+
<slot>
|
|
3468
|
+
<axebow-icon
|
|
3469
|
+
.iconName=${this.icon}
|
|
3470
|
+
.iconColor=${this.color}
|
|
3471
|
+
.size=${this.size}
|
|
3472
|
+
class="cursor-pointer flex items-center justify-center"
|
|
3473
|
+
></axebow-icon>
|
|
3474
|
+
</slot>
|
|
3475
|
+
</sl-tooltip>
|
|
3476
|
+
`;
|
|
3477
|
+
}
|
|
3478
|
+
};
|
|
3479
|
+
__decorate([property({ type: String })], AxebowTooltip.prototype, "icon", void 0);
|
|
3480
|
+
__decorate([property({ type: String })], AxebowTooltip.prototype, "color", void 0);
|
|
3481
|
+
__decorate([property({ type: String })], AxebowTooltip.prototype, "size", void 0);
|
|
3482
|
+
__decorate([property({ type: String })], AxebowTooltip.prototype, "content", void 0);
|
|
3483
|
+
__decorate([property({ type: String })], AxebowTooltip.prototype, "placement", void 0);
|
|
3484
|
+
__decorate([property({ type: Boolean })], AxebowTooltip.prototype, "hoist", void 0);
|
|
3485
|
+
__decorate([property({ type: Boolean })], AxebowTooltip.prototype, "disabled", void 0);
|
|
3486
|
+
AxebowTooltip = __decorate([customElement("axebow-tooltip")], AxebowTooltip);
|
|
3487
|
+
//#endregion
|
|
3488
|
+
//#region src/components/axebow-adjustment-resources-counter/axebow-adjustment-resources-counter.ts
|
|
3489
|
+
var AxebowAdjustmentResourcesCounter = class AxebowAdjustmentResourcesCounter extends LitElement {
|
|
3490
|
+
constructor(..._args) {
|
|
3491
|
+
super(..._args);
|
|
3492
|
+
this.type = "normal";
|
|
3493
|
+
this.criticalHighlight = false;
|
|
3494
|
+
this.number = 0;
|
|
3495
|
+
this.description = "";
|
|
3496
|
+
this.tooltipText = "";
|
|
3497
|
+
}
|
|
3498
|
+
static {
|
|
3499
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
3500
|
+
:host {
|
|
3501
|
+
display: inline-block;
|
|
3502
|
+
}
|
|
3503
|
+
`];
|
|
3504
|
+
}
|
|
3505
|
+
render() {
|
|
3506
|
+
switch (this.type) {
|
|
3507
|
+
case "normal": return this._renderNormal();
|
|
3508
|
+
case "boxed": return this._renderBoxed();
|
|
3509
|
+
default: return this._renderNormal();
|
|
3510
|
+
}
|
|
3511
|
+
}
|
|
3512
|
+
_renderBoxed() {
|
|
3513
|
+
return html`
|
|
3514
|
+
<div class="flex flex-col items-center py-2 px-3 w-30.75 h-fit border border-solid border-[#DBDDE4] rounded-md relative">
|
|
3515
|
+
${this.tooltipText ? html`
|
|
3516
|
+
<axebow-tooltip
|
|
3517
|
+
class="absolute top-1 right-1"
|
|
3518
|
+
icon="info"
|
|
3519
|
+
color="#DBDDE4"
|
|
3520
|
+
size="xl"
|
|
3521
|
+
.content=${this.tooltipText}
|
|
3522
|
+
></axebow-tooltip>
|
|
3523
|
+
` : ""}
|
|
3524
|
+
<div class="flex items-center gap-1">
|
|
3525
|
+
<p class="text-lg font-semibold text-[#344966]">${this.number}</p>
|
|
3526
|
+
</div>
|
|
3527
|
+
<p class="text-center">${this.description}</p>
|
|
3528
|
+
</div>`;
|
|
3529
|
+
}
|
|
3530
|
+
_renderNormal() {
|
|
3531
|
+
return html`
|
|
3532
|
+
<div class="flex flex-col py-2 w-27 h-fit ${this.criticalHighlight ? "border-b border-solid border-(--axebow-premium-text)" : ""}">
|
|
3533
|
+
<div class="flex items-center gap-1">
|
|
3534
|
+
<p class="text-lg font-semibold text-[#344966]">${this.number}</p>
|
|
3535
|
+
${this.criticalHighlight ? html`<axebow-icon iconName="warning" iconColor="var(--axebow-premium-text)" size="xl"></axebow-icon>` : ""}
|
|
3536
|
+
</div>
|
|
3537
|
+
<p>${this.description}</p>
|
|
3538
|
+
</div>`;
|
|
3539
|
+
}
|
|
3540
|
+
};
|
|
3541
|
+
__decorate([property({ type: String })], AxebowAdjustmentResourcesCounter.prototype, "type", void 0);
|
|
3542
|
+
__decorate([property({ type: Boolean })], AxebowAdjustmentResourcesCounter.prototype, "criticalHighlight", void 0);
|
|
3543
|
+
__decorate([property({ type: Number })], AxebowAdjustmentResourcesCounter.prototype, "number", void 0);
|
|
3544
|
+
__decorate([property({ type: String })], AxebowAdjustmentResourcesCounter.prototype, "description", void 0);
|
|
3545
|
+
__decorate([property({ type: String })], AxebowAdjustmentResourcesCounter.prototype, "tooltipText", void 0);
|
|
3546
|
+
AxebowAdjustmentResourcesCounter = __decorate([customElement("axebow-adjustment-resources-counter")], AxebowAdjustmentResourcesCounter);
|
|
3547
|
+
//#endregion
|
|
3548
|
+
//#region src/components/axebow-drag-drop-upload-file/axebow-drag-drop-upload-file.ts
|
|
3549
|
+
var AxebowDragDropUploadFile = class AxebowDragDropUploadFile extends LitElement {
|
|
3550
|
+
constructor(..._args) {
|
|
3551
|
+
super(..._args);
|
|
3552
|
+
this.fileName = "";
|
|
3553
|
+
this.fileSizeLabel = "";
|
|
3554
|
+
this.errorMessage = "";
|
|
3555
|
+
this._isDragging = false;
|
|
3556
|
+
this._triggerFileInput = () => {
|
|
3557
|
+
(this.shadowRoot?.getElementById("zip-file-input"))?.click();
|
|
3558
|
+
};
|
|
3559
|
+
this._handleFileSelection = (e) => {
|
|
3560
|
+
const input = e.target;
|
|
3561
|
+
this.onFileSelected?.(input.files?.[0] || null);
|
|
3562
|
+
};
|
|
3563
|
+
this._handleDrop = (e) => {
|
|
3564
|
+
e.preventDefault();
|
|
3565
|
+
e.stopPropagation();
|
|
3566
|
+
this._isDragging = false;
|
|
3567
|
+
this.onFileSelected?.(e.dataTransfer?.files?.[0] || null);
|
|
3568
|
+
};
|
|
3569
|
+
this._handleDragOver = (e) => {
|
|
3570
|
+
e.preventDefault();
|
|
3571
|
+
e.stopPropagation();
|
|
3572
|
+
this._isDragging = true;
|
|
3573
|
+
};
|
|
3574
|
+
this._handleDragLeave = (e) => {
|
|
3575
|
+
e.preventDefault();
|
|
3576
|
+
e.stopPropagation();
|
|
3577
|
+
this._isDragging = false;
|
|
3578
|
+
};
|
|
3579
|
+
}
|
|
3580
|
+
static {
|
|
3581
|
+
this.styles = [
|
|
3582
|
+
unsafeCSS(tailwind_default),
|
|
3583
|
+
axebowTheme,
|
|
3584
|
+
css`
|
|
3585
|
+
:host {
|
|
3586
|
+
display: block;
|
|
3587
|
+
}
|
|
3588
|
+
.dropzone .upload-icon {
|
|
3589
|
+
color: #9ca3af;
|
|
2916
3590
|
}
|
|
2917
3591
|
.dropzone:hover .upload-icon,
|
|
2918
3592
|
.dropzone:active .upload-icon,
|
|
@@ -3206,7 +3880,7 @@ var AxebowRuntimeZipDialog = class AxebowRuntimeZipDialog extends LitElement {
|
|
|
3206
3880
|
class="w-6 h-6 shrink-0 flex items-center justify-center cursor-pointer"
|
|
3207
3881
|
@click=${() => this.onClose?.()}
|
|
3208
3882
|
>
|
|
3209
|
-
<axebow-icon iconName="cancel" iconColor="var(--axebow-gray)" size="
|
|
3883
|
+
<axebow-icon iconName="cancel" iconColor="var(--axebow-gray)" size="xl"></axebow-icon>
|
|
3210
3884
|
</div>
|
|
3211
3885
|
</div>
|
|
3212
3886
|
<p class="w-120.75 h-21.25 leading-[1.0625rem] m-0">
|
|
@@ -3385,7 +4059,7 @@ var AxebowMoreActions = class AxebowMoreActions extends LitElement {
|
|
|
3385
4059
|
?disabled=${this.disabled}
|
|
3386
4060
|
@click=${this._toggle}
|
|
3387
4061
|
>
|
|
3388
|
-
${this.iconName ? html`<axebow-icon iconName=${this.iconName} size="
|
|
4062
|
+
${this.iconName ? html`<axebow-icon iconName=${this.iconName} size="md" iconColor="var(--axebow-tertiary)"></axebow-icon>` : this.open ? this.closeLabel : this.title || this.moreActionsLabel}
|
|
3389
4063
|
</button>
|
|
3390
4064
|
${this.open ? html`
|
|
3391
4065
|
<div
|
|
@@ -3405,7 +4079,7 @@ var AxebowMoreActions = class AxebowMoreActions extends LitElement {
|
|
|
3405
4079
|
@mouseenter=${(e) => e.currentTarget.style.borderColor = `var(--axebow-${opt.type})`}
|
|
3406
4080
|
@mouseleave=${(e) => e.currentTarget.style.borderColor = "transparent"}
|
|
3407
4081
|
>
|
|
3408
|
-
<axebow-icon iconName=${opt.icon} iconColor="var(--axebow-${opt.type})" size="
|
|
4082
|
+
<axebow-icon iconName=${opt.icon} iconColor="var(--axebow-${opt.type})" size="md"></axebow-icon>
|
|
3409
4083
|
<p class="m-0 whitespace-nowrap" style="color:var(--axebow-${opt.type});">${opt.label}</p>
|
|
3410
4084
|
</button>
|
|
3411
4085
|
`) : html`<slot></slot>`}
|
|
@@ -3553,7 +4227,7 @@ var AxebowCardVersionSelector = class AxebowCardVersionSelector extends LitEleme
|
|
|
3553
4227
|
${this.revisions.map((rev) => html`
|
|
3554
4228
|
<sl-option value=${rev.id}>
|
|
3555
4229
|
${this._formatRevision(rev.id)}
|
|
3556
|
-
${rev.id !== this.displayedRevision ? html`<axebow-icon slot="suffix" iconName="update" iconColor="var(--axebow-tertiary)" size="
|
|
4230
|
+
${rev.id !== this.displayedRevision ? html`<axebow-icon slot="suffix" iconName="update" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>` : ""}
|
|
3557
4231
|
</sl-option>
|
|
3558
4232
|
`)}
|
|
3559
4233
|
</sl-select>
|
|
@@ -3583,6 +4257,7 @@ var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
|
|
|
3583
4257
|
static {
|
|
3584
4258
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
3585
4259
|
:host { display: contents; }
|
|
4260
|
+
axebow-tooltip::part(body),
|
|
3586
4261
|
sl-tooltip::part(body) {
|
|
3587
4262
|
background-color: var(--axebow-white);
|
|
3588
4263
|
color: var(--axebow-primary);
|
|
@@ -3604,15 +4279,15 @@ var AxebowRoleTooltip = class AxebowRoleTooltip extends LitElement {
|
|
|
3604
4279
|
render() {
|
|
3605
4280
|
if (!this.heading) return html``;
|
|
3606
4281
|
return html`
|
|
3607
|
-
<
|
|
4282
|
+
<axebow-tooltip placement="right">
|
|
3608
4283
|
<div slot="content">
|
|
3609
4284
|
<strong>${this.heading}</strong>
|
|
3610
4285
|
<ul>
|
|
3611
4286
|
${this.items.map((item) => html`<li>${item}</li>`)}
|
|
3612
4287
|
</ul>
|
|
3613
4288
|
</div>
|
|
3614
|
-
<axebow-icon iconName="info"
|
|
3615
|
-
</
|
|
4289
|
+
<axebow-icon iconName="info" class="cursor-pointer" iconColor=${this.color}></axebow-icon>
|
|
4290
|
+
</axebow-tooltip>
|
|
3616
4291
|
`;
|
|
3617
4292
|
}
|
|
3618
4293
|
};
|
|
@@ -3650,21 +4325,21 @@ var AxebowCardHeader = class AxebowCardHeader extends LitElement {
|
|
|
3650
4325
|
}
|
|
3651
4326
|
_renderBadge() {
|
|
3652
4327
|
if (this.badge === "free-iaas") return html`
|
|
3653
|
-
<
|
|
4328
|
+
<axebow-tooltip>
|
|
3654
4329
|
<div slot="content" style="max-width:300px;">
|
|
3655
4330
|
<strong>${this.freeIaasTitle}</strong>
|
|
3656
4331
|
<p style="margin-top:0.5rem;">${this.freeIaasDesc}</p>
|
|
3657
4332
|
</div>
|
|
3658
4333
|
<div class="flex items-center gap-2 cursor-pointer">
|
|
3659
|
-
<axebow-icon iconName="info" iconColor="var(--axebow-gray)" size="
|
|
4334
|
+
<axebow-icon iconName="info" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
|
|
3660
4335
|
<span class="text-(--axebow-rich-black)">${this.freeIaasLabel}</span>
|
|
3661
4336
|
</div>
|
|
3662
|
-
</
|
|
4337
|
+
</axebow-tooltip>
|
|
3663
4338
|
`;
|
|
3664
4339
|
if (this.badge === "ha") return html`
|
|
3665
|
-
<
|
|
4340
|
+
<axebow-tooltip content=${this.haTitle}>
|
|
3666
4341
|
<sl-badge variant="neutral" pill size="small" class="cursor-pointer">${this.haLabel}</sl-badge>
|
|
3667
|
-
</
|
|
4342
|
+
</axebow-tooltip>
|
|
3668
4343
|
`;
|
|
3669
4344
|
return html``;
|
|
3670
4345
|
}
|
|
@@ -3854,7 +4529,7 @@ var AxebowCardFilterItem = class AxebowCardFilterItem extends LitElement {
|
|
|
3854
4529
|
@click=${this._onClick}
|
|
3855
4530
|
>
|
|
3856
4531
|
<p class="m-0">${this.name}</p>
|
|
3857
|
-
${this.showAttention ? html`<axebow-icon iconName="error" size="
|
|
4532
|
+
${this.showAttention ? html`<axebow-icon iconName="error" size="md" iconColor="var(--axebow-error)"></axebow-icon>` : ""}
|
|
3858
4533
|
</div>
|
|
3859
4534
|
`;
|
|
3860
4535
|
}
|
|
@@ -3906,7 +4581,7 @@ var AxebowCardFilter = class AxebowCardFilter extends LitElement {
|
|
|
3906
4581
|
<span class="text-(--axebow-tertiary)">${this.selected ?? this.emptyLabel}</span>
|
|
3907
4582
|
<div class="flex items-center gap-2">
|
|
3908
4583
|
${this.showAttention ? html`<p class="text-(--axebow-error) m-0 text-xs">${this.attentionLabel}</p>` : ""}
|
|
3909
|
-
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="
|
|
4584
|
+
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
3910
4585
|
</div>
|
|
3911
4586
|
</div>
|
|
3912
4587
|
`}
|
|
@@ -3980,7 +4655,7 @@ var AxebowCardTableHeader = class AxebowCardTableHeader extends LitElement {
|
|
|
3980
4655
|
<span class="text-(--axebow-tertiary)">${this.filterDisplayText || this.allLabel}</span>
|
|
3981
4656
|
<div class="flex items-center gap-2">
|
|
3982
4657
|
${this.showAttention ? html`<p class="text-(--axebow-error) m-0 text-xs">${this.attentionLabel}</p>` : ""}
|
|
3983
|
-
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="
|
|
4658
|
+
<axebow-icon iconName="chevron_right" rotate="90" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
3984
4659
|
</div>
|
|
3985
4660
|
</div>
|
|
3986
4661
|
|
|
@@ -4002,10 +4677,10 @@ var AxebowCardTableHeader = class AxebowCardTableHeader extends LitElement {
|
|
|
4002
4677
|
@click=${() => this._onSelect(inst.name, "instance")}
|
|
4003
4678
|
>
|
|
4004
4679
|
<div class="flex items-center gap-2">
|
|
4005
|
-
<axebow-icon iconName="subdirectory_arrow_right" size="
|
|
4680
|
+
<axebow-icon iconName="subdirectory_arrow_right" size="md"></axebow-icon>
|
|
4006
4681
|
<p class="m-0">${inst.name}</p>
|
|
4007
4682
|
</div>
|
|
4008
|
-
${inst.needsAttention ? html`<axebow-icon iconName="warning" iconColor="var(--axebow-error)" size="
|
|
4683
|
+
${inst.needsAttention ? html`<axebow-icon iconName="warning" iconColor="var(--axebow-error)" size="md"></axebow-icon>` : ""}
|
|
4009
4684
|
</div>
|
|
4010
4685
|
`)}
|
|
4011
4686
|
`)}
|
|
@@ -4064,7 +4739,7 @@ var AxebowCardResourceRow = class AxebowCardResourceRow extends LitElement {
|
|
|
4064
4739
|
return html`
|
|
4065
4740
|
<div class="flex items-center ${cellClass}">
|
|
4066
4741
|
<div class="flex items-center gap-1">
|
|
4067
|
-
<axebow-icon iconName=${stat.icon} size="
|
|
4742
|
+
<axebow-icon iconName=${stat.icon} size="md" rotate=${stat.iconRotation ?? 0}></axebow-icon>
|
|
4068
4743
|
<span class="${textClass}">${stat.title}</span>
|
|
4069
4744
|
</div>
|
|
4070
4745
|
</div>
|
|
@@ -4156,7 +4831,7 @@ var AxebowCardAttentionBanner = class AxebowCardAttentionBanner extends LitEleme
|
|
|
4156
4831
|
${this.isPlainRole ? html`<span class="text-(--axebow-error)">${this.askOwnerLabel}</span>` : html`
|
|
4157
4832
|
<axebow-button variant="text" size="small">
|
|
4158
4833
|
${this.label}
|
|
4159
|
-
<axebow-icon iconName="arrow_forward" iconColor="var(--axebow-error)" size="
|
|
4834
|
+
<axebow-icon iconName="arrow_forward" iconColor="var(--axebow-error)" size="md"></axebow-icon>
|
|
4160
4835
|
</axebow-button>
|
|
4161
4836
|
`}
|
|
4162
4837
|
</div>
|
|
@@ -4202,7 +4877,7 @@ var AxebowCardActionBanner = class AxebowCardActionBanner extends LitElement {
|
|
|
4202
4877
|
${this.isPlainRole ? html`<span class="text-(--axebow-gray)">${this.notAllowedLabel}</span>` : html`
|
|
4203
4878
|
<axebow-button variant="text" size="small">
|
|
4204
4879
|
${this.label}
|
|
4205
|
-
<axebow-icon iconName="arrow_forward" iconColor="var(--axebow-tertiary)" size="
|
|
4880
|
+
<axebow-icon iconName="arrow_forward" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
4206
4881
|
</axebow-button>
|
|
4207
4882
|
`}
|
|
4208
4883
|
</div>
|
|
@@ -4232,6 +4907,7 @@ var AxebowCardStatus = class AxebowCardStatus extends LitElement {
|
|
|
4232
4907
|
static {
|
|
4233
4908
|
this.styles = [unsafeCSS(tailwind_default), css`
|
|
4234
4909
|
:host { display: block; flex: 1; min-width: 0; }
|
|
4910
|
+
axebow-tooltip::part(base),
|
|
4235
4911
|
sl-tooltip::part(base) { max-width: none; white-space: normal; word-break: break-word; }
|
|
4236
4912
|
`];
|
|
4237
4913
|
}
|
|
@@ -4241,9 +4917,9 @@ var AxebowCardStatus = class AxebowCardStatus extends LitElement {
|
|
|
4241
4917
|
<div class="flex items-center gap-1 min-w-0 w-full">
|
|
4242
4918
|
${this.showSpinner ? html`<sl-spinner style="--indicator-color:${this.borderColor};"></sl-spinner>` : ""}
|
|
4243
4919
|
<p class="font-bold m-0 line-clamp-1" style="color:${this.borderColor};" title=${this.statusCode}>${this.statusCode}</p>
|
|
4244
|
-
<
|
|
4245
|
-
<axebow-icon class="cursor-pointer shrink-0" iconColor=${this.borderColor} iconName="info" size="
|
|
4246
|
-
</
|
|
4920
|
+
<axebow-tooltip content=${this.statusMessage}>
|
|
4921
|
+
<axebow-icon class="cursor-pointer shrink-0" iconColor=${this.borderColor} iconName="info" size="md"></axebow-icon>
|
|
4922
|
+
</axebow-tooltip>
|
|
4247
4923
|
</div>
|
|
4248
4924
|
`;
|
|
4249
4925
|
}
|
|
@@ -4661,7 +5337,7 @@ var AxebowCardSpecialLink = class AxebowCardSpecialLink extends LitElement {
|
|
|
4661
5337
|
return html`
|
|
4662
5338
|
<span class="cursor-pointer" style="color:${this.color};" @click=${this._onClick}>
|
|
4663
5339
|
${this.label}
|
|
4664
|
-
<axebow-icon iconName=${this.icon} iconColor=${this.color} size="
|
|
5340
|
+
<axebow-icon iconName=${this.icon} iconColor=${this.color} size="md"></axebow-icon>
|
|
4665
5341
|
</span>
|
|
4666
5342
|
`;
|
|
4667
5343
|
}
|
|
@@ -4777,7 +5453,7 @@ var AxebowAlert = class AxebowAlert extends LitElement {
|
|
|
4777
5453
|
class="theme flex items-start gap-3 p-4 rounded-lg border-l-4 shadow-md transition-all duration-300 bg-white axebow-shadow"
|
|
4778
5454
|
style="border-left-color: ${config.iconColor};"
|
|
4779
5455
|
>
|
|
4780
|
-
<axebow-icon iconName="${config.icon}" iconColor="${config.iconColor}" size="
|
|
5456
|
+
<axebow-icon iconName="${config.icon}" iconColor="${config.iconColor}" size="3xl"></axebow-icon>
|
|
4781
5457
|
<div class="flex-1 min-w-0">
|
|
4782
5458
|
<p class="line-clamp-11 overflow-hidden m-0" .innerHTML=${this.message}></p>
|
|
4783
5459
|
</div>
|
|
@@ -4796,7 +5472,7 @@ var AxebowAlert = class AxebowAlert extends LitElement {
|
|
|
4796
5472
|
aria-label=${this.closeLabel}
|
|
4797
5473
|
class="text-gray-500 hover:text-gray-700 cursor-pointer p-0 border-0 bg-transparent"
|
|
4798
5474
|
>
|
|
4799
|
-
<axebow-icon iconName="close" size="
|
|
5475
|
+
<axebow-icon iconName="close" size="md"></axebow-icon>
|
|
4800
5476
|
</button>
|
|
4801
5477
|
` : ""}
|
|
4802
5478
|
</div>
|
|
@@ -4917,7 +5593,7 @@ var AxebowServicesPanel = class AxebowServicesPanel extends LitElement {
|
|
|
4917
5593
|
class="w-4.25 h-4.5 mt-2.25 pl-px flex items-center justify-center border border-l-0 border-solid border-(--axebow-tertiary) hover:border-(--axebow-gray) transition-colors duration-200 rounded-sm cursor-pointer bg-(--axebow-tertiary)/15"
|
|
4918
5594
|
@click=${this._handleToggle}
|
|
4919
5595
|
>
|
|
4920
|
-
<axebow-icon iconName="close" iconColor="var(--axebow-tertiary)" size="
|
|
5596
|
+
<axebow-icon iconName="close" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
4921
5597
|
</div>
|
|
4922
5598
|
</div>
|
|
4923
5599
|
`;
|
|
@@ -5026,7 +5702,7 @@ var AxebowChannelConfigPanel = class AxebowChannelConfigPanel extends LitElement
|
|
|
5026
5702
|
class="w-4.5 h-4.5 shrink-0 flex items-center justify-center cursor-pointer"
|
|
5027
5703
|
@click=${this._handleDelete}
|
|
5028
5704
|
>
|
|
5029
|
-
<axebow-icon iconName="delete" iconColor="var(--axebow-error)" size="
|
|
5705
|
+
<axebow-icon iconName="delete" iconColor="var(--axebow-error)" size="base"></axebow-icon>
|
|
5030
5706
|
</div>
|
|
5031
5707
|
` : ""}
|
|
5032
5708
|
</div>
|
|
@@ -5225,7 +5901,7 @@ var AxebowHelpBubble = class AxebowHelpBubble extends LitElement {
|
|
|
5225
5901
|
@click=${() => this._openLink(option.url)}
|
|
5226
5902
|
>
|
|
5227
5903
|
<span class="font-medium text-[var(--axebow-gray)] whitespace-nowrap">${option.label}</span>
|
|
5228
|
-
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="
|
|
5904
|
+
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="base"></axebow-icon>
|
|
5229
5905
|
</div>
|
|
5230
5906
|
`)}
|
|
5231
5907
|
</div>
|
|
@@ -5235,7 +5911,7 @@ var AxebowHelpBubble = class AxebowHelpBubble extends LitElement {
|
|
|
5235
5911
|
<div
|
|
5236
5912
|
class="w-12 h-12 rounded-full flex items-center justify-center cursor-pointer shadow-lg transition-colors duration-200 self-end ${this._isOpen ? "bg-[var(--axebow-gray)]" : "bg-[var(--axebow-tertiary)]"}"
|
|
5237
5913
|
>
|
|
5238
|
-
<axebow-icon iconName="contact_support" iconColor="white" size="
|
|
5914
|
+
<axebow-icon iconName="contact_support" iconColor="white" size="xl"></axebow-icon>
|
|
5239
5915
|
</div>
|
|
5240
5916
|
</div>
|
|
5241
5917
|
`;
|
|
@@ -5269,7 +5945,7 @@ var AxebowNumberCard = class AxebowNumberCard extends LitElement {
|
|
|
5269
5945
|
<div
|
|
5270
5946
|
class="w-10.5 h-10.5 shrink-0 flex items-center justify-center bg-(--axebow-base) rounded-lg"
|
|
5271
5947
|
>
|
|
5272
|
-
<axebow-icon iconName=${this.icon} size="
|
|
5948
|
+
<axebow-icon iconName=${this.icon} size="3xl"></axebow-icon>
|
|
5273
5949
|
</div>
|
|
5274
5950
|
<div class="flex flex-col min-w-0">
|
|
5275
5951
|
<h2 class="m-0 text-lg font-bold">${this.number}</h2>
|
|
@@ -5352,11 +6028,11 @@ var AxebowPill = class AxebowPill extends LitElement {
|
|
|
5352
6028
|
${this.image ? html`<img
|
|
5353
6029
|
src="${this.image}"
|
|
5354
6030
|
class="w-12 h-12 transition-[filter] duration-300 ease-in-out group-hover:invert"
|
|
5355
|
-
/>` : html`<axebow-icon iconName="${this.icon}" iconColor="white" size="
|
|
6031
|
+
/>` : html`<axebow-icon iconName="${this.icon}" iconColor="white" size="3xl"></axebow-icon>`}
|
|
5356
6032
|
<p class="text-center flex items-center justify-center px-2 font-medium m-0">${this.label}</p>
|
|
5357
6033
|
<axebow-button variant="text" class="axebow-white-button-text">
|
|
5358
6034
|
${this.buttonText}
|
|
5359
|
-
${this.buttonIcon ? html`<axebow-icon iconName="${this.buttonIcon}" iconColor="white" size="
|
|
6035
|
+
${this.buttonIcon ? html`<axebow-icon iconName="${this.buttonIcon}" iconColor="white" size="md"></axebow-icon>` : ""}
|
|
5360
6036
|
</axebow-button>
|
|
5361
6037
|
</div>
|
|
5362
6038
|
`;
|
|
@@ -5459,7 +6135,7 @@ var AxebowQuickTipButton = class AxebowQuickTipButton extends LitElement {
|
|
|
5459
6135
|
<div class="collapsed-container" style="bottom: ${this.paddingBottom}px;" @click=${() => this.onToggle?.()}>
|
|
5460
6136
|
<button class="collapsed-button w-47.75 h-7 flex items-center justify-center gap-2 cursor-pointer">
|
|
5461
6137
|
<span class="whitespace-nowrap text-sm font-bold">${this.showLabel}</span>
|
|
5462
|
-
<axebow-icon iconName="visibility" size="
|
|
6138
|
+
<axebow-icon iconName="visibility" size="md"></axebow-icon>
|
|
5463
6139
|
</button>
|
|
5464
6140
|
</div>
|
|
5465
6141
|
`;
|
|
@@ -5554,7 +6230,7 @@ var AxebowGettingStartedCard = class AxebowGettingStartedCard extends LitElement
|
|
|
5554
6230
|
${this.contactUrl ? html`
|
|
5555
6231
|
<axebow-button variant="primary" outline @click=${() => window.open(this.contactUrl, "_blank")}>
|
|
5556
6232
|
${this.contactLabel}
|
|
5557
|
-
<axebow-icon iconName="open_in_new" size="
|
|
6233
|
+
<axebow-icon iconName="open_in_new" size="md" slot="suffix"></axebow-icon>
|
|
5558
6234
|
</axebow-button>
|
|
5559
6235
|
` : ""}
|
|
5560
6236
|
<sl-checkbox
|
|
@@ -5644,7 +6320,7 @@ var AxebowMarketplaceCard = class AxebowMarketplaceCard extends LitElement {
|
|
|
5644
6320
|
iconName=${resource.icon}
|
|
5645
6321
|
iconColor="var(--axebow-gray)"
|
|
5646
6322
|
rotate=${resource.iconRotate ?? 0}
|
|
5647
|
-
size="
|
|
6323
|
+
size="md"
|
|
5648
6324
|
></axebow-icon>
|
|
5649
6325
|
<span class="truncate ${resource.exceedsLimit ? "underline decoration-(--axebow-error)" : ""}">
|
|
5650
6326
|
${resource.text}${index < this.resources.length - 1 ? " |" : ""}
|
|
@@ -5654,7 +6330,7 @@ var AxebowMarketplaceCard = class AxebowMarketplaceCard extends LitElement {
|
|
|
5654
6330
|
class="shrink-0"
|
|
5655
6331
|
iconName="dangerous"
|
|
5656
6332
|
iconColor="var(--axebow-error)"
|
|
5657
|
-
size="
|
|
6333
|
+
size="md"
|
|
5658
6334
|
></axebow-icon>` : ""}
|
|
5659
6335
|
</div>
|
|
5660
6336
|
`;
|
|
@@ -5670,7 +6346,7 @@ var AxebowMarketplaceCard = class AxebowMarketplaceCard extends LitElement {
|
|
|
5670
6346
|
class="w-4.25 h-4.5 box-border flex items-center justify-center shrink-0 cursor-pointer border-l border-solid border-(--axebow-light-gray)"
|
|
5671
6347
|
@click=${() => this._versionsOpen = !this._versionsOpen}
|
|
5672
6348
|
>
|
|
5673
|
-
<axebow-icon iconName="keyboard_arrow_down" iconColor="var(--axebow-tertiary)" size="
|
|
6349
|
+
<axebow-icon iconName="keyboard_arrow_down" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
5674
6350
|
</div>
|
|
5675
6351
|
</div>
|
|
5676
6352
|
|
|
@@ -5698,7 +6374,7 @@ var AxebowMarketplaceCard = class AxebowMarketplaceCard extends LitElement {
|
|
|
5698
6374
|
style="width:${this.badgeWidth}; background-color:${this.badgeBgColor};"
|
|
5699
6375
|
>
|
|
5700
6376
|
${this.badgeIcon ? html`<span class="w-2 h-3 flex items-center justify-center overflow-hidden shrink-0">
|
|
5701
|
-
<axebow-icon iconName=${this.badgeIcon} iconColor=${this.badgeIconColor} size="
|
|
6377
|
+
<axebow-icon iconName=${this.badgeIcon} iconColor=${this.badgeIconColor} size="sm"></axebow-icon>
|
|
5702
6378
|
</span>` : ""}
|
|
5703
6379
|
<span class="text-sm font-semibold uppercase tracking-wider" style="color:${this.badgeTextColor};">
|
|
5704
6380
|
${this.badgeLabel}
|
|
@@ -5755,7 +6431,7 @@ var AxebowMarketplaceCard = class AxebowMarketplaceCard extends LitElement {
|
|
|
5755
6431
|
<axebow-icon
|
|
5756
6432
|
slot="prefix"
|
|
5757
6433
|
iconName="sound_sampler"
|
|
5758
|
-
size="
|
|
6434
|
+
size="md"
|
|
5759
6435
|
iconColor="${this._deployHovered ? "var(--axebow-gray)" : "var(--axebow-tertiary)"}"
|
|
5760
6436
|
></axebow-icon>
|
|
5761
6437
|
<span class="text-base">${this.deployLabel}</span>
|
|
@@ -5823,7 +6499,7 @@ var AxebowDeployCard = class AxebowDeployCard extends LitElement {
|
|
|
5823
6499
|
>
|
|
5824
6500
|
<div class="w-8 h-8 flex items-center justify-center bg-(--axebow-base) rounded-md shrink-0">
|
|
5825
6501
|
<span class="w-4.25 h-4.25 flex items-center justify-center overflow-hidden">
|
|
5826
|
-
<axebow-icon iconName=${this.icon} iconColor="var(--axebow-primary)" size="
|
|
6502
|
+
<axebow-icon iconName=${this.icon} iconColor="var(--axebow-primary)" size="md"></axebow-icon>
|
|
5827
6503
|
</span>
|
|
5828
6504
|
</div>
|
|
5829
6505
|
<p class="text-md font-semibold text-(--axebow-primary) m-0 truncate">${this.title}</p>
|
|
@@ -5839,7 +6515,7 @@ var AxebowDeployCard = class AxebowDeployCard extends LitElement {
|
|
|
5839
6515
|
<axebow-icon
|
|
5840
6516
|
slot="prefix"
|
|
5841
6517
|
iconName="play_circle"
|
|
5842
|
-
size="
|
|
6518
|
+
size="xl"
|
|
5843
6519
|
iconColor="${this._deployHovered ? "var(--axebow-gray)" : "var(--axebow-tertiary)"}"
|
|
5844
6520
|
></axebow-icon>
|
|
5845
6521
|
${this.deployLabel}
|
|
@@ -5885,7 +6561,7 @@ var AxebowResourceCard = class AxebowResourceCard extends LitElement {
|
|
|
5885
6561
|
<span class="text-lg font-semibold text-(--axebow-primary) truncate">${this.tenantName}</span>
|
|
5886
6562
|
<div class="w-6 h-6 flex items-center justify-center shrink-0">
|
|
5887
6563
|
<span class="w-4.5 h-4.5 flex items-center justify-center overflow-hidden">
|
|
5888
|
-
<axebow-icon iconName="cloud_circle" iconColor="var(--axebow-primary)" size="
|
|
6564
|
+
<axebow-icon iconName="cloud_circle" iconColor="var(--axebow-primary)" size="md"></axebow-icon>
|
|
5889
6565
|
</span>
|
|
5890
6566
|
</div>
|
|
5891
6567
|
</div>
|
|
@@ -5896,7 +6572,7 @@ var AxebowResourceCard = class AxebowResourceCard extends LitElement {
|
|
|
5896
6572
|
<div class="flex-1 flex items-center justify-between text-[0.9375rem]">
|
|
5897
6573
|
<div class="w-30 h-5 flex items-center gap-1 min-w-0 shrink-0">
|
|
5898
6574
|
<div class="w-5 h-5 flex items-center justify-center shrink-0">
|
|
5899
|
-
<axebow-icon iconName="${row.icon}" iconColor="var(--axebow-primary)" size="
|
|
6575
|
+
<axebow-icon iconName="${row.icon}" iconColor="var(--axebow-primary)" size="md"></axebow-icon>
|
|
5900
6576
|
</div>
|
|
5901
6577
|
<span class="font-bold text-(--axebow-primary) truncate">${row.label}</span>
|
|
5902
6578
|
</div>
|
|
@@ -5914,7 +6590,7 @@ var AxebowResourceCard = class AxebowResourceCard extends LitElement {
|
|
|
5914
6590
|
@click=${() => row.onSeeInNewTab?.()}
|
|
5915
6591
|
>
|
|
5916
6592
|
${this.seeInNewTabLabel}
|
|
5917
|
-
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="
|
|
6593
|
+
<axebow-icon iconName="open_in_new" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
|
|
5918
6594
|
</button>
|
|
5919
6595
|
|
|
5920
6596
|
<button
|
|
@@ -6147,10 +6823,10 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
6147
6823
|
const iconEl = icon.spinner ? html`<sl-spinner style="font-size: 0.85rem; --indicator-color: var(--axebow-tertiary);"></sl-spinner>` : html`<axebow-icon
|
|
6148
6824
|
iconName=${icon.iconName}
|
|
6149
6825
|
iconColor=${icon.iconColor}
|
|
6150
|
-
size="
|
|
6826
|
+
size="md"
|
|
6151
6827
|
class="cursor-pointer shrink-0"
|
|
6152
6828
|
></axebow-icon>`;
|
|
6153
|
-
return icon.tooltip ? html`<
|
|
6829
|
+
return icon.tooltip ? html`<axebow-tooltip content=${icon.tooltip}>${iconEl}</axebow-tooltip>` : iconEl;
|
|
6154
6830
|
}
|
|
6155
6831
|
_renderAccountRow(row, index) {
|
|
6156
6832
|
const isExpanded = this._expanded.has(row.id);
|
|
@@ -6164,7 +6840,7 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
6164
6840
|
<axebow-icon
|
|
6165
6841
|
iconName=${isExpanded ? "expand_more" : "chevron_right"}
|
|
6166
6842
|
iconColor="var(--axebow-gray)"
|
|
6167
|
-
size="
|
|
6843
|
+
size="md"
|
|
6168
6844
|
class="shrink-0"
|
|
6169
6845
|
></axebow-icon>
|
|
6170
6846
|
<img src=${row.logoUrl} class="w-6 h-6 object-contain shrink-0" />
|
|
@@ -6215,7 +6891,7 @@ var AxebowTenantResourceTable = class AxebowTenantResourceTable extends LitEleme
|
|
|
6215
6891
|
<axebow-icon
|
|
6216
6892
|
iconName="subdirectory_arrow_right"
|
|
6217
6893
|
iconColor="var(--axebow-gray)"
|
|
6218
|
-
size="
|
|
6894
|
+
size="md"
|
|
6219
6895
|
class="shrink-0"
|
|
6220
6896
|
></axebow-icon>
|
|
6221
6897
|
<span class="text-base truncate">${env.name}</span>
|
|
@@ -6415,13 +7091,13 @@ var AxebowTenantCard = class AxebowTenantCard extends LitElement {
|
|
|
6415
7091
|
<div class="flex items-center gap-5 text-(--axebow-gray)">
|
|
6416
7092
|
${this.resourceStats.map((stat) => html`
|
|
6417
7093
|
<span class="flex items-center gap-1 text-base whitespace-nowrap">
|
|
6418
|
-
<axebow-icon iconName=${stat.icon} iconColor="var(--axebow-gray)" size="
|
|
7094
|
+
<axebow-icon iconName=${stat.icon} iconColor="var(--axebow-gray)" size="md"></axebow-icon>
|
|
6419
7095
|
<b>${stat.label}</b> ${stat.value}
|
|
6420
7096
|
</span>
|
|
6421
7097
|
`)}
|
|
6422
7098
|
</div>
|
|
6423
7099
|
${this.showInvitedNotice ? html`<span class="text-base text-black">${this.invitedNoticeText}</span>` : this.showNoAccountsWarning ? html`<span class="flex items-center gap-1 text-base text-black">
|
|
6424
|
-
<axebow-icon iconName="warning" iconColor="var(--axebow-warning)" size="
|
|
7100
|
+
<axebow-icon iconName="warning" iconColor="var(--axebow-warning)" size="md"></axebow-icon>
|
|
6425
7101
|
${this.noAccountsWarningText}
|
|
6426
7102
|
</span>` : ""}
|
|
6427
7103
|
</div>
|
|
@@ -6468,217 +7144,6 @@ __decorate([property({ type: Boolean })], AxebowTenantCard.prototype, "showActio
|
|
|
6468
7144
|
__decorate([property({ type: Boolean })], AxebowTenantCard.prototype, "showMoreActionsColumn", void 0);
|
|
6469
7145
|
AxebowTenantCard = __decorate([customElement("axebow-tenant-card")], AxebowTenantCard);
|
|
6470
7146
|
//#endregion
|
|
6471
|
-
//#region src/components/axebow-carousel-selector-tenant/parts/axebow-carousel-selector-item.ts
|
|
6472
|
-
var AxebowCarouselSelectorItem = class AxebowCarouselSelectorItem extends LitElement {
|
|
6473
|
-
constructor(..._args) {
|
|
6474
|
-
super(..._args);
|
|
6475
|
-
this.variant = "account";
|
|
6476
|
-
this.itemId = "";
|
|
6477
|
-
this.selected = false;
|
|
6478
|
-
this.disabled = false;
|
|
6479
|
-
this.planLabel = "";
|
|
6480
|
-
this.name = "";
|
|
6481
|
-
this.tenantName = "";
|
|
6482
|
-
this.accountName = "";
|
|
6483
|
-
this.logoSrc = null;
|
|
6484
|
-
this.logoAlt = "";
|
|
6485
|
-
}
|
|
6486
|
-
static {
|
|
6487
|
-
this.styles = [unsafeCSS(tailwind_default), css`
|
|
6488
|
-
:host {
|
|
6489
|
-
display: block;
|
|
6490
|
-
width: 100%;
|
|
6491
|
-
height: 4.5rem;
|
|
6492
|
-
}
|
|
6493
|
-
.item-checkbox::part(base) {
|
|
6494
|
-
padding: 0;
|
|
6495
|
-
}
|
|
6496
|
-
.item-checkbox::part(control) {
|
|
6497
|
-
width: 1.125rem;
|
|
6498
|
-
height: 1.125rem;
|
|
6499
|
-
border-radius: 50%;
|
|
6500
|
-
}
|
|
6501
|
-
.item-checkbox::part(control--checked) {
|
|
6502
|
-
background-color: var(--axebow-primary);
|
|
6503
|
-
border-color: var(--axebow-primary);
|
|
6504
|
-
}
|
|
6505
|
-
`];
|
|
6506
|
-
}
|
|
6507
|
-
_handleChange(e) {
|
|
6508
|
-
const checkbox = e.target;
|
|
6509
|
-
if (this.disabled) return;
|
|
6510
|
-
if (this.selected && !checkbox.checked) {
|
|
6511
|
-
checkbox.checked = true;
|
|
6512
|
-
return;
|
|
6513
|
-
}
|
|
6514
|
-
this.dispatchEvent(new CustomEvent("item-select", {
|
|
6515
|
-
detail: { id: this.itemId },
|
|
6516
|
-
bubbles: true,
|
|
6517
|
-
composed: true
|
|
6518
|
-
}));
|
|
6519
|
-
}
|
|
6520
|
-
_renderCheck() {
|
|
6521
|
-
return html`
|
|
6522
|
-
<div class="absolute ${this.variant === "environment" ? "top-3 right-1.5" : "top-3 right-3"} w-4.5 h-4.5 shrink-0">
|
|
6523
|
-
<sl-checkbox
|
|
6524
|
-
class="item-checkbox"
|
|
6525
|
-
.checked=${this.selected}
|
|
6526
|
-
?disabled=${this.disabled}
|
|
6527
|
-
@sl-change=${this._handleChange}
|
|
6528
|
-
></sl-checkbox>
|
|
6529
|
-
</div>
|
|
6530
|
-
`;
|
|
6531
|
-
}
|
|
6532
|
-
_renderBadge() {
|
|
6533
|
-
if (!this.planLabel) return "";
|
|
6534
|
-
return html`
|
|
6535
|
-
<div class="absolute bottom-0 left-0 right-0 flex justify-center pointer-events-none">
|
|
6536
|
-
<span
|
|
6537
|
-
class="inline-flex items-center justify-center px-2 py-0.5 rounded-t-md bg-(--axebow-base) text-(--axebow-secondary) text-sm font-semibold truncate max-w-full"
|
|
6538
|
-
>
|
|
6539
|
-
${this.planLabel}
|
|
6540
|
-
</span>
|
|
6541
|
-
</div>
|
|
6542
|
-
`;
|
|
6543
|
-
}
|
|
6544
|
-
_renderAccount() {
|
|
6545
|
-
return html`
|
|
6546
|
-
<div class="flex flex-col items-start w-full max-w-51.5 h-9.5 justify-center">
|
|
6547
|
-
<p class="leading-tight text-md font-semibold text-(--axebow-primary) truncate w-full m-0" title=${this.name}>
|
|
6548
|
-
${this.name}
|
|
6549
|
-
</p>
|
|
6550
|
-
</div>
|
|
6551
|
-
`;
|
|
6552
|
-
}
|
|
6553
|
-
_renderEnvironment() {
|
|
6554
|
-
return html`
|
|
6555
|
-
<div class="flex flex-row items-start gap-2 w-full">
|
|
6556
|
-
${this.logoSrc ? html`<img src=${this.logoSrc} alt=${this.logoAlt} class="w-12.5 h-12.5 shrink-0 object-contain" />` : html`<axebow-icon iconName="cloud" size="large" class="w-12.5 h-12.5 shrink-0"></axebow-icon>`}
|
|
6557
|
-
<div class="flex flex-col items-start flex-1 min-w-0">
|
|
6558
|
-
<div class="w-36 overflow-hidden">
|
|
6559
|
-
<p class="text-sm font-semibold text-(--axebow-primary) truncate m-0" title=${this.tenantName}>
|
|
6560
|
-
${this.tenantName}
|
|
6561
|
-
</p>
|
|
6562
|
-
</div>
|
|
6563
|
-
<div class="w-full overflow-hidden">
|
|
6564
|
-
<p
|
|
6565
|
-
class="leading-[1.125rem] text-md font-semibold text-(--axebow-primary) truncate m-0"
|
|
6566
|
-
title=${this.accountName}
|
|
6567
|
-
>
|
|
6568
|
-
${this.accountName}
|
|
6569
|
-
</p>
|
|
6570
|
-
</div>
|
|
6571
|
-
</div>
|
|
6572
|
-
</div>
|
|
6573
|
-
`;
|
|
6574
|
-
}
|
|
6575
|
-
render() {
|
|
6576
|
-
return html`
|
|
6577
|
-
<div
|
|
6578
|
-
class="relative w-full h-full box-border rounded-md border border-solid overflow-hidden transition-colors ${this.variant === "environment" ? "pt-3 px-1.5 pb-0" : "pt-3 px-3 pb-0"} ${this.selected ? "border-(--axebow-primary) bg-(--axebow-white)" : "border-(--axebow-light-gray) bg-(--axebow-base)"} ${this.disabled ? "opacity-60 pointer-events-none" : ""}"
|
|
6579
|
-
>
|
|
6580
|
-
${this.variant === "environment" ? this._renderEnvironment() : this._renderAccount()}
|
|
6581
|
-
${this._renderCheck()}
|
|
6582
|
-
${this._renderBadge()}
|
|
6583
|
-
</div>
|
|
6584
|
-
`;
|
|
6585
|
-
}
|
|
6586
|
-
};
|
|
6587
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "variant", void 0);
|
|
6588
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "itemId", void 0);
|
|
6589
|
-
__decorate([property({ type: Boolean })], AxebowCarouselSelectorItem.prototype, "selected", void 0);
|
|
6590
|
-
__decorate([property({ type: Boolean })], AxebowCarouselSelectorItem.prototype, "disabled", void 0);
|
|
6591
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "planLabel", void 0);
|
|
6592
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "name", void 0);
|
|
6593
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "tenantName", void 0);
|
|
6594
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "accountName", void 0);
|
|
6595
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "logoSrc", void 0);
|
|
6596
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorItem.prototype, "logoAlt", void 0);
|
|
6597
|
-
AxebowCarouselSelectorItem = __decorate([customElement("axebow-carousel-selector-item")], AxebowCarouselSelectorItem);
|
|
6598
|
-
//#endregion
|
|
6599
|
-
//#region src/components/axebow-carousel-selector-tenant/axebow-carousel-selector-tenant.ts
|
|
6600
|
-
var ITEM_GAP_PX = 48;
|
|
6601
|
-
var REFERENCE_WIDTH_PX = 777;
|
|
6602
|
-
function slidesPerPageFor(containerWidthPx) {
|
|
6603
|
-
return (containerWidthPx + ITEM_GAP_PX) / 275;
|
|
6604
|
-
}
|
|
6605
|
-
var AxebowCarouselSelectorTenant = class AxebowCarouselSelectorTenant extends LitElement {
|
|
6606
|
-
constructor(..._args) {
|
|
6607
|
-
super(..._args);
|
|
6608
|
-
this.variant = "account";
|
|
6609
|
-
this.items = [];
|
|
6610
|
-
this._slidesPerPage = slidesPerPageFor(REFERENCE_WIDTH_PX);
|
|
6611
|
-
}
|
|
6612
|
-
static {
|
|
6613
|
-
this.styles = [unsafeCSS(tailwind_default), css`
|
|
6614
|
-
:host {
|
|
6615
|
-
display: block;
|
|
6616
|
-
width: 100%;
|
|
6617
|
-
}
|
|
6618
|
-
sl-carousel {
|
|
6619
|
-
display: block;
|
|
6620
|
-
width: 100%;
|
|
6621
|
-
--slide-gap: ${ITEM_GAP_PX / 16}rem;
|
|
6622
|
-
}
|
|
6623
|
-
sl-carousel::part(scroll-container) {
|
|
6624
|
-
height: 4.5rem;
|
|
6625
|
-
}
|
|
6626
|
-
sl-carousel-item {
|
|
6627
|
-
height: 100%;
|
|
6628
|
-
}
|
|
6629
|
-
`];
|
|
6630
|
-
}
|
|
6631
|
-
connectedCallback() {
|
|
6632
|
-
super.connectedCallback();
|
|
6633
|
-
this._resizeObserver = new ResizeObserver((entries) => {
|
|
6634
|
-
const width = entries[0]?.contentRect.width;
|
|
6635
|
-
if (width) this._slidesPerPage = slidesPerPageFor(width);
|
|
6636
|
-
});
|
|
6637
|
-
}
|
|
6638
|
-
disconnectedCallback() {
|
|
6639
|
-
super.disconnectedCallback();
|
|
6640
|
-
this._resizeObserver?.disconnect();
|
|
6641
|
-
}
|
|
6642
|
-
firstUpdated() {
|
|
6643
|
-
if (this._carouselEl) this._resizeObserver?.observe(this._carouselEl);
|
|
6644
|
-
}
|
|
6645
|
-
_onItemSelect(e) {
|
|
6646
|
-
this.dispatchEvent(new CustomEvent("item-select", {
|
|
6647
|
-
detail: e.detail,
|
|
6648
|
-
bubbles: true,
|
|
6649
|
-
composed: true
|
|
6650
|
-
}));
|
|
6651
|
-
}
|
|
6652
|
-
render() {
|
|
6653
|
-
return html`
|
|
6654
|
-
<sl-carousel navigation slides-per-page="${this._slidesPerPage}">
|
|
6655
|
-
${this.items.length === 0 ? html`<sl-carousel-item><slot name="empty"></slot></sl-carousel-item>` : this.items.map((item) => html`
|
|
6656
|
-
<sl-carousel-item>
|
|
6657
|
-
<axebow-carousel-selector-item
|
|
6658
|
-
.variant=${this.variant}
|
|
6659
|
-
.itemId=${item.id}
|
|
6660
|
-
.selected=${item.selected}
|
|
6661
|
-
?disabled=${item.disabled}
|
|
6662
|
-
.planLabel=${item.planLabel}
|
|
6663
|
-
.name=${item.name ?? ""}
|
|
6664
|
-
.tenantName=${item.tenantName ?? ""}
|
|
6665
|
-
.accountName=${item.accountName ?? ""}
|
|
6666
|
-
.logoSrc=${item.logoSrc ?? null}
|
|
6667
|
-
.logoAlt=${item.logoAlt ?? ""}
|
|
6668
|
-
@item-select=${this._onItemSelect}
|
|
6669
|
-
></axebow-carousel-selector-item>
|
|
6670
|
-
</sl-carousel-item>
|
|
6671
|
-
`)}
|
|
6672
|
-
</sl-carousel>
|
|
6673
|
-
`;
|
|
6674
|
-
}
|
|
6675
|
-
};
|
|
6676
|
-
__decorate([property({ type: String })], AxebowCarouselSelectorTenant.prototype, "variant", void 0);
|
|
6677
|
-
__decorate([property({ type: Array })], AxebowCarouselSelectorTenant.prototype, "items", void 0);
|
|
6678
|
-
__decorate([state()], AxebowCarouselSelectorTenant.prototype, "_slidesPerPage", void 0);
|
|
6679
|
-
__decorate([query("sl-carousel")], AxebowCarouselSelectorTenant.prototype, "_carouselEl", void 0);
|
|
6680
|
-
AxebowCarouselSelectorTenant = __decorate([customElement("axebow-carousel-selector-tenant")], AxebowCarouselSelectorTenant);
|
|
6681
|
-
//#endregion
|
|
6682
7147
|
//#region src/components/axebow-expandable-header/axebow-expandable-header.ts
|
|
6683
7148
|
var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
|
|
6684
7149
|
constructor(..._args) {
|
|
@@ -6709,9 +7174,9 @@ var AxebowExpandableHeader = class AxebowExpandableHeader extends LitElement {
|
|
|
6709
7174
|
<axebow-switch .checked=${this.expanded} .onChange=${(checked) => this.onToggle?.(checked)}>
|
|
6710
7175
|
</axebow-switch>
|
|
6711
7176
|
<span class="text-sm text-(--axebow-gray) italic">${this.stateLabel}</span>
|
|
6712
|
-
<
|
|
6713
|
-
<axebow-icon iconName="help" iconColor="var(--axebow-primary)" size="
|
|
6714
|
-
</
|
|
7177
|
+
<axebow-tooltip content="${this.tooltipContent}">
|
|
7178
|
+
<axebow-icon iconName="help" iconColor="var(--axebow-primary)" size="md" filled></axebow-icon>
|
|
7179
|
+
</axebow-tooltip>
|
|
6715
7180
|
</div>
|
|
6716
7181
|
<div class="${this.expanded ? "block pb-4" : "hidden"}">
|
|
6717
7182
|
<slot></slot>
|
|
@@ -6740,8 +7205,6 @@ var AxebowActionsFooter = class AxebowActionsFooter extends LitElement {
|
|
|
6740
7205
|
this.isActionDisabled = false;
|
|
6741
7206
|
this.actionVariant = "primary";
|
|
6742
7207
|
this.actionClass = "";
|
|
6743
|
-
this.actionFixedWidth = "8.5rem";
|
|
6744
|
-
this.actionFixedHeight = "2.5rem";
|
|
6745
7208
|
this.secondaryActionLabel = "";
|
|
6746
7209
|
this.onSecondaryAction = () => {};
|
|
6747
7210
|
this.isSecondaryActionDisabled = false;
|
|
@@ -6793,8 +7256,6 @@ var AxebowActionsFooter = class AxebowActionsFooter extends LitElement {
|
|
|
6793
7256
|
variant="${this.secondaryActionVariant}"
|
|
6794
7257
|
?outline=${this.secondaryActionOutline}
|
|
6795
7258
|
size="large"
|
|
6796
|
-
.fixedWidth=${this.secondaryActionFixedWidth}
|
|
6797
|
-
.fixedHeight=${this.secondaryActionFixedHeight}
|
|
6798
7259
|
.disabled=${this.isSecondaryActionDisabled}
|
|
6799
7260
|
@click=${this.onSecondaryAction}
|
|
6800
7261
|
>
|
|
@@ -6805,8 +7266,8 @@ var AxebowActionsFooter = class AxebowActionsFooter extends LitElement {
|
|
|
6805
7266
|
class="${this.actionClass}"
|
|
6806
7267
|
variant="${this.actionVariant}"
|
|
6807
7268
|
size="large"
|
|
6808
|
-
|
|
6809
|
-
|
|
7269
|
+
fixedWidth="8.5rem"
|
|
7270
|
+
fixedHeight="2.5rem"
|
|
6810
7271
|
.disabled=${this.isActionDisabled}
|
|
6811
7272
|
@click=${this.onAction}
|
|
6812
7273
|
>
|
|
@@ -6827,15 +7288,11 @@ __decorate([property({ attribute: false })], AxebowActionsFooter.prototype, "onA
|
|
|
6827
7288
|
__decorate([property({ type: Boolean })], AxebowActionsFooter.prototype, "isActionDisabled", void 0);
|
|
6828
7289
|
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "actionVariant", void 0);
|
|
6829
7290
|
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "actionClass", void 0);
|
|
6830
|
-
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "actionFixedWidth", void 0);
|
|
6831
|
-
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "actionFixedHeight", void 0);
|
|
6832
7291
|
__decorate([property({ type: Object })], AxebowActionsFooter.prototype, "secondaryActionLabel", void 0);
|
|
6833
7292
|
__decorate([property({ attribute: false })], AxebowActionsFooter.prototype, "onSecondaryAction", void 0);
|
|
6834
7293
|
__decorate([property({ type: Boolean })], AxebowActionsFooter.prototype, "isSecondaryActionDisabled", void 0);
|
|
6835
7294
|
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "secondaryActionVariant", void 0);
|
|
6836
7295
|
__decorate([property({ type: Boolean })], AxebowActionsFooter.prototype, "secondaryActionOutline", void 0);
|
|
6837
|
-
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "secondaryActionFixedWidth", void 0);
|
|
6838
|
-
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "secondaryActionFixedHeight", void 0);
|
|
6839
7296
|
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "text", void 0);
|
|
6840
7297
|
__decorate([property({ type: String })], AxebowActionsFooter.prototype, "maxWidth", void 0);
|
|
6841
7298
|
__decorate([property({ type: Boolean })], AxebowActionsFooter.prototype, "isOverlappingContent", void 0);
|
|
@@ -6882,10 +7339,8 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
6882
7339
|
constructor(..._args) {
|
|
6883
7340
|
super(..._args);
|
|
6884
7341
|
this.disabled = false;
|
|
6885
|
-
this.bordered = false;
|
|
6886
7342
|
this._activeTab = 0;
|
|
6887
7343
|
this._tabCount = 0;
|
|
6888
|
-
this._tabDisabled = [];
|
|
6889
7344
|
this._observer = null;
|
|
6890
7345
|
}
|
|
6891
7346
|
static {
|
|
@@ -6896,10 +7351,10 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
6896
7351
|
button {
|
|
6897
7352
|
font-family: inherit;
|
|
6898
7353
|
}
|
|
6899
|
-
button.tab-inactive
|
|
7354
|
+
button.tab-inactive {
|
|
6900
7355
|
position: relative;
|
|
6901
7356
|
}
|
|
6902
|
-
button.tab-inactive:
|
|
7357
|
+
button.tab-inactive:hover::after {
|
|
6903
7358
|
content: '';
|
|
6904
7359
|
position: absolute;
|
|
6905
7360
|
bottom: 0;
|
|
@@ -6919,12 +7374,7 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
6919
7374
|
connectedCallback() {
|
|
6920
7375
|
super.connectedCallback();
|
|
6921
7376
|
this._observer = new MutationObserver(() => this._updateTabCount());
|
|
6922
|
-
this._observer.observe(this, {
|
|
6923
|
-
childList: true,
|
|
6924
|
-
attributes: true,
|
|
6925
|
-
attributeFilter: ["disabled"],
|
|
6926
|
-
subtree: true
|
|
6927
|
-
});
|
|
7377
|
+
this._observer.observe(this, { childList: true });
|
|
6928
7378
|
this._updateTabCount();
|
|
6929
7379
|
}
|
|
6930
7380
|
disconnectedCallback() {
|
|
@@ -6944,12 +7394,9 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
6944
7394
|
if (this._activeTab >= count) this._activeTab = 0;
|
|
6945
7395
|
this._tabCount = count;
|
|
6946
7396
|
}
|
|
6947
|
-
this._tabDisabled = Array.from({ length: this._tabCount }, (_, i) => {
|
|
6948
|
-
return this.querySelector(`[slot="tab-label-${i}"]`)?.hasAttribute("disabled") ?? false;
|
|
6949
|
-
});
|
|
6950
7397
|
}
|
|
6951
7398
|
_selectTab(index) {
|
|
6952
|
-
if (this.disabled
|
|
7399
|
+
if (this.disabled) return;
|
|
6953
7400
|
this._activeTab = index;
|
|
6954
7401
|
this.dispatchEvent(new CustomEvent("tab-change", {
|
|
6955
7402
|
detail: { index },
|
|
@@ -6959,36 +7406,28 @@ var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
|
6959
7406
|
}
|
|
6960
7407
|
render() {
|
|
6961
7408
|
const tabs = Array.from({ length: this._tabCount }, (_, i) => i);
|
|
6962
|
-
const isFirstActive = this._activeTab === 0;
|
|
6963
|
-
const isLastActive = this._activeTab === this._tabCount - 1;
|
|
6964
7409
|
return html`
|
|
6965
7410
|
<div class="w-full max-w-194.25 rounded-xl box-border">
|
|
6966
7411
|
<div class="w-full h-8 flex bg-(--axebow-base) gap-1 rounded-t-xl box-border">
|
|
6967
|
-
${tabs.map((i) =>
|
|
6968
|
-
const active = this._activeTab === i;
|
|
6969
|
-
const isDisabled = this._tabDisabled[i];
|
|
6970
|
-
return html`
|
|
7412
|
+
${tabs.map((i) => html`
|
|
6971
7413
|
<button
|
|
6972
|
-
class="flex-1 h-8 flex items-center justify-center gap-2 transition-colors duration-200 font-medium
|
|
7414
|
+
class="flex-1 h-8 flex items-center justify-center gap-2 border-none cursor-pointer transition-colors duration-200 font-medium
|
|
6973
7415
|
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
6974
|
-
${
|
|
6975
|
-
${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-lg tab-inactive border-none"}"
|
|
6976
|
-
?disabled=${isDisabled}
|
|
7416
|
+
${this._activeTab === i ? "bg-white text-(--axebow-primary) rounded-t-lg tab-active" : "bg-transparent text-(--axebow-secondary) rounded-lg tab-inactive"}"
|
|
6977
7417
|
@click=${() => this._selectTab(i)}
|
|
6978
7418
|
>
|
|
6979
7419
|
<axebow-icon
|
|
6980
|
-
iconName="${
|
|
7420
|
+
iconName="${this._activeTab === i ? "radio_button_checked" : "radio_button_unchecked"}"
|
|
6981
7421
|
iconColor="var(--axebow-tertiary)"
|
|
6982
|
-
size="
|
|
7422
|
+
size="base"
|
|
6983
7423
|
></axebow-icon>
|
|
6984
7424
|
<slot name="tab-label-${i}"></slot>
|
|
6985
7425
|
</button>
|
|
6986
|
-
|
|
6987
|
-
})}
|
|
7426
|
+
`)}
|
|
6988
7427
|
</div>
|
|
6989
7428
|
|
|
6990
7429
|
<div
|
|
6991
|
-
class="w-full min-h-35 p-4 bg-white rounded-b-xl
|
|
7430
|
+
class="w-full min-h-35 p-4 bg-white rounded-b-xl rounded-tr-xl box-border ${this._activeTab !== 0 ? "rounded-tl-xl" : ""}"
|
|
6992
7431
|
>
|
|
6993
7432
|
${tabs.map((i) => html`
|
|
6994
7433
|
<div class="${this._activeTab === i ? "block" : "hidden"}">
|
|
@@ -7005,117 +7444,197 @@ __decorate([property({
|
|
|
7005
7444
|
attribute: false
|
|
7006
7445
|
})], AxebowTabSelector.prototype, "disabled", void 0);
|
|
7007
7446
|
__decorate([property({ type: Number })], AxebowTabSelector.prototype, "activeTab", void 0);
|
|
7008
|
-
__decorate([property({ type: Boolean })], AxebowTabSelector.prototype, "bordered", void 0);
|
|
7009
7447
|
__decorate([state()], AxebowTabSelector.prototype, "_activeTab", void 0);
|
|
7010
7448
|
__decorate([state()], AxebowTabSelector.prototype, "_tabCount", void 0);
|
|
7011
|
-
__decorate([state()], AxebowTabSelector.prototype, "_tabDisabled", void 0);
|
|
7012
7449
|
AxebowTabSelector = __decorate([customElement("axebow-tab-selector")], AxebowTabSelector);
|
|
7013
7450
|
//#endregion
|
|
7014
|
-
//#region src/components/axebow-
|
|
7015
|
-
var
|
|
7451
|
+
//#region src/components/axebow-selector-slider/axebow-selector-slider.ts
|
|
7452
|
+
var AxebowSelectorSlider = class AxebowSelectorSlider extends LitElement {
|
|
7016
7453
|
constructor(..._args) {
|
|
7017
7454
|
super(..._args);
|
|
7018
|
-
this.
|
|
7019
|
-
this.
|
|
7020
|
-
this.
|
|
7021
|
-
this.
|
|
7022
|
-
this.
|
|
7023
|
-
this.required = false;
|
|
7455
|
+
this.quantity = 0;
|
|
7456
|
+
this.minTag = 0;
|
|
7457
|
+
this.mediumTag = "Y";
|
|
7458
|
+
this.maxTag = "X";
|
|
7459
|
+
this.step = 1;
|
|
7024
7460
|
this.disabled = false;
|
|
7025
|
-
this.
|
|
7461
|
+
this._isDragging = false;
|
|
7026
7462
|
}
|
|
7027
7463
|
static {
|
|
7028
|
-
this.styles = [
|
|
7464
|
+
this.styles = [
|
|
7465
|
+
unsafeCSS(tailwind_default),
|
|
7466
|
+
axebowTheme,
|
|
7467
|
+
css`
|
|
7468
|
+
:host {
|
|
7469
|
+
display: block;
|
|
7470
|
+
width: 100%;
|
|
7471
|
+
}
|
|
7472
|
+
`
|
|
7473
|
+
];
|
|
7029
7474
|
}
|
|
7030
|
-
|
|
7031
|
-
return
|
|
7032
|
-
|
|
7033
|
-
|
|
7034
|
-
|
|
7035
|
-
|
|
7036
|
-
|
|
7037
|
-
|
|
7038
|
-
|
|
7039
|
-
|
|
7040
|
-
|
|
7041
|
-
|
|
7042
|
-
|
|
7043
|
-
|
|
7044
|
-
|
|
7045
|
-
|
|
7046
|
-
|
|
7047
|
-
|
|
7048
|
-
|
|
7049
|
-
|
|
7050
|
-
|
|
7051
|
-
|
|
7475
|
+
get value() {
|
|
7476
|
+
return this.quantity;
|
|
7477
|
+
}
|
|
7478
|
+
set value(val) {
|
|
7479
|
+
this.quantity = val;
|
|
7480
|
+
}
|
|
7481
|
+
get _minVal() {
|
|
7482
|
+
if (typeof this.min === "number") return this.min;
|
|
7483
|
+
const n = Number(this.minTag);
|
|
7484
|
+
return isNaN(n) ? 0 : n;
|
|
7485
|
+
}
|
|
7486
|
+
get _maxVal() {
|
|
7487
|
+
if (typeof this.max === "number") return this.max;
|
|
7488
|
+
const n = Number(this.maxTag);
|
|
7489
|
+
return isNaN(n) ? 100 : n;
|
|
7490
|
+
}
|
|
7491
|
+
get _numericQuantity() {
|
|
7492
|
+
if (typeof this.quantity === "string") {
|
|
7493
|
+
const str = this.quantity.toLowerCase();
|
|
7494
|
+
if (str === "min") return this._minVal;
|
|
7495
|
+
if (str === "max") return this._maxVal;
|
|
7496
|
+
if (str === "middle") return Math.round((this._minVal + this._maxVal) / 2);
|
|
7497
|
+
const parsed = Number(this.quantity);
|
|
7498
|
+
if (!isNaN(parsed)) return parsed;
|
|
7499
|
+
}
|
|
7500
|
+
return typeof this.quantity === "number" ? this.quantity : this._minVal;
|
|
7501
|
+
}
|
|
7502
|
+
get _percentage() {
|
|
7503
|
+
const min = this._minVal;
|
|
7504
|
+
const max = this._maxVal;
|
|
7505
|
+
if (max <= min) return 0;
|
|
7506
|
+
return (Math.max(min, Math.min(max, this._numericQuantity)) - min) / (max - min) * 100;
|
|
7507
|
+
}
|
|
7508
|
+
_setValue(newValue) {
|
|
7509
|
+
const min = this._minVal;
|
|
7510
|
+
const max = this._maxVal;
|
|
7511
|
+
const clamped = Math.max(min, Math.min(max, newValue));
|
|
7512
|
+
if (this._numericQuantity !== clamped) {
|
|
7513
|
+
this.quantity = clamped;
|
|
7514
|
+
this.dispatchEvent(new CustomEvent("change", {
|
|
7515
|
+
detail: {
|
|
7516
|
+
value: clamped,
|
|
7517
|
+
quantity: clamped
|
|
7518
|
+
},
|
|
7519
|
+
bubbles: true,
|
|
7520
|
+
composed: true
|
|
7521
|
+
}));
|
|
7522
|
+
}
|
|
7052
7523
|
}
|
|
7053
|
-
|
|
7054
|
-
|
|
7055
|
-
|
|
7056
|
-
|
|
7057
|
-
|
|
7058
|
-
|
|
7059
|
-
|
|
7060
|
-
|
|
7061
|
-
|
|
7062
|
-
|
|
7063
|
-
|
|
7064
|
-
|
|
7065
|
-
|
|
7066
|
-
|
|
7067
|
-
|
|
7068
|
-
|
|
7069
|
-
this.
|
|
7070
|
-
|
|
7071
|
-
|
|
7072
|
-
|
|
7073
|
-
|
|
7074
|
-
|
|
7075
|
-
const
|
|
7076
|
-
|
|
7077
|
-
|
|
7078
|
-
|
|
7079
|
-
this.
|
|
7080
|
-
|
|
7081
|
-
|
|
7082
|
-
|
|
7083
|
-
|
|
7084
|
-
|
|
7085
|
-
|
|
7086
|
-
|
|
7087
|
-
|
|
7088
|
-
|
|
7089
|
-
|
|
7090
|
-
|
|
7091
|
-
|
|
7092
|
-
|
|
7093
|
-
|
|
7094
|
-
|
|
7095
|
-
|
|
7096
|
-
|
|
7097
|
-
|
|
7098
|
-
|
|
7099
|
-
|
|
7100
|
-
></axebow-resource-limit-input>
|
|
7101
|
-
`;
|
|
7524
|
+
_handlePointerDown(e) {
|
|
7525
|
+
if (this.disabled) return;
|
|
7526
|
+
this._isDragging = true;
|
|
7527
|
+
this._updateFromPointer(e);
|
|
7528
|
+
const handlePointerMove = (moveEv) => {
|
|
7529
|
+
if (this._isDragging) this._updateFromPointer(moveEv);
|
|
7530
|
+
};
|
|
7531
|
+
const handlePointerUp = () => {
|
|
7532
|
+
this._isDragging = false;
|
|
7533
|
+
window.removeEventListener("pointermove", handlePointerMove);
|
|
7534
|
+
window.removeEventListener("pointerup", handlePointerUp);
|
|
7535
|
+
};
|
|
7536
|
+
window.addEventListener("pointermove", handlePointerMove);
|
|
7537
|
+
window.addEventListener("pointerup", handlePointerUp);
|
|
7538
|
+
}
|
|
7539
|
+
_updateFromPointer(e) {
|
|
7540
|
+
if (!this._trackContainer) return;
|
|
7541
|
+
const rect = this._trackContainer.getBoundingClientRect();
|
|
7542
|
+
const x = e.clientX - rect.left;
|
|
7543
|
+
const width = rect.width;
|
|
7544
|
+
if (width <= 0) return;
|
|
7545
|
+
const ratio = Math.max(0, Math.min(1, x / width));
|
|
7546
|
+
const min = this._minVal;
|
|
7547
|
+
const rawVal = min + ratio * (this._maxVal - min);
|
|
7548
|
+
const step = this.step || 1;
|
|
7549
|
+
const stepped = Math.round((rawVal - min) / step) * step + min;
|
|
7550
|
+
this._setValue(stepped);
|
|
7551
|
+
}
|
|
7552
|
+
_handleKeyDown(e) {
|
|
7553
|
+
if (this.disabled) return;
|
|
7554
|
+
const min = this._minVal;
|
|
7555
|
+
const max = this._maxVal;
|
|
7556
|
+
const step = this.step || 1;
|
|
7557
|
+
const current = this._numericQuantity;
|
|
7558
|
+
if (e.key === "ArrowRight" || e.key === "ArrowUp") {
|
|
7559
|
+
e.preventDefault();
|
|
7560
|
+
this._setValue(Math.min(max, current + step));
|
|
7561
|
+
} else if (e.key === "ArrowLeft" || e.key === "ArrowDown") {
|
|
7562
|
+
e.preventDefault();
|
|
7563
|
+
this._setValue(Math.max(min, current - step));
|
|
7564
|
+
} else if (e.key === "Home") {
|
|
7565
|
+
e.preventDefault();
|
|
7566
|
+
this._setValue(min);
|
|
7567
|
+
} else if (e.key === "End") {
|
|
7568
|
+
e.preventDefault();
|
|
7569
|
+
this._setValue(max);
|
|
7570
|
+
}
|
|
7102
7571
|
}
|
|
7103
7572
|
render() {
|
|
7104
|
-
|
|
7573
|
+
const percent = this._percentage;
|
|
7574
|
+
const currentVal = this._numericQuantity;
|
|
7575
|
+
const min = this._minVal;
|
|
7576
|
+
const max = this._maxVal;
|
|
7577
|
+
const mid = Math.round((min + max) / 2);
|
|
7105
7578
|
return html`
|
|
7106
|
-
<div class="
|
|
7107
|
-
|
|
7108
|
-
<div
|
|
7109
|
-
|
|
7579
|
+
<div class="w-full flex flex-col gap-2 select-none ${this.disabled ? "opacity-50 pointer-events-none" : ""}">
|
|
7580
|
+
<!-- Slider Track Container -->
|
|
7581
|
+
<div
|
|
7582
|
+
class="relative w-full h-8 flex items-center cursor-pointer touch-none focus:outline-none focus-visible:ring-2 focus-visible:ring-[#006BFF] rounded-full"
|
|
7583
|
+
tabindex=${this.disabled ? -1 : 0}
|
|
7584
|
+
role="slider"
|
|
7585
|
+
aria-valuemin=${min}
|
|
7586
|
+
aria-valuemax=${max}
|
|
7587
|
+
aria-valuenow=${currentVal}
|
|
7588
|
+
aria-valuetext=${String(currentVal)}
|
|
7589
|
+
@pointerdown=${this._handlePointerDown}
|
|
7590
|
+
@keydown=${this._handleKeyDown}
|
|
7591
|
+
>
|
|
7592
|
+
<!-- Outer track padding container for exact knob alignment -->
|
|
7593
|
+
<div class="slider-track-container relative w-full h-3 rounded-full bg-[#C7DCFA] overflow-visible">
|
|
7594
|
+
<!-- Active Fill Track -->
|
|
7595
|
+
<div
|
|
7596
|
+
class="absolute left-0 top-0 bottom-0 rounded-full bg-[#006BFF] transition-all duration-150 ease-out"
|
|
7597
|
+
style="width: ${percent}%;"
|
|
7598
|
+
></div>
|
|
7599
|
+
|
|
7600
|
+
<!-- Slider Thumb Knob -->
|
|
7601
|
+
<div
|
|
7602
|
+
class="absolute top-1/2 -translate-y-1/2 -translate-x-1/2 w-7 h-7 rounded-full bg-[#006BFF] border-2 border-white shadow-[0_2px_6px_rgba(0,0,0,0.2)] transition-all duration-150 ease-out cursor-grab active:cursor-grabbing hover:scale-105"
|
|
7603
|
+
style="left: ${percent}%;"
|
|
7604
|
+
></div>
|
|
7605
|
+
</div>
|
|
7606
|
+
</div>
|
|
7607
|
+
|
|
7608
|
+
<!-- Labels below -->
|
|
7609
|
+
<div class="flex justify-between items-center text-sm font-semibold text-[#78787A] px-1">
|
|
7610
|
+
<span class="w-1/3 text-left cursor-pointer" @click=${() => !this.disabled && this._setValue(min)}>
|
|
7611
|
+
${this.minTag}
|
|
7612
|
+
</span>
|
|
7613
|
+
<span class="w-1/3 text-center cursor-pointer" @click=${() => !this.disabled && this._setValue(mid)}>
|
|
7614
|
+
${this.mediumTag}
|
|
7615
|
+
</span>
|
|
7616
|
+
<span class="w-1/3 text-right cursor-pointer" @click=${() => !this.disabled && this._setValue(max)}>
|
|
7617
|
+
${this.maxTag}
|
|
7618
|
+
</span>
|
|
7110
7619
|
</div>
|
|
7111
7620
|
</div>
|
|
7112
7621
|
`;
|
|
7113
7622
|
}
|
|
7114
7623
|
};
|
|
7115
|
-
__decorate([property({
|
|
7116
|
-
|
|
7117
|
-
|
|
7118
|
-
|
|
7624
|
+
__decorate([property({
|
|
7625
|
+
type: Number,
|
|
7626
|
+
reflect: true
|
|
7627
|
+
})], AxebowSelectorSlider.prototype, "quantity", void 0);
|
|
7628
|
+
__decorate([property()], AxebowSelectorSlider.prototype, "minTag", void 0);
|
|
7629
|
+
__decorate([property()], AxebowSelectorSlider.prototype, "mediumTag", void 0);
|
|
7630
|
+
__decorate([property()], AxebowSelectorSlider.prototype, "maxTag", void 0);
|
|
7631
|
+
__decorate([property({ type: Number })], AxebowSelectorSlider.prototype, "min", void 0);
|
|
7632
|
+
__decorate([property({ type: Number })], AxebowSelectorSlider.prototype, "max", void 0);
|
|
7633
|
+
__decorate([property({ type: Number })], AxebowSelectorSlider.prototype, "step", void 0);
|
|
7634
|
+
__decorate([property({ type: Boolean })], AxebowSelectorSlider.prototype, "disabled", void 0);
|
|
7635
|
+
__decorate([property()], AxebowSelectorSlider.prototype, "value", null);
|
|
7636
|
+
__decorate([query(".slider-track-container")], AxebowSelectorSlider.prototype, "_trackContainer", void 0);
|
|
7637
|
+
AxebowSelectorSlider = __decorate([customElement("axebow-selector-slider")], AxebowSelectorSlider);
|
|
7119
7638
|
//#endregion
|
|
7120
7639
|
//#region src/components/axebow-deploy-summary/axebow-deploy-summary.ts
|
|
7121
7640
|
var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
@@ -7179,7 +7698,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
7179
7698
|
iconName="download_for_offline"
|
|
7180
7699
|
slot="suffix"
|
|
7181
7700
|
iconColor="var(--axebow-tertiary)"
|
|
7182
|
-
size="
|
|
7701
|
+
size="xl"
|
|
7183
7702
|
></axebow-icon>
|
|
7184
7703
|
<span class="text-sm lg:text-base hidden lg:inline">${this.downloadLabel}</span>
|
|
7185
7704
|
</axebow-button>
|
|
@@ -7275,15 +7794,15 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
7275
7794
|
${step.registry ? this._renderRegistrySummary(step.registry) : ""}
|
|
7276
7795
|
${step.entrypoint ? html`<div class="border-t border-dashed border-gray-300 pt-2 flex items-center gap-1 min-w-0 text-base">
|
|
7277
7796
|
<span class="shrink-0 text-(--axebow-black)">${step.entrypointLabel}</span>
|
|
7278
|
-
<
|
|
7797
|
+
<axebow-tooltip content="${step.entrypoint}">
|
|
7279
7798
|
<strong class="text-(--axebow-gray) block truncate max-w-36">${step.entrypoint}</strong>
|
|
7280
|
-
</
|
|
7799
|
+
</axebow-tooltip>
|
|
7281
7800
|
</div>` : ""}
|
|
7282
7801
|
${step.cmd ? html`<div class="flex items-center gap-1 min-w-0 text-base">
|
|
7283
7802
|
<span class="shrink-0 text-(--axebow-black)">${step.commandLabel}</span>
|
|
7284
|
-
<
|
|
7803
|
+
<axebow-tooltip content="${step.cmd}">
|
|
7285
7804
|
<strong class="text-(--axebow-gray) block truncate max-w-36">${step.cmd}</strong>
|
|
7286
|
-
</
|
|
7805
|
+
</axebow-tooltip>
|
|
7287
7806
|
</div>` : ""}
|
|
7288
7807
|
</div>
|
|
7289
7808
|
</axebow-summary-step>
|
|
@@ -7293,15 +7812,15 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
7293
7812
|
return html`
|
|
7294
7813
|
<div class="flex items-center gap-2 min-w-0 text-base">
|
|
7295
7814
|
<p class="shrink-0 text-(--axebow-black)">${registry.containerRegistryLabel}</p>
|
|
7296
|
-
${!registry.logoSrc ? html`<
|
|
7815
|
+
${!registry.logoSrc ? html`<axebow-tooltip content="${registry.value}">
|
|
7297
7816
|
<strong class="text-(--axebow-gray) block truncate w-full">${registry.value}</strong>
|
|
7298
|
-
</
|
|
7817
|
+
</axebow-tooltip>` : html`<img src="${registry.logoSrc}" class="w-6 h-4 object-contain" />`}
|
|
7299
7818
|
</div>
|
|
7300
7819
|
${registry.credentialSecret ? html` <div class="flex items-center gap-2 min-w-0 text-base">
|
|
7301
7820
|
<p class="shrink-0 text-(--axebow-black)">${registry.registryCredentialsLabel}</p>
|
|
7302
|
-
<
|
|
7821
|
+
<axebow-tooltip content="${registry.credentialSecret}">
|
|
7303
7822
|
<strong class="text-(--axebow-gray) block truncate w-full">${registry.credentialSecret}</strong>
|
|
7304
|
-
</
|
|
7823
|
+
</axebow-tooltip>
|
|
7305
7824
|
</div>` : ""}
|
|
7306
7825
|
`;
|
|
7307
7826
|
}
|
|
@@ -7407,7 +7926,7 @@ var AxebowDeploySummary = class AxebowDeploySummary extends LitElement {
|
|
|
7407
7926
|
class="shrink-0"
|
|
7408
7927
|
iconName="captive_portal"
|
|
7409
7928
|
iconColor="var(--axebow-gray)"
|
|
7410
|
-
size="
|
|
7929
|
+
size="md"
|
|
7411
7930
|
title="Gateway"
|
|
7412
7931
|
></axebow-icon>` : ""}
|
|
7413
7932
|
</strong>
|
|
@@ -7528,7 +8047,7 @@ var AxebowResourceBar = class AxebowResourceBar extends LitElement {
|
|
|
7528
8047
|
<axebow-icon
|
|
7529
8048
|
iconName="${this.icon}"
|
|
7530
8049
|
iconColor="var(--axebow-strong-gray)"
|
|
7531
|
-
size="
|
|
8050
|
+
size="xl"
|
|
7532
8051
|
rotate="${Number(this.rotate)}"
|
|
7533
8052
|
></axebow-icon>
|
|
7534
8053
|
<p class="text-base font-bold text-(--axebow-black)">${this.label}</p>
|
|
@@ -7591,7 +8110,7 @@ var AxebowSummaryStepHeader = class AxebowSummaryStepHeader extends LitElement {
|
|
|
7591
8110
|
class="shrink-0"
|
|
7592
8111
|
iconName="check_circle"
|
|
7593
8112
|
iconColor="var(--axebow-success)"
|
|
7594
|
-
size="
|
|
8113
|
+
size="md"
|
|
7595
8114
|
></axebow-icon>` : ""}
|
|
7596
8115
|
</div>
|
|
7597
8116
|
<div class="flex items-center gap-2 shrink-0">
|
|
@@ -7602,7 +8121,7 @@ var AxebowSummaryStepHeader = class AxebowSummaryStepHeader extends LitElement {
|
|
|
7602
8121
|
title="${this.isEditing ? this.editingLabel : this.editLabel}"
|
|
7603
8122
|
@click=${this.isEditing ? void 0 : this._handleEdit}
|
|
7604
8123
|
>
|
|
7605
|
-
<axebow-icon iconName="edit_square" iconColor="var(--axebow-tertiary)" size="
|
|
8124
|
+
<axebow-icon iconName="edit_square" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
7606
8125
|
</div>
|
|
7607
8126
|
` : ""}
|
|
7608
8127
|
</div>
|
|
@@ -7699,8 +8218,6 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7699
8218
|
super(..._args);
|
|
7700
8219
|
this.title = "Summary";
|
|
7701
8220
|
this.minimized = false;
|
|
7702
|
-
this.cardWidth = "24.125rem";
|
|
7703
|
-
this.cardHeight = "";
|
|
7704
8221
|
this.isSummaryOpen = true;
|
|
7705
8222
|
}
|
|
7706
8223
|
static {
|
|
@@ -7716,13 +8233,6 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7716
8233
|
--border-color: transparent !important;
|
|
7717
8234
|
border: none !important;
|
|
7718
8235
|
}
|
|
7719
|
-
sl-card::part(base) {
|
|
7720
|
-
width: 100%;
|
|
7721
|
-
height: 100%;
|
|
7722
|
-
}
|
|
7723
|
-
sl-card::part(body) {
|
|
7724
|
-
height: 100%;
|
|
7725
|
-
}
|
|
7726
8236
|
`
|
|
7727
8237
|
];
|
|
7728
8238
|
}
|
|
@@ -7730,16 +8240,15 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7730
8240
|
if (this.minimized && window.innerWidth >= 1024) return this._renderMinimizedView();
|
|
7731
8241
|
return html`
|
|
7732
8242
|
<div
|
|
7733
|
-
class="w-full lg:w-
|
|
7734
|
-
style="--card-width: ${this.cardWidth}; --card-height: ${this.cardHeight};"
|
|
8243
|
+
class="w-full lg:w-96.5 lg:sticky static top-25 h-auto lg:min-h-[calc(100vh-6.25rem)] lg:h-full overflow-y-auto rounded-xl z-10 transition-all duration-300"
|
|
7735
8244
|
>
|
|
7736
8245
|
<sl-card
|
|
7737
|
-
class="w-full h-full shadow-none border-t border-l-0 border-r-0 border-b-0 rounded-none lg:shadow lg:border lg:rounded-xl"
|
|
8246
|
+
class="w-full h-full overflow-hidden shadow-none border-t border-l-0 border-r-0 border-b-0 rounded-none lg:shadow lg:border lg:rounded-xl"
|
|
7738
8247
|
>
|
|
7739
8248
|
<div class="h-full flex flex-col">
|
|
7740
8249
|
${this._renderHeader()}
|
|
7741
8250
|
<sl-divider></sl-divider>
|
|
7742
|
-
<div class="${this.isSummaryOpen ? "" : "hidden"} lg:block flex-1 mt-4">
|
|
8251
|
+
<div class="${this.isSummaryOpen ? "" : "hidden"} lg:block flex-1 overflow-y-auto mt-4">
|
|
7743
8252
|
<slot></slot>
|
|
7744
8253
|
</div>
|
|
7745
8254
|
</div>
|
|
@@ -7757,7 +8266,7 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7757
8266
|
<div class="flex flex-col items-center gap-4">
|
|
7758
8267
|
<axebow-icon
|
|
7759
8268
|
iconName="keyboard_arrow_left"
|
|
7760
|
-
size="
|
|
8269
|
+
size="xl"
|
|
7761
8270
|
class="group-hover:-translate-x-1 transition-transform"
|
|
7762
8271
|
></axebow-icon>
|
|
7763
8272
|
<span
|
|
@@ -7789,7 +8298,7 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7789
8298
|
@click="${this._toggleMinimize}"
|
|
7790
8299
|
title="Minimize ${this.title}"
|
|
7791
8300
|
>
|
|
7792
|
-
<axebow-icon iconName="keyboard_arrow_right" size="
|
|
8301
|
+
<axebow-icon iconName="keyboard_arrow_right" size="xl"></axebow-icon>
|
|
7793
8302
|
</axebow-button>
|
|
7794
8303
|
</div>
|
|
7795
8304
|
</div>
|
|
@@ -7817,146 +8326,9 @@ var AxebowSummaryCard = class AxebowSummaryCard extends LitElement {
|
|
|
7817
8326
|
};
|
|
7818
8327
|
__decorate([property({ type: String })], AxebowSummaryCard.prototype, "title", void 0);
|
|
7819
8328
|
__decorate([property({ type: Boolean })], AxebowSummaryCard.prototype, "minimized", void 0);
|
|
7820
|
-
__decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardWidth", void 0);
|
|
7821
|
-
__decorate([property({ type: String })], AxebowSummaryCard.prototype, "cardHeight", void 0);
|
|
7822
8329
|
__decorate([state()], AxebowSummaryCard.prototype, "isSummaryOpen", void 0);
|
|
7823
8330
|
AxebowSummaryCard = __decorate([customElement("axebow-summary-card")], AxebowSummaryCard);
|
|
7824
8331
|
//#endregion
|
|
7825
|
-
//#region src/components/axebow-summary/axebow-summary-limits.ts
|
|
7826
|
-
var AxebowSummaryLimits = class AxebowSummaryLimits extends LitElement {
|
|
7827
|
-
constructor(..._args) {
|
|
7828
|
-
super(..._args);
|
|
7829
|
-
this.supportedStorage = [];
|
|
7830
|
-
}
|
|
7831
|
-
static {
|
|
7832
|
-
this.styles = [
|
|
7833
|
-
unsafeCSS(tailwind_default),
|
|
7834
|
-
axebowTheme,
|
|
7835
|
-
css`
|
|
7836
|
-
:host {
|
|
7837
|
-
display: block;
|
|
7838
|
-
width: 100%;
|
|
7839
|
-
}
|
|
7840
|
-
`
|
|
7841
|
-
];
|
|
7842
|
-
}
|
|
7843
|
-
renderSection(title, limitKey) {
|
|
7844
|
-
return html`
|
|
7845
|
-
<div class="w-full flex flex-col gap-2">
|
|
7846
|
-
<p class="font-semibold text-base m-0">${title}</p>
|
|
7847
|
-
<div class="flex gap-1.5">
|
|
7848
|
-
<div class="w-41 h-4.25 text-base">
|
|
7849
|
-
${this.labels.vcpus}: <span class="text-(--axebow-gray)">${this.limits.cpu[limitKey]}</span>
|
|
7850
|
-
</div>
|
|
7851
|
-
<div class="w-41 h-4.25 text-base">
|
|
7852
|
-
${this.labels.memory} <span class="text-(--axebow-gray)">${this.limits.memory[limitKey]} GB</span>
|
|
7853
|
-
</div>
|
|
7854
|
-
</div>
|
|
7855
|
-
${this.supportedStorage.includes("volatile") ? html`
|
|
7856
|
-
<p class="text-base m-0">
|
|
7857
|
-
${this.labels.volatile}:
|
|
7858
|
-
<span class="text-(--axebow-gray)">${this.limits.volatileStorage[limitKey]} GB</span>
|
|
7859
|
-
</p>
|
|
7860
|
-
` : ""}
|
|
7861
|
-
${this.supportedStorage.includes("nonReplicated") ? html`
|
|
7862
|
-
<p class="text-base m-0">
|
|
7863
|
-
${this.labels.nonReplicated}:
|
|
7864
|
-
<span class="text-(--axebow-gray)">${this.limits.nonReplicatedStorage[limitKey]} GB</span>
|
|
7865
|
-
</p>
|
|
7866
|
-
` : ""}
|
|
7867
|
-
${this.supportedStorage.includes("persistent") ? html`
|
|
7868
|
-
<p class="text-base m-0">
|
|
7869
|
-
${this.labels.persistent}:
|
|
7870
|
-
<span class="text-(--axebow-gray)">${this.limits.persistentStorage[limitKey]} GB</span>
|
|
7871
|
-
</p>
|
|
7872
|
-
` : ""}
|
|
7873
|
-
</div>
|
|
7874
|
-
`;
|
|
7875
|
-
}
|
|
7876
|
-
render() {
|
|
7877
|
-
if (!this.limits || !this.labels) return html``;
|
|
7878
|
-
return html`
|
|
7879
|
-
${this.renderSection(this.labels.hardLimits, "max")}
|
|
7880
|
-
<sl-divider class="w-83.5 h-px bg-(--axebow-gray)"></sl-divider>
|
|
7881
|
-
${this.renderSection(this.labels.softLimits, "min")}
|
|
7882
|
-
`;
|
|
7883
|
-
}
|
|
7884
|
-
};
|
|
7885
|
-
__decorate([property({ type: Object })], AxebowSummaryLimits.prototype, "limits", void 0);
|
|
7886
|
-
__decorate([property({ type: Array })], AxebowSummaryLimits.prototype, "supportedStorage", void 0);
|
|
7887
|
-
__decorate([property({ type: Object })], AxebowSummaryLimits.prototype, "labels", void 0);
|
|
7888
|
-
AxebowSummaryLimits = __decorate([customElement("axebow-summary-limits")], AxebowSummaryLimits);
|
|
7889
|
-
//#endregion
|
|
7890
|
-
//#region src/components/axebow-summary/axebow-summary-flavors.ts
|
|
7891
|
-
var AxebowSummaryFlavors = class AxebowSummaryFlavors extends LitElement {
|
|
7892
|
-
constructor(..._args) {
|
|
7893
|
-
super(..._args);
|
|
7894
|
-
this.supportedStorage = [];
|
|
7895
|
-
this.hasFlavors = true;
|
|
7896
|
-
}
|
|
7897
|
-
static {
|
|
7898
|
-
this.styles = [unsafeCSS(tailwind_default), axebowTheme];
|
|
7899
|
-
}
|
|
7900
|
-
render() {
|
|
7901
|
-
if (!this.labels) return html``;
|
|
7902
|
-
return html`
|
|
7903
|
-
${this.hasFlavors || this.nodes || this.highAvailable !== void 0 || this.autoscale !== void 0 || this.supportedStorage.some((s) => this.flavors?.[s]?.[0]) ? html`
|
|
7904
|
-
<div class="flex w-full gap-[2%]">
|
|
7905
|
-
<div class="flex-1 flex flex-col gap-2">
|
|
7906
|
-
<p><strong>${this.labels.workload}</strong></p>
|
|
7907
|
-
${this.hasFlavors && this.flavors?.small?.[0] ? html`<p>${this.labels.runtimePlane}</p>` : ""}
|
|
7908
|
-
<p>${this.labels.numberOfVms}</p>
|
|
7909
|
-
${this.hasFlavors && this.flavors?.medium?.[0] ? html`<p>${this.labels.controlPlane}</p>` : ""}
|
|
7910
|
-
${this.highAvailable !== void 0 ? html`<p>${this.labels.highAvailable}</p>` : ""}
|
|
7911
|
-
</div>
|
|
7912
|
-
<div class="flex-1 flex flex-col gap-2">
|
|
7913
|
-
<p><strong>${this.labels.selectedFlavor}</strong></p>
|
|
7914
|
-
${this.hasFlavors && this.flavors?.small?.[0] ? html`<p><strong class="text-(--axebow-primary)">${this.flavors?.small?.[0]}</strong></p>` : ""}
|
|
7915
|
-
<p><strong class="text-(--axebow-primary)">${this.nodes?.max || "0"}</strong></p>
|
|
7916
|
-
|
|
7917
|
-
${this.hasFlavors && this.flavors?.medium?.[0] ? html`<p><strong class="text-(--axebow-primary)">${this.flavors?.medium?.[0]}</strong></p>` : ""}
|
|
7918
|
-
${this.highAvailable !== void 0 ? html`<p>
|
|
7919
|
-
<strong class="text-(--axebow-primary)"
|
|
7920
|
-
>${this.highAvailable ? this.labels.yes : this.labels.no}</strong
|
|
7921
|
-
>
|
|
7922
|
-
</p>` : ""}
|
|
7923
|
-
</div>
|
|
7924
|
-
</div>
|
|
7925
|
-
${this.supportedStorage.some((s) => this.flavors?.[s]?.[0]) ? html`
|
|
7926
|
-
<div class="flex w-full gap-[2%] mt-2">
|
|
7927
|
-
<div class="flex-1 flex flex-col gap-2">
|
|
7928
|
-
<p><strong>${this.labels.storage}</strong></p>
|
|
7929
|
-
${this.supportedStorage.includes("volatile") && this.flavors?.volatile?.[0] ? html`<p>${this.labels.volatile}</p>` : ""}
|
|
7930
|
-
${this.supportedStorage.includes("nonReplicated") && this.flavors?.nonReplicated?.[0] ? html`<p>${this.labels.nonReplPersistent}</p>` : ""}
|
|
7931
|
-
${this.supportedStorage.includes("persistent") && this.flavors?.persistent?.[0] ? html`<p>${this.labels.persistentReplicated}</p>` : ""}
|
|
7932
|
-
</div>
|
|
7933
|
-
<div class="flex-1 flex flex-col gap-2">
|
|
7934
|
-
<p><strong>${this.labels.selectedFlavor}</strong></p>
|
|
7935
|
-
${this.supportedStorage.includes("volatile") && this.flavors?.volatile?.[0] ? html`<p>
|
|
7936
|
-
<strong class="text-(--axebow-primary)">${this.flavors?.volatile?.[0]}</strong>
|
|
7937
|
-
</p>` : ""}
|
|
7938
|
-
${this.supportedStorage.includes("nonReplicated") && this.flavors?.nonReplicated?.[0] ? html`<p>
|
|
7939
|
-
<strong class="text-(--axebow-primary)">${this.flavors?.nonReplicated?.[0]}</strong>
|
|
7940
|
-
</p>` : ""}
|
|
7941
|
-
${this.supportedStorage.includes("persistent") && this.flavors?.persistent?.[0] ? html`<p>
|
|
7942
|
-
<strong class="text-(--axebow-primary)">${this.flavors?.persistent?.[0]}</strong>
|
|
7943
|
-
</p>` : ""}
|
|
7944
|
-
</div>
|
|
7945
|
-
</div>
|
|
7946
|
-
` : ""}
|
|
7947
|
-
` : ""}
|
|
7948
|
-
`;
|
|
7949
|
-
}
|
|
7950
|
-
};
|
|
7951
|
-
__decorate([property({ type: Object })], AxebowSummaryFlavors.prototype, "flavors", void 0);
|
|
7952
|
-
__decorate([property({ type: Object })], AxebowSummaryFlavors.prototype, "nodes", void 0);
|
|
7953
|
-
__decorate([property({ type: Boolean })], AxebowSummaryFlavors.prototype, "highAvailable", void 0);
|
|
7954
|
-
__decorate([property({ type: Boolean })], AxebowSummaryFlavors.prototype, "autoscale", void 0);
|
|
7955
|
-
__decorate([property({ type: Array })], AxebowSummaryFlavors.prototype, "supportedStorage", void 0);
|
|
7956
|
-
__decorate([property({ type: Boolean })], AxebowSummaryFlavors.prototype, "hasFlavors", void 0);
|
|
7957
|
-
__decorate([property({ type: Object })], AxebowSummaryFlavors.prototype, "labels", void 0);
|
|
7958
|
-
AxebowSummaryFlavors = __decorate([customElement("axebow-summary-flavors")], AxebowSummaryFlavors);
|
|
7959
|
-
//#endregion
|
|
7960
8332
|
//#region src/components/deploy-modal-component/parts/deploy-modal-header.ts
|
|
7961
8333
|
var DeployModalHeader = class DeployModalHeader extends LitElement {
|
|
7962
8334
|
static {
|
|
@@ -7983,7 +8355,7 @@ var DeployModalHeader = class DeployModalHeader extends LitElement {
|
|
|
7983
8355
|
<slot></slot>
|
|
7984
8356
|
</div>
|
|
7985
8357
|
<div class="w-6 h-6 shrink-0 flex items-center justify-center cursor-pointer" @click=${this._onClose}>
|
|
7986
|
-
<axebow-icon iconName="cancel" iconColor="var(--axebow-gray)" size="
|
|
8358
|
+
<axebow-icon iconName="cancel" iconColor="var(--axebow-gray)" size="md"></axebow-icon>
|
|
7987
8359
|
</div>
|
|
7988
8360
|
</div>
|
|
7989
8361
|
`;
|
|
@@ -8092,6 +8464,407 @@ var CustomHomePageBody = class CustomHomePageBody extends LitElement {
|
|
|
8092
8464
|
};
|
|
8093
8465
|
CustomHomePageBody = __decorate([customElement("custom-home-page-body")], CustomHomePageBody);
|
|
8094
8466
|
//#endregion
|
|
8095
|
-
|
|
8467
|
+
//#region src/components/axebow-status/axebow-status.ts
|
|
8468
|
+
var AxebowStatus = class AxebowStatus extends LitElement {
|
|
8469
|
+
constructor(..._args) {
|
|
8470
|
+
super(..._args);
|
|
8471
|
+
this.showTrash = false;
|
|
8472
|
+
this.statusText = "Free";
|
|
8473
|
+
this.statusColor = "#10B981";
|
|
8474
|
+
this.deleting = false;
|
|
8475
|
+
}
|
|
8476
|
+
static {
|
|
8477
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
8478
|
+
:host {
|
|
8479
|
+
width: 100%;
|
|
8480
|
+
}`];
|
|
8481
|
+
}
|
|
8482
|
+
_handleDelete(e) {
|
|
8483
|
+
if (this.deleting) return;
|
|
8484
|
+
e.stopPropagation();
|
|
8485
|
+
this.dispatchEvent(new CustomEvent("delete", {
|
|
8486
|
+
bubbles: true,
|
|
8487
|
+
composed: true
|
|
8488
|
+
}));
|
|
8489
|
+
}
|
|
8490
|
+
render() {
|
|
8491
|
+
return html`
|
|
8492
|
+
<div class="flex items-center justify-between h-fit gap-2">
|
|
8493
|
+
<div class="flex items-center gap-1.5">
|
|
8494
|
+
${this.statusColor ? html`<div class="h-2 w-2 rounded-full shrink-0" style="background-color: ${this.statusColor};"></div>` : ""}
|
|
8495
|
+
<span class="font-medium text-[#475569]">${this.statusText}</span>
|
|
8496
|
+
</div>
|
|
8497
|
+
${this.showTrash ? html`
|
|
8498
|
+
<button
|
|
8499
|
+
type="button"
|
|
8500
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center ${this.deleting ? "opacity-40 cursor-not-allowed" : ""}"
|
|
8501
|
+
@click=${this._handleDelete}
|
|
8502
|
+
>
|
|
8503
|
+
<axebow-icon iconName="delete" .iconColor="${this.deleting ? "var(--axebow-gray)" : "var(--axebow-error)"}" size="lg"></axebow-icon>
|
|
8504
|
+
</button>
|
|
8505
|
+
` : ""}
|
|
8506
|
+
</div>
|
|
8507
|
+
`;
|
|
8508
|
+
}
|
|
8509
|
+
};
|
|
8510
|
+
__decorate([property({ type: Boolean })], AxebowStatus.prototype, "showTrash", void 0);
|
|
8511
|
+
__decorate([property({ type: String })], AxebowStatus.prototype, "statusText", void 0);
|
|
8512
|
+
__decorate([property({ type: String })], AxebowStatus.prototype, "statusColor", void 0);
|
|
8513
|
+
__decorate([property({ type: Boolean })], AxebowStatus.prototype, "deleting", void 0);
|
|
8514
|
+
AxebowStatus = __decorate([customElement("axebow-status")], AxebowStatus);
|
|
8515
|
+
//#endregion
|
|
8516
|
+
//#region src/components/axebow-form-panel-field/axebow-form-panel-field.ts
|
|
8517
|
+
var AxebowFormPanelField = class AxebowFormPanelField extends LitElement {
|
|
8518
|
+
constructor(..._args) {
|
|
8519
|
+
super(..._args);
|
|
8520
|
+
this.styleVariant = "Placeholder";
|
|
8521
|
+
this.disabled = false;
|
|
8522
|
+
this.label = "Field label";
|
|
8523
|
+
this.value = "";
|
|
8524
|
+
this.mandatory = true;
|
|
8525
|
+
this.showDropdown = false;
|
|
8526
|
+
this.showCloseIcon = false;
|
|
8527
|
+
this.placeholderCopy = "Placeholder (examples)";
|
|
8528
|
+
this.showActionIcon = false;
|
|
8529
|
+
this.actionIcon = "content_copy";
|
|
8530
|
+
this.showSecondaryActionIcon = false;
|
|
8531
|
+
this.secondaryActionIcon = "open_in_new";
|
|
8532
|
+
this.options = [];
|
|
8533
|
+
this._isDropdownOpen = false;
|
|
8534
|
+
this._handleOutsideClick = (e) => {
|
|
8535
|
+
if (this._isDropdownOpen && !e.composedPath().includes(this)) this._isDropdownOpen = false;
|
|
8536
|
+
};
|
|
8537
|
+
}
|
|
8538
|
+
static {
|
|
8539
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
8540
|
+
:host {
|
|
8541
|
+
display: inline-block;
|
|
8542
|
+
width: 234px;
|
|
8543
|
+
position: relative;
|
|
8544
|
+
}
|
|
8545
|
+
.field-container {
|
|
8546
|
+
width: 100%;
|
|
8547
|
+
min-height: 51.33px;
|
|
8548
|
+
border-radius: 6px;
|
|
8549
|
+
padding: 6px 8px;
|
|
8550
|
+
box-sizing: border-box;
|
|
8551
|
+
transition: border-color 0.2s ease, background-color 0.2s ease;
|
|
8552
|
+
}
|
|
8553
|
+
`];
|
|
8554
|
+
}
|
|
8555
|
+
connectedCallback() {
|
|
8556
|
+
super.connectedCallback();
|
|
8557
|
+
window.addEventListener("click", this._handleOutsideClick);
|
|
8558
|
+
}
|
|
8559
|
+
disconnectedCallback() {
|
|
8560
|
+
super.disconnectedCallback();
|
|
8561
|
+
window.removeEventListener("click", this._handleOutsideClick);
|
|
8562
|
+
}
|
|
8563
|
+
_handleInput(e) {
|
|
8564
|
+
if (this.disabled) return;
|
|
8565
|
+
const target = e.target;
|
|
8566
|
+
this.value = target.value;
|
|
8567
|
+
this.dispatchEvent(new CustomEvent("change", {
|
|
8568
|
+
detail: { value: this.value },
|
|
8569
|
+
bubbles: true,
|
|
8570
|
+
composed: true
|
|
8571
|
+
}));
|
|
8572
|
+
}
|
|
8573
|
+
_handleActionClick(e) {
|
|
8574
|
+
e.stopPropagation();
|
|
8575
|
+
this.dispatchEvent(new CustomEvent("action-click", {
|
|
8576
|
+
detail: { value: this.value },
|
|
8577
|
+
bubbles: true,
|
|
8578
|
+
composed: true
|
|
8579
|
+
}));
|
|
8580
|
+
}
|
|
8581
|
+
_handleSecondaryActionClick(e) {
|
|
8582
|
+
e.stopPropagation();
|
|
8583
|
+
this.dispatchEvent(new CustomEvent("secondary-action-click", {
|
|
8584
|
+
detail: { value: this.value },
|
|
8585
|
+
bubbles: true,
|
|
8586
|
+
composed: true
|
|
8587
|
+
}));
|
|
8588
|
+
}
|
|
8589
|
+
_handleCloseClick(e) {
|
|
8590
|
+
e.stopPropagation();
|
|
8591
|
+
this.value = "";
|
|
8592
|
+
this.dispatchEvent(new CustomEvent("close-click", {
|
|
8593
|
+
bubbles: true,
|
|
8594
|
+
composed: true
|
|
8595
|
+
}));
|
|
8596
|
+
}
|
|
8597
|
+
_handleDropdownClick(e) {
|
|
8598
|
+
e.stopPropagation();
|
|
8599
|
+
if (this.disabled) return;
|
|
8600
|
+
if (this.options && this.options.length > 0) this._isDropdownOpen = !this._isDropdownOpen;
|
|
8601
|
+
this.dispatchEvent(new CustomEvent("dropdown-click", {
|
|
8602
|
+
detail: { isOpen: this._isDropdownOpen },
|
|
8603
|
+
bubbles: true,
|
|
8604
|
+
composed: true
|
|
8605
|
+
}));
|
|
8606
|
+
}
|
|
8607
|
+
_selectOption(opt, e) {
|
|
8608
|
+
e.stopPropagation();
|
|
8609
|
+
this.value = opt;
|
|
8610
|
+
this._isDropdownOpen = false;
|
|
8611
|
+
this.dispatchEvent(new CustomEvent("select", {
|
|
8612
|
+
detail: { value: opt },
|
|
8613
|
+
bubbles: true,
|
|
8614
|
+
composed: true
|
|
8615
|
+
}));
|
|
8616
|
+
this.dispatchEvent(new CustomEvent("change", {
|
|
8617
|
+
detail: { value: opt },
|
|
8618
|
+
bubbles: true,
|
|
8619
|
+
composed: true
|
|
8620
|
+
}));
|
|
8621
|
+
}
|
|
8622
|
+
render() {
|
|
8623
|
+
const isFilled = this.styleVariant && this.styleVariant.toLowerCase() === "filled" || !!this.value;
|
|
8624
|
+
const bgClass = this.disabled ? "bg-[#F0F1F5] border border-solid border-[#DBDDE4]" : "bg-white border border-solid border-[#DBDDE4] focus-within:border-[#006BFF]";
|
|
8625
|
+
const textColor = this.disabled ? "text-[#78787A]" : isFilled ? "text-[#000000]" : "text-[#78787A]";
|
|
8626
|
+
return html`
|
|
8627
|
+
<div class="relative w-full">
|
|
8628
|
+
<!-- Field Container -->
|
|
8629
|
+
<div
|
|
8630
|
+
class="field-container border flex items-center justify-between gap-2 ${bgClass} ${this.showDropdown && !this.disabled ? "cursor-pointer" : ""}"
|
|
8631
|
+
@click=${this.showDropdown ? this._handleDropdownClick : null}
|
|
8632
|
+
>
|
|
8633
|
+
<div class="flex flex-col justify-center flex-1 min-w-0">
|
|
8634
|
+
<!-- Top Label -->
|
|
8635
|
+
<div class="flex items-center text-xs text-[#78787A] leading-tight select-none">
|
|
8636
|
+
${this.mandatory ? html`<span class="text-[#E93A3A] font-bold mr-0.5">*</span>` : ""}
|
|
8637
|
+
<span class="truncate">${this.label}</span>
|
|
8638
|
+
</div>
|
|
8639
|
+
|
|
8640
|
+
<!-- Value / Input -->
|
|
8641
|
+
<input
|
|
8642
|
+
type="text"
|
|
8643
|
+
class="w-full bg-transparent border-0 p-0 text-sm font-normal ${textColor} focus:outline-none truncate"
|
|
8644
|
+
.value=${this.value}
|
|
8645
|
+
placeholder=${this.placeholderCopy}
|
|
8646
|
+
?disabled=${this.disabled}
|
|
8647
|
+
@input=${this._handleInput}
|
|
8648
|
+
/>
|
|
8649
|
+
</div>
|
|
8650
|
+
|
|
8651
|
+
<!-- Action Icons Suffix -->
|
|
8652
|
+
<div class="flex items-center gap-1 shrink-0">
|
|
8653
|
+
${this.showSecondaryActionIcon ? html`
|
|
8654
|
+
<button
|
|
8655
|
+
type="button"
|
|
8656
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#006BFF] hover:opacity-80 transition-opacity"
|
|
8657
|
+
@click=${this._handleSecondaryActionClick}
|
|
8658
|
+
>
|
|
8659
|
+
<axebow-icon iconName=${this.secondaryActionIcon} iconColor="#006BFF" size="lg"></axebow-icon>
|
|
8660
|
+
</button>
|
|
8661
|
+
` : ""}
|
|
8662
|
+
${this.showActionIcon ? html`
|
|
8663
|
+
<button
|
|
8664
|
+
type="button"
|
|
8665
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#006BFF] hover:opacity-80 transition-opacity"
|
|
8666
|
+
@click=${this._handleActionClick}
|
|
8667
|
+
>
|
|
8668
|
+
<axebow-icon iconName=${this.actionIcon} iconColor="#006BFF" size="lg"></axebow-icon>
|
|
8669
|
+
</button>
|
|
8670
|
+
` : ""}
|
|
8671
|
+
${this.showCloseIcon ? html`
|
|
8672
|
+
<button
|
|
8673
|
+
type="button"
|
|
8674
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#78787A] hover:text-black transition-colors"
|
|
8675
|
+
@click=${this._handleCloseClick}
|
|
8676
|
+
>
|
|
8677
|
+
<axebow-icon iconName="cancel" iconColor="currentColor" size="lg"></axebow-icon>
|
|
8678
|
+
</button>
|
|
8679
|
+
` : ""}
|
|
8680
|
+
${this.showDropdown ? html`
|
|
8681
|
+
<button
|
|
8682
|
+
type="button"
|
|
8683
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#78787A]"
|
|
8684
|
+
@click=${this._handleDropdownClick}
|
|
8685
|
+
>
|
|
8686
|
+
<axebow-icon
|
|
8687
|
+
iconName="keyboard_arrow_down"
|
|
8688
|
+
iconColor="var(--axebow-tertiary)"
|
|
8689
|
+
size="xl"
|
|
8690
|
+
class="transition-transform duration-200 ${this._isDropdownOpen ? "rotate-180" : ""}"
|
|
8691
|
+
></axebow-icon>
|
|
8692
|
+
</button>
|
|
8693
|
+
` : ""}
|
|
8694
|
+
</div>
|
|
8695
|
+
</div>
|
|
8696
|
+
|
|
8697
|
+
<!-- Dropdown Menu Overlay -->
|
|
8698
|
+
${this.showDropdown && this._isDropdownOpen && this.options && this.options.length > 0 ? html`
|
|
8699
|
+
<div
|
|
8700
|
+
class="absolute left-0 top-full mt-1 w-full bg-white border border-[#DBDDE4] rounded-md shadow-lg z-50 max-h-48 overflow-y-auto py-1 box-border"
|
|
8701
|
+
>
|
|
8702
|
+
${this.options.map((opt) => {
|
|
8703
|
+
const isSelected = opt === this.value;
|
|
8704
|
+
return html`
|
|
8705
|
+
<div
|
|
8706
|
+
class="px-3 py-1.5 text-sm text-[#1E293B] hover:bg-[#F0F1F5] cursor-pointer transition-colors flex items-center justify-between ${isSelected ? "font-semibold bg-[#F0F1F5] text-[#006BFF]" : ""}"
|
|
8707
|
+
@click=${(e) => this._selectOption(opt, e)}
|
|
8708
|
+
>
|
|
8709
|
+
<span>${opt}</span>
|
|
8710
|
+
${isSelected ? html`<axebow-icon iconName="check" iconColor="#006BFF" size="sm"></axebow-icon>` : ""}
|
|
8711
|
+
</div>
|
|
8712
|
+
`;
|
|
8713
|
+
})}
|
|
8714
|
+
</div>
|
|
8715
|
+
` : ""}
|
|
8716
|
+
</div>
|
|
8717
|
+
`;
|
|
8718
|
+
}
|
|
8719
|
+
};
|
|
8720
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "styleVariant", void 0);
|
|
8721
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "disabled", void 0);
|
|
8722
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "label", void 0);
|
|
8723
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "value", void 0);
|
|
8724
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "mandatory", void 0);
|
|
8725
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "showDropdown", void 0);
|
|
8726
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "showCloseIcon", void 0);
|
|
8727
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "placeholderCopy", void 0);
|
|
8728
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "showActionIcon", void 0);
|
|
8729
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "actionIcon", void 0);
|
|
8730
|
+
__decorate([property({ type: Boolean })], AxebowFormPanelField.prototype, "showSecondaryActionIcon", void 0);
|
|
8731
|
+
__decorate([property({ type: String })], AxebowFormPanelField.prototype, "secondaryActionIcon", void 0);
|
|
8732
|
+
__decorate([property({ type: Array })], AxebowFormPanelField.prototype, "options", void 0);
|
|
8733
|
+
__decorate([state()], AxebowFormPanelField.prototype, "_isDropdownOpen", void 0);
|
|
8734
|
+
AxebowFormPanelField = __decorate([customElement("axebow-form-panel-field")], AxebowFormPanelField);
|
|
8735
|
+
//#endregion
|
|
8736
|
+
//#region src/components/axebow-box-form/axebow-box-form.ts
|
|
8737
|
+
var AxebowResourceBoxForm = class AxebowResourceBoxForm extends LitElement {
|
|
8738
|
+
constructor(..._args) {
|
|
8739
|
+
super(..._args);
|
|
8740
|
+
this.statusText = "Free";
|
|
8741
|
+
this.statusColor = "#10B981";
|
|
8742
|
+
this.showTrash = true;
|
|
8743
|
+
this.deleting = false;
|
|
8744
|
+
this.items = [];
|
|
8745
|
+
}
|
|
8746
|
+
static {
|
|
8747
|
+
this.styles = unsafeCSS(tailwind_default);
|
|
8748
|
+
}
|
|
8749
|
+
_copyToClipboard(text, e) {
|
|
8750
|
+
e.stopPropagation();
|
|
8751
|
+
if (!text) return;
|
|
8752
|
+
navigator.clipboard.writeText(text);
|
|
8753
|
+
this.dispatchEvent(new CustomEvent("copy", {
|
|
8754
|
+
detail: { text },
|
|
8755
|
+
bubbles: true,
|
|
8756
|
+
composed: true
|
|
8757
|
+
}));
|
|
8758
|
+
}
|
|
8759
|
+
_openLink(url, e) {
|
|
8760
|
+
e?.stopPropagation();
|
|
8761
|
+
if (!url) return;
|
|
8762
|
+
window.open(url, "_blank", "noopener,noreferrer");
|
|
8763
|
+
this.dispatchEvent(new CustomEvent("link-click", {
|
|
8764
|
+
detail: { url },
|
|
8765
|
+
bubbles: true,
|
|
8766
|
+
composed: true
|
|
8767
|
+
}));
|
|
8768
|
+
}
|
|
8769
|
+
_handleDelete() {
|
|
8770
|
+
this.dispatchEvent(new CustomEvent("delete", {
|
|
8771
|
+
bubbles: true,
|
|
8772
|
+
composed: true
|
|
8773
|
+
}));
|
|
8774
|
+
}
|
|
8775
|
+
_renderField(item) {
|
|
8776
|
+
const itemType = item.type || "enabled";
|
|
8777
|
+
if (itemType === "text") return html`
|
|
8778
|
+
<div class="flex flex-col gap-0.5 w-full pt-1">
|
|
8779
|
+
<div class="flex items-center justify-between gap-2 w-full">
|
|
8780
|
+
<span class="text-sm font-semibold text-[#475569] leading-tight flex items-center gap-1">
|
|
8781
|
+
${item.required ? html`<span class="text-[#E93A3A] font-bold">* </span>` : ""}
|
|
8782
|
+
${item.tag || item.value}
|
|
8783
|
+
</span>
|
|
8784
|
+
<div class="flex items-center gap-1.5 shrink-0">
|
|
8785
|
+
${item.canCopy ? html`
|
|
8786
|
+
<button
|
|
8787
|
+
type="button"
|
|
8788
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#006BFF] hover:opacity-80 transition-opacity ml-1"
|
|
8789
|
+
title="Copy"
|
|
8790
|
+
@click=${(e) => this._copyToClipboard(item.value, e)}
|
|
8791
|
+
>
|
|
8792
|
+
<axebow-icon iconName="content_copy" iconColor="#006BFF" size="lg"></axebow-icon>
|
|
8793
|
+
</button>
|
|
8794
|
+
` : ""}
|
|
8795
|
+
${item.canLink ? html`
|
|
8796
|
+
<button
|
|
8797
|
+
type="button"
|
|
8798
|
+
class="p-0 border-0 bg-transparent cursor-pointer flex items-center justify-center text-[#006BFF] hover:opacity-80 transition-opacity"
|
|
8799
|
+
title="Open link"
|
|
8800
|
+
@click=${(e) => this._openLink(item.linkHref || item.value, e)}
|
|
8801
|
+
>
|
|
8802
|
+
<axebow-icon iconName="open_in_new" iconColor="#006BFF" size="lg"></axebow-icon>
|
|
8803
|
+
</button>
|
|
8804
|
+
` : ""}
|
|
8805
|
+
</div>
|
|
8806
|
+
</div>
|
|
8807
|
+
${item.tag && item.value ? html`<p class="m-0 text-sm text-[#64748B] leading-snug break-all font-normal">${item.value}</p>` : ""}
|
|
8808
|
+
</div>
|
|
8809
|
+
`;
|
|
8810
|
+
return html`
|
|
8811
|
+
<axebow-form-panel-field
|
|
8812
|
+
class="w-full"
|
|
8813
|
+
style="width: 100%;"
|
|
8814
|
+
.label=${item.tag}
|
|
8815
|
+
.value=${item.value || ""}
|
|
8816
|
+
.mandatory=${Boolean(item.required)}
|
|
8817
|
+
?disabled=${itemType === "disabled"}
|
|
8818
|
+
.showActionIcon=${Boolean(item.canCopy)}
|
|
8819
|
+
actionIcon="content_copy"
|
|
8820
|
+
.showSecondaryActionIcon=${Boolean(item.canLink)}
|
|
8821
|
+
secondaryActionIcon="open_in_new"
|
|
8822
|
+
.showDropdown=${Boolean(item.options && item.options.length > 0)}
|
|
8823
|
+
.options=${item.options || []}
|
|
8824
|
+
@change=${(e) => {
|
|
8825
|
+
item.value = e.detail?.value ?? e.target.value;
|
|
8826
|
+
this.dispatchEvent(new CustomEvent("item-change", {
|
|
8827
|
+
detail: { item },
|
|
8828
|
+
bubbles: true,
|
|
8829
|
+
composed: true
|
|
8830
|
+
}));
|
|
8831
|
+
}}
|
|
8832
|
+
@action-click=${(e) => this._copyToClipboard(item.value, e)}
|
|
8833
|
+
@secondary-action-click=${(e) => this._openLink(item.linkHref || item.value, e)}
|
|
8834
|
+
></axebow-form-panel-field>
|
|
8835
|
+
`;
|
|
8836
|
+
}
|
|
8837
|
+
render() {
|
|
8838
|
+
return html`
|
|
8839
|
+
<div class="flex flex-col gap-3 w-[270px] p-4 bg-white rounded-xl border border-[#E2E8F0] shadow-sm box-border">
|
|
8840
|
+
<!-- Top Status Header -->
|
|
8841
|
+
<axebow-status
|
|
8842
|
+
.statusText=${this.statusText}
|
|
8843
|
+
.statusColor=${this.statusColor}
|
|
8844
|
+
?showTrash=${this.showTrash}
|
|
8845
|
+
?deleting=${this.deleting}
|
|
8846
|
+
@delete=${this._handleDelete}
|
|
8847
|
+
></axebow-status>
|
|
8848
|
+
|
|
8849
|
+
<!-- Form Fields List -->
|
|
8850
|
+
<div class="flex flex-col gap-2.5 w-full">
|
|
8851
|
+
${this.items && this.items.length > 0 ? this.items.map((item) => this._renderField(item)) : html`
|
|
8852
|
+
<div class="p-3 border border-dashed border-[#CBD5E1] rounded-lg text-center text-[#94A3B8] text-xs">
|
|
8853
|
+
No items configured.
|
|
8854
|
+
</div>
|
|
8855
|
+
`}
|
|
8856
|
+
</div>
|
|
8857
|
+
</div>
|
|
8858
|
+
`;
|
|
8859
|
+
}
|
|
8860
|
+
};
|
|
8861
|
+
__decorate([property({ type: String })], AxebowResourceBoxForm.prototype, "statusText", void 0);
|
|
8862
|
+
__decorate([property({ type: String })], AxebowResourceBoxForm.prototype, "statusColor", void 0);
|
|
8863
|
+
__decorate([property({ type: Boolean })], AxebowResourceBoxForm.prototype, "showTrash", void 0);
|
|
8864
|
+
__decorate([property({ type: Boolean })], AxebowResourceBoxForm.prototype, "deleting", void 0);
|
|
8865
|
+
__decorate([property({ type: Array })], AxebowResourceBoxForm.prototype, "items", void 0);
|
|
8866
|
+
AxebowResourceBoxForm = __decorate([customElement("axebow-resource-box-form")], AxebowResourceBoxForm);
|
|
8867
|
+
//#endregion
|
|
8868
|
+
export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBanner, AxebowBaseCard, AxebowBreadcrumbHeader, AxebowButton, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarouselInput, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDragDropUploadFile, AxebowDraggableService, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowHeader, AxebowHelpBubble, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowLimitsCounter, AxebowMarketplaceCard, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowPill, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourcesCounter, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSelectInput, AxebowSelectorSlider, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryKeyValue, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowTabSelector, AxebowTenantCard, AxebowTenantResourceTable, AxebowTextInput, AxebowTooltip, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, axebowTheme, buildAddButton, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon };
|
|
8096
8869
|
|
|
8097
8870
|
//# sourceMappingURL=index.js.map
|