phares3757/oi-metrology
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Static Site

Browse Source
This commit is contained in:
Mike Phares
2024-06-14 16:51:30 -07:00
parent 3aed250488
commit 6737ddfb59
1706 changed files with 628 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
Static/package/dist/collection/components/accordion/accordion.css vendored Normal file
View File

@ -0,0 +1,15 @@
:root {
--ifx-font-family: "Source Sans 3";
font-family: var(--ifx-font-family, sans-serif);
}
:host {
display: block;
}
.accordion-wrapper {
display: flex;
flex-direction: column;
gap: 8px;
font-family: var(--ifx-font-family);
}

19
Static/package/dist/collection/components/accordion/accordion.e2e.js vendored Normal file
View File

@ -0,0 +1,19 @@
import { newE2EPage } from "@stencil/core/testing";
describe('ifx-accordion', () => {
let page;
let element;
beforeEach(async () => {
page = await newE2EPage();
await page.setContent('<ifx-accordion></ifx-accordion>');
element = await page.find('ifx-accordion');
});
it('renders', async () => {
expect(element).toHaveClass('hydrated');
});
it('autoCollapse prop works as expected', async () => {
element.setProperty('autoCollapse', true);
await page.waitForChanges();
expect(await element.getProperty('autoCollapse')).toBe(true);
});
});
//# sourceMappingURL=accordion.e2e.js.map

1
Static/package/dist/collection/components/accordion/accordion.e2e.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"accordion.e2e.js","sourceRoot":"","sources":["../../../src/components/accordion/accordion.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;EAC7B,IAAI,IAAI,CAAC;EACT,IAAI,OAAO,CAAC;EAEZ,UAAU,CAAC,KAAK,IAAI,EAAE;IACpB,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAC1B,MAAM,IAAI,CAAC,UAAU,CAAC,iCAAiC,CAAC,CAAC;IACzD,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;EAC7C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;IACnD,OAAO,CAAC,WAAW,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;IAC1C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAC5B,MAAM,CAAC,MAAM,OAAO,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC/D,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('ifx-accordion', () => {\n let page;\n let element;\n\n beforeEach(async () => {\n page = await newE2EPage();\n await page.setContent('<ifx-accordion></ifx-accordion>');\n element = await page.find('ifx-accordion');\n });\n\n it('renders', async () => {\n expect(element).toHaveClass('hydrated');\n });\n\n it('autoCollapse prop works as expected', async () => {\n element.setProperty('autoCollapse', true);\n await page.waitForChanges();\n expect(await element.getProperty('autoCollapse')).toBe(true);\n });\n\n});\n"]}

66
Static/package/dist/collection/components/accordion/accordion.js vendored Normal file
View File

@ -0,0 +1,66 @@
//ifxAccordion.tsx
import { h } from "@stencil/core";
export class Accordion {
constructor() {
this.autoCollapse = false;
}
async onItemOpen(event) {
if (this.autoCollapse) {
const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));
for (const item of items) {
const itemElement = item;
if (itemElement !== event.target && (await itemElement.open)) {
itemElement.open = false;
}
}
}
}
render() {
return (h("div", { class: "accordion-wrapper" }, h("slot", null)));
}
static get is() { return "ifx-accordion"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["accordion.scss"]
};
}
static get styleUrls() {
return {
"$": ["accordion.css"]
};
}
static get properties() {
return {
"autoCollapse": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "auto-collapse",
"reflect": false,
"defaultValue": "false"
}
};
}
static get elementRef() { return "el"; }
static get listeners() {
return [{
"name": "ifxItemOpen",
"method": "onItemOpen",
"target": undefined,
"capture": false,
"passive": false
}];
}
}
//# sourceMappingURL=accordion.js.map

1
Static/package/dist/collection/components/accordion/accordion.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../../src/components/accordion/accordion.tsx"],"names":[],"mappings":"AAAA,kBAAkB;AAClB,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOpE,MAAM,OAAO,SAAS;;wBAEY,KAAK;;EAGrC,KAAK,CAAC,UAAU,CAAC,KAAkB;IACjC,IAAI,IAAI,CAAC,YAAY,EAAE;MACrB,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAC,CAAC;MACzE,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;QACxB,MAAM,WAAW,GAAG,IAAmC,CAAC;QACxD,IAAI,WAAW,KAAK,KAAK,CAAC,MAAM,IAAI,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,EAAE;UAC5D,WAAW,CAAC,IAAI,GAAG,KAAK,CAAC;SAC1B;OACF;KACF;EACH,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAC,mBAAmB;MAC5B,eAAQ,CACJ,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["//ifxAccordion.tsx\nimport { Component, h, Listen, Element, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ifx-accordion',\n styleUrl: 'accordion.scss',\n shadow: true,\n})\nexport class Accordion {\n @Element() el: HTMLElement;\n @Prop() autoCollapse: boolean = false;\n\n @Listen('ifxItemOpen')\n async onItemOpen(event: CustomEvent) {\n if (this.autoCollapse) {\n const items = Array.from(this.el.querySelectorAll('ifx-accordion-item'));\n for (const item of items) {\n const itemElement = item as HTMLIfxAccordionItemElement;\n if (itemElement !== event.target && (await itemElement.open)) {\n itemElement.open = false;\n }\n }\n }\n }\n\n render() {\n return (\n <div class=\"accordion-wrapper\">\n <slot />\n </div>\n );\n }\n}\n"]}

