@pitcher/canvas-ui 2026.1.15-103854-beta → 2026.1.15-141335-beta

package/canvas-ui.css

@@ -2667,7 +2667,7 @@ to {
   padding: 0;
 }
 
-.data-accessor-input[data-v-a4296e5c] .n-input__prefix {
+.data-accessor-input[data-v-dce6a881] .n-input__prefix {
   margin-right: 0;
 }
 .cb-dynamic-data-table-settings {

package/canvas-ui.js

@@ -84630,10 +84630,6 @@ const defaultWhenUsedInSection = {
   is_editable: false,
   is_removable: false
 };
-const defaultWhenUsedInTemplate = {
-  is_editable: true,
-  is_removable: true
-};
 const SERVER_ONLY_PROPS = [
   "content_url",
   "thumbnail_url",
@@ -137874,37 +137870,19 @@ function useComponentPermissions({
       isAnyTypeOfAdmin: false
     }))
   );
-  const launchDarkly = inject(
-    "launchDarkly",
-    computed(() => ({}))
-  );
-  const { canvasContent, activeCanvas } = useCanvas$1();
+  const { canvasContent } = useCanvas$1();
   return computed(() => {
-    if (usedInSectionId.value) {
-      const parent = findParentByNodeId(canvasContent.value, id.value);
-      const canRemove = !!when_used_in_section.value?.is_removable;
-      const canEdit = !!when_used_in_section.value?.is_editable;
-      const canDuplicate = parent ? !!parent.when_used_in_section?.is_editable : false;
-      return {
-        hasSomethingEditable: canEdit || canRemove || canDuplicate,
-        canRemove,
-        canEdit,
-        canDuplicate
-      };
-    }
-    const hasExplicitPermissions = when_used_in_section.value !== null && when_used_in_section.value !== void 0 && (when_used_in_section.value.is_editable !== void 0 || when_used_in_section.value.is_removable !== void 0);
-    if (activeCanvas.value?.template?.id && launchDarkly.value.enable_template_component_permissions && hasExplicitPermissions) {
-      const canRemove = !!when_used_in_section.value?.is_removable;
-      const canEdit = !!when_used_in_section.value?.is_editable;
-      const canDuplicate = canEdit;
-      return {
-        hasSomethingEditable: canEdit || canRemove || canDuplicate,
-        canRemove,
-        canEdit,
-        canDuplicate
-      };
-    }
-    return calculateCanvasPermissions(id.value, !!pitcherInfo.value?.isAnyTypeOfAdmin);
+    if (!usedInSectionId.value) return calculateCanvasPermissions(id.value, !!pitcherInfo.value?.isAnyTypeOfAdmin);
+    const parent = findParentByNodeId(canvasContent.value, id.value);
+    const canRemove = !!when_used_in_section.value?.is_removable;
+    const canEdit = !!when_used_in_section.value?.is_editable;
+    const canDuplicate = parent ? !!parent.when_used_in_section?.is_editable : false;
+    return {
+      hasSomethingEditable: canEdit || canRemove || canDuplicate,
+      canRemove,
+      canEdit,
+      canDuplicate
+    };
   });
 }
 
@@ -156881,9 +156859,7 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
     visible: {},
     allow_admins_to_overwrite: { type: Boolean },
     style: {},
-    printModeIdx: {},
-    when_used_in_section: {},
-    usedInSectionId: { default: "" }
+    printModeIdx: {}
   },
   emits: ["style"],
   setup(__props, { emit: __emit }) {
@@ -156898,42 +156874,12 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
       computed(() => [])
     );
     const { isCompletionWizardEnabled, retriggerWizard } = useCanvasCompletionWizard();
