@digital-realty/ix-wizard 1.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 ix-wizard
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,38 @@
+# \<ix-wizard>
+
+This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
+
+## Installation
+
+```bash
+npm i @digital-realty/ix-wizard
+```
+
+## Usage
+
+```html
+<script type="module">
+  import '@digital-realty/ix-wizard/ix-wizard.js';
+  import '@digital-realty/ix-wizard/ix-wizard-step.js';
+</script>
+
+<ix-wizard>
+  <ix-wizard-step>
+    <div value="1">Option label</div>
+  </ix-wizard-step>
+</ix-wizard>
+```
+
+```JS
+import { IxWizard, IxWizardStep } from 'ix-wizard'
+
+<IxWizard>
+  <IxWizardStep>
+    <div value="1">Option label</div>
+  </IxWizardStep>
+</IxWizard>
+```
+
+## Demo and Documentation
+
+Full documentation and demo are available at [DLR Component Gallery](https://inxn-p1-uicomponentgallery.azurewebsites.net/?path=/story/inxn-ix-wizard--default).

package/dist/IxWizard.d.ts

@@ -0,0 +1,10 @@
+import { LitElement, nothing } from 'lit';
+export declare class IxWizard extends LitElement {
+    static get styles(): import("lit").CSSResult[];
+    totalSteps: number;
+    currentStep: number;
+    hideStepCount: boolean;
+    firstUpdated(): void;
+    renderStepCount(): typeof nothing | import("lit").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/IxWizard.js

@@ -0,0 +1,54 @@
+import { __decorate } from "tslib";
+import { LitElement, html, nothing } from 'lit';
+import { property } from 'lit/decorators.js';
+import { IxWizardStyles } from './styles/ix-wizard-styles.js';
+export class IxWizard extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.totalSteps = 0;
+        this.currentStep = 0;
+        this.hideStepCount = false;
+    }
+    static get styles() {
+        return [IxWizardStyles];
+    }
+    firstUpdated() {
+        var _a;
+        if (this.totalSteps === 0) {
+            const slot = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
+            const wizardSteps = slot === null || slot === void 0 ? void 0 : slot.assignedElements();
+            this.totalSteps = (wizardSteps === null || wizardSteps === void 0 ? void 0 : wizardSteps.length) || 0;
+        }
+    }
+    renderStepCount() {
+        if (this.currentStep === 0 || this.hideStepCount)
+            return nothing;
+        return html `<div class="wizard-title">
+      <md-icon>chevron_left</md-icon>
+      <span class="button-label"
+        >${this.currentStep} of ${this.totalSteps}</span
+      >
+      <md-icon>chevron_right</md-icon>
+    </div>`;
+    }
+    render() {
+        return html `
+      <div class="wizard-wrapper">
+        <div class="wizard-header">${this.renderStepCount()}</div>
+        <div class="wizard-body">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+    }
+}
+__decorate([
+    property({ type: Number })
+], IxWizard.prototype, "totalSteps", void 0);
+__decorate([
+    property({ type: Number })
+], IxWizard.prototype, "currentStep", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxWizard.prototype, "hideStepCount", void 0);
+//# sourceMappingURL=IxWizard.js.map

package/dist/IxWizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IxWizard.js","sourceRoot":"","sources":["../src/IxWizard.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,MAAM,OAAO,QAAS,SAAQ,UAAU;IAAxC;;QAK8B,eAAU,GAAG,CAAC,CAAC;QAEf,gBAAW,GAAG,CAAC,CAAC;QAEf,kBAAa,GAAG,KAAK,CAAC;IAgCrD,CAAC;IAxCC,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,cAAc,CAAC,CAAC;IAC1B,CAAC;IAQD,YAAY;;QACV,IAAI,IAAI,CAAC,UAAU,KAAK,CAAC,EAAE;YACzB,MAAM,IAAI,GAAG,MAAA,IAAI,CAAC,UAAU,0CAAE,aAAa,CAAC,MAAM,CAAC,CAAC;YACpD,MAAM,WAAW,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,EAAE,CAAC;YAC7C,IAAI,CAAC,UAAU,GAAG,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,MAAM,KAAI,CAAC,CAAC;SAC5C;IACH,CAAC;IAED,eAAe;QACb,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,IAAI,IAAI,CAAC,aAAa;YAAE,OAAO,OAAO,CAAC;QAEjE,OAAO,IAAI,CAAA;;;WAGJ,IAAI,CAAC,WAAW,OAAO,IAAI,CAAC,UAAU;;;WAGtC,CAAC;IACV,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;qCAEsB,IAAI,CAAC,eAAe,EAAE;;;;;KAKtD,CAAC;IACJ,CAAC;CACF;AApC6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAgB;AAEf;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAiB;AAEf;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CAAuB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { IxWizardStyles } from './styles/ix-wizard-styles.js';\n\nexport class IxWizard extends LitElement {\n  static get styles() {\n    return [IxWizardStyles];\n  }\n\n  @property({ type: Number }) totalSteps = 0;\n\n  @property({ type: Number }) currentStep = 0;\n\n  @property({ type: Boolean }) hideStepCount = false;\n\n  firstUpdated() {\n    if (this.totalSteps === 0) {\n      const slot = this.shadowRoot?.querySelector('slot');\n      const wizardSteps = slot?.assignedElements();\n      this.totalSteps = wizardSteps?.length || 0;\n    }\n  }\n\n  renderStepCount() {\n    if (this.currentStep === 0 || this.hideStepCount) return nothing;\n\n    return html`<div class=\"wizard-title\">\n      <md-icon>chevron_left</md-icon>\n      <span class=\"button-label\"\n        >${this.currentStep} of ${this.totalSteps}</span\n      >\n      <md-icon>chevron_right</md-icon>\n    </div>`;\n  }\n\n  render() {\n    return html`\n      <div class=\"wizard-wrapper\">\n        <div class=\"wizard-header\">${this.renderStepCount()}</div>\n        <div class=\"wizard-body\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/IxWizardStep.d.ts

@@ -0,0 +1,18 @@
+import { LitElement, nothing } from 'lit';
+import '@digital-realty/ix-button';
+import '@material/web/icon/icon.js';
+export declare class IxWizardStep extends LitElement {
+    static get styles(): import("lit").CSSResult[];
+    isVisible: boolean;
+    isBackButtonVisible: boolean;
+    isBackButtonDisabled: boolean;
+    onBackButtonClick: any;
+    backButtonText: string;
+    isNextButtonVisible: boolean;
+    isNextButtonDisabled: boolean;
+    onNextButtonClick: any;
+    nextButtonText: string;
+    renderBackButton(): typeof nothing | import("lit").TemplateResult<1>;
+    renderNextButton(): typeof nothing | import("lit").TemplateResult<1>;
+    render(): typeof nothing | import("lit").TemplateResult<1>;
+}

package/dist/IxWizardStep.js

@@ -0,0 +1,87 @@
+import { __decorate } from "tslib";
+import { LitElement, html, nothing } from 'lit';
+import { property } from 'lit/decorators.js';
+import '@digital-realty/ix-button';
+import '@material/web/icon/icon.js';
+import { IxWizardStepStyles } from './styles/ix-wizard-step-styles.js';
+export class IxWizardStep extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.isVisible = true;
+        this.isBackButtonVisible = false;
+        this.isBackButtonDisabled = false;
+        this.backButtonText = 'Back';
+        this.isNextButtonVisible = true;
+        this.isNextButtonDisabled = false;
+        this.nextButtonText = 'Next';
+    }
+    static get styles() {
+        return [IxWizardStepStyles];
+    }
+    renderBackButton() {
+        if (!this.isBackButtonVisible)
+            return nothing;
+        return html ` <ix-button
+      type="button"
+      appearance="outlined"
+      ?disabled=${this.isBackButtonDisabled}
+      @click=${() => this.onBackButtonClick()}
+      has-icon
+    >
+      <span class="button-label">${this.backButtonText}</span>
+      <md-icon slot="icon">west</md-icon>
+    </ix-button>`;
+    }
+    renderNextButton() {
+        if (!this.isNextButtonVisible)
+            return nothing;
+        return html ` <ix-button
+      ?disabled=${this.isNextButtonDisabled}
+      type="submit"
+      @click=${() => this.onNextButtonClick()}
+      has-icon
+      trailing-icon
+    >
+      <md-icon slot="icon">east</md-icon>
+      <span class="button-label">${this.nextButtonText}</span>
+    </ix-button>`;
+    }
+    render() {
+        if (!this.isVisible)
+            return nothing;
+        return html `
+      <slot></slot>
+      <div class="wizard-step__btn-group">
+        ${this.renderBackButton()} ${this.renderNextButton()}
+      </div>
+    `;
+    }
+}
+__decorate([
+    property({ type: Boolean })
+], IxWizardStep.prototype, "isVisible", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxWizardStep.prototype, "isBackButtonVisible", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxWizardStep.prototype, "isBackButtonDisabled", void 0);
+__decorate([
+    property({ type: Function })
+], IxWizardStep.prototype, "onBackButtonClick", void 0);
+__decorate([
+    property({ type: String })
+], IxWizardStep.prototype, "backButtonText", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxWizardStep.prototype, "isNextButtonVisible", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxWizardStep.prototype, "isNextButtonDisabled", void 0);
+__decorate([
+    property({ type: Function })
+], IxWizardStep.prototype, "onNextButtonClick", void 0);
+__decorate([
+    property({ type: String })
+], IxWizardStep.prototype, "nextButtonText", void 0);
+//# sourceMappingURL=IxWizardStep.js.map