51
Static/package/dist/collection/components/accordion/accordion.stories.js vendored Normal file
View File

@ -0,0 +1,51 @@
import { action } from "@storybook/addon-actions";
export default {
title: 'Components/Accordion',
component: 'ifx-accordion',
//tags: ['autodocs'],
args: {
autoCollapse: false,
initialCollapse: true
},
argTypes: {
amountOfItems: { control: 'number' },
initialCollapse: {
description: 'If set on more than one accordion-item, auto-collapse must be false',
}
},
};
const Template = (args) => {
const accordionElement = document.createElement('ifx-accordion');
const initialItem = document.createElement('ifx-accordion-item');
initialItem.setAttribute('initialCollapse', args.initialCollapse);
initialItem.setAttribute('caption', `Label`);
initialItem.setAttribute('open', `true`);
initialItem.innerHTML = `
Content for Initial Item. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
`;
initialItem.addEventListener('ifxItemOpen', action('ifxItemOpen'));
initialItem.addEventListener('ifxItemClose', action('ifxItemClose'));
accordionElement.append(initialItem);
accordionElement.setAttribute('auto-collapse', args.autoCollapse);
for (let i = 1; i < args.amountOfItems; i++) {
const item = document.createElement('ifx-accordion-item');
item.setAttribute('caption', `Label`);
item.setAttribute('open', `false`);
item.innerHTML = `
Content for Item #${i + 1}. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.
`;
item.addEventListener('ifxItemOpen', action('ifxItemOpen'));
item.addEventListener('ifxItemClose', action('ifxItemClose'));
accordionElement.append(item);
}
return accordionElement;
};
export const Default = Template.bind({});
Default.args = {
amountOfItems: 3
};
//# sourceMappingURL=accordion.stories.js.map

1
Static/package/dist/collection/components/accordion/accordion.stories.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"accordion.stories.js","sourceRoot":"","sources":["../../../src/components/accordion/accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,eAAe;EACb,KAAK,EAAE,sBAAsB;EAC7B,SAAS,EAAE,eAAe;EAC1B,qBAAqB;EAErB,IAAI,EAAE;IACJ,YAAY,EAAE,KAAK;IACnB,eAAe,EAAE,IAAI;GACtB;EAED,QAAQ,EAAE;IACR,aAAa,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;IACpC,eAAe,EAAE;MACf,WAAW,EAAE,qEAAqE;KACnF;GACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE;EACxB,MAAM,gBAAgB,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;EACjE,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;EACjE,WAAW,CAAC,YAAY,CAAC,iBAAiB,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;EAClE,WAAW,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;EAC7C,WAAW,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;EAEzC,WAAW,CAAC,SAAS,GAAG;;;;CAIzB,CAAC;EACA,WAAW,CAAC,gBAAgB,CAAC,aAAa,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC;EACnE,WAAW,CAAC,gBAAgB,CAAC,cAAc,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC;EAErE,gBAAgB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;EAErC,gBAAgB,CAAC,YAAY,CAAC,eAAe,EAAE,IAAI,CAAC,YAAY,CAAC,CAAA;EACjE,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,EAAE,EAAE;IAC3C,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAC1D,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IACtC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAEnC,IAAI,CAAC,SAAS,GAAG;4BACO,CAAC,GAAG,CAAC;;;KAG5B,CAAC;IACF,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC;IAC5D,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC;IAE9D,gBAAgB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;GAC/B;EAED,OAAO,gBAAgB,CAAC;AAC1B,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;EACb,aAAa,EAAE,CAAC;CACjB,CAAC","sourcesContent":["import { action } from '@storybook/addon-actions';\n\nexport default {\n title: 'Components/Accordion',\n component: 'ifx-accordion',\n //tags: ['autodocs'],\n\n args: {\n autoCollapse: false,\n initialCollapse: true\n },\n\n argTypes: {\n amountOfItems: { control: 'number' },\n initialCollapse: {\n description: 'If set on more than one accordion-item, auto-collapse must be false',\n }\n },\n};\n\nconst Template = (args) => {\n const accordionElement = document.createElement('ifx-accordion');\n const initialItem = document.createElement('ifx-accordion-item');\n initialItem.setAttribute('initialCollapse', args.initialCollapse);\n initialItem.setAttribute('caption', `Label`);\n initialItem.setAttribute('open', `true`);\n\n initialItem.innerHTML = `\n Content for Initial Item. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n`;\n initialItem.addEventListener('ifxItemOpen', action('ifxItemOpen'));\n initialItem.addEventListener('ifxItemClose', action('ifxItemClose'));\n\n accordionElement.append(initialItem);\n\n accordionElement.setAttribute('auto-collapse', args.autoCollapse)\n for (let i = 1; i < args.amountOfItems; i++) {\n const item = document.createElement('ifx-accordion-item');\n item.setAttribute('caption', `Label`);\n item.setAttribute('open', `false`);\n\n item.innerHTML = `\n Content for Item #${i + 1}. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat, ligula eu aliquam bibendum, orci nisl cursus ipsum, nec egestas odio sapien eget neque.\n `;\n item.addEventListener('ifxItemOpen', action('ifxItemOpen'));\n item.addEventListener('ifxItemClose', action('ifxItemClose'));\n\n accordionElement.append(item);\n }\n\n return accordionElement;\n};\n\nexport const Default = Template.bind({});\nDefault.args = {\n amountOfItems: 3\n};"]}

