@ukic/canary-web-components 2.0.0-canary.3 → 2.0.0-canary.4

package/dist/collection/components/ic-input-component-container/ic-input-component-container.css

@@ -1,166 +0,0 @@
-ic-input-component-container {
-  /**
-   * @prop --border-color: Border colour of the input component container
-   */
-
-  display: flex;
-  border: var(--ic-space-1px) solid
-    var(--border-color, var(--ic-architectural-400));
-  border-radius: var(--ic-border-radius);
-  transition: var(--ic-easing-transition-slow);
-  height: 2.5rem;
-  width: var(--input-width, 20rem);
-  padding: var(--ic-space-1px);
-  background-color: var(--ic-architectural-white);
-  box-sizing: border-box;
-  fill: var(--ic-architectural-400);
-  outline: none;
-}
-
-ic-input-component-container.fullwidth {
-  width: 100%;
-}
-
-ic-input-component-container.disabled,
-ic-input-component-container.disabled:hover {
-  border: var(--ic-space-1px) dashed var(--ic-architectural-200);
-}
-
-ic-input-component-container.readonly,
-ic-input-component-container.readonly:hover {
-  border: none;
-  padding: 0;
-}
-
-ic-input-component-container.error {
-  border: var(--ic-error-border-default);
-  padding: 0;
-}
-
-ic-input-component-container.error:hover {
-  border: var(--ic-error-border-hover);
-}
-
-ic-input-component-container.error:focus-within {
-  border: var(--ic-error-border-pressed);
-}
-
-ic-input-component-container.warning {
-  border: var(--ic-warning-border-default);
-  padding: 0;
-}
-
-ic-input-component-container.warning:hover {
-  border: var(--ic-warning-border-hover);
-}
-
-ic-input-component-container.warning:focus-within {
-  border: var(--ic-warning-border-pressed);
-}
-
-ic-input-component-container.success {
-  border: var(--ic-success-border-default);
-  padding: 0;
-}
-
-ic-input-component-container.success:hover {
-  border: var(--ic-success-border-hover);
-}
-
-ic-input-component-container.success:focus-within {
-  border: var(--ic-success-border-pressed);
-}
-
-ic-input-component-container.small {
-  height: var(--ic-space-xl);
-}
-
-ic-input-component-container.multiline {
-  height: auto;
-}
-
-ic-input-component-container .icon-container {
-  margin-top: var(--ic-space-xxs);
-  margin-left: 0.438rem;
-  display: flex;
-  align-items: center;
-}
-
-ic-input-component-container.multiline .icon-container,
-ic-input-component-container.multiline.small .icon-container {
-  margin-top: 0.375rem;
-  display: block;
-}
-
-ic-input-component-container.readonly .icon-container {
-  margin-left: -0.313rem;
-}
-
-ic-input-component-container.disabled ::-moz-placeholder {
-  display: none;
-}
-
-ic-input-component-container.disabled ::placeholder {
-  display: none;
-}
-
-ic-input-component-container .inline-success {
-  margin: var(--ic-space-xs) 0.375rem;
-  display: flex;
-  align-items: center;
-}
-
-ic-input-component-container.dark:hover {
-  --border-color: var(--ic-architectural-400);
-}
-
-ic-input-component-container .inline-success > svg {
-  fill: var(--ic-status-success);
-  height: 1.25rem;
-  width: 1.25rem;
-}
-
-ic-input-component-container:hover {
-  border: var(--ic-border-hover);
-  color: var(--ic-action-dark-hover);
-}
-
-ic-input-component-container:focus {
-  border: var(--ic-border-pressed);
-}
-
-.focus-indicator {
-  display: flex;
-  width: 100%;
-  margin: -0.125rem;
-  padding: 0.125rem;
-  border-radius: var(--ic-border-radius);
-  transition: var(--ic-easing-transition-fast);
-}
-
-.focus-indicator:focus-within,
-.focus-indicator-enabled {
-  box-shadow: var(--ic-border-focus);
-}
-
-.focus-indicator.dark:focus-within {
-  box-shadow: var(--ic-border-focus);
-}
-
-@media (forced-colors: active) {
-  /* Styles here only apply to Forced Colors Mode */
-  ic-input-component-container,
-  .focus-indicator {
-    transition: none;
-  }
-
-  ic-input-component-container:focus-within {
-    border: var(--ic-space-1px) solid Highlight;
-    outline: 0.125rem solid Highlight;
-  }
-
-  ic-input-component-container.disabled,
-  ic-input-component-container.disabled:hover {
-    border: var(--ic-space-1px) dashed GrayText;
-  }
-}

