@gem-sdk/components 3.0.0-pre-production.14 → 3.0.1-staging.1135

package/dist/cjs/accordion/common/classes.js

@@ -0,0 +1 @@
+"use strict";var core=require("@gem-sdk/core");const getContainerClasses=(e,s)=>{let o=core.cls("gp-flex gp-flex-col gp-w-full",{"gp-px-[1px]":"edit"===s},e);return core.composeClasses(o)},extendClasses=()=>core.composeClasses(core.cls("gp-hidden gp-rotate-90 -gp-rotate-90 gp-rotate-180")),getItemContainerClasses=core.composeClasses("gp-overflow-clip gp-group"),getIconClasses=core.composeClasses("gp-inline-flex"),getIconRotateClasses=(e,s)=>{let{isShow:o,iconExpand:t,iconSvg:r,iconCollapse:l}=s||{},{color:a}=e??{};return core.composeClasses(core.cls({"-gp-rotate-90":!0===o&&"plus"!==r&&!t,"gp-rotate-90":!1===o&&!l},"group-hover:[color:var(--icon-expand-hover-color)] gp-collapsible-icon gp-accordion-item_icon gp-inline-flex gp-items-center gp-justify-center gp-overflow-hidden gp-transition-all gp-duration-200 [&>svg]:!gp-h-[var(--height-iconCollapseSize)] [&>svg]:!gp-w-full",o?core.getGlobalColorClass("text",a?.active):core.getGlobalColorStateClass("text",a),o?"gp-text-[var(--icon-expand-active-color)]":""))},getDropdownClasses=(e,s)=>{let{isShow:o,uniqueId:t,makeIcon:r}=s||{},{itemHeaderSpacing:l,headerContentPadding:a,bgColor:g}=e??{};return core.composeClasses(core.cls("gp-flex gp-accordion-item_header gp-cursor-pointer gp-items-center",r?"gp-gap-[16px]":"",t,`gp-accordion-item-${t}-${s?.index}`,l?.type&&!a?core.genSizeClass(l?.type):"",{[core.getGlobalColorClass("bg",g?.active)]:o,[core.getGlobalColorStateClass("bg",g)]:!o}))},getContentClasses=e=>core.composeClasses(core.cls(`${e}`,"gp-overflow-hidden",`gp-child-item-${e}`,"gp-accordion-item")),getGapClasses=core.composeClasses("gp-flex gp-w-full gp-items-center gp-break-all"),getLayoutIconClasses=core.composeClasses("group-hover:[color:var(--icon-hover-color)!important] gp-icon gp-inline-flex header-icon gp-items-center gp-justify-center gp-overflow-hidden [&>svg]:!gp-h-[var(--height-configIconSize)] [&>svg]:!gp-w-full"),getRenderChildrenClasses=(e,s)=>{let{isShow:o,hasTransitionedIn:t,isMounted:r}=s||{},{itemContentSpacing:l,contentSizePadding:a}=e??{};return core.composeClasses(core.cls("gp-accordion-item_body gp-transition-all gp-grid gp-duration-500 gp-overflow-hidden",{"gp-grid-rows-[1fr]":o?t:r,"gp-grid-rows-[0fr]":o?!t:!r},l?.type&&!a?core.genSizeClass(l?.type):""))};exports.extendClasses=extendClasses,exports.getContainerClasses=getContainerClasses,exports.getContentClasses=getContentClasses,exports.getDropdownClasses=getDropdownClasses,exports.getGapClasses=getGapClasses,exports.getIconClasses=getIconClasses,exports.getIconRotateClasses=getIconRotateClasses,exports.getItemContainerClasses=getItemContainerClasses,exports.getLayoutIconClasses=getLayoutIconClasses,exports.getRenderChildrenClasses=getRenderChildrenClasses;

package/dist/cjs/accordion/common/helpers.js