66
Static/package/dist/collection/components/accordion/accordionItem.css vendored Normal file
View File

@ -0,0 +1,66 @@
:root {
--ifx-font-family: "Source Sans 3";
font-family: var(--ifx-font-family, sans-serif);
}
.accordion-item {
border-radius: 3px;
overflow: hidden;
transition: all 0.3s;
font-family: var(--ifx-font-family);
}
.accordion-title:hover {
border: 1px solid #EEEDED;
color: #08665C;
}
.accordion-title {
display: flex;
align-items: center;
padding: 12px 16px;
gap: 12px;
color: #0A8276;
background-color: #FFFFFF;
border: 1px solid #EEEDED;
cursor: pointer;
}
.accordion-caption {
font-weight: 600;
font-size: 1.125rem;
}
.accordion-content {
gap: 8px;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
line-height: 24px;
font-size: 1rem;
font-weight: 400;
}
.inner-content {
background-color: #FFFFFF;
padding: 24px;
/* wraps text at spaces and within words */
word-wrap: break-word;
/* breaks text within a word if necessary */
overflow-wrap: anywhere;
align-self: stretch;
/* breaks text at arbitrary points when needed */
}
.accordion-icon {
font-weight: bold;
display: inline-block;
transition: transform 0.3s;
}
.accordion-icon:hover {
color: #08665C;
}
.accordion-item.open .accordion-icon {
transform: rotate(-180deg);
}

29
Static/package/dist/collection/components/accordion/accordionItem.e2e.js vendored Normal file
View File

@ -0,0 +1,29 @@
import { newE2EPage } from "@stencil/core/testing";
describe('ifx-accordion-item', () => {
let page;
let element;
beforeEach(async () => {
page = await newE2EPage();
await page.setContent('<ifx-accordion-item caption="Test"></ifx-accordion-item>');
element = await page.find('ifx-accordion-item');
});
it('renders', async () => {
expect(element).toHaveClass('hydrated');
});
it('displays the caption', async () => {
const captionElement = await page.find('ifx-accordion-item >>> .accordion-caption');
expect(captionElement.innerText).toEqual('Test');
});
it('expands and collapses on click', async () => {
const titleElement = await page.find('ifx-accordion-item >>> .accordion-title');
// Initially closed
expect(await element.getProperty('open')).toBeFalsy();
await titleElement.click();
// Open after first click
expect(await element.getProperty('open')).toBeTruthy();
await titleElement.click();
// Closed after second click
expect(await element.getProperty('open')).toBeFalsy();
});
});
//# sourceMappingURL=accordionItem.e2e.js.map

