@sanity/ui 3.0.0-static.9 → 3.0.0

package/exports/_visual-editing.ts

@@ -2,30 +2,30 @@
  * These are internal exports for usage in `@sanity/visual-editing` and `@sanity/insert-menu`,
  * which are used in environments where the regular `@sanity/ui` export is far too heavy due to imports from refractor and more.
  */
-export {studioTheme} from '../src/ui/_compat'
-export {ThemeProvider, type ThemeProviderProps} from '../src/ui/_compat/theme/themeProvider'
-export {useTheme_v2} from '../src/ui/_compat/theme/useTheme'
-export {Hotkeys, type HotkeysProps} from '../src/ui/components/hotkeys/hotkeys'
-export {Menu, type MenuProps} from '../src/ui/components/menu/menu'
-export {MenuDivider} from '../src/ui/components/menu/menuDivider'
-export {MenuGroup, type MenuGroupProps} from '../src/ui/components/menu/menuGroup'
-export {MenuItem, type MenuItemProps} from '../src/ui/components/menu/menuItem'
-export {Tab, type TabProps} from '../src/ui/components/tab/tab'
-export {TabList, type TabListProps} from '../src/ui/components/tab/tabList'
-export {isHTMLAnchorElement, isHTMLElement} from '../src/ui/helpers/element'
-export {usePrefersDark} from '../src/ui/hooks/usePrefersDark'
-export {Box, type BoxProps} from '../src/ui/primitives/box/box'
-export {Button, type ButtonProps} from '../src/ui/primitives/button/button'
-export {Card, type CardProps} from '../src/ui/primitives/card/card'
-export {Flex, type FlexProps} from '../src/ui/primitives/flex/flex'
-export {Grid, type GridProps} from '../src/ui/primitives/grid/grid'
-export {Popover, type PopoverProps} from '../src/ui/primitives/popover/popover'
-export {Spinner, type SpinnerProps} from '../src/ui/primitives/spinner/spinner'
-export {Stack, type StackProps} from '../src/ui/primitives/stack/stack'
-export {Text, type TextProps} from '../src/ui/primitives/text/text'
-export {TextInput, type TextInputProps} from '../src/ui/primitives/textInput/textInput'
-export {Tooltip, type TooltipProps} from '../src/ui/primitives/tooltip/tooltip'
-export type {PopoverMargins} from '../src/ui/types/popover'
-export {LayerProvider} from '../src/ui/utils/layer/layerProvider'
-export {Portal, type PortalProps} from '../src/ui/utils/portal/portal'
-export {PortalProvider, type PortalProviderProps} from '../src/ui/utils/portal/portalProvider'
+export {studioTheme} from '../src/core/_compat'
+export {Hotkeys} from '../src/core/components/hotkeys/hotkeys'
+export {Menu} from '../src/core/components/menu/menu'
+export {MenuDivider} from '../src/core/components/menu/menuDivider'
+export {MenuGroup} from '../src/core/components/menu/menuGroup'
+export {MenuItem, type MenuItemProps} from '../src/core/components/menu/menuItem'
+export {Tab} from '../src/core/components/tab/tab'
+export {TabList} from '../src/core/components/tab/tabList'
+export {isHTMLAnchorElement, isHTMLElement} from '../src/core/helpers/element'
+export {usePrefersDark} from '../src/core/hooks/usePrefersDark'
+export {Box} from '../src/core/primitives/box/box'
+export {Button} from '../src/core/primitives/button/button'
+export {Card} from '../src/core/primitives/card/card'
+export {Flex} from '../src/core/primitives/flex/flex'
+export {Grid} from '../src/core/primitives/grid/grid'
+export {Popover} from '../src/core/primitives/popover/popover'
+export {Spinner} from '../src/core/primitives/spinner/spinner'
+export {Stack} from '../src/core/primitives/stack/stack'
+export {Text} from '../src/core/primitives/text/text'
+export {TextInput} from '../src/core/primitives/textInput/textInput'
+export {Tooltip} from '../src/core/primitives/tooltip/tooltip'
+export {ThemeProvider} from '../src/core/theme/themeProvider'
+export {useTheme_v2} from '../src/core/theme/useTheme'
+export type {PopoverMargins} from '../src/core/types/popover'
+export {LayerProvider} from '../src/core/utils/layer/layerProvider'
+export {Portal} from '../src/core/utils/portal/portal'
+export {PortalProvider} from '../src/core/utils/portal/portalProvider'

