npm - q2-tecton-elements - Versions diffs - 1.54.5 → 1.54.7 - Mend

q2-tecton-elements 1.54.5 → 1.54.7

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 (389) hide show

package/dist/collection/components/q2-avatar/q2-avatar.js CHANGED Viewed

@@ -48,7 +48,7 @@ export class Q2Avatar {
         const isLoaded = this.isLoaded;
         const showInitials = (this.name || this.initials) && (!this.src || this.badSrc);
         const showFallback = !this.name && !this.initials && (!this.src || this.badSrc);
-        return (h("div", { key: '2377fb1226c542252d8c1826aa762cc0267bb8a2' }, showImg && (h("img", { key: 'baa5c36dd4be833bd017daa75b57dc0cf9ea01bf', class: isLoaded ? 'avatar-img' : 'avatar-img-default', "test-id": "userImage", src: this.src, onError: this.onError, onLoad: this.onLoad, alt: this.name || '' })), showInitials && (h("svg", { key: 'd4977d3adf04544ed9f13b079abfa2a2e1ce3a56', viewBox: "0 0 100 100", preserveAspectRatio: "xMidYMid meet", "test-id": "userInitials", class: `avatar-initials size-${computedInitials.length}`, "aria-label": this.name, "aria-hidden": !this.name && 'true' }, h("text", { key: '8de6490d4949b8f20beef384ba78c371edf1d81a', x: "50", y: "50", "dominant-baseline": "central", "text-anchor": "middle", "aria-hidden": "true" }, computedInitials))), showFallback && (h("div", { key: '9946f0f312626acb2693ef058b98480a5c4011ed', "test-id": "fallbackIcon", class: "fallback" }, h("q2-icon", { key: 'd6c99a8f8b12216c7a00d936f22ec7ac49aec151', type: this.icon })))));
+        return (h("div", { key: 'fb5f6b225de751e0d0aeb5b9e2d92128f184c899' }, showImg && (h("img", { key: '093ecb0b7e608589fda969b54ef3d5bc072ce245', class: isLoaded ? 'avatar-img' : 'avatar-img-default', "test-id": "userImage", src: this.src, onError: this.onError, onLoad: this.onLoad, alt: this.name || '' })), showInitials && (h("svg", { key: 'dac89c0aca1a250d5d15b8536d323cf1b4bbe616', viewBox: "0 0 100 100", preserveAspectRatio: "xMidYMid meet", "test-id": "userInitials", class: `avatar-initials size-${computedInitials.length}`, "aria-label": this.name, "aria-hidden": !this.name && 'true' }, h("text", { key: '85cdca32e6172a0f9c3b590a277a056fbec6c8ae', x: "50", y: "50", "dominant-baseline": "central", "text-anchor": "middle", "aria-hidden": "true" }, computedInitials))), showFallback && (h("div", { key: '2a8e7bb8d8d7f25b7df61f162b0adc362a6dbbb6', "test-id": "fallbackIcon", class: "fallback" }, h("q2-icon", { key: 'ddb717e672bc21ce35823e69255d4fda8c50dc61', type: this.icon })))));
     }
     static get is() { return "q2-avatar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/q2-avatar/q2-avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-avatar.js","sourceRoot":"","sources":["~~../../../~~src/components/q2-avatar/q2-avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, h, State, Watch } from '@stencil/core';\n\n@Component({ tag: 'q2-avatar', shadow: true, styleUrl: 'q2-avatar.scss' })\nexport class Q2Avatar implements ComponentInterface {\n // #region Host HTML Element\n\n @Element()\n el: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n badSrc: boolean = false;\n\n @State()\n isLoaded: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** A [q2-icon](https://tecton.q2developer.com/design-system/q2-icon/) to display as the fallback. /\n @Prop()\n icon: string = 'person';\n\n /* A set of up to four initials to display as capitalized text. Takes priority over `name`. /\n @Prop({ reflect: true })\n initials: string;\n\n /\n The name associated with the avatar.\n * The initials of the first and last words provided will display as capital letters.\n \n @info\n * We recommend always providing a name when you want the avatar to be presented to screen readers.\n /\n @Prop({ reflect: true })\n name: string;\n\n /* Displays the image provided by the user. */\n @Prop({ reflect: true })\n src: string;\n\n // #endregion\n // #region Watchers\n\n @Watch('src')\n srcDidUpdate() {\n this.badSrc = false;\n }\n\n // #endregion\n // #region Local Methods\n\n get computedInitials() {\n const { initials, name } = this;\n if (!initials && !name) return;\n\n let result = '';\n if (initials) {\n result = initials.substr(0, 4);\n } else if (name) {\n const parts = name.split(' ');\n const firstCharacter = parts[0][0];\n const lastCharacter = parts.length > 1 ? parts[parts.length - 1][0] : undefined;\n result += firstCharacter;\n if (lastCharacter) result += lastCharacter;\n }\n\n result = result?.toUpperCase();\n\n return result;\n }\n\n onError = () => {\n this.badSrc = true;\n };\n\n onLoad = () => {\n this.isLoaded = true;\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const { computedInitials } = this;\n const showImg = this.src && !this.badSrc;\n const isLoaded = this.isLoaded;\n const showInitials = (this.name \|\| this.initials) && (!this.src \|\| this.badSrc);\n const showFallback = !this.name && !this.initials && (!this.src \|\| this.badSrc);\n\n return (\n <div>\n {showImg && (\n <img\n class={isLoaded ? 'avatar-img' : 'avatar-img-default'}\n test-id=\"userImage\"\n src={this.src}\n onError={this.onError}\n onLoad={this.onLoad}\n alt={this.name \|\| ''}\n />\n )}\n {showInitials && (\n <svg\n viewBox=\"0 0 100 100\"\n preserveAspectRatio=\"xMidYMid meet\"\n test-id=\"userInitials\"\n class={`avatar-initials size-${computedInitials.length}`}\n aria-label={this.name}\n aria-hidden={!this.name && 'true'}\n >\n <text\n x=\"50\"\n y=\"50\"\n dominant-baseline=\"central\"\n text-anchor=\"middle\"\n aria-hidden=\"true\"\n >\n {computedInitials}\n </text>\n </svg>\n )}\n {showFallback && (\n <div\n test-id=\"fallbackIcon\"\n class=\"fallback\"\n >\n <q2-icon type={this.icon}></q2-icon>\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n"]}
1	+ {"version":3,"file":"q2-avatar.js","sourceRoot":"","sources":["../../../../src/components/q2-avatar/q2-avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentInterface, Prop, Element, h, State, Watch } from '@stencil/core';\n\n@Component({ tag: 'q2-avatar', shadow: true, styleUrl: 'q2-avatar.scss' })\nexport class Q2Avatar implements ComponentInterface {\n // #region Host HTML Element\n\n @Element()\n el: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n badSrc: boolean = false;\n\n @State()\n isLoaded: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /** A [q2-icon](https://tecton.q2developer.com/design-system/q2-icon/) to display as the fallback. /\n @Prop()\n icon: string = 'person';\n\n /* A set of up to four initials to display as capitalized text. Takes priority over `name`. /\n @Prop({ reflect: true })\n initials: string;\n\n /\n The name associated with the avatar.\n * The initials of the first and last words provided will display as capital letters.\n \n @info\n * We recommend always providing a name when you want the avatar to be presented to screen readers.\n /\n @Prop({ reflect: true })\n name: string;\n\n /* Displays the image provided by the user. */\n @Prop({ reflect: true })\n src: string;\n\n // #endregion\n // #region Watchers\n\n @Watch('src')\n srcDidUpdate() {\n this.badSrc = false;\n }\n\n // #endregion\n // #region Local Methods\n\n get computedInitials() {\n const { initials, name } = this;\n if (!initials && !name) return;\n\n let result = '';\n if (initials) {\n result = initials.substr(0, 4);\n } else if (name) {\n const parts = name.split(' ');\n const firstCharacter = parts[0][0];\n const lastCharacter = parts.length > 1 ? parts[parts.length - 1][0] : undefined;\n result += firstCharacter;\n if (lastCharacter) result += lastCharacter;\n }\n\n result = result?.toUpperCase();\n\n return result;\n }\n\n onError = () => {\n this.badSrc = true;\n };\n\n onLoad = () => {\n this.isLoaded = true;\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const { computedInitials } = this;\n const showImg = this.src && !this.badSrc;\n const isLoaded = this.isLoaded;\n const showInitials = (this.name \|\| this.initials) && (!this.src \|\| this.badSrc);\n const showFallback = !this.name && !this.initials && (!this.src \|\| this.badSrc);\n\n return (\n <div>\n {showImg && (\n <img\n class={isLoaded ? 'avatar-img' : 'avatar-img-default'}\n test-id=\"userImage\"\n src={this.src}\n onError={this.onError}\n onLoad={this.onLoad}\n alt={this.name \|\| ''}\n />\n )}\n {showInitials && (\n <svg\n viewBox=\"0 0 100 100\"\n preserveAspectRatio=\"xMidYMid meet\"\n test-id=\"userInitials\"\n class={`avatar-initials size-${computedInitials.length}`}\n aria-label={this.name}\n aria-hidden={!this.name && 'true'}\n >\n <text\n x=\"50\"\n y=\"50\"\n dominant-baseline=\"central\"\n text-anchor=\"middle\"\n aria-hidden=\"true\"\n >\n {computedInitials}\n </text>\n </svg>\n )}\n {showFallback && (\n <div\n test-id=\"fallbackIcon\"\n class=\"fallback\"\n >\n <q2-icon type={this.icon}></q2-icon>\n </div>\n )}\n </div>\n );\n }\n\n // #endregion\n}\n"]}

