PrefUI // Sync changes.

Source/Modules/UIModules/PrefUI/CtlPrefUIShared.swift

@@ -12,7 +12,7 @@ import SwiftUI
 
 @available(macOS 10.15, *)
 extension PrefUITabs {
-  var ssPaneIdentifier: SSPreferences.PaneIdentifier { .init(rawValue: rawValue) }
+  var ssPaneIdentifier: SSPreferences.Settings.PaneIdentifier { .init(rawValue: rawValue) }
 }
 
 @available(macOS 10.15, *)
@@ -41,8 +41,8 @@ class CtlPrefUIShared {
     panes: {
       var result = [PreferencePaneConvertible]()
       PrefUITabs.allCases.forEach { neta in
-        let item: PreferencePaneConvertible = SSPreferences.Pane(
+        let item: PreferencePaneConvertible = SSPreferences.Settings.Pane(
-          identifier: SSPreferences.PaneIdentifier(rawValue: neta.rawValue),
+          identifier: SSPreferences.Settings.PaneIdentifier(rawValue: neta.rawValue),
           title: neta.i18nTitle, toolbarIcon: neta.icon,
           contentView: { VwrPrefPage(tabType: neta) }
         )
@@ -84,4 +84,7 @@ class CtlPrefUIShared {
       }
     }
   }()
+
+  static var containerWidth: Double { contentWidth + 60 }
+  static var maxDescriptionWidth: Double { contentWidth * 0.8 }
 }

Source/Modules/UIModules/PrefUI/VwrPrefPaneBehavior.swift

@@ -66,8 +66,8 @@ struct VwrPrefPaneBehavior: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section(title: "Space:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Space:".localized, bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Enable Space key for calling candidate window"),
             isOn: $chooseCandidateUsingSpace
@@ -77,9 +77,9 @@ struct VwrPrefPaneBehavior: View {
               "If disabled, this will insert space instead."
             )
           )
-          .preferenceDescription()
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "ESC:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "ESC:".localized, bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Use ESC key to clear the entire input buffer"),
             isOn: $escToCleanInputBuffer
@@ -89,9 +89,10 @@ struct VwrPrefPaneBehavior: View {
               "If unchecked, the ESC key will try cleaning the unfinished readings / strokes first, and will commit the current composition buffer if there's no unfinished readings / strkes."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Enter:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Enter:".localized, bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Allow using Enter key to confirm associated candidate selection"),
             isOn: $alsoConfirmAssociatedCandidatesByEnter
