Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(core): facelift #4927

Merged
merged 163 commits into from
Dec 19, 2023
Merged

feat(core): facelift #4927

merged 163 commits into from
Dec 19, 2023

Conversation

robinpyon
Copy link
Contributor

@robinpyon robinpyon commented Sep 13, 2023

Key objectives

  • Refresh our studio colour palette and bring it inline with modern tooling
  • Simplify and reduce elements where possible – mask the complexity inherent in our current pane navigation paradigm
  • A focus on adding calmness to our interface – not only by reducing unnecessary elements – but also other micro-optimisations that can limit what’s on screen (delayed tooltips, animated dialogs and field actions)
  • Carrying on from this, making the document editor feel a little less crowded and making document panes feel like user destinations
  • A huge focus on consistency – not only in styling but also interactivity too. Having multiple lockups / variations of common UI elements makes our interface feel unstable.
  • Provide simple and opinionated components for our internal developers that can help reduce the amount of layout boilerplate
Screenshot 2023-12-14 at 17 00 03

Notable changes

Updated default colour themes

These new themes for both light and dark modes provide added vibrancy to existing tones.

Application of these colours within the studio are indexed towards reducing visual noise – enforcing key buttons and editable surfaces stand out, whilst visual dividers recede further into the background.

New major version of Sanity UI (to be released)

  • makes minor visual tweaks to our core primitives and components
  • provides more sensible defaults
  • adds delight to some core components with simple animation
  • overhauls our current theming engine and paves the way for a simpler theming API surface in future

Updated Studio Typography

  • Inter font will be the new default font.

New Workspace menu / home button

We now clearly signpost the current workspace a user is in – critical for larger studios.
As a result of this change, users will no longer be able to specify custom logos that always appear independently of the current workspace

Sanity branding for simpler studios without customisation

Studios with a single workspace will now show a Sanity logo by default
Screenshot 2023-12-14 at 17 03 48

Updated navigation

A compact preview style has been added which not only reduces visual noise when browsing document lists, but also helps users differentiate between documents and structure folders

Screenshot 2023-12-14 at 17 05 40

Updated form document layout

  • Document forms now enjoy more spacing and have a dedicated large title (which uses the document preview value) to make these panes stand out more as destinations for editors.
  • The footer has been simplified with more human readable dates to better indicate published status
Screenshot 2023-12-14 at 17 06 45

Studio UI Components

Highly opinionated components packed with most common use cases 💥

