Abdul Rahman
34a903b4fa
## Summary Aligns **object metadata** icons with the **tinted tile** look everywhere we show a workspace object, and **retires** the navigation-only `NavigationMenuItemStyleIcon` wrapper in favor of **shared** UI primitives under `@/ui/display` and `@/object-metadata`. ## What changed ### Global tinted icon building blocks (`@/ui/display`) - **`TintedIconTile`** / **`StyledTintedIconTileContainer`** support optional **`size`** and **`stroke`**, and grow the tile when **`size`** is set so layouts match previous `theme.icon` usage. - Shared helpers and constants for theme color parsing and tinted backgrounds/borders/icon color (e.g. **`getTintedIconTileStyleFromColor`**, **`parseThemeColor`**, **`getColorFromTheme`**, related constants). ### Object metadata icon (`@/object-metadata`) - **`ObjectMetadataIcon`** composes **`TintedIconTile`** with **`getObjectColorWithFallback`**, forwards optional **`size`** / **`stroke`** for **visual parity** with old `getIcon` + explicit sizing. - **`getSelectOptionIconFromObjectMetadataItem`** returns an **`IconComponent`** for selects/menus that expect a component, not a React node. ### Navigation module cleanup - **Removed** **`NavigationMenuItemStyleIcon`**; call sites use **`ObjectMetadataIcon`**, **`TintedIconTile`**, and/or the shared **`getTintedIconTileStyleFromColor`** pipeline so the same treatment is **not** tied to the navigation package. - **`NavigationMenuItemIcon`**, view/link overlays, DnD handle, and sidebar editor flows updated to use the shared pattern where they render object (or tinted) icons. ### Product surfaces updated (non-exhaustive) - **Settings:** role object picker/rows, data model tables/graph/overview, object preview summary, webhooks entity list, morph relation multiselect. - **Workflows:** create/update/delete/upsert/find records, triggers, filters, variables dropdowns, AI agent object rows, object dropdowns. - **Shell:** side panel object filter / data sources / folder chrome where object icons appear. - **Records:** index header icon, show breadcrumb styling. - **Activity:** timeline event icon when linked object metadata applies. - **`NavigationDrawerItem`:** tinted branch aligned with shared **`TintedIconTile`** behavior. --------- Co-authored-by: Etienne <45695613+etiennejouan@users.noreply.github.com>
56 lines
2.9 KiB
TypeScript
56 lines
2.9 KiB
TypeScript
/*
|
|
* _____ _
|
|
*|_ _|_ _____ _ __ | |_ _ _
|
|
* | | \ \ /\ / / _ \ '_ \| __| | | | Auto-generated file
|
|
* | | \ V V / __/ | | | |_| |_| | Any edits to this will be overridden
|
|
* |_| \_/\_/ \___|_| |_|\__|\__, |
|
|
* |___/
|
|
*/
|
|
|
|
export { ACCENT_DARK } from './constants/AccentDark';
|
|
export { ACCENT_LIGHT } from './constants/AccentLight';
|
|
export type { AnimationDuration } from './constants/Animation';
|
|
export { ANIMATION } from './constants/Animation';
|
|
export { BACKGROUND_DARK } from './constants/BackgroundDark';
|
|
export { BACKGROUND_LIGHT } from './constants/BackgroundLight';
|
|
export { BLUR_DARK } from './constants/BlurDark';
|
|
export { BLUR_LIGHT } from './constants/BlurLight';
|
|
export { BORDER_COMMON } from './constants/BorderCommon';
|
|
export { BORDER_DARK } from './constants/BorderDark';
|
|
export { BORDER_LIGHT } from './constants/BorderLight';
|
|
export { BOX_SHADOW_DARK } from './constants/BoxShadowDark';
|
|
export { BOX_SHADOW_LIGHT } from './constants/BoxShadowLight';
|
|
export { CODE_DARK } from './constants/CodeDark';
|
|
export { CODE_LIGHT } from './constants/CodeLight';
|
|
export { COLOR_DARK } from './constants/ColorsDark';
|
|
export { COLOR_LIGHT } from './constants/ColorsLight';
|
|
export { DEFAULT_THEME_COLOR_FALLBACK } from './constants/DefaultThemeColorFallback';
|
|
export { FONT_COMMON } from './constants/FontCommon';
|
|
export { FONT_DARK } from './constants/FontDark';
|
|
export { FONT_LIGHT } from './constants/FontLight';
|
|
export { GRAY_SCALE_DARK } from './constants/GrayScaleDark';
|
|
export { GRAY_SCALE_DARK_ALPHA } from './constants/GrayScaleDarkAlpha';
|
|
export { GRAY_SCALE_LIGHT } from './constants/GrayScaleLight';
|
|
export { GRAY_SCALE_LIGHT_ALPHA } from './constants/GrayScaleLightAlpha';
|
|
export { ICON } from './constants/Icon';
|
|
export { ILLUSTRATION_ICON_DARK } from './constants/IllustrationIconDark';
|
|
export { ILLUSTRATION_ICON_LIGHT } from './constants/IllustrationIconLight';
|
|
export type { ThemeColor } from './constants/MainColorNames';
|
|
export { MAIN_COLOR_NAMES } from './constants/MainColorNames';
|
|
export { MAIN_COLORS_DARK } from './constants/MainColorsDark';
|
|
export { MAIN_COLORS_LIGHT } from './constants/MainColorsLight';
|
|
export { MODAL } from './constants/Modal';
|
|
export { RGBA } from './constants/Rgba';
|
|
export { SECONDARY_COLORS_DARK } from './constants/SecondaryColorsDark';
|
|
export { SECONDARY_COLORS_LIGHT } from './constants/SecondaryColorsLight';
|
|
export { SNACK_BAR_DARK } from './constants/SnackBarDark';
|
|
export { SNACK_BAR_LIGHT } from './constants/SnackBarLight';
|
|
export { TAG_DARK } from './constants/TagDark';
|
|
export { TAG_LIGHT } from './constants/TagLight';
|
|
export { TEXT } from './constants/Text';
|
|
export { THEME_COMMON } from './constants/ThemeCommon';
|
|
export { THEME_DARK } from './constants/ThemeDark';
|
|
export { THEME_LIGHT } from './constants/ThemeLight';
|
|
export { TRANSPARENT_COLORS_DARK } from './constants/TransparentColorsDark';
|
|
export { TRANSPARENT_COLORS_LIGHT } from './constants/TransparentColorsLight';
|