Command bar: add extrude command, nonlinear editing, etc (#1204)

* Tweak toaster look and feel * Add icons, tweak plus icon names * Rename commandBarMeta to commandBarConfig * Refactor command bar, add support for icons * Create a tailwind plugin for aria-pressed button state * Remove overlay from behind command bar * Clean up toolbar * Button and other style tweaks * Icon tweaks follow-up: make old icons work with new sizing * Delete unused static icons * More CSS tweaks * Small CSS tweak to project sidebar * Add command bar E2E test * fumpt * A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu) * fix typo in a comment * Fix icon padding (built version only) * Update onboarding and warning banner icons padding * Misc minor style fixes * Get Extrude opening and canceling from command bar * Iconography tweaks * Get extrude kind of working * Refactor command bar config types and organization * Move command bar configs to be co-located with each other * Start building a state machine for the command bar * Start converting command bar to state machine * Add support for multiple args, confirmation step * Submission behavior, hotkeys, code organization * Add new test for extruding from command bar * Polish step back and selection hotkeys, CSS tweaks * Loading style tweaks * Validate selection inputs, polish UX of args re-editing * Prevent submission with multiple selection on singlular arg * Remove stray console logs * Tweak test, CSS nit, remove extrude "result" argument * Fix linting warnings * Show Ctrl+/ instead of ⌘K on all platforms but Mac * A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu) * Add "Enter sketch" to command bar * fix command bar test * Fix flaky cmd bar extrude test by waiting for engine select response * Cover both button labels '⌘K' and 'Ctrl+/' in test --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
2023-12-13 12:49:01 -05:00
parent b01357b49e
commit d2535bb8c2
60 changed files with 4549 additions and 1939 deletions
--- a/src/lib/commandBarConfigs/settingsCommandConfig.ts
+++ b/src/lib/commandBarConfigs/settingsCommandConfig.ts
@ -0,0 +1,141 @@
+import { CommandSetConfig } from '../commandTypes'
+import {
+  BaseUnit,
+  Toggle,
+  UnitSystem,
+  baseUnitsUnion,
+  settingsMachine,
+} from 'machines/settingsMachine'
+import { CameraSystem, cameraSystems } from '../cameraControls'
+import { Themes } from '../theme'
+
+// SETTINGS MACHINE
+export type SettingsCommandSchema = {
+  'Set Base Unit': {
+    baseUnit: BaseUnit
+  }
+  'Set Camera Controls': {
+    cameraControls: CameraSystem
+  }
+  'Set Default Project Name': {
+    defaultProjectName: string
+  }
+  'Set Text Wrapping': {
+    textWrapping: Toggle
+  }
+  'Set Theme': {
+    theme: Themes
+  }
+  'Set Unit System': {
+    unitSystem: UnitSystem
+  }
+}
+
+export const settingsCommandBarConfig: CommandSetConfig<
+  typeof settingsMachine,
+  SettingsCommandSchema
+> = {
+  'Set Base Unit': {
+    icon: 'gear',
+    args: {
+      baseUnit: {
+        inputType: 'options',
+        required: true,
+        defaultValue: (context) => context.baseUnit,
+        options: (context) =>
+          Object.values(baseUnitsUnion).map((v) => ({
+            name: v,
+            value: v,
+            isCurrent: v === context.baseUnit,
+          })),
+      },
+    },
+  },
+  'Set Camera Controls': {
+    icon: 'gear',
+    args: {
+      cameraControls: {
+        inputType: 'options',
+        required: true,
+        defaultValue: (context) => context.cameraControls,
+        options: (context) =>
+          Object.values(cameraSystems).map((v) => ({
+            name: v,
+            value: v,
+            isCurrent: v === context.cameraControls,
+          })),
+      },
+    },
+  },
+  'Set Default Project Name': {
+    icon: 'gear',
+    hide: 'web',
+    args: {
+      defaultProjectName: {
+        inputType: 'string',
+        required: true,
+        defaultValue: (context) => context.defaultProjectName,
+      },
+    },
+  },
+  'Set Text Wrapping': {
+    icon: 'gear',
+    args: {
+      textWrapping: {
+        inputType: 'options',
+        required: true,
+        defaultValue: (context) => context.textWrapping,
+        options: (context) => [
+          {
+            name: 'On',
+            value: 'On' as Toggle,
+            isCurrent: context.textWrapping === 'On',
+          },
+          {
+            name: 'Off',
+            value: 'Off' as Toggle,
+            isCurrent: context.textWrapping === 'Off',
+          },
+        ],
+      },
+    },
+  },
+  'Set Theme': {
+    icon: 'gear',
+    args: {
+      theme: {
+        inputType: 'options',
+        required: true,
+        defaultValue: (context) => context.theme,
+        options: (context) =>
+          Object.values(Themes).map((v) => ({
+            name: v,
+            value: v,
+            isCurrent: v === context.theme,
+          })),
+      },
+    },
+  },
+  'Set Unit System': {
+    icon: 'gear',
+    args: {
+      unitSystem: {
+        inputType: 'options',
+        required: true,
+        defaultValue: (context) => context.unitSystem,
+        options: (context) => [
+          {
+            name: 'Imperial',
+            value: 'imperial' as UnitSystem,
+            isCurrent: context.unitSystem === 'imperial',
+          },
+          {
+            name: 'Metric',
+            value: 'metric' as UnitSystem,
+            isCurrent: context.unitSystem === 'metric',
+          },
+        ],
+      },
+    },
+  },
+}