miso-1.14.0.0: src/Miso/Native/X/Element/Svg.hs
-----------------------------------------------------------------------------
{-# LANGUAGE OverloadedStrings #-}
-----------------------------------------------------------------------------
-- |
-- Module : Miso.Native.X.Element.Svg
-- 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
--
-- [/<svg/>](https://lynxjs.org/api/elements/built-in/svg.html)
--
-- Displays SVG content supplied inline or by URL.
--
-- @since 1.13.0.0
----------------------------------------------------------------------------
module Miso.Native.X.Element.Svg
( -- *** Element
svgWith_
, module Miso.Native.X.Element.Svg.Event
, module Miso.Native.X.Element.Svg.Property
) where
-----------------------------------------------------------------------------
import Miso.Native.X.Element (svg_)
import Miso.Native.X.Element.Svg.Event
import Miso.Native.X.Element.Svg.Property
import Miso.Types (Attribute, View, withModel, withProps, withContext)
-----------------------------------------------------------------------------
-- | An @\<svg\>@ whose inline content is rendered against the enclosing
-- component's @context@, @props@ and @model@, so the content may itself use
-- 'Miso.Types.vcontext' \/ 'Miso.Types.vprops' \/ 'Miso.Types.vmodel'. The
-- values are obtained ambiently with 'Miso.Types.withContext' \/
-- 'Miso.Types.withProps' \/ 'Miso.Types.withModel' and passed to 'content_':
--
-- @
-- svgWith_ [ 'Miso.CSS.style_' [ 'Miso.CSS.width' "100px" ] ] $
-- Svg.svg_ [ textProp "xmlns" "http://www.w3.org/2000/svg" ]
-- [ 'Miso.Types.vmodel' $ \\Model { color } -> Svg.circle_ [ Svg.fill_ color ] [] ]
-- @
--
-- Compare 'content_', which takes the @context@, @props@ and @model@ to render
-- against as explicit arguments.
--
-- @since 1.14.0.0
svgWith_
:: [Attribute model action]
-> View context props model action
-- ^ Inline SVG content, in the component's own @context@ \/ @props@ \/
-- @model@ types
-> View context props model action
svgWith_ attrs content =
withContext $ \context -> withProps $ \props -> withModel $ \model ->
svg_ (content_ context props model content : attrs) []
-----------------------------------------------------------------------------