package/dist/IxWizardStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IxWizardStep.js","sourceRoot":"","sources":["../src/IxWizardStep.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,2BAA2B,CAAC;AACnC,OAAO,4BAA4B,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAEvE,MAAM,OAAO,YAAa,SAAQ,UAAU;IAA5C;;QAK+B,cAAS,GAAG,IAAI,CAAC;QAEjB,wBAAmB,GAAG,KAAK,CAAC;QAE5B,yBAAoB,GAAG,KAAK,CAAC;QAI9B,mBAAc,GAAG,MAAM,CAAC;QAEvB,wBAAmB,GAAG,IAAI,CAAC;QAE3B,yBAAoB,GAAG,KAAK,CAAC;QAI9B,mBAAc,GAAG,MAAM,CAAC;IA0CtD,CAAC;IA9DC,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,kBAAkB,CAAC,CAAC;IAC9B,CAAC;IAoBD,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,mBAAmB;YAAE,OAAO,OAAO,CAAC;QAE9C,OAAO,IAAI,CAAA;;;kBAGG,IAAI,CAAC,oBAAoB;eAC5B,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE;;;mCAGV,IAAI,CAAC,cAAc;;iBAErC,CAAC;IAChB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,IAAI,CAAC,mBAAmB;YAAE,OAAO,OAAO,CAAC;QAE9C,OAAO,IAAI,CAAA;kBACG,IAAI,CAAC,oBAAoB;;eAE5B,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE;;;;;mCAKV,IAAI,CAAC,cAAc;iBACrC,CAAC;IAChB,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO,OAAO,CAAC;QAEpC,OAAO,IAAI,CAAA;;;UAGL,IAAI,CAAC,gBAAgB,EAAE,IAAI,IAAI,CAAC,gBAAgB,EAAE;;KAEvD,CAAC;IACJ,CAAC;CACF;AA1D8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yDAA6B;AAE5B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DAA8B;AAE5B;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;uDAAwB;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAyB;AAEvB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yDAA4B;AAE3B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DAA8B;AAE5B;IAA7B,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;uDAAwB;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAyB","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport '@digital-realty/ix-button';\nimport '@material/web/icon/icon.js';\nimport { IxWizardStepStyles } from './styles/ix-wizard-step-styles.js';\n\nexport class IxWizardStep extends LitElement {\n  static get styles() {\n    return [IxWizardStepStyles];\n  }\n\n  @property({ type: Boolean }) isVisible = true;\n\n  @property({ type: Boolean }) isBackButtonVisible = false;\n\n  @property({ type: Boolean }) isBackButtonDisabled = false;\n\n  @property({ type: Function }) onBackButtonClick: any;\n\n  @property({ type: String }) backButtonText = 'Back';\n\n  @property({ type: Boolean }) isNextButtonVisible = true;\n\n  @property({ type: Boolean }) isNextButtonDisabled = false;\n\n  @property({ type: Function }) onNextButtonClick: any;\n\n  @property({ type: String }) nextButtonText = 'Next';\n\n  renderBackButton() {\n    if (!this.isBackButtonVisible) return nothing;\n\n    return html` <ix-button\n      type=\"button\"\n      appearance=\"outlined\"\n      ?disabled=${this.isBackButtonDisabled}\n      @click=${() => this.onBackButtonClick()}\n      has-icon\n    >\n      <span class=\"button-label\">${this.backButtonText}</span>\n      <md-icon slot=\"icon\">west</md-icon>\n    </ix-button>`;\n  }\n\n  renderNextButton() {\n    if (!this.isNextButtonVisible) return nothing;\n\n    return html` <ix-button\n      ?disabled=${this.isNextButtonDisabled}\n      type=\"submit\"\n      @click=${() => this.onNextButtonClick()}\n      has-icon\n      trailing-icon\n    >\n      <md-icon slot=\"icon\">east</md-icon>\n      <span class=\"button-label\">${this.nextButtonText}</span>\n    </ix-button>`;\n  }\n\n  render() {\n    if (!this.isVisible) return nothing;\n\n    return html`\n      <slot></slot>\n      <div class=\"wizard-step__btn-group\">\n        ${this.renderBackButton()} ${this.renderNextButton()}\n      </div>\n    `;\n  }\n}\n"]}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { IxWizard } from './IxWizard.js';
+export { IxWizardStep } from './IxWizardStep.js';

