@lvce-editor/settings-view 2.28.0 → 2.29.0

package/dist/settingsViewWorkerMain.js

@@ -2431,6 +2431,7 @@ const VirtualDomElements = {
 const ClientX = 'event.clientX';
 const ClientY = 'event.clientY';
 const DeltaY = 'event.deltaY';
+const TargetChecked = 'event.target.checked';
 const TargetName = 'event.target.name';
 const TargetValue = 'event.target.value';
 
@@ -3310,6 +3311,7 @@ const SettingsSideBar = 'SettingsSideBar';
 const SettingsTabs = 'SettingsTabs';
 const Tab = 'Tab';
 const TabSelected = 'TabSelected';
+const Toggle = 'Toggle';
 
 const getFilteredSchemaErrors = (errors, searchValue) => {
   const search = searchValue.trim().toLowerCase();
@@ -3553,12 +3555,14 @@ const getItemArrayVirtualDom = item => {
 };
 
 const errorCheckBoxClassName = mergeClassNames(CheckBox, InputBoxError);
+const errorToggleClassName = mergeClassNames(Toggle, InputBoxError);
+const settingUseToggles = 'settings.useToggles';
 const checkBoxWrapperNode = {
   childCount: 2,
   className: SettingsItemCheckBox,
   type: Div
 };
-const getItemCheckBoxVirtualDom = item => {
+const getItemCheckBoxVirtualDom = (item, preferences = {}) => {
   const {
     description,
     errorMessage,
@@ -3569,9 +3573,14 @@ const getItemCheckBoxVirtualDom = item => {
     value
   } = item;
   const domId = getInputId(id);
-  const checkBoxClassName = hasError ? errorCheckBoxClassName : CheckBox;
+  const useToggles = preferences[settingUseToggles] !== false && preferences[settingUseToggles] !== 'false';
+  let checkBoxClassName = useToggles ? Toggle : CheckBox;
+  if (hasError) {
+    checkBoxClassName = useToggles ? errorToggleClassName : errorCheckBoxClassName;
+  }
   const errorChildCount = hasError ? 1 : 0;
-  const isChecked = value === true || value === 'true';
+  const currentValue = preferences[id] ?? value;
+  const isChecked = currentValue === true || currentValue === 'true';
   return [{
     childCount: 2 + errorChildCount,
     className: SettingsItem,
@@ -3819,9 +3828,9 @@ const getItemRender = type => {
   }
 };
 
-const getItemVirtualDom = item => {
+const getItemVirtualDom = (item, preferences) => {
   const fn = getItemRender(item.type);
-  return fn(item);
+  return fn(item, preferences);
 };
 
 const settingsItemsNode = {
@@ -3839,7 +3848,7 @@ const getSettingsNoResultsDom = searchValue => {
   return [settingsItemsNode, noResultsNode, text(noSettingsMatching(searchValue))];
 };
 
-const getSettingsItemsDom = (items, searchValue) => {
+const getSettingsItemsDom = (items, searchValue, preferences = {}) => {
   if (items.length === 0 && searchValue && searchValue.trim()) {
     return getSettingsNoResultsDom(searchValue);
   }
@@ -3848,7 +3857,7 @@ const getSettingsItemsDom = (items, searchValue) => {
     className: SettingsItems,
     onContextMenu: HandleContextMenu,
     type: Div
-  }, ...items.flatMap(getItemVirtualDom)];
+  }, ...items.flatMap(item => getItemVirtualDom(item, preferences))];
 };
 
 const settingsContentNode = {
@@ -3862,10 +3871,10 @@ const settingsItemWrapperNode = {
   className: SettingsItemWrapper,
   type: Div
 };
-const getSettingsContentDom = (visibleItems, tabs, searchValue, showScrollBar, schemaErrors = []) => {
+const getSettingsContentDom = (visibleItems, tabs, searchValue, showScrollBar, schemaErrors = [], preferences = {}) => {
   const selectedTab = tabs.find(tab => tab.selected);
   const headerText = selectedTab ? selectedTab.label : settingsContent();
-  return [settingsContentNode, ...getContentHeadingDom(headerText), settingsItemWrapperNode, ...(selectedTab?.id === SchemaErrorsTab ? getSchemaErrorsDom(schemaErrors) : getSettingsItemsDom(visibleItems, searchValue)), ...getScrollBarDom(showScrollBar)];
+  return [settingsContentNode, ...getContentHeadingDom(headerText), settingsItemWrapperNode, ...(selectedTab?.id === SchemaErrorsTab ? getSchemaErrorsDom(schemaErrors) : getSettingsItemsDom(visibleItems, searchValue, preferences)), ...getScrollBarDom(showScrollBar)];
 };
 
 const selectedTabClassName = mergeClassNames(Tab, TabSelected);
@@ -3910,10 +3919,10 @@ const settingsMainNode = {
   className: SettingsMain,
   type: Div
 };
-const getSettingsMainDom = (tabs, visibleItems, totalItemCount, searchValue, height, itemHeight, schemaErrors = []) => {
+const getSettingsMainDom = (tabs, visibleItems, totalItemCount, searchValue, height, itemHeight, schemaErrors = [], preferences = {}) => {
   const totalHeight = totalItemCount * itemHeight;
   const showScrollBar = totalHeight > height;
-  return [settingsMainNode, ...getSettingsSideBarDom(tabs), ...getResizerVirtualDom(), ...getSettingsContentDom(visibleItems, tabs, searchValue, showScrollBar, schemaErrors)];
+  return [settingsMainNode, ...getSettingsSideBarDom(tabs), ...getResizerVirtualDom(), ...getSettingsContentDom(visibleItems, tabs, searchValue, showScrollBar, schemaErrors, preferences)];
 };
 
 const parentNode = {
@@ -3932,6 +3941,7 @@ const getSettingsDom = state => {
     filteredItems,
     height,
     itemHeight,
+    preferences,
     schemaErrors = [],
     searchValue,
     tabs,
@@ -3941,7 +3951,7 @@ const getSettingsDom = state => {
   const hasSearchValue = searchValue.trim().length > 0;
   const filteredSchemaErrors = getFilteredSchemaErrors(schemaErrors, searchValue);
   const filteredItemsCount = getFilteredItemsCount(isSchemaErrorsTab, filteredSchemaErrors.length, filteredItems.length);
-  const mainDom = getSettingsMainDom(tabs, visibleItems, filteredItemsCount, searchValue, height, itemHeight, filteredSchemaErrors);
+  const mainDom = getSettingsMainDom(tabs, visibleItems, filteredItemsCount, searchValue, height, itemHeight, filteredSchemaErrors, preferences);
   return [parentNode, ...getSettingsHeaderDom(filteredItemsCount, hasSearchValue), ...mainDom];
 };
 
@@ -4053,7 +4063,7 @@ const renderEventListeners = () => {
     params: ['handleSettingInput', TargetName, TargetValue]
   }, {
     name: HandleSettingChecked,
-    params: ['handleSettingChecked', TargetName, TargetValue]
+    params: ['handleSettingChecked', TargetName, TargetChecked]
   },
   // {
   //   name: DomEventListenerFunctions.HandleScroll,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/settings-view",
-  "version": "2.28.0",
+  "version": "2.29.0",
   "description": "Explorer Worker",
   "repository": {
     "type": "git",