-----------------------------------------------------------------------------
{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE MultilineStrings  #-}
{-# LANGUAGE RecordWildCards   #-}
-----------------------------------------------------------------------------
module Miso.UI.Empty
  ( -- ** Props
    EmptyProps (..)
  , defaultEmptyProps
    -- ** Views
  , empty_
    -- ** Samples
  , emptySample
  , emptyCodeSample
  , emptyPropsApi
  ) where
-----------------------------------------------------------------------------
import           Miso
import qualified Miso.Html.Element as H
import qualified Miso.Html.Property as P
import qualified Miso.Svg           as S
import qualified Miso.Svg.Property  as SP
-----------------------------------------------------------------------------
import           Miso.UI.Button
import           Miso.UI.Icons
import           Miso.UI.Types
-----------------------------------------------------------------------------
-- | Props for 'empty_'. Icon, title and description nest other views.
data EmptyProps model action
  = EmptyProps
  { forall model action.
EmptyProps model action -> Maybe (View model action)
emptyIcon :: Maybe (View model action)
    -- ^ Icon shown in the header medallion
  , forall model action.
EmptyProps model action -> Maybe (View model action)
emptyTitle :: Maybe (View model action)
  , forall model action.
EmptyProps model action -> Maybe (View model action)
emptyDescription :: Maybe (View model action)
  , forall model action. EmptyProps model action -> [View model action]
emptyFooter :: [View model action]
    -- ^ Content under the actions (e.g. a \"learn more\" link)
  , forall model action. EmptyProps model action -> [MisoString]
emptyClasses :: [MisoString]
  , forall model action. EmptyProps model action -> [Attribute action]
emptyAttrs :: [Attribute action]
  }
-----------------------------------------------------------------------------
-- | Smart constructor: bare empty state
defaultEmptyProps :: EmptyProps model action
defaultEmptyProps :: forall model action. EmptyProps model action
defaultEmptyProps
  = EmptyProps
  { emptyIcon :: Maybe (View model action)
emptyIcon = Maybe (View model action)
forall a. Maybe a
Nothing
  , emptyTitle :: Maybe (View model action)
emptyTitle = Maybe (View model action)
forall a. Maybe a
Nothing
  , emptyDescription :: Maybe (View model action)
emptyDescription = Maybe (View model action)
forall a. Maybe a
Nothing
  , emptyFooter :: [View model action]
emptyFooter = []
  , emptyClasses :: [MisoString]
emptyClasses = []
  , emptyAttrs :: [Attribute action]
emptyAttrs = []
  }
-----------------------------------------------------------------------------
-- | <https://basecoatui.com/components/empty/ Empty> state, driven by 'EmptyProps'.
-- Children render as the action row.
empty_
  :: EmptyProps model action
  -> [View model action]
  -> View model action
empty_ :: forall model action.
EmptyProps model action -> [View model action] -> View model action
empty_ EmptyProps {[MisoString]
[Attribute action]
[View model action]
Maybe (View model action)
emptyIcon :: forall model action.
EmptyProps model action -> Maybe (View model action)
emptyTitle :: forall model action.
EmptyProps model action -> Maybe (View model action)
emptyDescription :: forall model action.
EmptyProps model action -> Maybe (View model action)
emptyFooter :: forall model action. EmptyProps model action -> [View model action]
emptyClasses :: forall model action. EmptyProps model action -> [MisoString]
emptyAttrs :: forall model action. EmptyProps model action -> [Attribute action]
emptyIcon :: Maybe (View model action)
emptyTitle :: Maybe (View model action)
emptyDescription :: Maybe (View model action)
emptyFooter :: [View model action]
emptyClasses :: [MisoString]
emptyAttrs :: [Attribute action]
..} [View model action]
kids =
  [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.div_
    ( [MisoString] -> Attribute action
forall action. [MisoString] -> Attribute action
P.classes_
      ( [ MisoString
"flex", MisoString
"min-w-0", MisoString
"flex-1", MisoString
"flex-col", MisoString
"items-center", MisoString
"justify-center"
        , MisoString
"gap-6", MisoString
"rounded-lg", MisoString
"border-dashed", MisoString
"p-6", MisoString
"text-center", MisoString
"text-balance"
        , MisoString
"md:p-12", MisoString
"text-neutral-800", MisoString
"dark:text-neutral-300"
        ] [MisoString] -> [MisoString] -> [MisoString]
forall a. [a] -> [a] -> [a]
++ [MisoString]
emptyClasses
      )
    Attribute action -> [Attribute action] -> [Attribute action]
forall a. a -> [a] -> [a]
: [Attribute action]
emptyAttrs
    )
    ([View model action] -> View model action)
-> [View model action] -> View model action
forall a b. (a -> b) -> a -> b
$ [[View model action]] -> [View model action]
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
    [ [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.header_
        [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"flex max-w-sm flex-col items-center gap-2 text-center" ]
        ([View model action] -> View model action)
-> [View model action] -> View model action
forall a b. (a -> b) -> a -> b
$ [[View model action]] -> [View model action]
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
        [ [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.div_
            [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 bg-muted text-foreground flex size-10 shrink-0 items-center justify-center rounded-lg [&_svg:not([class*='size-'])]:size-6" ]
            [ View model action
i ]
          | Just View model action
i <- [Maybe (View model action)
emptyIcon]
          ]
        , [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.h3_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"text-lg font-medium tracking-tight" ] [ View model action
t ]
          | Just View model action
t <- [Maybe (View model action)
emptyTitle]
          ]
        , [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.p_
            [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"text-muted-foreground [&>a:hover]:text-primary text-sm/relaxed [&>a]:underline [&>a]:underline-offset-4" ]
            [ View model action
d ]
          | Just View model action
d <- [Maybe (View model action)
emptyDescription]
          ]
        ]
      ]
    , [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.section_
        [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance" ]
        [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.div_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"flex gap-2" ] [View model action]
kids ]
      | Bool -> Bool
not ([View model action] -> Bool
forall a. [a] -> Bool
forall (t :: * -> *) a. Foldable t => t a -> Bool
null [View model action]
kids)
      ]
    , [View model action]
emptyFooter
    ]
-----------------------------------------------------------------------------
emptySample :: View model action
emptySample :: forall model action. View model action
emptySample =
  EmptyProps model action -> [View model action] -> View model action
forall model action.
EmptyProps model action -> [View model action] -> View model action
empty_ EmptyProps (ZonkAny 0) action
forall model action. EmptyProps model action
defaultEmptyProps
    { emptyIcon = Just folderIcon
    , emptyTitle = Just "No Projects Yet"
    , emptyDescription = Just
        "You haven't created any projects yet. Get started by creating your first project."
    , emptyFooter =
      [ H.a_
        [ P.class_ "inline-flex items-center justify-center whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive underline-offset-4 hover:underline h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5 text-muted-foreground"
        , P.href_ "#"
        ]
        [ "Learn More"
        , arrowUpRightIcon
        ]
      ]
    }
    [ ButtonProps action -> [View model action] -> View model action
forall action model.
ButtonProps action -> [View model action] -> View model action
button_ ButtonProps action
forall action. ButtonProps action
defaultButtonProps [ View model action
"Create Project" ]
    , ButtonProps action -> [View model action] -> View model action
forall action model.
ButtonProps action -> [View model action] -> View model action
button_ ButtonProps action
forall action. ButtonProps action
defaultButtonProps { buttonVariant = Outline } [ View model action
"Import Project" ]
    ]
  where
    folderIcon :: View model action
folderIcon = [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
lucide_ []
      [ [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
S.path_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
SP.d_ MisoString
"M10 10.5 8 13l2 2.5" ]
      , [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
S.path_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
SP.d_ MisoString
"m14 10.5 2 2.5-2 2.5" ]
      , [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
S.path_
        [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
SP.d_ MisoString
"M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2z"
        ]
      ]
    arrowUpRightIcon :: View model action
arrowUpRightIcon = [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
lucide_ []
      [ [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
S.path_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
SP.d_ MisoString
"M7 7h10v10" ]
      , [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
S.path_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
SP.d_ MisoString
"M7 17 17 7" ]
      ]
-----------------------------------------------------------------------------
emptyCodeSample :: View model action
emptyCodeSample :: forall model action. View model action
emptyCodeSample =
  View model action
"""
  -----------------------------------------------------------------------------
  module MyEmpty (emptySample) where
  -----------------------------------------------------------------------------
  import           Miso
  import qualified Miso.Html.Element as H
  import qualified Miso.Html.Property as P
  import qualified Miso.Svg           as S
  import qualified Miso.Svg.Property  as SP
  import           Miso.UI.Button
  import           Miso.UI.Icons
  import           Miso.UI.Types
  import           Miso.UI.Empty
  -----------------------------------------------------------------------------
  emptySample :: View model action
  emptySample =
    empty_ defaultEmptyProps
      { emptyIcon = Just folderIcon
      , emptyTitle = Just "No Projects Yet"
      , emptyDescription = Just
          "You haven't created any projects yet. Get started by creating your first project."
      , emptyFooter =
        [ H.a_
          [ P.class_ "inline-flex items-center justify-center whitespace-nowrap text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive underline-offset-4 hover:underline h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5 text-muted-foreground"
          , P.href_ "#"
          ]
          [ "Learn More"
          , arrowUpRightIcon
          ]
        ]
      }
      [ button_ defaultButtonProps [ "Create Project" ]
      , button_ defaultButtonProps { buttonVariant = Outline } [ "Import Project" ]
      ]
    where
      folderIcon = lucide_ []
        [ S.path_ [ SP.d_ "M10 10.5 8 13l2 2.5" ]
        , S.path_ [ SP.d_ "m14 10.5 2 2.5-2 2.5" ]
        , S.path_
          [ SP.d_ "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2z"
          ]
        ]
      arrowUpRightIcon = lucide_ []
        [ S.path_ [ SP.d_ "M7 7h10v10" ]
        , S.path_ [ SP.d_ "M7 17 17 7" ]
        ]
  """
-----------------------------------------------------------------------------
emptyPropsApi :: View model action
emptyPropsApi :: forall model action. View model action
emptyPropsApi =
  View model action
"""
  -- | Props for 'empty_'. Icon, title and description nest other views.
  data EmptyProps model action
    = EmptyProps
    { emptyIcon :: Maybe (View model action)
      -- ^ Icon shown in the header medallion
    , emptyTitle :: Maybe (View model action)
    , emptyDescription :: Maybe (View model action)
    , emptyFooter :: [View model action]
      -- ^ Content under the actions (e.g. a \\"learn more\\" link)
    , emptyClasses :: [MisoString]
    , emptyAttrs :: [Attribute action]
    }
  -----------------------------------------------------------------------------
  -- | Smart constructor: bare empty state
  defaultEmptyProps :: EmptyProps model action
  defaultEmptyProps
    = EmptyProps
    { emptyIcon = Nothing
    , emptyTitle = Nothing
    , emptyDescription = Nothing
    , emptyFooter = []
    , emptyClasses = []
    , emptyAttrs = []
    }
  """
-----------------------------------------------------------------------------