@lvce-editor/settings-view 2.27.2 → 2.28.0
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/dist/settingsViewWorkerMain.js +98 -17
- package/package.json +1 -1
|
@@ -1559,6 +1559,7 @@ const create$1 = (id, uri, x, y, width, height) => {
|
|
|
1559
1559
|
minLineY: 0,
|
|
1560
1560
|
modifiedSettings: {},
|
|
1561
1561
|
preferences: {},
|
|
1562
|
+
schemaErrors: [],
|
|
1562
1563
|
scrollBarMinHeight: 0,
|
|
1563
1564
|
scrollBarThumbHeight: 0,
|
|
1564
1565
|
scrollBarThumbTop: 0,
|
|
@@ -1779,6 +1780,10 @@ const filterSettingId = state => appendFilter(state, '@id:');
|
|
|
1779
1780
|
const filterStable = state => toggleExclusiveFilter(state, '@stable', ['@tag:preview', '@tag:experimental']);
|
|
1780
1781
|
const filterTag = state => appendFilter(state, '@tag:');
|
|
1781
1782
|
|
|
1783
|
+
const getComponentState = uid => {
|
|
1784
|
+
return get$1(uid).newState;
|
|
1785
|
+
};
|
|
1786
|
+
|
|
1782
1787
|
const Group = 'group';
|
|
1783
1788
|
const Tab$1 = 'tab';
|
|
1784
1789
|
const TabList = 'tablist';
|
|
@@ -3056,6 +3061,15 @@ const getPreferences = async () => {
|
|
|
3056
3061
|
}
|
|
3057
3062
|
};
|
|
3058
3063
|
|
|
3064
|
+
const getSchemaErrors = async () => {
|
|
3065
|
+
try {
|
|
3066
|
+
return await invoke$1('SettingsWorker.getSchemaErrors');
|
|
3067
|
+
} catch {
|
|
3068
|
+
// Older settings-worker versions do not expose schema diagnostics yet.
|
|
3069
|
+
return [];
|
|
3070
|
+
}
|
|
3071
|
+
};
|
|
3072
|
+
|
|
3059
3073
|
const getSettingItems = async () => {
|
|
3060
3074
|
return invoke$1('SettingsWorker.getSettingsItems2');
|
|
3061
3075
|
};
|
|
@@ -3172,7 +3186,7 @@ const loadContent = async (state, savedState) => {
|
|
|
3172
3186
|
} = restoreState(savedState);
|
|
3173
3187
|
const tabs = await getTabs();
|
|
3174
3188
|
const newTabs = getUpdatedTabs(tabs, tabId);
|
|
3175
|
-
const [items, preferences] = await Promise.all([getSettingItems(), getPreferences()]);
|
|
3189
|
+
const [items, preferences, schemaErrors] = await Promise.all([getSettingItems(), getPreferences(), getSchemaErrors()]);
|
|
3176
3190
|
const modifiedSettings = getModifiedSettings(preferences);
|
|
3177
3191
|
const filteredItems = getFilteredItems(items, newTabs, searchValue, modifiedSettings, preferences);
|
|
3178
3192
|
const {
|
|
@@ -3202,6 +3216,7 @@ const loadContent = async (state, savedState) => {
|
|
|
3202
3216
|
minLineY,
|
|
3203
3217
|
modifiedSettings,
|
|
3204
3218
|
preferences,
|
|
3219
|
+
schemaErrors,
|
|
3205
3220
|
scrollBarThumbHeight: thumbHeight,
|
|
3206
3221
|
scrollBarThumbTop: thumbTop,
|
|
3207
3222
|
scrollOffset,
|
|
@@ -3240,6 +3255,7 @@ const renderCss = (oldState, newState) => {
|
|
|
3240
3255
|
|
|
3241
3256
|
const Clear = 'Clear';
|
|
3242
3257
|
const Filter = 'Filter';
|
|
3258
|
+
const SchemaErrorsTab = 'schema-errors';
|
|
3243
3259
|
const SettingsSearch = 'SettingsSearch';
|
|
3244
3260
|
|
|
3245
3261
|
const renderFocus = (oldState, newState) => {
|
|
@@ -3288,11 +3304,21 @@ const SettingsScrollBar = 'ScrollBar';
|
|
|
3288
3304
|
const SettingsScrollBarSmall = 'ScrollBarSmall';
|
|
3289
3305
|
const SettingsScrollBarThumb = 'ScrollBarThumb';
|
|
3290
3306
|
const SettingsSearchInput = 'SettingsSearchInput';
|
|
3307
|
+
const SettingsSchemaError = 'SettingsSchemaError';
|
|
3308
|
+
const SettingsSchemaErrors = 'SettingsSchemaErrors';
|
|
3291
3309
|
const SettingsSideBar = 'SettingsSideBar';
|
|
3292
3310
|
const SettingsTabs = 'SettingsTabs';
|
|
3293
3311
|
const Tab = 'Tab';
|
|
3294
3312
|
const TabSelected = 'TabSelected';
|
|
3295
3313
|
|
|
3314
|
+
const getFilteredSchemaErrors = (errors, searchValue) => {
|
|
3315
|
+
const search = searchValue.trim().toLowerCase();
|
|
3316
|
+
if (!search) {
|
|
3317
|
+
return errors;
|
|
3318
|
+
}
|
|
3319
|
+
return errors.filter(error => `${error.id} ${error.message} ${error.source}`.toLowerCase().includes(search));
|
|
3320
|
+
};
|
|
3321
|
+
|
|
3296
3322
|
const inputBadgeNode = {
|
|
3297
3323
|
childCount: 1,
|
|
3298
3324
|
className: InputBadge,
|
|
@@ -3369,6 +3395,7 @@ const getSettingsInputButtonsDom = hasSearchValue => {
|
|
|
3369
3395
|
return [...getClearButtonDom(hasSearchValue), ...getFilterButtonDom()];
|
|
3370
3396
|
};
|
|
3371
3397
|
|
|
3398
|
+
const searchInputClassName = mergeClassNames(InputBox, SettingsSearchInput, 'MultilineInputBox');
|
|
3372
3399
|
const getSettingsInputDom = () => {
|
|
3373
3400
|
const placeholder = searchSettings();
|
|
3374
3401
|
return [{
|
|
@@ -3376,7 +3403,7 @@ const getSettingsInputDom = () => {
|
|
|
3376
3403
|
autocomplete: 'off',
|
|
3377
3404
|
autocorrect: 'off',
|
|
3378
3405
|
childCount: 0,
|
|
3379
|
-
className:
|
|
3406
|
+
className: searchInputClassName,
|
|
3380
3407
|
name: SettingsSearch,
|
|
3381
3408
|
onFocus: HandleInputFocus,
|
|
3382
3409
|
onInput: HandleInput,
|
|
@@ -3386,6 +3413,7 @@ const getSettingsInputDom = () => {
|
|
|
3386
3413
|
}];
|
|
3387
3414
|
};
|
|
3388
3415
|
|
|
3416
|
+
const inputWrapperClassName = mergeClassNames(SettingsInputWrapper, 'SearchField');
|
|
3389
3417
|
const settingsHeaderNode = {
|
|
3390
3418
|
childCount: 1,
|
|
3391
3419
|
className: SettingsHeader,
|
|
@@ -3398,7 +3426,7 @@ const getSettingsHeaderDom = (filteredSettingsCount, hasSearchValue) => {
|
|
|
3398
3426
|
const childCount = getChildCount$1(hasSearchValue);
|
|
3399
3427
|
return [settingsHeaderNode, {
|
|
3400
3428
|
childCount,
|
|
3401
|
-
className:
|
|
3429
|
+
className: inputWrapperClassName,
|
|
3402
3430
|
type: Div
|
|
3403
3431
|
}, ...getSettingsInputDom(), ...getSettingsInputBadgeDom(filteredSettingsCount, hasSearchValue), ...getSettingsInputButtonsDom(hasSearchValue)];
|
|
3404
3432
|
};
|
|
@@ -3426,6 +3454,21 @@ const getContentHeadingDom = headerText => {
|
|
|
3426
3454
|
return [parentNode$2, text(headerText)];
|
|
3427
3455
|
};
|
|
3428
3456
|
|
|
3457
|
+
const getSchemaErrorsDom = errors => {
|
|
3458
|
+
return [{
|
|
3459
|
+
childCount: errors.length,
|
|
3460
|
+
className: SettingsSchemaErrors,
|
|
3461
|
+
role: Group,
|
|
3462
|
+
type: Div
|
|
3463
|
+
}, ...errors.flatMap(error => [{
|
|
3464
|
+
childCount: 2,
|
|
3465
|
+
className: SettingsSchemaError,
|
|
3466
|
+
name: error.id,
|
|
3467
|
+
role: Group,
|
|
3468
|
+
type: Div
|
|
3469
|
+
}, text(`${error.id}: ${error.message}`), text(`Source: ${error.source}`)])];
|
|
3470
|
+
};
|
|
3471
|
+
|
|
3429
3472
|
const parentNode$1 = {
|
|
3430
3473
|
childCount: 1,
|
|
3431
3474
|
className: mergeClassNames(SettingsScrollBar, SettingsScrollBarSmall),
|
|
@@ -3477,6 +3520,7 @@ const getItemLabelDom = (domId, label) => {
|
|
|
3477
3520
|
}, text(label)];
|
|
3478
3521
|
};
|
|
3479
3522
|
|
|
3523
|
+
const errorInputClassName$3 = mergeClassNames(InputBox, InputBoxError);
|
|
3480
3524
|
const getItemArrayVirtualDom = item => {
|
|
3481
3525
|
const {
|
|
3482
3526
|
description,
|
|
@@ -3487,7 +3531,7 @@ const getItemArrayVirtualDom = item => {
|
|
|
3487
3531
|
modified
|
|
3488
3532
|
} = item;
|
|
3489
3533
|
const domId = getInputId(id);
|
|
3490
|
-
const inputClassName = hasError ?
|
|
3534
|
+
const inputClassName = hasError ? errorInputClassName$3 : InputBox;
|
|
3491
3535
|
const errorChildCount = hasError ? 1 : 0;
|
|
3492
3536
|
return [{
|
|
3493
3537
|
childCount: 3 + errorChildCount,
|
|
@@ -3508,6 +3552,7 @@ const getItemArrayVirtualDom = item => {
|
|
|
3508
3552
|
}, ...getErrorMessageDom(errorMessage)];
|
|
3509
3553
|
};
|
|
3510
3554
|
|
|
3555
|
+
const errorCheckBoxClassName = mergeClassNames(CheckBox, InputBoxError);
|
|
3511
3556
|
const checkBoxWrapperNode = {
|
|
3512
3557
|
childCount: 2,
|
|
3513
3558
|
className: SettingsItemCheckBox,
|
|
@@ -3524,7 +3569,7 @@ const getItemCheckBoxVirtualDom = item => {
|
|
|
3524
3569
|
value
|
|
3525
3570
|
} = item;
|
|
3526
3571
|
const domId = getInputId(id);
|
|
3527
|
-
const checkBoxClassName = hasError ?
|
|
3572
|
+
const checkBoxClassName = hasError ? errorCheckBoxClassName : CheckBox;
|
|
3528
3573
|
const errorChildCount = hasError ? 1 : 0;
|
|
3529
3574
|
const isChecked = value === true || value === 'true';
|
|
3530
3575
|
return [{
|
|
@@ -3546,6 +3591,8 @@ const getItemCheckBoxVirtualDom = item => {
|
|
|
3546
3591
|
}, ...getItemLabelDom(domId, description), ...getErrorMessageDom(errorMessage)];
|
|
3547
3592
|
};
|
|
3548
3593
|
|
|
3594
|
+
const errorColorInputClassName = mergeClassNames('ColorInput', InputBoxError);
|
|
3595
|
+
const defaultColorInputClassName = mergeClassNames('ColorInput');
|
|
3549
3596
|
const colorInputWrapperNode = {
|
|
3550
3597
|
childCount: 2,
|
|
3551
3598
|
className: SettingsItemCheckBox,
|
|
@@ -3561,7 +3608,7 @@ const getItemColorVirtualDom = item => {
|
|
|
3561
3608
|
modified
|
|
3562
3609
|
} = item;
|
|
3563
3610
|
const domId = getInputId(id);
|
|
3564
|
-
const colorInputClassName = hasError ?
|
|
3611
|
+
const colorInputClassName = hasError ? errorColorInputClassName : defaultColorInputClassName;
|
|
3565
3612
|
const errorChildCount = hasError ? 1 : 0;
|
|
3566
3613
|
return [{
|
|
3567
3614
|
childCount: 3 + errorChildCount,
|
|
@@ -3594,6 +3641,7 @@ const getSettingsModifiedIndicatorDom = isModified => {
|
|
|
3594
3641
|
return [modifiedIndicatorNode];
|
|
3595
3642
|
};
|
|
3596
3643
|
|
|
3644
|
+
const errorInputClassName$2 = mergeClassNames(InputBox, InputBoxError);
|
|
3597
3645
|
const getChildCount = (modified, hasError) => {
|
|
3598
3646
|
const modifiedChildCount = modified ? 1 : 0;
|
|
3599
3647
|
const errorChildCount = hasError ? 1 : 0;
|
|
@@ -3602,7 +3650,7 @@ const getChildCount = (modified, hasError) => {
|
|
|
3602
3650
|
};
|
|
3603
3651
|
const getInputClassName = hasError => {
|
|
3604
3652
|
if (hasError) {
|
|
3605
|
-
return
|
|
3653
|
+
return errorInputClassName$2;
|
|
3606
3654
|
}
|
|
3607
3655
|
return InputBox;
|
|
3608
3656
|
};
|
|
@@ -3649,6 +3697,7 @@ const getOptionDom = option => {
|
|
|
3649
3697
|
}, text(label)];
|
|
3650
3698
|
};
|
|
3651
3699
|
|
|
3700
|
+
const errorSelectClassName = mergeClassNames(Select, InputBoxError);
|
|
3652
3701
|
const getItemSelectVirtualDom = item => {
|
|
3653
3702
|
const {
|
|
3654
3703
|
description,
|
|
@@ -3659,7 +3708,7 @@ const getItemSelectVirtualDom = item => {
|
|
|
3659
3708
|
options
|
|
3660
3709
|
} = item;
|
|
3661
3710
|
const domId = getInputId(id);
|
|
3662
|
-
const selectClassName = hasError ?
|
|
3711
|
+
const selectClassName = hasError ? errorSelectClassName : Select;
|
|
3663
3712
|
const errorChildCount = hasError ? 1 : 0;
|
|
3664
3713
|
return [{
|
|
3665
3714
|
childCount: 3 + errorChildCount,
|
|
@@ -3677,6 +3726,7 @@ const getItemSelectVirtualDom = item => {
|
|
|
3677
3726
|
}, ...(options?.flatMap(getOptionDom) || []), ...getErrorMessageDom(errorMessage)];
|
|
3678
3727
|
};
|
|
3679
3728
|
|
|
3729
|
+
const errorInputClassName$1 = mergeClassNames(InputBox, InputBoxError);
|
|
3680
3730
|
const getItemStringVirtualDom = item => {
|
|
3681
3731
|
const {
|
|
3682
3732
|
description,
|
|
@@ -3686,7 +3736,7 @@ const getItemStringVirtualDom = item => {
|
|
|
3686
3736
|
id
|
|
3687
3737
|
} = item;
|
|
3688
3738
|
const domId = getInputId(id);
|
|
3689
|
-
const inputClassName = hasError ?
|
|
3739
|
+
const inputClassName = hasError ? errorInputClassName$1 : InputBox;
|
|
3690
3740
|
const errorChildCount = hasError ? 1 : 0;
|
|
3691
3741
|
return [{
|
|
3692
3742
|
childCount: 3 + errorChildCount,
|
|
@@ -3716,6 +3766,7 @@ const getItemUnknownVirtualDom = item => {
|
|
|
3716
3766
|
}, text(unknownSettingType())];
|
|
3717
3767
|
};
|
|
3718
3768
|
|
|
3769
|
+
const errorInputClassName = mergeClassNames(InputBox, InputBoxError);
|
|
3719
3770
|
const getItemUrlVirtualDom = item => {
|
|
3720
3771
|
const {
|
|
3721
3772
|
description,
|
|
@@ -3726,7 +3777,7 @@ const getItemUrlVirtualDom = item => {
|
|
|
3726
3777
|
modified
|
|
3727
3778
|
} = item;
|
|
3728
3779
|
const domId = getInputId(id);
|
|
3729
|
-
const inputClassName = hasError ?
|
|
3780
|
+
const inputClassName = hasError ? errorInputClassName : InputBox;
|
|
3730
3781
|
const errorChildCount = hasError ? 1 : 0;
|
|
3731
3782
|
return [{
|
|
3732
3783
|
childCount: 3 + errorChildCount,
|
|
@@ -3811,14 +3862,15 @@ const settingsItemWrapperNode = {
|
|
|
3811
3862
|
className: SettingsItemWrapper,
|
|
3812
3863
|
type: Div
|
|
3813
3864
|
};
|
|
3814
|
-
const getSettingsContentDom = (visibleItems, tabs, searchValue, showScrollBar) => {
|
|
3865
|
+
const getSettingsContentDom = (visibleItems, tabs, searchValue, showScrollBar, schemaErrors = []) => {
|
|
3815
3866
|
const selectedTab = tabs.find(tab => tab.selected);
|
|
3816
3867
|
const headerText = selectedTab ? selectedTab.label : settingsContent();
|
|
3817
|
-
return [settingsContentNode, ...getContentHeadingDom(headerText), settingsItemWrapperNode, ...getSettingsItemsDom(visibleItems, searchValue), ...getScrollBarDom(showScrollBar)];
|
|
3868
|
+
return [settingsContentNode, ...getContentHeadingDom(headerText), settingsItemWrapperNode, ...(selectedTab?.id === SchemaErrorsTab ? getSchemaErrorsDom(schemaErrors) : getSettingsItemsDom(visibleItems, searchValue)), ...getScrollBarDom(showScrollBar)];
|
|
3818
3869
|
};
|
|
3819
3870
|
|
|
3871
|
+
const selectedTabClassName = mergeClassNames(Tab, TabSelected);
|
|
3820
3872
|
const getTabClassName = tab => {
|
|
3821
|
-
return tab.selected ?
|
|
3873
|
+
return tab.selected ? selectedTabClassName : Tab;
|
|
3822
3874
|
};
|
|
3823
3875
|
|
|
3824
3876
|
const getTabVirtualDom = tab => {
|
|
@@ -3858,10 +3910,10 @@ const settingsMainNode = {
|
|
|
3858
3910
|
className: SettingsMain,
|
|
3859
3911
|
type: Div
|
|
3860
3912
|
};
|
|
3861
|
-
const getSettingsMainDom = (tabs, visibleItems, totalItemCount, searchValue, height, itemHeight) => {
|
|
3913
|
+
const getSettingsMainDom = (tabs, visibleItems, totalItemCount, searchValue, height, itemHeight, schemaErrors = []) => {
|
|
3862
3914
|
const totalHeight = totalItemCount * itemHeight;
|
|
3863
3915
|
const showScrollBar = totalHeight > height;
|
|
3864
|
-
return [settingsMainNode, ...getSettingsSideBarDom(tabs), ...getResizerVirtualDom(), ...getSettingsContentDom(visibleItems, tabs, searchValue, showScrollBar)];
|
|
3916
|
+
return [settingsMainNode, ...getSettingsSideBarDom(tabs), ...getResizerVirtualDom(), ...getSettingsContentDom(visibleItems, tabs, searchValue, showScrollBar, schemaErrors)];
|
|
3865
3917
|
};
|
|
3866
3918
|
|
|
3867
3919
|
const parentNode = {
|
|
@@ -3869,18 +3921,28 @@ const parentNode = {
|
|
|
3869
3921
|
className: mergeClassNames(Viewlet, Settings),
|
|
3870
3922
|
type: Div
|
|
3871
3923
|
};
|
|
3924
|
+
const getFilteredItemsCount = (isSchemaErrorsTab, schemaErrorsLength, filteredItemsLength) => {
|
|
3925
|
+
if (isSchemaErrorsTab) {
|
|
3926
|
+
return schemaErrorsLength;
|
|
3927
|
+
}
|
|
3928
|
+
return filteredItemsLength;
|
|
3929
|
+
};
|
|
3872
3930
|
const getSettingsDom = state => {
|
|
3873
3931
|
const {
|
|
3874
3932
|
filteredItems,
|
|
3875
3933
|
height,
|
|
3876
3934
|
itemHeight,
|
|
3935
|
+
schemaErrors = [],
|
|
3877
3936
|
searchValue,
|
|
3878
3937
|
tabs,
|
|
3879
3938
|
visibleItems
|
|
3880
3939
|
} = state;
|
|
3940
|
+
const isSchemaErrorsTab = tabs.some(tab => tab.selected && tab.id === SchemaErrorsTab);
|
|
3881
3941
|
const hasSearchValue = searchValue.trim().length > 0;
|
|
3882
|
-
const
|
|
3883
|
-
|
|
3942
|
+
const filteredSchemaErrors = getFilteredSchemaErrors(schemaErrors, searchValue);
|
|
3943
|
+
const filteredItemsCount = getFilteredItemsCount(isSchemaErrorsTab, filteredSchemaErrors.length, filteredItems.length);
|
|
3944
|
+
const mainDom = getSettingsMainDom(tabs, visibleItems, filteredItemsCount, searchValue, height, itemHeight, filteredSchemaErrors);
|
|
3945
|
+
return [parentNode, ...getSettingsHeaderDom(filteredItemsCount, hasSearchValue), ...mainDom];
|
|
3884
3946
|
};
|
|
3885
3947
|
|
|
3886
3948
|
const renderItems = (oldState, newState) => {
|
|
@@ -4070,6 +4132,23 @@ const saveState = state => {
|
|
|
4070
4132
|
};
|
|
4071
4133
|
};
|
|
4072
4134
|
|
|
4135
|
+
const applyComponentState = (currentState, state) => {
|
|
4136
|
+
if (!state || typeof state !== 'object' || Array.isArray(state)) {
|
|
4137
|
+
throw new TypeError('Settings state must be an object');
|
|
4138
|
+
}
|
|
4139
|
+
const {
|
|
4140
|
+
id
|
|
4141
|
+
} = state;
|
|
4142
|
+
const {
|
|
4143
|
+
id: currentId
|
|
4144
|
+
} = currentState;
|
|
4145
|
+
if (id !== currentId) {
|
|
4146
|
+
throw new Error(`Settings state id must remain ${currentId}`);
|
|
4147
|
+
}
|
|
4148
|
+
return state;
|
|
4149
|
+
};
|
|
4150
|
+
const setComponentState = wrapCommand(applyComponentState);
|
|
4151
|
+
|
|
4073
4152
|
const useNextSearchValue = state => {
|
|
4074
4153
|
const {
|
|
4075
4154
|
history,
|
|
@@ -4136,6 +4215,7 @@ const commandMap = {
|
|
|
4136
4215
|
'Settings.filterStable': wrapCommand(filterStable),
|
|
4137
4216
|
'Settings.filterTag': wrapCommand(filterTag),
|
|
4138
4217
|
'Settings.getCommandIds': getCommandIds,
|
|
4218
|
+
'Settings.getComponentState': getComponentState,
|
|
4139
4219
|
'Settings.getKeyBindings': getKeyBindings,
|
|
4140
4220
|
'Settings.getMenuEntries': wrapGetter(getMenuEntries2),
|
|
4141
4221
|
'Settings.getMenuIds': getMenuIds,
|
|
@@ -4162,6 +4242,7 @@ const commandMap = {
|
|
|
4162
4242
|
'Settings.resetSetting': wrapCommand(resetSetting),
|
|
4163
4243
|
'Settings.restoreState': restoreState,
|
|
4164
4244
|
'Settings.saveState': wrapGetter(saveState),
|
|
4245
|
+
'Settings.setComponentState': setComponentState,
|
|
4165
4246
|
'Settings.terminate': terminate,
|
|
4166
4247
|
'Settings.useNextSearchValue': wrapCommand(useNextSearchValue),
|
|
4167
4248
|
'Settings.usePreviousSearchValue': wrapCommand(usePreviousSearchValue)
|