From d01d76482d00e8388f68177f42e4c072f15f40a9 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Tue, 9 Jul 2024 19:49:25 -0400 Subject: [PATCH] gpui: Expose more granular style macros (#14035) This PR extract more GPUI style methods into macros that can be composed together to selectively add styles to components. Release Notes: - N/A --- crates/gpui/src/styled.rs | 307 +--------------- crates/gpui_macros/src/gpui_macros.rs | 37 +- .../src/{style_helpers.rs => styles.rs} | 334 ++++++++++++++++++ 3 files changed, 376 insertions(+), 302 deletions(-) rename crates/gpui_macros/src/{style_helpers.rs => styles.rs} (73%) diff --git a/crates/gpui/src/styled.rs b/crates/gpui/src/styled.rs index fa4a5d9943..9d6feb85b3 100644 --- a/crates/gpui/src/styled.rs +++ b/crates/gpui/src/styled.rs @@ -1,12 +1,14 @@ +use crate::TextStyleRefinement; use crate::{ - self as gpui, hsla, point, px, relative, rems, AbsoluteLength, AlignItems, CursorStyle, - DefiniteLength, Fill, FlexDirection, FlexWrap, Font, FontStyle, FontWeight, Hsla, - JustifyContent, Length, SharedString, StyleRefinement, Visibility, WhiteSpace, + self as gpui, px, relative, rems, AbsoluteLength, AlignItems, CursorStyle, DefiniteLength, + Fill, FlexDirection, FlexWrap, Font, FontStyle, FontWeight, Hsla, JustifyContent, Length, + SharedString, StyleRefinement, WhiteSpace, }; -use crate::{BoxShadow, TextStyleRefinement}; -pub use gpui_macros::{margin_style_methods, padding_style_methods, position_style_methods}; -use smallvec::{smallvec, SmallVec}; -use taffy::style::{AlignContent, Display, Overflow}; +pub use gpui_macros::{ + box_shadow_style_methods, cursor_style_methods, margin_style_methods, overflow_style_methods, + padding_style_methods, position_style_methods, visibility_style_methods, +}; +use taffy::style::{AlignContent, Display}; /// A trait for elements that can be styled. /// Use this to opt-in to a CSS-like styling API. @@ -15,9 +17,13 @@ pub trait Styled: Sized { fn style(&mut self) -> &mut StyleRefinement; gpui_macros::style_helpers!(); + gpui_macros::visibility_style_methods!(); gpui_macros::margin_style_methods!(); gpui_macros::padding_style_methods!(); gpui_macros::position_style_methods!(); + gpui_macros::overflow_style_methods!(); + gpui_macros::cursor_style_methods!(); + gpui_macros::box_shadow_style_methods!(); /// Sets the display type of the element to `block`. /// [Docs](https://tailwindcss.com/docs/display) @@ -33,195 +39,6 @@ pub trait Styled: Sized { self } - /// Sets the visibility of the element to `visible`. - /// [Docs](https://tailwindcss.com/docs/visibility) - fn visible(mut self) -> Self { - self.style().visibility = Some(Visibility::Visible); - self - } - - /// Sets the visibility of the element to `hidden`. - /// [Docs](https://tailwindcss.com/docs/visibility) - fn invisible(mut self) -> Self { - self.style().visibility = Some(Visibility::Hidden); - self - } - - /// Sets the behavior of content that overflows the container to be hidden. - /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) - fn overflow_hidden(mut self) -> Self { - self.style().overflow.x = Some(Overflow::Hidden); - self.style().overflow.y = Some(Overflow::Hidden); - self - } - - /// Sets the behavior of content that overflows the container on the X axis to be hidden. - /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) - fn overflow_x_hidden(mut self) -> Self { - self.style().overflow.x = Some(Overflow::Hidden); - self - } - - /// Sets the behavior of content that overflows the container on the Y axis to be hidden. - /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) - fn overflow_y_hidden(mut self) -> Self { - self.style().overflow.y = Some(Overflow::Hidden); - self - } - - /// Set the cursor style when hovering over this element - fn cursor(mut self, cursor: CursorStyle) -> Self { - self.style().mouse_cursor = Some(cursor); - self - } - - /// Sets the cursor style when hovering an element to `default`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_default(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::Arrow); - self - } - - /// Sets the cursor style when hovering an element to `pointer`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_pointer(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::PointingHand); - self - } - - /// Sets cursor style when hovering over an element to `text`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_text(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::IBeam); - self - } - - /// Sets cursor style when hovering over an element to `move`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_move(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ClosedHand); - self - } - - /// Sets cursor style when hovering over an element to `not-allowed`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_not_allowed(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::OperationNotAllowed); - self - } - - /// Sets cursor style when hovering over an element to `context-menu`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_context_menu(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ContextualMenu); - self - } - - /// Sets cursor style when hovering over an element to `crosshair`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_crosshair(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::Crosshair); - self - } - - /// Sets cursor style when hovering over an element to `vertical-text`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_vertical_text(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::IBeamCursorForVerticalLayout); - self - } - - /// Sets cursor style when hovering over an element to `alias`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_alias(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::DragLink); - self - } - - /// Sets cursor style when hovering over an element to `copy`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_copy(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::DragCopy); - self - } - - /// Sets cursor style when hovering over an element to `no-drop`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_no_drop(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::OperationNotAllowed); - self - } - - /// Sets cursor style when hovering over an element to `grab`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_grab(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::OpenHand); - self - } - - /// Sets cursor style when hovering over an element to `grabbing`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_grabbing(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ClosedHand); - self - } - - /// Sets cursor style when hovering over an element to `ew-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_ew_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeLeftRight); - self - } - - /// Sets cursor style when hovering over an element to `ns-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_ns_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeUpDown); - self - } - - /// Sets cursor style when hovering over an element to `col-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_col_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeColumn); - self - } - - /// Sets cursor style when hovering over an element to `row-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_row_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeRow); - self - } - - /// Sets cursor style when hovering over an element to `n-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_n_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeUp); - self - } - - /// Sets cursor style when hovering over an element to `e-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_e_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeRight); - self - } - - /// Sets cursor style when hovering over an element to `s-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_s_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeDown); - self - } - - /// Sets cursor style when hovering over an element to `w-resize`. - /// [Docs](https://tailwindcss.com/docs/cursor) - fn cursor_w_resize(mut self) -> Self { - self.style().mouse_cursor = Some(CursorStyle::ResizeLeft); - self - } - /// Sets the whitespace of the element to `normal`. /// [Docs](https://tailwindcss.com/docs/whitespace#normal) fn whitespace_normal(mut self) -> Self { @@ -489,104 +306,6 @@ pub trait Styled: Sized { self } - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow(mut self, shadows: SmallVec<[BoxShadow; 2]>) -> Self { - self.style().box_shadow = Some(shadows); - self - } - - /// Clears the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_none(mut self) -> Self { - self.style().box_shadow = Some(Default::default()); - self - } - - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_sm(mut self) -> Self { - self.style().box_shadow = Some(smallvec::smallvec![BoxShadow { - color: hsla(0., 0., 0., 0.05), - offset: point(px(0.), px(1.)), - blur_radius: px(2.), - spread_radius: px(0.), - }]); - self - } - - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_md(mut self) -> Self { - self.style().box_shadow = Some(smallvec![ - BoxShadow { - color: hsla(0.5, 0., 0., 0.1), - offset: point(px(0.), px(4.)), - blur_radius: px(6.), - spread_radius: px(-1.), - }, - BoxShadow { - color: hsla(0., 0., 0., 0.1), - offset: point(px(0.), px(2.)), - blur_radius: px(4.), - spread_radius: px(-2.), - } - ]); - self - } - - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_lg(mut self) -> Self { - self.style().box_shadow = Some(smallvec![ - BoxShadow { - color: hsla(0., 0., 0., 0.1), - offset: point(px(0.), px(10.)), - blur_radius: px(15.), - spread_radius: px(-3.), - }, - BoxShadow { - color: hsla(0., 0., 0., 0.1), - offset: point(px(0.), px(4.)), - blur_radius: px(6.), - spread_radius: px(-4.), - } - ]); - self - } - - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_xl(mut self) -> Self { - self.style().box_shadow = Some(smallvec![ - BoxShadow { - color: hsla(0., 0., 0., 0.1), - offset: point(px(0.), px(20.)), - blur_radius: px(25.), - spread_radius: px(-5.), - }, - BoxShadow { - color: hsla(0., 0., 0., 0.1), - offset: point(px(0.), px(8.)), - blur_radius: px(10.), - spread_radius: px(-6.), - } - ]); - self - } - - /// Sets the box shadow of the element. - /// [Docs](https://tailwindcss.com/docs/box-shadow) - fn shadow_2xl(mut self) -> Self { - self.style().box_shadow = Some(smallvec![BoxShadow { - color: hsla(0., 0., 0., 0.25), - offset: point(px(0.), px(25.)), - blur_radius: px(50.), - spread_radius: px(-12.), - }]); - self - } - /// Get the text style that has been configured on this element. fn text_style(&mut self) -> &mut Option { let style: &mut StyleRefinement = self.style(); diff --git a/crates/gpui_macros/src/gpui_macros.rs b/crates/gpui_macros/src/gpui_macros.rs index 1890bf4a25..940214a071 100644 --- a/crates/gpui_macros/src/gpui_macros.rs +++ b/crates/gpui_macros/src/gpui_macros.rs @@ -1,7 +1,7 @@ mod derive_into_element; mod derive_render; mod register_action; -mod style_helpers; +mod styles; mod test; use proc_macro::TokenStream; @@ -31,28 +31,49 @@ pub fn derive_render(input: TokenStream) -> TokenStream { #[proc_macro] #[doc(hidden)] pub fn style_helpers(input: TokenStream) -> TokenStream { - style_helpers::style_helpers(input) + styles::style_helpers(input) +} + +/// Generates methods for visibility styles. +#[proc_macro] +pub fn visibility_style_methods(input: TokenStream) -> TokenStream { + styles::visibility_style_methods(input) } /// Generates methods for margin styles. #[proc_macro] -#[doc(hidden)] pub fn margin_style_methods(input: TokenStream) -> TokenStream { - style_helpers::margin_style_methods(input) + styles::margin_style_methods(input) } /// Generates methods for padding styles. #[proc_macro] -#[doc(hidden)] pub fn padding_style_methods(input: TokenStream) -> TokenStream { - style_helpers::padding_style_methods(input) + styles::padding_style_methods(input) } /// Generates methods for position styles. #[proc_macro] -#[doc(hidden)] pub fn position_style_methods(input: TokenStream) -> TokenStream { - style_helpers::position_style_methods(input) + styles::position_style_methods(input) +} + +/// Generates methods for overflow styles. +#[proc_macro] +pub fn overflow_style_methods(input: TokenStream) -> TokenStream { + styles::overflow_style_methods(input) +} + +/// Generates methods for cursor styles. +#[proc_macro] +pub fn cursor_style_methods(input: TokenStream) -> TokenStream { + styles::cursor_style_methods(input) +} + +/// Generates methods for box shadow styles. +#[proc_macro] +pub fn box_shadow_style_methods(input: TokenStream) -> TokenStream { + styles::box_shadow_style_methods(input) } /// #[gpui::test] can be used to annotate test functions that run with GPUI support. diff --git a/crates/gpui_macros/src/style_helpers.rs b/crates/gpui_macros/src/styles.rs similarity index 73% rename from crates/gpui_macros/src/style_helpers.rs rename to crates/gpui_macros/src/styles.rs index f184752210..f399c62683 100644 --- a/crates/gpui_macros/src/style_helpers.rs +++ b/crates/gpui_macros/src/styles.rs @@ -47,6 +47,28 @@ pub fn style_helpers(input: TokenStream) -> TokenStream { output.into() } +pub fn visibility_style_methods(input: TokenStream) -> TokenStream { + let input = parse_macro_input!(input as StyleableMacroInput); + let visibility = input.method_visibility; + let output = quote! { + /// Sets the visibility of the element to `visible`. + /// [Docs](https://tailwindcss.com/docs/visibility) + #visibility fn visible(mut self) -> Self { + self.style().visibility = Some(gpui::Visibility::Visible); + self + } + + /// Sets the visibility of the element to `hidden`. + /// [Docs](https://tailwindcss.com/docs/visibility) + #visibility fn invisible(mut self) -> Self { + self.style().visibility = Some(gpui::Visibility::Hidden); + self + } + }; + + output.into() +} + pub fn margin_style_methods(input: TokenStream) -> TokenStream { let input = parse_macro_input!(input as StyleableMacroInput); let methods = generate_box_style_methods( @@ -104,6 +126,318 @@ pub fn position_style_methods(input: TokenStream) -> TokenStream { output.into() } +pub fn overflow_style_methods(input: TokenStream) -> TokenStream { + let input = parse_macro_input!(input as StyleableMacroInput); + let visibility = input.method_visibility; + let output = quote! { + /// Sets the behavior of content that overflows the container to be hidden. + /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) + #visibility fn overflow_hidden(mut self) -> Self { + self.style().overflow.x = Some(gpui::Overflow::Hidden); + self.style().overflow.y = Some(gpui::Overflow::Hidden); + self + } + + /// Sets the behavior of content that overflows the container on the X axis to be hidden. + /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) + #visibility fn overflow_x_hidden(mut self) -> Self { + self.style().overflow.x = Some(gpui::Overflow::Hidden); + self + } + + /// Sets the behavior of content that overflows the container on the Y axis to be hidden. + /// [Docs](https://tailwindcss.com/docs/overflow#hiding-content-that-overflows) + #visibility fn overflow_y_hidden(mut self) -> Self { + self.style().overflow.y = Some(gpui::Overflow::Hidden); + self + } + }; + + output.into() +} + +pub fn cursor_style_methods(input: TokenStream) -> TokenStream { + let input = parse_macro_input!(input as StyleableMacroInput); + let visibility = input.method_visibility; + let output = quote! { + /// Set the cursor style when hovering over this element + #visibility fn cursor(mut self, cursor: CursorStyle) -> Self { + self.style().mouse_cursor = Some(cursor); + self + } + + /// Sets the cursor style when hovering an element to `default`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_default(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::Arrow); + self + } + + /// Sets the cursor style when hovering an element to `pointer`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_pointer(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::PointingHand); + self + } + + /// Sets cursor style when hovering over an element to `text`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_text(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::IBeam); + self + } + + /// Sets cursor style when hovering over an element to `move`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_move(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ClosedHand); + self + } + + /// Sets cursor style when hovering over an element to `not-allowed`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_not_allowed(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::OperationNotAllowed); + self + } + + /// Sets cursor style when hovering over an element to `context-menu`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_context_menu(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ContextualMenu); + self + } + + /// Sets cursor style when hovering over an element to `crosshair`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_crosshair(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::Crosshair); + self + } + + /// Sets cursor style when hovering over an element to `vertical-text`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_vertical_text(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::IBeamCursorForVerticalLayout); + self + } + + /// Sets cursor style when hovering over an element to `alias`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_alias(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::DragLink); + self + } + + /// Sets cursor style when hovering over an element to `copy`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_copy(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::DragCopy); + self + } + + /// Sets cursor style when hovering over an element to `no-drop`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_no_drop(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::OperationNotAllowed); + self + } + + /// Sets cursor style when hovering over an element to `grab`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_grab(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::OpenHand); + self + } + + /// Sets cursor style when hovering over an element to `grabbing`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_grabbing(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ClosedHand); + self + } + + /// Sets cursor style when hovering over an element to `ew-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_ew_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeLeftRight); + self + } + + /// Sets cursor style when hovering over an element to `ns-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_ns_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeUpDown); + self + } + + /// Sets cursor style when hovering over an element to `col-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_col_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeColumn); + self + } + + /// Sets cursor style when hovering over an element to `row-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_row_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeRow); + self + } + + /// Sets cursor style when hovering over an element to `n-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_n_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeUp); + self + } + + /// Sets cursor style when hovering over an element to `e-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_e_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeRight); + self + } + + /// Sets cursor style when hovering over an element to `s-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_s_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeDown); + self + } + + /// Sets cursor style when hovering over an element to `w-resize`. + /// [Docs](https://tailwindcss.com/docs/cursor) + #visibility fn cursor_w_resize(mut self) -> Self { + self.style().mouse_cursor = Some(gpui::CursorStyle::ResizeLeft); + self + } + }; + + output.into() +} + +pub fn box_shadow_style_methods(input: TokenStream) -> TokenStream { + let input = parse_macro_input!(input as StyleableMacroInput); + let visibility = input.method_visibility; + let output = quote! { + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow(mut self, shadows: smallvec::SmallVec<[gpui::BoxShadow; 2]>) -> Self { + self.style().box_shadow = Some(shadows); + self + } + + /// Clears the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_none(mut self) -> Self { + self.style().box_shadow = Some(Default::default()); + self + } + + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_sm(mut self) -> Self { + use gpui::{BoxShadow, hsla, point, px}; + use smallvec::smallvec; + + self.style().box_shadow = Some(smallvec![BoxShadow { + color: hsla(0., 0., 0., 0.05), + offset: point(px(0.), px(1.)), + blur_radius: px(2.), + spread_radius: px(0.), + }]); + self + } + + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_md(mut self) -> Self { + use gpui::{BoxShadow, hsla, point, px}; + use smallvec::smallvec; + + self.style().box_shadow = Some(smallvec![ + BoxShadow { + color: hsla(0.5, 0., 0., 0.1), + offset: point(px(0.), px(4.)), + blur_radius: px(6.), + spread_radius: px(-1.), + }, + BoxShadow { + color: hsla(0., 0., 0., 0.1), + offset: point(px(0.), px(2.)), + blur_radius: px(4.), + spread_radius: px(-2.), + } + ]); + self + } + + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_lg(mut self) -> Self { + use gpui::{BoxShadow, hsla, point, px}; + use smallvec::smallvec; + + self.style().box_shadow = Some(smallvec![ + BoxShadow { + color: hsla(0., 0., 0., 0.1), + offset: point(px(0.), px(10.)), + blur_radius: px(15.), + spread_radius: px(-3.), + }, + BoxShadow { + color: hsla(0., 0., 0., 0.1), + offset: point(px(0.), px(4.)), + blur_radius: px(6.), + spread_radius: px(-4.), + } + ]); + self + } + + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_xl(mut self) -> Self { + use gpui::{BoxShadow, hsla, point, px}; + use smallvec::smallvec; + + self.style().box_shadow = Some(smallvec![ + BoxShadow { + color: hsla(0., 0., 0., 0.1), + offset: point(px(0.), px(20.)), + blur_radius: px(25.), + spread_radius: px(-5.), + }, + BoxShadow { + color: hsla(0., 0., 0., 0.1), + offset: point(px(0.), px(8.)), + blur_radius: px(10.), + spread_radius: px(-6.), + } + ]); + self + } + + /// Sets the box shadow of the element. + /// [Docs](https://tailwindcss.com/docs/box-shadow) + #visibility fn shadow_2xl(mut self) -> Self { + use gpui::{BoxShadow, hsla, point, px}; + use smallvec::smallvec; + + self.style().box_shadow = Some(smallvec![BoxShadow { + color: hsla(0., 0., 0., 0.25), + offset: point(px(0.), px(25.)), + blur_radius: px(50.), + spread_radius: px(-12.), + }]); + self + } + }; + + output.into() +} + struct BoxStylePrefix { prefix: &'static str, auto_allowed: bool,