package/exports/index.ts

@@ -1 +1 @@
-export * from '../src/ui'
+export * from '../src/core'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/ui",
-  "version": "3.0.0-static.9",
+  "version": "3.0.0",
   "keywords": [
     "sanity",
     "ui",
@@ -34,22 +34,13 @@
       "require": "./dist/_visual-editing.js",
       "default": "./dist/_visual-editing.js"
     },
-    "./css": {
-      "source": "./exports/css.ts",
-      "import": "./dist/css.mjs",
-      "require": "./dist/css.js",
-      "default": "./dist/css.js"
-    },
-    "./package.json": "./package.json",
     "./theme": {
       "source": "./exports/theme.ts",
       "import": "./dist/theme.mjs",
       "require": "./dist/theme.js",
       "default": "./dist/theme.js"
     },
-    "./sanity-palette.css": "./dist/sanity-palette.css",
-    "./sanity-theme.css": "./dist/sanity-theme.css",
-    "./system.css": "./dist/system.css"
+    "./package.json": "./package.json"
   },
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -59,23 +50,42 @@
       "_visual-editing": [
         "./dist/_visual-editing.d.ts"
       ],
-      "css": [
-        "./dist/css.d.ts"
-      ],
       "theme": [
         "./dist/theme.d.ts"
       ]
     }
   },
-  "bin": {
-    "ui": "./bin/ui.js"
-  },
   "files": [
-    "css.js",
     "dist",
     "exports",
     "src"
   ],