package/dist/collection/components/q2-avatar/test/q2-avatar-test.e2e.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-avatar-test.e2e.js","sourceRoot":"","sources":["../../../../src/components/q2-avatar/test/q2-avatar-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { evaluateA11y, getListOfStyleCompilationIssues, setup } from '@/utils/helpers';\n\nconst base64Image =\n 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII=';\ndescribe('q2-avatar', () => {\n it('properly compiles CSS vars and functions', async () => {\n const page = await setup({ html: `<q2-avatar></q2-avatar>` });\n expect(await getListOfStyleCompilationIssues(page, 'q2-avatar')).toHaveLength(0);\n });\n\n describe('@Props', () => {\n describe('src', () => {\n describe('when provided', () => {\n it('loads image', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n const avatar = await page.find('q2-avatar');\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n const imageSrc = image.getAttribute('src');\n const avatarCss = await avatar.getComputedStyle();\n const imageCss = await image.getComputedStyle();\n\n expect(imageSrc).toEqual(base64Image);\n expect(avatarCss.backgroundColor).toEqual('rgba(0, 0, 0, 0)');\n expect(imageCss.borderRadius).toEqual('50%');\n expect(image).toHaveClass('avatar-img');\n });\n\n it('updates image', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n let userImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(userImage.getAttribute('src')).toEqual(base64Image);\n\n const image = await page.find('q2-avatar');\n\n image.setProperty(\n 'src',\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n\n await page.waitForChanges();\n\n userImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(userImage.getAttribute('src')).toEqual(\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n });\n\n it('updates img tag to a non-error state', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"sara marshall src=\"badUrl\" ></q2-avatar>',\n });\n await page.waitForChanges();\n\n const badImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(badImage).toBeFalsy();\n\n const avatar = await page.find('q2-avatar');\n avatar.setProperty(\n 'src',\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n await page.waitForChanges();\n\n const goodImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(goodImage.getAttribute('src')).toEqual(\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n });\n });\n });\n\n describe('name', () => {\n describe('when provided', () => {\n it('calculates initials from name attribute', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n const initialsSvgCss = await initialsSvg.getComputedStyle();\n\n expect(initialsSvgCss.borderRadius).toEqual('50%');\n expect(initialsSvg.innerText).toEqual('JR');\n expect(initialsSvg).toEqualAttribute('aria-label', 'john peter robinson');\n expect(initialsSvg).not.toHaveAttribute('aria-hidden');\n });\n\n it('recalculates if changed', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"john peter robinson\"></q2-avatar>',\n });\n\n let userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('JR');\n\n const avatar = await page.find('q2-avatar');\n\n avatar.setProperty('name', 'sarah marshall');\n\n await page.waitForChanges();\n\n userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('SM');\n });\n\n it('adds aria-label to initials SVG', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar name=\"john peter robinson\"></q2-avatar>`,\n });\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(initialsSvg).toEqualAttribute('aria-label', 'john peter robinson');\n expect(initialsSvg).not.toHaveAttribute('aria-hidden');\n });\n\n it('adds name as an alt tag to img', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\" name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(image).toEqualAttribute('alt', 'john peter robinson');\n });\n });\n\n describe('when not provided', () => {\n it('adds aria-hidden to initials SVG', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"JCVD\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(initialsSvg).not.toHaveAttribute('aria-label');\n expect(initialsSvg).toEqualAttribute('aria-hidden', 'true');\n });\n\n it('adds empty alt tag to image', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(image).toEqualAttribute('alt', '');\n });\n });\n });\n\n describe('initials', () => {\n describe('when provided', () => {\n it('prioritizes initials over name attribute', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"JKVD\" name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n const initialsSvgCss = await initialsSvg.getComputedStyle();\n\n expect(initialsSvgCss.borderRadius).toEqual('50%');\n expect(initialsSvg.innerText).toEqual('JKVD');\n });\n\n it('limits the initials to four characters', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"ABCDEFG\"></q2-avatar>`,\n });\n\n const el = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(el.innerText).toEqual('ABCD');\n });\n });\n });\n describe('icon', () => {\n describe('when provided', () => {\n it('renders custom fallback icon', async function () {\n const page = await setup({ html: '<q2-avatar icon=\"info\"></q2-avatar>' });\n\n const fallbackIcon = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"] q2-icon');\n const fallbackIconContainer = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"]');\n const fallbackIconContainerCss = await fallbackIconContainer.getComputedStyle();\n\n expect(fallbackIconContainerCss.borderRadius).toEqual('50%');\n expect(fallbackIcon).toEqualAttribute('type', 'info');\n });\n });\n\n describe('when not provided', () => {\n it('renders default fallback icon', async function () {\n const page = await setup({ html: '<q2-avatar></q2-avatar>' });\n\n const fallbackIcon = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"] q2-icon');\n\n expect(fallbackIcon).toEqualAttribute('type', 'person');\n });\n });\n });\n });\n\n it.skip('img should be removed if url does not work', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"sara marshall\" src=\"badUrl\" ></q2-avatar>',\n });\n\n const badImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(badImage).toEqual(badImage);\n\n page.waitForChanges();\n\n expect(badImage).toBeFalsy();\n\n const userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('SM');\n });\n\n describe('Accessibility', () => {\n describe('aXe DevTools', () => {\n it('does not have accessibility violations', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n const hasViolations = await evaluateA11y(page);\n expect(hasViolations).toBe(false);\n });\n });\n describe('Accessibility Tree', () => {});\n describe('Keyboard Controls', () => {});\n describe('Other', () => {});\n });\n});\n"]}
1	+ {"version":3,"file":"q2-avatar-test.e2e.js","sourceRoot":"","sources":["../../../../../src/components/q2-avatar/test/q2-avatar-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { evaluateA11y, getListOfStyleCompilationIssues, setup } from '@/utils/helpers';\n\nconst base64Image =\n 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII=';\ndescribe('q2-avatar', () => {\n it('properly compiles CSS vars and functions', async () => {\n const page = await setup({ html: `<q2-avatar></q2-avatar>` });\n expect(await getListOfStyleCompilationIssues(page, 'q2-avatar')).toHaveLength(0);\n });\n\n describe('@Props', () => {\n describe('src', () => {\n describe('when provided', () => {\n it('loads image', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n const avatar = await page.find('q2-avatar');\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n const imageSrc = image.getAttribute('src');\n const avatarCss = await avatar.getComputedStyle();\n const imageCss = await image.getComputedStyle();\n\n expect(imageSrc).toEqual(base64Image);\n expect(avatarCss.backgroundColor).toEqual('rgba(0, 0, 0, 0)');\n expect(imageCss.borderRadius).toEqual('50%');\n expect(image).toHaveClass('avatar-img');\n });\n\n it('updates image', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n let userImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(userImage.getAttribute('src')).toEqual(base64Image);\n\n const image = await page.find('q2-avatar');\n\n image.setProperty(\n 'src',\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n\n await page.waitForChanges();\n\n userImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(userImage.getAttribute('src')).toEqual(\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n });\n\n it('updates img tag to a non-error state', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"sara marshall src=\"badUrl\" ></q2-avatar>',\n });\n await page.waitForChanges();\n\n const badImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(badImage).toBeFalsy();\n\n const avatar = await page.find('q2-avatar');\n avatar.setProperty(\n 'src',\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n await page.waitForChanges();\n\n const goodImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(goodImage.getAttribute('src')).toEqual(\n 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKaiKiPcLJj7ufrj6M2KaPwyCT4lDSFA5oog&usqp=CAU'\n );\n });\n });\n });\n\n describe('name', () => {\n describe('when provided', () => {\n it('calculates initials from name attribute', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n const initialsSvgCss = await initialsSvg.getComputedStyle();\n\n expect(initialsSvgCss.borderRadius).toEqual('50%');\n expect(initialsSvg.innerText).toEqual('JR');\n expect(initialsSvg).toEqualAttribute('aria-label', 'john peter robinson');\n expect(initialsSvg).not.toHaveAttribute('aria-hidden');\n });\n\n it('recalculates if changed', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"john peter robinson\"></q2-avatar>',\n });\n\n let userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('JR');\n\n const avatar = await page.find('q2-avatar');\n\n avatar.setProperty('name', 'sarah marshall');\n\n await page.waitForChanges();\n\n userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('SM');\n });\n\n it('adds aria-label to initials SVG', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar name=\"john peter robinson\"></q2-avatar>`,\n });\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(initialsSvg).toEqualAttribute('aria-label', 'john peter robinson');\n expect(initialsSvg).not.toHaveAttribute('aria-hidden');\n });\n\n it('adds name as an alt tag to img', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\" name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(image).toEqualAttribute('alt', 'john peter robinson');\n });\n });\n\n describe('when not provided', () => {\n it('adds aria-hidden to initials SVG', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"JCVD\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(initialsSvg).not.toHaveAttribute('aria-label');\n expect(initialsSvg).toEqualAttribute('aria-hidden', 'true');\n });\n\n it('adds empty alt tag to image', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n\n const image = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n expect(image).toEqualAttribute('alt', '');\n });\n });\n });\n\n describe('initials', () => {\n describe('when provided', () => {\n it('prioritizes initials over name attribute', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"JKVD\" name=\"john peter robinson\"></q2-avatar>`,\n });\n\n const initialsSvg = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n const initialsSvgCss = await initialsSvg.getComputedStyle();\n\n expect(initialsSvgCss.borderRadius).toEqual('50%');\n expect(initialsSvg.innerText).toEqual('JKVD');\n });\n\n it('limits the initials to four characters', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-avatar initials=\"ABCDEFG\"></q2-avatar>`,\n });\n\n const el = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(el.innerText).toEqual('ABCD');\n });\n });\n });\n describe('icon', () => {\n describe('when provided', () => {\n it('renders custom fallback icon', async function () {\n const page = await setup({ html: '<q2-avatar icon=\"info\"></q2-avatar>' });\n\n const fallbackIcon = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"] q2-icon');\n const fallbackIconContainer = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"]');\n const fallbackIconContainerCss = await fallbackIconContainer.getComputedStyle();\n\n expect(fallbackIconContainerCss.borderRadius).toEqual('50%');\n expect(fallbackIcon).toEqualAttribute('type', 'info');\n });\n });\n\n describe('when not provided', () => {\n it('renders default fallback icon', async function () {\n const page = await setup({ html: '<q2-avatar></q2-avatar>' });\n\n const fallbackIcon = await page.find('q2-avatar >>> [test-id=\"fallbackIcon\"] q2-icon');\n\n expect(fallbackIcon).toEqualAttribute('type', 'person');\n });\n });\n });\n });\n\n it.skip('img should be removed if url does not work', async function (): Promise<void> {\n const page = await setup({\n html: '<q2-avatar name=\"sara marshall\" src=\"badUrl\" ></q2-avatar>',\n });\n\n const badImage = await page.find('q2-avatar >>> [test-id=\"userImage\"]');\n\n expect(badImage).toEqual(badImage);\n\n page.waitForChanges();\n\n expect(badImage).toBeFalsy();\n\n const userInitials = await page.find('q2-avatar >>> [test-id=\"userInitials\"]');\n\n expect(userInitials.innerText).toEqual('SM');\n });\n\n describe('Accessibility', () => {\n describe('aXe DevTools', () => {\n it('does not have accessibility violations', async () => {\n const page = await setup({\n html: `<q2-avatar src=\"${base64Image}\"></q2-avatar>`,\n });\n const hasViolations = await evaluateA11y(page);\n expect(hasViolations).toBe(false);\n });\n });\n describe('Accessibility Tree', () => {});\n describe('Keyboard Controls', () => {});\n describe('Other', () => {});\n });\n});\n"]}