@@ -0,0 +1 @@
+"use strict";var core=require("@gem-sdk/core");const MINIMUM_CHILD=1,BODY_CHILD_INDEX=0,ICON_MINUS="<svg width='16' height='16' fill='currentColor' viewBox=\"0 0 448 512\"><path fill='currentColor' d=\"M400 288h-352c-17.69 0-32-14.32-32-32.01s14.31-31.99 32-31.99h352c17.69 0 32 14.3 32 31.99S417.7 288 400 288z\"/></svg>",ICON_PLUS="<svg fill='currentColor' width='16' height='16' xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><path fill='currentColor' d=\"M432 256c0 17.69-14.33 32.01-32 32.01H256v144c0 17.69-14.33 31.99-32 31.99s-32-14.3-32-31.99v-144H48c-17.67 0-32-14.32-32-32.01s14.33-31.99 32-31.99H192v-144c0-17.69 14.33-32.01 32-32.01s32 14.32 32 32.01v144h144C417.7 224 432 238.3 432 256z\"/></svg>",getDataState=(t,e)=>{let{setting:r={},styles:o={},builderProps:a}=t,{activeKey:i,iconSvg:l,expandItem:s,iconPosition:n,iconCollapseSize:c,iconGlobalSize:g,iconExpand:S,iconCollapse:I,layoutHeader:p,expandedMode:m,configIconSize:u}=r,{bgColor:d,color:v,headerBorder:C,width:N,fullWidth:h,textColor:L,itemHeaderSpacing:_,contentSizePadding:M,iconColor:U,headerContentPadding:w,widthHeightSize:x}=o,D="multiple"===m,O=t=>t?t.toString().toLowerCase().split(",").map(t=>parseInt(t.trim())-1).map(t=>t.toString()):[],P=s?O(i):[],H=D?[...P]:P,y=()=>({iconSvg:l,isIconPlus:"plus"===l,activeKey:i,expanded:D,expandItem:s,iconPosition:n,iconGlobalSize:g,iconCollapse:I,iconExpand:S,iconCollapseSize:c,layoutHeader:p,expandedMode:m,configIconSize:u,parentUid:a?.uid,childListNumber:s?i?.toString().toLowerCase()==="all"?e?.map((t,e)=>e.toString()):H:[],chidlrenUid:e?.map(t=>t.uid)}),b=()=>({bgColor:d,color:v,headerBorder:C,fullWidth:h,width:N,itemHeaderSpacing:_,textColor:L,iconColor:U,contentSizePadding:M,headerContentPadding:w,widthHeightSize:x});return{uidState:a?.uid,settingState:y(),stylesState:b(),accordions:H}},getParentSettings=(t={})=>{let{iconSvg:e,titleTypo:r,layoutHeader:o,iconGlobalSize:a,iconCollapseSize:i,iconCollapse:l,iconExpand:s,alignment:n,configIconSize:c,iconPosition:g}=t,S=r?{...r,attrs:{...r.attrs}}:void 0;return S?.attrs?.color&&delete S.attrs.color,{iconSvg:e,titleTypo:S,layoutHeader:o,iconGlobalSize:a,iconCollapseSize:i,iconCollapse:l,iconExpand:s,alignment:n,configIconSize:c,iconPosition:g}},composeIconSvg=({isShow:t,iconExpand:e,iconCollapse:r,iconSvg:o})=>e&&t?e:r&&!t?r:"plus"===o?t?ICON_MINUS:ICON_PLUS:o,getSettingItemLiquid=t=>{let{index:e,accordions:r,parentSetting:o,parentStyle:a}=t,{titleTypo:i,iconCollapse:l,iconExpand:s,activeKey:n,expandItem:c,iconSvg:g}=o??{};delete i?.attrs?.color;let{itemContentSpacing:S,iconColor:I,contentSizePadding:p}=a??{},m=!!c&&(n?.toString()?.toLowerCase()==="all"||r?.includes(e?.toString()??"")),u=core.makeGlobalSize(p),d=()=>{let t={...p&&u.padding,...S?.type||p?{}:core.composeSize(S?.custom)};return m?t:core.removePaddingYInStyle(t)},v=composeIconSvg({isShow:m,iconExpand:s,iconCollapse:l,iconSvg:g}),C=()=>{let t={normal:I?.normal??"transparent",hover:I?.hover??I?.active??I?.normal??"transparent",active:I?.active??"transparent"};return m?core.makeStyle({c:core.getSingleColorVariable(t?.active)}):core.getGlobalColorStateStyle("c",t)};return{isShow:m,composeContentSizeStyle:d,collapsibleIcon:v,composeIconColor:C(),makeIcon:v}};exports.BODY_CHILD_INDEX=0,exports.ICON_MINUS=ICON_MINUS,exports.ICON_PLUS=ICON_PLUS,exports.MINIMUM_CHILD=1,exports.composeIconSvg=composeIconSvg,exports.getDataState=getDataState,exports.getParentSettings=getParentSettings,exports.getSettingItemLiquid=getSettingItemLiquid;