@@ -101,9 +102,10 @@ struct VwrPrefPaneBehavior: View {
               "Otherwise, only the candidate keys are allowed to confirm associates."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Shift+BackSpace:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Shift+BackSpace:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $specifyShiftBackSpaceKeyBehavior
@@ -115,9 +117,10 @@ struct VwrPrefPaneBehavior: View {
           .labelsHidden()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Disassembling process does not work with non-phonetic reading keys."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "(Shift+)Tab:", bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "(Shift+)Tab:", bottomDivider: true) {
           Picker(
             "",
             selection: $specifyShiftTabKeyBehavior
@@ -129,9 +132,10 @@ struct VwrPrefPaneBehavior: View {
           .horizontalRadioGroupLayout()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Choose the behavior of (Shift+)Tab key in the candidate window."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "(Shift+)Space:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "(Shift+)Space:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $specifyShiftSpaceKeyBehavior
@@ -142,9 +146,10 @@ struct VwrPrefPaneBehavior: View {
           .labelsHidden()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Choose the behavior of (Shift+)Space key with candidates."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Shift+Letter:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Shift+Letter:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $upperCaseLetterKeyBehavior
@@ -156,9 +161,10 @@ struct VwrPrefPaneBehavior: View {
           .labelsHidden()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Choose the behavior of Shift+Letter key with letter inputs."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Intonation Key:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Intonation Key:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $specifyIntonationKeyBehavior
@@ -170,9 +176,10 @@ struct VwrPrefPaneBehavior: View {
           .labelsHidden()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Specify the behavior of intonation key when syllable composer is empty."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Shift:", bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Shift:", bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Toggle alphanumerical mode with Left-Shift"),
             isOn: $togglingAlphanumericalModeWithLShift.onChange {
@@ -194,9 +201,10 @@ struct VwrPrefPaneBehavior: View {
           Text(
             "This feature requires macOS 10.15 and above.".localized + CtlPrefUIShared.sentenceSeparator
               + "It only needs to parse consecutive NSEvents passed by macOS built-in InputMethodKit framework, hence no necessity of asking end-users for extra privileges of monitoring global keyboard inputs. You are free to investigate our codebase or reverse-engineer this input method to see whether the above statement is trustable.".localized
-          ).preferenceDescription()
+          )
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Caps Lock:", bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Caps Lock:", bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Show notifications when toggling Caps Lock"),
             isOn: $showNotificationsWhenTogglingCapsLock.onChange {
@@ -207,9 +215,10 @@ struct VwrPrefPaneBehavior: View {
           ).disabled(!macOSMontereyOrLaterDetected)
           Text(
             "This feature requires macOS 12 and above.".localized
-          ).preferenceDescription()
+          )
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Misc Settings:".localized) {
+        SSPreferences.Settings.Section(title: "Misc Settings:".localized) {
           Toggle(
             LocalizedStringKey("Always show tooltip texts horizontally"),
             isOn: $alwaysShowTooltipTextsHorizontally
@@ -218,11 +227,12 @@ struct VwrPrefPaneBehavior: View {
             LocalizedStringKey(
               "Key names in tooltip will be shown as symbols when the tooltip is vertical. However, this option will be ignored since tooltip will always be horizontal if the UI language is English."
             )
-          ).preferenceDescription()
+          )
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneCandidates.swift

@@ -53,11 +53,11 @@ struct VwrPrefPaneCandidates: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section(title: "Selection Keys:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Selection Keys:".localized, bottomDivider: true) {
           VwrPrefPaneCandidates_SelectionKeys()
         }
-        SSPreferences.Section(title: "Candidate Layout:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Candidate Layout:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $useHorizontalCandidateList
@@ -69,7 +69,8 @@ struct VwrPrefPaneCandidates: View {
           .horizontalRadioGroupLayout()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Choose your preferred layout of the candidate window."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Toggle(
             LocalizedStringKey("Use only one row / column in candidate window."),
             isOn: $candidateWindowShowOnlyOneLine
@@ -81,9 +82,10 @@ struct VwrPrefPaneCandidates: View {
               + CtlPrefUIShared.sentenceSeparator
               + "Tadokoro candidate window shows 4 rows / columns by default, providing similar experiences from Microsoft New Phonetic IME and macOS bult-in Chinese IME (since macOS 10.9). However, for some users who have presbyopia, they prefer giant candidate font sizes, resulting a concern that multiple rows / columns of candidates can make the candidate window looks too big, hence this option. Note that this option will be dismissed if the typing context is vertical, forcing the candidates to be shown in only one row / column. Only one reverse-lookup result can be made available in single row / column mode due to reduced candidate window size.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Candidate Size:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Candidate Size:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $candidateListTextSize.onChange {
@@ -110,9 +112,10 @@ struct VwrPrefPaneCandidates: View {
           .labelsHidden()
           .frame(width: 120.0)
           Text(LocalizedStringKey("Choose candidate font size for better visual clarity."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Cursor Selection:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Cursor Selection:".localized, bottomDivider: true) {
           Picker(
             "",
             selection: $useRearCursorMode
@@ -123,13 +126,14 @@ struct VwrPrefPaneCandidates: View {
           .labelsHidden()
           .pickerStyle(RadioGroupPickerStyle())
           Text(LocalizedStringKey("Choose the cursor position where you want to list possible candidates."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Toggle(
             LocalizedStringKey("Push the cursor in front of the phrase after selection"),
             isOn: $moveCursorAfterSelectingCandidate
           ).controlSize(.small)
         }
-        SSPreferences.Section(title: "Misc Settings:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Misc Settings:".localized, bottomDivider: true) {
           Toggle(
             LocalizedStringKey("Show available reverse-lookup results in candidate window"),
             isOn: $showReverseLookupInCandidateUI
@@ -140,7 +144,8 @@ struct VwrPrefPaneCandidates: View {
               + CtlPrefUIShared.sentenceSeparator
               + "The lookup results are supplied by the CIN cassette module.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Toggle(
             LocalizedStringKey("Always use fixed listing order in candidate window"),
             isOn: $useFixecCandidateOrderOnSelection
@@ -150,7 +155,8 @@ struct VwrPrefPaneCandidates: View {
               "This will stop user override model from affecting how candidates get sorted."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Toggle(
             LocalizedStringKey("Consolidate the context on confirming candidate selection"),
             isOn: $consolidateContextOnCandidateSelection
@@ -158,9 +164,10 @@ struct VwrPrefPaneCandidates: View {
           Text(
             "For example: When typing “章太炎” and you want to override the “太” with “泰”, and the raw operation index range [1,2) which bounds are cutting the current node “章太炎” in range [0,3). If having lack of the pre-consolidation process, this word will become something like “張泰言” after the candidate selection. Only if we enable this consolidation, this word will become “章泰炎” which is the expected result that the context is kept as-is.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Experimental:".localized) {
+        SSPreferences.Settings.Section(title: "Experimental:".localized) {
           Toggle(
             LocalizedStringKey("Use IMK Candidate Window instead of Tadokoro"),
             isOn: $useIMKCandidateWindow.onChange {
@@ -171,11 +178,13 @@ struct VwrPrefPaneCandidates: View {
           Text(
             LocalizedStringKey("⚠︎ This will reboot the vChewing IME.")
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Text(
             "IMK candidate window relies on certain Apple private APIs which are force-exposed by using bridging headers. Its usability, at this moment, is only guaranteed from macOS 10.14 Mojave to macOS 13 Ventura. Further tests are required in the future in order to tell whether it is usable in newer macOS releases.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Toggle(
             LocalizedStringKey("Enable mouse wheel support for Tadokoro Candidate Window"),
             isOn: $enableMouseScrollingForTDKCandidatesCocoa
@@ -191,7 +200,8 @@ struct VwrPrefPaneCandidates: View {
           Text(
             "By checking this, Tadokoro Candidate Window will use SwiftUI. SwiftUI was being used in vChewing 3.3.8 and before. However, SwiftUI has unacceptable responsiveness & latency & efficiency problems in rendering the candidate panel UI. That's why a refactored version has been introduced since vChewing 3.3.9 using Cocoa, providing an optimized user experience with blasing-fast operation responsiveness, plus experimental mouse-wheel support.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
       }
     }
@@ -244,14 +254,16 @@ private struct VwrPrefPaneCandidates_SelectionKeys: View {
           "⚠︎ This feature in IMK Candidate Window defects. Please consult\nApple Developer Relations with Radar ID: #FB11300759."
         )
       )
-      .preferenceDescription()
+
+      .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
     } else {
       Text(
         "Choose or hit Enter to confim your prefered keys for selecting candidates.".localized
           + "\n"
           + "This will also affect the row / column capacity of the candidate window.".localized
       )
-      .preferenceDescription()
+
+      .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
     }
   }
 }

Source/Modules/UIModules/PrefUI/VwrPrefPaneCassette.swift

@@ -40,10 +40,10 @@ struct VwrPrefPaneCassette: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
         // MARK: - Cassette Data Path Management
 
-        SSPreferences.Section(bottomDivider: true) {
+        SSPreferences.Settings.Section(bottomDivider: true) {
           Text(LocalizedStringKey("Choose your desired cassette file path. Will be omitted if invalid."))
           HStack {
             TextField(fdrCassetteDataDefault, text: $cassettePath).disabled(true)
@@ -121,12 +121,13 @@ struct VwrPrefPaneCassette: View {
               "Cassette mode is similar to the CIN support of the Yahoo Kimo IME, allowing users to use their own CIN tables to implement their stroked-based input schema (e.g. Wubi, Cangjie, Boshiamy, etc.) as a plan-B in vChewing IME. However, since vChewing won't compromise its phonabet input mode experience for this cassette mode, users might not feel comfortable enough comparing to their experiences with RIME (recommended) or OpenVanilla (deprecated)."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
 
         // MARK: - Something Else
 
-        SSPreferences.Section {
+        SSPreferences.Settings.Section {
           Toggle(
             LocalizedStringKey("Auto-composite when the longest possible key is formed"),
             isOn: $autoCompositeWithLongestPossibleCassetteKey
@@ -140,7 +141,8 @@ struct VwrPrefPaneCassette: View {
               "All strokes in the composition buffer will be shown as ASCII keyboard characters unless this option is enabled. Stroke is definable in the “%keyname” section of the CIN file."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           Picker(
             "",
             selection: $forceCassetteChineseConversion
@@ -157,11 +159,12 @@ struct VwrPrefPaneCassette: View {
               "This conversion only affects the cassette module, converting typed contents to either Simplified Chinese or Traditional Chinese in accordance with this setting and your current input mode."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneDevZone.swift

@@ -26,8 +26,8 @@ struct VwrPrefPaneDevZone: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section(bottomDivider: true) {
+        SSPreferences.Settings.Section(bottomDivider: true) {
           Text(
             LocalizedStringKey(
               "Warning: This page is for testing future features. \nFeatures listed here may not work as expected.")
@@ -36,7 +36,8 @@ struct VwrPrefPaneDevZone: View {
           Divider()
           HStack {
             Text("Some previous options are moved to other tabs.".localized)
-              .preferenceDescription()
+
+              .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           }
           Toggle(
             "Disable segmented thick underline in marking mode for managed clients".localized,
@@ -45,11 +46,12 @@ struct VwrPrefPaneDevZone: View {
           Text(
             "Some clients with web-based front UI may have issues rendering segmented thick underlines drawn by their implemented “setMarkedText()”. This option stops the input method from delivering segmented thick underlines to “client().setMarkedText()”. Note that segmented thick underlines are only used in marking mode, unless the client itself misimplements the IMKTextInput method “setMarkedText()”. This option only affects the inline composition buffer.".localized
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneDictionary.swift

@@ -53,10 +53,10 @@ struct VwrPrefPaneDictionary: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
         // MARK: - User Data Folder Path Management
 
-        SSPreferences.Section(bottomDivider: true) {
+        SSPreferences.Settings.Section(bottomDivider: true) {
           Group {
             Text(LocalizedStringKey("Choose your desired user data folder path. Will be omitted if invalid."))
             HStack {
@@ -125,7 +125,8 @@ struct VwrPrefPaneDictionary: View {
                 "Due to security concerns, we don't consider implementing anything related to shell script execution here. An input method doing this without implementing App Sandbox will definitely have system-wide vulnerabilities, considering that its related UserDefaults are easily tamperable to execute malicious shell scripts. vChewing is designed to be invulnerable from this kind of attack. Also, official releases of vChewing are Sandboxed."
               )
             )
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           }
           Divider()
           Group {
@@ -140,7 +141,8 @@ struct VwrPrefPaneDictionary: View {
                 "This will use the plist files deployed by the “make install” command from libvChewing-Data if possible."
               )
             )
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
             Toggle(
               LocalizedStringKey("Only load factory language models if needed"),
               isOn: $onlyLoadFactoryLangModelsIfNeeded.onChange {
@@ -166,7 +168,8 @@ struct VwrPrefPaneDictionary: View {
             Text(
               "The user override model only possesses memories temporarily. Each memory record gradually becomes ineffective within approximately less than 6 days. You can erase all memory records through the input method menu.".localized
             )
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
             Toggle(
               LocalizedStringKey("Enable phrase replacement table"),
               isOn: $phraseReplacementEnabled.onChange {
@@ -176,7 +179,8 @@ struct VwrPrefPaneDictionary: View {
                 }
               }
             )
-            Text("This will batch-replace specified candidates.".localized).preferenceDescription()
+            Text("This will batch-replace specified candidates.".localized)
+              .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           }
           Divider()
           Group {
@@ -189,12 +193,13 @@ struct VwrPrefPaneDictionary: View {
                 "⚠︎ This may hinder the walking algorithm from giving appropriate results."
               )
             )
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           }
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneGeneral.swift

@@ -70,8 +70,8 @@ struct VwrPrefPaneGeneral: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section {
+        SSPreferences.Settings.Section {
           Text(
             "\u{2022} "
               + NSLocalizedString(
@@ -83,9 +83,10 @@ struct VwrPrefPaneGeneral: View {
                 comment: ""
               )
           )
-          .preferenceDescription().padding(.bottom, NSFont.systemFontSize)
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth).padding(.bottom, NSFont.systemFontSize)
         }
-        SSPreferences.Section(title: "UI Language:".localized) {
+        SSPreferences.Settings.Section(title: "UI Language:".localized) {
           HStack {
             Picker(
               LocalizedStringKey("Follow OS settings"),
@@ -102,9 +103,10 @@ struct VwrPrefPaneGeneral: View {
             Spacer()
           }
           Text(LocalizedStringKey("Change user interface language (will reboot the IME)."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(label: { Text(LocalizedStringKey("Typing Settings:")) }) {
+        SSPreferences.Settings.Section(label: { Text(LocalizedStringKey("Typing Settings:")) }) {
           Toggle(
             LocalizedStringKey("Automatically correct reading combinations when typing"),
             isOn: $autoCorrectReadingCombination
@@ -129,7 +131,8 @@ struct VwrPrefPaneGeneral: View {
             }
           )
           Text(LocalizedStringKey("An accommodation for elder computer users."))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
           if Date.isTodayTheDate(from: 0401) {
             Toggle(
               LocalizedStringKey("Stop farting (when typed phonetic combination is invalid, etc.)"),
@@ -167,7 +170,7 @@ struct VwrPrefPaneGeneral: View {
             )
           }
         }
-        SSPreferences.Section(label: { Text(LocalizedStringKey("Misc Settings:")).controlSize(.small) }) {
+        SSPreferences.Settings.Section(label: { Text(LocalizedStringKey("Misc Settings:")).controlSize(.small) }) {
           Toggle(
             LocalizedStringKey("Check for updates automatically"),
             isOn: $checkUpdateAutomatically
@@ -181,7 +184,7 @@ struct VwrPrefPaneGeneral: View {
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneKeyboard.swift

@@ -36,8 +36,8 @@ struct VwrPrefPaneKeyboard: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section(title: "Quick Setup:".localized) {
+        SSPreferences.Settings.Section(title: "Quick Setup:".localized) {
           HStack(alignment: .top) {
             Button {
               keyboardParser = 0
@@ -59,7 +59,7 @@ struct VwrPrefPaneKeyboard: View {
             }
           }.controlSize(.small)
         }
-        SSPreferences.Section(title: "Phonetic Parser:".localized) {
+        SSPreferences.Settings.Section(title: "Phonetic Parser:".localized) {
           HStack {
             Picker(
               "",
@@ -75,9 +75,10 @@ struct VwrPrefPaneKeyboard: View {
             Spacer(minLength: NSFont.systemFontSize)
           }
           Text(NSLocalizedString("Choose the phonetic layout for Mandarin parser.", comment: ""))
-            .preferenceDescription()
+
+            .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Basic Keyboard Layout:".localized) {
+        SSPreferences.Settings.Section(title: "Basic Keyboard Layout:".localized) {
           HStack {
             Picker(
               "",
@@ -101,9 +102,10 @@ struct VwrPrefPaneKeyboard: View {
               comment: ""
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Alphanumerical Layout:".localized) {
+        SSPreferences.Settings.Section(title: "Alphanumerical Layout:".localized) {
           HStack {
             Picker(
               "",
@@ -124,14 +126,15 @@ struct VwrPrefPaneKeyboard: View {
               comment: ""
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
-        SSPreferences.Section(title: "Keyboard Shortcuts:".localized) {
+        SSPreferences.Settings.Section(title: "Keyboard Shortcuts:".localized) {
           VwrPrefPaneKeyboard_KeyboardShortcuts()
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPaneOutput.swift

@@ -35,34 +35,36 @@ struct VwrPrefPaneOutput: View {
 
   var body: some View {
     ScrollView {
-      SSPreferences.Container(contentWidth: CtlPrefUIShared.contentWidth) {
+      SSPreferences.Settings.Container(contentWidth: CtlPrefUIShared.contentWidth) {
-        SSPreferences.Section(title: "Output Settings:".localized, bottomDivider: true) {
+        SSPreferences.Settings.Section(title: "Output Settings:".localized, bottomDivider: true) {
-          Toggle(
+          VStack(alignment: .leading) {
-            LocalizedStringKey("Auto-convert traditional Chinese glyphs to KangXi characters"),
+            Toggle(
-            isOn: $chineseConversionEnabled.onChange {
+              LocalizedStringKey("Auto-convert traditional Chinese glyphs to KangXi characters"),
-              if chineseConversionEnabled, shiftJISShinjitaiOutputEnabled {
+              isOn: $chineseConversionEnabled.onChange {
-                shiftJISShinjitaiOutputEnabled = false
+                if chineseConversionEnabled, shiftJISShinjitaiOutputEnabled {
+                  shiftJISShinjitaiOutputEnabled = false
+                }
               }
-            }
+            )
-          )
+            Toggle(
-          Toggle(
+              LocalizedStringKey("Auto-convert traditional Chinese glyphs to JIS Shinjitai characters"),
-            LocalizedStringKey("Auto-convert traditional Chinese glyphs to JIS Shinjitai characters"),
+              isOn: $shiftJISShinjitaiOutputEnabled.onChange {
-            isOn: $shiftJISShinjitaiOutputEnabled.onChange {
+                if chineseConversionEnabled, shiftJISShinjitaiOutputEnabled {
-              if chineseConversionEnabled, shiftJISShinjitaiOutputEnabled {
+                  chineseConversionEnabled = false
-                chineseConversionEnabled = false
+                }
               }
-            }
+            )
-          )
+            Toggle(
-          Toggle(
+              LocalizedStringKey("Commit Hanyu-Pinyin instead on Ctrl(+Option)+Command+Enter"),
-            LocalizedStringKey("Commit Hanyu-Pinyin instead on Ctrl(+Option)+Command+Enter"),
+              isOn: $inlineDumpPinyinInLieuOfZhuyin
-            isOn: $inlineDumpPinyinInLieuOfZhuyin
+            )
-          )
+            Toggle(
-          Toggle(
+              LocalizedStringKey("Trim unfinished readings / strokes on commit"),
-            LocalizedStringKey("Trim unfinished readings / strokes on commit"),
+              isOn: $trimUnfinishedReadingsOnCommit
-            isOn: $trimUnfinishedReadingsOnCommit
+            )
-          )
+          }
         }
-        SSPreferences.Section(title: "Experimental:".localized) {
+        SSPreferences.Settings.Section(title: "Experimental:".localized) {
           Toggle(
             LocalizedStringKey("Harden vertical punctuations during vertical typing (not recommended)"),
             isOn: $hardenVerticalPunctuations
@@ -72,11 +74,12 @@ struct VwrPrefPaneOutput: View {
               "⚠︎ This feature is useful ONLY WHEN the font you are using doesn't support dynamic vertical punctuations. However, typed vertical punctuations will always shown as vertical punctuations EVEN IF your editor has changed the typing direction to horizontal."
             )
           )
-          .preferenceDescription()
+
+          .preferenceDescription(maxWidth: CtlPrefUIShared.maxDescriptionWidth)
         }
       }
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }
 

Source/Modules/UIModules/PrefUI/VwrPrefPanePhrases.swift

@@ -23,7 +23,7 @@ struct VwrPrefPanePhrases: View {
       }
       .padding()
     }
-    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight).fixedSize(horizontal: false, vertical: true)
+    .frame(maxHeight: CtlPrefUIShared.contentMaxHeight)
   }
 }