package/dist/collection/components/q2-badge/q2-badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-badge.js","sourceRoot":"","sources":["~~../../../~~src/components/q2-badge/q2-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAsB,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAG1F,MAAM,OAAO,OAAO;;;;;;qBA8BA,CAAC;;IAEjB,aAAa;IACb,wBAAwB;IAExB,IAAI,SAAS;QACT,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACvD,IAAI,KAAK,GAAoB,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QAC7C,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;YAC7B,KAAK,GAAG,EAAE,CAAC;QACf,CAAC;aAAM,IAAI,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC3B,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,cAAc,EAAE,CAAC;QAC3C,CAAC;aAAM,CAAC;YACJ,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,cAAc,EAAE,GAAG,GAAG,CAAC;QACpD,CAAC;QACD,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,IAAI,OAAO;QACP,OAAO,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;IAC/C,CAAC;IAED,aAAa;IACb,yBAAyB;IAEzB,MAAM;QACF,MAAM,UAAU,GAAG,CAAC,OAAO,CAAC,CAAC;QAC7B,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO;YAAE,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACzD,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACtC,EAAC,QAAQ,OAAG,CACf,CAAC,CAAC,CAAC,CACA,WAAK,KAAK,EAAC,eAAe;YACtB,WAAK,KAAK,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;gBAC5B,YAAM,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,eAAa,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAQ,CAC7E,CACJ,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGJ","sourcesContent":["import { Component, Prop, h, ComponentInterface, Element, Fragment } from '@stencil/core';\n\n@Component({ tag: 'q2-badge', shadow: true, styleUrl: 'q2-badge.scss' })\nexport class Q2Badge implements ComponentInterface {\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** The number of digits to show. /\n @Prop({ reflect: true })\n maxLength: number \| undefined;\n\n /* The size of the badge. /\n @Prop({ reflect: true })\n size: 'default' \| 'large' \| undefined;\n\n /* The stoplight color of the element when `theme` is not present. /\n @Prop({ reflect: true })\n status: 'info' \| 'alert' \| 'warning' \| 'success' \| undefined;\n\n /\n The color of the badge when in the active state.\n * The `theme` has higher priority than `status`.\n /\n @Prop({ reflect: true })\n theme: 'primary' \| 'secondary' \| 'tertiary' \| undefined;\n\n /* The number to display in the badge. `q2-badge` also allows slot HTML elements which can be any string. */\n @Prop({ reflect: true })\n value: number = 0;\n\n // #endregion\n // #region Local Methods\n\n get badgeText(): string {\n const maxValue = Math.pow(10, this.maxLength \|\| 2) - 1;\n let value: string \| number = this.value \|\| 0;\n if (isNaN(value) \|\| value <= 0) {\n value = '';\n } else if (value <= maxValue) {\n value = Number(value).toLocaleString();\n } else {\n value = Number(maxValue).toLocaleString() + '+';\n }\n return value;\n }\n\n get hasSlot(): boolean {\n return !!this.hostElement.innerHTML.trim();\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const badgeClass = ['badge'];\n if (this.size === 'large') badgeClass.push('size-large');\n return !this.badgeText && !this.hasSlot ? (\n <Fragment />\n ) : (\n <div class=\"badge-wrapper\">\n <div class={badgeClass.join(' ')}>\n <span class=\"badge-text\">{this.hasSlot ? <slot></slot> : this.badgeText}</span>\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}
1	+ {"version":3,"file":"q2-badge.js","sourceRoot":"","sources":["../../../../src/components/q2-badge/q2-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAsB,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAG1F,MAAM,OAAO,OAAO;;;;;;qBA8BA,CAAC;;IAEjB,aAAa;IACb,wBAAwB;IAExB,IAAI,SAAS;QACT,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;QACvD,IAAI,KAAK,GAAoB,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QAC7C,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,CAAC;YAC7B,KAAK,GAAG,EAAE,CAAC;QACf,CAAC;aAAM,IAAI,KAAK,IAAI,QAAQ,EAAE,CAAC;YAC3B,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,cAAc,EAAE,CAAC;QAC3C,CAAC;aAAM,CAAC;YACJ,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,cAAc,EAAE,GAAG,GAAG,CAAC;QACpD,CAAC;QACD,OAAO,KAAK,CAAC;IACjB,CAAC;IAED,IAAI,OAAO;QACP,OAAO,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;IAC/C,CAAC;IAED,aAAa;IACb,yBAAyB;IAEzB,MAAM;QACF,MAAM,UAAU,GAAG,CAAC,OAAO,CAAC,CAAC;QAC7B,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO;YAAE,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QACzD,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACtC,EAAC,QAAQ,OAAG,CACf,CAAC,CAAC,CAAC,CACA,WAAK,KAAK,EAAC,eAAe;YACtB,WAAK,KAAK,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC;gBAC5B,YAAM,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,eAAa,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAQ,CAC7E,CACJ,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGJ","sourcesContent":["import { Component, Prop, h, ComponentInterface, Element, Fragment } from '@stencil/core';\n\n@Component({ tag: 'q2-badge', shadow: true, styleUrl: 'q2-badge.scss' })\nexport class Q2Badge implements ComponentInterface {\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region Public Property API\n\n /** The number of digits to show. /\n @Prop({ reflect: true })\n maxLength: number \| undefined;\n\n /* The size of the badge. /\n @Prop({ reflect: true })\n size: 'default' \| 'large' \| undefined;\n\n /* The stoplight color of the element when `theme` is not present. /\n @Prop({ reflect: true })\n status: 'info' \| 'alert' \| 'warning' \| 'success' \| undefined;\n\n /\n The color of the badge when in the active state.\n * The `theme` has higher priority than `status`.\n /\n @Prop({ reflect: true })\n theme: 'primary' \| 'secondary' \| 'tertiary' \| undefined;\n\n /* The number to display in the badge. `q2-badge` also allows slot HTML elements which can be any string. */\n @Prop({ reflect: true })\n value: number = 0;\n\n // #endregion\n // #region Local Methods\n\n get badgeText(): string {\n const maxValue = Math.pow(10, this.maxLength \|\| 2) - 1;\n let value: string \| number = this.value \|\| 0;\n if (isNaN(value) \|\| value <= 0) {\n value = '';\n } else if (value <= maxValue) {\n value = Number(value).toLocaleString();\n } else {\n value = Number(maxValue).toLocaleString() + '+';\n }\n return value;\n }\n\n get hasSlot(): boolean {\n return !!this.hostElement.innerHTML.trim();\n }\n\n // #endregion\n // #region Render Methods\n\n render() {\n const badgeClass = ['badge'];\n if (this.size === 'large') badgeClass.push('size-large');\n return !this.badgeText && !this.hasSlot ? (\n <Fragment />\n ) : (\n <div class=\"badge-wrapper\">\n <div class={badgeClass.join(' ')}>\n <span class=\"badge-text\">{this.hasSlot ? <slot></slot> : this.badgeText}</span>\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"]}

package/dist/collection/components/q2-badge/test/q2-badge-test.e2e.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-badge-test.e2e.js","sourceRoot":"","sources":["../../../../src/components/q2-badge/test/q2-badge-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { evaluateA11y, getListOfStyleCompilationIssues, setup } from '@/utils/helpers';\n\ndescribe('q2-badge', () => {\n it('properly compiles CSS vars and functions', async () => {\n const page = await setup({ html: '<q2-badge></q2-badge>' });\n expect(await getListOfStyleCompilationIssues(page, 'q2-badge')).toHaveLength(0);\n });\n\n it('should render value property if value is less than 100', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=92></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('92');\n });\n\n it('should render value property if value is greater than 100', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=123></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('99+');\n });\n\n it('should not render badge element if value is not a number', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=\"abc\"></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is zero', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=0></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is negative number', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=-5></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is undefined', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should render value property if value is 123456 with maxLength 6', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=123456 max-length=6></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('123,456');\n });\n\n it('should render value property if value is 12345678 with maxLength 6', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=12345678 max-length=6></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('999,999+');\n });\n\n it('should render badge border', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=12345678 max-length=6></q2-badge>`,\n });\n const badge = await page.find('q2-badge >>> .badge');\n const badgeBorderColor = await badge.getComputedStyle();\n expect(badgeBorderColor.borderColor).toEqual('rgb(154, 152, 152)');\n });\n\n it('should render badge with plain text slot(slot comes first than value)', async function (): Promise<void> {\n const slotValue = '+32';\n const page = await setup({\n html: `<q2-badge value=12345678>${slotValue}</q2-badge>`,\n });\n const badge = await page.find('q2-badge');\n expect(badge.textContent.trim()).toEqual(slotValue);\n });\n\n it('should render badge with html slot(slot comes first than value)', async function (): Promise<void> {\n const slotValue = '<b>Bold</b>';\n const page = await setup({\n html: `<q2-badge value=12345678>${slotValue}</q2-badge>`,\n });\n const badge = await page.find('q2-badge');\n expect(badge.innerHTML).toEqual(slotValue);\n });\n\n it('should render badge border when status is passed', async function (): Promise<void> {\n const pageInfo = await setup({\n html: `<q2-badge value=12345678 status=\"info\"></q2-badge>`,\n });\n const badgeInfo = await pageInfo.find('q2-badge >>> .badge');\n const InfoBorderColor = await badgeInfo.getComputedStyle();\n expect(InfoBorderColor.borderColor).toEqual('rgb(58, 155, 214)');\n\n const pageAlert = await setup({\n html: `<q2-badge value=12345678 status=\"alert\"></q2-badge>`,\n });\n const badgeAlert = await pageAlert.find('q2-badge >>> .badge');\n const alertBorderColor = await badgeAlert.getComputedStyle();\n expect(alertBorderColor.borderColor).toEqual('rgb(228, 41, 41)');\n\n const pageWarning = await setup({\n html: `<q2-badge value=12345678 status=\"warning\"></q2-badge>`,\n });\n const badgeWarning = await pageWarning.find('q2-badge >>> .badge');\n const warningBorderColor = await badgeWarning.getComputedStyle();\n expect(warningBorderColor.borderColor).toEqual('rgb(249, 206, 76)');\n\n const pageSuccess = await setup({\n html: `<q2-badge value=12345678 status=\"success\"></q2-badge>`,\n });\n const badgeSuccess = await pageSuccess.find('q2-badge >>> .badge');\n const successBorderColor = await badgeSuccess.getComputedStyle();\n expect(successBorderColor.borderColor).toEqual('rgb(46, 170, 33)');\n });\n\n it('should render correct border color when theme is passed', async function (): Promise<void> {\n const pagePrimary = await setup({\n html: `<q2-badge value=12345678 theme=\"primary\" max-length=6></q2-badge>`,\n });\n const badgePrimary = await pagePrimary.find('q2-badge >>> .badge');\n const primaryBorderColor = await badgePrimary.getComputedStyle();\n expect(primaryBorderColor.borderColor).toEqual('rgb(58, 155, 214)');\n\n const pageSecondary = await setup({\n html: `<q2-badge value=12345678 theme=\"secondary\" max-length=6></q2-badge>`,\n });\n const badgeSecondary = await pageSecondary.find('q2-badge >>> .badge');\n const secondaryBorderColor = await badgeSecondary.getComputedStyle();\n expect(secondaryBorderColor.borderColor).toEqual('rgb(198, 209, 219)');\n\n const pageTertiary = await setup({\n html: `<q2-badge value=12345678 theme=\"tertiary\" max-length=6></q2-badge>`,\n });\n const badgeTertiary = await pageTertiary.find('q2-badge >>> .badge');\n const tertiaryBorderColor = await badgeTertiary.getComputedStyle();\n expect(tertiaryBorderColor.borderColor).toEqual('rgb(243, 244, 245)');\n });\n\n describe('Accessibility', () => {\n describe('aXe DevTools', () => {\n it('does not have accessibility violations', async () => {\n const page = await setup({\n html: `<q2-badge value=123 theme=\"primary\"></q2-badge>`,\n });\n const hasViolations = await evaluateA11y(page);\n expect(hasViolations).toBe(false);\n });\n });\n describe('Accessibility Tree', () => {});\n describe('Keyboard Controls', () => {});\n describe('Other', () => {});\n });\n});\n"]}
1	+ {"version":3,"file":"q2-badge-test.e2e.js","sourceRoot":"","sources":["../../../../../src/components/q2-badge/test/q2-badge-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { evaluateA11y, getListOfStyleCompilationIssues, setup } from '@/utils/helpers';\n\ndescribe('q2-badge', () => {\n it('properly compiles CSS vars and functions', async () => {\n const page = await setup({ html: '<q2-badge></q2-badge>' });\n expect(await getListOfStyleCompilationIssues(page, 'q2-badge')).toHaveLength(0);\n });\n\n it('should render value property if value is less than 100', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=92></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('92');\n });\n\n it('should render value property if value is greater than 100', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=123></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('99+');\n });\n\n it('should not render badge element if value is not a number', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=\"abc\"></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is zero', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=0></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is negative number', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=-5></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should not render badge element if value is undefined', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge></q2-badge>`,\n });\n const badgeWrapper = await page.find('q2-badge >>> .badge-wrapper');\n expect(badgeWrapper).toBeNull();\n });\n\n it('should render value property if value is 123456 with maxLength 6', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=123456 max-length=6></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('123,456');\n });\n\n it('should render value property if value is 12345678 with maxLength 6', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=12345678 max-length=6></q2-badge>`,\n });\n const text = await page.find('q2-badge >>> .badge-text');\n expect(text.innerText).toEqual('999,999+');\n });\n\n it('should render badge border', async function (): Promise<void> {\n const page = await setup({\n html: `<q2-badge value=12345678 max-length=6></q2-badge>`,\n });\n const badge = await page.find('q2-badge >>> .badge');\n const badgeBorderColor = await badge.getComputedStyle();\n expect(badgeBorderColor.borderColor).toEqual('rgb(154, 152, 152)');\n });\n\n it('should render badge with plain text slot(slot comes first than value)', async function (): Promise<void> {\n const slotValue = '+32';\n const page = await setup({\n html: `<q2-badge value=12345678>${slotValue}</q2-badge>`,\n });\n const badge = await page.find('q2-badge');\n expect(badge.textContent.trim()).toEqual(slotValue);\n });\n\n it('should render badge with html slot(slot comes first than value)', async function (): Promise<void> {\n const slotValue = '<b>Bold</b>';\n const page = await setup({\n html: `<q2-badge value=12345678>${slotValue}</q2-badge>`,\n });\n const badge = await page.find('q2-badge');\n expect(badge.innerHTML).toEqual(slotValue);\n });\n\n it('should render badge border when status is passed', async function (): Promise<void> {\n const pageInfo = await setup({\n html: `<q2-badge value=12345678 status=\"info\"></q2-badge>`,\n });\n const badgeInfo = await pageInfo.find('q2-badge >>> .badge');\n const InfoBorderColor = await badgeInfo.getComputedStyle();\n expect(InfoBorderColor.borderColor).toEqual('rgb(58, 155, 214)');\n\n const pageAlert = await setup({\n html: `<q2-badge value=12345678 status=\"alert\"></q2-badge>`,\n });\n const badgeAlert = await pageAlert.find('q2-badge >>> .badge');\n const alertBorderColor = await badgeAlert.getComputedStyle();\n expect(alertBorderColor.borderColor).toEqual('rgb(228, 41, 41)');\n\n const pageWarning = await setup({\n html: `<q2-badge value=12345678 status=\"warning\"></q2-badge>`,\n });\n const badgeWarning = await pageWarning.find('q2-badge >>> .badge');\n const warningBorderColor = await badgeWarning.getComputedStyle();\n expect(warningBorderColor.borderColor).toEqual('rgb(249, 206, 76)');\n\n const pageSuccess = await setup({\n html: `<q2-badge value=12345678 status=\"success\"></q2-badge>`,\n });\n const badgeSuccess = await pageSuccess.find('q2-badge >>> .badge');\n const successBorderColor = await badgeSuccess.getComputedStyle();\n expect(successBorderColor.borderColor).toEqual('rgb(46, 170, 33)');\n });\n\n it('should render correct border color when theme is passed', async function (): Promise<void> {\n const pagePrimary = await setup({\n html: `<q2-badge value=12345678 theme=\"primary\" max-length=6></q2-badge>`,\n });\n const badgePrimary = await pagePrimary.find('q2-badge >>> .badge');\n const primaryBorderColor = await badgePrimary.getComputedStyle();\n expect(primaryBorderColor.borderColor).toEqual('rgb(58, 155, 214)');\n\n const pageSecondary = await setup({\n html: `<q2-badge value=12345678 theme=\"secondary\" max-length=6></q2-badge>`,\n });\n const badgeSecondary = await pageSecondary.find('q2-badge >>> .badge');\n const secondaryBorderColor = await badgeSecondary.getComputedStyle();\n expect(secondaryBorderColor.borderColor).toEqual('rgb(198, 209, 219)');\n\n const pageTertiary = await setup({\n html: `<q2-badge value=12345678 theme=\"tertiary\" max-length=6></q2-badge>`,\n });\n const badgeTertiary = await pageTertiary.find('q2-badge >>> .badge');\n const tertiaryBorderColor = await badgeTertiary.getComputedStyle();\n expect(tertiaryBorderColor.borderColor).toEqual('rgb(243, 244, 245)');\n });\n\n describe('Accessibility', () => {\n describe('aXe DevTools', () => {\n it('does not have accessibility violations', async () => {\n const page = await setup({\n html: `<q2-badge value=123 theme=\"primary\"></q2-badge>`,\n });\n const hasViolations = await evaluateA11y(page);\n expect(hasViolations).toBe(false);\n });\n });\n describe('Accessibility Tree', () => {});\n describe('Keyboard Controls', () => {});\n describe('Other', () => {});\n });\n});\n"]}

package/dist/collection/components/q2-btn/q2-btn.js CHANGED Viewed

@@ -68,6 +68,10 @@ export class Q2Btn {
         this.handleButtonSize();
         overrideFocus(this.hostElement);
     }
+    disconnectedCallback() {
+        this.primaryBtn = null;
+        this.primaryBtnWrapper = null;
+    }
     // #endregion
     // #region Listeners
     handleClick(event) {

package/dist/collection/components/q2-btn/q2-btn.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"q2-btn.js","sourceRoot":"","sources":["../../../src/components/q2-btn/q2-btn.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAAsB,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAChH,OAAO,EACH,oBAAoB,EACpB,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,GAAG,EACH,aAAa,EACb,wBAAwB,GAC3B,MAAM,WAAW,CAAC;AAGnB,MAAM,OAAO,KAAK;;QA2Nd,qBAAgB,GAAG,GAAG,EAAE;YACpB,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;gBACzB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;YACnD,CAAC;QACL,CAAC,CAAC;QAEF,gBAAW,GAAG,GAAG,EAAE;YACf,oCAAoC;YACpC,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE;gBACnG,IAAI,GAAG;oBAAE,OAAO,CAAC,MAAM,EAAE,CAAC;;oBACrB,GAAG,GAAG,OAAO,CAAC;gBACnB,OAAO,GAAG,CAAC;YACf,CAAC,EAAE,IAAI,CAAC,CAAC;YAET,MAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC;YACvB,MAAM,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;YAC1D,MAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;YACtD,MAAM,WAAW,GAAG,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,OAAO,IAAI,IAAI,CAAC,WAAW,CAAC,iBAAiB,KAAK,IAAI,CAAC;YAClG,MAAM,YAAY,GAAG,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,OAAO,IAAI,IAAI,CAAC,WAAW,CAAC,gBAAgB,KAAK,IAAI,CAAC;YAClG,MAAM,WAAW,GAAG,CAAC,WAAW,IAAI,CAAC,YAAY,IAAI,OAAO,CAAC;YAE7D,IAAI,YAAY,CAAC;YACjB,IAAI,WAAW;gBAAE,YAAY,GAAG,MAAM,CAAC;iBAClC,IAAI,WAAW;gBAAE,YAAY,GAAG,MAAM,CAAC;iBACvC,IAAI,YAAY;gBAAE,YAAY,GAAG,OAAO,CAAC;YAC9C,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;QACrC,CAAC,CAAC;QAEF,qBAAgB,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,WAAW,EAAE,CAAC;QACvB,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;oBA3Ha,QAAQ;;IAEvB,aAAa;IACb,qCAAqC;IAErC,iBAAiB;QACb,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;IAED,gBAAgB;QACZ,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,aAAa,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACpC,CAAC;IAED,aAAa;IACb,oBAAoB;IAGpB,WAAW,CAAC,KAAY;QACpB,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChC,KAAK,CAAC,wBAAwB,EAAE,CAAC;QACrC,CAAC;QACD,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAC5B,CAAC;IAGD,aAAa,CAAC,KAAiB;QAC3B,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;YAAE,OAAO;QACzD,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAC5B,CAAC;IAED,aAAa;IACb,mBAAmB;IAGnB,iBAAiB;QACb,eAAe,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAGD,YAAY;QACR,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC5B,CAAC;IAED,aAAa;IACb,wBAAwB;IAExB,IAAI,gBAAgB;QAChB,OAAO;YACH,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACxE,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,YAAY,EAAE;gBAClD,MAAM;gBACN,OAAO;gBACP,MAAM;gBACN,SAAS;gBACT,MAAM;gBACN,MAAM;gBACN,QAAQ;aACX,CAAC;YACF,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS;YACrE,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACxE,WAAW,EAAE,oBAAoB,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YACtE,WAAW,EAAE,IAAI,CAAC,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS;YAC1E,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,KAAK;YAChC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS;SACvC,CAAC;IACN,CAAC;IAED,IAAI,aAAa;QACb,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,IAAI,IAAI,CAAC,YAAY;YAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;QACjE,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM;YAAE,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACxD,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC3C,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK;YAAE,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC5C,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM;YAAE,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAC9C,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC1C,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM;YAAE,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE7C,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC7B,CAAC;IAED,IAAI,gBAAgB;QAChB,MAAM,OAAO,GAAG,CAAC,YAAY,CAAC,CAAC;QAC/B,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChB,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC7B,CAAC;QAED,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC7B,CAAC;IAkCD,aAAa;IACb,yBAAyB;IAEzB,YAAY;QACR,MAAM,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,GAClG,IAAI,CAAC,gBAAgB,CAAC;QAC1B,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAChE,MAAM,oBAAoB,GAAG,YAAY,IAAI,OAAO,CAAC;QACrD,MAAM,sBAAsB,GAAG,CAAC,YAAY,IAAI,KAAK,CAAC;QACtD,OAAO,CACH,EAAC,QAAQ;YACL,cACI,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,IAAI,CAAC,UAAU,CAAC,mBACrC,YAAY,mBACZ,YAAY,gBACf,SAAS,IAAI,GAAG,CAAC,KAAK,CAAC,mBACpB,YAAY,kBACb,WAAW,EACzB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,aACV,kBAAkB,EAC1B,KAAK,EAAE,IAAI,CAAC,aAAa,sBACP,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,qBACjD,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EAChF,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS;gBAE7B,WAAK,KAAK,EAAC,gBAAgB;oBACtB,oBAAoB,IAAI,CACrB,kBACI,MAAM,EAAE,CAAC,OAAO,EAChB,SAAS,EAAE,sBAAsB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAC1D,CACL;oBACA,IAAI,CAAC,kBAAkB,EAAE;oBACzB,IAAI,CAAC,qBAAqB,EAAE,CAC3B,CACD;YACR,IAAI,CAAC,eAAe,EAAE;YACtB,CAAC,CAAC,WAAW,IAAI,CACd,WACI,EAAE,EAAC,oBAAoB,iBACX,MAAM,EAClB,KAAK,EAAC,IAAI,IAET,WAAW,CACV,CACT,CACM,CACd,CAAC;IACN,CAAC;IAED,eAAe;QACX,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,IAAI,IAAI,CAAC,SAAS;YAAE,OAAO;QACrD,OAAO,CACH,WACI,EAAE,EAAC,YAAY,EACf,KAAK,EAAE,IAAI,CAAC,gBAAgB,IAE3B,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACV,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,CAAC,CAAC,CAAC,CACA,YACI,IAAI,EAAC,YAAY,EACjB,YAAY,EAAE,IAAI,CAAC,gBAAgB,GACrC,CACL,CACC,CACT,CAAC;IACN,CAAC;IAED,qBAAqB;QACjB,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM;YAAE,OAAO;QACnC,OAAO,YAAM,YAAY,EAAE,IAAI,CAAC,gBAAgB,GAAI,CAAC;IACzD,CAAC;IAED,kBAAkB;QACd,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM;YAAE,OAAO;QACnC,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,KAAK;YAAE,OAAO,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1D,OAAO,YAAM,YAAY,EAAE,IAAI,CAAC,gBAAgB,GAAI,CAAC;IACzD,CAAC;IAED,MAAM;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,YAAY,KAAK,MAAM,CAAC,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC;QACvF,4CAA4C;QAC5C,WACI,KAAK,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,cAAc,EACpE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,iBAAiB,GAAG,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,IAAI,CAAC,iBAAiB,CAAC,EAClE,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,IAE/C,IAAI,CAAC,YAAY,EAAE,CAClB,CACT,CAAC,CAAC,CAAC,CACA,IAAI,CAAC,YAAY,EAAE,CACtB,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGJ","sourcesContent":["import { Component, State, Prop, h, ComponentInterface, Watch, Listen, Element, Fragment } from '@stencil/core';\nimport {\n getAriaValueFromProp,\n handleAriaLabel,\n handleColor,\n isEventFromElement,\n loc,\n overrideFocus,\n handleDeprecationWarning,\n} from 'src/utils';\n\n@Component({ tag: 'q2-btn', shadow: true, styleUrl: 'q2-btn.scss' })\nexport class Q2Btn implements ComponentInterface {\n // #region Own Properties\n\n primaryBtn: HTMLButtonElement;\n primaryBtnWrapper: HTMLElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n iconPosition: 'left' \| 'right' \| 'only';\n\n // #endregion\n // #region Public Property API\n\n /*\n @private\n * Role attribute for better semantic accessibility support\n /\n @Prop({ reflect: true })\n _role: string;\n\n /\n Displays the component in an active state.\n \n @info\n * Only intended for use with the `badge` property.\n * @deprecated\n /\n @Prop({ reflect: true })\n active: boolean;\n\n @Prop()\n ariaControls: string;\n\n @Prop()\n ariaExpanded: string;\n\n @Prop()\n ariaHasPopup: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n @Prop()\n ariaPressed: string;\n\n @Prop()\n ariaSelected: string;\n\n /\n Displays the component in a smaller, badge style.\n * @deprecated\n /\n @Prop({ reflect: true })\n badge: boolean;\n\n /* The component expands to fill the width of its parent element. /\n @Prop({ reflect: true })\n block: boolean;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n color: string; // deprecated but need it to use utils/handleColor\n\n @Prop()\n description: string;\n\n /* Marks the component as disabled and displays a `not-allowed` cursor on hover. /\n @Prop({ reflect: true })\n disabled: boolean;\n\n /* @deprecated /\n @Prop({ reflect: true })\n fab: boolean;\n\n /\n Hides the `label`, and assigns its value to the `aria-label` attribute on the `<button>` element.\n /\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /\n Indicates the role of the component in the workflow, which will apply appropriate styling to the component.\n /\n @Prop({ reflect: true, mutable: true })\n intent:\n \| 'coin'\n \| 'neutral-text'\n \| 'neutral'\n \| 'workflow-destroy'\n \| 'workflow-escape'\n \| 'workflow-primary'\n \| 'workflow-secondary';\n\n /\n Defines the text content of the button if it is not provided in the `<slot>` of the element.\n * Also used for the `aria-label` of the `<button>` element when only displaying an icon.\n \n @localizable\n /\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /* Displays the button with a loading spinner to indicate something is happening in the background and the user should not click again. /\n @Prop({ reflect: true })\n loading: boolean;\n\n /\n Defines the size of q2-btn, it renders as default size if not provided.\n /\n @Prop({ reflect: true })\n size: 'small' \| 'medium' \| 'large';\n\n @Prop()\n tabIndex: number;\n\n /* The default behavior of the button. */\n @Prop({ reflect: true })\n type: string = 'button';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.handleIcons();\n handleAriaLabel(this);\n handleColor(this);\n }\n\n componentDidLoad(): void {\n this.handleButtonSize();\n overrideFocus(this.hostElement);\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('click', { capture: true })\n handleClick(event: Event) {\n if (this.loading \|\| this.disabled) {\n event.stopImmediatePropagation();\n }\n this.primaryBtn.focus();\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.primaryBtn.focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('size')\n sizeObserver() {\n this.handleButtonSize();\n }\n\n // #endregion\n // #region Local Methods\n\n get buttonAttributes() {\n return {\n ariaExpanded: getAriaValueFromProp(this.ariaExpanded, ['true', 'false']),\n ariaHasPopup: getAriaValueFromProp(this.ariaHasPopup, [\n 'true',\n 'false',\n 'menu',\n 'listbox',\n 'tree',\n 'grid',\n 'dialog',\n ]),\n ariaLabel: this.label && this.hideLabel ? loc(this.label) : undefined,\n ariaSelected: getAriaValueFromProp(this.ariaSelected, ['true', 'false']),\n ariaPressed: getAriaValueFromProp(this.ariaPressed, ['true', 'false']),\n description: this.description !== undefined ? this.description : undefined,\n disabled: this.disabled \|\| false,\n type: this.type,\n tabindex: this.tabIndex \|\| undefined,\n };\n }\n\n get buttonClasses() {\n const classes = [];\n if (this.iconPosition) classes.push(`icon-${this.iconPosition}`);\n if (this.intent === 'coin') classes.push('intent-coin');\n if (!!this.block) classes.push('is-block');\n if (!!this.color) classes.push('has-color');\n if (!!this.intent) classes.push(`has-intent`);\n if (!!this.size) classes.push('has-size');\n if (!!this.active) classes.push('is-active');\n\n return classes.join(' ');\n }\n\n get coinLabelClasses() {\n const classes = ['coin-label'];\n if (this.disabled) {\n classes.push('disabled');\n }\n\n return classes.join(' ');\n }\n\n handleButtonSize = () => {\n if (Number(this.size) <= 4) {\n handleDeprecationWarning(this, 'size', 'prop');\n }\n };\n\n handleIcons = () => {\n // Only allow one icon in the button\n const icon = Array.from(this.hostElement.querySelectorAll(':scope > q2-icon')).reduce((acc, element) => {\n if (acc) element.remove();\n else acc = element;\n return acc;\n }, null);\n\n const hasIcon = !!icon;\n const hasLoc = !!this.hostElement.querySelector('q2-loc');\n const hasText = !!this.hostElement.textContent.trim();\n const hasIconLeft = (hasLoc \|\| hasText) && hasIcon && this.hostElement.firstElementChild === icon;\n const hasIconRight = (hasLoc \|\| hasText) && hasIcon && this.hostElement.lastElementChild === icon;\n const hasIconOnly = !hasIconLeft && !hasIconRight && hasIcon;\n\n let iconPosition;\n if (hasIconOnly) iconPosition = 'only';\n else if (hasIconLeft) iconPosition = 'left';\n else if (hasIconRight) iconPosition = 'right';\n this.iconPosition = iconPosition;\n };\n\n handleSlotChange = () => {\n this.handleIcons();\n };\n\n // #endregion\n // #region Render Methods\n\n renderButton() {\n const { ariaExpanded, ariaHasPopup, ariaSelected, ariaPressed, description, disabled, type, tabindex } =\n this.buttonAttributes;\n const { iconPosition, loading, badge, label, hideLabel } = this;\n const renderLoadingSpinner = iconPosition \|\| loading;\n const isLoadingSpinnerInline = !iconPosition \|\| badge;\n return (\n <Fragment>\n <button\n ref={el => (this.primaryBtn = el ?? this.primaryBtn)}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-label={hideLabel && loc(label)}\n aria-selected={ariaSelected}\n aria-pressed={ariaPressed}\n disabled={disabled}\n type={type}\n tabindex={tabindex}\n test-id=\"q2BtnInnerButton\"\n class={this.buttonClasses}\n aria-describedby={!!description ? 'hidden-description' : undefined}\n aria-labelledby={this.intent === 'coin' && !hideLabel ? 'coin-label' : undefined}\n role={this._role \|\| undefined}\n >\n <div class=\"slot-container\">\n {renderLoadingSpinner && (\n <q2-loading\n hidden={!loading}\n modifiers={isLoadingSpinnerInline ? 'inline' : undefined}\n />\n )}\n {this.renderDefaultLabel()}\n {this.renderDefaultCoinSlot()}\n </div>\n </button>\n {this.renderCoinLabel()}\n {!!description && (\n <div\n id=\"hidden-description\"\n aria-hidden=\"true\"\n class=\"sr\"\n >\n {description}\n </div>\n )}\n </Fragment>\n );\n }\n\n renderCoinLabel() {\n if (this.intent !== 'coin' \|\| this.hideLabel) return;\n return (\n <div\n id=\"coin-label\"\n class={this.coinLabelClasses}\n >\n {this.label ? (\n loc(this.label)\n ) : (\n <slot\n name=\"coin-label\"\n onSlotchange={this.handleSlotChange}\n />\n )}\n </div>\n );\n }\n\n renderDefaultCoinSlot() {\n if (this.intent !== 'coin') return;\n return <slot onSlotchange={this.handleSlotChange} />;\n }\n\n renderDefaultLabel() {\n if (this.intent === 'coin') return;\n if (!this.hideLabel && this.label) return loc(this.label);\n return <slot onSlotchange={this.handleSlotChange} />;\n }\n\n render() {\n return (this.size === 'small' && this.iconPosition !== 'only') \|\| this.intent === 'coin' ? (\n // wrap only for small sized and coin intent\n <div\n class={this.size === 'small' ? 'btn-height-wrapper' : 'coin-wrapper'}\n ref={el => (this.primaryBtnWrapper = el ?? this.primaryBtnWrapper)}\n tabIndex={this.size === 'small' ? -1 : undefined}\n >\n {this.renderButton()}\n </div>\n ) : (\n this.renderButton()\n );\n }\n\n // #endregion\n}\n"]}
1	+ {"version":3,"file":"q2-btn.js","sourceRoot":"","sources":["../../../../src/components/q2-btn/q2-btn.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, h, ComponentInterface, Watch, Listen, Element, Fragment } from '@stencil/core';\nimport {\n getAriaValueFromProp,\n handleAriaLabel,\n handleColor,\n isEventFromElement,\n loc,\n overrideFocus,\n handleDeprecationWarning,\n} from 'src/utils';\n\n@Component({ tag: 'q2-btn', shadow: true, styleUrl: 'q2-btn.scss' })\nexport class Q2Btn implements ComponentInterface {\n // #region Own Properties\n\n primaryBtn: HTMLButtonElement;\n primaryBtnWrapper: HTMLElement;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n iconPosition: 'left' \| 'right' \| 'only';\n\n // #endregion\n // #region Public Property API\n\n /*\n @private\n * Role attribute for better semantic accessibility support\n /\n @Prop({ reflect: true })\n _role: string;\n\n /\n Displays the component in an active state.\n \n @info\n * Only intended for use with the `badge` property.\n * @deprecated\n /\n @Prop({ reflect: true })\n active: boolean;\n\n @Prop()\n ariaControls: string;\n\n @Prop()\n ariaExpanded: string;\n\n @Prop()\n ariaHasPopup: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n ariaLabel: string;\n\n @Prop()\n ariaPressed: string;\n\n @Prop()\n ariaSelected: string;\n\n /\n Displays the component in a smaller, badge style.\n * @deprecated\n /\n @Prop({ reflect: true })\n badge: boolean;\n\n /* The component expands to fill the width of its parent element. /\n @Prop({ reflect: true })\n block: boolean;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true })\n color: string; // deprecated but need it to use utils/handleColor\n\n @Prop()\n description: string;\n\n /* Marks the component as disabled and displays a `not-allowed` cursor on hover. /\n @Prop({ reflect: true })\n disabled: boolean;\n\n /* @deprecated /\n @Prop({ reflect: true })\n fab: boolean;\n\n /\n Hides the `label`, and assigns its value to the `aria-label` attribute on the `<button>` element.\n /\n @Prop({ reflect: true, mutable: true })\n hideLabel: boolean;\n\n /\n Indicates the role of the component in the workflow, which will apply appropriate styling to the component.\n /\n @Prop({ reflect: true, mutable: true })\n intent:\n \| 'coin'\n \| 'neutral-text'\n \| 'neutral'\n \| 'workflow-destroy'\n \| 'workflow-escape'\n \| 'workflow-primary'\n \| 'workflow-secondary';\n\n /\n Defines the text content of the button if it is not provided in the `<slot>` of the element.\n * Also used for the `aria-label` of the `<button>` element when only displaying an icon.\n \n @localizable\n /\n @Prop({ reflect: true, mutable: true })\n label: string;\n\n /* Displays the button with a loading spinner to indicate something is happening in the background and the user should not click again. /\n @Prop({ reflect: true })\n loading: boolean;\n\n /\n Defines the size of q2-btn, it renders as default size if not provided.\n /\n @Prop({ reflect: true })\n size: 'small' \| 'medium' \| 'large';\n\n @Prop()\n tabIndex: number;\n\n /* The default behavior of the button. */\n @Prop({ reflect: true })\n type: string = 'button';\n\n // #endregion\n // #region Component Lifecycle Events\n\n componentWillLoad() {\n this.handleIcons();\n handleAriaLabel(this);\n handleColor(this);\n }\n\n componentDidLoad(): void {\n this.handleButtonSize();\n overrideFocus(this.hostElement);\n }\n\n disconnectedCallback(): void {\n this.primaryBtn = null;\n this.primaryBtnWrapper = null;\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('click', { capture: true })\n handleClick(event: Event) {\n if (this.loading \|\| this.disabled) {\n event.stopImmediatePropagation();\n }\n this.primaryBtn.focus();\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.primaryBtn.focus();\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('size')\n sizeObserver() {\n this.handleButtonSize();\n }\n\n // #endregion\n // #region Local Methods\n\n get buttonAttributes() {\n return {\n ariaExpanded: getAriaValueFromProp(this.ariaExpanded, ['true', 'false']),\n ariaHasPopup: getAriaValueFromProp(this.ariaHasPopup, [\n 'true',\n 'false',\n 'menu',\n 'listbox',\n 'tree',\n 'grid',\n 'dialog',\n ]),\n ariaLabel: this.label && this.hideLabel ? loc(this.label) : undefined,\n ariaSelected: getAriaValueFromProp(this.ariaSelected, ['true', 'false']),\n ariaPressed: getAriaValueFromProp(this.ariaPressed, ['true', 'false']),\n description: this.description !== undefined ? this.description : undefined,\n disabled: this.disabled \|\| false,\n type: this.type,\n tabindex: this.tabIndex \|\| undefined,\n };\n }\n\n get buttonClasses() {\n const classes = [];\n if (this.iconPosition) classes.push(`icon-${this.iconPosition}`);\n if (this.intent === 'coin') classes.push('intent-coin');\n if (!!this.block) classes.push('is-block');\n if (!!this.color) classes.push('has-color');\n if (!!this.intent) classes.push(`has-intent`);\n if (!!this.size) classes.push('has-size');\n if (!!this.active) classes.push('is-active');\n\n return classes.join(' ');\n }\n\n get coinLabelClasses() {\n const classes = ['coin-label'];\n if (this.disabled) {\n classes.push('disabled');\n }\n\n return classes.join(' ');\n }\n\n handleButtonSize = () => {\n if (Number(this.size) <= 4) {\n handleDeprecationWarning(this, 'size', 'prop');\n }\n };\n\n handleIcons = () => {\n // Only allow one icon in the button\n const icon = Array.from(this.hostElement.querySelectorAll(':scope > q2-icon')).reduce((acc, element) => {\n if (acc) element.remove();\n else acc = element;\n return acc;\n }, null);\n\n const hasIcon = !!icon;\n const hasLoc = !!this.hostElement.querySelector('q2-loc');\n const hasText = !!this.hostElement.textContent.trim();\n const hasIconLeft = (hasLoc \|\| hasText) && hasIcon && this.hostElement.firstElementChild === icon;\n const hasIconRight = (hasLoc \|\| hasText) && hasIcon && this.hostElement.lastElementChild === icon;\n const hasIconOnly = !hasIconLeft && !hasIconRight && hasIcon;\n\n let iconPosition;\n if (hasIconOnly) iconPosition = 'only';\n else if (hasIconLeft) iconPosition = 'left';\n else if (hasIconRight) iconPosition = 'right';\n this.iconPosition = iconPosition;\n };\n\n handleSlotChange = () => {\n this.handleIcons();\n };\n\n // #endregion\n // #region Render Methods\n\n renderButton() {\n const { ariaExpanded, ariaHasPopup, ariaSelected, ariaPressed, description, disabled, type, tabindex } =\n this.buttonAttributes;\n const { iconPosition, loading, badge, label, hideLabel } = this;\n const renderLoadingSpinner = iconPosition \|\| loading;\n const isLoadingSpinnerInline = !iconPosition \|\| badge;\n return (\n <Fragment>\n <button\n ref={el => (this.primaryBtn = el ?? this.primaryBtn)}\n aria-expanded={ariaExpanded}\n aria-haspopup={ariaHasPopup}\n aria-label={hideLabel && loc(label)}\n aria-selected={ariaSelected}\n aria-pressed={ariaPressed}\n disabled={disabled}\n type={type}\n tabindex={tabindex}\n test-id=\"q2BtnInnerButton\"\n class={this.buttonClasses}\n aria-describedby={!!description ? 'hidden-description' : undefined}\n aria-labelledby={this.intent === 'coin' && !hideLabel ? 'coin-label' : undefined}\n role={this._role \|\| undefined}\n >\n <div class=\"slot-container\">\n {renderLoadingSpinner && (\n <q2-loading\n hidden={!loading}\n modifiers={isLoadingSpinnerInline ? 'inline' : undefined}\n />\n )}\n {this.renderDefaultLabel()}\n {this.renderDefaultCoinSlot()}\n </div>\n </button>\n {this.renderCoinLabel()}\n {!!description && (\n <div\n id=\"hidden-description\"\n aria-hidden=\"true\"\n class=\"sr\"\n >\n {description}\n </div>\n )}\n </Fragment>\n );\n }\n\n renderCoinLabel() {\n if (this.intent !== 'coin' \|\| this.hideLabel) return;\n return (\n <div\n id=\"coin-label\"\n class={this.coinLabelClasses}\n >\n {this.label ? (\n loc(this.label)\n ) : (\n <slot\n name=\"coin-label\"\n onSlotchange={this.handleSlotChange}\n />\n )}\n </div>\n );\n }\n\n renderDefaultCoinSlot() {\n if (this.intent !== 'coin') return;\n return <slot onSlotchange={this.handleSlotChange} />;\n }\n\n renderDefaultLabel() {\n if (this.intent === 'coin') return;\n if (!this.hideLabel && this.label) return loc(this.label);\n return <slot onSlotchange={this.handleSlotChange} />;\n }\n\n render() {\n return (this.size === 'small' && this.iconPosition !== 'only') \|\| this.intent === 'coin' ? (\n // wrap only for small sized and coin intent\n <div\n class={this.size === 'small' ? 'btn-height-wrapper' : 'coin-wrapper'}\n ref={el => (this.primaryBtnWrapper = el ?? this.primaryBtnWrapper)}\n tabIndex={this.size === 'small' ? -1 : undefined}\n >\n {this.renderButton()}\n </div>\n ) : (\n this.renderButton()\n );\n }\n\n // #endregion\n}\n"]}