860 lines
36 KiB
JavaScript
860 lines
36 KiB
JavaScript
(self["webpackChunkapp"] = self["webpackChunkapp"] || []).push([[79],{
|
|
|
|
/***/ 7309:
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/@ionic/core/dist/esm/index-2bcb741c.js ***!
|
|
\*************************************************************/
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
/* harmony export */ "a": () => (/* binding */ arrowBackSharp),
|
|
/* harmony export */ "b": () => (/* binding */ closeCircle),
|
|
/* harmony export */ "c": () => (/* binding */ chevronBack),
|
|
/* harmony export */ "d": () => (/* binding */ closeSharp),
|
|
/* harmony export */ "e": () => (/* binding */ searchSharp),
|
|
/* harmony export */ "f": () => (/* binding */ checkmarkOutline),
|
|
/* harmony export */ "g": () => (/* binding */ ellipseOutline),
|
|
/* harmony export */ "h": () => (/* binding */ caretBackSharp),
|
|
/* harmony export */ "i": () => (/* binding */ arrowDown),
|
|
/* harmony export */ "j": () => (/* binding */ reorderThreeOutline),
|
|
/* harmony export */ "k": () => (/* binding */ reorderTwoSharp),
|
|
/* harmony export */ "l": () => (/* binding */ chevronDown),
|
|
/* harmony export */ "m": () => (/* binding */ chevronForwardOutline),
|
|
/* harmony export */ "n": () => (/* binding */ ellipsisHorizontal),
|
|
/* harmony export */ "o": () => (/* binding */ chevronForward),
|
|
/* harmony export */ "p": () => (/* binding */ caretUpSharp),
|
|
/* harmony export */ "q": () => (/* binding */ caretDownSharp),
|
|
/* harmony export */ "r": () => (/* binding */ removeOutline),
|
|
/* harmony export */ "s": () => (/* binding */ searchOutline),
|
|
/* harmony export */ "t": () => (/* binding */ close),
|
|
/* harmony export */ "u": () => (/* binding */ menuOutline),
|
|
/* harmony export */ "v": () => (/* binding */ menuSharp)
|
|
/* harmony export */ });
|
|
/*!
|
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
*/
|
|
|
|
/* Ionicons v6.1.3, ES Modules */
|
|
const arrowBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='square' stroke-miterlimit='10' stroke-width='48' d='M244 400L100 256l144-144M120 256h292' class='ionicon-fill-none'/></svg>";
|
|
const arrowDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 268l144 144 144-144M256 392V100' class='ionicon-fill-none'/></svg>";
|
|
const caretBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M368 64L144 256l224 192V64z'/></svg>";
|
|
const caretDownSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M64 144l192 224 192-224H64z'/></svg>";
|
|
const caretUpSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M448 368L256 144 64 368h384z'/></svg>";
|
|
const checkmarkOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' d='M416 128L192 384l-96-96' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const chevronBack = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M328 112L184 256l144 144' class='ionicon-fill-none'/></svg>";
|
|
const chevronDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 184l144 144 144-144' class='ionicon-fill-none'/></svg>";
|
|
const chevronForward = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144' class='ionicon-fill-none'/></svg>";
|
|
const chevronForwardOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144' class='ionicon-fill-none'/></svg>";
|
|
const close = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M289.94 256l95-95A24 24 0 00351 127l-95 95-95-95a24 24 0 00-34 34l95 95-95 95a24 24 0 1034 34l95-95 95 95a24 24 0 0034-34z'/></svg>";
|
|
const closeCircle = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z'/></svg>";
|
|
const closeSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M400 145.49L366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z'/></svg>";
|
|
const ellipseOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><circle cx='256' cy='256' r='192' stroke-linecap='round' stroke-linejoin='round' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const ellipsisHorizontal = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><circle cx='256' cy='256' r='48'/><circle cx='416' cy='256' r='48'/><circle cx='96' cy='256' r='48'/></svg>";
|
|
const menuOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-miterlimit='10' d='M80 160h352M80 256h352M80 352h352' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const menuSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M64 384h384v-42.67H64zm0-106.67h384v-42.66H64zM64 128v42.67h384V128z'/></svg>";
|
|
const removeOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' d='M400 256H112' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const reorderThreeOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' d='M96 256h320M96 176h320M96 336h320' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const reorderTwoSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='square' stroke-linejoin='round' stroke-width='44' d='M118 304h276M118 208h276' class='ionicon-fill-none'/></svg>";
|
|
const searchOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z' stroke-miterlimit='10' class='ionicon-fill-none ionicon-stroke-width'/><path stroke-linecap='round' stroke-miterlimit='10' d='M338.29 338.29L448 448' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
|
|
const searchSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M464 428L339.92 303.9a160.48 160.48 0 0030.72-94.58C370.64 120.37 298.27 48 209.32 48S48 120.37 48 209.32s72.37 161.32 161.32 161.32a160.48 160.48 0 0094.58-30.72L428 464zM209.32 319.69a110.38 110.38 0 11110.37-110.37 110.5 110.5 0 01-110.37 110.37z'/></svg>";
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ 70079:
|
|
/*!********************************************************************!*\
|
|
!*** ./node_modules/@ionic/core/dist/esm/ion-accordion_2.entry.js ***!
|
|
\********************************************************************/
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
/* harmony export */ "ion_accordion": () => (/* binding */ Accordion),
|
|
/* harmony export */ "ion_accordion_group": () => (/* binding */ AccordionGroup)
|
|
/* harmony export */ });
|
|
/* harmony import */ var _Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js */ 71670);
|
|
/* harmony import */ var _index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./index-8e692445.js */ 91559);
|
|
/* harmony import */ var _index_2bcb741c_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./index-2bcb741c.js */ 7309);
|
|
/* harmony import */ var _ionic_global_c74e4951_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ionic-global-c74e4951.js */ 95823);
|
|
/* harmony import */ var _helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./helpers-3b390e48.js */ 29259);
|
|
|
|
|
|
/*!
|
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
*/
|
|
|
|
|
|
|
|
|
|
const accordionIosCss = ":host{display:block;position:relative;width:100%;background-color:var(--ion-background-color, #ffffff);overflow:hidden;z-index:0}:host(.accordion-expanding) ::slotted(ion-item[slot=header]),:host(.accordion-expanded) ::slotted(ion-item[slot=header]){--border-width:0px}:host(.accordion-animated){-webkit-transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}:host(.accordion-animated) #content{-webkit-transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}#content{overflow:hidden;will-change:max-height}:host(.accordion-collapsing) #content{max-height:0 !important}:host(.accordion-collapsed) #content{display:none}:host(.accordion-expanding) #content{max-height:0}:host(.accordion-expanding) #content-wrapper{overflow:auto}:host(.accordion-disabled) #header,:host(.accordion-readonly) #header,:host(.accordion-disabled) #content,:host(.accordion-readonly) #content{pointer-events:none}:host(.accordion-disabled) #header,:host(.accordion-disabled) #content{opacity:0.4}@media (prefers-reduced-motion: reduce){:host,#content{-webkit-transition:none !important;transition:none !important}}:host(.accordion-next) ::slotted(ion-item[slot=header]){--border-width:0.55px 0px 0.55px 0px}";
|
|
const accordionMdCss = ":host{display:block;position:relative;width:100%;background-color:var(--ion-background-color, #ffffff);overflow:hidden;z-index:0}:host(.accordion-expanding) ::slotted(ion-item[slot=header]),:host(.accordion-expanded) ::slotted(ion-item[slot=header]){--border-width:0px}:host(.accordion-animated){-webkit-transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:all 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}:host(.accordion-animated) #content{-webkit-transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1);transition:max-height 300ms cubic-bezier(0.25, 0.8, 0.5, 1)}#content{overflow:hidden;will-change:max-height}:host(.accordion-collapsing) #content{max-height:0 !important}:host(.accordion-collapsed) #content{display:none}:host(.accordion-expanding) #content{max-height:0}:host(.accordion-expanding) #content-wrapper{overflow:auto}:host(.accordion-disabled) #header,:host(.accordion-readonly) #header,:host(.accordion-disabled) #content,:host(.accordion-readonly) #content{pointer-events:none}:host(.accordion-disabled) #header,:host(.accordion-disabled) #content{opacity:0.4}@media (prefers-reduced-motion: reduce){:host,#content{-webkit-transition:none !important;transition:none !important}}";
|
|
const Accordion = class {
|
|
constructor(hostRef) {
|
|
var _this = this;
|
|
|
|
(0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.r)(this, hostRef);
|
|
|
|
this.updateListener = () => this.updateState(false);
|
|
|
|
this.state = 1
|
|
/* AccordionState.Collapsed */
|
|
;
|
|
this.isNext = false;
|
|
this.isPrevious = false;
|
|
/**
|
|
* The value of the accordion. Defaults to an autogenerated
|
|
* value.
|
|
*/
|
|
|
|
this.value = `ion-accordion-${accordionIds++}`;
|
|
/**
|
|
* If `true`, the accordion cannot be interacted with.
|
|
*/
|
|
|
|
this.disabled = false;
|
|
/**
|
|
* If `true`, the accordion cannot be interacted with,
|
|
* but does not alter the opacity.
|
|
*/
|
|
|
|
this.readonly = false;
|
|
/**
|
|
* The toggle icon to use. This icon will be
|
|
* rotated when the accordion is expanded
|
|
* or collapsed.
|
|
*/
|
|
|
|
this.toggleIcon = _index_2bcb741c_js__WEBPACK_IMPORTED_MODULE_2__.l;
|
|
/**
|
|
* The slot inside of `ion-item` to
|
|
* place the toggle icon. Defaults to `'end'`.
|
|
*/
|
|
|
|
this.toggleIconSlot = 'end';
|
|
|
|
this.setItemDefaults = () => {
|
|
const ionItem = this.getSlottedHeaderIonItem();
|
|
|
|
if (!ionItem) {
|
|
return;
|
|
}
|
|
/**
|
|
* For a11y purposes, we make
|
|
* the ion-item a button so users
|
|
* can tab to it and use keyboard
|
|
* navigation to get around.
|
|
*/
|
|
|
|
|
|
ionItem.button = true;
|
|
ionItem.detail = false;
|
|
/**
|
|
* By default, the lines in an
|
|
* item should be full here, but
|
|
* only do that if a user has
|
|
* not explicitly overridden them
|
|
*/
|
|
|
|
if (ionItem.lines === undefined) {
|
|
ionItem.lines = 'full';
|
|
}
|
|
};
|
|
|
|
this.getSlottedHeaderIonItem = () => {
|
|
const {
|
|
headerEl
|
|
} = this;
|
|
|
|
if (!headerEl) {
|
|
return;
|
|
}
|
|
/**
|
|
* Get the first ion-item
|
|
* slotted in the header slot
|
|
*/
|
|
|
|
|
|
const slot = headerEl.querySelector('slot');
|
|
|
|
if (!slot) {
|
|
return;
|
|
} // This is not defined in unit tests
|
|
|
|
|
|
if (slot.assignedElements === undefined) return;
|
|
return slot.assignedElements().find(el => el.tagName === 'ION-ITEM');
|
|
};
|
|
|
|
this.setAria = (expanded = false) => {
|
|
const ionItem = this.getSlottedHeaderIonItem();
|
|
|
|
if (!ionItem) {
|
|
return;
|
|
}
|
|
/**
|
|
* Get the native <button> element inside of
|
|
* ion-item because that is what will be focused
|
|
*/
|
|
|
|
|
|
const root = (0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.g)(ionItem);
|
|
const button = root.querySelector('button');
|
|
|
|
if (!button) {
|
|
return;
|
|
}
|
|
|
|
button.setAttribute('aria-expanded', `${expanded}`);
|
|
};
|
|
|
|
this.slotToggleIcon = () => {
|
|
const ionItem = this.getSlottedHeaderIonItem();
|
|
|
|
if (!ionItem) {
|
|
return;
|
|
}
|
|
|
|
const {
|
|
toggleIconSlot,
|
|
toggleIcon
|
|
} = this;
|
|
/**
|
|
* Check if there already is a toggle icon.
|
|
* If so, do not add another one.
|
|
*/
|
|
|
|
const existingToggleIcon = ionItem.querySelector('.ion-accordion-toggle-icon');
|
|
|
|
if (existingToggleIcon) {
|
|
return;
|
|
}
|
|
|
|
const iconEl = document.createElement('ion-icon');
|
|
iconEl.slot = toggleIconSlot;
|
|
iconEl.lazy = false;
|
|
iconEl.classList.add('ion-accordion-toggle-icon');
|
|
iconEl.icon = toggleIcon;
|
|
iconEl.setAttribute('aria-hidden', 'true');
|
|
ionItem.appendChild(iconEl);
|
|
};
|
|
|
|
this.expandAccordion = (initialUpdate = false) => {
|
|
const {
|
|
contentEl,
|
|
contentElWrapper
|
|
} = this;
|
|
|
|
if (initialUpdate || contentEl === undefined || contentElWrapper === undefined) {
|
|
this.state = 4
|
|
/* AccordionState.Expanded */
|
|
;
|
|
return;
|
|
}
|
|
|
|
if (this.state === 4
|
|
/* AccordionState.Expanded */
|
|
) {
|
|
return;
|
|
}
|
|
|
|
if (this.currentRaf !== undefined) {
|
|
cancelAnimationFrame(this.currentRaf);
|
|
}
|
|
|
|
if (this.shouldAnimate()) {
|
|
(0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.r)(() => {
|
|
this.state = 8
|
|
/* AccordionState.Expanding */
|
|
;
|
|
this.currentRaf = (0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.r)( /*#__PURE__*/(0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const contentHeight = contentElWrapper.offsetHeight;
|
|
const waitForTransition = (0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.t)(contentEl, 2000);
|
|
contentEl.style.setProperty('max-height', `${contentHeight}px`);
|
|
yield waitForTransition;
|
|
_this.state = 4
|
|
/* AccordionState.Expanded */
|
|
;
|
|
contentEl.style.removeProperty('max-height');
|
|
}));
|
|
});
|
|
} else {
|
|
this.state = 4
|
|
/* AccordionState.Expanded */
|
|
;
|
|
}
|
|
};
|
|
|
|
this.collapseAccordion = (initialUpdate = false) => {
|
|
const {
|
|
contentEl
|
|
} = this;
|
|
|
|
if (initialUpdate || contentEl === undefined) {
|
|
this.state = 1
|
|
/* AccordionState.Collapsed */
|
|
;
|
|
return;
|
|
}
|
|
|
|
if (this.state === 1
|
|
/* AccordionState.Collapsed */
|
|
) {
|
|
return;
|
|
}
|
|
|
|
if (this.currentRaf !== undefined) {
|
|
cancelAnimationFrame(this.currentRaf);
|
|
}
|
|
|
|
if (this.shouldAnimate()) {
|
|
this.currentRaf = (0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.r)( /*#__PURE__*/(0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const contentHeight = contentEl.offsetHeight;
|
|
contentEl.style.setProperty('max-height', `${contentHeight}px`);
|
|
(0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.r)( /*#__PURE__*/(0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const waitForTransition = (0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.t)(contentEl, 2000);
|
|
_this.state = 2
|
|
/* AccordionState.Collapsing */
|
|
;
|
|
yield waitForTransition;
|
|
_this.state = 1
|
|
/* AccordionState.Collapsed */
|
|
;
|
|
contentEl.style.removeProperty('max-height');
|
|
}));
|
|
}));
|
|
} else {
|
|
this.state = 1
|
|
/* AccordionState.Collapsed */
|
|
;
|
|
}
|
|
};
|
|
/**
|
|
* Helper function to determine if
|
|
* something should animate.
|
|
* If prefers-reduced-motion is set
|
|
* then we should not animate, regardless
|
|
* of what is set in the config.
|
|
*/
|
|
|
|
|
|
this.shouldAnimate = () => {
|
|
if (typeof window === 'undefined') {
|
|
return false;
|
|
}
|
|
|
|
const prefersReducedMotion = matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
|
|
if (prefersReducedMotion) {
|
|
return false;
|
|
}
|
|
|
|
const animated = _ionic_global_c74e4951_js__WEBPACK_IMPORTED_MODULE_3__.c.get('animated', true);
|
|
|
|
if (!animated) {
|
|
return false;
|
|
}
|
|
|
|
if (this.accordionGroupEl && !this.accordionGroupEl.animated) {
|
|
return false;
|
|
}
|
|
|
|
return true;
|
|
};
|
|
|
|
this.updateState = /*#__PURE__*/(0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* (initialUpdate = false) {
|
|
const accordionGroup = _this.accordionGroupEl;
|
|
const accordionValue = _this.value;
|
|
|
|
if (!accordionGroup) {
|
|
return;
|
|
}
|
|
|
|
const value = accordionGroup.value;
|
|
const shouldExpand = Array.isArray(value) ? value.includes(accordionValue) : value === accordionValue;
|
|
|
|
if (shouldExpand) {
|
|
_this.expandAccordion(initialUpdate);
|
|
|
|
_this.isNext = _this.isPrevious = false;
|
|
} else {
|
|
_this.collapseAccordion(initialUpdate);
|
|
/**
|
|
* When using popout or inset,
|
|
* the collapsed accordion items
|
|
* may need additional border radius
|
|
* applied. Check to see if the
|
|
* next or previous accordion is selected.
|
|
*/
|
|
|
|
|
|
const nextAccordion = _this.getNextSibling();
|
|
|
|
const nextAccordionValue = nextAccordion === null || nextAccordion === void 0 ? void 0 : nextAccordion.value;
|
|
|
|
if (nextAccordionValue !== undefined) {
|
|
_this.isPrevious = Array.isArray(value) ? value.includes(nextAccordionValue) : value === nextAccordionValue;
|
|
}
|
|
|
|
const previousAccordion = _this.getPreviousSibling();
|
|
|
|
const previousAccordionValue = previousAccordion === null || previousAccordion === void 0 ? void 0 : previousAccordion.value;
|
|
|
|
if (previousAccordionValue !== undefined) {
|
|
_this.isNext = Array.isArray(value) ? value.includes(previousAccordionValue) : value === previousAccordionValue;
|
|
}
|
|
}
|
|
});
|
|
|
|
this.getNextSibling = () => {
|
|
if (!this.el) {
|
|
return;
|
|
}
|
|
|
|
const nextSibling = this.el.nextElementSibling;
|
|
|
|
if ((nextSibling === null || nextSibling === void 0 ? void 0 : nextSibling.tagName) !== 'ION-ACCORDION') {
|
|
return;
|
|
}
|
|
|
|
return nextSibling;
|
|
};
|
|
|
|
this.getPreviousSibling = () => {
|
|
if (!this.el) {
|
|
return;
|
|
}
|
|
|
|
const previousSibling = this.el.previousElementSibling;
|
|
|
|
if ((previousSibling === null || previousSibling === void 0 ? void 0 : previousSibling.tagName) !== 'ION-ACCORDION') {
|
|
return;
|
|
}
|
|
|
|
return previousSibling;
|
|
};
|
|
}
|
|
|
|
connectedCallback() {
|
|
var _a;
|
|
|
|
const accordionGroupEl = this.accordionGroupEl = (_a = this.el) === null || _a === void 0 ? void 0 : _a.closest('ion-accordion-group');
|
|
|
|
if (accordionGroupEl) {
|
|
this.updateState(true);
|
|
(0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.a)(accordionGroupEl, 'ionChange', this.updateListener);
|
|
}
|
|
}
|
|
|
|
disconnectedCallback() {
|
|
const accordionGroupEl = this.accordionGroupEl;
|
|
|
|
if (accordionGroupEl) {
|
|
(0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.b)(accordionGroupEl, 'ionChange', this.updateListener);
|
|
}
|
|
}
|
|
|
|
componentDidLoad() {
|
|
this.setItemDefaults();
|
|
this.slotToggleIcon();
|
|
/**
|
|
* We need to wait a tick because we
|
|
* just set ionItem.button = true and
|
|
* the button has not have been rendered yet.
|
|
*/
|
|
|
|
(0,_helpers_3b390e48_js__WEBPACK_IMPORTED_MODULE_4__.r)(() => {
|
|
/**
|
|
* Set aria label on button inside of ion-item
|
|
* once the inner content has been rendered.
|
|
*/
|
|
const expanded = this.state === 4
|
|
/* AccordionState.Expanded */
|
|
|| this.state === 8
|
|
/* AccordionState.Expanding */
|
|
;
|
|
this.setAria(expanded);
|
|
});
|
|
}
|
|
|
|
toggleExpanded() {
|
|
const {
|
|
accordionGroupEl,
|
|
value,
|
|
state
|
|
} = this;
|
|
|
|
if (accordionGroupEl) {
|
|
/**
|
|
* Because the accordion group may or may
|
|
* not allow multiple accordions open, we
|
|
* need to request the toggling of this
|
|
* accordion and the accordion group will
|
|
* make the decision on whether or not
|
|
* to allow it.
|
|
*/
|
|
const expand = state === 1
|
|
/* AccordionState.Collapsed */
|
|
|| state === 2
|
|
/* AccordionState.Collapsing */
|
|
;
|
|
accordionGroupEl.requestAccordionToggle(value, expand);
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
disabled,
|
|
readonly
|
|
} = this;
|
|
const mode = (0,_ionic_global_c74e4951_js__WEBPACK_IMPORTED_MODULE_3__.b)(this);
|
|
const expanded = this.state === 4
|
|
/* AccordionState.Expanded */
|
|
|| this.state === 8
|
|
/* AccordionState.Expanding */
|
|
;
|
|
const headerPart = expanded ? 'header expanded' : 'header';
|
|
const contentPart = expanded ? 'content expanded' : 'content';
|
|
this.setAria(expanded);
|
|
return (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)(_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.H, {
|
|
class: {
|
|
[mode]: true,
|
|
'accordion-expanding': this.state === 8
|
|
/* AccordionState.Expanding */
|
|
,
|
|
'accordion-expanded': this.state === 4
|
|
/* AccordionState.Expanded */
|
|
,
|
|
'accordion-collapsing': this.state === 2
|
|
/* AccordionState.Collapsing */
|
|
,
|
|
'accordion-collapsed': this.state === 1
|
|
/* AccordionState.Collapsed */
|
|
,
|
|
'accordion-next': this.isNext,
|
|
'accordion-previous': this.isPrevious,
|
|
'accordion-disabled': disabled,
|
|
'accordion-readonly': readonly,
|
|
'accordion-animated': _ionic_global_c74e4951_js__WEBPACK_IMPORTED_MODULE_3__.c.getBoolean('animated', true)
|
|
}
|
|
}, (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
|
|
onClick: () => this.toggleExpanded(),
|
|
id: "header",
|
|
part: headerPart,
|
|
"aria-controls": "content",
|
|
ref: headerEl => this.headerEl = headerEl
|
|
}, (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("slot", {
|
|
name: "header"
|
|
})), (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
|
|
id: "content",
|
|
part: contentPart,
|
|
role: "region",
|
|
"aria-labelledby": "header",
|
|
ref: contentEl => this.contentEl = contentEl
|
|
}, (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
|
|
id: "content-wrapper",
|
|
ref: contentElWrapper => this.contentElWrapper = contentElWrapper
|
|
}, (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("slot", {
|
|
name: "content"
|
|
}))));
|
|
}
|
|
|
|
static get delegatesFocus() {
|
|
return true;
|
|
}
|
|
|
|
get el() {
|
|
return (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.i)(this);
|
|
}
|
|
|
|
};
|
|
let accordionIds = 0;
|
|
Accordion.style = {
|
|
ios: accordionIosCss,
|
|
md: accordionMdCss
|
|
};
|
|
const accordionGroupIosCss = ":host{display:block}:host(.accordion-group-expand-inset){margin-left:16px;margin-right:16px;margin-top:16px;margin-bottom:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host(.accordion-group-expand-inset){margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px}}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded){border-bottom:none}";
|
|
const accordionGroupMdCss = ":host{display:block}:host(.accordion-group-expand-inset){margin-left:16px;margin-right:16px;margin-top:16px;margin-bottom:16px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host(.accordion-group-expand-inset){margin-left:unset;margin-right:unset;-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px}}:host(.accordion-group-expand-inset) ::slotted(ion-accordion){-webkit-box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded){margin-left:0;margin-right:0;margin-top:16px;margin-bottom:16px;border-radius:6px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-previous){border-bottom-right-radius:6px;border-bottom-left-radius:6px}:host-context([dir=rtl]):host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-previous),:host-context([dir=rtl]).accordion-group-expand-inset ::slotted(ion-accordion.accordion-previous){border-bottom-right-radius:6px;border-bottom-left-radius:6px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-next){border-top-left-radius:6px;border-top-right-radius:6px}:host-context([dir=rtl]):host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-next),:host-context([dir=rtl]).accordion-group-expand-inset ::slotted(ion-accordion.accordion-next){border-top-left-radius:6px;border-top-right-radius:6px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion):first-of-type{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}";
|
|
const AccordionGroup = class {
|
|
constructor(hostRef) {
|
|
(0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.r)(this, hostRef);
|
|
this.ionChange = (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.e)(this, "ionChange", 7);
|
|
/**
|
|
* If `true`, all accordions inside of the
|
|
* accordion group will animate when expanding
|
|
* or collapsing.
|
|
*/
|
|
|
|
this.animated = true;
|
|
/**
|
|
* If `true`, the accordion group cannot be interacted with.
|
|
*/
|
|
|
|
this.disabled = false;
|
|
/**
|
|
* If `true`, the accordion group cannot be interacted with,
|
|
* but does not alter the opacity.
|
|
*/
|
|
|
|
this.readonly = false;
|
|
/**
|
|
* Describes the expansion behavior for each accordion.
|
|
* Possible values are `"compact"` and `"inset"`.
|
|
* Defaults to `"compact"`.
|
|
*/
|
|
|
|
this.expand = 'compact';
|
|
}
|
|
|
|
valueChanged() {
|
|
const {
|
|
value,
|
|
multiple
|
|
} = this;
|
|
/**
|
|
* If accordion group does not
|
|
* let multiple accordions be open
|
|
* at once, but user passes an array
|
|
* just grab the first value.
|
|
*/
|
|
|
|
if (!multiple && Array.isArray(value)) {
|
|
this.value = value[0];
|
|
} else {
|
|
this.ionChange.emit({
|
|
value: this.value
|
|
});
|
|
}
|
|
}
|
|
|
|
disabledChanged() {
|
|
var _this2 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const {
|
|
disabled
|
|
} = _this2;
|
|
const accordions = yield _this2.getAccordions();
|
|
|
|
for (const accordion of accordions) {
|
|
accordion.disabled = disabled;
|
|
}
|
|
})();
|
|
}
|
|
|
|
readonlyChanged() {
|
|
var _this3 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const {
|
|
readonly
|
|
} = _this3;
|
|
const accordions = yield _this3.getAccordions();
|
|
|
|
for (const accordion of accordions) {
|
|
accordion.readonly = readonly;
|
|
}
|
|
})();
|
|
}
|
|
|
|
onKeydown(ev) {
|
|
var _this4 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const activeElement = document.activeElement;
|
|
|
|
if (!activeElement) {
|
|
return;
|
|
}
|
|
/**
|
|
* Make sure focus is in the header, not the body, of the accordion. This ensures
|
|
* that if there are any interactable elements in the body, their keyboard
|
|
* interaction doesn't get stolen by the accordion. Example: using up/down keys
|
|
* in ion-textarea.
|
|
*/
|
|
|
|
|
|
const activeAccordionHeader = activeElement.closest('ion-accordion [slot="header"]');
|
|
|
|
if (!activeAccordionHeader) {
|
|
return;
|
|
}
|
|
|
|
const accordionEl = activeElement.tagName === 'ION-ACCORDION' ? activeElement : activeElement.closest('ion-accordion');
|
|
|
|
if (!accordionEl) {
|
|
return;
|
|
}
|
|
|
|
const closestGroup = accordionEl.closest('ion-accordion-group');
|
|
|
|
if (closestGroup !== _this4.el) {
|
|
return;
|
|
} // If the active accordion is not in the current array of accordions, do not do anything
|
|
|
|
|
|
const accordions = yield _this4.getAccordions();
|
|
const startingIndex = accordions.findIndex(a => a === accordionEl);
|
|
|
|
if (startingIndex === -1) {
|
|
return;
|
|
}
|
|
|
|
let accordion;
|
|
|
|
if (ev.key === 'ArrowDown') {
|
|
accordion = _this4.findNextAccordion(accordions, startingIndex);
|
|
} else if (ev.key === 'ArrowUp') {
|
|
accordion = _this4.findPreviousAccordion(accordions, startingIndex);
|
|
} else if (ev.key === 'Home') {
|
|
accordion = accordions[0];
|
|
} else if (ev.key === 'End') {
|
|
accordion = accordions[accordions.length - 1];
|
|
}
|
|
|
|
if (accordion !== undefined && accordion !== activeElement) {
|
|
accordion.focus();
|
|
}
|
|
})();
|
|
}
|
|
|
|
componentDidLoad() {
|
|
var _this5 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
if (_this5.disabled) {
|
|
_this5.disabledChanged();
|
|
}
|
|
|
|
if (_this5.readonly) {
|
|
_this5.readonlyChanged();
|
|
}
|
|
})();
|
|
}
|
|
/**
|
|
* @internal
|
|
*/
|
|
|
|
|
|
requestAccordionToggle(accordionValue, accordionExpand) {
|
|
var _this6 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
const {
|
|
multiple,
|
|
value,
|
|
readonly,
|
|
disabled
|
|
} = _this6;
|
|
|
|
if (readonly || disabled) {
|
|
return;
|
|
}
|
|
|
|
if (accordionExpand) {
|
|
/**
|
|
* If group accepts multiple values
|
|
* check to see if value is already in
|
|
* in values array. If not, add it
|
|
* to the array.
|
|
*/
|
|
if (multiple) {
|
|
const groupValue = value !== null && value !== void 0 ? value : [];
|
|
const processedValue = Array.isArray(groupValue) ? groupValue : [groupValue];
|
|
const valueExists = processedValue.find(v => v === accordionValue);
|
|
|
|
if (valueExists === undefined && accordionValue !== undefined) {
|
|
_this6.value = [...processedValue, accordionValue];
|
|
}
|
|
} else {
|
|
_this6.value = accordionValue;
|
|
}
|
|
} else {
|
|
/**
|
|
* If collapsing accordion, either filter the value
|
|
* out of the values array or unset the value.
|
|
*/
|
|
if (multiple) {
|
|
const groupValue = value !== null && value !== void 0 ? value : [];
|
|
const processedValue = Array.isArray(groupValue) ? groupValue : [groupValue];
|
|
_this6.value = processedValue.filter(v => v !== accordionValue);
|
|
} else {
|
|
_this6.value = undefined;
|
|
}
|
|
}
|
|
})();
|
|
}
|
|
|
|
findNextAccordion(accordions, startingIndex) {
|
|
const nextAccordion = accordions[startingIndex + 1];
|
|
|
|
if (nextAccordion === undefined) {
|
|
return accordions[0];
|
|
}
|
|
|
|
return nextAccordion;
|
|
}
|
|
|
|
findPreviousAccordion(accordions, startingIndex) {
|
|
const prevAccordion = accordions[startingIndex - 1];
|
|
|
|
if (prevAccordion === undefined) {
|
|
return accordions[accordions.length - 1];
|
|
}
|
|
|
|
return prevAccordion;
|
|
}
|
|
/**
|
|
* @internal
|
|
*/
|
|
|
|
|
|
getAccordions() {
|
|
var _this7 = this;
|
|
|
|
return (0,_Volumes_case_workspace_work_APPS_KA_APP_WORK_NOW_KA_PASS_V2_2_6_node_modules_babel_runtime_helpers_esm_asyncToGenerator_js__WEBPACK_IMPORTED_MODULE_0__["default"])(function* () {
|
|
return Array.from(_this7.el.querySelectorAll(':scope > ion-accordion'));
|
|
})();
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
disabled,
|
|
readonly,
|
|
expand
|
|
} = this;
|
|
const mode = (0,_ionic_global_c74e4951_js__WEBPACK_IMPORTED_MODULE_3__.b)(this);
|
|
return (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)(_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.H, {
|
|
class: {
|
|
[mode]: true,
|
|
'accordion-group-disabled': disabled,
|
|
'accordion-group-readonly': readonly,
|
|
[`accordion-group-expand-${expand}`]: true
|
|
},
|
|
role: "presentation"
|
|
}, (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.h)("slot", null));
|
|
}
|
|
|
|
get el() {
|
|
return (0,_index_8e692445_js__WEBPACK_IMPORTED_MODULE_1__.i)(this);
|
|
}
|
|
|
|
static get watchers() {
|
|
return {
|
|
"value": ["valueChanged"],
|
|
"disabled": ["disabledChanged"],
|
|
"readonly": ["readonlyChanged"]
|
|
};
|
|
}
|
|
|
|
};
|
|
AccordionGroup.style = {
|
|
ios: accordionGroupIosCss,
|
|
md: accordionGroupMdCss
|
|
};
|
|
|
|
|
|
/***/ })
|
|
|
|
}])
|
|
//# sourceMappingURL=79.js.map
|