web-view 0.7.0 → 0.7.1

raw patch · 7 files changed

+64/−153 lines, 7 filesdep −Diff

Dependencies removed: Diff

Files

• README.md +2/−148
• src/Web/View.hs +7/−0
• src/Web/View/Element.hs +8/−0
• src/Web/View/Render.hs +0/−1
• src/Web/View/Style.hs +43/−0
• src/Web/View/Types.hs +2/−1
• web-view.cabal +2/−3

@@ -1,152 +1,6 @@ Web View ============ -[![Hackage](https://img.shields.io/hackage/v/web-view.svg)][hackage]--Type-safe HTML and CSS with intuitive layout and composable styles. Inspired by Tailwindcss and Elm-UI--### Write Haskell instead of CSS--Type-safe utility functions to generate styled HTML.--```haskell-myPage = col (gap 10) $ do-  el (bold . fontSize 32) "My page"-  button (border 1) "Click Me"-```--Leverage the full power of Haskell functions for reuse, instead of relying on CSS.--```haskell-header = bold-h1 = header . fontSize 32-h2 = header . fontSize 24-page = gap 10--myPage = col page $ do-  el h1 "My Page"-  ...-```--This approach is inspired by Tailwindcss' [Utility Classes](https://tailwindcss.com/docs/utility-first)--### Intuitive Layouts--Easily create layouts with `row`, `col`, `grow`, and `space`--```haskell-holygrail :: View c ()-holygrail = layout id $ do-  row section "Top Bar"-  row grow $ do-    col section "Left Sidebar"-    col (section . grow) "Main Content"-    col section "Right Sidebar"-  row section "Bottom Bar"-  where section = 'border' 1-```--### Embedded CSS--Views track which styles are used in any child node, and automatically embed all CSS when rendered. --    >>> renderText $ el bold "Hello"-    -    <style type='text/css'>.bold { font-weight:bold }</style>-    <div class='bold'>Hello</div>---### Stateful Styles--We can apply styles when certain states apply. For example, to change the background on hover:--```haskell-button (bg Primary . hover (bg PrimaryLight)) "Hover Me"-```--Media states allow us to create responsive designs--```haskell-el (width 100 . media (MinWidth 800) (width 400))-  "Big if window > 800"-```--### Try Example Project with Nix--If you want to get a feel for web-view without cloning the project run `nix run github:seanhess/web-view` to run the example webserver locally--Local Development--------------------### Nix--Prepend targets with ghc982 or ghc966 to use GHC 9.8.2 or GHC 9.6.6--- `nix run` starts the example project with GHC 9.8.2-- `nix develop` to get a shell with all dependencies installed for GHC 9.8.2. -- `nix develop .#ghc966-web-view` for GHC 9.6.6--You can also get a development shell for the example project with:--```-cd example-nix develop ../#ghc982-example-cabal run-```--You can import this flake's overlay to add `web-view` to all package sets and override ghc966 and ghc982 with the packages to satisfy `web-view`'s dependencies.--```nix-{-  inputs = {-    nixpkgs.url = "github:nixos/nixpkgs/nixpkgs-unstable";-    web-view.url = "github:seanhess/web-view"; # or "path:/path/to/cloned/web-view";-    flake-utils.url = "github:numtide/flake-utils";-  };--  outputs = { self, nixpkgs, web-view, flake-utils, ... }:-    flake-utils.lib.eachDefaultSystem (-      system:-      let-        pkgs = import nixpkgs {-          inherit system;-          overlays = [ web-view.overlays.default ];-        };-        haskellPackagesOverride = pkgs.haskell.packages.ghc966.override (old: {-          overrides = pkgs.lib.composeExtensions (old.overrides or (_: _: { })) (hfinal: hprev: {-            # your overrides here-          });-        });-      in-      {-        devShells.default = haskellPackagesOverride.shellFor {-          packages = p: [ p.web-view ];-        };-      }-    );-}-```---Learn More-------------View Documentation on [Hackage][hackage]-* https://hackage.haskell.org/package/web-view--View on Github-* https://github.com/seanhess/web-view--View [Examples](https://github.com/seanhess/web-view/blob/latest/example/app/Main.hs)---[hackage]: https://hackage.haskell.org/package/web-view---Contributors---------------* [Sean Hess](https://github.com/seanhess)-* [Kamil Figiela](https://github.com/kfigiela)-* [Pfalzgraf Martin](https://github.com/Skyfold)+## DEPRECATED +This package has been renamed to [atomic-css](http://github.com/seanhess/atomic-css), focusing on css utilities. `View` features like `context` have been moved to [hyperbole](https://github.com/seanhess/hyperbole)

@@ -61,6 +61,8 @@   , input   , name   , value+  , placeholder+  , autofocus   , label   , link   , button@@ -117,6 +119,11 @@   , transition   , TransitionProperty (..)   , Ms+  , flexWrap+  , textWrap+  , FlexWrap (..)+  , TextWrap+  , Wrap (..)      -- ** Selector States   , hover

@@ -99,6 +99,14 @@ button = tag "button"  +placeholder :: Text -> Mod id+placeholder = att "placeholder"+++autofocus :: Mod c+autofocus = att "autofocus" ""++ -- * Document Metadata  

@@ -8,7 +8,6 @@  import Data.ByteString.Lazy qualified as BL import Data.Function ((&))-import Data.List (foldl') import Data.Map.Strict qualified as M import Data.Maybe (mapMaybe) import Data.String (fromString)

@@ -363,6 +363,49 @@ instance Style Display None  +data Wrap+  = Wrap+  | NoWrap+  deriving (Show, ToClassName)+instance ToStyleValue Wrap where+  toStyleValue Wrap = "wrap"+  toStyleValue NoWrap = "nowrap"+++data FlexWrap+  = WrapReverse+  deriving (Show, ToStyleValue)+instance Style FlexWrap FlexWrap+instance Style FlexWrap Wrap+instance ToClassName FlexWrap where+  toClassName WrapReverse = "rev"+++flexWrap :: (Style FlexWrap a, ToClassName a, ToStyleValue a) => a -> Mod c+flexWrap w =+  addClass $+    cls ("fwrap" -. w)+      & prop "flex-wrap" w+++data TextWrap+++--   = Balance+--   | Pretty+--   | Stable+--   deriving (Show, ToStyleValue, ToClassName)+-- instance Style TextWrap TextWrap+instance Style TextWrap Wrap+++textWrap :: (Style TextWrap a, ToClassName a, ToStyleValue a) => a -> Mod c+textWrap w =+  addClass $+    cls ("twrap" -. w)+      & prop "text-wrap" w++ -- * Selector Modifiers  

@@ -1,5 +1,5 @@-{-# LANGUAGE DefaultSignatures #-} {-# LANGUAGE AllowAmbiguousTypes #-}+{-# LANGUAGE DefaultSignatures #-} {-# LANGUAGE DeriveAnyClass #-} {-# LANGUAGE DerivingStrategies #-} @@ -389,6 +389,7 @@   styleValue :: value -> StyleValue   default styleValue :: (ToStyleValue value) => value -> StyleValue   styleValue = toStyleValue+  class ToClass cls value where   toClass :: value -> Class

@@ -5,7 +5,7 @@ -- see: https://github.com/sol/hpack  name:           web-view-version:        0.7.0+version:        0.7.1 synopsis:       Type-safe HTML and CSS with intuitive layouts and composable styles. description:    Type-safe HTML and CSS with intuitive layouts and composable styles. Inspired by Tailwindcss and Elm-UI . See documentation for the @Web.View@ module below category:       Web@@ -85,8 +85,7 @@       NoFieldSelectors   ghc-options: -Wall -fdefer-typed-holes -threaded -rtsopts -with-rtsopts=-N -F -pgmF=skeletest-preprocessor   build-depends:-      Diff >=0.5 && <1.0-    , base >=4.16 && <5+      base >=4.16 && <5     , bytestring >=0.11 && <0.13     , casing >0.1.3.0 && <0.2     , containers >=0.6 && <1