-    const {
-      isImpact,
-      mode,
-      isEditMode,
-      componentSelectedMode,
-      isViewOnlyMode,
-      componentEditMode,
-      componentNodesById,
-      activeCanvas,
-      saveCanvasContentWithContext,
-      removeComponentById,
-      setComponentSelectedMode,
-      setComponentSettingsMode,
-      updateNodeDataById,
-      canvasContent
-    } = useCanvas$1();
-    const { id, usedInSectionId, when_used_in_section } = toRefs(props);
-    const componentPermissions = useComponentPermissions({
-      id,
-      usedInSectionId,
-      when_used_in_section
-    });
-    const isEditable = computed(() => {
-      if (!componentPermissions.value.canEdit) return false;
-      if (isImpact.value) {
-        return !props.data.selection_strategy || props.data.selection_strategy === "free" || isCompletionWizardEnabled.value && wizardStepSectionListIds.value.includes(props.id);
-      }
-      return true;
-    });
-    const isRemovable = computed(() => {
-      if (!componentPermissions.value.canRemove) return false;
-      if (isImpact.value) {
-        return !props.data.selection_strategy || props.data.selection_strategy === "free";
-      }
-      return true;
-    });
+    const isEditable = computed(
+      () => isImpact.value ? !props.data.selection_strategy || props.data.selection_strategy === "free" || isCompletionWizardEnabled.value && wizardStepSectionListIds.value.includes(props.id) : true
+    );
+    const isRemovable = computed(
+      () => isImpact.value ? !props.data.selection_strategy || props.data.selection_strategy === "free" : true
+    );
     const sectionSelectorAppSrc = computed(() => {
       if (!sectionSelectorApps.value?.length || !props.data.selection_app_name) return null;
       const relatedApp = sectionSelectorApps.value.find((app) => app.app_metadata?.name === props.data.selection_app_name);
@@ -157000,7 +156946,7 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
           async (selectedData) => {
             console.info(`[SectionList]: Received done callback for ${props.id} with data`, selectedData);
             if (!selectedData) return;
-            const sections = (selectedData?.section_ids || []).map((id2) => ({ id: typeof id2 === "string" ? id2 : id2.id }));
+            const sections = (selectedData?.section_ids || []).map((id) => ({ id: typeof id === "string" ? id : id.id }));
             const updatedData = { ...props.data, sections };
             updateNodeDataById(props.id, updatedData);
             const currentContext = cloneDeep(activeCanvas.value?.context || {});
@@ -157026,6 +156972,22 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
         sectionListRef.value?.toggleSectionSelector();
       }
     }
+    const {
+      isImpact,
+      mode,
+      isEditMode,
+      componentSelectedMode,
+      isViewOnlyMode,
+      componentEditMode,
+      componentNodesById,
+      activeCanvas,
+      saveCanvasContentWithContext,
+      removeComponentById,
+      setComponentSelectedMode,
+      setComponentSettingsMode,
+      updateNodeDataById,
+      canvasContent
+    } = useCanvas$1();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
         unref(shouldDisplayPlaceholderComponent)(unref(isEditMode), unref(mode), _ctx.visible) ? (openBlock(), createBlock(PlaceholderComponent, {
@@ -157033,25 +156995,25 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
           name: _ctx.tracking_id
         }, null, 8, ["name"])) : unref(isEditMode) && !unref(isViewOnlyMode) ? (openBlock(), createBlock(_sfc_main$34, {
           key: 1,
-          id: unref(id),
-          active: unref(componentEditMode) && unref(componentEditMode)?.id === unref(id),
+          id: _ctx.id,
+          active: unref(componentEditMode) && unref(componentEditMode)?.id === _ctx.id,
           class: normalizeClass({ "mt-12": sectionListName.value }),
           edit: isEditable.value,
           "exclude-stylables": [unref(ThemeComponentOptionEnum).COLOR_PICKER],
           remove: isRemovable.value,
-          selected: unref(componentSelectedMode) && unref(componentSelectedMode)?.id === unref(id),
+          selected: unref(componentSelectedMode) && unref(componentSelectedMode)?.id === _ctx.id,
           settings: "",
           stylable: "",
           style: normalizeStyle(unref(omit$1)(_ctx.style, "paddingBottom", "paddingLeft", "paddingTop", "paddingRight")),
           onEdit: handleEdit,
-          onRemove: _cache[0] || (_cache[0] = ($event) => unref(removeComponentById)(unref(id))),
-          onSelect: _cache[1] || (_cache[1] = ($event) => unref(setComponentSelectedMode)(unref(id))),
-          onSettings: _cache[2] || (_cache[2] = ($event) => unref(setComponentSettingsMode)(unref(id))),
+          onRemove: _cache[0] || (_cache[0] = ($event) => unref(removeComponentById)(_ctx.id)),
+          onSelect: _cache[1] || (_cache[1] = ($event) => unref(setComponentSelectedMode)(_ctx.id)),
+          onSettings: _cache[2] || (_cache[2] = ($event) => unref(setComponentSettingsMode)(_ctx.id)),
           onStyle: _cache[3] || (_cache[3] = ($event) => emit("style", $event))
         }, {
           default: withCtx(() => [
             createVNode(RawSectionList, mergeProps({
-              id: unref(id),
+              id: _ctx.id,
               ref_key: "sectionListRef",
               ref: sectionListRef,
               class: "pa-2",
@@ -157069,7 +157031,7 @@ const _sfc_main$1P = /* @__PURE__ */ defineComponent({
           _: 1
         }, 8, ["id", "active", "class", "edit", "exclude-stylables", "remove", "selected", "style"])) : (openBlock(), createBlock(RawSectionList, mergeProps({
           key: 2,
-          id: unref(id),
+          id: _ctx.id,
           data: _ctx.data
         }, unref(attrs), {
           "has-section-selector-app": !!sectionSelectorAppSrc.value,
@@ -159597,8 +159559,7 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
     autofill: {},
     linkable: {},
     autofill_content_types: {},
-    when_used_in_section: {},
-    usedInSectionId: { default: "" }
+    when_used_in_section: {}
   },
   emits: ["style"],
   setup(__props, { emit: __emit }) {
@@ -159609,42 +159570,12 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
       computed(() => [])
     );
     const { isCompletionWizardEnabled, retriggerWizard } = useCanvasCompletionWizard();
-    const {
-      isImpact,
-      mode,
-      isEditMode,
-      componentSelectedMode,
-      isViewOnlyMode,
-      componentEditMode,
-      componentNodesById,
-      activeCanvas,
-      saveCanvasContentWithContext,
-      removeComponentById,
-      setComponentSelectedMode,
-      setComponentSettingsMode,
-      updateNodeDataById,
-      canvasContent
-    } = useCanvas$1();
-    const { id, usedInSectionId, when_used_in_section } = toRefs(props);
-    const componentPermissions = useComponentPermissions({
-      id,
-      usedInSectionId,
-      when_used_in_section
-    });
-    const isEditable = computed(() => {
-      if (!componentPermissions.value.canEdit) return false;
-      if (isImpact.value) {
-        return !props.data.selection_strategy || props.data.selection_strategy === "free" || isCompletionWizardEnabled.value && wizardStepSectionListIds.value.includes(props.id);
-      }
-      return true;
-    });
-    const isRemovable = computed(() => {
-      if (!componentPermissions.value.canRemove) return false;
-      if (isImpact.value) {
-        return !props.data.selection_strategy || props.data.selection_strategy === "free";
-      }
-      return true;
-    });
+    const isEditable = computed(
+      () => isImpact.value ? !props.data.selection_strategy || props.data.selection_strategy === "free" || isCompletionWizardEnabled.value && wizardStepSectionListIds.value.includes(props.id) : true
+    );
+    const isRemovable = computed(
+      () => isImpact.value ? !props.data.selection_strategy || props.data.selection_strategy === "free" : true
+    );
     const sectionSelectorAppSrc = computed(() => {
       if (!sectionSelectorApps.value?.length || !props.data.selection_app_name) return null;
       const relatedApp = sectionSelectorApps.value.find((app) => app.app_metadata?.name === props.data.selection_app_name);
@@ -159710,7 +159641,7 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
           async (selectedData) => {
             console.info(`[SectionList]: Received done callback for ${props.id} with data`, selectedData);
             if (!selectedData) return;
-            const sections = (selectedData?.section_ids || []).map((id2) => ({ id: typeof id2 === "string" ? id2 : id2.id }));
+            const sections = (selectedData?.section_ids || []).map((id) => ({ id: typeof id === "string" ? id : id.id }));
             const updatedData = { ...props.data, sections };
             updateNodeDataById(props.id, updatedData);
             const currentContext = cloneDeep(activeCanvas.value?.context || {});
@@ -159736,6 +159667,22 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
         contentListRef.value?.toggleSectionSelector();
       }
     }
+    const {
+      isImpact,
+      mode,
+      isEditMode,
+      componentSelectedMode,
+      isViewOnlyMode,
+      componentEditMode,
+      componentNodesById,
+      activeCanvas,
+      saveCanvasContentWithContext,
+      removeComponentById,
+      setComponentSelectedMode,
+      setComponentSettingsMode,
+      updateNodeDataById,
+      canvasContent
+    } = useCanvas$1();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
         unref(shouldDisplayPlaceholderComponent)(unref(isEditMode), unref(mode), _ctx.visible) ? (openBlock(), createBlock(PlaceholderComponent, {
@@ -159743,25 +159690,25 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
           name: _ctx.tracking_id
         }, null, 8, ["name"])) : unref(isEditMode) && !unref(isViewOnlyMode) ? (openBlock(), createBlock(_sfc_main$34, {
           key: 1,
-          id: unref(id),
-          active: unref(componentEditMode) && unref(componentEditMode)?.id === unref(id),
+          id: _ctx.id,
+          active: unref(componentEditMode) && unref(componentEditMode)?.id === _ctx.id,
           class: normalizeClass({ "mt-12": componentName.value }),
           edit: isEditable.value,
           "exclude-stylables": [unref(ThemeComponentOptionEnum).COLOR_PICKER],
           remove: isRemovable.value,
-          selected: unref(componentSelectedMode) && unref(componentSelectedMode)?.id === unref(id),
+          selected: unref(componentSelectedMode) && unref(componentSelectedMode)?.id === _ctx.id,
           settings: "",
           stylable: "",
           style: normalizeStyle(unref(omit$1)(_ctx.style, "paddingBottom", "paddingLeft", "paddingTop", "paddingRight")),
           onEdit: handleEdit,
-          onRemove: _cache[0] || (_cache[0] = ($event) => unref(removeComponentById)(unref(id))),
-          onSelect: _cache[1] || (_cache[1] = ($event) => unref(setComponentSelectedMode)(unref(id))),
-          onSettings: _cache[2] || (_cache[2] = ($event) => unref(setComponentSettingsMode)(unref(id))),
+          onRemove: _cache[0] || (_cache[0] = ($event) => unref(removeComponentById)(_ctx.id)),
+          onSelect: _cache[1] || (_cache[1] = ($event) => unref(setComponentSelectedMode)(_ctx.id)),
+          onSettings: _cache[2] || (_cache[2] = ($event) => unref(setComponentSettingsMode)(_ctx.id)),
           onStyle: _cache[3] || (_cache[3] = ($event) => emit("style", $event))
         }, {
           default: withCtx(() => [
             createVNode(ContentListRaw, mergeProps({
-              id: unref(id),
+              id: _ctx.id,
               ref_key: "contentListRef",
               ref: contentListRef,
               class: ["pa-2", props.class],
@@ -159779,7 +159726,7 @@ const _sfc_main$1H = /* @__PURE__ */ defineComponent({
           _: 1
         }, 8, ["id", "active", "class", "edit", "exclude-stylables", "remove", "selected", "style"])) : (openBlock(), createBlock(ContentListRaw, mergeProps({
           key: 2,
-          id: unref(id),
+          id: _ctx.id,
           data: _ctx.data
         }, unref(attrs), {
           "has-section-selector-app": !!sectionSelectorAppSrc.value,
@@ -162691,7 +162638,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
     );
     const areSectionsSystemControlled = computed(() => launchDarkly.value?.are_sections_system_controlled);
     const allowEditOrRemove = computed(
-      () => isAdmin.value && ((selectedComponentType.value === ComponentTypes.Text || selectedComponentType.value === ComponentTypes.Carousel || selectedComponentType.value === ComponentTypes.Multimedia) && isSection.value || launchDarkly.value.enable_template_component_permissions && isCanvasTemplate.value)
+      () => (selectedComponentType.value === ComponentTypes.Text || selectedComponentType.value === ComponentTypes.Carousel || selectedComponentType.value === ComponentTypes.Multimedia) && isAdmin.value && isSection.value
     );
     const canSelectSectionListStrategy = computed(
       () => isAdmin.value && isCanvasTemplate.value && isSectionOrContentList.value
@@ -162753,8 +162700,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
       formValues.contentGridDataAccessor = value || "";
     }
     function getEditOrRemoveOption() {
-      const defaultPermissions = isCanvasTemplate.value && launchDarkly.value.enable_template_component_permissions ? cloneDeep(defaultWhenUsedInTemplate) : cloneDeep(defaultWhenUsedInSection);
-      const map = activeSettingsNode.value?.when_used_in_section ?? defaultPermissions;
+      const map = activeSettingsNode.value?.when_used_in_section ?? cloneDeep(defaultWhenUsedInSection);
       let value = "";
       value += map.is_editable ? "1" : "0";
       value += map.is_removable ? "1" : "0";
@@ -163255,7 +163201,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
   }
 });
 
-const ComponentDrawerSettings = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["__scopeId", "data-v-a4296e5c"]]);
+const ComponentDrawerSettings = /* @__PURE__ */ _export_sfc(_sfc_main$1w, [["__scopeId", "data-v-dce6a881"]]);
 
 function useConnectUpload() {
   async function uploadToConnect(formData) {