@baloise/ds-core 20.0.0-next.10 → 20.0.0-next.11

package/dist/collection/components/steps/step/step.js

@@ -1,431 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { __decorate, __metadata } from "tslib";
-import { h, Host } from "@stencil/core";
-import { Logger, Required, Type } from "../../../utils/index";
-/**
- * Step renders a single step button inside a ds-steps group, showing a numbered circle, label, and connector line.
- *
- * @slot - An `<a>` element in navigation mode.
- */
-export class Step {
-    constructor() {
-        /**
-         * PUBLIC PROPERTY API
-         * ─────────────────────────────────────────────────────
-         */
-        /**
-         * Index of the active step. Used to determine connector fill state.
-         * Set by the parent ds-steps.
-         * @internal
-         */
-        this.activeIndex = 0;
-        /**
-         * If `true`, the step cannot be selected.
-         */
-        this.disabled = false;
-        /**
-         * If `true`, the step is completed. Shows a checkmark icon in the circle.
-         */
-        this.done = false;
-        /**
-         * If `true`, the step is hidden from the layout.
-         */
-        this.hidden = false;
-        /**
-         * 1-based position index. Set by the parent ds-steps.
-         * @internal
-         */
-        this.index = 0;
-        /**
-         * If `true`, the step has an error. Shows an exclamation mark in the circle.
-         */
-        this.invalid = false;
-        /**
-         * Visible text label displayed below the circle.
-         */
-        this.label = '';
-        /**
-         * Set by ds-steps. When true, renders in navigation mode (slotted <a>).
-         * @internal
-         */
-        this.navigation = false;
-        /**
-         * If `true`, this step is currently selected. Set by the parent ds-steps.
-         * @internal
-         */
-        this.selected = false;
-        /**
-         * Set by ds-steps. When true, renders in vertical layout.
-         * @internal
-         */
-        this.vertical = false;
-        /**
-         * PROPERTY VALIDATION
-         * ------------------------------------------------------
-         */
-        /**
-         * EVENT HANDLERS
-         * ─────────────────────────────────────────────────────
-         */
-        this.handleClick = (ev) => {
-            if (this.disabled)
-                return;
-            ev.preventDefault();
-            this.dsStepSelect.emit({ name: this.name });
-        };
-        this.handleKeyDown = (ev) => {
-            if (this.disabled)
-                return;
-            if (ev.key === 'Enter' || ev.key === ' ') {
-                ev.preventDefault();
-                this.dsStepSelect.emit({ name: this.name });
-            }
-        };
-    }
-    createLogger(log) {
-        this.log = log;
-    }
-    /**
-     * RENDER
-     * ─────────────────────────────────────────────────────
-     */
-    render() {
-        const hostClass = {
-            'is-selected': this.selected,
-            'is-done': this.done,
-            'is-invalid': this.invalid,
-            'is-disabled': this.disabled,
-            'is-hidden': this.hidden,
-            'is-navigation': this.navigation,
-            'is-vertical': this.vertical,
-            'is-filled': this.index > 0 && this.index < this.activeIndex,
-        };
-        const circleContent = this.done ? (h("ds-icon", { name: "check", inverted: true, "aria-hidden": "true" })) : this.invalid ? (h("span", { class: "step-invalid", "aria-hidden": "true" }, "!")) : (h("span", { class: "step-number", "aria-hidden": "true" }, this.index));
-        if (this.navigation) {
-            return (h(Host, { role: "listitem", class: hostClass }, h("span", { class: "circle", "aria-hidden": "true" }, circleContent), h("slot", null), h("span", { class: "connector", "aria-hidden": "true" })));
-        }
-        return (h(Host, { role: "tab", class: hostClass, "aria-selected": String(this.selected), "aria-disabled": this.disabled ? 'true' : null, tabIndex: this.disabled ? -1 : this.selected ? 0 : -1, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { class: "circle" }, circleContent), this.label && h("span", { class: "step-label" }, this.label), h("span", { class: "connector", "aria-hidden": "true" })));
-    }
-    static get is() { return "ds-step"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["step.host.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["step.host.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "activeIndex": {
-                "type": "number",
-                "mutable": true,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": "Index of the active step. Used to determine connector fill state.\nSet by the parent ds-steps."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "active-index",
-                "defaultValue": "0"
-            },
-            "disabled": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the step cannot be selected."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "disabled",
-                "defaultValue": "false"
-            },
-            "done": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the step is completed. Shows a checkmark icon in the circle."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "done",
-                "defaultValue": "false"
-            },
-            "hidden": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the step is hidden from the layout."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "hidden",
-                "defaultValue": "false"
-            },
-            "index": {
-                "type": "number",
-                "mutable": true,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": "1-based position index. Set by the parent ds-steps."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "index",
-                "defaultValue": "0"
-            },
-            "invalid": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the step has an error. Shows an exclamation mark in the circle."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "invalid",
-                "defaultValue": "false"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Visible text label displayed below the circle."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label",
-                "defaultValue": "''"
-            },
-            "name": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Unique name that links this step to a ds-step-panel[for] of the same value."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "name"
-            },
-            "navigation": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": "Set by ds-steps. When true, renders in navigation mode (slotted <a>)."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "navigation",
-                "defaultValue": "false"
-            },
-            "selected": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": "If `true`, this step is currently selected. Set by the parent ds-steps."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "selected",
-                "defaultValue": "false"
-            },
-            "vertical": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "internal",
-                            "text": undefined
-                        }],
-                    "text": "Set by ds-steps. When true, renders in vertical layout."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "vertical",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "dsStepSelect",
-                "name": "dsStepSelect",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emitted when the user clicks this step (panels mode only)."
-                },
-                "complexType": {
-                    "original": "{ name: string }",
-                    "resolved": "{ name: string; }",
-                    "references": {}
-                }
-            }];
-    }
-    static get elementRef() { return "el"; }
-}
-__decorate([
-    Logger('step'),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Function]),
-    __metadata("design:returntype", void 0)
-], Step.prototype, "createLogger", null);
-__decorate([
-    Type('number'),
-    __metadata("design:type", Number)
-], Step.prototype, "activeIndex", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "disabled", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "done", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "hidden", void 0);
-__decorate([
-    Type('number'),
-    __metadata("design:type", Number)
-], Step.prototype, "index", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "invalid", void 0);
-__decorate([
-    Type('string'),
-    __metadata("design:type", String)
-], Step.prototype, "label", void 0);
-__decorate([
-    Required(),
-    Type('string'),
-    __metadata("design:type", String)
-], Step.prototype, "name", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "navigation", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "selected", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], Step.prototype, "vertical", void 0);

