npm - @ukic/web-components - Versions diffs - 2.26.0 → 3.0.0 - Mend

@ukic/web-components 2.26.0 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (856) hide show

package/dist/collection/components/ic-text-field/test/basic/ic-text-field.input.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-text-field.input.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.input.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders\");\n });\n\n it(\"should render with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=0></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-placeholder\");\n });\n\n it(\"should render with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-value\");\n });\n\n it(\"should render with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" helper-text=\"helper text value\" required=true size=\"small\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-helpertext\");\n });\n\n it(\"should render with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" autofocus=true autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-autoprops\");\n });\n\n it(\"should render with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-label\");\n });\n\n it(\"should render with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-icon\");\n });\n\n it(\"should render disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-disabled\");\n });\n\n it(\"should render readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-readonly\");\n });\n\n it(\"should render with max length\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"a long test value to exceed limit\" max-length=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-maxlength\");\n });\n\n it(\"should render with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-name-full-width\");\n });\n\n it(\"should render with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-success-validation\");\n });\n\n it(\"should render with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-warning-validation\");\n });\n\n it(\"should render with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-error-validation\");\n });\n\n it(\"should render with inline success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" validation-inline=\"true\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-inline-success-validation\");\n });\n\n it(\"should focus\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icFocus\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.focus();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should blur\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icBlur\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.blur();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should not show left icon if text field is disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 disabled>\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n const slot = page.root.shadowRoot.querySelector(`[slot=\"icon\"]`);\n expect(slot).toBeNull();\n });\n\n it(\"should not exceed max length if new value < max length\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-length=5></ic-text-field>`,\n });\n\n page.rootInstance.watchValueHandler(\"test\");\n expect(page.rootInstance.maxLengthExceeded).toBe(false);\n });\n\n it(\"should test keydown\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icKeydown\", eventSpy);\n const event = new KeyboardEvent(\"keydown\", { key: \"A\" });\n await page.rootInstance.handleKeyDown(event);\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test input\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const event = jest.fn();\n page.win.addEventListener(\"icInput\", event);\n\n await page.rootInstance.onInput({ target: { value: \"test value\" } });\n await page.waitForChanges();\n expect(page.rootInstance.value).toBe(\"test value\");\n expect(event).toHaveBeenCalled();\n });\n\n it(\"should test form reset event\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<form>\n <ic-text-field label=\"Test label\"></ic-text-field>\n <button id=\"resetButton\" type=\"reset\">Reset</button> \n </form>`,\n });\n\n expect(page.rootInstance.value).toBe(\"\");\n page.rootInstance.value = \"New value\";\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"New value\");\n\n await page.rootInstance.handleFormReset();\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"\");\n\n //test disconnected callback\n //delay to wait for icchange event to prevent console warning\n await waitForTimeout(500);\n page.setContent(\"\");\n });\n});\n\nit(\"should render with min/max and max validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"6\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max\");\n});\n\nit(\"should render with min/max and min validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"0\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-min\");\n});\n\nit(\"should test maxCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5></ic-text-field>`,\n });\n\n page.rootInstance.watchValueHandler(\"test\");\n expect(page.rootInstance.maxCharactersReached).toBe(false);\n page.rootInstance.watchValueHandler(\"testing\");\n expect(page.rootInstance.maxCharactersReached).toBe(true);\n});\n\nit(\"should test minCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min-characters=5 value=\"test\"></ic-text-field>`,\n });\n\n const input = page.root.shadowRoot.querySelector(\"input\");\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(true);\n\n page.rootInstance.value = \"testing\";\n await page.waitForChanges();\n\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(false);\n});\n\nit(\"should update any attributes that are inherited from the root element\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBeNull();\n\n page.root.setAttribute(\"title\", \"new-label\");\n page.rootInstance.hostMutationCallback([{ attributeName: \"title\" }]);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBe(\"new-label\");\n});\n"]}
1	+ {"version":3,"file":"ic-text-field.input.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.input.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders\");\n });\n\n it(\"should render with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=0></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-placeholder\");\n });\n\n it(\"should render with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-value\");\n });\n\n it(\"should render with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" helper-text=\"helper text value\" required=true size=\"small\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-helpertext\");\n });\n\n it(\"should render with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" autofocus=true autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-autoprops\");\n });\n\n it(\"should render with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-label\");\n });\n\n it(\"should render with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-icon\");\n });\n\n it(\"should render disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-disabled\");\n });\n\n it(\"should render readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-readonly\");\n });\n\n it(\"should render with max characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters\");\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-hidden-char-count\");\n });\n\n it(\"should render with max characters and a value set which exceeds the max number of characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"A long value which exceeds the max characters\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max-characters-long-value\");\n });\n\n it(\"should render with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-name-full-width\");\n });\n\n it(\"should render with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-success-validation\");\n });\n\n it(\"should render with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-warning-validation\");\n });\n\n it(\"should render with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-error-validation\");\n });\n\n it(\"should render with inline success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" validation-inline=\"true\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-inline-success-validation\");\n });\n\n it(\"should focus\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icFocus\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.focus();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should blur\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1></ic-text-field>`,\n });\n\n const callbackFn = jest.fn();\n page.doc.addEventListener(\"icBlur\", callbackFn);\n const input = page.root.shadowRoot.querySelector(\"input\");\n await input.blur();\n expect(callbackFn).toHaveBeenCalled();\n });\n\n it(\"should not show left icon if text field is disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 disabled>\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n const slot = page.root.shadowRoot.querySelector(`[slot=\"icon\"]`);\n expect(slot).toBeNull();\n });\n\n it(\"should test keydown\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icKeydown\", eventSpy);\n const event = new KeyboardEvent(\"keydown\", { key: \"A\" });\n await page.rootInstance.handleKeyDown(event);\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n\n it(\"should test input\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n\n const event = jest.fn();\n page.win.addEventListener(\"icInput\", event);\n\n await page.rootInstance.onInput({ target: { value: \"test value\" } });\n await page.waitForChanges();\n expect(page.rootInstance.value).toBe(\"test value\");\n expect(event).toHaveBeenCalled();\n });\n\n it(\"should test form reset event\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<form>\n <ic-text-field label=\"Test label\"></ic-text-field>\n <button id=\"resetButton\" type=\"reset\">Reset</button> \n </form>`,\n });\n\n expect(page.rootInstance.value).toBe(\"\");\n page.rootInstance.value = \"New value\";\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"New value\");\n\n await page.rootInstance.handleFormReset();\n await page.waitForChanges();\n\n expect(page.rootInstance.value).toBe(\"\");\n\n //test disconnected callback\n //delay to wait for icchange event to prevent console warning\n await waitForTimeout(500);\n page.setContent(\"\");\n });\n});\n\nit(\"should render with min/max and max validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"6\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-max\");\n});\n\nit(\"should render with min/max and min validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min=1 max=4 value=\"0\" inputmode=\"numeric\" type=\"number\"></ic-text-field>`,\n });\n\n expect(page.root).toMatchSnapshot(\"renders-with-min\");\n});\n\nit(\"should test setting value cannot exceed maxCharacters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5 value=\"Test value\"></ic-text-field>`,\n });\n\n expect(page.rootInstance.value).toBe(\"Test \");\n\n page.rootInstance.watchValueHandler(\"Another test value\");\n expect(page.rootInstance.value).toBe(\"Anoth\");\n});\n\nit(\"should test maxCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 max-characters=5></ic-text-field>`,\n });\n\n page.rootInstance.watchValueHandler(\"test\");\n expect(page.rootInstance.maxCharactersReached).toBe(false);\n page.rootInstance.watchValueHandler(\"testing\");\n expect(page.rootInstance.maxCharactersReached).toBe(true);\n});\n\nit(\"should test minCharacters method\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\" rows=1 min-characters=5 value=\"test\"></ic-text-field>`,\n });\n\n const input = page.root.shadowRoot.querySelector(\"input\");\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(true);\n\n page.rootInstance.value = \"testing\";\n await page.waitForChanges();\n\n input.blur();\n expect(page.rootInstance.minCharactersUnattained).toBe(false);\n});\n\nit(\"should update any attributes that are inherited from the root element\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field label=\"Test label\"></ic-text-field>`,\n });\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBeNull();\n\n page.root.setAttribute(\"title\", \"new-label\");\n page.rootInstance.hostMutationCallback([{ attributeName: \"title\" }]);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot.querySelector(\"input\").getAttribute(\"title\")\n ).toBe(\"new-label\");\n});\n"]}

package/dist/collection/components/ic-text-field/test/basic/ic-text-field.textarea.spec.js CHANGED Viewed

@@ -183,34 +183,65 @@ describe("ic-text-field", () => {
       </ic-text-field>
     `);
     });
-    it("should render textarea with max length", async () => {
+    it("should render textarea with max characters", async () => {
         const page = await newSpecPage({
             components: [TextField],
-            html: `<ic-text-field rows=6 label="Test label" value="a long test value to exceed limit" max-length=25></ic-text-field>`,
+            html: `<ic-text-field rows=6 label="Test label" value="Test value" max-characters=25></ic-text-field>`,
         });
         expect(page.root).toEqualHtml(`
-    <ic-text-field label="Test label" max-length="25" rows="6" value="a long test value to exceed limit">
-      <mock:shadow-root>
-        <ic-input-container>
-          <ic-input-label for="ic-text-field-input-9" helpertext="" label="Test label"></ic-input-label>
-          <ic-input-component-container multiline="" size="default" validationstatus="error"><textarea aria-describedby="ic-text-field-input-9-charcount-desc ic-text-field-input-9-validation-text" aria-invalid="true" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-9" inputmode="text" name="ic-text-field-input-9" placeholder="" rows="6" value="a long test value to exceed limit"></textarea>
-        </ic-input-component-container>
-    <ic-input-validation arialivemode="assertive" for="ic-text-field-input-9" message="Maximum length exceeded" status="error">
-            <div slot="validation-message-adornment">
-              <ic-typography class="error maxlengthtext" variant="caption">
-                <span aria-live="polite" id="ic-text-field-input-9-charcount" class="charcount">
-                  33/25
+      <ic-text-field label="Test label" max-characters="25" rows="6" value="Test value">
+        <mock:shadow-root>
+          <ic-input-container>
+            <ic-input-label for="ic-text-field-input-9" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus=""><textarea aria-describedby="ic-text-field-input-9-char-count-desc" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-9" inputmode="text" name="ic-text-field-input-9" placeholder="" rows="6" value="Test value"></textarea>
+            </ic-input-component-container>
+            <ic-input-validation arialivemode="polite" for="ic-text-field-input-9" message="" status="">
+              <div slot="validation-message-adornment">
+                <ic-typography class="char-count-text" variant="caption">
+                  <span class="char-count">
+                    10/25
+                  </span>
+                </ic-typography>
+                <span aria-live="polite" class="remaining-char-count-desc">
+                  15 characters remaining.
                 </span>
-                <span hidden="" id="ic-text-field-input-9-charcount-desc">
+                <span hidden="" id="ic-text-field-input-9-char-count-desc">
                   Field can contain a maximum of 25 characters.
                 </span>
-              </ic-typography>
-            </div>
-          </ic-input-validation>
-        </ic-input-container>
-      </mock:shadow-root>
-      <input class="ic-input" name="ic-text-field-input-9" type="hidden" value="a long test value to exceed limit">
-    </ic-text-field>
+              </div>
+            </ic-input-validation>
+          </ic-input-container>
+        </mock:shadow-root>
+        <input class="ic-input" name="ic-text-field-input-9" type="hidden" value="Test value">
+      </ic-text-field>
+    `);
+    });
+    it("should render with max characters and hidden character count", async () => {
+        const page = await newSpecPage({
+            components: [TextField],
+            html: `<ic-text-field rows=6 label="Test label" value="Test value" max-characters=25 hide-char-count></ic-text-field>`,
+        });
+        expect(page.root).toEqualHtml(`
+      <ic-text-field hide-char-count="" label="Test label" max-characters="25" rows="6" value="Test value">
+        <mock:shadow-root>
+          <ic-input-container>
+            <ic-input-label for="ic-text-field-input-10" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus=""><textarea aria-describedby="ic-text-field-input-10-char-count-desc" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-10" inputmode="text" name="ic-text-field-input-10" placeholder="" rows="6" value="Test value"></textarea>
+            </ic-input-component-container>
+            <ic-input-validation arialivemode="polite" for="ic-text-field-input-10" message="" status="">
+              <div slot="validation-message-adornment">
+                <span aria-live="polite" class="remaining-char-count-desc">
+                  15 characters remaining.
+                </span>
+                <span hidden="" id="ic-text-field-input-10-char-count-desc">
+                  Field can contain a maximum of 25 characters.
+                </span>
+              </div>
+            </ic-input-validation>
+          </ic-input-container>
+        </mock:shadow-root>
+        <input class="ic-input" name="ic-text-field-input-10" type="hidden" value="Test value">
+      </ic-text-field>
     `);
     });
     it("should render textarea with name & full width", async () => {
@@ -219,11 +250,11 @@ describe("ic-text-field", () => {
             html: `<ic-text-field rows=2 label="Test label" value="test value" name="mycontrolname" full-width=true></ic-text-field>`,
         });
         expect(page.root).toEqualHtml(`
-      <ic-text-field class="fullwidth" full-width="true" label="Test label" name="mycontrolname" rows="2" value="test value">
+      <ic-text-field class="ic-text-field-full-width" full-width="true" label="Test label" name="mycontrolname" rows="2" value="test value">
         <mock:shadow-root>
           <ic-input-container>
-            <ic-input-label for="ic-text-field-input-10" helpertext="" label="Test label"></ic-input-label>
-            <ic-input-component-container fullwidth="" size="default" multiline="" validationstatus=""><textarea aria-describedby="" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-10" inputmode="text" name="mycontrolname" placeholder="" rows="2" value="test value"></textarea>
+            <ic-input-label for="ic-text-field-input-11" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container fullwidth="" size="default" multiline="" validationstatus=""><textarea aria-describedby="" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-11" inputmode="text" name="mycontrolname" placeholder="" rows="2" value="test value"></textarea>
           </ic-input-component-container>
       </ic-input-container>
         </mock:shadow-root>
@@ -240,13 +271,13 @@ describe("ic-text-field", () => {
       <ic-text-field label="Test label" rows="6" validation-status="success" validation-text="Good choice!" value="test value">
         <mock:shadow-root>
           <ic-input-container>
-            <ic-input-label for="ic-text-field-input-11" helpertext="" label="Test label"></ic-input-label>
-            <ic-input-component-container multiline="" size="default" validationstatus="success"><textarea aria-describedby="ic-text-field-input-11-validation-text" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-11" inputmode="text" name="ic-text-field-input-11" placeholder="" rows="6" value="test value"></textarea>
+            <ic-input-label for="ic-text-field-input-12" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus="success"><textarea aria-describedby="ic-text-field-input-12-validation-text" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-12" inputmode="text" name="ic-text-field-input-12" placeholder="" rows="6" value="test value"></textarea>
           </ic-input-component-container>
-        <ic-input-validation arialivemode="polite" for="ic-text-field-input-11" message="Good choice!" status="success"></ic-input-validation>
+        <ic-input-validation arialivemode="polite" for="ic-text-field-input-12" message="Good choice!" status="success"></ic-input-validation>
           </ic-input-container>
         </mock:shadow-root>
-        <input class="ic-input" name="ic-text-field-input-11" type="hidden" value="test value">
+        <input class="ic-input" name="ic-text-field-input-12" type="hidden" value="test value">
       </ic-text-field>
     `);
     });
@@ -259,13 +290,13 @@ describe("ic-text-field", () => {
       <ic-text-field label="Test label" rows="6" validation-status="warning" validation-text="warning text" value="test value">
         <mock:shadow-root>
           <ic-input-container>
-            <ic-input-label for="ic-text-field-input-12" helpertext="" label="Test label"></ic-input-label>
-            <ic-input-component-container multiline="" size="default" validationstatus="warning"><textarea aria-describedby="ic-text-field-input-12-validation-text" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-12" inputmode="text" name="ic-text-field-input-12" placeholder="" rows="6" value="test value"></textarea>
+            <ic-input-label for="ic-text-field-input-13" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus="warning"><textarea aria-describedby="ic-text-field-input-13-validation-text" aria-invalid="false" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-13" inputmode="text" name="ic-text-field-input-13" placeholder="" rows="6" value="test value"></textarea>
           </ic-input-component-container>
-        <ic-input-validation arialivemode="polite" for="ic-text-field-input-12" message="warning text" status="warning"></ic-input-validation>
+        <ic-input-validation arialivemode="polite" for="ic-text-field-input-13" message="warning text" status="warning"></ic-input-validation>
           </ic-input-container>
         </mock:shadow-root>
-        <input class="ic-input" name="ic-text-field-input-12" type="hidden" value="test value">
+        <input class="ic-input" name="ic-text-field-input-13" type="hidden" value="test value">
       </ic-text-field>
     `);
     });
@@ -278,13 +309,13 @@ describe("ic-text-field", () => {
       <ic-text-field label="Test label" rows="6" validation-status="error" validation-text="error text" value="test value">
         <mock:shadow-root>
           <ic-input-container>
-            <ic-input-label for="ic-text-field-input-13" helpertext="" label="Test label"></ic-input-label>
-            <ic-input-component-container multiline="" size="default" validationstatus="error"><textarea aria-describedby="ic-text-field-input-13-validation-text" aria-invalid="true" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-13" inputmode="text" name="ic-text-field-input-13" placeholder="" rows="6" value="test value"></textarea>
+            <ic-input-label for="ic-text-field-input-14" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus="error"><textarea aria-describedby="ic-text-field-input-14-validation-text" aria-invalid="true" aria-label="Test label" autocapitalize="off" class="no-resize" id="ic-text-field-input-14" inputmode="text" name="ic-text-field-input-14" placeholder="" rows="6" value="test value"></textarea>
           </ic-input-component-container>
-        <ic-input-validation arialivemode="assertive" for="ic-text-field-input-13" message="error text" status="error"></ic-input-validation>
+        <ic-input-validation arialivemode="assertive" for="ic-text-field-input-14" message="error text" status="error"></ic-input-validation>
           </ic-input-container>
         </mock:shadow-root>
-        <input class="ic-input" name="ic-text-field-input-13" type="hidden" value="test value">
+        <input class="ic-input" name="ic-text-field-input-14" type="hidden" value="test value">
       </ic-text-field>
     `);
     });
@@ -297,12 +328,12 @@ describe("ic-text-field", () => {
       <ic-text-field label="Test label" resize="true" rows="6" value="test value">
         <mock:shadow-root>
           <ic-input-container>
-            <ic-input-label for="ic-text-field-input-14" helpertext="" label="Test label"></ic-input-label>
-            <ic-input-component-container multiline="" size="default" validationstatus=""><textarea aria-describedby="" aria-invalid="false" aria-label="Test label" autocapitalize="off" id="ic-text-field-input-14" inputmode="text" name="ic-text-field-input-14" placeholder="" rows="6" value="test value"></textarea>
+            <ic-input-label for="ic-text-field-input-15" helpertext="" label="Test label"></ic-input-label>
+            <ic-input-component-container multiline="" size="default" validationstatus=""><textarea aria-describedby="" aria-invalid="false" aria-label="Test label" autocapitalize="off" id="ic-text-field-input-15" inputmode="text" name="ic-text-field-input-15" placeholder="" rows="6" value="test value"></textarea>
           </ic-input-component-container>
       </ic-input-container>
         </mock:shadow-root>
-        <input class="ic-input" name="ic-text-field-input-14" type="hidden" value="test value">
+        <input class="ic-input" name="ic-text-field-input-15" type="hidden" value="test value">
       </ic-text-field>
     `);
     });

package/dist/collection/components/ic-text-field/test/basic/ic-text-field.textarea.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-text-field.textarea.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.textarea.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { newSpecPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render a textarea\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-0\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-0\" inputmode=\"text\" name=\"ic-text-field-input-0\" placeholder=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-0\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" placeholder=\"placeholder\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-1\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-1\" inputmode=\"text\" name=\"ic-text-field-input-1\" placeholder=\"placeholder\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-1\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-2\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-2\" inputmode=\"text\" name=\"ic-text-field-input-2\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-2\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" size=\"small\" helper-text=\"helper text value\" required=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field helper-text=\"helper text value\" label=\"Test label\" required=\"true\" rows=\"6\" value=\"\" size=\"small\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-3\" helpertext=\"helper text value\" label=\"Test label\" required=\"\"></ic-input-label>\n <ic-input-component-container size=\"small\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"ic-text-field-input-3-helper-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-3\" inputmode=\"text\" name=\"ic-text-field-input-3\" placeholder=\"\" required=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-3\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" autofocus=true autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\" autofocus=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-4\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"on\" class=\"no-resize\" id=\"ic-text-field-input-4\" inputmode=\"text\" name=\"ic-text-field-input-4\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-4\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field hide-label=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-5\" inputmode=\"text\" name=\"ic-text-field-input-5\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-5\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-6\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\">\n <span slot=\"left-icon\">\n <slot name=\"icon\"></slot>\n </span><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-6\" inputmode=\"text\" name=\"ic-text-field-input-6\" placeholder=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <svg fill=\"#000000\" height=\"24px\" slot=\"icon\" viewBox=\"0 0 24 24\" width=\"24px\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M0 0h24v24H0z\" fill=\"none\"></path>\n <path d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"></path>\n </svg>\n <input class=\"ic-input\" name=\"ic-text-field-input-6\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field disabled=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container disabled=\"\">\n <ic-input-label disabled=\"\" for=\"ic-text-field-input-7\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container disabled=\"\" size=\"default\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" disabled=\"\" id=\"ic-text-field-input-7\" inputmode=\"text\" name=\"ic-text-field-input-7\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" disabled=\"\" name=\"ic-text-field-input-7\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" readonly=\"\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container disabled=\"\" readonly=\"\">\n <ic-input-label for=\"ic-text-field-input-8\" helpertext=\"\" label=\"Test label\" readonly=\"\"></ic-input-label>\n <ic-input-component-container disabled=\"\" size=\"default\" multiline=\"\" readonly=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-left-pad no-resize readonly\" disabled=\"\" id=\"ic-text-field-input-8\" inputmode=\"text\" name=\"ic-text-field-input-8\" placeholder=\"\" readonly=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" disabled=\"\" name=\"ic-text-field-input-8\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with max length\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" value=\"a long test value to exceed limit\" max-length=25></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" max-length=\"25\" rows=\"6\" value=\"a long test value to exceed limit\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-9\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"error\"><textarea aria-describedby=\"ic-text-field-input-9-charcount-desc ic-text-field-input-9-validation-text\" aria-invalid=\"true\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-9\" inputmode=\"text\" name=\"ic-text-field-input-9\" placeholder=\"\" rows=\"6\" value=\"a long test value to exceed limit\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"assertive\" for=\"ic-text-field-input-9\" message=\"Maximum length exceeded\" status=\"error\">\n <div slot=\"validation-message-adornment\">\n <ic-typography class=\"error maxlengthtext\" variant=\"caption\">\n <span aria-live=\"polite\" id=\"ic-text-field-input-9-charcount\" class=\"charcount\">\n 33/25\n </span>\n <span hidden=\"\" id=\"ic-text-field-input-9-charcount-desc\">\n Field can contain a maximum of 25 characters.\n </span>\n </ic-typography>\n </div>\n </ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-9\" type=\"hidden\" value=\"a long test value to exceed limit\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=2 label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field class=\"fullwidth\" full-width=\"true\" label=\"Test label\" name=\"mycontrolname\" rows=\"2\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-10\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container fullwidth=\"\" size=\"default\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-10\" inputmode=\"text\" name=\"mycontrolname\" placeholder=\"\" rows=\"2\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"mycontrolname\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-11\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"success\"><textarea aria-describedby=\"ic-text-field-input-11-validation-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-11\" inputmode=\"text\" name=\"ic-text-field-input-11\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-11\" message=\"Good choice!\" status=\"success\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-11\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-12\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"warning\"><textarea aria-describedby=\"ic-text-field-input-12-validation-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-12\" inputmode=\"text\" name=\"ic-text-field-input-12\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-12\" message=\"warning text\" status=\"warning\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-12\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-13\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"error\"><textarea aria-describedby=\"ic-text-field-input-13-validation-text\" aria-invalid=\"true\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-13\" inputmode=\"text\" name=\"ic-text-field-input-13\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"assertive\" for=\"ic-text-field-input-13\" message=\"error text\" status=\"error\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-13\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with resize\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" resize=true value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" resize=\"true\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-14\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" id=\"ic-text-field-input-14\" inputmode=\"text\" name=\"ic-text-field-input-14\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-14\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n});\n"]}
1	+ {"version":3,"file":"ic-text-field.textarea.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-text-field/test/basic/ic-text-field.textarea.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEpD,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;IAC7B,EAAE,CAAC,0BAA0B,EAAE,KAAK,IAAI,EAAE;QACxC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,6DAA6D;SACpE,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;QACvD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,uFAAuF;SAC9F,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,gFAAgF;SACvF,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4DAA4D,EAAE,KAAK,IAAI,EAAE;QAC1E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,wHAAwH;SAC/H,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,sJAAsJ;SAC7J,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,0CAA0C,EAAE,KAAK,IAAI,EAAE;QACxD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,gGAAgG;SACvG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;KAU7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE;;;;;;;;;;;;;;uBAcW;SAClB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;KAkB7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,8FAA8F;SACrG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,8FAA8F;SACrG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;QAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,gGAAgG;SACvG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;KA0B7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,gHAAgH;SACvH,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;KAqB7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+CAA+C,EAAE,KAAK,IAAI,EAAE;QAC7D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,mHAAmH;SAC1H,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gDAAgD,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,yIAAyI;SAChJ,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;KAY7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gDAAgD,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,yIAAyI;SAChJ,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;KAY7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC5D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,qIAAqI;SAC5I,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;KAY7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oCAAoC,EAAE,KAAK,IAAI,EAAE;QAClD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,SAAS,CAAC;YACvB,IAAI,EAAE,0FAA0F;SACjG,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;KAW7B,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { TextField } from \"../../ic-text-field\";\nimport { newSpecPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-text-field\", () => {\n it(\"should render a textarea\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-0\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-0\" inputmode=\"text\" name=\"ic-text-field-input-0\" placeholder=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-0\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with placeholder\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" placeholder=\"placeholder\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" placeholder=\"placeholder\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-1\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-1\" inputmode=\"text\" name=\"ic-text-field-input-1\" placeholder=\"placeholder\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-1\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with value\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-2\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-2\" inputmode=\"text\" name=\"ic-text-field-input-2\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-2\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with helperText, required and small\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" size=\"small\" helper-text=\"helper text value\" required=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field helper-text=\"helper text value\" label=\"Test label\" required=\"true\" rows=\"6\" value=\"\" size=\"small\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-3\" helpertext=\"helper text value\" label=\"Test label\" required=\"\"></ic-input-label>\n <ic-input-component-container size=\"small\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"ic-text-field-input-3-helper-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-3\" inputmode=\"text\" name=\"ic-text-field-input-3\" placeholder=\"\" required=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-3\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with autoprops\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" autofocus=true autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field autocapitalize=\"on\" autocomplete=\"on\" autocorrect=\"on\" autofocus=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-4\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"on\" class=\"no-resize\" id=\"ic-text-field-input-4\" inputmode=\"text\" name=\"ic-text-field-input-4\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-4\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with hidden label\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" hide-label=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field hide-label=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-5\" inputmode=\"text\" name=\"ic-text-field-input-5\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-5\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with icon\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\">\n <svg\n slot=\"icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#000000\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"\n />\n </svg>\n </ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" value=\"\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-6\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\">\n <span slot=\"left-icon\">\n <slot name=\"icon\"></slot>\n </span><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-6\" inputmode=\"text\" name=\"ic-text-field-input-6\" placeholder=\"\" rows=\"6\" value=\"\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <svg fill=\"#000000\" height=\"24px\" slot=\"icon\" viewBox=\"0 0 24 24\" width=\"24px\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M0 0h24v24H0z\" fill=\"none\"></path>\n <path d=\"M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z\"></path>\n </svg>\n <input class=\"ic-input\" name=\"ic-text-field-input-6\" type=\"hidden\" value=\"\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea disabled\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" disabled=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field disabled=\"true\" label=\"Test label\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container disabled=\"\">\n <ic-input-label disabled=\"\" for=\"ic-text-field-input-7\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container disabled=\"\" size=\"default\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" disabled=\"\" id=\"ic-text-field-input-7\" inputmode=\"text\" name=\"ic-text-field-input-7\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" disabled=\"\" name=\"ic-text-field-input-7\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea readonly\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=\"6\" label=\"Test label\" value=\"test value\" readonly=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" readonly=\"\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container disabled=\"\" readonly=\"\">\n <ic-input-label for=\"ic-text-field-input-8\" helpertext=\"\" label=\"Test label\" readonly=\"\"></ic-input-label>\n <ic-input-component-container disabled=\"\" size=\"default\" multiline=\"\" readonly=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-left-pad no-resize readonly\" disabled=\"\" id=\"ic-text-field-input-8\" inputmode=\"text\" name=\"ic-text-field-input-8\" placeholder=\"\" readonly=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" disabled=\"\" name=\"ic-text-field-input-8\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with max characters\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" value=\"Test value\" max-characters=25></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" max-characters=\"25\" rows=\"6\" value=\"Test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-9\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"ic-text-field-input-9-char-count-desc\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-9\" inputmode=\"text\" name=\"ic-text-field-input-9\" placeholder=\"\" rows=\"6\" value=\"Test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-9\" message=\"\" status=\"\">\n <div slot=\"validation-message-adornment\">\n <ic-typography class=\"char-count-text\" variant=\"caption\">\n <span class=\"char-count\">\n 10/25\n </span>\n </ic-typography>\n <span aria-live=\"polite\" class=\"remaining-char-count-desc\">\n 15 characters remaining.\n </span>\n <span hidden=\"\" id=\"ic-text-field-input-9-char-count-desc\">\n Field can contain a maximum of 25 characters.\n </span>\n </div>\n </ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-9\" type=\"hidden\" value=\"Test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render with max characters and hidden character count\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" value=\"Test value\" max-characters=25 hide-char-count></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field hide-char-count=\"\" label=\"Test label\" max-characters=\"25\" rows=\"6\" value=\"Test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-10\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"ic-text-field-input-10-char-count-desc\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-10\" inputmode=\"text\" name=\"ic-text-field-input-10\" placeholder=\"\" rows=\"6\" value=\"Test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-10\" message=\"\" status=\"\">\n <div slot=\"validation-message-adornment\">\n <span aria-live=\"polite\" class=\"remaining-char-count-desc\">\n 15 characters remaining.\n </span>\n <span hidden=\"\" id=\"ic-text-field-input-10-char-count-desc\">\n Field can contain a maximum of 25 characters.\n </span>\n </div>\n </ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-10\" type=\"hidden\" value=\"Test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with name & full width\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=2 label=\"Test label\" value=\"test value\" name=\"mycontrolname\" full-width=true></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field class=\"ic-text-field-full-width\" full-width=\"true\" label=\"Test label\" name=\"mycontrolname\" rows=\"2\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-11\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container fullwidth=\"\" size=\"default\" multiline=\"\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-11\" inputmode=\"text\" name=\"mycontrolname\" placeholder=\"\" rows=\"2\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"mycontrolname\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with success validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"success\" validation-text=\"Good choice!\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-12\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"success\"><textarea aria-describedby=\"ic-text-field-input-12-validation-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-12\" inputmode=\"text\" name=\"ic-text-field-input-12\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-12\" message=\"Good choice!\" status=\"success\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-12\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with warning validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"warning\" validation-text=\"warning text\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-13\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"warning\"><textarea aria-describedby=\"ic-text-field-input-13-validation-text\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-13\" inputmode=\"text\" name=\"ic-text-field-input-13\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"polite\" for=\"ic-text-field-input-13\" message=\"warning text\" status=\"warning\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-13\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with error validation\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" rows=\"6\" validation-status=\"error\" validation-text=\"error text\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-14\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"error\"><textarea aria-describedby=\"ic-text-field-input-14-validation-text\" aria-invalid=\"true\" aria-label=\"Test label\" autocapitalize=\"off\" class=\"no-resize\" id=\"ic-text-field-input-14\" inputmode=\"text\" name=\"ic-text-field-input-14\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n <ic-input-validation arialivemode=\"assertive\" for=\"ic-text-field-input-14\" message=\"error text\" status=\"error\"></ic-input-validation>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-14\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n\n it(\"should render textarea with resize\", async () => {\n const page = await newSpecPage({\n components: [TextField],\n html: `<ic-text-field rows=6 label=\"Test label\" resize=true value=\"test value\"></ic-text-field>`,\n });\n\n expect(page.root).toEqualHtml(`\n <ic-text-field label=\"Test label\" resize=\"true\" rows=\"6\" value=\"test value\">\n <mock:shadow-root>\n <ic-input-container>\n <ic-input-label for=\"ic-text-field-input-15\" helpertext=\"\" label=\"Test label\"></ic-input-label>\n <ic-input-component-container multiline=\"\" size=\"default\" validationstatus=\"\"><textarea aria-describedby=\"\" aria-invalid=\"false\" aria-label=\"Test label\" autocapitalize=\"off\" id=\"ic-text-field-input-15\" inputmode=\"text\" name=\"ic-text-field-input-15\" placeholder=\"\" rows=\"6\" value=\"test value\"></textarea>\n </ic-input-component-container>\n </ic-input-container>\n </mock:shadow-root>\n <input class=\"ic-input\" name=\"ic-text-field-input-15\" type=\"hidden\" value=\"test value\">\n </ic-text-field>\n `);\n });\n});\n"]}

package/dist/collection/components/ic-toast/ic-toast.css CHANGED Viewed

@@ -456,11 +456,15 @@ video {
   z-index: var(--ic-z-index-toast);
 }
-:host(.hidden) {
+:host(.ic-toast-hidden) {
   display: none;
   animation: fadeout var(--ic-transition-duration-slow) ease-in-out;
 }
+:host(:focus) {
+  outline: none;
+}
 .container {
   max-width: 32.5rem;
   min-width: 18rem;
@@ -552,11 +556,14 @@ video {
   padding-bottom: var(--ic-space-md);
 }
-ic-button,
-.toast-dismiss-timer {
+ic-button {
   padding: var(--ic-space-xs);
 }
+.toast-dismiss-timer {
+  padding: var(--ic-space-sm);
+}
 @media (max-width: 576px) {
   :host {
     --bottom-position: var(--ic-space-lg);