package/dist/collection/components/ic-input-component-container/ic-input-component-container.js

@@ -1,209 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { IcInformationStatus, } from "../../utils/types";
-import successIcon from "../../assets/success-icon.svg";
-import { isSlotUsed } from "../../utils/helpers";
-/**
- * @slot left-icon - Content will be placed to the left of the input.
- */
-export class InputComponentContainer {
-  constructor() {
-    this.dark = false;
-    this.disabled = false;
-    this.fullWidth = false;
-    this.multiLine = false;
-    this.readonly = false;
-    this.small = false;
-    this.validationInline = false;
-    this.validationStatus = "";
-  }
-  render() {
-    const { small, validationStatus, disabled, readonly, multiLine, fullWidth, dark, validationInline, } = this;
-    const hasValidationStatus = this.validationStatus !== "" && !this.disabled && !this.readonly
-      ? true
-      : false;
-    return (h(Host, { class: {
-        ["small"]: small,
-        [validationStatus]: hasValidationStatus,
-        ["disabled"]: disabled,
-        ["readonly"]: readonly,
-        ["multiline"]: multiLine,
-        ["fullwidth"]: fullWidth,
-        ["dark"]: dark,
-      } }, h("div", { class: {
-        "focus-indicator": true,
-        dark: dark,
-      } }, isSlotUsed(this.host, "left-icon") && (h("div", { class: {
-        ["icon-container"]: true,
-      } }, h("slot", { name: "left-icon" }))), h("slot", null), validationInline &&
-      validationStatus === IcInformationStatus.Success && (h("span", { class: {
-        ["inline-success"]: true,
-      }, innerHTML: successIcon })))));
-  }
-  static get is() { return "ic-input-component-container"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ic-input-component-container.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ic-input-component-container.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "dark": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the dark variant of the input component container will be displayed."
-        },
-        "attribute": "dark",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the disabled state will be set."
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "fullWidth": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the input component container will fill the width of the container it is in."
-        },
-        "attribute": "full-width",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "multiLine": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the input component container will allow for multiple lines."
-        },
-        "attribute": "multi-line",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "readonly": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the readonly state will be set."
-        },
-        "attribute": "readonly",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "small": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the small styling will be applied to the input component container."
-        },
-        "attribute": "small",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "validationInline": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the validation will display inline."
-        },
-        "attribute": "validation-inline",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "validationStatus": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "IcInformationStatusOrEmpty",
-          "resolved": "\"\" | \"error\" | \"success\" | \"warning\"",
-          "references": {
-            "IcInformationStatusOrEmpty": {
-              "location": "import",
-              "path": "../../utils/types",
-              "id": "src/utils/types.ts::IcInformationStatusOrEmpty"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The validation status of the input component container - e.g. 'error' | 'warning' | 'success'."
-        },
-        "attribute": "validation-status",
-        "reflect": false,
-        "defaultValue": "\"\""
-      }
-    };
-  }
-  static get elementRef() { return "host"; }
-}
-//# sourceMappingURL=ic-input-component-container.js.map