1
Static/package/dist/collection/components/accordion/accordionItem.e2e.js.map vendored Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"accordionItem.e2e.js","sourceRoot":"","sources":["../../../src/components/accordion/accordionItem.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,IAAI,IAAI,CAAC;EACT,IAAI,OAAO,CAAC;EAEZ,UAAU,CAAC,KAAK,IAAI,EAAE;IACpB,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAC1B,MAAM,IAAI,CAAC,UAAU,CAAC,0DAA0D,CAAC,CAAC;IAElF,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;EAClD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;IACpC,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,2CAA2C,CAAC,CAAC;IACpF,MAAM,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;EACnD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;IAC9C,MAAM,YAAY,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,yCAAyC,CAAC,CAAC;IAEhF,mBAAmB;IACnB,MAAM,CAAC,MAAM,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;IAEtD,MAAM,YAAY,CAAC,KAAK,EAAE,CAAC;IAE3B,yBAAyB;IACzB,MAAM,CAAC,MAAM,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IAEvD,MAAM,YAAY,CAAC,KAAK,EAAE,CAAC;IAE3B,4BAA4B;IAC5B,MAAM,CAAC,MAAM,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;EACxD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('ifx-accordion-item', () => {\n let page;\n let element;\n\n beforeEach(async () => {\n page = await newE2EPage();\n await page.setContent('<ifx-accordion-item caption=\"Test\"></ifx-accordion-item>');\n\n element = await page.find('ifx-accordion-item');\n });\n\n it('renders', async () => {\n expect(element).toHaveClass('hydrated');\n });\n\n it('displays the caption', async () => {\n const captionElement = await page.find('ifx-accordion-item >>> .accordion-caption');\n expect(captionElement.innerText).toEqual('Test');\n });\n\n it('expands and collapses on click', async () => {\n const titleElement = await page.find('ifx-accordion-item >>> .accordion-title');\n\n // Initially closed\n expect(await element.getProperty('open')).toBeFalsy();\n\n await titleElement.click();\n\n // Open after first click\n expect(await element.getProperty('open')).toBeTruthy();\n\n await titleElement.click();\n\n // Closed after second click\n expect(await element.getProperty('open')).toBeFalsy();\n });\n});\n"]}

181
Static/package/dist/collection/components/accordion/accordionItem.js vendored Normal file
View File

@ -0,0 +1,181 @@
//ifxAccordionItem
import { h } from "@stencil/core";
export class IfxAccordionItem {
constructor() {
this.caption = undefined;
this.open = false;
this.initialCollapse = true;
this.internalOpen = false;
}
componentWillLoad() {
this.internalOpen = this.open;
if (!this.initialCollapse) {
this.internalOpen = true;
}
}
componentDidLoad() {
this.openAccordionItem();
}
componentDidUpdate() {
this.openAccordionItem();
}
openChanged(newValue) {
this.internalOpen = newValue;
}
toggleOpen() {
this.internalOpen = !this.internalOpen;
this.open = this.internalOpen;
if (this.internalOpen) {
this.ifxItemOpen.emit({ isOpen: this.internalOpen });
}
else {
this.ifxItemClose.emit({ isClosed: !this.internalOpen });
}
}
openAccordionItem() {
if (this.internalOpen) {
this.contentEl.style.maxHeight = `${this.contentEl.scrollHeight}px`;
}
else {
this.contentEl.style.maxHeight = '0';
}
}
handleSlotChange(e) {
const slotElement = e.target;
const nodes = slotElement.assignedNodes();
if (nodes.length > 0) {
nodes.forEach(node => {
const observer = new MutationObserver((mutationsList, _) => {
for (let mutation of mutationsList) {
if (mutation.type === 'childList') {
if (this.internalOpen) {
this.openAccordionItem();
}
}
}
});
observer.observe(node, { attributes: true, childList: true, subtree: true });
});
}
if (this.internalOpen) {
this.openAccordionItem();
}
}
render() {
return (h("div", { "aria-label": this.caption, class: `accordion-item ${this.internalOpen ? 'open' : ''}` }, h("div", { class: "accordion-title", onClick: () => this.toggleOpen() }, h("span", { class: "accordion-icon" }, h("ifx-icon", { icon: "chevron-down-12" })), h("span", { class: "accordion-caption" }, this.caption)), h("div", { class: "accordion-content", ref: (el) => (this.contentEl = el) }, h("div", { class: "inner-content" }, h("slot", { onSlotchange: (e) => this.handleSlotChange(e) })))));
}
static get is() { return "ifx-accordion-item"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["accordionItem.scss"]
};
}
static get styleUrls() {
return {
"$": ["accordionItem.css"]
};
}
static get properties() {
return {
"caption": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "caption",
"reflect": false
},
"open": {
"type": "boolean",
"mutable": true,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "open",
"reflect": false,
"defaultValue": "false"
},
"initialCollapse": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"attribute": "initial-collapse",
"reflect": false,
"defaultValue": "true"
}
};
}
static get states() {
return {
"internalOpen": {}
};
}
static get events() {
return [{
"method": "ifxItemOpen",
"name": "ifxItemOpen",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [],
"text": ""
},
"complexType": {
"original": "any",
"resolved": "any",
"references": {}
}
}, {
"method": "ifxItemClose",
"name": "ifxItemClose",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [],
"text": ""
},
"complexType": {
"original": "any",
"resolved": "any",
"references": {}
}
}];
}
static get watchers() {
return [{
"propName": "open",
"methodName": "openChanged"
}];
}
}
//# sourceMappingURL=accordionItem.js.map

1
Static/package/dist/collection/components/accordion/accordionItem.js.map vendored Normal file
View File

File diff suppressed because one or more lines are too long