1
0
Fork 0
freesewing/packages/react/components/Editor/lib/ui-preferences.mjs
2025-01-25 17:56:15 +01:00

117 lines
3.2 KiB
JavaScript

import React from 'react'
import { defaultConfig } from '../config/index.mjs'
import {
MenuIcon,
KioskIcon,
RotateIcon,
RocketIcon,
UxIcon,
} from '@freesewing/react/components/Icon'
export function menuUiPreferencesStructure() {
const uiUx = defaultConfig.uxLevels.ui
const uiPreferences = {
ux: {
dense: true,
title: 'User Experience',
about: 'Controls the user experience, from keep it simple, to give me all the powers',
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,
},
/*
aside: {
title: 'Aside Menu',
about: 'Whether or not to display the aside menu',
ux: uiUx.aside,
list: [0, 1],
choiceTitles: {
0: 'Display the aside menu',
1: 'Hide the aside menu',
},
choiceDescriptions: {
0: 'Displays the Design Options, Core Settings, and UI Preferences menu on the side of the screen (not on mobile).',
1: 'Uses the entire screen size for your pattern, providing access to the Design Options, Core Settings, and UI Preferences through the header navigation only.',
},
dflt: 1,
icon: MenuIcon,
},
kiosk: {
title: 'Kiosk View',
about: 'Whether or not to hide the header and footer',
ux: uiUx.kiosk,
list: [0, 1],
choiceTitles: {
0: 'pe:websiteMode',
1: 'pe:kioskMode',
},
choiceDescriptions: {
0: 'pe:noAside',
1: 'pe:withAside',
},
dflt: 0,
icon: KioskIcon,
},
*/
rotate: {
dense: true,
title: 'Rotate Pattern',
about: 'Allows you to rotate your pattern 90 degrees, handy for tall patterns',
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',
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
}