package/dist/collection/components/ic-input-component-container/ic-input-component-container.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-input-component-container.js","sourceRoot":"","sources":["../../../src/components/ic-input-component-container/ic-input-component-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAElE,OAAO,EACL,mBAAmB,GAEpB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,WAAW,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEjD;;GAEG;AAKH,MAAM,OAAO,uBAAuB;;gBAMT,KAAK;oBAKF,KAAK;qBAKJ,KAAK;qBAKL,KAAK;oBAKN,KAAK;iBAKR,KAAK;4BAKM,KAAK;4BAKc,EAAE;;EAEzD,MAAM;IACJ,MAAM,EACJ,KAAK,EACL,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,SAAS,EACT,IAAI,EACJ,gBAAgB,GACjB,GAAG,IAAI,CAAC;IACT,MAAM,mBAAmB,GACvB,IAAI,CAAC,gBAAgB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ;MAC9D,CAAC,CAAC,IAAI;MACN,CAAC,CAAC,KAAK,CAAC;IACZ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,OAAO,CAAC,EAAE,KAAK;QAChB,CAAC,gBAAgB,CAAC,EAAE,mBAAmB;QACvC,CAAC,UAAU,CAAC,EAAE,QAAQ;QACtB,CAAC,UAAU,CAAC,EAAE,QAAQ;QACtB,CAAC,WAAW,CAAC,EAAE,SAAS;QACxB,CAAC,WAAW,CAAC,EAAE,SAAS;QACxB,CAAC,MAAM,CAAC,EAAE,IAAI;OACf;MAED,WACE,KAAK,EAAE;UACL,iBAAiB,EAAE,IAAI;UACvB,IAAI,EAAE,IAAI;SACX;QAEA,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,WAAW,CAAC,IAAI,CACrC,WACE,KAAK,EAAE;YACL,CAAC,gBAAgB,CAAC,EAAE,IAAI;WACzB;UAED,YAAM,IAAI,EAAC,WAAW,GAAG,CACrB,CACP;QACD,eAAa;QAEZ,gBAAgB;UACf,gBAAgB,KAAK,mBAAmB,CAAC,OAAO,IAAI,CAClD,YACE,KAAK,EAAE;YACL,CAAC,gBAAgB,CAAC,EAAE,IAAI;WACzB,EACD,SAAS,EAAE,WAAW,GACtB,CACH,CACC,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot left-icon - Content will be placed to the left of the input.\n */\n@Component({\n  tag: \"ic-input-component-container\",\n  styleUrl: \"ic-input-component-container.css\",\n})\nexport class InputComponentContainer {\n  @Element() host: HTMLIcInputComponentContainerElement;\n\n  /**\n   *  If `true`, the dark variant of the input component container will be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   *  If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   *  If `true`, the input component container will fill the width of the container it is in.\n   */\n  @Prop() fullWidth: boolean = false;\n\n  /**\n   *  If `true`, the input component container will allow for multiple lines.\n   */\n  @Prop() multiLine: boolean = false;\n\n  /**\n   *  If `true`, the readonly state will be set.\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   *  If `true`, the small styling will be applied to the input component container.\n   */\n  @Prop() small: boolean = false;\n\n  /**\n   *  If `true`, the validation will display inline.\n   */\n  @Prop() validationInline: boolean = false;\n\n  /**\n   * The validation status of the input component container - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n  render() {\n    const {\n      small,\n      validationStatus,\n      disabled,\n      readonly,\n      multiLine,\n      fullWidth,\n      dark,\n      validationInline,\n    } = this;\n    const hasValidationStatus =\n      this.validationStatus !== \"\" && !this.disabled && !this.readonly\n        ? true\n        : false;\n    return (\n      <Host\n        class={{\n          [\"small\"]: small,\n          [validationStatus]: hasValidationStatus,\n          [\"disabled\"]: disabled,\n          [\"readonly\"]: readonly,\n          [\"multiline\"]: multiLine,\n          [\"fullwidth\"]: fullWidth,\n          [\"dark\"]: dark,\n        }}\n      >\n        <div\n          class={{\n            \"focus-indicator\": true,\n            dark: dark,\n          }}\n        >\n          {isSlotUsed(this.host, \"left-icon\") && (\n            <div\n              class={{\n                [\"icon-container\"]: true,\n              }}\n            >\n              <slot name=\"left-icon\" />\n            </div>\n          )}\n          <slot></slot>\n\n          {validationInline &&\n            validationStatus === IcInformationStatus.Success && (\n              <span\n                class={{\n                  [\"inline-success\"]: true,\n                }}\n                innerHTML={successIcon}\n              />\n            )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-input-component-container/test/basic/ic-input-component-container.spec.js

@@ -1,117 +0,0 @@
-import { InputComponentContainer } from "../../ic-input-component-container";
-import { newSpecPage } from "@stencil/core/testing";
-describe("ic-input-component-container", () => {
-  it("renders", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container>
-      <div class="focus-indicator">
-        content
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-  it("renders with validation status", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="success">content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container validation-status="success" class="success">
-      <div class="focus-indicator">
-        content
-      </div>
-    </ic-input-component-container> 
-    `);
-  });
-  it("renders with validation inline", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="success" validation-inline=true>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container class="success" validation-inline="true" validation-status="success">
-      <div class="focus-indicator">
-        content
-        <span class="inline-success">
-          svg
-        </span>
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-  it("ignores validation inline if not success", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="error" validation-inline=true>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container class="error" validation-inline="true" validation-status="error">
-      <div class="focus-indicator">
-        content
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-  it("renders with small, multiline & fullwidth props set", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container small=true multi-line=true full-width=true>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container class="small fullwidth multiline" small="true" full-width="true" multi-line="true">
-      <div class="focus-indicator">
-        content
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-  it("renders disabled", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="success" disabled=true>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container validation-status="success" class="disabled" disabled="true">
-      <div class="focus-indicator">
-        content
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-  it("renders readonly", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="success" readonly=true>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-      <ic-input-component-container class="readonly" readonly="true" validation-status="success">
-        <div class="focus-indicator">
-          content
-        </div>
-      </ic-input-component-container>
-    `);
-  });
-  it("renders with slotted content", async () => {
-    const page = await newSpecPage({
-      components: [InputComponentContainer],
-      html: `<ic-input-component-container validation-status="success" disabled=true><span slot="left-icon">slotted content</span>content</ic-input-component-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-component-container class="disabled" disabled="true" validation-status="success">
-      <div class="focus-indicator">
-        <div class="icon-container">
-          <span slot="left-icon">
-            slotted content
-          </span>
-        </div>
-        content
-      </div>
-    </ic-input-component-container>
-    `);
-  });
-});
-//# sourceMappingURL=ic-input-component-container.spec.js.map

package/dist/collection/components/ic-input-component-container/test/basic/ic-input-component-container.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-input-component-container.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-input-component-container/test/basic/ic-input-component-container.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { InputComponentContainer } from \"../../ic-input-component-container\";\nimport { newSpecPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-input-component-container\", () => {\n  it(\"renders\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container>\n      <div class=\"focus-indicator\">\n        content\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n\n  it(\"renders with validation status\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"success\">content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container validation-status=\"success\" class=\"success\">\n      <div class=\"focus-indicator\">\n        content\n      </div>\n    </ic-input-component-container> \n    `);\n  });\n\n  it(\"renders with validation inline\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"success\" validation-inline=true>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container class=\"success\" validation-inline=\"true\" validation-status=\"success\">\n      <div class=\"focus-indicator\">\n        content\n        <span class=\"inline-success\">\n          svg\n        </span>\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n\n  it(\"ignores validation inline if not success\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"error\" validation-inline=true>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container class=\"error\" validation-inline=\"true\" validation-status=\"error\">\n      <div class=\"focus-indicator\">\n        content\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n\n  it(\"renders with small, multiline & fullwidth props set\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container small=true multi-line=true full-width=true>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container class=\"small fullwidth multiline\" small=\"true\" full-width=\"true\" multi-line=\"true\">\n      <div class=\"focus-indicator\">\n        content\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n\n  it(\"renders disabled\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"success\" disabled=true>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container validation-status=\"success\" class=\"disabled\" disabled=\"true\">\n      <div class=\"focus-indicator\">\n        content\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n\n  it(\"renders readonly\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"success\" readonly=true>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <ic-input-component-container class=\"readonly\" readonly=\"true\" validation-status=\"success\">\n        <div class=\"focus-indicator\">\n          content\n        </div>\n      </ic-input-component-container>\n    `);\n  });\n\n  it(\"renders with slotted content\", async () => {\n    const page = await newSpecPage({\n      components: [InputComponentContainer],\n      html: `<ic-input-component-container validation-status=\"success\" disabled=true><span slot=\"left-icon\">slotted content</span>content</ic-input-component-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-component-container class=\"disabled\" disabled=\"true\" validation-status=\"success\">\n      <div class=\"focus-indicator\">\n        <div class=\"icon-container\">\n          <span slot=\"left-icon\">\n            slotted content\n          </span>\n        </div>\n        content\n      </div>\n    </ic-input-component-container>\n    `);\n  });\n});\n"]}