+  "scripts": {
+    "build": "run-s clean pkg:build pkg:check figma:pkg:build",
+    "clean": "rimraf .workshop dist",
+    "commit": "cz",
+    "cypress:dev": "run-p dev cypress:open",
+    "cypress:open": "cypress open",
+    "cypress:run": "cypress run",
+    "dev": "run-p storybook:dev workshop:dev",
+    "figma:pkg:build": "cd figma && pnpm build",
+    "format": "prettier --write --cache --ignore-unknown .",
+    "lint": "eslint .",
+    "prepack": "pnpm build",
+    "pkg:build": "pkg build --strict",
+    "pkg:check": "pkg --strict",
+    "prepare": "husky install",
+    "release": "semantic-release",
+    "storybook:build": "storybook build",
+    "storybook:dev": "storybook dev -p 6006",
+    "test": "jest",
+    "test:browser": "start-server-and-test 'run-s workshop:build workshop:start' http://localhost:1337 'run-s cypress:run'",
+    "ts:check": "tsc",
+    "watch": "pkg watch --strict",
+    "workshop:build": "workshop build",
+    "workshop:dev": "workshop dev",
+    "workshop:start": "http-server -a localhost -c-0 -p 1337 -s -P http://localhost:1337/index.html? dist"
+  },
   "commitlint": {
     "extends": [
       "@commitlint/config-conventional"
@@ -104,96 +114,93 @@
     "extends": "@sanity/semantic-release-preset"
   },
   "dependencies": {
-    "@floating-ui/react-dom": "^2.1.2",
+    "@floating-ui/react-dom": "^2.1.4",
     "@juggle/resize-observer": "^3.4.0",
     "@sanity/color": "^3.0.6",
-    "@sanity/icons": "^3.7.0",
+    "@sanity/icons": "^3.7.4",
     "csstype": "^3.1.3",
-    "framer-motion": "^12.9.7",
-    "react-compiler-runtime": "19.1.0-rc.1",
-    "react-refractor": "^2.2.0",
-    "use-effect-event": "^1.0.2"
+    "framer-motion": "^12.23.3",
+    "react-compiler-runtime": "19.1.0-rc.2",
+    "react-refractor": "^4.0.0",
+    "use-effect-event": "^2.0.2"
   },
   "devDependencies": {
-    "@babel/core": "^7.27.1",
-    "@babel/preset-env": "^7.27.1",
+    "@babel/core": "^7.28.0",
+    "@babel/preset-env": "^7.28.0",
     "@babel/preset-react": "^7.27.1",
     "@babel/preset-typescript": "^7.27.1",
-    "@commitlint/cli": "^19.8.0",
-    "@commitlint/config-conventional": "^19.8.0",
-    "@eslint/js": "^9.26.0",
-    "@rollup/plugin-replace": "^6.0.2",
-    "@sanity/pkg-utils": "^7.2.2",
-    "@sanity/prettier-config": "^1.0.3",
-    "@sanity/ui-workshop": "^2.1.3",
-    "@storybook/addon-a11y": "^8.6.12",
-    "@storybook/addon-docs": "^8.6.12",
-    "@storybook/addon-essentials": "^8.6.12",
-    "@storybook/addon-interactions": "^8.6.12",
-    "@storybook/addon-links": "^8.6.12",
-    "@storybook/addon-mdx-gfm": "^8.6.12",
-    "@storybook/addon-storysource": "^8.6.12",
-    "@storybook/addon-themes": "^8.6.12",
-    "@storybook/blocks": "^8.6.12",
-    "@storybook/manager-api": "^8.6.12",
-    "@storybook/react": "^8.6.12",
-    "@storybook/react-vite": "^8.6.12",
-    "@storybook/test": "^8.6.12",
-    "@storybook/theming": "^8.6.12",
+    "@commitlint/cli": "^19.8.1",
+    "@commitlint/config-conventional": "^19.8.1",
+    "@eslint/js": "^9.30.1",
+    "@sanity/pkg-utils": "^7.9.4",
+    "@sanity/prettier-config": "^2.0.0",
+    "@sanity/semantic-release-preset": "^5.0.0",
+    "@sanity/ui-workshop": "^2.1.5",
+    "@storybook/addon-a11y": "^8.6.14",
+    "@storybook/addon-docs": "^8.6.14",
+    "@storybook/addon-essentials": "^8.6.14",
+    "@storybook/addon-interactions": "^8.6.14",
+    "@storybook/addon-links": "^8.6.14",
+    "@storybook/addon-mdx-gfm": "^8.6.14",
+    "@storybook/addon-storysource": "^8.6.14",
+    "@storybook/addon-themes": "^8.6.14",
+    "@storybook/blocks": "^8.6.14",
+    "@storybook/manager-api": "^8.6.14",
+    "@storybook/react": "^8.6.14",
+    "@storybook/react-vite": "^8.6.14",
+    "@storybook/test": "^8.6.14",
+    "@storybook/theming": "^8.6.14",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@types/jest": "^29.5.14",
+    "@types/jest": "^30.0.0",
     "@types/jest-axe": "^3.5.9",
     "@types/node": "^20.12.7",
-    "@types/react": "^19.1.3",
-    "@types/react-dom": "^19.1.3",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
     "@types/react-is": "^19.0.0",
     "@types/refractor": "^3.4.1",
-    "@vitejs/plugin-react": "^4.4.1",
-    "babel-plugin-react-compiler": "19.1.0-rc.1",
-    "cac": "^6.7.14",
+    "@vitejs/plugin-react": "^4.6.0",
+    "babel-plugin-react-compiler": "19.1.0-rc.2",
+    "babel-plugin-styled-components": "^2.1.4",
     "commitizen": "^4.3.1",
     "cypress": "^13.17.0",
     "cypress-real-events": "^1.14.0",
     "cz-conventional-changelog": "^3.3.0",
-    "dotenv-flow": "^4.1.0",
-    "esbuild-register": "^3.6.0",
-    "eslint": "^9.26.0",
-    "eslint-config-prettier": "^10.1.2",
+    "eslint": "^9.30.1",
+    "eslint-config-prettier": "^10.1.5",
     "eslint-formatter-compact": "^8.40.0",
     "eslint-plugin-boundaries": "^5.0.1",
-    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "0.0.0-experimental-7a2c7045-20250506",
+    "eslint-plugin-react-hooks": "0.0.0-experimental-97cdd5d3-20250710",
     "eslint-plugin-react-refresh": "^0.4.20",
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "eslint-plugin-storybook": "^0.12.0",
-    "globals": "^16.0.0",
+    "globals": "^16.3.0",
     "http-server": "^14.1.1",
     "husky": "^8.0.3",
-    "jest": "^29.7.0",
+    "jest": "^30.0.4",
     "jest-axe": "^10.0.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "jest-environment-jsdom": "^30.0.4",
     "lint-staged": "^14.0.1",
-    "magic-string": "^0.30.17",
     "module-alias": "^2.2.3",
     "npm-run-all2": "^5.0.2",
-    "prettier": "^3.5.3",
+    "prettier": "^3.6.2",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-is": "^19.1.0",
-    "refractor": "^4.9.0",
+    "refractor": "^5.0.0",
     "rimraf": "^5.0.5",
-    "semantic-release": "^24.2.3",
-    "start-server-and-test": "^2.0.11",
-    "storybook": "^8.6.12",
-    "styled-components": "^6.1.17",
+    "semantic-release": "^24.2.6",
+    "start-server-and-test": "^2.0.12",
+    "storybook": "^8.6.14",
+    "styled-components": "^6.1.19",
     "tsconfig-paths": "^4.2.0",
     "typescript": "5.8.3",
-    "typescript-eslint": "^8.32.0",
+    "typescript-eslint": "^8.36.0",
     "vite": "^5.4.19",
     "vite-tsconfig-paths": "^5.1.4"
   },
@@ -203,38 +210,25 @@
     "react-is": "^18 || >=19.0.0-0",
     "styled-components": "^5.2 || ^6"
   },