package/dist/cjs/accordion/common/styles.js

@@ -0,0 +1 @@
+"use strict";var core=require("@gem-sdk/core");const filterStyles=e=>{let o=["--mb","--mb-mobile","--mb-tablet","--d","--d-mobile","--d-tablet"];return o.forEach(o=>{delete e?.[o]}),e},contentSizePaddingSize=e=>core.makeGlobalSize(e?.contentSizePadding),getContainerStyles=(e,o)=>({...filterStyles(e),...contentSizePaddingSize(o).gap,...core.getStyleBackgroundByDevice(e?.backgroundContent),"border-radius":"inherit"}),widthHeightSizeControl=e=>core.makeGlobalSize(e),widthStyle=(e,o,t)=>widthHeightSizeControl(t).width["--w"]?widthHeightSizeControl(t).width:core.makeStyleResponsive("w",core.makeWidth(e,o)),getItemContainerStyles=(e,o)=>{let{borderContent:t,backgroundContent:r,roundedContent:l,accordionShadow:a,width:i,fullWidth:n,widthHeightSize:c,iconColor:g,color:S,textColor:d,hasActiveShadow:s}=e??{};return{"--text-hover-color":o?core.getSingleColorVariable(d?.active??d?.normal):core.getSingleColorVariable(d?.hover??d?.normal),"--icon-expand-hover-color":o?core.getSingleColorVariable(S?.active??S?.normal):core.getSingleColorVariable(S?.hover??S?.normal),"--icon-expand-active-color":core.getSingleColorVariable(S?.active??S?.normal),"--icon-active-color":core.getSingleColorVariable(g?.active??g?.normal),"--icon-hover-color":o?core.getSingleColorVariable(g?.active??g?.normal):core.getSingleColorVariable(g?.hover??g?.normal),...widthStyle(i,n,c),...core.makeStyle({bs:t?.border??t?.border,bw:t?.width??t?.width,bc:core.getSingleColorVariable(t?.color??t?.color)}),...core.makeStyleResponsive("bg",r),...core.getStyleShadow({value:a,styleAppliedFor:"box-shadow",isEnableShadow:a?.enable||s}),...core.getRadiusStyleActiveState({...l,active:{...l||{},radiusType:"custom"}})}},headerContentPaddingSize=e=>core.makeGlobalSize(e),composePosition=e=>core.makeStyle({fd:"left"===e?"row":"row-reverse",jc:"right"===e?"space-between":""}),getDropdownStyles=(e,o)=>{let{headerContentPadding:t,widthHeightSize:r,itemHeaderSpacing:l,bgColor:a,headerBorder:i}=e??{},{isShow:n,iconPosition:c}=o??{};return{...t&&headerContentPaddingSize(t).padding,...l?.type||t?{}:core.composeSize(l?.custom),...widthHeightSizeControl(r).height,...composePosition(c),...n?core.makeStyle({bgc:core.getSingleColorVariable(a?.active??a?.normal),bs:i?.active?.border??i?.normal?.border,bw:i?.active?.width??i?.normal?.width,bc:core.getSingleColorVariable(i?.active?.color??i?.normal?.color)}):{...core.getGlobalColorStateStyle("bgc",a),...core.handleConvertBorderStyle(i),...core.handleConvertBorderWidth(i),...core.handleConvertBorderColor(i),...core.getGlobalColorStateStyle("bgc",a)}}},getDropdownTextStyles=(e,o)=>({...o?core.makeStyle({c:core.getSingleColorVariable(e?.active??e?.normal)}):core.makeStyle({c:core.getSingleColorVariable(e?.normal)})}),getIconRotateStyles=(e,o,t)=>{let{color:r}=e??{};return{...core.makeStyle({c:core.getSingleColorVariable(o?r?.active??r?.normal??"transparent":r?.normal??"transparent")}),width:`${t??16}px`,height:`${t??16}px`}},composeIconGlobalSize=e=>core.makeGlobalSize(e),getGapStyles=(e,o)=>({...composeIconGlobalSize(e).gap,...core.makeStyleResponsive("jc",o)}),getIconStyles=(e,o)=>{let t=o?`${o}px`:"16px";return{...e,width:t,height:t,"--height":t}},getTemplateRow=e=>({"grid-template-rows":`${+!!e}fr`}),getRenderChildrenStyles=()=>({"grid-template-columns":"minmax(auto, 100%)"}),getIconGlobalSize=e=>core.makeGlobalSize(e)?.padding;exports.getContainerStyles=getContainerStyles,exports.getDropdownStyles=getDropdownStyles,exports.getDropdownTextStyles=getDropdownTextStyles,exports.getGapStyles=getGapStyles,exports.getIconGlobalSize=getIconGlobalSize,exports.getIconRotateStyles=getIconRotateStyles,exports.getIconStyles=getIconStyles,exports.getItemContainerStyles=getItemContainerStyles,exports.getRenderChildrenStyles=getRenderChildrenStyles,exports.getTemplateRow=getTemplateRow;