package/dist/collection/components/ic-input-container/ic-input-container.css

@@ -1,4 +0,0 @@
-ic-input-container .component-container {
-  display: flex;
-  flex-direction: column;
-}

package/dist/collection/components/ic-input-container/ic-input-container.js

@@ -1,66 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class InputContainer {
-  constructor() {
-    this.disabled = false;
-    this.readonly = false;
-  }
-  render() {
-    return (h(Host, null, h("div", { class: {
-        ["component-container"]: true,
-        ["disabled"]: this.disabled,
-        ["readonly"]: this.readonly,
-      } }, h("slot", null))));
-  }
-  static get is() { return "ic-input-container"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ic-input-container.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ic-input-container.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the disabled state will be set."
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "readonly": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the readonly state will be set."
-        },
-        "attribute": "readonly",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-}
-//# sourceMappingURL=ic-input-container.js.map

package/dist/collection/components/ic-input-container/ic-input-container.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-input-container.js","sourceRoot":"","sources":["../../../src/components/ic-input-container/ic-input-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMzD,MAAM,OAAO,cAAc;;oBAII,KAAK;oBAKL,KAAK;;EAElC,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WACE,KAAK,EAAE;UACL,CAAC,qBAAqB,CAAC,EAAE,IAAI;UAC7B,CAAC,UAAU,CAAC,EAAE,IAAI,CAAC,QAAQ;UAC3B,CAAC,UAAU,CAAC,EAAE,IAAI,CAAC,QAAQ;SAC5B;QAED,eAAa,CACT,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from \"@stencil/core\";\n\n@Component({\n  tag: \"ic-input-container\",\n  styleUrl: \"ic-input-container.css\",\n})\nexport class InputContainer {\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly?: boolean = false;\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            [\"component-container\"]: true,\n            [\"disabled\"]: this.disabled,\n            [\"readonly\"]: this.readonly,\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-input-container/test/basic/ic-input-container.spec.js