+  "packageManager": "pnpm@9.15.9",
   "engines": {
-    "node": ">=14.0.0"
+    "node": ">=20.19"
   },
   "publishConfig": {
     "access": "public"
   },
+  "pnpm": {
+    "overrides": {
+      "@types/react": "$@types/react",
+      "@types/react-dom": "$@types/react-dom",
+      "@types/react-is": "$@types/react-is",
+      "conventional-changelog-conventionalcommits": ">= 8.0.0",
+      "react": "$react",
+      "react-dom": "$react-dom",
+      "react-is": "$react-is"
+    }
+  },
   "esm.sh": {
     "bundle": false
-  },
-  "scripts": {
-    "build": "run-s clean ui:build pkg:build pkg:check figma:pkg:build",
-    "clean": "rimraf .workshop css.js dist theme.js",
-    "commit": "cz",
-    "cypress:dev": "run-p dev cypress:open",
-    "cypress:open": "cypress open",
-    "cypress:run": "cypress run",
-    "dev": "run-p workshop:dev",
-    "figma:pkg:build": "cd figma && pnpm build",
-    "format": "prettier --write --cache --ignore-unknown .",
-    "lint": "eslint .",
-    "pkg:build": "pkg build --strict",
-    "pkg:check": "pkg --strict",
-    "release": "semantic-release",
-    "storybook:build": "storybook build",
-    "storybook:dev": "storybook dev -p 6006",
-    "test": "jest",
-    "test:browser": "start-server-and-test 'run-s workshop:build workshop:start' http://localhost:1337 'run-s cypress:run'",
-    "ts:check": "tsc",
-    "ui:build": "node -r esbuild-register scripts/build",
-    "watch": "pkg watch --strict",
-    "workshop:build": "workshop build",
-    "workshop:dev": "workshop dev",
-    "workshop:start": "http-server -a localhost -c-0 -p 1337 -s -P http://localhost:1337/index.html? dist"
   }
-}
+}

package/src/core/__workshop__/constants.ts

