-----------------------------------------------------------------------------
{-# LANGUAGE OverloadedStrings #-}
-----------------------------------------------------------------------------
-- |
-- Module      :  Miso.Native.X.Element
-- Copyright   :  (C) 2016-2026 David M. Johnson
-- License     :  BSD3-style (see the file LICENSE)
-- Maintainer  :  David M. Johnson <code@dmj.io>
-- Stability   :  experimental
-- Portability :  non-portable
--
-- Smart constructors for the Lynx
-- [XElement](https://lynxjs.org/api/elements/built-in.html) family — the
-- extended, opt-in built-in elements (@\<input\>@, @\<textarea\>@,
-- @\<overlay\>@, @\<svg\>@, @\<refresh\>@, @\<viewpager\>@,
-- @\<scroll-coordinator\>@, @\<blur-view\>@, @\<webview\>@ and
-- @\<title-bar-view\>@).
--
-- Attributes, events and methods for each element live in the corresponding
-- @Miso.Native.X.Element.\<Name\>@ modules.
--
----------------------------------------------------------------------------
module Miso.Native.X.Element
  ( -- ** Input
    input_
    -- ** Textarea
  , textarea_
    -- ** Overlay
  , overlay_
    -- ** Svg
  , svg_
    -- ** Refresh
  , refresh_
  , refreshHeader_
    -- ** Viewpager
  , viewpager_
  , viewpagerItem_
    -- ** Scroll Coordinator
  , scrollCoordinator_
  , scrollCoordinatorHeader_
  , scrollCoordinatorSlot_
  , scrollCoordinatorToolbar_
    -- ** Blur View
  , blurView_
    -- ** Webview
  , webview_
    -- ** Title Bar View
  , titleBarView_
  ) where
-----------------------------------------------------------------------------
import           Miso.Native.Element (lynx_, lynxDirect_)
import           Miso.String (MisoString)
import           Miso.Types (View, Attribute)
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/input.html>
--
-- Single-line text input element. Does not support children.
--
input_ :: [Attribute model action] -> View context model action
input_ :: forall model action context.
[Attribute model action] -> View context model action
input_ [Attribute model action]
attrs = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_ [MisoString]
inputDirectEvents MisoString
"input" [Attribute model action]
attrs []
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/textarea.html>
--
-- Multi-line text input element. Does not support children.
--
textarea_ :: [Attribute model action] -> View context model action
textarea_ :: forall model action context.
[Attribute model action] -> View context model action
textarea_ [Attribute model action]
attrs = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_ [MisoString]
inputDirectEvents MisoString
"textarea" [Attribute model action]
attrs []
-----------------------------------------------------------------------------
-- | Events that @input@ and @textarea@ dispatch directly on the element (Lynx
-- component events that do not bubble to the delegated mount listener).
inputDirectEvents :: [MisoString]
inputDirectEvents :: [MisoString]
inputDirectEvents = [ MisoString
"blur", MisoString
"confirm", MisoString
"focus", MisoString
"input", MisoString
"selection" ]
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/overlay.html>
--
-- Renders its children on an independent layer above the page.
--
overlay_ :: [Attribute model action] -> [View context model action] -> View context model action
overlay_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
overlay_ = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_
  [ MisoString
"dismissoverlay", MisoString
"error", MisoString
"overlaytouch", MisoString
"requestclose", MisoString
"showoverlay" ]
  MisoString
"overlay"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/svg.html>
--
-- Displays SVG content, supplied either inline via @content_@ or by URL via
-- @src_@.
--
svg_ :: [Attribute model action] -> [View context model action] -> View context model action
svg_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
svg_ = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_ [ MisoString
"load" ] MisoString
"svg"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/refresh.html>
--
-- Pull-to-refresh container. Wraps a @refreshHeader_@ and a vertically
-- scrollable child.
--
refresh_ :: [Attribute model action] -> [View context model action] -> View context model action
refresh_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
refresh_ = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_
  [ MisoString
"headeroffset", MisoString
"refreshstatechange", MisoString
"startrefresh" ]
  MisoString
"refresh"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/refresh.html>
--
-- Customizable header revealed during the pull gesture of a @refresh_@.
--
refreshHeader_ :: [Attribute model action] -> [View context model action] -> View context model action
refreshHeader_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
refreshHeader_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"refresh-header"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/viewpager.html>
--
-- Horizontally paged container. Each page is a @viewpagerItem_@.
--
viewpager_ :: [Attribute model action] -> [View context model action] -> View context model action
viewpager_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
viewpager_ = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_ [ MisoString
"change", MisoString
"offsetchange", MisoString
"willchange" ] MisoString
"viewpager"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/viewpager.html>
--
-- A single page within a @viewpager_@.
--
viewpagerItem_ :: [Attribute model action] -> [View context model action] -> View context model action
viewpagerItem_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
viewpagerItem_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"viewpager-item"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/scroll-coordinator.html>
--
-- Coordinates nested scrolling, typically used with sticky headers and
-- tabbed layouts.
--
scrollCoordinator_ :: [Attribute model action] -> [View context model action] -> View context model action
scrollCoordinator_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
scrollCoordinator_ = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_ [ MisoString
"offset" ] MisoString
"scroll-coordinator"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/scroll-coordinator.html>
--
-- The collapsing header of a @scrollCoordinator_@. Folds away as the slot
-- content scrolls. Required (together with @scrollCoordinatorSlot_@).
--
scrollCoordinatorHeader_ :: [Attribute model action] -> [View context model action] -> View context model action
scrollCoordinatorHeader_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
scrollCoordinatorHeader_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"scroll-coordinator-header"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/scroll-coordinator.html>
--
-- The main content region of a @scrollCoordinator_@, whose scroll drives the
-- header fold. Holds the scrollable child (e.g. a @scrollView_@). Required
-- (together with @scrollCoordinatorHeader_@).
--
scrollCoordinatorSlot_ :: [Attribute model action] -> [View context model action] -> View context model action
scrollCoordinatorSlot_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
scrollCoordinatorSlot_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"scroll-coordinator-slot"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/scroll-coordinator.html>
--
-- An optional sticky bar of a @scrollCoordinator_@ that stays pinned while the
-- header folds (e.g. tabs above the content).
--
scrollCoordinatorToolbar_ :: [Attribute model action] -> [View context model action] -> View context model action
scrollCoordinatorToolbar_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
scrollCoordinatorToolbar_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"scroll-coordinator-toolbar"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/blur-view.html>
--
-- Applies a Gaussian blur / material effect to the content behind it.
--
blurView_ :: [Attribute model action] -> [View context model action] -> View context model action
blurView_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
blurView_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"blur-view"
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/webview.html>
--
-- Embeds a web page. Does not support children.
--
webview_ :: [Attribute model action] -> View context model action
webview_ :: forall model action context.
[Attribute model action] -> View context model action
webview_ [Attribute model action]
attrs = [MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
[MisoString]
-> MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynxDirect_
  [ MisoString
"error", MisoString
"load", MisoString
"locationchange", MisoString
"message", MisoString
"openwindow" ]
  MisoString
"webview" [Attribute model action]
attrs []
-----------------------------------------------------------------------------
-- | <https://lynxjs.org/api/elements/built-in/title-bar-view.html>
--
-- Defines a custom draggable window region (Clay Windows / macOS).
--
titleBarView_ :: [Attribute model action] -> [View context model action] -> View context model action
titleBarView_ :: forall model action context.
[Attribute model action]
-> [View context model action] -> View context model action
titleBarView_ = MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
forall model action context.
MisoString
-> [Attribute model action]
-> [View context model action]
-> View context model action
lynx_ MisoString
"title-bar-view"
-----------------------------------------------------------------------------