@@ -1,38 +0,0 @@
-import { InputContainer } from "../../ic-input-container";
-import { newSpecPage } from "@stencil/core/testing";
-describe("ic-input-container", () => {
-  it("renders", async () => {
-    const page = await newSpecPage({
-      components: [InputContainer],
-      html: `<ic-input-container></ic-input-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-    <ic-input-container>
-      <div class="component-container"></div>
-    </ic-input-container>
-    `);
-  });
-  it("renders disabled", async () => {
-    const page = await newSpecPage({
-      components: [InputContainer],
-      html: `<ic-input-container disabled=true></ic-input-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-      <ic-input-container disabled="true">
-        <div class="component-container disabled"></div>
-      </ic-input-container>
-    `);
-  });
-  it("renders readonly", async () => {
-    const page = await newSpecPage({
-      components: [InputContainer],
-      html: `<ic-input-container readonly=true></ic-input-container>`,
-    });
-    expect(page.root).toEqualHtml(`
-      <ic-input-container readonly="true">
-        <div class="component-container readonly"></div>
-      </ic-input-container>
-    `);
-  });
-});
-//# sourceMappingURL=ic-input-container.spec.js.map

package/dist/collection/components/ic-input-container/test/basic/ic-input-container.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ic-input-container.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-input-container/test/basic/ic-input-container.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEpD,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,2CAA2C;KAClD,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,kBAAkB,EAAE,KAAK,IAAI,EAAE;IAChC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,yDAAyD;KAChE,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,kBAAkB,EAAE,KAAK,IAAI,EAAE;IAChC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,yDAAyD;KAChE,CAAC,CAAC;IAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;KAI7B,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { InputContainer } from \"../../ic-input-container\";\nimport { newSpecPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-input-container\", () => {\n  it(\"renders\", async () => {\n    const page = await newSpecPage({\n      components: [InputContainer],\n      html: `<ic-input-container></ic-input-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n    <ic-input-container>\n      <div class=\"component-container\"></div>\n    </ic-input-container>\n    `);\n  });\n\n  it(\"renders disabled\", async () => {\n    const page = await newSpecPage({\n      components: [InputContainer],\n      html: `<ic-input-container disabled=true></ic-input-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <ic-input-container disabled=\"true\">\n        <div class=\"component-container disabled\"></div>\n      </ic-input-container>\n    `);\n  });\n\n  it(\"renders readonly\", async () => {\n    const page = await newSpecPage({\n      components: [InputContainer],\n      html: `<ic-input-container readonly=true></ic-input-container>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <ic-input-container readonly=\"true\">\n        <div class=\"component-container readonly\"></div>\n      </ic-input-container>\n    `);\n  });\n});\n"]}

package/dist/collection/components/ic-input-label/ic-input-label.css

@@ -1,35 +0,0 @@
-ic-input-label {
-  margin-bottom: var(--ic-space-xs);
-}
-
-ic-input-label.with-helper {
-  margin-bottom: var(--ic-space-xxxs);
-}
-
-ic-input-label.readonly {
-  color: var(--ic-color-tertiary-text);
-}
-
-ic-input-label .helpertext {
-  margin-top: var(--ic-space-xxxs);
-}
-
-ic-input-label .helpertext-normal {
-  color: var(--ic-color-secondary-text);
-}
-
-ic-input-label .helpertext-readonly {
-  color: var(--ic-color-tertiary-text);
-}
-
-ic-input-label .readonly-label {
-  color: var(--ic-color-secondary-text);
-}
-
-ic-input-label .error-label {
-  color: var(--ic-status-error);
-}
-
-ic-input-label .dark {
-  color: var(--ic-architectural-white);
-}