@kumori/aurora-wui-components 0.0.269-dev4124.6 → 0.0.269-dev4124.7
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-registry-selector/axebow-registry-selector.d.ts +49 -0
- package/dist/components/axebow-registry-selector/axebow-registry-selector.d.ts.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +369 -174
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { LitElement, TemplateResult } from 'lit';
|
|
2
|
+
import { CarouselItem } from '../axebow-input/axebow-carousel-input.js';
|
|
3
|
+
export interface RegistrySelectorLabels {
|
|
4
|
+
registryLabel: string;
|
|
5
|
+
registryDescription: string;
|
|
6
|
+
defaultRegistryTabLabel: string;
|
|
7
|
+
oneShotRegistryTabLabel: string;
|
|
8
|
+
oneShotRegistryDescription: string;
|
|
9
|
+
registryUrlLabel: string;
|
|
10
|
+
registryUrlPlaceholder: string;
|
|
11
|
+
registryUrlInvalidLabel: string;
|
|
12
|
+
registryCredentialsLabel: string;
|
|
13
|
+
registryCredentialsPlaceholder: string;
|
|
14
|
+
createNewSecretLabel: string;
|
|
15
|
+
noSecretsAvailableLabel: string;
|
|
16
|
+
}
|
|
17
|
+
export interface RegistrySecretOption {
|
|
18
|
+
name: string;
|
|
19
|
+
}
|
|
20
|
+
export declare class AxebowRegistrySelector extends LitElement {
|
|
21
|
+
static styles: import('lit').CSSResult[];
|
|
22
|
+
disabled: boolean;
|
|
23
|
+
activeTab: number;
|
|
24
|
+
registries: CarouselItem[];
|
|
25
|
+
selectedRegistry: string;
|
|
26
|
+
oneShotRegistryUrl: string;
|
|
27
|
+
oneShotRegistrySecret: string;
|
|
28
|
+
secrets: RegistrySecretOption[];
|
|
29
|
+
labels: RegistrySelectorLabels;
|
|
30
|
+
onTabChange?: (index: number) => void;
|
|
31
|
+
onRegistrySelect?: (registry: CarouselItem) => void;
|
|
32
|
+
onRegistryUrlChange?: (value: string) => void;
|
|
33
|
+
onRegistrySecretSelect?: (secretName: string) => void;
|
|
34
|
+
onCreateSecret?: () => void;
|
|
35
|
+
onValidityChange?: (isValid: boolean) => void;
|
|
36
|
+
protected updated(changedProperties: Map<string, unknown>): void;
|
|
37
|
+
private _isRegistrySelected;
|
|
38
|
+
private _secretOptions;
|
|
39
|
+
private _renderRegistryItem;
|
|
40
|
+
private _renderRegistryCarousel;
|
|
41
|
+
private _renderOneShotRegistryInputs;
|
|
42
|
+
render(): TemplateResult<1>;
|
|
43
|
+
}
|
|
44
|
+
declare global {
|
|
45
|
+
interface HTMLElementTagNameMap {
|
|
46
|
+
'axebow-registry-selector': AxebowRegistrySelector;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
//# sourceMappingURL=axebow-registry-selector.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"axebow-registry-selector.d.ts","sourceRoot":"","sources":["../../../src/components/axebow-registry-selector/axebow-registry-selector.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAEvE,OAAO,2DAA2D,CAAC;AACnE,OAAO,2DAA2D,CAAC;AACnE,OAAO,6DAA6D,CAAC;AACrE,OAAO,+BAA+B,CAAC;AACvC,OAAO,+CAA+C,CAAC;AACvD,OAAO,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAIxE,MAAM,WAAW,sBAAsB;IACrC,aAAa,EAAE,MAAM,CAAC;IACtB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,uBAAuB,EAAE,MAAM,CAAC;IAChC,uBAAuB,EAAE,MAAM,CAAC;IAChC,0BAA0B,EAAE,MAAM,CAAC;IACnC,gBAAgB,EAAE,MAAM,CAAC;IACzB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,uBAAuB,EAAE,MAAM,CAAC;IAChC,wBAAwB,EAAE,MAAM,CAAC;IACjC,8BAA8B,EAAE,MAAM,CAAC;IACvC,oBAAoB,EAAE,MAAM,CAAC;IAC7B,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,MAAM,CAAC;CACd;AAYD,qBACa,sBAAuB,SAAQ,UAAU;IACpD,MAAM,CAAC,MAAM,4BAQX;IAE2B,QAAQ,UAAS;IAClB,SAAS,SAAK;IACf,UAAU,EAAE,YAAY,EAAE,CAAM;IAC/B,gBAAgB,SAAM;IACtB,kBAAkB,SAAM;IACxB,qBAAqB,SAAM;IAC5B,OAAO,EAAE,oBAAoB,EAAE,CAAM;IAChC,MAAM,EAAG,sBAAsB,CAAC;IAEhC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IACpD,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,sBAAsB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAE9E,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAOzD,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,mBAAmB;IA2D3B,OAAO,CAAC,uBAAuB;IAe/B,OAAO,CAAC,4BAA4B;IAuDpC,MAAM;CAgBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,sBAAsB,CAAC;KACpD;CACF"}
|
package/dist/index.d.ts
CHANGED
|
@@ -22,6 +22,7 @@ export * from './components/axebow-input/axebow-select-input-with-divider.js';
|
|
|
22
22
|
export * from './components/axebow-input/axebow-plan-select-field.js';
|
|
23
23
|
export * from './components/axebow-input/axebow-tags-input.js';
|
|
24
24
|
export * from './components/axebow-input/axebow-input.js';
|
|
25
|
+
export * from './components/axebow-registry-selector/axebow-registry-selector.js';
|
|
25
26
|
export * from './components/axebow-dialog/axebow-dialog.js';
|
|
26
27
|
export * from './components/axebow-collaborators-dialog/axebow-collaborators-dialog.js';
|
|
27
28
|
export * from './components/axebow-modals-confirmation/axebow-modals-confirmation.js';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -2904,6 +2904,374 @@ __decorate([property({ attribute: false })], AxebowTagsInput.prototype, "onTagsC
|
|
|
2904
2904
|
__decorate([property({ attribute: false })], AxebowTagsInput.prototype, "onCurrentInputChange", void 0);
|
|
2905
2905
|
AxebowTagsInput = __decorate([customElement("axebow-tags-input")], AxebowTagsInput);
|
|
2906
2906
|
//#endregion
|
|
2907
|
+
//#region src/components/axebow-tab-selector/axebow-tab-selector.ts
|
|
2908
|
+
var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
2909
|
+
constructor(..._args) {
|
|
2910
|
+
super(..._args);
|
|
2911
|
+
this.disabled = false;
|
|
2912
|
+
this.bordered = false;
|
|
2913
|
+
this.variant = "forms-tab";
|
|
2914
|
+
this.stretch = true;
|
|
2915
|
+
this._activeTab = 0;
|
|
2916
|
+
this._tabCount = 0;
|
|
2917
|
+
this._tabDisabled = [];
|
|
2918
|
+
this._observer = null;
|
|
2919
|
+
}
|
|
2920
|
+
static {
|
|
2921
|
+
this.styles = [unsafeCSS(tailwind_default), css`
|
|
2922
|
+
:host {
|
|
2923
|
+
display: block;
|
|
2924
|
+
}
|
|
2925
|
+
button {
|
|
2926
|
+
font-family: inherit;
|
|
2927
|
+
}
|
|
2928
|
+
|
|
2929
|
+
/* forms-tab hover underline */
|
|
2930
|
+
button.tab-inactive:not(:disabled) {
|
|
2931
|
+
position: relative;
|
|
2932
|
+
}
|
|
2933
|
+
button.tab-inactive:not(:disabled):hover::after {
|
|
2934
|
+
content: '';
|
|
2935
|
+
position: absolute;
|
|
2936
|
+
bottom: 0;
|
|
2937
|
+
left: 0;
|
|
2938
|
+
right: 0;
|
|
2939
|
+
height: 2px;
|
|
2940
|
+
background-color: var(--axebow-tertiary);
|
|
2941
|
+
border-radius: 1px;
|
|
2942
|
+
}
|
|
2943
|
+
|
|
2944
|
+
:host([disabled]) {
|
|
2945
|
+
opacity: 0.6;
|
|
2946
|
+
pointer-events: none;
|
|
2947
|
+
cursor: not-allowed;
|
|
2948
|
+
}
|
|
2949
|
+
`];
|
|
2950
|
+
}
|
|
2951
|
+
connectedCallback() {
|
|
2952
|
+
super.connectedCallback();
|
|
2953
|
+
this._observer = new MutationObserver(() => this._updateTabCount());
|
|
2954
|
+
this._observer.observe(this, {
|
|
2955
|
+
childList: true,
|
|
2956
|
+
attributes: true,
|
|
2957
|
+
attributeFilter: ["disabled"],
|
|
2958
|
+
subtree: true
|
|
2959
|
+
});
|
|
2960
|
+
this._updateTabCount();
|
|
2961
|
+
}
|
|
2962
|
+
disconnectedCallback() {
|
|
2963
|
+
super.disconnectedCallback();
|
|
2964
|
+
this._observer?.disconnect();
|
|
2965
|
+
}
|
|
2966
|
+
firstUpdated() {
|
|
2967
|
+
this._updateTabCount();
|
|
2968
|
+
}
|
|
2969
|
+
updated(changedProperties) {
|
|
2970
|
+
if (changedProperties.has("activeTab") && this.activeTab !== void 0 && this._activeTab !== this.activeTab) this._activeTab = this.activeTab;
|
|
2971
|
+
if (changedProperties.has("disabled")) this.toggleAttribute("disabled", this.disabled);
|
|
2972
|
+
}
|
|
2973
|
+
_updateTabCount() {
|
|
2974
|
+
const count = Array.from(this.children).filter((el) => el.getAttribute("slot")?.startsWith("tab-label-")).length;
|
|
2975
|
+
if (count !== this._tabCount) {
|
|
2976
|
+
if (this._activeTab >= count) this._activeTab = 0;
|
|
2977
|
+
this._tabCount = count;
|
|
2978
|
+
}
|
|
2979
|
+
this._tabDisabled = Array.from({ length: this._tabCount }, (_, i) => {
|
|
2980
|
+
return this.querySelector(`[slot="tab-label-${i}"]`)?.hasAttribute("disabled") ?? false;
|
|
2981
|
+
});
|
|
2982
|
+
}
|
|
2983
|
+
_selectTab(index) {
|
|
2984
|
+
if (this.disabled || this._tabDisabled[index]) return;
|
|
2985
|
+
this._activeTab = index;
|
|
2986
|
+
this.dispatchEvent(new CustomEvent("tab-change", {
|
|
2987
|
+
detail: { index },
|
|
2988
|
+
bubbles: true,
|
|
2989
|
+
composed: true
|
|
2990
|
+
}));
|
|
2991
|
+
}
|
|
2992
|
+
_renderFormsTab(tabs) {
|
|
2993
|
+
const isFirstActive = this._activeTab === 0;
|
|
2994
|
+
const isLastActive = this._activeTab === this._tabCount - 1;
|
|
2995
|
+
return html`
|
|
2996
|
+
<div class="w-full max-w-194.25 rounded-xl box-border">
|
|
2997
|
+
<div class="w-full h-8 flex bg-(--axebow-base) gap-1 rounded-t-xl box-border">
|
|
2998
|
+
${tabs.map((i) => {
|
|
2999
|
+
const active = this._activeTab === i;
|
|
3000
|
+
const isDisabled = this._tabDisabled[i];
|
|
3001
|
+
return html`
|
|
3002
|
+
<button
|
|
3003
|
+
class="flex-1 h-8 flex items-center justify-center gap-2 transition-colors duration-200 font-medium
|
|
3004
|
+
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
3005
|
+
${isDisabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}
|
|
3006
|
+
${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"}"
|
|
3007
|
+
?disabled=${isDisabled}
|
|
3008
|
+
@click=${() => this._selectTab(i)}
|
|
3009
|
+
>
|
|
3010
|
+
<axebow-icon
|
|
3011
|
+
iconName="${active ? "radio_button_checked" : "radio_button_unchecked"}"
|
|
3012
|
+
iconColor="var(--axebow-tertiary)"
|
|
3013
|
+
size="base"
|
|
3014
|
+
></axebow-icon>
|
|
3015
|
+
<slot name="tab-label-${i}"></slot>
|
|
3016
|
+
</button>
|
|
3017
|
+
`;
|
|
3018
|
+
})}
|
|
3019
|
+
</div>
|
|
3020
|
+
|
|
3021
|
+
<div
|
|
3022
|
+
class="w-full min-h-35 p-4 bg-white rounded-b-xl box-border ${isFirstActive ? "" : "rounded-tl-xl"} ${isLastActive ? "" : "rounded-tr-xl"} ${this.bordered ? "border-l border-r border-b border-(--axebow-table-header-border)" : ""}"
|
|
3023
|
+
>
|
|
3024
|
+
${tabs.map((i) => html`
|
|
3025
|
+
<div class="${this._activeTab === i ? "block" : "hidden"}">
|
|
3026
|
+
<slot name="tab-panel-${i}"></slot>
|
|
3027
|
+
</div>
|
|
3028
|
+
`)}
|
|
3029
|
+
</div>
|
|
3030
|
+
</div>
|
|
3031
|
+
`;
|
|
3032
|
+
}
|
|
3033
|
+
_renderSectionsTab(tabs) {
|
|
3034
|
+
return html`
|
|
3035
|
+
<div class="flex w-full">
|
|
3036
|
+
${tabs.map((i) => {
|
|
3037
|
+
const active = this._activeTab === i;
|
|
3038
|
+
const isDisabled = this._tabDisabled[i];
|
|
3039
|
+
return html`
|
|
3040
|
+
<button
|
|
3041
|
+
class="${this.stretch ? "flex-1" : "px-4"} h-8 flex items-center justify-center text-sm font-medium bg-transparent
|
|
3042
|
+
transition-colors duration-200
|
|
3043
|
+
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
3044
|
+
${isDisabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}
|
|
3045
|
+
${active ? "text-[#344966] border-b-2 border-solid border-[#344966] border-t-0 border-l-0 border-r-0" : "text-(--axebow-secondary) border-b border-solid border-(--axebow-light-gray) border-t-0 border-l-0 border-r-0 hover:text-(--axebow-tertiary)"}"
|
|
3046
|
+
?disabled=${isDisabled}
|
|
3047
|
+
@click=${() => this._selectTab(i)}
|
|
3048
|
+
>
|
|
3049
|
+
<slot name="tab-label-${i}"></slot>
|
|
3050
|
+
</button>
|
|
3051
|
+
`;
|
|
3052
|
+
})}
|
|
3053
|
+
${!this.stretch ? html`<div class="flex-1 border-b border-solid border-(--axebow-light-gray) border-t-0 border-l-0 border-r-0"></div>` : ""}
|
|
3054
|
+
</div>
|
|
3055
|
+
${tabs.map((i) => html`
|
|
3056
|
+
<div class="${this._activeTab === i ? "block" : "hidden"}">
|
|
3057
|
+
<slot name="tab-panel-${i}"></slot>
|
|
3058
|
+
</div>
|
|
3059
|
+
`)}
|
|
3060
|
+
`;
|
|
3061
|
+
}
|
|
3062
|
+
render() {
|
|
3063
|
+
const tabs = Array.from({ length: this._tabCount }, (_, i) => i);
|
|
3064
|
+
return this.variant === "sections-tab" ? this._renderSectionsTab(tabs) : this._renderFormsTab(tabs);
|
|
3065
|
+
}
|
|
3066
|
+
};
|
|
3067
|
+
__decorate([property({
|
|
3068
|
+
type: Boolean,
|
|
3069
|
+
attribute: false
|
|
3070
|
+
})], AxebowTabSelector.prototype, "disabled", void 0);
|
|
3071
|
+
__decorate([property({ type: Number })], AxebowTabSelector.prototype, "activeTab", void 0);
|
|
3072
|
+
__decorate([property({ type: Boolean })], AxebowTabSelector.prototype, "bordered", void 0);
|
|
3073
|
+
__decorate([property({ type: String })], AxebowTabSelector.prototype, "variant", void 0);
|
|
3074
|
+
__decorate([property({ type: Boolean })], AxebowTabSelector.prototype, "stretch", void 0);
|
|
3075
|
+
__decorate([state()], AxebowTabSelector.prototype, "_activeTab", void 0);
|
|
3076
|
+
__decorate([state()], AxebowTabSelector.prototype, "_tabCount", void 0);
|
|
3077
|
+
__decorate([state()], AxebowTabSelector.prototype, "_tabDisabled", void 0);
|
|
3078
|
+
AxebowTabSelector = __decorate([customElement("axebow-tab-selector")], AxebowTabSelector);
|
|
3079
|
+
//#endregion
|
|
3080
|
+
//#region src/components/axebow-registry-selector/axebow-registry-selector.ts
|
|
3081
|
+
function isValidRegistryUrl(value) {
|
|
3082
|
+
if (!value) return true;
|
|
3083
|
+
try {
|
|
3084
|
+
const urlToParse = value.includes("://") ? value : `https://${value}`;
|
|
3085
|
+
return new URL(urlToParse).hostname.includes(".");
|
|
3086
|
+
} catch {
|
|
3087
|
+
return false;
|
|
3088
|
+
}
|
|
3089
|
+
}
|
|
3090
|
+
var AxebowRegistrySelector = class AxebowRegistrySelector extends LitElement {
|
|
3091
|
+
constructor(..._args) {
|
|
3092
|
+
super(..._args);
|
|
3093
|
+
this.disabled = false;
|
|
3094
|
+
this.activeTab = 0;
|
|
3095
|
+
this.registries = [];
|
|
3096
|
+
this.selectedRegistry = "";
|
|
3097
|
+
this.oneShotRegistryUrl = "";
|
|
3098
|
+
this.oneShotRegistrySecret = "";
|
|
3099
|
+
this.secrets = [];
|
|
3100
|
+
}
|
|
3101
|
+
static {
|
|
3102
|
+
this.styles = [
|
|
3103
|
+
unsafeCSS(tailwind_default),
|
|
3104
|
+
axebowTheme,
|
|
3105
|
+
css`
|
|
3106
|
+
:host {
|
|
3107
|
+
display: block;
|
|
3108
|
+
}
|
|
3109
|
+
`
|
|
3110
|
+
];
|
|
3111
|
+
}
|
|
3112
|
+
updated(changedProperties) {
|
|
3113
|
+
super.updated(changedProperties);
|
|
3114
|
+
if (changedProperties.has("oneShotRegistryUrl") || changedProperties.has("activeTab")) this.onValidityChange?.(this.activeTab !== 1 || isValidRegistryUrl(this.oneShotRegistryUrl));
|
|
3115
|
+
}
|
|
3116
|
+
_isRegistrySelected(registry) {
|
|
3117
|
+
return !!registry.registry && registry.registry === this.selectedRegistry;
|
|
3118
|
+
}
|
|
3119
|
+
_secretOptions() {
|
|
3120
|
+
const options = [...this.secrets];
|
|
3121
|
+
if (this.oneShotRegistrySecret && !options.some((s) => s.name === this.oneShotRegistrySecret)) options.push({ name: this.oneShotRegistrySecret });
|
|
3122
|
+
return options;
|
|
3123
|
+
}
|
|
3124
|
+
_renderRegistryItem(registry) {
|
|
3125
|
+
const isSelected = this._isRegistrySelected(registry);
|
|
3126
|
+
return html`
|
|
3127
|
+
<style>
|
|
3128
|
+
.registry-card {
|
|
3129
|
+
position: relative;
|
|
3130
|
+
gap: calc(var(--spacing) * 0.5);
|
|
3131
|
+
border-color: var(--color-gray-200);
|
|
3132
|
+
background-color: transparent;
|
|
3133
|
+
}
|
|
3134
|
+
@media (min-width: 48rem) {
|
|
3135
|
+
.registry-card {
|
|
3136
|
+
gap: var(--spacing);
|
|
3137
|
+
}
|
|
3138
|
+
}
|
|
3139
|
+
@media (min-width: 64rem) {
|
|
3140
|
+
.registry-card {
|
|
3141
|
+
gap: calc(var(--spacing) * 2);
|
|
3142
|
+
}
|
|
3143
|
+
}
|
|
3144
|
+
.registry-card.selected {
|
|
3145
|
+
border-color: var(--axebow-primary);
|
|
3146
|
+
background-color: var(--axebow-white);
|
|
3147
|
+
}
|
|
3148
|
+
.registry-logo {
|
|
3149
|
+
height: calc(var(--spacing) * 3);
|
|
3150
|
+
aspect-ratio: 1 / 1;
|
|
3151
|
+
object-fit: contain;
|
|
3152
|
+
}
|
|
3153
|
+
@media (min-width: 64rem) {
|
|
3154
|
+
.registry-logo {
|
|
3155
|
+
height: calc(var(--spacing) * 6);
|
|
3156
|
+
}
|
|
3157
|
+
}
|
|
3158
|
+
</style>
|
|
3159
|
+
<sl-carousel-item>
|
|
3160
|
+
<div
|
|
3161
|
+
class="registry-card rounded-lg border-2 border-solid cursor-pointer p-2 text-center transition-all duration-300 ease-in-out flex items-center justify-center ${isSelected ? "selected" : ""}"
|
|
3162
|
+
@click=${() => {
|
|
3163
|
+
if (!this.disabled) this.onRegistrySelect?.(registry);
|
|
3164
|
+
}}
|
|
3165
|
+
>
|
|
3166
|
+
<img class="registry-logo" src="${registry.content}" alt="${registry.id}" />
|
|
3167
|
+
<p>${registry.id}</p>
|
|
3168
|
+
${isSelected ? html`
|
|
3169
|
+
<div class="absolute top-1 right-1 w-4.5 h-4.5 flex items-center justify-center">
|
|
3170
|
+
<axebow-icon iconName="check_circle" filled iconColor="var(--axebow-primary)" size="xl"></axebow-icon>
|
|
3171
|
+
</div>
|
|
3172
|
+
` : ""}
|
|
3173
|
+
</div>
|
|
3174
|
+
</sl-carousel-item>
|
|
3175
|
+
`;
|
|
3176
|
+
}
|
|
3177
|
+
_renderRegistryCarousel() {
|
|
3178
|
+
return html`
|
|
3179
|
+
<axebow-input
|
|
3180
|
+
.disabled=${this.disabled}
|
|
3181
|
+
label="${this.labels.registryLabel}"
|
|
3182
|
+
required
|
|
3183
|
+
description="${this.labels.registryDescription}"
|
|
3184
|
+
controlType="carousel"
|
|
3185
|
+
.value="${this.selectedRegistry}"
|
|
3186
|
+
.carouselItems="${this.registries}"
|
|
3187
|
+
.carouselItemRenderer=${(registry) => this._renderRegistryItem(registry)}
|
|
3188
|
+
></axebow-input>
|
|
3189
|
+
`;
|
|
3190
|
+
}
|
|
3191
|
+
_renderOneShotRegistryInputs() {
|
|
3192
|
+
const secretOptions = this._secretOptions();
|
|
3193
|
+
const urlValid = isValidRegistryUrl(this.oneShotRegistryUrl);
|
|
3194
|
+
return html`
|
|
3195
|
+
<div class="flex flex-col gap-4">
|
|
3196
|
+
<p>${this.labels.oneShotRegistryDescription}</p>
|
|
3197
|
+
<div class="flex gap-[2%] w-full">
|
|
3198
|
+
<div class="flex-1 min-w-0">
|
|
3199
|
+
<axebow-input
|
|
3200
|
+
label="${this.labels.registryUrlLabel}"
|
|
3201
|
+
placeholder="${this.labels.registryUrlPlaceholder}"
|
|
3202
|
+
required
|
|
3203
|
+
.value="${this.oneShotRegistryUrl}"
|
|
3204
|
+
.hasError="${!urlValid}"
|
|
3205
|
+
.errorMessage="${this.labels.registryUrlInvalidLabel}"
|
|
3206
|
+
.callback=${(e) => this.onRegistryUrlChange?.(e.target.value)}
|
|
3207
|
+
maxlength="500"
|
|
3208
|
+
></axebow-input>
|
|
3209
|
+
</div>
|
|
3210
|
+
<div class="flex-1 min-w-0 flex flex-col">
|
|
3211
|
+
<div class="flex items-baseline gap-2" style="height: 1.0625rem; margin-bottom: 0.25rem;">
|
|
3212
|
+
<h4 class="font-semibold text-base leading-4.25 m-0 overflow-hidden text-ellipsis">
|
|
3213
|
+
${this.labels.registryCredentialsLabel}
|
|
3214
|
+
</h4>
|
|
3215
|
+
</div>
|
|
3216
|
+
<sl-select
|
|
3217
|
+
placeholder="${this.labels.registryCredentialsPlaceholder}"
|
|
3218
|
+
clearable
|
|
3219
|
+
hoist
|
|
3220
|
+
.value="${this.oneShotRegistrySecret}"
|
|
3221
|
+
@sl-change=${(e) => this.onRegistrySecretSelect?.(e.target.value)}
|
|
3222
|
+
>
|
|
3223
|
+
<div
|
|
3224
|
+
class="flex items-center gap-2 cursor-pointer px-4 py-1"
|
|
3225
|
+
@click=${(e) => {
|
|
3226
|
+
e.stopPropagation();
|
|
3227
|
+
this.onCreateSecret?.();
|
|
3228
|
+
}}
|
|
3229
|
+
>
|
|
3230
|
+
<axebow-icon iconName="add" iconColor="var(--axebow-tertiary)" size="md"></axebow-icon>
|
|
3231
|
+
${this.labels.createNewSecretLabel}
|
|
3232
|
+
</div>
|
|
3233
|
+
${secretOptions.length > 0 ? html`<sl-divider></sl-divider>` : ""}
|
|
3234
|
+
${secretOptions.map((s) => html`<sl-option value="${s.name}">${s.name}</sl-option>`)}
|
|
3235
|
+
${secretOptions.length === 0 ? html`<sl-option disabled>${this.labels.noSecretsAvailableLabel}</sl-option>` : ""}
|
|
3236
|
+
</sl-select>
|
|
3237
|
+
</div>
|
|
3238
|
+
</div>
|
|
3239
|
+
</div>
|
|
3240
|
+
`;
|
|
3241
|
+
}
|
|
3242
|
+
render() {
|
|
3243
|
+
return html`
|
|
3244
|
+
<axebow-tab-selector
|
|
3245
|
+
class="w-full"
|
|
3246
|
+
.disabled=${this.disabled}
|
|
3247
|
+
.activeTab=${this.activeTab}
|
|
3248
|
+
@tab-change=${(e) => this.onTabChange?.(e.detail.index)}
|
|
3249
|
+
>
|
|
3250
|
+
<span slot="tab-label-0">${this.labels.defaultRegistryTabLabel}</span>
|
|
3251
|
+
<div slot="tab-panel-0">${this._renderRegistryCarousel()}</div>
|
|
3252
|
+
|
|
3253
|
+
<span slot="tab-label-1">${this.labels.oneShotRegistryTabLabel}</span>
|
|
3254
|
+
<div slot="tab-panel-1">${this._renderOneShotRegistryInputs()}</div>
|
|
3255
|
+
</axebow-tab-selector>
|
|
3256
|
+
`;
|
|
3257
|
+
}
|
|
3258
|
+
};
|
|
3259
|
+
__decorate([property({ type: Boolean })], AxebowRegistrySelector.prototype, "disabled", void 0);
|
|
3260
|
+
__decorate([property({ type: Number })], AxebowRegistrySelector.prototype, "activeTab", void 0);
|
|
3261
|
+
__decorate([property({ type: Array })], AxebowRegistrySelector.prototype, "registries", void 0);
|
|
3262
|
+
__decorate([property({ type: String })], AxebowRegistrySelector.prototype, "selectedRegistry", void 0);
|
|
3263
|
+
__decorate([property({ type: String })], AxebowRegistrySelector.prototype, "oneShotRegistryUrl", void 0);
|
|
3264
|
+
__decorate([property({ type: String })], AxebowRegistrySelector.prototype, "oneShotRegistrySecret", void 0);
|
|
3265
|
+
__decorate([property({ type: Array })], AxebowRegistrySelector.prototype, "secrets", void 0);
|
|
3266
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "labels", void 0);
|
|
3267
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onTabChange", void 0);
|
|
3268
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onRegistrySelect", void 0);
|
|
3269
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onRegistryUrlChange", void 0);
|
|
3270
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onRegistrySecretSelect", void 0);
|
|
3271
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onCreateSecret", void 0);
|
|
3272
|
+
__decorate([property({ attribute: false })], AxebowRegistrySelector.prototype, "onValidityChange", void 0);
|
|
3273
|
+
AxebowRegistrySelector = __decorate([customElement("axebow-registry-selector")], AxebowRegistrySelector);
|
|
3274
|
+
//#endregion
|
|
2907
3275
|
//#region src/components/axebow-dialog/axebow-dialog.ts
|
|
2908
3276
|
var AxebowDialog = class AxebowDialog extends LitElement {
|
|
2909
3277
|
constructor(..._args) {
|
|
@@ -8550,179 +8918,6 @@ __decorate([property({ type: String })], AxebowStepHeader.prototype, "stepLabel"
|
|
|
8550
8918
|
__decorate([property({ type: String })], AxebowStepHeader.prototype, "ofLabel", void 0);
|
|
8551
8919
|
AxebowStepHeader = __decorate([customElement("axebow-step-header")], AxebowStepHeader);
|
|
8552
8920
|
//#endregion
|
|
8553
|
-
//#region src/components/axebow-tab-selector/axebow-tab-selector.ts
|
|
8554
|
-
var AxebowTabSelector = class AxebowTabSelector extends LitElement {
|
|
8555
|
-
constructor(..._args) {
|
|
8556
|
-
super(..._args);
|
|
8557
|
-
this.disabled = false;
|
|
8558
|
-
this.bordered = false;
|
|
8559
|
-
this.variant = "forms-tab";
|
|
8560
|
-
this.stretch = true;
|
|
8561
|
-
this._activeTab = 0;
|
|
8562
|
-
this._tabCount = 0;
|
|
8563
|
-
this._tabDisabled = [];
|
|
8564
|
-
this._observer = null;
|
|
8565
|
-
}
|
|
8566
|
-
static {
|
|
8567
|
-
this.styles = [unsafeCSS(tailwind_default), css`
|
|
8568
|
-
:host {
|
|
8569
|
-
display: block;
|
|
8570
|
-
}
|
|
8571
|
-
button {
|
|
8572
|
-
font-family: inherit;
|
|
8573
|
-
}
|
|
8574
|
-
|
|
8575
|
-
/* forms-tab hover underline */
|
|
8576
|
-
button.tab-inactive:not(:disabled) {
|
|
8577
|
-
position: relative;
|
|
8578
|
-
}
|
|
8579
|
-
button.tab-inactive:not(:disabled):hover::after {
|
|
8580
|
-
content: '';
|
|
8581
|
-
position: absolute;
|
|
8582
|
-
bottom: 0;
|
|
8583
|
-
left: 0;
|
|
8584
|
-
right: 0;
|
|
8585
|
-
height: 2px;
|
|
8586
|
-
background-color: var(--axebow-tertiary);
|
|
8587
|
-
border-radius: 1px;
|
|
8588
|
-
}
|
|
8589
|
-
|
|
8590
|
-
:host([disabled]) {
|
|
8591
|
-
opacity: 0.6;
|
|
8592
|
-
pointer-events: none;
|
|
8593
|
-
cursor: not-allowed;
|
|
8594
|
-
}
|
|
8595
|
-
`];
|
|
8596
|
-
}
|
|
8597
|
-
connectedCallback() {
|
|
8598
|
-
super.connectedCallback();
|
|
8599
|
-
this._observer = new MutationObserver(() => this._updateTabCount());
|
|
8600
|
-
this._observer.observe(this, {
|
|
8601
|
-
childList: true,
|
|
8602
|
-
attributes: true,
|
|
8603
|
-
attributeFilter: ["disabled"],
|
|
8604
|
-
subtree: true
|
|
8605
|
-
});
|
|
8606
|
-
this._updateTabCount();
|
|
8607
|
-
}
|
|
8608
|
-
disconnectedCallback() {
|
|
8609
|
-
super.disconnectedCallback();
|
|
8610
|
-
this._observer?.disconnect();
|
|
8611
|
-
}
|
|
8612
|
-
firstUpdated() {
|
|
8613
|
-
this._updateTabCount();
|
|
8614
|
-
}
|
|
8615
|
-
updated(changedProperties) {
|
|
8616
|
-
if (changedProperties.has("activeTab") && this.activeTab !== void 0 && this._activeTab !== this.activeTab) this._activeTab = this.activeTab;
|
|
8617
|
-
if (changedProperties.has("disabled")) this.toggleAttribute("disabled", this.disabled);
|
|
8618
|
-
}
|
|
8619
|
-
_updateTabCount() {
|
|
8620
|
-
const count = Array.from(this.children).filter((el) => el.getAttribute("slot")?.startsWith("tab-label-")).length;
|
|
8621
|
-
if (count !== this._tabCount) {
|
|
8622
|
-
if (this._activeTab >= count) this._activeTab = 0;
|
|
8623
|
-
this._tabCount = count;
|
|
8624
|
-
}
|
|
8625
|
-
this._tabDisabled = Array.from({ length: this._tabCount }, (_, i) => {
|
|
8626
|
-
return this.querySelector(`[slot="tab-label-${i}"]`)?.hasAttribute("disabled") ?? false;
|
|
8627
|
-
});
|
|
8628
|
-
}
|
|
8629
|
-
_selectTab(index) {
|
|
8630
|
-
if (this.disabled || this._tabDisabled[index]) return;
|
|
8631
|
-
this._activeTab = index;
|
|
8632
|
-
this.dispatchEvent(new CustomEvent("tab-change", {
|
|
8633
|
-
detail: { index },
|
|
8634
|
-
bubbles: true,
|
|
8635
|
-
composed: true
|
|
8636
|
-
}));
|
|
8637
|
-
}
|
|
8638
|
-
_renderFormsTab(tabs) {
|
|
8639
|
-
const isFirstActive = this._activeTab === 0;
|
|
8640
|
-
const isLastActive = this._activeTab === this._tabCount - 1;
|
|
8641
|
-
return html`
|
|
8642
|
-
<div class="w-full max-w-194.25 rounded-xl box-border">
|
|
8643
|
-
<div class="w-full h-8 flex bg-(--axebow-base) gap-1 rounded-t-xl box-border">
|
|
8644
|
-
${tabs.map((i) => {
|
|
8645
|
-
const active = this._activeTab === i;
|
|
8646
|
-
const isDisabled = this._tabDisabled[i];
|
|
8647
|
-
return html`
|
|
8648
|
-
<button
|
|
8649
|
-
class="flex-1 h-8 flex items-center justify-center gap-2 transition-colors duration-200 font-medium
|
|
8650
|
-
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
8651
|
-
${isDisabled ? "opacity-60 cursor-not-allowed" : "cursor-pointer"}
|
|
8652
|
-
${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"}"
|
|
8653
|
-
?disabled=${isDisabled}
|
|
8654
|
-
@click=${() => this._selectTab(i)}
|
|
8655
|
-
>
|
|
8656
|
-
<axebow-icon
|
|
8657
|
-
iconName="${active ? "radio_button_checked" : "radio_button_unchecked"}"
|
|
8658
|
-
iconColor="var(--axebow-tertiary)"
|
|
8659
|
-
size="base"
|
|
8660
|
-
></axebow-icon>
|
|
8661
|
-
<slot name="tab-label-${i}"></slot>
|
|
8662
|
-
</button>
|
|
8663
|
-
`;
|
|
8664
|
-
})}
|
|
8665
|
-
</div>
|
|
8666
|
-
|
|
8667
|
-
<div
|
|
8668
|
-
class="w-full min-h-35 p-4 bg-white rounded-b-xl box-border ${isFirstActive ? "" : "rounded-tl-xl"} ${isLastActive ? "" : "rounded-tr-xl"} ${this.bordered ? "border-l border-r border-b border-(--axebow-table-header-border)" : ""}"
|
|
8669
|
-
>
|
|
8670
|
-
${tabs.map((i) => html`
|
|
8671
|
-
<div class="${this._activeTab === i ? "block" : "hidden"}">
|
|
8672
|
-
<slot name="tab-panel-${i}"></slot>
|
|
8673
|
-
</div>
|
|
8674
|
-
`)}
|
|
8675
|
-
</div>
|
|
8676
|
-
</div>
|
|
8677
|
-
`;
|
|
8678
|
-
}
|
|
8679
|
-
_renderSectionsTab(tabs) {
|
|
8680
|
-
return html`
|
|
8681
|
-
<div class="flex w-full">
|
|
8682
|
-
${tabs.map((i) => {
|
|
8683
|
-
const active = this._activeTab === i;
|
|
8684
|
-
const isDisabled = this._tabDisabled[i];
|
|
8685
|
-
return html`
|
|
8686
|
-
<button
|
|
8687
|
-
class="${this.stretch ? "flex-1" : "px-4"} h-8 flex items-center justify-center text-sm font-medium bg-transparent
|
|
8688
|
-
transition-colors duration-200
|
|
8689
|
-
focus-visible:outline-2 focus-visible:outline-(--axebow-tertiary)
|
|
8690
|
-
${isDisabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}
|
|
8691
|
-
${active ? "text-[#344966] border-b-2 border-solid border-[#344966] border-t-0 border-l-0 border-r-0" : "text-(--axebow-secondary) border-b border-solid border-(--axebow-light-gray) border-t-0 border-l-0 border-r-0 hover:text-(--axebow-tertiary)"}"
|
|
8692
|
-
?disabled=${isDisabled}
|
|
8693
|
-
@click=${() => this._selectTab(i)}
|
|
8694
|
-
>
|
|
8695
|
-
<slot name="tab-label-${i}"></slot>
|
|
8696
|
-
</button>
|
|
8697
|
-
`;
|
|
8698
|
-
})}
|
|
8699
|
-
${!this.stretch ? html`<div class="flex-1 border-b border-solid border-(--axebow-light-gray) border-t-0 border-l-0 border-r-0"></div>` : ""}
|
|
8700
|
-
</div>
|
|
8701
|
-
${tabs.map((i) => html`
|
|
8702
|
-
<div class="${this._activeTab === i ? "block" : "hidden"}">
|
|
8703
|
-
<slot name="tab-panel-${i}"></slot>
|
|
8704
|
-
</div>
|
|
8705
|
-
`)}
|
|
8706
|
-
`;
|
|
8707
|
-
}
|
|
8708
|
-
render() {
|
|
8709
|
-
const tabs = Array.from({ length: this._tabCount }, (_, i) => i);
|
|
8710
|
-
return this.variant === "sections-tab" ? this._renderSectionsTab(tabs) : this._renderFormsTab(tabs);
|
|
8711
|
-
}
|
|
8712
|
-
};
|
|
8713
|
-
__decorate([property({
|
|
8714
|
-
type: Boolean,
|
|
8715
|
-
attribute: false
|
|
8716
|
-
})], AxebowTabSelector.prototype, "disabled", void 0);
|
|
8717
|
-
__decorate([property({ type: Number })], AxebowTabSelector.prototype, "activeTab", void 0);
|
|
8718
|
-
__decorate([property({ type: Boolean })], AxebowTabSelector.prototype, "bordered", void 0);
|
|
8719
|
-
__decorate([property({ type: String })], AxebowTabSelector.prototype, "variant", void 0);
|
|
8720
|
-
__decorate([property({ type: Boolean })], AxebowTabSelector.prototype, "stretch", void 0);
|
|
8721
|
-
__decorate([state()], AxebowTabSelector.prototype, "_activeTab", void 0);
|
|
8722
|
-
__decorate([state()], AxebowTabSelector.prototype, "_tabCount", void 0);
|
|
8723
|
-
__decorate([state()], AxebowTabSelector.prototype, "_tabDisabled", void 0);
|
|
8724
|
-
AxebowTabSelector = __decorate([customElement("axebow-tab-selector")], AxebowTabSelector);
|
|
8725
|
-
//#endregion
|
|
8726
8921
|
//#region src/components/axebow-underline-tab-selector/axebow-underline-tab-selector.ts
|
|
8727
8922
|
var AxebowUnderlineTabSelector = class AxebowUnderlineTabSelector extends LitElement {
|
|
8728
8923
|
constructor(..._args) {
|
|
@@ -12249,6 +12444,6 @@ __decorate([property({ type: String })], AxebowObservabilityContainer.prototype,
|
|
|
12249
12444
|
__decorate([property({ type: String })], AxebowObservabilityContainer.prototype, "terminalIframeId", void 0);
|
|
12250
12445
|
AxebowObservabilityContainer = __decorate([customElement("axebow-observability-container")], AxebowObservabilityContainer);
|
|
12251
12446
|
//#endregion
|
|
12252
|
-
export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBanner, AxebowBaseCard, AxebowBoxSection, AxebowBreadcrumbHeader, AxebowButton, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarouselInput, AxebowCarouselSelectorItem, AxebowCarouselSelectorTenant, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowCopyBox, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDragDropUploadFile, AxebowDraggableService, AxebowExpandableCard, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowHeader, AxebowHelpBubble, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowInstancesTable, AxebowLimitsCounter, AxebowManageHyperlinks, AxebowMarketplaceCard, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowObservabilityContainer, AxebowPill, AxebowPlanSelectField, AxebowProgressBar, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowRefreshPeriodPanel, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourceLimitInput, AxebowResourceLimitsPanel, AxebowResourcesCounter, AxebowRoleCard, AxebowRoleContainerDropdown, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSearchBarFilters, AxebowSelectInput, AxebowSelectInputWithDivider, AxebowSelectorSlider, AxebowServiceDetailHeader, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryFlavors, AxebowSummaryKeyValue, AxebowSummaryLimits, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowSwitchInput, AxebowTabSelector, AxebowTabsSubmenu, AxebowTagsInput, AxebowTenantCard, AxebowTenantResourceTable, AxebowTenantsTable, AxebowTextInput, AxebowTimeRangePanel, AxebowTooltip, AxebowUndeployCard, AxebowUnderlineTabSelector, AxebowUsageTooltip, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, TableChart, axebowTheme, buildAddButton, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon };
|
|
12447
|
+
export { AxebowActionsFooter, AxebowAdjustmentResourcesCounter, AxebowAlert, AxebowBanner, AxebowBaseCard, AxebowBoxSection, AxebowBreadcrumbHeader, AxebowButton, AxebowCardActionBanner, AxebowCardAttentionBanner, AxebowCardCloudLogo, AxebowCardFilter, AxebowCardFilterItem, AxebowCardFooter, AxebowCardHeader, AxebowCardResourceRow, AxebowCardResourceTable, AxebowCardSpecialLink, AxebowCardStatItem, AxebowCardStatsRow, AxebowCardStatus, AxebowCardTableHeader, AxebowCardVersionSelector, AxebowCarouselInput, AxebowCarouselSelectorItem, AxebowCarouselSelectorTenant, AxebowChannelConfigPanel, AxebowCheckboxInput, AxebowCollaboratorsDialog, AxebowCopyBox, AxebowDeployCard, AxebowDeploySummary, AxebowDialog, AxebowDragDropUploadFile, AxebowDraggableService, AxebowExpandableCard, AxebowExpandableHeader, AxebowFilterBar, AxebowFooter, AxebowFormPanelField, AxebowGettingStartedCard, AxebowHeader, AxebowHelpBubble, AxebowIcon, AxebowInfrastructureCard, AxebowInput, AxebowInputBase, AxebowInstancesTable, AxebowLimitsCounter, AxebowManageHyperlinks, AxebowMarketplaceCard, AxebowModalsConfirmation, AxebowMoreActions, AxebowNumberCard, AxebowNumbersSection, AxebowNumericInput, AxebowObservabilityContainer, AxebowPill, AxebowPlanSelectField, AxebowProgressBar, AxebowProvidersInput, AxebowQuickTipButton, AxebowQuickTipSection, AxebowRefreshPeriodPanel, AxebowRegistrySelector, AxebowResourceBar, AxebowResourceBoxForm, AxebowResourceCard, AxebowResourceLimitInput, AxebowResourceLimitsPanel, AxebowResourcesCounter, AxebowRoleCard, AxebowRoleContainerDropdown, AxebowRoleTooltip, AxebowRuntimeZipDialog, AxebowSearch, AxebowSearchBarFilters, AxebowSelectInput, AxebowSelectInputWithDivider, AxebowSelectorSlider, AxebowServiceDetailHeader, AxebowServicesPanel, AxebowSidebar, AxebowStatus, AxebowStepHeader, AxebowSummaryCard, AxebowSummaryFlavors, AxebowSummaryKeyValue, AxebowSummaryLimits, AxebowSummaryStep, AxebowSummaryStepHeader, AxebowSwitch, AxebowSwitchInput, AxebowTabSelector, AxebowTabsSubmenu, AxebowTagsInput, AxebowTenantCard, AxebowTenantResourceTable, AxebowTenantsTable, AxebowTextInput, AxebowTimeRangePanel, AxebowTooltip, AxebowUndeployCard, AxebowUnderlineTabSelector, AxebowUsageTooltip, CustomHomePageBody, DEFAULT_ADD_DIALOG_LABELS, DeployModalComponent, DeployModalFooter, DeployModalHeader, DeployPageBody, STATUS_COLORS, TableChart, axebowTheme, buildAddButton, buildExternalNodeContent, buildMainNodeContent, createElement, createIcon };
|
|
12253
12448
|
|
|
12254
12449
|
//# sourceMappingURL=index.js.map
|