@builder.io/sdk-qwik 0.14.21 → 0.14.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/browser/index.qwik.cjs +403 -38
- package/lib/browser/index.qwik.mjs +403 -38
- package/lib/edge/index.qwik.cjs +403 -38
- package/lib/edge/index.qwik.mjs +403 -38
- package/lib/node/index.qwik.cjs +403 -38
- package/lib/node/index.qwik.mjs +403 -38
- package/package.json +1 -1
- package/types/src/blocks/accordion/accordion.d.ts +6 -0
- package/types/src/blocks/accordion/accordion.types.d.ts +12 -0
- package/types/src/blocks/accordion/component-info.d.ts +2 -0
- package/types/src/blocks/accordion/helpers.d.ts +1 -0
- package/types/src/blocks/accordion/index.d.ts +1 -0
- package/types/src/blocks/tabs/tabs.d.ts +1 -1
- package/types/src/components/block/animator.d.ts +0 -1
- package/types/src/components/content-variants/content-variants.types.d.ts +1 -1
- package/types/src/constants/sdk-version.d.ts +1 -1
- package/types/src/functions/camel-to-kebab-case.d.ts +1 -1
package/lib/node/index.qwik.mjs
CHANGED
|
@@ -497,6 +497,7 @@ function getProcessedBlock({ block, context, shouldEvaluateBindings, localState,
|
|
|
497
497
|
else
|
|
498
498
|
return transformedBlock;
|
|
499
499
|
}
|
|
500
|
+
const camelToKebabCase = (str) => str ? str.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase() : "";
|
|
500
501
|
function throttle(func, wait, options = {}) {
|
|
501
502
|
let context;
|
|
502
503
|
let args;
|
|
@@ -543,7 +544,6 @@ function assign(target, ..._args) {
|
|
|
543
544
|
}
|
|
544
545
|
return to;
|
|
545
546
|
}
|
|
546
|
-
const camelCaseToKebabCase = (str) => str ? str.replace(/([A-Z])/g, (g) => `-${g[0].toLowerCase()}`) : "";
|
|
547
547
|
function bindAnimations(animations) {
|
|
548
548
|
for (const animation of animations)
|
|
549
549
|
switch (animation.trigger) {
|
|
@@ -594,7 +594,7 @@ function triggerAnimation(animation) {
|
|
|
594
594
|
element.style.transitionDelay = "0";
|
|
595
595
|
assign(element.style, animation.steps[0].styles);
|
|
596
596
|
setTimeout(() => {
|
|
597
|
-
element.style.transition = `all ${animation.duration}s ${
|
|
597
|
+
element.style.transition = `all ${animation.duration}s ${camelToKebabCase(animation.easing)}`;
|
|
598
598
|
if (animation.delay)
|
|
599
599
|
element.style.transitionDelay = animation.delay + "s";
|
|
600
600
|
assign(element.style, animation.steps[1].styles);
|
|
@@ -652,7 +652,7 @@ function bindScrollInViewAnimation(animation) {
|
|
|
652
652
|
}
|
|
653
653
|
attachDefaultState();
|
|
654
654
|
setTimeout(() => {
|
|
655
|
-
element.style.transition = `all ${animation.duration}s ${
|
|
655
|
+
element.style.transition = `all ${animation.duration}s ${camelToKebabCase(animation.easing)}`;
|
|
656
656
|
if (animation.delay)
|
|
657
657
|
element.style.transitionDelay = animation.delay + "s";
|
|
658
658
|
});
|
|
@@ -663,7 +663,6 @@ function bindScrollInViewAnimation(animation) {
|
|
|
663
663
|
immediateOnScroll();
|
|
664
664
|
});
|
|
665
665
|
}
|
|
666
|
-
const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
|
|
667
666
|
const convertStyleMapToCSSArray = (style) => {
|
|
668
667
|
const cssProps = Object.entries(style).map(([key, value]) => {
|
|
669
668
|
if (typeof value === "string")
|
|
@@ -767,7 +766,8 @@ const shouldPassLinkComponent = (block) => {
|
|
|
767
766
|
"Symbol",
|
|
768
767
|
"Columns",
|
|
769
768
|
"Form:Form",
|
|
770
|
-
"Builder: Tabs"
|
|
769
|
+
"Builder: Tabs",
|
|
770
|
+
"Builder:Accordion"
|
|
771
771
|
].includes(block.name));
|
|
772
772
|
};
|
|
773
773
|
const shouldPassRegisteredComponents = (block) => {
|
|
@@ -775,7 +775,8 @@ const shouldPassRegisteredComponents = (block) => {
|
|
|
775
775
|
"Symbol",
|
|
776
776
|
"Columns",
|
|
777
777
|
"Form:Form",
|
|
778
|
-
"Builder: Tabs"
|
|
778
|
+
"Builder: Tabs",
|
|
779
|
+
"Builder:Accordion"
|
|
779
780
|
].includes(block.name));
|
|
780
781
|
};
|
|
781
782
|
const SIZES = {
|
|
@@ -893,7 +894,7 @@ const BlockStyles = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pro
|
|
|
893
894
|
className: `${className}:hover`,
|
|
894
895
|
styles: {
|
|
895
896
|
...hoverStyles,
|
|
896
|
-
transition: `all ${hoverAnimation.duration}s ${
|
|
897
|
+
transition: `all ${hoverAnimation.duration}s ${camelToKebabCase(hoverAnimation.easing)}`,
|
|
897
898
|
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
898
899
|
}
|
|
899
900
|
}) || "";
|
|
@@ -1484,7 +1485,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
|
|
|
1484
1485
|
}, 1, "jN_4") : null
|
|
1485
1486
|
}, 1, "jN_5");
|
|
1486
1487
|
}, "Block_component_nnPv0RY0U0k"));
|
|
1487
|
-
const onClick$
|
|
1488
|
+
const onClick$3 = function onClick2(props, state, className) {
|
|
1488
1489
|
var _a, _b;
|
|
1489
1490
|
if (isEditing() && !((_a = props.blocks) == null ? void 0 : _a.length))
|
|
1490
1491
|
(_b = window.parent) == null ? void 0 : _b.postMessage({
|
|
@@ -1531,7 +1532,7 @@ const BlocksWrapper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((p
|
|
|
1531
1532
|
},
|
|
1532
1533
|
onClick$: /* @__PURE__ */ inlinedQrl((event) => {
|
|
1533
1534
|
const [className2, props2, state2] = useLexicalScope();
|
|
1534
|
-
return onClick$
|
|
1535
|
+
return onClick$3(props2);
|
|
1535
1536
|
}, "BlocksWrapper_component_onClick_ufezvOupQrM", [
|
|
1536
1537
|
className,
|
|
1537
1538
|
props,
|
|
@@ -1539,7 +1540,7 @@ const BlocksWrapper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((p
|
|
|
1539
1540
|
]),
|
|
1540
1541
|
onKeyPress$: /* @__PURE__ */ inlinedQrl((event) => {
|
|
1541
1542
|
const [className2, props2, state2] = useLexicalScope();
|
|
1542
|
-
return onClick$
|
|
1543
|
+
return onClick$3(props2);
|
|
1543
1544
|
}, "BlocksWrapper_component_onKeyPress_9bz8vCQc3kg", [
|
|
1544
1545
|
className,
|
|
1545
1546
|
props,
|
|
@@ -2214,7 +2215,7 @@ const handleABTesting = async ({ item, canTrack }) => {
|
|
|
2214
2215
|
};
|
|
2215
2216
|
};
|
|
2216
2217
|
const getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
|
|
2217
|
-
const componentInfo$
|
|
2218
|
+
const componentInfo$h = {
|
|
2218
2219
|
name: "Core:Button",
|
|
2219
2220
|
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
|
|
2220
2221
|
defaultStyles: {
|
|
@@ -2252,7 +2253,7 @@ const componentInfo$g = {
|
|
|
2252
2253
|
static: true,
|
|
2253
2254
|
noWrap: true
|
|
2254
2255
|
};
|
|
2255
|
-
const componentInfo$
|
|
2256
|
+
const componentInfo$g = {
|
|
2256
2257
|
// TODO: ways to statically preprocess JSON for references, functions, etc
|
|
2257
2258
|
name: "Columns",
|
|
2258
2259
|
isRSC: true,
|
|
@@ -2494,14 +2495,14 @@ const componentInfo$f = {
|
|
|
2494
2495
|
}
|
|
2495
2496
|
]
|
|
2496
2497
|
};
|
|
2497
|
-
const componentInfo$
|
|
2498
|
+
const componentInfo$f = {
|
|
2498
2499
|
name: "Fragment",
|
|
2499
2500
|
static: true,
|
|
2500
2501
|
hidden: true,
|
|
2501
2502
|
canHaveChildren: true,
|
|
2502
2503
|
noWrap: true
|
|
2503
2504
|
};
|
|
2504
|
-
const componentInfo$
|
|
2505
|
+
const componentInfo$e = {
|
|
2505
2506
|
name: "Image",
|
|
2506
2507
|
static: true,
|
|
2507
2508
|
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
|
|
@@ -2649,7 +2650,7 @@ const componentInfo$d = {
|
|
|
2649
2650
|
}
|
|
2650
2651
|
]
|
|
2651
2652
|
};
|
|
2652
|
-
const componentInfo$
|
|
2653
|
+
const componentInfo$d = {
|
|
2653
2654
|
name: "Core:Section",
|
|
2654
2655
|
static: true,
|
|
2655
2656
|
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
|
|
@@ -2694,7 +2695,7 @@ const componentInfo$c = {
|
|
|
2694
2695
|
}
|
|
2695
2696
|
]
|
|
2696
2697
|
};
|
|
2697
|
-
const componentInfo$
|
|
2698
|
+
const componentInfo$c = {
|
|
2698
2699
|
name: "Slot",
|
|
2699
2700
|
isRSC: true,
|
|
2700
2701
|
description: "Allow child blocks to be inserted into this content when used as a Symbol",
|
|
@@ -2749,7 +2750,7 @@ const Slot = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
|
|
|
2749
2750
|
}
|
|
2750
2751
|
}, 0, "B1_1");
|
|
2751
2752
|
}, "Slot_component_WWgWgfV0bb0"));
|
|
2752
|
-
const componentInfo$
|
|
2753
|
+
const componentInfo$b = {
|
|
2753
2754
|
name: "Symbol",
|
|
2754
2755
|
noWrap: true,
|
|
2755
2756
|
static: true,
|
|
@@ -2829,7 +2830,7 @@ const defaultElement = {
|
|
|
2829
2830
|
}
|
|
2830
2831
|
}
|
|
2831
2832
|
};
|
|
2832
|
-
const componentInfo$
|
|
2833
|
+
const componentInfo$a = {
|
|
2833
2834
|
name: "Builder: Tabs",
|
|
2834
2835
|
inputs: [
|
|
2835
2836
|
{
|
|
@@ -2960,8 +2961,11 @@ const componentInfo$9 = {
|
|
|
2960
2961
|
const activeTabContent = function activeTabContent2(props, state, active) {
|
|
2961
2962
|
return props.tabs && props.tabs[active].content;
|
|
2962
2963
|
};
|
|
2963
|
-
const
|
|
2964
|
-
|
|
2964
|
+
const onClick$2 = function onClick22(props, state, index) {
|
|
2965
|
+
if (index === state.activeTab && props.collapsible)
|
|
2966
|
+
state.activeTab = -1;
|
|
2967
|
+
else
|
|
2968
|
+
state.activeTab = index;
|
|
2965
2969
|
};
|
|
2966
2970
|
const Tabs = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
|
|
2967
2971
|
_jsxBranch();
|
|
@@ -2984,16 +2988,15 @@ const Tabs = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
|
|
|
2984
2988
|
class: `builder-tab-wrap ${state.activeTab === index ? "builder-tab-active" : ""}`,
|
|
2985
2989
|
onClick$: /* @__PURE__ */ inlinedQrl((event) => {
|
|
2986
2990
|
const [index2, props2, state2] = useLexicalScope();
|
|
2987
|
-
|
|
2988
|
-
state2.activeTab = -1;
|
|
2989
|
-
else
|
|
2990
|
-
state2.activeTab = index2;
|
|
2991
|
+
return onClick$2(props2, state2, index2);
|
|
2991
2992
|
}, "Tabs_component_div_div_span_onClick_hSTBabAHGks", [
|
|
2992
2993
|
index,
|
|
2993
2994
|
props,
|
|
2994
2995
|
state
|
|
2995
2996
|
]),
|
|
2996
|
-
style:
|
|
2997
|
+
style: {
|
|
2998
|
+
...state.activeTab === index ? props.activeTabStyle : {}
|
|
2999
|
+
}
|
|
2997
3000
|
}, null, /* @__PURE__ */ _jsxC(Blocks, {
|
|
2998
3001
|
get parent() {
|
|
2999
3002
|
return props.builderBlock.id;
|
|
@@ -3065,7 +3068,7 @@ const Tabs = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
|
|
|
3065
3068
|
}, 3, "6k_1"), 1, "6k_2") : null
|
|
3066
3069
|
], 1, "6k_3");
|
|
3067
3070
|
}, "Tabs_component_MhWcxXy0lMY"));
|
|
3068
|
-
const componentInfo$
|
|
3071
|
+
const componentInfo$9 = {
|
|
3069
3072
|
name: "Text",
|
|
3070
3073
|
static: true,
|
|
3071
3074
|
isRSC: true,
|
|
@@ -3100,6 +3103,364 @@ const Text = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
|
|
|
3100
3103
|
}
|
|
3101
3104
|
}, null, 3, "yO_0");
|
|
3102
3105
|
}, "Text_component_15p0cKUxgIE"));
|
|
3106
|
+
const convertOrderNumberToString = (order) => {
|
|
3107
|
+
return order.toString();
|
|
3108
|
+
};
|
|
3109
|
+
const getAccordionTitleClassName = function getAccordionTitleClassName2(props, state, onlyOneAtATime, accordionStyles, accordionTitleStyles, openGridItemOrder, accordionDetailStyles, index) {
|
|
3110
|
+
return `builder-accordion-title builder-accordion-title-${state.open.includes(index) ? "open" : "closed"}`;
|
|
3111
|
+
};
|
|
3112
|
+
const getAccordionDetailClassName = function getAccordionDetailClassName2(props, state, onlyOneAtATime, accordionStyles, accordionTitleStyles, openGridItemOrder, accordionDetailStyles, index) {
|
|
3113
|
+
return `builder-accordion-detail builder-accordion-detail-${state.open.includes(index) ? "open" : "closed"}`;
|
|
3114
|
+
};
|
|
3115
|
+
const onClick$1 = function onClick23(props, state, onlyOneAtATime, accordionStyles, accordionTitleStyles, openGridItemOrder, accordionDetailStyles, index) {
|
|
3116
|
+
if (state.open.includes(index))
|
|
3117
|
+
state.open = onlyOneAtATime.value ? [] : state.open.filter((item) => item !== index);
|
|
3118
|
+
else
|
|
3119
|
+
state.open = onlyOneAtATime.value ? [
|
|
3120
|
+
index
|
|
3121
|
+
] : state.open.concat(index);
|
|
3122
|
+
};
|
|
3123
|
+
const Accordion = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
|
|
3124
|
+
const state = useStore({
|
|
3125
|
+
open: []
|
|
3126
|
+
});
|
|
3127
|
+
const onlyOneAtATime = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
3128
|
+
const [props2] = useLexicalScope();
|
|
3129
|
+
return Boolean(props2.grid || props2.oneAtATime);
|
|
3130
|
+
}, "Accordion_component_onlyOneAtATime_useComputed_QYD7IoPU2HY", [
|
|
3131
|
+
props
|
|
3132
|
+
]));
|
|
3133
|
+
const accordionStyles = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
3134
|
+
const [props2] = useLexicalScope();
|
|
3135
|
+
const styles = {
|
|
3136
|
+
display: "flex",
|
|
3137
|
+
alignItems: "stretch",
|
|
3138
|
+
flexDirection: "column",
|
|
3139
|
+
...props2.grid && {
|
|
3140
|
+
flexDirection: "row",
|
|
3141
|
+
alignItems: "flex-start",
|
|
3142
|
+
flexWrap: "wrap"
|
|
3143
|
+
}
|
|
3144
|
+
};
|
|
3145
|
+
return styles;
|
|
3146
|
+
}, "Accordion_component_accordionStyles_useComputed_Jrd0cwGn25U", [
|
|
3147
|
+
props
|
|
3148
|
+
]));
|
|
3149
|
+
const accordionTitleStyles = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
3150
|
+
const shared = {
|
|
3151
|
+
display: "flex",
|
|
3152
|
+
flexDirection: "column"
|
|
3153
|
+
};
|
|
3154
|
+
const styles = {
|
|
3155
|
+
...shared,
|
|
3156
|
+
alignItems: "stretch",
|
|
3157
|
+
cursor: "pointer"
|
|
3158
|
+
};
|
|
3159
|
+
return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
|
|
3160
|
+
}, "Accordion_component_accordionTitleStyles_useComputed_FopdBMH0V6U"));
|
|
3161
|
+
const openGridItemOrder = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
3162
|
+
const [props2, state2] = useLexicalScope();
|
|
3163
|
+
let itemOrder = null;
|
|
3164
|
+
const getOpenGridItemPosition = props2.grid && state2.open.length;
|
|
3165
|
+
if (getOpenGridItemPosition && document) {
|
|
3166
|
+
const openItemIndex = state2.open[0];
|
|
3167
|
+
const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
|
|
3168
|
+
let subjectItem = openItem;
|
|
3169
|
+
itemOrder = openItemIndex;
|
|
3170
|
+
if (subjectItem) {
|
|
3171
|
+
let prevItemRect = subjectItem.getBoundingClientRect();
|
|
3172
|
+
while (subjectItem = subjectItem && subjectItem.nextElementSibling)
|
|
3173
|
+
if (subjectItem) {
|
|
3174
|
+
if (subjectItem.classList.contains("builder-accordion-detail"))
|
|
3175
|
+
continue;
|
|
3176
|
+
const subjectItemRect = subjectItem.getBoundingClientRect();
|
|
3177
|
+
if (subjectItemRect.left > prevItemRect.left) {
|
|
3178
|
+
const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
|
|
3179
|
+
if (!isNaN(index)) {
|
|
3180
|
+
prevItemRect = subjectItemRect;
|
|
3181
|
+
itemOrder = index;
|
|
3182
|
+
}
|
|
3183
|
+
} else
|
|
3184
|
+
break;
|
|
3185
|
+
}
|
|
3186
|
+
}
|
|
3187
|
+
}
|
|
3188
|
+
if (typeof itemOrder === "number")
|
|
3189
|
+
itemOrder = itemOrder + 1;
|
|
3190
|
+
return itemOrder;
|
|
3191
|
+
}, "Accordion_component_openGridItemOrder_useComputed_cCQY1Vnxll0", [
|
|
3192
|
+
props,
|
|
3193
|
+
state
|
|
3194
|
+
]));
|
|
3195
|
+
const accordionDetailStyles = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
3196
|
+
const [openGridItemOrder2, props2] = useLexicalScope();
|
|
3197
|
+
const styles = {
|
|
3198
|
+
order: typeof openGridItemOrder2.value === "number" ? openGridItemOrder2.value : void 0,
|
|
3199
|
+
...props2.grid && {
|
|
3200
|
+
width: "100%"
|
|
3201
|
+
}
|
|
3202
|
+
};
|
|
3203
|
+
return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
|
|
3204
|
+
}, "Accordion_component_accordionDetailStyles_useComputed_S0QmQzGJoRo", [
|
|
3205
|
+
openGridItemOrder,
|
|
3206
|
+
props
|
|
3207
|
+
]));
|
|
3208
|
+
return /* @__PURE__ */ _jsxQ("div", null, {
|
|
3209
|
+
class: "builder-accordion",
|
|
3210
|
+
style: _fnSignal((p0) => p0.value, [
|
|
3211
|
+
accordionStyles
|
|
3212
|
+
], "p0.value")
|
|
3213
|
+
}, (props.items || []).map((item, index) => {
|
|
3214
|
+
_jsxBranch();
|
|
3215
|
+
return /* @__PURE__ */ _jsxC(Fragment$1, {
|
|
3216
|
+
children: [
|
|
3217
|
+
/* @__PURE__ */ _jsxQ("div", {
|
|
3218
|
+
class: getAccordionTitleClassName(props, state, onlyOneAtATime, accordionStyles, accordionTitleStyles, openGridItemOrder, accordionDetailStyles, index),
|
|
3219
|
+
"data-index": index,
|
|
3220
|
+
onClick$: /* @__PURE__ */ inlinedQrl((event) => {
|
|
3221
|
+
const [accordionDetailStyles2, accordionStyles2, accordionTitleStyles2, index2, onlyOneAtATime2, openGridItemOrder2, props2, state2] = useLexicalScope();
|
|
3222
|
+
return onClick$1(props2, state2, onlyOneAtATime2, accordionStyles2, accordionTitleStyles2, openGridItemOrder2, accordionDetailStyles2, index2);
|
|
3223
|
+
}, "Accordion_component_div_Fragment_div_onClick_VtzhhJnK0XI", [
|
|
3224
|
+
accordionDetailStyles,
|
|
3225
|
+
accordionStyles,
|
|
3226
|
+
accordionTitleStyles,
|
|
3227
|
+
index,
|
|
3228
|
+
onlyOneAtATime,
|
|
3229
|
+
openGridItemOrder,
|
|
3230
|
+
props,
|
|
3231
|
+
state
|
|
3232
|
+
]),
|
|
3233
|
+
style: {
|
|
3234
|
+
...accordionTitleStyles.value,
|
|
3235
|
+
width: props.grid ? props.gridRowWidth : void 0,
|
|
3236
|
+
order: openGridItemOrder.value !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
|
|
3237
|
+
}
|
|
3238
|
+
}, null, /* @__PURE__ */ _jsxC(Blocks, {
|
|
3239
|
+
get blocks() {
|
|
3240
|
+
return item.title;
|
|
3241
|
+
},
|
|
3242
|
+
path: `items.${index}.title`,
|
|
3243
|
+
get parent() {
|
|
3244
|
+
return props.builderBlock.id;
|
|
3245
|
+
},
|
|
3246
|
+
get context() {
|
|
3247
|
+
return props.builderContext;
|
|
3248
|
+
},
|
|
3249
|
+
get registeredComponents() {
|
|
3250
|
+
return props.builderComponents;
|
|
3251
|
+
},
|
|
3252
|
+
get linkComponent() {
|
|
3253
|
+
return props.builderLinkComponent;
|
|
3254
|
+
},
|
|
3255
|
+
[_IMMUTABLE]: {
|
|
3256
|
+
blocks: _wrapProp(item, "title"),
|
|
3257
|
+
context: _fnSignal((p0) => p0.builderContext, [
|
|
3258
|
+
props
|
|
3259
|
+
], "p0.builderContext"),
|
|
3260
|
+
linkComponent: _fnSignal((p0) => p0.builderLinkComponent, [
|
|
3261
|
+
props
|
|
3262
|
+
], "p0.builderLinkComponent"),
|
|
3263
|
+
parent: _fnSignal((p0) => p0.builderBlock.id, [
|
|
3264
|
+
props
|
|
3265
|
+
], "p0.builderBlock.id"),
|
|
3266
|
+
registeredComponents: _fnSignal((p0) => p0.builderComponents, [
|
|
3267
|
+
props
|
|
3268
|
+
], "p0.builderComponents")
|
|
3269
|
+
}
|
|
3270
|
+
}, 3, "hf_0"), 0, null),
|
|
3271
|
+
state.open.includes(index) ? /* @__PURE__ */ _jsxQ("div", {
|
|
3272
|
+
class: getAccordionDetailClassName(props, state, onlyOneAtATime, accordionStyles, accordionTitleStyles, openGridItemOrder, accordionDetailStyles, index)
|
|
3273
|
+
}, {
|
|
3274
|
+
style: _fnSignal((p0) => p0.value, [
|
|
3275
|
+
accordionDetailStyles
|
|
3276
|
+
], "p0.value")
|
|
3277
|
+
}, /* @__PURE__ */ _jsxC(Blocks, {
|
|
3278
|
+
get blocks() {
|
|
3279
|
+
return item.detail;
|
|
3280
|
+
},
|
|
3281
|
+
path: `items.${index}.detail`,
|
|
3282
|
+
get parent() {
|
|
3283
|
+
return props.builderBlock.id;
|
|
3284
|
+
},
|
|
3285
|
+
get context() {
|
|
3286
|
+
return props.builderContext;
|
|
3287
|
+
},
|
|
3288
|
+
get registeredComponents() {
|
|
3289
|
+
return props.builderComponents;
|
|
3290
|
+
},
|
|
3291
|
+
get linkComponent() {
|
|
3292
|
+
return props.builderLinkComponent;
|
|
3293
|
+
},
|
|
3294
|
+
[_IMMUTABLE]: {
|
|
3295
|
+
blocks: _wrapProp(item, "detail"),
|
|
3296
|
+
context: _fnSignal((p0) => p0.builderContext, [
|
|
3297
|
+
props
|
|
3298
|
+
], "p0.builderContext"),
|
|
3299
|
+
linkComponent: _fnSignal((p0) => p0.builderLinkComponent, [
|
|
3300
|
+
props
|
|
3301
|
+
], "p0.builderLinkComponent"),
|
|
3302
|
+
parent: _fnSignal((p0) => p0.builderBlock.id, [
|
|
3303
|
+
props
|
|
3304
|
+
], "p0.builderBlock.id"),
|
|
3305
|
+
registeredComponents: _fnSignal((p0) => p0.builderComponents, [
|
|
3306
|
+
props
|
|
3307
|
+
], "p0.builderComponents")
|
|
3308
|
+
}
|
|
3309
|
+
}, 3, "hf_1"), 1, "hf_2") : null
|
|
3310
|
+
]
|
|
3311
|
+
}, 1, "hf_3");
|
|
3312
|
+
}), 1, "hf_4");
|
|
3313
|
+
}, "Accordion_component_jkuUCHm0nt0"));
|
|
3314
|
+
const defaultTitle = {
|
|
3315
|
+
"@type": "@builder.io/sdk:Element",
|
|
3316
|
+
layerName: "Accordion item title",
|
|
3317
|
+
responsiveStyles: {
|
|
3318
|
+
large: {
|
|
3319
|
+
marginTop: "10px",
|
|
3320
|
+
position: "relative",
|
|
3321
|
+
display: "flex",
|
|
3322
|
+
alignItems: "stretch",
|
|
3323
|
+
flexDirection: "column",
|
|
3324
|
+
paddingBottom: "10px"
|
|
3325
|
+
}
|
|
3326
|
+
},
|
|
3327
|
+
children: [
|
|
3328
|
+
{
|
|
3329
|
+
"@type": "@builder.io/sdk:Element",
|
|
3330
|
+
responsiveStyles: {
|
|
3331
|
+
large: {
|
|
3332
|
+
textAlign: "left",
|
|
3333
|
+
display: "flex",
|
|
3334
|
+
flexDirection: "column"
|
|
3335
|
+
}
|
|
3336
|
+
},
|
|
3337
|
+
component: {
|
|
3338
|
+
name: "Text",
|
|
3339
|
+
options: {
|
|
3340
|
+
text: "I am an accordion title. Click me!"
|
|
3341
|
+
}
|
|
3342
|
+
}
|
|
3343
|
+
}
|
|
3344
|
+
]
|
|
3345
|
+
};
|
|
3346
|
+
const defaultDetail = {
|
|
3347
|
+
"@type": "@builder.io/sdk:Element",
|
|
3348
|
+
layerName: "Accordion item detail",
|
|
3349
|
+
responsiveStyles: {
|
|
3350
|
+
large: {
|
|
3351
|
+
position: "relative",
|
|
3352
|
+
display: "flex",
|
|
3353
|
+
alignItems: "stretch",
|
|
3354
|
+
flexDirection: "column",
|
|
3355
|
+
marginTop: "10px",
|
|
3356
|
+
paddingBottom: "10px"
|
|
3357
|
+
}
|
|
3358
|
+
},
|
|
3359
|
+
children: [
|
|
3360
|
+
{
|
|
3361
|
+
"@type": "@builder.io/sdk:Element",
|
|
3362
|
+
responsiveStyles: {
|
|
3363
|
+
large: {
|
|
3364
|
+
paddingTop: "50px",
|
|
3365
|
+
textAlign: "left",
|
|
3366
|
+
display: "flex",
|
|
3367
|
+
flexDirection: "column",
|
|
3368
|
+
paddingBottom: "50px"
|
|
3369
|
+
}
|
|
3370
|
+
},
|
|
3371
|
+
component: {
|
|
3372
|
+
name: "Text",
|
|
3373
|
+
options: {
|
|
3374
|
+
text: "I am an accordion detail, hello!"
|
|
3375
|
+
}
|
|
3376
|
+
}
|
|
3377
|
+
}
|
|
3378
|
+
]
|
|
3379
|
+
};
|
|
3380
|
+
const componentInfo$8 = {
|
|
3381
|
+
name: "Builder:Accordion",
|
|
3382
|
+
canHaveChildren: true,
|
|
3383
|
+
image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
|
|
3384
|
+
defaultStyles: {
|
|
3385
|
+
display: "flex",
|
|
3386
|
+
flexDirection: "column",
|
|
3387
|
+
alignItems: "stretch"
|
|
3388
|
+
},
|
|
3389
|
+
inputs: [
|
|
3390
|
+
{
|
|
3391
|
+
name: "items",
|
|
3392
|
+
type: "list",
|
|
3393
|
+
broadcast: true,
|
|
3394
|
+
subFields: [
|
|
3395
|
+
{
|
|
3396
|
+
name: "title",
|
|
3397
|
+
type: "uiBlocks",
|
|
3398
|
+
hideFromUI: true,
|
|
3399
|
+
defaultValue: [
|
|
3400
|
+
defaultTitle
|
|
3401
|
+
]
|
|
3402
|
+
},
|
|
3403
|
+
{
|
|
3404
|
+
name: "detail",
|
|
3405
|
+
type: "uiBlocks",
|
|
3406
|
+
hideFromUI: true,
|
|
3407
|
+
defaultValue: [
|
|
3408
|
+
defaultDetail
|
|
3409
|
+
]
|
|
3410
|
+
}
|
|
3411
|
+
],
|
|
3412
|
+
defaultValue: [
|
|
3413
|
+
{
|
|
3414
|
+
title: [
|
|
3415
|
+
defaultTitle
|
|
3416
|
+
],
|
|
3417
|
+
detail: [
|
|
3418
|
+
defaultDetail
|
|
3419
|
+
]
|
|
3420
|
+
},
|
|
3421
|
+
{
|
|
3422
|
+
title: [
|
|
3423
|
+
defaultTitle
|
|
3424
|
+
],
|
|
3425
|
+
detail: [
|
|
3426
|
+
defaultDetail
|
|
3427
|
+
]
|
|
3428
|
+
}
|
|
3429
|
+
],
|
|
3430
|
+
showIf: (options) => !options.get("useChildrenForItems")
|
|
3431
|
+
},
|
|
3432
|
+
{
|
|
3433
|
+
name: "oneAtATime",
|
|
3434
|
+
helperText: "Only allow opening one at a time (collapse all others when new item openned)",
|
|
3435
|
+
type: "boolean",
|
|
3436
|
+
defaultValue: false
|
|
3437
|
+
},
|
|
3438
|
+
{
|
|
3439
|
+
name: "grid",
|
|
3440
|
+
helperText: "Display as a grid",
|
|
3441
|
+
type: "boolean",
|
|
3442
|
+
defaultValue: false
|
|
3443
|
+
},
|
|
3444
|
+
{
|
|
3445
|
+
name: "gridRowWidth",
|
|
3446
|
+
helperText: "Display as a grid",
|
|
3447
|
+
type: "string",
|
|
3448
|
+
showIf: (options) => options.get("grid"),
|
|
3449
|
+
defaultValue: "25%"
|
|
3450
|
+
},
|
|
3451
|
+
{
|
|
3452
|
+
name: "useChildrenForItems",
|
|
3453
|
+
type: "boolean",
|
|
3454
|
+
helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
|
|
3455
|
+
advanced: true,
|
|
3456
|
+
defaultValue: false,
|
|
3457
|
+
onChange: (options) => {
|
|
3458
|
+
if (options.get("useChildrenForItems") === true)
|
|
3459
|
+
options.set("items", []);
|
|
3460
|
+
}
|
|
3461
|
+
}
|
|
3462
|
+
]
|
|
3463
|
+
};
|
|
3103
3464
|
const componentInfo$7 = {
|
|
3104
3465
|
name: "Custom Code",
|
|
3105
3466
|
static: true,
|
|
@@ -4344,40 +4705,44 @@ const getExtraComponents = () => [
|
|
|
4344
4705
|
const getDefaultRegisteredComponents = () => [
|
|
4345
4706
|
{
|
|
4346
4707
|
component: Button,
|
|
4347
|
-
...componentInfo$
|
|
4708
|
+
...componentInfo$h
|
|
4348
4709
|
},
|
|
4349
4710
|
{
|
|
4350
4711
|
component: Columns,
|
|
4351
|
-
...componentInfo$
|
|
4712
|
+
...componentInfo$g
|
|
4352
4713
|
},
|
|
4353
4714
|
{
|
|
4354
4715
|
component: FragmentComponent,
|
|
4355
|
-
...componentInfo$
|
|
4716
|
+
...componentInfo$f
|
|
4356
4717
|
},
|
|
4357
4718
|
{
|
|
4358
4719
|
component: Image,
|
|
4359
|
-
...componentInfo$
|
|
4720
|
+
...componentInfo$e
|
|
4360
4721
|
},
|
|
4361
4722
|
{
|
|
4362
4723
|
component: SectionComponent,
|
|
4363
|
-
...componentInfo$
|
|
4724
|
+
...componentInfo$d
|
|
4364
4725
|
},
|
|
4365
4726
|
{
|
|
4366
4727
|
component: Slot,
|
|
4367
|
-
...componentInfo$
|
|
4728
|
+
...componentInfo$c
|
|
4368
4729
|
},
|
|
4369
4730
|
{
|
|
4370
4731
|
component: Symbol$1,
|
|
4371
|
-
...componentInfo$
|
|
4732
|
+
...componentInfo$b
|
|
4372
4733
|
},
|
|
4373
4734
|
{
|
|
4374
4735
|
component: Text,
|
|
4375
|
-
...componentInfo$
|
|
4736
|
+
...componentInfo$9
|
|
4376
4737
|
},
|
|
4377
4738
|
...[
|
|
4378
4739
|
{
|
|
4379
4740
|
component: Tabs,
|
|
4380
|
-
...componentInfo$
|
|
4741
|
+
...componentInfo$a
|
|
4742
|
+
},
|
|
4743
|
+
{
|
|
4744
|
+
component: Accordion,
|
|
4745
|
+
...componentInfo$8
|
|
4381
4746
|
}
|
|
4382
4747
|
],
|
|
4383
4748
|
...getExtraComponents()
|
|
@@ -4836,7 +5201,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4836
5201
|
const url = new URL(e.origin), hostname = url.hostname;
|
|
4837
5202
|
return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
|
|
4838
5203
|
}
|
|
4839
|
-
const SDK_VERSION = "0.14.
|
|
5204
|
+
const SDK_VERSION = "0.14.22";
|
|
4840
5205
|
const registry = {};
|
|
4841
5206
|
function register(type, info) {
|
|
4842
5207
|
let typeList = registry[type];
|
|
@@ -5157,7 +5522,7 @@ const evaluateJsCode = function evaluateJsCode2(props, state, showContentProps,
|
|
|
5157
5522
|
enableCache: false
|
|
5158
5523
|
});
|
|
5159
5524
|
};
|
|
5160
|
-
const onClick = function
|
|
5525
|
+
const onClick = function onClick24(props, state, showContentProps, elementRef, event) {
|
|
5161
5526
|
var _a, _b;
|
|
5162
5527
|
if (props.builderContextSignal.content) {
|
|
5163
5528
|
const variationId = (_a = props.builderContextSignal.content) == null ? void 0 : _a.testVariationId;
|
|
@@ -5316,7 +5681,7 @@ const EnableEditor = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((pr
|
|
|
5316
5681
|
useTaskQrl(/* @__PURE__ */ inlinedQrl(() => {
|
|
5317
5682
|
const [elementRef2, props2, showContentProps2, state2] = useLexicalScope();
|
|
5318
5683
|
if (!props2.apiKey)
|
|
5319
|
-
logger.error("No API key provided to `
|
|
5684
|
+
logger.error("No API key provided to `Content` component. This can cause issues. Please provide an API key using the `apiKey` prop.");
|
|
5320
5685
|
evaluateJsCode(props2);
|
|
5321
5686
|
runHttpRequests(props2, state2, showContentProps2, elementRef2);
|
|
5322
5687
|
emitStateUpdate(props2);
|
package/package.json
CHANGED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { AccordionProps } from "./accordion.types";
|
|
2
|
+
export declare const getAccordionTitleClassName: (props: any, state: any, onlyOneAtATime: any, accordionStyles: any, accordionTitleStyles: any, openGridItemOrder: any, accordionDetailStyles: any, index: number) => string;
|
|
3
|
+
export declare const getAccordionDetailClassName: (props: any, state: any, onlyOneAtATime: any, accordionStyles: any, accordionTitleStyles: any, openGridItemOrder: any, accordionDetailStyles: any, index: number) => string;
|
|
4
|
+
export declare const onClick: (props: any, state: any, onlyOneAtATime: any, accordionStyles: any, accordionTitleStyles: any, openGridItemOrder: any, accordionDetailStyles: any, index: number) => void;
|
|
5
|
+
export declare const Accordion: import("@builder.io/qwik").Component<AccordionProps>;
|
|
6
|
+
export default Accordion;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { BuilderBlock } from '../../types/builder-block';
|
|
2
|
+
import type { BuilderComponentsProp, BuilderDataProps, BuilderLinkComponentProp } from '../../types/builder-props';
|
|
3
|
+
export interface AccordionProps extends BuilderComponentsProp, BuilderLinkComponentProp, BuilderDataProps {
|
|
4
|
+
items: {
|
|
5
|
+
title: BuilderBlock[];
|
|
6
|
+
detail: BuilderBlock[];
|
|
7
|
+
}[];
|
|
8
|
+
oneAtATime?: boolean;
|
|
9
|
+
grid?: boolean;
|
|
10
|
+
gridRowWidth?: string;
|
|
11
|
+
useChildrenForItems?: boolean;
|
|
12
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const convertOrderNumberToString: (order: number) => string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './accordion.jsx';
|