@ionic/core 8.7.8-dev.11761837190.1db6c2b6 → 8.7.8-dev.11761840817.1bede576

package/hydrate/index.mjs

@@ -4040,20 +4040,36 @@ const accordionMdCss = ":host{display:block;position:relative;width:100%;backgro
 class Accordion {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.updateListener = (ev) => {
-            var _a, _b;
-            const initialUpdate = (_b = (_a = ev.detail) === null || _a === void 0 ? void 0 : _a.initial) !== null && _b !== void 0 ? _b : false;
-            console.log('[Accordion]', this.value, 'updateListener - initial:', initialUpdate, 'hasInteracted:', this.hasInteracted, 'hasEverBeenExpanded:', this.hasEverBeenExpanded);
+        this.updateListener = () => {
             /**
-             * If this is not an initial update (meaning it's from a user interaction
-             * or programmatic call after load), mark that we've had an interaction.
-             * This enables animations for this and future updates.
+             * Determine if this update will cause an actual state change.
+             * We only want to mark as "interacted" if the state is changing.
              */
-            if (!initialUpdate) {
-                console.log('[Accordion]', this.value, 'Setting hasInteracted to true');
-                this.hasInteracted = true;
+            const accordionGroup = this.accordionGroupEl;
+            if (accordionGroup) {
+                const value = accordionGroup.value;
+                const accordionValue = this.value;
+                const shouldExpand = Array.isArray(value) ? value.includes(accordionValue) : value === accordionValue;
+                const isExpanded = this.state === 4 /* AccordionState.Expanded */ || this.state === 8 /* AccordionState.Expanding */;
+                const stateWillChange = shouldExpand !== isExpanded;
+                /**
+                 * Only mark as interacted if:
+                 * 1. This is not the first update we've received with a defined value
+                 * 2. The state is actually changing (prevents redundant updates from enabling animations)
+                 */
+                if (this.hasReceivedFirstUpdate && stateWillChange) {
+                    this.hasInteracted = true;
+                }
+                /**
+                 * Only count this as the first update if the group value is defined.
+                 * This prevents the initial undefined value from the group's componentDidLoad
+                 * from being treated as the first real update.
+                 */
+                if (value !== undefined) {
+                    this.hasReceivedFirstUpdate = true;
+                }
             }
-            this.updateState(initialUpdate);
+            this.updateState();
         };
         this.state = 1 /* AccordionState.Collapsed */;
         this.isNext = false;
@@ -4070,6 +4086,11 @@ class Accordion {
          * Used to prevent the first expansion from animating.
          */
         this.hasEverBeenExpanded = false;
+        /**
+         * Tracks if this accordion has received its first update from the group.
+         * Used to distinguish initial programmatic sets from user interactions.
+         */
+        this.hasReceivedFirstUpdate = false;
         /**
          * The value of the accordion. Defaults to an autogenerated
          * value.
@@ -4174,21 +4195,18 @@ class Accordion {
             iconEl.setAttribute('aria-hidden', 'true');
             ionItem.appendChild(iconEl);
         };
-        this.expandAccordion = (initialUpdate = false) => {
-            console.log('[Accordion]', this.value, 'expandAccordion - initialUpdate:', initialUpdate, 'state:', this.state);
+        this.expandAccordion = () => {
             const { contentEl, contentElWrapper } = this;
-            if (initialUpdate || contentEl === undefined || contentElWrapper === undefined) {
+            /**
+             * If the content elements aren't available yet, just set the state.
+             * This happens on initial render before the DOM is ready.
+             */
+            if (contentEl === undefined || contentElWrapper === undefined) {
                 this.state = 4 /* AccordionState.Expanded */;
-                /**
-                 * Mark that this accordion has been expanded at least once.
-                 * Do this even on initial expansion so future interactions animate.
-                 */
                 this.hasEverBeenExpanded = true;
-                console.log('[Accordion]', this.value, 'expandAccordion early return - hasEverBeenExpanded set to true');
                 return;
             }
             if (this.state === 4 /* AccordionState.Expanded */) {
-                console.log('[Accordion]', this.value, 'expandAccordion - already expanded, returning');
                 return;
             }
             if (this.currentRaf !== undefined) {
@@ -4199,9 +4217,7 @@ class Accordion {
              * This allows subsequent expansions to animate.
              */
             this.hasEverBeenExpanded = true;
-            console.log('[Accordion]', this.value, 'expandAccordion - hasEverBeenExpanded set to true');
             if (this.shouldAnimate()) {
-                console.log('[Accordion]', this.value, 'expandAccordion - will animate');
                 raf(() => {
                     this.state = 8 /* AccordionState.Expanding */;
                     this.currentRaf = raf(async () => {
@@ -4218,9 +4234,13 @@ class Accordion {
                 this.state = 4 /* AccordionState.Expanded */;
             }
         };
-        this.collapseAccordion = (initialUpdate = false) => {
+        this.collapseAccordion = () => {
             const { contentEl } = this;
-            if (initialUpdate || contentEl === undefined) {
+            /**
+             * If the content element isn't available yet, just set the state.
+             * This happens on initial render before the DOM is ready.
+             */
+            if (contentEl === undefined) {
                 this.state = 1 /* AccordionState.Collapsed */;
                 return;
             }
@@ -4265,7 +4285,6 @@ class Accordion {
              * where effects run twice and might incorrectly mark as interacted.
              */
             if (!this.hasInteracted || !this.hasEverBeenExpanded) {
-                console.log('[Accordion]', this.value, 'shouldAnimate: false - hasInteracted:', this.hasInteracted, 'hasEverBeenExpanded:', this.hasEverBeenExpanded);
                 return false;
             }
             if (typeof window === 'undefined') {
@@ -4284,7 +4303,7 @@ class Accordion {
             }
             return true;
         };
-        this.updateState = async (initialUpdate = false) => {
+        this.updateState = async () => {
             const accordionGroup = this.accordionGroupEl;
             const accordionValue = this.value;
             if (!accordionGroup) {
@@ -4293,11 +4312,11 @@ class Accordion {
             const value = accordionGroup.value;
             const shouldExpand = Array.isArray(value) ? value.includes(accordionValue) : value === accordionValue;
             if (shouldExpand) {
-                this.expandAccordion(initialUpdate);
+                this.expandAccordion();
                 this.isNext = this.isPrevious = false;
             }
             else {
-                this.collapseAccordion(initialUpdate);
+                this.collapseAccordion();
                 /**
                  * When using popout or inset,
                  * the collapsed accordion items
@@ -4345,7 +4364,7 @@ class Accordion {
         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);
+            this.updateState();
             addEventListener$1(accordionGroupEl, 'ionValueChange', this.updateListener);
         }
     }
@@ -4400,10 +4419,8 @@ class Accordion {
         const expanded = this.state === 4 /* AccordionState.Expanded */ || this.state === 8 /* AccordionState.Expanding */;
         const headerPart = expanded ? 'header expanded' : 'header';
         const contentPart = expanded ? 'content expanded' : 'content';
-        const shouldAnimate = this.shouldAnimate();
-        console.log('[Accordion]', this.value, 'render - state:', this.state, 'shouldAnimate:', shouldAnimate, 'hasInteracted:', this.hasInteracted, 'hasEverBeenExpanded:', this.hasEverBeenExpanded);
         this.setAria(expanded);
-        return (hAsync(Host, { key: '9f73d0ed2ced6269234bdade7c0b95ec1bc697de', class: {
+        return (hAsync(Host, { key: '0f3b65e32d6908f466e0b0535fbdad1d6d6c4c88', class: {
                 [mode]: true,
                 'accordion-expanding': this.state === 8 /* AccordionState.Expanding */,
                 'accordion-expanded': this.state === 4 /* AccordionState.Expanded */,
@@ -4413,8 +4430,8 @@ class Accordion {
                 'accordion-previous': this.isPrevious,
                 'accordion-disabled': disabled,
                 'accordion-readonly': readonly,
-                'accordion-animated': shouldAnimate,
-            } }, hAsync("div", { key: 'a58ed92158e49220057517759084d81d69f64cf9', onClick: () => this.toggleExpanded(), id: "header", part: headerPart, "aria-controls": "content", ref: (headerEl) => (this.headerEl = headerEl) }, hAsync("slot", { key: '0d7fb864762d109ffee42e1d64f3dfc08986fa63', name: "header" })), hAsync("div", { key: 'b506df416bcdbd5a0a1bb28017eac44806bba6f0', id: "content", part: contentPart, role: "region", "aria-labelledby": "header", ref: (contentEl) => (this.contentEl = contentEl) }, hAsync("div", { key: '304e77c2605f2c947afd9f97f608ef0ab11def03', id: "content-wrapper", ref: (contentElWrapper) => (this.contentElWrapper = contentElWrapper) }, hAsync("slot", { key: 'df5490817fd493ed807d0666d872850612ff986c', name: "content" })))));
+                'accordion-animated': this.shouldAnimate(),
+            } }, hAsync("div", { key: '79e49dde14246e65fab5ee991a9f06fda649b8a4', onClick: () => this.toggleExpanded(), id: "header", part: headerPart, "aria-controls": "content", ref: (headerEl) => (this.headerEl = headerEl) }, hAsync("slot", { key: '8938988b9a5f87357b8351ecf5ca37ae80461170', name: "header" })), hAsync("div", { key: '636a23a49fd8daae92a584452bc3f5b35072110d', id: "content", part: contentPart, role: "region", "aria-labelledby": "header", ref: (contentEl) => (this.contentEl = contentEl) }, hAsync("div", { key: 'dd28ba52dbd28690561206aac205190aebecb793', id: "content-wrapper", ref: (contentElWrapper) => (this.contentElWrapper = contentElWrapper) }, hAsync("slot", { key: '133fb1680990303ba55b61e3fed741a31295acdf', name: "content" })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -4479,12 +4496,9 @@ class AccordionGroup {
          * Defaults to `"compact"`.
          */
         this.expand = 'compact';
-        this.hasEmittedInitialValue = false;
-        this.isUserInitiatedChange = false;
     }
     valueChanged() {
-        this.emitValueChange(false, this.isUserInitiatedChange);
-        this.isUserInitiatedChange = false;
+        this.ionValueChange.emit({ value: this.value });
     }
     async disabledChanged() {
         const { disabled } = this;
@@ -4558,12 +4572,11 @@ class AccordionGroup {
          * it is possible for the value to be set after the Web Component
          * initializes but before the value watcher is set up in Stencil.
          * As a result, the watcher callback may not be fired.
-         * We work around this by manually emitting a value change when the component
-         * has loaded and the watcher is configured.
+         * We work around this by manually calling the watcher
+         * callback when the component has loaded and the watcher
+         * is configured.
          */
-        if (!this.hasEmittedInitialValue) {
-            this.emitValueChange(true);
-        }
+        this.valueChanged();
     }
     /**
      * Sets the value property and emits ionChange.
@@ -4574,7 +4587,6 @@ class AccordionGroup {
      * accordion group to an array.
      */
     setValue(accordionValue) {
-        this.isUserInitiatedChange = true;
         const value = (this.value = accordionValue);
         this.ionChange.emit({ value });
     }
@@ -4644,41 +4656,15 @@ class AccordionGroup {
     async getAccordions() {
         return Array.from(this.el.querySelectorAll(':scope > ion-accordion'));
     }
-    emitValueChange(initial, isUserInitiated = false) {
-        const { value, multiple } = this;
-        if (!multiple && Array.isArray(value)) {
-            /**
-             * We do some processing on the `value` array so
-             * that it looks more like an array when logged to
-             * the console.
-             * Example given ['a', 'b']
-             * Default toString() behavior: a,b
-             * Custom behavior: ['a', 'b']
-             */
-            printIonWarning(`[ion-accordion-group] - An array of values was passed, but multiple is "false". This is incorrect usage and may result in unexpected behaviors. To dismiss this warning, pass a string to the "value" property when multiple="false".
-
-  Value Passed: [${value.map((v) => `'${v}'`).join(', ')}]
-`, this.el);
-        }
-        /**
-         * Track if this is the initial value update so accordions
-         * can skip transition animations when they first render.
-         */
-        const shouldMarkInitial = initial || (!this.hasEmittedInitialValue && value !== undefined && !isUserInitiated);
-        this.ionValueChange.emit({ value, initial: shouldMarkInitial });
-        if (value !== undefined) {
-            this.hasEmittedInitialValue = true;
-        }
-    }
     render() {
         const { disabled, readonly, expand } = this;
         const mode = getIonMode$1(this);
-        return (hAsync(Host, { key: 'fd64cd203e2c8acdfc266005f372e26c29853847', class: {
+        return (hAsync(Host, { key: '9a4a3b7811e63a0748cdcda82a840179cdfb26e1', class: {
                 [mode]: true,
                 'accordion-group-disabled': disabled,
                 'accordion-group-readonly': readonly,
                 [`accordion-group-expand-${expand}`]: true,
-            }, role: "presentation" }, hAsync("slot", { key: 'bdd9f419fc6e20f5de6f0f52ac93af7ec9a380ef' })));
+            }, role: "presentation" }, hAsync("slot", { key: '183cebf7e0eb468b5c28c4105f23ec5aed36be1b' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "8.7.8-dev.11761837190.1db6c2b6",
+  "version": "8.7.8-dev.11761840817.1bede576",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",

package/dist/ionic/p-b331b4e6.entry.js

@@ -1,4 +0,0 @@
-/*!
- * (C) Ionic http://ionicframework.com - MIT License
- */
-import{r as o,e as t,h as i,d as n,g as e,c as s,f as a}from"./p-C8IsBmNU.js";import{g as r,r as d,f as c,m as h,t as l}from"./p-CTfR9YZG.js";import{l as p}from"./p-DV3sJJW8.js";import{b as u}from"./p-BFvmZNyx.js";const g=class{constructor(i){o(this,i),this.updateListener=o=>{var t,i;const n=null!==(i=null===(t=o.detail)||void 0===t?void 0:t.initial)&&void 0!==i&&i;console.log("[Accordion]",this.value,"updateListener - initial:",n,"hasInteracted:",this.hasInteracted,"hasEverBeenExpanded:",this.hasEverBeenExpanded),n||(console.log("[Accordion]",this.value,"Setting hasInteracted to true"),this.hasInteracted=!0),this.updateState(n)},this.state=1,this.isNext=!1,this.isPrevious=!1,this.hasInteracted=!1,this.hasEverBeenExpanded=!1,this.value="ion-accordion-"+x++,this.disabled=!1,this.readonly=!1,this.toggleIcon=p,this.toggleIconSlot="end",this.setItemDefaults=()=>{const o=this.getSlottedHeaderIonItem();o&&(o.button=!0,o.detail=!1,void 0===o.lines&&(o.lines="full"))},this.getSlottedHeaderIonItem=()=>{const{headerEl:o}=this;if(!o)return;const t=o.querySelector("slot");return t&&void 0!==t.assignedElements?t.assignedElements().find((o=>"ION-ITEM"===o.tagName)):void 0},this.setAria=(o=!1)=>{const t=this.getSlottedHeaderIonItem();if(!t)return;const i=r(t).querySelector("button");i&&i.setAttribute("aria-expanded",`${o}`)},this.slotToggleIcon=()=>{const o=this.getSlottedHeaderIonItem();if(!o)return;const{toggleIconSlot:t,toggleIcon:i}=this;if(o.querySelector(".ion-accordion-toggle-icon"))return;const n=document.createElement("ion-icon");n.slot=t,n.lazy=!1,n.classList.add("ion-accordion-toggle-icon"),n.icon=i,n.setAttribute("aria-hidden","true"),o.appendChild(n)},this.expandAccordion=(o=!1)=>{console.log("[Accordion]",this.value,"expandAccordion - initialUpdate:",o,"state:",this.state);const{contentEl:t,contentElWrapper:i}=this;if(o||void 0===t||void 0===i)return this.state=4,this.hasEverBeenExpanded=!0,void console.log("[Accordion]",this.value,"expandAccordion early return - hasEverBeenExpanded set to true");4!==this.state?(void 0!==this.currentRaf&&cancelAnimationFrame(this.currentRaf),this.hasEverBeenExpanded=!0,console.log("[Accordion]",this.value,"expandAccordion - hasEverBeenExpanded set to true"),this.shouldAnimate()?(console.log("[Accordion]",this.value,"expandAccordion - will animate"),d((()=>{this.state=8,this.currentRaf=d((async()=>{const o=i.offsetHeight,n=l(t,2e3);t.style.setProperty("max-height",`${o}px`),await n,this.state=4,t.style.removeProperty("max-height")}))}))):this.state=4):console.log("[Accordion]",this.value,"expandAccordion - already expanded, returning")},this.collapseAccordion=(o=!1)=>{const{contentEl:t}=this;o||void 0===t?this.state=1:1!==this.state&&(void 0!==this.currentRaf&&cancelAnimationFrame(this.currentRaf),this.shouldAnimate()?this.currentRaf=d((async()=>{t.style.setProperty("max-height",`${t.offsetHeight}px`),d((async()=>{const o=l(t,2e3);this.state=2,await o,this.state=1,t.style.removeProperty("max-height")}))})):this.state=1)},this.shouldAnimate=()=>this.hasInteracted&&this.hasEverBeenExpanded?"undefined"!=typeof window&&(!matchMedia("(prefers-reduced-motion: reduce)").matches&&!(!t.get("animated",!0)||this.accordionGroupEl&&!this.accordionGroupEl.animated)):(console.log("[Accordion]",this.value,"shouldAnimate: false - hasInteracted:",this.hasInteracted,"hasEverBeenExpanded:",this.hasEverBeenExpanded),!1),this.updateState=async(o=!1)=>{const t=this.accordionGroupEl,i=this.value;if(!t)return;const n=t.value;if(Array.isArray(n)?n.includes(i):n===i)this.expandAccordion(o),this.isNext=this.isPrevious=!1;else{this.collapseAccordion(o);const t=this.getNextSibling(),i=null==t?void 0:t.value;void 0!==i&&(this.isPrevious=Array.isArray(n)?n.includes(i):n===i);const e=this.getPreviousSibling(),s=null==e?void 0:e.value;void 0!==s&&(this.isNext=Array.isArray(n)?n.includes(s):n===s)}},this.getNextSibling=()=>{if(!this.el)return;const o=this.el.nextElementSibling;return"ION-ACCORDION"===(null==o?void 0:o.tagName)?o:void 0},this.getPreviousSibling=()=>{if(!this.el)return;const o=this.el.previousElementSibling;return"ION-ACCORDION"===(null==o?void 0:o.tagName)?o:void 0}}valueChanged(){this.updateState()}connectedCallback(){var o;const t=this.accordionGroupEl=null===(o=this.el)||void 0===o?void 0:o.closest("ion-accordion-group");t&&(this.updateState(!0),c(t,"ionValueChange",this.updateListener))}disconnectedCallback(){const o=this.accordionGroupEl;o&&h(o,"ionValueChange",this.updateListener)}componentDidLoad(){this.setItemDefaults(),this.slotToggleIcon(),d((()=>{this.setAria(4===this.state||8===this.state)}))}toggleExpanded(){const{accordionGroupEl:o,disabled:t,readonly:i,value:n,state:e}=this;t||i||(this.hasInteracted=!0,!o)||o.requestAccordionToggle(n,1===e||2===e)}render(){const{disabled:o,readonly:t}=this,e=u(this),s=4===this.state||8===this.state,a=s?"header expanded":"header",r=s?"content expanded":"content",d=this.shouldAnimate();return console.log("[Accordion]",this.value,"render - state:",this.state,"shouldAnimate:",d,"hasInteracted:",this.hasInteracted,"hasEverBeenExpanded:",this.hasEverBeenExpanded),this.setAria(s),i(n,{key:"9f73d0ed2ced6269234bdade7c0b95ec1bc697de",class:{[e]:!0,"accordion-expanding":8===this.state,"accordion-expanded":4===this.state,"accordion-collapsing":2===this.state,"accordion-collapsed":1===this.state,"accordion-next":this.isNext,"accordion-previous":this.isPrevious,"accordion-disabled":o,"accordion-readonly":t,"accordion-animated":d}},i("div",{key:"a58ed92158e49220057517759084d81d69f64cf9",onClick:()=>this.toggleExpanded(),id:"header",part:a,"aria-controls":"content",ref:o=>this.headerEl=o},i("slot",{key:"0d7fb864762d109ffee42e1d64f3dfc08986fa63",name:"header"})),i("div",{key:"b506df416bcdbd5a0a1bb28017eac44806bba6f0",id:"content",part:r,role:"region","aria-labelledby":"header",ref:o=>this.contentEl=o},i("div",{key:"304e77c2605f2c947afd9f97f608ef0ab11def03",id:"content-wrapper",ref:o=>this.contentElWrapper=o},i("slot",{key:"df5490817fd493ed807d0666d872850612ff986c",name:"content"}))))}static get delegatesFocus(){return!0}get el(){return e(this)}static get watchers(){return{value:["valueChanged"]}}};let x=0;g.style={ios:":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}",md:":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 m=class{constructor(t){o(this,t),this.ionChange=s(this,"ionChange",7),this.ionValueChange=s(this,"ionValueChange",7),this.animated=!0,this.disabled=!1,this.readonly=!1,this.expand="compact",this.hasEmittedInitialValue=!1,this.isUserInitiatedChange=!1}valueChanged(){this.emitValueChange(!1,this.isUserInitiatedChange),this.isUserInitiatedChange=!1}async disabledChanged(){const{disabled:o}=this,t=await this.getAccordions();for(const i of t)i.disabled=o}async readonlyChanged(){const{readonly:o}=this,t=await this.getAccordions();for(const i of t)i.readonly=o}async onKeydown(o){const t=document.activeElement;if(!t)return;if(!t.closest('ion-accordion [slot="header"]'))return;const i="ION-ACCORDION"===t.tagName?t:t.closest("ion-accordion");if(!i)return;if(i.closest("ion-accordion-group")!==this.el)return;const n=await this.getAccordions(),e=n.findIndex((o=>o===i));if(-1===e)return;let s;"ArrowDown"===o.key?s=this.findNextAccordion(n,e):"ArrowUp"===o.key?s=this.findPreviousAccordion(n,e):"Home"===o.key?s=n[0]:"End"===o.key&&(s=n[n.length-1]),void 0!==s&&s!==t&&s.focus()}async componentDidLoad(){this.disabled&&this.disabledChanged(),this.readonly&&this.readonlyChanged(),this.hasEmittedInitialValue||this.emitValueChange(!0)}setValue(o){this.isUserInitiatedChange=!0;const t=this.value=o;this.ionChange.emit({value:t})}async requestAccordionToggle(o,t){const{multiple:i,value:n,readonly:e,disabled:s}=this;if(!e&&!s)if(t)if(i){const t=null!=n?n:[],i=Array.isArray(t)?t:[t];void 0===i.find((t=>t===o))&&void 0!==o&&this.setValue([...i,o])}else this.setValue(o);else if(i){const t=null!=n?n:[],i=Array.isArray(t)?t:[t];this.setValue(i.filter((t=>t!==o)))}else this.setValue(void 0)}findNextAccordion(o,t){const i=o[t+1];return void 0===i?o[0]:i}findPreviousAccordion(o,t){const i=o[t-1];return void 0===i?o[o.length-1]:i}async getAccordions(){return Array.from(this.el.querySelectorAll(":scope > ion-accordion"))}emitValueChange(o,t=!1){const{value:i,multiple:n}=this;!n&&Array.isArray(i)&&a(`[ion-accordion-group] - An array of values was passed, but multiple is "false". This is incorrect usage and may result in unexpected behaviors. To dismiss this warning, pass a string to the "value" property when multiple="false".\n\n  Value Passed: [${i.map((o=>`'${o}'`)).join(", ")}]\n`,this.el),this.ionValueChange.emit({value:i,initial:o||!this.hasEmittedInitialValue&&void 0!==i&&!t}),void 0!==i&&(this.hasEmittedInitialValue=!0)}render(){const{disabled:o,readonly:t,expand:e}=this,s=u(this);return i(n,{key:"fd64cd203e2c8acdfc266005f372e26c29853847",class:{[s]:!0,"accordion-group-disabled":o,"accordion-group-readonly":t,[`accordion-group-expand-${e}`]:!0},role:"presentation"},i("slot",{key:"bdd9f419fc6e20f5de6f0f52ac93af7ec9a380ef"}))}get el(){return e(this)}static get watchers(){return{value:["valueChanged"],disabled:["disabledChanged"],readonly:["readonlyChanged"]}}};m.style={ios:":host{display:block}:host(.accordion-group-expand-inset){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:16px;margin-bottom:16px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanding),:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-expanded){border-bottom:none}",md:":host{display:block}:host(.accordion-group-expand-inset){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:16px;margin-bottom: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-end-end-radius:6px;border-end-start-radius:6px}:host(.accordion-group-expand-inset) ::slotted(ion-accordion.accordion-next){border-start-start-radius:6px;border-start-end-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}"};export{g as ion_accordion,m as ion_accordion_group}