package/dist/index.js

@@ -0,0 +1,3 @@
+export { IxWizard } from './IxWizard.js';
+export { IxWizardStep } from './IxWizardStep.js';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { IxWizard } from './IxWizard.js';\nexport { IxWizardStep } from './IxWizardStep.js';\n"]}

package/dist/ix-wizard-step.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ix-wizard-step.js

@@ -0,0 +1,3 @@
+import { IxWizardStep } from './IxWizardStep.js';
+window.customElements.define('ix-wizard-step', IxWizardStep);
+//# sourceMappingURL=ix-wizard-step.js.map

package/dist/ix-wizard-step.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ix-wizard-step.js","sourceRoot":"","sources":["../src/ix-wizard-step.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,gBAAgB,EAAE,YAAY,CAAC,CAAC","sourcesContent":["import { IxWizardStep } from './IxWizardStep.js';\n\nwindow.customElements.define('ix-wizard-step', IxWizardStep);\n"]}

package/dist/ix-wizard.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ix-wizard.js

@@ -0,0 +1,3 @@
+import { IxWizard } from './IxWizard.js';
+window.customElements.define('ix-wizard', IxWizard);
+//# sourceMappingURL=ix-wizard.js.map

package/dist/ix-wizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ix-wizard.js","sourceRoot":"","sources":["../src/ix-wizard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["import { IxWizard } from './IxWizard.js';\n\nwindow.customElements.define('ix-wizard', IxWizard);\n"]}