package/dist/cjs/accordion/components/Accordion.js

@@ -1,195 +1,2 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var core = require('@gem-sdk/core');
-
-const Accordion = ({ builderProps, builderAttrs, style, children, setting, styles })=>{
-    const { align } = styles ?? {};
-    const currentAccordions = React.useRef([]);
-    const { childItem, activeKey, expandItem, expandedMode } = setting ?? {};
-    const [accordions, setAccordions] = React.useState([]);
-    const contentSizePaddingSize = core.makeGlobalSize(styles?.contentSizePadding);
-    const mode = core.useEditorMode();
-    const { onListener, saveToElementInteractionData, ref, findElementIncludingSelf } = core.useInteraction();
-    const expanded = React.useMemo(()=>{
-        return expandedMode === 'multiple' ? true : expandedMode !== 'single';
-    }, [
-        expandedMode
-    ]);
-    React.useEffect(()=>{
-        if (!expanded && !activeKey) {
-            currentAccordions.current = [
-                '0'
-            ];
-            setAccordions([
-                '0'
-            ]);
-        }
-        if (!activeKey) {
-            currentAccordions.current = [];
-            setAccordions([]);
-        }
-    }, [
-        expanded,
-        activeKey
-    ]);
-    React.useEffect(()=>{
-        if (!expandItem) {
-            currentAccordions.current = [];
-            setAccordions([]);
-        }
-    }, [
-        expandItem
-    ]);
-    React.useEffect(()=>{
-        if (activeKey && expandItem) {
-            const composeActiveKeys = activeKey?.toString()?.toLowerCase()?.split(',')?.map((item)=>parseInt(item.trim()) - 1)?.map((item)=>item.toString());
-            setAccordions(composeActiveKeys);
-            currentAccordions.current = composeActiveKeys;
-        }
-    }, [
-        activeKey,
-        expandItem
-    ]);
-    React.useEffect(()=>{
-        if (!expandItem) {
-            setAccordions([]);
-            currentAccordions.current = [];
-        }
-        if (activeKey?.toString()?.toLowerCase() === 'all' && expandItem) {
-            const list = Array.from(React.Children?.map(children, (_, index)=>index.toString()));
-            setAccordions(list);
-            currentAccordions.current = list;
-        }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        activeKey,
-        expandItem
-    ]);
-    const setActive = (id)=>{
-        if (accordions.includes(id)) {
-            setAccordions([]);
-            currentAccordions.current = [];
-        } else {
-            setAccordions([
-                id
-            ]);
-            currentAccordions.current = [
-                id
-            ];
-        }
-    };
-    const setToggle = (id)=>{
-        let newActive = [];
-        if (accordions.includes(id)) {
-            newActive = accordions.filter((accordion)=>accordion !== id);
-        } else {
-            newActive = [
-                ...accordions,
-                id
-            ];
-        }
-        setAccordions(newActive);
-        currentAccordions.current = newActive;
-    };
-    const handleDropdown = (id)=>{
-        expanded ? setToggle(id.toString()) : setActive(id.toString());
-    };
-    const filterStyles = React.useMemo(()=>{
-        const delList = [
-            '--mb',
-            '--mb-mobile',
-            '--mb-tablet',
-            '--d',
-            '--d-mobile',
-            '--d-tablet'
-        ];
-        delList.forEach((element)=>{
-            delete style?.[element];
-        });
-        return style;
-    }, [
-        style
-    ]);
-    React.useEffect(()=>{
-        const selector = `[data-id="${builderProps?.uid}"]`;
-        onListener({
-            event: 'gp:change-expanded-item-original',
-            selector
-        }, (params)=>{
-            const element = findElementIncludingSelf(ref.current || document, selector);
-            const { data, isRollback, key } = params || {};
-            if (data === undefined && isRollback) return;
-            if (isRollback) {
-                setAccordions(data);
-                return;
-            }
-            let interactionAccordion = [
-                ...currentAccordions.current
-            ];
-            saveToElementInteractionData(element, key, JSON.stringify({
-                data: interactionAccordion
-            }));
-            const id = data.toString();
-            if (expanded) {
-                interactionAccordion = [
-                    ...interactionAccordion.filter((accordion)=>accordion !== id),
-                    id
-                ];
-            } else {
-                interactionAccordion = [
-                    id
-                ];
-            }
-            setAccordions(interactionAccordion);
-        });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    React.useEffect(()=>{
-        currentAccordions.current = accordions;
-    }, [
-        accordions
-    ]);
-    return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        ...builderAttrs,
-        ref: ref,
-        "data-id": builderProps?.uid,
-        className: core.cls('gp-flex gp-flex-col ', {
-            'gp-px-[1px]': mode === 'edit'
-        }),
-        style: {
-            ...filterStyles,
-            ...contentSizePaddingSize.gap,
-            ...core.getStyleBackgroundByDevice(style?.backgroundContent),
-            borderRadius: 'inherit'
-        },
-        children: React.Children.map(children, (child, index)=>{
-            if (/*#__PURE__*/ React.isValidElement(child)) {
-                return /*#__PURE__*/ jsxRuntime.jsx("div", {
-                    className: "gp-flex",
-                    style: {
-                        ...core.makeStyleResponsive('jc', align)
-                    },
-                    children: /*#__PURE__*/ jsxRuntime.jsx(child.type, {
-                        ...child.props,
-                        index: index,
-                        title: childItem?.[index],
-                        accordions: accordions,
-                        handleDropDown: handleDropdown,
-                        parentSetting: setting,
-                        parentStyle: styles,
-                        activeKey: activeKey,
-                        childrenIcon: setting?.childConfig?.[index],
-                        parentUid: builderProps?.uid
-                    })
-                });
-            }
-            return child;
-        })
-    });
-};
-
-exports.default = Accordion;
+'use client';
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),core=require("@gem-sdk/core"),system=require("@gem-sdk/system"),styles=require("../common/styles.js"),useAccordion=require("../hooks/useAccordion.js"),classes=require("../common/classes.js");const Accordion=({builderProps:e,builderAttrs:s,style:t,children:r,setting:c,styles:i,advanced:a})=>{let{align:l}=i??{},{childItem:n}=c??{},{ref:o,mode:d,accordions:u,handleDropdown:m,activeKey:y}=useAccordion.default({setting:c,children:r,builderProps:e}),p=system.createStyle({...styles.getContainerStyles(t,i)}),j=system.createClass(classes.getContainerClasses(a?.cssClass,d)),x=system.createAttr({...s,"data-id":e?.uid??""}),R=system.createStyle({...core.makeStyleResponsive("jc",l)}),C=system.createClass({"gp-flex":!0}),f=React.useMemo(()=>React.Children.map(r,(s,t)=>{if(!React.isValidElement(s))return s;let r={...s.props,index:t,title:n?.[t],accordions:u,handleDropDown:m,parentSetting:c,parentStyle:i,activeKey:y,childrenIcon:c?.childConfig?.[t],parentUid:e?.uid};return jsxRuntime.jsx("div",{className:C,style:R,children:React.cloneElement(s,r)})}),[u,y,e?.uid,n,r,C,R,m,c,i]);return jsxRuntime.jsx("div",{...x,ref:o,className:j,style:p,children:f})};exports.default=Accordion;