@@ -0,0 +1,293 @@
+import {icons, IconSymbol} from '@sanity/icons'
+import {
+  AvatarSize,
+  BadgeMode,
+  BadgeTone,
+  ButtonMode,
+  ButtonTextAlign,
+  ButtonTone,
+  CardTone,
+  DialogPosition,
+  FlexAlign,
+  FlexJustify,
+  Placement,
+  TextAlign,
+  TextInputType,
+} from '@sanity/ui'
+import {ThemeColorAvatarColorKey, ThemeFontWeightKey} from '@sanity/ui/theme'
+
+export const WORKSHOP_AVATAR_SIZE_OPTIONS: {[key: string]: AvatarSize} = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+}
+
+export const WORKSHOP_BADGE_MODE_OPTIONS: {[key: string]: BadgeMode} = {
+  Default: 'default',
+  Outline: 'outline',
+}
+
+export const WORKSHOP_BADGE_TONE_OPTIONS: {[key: string]: BadgeTone} = {
+  Default: 'default',
+  Primary: 'primary',
+  Suggest: 'suggest',
+  Positive: 'positive',
+  Caution: 'caution',
+  Critical: 'critical',
+}
+
+export const WORKSHOP_BUTTON_MODE_OPTIONS: {[key: string]: ButtonMode} = {
+  Default: 'default',
+  Ghost: 'ghost',
+  Bleed: 'bleed',
+}
+
+export const WORKSHOP_BUTTON_TEXT_ALIGN_OPTIONS: {[key: string]: ButtonTextAlign | ''} = {
+  '(none)': '',
+  'Left': 'left',
+  'Right': 'right',
+  'Center': 'center',
+}
+
+export const WORKSHOP_BUTTON_TONE_OPTIONS: {[key: string]: ButtonTone} = {
+  Default: 'default',
+  Neutral: 'neutral',
+  Primary: 'primary',
+  Suggest: 'suggest',
+  Positive: 'positive',
+  Caution: 'caution',
+  Critical: 'critical',
+}
+
+export const WORKSHOP_CARD_AS_OPTIONS: {
+  [key: string]: 'div' | 'button' | 'span' | 'ol' | 'pre' | 'ul'
+} = {
+  DIV: 'div',
+  BUTTON: 'button',
+  SPAN: 'span',
+  OL: 'ol',
+  PRE: 'pre',
+  UL: 'ul',
+}
+
+export const WORKSHOP_CARD_TONE_OPTIONS: {[key: string]: CardTone} = {
+  'Inherit': 'inherit',
+  'Transparent': 'transparent',
+  'Default': 'default',
+  'Neutral': 'neutral',
+  'Primary (deprecated)': 'primary',
+  'Suggest': 'suggest',
+  'Positive': 'positive',
+  'Caution': 'caution',
+  'Critical': 'critical',
+}
+
+export const WORKSHOP_CODE_LANGUAGE_OPTIONS = {
+  JavaScript: 'javascript',
+  JSON: 'json',
+  JSX: 'jsx',
+  TypeScript: 'typescript',
+}
+
+export const WORKSHOP_CONTAINER_WIDTH_OPTIONS: {[key: string]: number | 'auto'} = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+  '5': 5,
+  'auto': 'auto',
+}
+
+export const WORKSHOP_DIALOG_POSITION_OPTIONS: {[key: string]: DialogPosition} = {
+  Fixed: 'fixed',
+  Absolute: 'absolute',
+}
+
+export const WORKSHOP_FLEX_DIRECTION_OPTIONS: {[key: string]: 'row' | 'column'} = {
+  Row: 'row',
+  Column: 'column',
+}
+
+export const WORKSHOP_FLEX_ALIGN_OPTIONS: Record<FlexAlign, FlexAlign> = {
+  'baseline': 'baseline',
+  'center': 'center',
+  'flex-end': 'flex-end',
+  'flex-start': 'flex-start',
+  'stretch': 'stretch',
+}
+
+export const WORKSHOP_FLEX_JUSTIFY_OPTIONS: Record<FlexJustify, FlexJustify> = {
+  'center': 'center',
+  'flex-end': 'flex-end',
+  'flex-start': 'flex-start',
+  'space-around': 'space-around',
+  'space-between': 'space-between',
+  'space-evenly': 'space-evenly',
+}
+
+export const WORKSHOP_FONT_WEIGHT_OPTIONS: {[key: string]: ThemeFontWeightKey} = {
+  Regular: 'regular',
+  Medium: 'medium',
+  Semibold: 'semibold',
+  Bold: 'bold',
+}
+
+export const WORKSHOP_HEADING_FONT_SIZE_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+}
+
+export const WORKSHOP_ICON_SYMBOL_OPTIONS: {[key: string]: IconSymbol | ''} = Object.keys(
+  icons,
+).reduce(
+  (acc: {[key: string]: IconSymbol | ''}, key) => {
+    acc[key] = key as IconSymbol
+
+    return acc
+  },
+  {'(none)': ''},
+)
+
+export const WORKSHOP_LABEL_FONT_SIZE_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+}
+
+export const WORKSHOP_PLACEMENT_OPTIONS: Record<Placement, Placement> = {
+  'top': 'top',
+  'top-start': 'top-start',
+  'top-end': 'top-end',
+  'right': 'right',
+  'right-start': 'right-start',
+  'right-end': 'right-end',
+  'left': 'left',
+  'left-start': 'left-start',
+  'left-end': 'left-end',
+  'bottom': 'bottom',
+  'bottom-start': 'bottom-start',
+  'bottom-end': 'bottom-end',
+}
+
+export const WORKSHOP_RADIUS_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+  '5': 5,
+  '6': 6,
+}
+
+export const WORKSHOP_SHADOW_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+  '5': 5,
+}
+
+export const WORKSHOP_SPACE_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+  '5': 5,
+  '6': 6,
+  '7': 7,
+  '8': 8,
+  '9': 9,
+}
+
+export const WORKSHOP_SPOT_COLOR_OPTIONS: {[key: string]: ThemeColorAvatarColorKey} = {
+  Gray: 'gray',
+  Blue: 'blue',
+  Purple: 'purple',
+  Magenta: 'magenta',
+  Red: 'red',
+  Orange: 'orange',
+  Yellow: 'yellow',
+  Green: 'green',
+  Cyan: 'cyan',
+}
+
+export const WORKSHOP_TEXT_ALIGN_OPTIONS: {[key: string]: TextAlign | ''} = {
+  '(none)': '',
+  'Initial': 'initial',
+  'Left': 'left',
+  'Right': 'right',
+  'Center': 'center',
+  'Justify': 'justify',
+}
+
+export const WORKSHOP_TEXT_FONT_SIZE_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+}
+
+export const WORKSHOP_TEXT_INPUT_TYPE_OPTIONS: {[key: string]: TextInputType} = {
+  'date': 'date',
+  'datetime-local': 'datetime-local',
+  'email': 'email',
+  'month': 'month',
+  'number': 'number',
+  'password': 'password',
+  'tel': 'tel',
+  'time': 'time',
+  'text': 'text',
+  'week': 'week',
+  'color': 'color',
+}
+
+export const WORKSHOP_TEXT_OVERFLOW_OPTIONS: {[key: string]: 'ellipsis' | ''} = {
+  None: '',
+  Ellipsis: 'ellipsis',
+}
+
+export const WORKSHOP_TEXT_SIZE_OPTIONS = {
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+}
+
+export const WORKSHOP_TEXT_WEIGHT_OPTIONS: {[key: string]: ThemeFontWeightKey | ''} = {
+  '(none)': '',
+  'Regular': 'regular',
+  'Medium': 'medium',
+  'Semibold': 'semibold',
+  'Bold': 'bold',
+}
+
+export const WORKSHOP_TOAST_STATUS_OPTIONS: {
+  [key: string]: 'error' | 'success' | 'warning' | 'info' | ''
+} = {
+  None: '',
+  Info: 'info',
+  Success: 'success',
+  Warning: 'warning',
+  Error: 'error',
+}
+
+export const WORKSHOP_WIDTH_OPTIONS: {[key: string]: number | 'auto'} = {
+  'Auto': 'auto',
+  '0': 0,
+  '1': 1,
+  '2': 2,
+  '3': 3,
+  '4': 4,
+  '5': 5,
+}