package/dist/react/IxWizard.d.ts

@@ -0,0 +1,4 @@
+import { IxWizard as IxWizardLit } from '../IxWizard.js';
+export declare const IxWizard: import("@lit/react").ReactWebComponent<IxWizardLit, {
+    onclick: string;
+}>;

package/dist/react/IxWizard.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { IxWizard as IxWizardLit } from '../IxWizard.js';
+customElements.define('ix-wizard', IxWizardLit);
+export const IxWizard = createComponent({
+    tagName: 'ix-wizard',
+    elementClass: IxWizardLit,
+    react: React,
+    events: {
+        onclick: 'onClick',
+    },
+});
+//# sourceMappingURL=IxWizard.js.map

package/dist/react/IxWizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IxWizard.js","sourceRoot":"","sources":["../../src/react/IxWizard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAEzD,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;AAEhD,MAAM,CAAC,MAAM,QAAQ,GAAG,eAAe,CAAC;IACtC,OAAO,EAAE,WAAW;IACpB,YAAY,EAAE,WAAW;IACzB,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;KACnB;CACF,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { createComponent } from '@lit/react';\nimport { IxWizard as IxWizardLit } from '../IxWizard.js';\n\ncustomElements.define('ix-wizard', IxWizardLit);\n\nexport const IxWizard = createComponent({\n  tagName: 'ix-wizard',\n  elementClass: IxWizardLit,\n  react: React,\n  events: {\n    onclick: 'onClick',\n  },\n});\n"]}

package/dist/react/IxWizardStep.d.ts

@@ -0,0 +1,4 @@
+import { IxWizardStep as IxWizardStepLit } from '../IxWizardStep.js';
+export declare const IxWizardStep: import("@lit/react").ReactWebComponent<IxWizardStepLit, {
+    onclick: string;
+}>;

package/dist/react/IxWizardStep.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { IxWizardStep as IxWizardStepLit } from '../IxWizardStep.js';
+customElements.define('ix-wizard-step', IxWizardStepLit);
+export const IxWizardStep = createComponent({
+    tagName: 'ix-wizard-step',
+    elementClass: IxWizardStepLit,
+    react: React,
+    events: {
+        onclick: 'onClick',
+    },
+});
+//# sourceMappingURL=IxWizardStep.js.map

package/dist/react/IxWizardStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IxWizardStep.js","sourceRoot":"","sources":["../../src/react/IxWizardStep.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,YAAY,IAAI,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErE,cAAc,CAAC,MAAM,CAAC,gBAAgB,EAAE,eAAe,CAAC,CAAC;AAEzD,MAAM,CAAC,MAAM,YAAY,GAAG,eAAe,CAAC;IAC1C,OAAO,EAAE,gBAAgB;IACzB,YAAY,EAAE,eAAe;IAC7B,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;KACnB;CACF,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { createComponent } from '@lit/react';\nimport { IxWizardStep as IxWizardStepLit } from '../IxWizardStep.js';\n\ncustomElements.define('ix-wizard-step', IxWizardStepLit);\n\nexport const IxWizardStep = createComponent({\n  tagName: 'ix-wizard-step',\n  elementClass: IxWizardStepLit,\n  react: React,\n  events: {\n    onclick: 'onClick',\n  },\n});\n"]}

package/dist/styles/ix-wizard-step-styles.d.ts

@@ -0,0 +1 @@
+export declare const IxWizardStepStyles: import("lit").CSSResult;

package/dist/styles/ix-wizard-step-styles.js

@@ -0,0 +1,10 @@
+import { css } from 'lit';
+export const IxWizardStepStyles = css `
+  .wizard-step__btn-group {
+    padding: 20px 0px;
+    display: flex;
+    gap: 20px;
+    justify-content: flex-end;
+  }
+`;
+//# sourceMappingURL=ix-wizard-step-styles.js.map

package/dist/styles/ix-wizard-step-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ix-wizard-step-styles.js","sourceRoot":"","sources":["../../src/styles/ix-wizard-step-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAA;;;;;;;CAOpC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxWizardStepStyles = css`\n  .wizard-step__btn-group {\n    padding: 20px 0px;\n    display: flex;\n    gap: 20px;\n    justify-content: flex-end;\n  }\n`;\n"]}

package/dist/styles/ix-wizard-styles.d.ts

@@ -0,0 +1 @@
+export declare const IxWizardStyles: import("lit").CSSResult;

package/dist/styles/ix-wizard-styles.js

@@ -0,0 +1,45 @@
+import { css } from 'lit';
+export const IxWizardStyles = css `
+  ix-dialog {
+    --md-dialog-container-color: #fff;
+  }
+  .wizard-wrapper {
+    --md-outlined-field-bottom-space: 2px;
+    --md-outlined-field-top-space: 2px;
+    --md-outlined-button-outline-color: var(--md-sys-color-primary);
+    --md-outlined-select-text-field-outline-color: #ddd;
+    --md-menu-container-color: #fff;
+
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+
+    margin: 0 25px;
+  }
+
+  .wizard-header {
+    display: flex;
+    justify-content: center;
+  }
+  .wizard-header .wizard-title {
+    position: relative;
+    width: 140px;
+    display: grid;
+    grid-template-columns: 24px 1fr 24px;
+    -webkit-box-align: center;
+    place-items: center;
+    top: var(--ix-wizard-top, 0);
+  }
+  .wizard-header .wizard-title md-icon {
+    color: lightgrey;
+  }
+  .wizard-header .wizard-title span {
+    font-weight: 700;
+    font-style: normal;
+    font-size: 14px;
+    letter-spacing: 1.25px;
+    text-transform: uppercase;
+    color: #092241;
+  }
+`;
+//# sourceMappingURL=ix-wizard-styles.js.map

package/dist/styles/ix-wizard-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ix-wizard-styles.js","sourceRoot":"","sources":["../../src/styles/ix-wizard-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ChC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxWizardStyles = css`\n  ix-dialog {\n    --md-dialog-container-color: #fff;\n  }\n  .wizard-wrapper {\n    --md-outlined-field-bottom-space: 2px;\n    --md-outlined-field-top-space: 2px;\n    --md-outlined-button-outline-color: var(--md-sys-color-primary);\n    --md-outlined-select-text-field-outline-color: #ddd;\n    --md-menu-container-color: #fff;\n\n    display: flex;\n    flex-direction: column;\n    gap: 20px;\n\n    margin: 0 25px;\n  }\n\n  .wizard-header {\n    display: flex;\n    justify-content: center;\n  }\n  .wizard-header .wizard-title {\n    position: relative;\n    width: 140px;\n    display: grid;\n    grid-template-columns: 24px 1fr 24px;\n    -webkit-box-align: center;\n    place-items: center;\n    top: var(--ix-wizard-top, 0);\n  }\n  .wizard-header .wizard-title md-icon {\n    color: lightgrey;\n  }\n  .wizard-header .wizard-title span {\n    font-weight: 700;\n    font-style: normal;\n    font-size: 14px;\n    letter-spacing: 1.25px;\n    text-transform: uppercase;\n    color: #092241;\n  }\n`;\n"]}

package/package.json

@@ -0,0 +1,110 @@
+{
+  "name": "@digital-realty/ix-wizard",
+  "description": "Webcomponent ix-wizard following open-wc recommendations",
+  "license": "MIT",
+  "author": "interxion",
+  "version": "1.0.1",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "exports": {
+    ".": "./dist/index.js",
+    "./ix-wizard.js": "./dist/ix-wizard.js",
+    "./ix-wizard-step.js": "./dist/ix-wizard-step.js",
+    "./IxWizard": "./dist/react/IxWizard.js",
+    "./IxWizardStep": "./dist/react/IxWizardStep.js"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "analyze": "cem analyze --litelement",
+    "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
+    "build": "tsc && npm run analyze -- --exclude dist",
+    "prepublish": "tsc && npm run analyze -- --exclude dist",
+    "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
+    "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
+    "test": "tsc && wtr --coverage",
+    "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\"",
+    "storybook": "tsc && npm run analyze -- --exclude dist && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds -c .storybook/server.mjs\"",
+    "storybook:build": "tsc && npm run analyze -- --exclude dist && build-storybook"
+  },
+  "dependencies": {
+    "@digital-realty/ix-button": "*",
+    "@digital-realty/ix-icon": "*",
+    "@digital-realty/theme": "*",
+    "@lit/react": "^1.0.2",
+    "@material/web": "^1.0.1",
+    "lit": "^2.0.2",
+    "react": "^18.2.0"
+  },
+  "devDependencies": {
+    "@custom-elements-manifest/analyzer": "^0.4.17",
+    "@open-wc/eslint-config": "^9.2.1",
+    "@open-wc/testing": "^3.1.6",
+    "@typescript-eslint/eslint-plugin": "^5.48.0",
+    "@typescript-eslint/parser": "^5.48.0",
+    "@web/dev-server": "^0.1.34",
+    "@web/dev-server-storybook": "^0.5.4",
+    "@web/test-runner": "^0.14.0",
+    "concurrently": "^5.3.0",
+    "eslint": "^8.31.0",
+    "eslint-config-prettier": "^8.3.0",
+    "husky": "^4.3.8",
+    "lint-staged": "^10.5.4",
+    "prettier": "^2.4.1",
+    "tslib": "^2.3.1",
+    "typescript": "^4.5.2"
+  },
+  "customElements": "custom-elements.json",
+  "eslintConfig": {
+    "parser": "@typescript-eslint/parser",
+    "extends": [
+      "@open-wc",
+      "prettier"
+    ],
+    "plugins": [
+      "@typescript-eslint"
+    ],
+    "rules": {
+      "no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "error"
+      ],
+      "import/no-unresolved": "off",
+      "import/extensions": [
+        "error",
+        "always",
+        {
+          "ignorePackages": true
+        }
+      ]
+    },
+    "globals": {
+      "ShadowRootInit": true
+    }
+  },
+  "prettier": {
+    "singleQuote": true,
+    "arrowParens": "avoid"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "*.ts": [
+      "eslint --fix",
+      "prettier --write"
+    ]
+  },
+  "files": [
+    "/dist",
+    "!/dist/test",
+    "package.json",
+    "README.md",
+    "LICENSE"
+  ],
+  "gitHead": "fb8987c768a39f377d98b1edacf456011cec29fe"
+}