package/dist/cjs/accordion/components/Accordion.liquid.js

@@ -1,113 +1,17 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var core = require('@gem-sdk/core');
-var helpers = require('../../helpers.js');
-
-const Accordion = ({ rawChildren, setting, styles, builderProps, pageContext, advanced })=>{
-    const { childItem, activeKey, iconSvg, expandItem, iconPosition, iconCollapseSize, iconGlobalSize, iconExpand, iconCollapse, layoutHeader, expandedMode, configIconSize, translate } = setting ?? {};
-    const { align, bgColor, color, headerBorder, width, fullWidth, textColor, itemHeaderSpacing, contentSizePadding, iconColor, headerContentPadding, widthHeightSize, backgroundContent } = styles ?? {};
-    const contentSizePaddingSize = core.makeGlobalSize(styles?.contentSizePadding);
-    let accordions = [];
-    let activeIndex = [
-        '0'
-    ];
-    if (!expandItem) {
-        activeIndex = [];
-    } else if (activeKey) {
-        const composeActiveKeys = activeKey.toString().toLowerCase().split(',').map((item)=>parseInt(item.trim()) - 1).map((item)=>item.toString());
-        activeIndex = composeActiveKeys;
-    }
-    const expanded = expandedMode === 'multiple' ? true : false;
-    if (expanded) {
-        accordions.push(...activeIndex);
-    } else {
-        accordions = activeIndex;
-    }
-    return core.template`
-    <gp-accordion
-      data-id="${builderProps?.uid}"
-     ${builderProps}
-      class="gp-flex gp-w-full gp-flex-col ${advanced?.cssClass}"
-      style="${{
-        ...contentSizePaddingSize.gap,
-        ...core.getStyleBackgroundByDevice(backgroundContent),
-        'border-radius': 'inherit'
-    }}"
-      gp-data='${JSON.stringify({
-        setting: {
-            iconSvg,
-            isIconPlus: iconSvg === 'plus',
-            activeKey,
-            expanded,
-            expandItem,
-            iconPosition,
-            iconGlobalSize,
-            iconCollapse,
-            iconExpand,
-            iconCollapseSize,
-            layoutHeader,
-            expandedMode,
-            configIconSize,
-            parentUid: builderProps?.uid,
-            childListNumber: expandItem ? activeKey?.toString()?.toLowerCase() === 'all' ? rawChildren?.map((item, index)=>index.toString()) : accordions : [],
-            chidlrenUid: rawChildren?.map((item)=>item.uid)
-        },
-        styles: {
-            bgColor,
-            color,
-            headerBorder,
-            fullWidth,
-            width,
-            itemHeaderSpacing,
-            textColor,
-            iconColor,
-            contentSizePadding,
-            headerContentPadding,
-            widthHeightSize
-        },
-        uid: builderProps?.uid
-    }).replaceAll("'", '&#039;')}'
-    >
-    <div class="gp-hidden gp-rotate-90 -gp-rotate-90 gp-rotate-180"></div>
-    ${core.WrapRenderChildren({
-        uid: builderProps?.uid || '',
-        customProps: rawChildren?.[0].customProps
-    }, rawChildren?.map((child, index)=>{
-        if (child) {
-            const title = helpers.getDynamicSourceLocales({
-                val: childItem?.[index],
-                uid: builderProps?.uid,
-                settingId: `childItem_${index}`,
-                pageContext,
-                isCapitalize: setting?.titleTypo?.attrs?.transform === 'capitalize',
-                translate
-            });
-            return core.template`<div
-                class="gp-flex"
-                style="${{
-                ...core.makeStyleResponsive('jc', align)
-            }}"
-              >
-                ${core.RenderChildren({
-                ...child,
-                index: index,
-                title: title,
-                accordions: accordions,
-                parentSetting: setting,
-                parentStyle: styles,
-                parentUid: builderProps?.uid,
-                childrenIcon: setting?.childConfig?.[index],
-                activeKey: activeKey
-            })}
-              </div>
-            `;
-        }
-    }))}
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),helpers$1=require("../../helpers.js"),system=require("@gem-sdk/system"),helpers=require("../common/helpers.js"),styles=require("../common/styles.js"),classes=require("../common/classes.js");const Accordion=({rawChildren:e,setting:s,styles:t,builderProps:r,pageContext:a,advanced:c,style:l,builderAttrs:i})=>{let{align:o}=t??{},{translate:d,childItem:n,activeKey:p}=s??{},{uidState:y,settingState:m,stylesState:g,accordions:u}=helpers.getDataState({setting:s,styles:t,builderProps:r},e),$=system.createStateOrContext({uid:y,setting:m,styles:{...g}}),S=system.createClass(classes.getContainerClasses(c?.cssClass)),h=system.createStyle({...styles.getContainerStyles(l,t)}),v=system.createAttr({...i,"data-id":r?.uid??""}),f=system.createStyle({...core.makeStyleResponsive("jc",o)}),C=system.createClass({"gp-flex":!0}),j=system.createClass(classes.extendClasses()),A=()=>core.WrapRenderChildren({uid:r?.uid??"",customProps:e?.[0].customProps},e?.map((e,c)=>{if(e){let l=helpers$1.getDynamicSourceLocales({val:n?.[c],uid:r?.uid,settingId:`childItem_${c}`,pageContext:a,isCapitalize:s?.titleTypo?.attrs?.transform==="capitalize",translate:d});return core.template`
+          <div class="${C}" style="${f}">
+            ${core.RenderChildren({...e,index:c,title:l,accordions:u,parentSetting:s,parentStyle:t,parentUid:r?.uid,childrenIcon:s?.childConfig?.[c],activeKey:p})}
+          </div>
+            `}})),q=()=>core.RenderIf(core.isLocalEnv,`
+    <script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="{{ 'gp-accordion-v7-5.js' | asset_url }}"
+      defer="defer"></script>`,`
+    <script ${helpers$1.getSettingPreloadData('class="gps-link" delay',"src")}="${core.baseAssetURL}/assets-v2/gp-accordion-v7-5.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>
+    `);return core.template`
+    <gp-accordion ${v} class="${S}" style="${h}"
+      gp-data='${JSON.stringify($).replaceAll("'","&#039;")}'
+        >
+        <div class=" ${j}"></div>
+      ${A()}
     </gp-accordion>
-    ${core.RenderIf(core.isLocalEnv, `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="{{ 'gp-accordion.js' | asset_url }}" defer="defer"></script>`, `<script ${helpers.getSettingPreloadData('class="gps-link" delay', 'src')}="${core.baseAssetURL}/assets-v2/gp-accordion.js?v={{ shop.metafields.GEMPAGES.ASSETS_VERSION }}" defer="defer"></script>`)}
-  `;
-};
-
-exports.default = Accordion;
+    ${q()}
+  `};exports.default=Accordion;