package/dist/collection/components/steps/step-panel/step-panel.js

@@ -1,104 +0,0 @@
-/*!
- * (C) Helvetia Design System https://design.baloise.dev/ - Apache License 2.0
- */
-import { __decorate, __metadata } from "tslib";
-import { h, Host } from "@stencil/core";
-import { Logger, Required, Type } from "../../../utils/index";
-/**
- * Step Panel displays the content area associated with a ds-step, visible when its controlling step is selected.
- *
- * @slot - The panel content.
- */
-export class StepPanel {
-    constructor() {
-        /**
-         * If `true`, the panel is visible. Managed by the parent ds-steps.
-         */
-        this.selected = false;
-    }
-    createLogger(log) {
-        this.log = log;
-    }
-    /**
-     * PROPERTY VALIDATION
-     * ------------------------------------------------------
-     */
-    /**
-     * RENDER
-     * ─────────────────────────────────────────────────────
-     */
-    render() {
-        return (h(Host, { key: '9e6ad3ab5506627398912a6abcc4ca1a87a64a3e', role: "tabpanel", class: { 'is-selected': this.selected }, "aria-hidden": this.selected ? null : 'true', tabIndex: this.selected ? 0 : -1 }, h("slot", { key: 'dae625d0eddd667694fafb88a15fa5d1f92c8ebb' })));
-    }
-    static get is() { return "ds-step-panel"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["step-panel.host.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["step-panel.host.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "for": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Matches the `name` of the ds-step that controls this panel."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "for"
-            },
-            "selected": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "If `true`, the panel is visible. Managed by the parent ds-steps."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "attribute": "selected",
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-__decorate([
-    Logger('step-panel'),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Function]),
-    __metadata("design:returntype", void 0)
-], StepPanel.prototype, "createLogger", null);
-__decorate([
-    Required(),
-    Type('string'),
-    __metadata("design:type", String)
-], StepPanel.prototype, "for", void 0);
-__decorate([
-    Type('boolean'),
-    __metadata("design:type", Boolean)
-], StepPanel.prototype, "selected", void 0);