Highly opinionated Sanity UI components with restrict many (if not all) styling props, and help avoid often-repeated boilerplate in common scenarios and force consistency.
Currently located in packages/sanity/src/ui/*

Pre and post of a button with a tooltip
Screenshot 2023-12-14 at 17 09 55

no-restricted-imports

Encourages import of opinionated versions of the “full flat” sanity ui components. Enforcing consistency and ease of use

Screenshot 2023-12-14 at 17 10 57

Common components

Commonly used components have been abstracted out to aid with consistency (and simplify i18n translation)

Deprecations

Studio configuration

studio.components.logo
Custom logo components are no longer rendered.
Users are encouraged to provide custom components for individual workspace icons instead.

Tool API

icon
Custom tool icons are no longer rendered.

Structure builder

menuItemGroup.title
Menu item groups are no longer displayed, but these can still be defined.

I18n keys

Migration

  • This work will land in a minor studio release and major Sanity UI release
  • Users with custom logos who wish to continue displaying them will need to reformat them to fit within workspace icons.
  • Third party plugins will need to update to Sanity UI v2 in order to take advantage of updated styles.
  • Those which don’t will continue to work, but will look out of place until updated

@vercel
Copy link

vercel bot commented Sep 13, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
performance-studio ✅ Ready (Inspect) Visit Preview Dec 19, 2023 7:07pm
test-studio ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 19, 2023 7:07pm
1 Ignored Deployment
Name Status Preview Comments Updated (UTC)
studio-workshop ⬜️ Ignored (Inspect) Visit Preview Dec 19, 2023 7:07pm

@github-actions
Copy link
Contributor

github-actions bot commented Sep 13, 2023

Package Documentation Change
sanity +8%
@sanity/portable-text-editor +5%
sanity/desk +2%
@sanity/diff -55%
Full Report
sanity
This branch Next branch
189 documented 176 documented
856 not documented 846 not documented
@sanity/portable-text-editor
This branch Next branch
21 documented 20 documented
44 not documented 45 not documented
sanity/desk
This branch Next branch
86 documented 85 documented
60 not documented 60 not documented
@sanity/block-tools
This branch Next branch
4 documented 4 documented
9 not documented 9 not documented
@sanity/types
This branch Next branch
54 documented 54 documented
235 not documented 235 not documented
@sanity/mutator
This branch Next branch
7 documented 7 documented
4 not documented 4 not documented
@sanity/cli
This branch Next branch
1 documented 1 documented
31 not documented 31 not documented
@sanity/schema/_internal
This branch Next branch
0 documented 0 documented
9 not documented 9 not documented
@sanity/util/paths
This branch Next branch
1 documented 1 documented
15 not documented 15 not documented
sanity/router
This branch Next branch
17 documented 17 documented
26 not documented 26 not documented
@sanity/util/legacyDateFormat
This branch Next branch
0 documented 0 documented
3 not documented 3 not documented
@sanity/schema
This branch Next branch
0 documented 0 documented
2 not documented 2 not documented
sanity/cli
This branch Next branch
2 documented 2 documented
0 not documented 0 not documented
@sanity/vision
This branch Next branch
0 documented 0 documented
3 not documented 3 not documented
@sanity/util/fs
This branch Next branch
0 documented 0 documented
3 not documented 3 not documented
sanity/_internal
This branch Next branch
0 documented 0 documented
1 not documented 1 not documented
@sanity/util/content
This branch Next branch
1 documented 1 documented
5 not documented 5 not documented
@sanity/diff
This branch Next branch
13 documented 29 documented
16 not documented 0 not documented

@github-actions
Copy link
Contributor

github-actions bot commented Sep 13, 2023

Component Testing Report Updated Dec 19, 2023 7:11 PM (UTC)

File Status Duration Passed Skipped Failed
comments/CommentInput.spec.tsx ✅ Passed (Inspect) 33s 15 0 0
formBuilder/ArrayInput.spec.tsx ✅ Passed (Inspect) 6s 3 0 0
formBuilder/inputs/PortableText/Annotations.spec.tsx ✅ Passed (Inspect) 13s 3 0 0
formBuilder/inputs/PortableText/Decorators.spec.tsx ✅ Passed (Inspect) 12s 6 0 0
formBuilder/inputs/PortableText/FocusTracking.spec.tsx ✅ Passed (Inspect) 32s 15 0 0
formBuilder/inputs/PortableText/Input.spec.tsx ✅ Passed (Inspect) 18s 9 0 0
formBuilder/inputs/PortableText/ObjectBlock.spec.tsx ✅ Passed (Inspect) 1m 0s 18 0 0
formBuilder/inputs/PortableText/Styles.spec.tsx ✅ Passed (Inspect) 13s 6 0 0
formBuilder/inputs/PortableText/Toolbar.spec.tsx ✅ Passed (Inspect) 6s 3 0 0

@bjoerge bjoerge force-pushed the next branch 2 times, most recently from e7bf4c3 to 4151f2e Compare October 9, 2023 11:02
@robinpyon robinpyon force-pushed the feat/facelift-mvi-2 branch from bf3df9a to 8e7242b Compare October 10, 2023 11:41
@socket-security
Copy link

socket-security bot commented Oct 10, 2023

New dependencies detected. Learn more about Socket for GitHub ↗︎

Packages Version New capabilities Transitives Size Publisher
@sanity/color 3.0.0-beta.9 None +0 180 kB mariuslundgard
@sanity/ui 2.0.0-beta.13 None +40 8.42 MB sanity-io

@robinpyon robinpyon force-pushed the feat/facelift-mvi-2 branch from 8e7242b to c9809ea Compare October 11, 2023 11:46
@robinpyon robinpyon force-pushed the feat/facelift-mvi-2 branch from c9809ea to 0891a4c Compare October 13, 2023 09:06
pedrobonamin and others added 24 commits December 19, 2023 10:57
* fix(core): fields actions position shift

* fix(core): push the presence box when focus on fieldActions and in touch devices
* fix(core/tests): fix failing tests

* fix(tests): wait until settled in pte test

* fix(tests): update snapshot

---------

Co-authored-by: Pedro Bonamin <[email protected]>
* chore(colocation): move SpacerButton to desk/components

* chore(colocation): move DocumentStatusIndicator to core/components

* chore(colocation): move LoadingBlock  to core/components

* chore(colocation): move DocumentStatus to core/components

* chore(colocation): move ContextMenuButton to core/components

* chore(colocation): move ui-components to core, reexport as sanity/ui-components

* chore(colocation): rename sanity/src/ui  to sanity/src/ui-components

* chore(colocation): update imports for TOOLTIP_DELAY_PROPS

* fix(tests): update breaking test
@rexxars rexxars force-pushed the feat/facelift-mvi-2 branch from f3e3ebf to 20e617e Compare December 19, 2023 19:01
@rexxars rexxars merged commit 6a29b6a into next Dec 19, 2023
19 of 20 checks passed
@rexxars rexxars deleted the feat/facelift-mvi-2 branch December 19, 2023 19:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants