@elixir-cloud/cloud-registry 2.0.0-alpha.28

package/dist/chunks/chunk.V3D32NZ5.js

@@ -0,0 +1,717 @@
+import { ComponentStyles } from './chunk.HM342EMQ.js';
+import { RestCloudRegistryProvider } from './chunk.HIA3DP4L.js';
+import { __decorateClass, __spreadProps, __spreadValues } from './chunk.S3NI7NKU.js';
+import { css, LitElement, html } from 'lit';
+import { property, state } from 'lit/decorators.js';
+import '@elixir-cloud/design/components/button/index.js';
+import '@elixir-cloud/design/components/input/index.js';
+import '@elixir-cloud/design/components/select/index.js';
+import '@elixir-cloud/design/components/label/index.js';
+import '@elixir-cloud/design/components/textarea/index.js';
+import '@elixir-cloud/design/components/collapsible/index.js';
+
+var GlobalStyles = css`
+  :host {
+    --background: var(--ecc-background, oklch(1 0 0));
+    --foreground: var(--ecc-foreground, oklch(0.145 0 0));
+    --card: var(--ecc-card, oklch(1 0 0));
+    --card-foreground: var(--ecc-card-foreground, oklch(0.145 0 0));
+    --popover: var(--ecc-popover, oklch(1 0 0));
+    --popover-foreground: var(--ecc-popover-foreground, oklch(0.145 0 0));
+    --primary: var(--ecc-primary, oklch(0.205 0 0));
+    --primary-foreground: var(--ecc-primary-foreground, oklch(0.985 0 0));
+    --secondary: var(--ecc-secondary, oklch(0.97 0 0));
+    --secondary-foreground: var(--ecc-secondary-foreground, oklch(0.205 0 0));
+    --muted: var(--ecc-muted, oklch(0.97 0 0));
+    --muted-foreground: var(--ecc-muted-foreground, oklch(0.556 0 0));
+    --accent: var(--ecc-accent, oklch(0.97 0 0));
+    --accent-foreground: var(--ecc-accent-foreground, oklch(0.205 0 0));
+    --destructive: var(--ecc-destructive, oklch(0.577 0.245 27.325));
+    --destructive-foreground: var(
+      --ecc-destructive-foreground,
+      oklch(0.985 0 0)
+    );
+    --border: var(--ecc-border, oklch(0.922 0 0));
+    --input: var(--ecc-input, oklch(0.922 0 0));
+    --ring: var(--ecc-ring, oklch(0.708 0 0));
+    --chart-1: var(--ecc-chart-1, oklch(0.646 0.222 41.116));
+    --chart-2: var(--ecc-chart-2, oklch(0.6 0.118 184.704));
+    --chart-3: var(--ecc-chart-3, oklch(0.398 0.07 227.392));
+    --chart-4: var(--ecc-chart-4, oklch(0.828 0.189 84.429));
+    --chart-5: var(--ecc-chart-5, oklch(0.769 0.188 70.08));
+    --radius: var(--ecc-radius, 0.625rem);
+    --sidebar: var(--ecc-sidebar, oklch(0.985 0 0));
+    --sidebar-foreground: var(--ecc-sidebar-foreground, oklch(0.145 0 0));
+    --sidebar-primary: var(--ecc-sidebar-primary, oklch(0.205 0 0));
+    --sidebar-primary-foreground: var(
+      --ecc-sidebar-primary-foreground,
+      oklch(0.985 0 0)
+    );
+    --sidebar-accent: var(--ecc-sidebar-accent, oklch(0.97 0 0));
+    --sidebar-accent-foreground: var(
+      --ecc-sidebar-accent-foreground,
+      oklch(0.205 0 0)
+    );
+    --sidebar-border: var(--ecc-sidebar-border, oklch(0.922 0 0));
+    --sidebar-ring: var(--ecc-sidebar-ring, oklch(0.708 0 0));
+  }
+
+  :host([dark]),
+  :host-context([dark]),
+  :host-context(.dark) {
+    --background: var(--ecc-background, oklch(0.145 0 0));
+    --foreground: var(--ecc-foreground, oklch(0.985 0 0));
+    --card: var(--ecc-card, oklch(0.145 0 0));
+    --card-foreground: var(--ecc-card-foreground, oklch(0.985 0 0));
+    --popover: var(--ecc-popover, oklch(0.145 0 0));
+    --popover-foreground: var(--ecc-popover-foreground, oklch(0.985 0 0));
+    --primary: var(--ecc-primary, oklch(0.985 0 0));
+    --primary-foreground: var(--ecc-primary-foreground, oklch(0.205 0 0));
+    --secondary: var(--ecc-secondary, oklch(0.269 0 0));
+    --secondary-foreground: var(--ecc-secondary-foreground, oklch(0.985 0 0));
+    --muted: var(--ecc-muted, oklch(0.269 0 0));
+    --muted-foreground: var(--ecc-muted-foreground, oklch(0.708 0 0));
+    --accent: var(--ecc-accent, oklch(0.269 0 0));
+    --accent-foreground: var(--ecc-accent-foreground, oklch(0.985 0 0));
+    --destructive: var(--ecc-destructive, oklch(0.396 0.141 25.723));
+    --destructive-foreground: var(
+      --ecc-destructive-foreground,
+      oklch(0.637 0.237 25.331)
+    );
+    --border: var(--ecc-border, oklch(0.269 0 0));
+    --input: var(--ecc-input, oklch(0.269 0 0));
+    --ring: var(--ecc-ring, oklch(0.439 0 0));
+    --chart-1: var(--ecc-chart-1, oklch(0.488 0.243 264.376));
+    --chart-2: var(--ecc-chart-2, oklch(0.696 0.17 162.48));
+    --chart-3: var(--ecc-chart-3, oklch(0.769 0.188 70.08));
+    --chart-4: var(--ecc-chart-4, oklch(0.627 0.265 303.9));
+    --chart-5: var(--ecc-chart-5, oklch(0.645 0.246 16.439));
+    --sidebar: var(--ecc-sidebar, oklch(0.205 0 0));
+    --sidebar-foreground: var(--ecc-sidebar-foreground, oklch(0.985 0 0));
+    --sidebar-primary: var(--ecc-sidebar-primary, oklch(0.488 0.243 264.376));
+    --sidebar-primary-foreground: var(
+      --ecc-sidebar-primary-foreground,
+      oklch(0.985 0 0)
+    );
+    --sidebar-accent: var(--ecc-sidebar-accent, oklch(0.269 0 0));
+    --sidebar-accent-foreground: var(
+      --ecc-sidebar-accent-foreground,
+      oklch(0.985 0 0)
+    );
+    --sidebar-border: var(--ecc-sidebar-border, oklch(0.269 0 0));
+    --sidebar-ring: var(--ecc-sidebar-ring, oklch(0.439 0 0));
+  }
+`;
+var ECCClientElixirCloudRegistryServiceCreate = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.baseUrl = "";
+    this.serviceTypes = [];
+    this.loading = false;
+    this.error = null;
+    this.success = null;
+    this.formData = {
+      name: "",
+      url: "",
+      organization: {
+        name: "",
+        url: ""
+      },
+      type: {
+        group: "org.ga4gh",
+        artifact: "",
+        version: ""
+      },
+      version: "",
+      description: "",
+      contactUrl: "",
+      documentationUrl: "",
+      environment: "",
+      createdAt: "",
+      updatedAt: "",
+      customServiceId: "",
+      useCustomId: false
+    };
+    this._provider = null;
+  }
+  async firstUpdated() {
+    if (!this.baseUrl && !this.provider) {
+      this.dispatchEvent(
+        new CustomEvent("ecc-service-create-validation-failed", {
+          detail: {
+            error: "Please provide either a base URL for the Cloud Registry API or a custom provider."
+          },
+          bubbles: true,
+          composed: true
+        })
+      );
+      return;
+    }
+    if (this.provider) {
+      this._provider = this.provider;
+    } else if (this.baseUrl) {
+      this._provider = new RestCloudRegistryProvider(this.baseUrl);
+    } else {
+      this._provider = null;
+    }
+    if (this._provider) {
+      await this.loadServiceTypes();
+    }
+  }
+  updated(changedProperties) {
+    if (changedProperties.has("baseUrl") && this.baseUrl) {
+      this._provider = new RestCloudRegistryProvider(this.baseUrl);
+      this.loadServiceTypes();
+    }
+  }
+  async loadServiceTypes() {
+    if (!this._provider) return;
+    try {
+      this.serviceTypes = await this._provider.getServiceTypes();
+    } catch (error) {
+      console.error("Failed to load service types:", error);
+      this.dispatchEvent(
+        new CustomEvent("ecc-service-create-failed", {
+          detail: { error: "Failed to load service types" },
+          bubbles: true,
+          composed: true
+        })
+      );
+    }
+  }
+  handleInputChange(field, value) {
+    this.formData = __spreadProps(__spreadValues({}, this.formData), { [field]: value });
+  }
+  handleNestedInputChange(parent, field, value) {
+    const parentObject = this.formData[parent];
+    if (typeof parentObject === "object" && parentObject !== null) {
+      this.formData = __spreadProps(__spreadValues({}, this.formData), {
+        [parent]: __spreadProps(__spreadValues({}, parentObject), { [field]: value })
+      });
+    }
+  }
+  async handleSubmit() {
+    if (!this._provider || !this._provider.createService) {
+      this.dispatchEvent(
+        new CustomEvent("ecc-service-create-failed", {
+          detail: {
+            error: "Service creation is not supported by the current provider"
+          },
+          bubbles: true,
+          composed: true
+        })
+      );
+      return;
+    }
+    this.loading = true;
+    try {
+      if (!this.formData.name) {
+        throw new Error("Service name is required");
+      }
+      if (!this.formData.url) {
+        throw new Error("Service URL is required");
+      }
+      if (!this.formData.organization.name) {
+        throw new Error("Organization name is required");
+      }
+      if (!this.formData.organization.url) {
+        throw new Error("Organization URL is required");
+      }
+      if (!this.formData.type.artifact) {
+        throw new Error("Service type artifact is required");
+      }
+      if (!this.formData.type.version) {
+        throw new Error("Service type version is required");
+      }
+      if (!this.formData.version) {
+        throw new Error("Service version is required");
+      }
+      const serviceData = {
+        name: this.formData.name,
+        url: this.formData.url,
+        organization: {
+          name: this.formData.organization.name,
+          url: this.formData.organization.url
+        },
+        type: {
+          group: this.formData.type.group,
+          artifact: this.formData.type.artifact,
+          version: this.formData.type.version
+        },
+        version: this.formData.version,
+        description: this.formData.description || void 0,
+        contactUrl: this.formData.contactUrl || void 0,
+        documentationUrl: this.formData.documentationUrl || void 0,
+        environment: this.formData.environment || void 0,
+        createdAt: this.formData.createdAt || void 0,
+        updatedAt: this.formData.updatedAt || void 0
+      };
+      let serviceId;
+      if (this.formData.useCustomId && this.formData.customServiceId) {
+        serviceId = await this._provider.createServiceWithId(
+          this.formData.customServiceId,
+          serviceData
+        );
+      } else {
+        serviceId = await this._provider.createService(serviceData);
+      }
+      const successMessage = `Service created successfully with ID: ${serviceId}`;
+      this.dispatchEvent(
+        new CustomEvent("ecc-service-created", {
+          detail: { serviceId, serviceData, message: successMessage },
+          bubbles: true,
+          composed: true
+        })
+      );
+      this.resetForm();
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to create service";
+      this.dispatchEvent(
+        new CustomEvent("ecc-service-create-failed", {
+          detail: { error: errorMessage },
+          bubbles: true,
+          composed: true
+        })
+      );
+    } finally {
+      this.loading = false;
+    }
+  }
+  resetForm() {
+    this.formData = {
+      name: "",
+      url: "",
+      organization: {
+        name: "",
+        url: ""
+      },
+      type: {
+        group: "org.ga4gh",
+        artifact: "",
+        version: ""
+      },
+      version: "",
+      description: "",
+      contactUrl: "",
+      documentationUrl: "",
+      environment: "",
+      createdAt: "",
+      updatedAt: "",
+      customServiceId: "",
+      useCustomId: false
+    };
+  }
+  renderBasicFields() {
+    return html`
+      <div class="grid gap-4">
+        <!-- Service Name and URL in same row on desktop -->
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="service-name"
+              class="text-sm font-medium"
+            >
+              Service Name <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="service-name"
+              .value=${this.formData.name}
+              @ecc-input-changed=${(e) => this.handleInputChange("name", e.detail.value)}
+              placeholder="Enter a descriptive name for your service"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="service-url"
+              class="text-sm font-medium"
+            >
+              Service URL <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="service-url"
+              .value=${this.formData.url}
+              @ecc-input-changed=${(e) => this.handleInputChange("url", e.detail.value)}
+              placeholder="https://api.example.com/v1"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+        </div>
+
+        <!-- Organization fields -->
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div class="grid gap-2">
+            <ecc-utils-design-label for="org-name" class="text-sm font-medium">
+              Organization Name <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="org-name"
+              .value=${this.formData.organization.name}
+              @ecc-input-changed=${(e) => this.handleNestedInputChange(
+      "organization",
+      "name",
+      e.detail.value
+    )}
+              placeholder="Enter your organization name"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+
+          <div class="grid gap-2">
+            <ecc-utils-design-label for="org-url" class="text-sm font-medium">
+              Organization URL <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="org-url"
+              .value=${this.formData.organization.url}
+              @ecc-input-changed=${(e) => this.handleNestedInputChange(
+      "organization",
+      "url",
+      e.detail.value
+    )}
+              placeholder="https://example.com"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+        </div>
+
+        <!-- Service Type fields -->
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="type-group"
+              class="text-sm font-medium"
+            >
+              Type Group <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="type-group"
+              .value=${this.formData.type.group}
+              @ecc-input-changed=${(e) => this.handleNestedInputChange("type", "group", e.detail.value)}
+              placeholder="org.ga4gh"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="type-artifact"
+              class="text-sm font-medium"
+            >
+              Type Artifact <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="type-artifact"
+              .value=${this.formData.type.artifact}
+              @ecc-input-changed=${(e) => this.handleNestedInputChange(
+      "type",
+      "artifact",
+      e.detail.value
+    )}
+              placeholder="beacon, wes, trs, etc."
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="type-version"
+              class="text-sm font-medium"
+            >
+              Type Version <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="type-version"
+              .value=${this.formData.type.version}
+              @ecc-input-changed=${(e) => this.handleNestedInputChange("type", "version", e.detail.value)}
+              placeholder="1.0.0"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+        </div>
+
+        <!-- Service Version -->
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="service-version"
+              class="text-sm font-medium"
+            >
+              Service Version <span class="text-destructive">*</span>
+            </ecc-utils-design-label>
+            <ecc-utils-design-input
+              id="service-version"
+              .value=${this.formData.version}
+              @ecc-input-changed=${(e) => this.handleInputChange("version", e.detail.value)}
+              placeholder="1.0.0"
+              required
+              class="h-10"
+            ></ecc-utils-design-input>
+          </div>
+
+          <div class="grid gap-2">
+            <ecc-utils-design-label
+              for="environment"
+              class="text-sm font-medium"
+            >
+              Environment
+            </ecc-utils-design-label>
+            <ecc-utils-design-select
+              id="environment"
+              .value=${this.formData.environment}
+              @ecc-input-changed=${(e) => this.handleInputChange("environment", e.detail.value)}
+            >
+              <ecc-utils-design-select-trigger class="h-10">
+                <ecc-utils-design-select-value
+                  placeholder="Select environment"
+                ></ecc-utils-design-select-value>
+              </ecc-utils-design-select-trigger>
+              <ecc-utils-design-select-content>
+                <ecc-utils-design-select-item value=""
+                  >No environment specified</ecc-utils-design-select-item
+                >
+                <ecc-utils-design-select-item value="prod"
+                  >Production</ecc-utils-design-select-item
+                >
+                <ecc-utils-design-select-item value="test"
+                  >Test</ecc-utils-design-select-item
+                >
+                <ecc-utils-design-select-item value="dev"
+                  >Development</ecc-utils-design-select-item
+                >
+                <ecc-utils-design-select-item value="staging"
+                  >Staging</ecc-utils-design-select-item
+                >
+              </ecc-utils-design-select-content>
+            </ecc-utils-design-select>
+          </div>
+        </div>
+
+        <!-- Description spans full width -->
+        <div class="grid gap-2">
+          <ecc-utils-design-label for="description" class="text-sm font-medium">
+            Description
+          </ecc-utils-design-label>
+          <ecc-utils-design-textarea
+            id="description"
+            .value=${this.formData.description}
+            @ecc-input-changed=${(e) => this.handleInputChange("description", e.detail.value)}
+            placeholder="Provide a detailed description of what your service does"
+            rows="4"
+            class="resize-none"
+          ></ecc-utils-design-textarea>
+        </div>
+
+        ${this.renderAdvancedFields()}
+      </div>
+    `;
+  }
+  renderAdvancedFields() {
+    return html`
+      <div class="space-y-6">
+        <ecc-utils-design-collapsible>
+          <ecc-utils-design-collapsible-trigger>
+            <div
+              class="flex items-center justify-between w-full py-2 text-left hover:bg-muted/50 focus:outline-none focus:ring-1 focus:ring-ring rounded-t cursor-pointer transition-colors px-2"
+            >
+              <div class="space-y-0.5">
+                <h4 class="text-sm font-medium text-muted-foreground">
+                  Advanced Configuration
+                </h4>
+              </div>
+              <svg
+                class="w-4 h-4 text-muted-foreground/60 transition-transform duration-200 shrink-0"
+                fill="none"
+                stroke="currentColor"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M19 9l-7 7-7-7"
+                ></path>
+              </svg>
+            </div>
+          </ecc-utils-design-collapsible-trigger>
+
+          <ecc-utils-design-collapsible-content>
+            <div class="pt-4 space-y-4 border-t border-border/50">
+              <!-- Custom Service ID -->
+              <div class="grid gap-2">
+                <ecc-utils-design-label
+                  for="custom-service-id"
+                  class="text-sm font-medium"
+                >
+                  Custom Service ID
+                </ecc-utils-design-label>
+                <ecc-utils-design-input
+                  id="custom-service-id"
+                  .value=${this.formData.customServiceId}
+                  @ecc-input-changed=${(e) => {
+      this.handleInputChange("customServiceId", e.detail.value);
+      this.handleInputChange(
+        "useCustomId",
+        Boolean(e.detail.value)
+      );
+    }}
+                  placeholder="org.example.my-service (optional)"
+                  class="h-10"
+                ></ecc-utils-design-input>
+              </div>
+
+              <!-- Contact and Documentation URLs -->
+              <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                <div class="grid gap-2">
+                  <ecc-utils-design-label
+                    for="contact-url"
+                    class="text-sm font-medium"
+                  >
+                    Contact URL
+                  </ecc-utils-design-label>
+                  <ecc-utils-design-input
+                    id="contact-url"
+                    .value=${this.formData.contactUrl}
+                    @ecc-input-changed=${(e) => this.handleInputChange("contactUrl", e.detail.value)}
+                    placeholder="mailto:support@example.com or https://contact.example.com"
+                    class="h-10"
+                  ></ecc-utils-design-input>
+                </div>
+
+                <div class="grid gap-2">
+                  <ecc-utils-design-label
+                    for="documentation-url"
+                    class="text-sm font-medium"
+                  >
+                    Documentation URL
+                  </ecc-utils-design-label>
+                  <ecc-utils-design-input
+                    id="documentation-url"
+                    .value=${this.formData.documentationUrl}
+                    @ecc-input-changed=${(e) => this.handleInputChange(
+      "documentationUrl",
+      e.detail.value
+    )}
+                    placeholder="https://docs.example.com"
+                    class="h-10"
+                  ></ecc-utils-design-input>
+                </div>
+              </div>
+
+              <!-- Creation and Update timestamps -->
+              <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                <div class="grid gap-2">
+                  <ecc-utils-design-label
+                    for="created-at"
+                    class="text-sm font-medium"
+                  >
+                    Created At (RFC 3339)
+                  </ecc-utils-design-label>
+                  <ecc-utils-design-input
+                    id="created-at"
+                    .value=${this.formData.createdAt}
+                    @ecc-input-changed=${(e) => this.handleInputChange("createdAt", e.detail.value)}
+                    placeholder="2019-06-04T12:58:19Z (optional)"
+                    class="h-10"
+                  ></ecc-utils-design-input>
+                </div>
+
+                <div class="grid gap-2">
+                  <ecc-utils-design-label
+                    for="updated-at"
+                    class="text-sm font-medium"
+                  >
+                    Updated At (RFC 3339)
+                  </ecc-utils-design-label>
+                  <ecc-utils-design-input
+                    id="updated-at"
+                    .value=${this.formData.updatedAt}
+                    @ecc-input-changed=${(e) => this.handleInputChange("updatedAt", e.detail.value)}
+                    placeholder="2019-06-04T12:58:19Z (optional)"
+                    class="h-10"
+                  ></ecc-utils-design-input>
+                </div>
+              </div>
+            </div>
+          </ecc-utils-design-collapsible-content>
+        </ecc-utils-design-collapsible>
+      </div>
+    `;
+  }
+  render() {
+    return html`
+      <div class="">
+        <form
+          @submit=${(e) => {
+      e.preventDefault();
+      this.handleSubmit();
+    }}
+        >
+          <div class="space-y-4">${this.renderBasicFields()}</div>
+
+          <div class="flex justify-between items-center mt-4">
+            <div></div>
+            <div class="space-x-2">
+              <ecc-utils-design-button
+                type="button"
+                variant="outline"
+                @click=${this.resetForm}
+              >
+                Reset
+              </ecc-utils-design-button>
+              <ecc-utils-design-button
+                type="submit"
+                @click=${this.handleSubmit}
+                .disabled=${this.loading || !this.formData.name || !this.formData.url || !this.formData.organization.name || !this.formData.organization.url || !this.formData.type.artifact || !this.formData.type.version || !this.formData.version}
+              >
+                ${this.loading ? "Creating..." : "Create Service"}
+              </ecc-utils-design-button>
+            </div>
+          </div>
+        </form>
+      </div>
+    `;
+  }
+};
+ECCClientElixirCloudRegistryServiceCreate.styles = [
+  ComponentStyles,
+  GlobalStyles,
+  css`
+      :host {
+        display: block;
+        width: 100%;
+      }
+    `
+];
+__decorateClass([
+  property({ type: String, reflect: true })
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "baseUrl", 2);
+__decorateClass([
+  property({ attribute: false, reflect: true })
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "provider", 2);
+__decorateClass([
+  state()
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "serviceTypes", 2);
+__decorateClass([
+  state()
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "loading", 2);
+__decorateClass([
+  state()
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "error", 2);
+__decorateClass([
+  state()
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "success", 2);
+__decorateClass([
+  state()
+], ECCClientElixirCloudRegistryServiceCreate.prototype, "formData", 2);
+var service_create_default = ECCClientElixirCloudRegistryServiceCreate;
+
+export { ECCClientElixirCloudRegistryServiceCreate, service_create_default };