xv-webcomponents 0.1.38 → 0.1.41

package/dist/collection/components/xv-login-modal/xv-login-modal.js

@@ -0,0 +1,146 @@
+import { h } from "@stencil/core";
+export class XvLoginModal {
+    constructor() {
+        this.visible = false;
+        this.oauthProviders = [];
+        this.bookNow = false;
+        this.returnUrl = '/';
+        this.passwordLoginEnabled = true;
+        this.oauthLoginEnabled = true;
+        this.passwordRegistrationEnabled = true;
+        this.configurationName = 'Xv';
+        this.xvMvcConfigName = 'Xv';
+        this.contactUrl = 'https://sitefinity-qa.crossvertise.com/ueber-uns/kontakt';
+        this.handleClose = () => {
+            this.close.emit();
+        };
+    }
+    componentWillLoad() {
+        this.setReturnUrl();
+        this.readMetaNavCookie();
+        this.oauthProviders = [
+            {
+                displayName: 'Google',
+                providerName: 'Google',
+                icon: 'fa fa-google',
+                buttonClass: 'btn btn-block btn-google-primary btn-primary',
+            },
+        ];
+    }
+    setReturnUrl() {
+        const params = new URLSearchParams(window.location.search);
+        let url = params.get('returnUrl') || window.location.href;
+        if (url.toLowerCase().includes('resetpassword')) {
+            url = '/';
+        }
+        this.returnUrl = url;
+    }
+    readMetaNavCookie() {
+        const metaNavCookie = document.cookie
+            .split('; ')
+            .find(row => row.startsWith('metaNav='));
+        if (!metaNavCookie)
+            return;
+        try {
+            const cookieValue = decodeURIComponent(metaNavCookie.split('=')[1]);
+            const metaNavObj = JSON.parse(cookieValue);
+            this.passwordLoginEnabled = !!metaNavObj.PasswordLoginEnabled;
+            this.oauthLoginEnabled = !!metaNavObj.oauthLoginEnabled;
+            this.passwordRegistrationEnabled = !!metaNavObj.PasswordRegistrationEnabled;
+            this.configurationName = metaNavObj.ConfigurationName;
+            this.xvMvcConfigName = metaNavObj.XvMvcConfigName;
+            this.contactUrl = metaNavObj.ContactUrl;
+        }
+        catch (e) {
+            console.warn('Could not parse metaNav cookie:', e);
+        }
+    }
+    renderPasswordLogin() {
+        if (!this.passwordLoginEnabled)
+            return null;
+        return (h("label", { class: "pull-right spacer" }, h("a", { href: "/de-de/mycrossvertise/account/lostpassword", target: "_blank", rel: "noopener" }, "Passwort vergessen?")));
+    }
+    renderOAuthProviders() {
+        if (!this.oauthLoginEnabled)
+            return null;
+        return (h("div", { class: "row" }, h("div", { class: "col-xs-12" }, h("div", { class: "col-xs-12" }, h("div", { class: "row spacer spacer-bottom" }, h("div", { class: "col-xs-5" }, h("hr", null)), h("div", { class: "col-xs-2 text-center placeholder" }, "oder"), h("div", { class: "col-xs-5" }, h("hr", null)), h("div", { class: "col-xs-12" }, h("span", null, "Alternative Anmeldung:")))), h("div", { class: "col-sm-12" }, h("div", { class: "col-xs-12 no-padding-right" }, h("form", { method: "POST", class: "spacer", action: "/de-de/mycrossvertise/account/externallogin" }, h("div", { class: "row" }, this.oauthProviders.map(provider => (h("div", { class: "col-xs-6 col-sm-3 no-padding-left padding-bottom-10 center-cell" }, h("button", { type: "submit", style: { maxWidth: '125px' }, name: "provider", class: `cell-content btn btn-primary ${provider.buttonClass} btn-block`, value: provider.providerName, title: `Mit ${provider.displayName} anmelden` }, h("i", { class: `${provider.icon} pull-left` }), h("span", null, provider.displayName)))))), h("input", { type: "hidden", name: "BookNow", value: this.bookNow.toString() })))))));
+    }
+    renderFooter() {
+        if (!this.passwordRegistrationEnabled && this.configurationName !== this.xvMvcConfigName)
+            return null;
+        return (h("div", { class: "modal-footer" }, h("div", { class: "col-sm-12 text-left" }, this.passwordRegistrationEnabled && (h("div", null, "Noch kein Kunde?", h("a", { href: `/de-de/mycrossvertise/account/register?returnUrl=${encodeURIComponent(this.returnUrl)}` }, "Jetzt kostenlos registrieren!"))), this.configurationName === this.xvMvcConfigName && (h("div", null, h("div", { class: "spacer" }, "Sie sind bereits registriert, k\u00F6nnen sich aber nicht einloggen?"), h("div", null, h("a", { href: this.contactUrl }, "Kontaktieren Sie uns"), ", wir k\u00FCmmern uns darum."))))));
+    }
+    render() {
+        if (!this.visible)
+            return null;
+        return (h("div", { class: "modal show", style: { display: 'block' }, id: "login-modal", tabIndex: -1, role: "dialog" }, h("div", { class: "modal-dialog", role: "document" }, h("div", { class: "modal-content" }, h("div", { class: "modal-header" }, h("div", { class: "row" }, h("div", { class: "col-sm-10" }, h("div", { class: "col-xs-12" }, h("h4", { class: "modal-title" }, "Login"))), h("div", { class: "col-xs-1 pull-right" }, h("button", { onClick: this.handleClose, type: "button", class: "close" }, h("span", { "aria-hidden": "true" }, "\u00D7"))))), h("div", { class: "modal-body" }, h("div", { class: "row" }, h("div", { class: "col-sm-12" }, h("form", { autoComplete: "off", id: "logon-modal-form", action: `/de-de/mycrossvertise/account/logon?returnUrl=${encodeURIComponent(this.returnUrl)}`, method: "post", class: "spacer" }, h("input", { type: "hidden", name: "returnUrl", value: this.returnUrl }), h("div", { class: "form-group spacer-bottom" }, h("div", { class: "control-label col-xs-12" }, h("label", { htmlFor: "LoginPopup.UserName" }, "E-Mail"), h("strong", { class: "text-danger" }, "*")), h("div", { class: "col-xs-12" }, h("input", { class: "form-control", id: "userName", name: "UserName", type: "text", tabIndex: 1 }))), h("div", { class: "form-group spacer" }, h("div", { class: "control-label col-xs-6" }, h("label", { class: "spacer", htmlFor: "LoginPopup.Password" }, "Passwort"), h("strong", { class: "text-danger spacer" }, "*")), h("div", { class: "col-xs-6" }, this.renderPasswordLogin()), h("div", { class: "col-xs-12" }, h("input", { class: "form-control", id: "password", name: "Password", type: "password", tabIndex: 2 }))), h("div", { class: "form-group spacer" }, h("div", { class: "col-xs-12" }, h("button", { class: "btn btn-primary btn-lg btn-block spacer", type: "submit", tabIndex: 3 }, "Anmelden"))), h("div", { class: "form-group" }, h("div", { class: "checkbox col-xs-12" }, h("label", { htmlFor: "RememberMe" }, h("input", { id: "RememberMe", name: "RememberMe", type: "checkbox", value: "true" }), "Angemeldet bleiben?")))))), this.renderOAuthProviders()), this.renderFooter()))));
+    }
+    static get is() { return "xv-login-modal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["xv-login-modal.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["xv-login-modal.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "visible": {
+                "type": "boolean",
+                "attribute": "visible",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "oauthProviders": {},
+            "bookNow": {},
+            "returnUrl": {},
+            "passwordLoginEnabled": {},
+            "oauthLoginEnabled": {},
+            "passwordRegistrationEnabled": {},
+            "configurationName": {},
+            "xvMvcConfigName": {},
+            "contactUrl": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "close",
+                "name": "close",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=xv-login-modal.js.map

package/dist/collection/components/xv-login-modal/xv-login-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xv-login-modal.js","sourceRoot":"","sources":["../../../src/components/xv-login-modal/xv-login-modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Prop, State } from '@stencil/core';\n\ntype OAuthProvider = {\n  displayName: string;\n  providerName: string;\n  icon: string;\n  buttonClass: string;\n};\n\n@Component({\n  tag: 'xv-login-modal',\n  styleUrl: 'xv-login-modal.scss',\n  shadow: true,\n})\nexport class XvLoginModal {\n  @Prop() visible: boolean = false;\n  @Event() close: EventEmitter<void>;\n  @State() oauthProviders: OAuthProvider[] = [];\n  @State() bookNow: boolean = false;\n  @State() returnUrl: string = '/';\n  @State() passwordLoginEnabled: boolean = true;\n  @State() oauthLoginEnabled: boolean = true;\n  @State() passwordRegistrationEnabled: boolean = true;\n  @State() configurationName: string = 'Xv';\n  @State() xvMvcConfigName: string = 'Xv';\n  @State() contactUrl: string = 'https://sitefinity-qa.crossvertise.com/ueber-uns/kontakt';\n\n  componentWillLoad() {\n    this.setReturnUrl();\n    this.readMetaNavCookie();\n    this.oauthProviders = [\n      {\n        displayName: 'Google',\n        providerName: 'Google',\n        icon: 'fa fa-google',\n        buttonClass: 'btn btn-block btn-google-primary btn-primary',\n      },\n    ];\n  }\n\n  private setReturnUrl() {\n    const params = new URLSearchParams(window.location.search);\n    let url = params.get('returnUrl') || window.location.href;\n    if (url.toLowerCase().includes('resetpassword')) {\n      url = '/';\n    }\n    this.returnUrl = url;\n  }\n\n  private readMetaNavCookie() {\n    const metaNavCookie = document.cookie\n      .split('; ')\n      .find(row => row.startsWith('metaNav='));\n    if (!metaNavCookie) return;\n    try {\n      const cookieValue = decodeURIComponent(metaNavCookie.split('=')[1]);\n      const metaNavObj = JSON.parse(cookieValue);\n      this.passwordLoginEnabled = !!metaNavObj.PasswordLoginEnabled;\n      this.oauthLoginEnabled = !!metaNavObj.oauthLoginEnabled;\n      this.passwordRegistrationEnabled = !!metaNavObj.PasswordRegistrationEnabled;\n      this.configurationName = metaNavObj.ConfigurationName;\n      this.xvMvcConfigName = metaNavObj.XvMvcConfigName;\n      this.contactUrl = metaNavObj.ContactUrl;\n    } catch (e) {\n      console.warn('Could not parse metaNav cookie:', e);\n    }\n  }\n\n  private handleClose = () => {\n    this.close.emit();\n  };\n\n  private renderPasswordLogin() {\n    if (!this.passwordLoginEnabled) return null;\n    return (\n      <label class=\"pull-right spacer\">\n        <a href=\"/de-de/mycrossvertise/account/lostpassword\" target=\"_blank\" rel=\"noopener\">\n          Passwort vergessen?\n        </a>\n      </label>\n    );\n  }\n\n  private renderOAuthProviders() {\n    if (!this.oauthLoginEnabled) return null;\n    return (\n      <div class=\"row\">\n        <div class=\"col-xs-12\">\n          <div class=\"col-xs-12\">\n            <div class=\"row spacer spacer-bottom\">\n              <div class=\"col-xs-5\"><hr /></div>\n              <div class=\"col-xs-2 text-center placeholder\">oder</div>\n              <div class=\"col-xs-5\"><hr /></div>\n              <div class=\"col-xs-12\">\n                <span>Alternative Anmeldung:</span>\n              </div>\n            </div>\n          </div>\n          <div class=\"col-sm-12\">\n            <div class=\"col-xs-12 no-padding-right\">\n              <form\n                method=\"POST\"\n                class=\"spacer\"\n                action=\"/de-de/mycrossvertise/account/externallogin\"\n              >\n                <div class=\"row\">\n                  {this.oauthProviders.map(provider => (\n                    <div class=\"col-xs-6 col-sm-3 no-padding-left padding-bottom-10 center-cell\">\n                      <button\n                        type=\"submit\"\n                        style={{ maxWidth: '125px' }}\n                        name=\"provider\"\n                        class={`cell-content btn btn-primary ${provider.buttonClass} btn-block`}\n                        value={provider.providerName}\n                        title={`Mit ${provider.displayName} anmelden`}\n                      >\n                        <i class={`${provider.icon} pull-left`}></i>\n                        <span>{provider.displayName}</span>\n                      </button>\n                    </div>\n                  ))}\n                </div>\n                <input type=\"hidden\" name=\"BookNow\" value={this.bookNow.toString()} />\n              </form>\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  private renderFooter() {\n    if (!this.passwordRegistrationEnabled && this.configurationName !== this.xvMvcConfigName) return null;\n    return (\n      <div class=\"modal-footer\">\n        <div class=\"col-sm-12 text-left\">\n          {this.passwordRegistrationEnabled && (\n            <div>\n              Noch kein Kunde?\n              <a\n                href={`/de-de/mycrossvertise/account/register?returnUrl=${encodeURIComponent(this.returnUrl)}`}\n              >\n                Jetzt kostenlos registrieren!\n              </a>\n            </div>\n          )}\n          {this.configurationName === this.xvMvcConfigName && (\n            <div>\n              <div class=\"spacer\">Sie sind bereits registriert, können sich aber nicht einloggen?</div>\n              <div>\n                <a href={this.contactUrl}>Kontaktieren Sie uns</a>, wir kümmern uns darum.\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    if (!this.visible) return null;\n    return (\n      <div class=\"modal show\" style={{ display: 'block' }} id=\"login-modal\" tabIndex={-1} role=\"dialog\">\n        <div class=\"modal-dialog\" role=\"document\">\n          <div class=\"modal-content\">\n            <div class=\"modal-header\">\n              <div class=\"row\">\n                <div class=\"col-sm-10\">\n                  <div class=\"col-xs-12\">\n                    <h4 class=\"modal-title\">Login</h4>\n                  </div>\n                </div>\n                <div class=\"col-xs-1 pull-right\">\n                  <button onClick={this.handleClose} type=\"button\" class=\"close\">\n                    <span aria-hidden=\"true\">&times;</span>\n                  </button>\n                </div>\n              </div>\n            </div>\n            <div class=\"modal-body\">\n              <div class=\"row\">\n                <div class=\"col-sm-12\">\n                  <form\n                    autoComplete=\"off\"\n                    id=\"logon-modal-form\"\n                    action={`/de-de/mycrossvertise/account/logon?returnUrl=${encodeURIComponent(this.returnUrl)}`}\n                    method=\"post\"\n                    class=\"spacer\"\n                  >\n                    <input type=\"hidden\" name=\"returnUrl\" value={this.returnUrl} />\n                    <div class=\"form-group spacer-bottom\">\n                      <div class=\"control-label col-xs-12\">\n                        <label htmlFor=\"LoginPopup.UserName\">E-Mail</label>\n                        <strong class=\"text-danger\">*</strong>\n                      </div>\n                      <div class=\"col-xs-12\">\n                        <input class=\"form-control\" id=\"userName\" name=\"UserName\" type=\"text\" tabIndex={1} />\n                      </div>\n                    </div>\n                    <div class=\"form-group spacer\">\n                      <div class=\"control-label col-xs-6\">\n                        <label class=\"spacer\" htmlFor=\"LoginPopup.Password\">Passwort</label>\n                        <strong class=\"text-danger spacer\">*</strong>\n                      </div>\n                      <div class=\"col-xs-6\">\n                        {this.renderPasswordLogin()}\n                      </div>\n                      <div class=\"col-xs-12\">\n                        <input class=\"form-control\" id=\"password\" name=\"Password\" type=\"password\" tabIndex={2} />\n                      </div>\n                    </div>\n                    <div class=\"form-group spacer\">\n                      <div class=\"col-xs-12\">\n                        <button class=\"btn btn-primary btn-lg btn-block spacer\" type=\"submit\" tabIndex={3}>\n                          Anmelden\n                        </button>\n                      </div>\n                    </div>\n                    <div class=\"form-group\">\n                      <div class=\"checkbox col-xs-12\">\n                        <label htmlFor=\"RememberMe\">\n                          <input id=\"RememberMe\" name=\"RememberMe\" type=\"checkbox\" value=\"true\" />\n                          Angemeldet bleiben?\n                        </label>\n                      </div>\n                    </div>\n                  </form>\n                </div>\n              </div>\n              {this.renderOAuthProviders()}\n            </div>\n            {this.renderFooter()}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/xv-modal/xv-modal.js

@@ -58,7 +58,7 @@ export class XvModal {
     }
     render() {
         var _a;
-        return (h(Host, { key: '2366289d47548d714bbdd49948f792f351f28f08', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '5315e7fff2a42c9cacff80f8123198b3b478afb9', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: 'de7fd67203a1728be67f86a2ea40279d93faa17c', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '088329b5f8624893d0e6a70de8e5320b555ca917', class: "modal" }, h("button", { key: '930e3e2f153a8b29ad072d3293ceff42d4f29467', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '454958176af3ffe3a3ce05fcd4676498ba64ed7d', class: "modal_header" }, h("slot", { key: 'c36847fd99974fe853eedebaab7d35b14895fc62', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '967825b4cf637c6fde19330fda5b88fc63aee479', class: "modal_header__title" }, this.el.title))), h("div", { key: '6ea2df2fa221a02655c9d981565132879901bbe7', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '2636c2c24cfc4faf7561f2c4d5a380f23ce904e8' })), h("div", { key: 'cb4d838daf7bc1e8fb4c029318250ec2f3e7a37a', class: "modal_footer" }, h("slot", { key: '79b371cb00c2152a1131be31202f7c8061a4b61b', name: "footer" }))))));
+        return (h(Host, { key: '7d7317c22e0ad0318e3f2dd191bfb77c75cd714e', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: '33f447364a130b66b01d2c15e14dd8e9c5524abe', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '102daec2e60b1062b3e7e60c9885697ac809b3f2', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '37b9a20e62e333b7ed0b2acfdadeb328c78af618', class: "modal" }, h("button", { key: 'c670eb2fa28e16089f01b4c3760f83cf4fbcd3d9', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '9dda2d815674cc8c49247a65c1ec95dea29da54b', class: "modal_header" }, h("slot", { key: '1eab44b952ff237e74a4d6833db585e3b2ffdab2', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: '2aba68d70d04b62cb6551e4f133a0d774df34064', class: "modal_header__title" }, this.el.title))), h("div", { key: 'a832e12c09482a9f4007a2381a23695ceea82759', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '1da580e3d2116360d429bdea2e9697a66932c50e' })), h("div", { key: 'cd5fd0aa543ef9a5777b2b8553cdc0909bd22eb0', class: "modal_footer" }, h("slot", { key: '3b168cb8474a2aa407fbb8b35e6c49c115038fe5', name: "footer" }))))));
     }
     disconnectedCallback() {
         this.removeTriggerListener();

package/dist/collection/components/xv-notification/xv-notification.css

@@ -20,6 +20,7 @@
   display: flex;
   flex-direction: column;
   row-gap: var(--spacing-06, 24px);
+  word-break: break-all;
 }
 :host .content_title {
   text-align: left;

package/dist/collection/components/xv-notification/xv-notification.js

@@ -25,7 +25,7 @@ export class XvNotification {
         };
     }
     render() {
-        return (h(Host, { key: '910f05cb3632aee19f893969b3f2225890586cfb', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: '575f30f393d7bf69f7ac4b7c14cc08742ea37a02', class: "content" }, h("div", { key: '9df87a020f9b0eeaa37b4162e930e3d73db4eba5', class: "content_wrapper" }, this.el.title && h("h5", { key: '6aceb1370abd0511d94def7830c203f8e51ad84b', class: "content_title" }, this.el.title), h("slot", { key: 'c053806cacc705dc3cfbba53c36dc761ca995e87' })), h("slot", { key: '7967d656c6541a9f21cb2a2cd87376915c21f0c3', name: "footer" })), this.dismissible && h("button", { key: '0cb3d1e44bb0f84f8a72f1ac7875364911fb4fa7', class: "close", onClick: this.closeHandle })));
+        return (h(Host, { key: '8e31924e48581db6ff89b5500fb8467aa9be2314', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: '2c23995a9f4fb150969826871451bbb7a4310595', class: "content" }, h("div", { key: '78bdf254268d1860c628a960dcf9146fc231153a', class: "content_wrapper" }, this.el.title && h("h5", { key: '3004f153ee078aea0189101f0b98d3fa6a0970c1', class: "content_title" }, this.el.title), h("slot", { key: '1f3dafa38f5f87a35cf8b23433a853c318dd6df0' })), h("slot", { key: '04ccf160451a11797f5d927403c531bbd55d7cfe', name: "footer" })), this.dismissible && h("button", { key: '6ac59409e46187eacae93f728f695c8e1d28dc21', class: "close", onClick: this.closeHandle })));
     }
     static get is() { return "xv-notification-v2"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/xv-number-input/xv-number-input.css

@@ -0,0 +1,128 @@
+:host {
+  display: inline-block;
+  text-align: left;
+}
+:host .control_label {
+  display: block;
+  margin-bottom: var(--spacing-03);
+  color: var(--text-secondary, #515151);
+  font-family: var(--ff-body, Tahoma);
+  font-size: var(--fz-sm, 12px);
+  font-style: normal;
+  font-weight: 700;
+  line-height: var(--fz-md);
+  letter-spacing: 0.32px;
+}
+:host .control_input {
+  display: flex;
+  border: 1px solid var(--border-subtle-01);
+  outline: 2px solid transparent;
+  background-color: transparent;
+  border-radius: 3px;
+  transition: 250ms ease-in-out border-color, 250ms ease-in-out outline-color;
+}
+:host .control_input:hover {
+  border-color: var(--border-subtle-selected-01);
+}
+:host .control_input:focus-within {
+  outline-color: var(--focus);
+}
+:host .control_input.error {
+  outline-color: var(--support-error);
+}
+:host .control_input.readonly {
+  border-radius: 0;
+  border-top-width: 0;
+  border-left-width: 0;
+  border-right-width: 0;
+  outline-color: transparent;
+}
+:host .control_input input[type=number] {
+  flex: 1;
+  border: none;
+  outline: none;
+  -moz-appearance: textfield;
+  background-color: transparent;
+  margin: 0;
+  padding-block: 0;
+  padding-inline: var(--spacing-05);
+  box-sizing: border-box;
+  color: var(--text-primary);
+  min-width: 20px;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0.16px;
+}
+:host .control_input input[type=number]::-webkit-inner-spin-button, :host .control_input input[type=number]::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+:host .control_input__icons {
+  display: inline-flex;
+  align-items: stretch;
+  column-gap: 2px;
+}
+:host .control_input__icons .status-icon {
+  display: inline-flex;
+  align-items: center;
+  align-self: center;
+  font-size: 1.35em;
+}
+:host .control_input__icons .status-icon.error {
+  background-color: var(--support-error);
+  color: white;
+  width: 16px;
+  height: 16px;
+  border-radius: 8px;
+  font-size: 12px;
+  font-weight: bold;
+  align-items: center;
+  justify-content: center;
+}
+:host .control_input__icons .status-icon.warning {
+  color: var(--support-warning);
+}
+:host .control_input__icons hr {
+  border: none;
+  outline: none;
+  width: 2px;
+  height: 60%;
+  align-self: center;
+  background-color: var(--border-subtle-01);
+  display: inline-flex;
+}
+:host .message {
+  margin: var(--spacing-02) 0 0;
+  color: var(--text-helper, #646464);
+  font-size: var(--fz-sm, 12px);
+  font-style: normal;
+  font-weight: 400;
+  line-height: var(--fz-md, 16px);
+  letter-spacing: 0.32px;
+}
+:host .message.error {
+  color: var(--text-error);
+}
+:host .message.warning {
+  color: var(--text-secondary, #515151);
+}
+
+:host(.disabled) {
+  cursor: not-allowed;
+}
+:host(.disabled) .control_label,
+:host(.disabled) .control_input input[type=number],
+:host(.disabled) .control_input input[type=number]::placeholder,
+:host(.disabled) .message:not(.error) {
+  color: var(--text-disabled);
+  cursor: not-allowed;
+}
+:host(.disabled) .control_input__icons,
+:host(.disabled) .message.error {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+:host([block]) {
+  display: block;
+}