@crediblemark/build 0.25.20 → 0.25.21

package/dist/{chunk-NHF3YLSF.mjs → chunk-5ASR74IZ.mjs}

@@ -13,11 +13,11 @@ import {
   renderContext,
   useRichtextProps,
   useSlots
-} from "./chunk-66IXS5FK.mjs";
+} from "./chunk-WADDTBOG.mjs";
 import {
   collisionStore,
   useSensors
-} from "./chunk-JR2TCNGX.mjs";
+} from "./chunk-QJ3POSBT.mjs";
 import {
   AutoFieldPrivate,
   Button,
@@ -25,11 +25,11 @@ import {
   fieldContextStore,
   useContextStore,
   useSafeId
-} from "./chunk-OYB2YQPY.mjs";
+} from "./chunk-N4PD57DO.mjs";
 import {
   IconButton,
   Loader
-} from "./chunk-QXPX7SNK.mjs";
+} from "./chunk-LGPNWN5U.mjs";
 import {
   Box,
   ChartColumn,
@@ -90,7 +90,7 @@ import {
   useRegisterHistorySlice,
   useRegisterPermissionsSlice,
   useResetAutoZoom
-} from "./chunk-KN26YZZJ.mjs";
+} from "./chunk-NFUQAIKA.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-BFHV72KK.mjs";
@@ -280,8 +280,13 @@ function Render({
   };
   const rootProps = "props" in defaultedData.root ? defaultedData.root.props : defaultedData.root;
   const title = rootProps?.title || "";
+  const renderContextValue = useMemo(() => ({
+    config,
+    data: defaultedData,
+    metadata
+  }), [config, defaultedData, metadata]);
   if (rootProps?.mode === "html") {
-    return /* @__PURE__ */ jsx2(renderContext.Provider, { value: { config, data: defaultedData, metadata }, children: /* @__PURE__ */ jsx2(HtmlModeRender, { htmlCode: rootProps.htmlCode, isEditing: false }) });
+    return /* @__PURE__ */ jsx2(renderContext.Provider, { value: renderContextValue, children: /* @__PURE__ */ jsx2(HtmlModeRender, { htmlCode: rootProps.htmlCode, isEditing: false }) });
   }
   const pageProps = {
     ...rootProps,
@@ -309,9 +314,9 @@ function Render({
     []
   );
   if (config.root?.render) {
-    return /* @__PURE__ */ jsx2(renderContext.Provider, { value: { config, data: defaultedData, metadata }, children: /* @__PURE__ */ jsx2(DropZoneProvider, { value: nextContextValue, children: /* @__PURE__ */ jsx2(config.root.render, { ...propsWithSlots, ...richtextProps, children: /* @__PURE__ */ jsx2(DropZoneRenderPure, { zone: rootZone }) }) }) });
+    return /* @__PURE__ */ jsx2(renderContext.Provider, { value: renderContextValue, children: /* @__PURE__ */ jsx2(DropZoneProvider, { value: nextContextValue, children: /* @__PURE__ */ jsx2(config.root.render, { ...propsWithSlots, ...richtextProps, children: /* @__PURE__ */ jsx2(DropZoneRenderPure, { zone: rootZone }) }) }) });
   }
-  return /* @__PURE__ */ jsx2(renderContext.Provider, { value: { config, data: defaultedData, metadata }, children: /* @__PURE__ */ jsx2(DropZoneProvider, { value: nextContextValue, children: /* @__PURE__ */ jsx2(DropZoneRenderPure, { zone: rootZone }) }) });
+  return /* @__PURE__ */ jsx2(renderContext.Provider, { value: renderContextValue, children: /* @__PURE__ */ jsx2(DropZoneProvider, { value: nextContextValue, children: /* @__PURE__ */ jsx2(DropZoneRenderPure, { zone: rootZone }) }) });
 }
 
 // lib/use-credbuild.ts
@@ -475,7 +480,7 @@ function useGetCredBuild() {
 // lib/use-component-list.tsx
 import { useEffect as useEffect4, useState as useState3 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/ComponentList/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/ComponentList/styles.module.css#css-module
 var styles_module_default = { "ComponentList": "_ComponentList_1dcib_1", "ComponentList--isExpanded": "_ComponentList--isExpanded_1dcib_5", "ComponentList-content": "_ComponentList-content_1dcib_9", "ComponentList-title": "_ComponentList-title_1dcib_17", "ComponentList-titleIcon": "_ComponentList-titleIcon_1dcib_53" };
 
 // components/ComponentList/index.tsx
@@ -649,7 +654,7 @@ var useComponentList = () => {
 // components/CredBuild/components/Components/index.tsx
 import { useMemo as useMemo2, useState as useState4 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Components/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Components/styles.module.css#css-module
 var styles_module_default2 = { "CredBuildComponents": "_CredBuildComponents_lxrzy_1", "CredBuildComponents-searchContainer": "_CredBuildComponents-searchContainer_lxrzy_7", "CredBuildComponents-searchWrapper": "_CredBuildComponents-searchWrapper_lxrzy_16", "CredBuildComponents-searchInput": "_CredBuildComponents-searchInput_lxrzy_23", "CredBuildComponents-searchIcon": "_CredBuildComponents-searchIcon_lxrzy_42", "CredBuildComponents-clearButton": "_CredBuildComponents-clearButton_lxrzy_54", "CredBuildComponents-listContainer": "_CredBuildComponents-listContainer_lxrzy_74", "CredBuildComponents-noResults": "_CredBuildComponents-noResults_lxrzy_79" };
 
 // components/CredBuild/components/Components/index.tsx
@@ -744,7 +749,7 @@ var Components = () => {
   ] });
 };
 
-// css-module:/home/runner/work/credbuild/credbuild/plugins/blocks/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/plugins/blocks/styles.module.css#css-module
 var styles_module_default3 = { "BlocksPlugin": "_BlocksPlugin_1q0b2_1" };
 
 // plugins/blocks/index.tsx
@@ -757,7 +762,7 @@ var blocksPlugin = () => ({
   icon: /* @__PURE__ */ jsx6(Shapes, {})
 });
 
-// css-module:/home/runner/work/credbuild/credbuild/components/LayerTree/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/LayerTree/styles.module.css#css-module
 var styles_module_default4 = { "LayerTree": "_LayerTree_nus40_1", "LayerTree-zoneTitle": "_LayerTree-zoneTitle_nus40_11", "LayerTree-helper": "_LayerTree-helper_nus40_17", "Layer": "_Layer_nus40_1", "Layer-inner": "_Layer-inner_nus40_29", "Layer--containsZone": "_Layer--containsZone_nus40_35", "Layer-clickable": "_Layer-clickable_nus40_39", "Layer--isSelected": "_Layer--isSelected_nus40_58", "Layer-chevron": "_Layer-chevron_nus40_79", "Layer--childIsSelected": "_Layer--childIsSelected_nus40_80", "Layer-zones": "_Layer-zones_nus40_84", "Layer-title": "_Layer-title_nus40_98", "Layer-name": "_Layer-name_nus40_107", "Layer-icon": "_Layer-icon_nus40_113", "Layer-zoneIcon": "_Layer-zoneIcon_nus40_118" };
 
 // components/LayerTree/index.tsx
@@ -768,7 +773,8 @@ import {
   useRef,
   memo as memo2,
   createContext as createContext2,
-  useState as useState5
+  useState as useState5,
+  useMemo as useMemo3
 } from "react";
 import { useVirtualizer } from "@tanstack/react-virtual";
 import { Fragment, jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
@@ -881,7 +887,7 @@ var Layer = memo2(forwardRef(function Layer2({
   selectedPathIds
 }, ref) {
   const dispatch = useAppStore((s) => s.dispatch);
-  const nodes = useAppStore((s) => s.state.indexes.nodes);
+  const appStoreApi = useAppStoreApi();
   const zoneStore = useContext2(ZoneStoreContext);
   const dragCtx = useContext2(DragContext);
   const isHovering = useContextStore(
@@ -934,7 +940,7 @@ var Layer = memo2(forwardRef(function Layer2({
       onDragOver: (e) => {
         e.preventDefault();
         if (!dragCtx || !dragCtx.draggedItem || dragCtx.draggedItem.itemId === node.itemId) return;
-        const targetNodeIndex = nodes[node.itemId];
+        const targetNodeIndex = appStoreApi.getState().state.indexes.nodes[node.itemId];
         if (targetNodeIndex?.path.some((p) => p.split(":")[0] === dragCtx.draggedItem?.itemId)) {
           return;
         }
@@ -1013,6 +1019,7 @@ var Layer = memo2(forwardRef(function Layer2({
           {
             type: "button",
             className: getClassNameLayer("clickable"),
+            "aria-expanded": containsZone ? shouldRenderChildren : void 0,
             onClick: () => {
               if (isSelected) {
                 setItemSelector(null);
@@ -1208,33 +1215,28 @@ var LayerTree = memo2(({
   const [draggedItem, setDraggedItem] = useState5(null);
   const [hoveredItemId, setHoveredItemId] = useState5(null);
   const [hoverPosition, setHoverPosition] = useState5(null);
-  return /* @__PURE__ */ jsx7(
-    DragContext.Provider,
+  const dragContextValue = useMemo3(() => ({
+    draggedItem,
+    setDraggedItem,
+    hoveredItemId,
+    setHoveredItemId,
+    hoverPosition,
+    setHoverPosition
+  }), [draggedItem, hoveredItemId, hoverPosition]);
+  return /* @__PURE__ */ jsx7(DragContext.Provider, { value: dragContextValue, children: trees.map((tree) => /* @__PURE__ */ jsx7(
+    LayerTreeZone,
     {
-      value: {
-        draggedItem,
-        setDraggedItem,
-        hoveredItemId,
-        setHoveredItemId,
-        hoverPosition,
-        setHoverPosition
-      },
-      children: trees.map((tree) => /* @__PURE__ */ jsx7(
-        LayerTreeZone,
-        {
-          depth: 0,
-          selectedId,
-          selectedPathIds,
-          tree
-        },
-        tree.zoneCompound
-      ))
-    }
-  );
+      depth: 0,
+      selectedId,
+      selectedPathIds,
+      tree
+    },
+    tree.zoneCompound
+  )) });
 });
 
 // components/CredBuild/components/Outline/index.tsx
-import { useMemo as useMemo3, memo as memo3 } from "react";
+import { useMemo as useMemo4, memo as memo3 } from "react";
 
 // lib/data/find-zones-for-area.ts
 var findZonesForArea = (state, area) => {
@@ -1255,13 +1257,13 @@ var Outline = memo3(() => {
   const rootZones = useAppStore(
     useShallow((s) => findZonesForArea(s.state, "root"))
   );
-  const selectedPathIds = useMemo3(() => {
-    const selectedPath = selectedId ? nodes[selectedId]?.path : null;
+  const selectedPath = selectedId ? nodes[selectedId]?.path : null;
+  const selectedPathIds = useMemo4(() => {
     return new Set(
       selectedPath?.map((candidate) => candidate.split(":")[0]).filter(Boolean) || []
     );
-  }, [nodes, selectedId]);
-  const trees = useMemo3(
+  }, [selectedPath]);
+  const trees = useMemo4(
     () => rootZones.map(
       (zoneCompound) => buildLayerTree({
         config,
@@ -1273,7 +1275,7 @@ var Outline = memo3(() => {
     ),
     [config, nodes, rootZones, zones]
   );
-  const Wrapper = useMemo3(() => outlineOverride || "div", [outlineOverride]);
+  const Wrapper = useMemo4(() => outlineOverride || "div", [outlineOverride]);
   return /* @__PURE__ */ jsx8(Wrapper, { children: /* @__PURE__ */ jsx8(
     LayerTree,
     {
@@ -1284,7 +1286,7 @@ var Outline = memo3(() => {
   ) });
 });
 
-// css-module:/home/runner/work/credbuild/credbuild/plugins/outline/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/plugins/outline/styles.module.css#css-module
 var styles_module_default5 = { "OutlinePlugin": "_OutlinePlugin_q92j6_1" };
 
 // plugins/outline/index.tsx
@@ -1297,17 +1299,17 @@ var outlinePlugin = () => ({
   icon: /* @__PURE__ */ jsx9(List, {})
 });
 
-// css-module:/home/runner/work/credbuild/credbuild/components/Breadcrumbs/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/Breadcrumbs/styles.module.css#css-module
 var styles_module_default6 = { "Breadcrumbs": "_Breadcrumbs_1e0gb_1", "Breadcrumbs-breadcrumbLabel": "_Breadcrumbs-breadcrumbLabel_1e0gb_7", "Breadcrumbs-breadcrumb": "_Breadcrumbs-breadcrumb_1e0gb_7" };
 
 // lib/use-breadcrumbs.ts
-import { useMemo as useMemo4 } from "react";
+import { useMemo as useMemo5 } from "react";
 var useBreadcrumbs = (renderCount) => {
   const selectedId = useAppStore((s) => s.selectedItem?.props.id);
   const config = useAppStore((s) => s.config);
   const path = useAppStore((s) => s.state.indexes.nodes[selectedId]?.path);
   const appStore = useAppStoreApi();
-  return useMemo4(() => {
+  return useMemo5(() => {
     const breadcrumbs = path?.map((zoneCompound) => {
       const [componentId] = zoneCompound.split(":");
       if (componentId === "root") {
@@ -1362,7 +1364,7 @@ var Breadcrumbs = ({
   ] });
 };
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Fields/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Fields/styles.module.css#css-module
 var styles_module_default7 = { "CredBuildFields": "_CredBuildFields_53gu7_1", "CredBuildFields--isLoading": "_CredBuildFields--isLoading_53gu7_6", "CredBuildFields-loadingOverlay": "_CredBuildFields-loadingOverlay_53gu7_10", "CredBuildFields-loadingOverlayInner": "_CredBuildFields-loadingOverlayInner_53gu7_25", "CredBuildFields-field": "_CredBuildFields-field_53gu7_32", "CredBuildFields--wrapFields": "_CredBuildFields--wrapFields_53gu7_36" };
 
 // components/CredBuild/components/Fields/index.tsx
@@ -1371,7 +1373,7 @@ import {
   useCallback as useCallback2,
   useContext as useContext3,
   useEffect as useEffect5,
-  useMemo as useMemo5
+  useMemo as useMemo6
 } from "react";
 import { useShallow as useShallow2 } from "zustand/react/shallow";
 import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -1474,7 +1476,7 @@ var FieldsChildInner = ({ fieldName }) => {
 };
 var FieldsChild = ({ fieldName }) => {
   const appStore = useAppStoreApi();
-  const initialValue = useMemo5(() => {
+  const initialValue = useMemo6(() => {
     const value = appStore.getState().getCurrentData().props?.[fieldName];
     return { [fieldName]: value };
   }, [appStore, fieldName]);
@@ -1501,7 +1503,7 @@ var FieldsInternal = ({ wrapFields = true }) => {
     })
   );
   const isLoading = fieldsLoading || componentResolving;
-  const Wrapper = useMemo5(() => overrides.fields || DefaultFields, [overrides]);
+  const Wrapper = useMemo6(() => overrides.fields || DefaultFields, [overrides]);
   return /* @__PURE__ */ jsxs5(
     "form",
     {
@@ -1518,7 +1520,7 @@ var FieldsInternal = ({ wrapFields = true }) => {
 };
 var Fields = memo4(FieldsInternal);
 
-// css-module:/home/runner/work/credbuild/credbuild/plugins/fields/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/plugins/fields/styles.module.css#css-module
 var styles_module_default8 = { "FieldsPlugin": "_FieldsPlugin_6as57_1", "FieldsPlugin-header": "_FieldsPlugin-header_6as57_7" };
 
 // plugins/fields/index.tsx
@@ -1545,7 +1547,7 @@ var fieldsPlugin = ({ desktopSideBar = "right" } = {}) => ({
 // plugins/code/CodePanel.tsx
 import { useState as useState6 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/plugins/code/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/plugins/code/styles.module.css#css-module
 var styles_module_default9 = { "CodePlugin": "_CodePlugin_77s8n_1", "CodePanel": "_CodePanel_77s8n_9", "CodePanel-title": "_CodePanel-title_77s8n_18", "CodePanel-textarea": "_CodePanel-textarea_77s8n_27", "CodePanel-optionsSection": "_CodePanel-optionsSection_77s8n_49", "CodePanel-optionTitle": "_CodePanel-optionTitle_77s8n_53", "CodePanel-radioGroup": "_CodePanel-radioGroup_77s8n_62", "CodePanel-radioLabel": "_CodePanel-radioLabel_77s8n_68", "CodePanel-radioInput": "_CodePanel-radioInput_77s8n_77", "CodePanel-button": "_CodePanel-button_77s8n_87", "CodePanel-error": "_CodePanel-error_77s8n_120", "CodePanel-success": "_CodePanel-success_77s8n_131", "CodePanel-promptSection": "_CodePanel-promptSection_77s8n_142", "CodePanel-promptHeader": "_CodePanel-promptHeader_77s8n_148", "CodePanel-promptText": "_CodePanel-promptText_77s8n_155", "CodePanel-copyBtn": "_CodePanel-copyBtn_77s8n_169", "CodePanel-copyBtn--copied": "_CodePanel-copyBtn--copied_77s8n_193" };
 
 // plugins/code/CodePanel.tsx
@@ -1794,13 +1796,13 @@ var codePlugin = () => ({
 import {
   useCallback as useCallback12,
   useEffect as useEffect15,
-  useMemo as useMemo15,
+  useMemo as useMemo16,
   useRef as useRef9,
   useState as useState16
 } from "react";
 
 // components/CredBuild/components/Preview/index.tsx
-import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef3, useMemo as useMemo7, useState as useState8 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect7, useRef as useRef3, useMemo as useMemo8, useState as useState8 } from "react";
 
 // components/AutoFrame/index.tsx
 import {
@@ -2102,7 +2104,7 @@ function AutoFrame({
 AutoFrame.displayName = "AutoFrame";
 var AutoFrame_default = AutoFrame;
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Preview/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Preview/styles.module.css#css-module
 var styles_module_default10 = { "CredBuildPreview": "_CredBuildPreview_17c6o_1", "CredBuildPreview-frame": "_CredBuildPreview-frame_17c6o_6", "CredBuildPreview-htmlEditor": "_CredBuildPreview-htmlEditor_17c6o_12", "CredBuildPreview-htmlTextarea": "_CredBuildPreview-htmlTextarea_17c6o_23" };
 
 // lib/bubble-pointer-event.ts
@@ -2195,7 +2197,7 @@ var Preview = ({ id = "credbuild-preview" }) => {
     },
     [config]
   );
-  const Frame = useMemo7(() => overrides.iframe, [overrides]);
+  const Frame = useMemo8(() => overrides.iframe, [overrides]);
   const rootProps = root.props || root;
   const isHtmlMode = rootProps?.mode === "html";
   const htmlViewMode = rootProps?.htmlViewMode || (rootProps?.htmlCode ? "preview" : "code");
@@ -2380,7 +2382,7 @@ var Preview = ({ id = "credbuild-preview" }) => {
 };
 
 // lib/use-loaded-overrides.ts
-import { useMemo as useMemo8 } from "react";
+import { useMemo as useMemo9 } from "react";
 
 // lib/load-overrides.ts
 var loadOverrides = ({
@@ -2422,7 +2424,7 @@ var useLoadedOverrides = ({
   overrides,
   plugins
 }) => {
-  return useMemo8(() => {
+  return useMemo9(() => {
     return loadOverrides({ overrides, plugins });
   }, [plugins, overrides]);
 };
@@ -2431,7 +2433,7 @@ var useLoadedOverrides = ({
 import { deepEqual } from "fast-equals";
 
 // components/CredBuild/components/Layout/index.tsx
-import { useEffect as useEffect14, useMemo as useMemo14, useState as useState15 } from "react";
+import { useEffect as useEffect14, useMemo as useMemo15, useState as useState15 } from "react";
 
 // components/CredBuild/context.tsx
 import {
@@ -2445,7 +2447,7 @@ function PropsProvider(props) {
 }
 var usePropsContext = () => useContext5(propsContext);
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Layout/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Layout/styles.module.css#css-module
 var styles_module_default11 = { "CredBuildLayout": "_CredBuildLayout_14aaz_1", "CredBuildLayout-inner": "_CredBuildLayout-inner_14aaz_8", "CredBuildLayout--leftSideBarVisible": "_CredBuildLayout--leftSideBarVisible_14aaz_29", "CredBuildLayout--rightSideBarVisible": "_CredBuildLayout--rightSideBarVisible_14aaz_33", "CredBuild--hidePlugins": "_CredBuild--hidePlugins_14aaz_37", "CredBuildLayout-item": "_CredBuildLayout-item_14aaz_43", "CredBuildLayout-header": "_CredBuildLayout-header_14aaz_49", "CredBuildLayout-left": "_CredBuildLayout-left_14aaz_54", "CredBuildLayout-editor": "_CredBuildLayout-editor_14aaz_67", "CredBuildLayout-right": "_CredBuildLayout-right_14aaz_75", "CredBuildLayout-sidebar": "_CredBuildLayout-sidebar_14aaz_92", "CredBuildPluginTab": "_CredBuildPluginTab_14aaz_107", "CredBuildPluginTab--visible": "_CredBuildPluginTab--visible_14aaz_114", "CredBuildPluginTab-body": "_CredBuildPluginTab-body_14aaz_118", "CredBuildLayout--mounted": "_CredBuildLayout--mounted_14aaz_134" };
 
 // lib/use-inject-css.ts
@@ -2499,7 +2501,7 @@ import { DragDropProvider } from "@dnd-kit/react";
 import {
   useCallback as useCallback6,
   useEffect as useEffect9,
-  useMemo as useMemo9,
+  useMemo as useMemo10,
   useRef as useRef4,
   useState as useState10
 } from "react";
@@ -3002,7 +3004,7 @@ var DragDropContextClient = ({
   const [dragListeners, setDragListeners] = useState10({});
   const dragMode = useRef4(null);
   const initialSelector = useRef4(void 0);
-  const nextContextValue = useMemo9(
+  const nextContextValue = useMemo10(
     () => ({
       mode: "edit",
       areaId: "root",
@@ -3257,9 +3259,9 @@ var DragDropContext = ({
 };
 
 // components/CredBuild/components/Header/index.tsx
-import { memo as memo5, useCallback as useCallback7, useMemo as useMemo12, useState as useState12 } from "react";
+import { memo as memo5, useCallback as useCallback7, useMemo as useMemo13, useState as useState12 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/MenuBar/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/MenuBar/styles.module.css#css-module
 var styles_module_default12 = { "MenuBar": "_MenuBar_1m2ld_1", "MenuBar--menuOpen": "_MenuBar--menuOpen_1m2ld_14", "MenuBar-inner": "_MenuBar-inner_1m2ld_29", "MenuBar-history": "_MenuBar-history_1m2ld_45" };
 
 // components/MenuBar/index.tsx
@@ -3317,9 +3319,9 @@ function MenuBar({
 }
 
 // components/ViewportControls/index.tsx
-import { useEffect as useEffect10, useMemo as useMemo10, useState as useState11 } from "react";
+import { useEffect as useEffect10, useMemo as useMemo11, useState as useState11 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/ViewportControls/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/ViewportControls/styles.module.css#css-module
 var styles_module_default13 = { "ViewportControls": "_ViewportControls_gefvg_1", "ViewportControls--fullScreen": "_ViewportControls--fullScreen_gefvg_5", "ViewportControls-toggleButton": "_ViewportControls-toggleButton_gefvg_14", "ViewportControls--isExpanded": "_ViewportControls--isExpanded_gefvg_38", "ViewportControls-actions": "_ViewportControls-actions_gefvg_42", "ViewportControls-actionsInner": "_ViewportControls-actionsInner_gefvg_46", "ViewportControls-divider": "_ViewportControls-divider_gefvg_76", "ViewportControls-zoomSelect": "_ViewportControls-zoomSelect_gefvg_83", "ViewportControls-zoom": "_ViewportControls-zoom_gefvg_83", "ViewportButton-inner": "_ViewportButton-inner_gefvg_114", "ViewportButton--isActive": "_ViewportButton--isActive_gefvg_122" };
 
 // components/ViewportControls/index.tsx
@@ -3372,7 +3374,7 @@ var ViewportControls = ({
   const defaultsContainAutoZoom = defaultZoomOptions.find(
     (option) => option.value === autoZoom
   );
-  const zoomOptions = useMemo10(() => {
+  const zoomOptions = useMemo11(() => {
     const options = [
       ...defaultZoomOptions,
       ...defaultsContainAutoZoom || isNaN(autoZoom) ? [] : [
@@ -3451,6 +3453,8 @@ var ViewportControls = ({
             /* @__PURE__ */ jsx21(
               "select",
               {
+                "aria-label": "Zoom level",
+                title: "Zoom level",
                 className: getClassName13("zoomSelect"),
                 value: zoom.toString(),
                 onClick: (e) => {
@@ -3474,8 +3478,10 @@ var ViewportControls = ({
         /* @__PURE__ */ jsx21(
           "button",
           {
+            type: "button",
             className: getClassName13("toggleButton"),
             title: "Toggle viewport menu",
+            "aria-label": "Toggle viewport menu",
             "aria-expanded": isExpanded,
             onClick: () => setIsExpanded((s) => !s),
             children: isExpanded ? /* @__PURE__ */ jsx21(X, { size: 16 }) : /* @__PURE__ */ jsx21(Monitor, { size: 16 })
@@ -3494,7 +3500,7 @@ import {
   createContext as createContext6,
   useContext as useContext7,
   useRef as useRef5,
-  useMemo as useMemo11
+  useMemo as useMemo12
 } from "react";
 import { jsx as jsx22 } from "react/jsx-runtime";
 var FrameContext = createContext6(null);
@@ -3502,7 +3508,7 @@ var FrameProvider = ({
   children
 }) => {
   const frameRef = useRef5(null);
-  const value = useMemo11(
+  const value = useMemo12(
     () => ({
       frameRef
     }),
@@ -3518,7 +3524,7 @@ var useCanvasFrame = () => {
   return context;
 };
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Header/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Header/styles.module.css#css-module
 var styles_module_default14 = { "CredBuildHeader": "_CredBuildHeader_qzv5u_1", "CredBuildHeader-inner": "_CredBuildHeader-inner_qzv5u_20", "CredBuildHeader-viewportTools": "_CredBuildHeader-viewportTools_qzv5u_28", "CredBuildHeader-leftActions": "_CredBuildHeader-leftActions_qzv5u_35", "CredBuildHeader-toggle": "_CredBuildHeader-toggle_qzv5u_41", "CredBuildHeader-leftSideBarToggle": "_CredBuildHeader-leftSideBarToggle_qzv5u_47", "CredBuildHeader-rightSideBarToggle": "_CredBuildHeader-rightSideBarToggle_qzv5u_48", "CredBuildHeader-title": "_CredBuildHeader-title_qzv5u_52", "CredBuildHeader-path": "_CredBuildHeader-path_qzv5u_57", "CredBuildHeader-tools": "_CredBuildHeader-tools_qzv5u_68", "CredBuildHeader-menuButton": "_CredBuildHeader-menuButton_qzv5u_75" };
 
 // components/CredBuild/components/Header/index.tsx
@@ -3538,7 +3544,7 @@ var HeaderInner = ({
   } = usePropsContext();
   const dispatch = useAppStore((s) => s.dispatch);
   const appStore = useAppStoreApi();
-  const defaultHeaderRender = useMemo12(() => {
+  const defaultHeaderRender = useMemo13(() => {
     if (renderHeader) {
       console.warn(
         "`renderHeader` is deprecated. Please use `overrides.header` and the `useCredBuild` hook instead"
@@ -3552,7 +3558,7 @@ var HeaderInner = ({
     }
     return DefaultOverride;
   }, [renderHeader, dispatch]);
-  const defaultHeaderActionsRender = useMemo12(() => {
+  const defaultHeaderActionsRender = useMemo13(() => {
     if (renderHeaderActions) {
       console.warn(
         "`renderHeaderActions` is deprecated. Please use `overrides.headerActions` and the `useCredBuild` hook instead."
@@ -3771,6 +3777,7 @@ var HeaderInner = ({
                     {
                       type: "button",
                       onClick: () => handleSetViewMode("code"),
+                      "aria-pressed": htmlViewMode === "code",
                       style: {
                         display: "flex",
                         alignItems: "center",
@@ -3798,6 +3805,7 @@ var HeaderInner = ({
                     {
                       type: "button",
                       onClick: () => handleSetViewMode("preview"),
+                      "aria-pressed": htmlViewMode === "preview",
                       style: {
                         display: "flex",
                         alignItems: "center",
@@ -3915,7 +3923,7 @@ var HeaderInner = ({
 };
 var Header = memo5(HeaderInner);
 
-// css-module:/home/runner/work/credbuild/credbuild/components/SidebarSection/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/SidebarSection/styles.module.css#css-module
 var styles_module_default15 = { "SidebarSection": "_SidebarSection_bv89x_1", "SidebarSection-title": "_SidebarSection-title_bv89x_12", "SidebarSection--noBorderTop": "_SidebarSection--noBorderTop_bv89x_37", "SidebarSection-content": "_SidebarSection-content_bv89x_41", "SidebarSection-breadcrumbLabel": "_SidebarSection-breadcrumbLabel_bv89x_50", "SidebarSection-breadcrumbs": "_SidebarSection-breadcrumbs_bv89x_79", "SidebarSection-breadcrumb": "_SidebarSection-breadcrumb_bv89x_50", "SidebarSection-heading": "_SidebarSection-heading_bv89x_91", "SidebarSection-loadingOverlay": "_SidebarSection-loadingOverlay_bv89x_95" };
 
 // components/SidebarSection/index.tsx
@@ -3943,12 +3951,12 @@ var SidebarSection = ({
 import {
   useCallback as useCallback8,
   useEffect as useEffect11,
-  useMemo as useMemo13,
+  useMemo as useMemo14,
   useRef as useRef6,
   useState as useState13
 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Canvas/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Canvas/styles.module.css#css-module
 var styles_module_default16 = { "CredBuildCanvas": "_CredBuildCanvas_1ivia_1", "CredBuildCanvas--fullScreen": "_CredBuildCanvas--fullScreen_1ivia_22", "CredBuildCanvas-inner": "_CredBuildCanvas-inner_1ivia_33", "CredBuildCanvas-root": "_CredBuildCanvas-root_1ivia_42", "CredBuildCanvas--ready": "_CredBuildCanvas--ready_1ivia_67", "CredBuildCanvas-loader": "_CredBuildCanvas-loader_1ivia_72", "CredBuildCanvas--showLoader": "_CredBuildCanvas--showLoader_1ivia_82" };
 
 // components/CredBuild/components/Canvas/index.tsx
@@ -4007,11 +4015,11 @@ var Canvas = () => {
   const shouldApplyViewport = true;
   const [showTransition, setShowTransition] = useState13(false);
   const isResizingRef = useRef6(false);
-  const defaultRender = useMemo13(() => {
+  const defaultRender = useMemo14(() => {
     const CredBuildDefault = ({ children }) => /* @__PURE__ */ jsx25(Fragment9, { children });
     return CredBuildDefault;
   }, []);
-  const CustomPreview = useMemo13(
+  const CustomPreview = useMemo14(
     () => overrides.preview || defaultRender,
     [overrides, defaultRender]
   );
@@ -4322,7 +4330,7 @@ function useSidebarResize(position, dispatch) {
 // components/CredBuild/components/ResizeHandle/index.tsx
 import { useCallback as useCallback10, useRef as useRef8 } from "react";
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/ResizeHandle/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/ResizeHandle/styles.module.css#css-module
 var styles_module_default17 = { "ResizeHandle": "_ResizeHandle_144bf_2", "ResizeHandle--left": "_ResizeHandle--left_144bf_16", "ResizeHandle--right": "_ResizeHandle--right_144bf_20" };
 
 // components/CredBuild/components/ResizeHandle/index.tsx
@@ -4393,7 +4401,7 @@ var ResizeHandle = ({
   );
 };
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Sidebar/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Sidebar/styles.module.css#css-module
 var styles_module_default18 = { "Sidebar": "_Sidebar_1kcif_1", "Sidebar--isVisible": "_Sidebar--isVisible_1kcif_13", "Sidebar--left": "_Sidebar--left_1kcif_17", "Sidebar--right": "_Sidebar--right_1kcif_29", "Sidebar-resizeHandle": "_Sidebar-resizeHandle_1kcif_42" };
 
 // components/CredBuild/components/Sidebar/index.tsx
@@ -4486,7 +4494,7 @@ var useDeleteHotkeys = () => {
   useHotkey({ backspace: true }, deleteSelectedComponent);
 };
 
-// css-module:/home/runner/work/credbuild/credbuild/components/CredBuild/components/Nav/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/CredBuild/components/Nav/styles.module.css#css-module
 var styles_module_default19 = { "Nav": "_Nav_wbh7e_1", "Nav-list": "_Nav-list_wbh7e_9", "CredBuildHeader-path": "_CredBuildHeader-path_wbh7e_20", "NavItem": "_NavItem_wbh7e_38", "NavItem-link": "_NavItem-link_wbh7e_43", "NavItem-linkIcon": "_NavItem-linkIcon_wbh7e_64", "NavItem--active": "_NavItem--active_wbh7e_77", "NavItem--mobileOnly": "_NavItem--mobileOnly_wbh7e_90", "NavItem--desktopOnly": "_NavItem--desktopOnly_wbh7e_95" };
 
 // components/CredBuild/components/Nav/index.tsx
@@ -4549,7 +4557,7 @@ var Layout = ({ children }) => {
     plugins,
     height
   } = usePropsContext();
-  const iframe = useMemo14(
+  const iframe = useMemo15(
     () => ({
       enabled: true,
       waitForStyles: true,
@@ -4603,7 +4611,7 @@ var Layout = ({ children }) => {
     };
   }, [dispatch]);
   const overrides = useAppStore((s) => s.overrides);
-  const CustomCredBuild = useMemo14(
+  const CustomCredBuild = useMemo15(
     () => overrides.credbuild || DefaultOverride,
     [overrides]
   );
@@ -4649,11 +4657,11 @@ var Layout = ({ children }) => {
   const currentPlugin = useAppStore((s) => s.state.ui.plugin?.current);
   const appStoreApi = useAppStoreApi();
   const [mobilePanelHeightMode, setMobilePanelHeightMode] = useState15("toggle");
-  const hasLegacySideBarPlugin = useMemo14(
+  const hasLegacySideBarPlugin = useMemo15(
     () => !!plugins?.find((p) => p.name === "legacy-side-bar"),
     [plugins]
   );
-  const pluginItems = useMemo14(() => {
+  const pluginItems = useMemo15(() => {
     const details = {};
     const defaultPlugins = [
       blocksPlugin(),
@@ -4826,7 +4834,7 @@ function CredBuildProvider({ children }) {
     _experimentalFullScreenCanvas,
     _experimentalVirtualization
   } = usePropsContext();
-  const iframe = useMemo15(
+  const iframe = useMemo16(
     () => ({
       enabled: true,
       waitForStyles: true,
@@ -4896,7 +4904,7 @@ function CredBuildProvider({ children }) {
       };
     })
   );
-  const initialHistoryIndex = useMemo15(() => {
+  const initialHistoryIndex = useMemo16(() => {
     if (_initialHistory?.index !== void 0 && _initialHistory?.index >= 0 && _initialHistory?.index < blendedHistories.length) {
       return _initialHistory?.index;
     }
@@ -4907,7 +4915,7 @@ function CredBuildProvider({ children }) {
     overrides,
     plugins
   });
-  const loadedFieldTransforms = useMemo15(() => {
+  const loadedFieldTransforms = useMemo16(() => {
     const _plugins = plugins || [];
     const pluginFieldTransforms = _plugins.reduce(
       (acc, plugin) => ({ ...acc, ...plugin.fieldTransforms }),

package/dist/{chunk-ISXFLTBM.mjs → chunk-HH537E6Q.mjs}

@@ -1,4 +1,4 @@
-// css-module:/home/runner/work/credbuild/credbuild/components/RichTextEditor/styles.module.css#css-module
+// css-module:/home/rasyiqi/PROJECT/Credbuild/credbuild/components/RichTextEditor/styles.module.css#css-module
 var styles_module_default = { "RichTextEditor": "_RichTextEditor_hp4qf_1", "RichTextEditor--editor": "_RichTextEditor--editor_hp4qf_50", "RichTextEditor--disabled": "_RichTextEditor--disabled_hp4qf_107", "RichTextEditor--isActive": "_RichTextEditor--isActive_hp4qf_111", "RichTextEditor-menu": "_RichTextEditor-menu_hp4qf_117" };
 
 export {

package/dist/{chunk-S32JZ2HU.mjs → chunk-J3I5GT3E.mjs}

@@ -1,7 +1,7 @@
 import {
   List,
   ListOrdered
-} from "./chunk-KN26YZZJ.mjs";
+} from "./chunk-NFUQAIKA.mjs";
 
 // components/RichTextMenu/controls/ListSelect/use-options.ts
 import { useMemo } from "react";

package/dist/{chunk-XLRMLBFR.mjs → chunk-KAL2OHVB.mjs}

@@ -3,7 +3,7 @@ import {
   TextAlignEnd,
   TextAlignJustify,
   TextAlignStart
-} from "./chunk-KN26YZZJ.mjs";
+} from "./chunk-NFUQAIKA.mjs";
 
 // components/RichTextMenu/controls/AlignSelect/use-options.ts
 import { useMemo } from "react";