-----------------------------------------------------------------------------
{-# LANGUAGE OverloadedStrings #-}
{-# LANGUAGE MultilineStrings  #-}
{-# LANGUAGE RecordWildCards   #-}
-----------------------------------------------------------------------------
module Miso.UI.Checkbox
  ( -- ** Props
    CheckboxProps (..)
  , defaultCheckboxProps
    -- ** Views
  , checkbox_
  , checkboxInput_
    -- ** Samples
  , checkboxUsage
  , checkboxSample
  , checkboxCodeSample
  , checkboxPropsApi
  ) where
-----------------------------------------------------------------------------
import           Miso
import qualified Miso.Html.Element as H
import qualified Miso.Html.Property as P
-----------------------------------------------------------------------------
import           Miso.UI.Label
-----------------------------------------------------------------------------
-- | Props for 'checkbox_'
data CheckboxProps action
  = CheckboxProps
  { forall action. CheckboxProps action -> Maybe MisoString
checkboxId :: Maybe MisoString
  , forall action. CheckboxProps action -> Maybe MisoString
checkboxName :: Maybe MisoString
  , forall action. CheckboxProps action -> Maybe MisoString
checkboxValue :: Maybe MisoString
  , forall action. CheckboxProps action -> Bool
checkboxChecked :: Bool
  , forall action. CheckboxProps action -> Bool
checkboxDisabled :: Bool
  , forall action. CheckboxProps action -> [MisoString]
checkboxClasses :: [MisoString]
    -- ^ Extra classes appended to the @input@
  , forall action. CheckboxProps action -> [MisoString]
checkboxLabelClasses :: [MisoString]
    -- ^ Extra classes appended to the wrapping @label@
  , forall action. CheckboxProps action -> [Attribute action]
checkboxAttrs :: [Attribute action]
  }
-----------------------------------------------------------------------------
-- | Smart constructor: unchecked, enabled
defaultCheckboxProps :: CheckboxProps action
defaultCheckboxProps :: forall action. CheckboxProps action
defaultCheckboxProps
  = CheckboxProps
  { checkboxId :: Maybe MisoString
checkboxId = Maybe MisoString
forall a. Maybe a
Nothing
  , checkboxName :: Maybe MisoString
checkboxName = Maybe MisoString
forall a. Maybe a
Nothing
  , checkboxValue :: Maybe MisoString
checkboxValue = Maybe MisoString
forall a. Maybe a
Nothing
  , checkboxChecked :: Bool
checkboxChecked = Bool
False
  , checkboxDisabled :: Bool
checkboxDisabled = Bool
False
  , checkboxClasses :: [MisoString]
checkboxClasses = []
  , checkboxLabelClasses :: [MisoString]
checkboxLabelClasses = []
  , checkboxAttrs :: [Attribute action]
checkboxAttrs = []
  }
-----------------------------------------------------------------------------
-- | <https://basecoatui.com/components/checkbox/ Checkbox>: label-wrapped checkbox.
-- The children render as the label text.
checkbox_
  :: CheckboxProps action
  -> [View model action]
  -> View model action
checkbox_ :: forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
cfg [View model action]
kids =
  [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.label_
  [ [MisoString] -> Attribute action
forall action. [MisoString] -> Attribute action
P.classes_ (MisoString
"label" MisoString -> [MisoString] -> [MisoString]
forall a. a -> [a] -> [a]
: MisoString
"gap-3" MisoString -> [MisoString] -> [MisoString]
forall a. a -> [a] -> [a]
: CheckboxProps action -> [MisoString]
forall action. CheckboxProps action -> [MisoString]
checkboxLabelClasses CheckboxProps action
cfg) ]
  ( CheckboxProps action -> View model action
forall action model. CheckboxProps action -> View model action
checkboxInput_ CheckboxProps action
cfg View model action -> [View model action] -> [View model action]
forall a. a -> [a] -> [a]
: [View model action]
kids )
-----------------------------------------------------------------------------
-- | The bare checkbox @input@, for custom layouts
checkboxInput_ :: CheckboxProps action -> View model action
checkboxInput_ :: forall action model. CheckboxProps action -> View model action
checkboxInput_ CheckboxProps {Bool
[MisoString]
[Attribute action]
Maybe MisoString
checkboxId :: forall action. CheckboxProps action -> Maybe MisoString
checkboxName :: forall action. CheckboxProps action -> Maybe MisoString
checkboxValue :: forall action. CheckboxProps action -> Maybe MisoString
checkboxChecked :: forall action. CheckboxProps action -> Bool
checkboxDisabled :: forall action. CheckboxProps action -> Bool
checkboxClasses :: forall action. CheckboxProps action -> [MisoString]
checkboxLabelClasses :: forall action. CheckboxProps action -> [MisoString]
checkboxAttrs :: forall action. CheckboxProps action -> [Attribute action]
checkboxId :: Maybe MisoString
checkboxName :: Maybe MisoString
checkboxValue :: Maybe MisoString
checkboxChecked :: Bool
checkboxDisabled :: Bool
checkboxClasses :: [MisoString]
checkboxLabelClasses :: [MisoString]
checkboxAttrs :: [Attribute action]
..} = [Attribute action] -> View model action
forall action model. [Attribute action] -> View model action
H.input_ ([Attribute action] -> View model action)
-> [Attribute action] -> View model action
forall a b. (a -> b) -> a -> b
$ [[Attribute action]] -> [Attribute action]
forall (t :: * -> *) a. Foldable t => t [a] -> [a]
concat
  [ [ [MisoString] -> Attribute action
forall action. [MisoString] -> Attribute action
P.classes_ (MisoString
"input" MisoString -> [MisoString] -> [MisoString]
forall a. a -> [a] -> [a]
: [MisoString]
checkboxClasses)
    , MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.type_ MisoString
"checkbox"
    ]
  , [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.id_ MisoString
i | Just MisoString
i <- [Maybe MisoString
checkboxId] ]
  , [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.name_ MisoString
n | Just MisoString
n <- [Maybe MisoString
checkboxName] ]
  , [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.value_ MisoString
v | Just MisoString
v <- [Maybe MisoString
checkboxValue] ]
  , [ Bool -> Attribute action
forall action. Bool -> Attribute action
P.checked_ Bool
True | Bool
checkboxChecked ]
  , [ Attribute action
forall action. Attribute action
P.disabled_ | Bool
checkboxDisabled ]
  , [Attribute action]
checkboxAttrs
  ]
-----------------------------------------------------------------------------
-- | Compact usage example (source of the kitchen sink "Code" tab)
checkboxUsage :: View model action
checkboxUsage :: forall model action. View model action
checkboxUsage =
  [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 flex-col gap-6" ]
  [ CheckboxProps action -> [View model action] -> View model action
forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps [ View model action
"Accept terms and conditions" ]
  , CheckboxProps action -> [View model action] -> View model action
forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps { checkboxChecked = True } [ View model action
"Checked" ]
  , CheckboxProps action -> [View model action] -> View model action
forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps { checkboxDisabled = True } [ View model action
"Disabled" ]
  ]
-----------------------------------------------------------------------------
checkboxSample :: View model action
checkboxSample :: forall model action. View model action
checkboxSample =
  [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 flex-col gap-6 max-w-lg" ]
  [ CheckboxProps action -> [View model action] -> View model action
forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps [ View model action
"Accept terms and conditions" ]
  , [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 items-start gap-3" ]
    [ CheckboxProps action -> View model action
forall action model. CheckboxProps action -> View model action
checkboxInput_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps
      { checkboxId = Just "demo-checkbox-label-and-description" }
    , [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
"grid gap-2" ]
      [ LabelProps action -> [View model action] -> View model action
forall action model.
LabelProps action -> [View model action] -> View model action
label_ LabelProps action
forall action. LabelProps action
defaultLabelProps { labelFor = Just "demo-checkbox-label-and-description" }
        [ View model action
"Accept terms and conditions" ]
      , [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 text-sm" ]
        [ View model action
"By clicking this checkbox, you agree to the terms and conditions." ]
      ]
    ]
  , CheckboxProps action -> [View model action] -> View model action
forall action model.
CheckboxProps action -> [View model action] -> View model action
checkbox_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps { checkboxDisabled = True }
    [ View model action
"Enable notifications" ]
  , [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.label_
    [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"flex items-start gap-3 border p-3 hover:bg-accent/50 rounded-lg has-[input[type='checkbox']:checked]:border-blue-600 has-[input[type='checkbox']:checked]:bg-blue-50 dark:has-[input[type='checkbox']:checked]:border-blue-900 dark:has-[input[type='checkbox']:checked]:bg-blue-950" ]
    [ CheckboxProps action -> View model action
forall action model. CheckboxProps action -> View model action
checkboxInput_ CheckboxProps action
forall action. CheckboxProps action
defaultCheckboxProps
      { checkboxChecked = True
      , checkboxClasses =
        [ "checked:bg-blue-600"
        , "checked:border-blue-600"
        , "dark:checked:bg-blue-700"
        , "dark:checked:border-blue-700"
        , "checked:after:bg-white"
        ]
      }
    , [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
"grid gap-2" ]
      [ [Attribute action] -> [View model action] -> View model action
forall action model.
[Attribute action] -> [View model action] -> View model action
H.h2_ [ MisoString -> Attribute action
forall action. MisoString -> Attribute action
P.class_ MisoString
"text-sm leading-none font-medium" ] [ View model action
"Enable notifications" ]
      , [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 text-sm" ]
        [ View model action
"You can enable or disable notifications at any time." ]
      ]
    ]
  ]
-----------------------------------------------------------------------------
checkboxCodeSample :: View model action
checkboxCodeSample :: forall model action. View model action
checkboxCodeSample =
  View model action
"""
  -----------------------------------------------------------------------------
  module MyCheckbox (checkboxUsage) where
  -----------------------------------------------------------------------------
  import           Miso
  import qualified Miso.Html.Element as H
  import qualified Miso.Html.Property as P
  import           Miso.UI.Label
  import           Miso.UI.Checkbox
  -----------------------------------------------------------------------------
  checkboxUsage :: View model action
  checkboxUsage =
    H.div_
    [ P.class_ "flex flex-col gap-6" ]
    [ checkbox_ defaultCheckboxProps [ "Accept terms and conditions" ]
    , checkbox_ defaultCheckboxProps { checkboxChecked = True } [ "Checked" ]
    , checkbox_ defaultCheckboxProps { checkboxDisabled = True } [ "Disabled" ]
    ]
  """
-----------------------------------------------------------------------------
checkboxPropsApi :: View model action
checkboxPropsApi :: forall model action. View model action
checkboxPropsApi =
  View model action
"""
  -- | Props for 'checkbox_'
  data CheckboxProps action
    = CheckboxProps
    { checkboxId :: Maybe MisoString
    , checkboxName :: Maybe MisoString
    , checkboxValue :: Maybe MisoString
    , checkboxChecked :: Bool
    , checkboxDisabled :: Bool
    , checkboxClasses :: [MisoString]
      -- ^ Extra classes appended to the @input@
    , checkboxLabelClasses :: [MisoString]
      -- ^ Extra classes appended to the wrapping @label@
    , checkboxAttrs :: [Attribute action]
    }
  -----------------------------------------------------------------------------
  -- | Smart constructor: unchecked, enabled
  defaultCheckboxProps :: CheckboxProps action
  defaultCheckboxProps
    = CheckboxProps
    { checkboxId = Nothing
    , checkboxName = Nothing
    , checkboxValue = Nothing
    , checkboxChecked = False
    , checkboxDisabled = False
    , checkboxClasses = []
    , checkboxLabelClasses = []
    , checkboxAttrs = []
    }
  """
-----------------------------------------------------------------------------