[breaking]: FreeSewing v4 (#7297)

Refer to the CHANGELOG for all info.

---------

Co-authored-by: Wouter van Wageningen <wouter.vdub@yahoo.com>
Co-authored-by: Josh Munic <jpmunic@gmail.com>
Co-authored-by: Jonathan Haas <haasjona@gmail.com>

packages/react/components/Editor/lib/ui-preferences.mjs

@@ -0,0 +1,119 @@
+import React from 'react'
+import { defaultConfig } from '../config/index.mjs'
+import { linkClasses } from '@freesewing/utils'
+import { AsideIcon, RotateIcon, RocketIcon, UxIcon } from '@freesewing/react/components/Icon'
+
+const UiDocsLink = ({ item }) => (
+  <a href={`/docs/about/site/draft/#${item.toLowerCase()}`} className={`${linkClasses} tw-px-2`}>
+    Learn more
+  </a>
+)
+
+export function menuUiPreferencesStructure() {
+  const uiUx = defaultConfig.uxLevels.ui
+  const uiPreferences = {
+    aside: {
+      dense: true,
+      title: 'Show side menu',
+      about: (
+        <span>
+          Uses the right side of the screen for the Design Options, Core Settings, and UI
+          Preferences menus.
+          <UiDocsLink item="aside" />
+        </span>
+      ),
+      ux: uiUx.aside,
+      list: [0, 1],
+      choiceTitles: {
+        0: 'Do not show the side menu',
+        1: 'Show the side menu',
+      },
+      dflt: 0,
+      icon: AsideIcon,
+    },
+    ux: {
+      dense: true,
+      title: 'User Experience',
+      about: (
+        <span>
+          Controls the user experience, from keep it simple, to give me all the powers.
+          <UiDocsLink item="control" />
+        </span>
+      ),
+      ux: uiUx.ux,
+      emoji: '🖥️',
+      list: [1, 2, 3, 4, 5],
+      choiceTitles: {
+        1: 'Keep it as simple as possible',
+        2: 'Keep it simple, but not too simple',
+        3: 'Balance simplicity with power',
+        4: 'Give me all powers, but keep me safe',
+        5: 'Get out of my way',
+      },
+      _choiceDescriptions: {
+        1: 'Hides all but the most crucial features.',
+        2: 'Hides most of the advanced features.',
+        3: 'Reveals the majority of advanced features, but not all of them.',
+        4: 'Reveals all advanced features, keeps handrails and safety checks.',
+        5: 'Reveals all advanced features, removes handrails and safety checks.',
+      },
+      icon: UxIcon,
+      dflt: defaultConfig.defaultUx,
+    },
+    rotate: {
+      dense: true,
+      title: 'Rotate Pattern',
+      about: (
+        <span>
+          Allows you to rotate your pattern 90 degrees, handy for tall patterns.
+          <UiDocsLink item="rotate" />
+        </span>
+      ),
+      ux: uiUx.rotate,
+      list: [0, 1],
+      choiceTitles: {
+        0: 'Do not rotate the pattern',
+        1: 'Rotate the pattern 90 degrees',
+      },
+      dflt: 0,
+      icon: RotateIcon,
+    },
+    renderer: {
+      dense: true,
+      title: 'Pattern render engine',
+      about: 'Change the way the pattern is rendered on screen',
+      about: (
+        <span>
+          Change the underlying method for rendering the pattern on screen.
+          <UiDocsLink item="renderer" />
+        </span>
+      ),
+      ux: uiUx.renderer,
+      list: ['react', 'svg'],
+      choiceTitles: {
+        react: (
+          <span>
+            Render using <em>@freesewing/react</em>
+          </span>
+        ),
+        svg: (
+          <span>
+            Render using <em>@freesewing/core</em>
+          </span>
+        ),
+      },
+      choiceDescriptions: {
+        0: 'pe:noAside',
+        1: 'pe:withAside',
+      },
+      valueTitles: {
+        react: 'React',
+        svg: 'Core',
+      },
+      dflt: 'react',
+      icon: RocketIcon,
+    },
+  }
+
+  return uiPreferences
+}