essence 0.0.1 → 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/lib/essence/component.rb +16 -0
- data/lib/essence/components/button.rb +51 -0
- data/lib/essence/components/link.rb +20 -0
- data/lib/essence/components/row.rb +29 -0
- data/lib/essence/components/skeleton.rb +14 -0
- data/lib/essence/version.rb +1 -1
- data/lib/essence.rb +10 -4
- metadata +23 -4
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 0a9516a2911b410deb58ca4b9ba2afbf083752314b0bb6df0018c81a4615f14d
|
4
|
+
data.tar.gz: 51074c18359021237cc4588b64a858aed0464746d5b9d0f0513319e722b73828
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a94fccdf29ea63f7fd807b786f8bd477ac44feb623a19bae66814412d6c170536b15ec46f8f02266c5bf6afbc0db61f2c30e95f2b58e5a6dbb3288a807af18ac
|
7
|
+
data.tar.gz: 8e49f1011e3ddbecf3b37f3f5a0bd257b94061eab3053c8f06f616f3a60cd5f179688f9deacda83eb6ccb9129c48a0c47c6b8607fe5ca80c36e9b22e379c5dec
|
@@ -0,0 +1,16 @@
|
|
1
|
+
class Essence::Component < Phlex::HTML
|
2
|
+
TAILWIND_MERGER = ::TailwindMerge::Merger.new.freeze unless defined?(TAILWIND_MERGER)
|
3
|
+
|
4
|
+
attr_reader :attributes
|
5
|
+
|
6
|
+
def initialize(**attributes)
|
7
|
+
@attributes = attributes
|
8
|
+
@attributes[:class] = TAILWIND_MERGER.merge([self.class::CLASSES, @attributes[:class]]) if @attributes[:class]
|
9
|
+
end
|
10
|
+
|
11
|
+
private
|
12
|
+
|
13
|
+
def default_attributes
|
14
|
+
{}
|
15
|
+
end
|
16
|
+
end
|
@@ -0,0 +1,51 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Button < Essence::Component
|
4
|
+
BASE = "inline-flex items-center rounded-xs border border-transparent font-medium transition duration-150 cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed hover:opacity-90"
|
5
|
+
|
6
|
+
SIZES = {
|
7
|
+
none: "",
|
8
|
+
xs: "text-[0.6rem] px-2 py-1.5 gap-1",
|
9
|
+
sm: "text-xs px-3 py-2 gap-1.5",
|
10
|
+
md: "text-sm px-4 py-2 gap-2",
|
11
|
+
lg: "text-base px-6 py-2.5 gap-2.5",
|
12
|
+
xl: "text-base px-8 py-3 gap-3"
|
13
|
+
}
|
14
|
+
|
15
|
+
KINDS = {
|
16
|
+
primary: "text-white bg-indigo-500 hover:bg-indigo-500",
|
17
|
+
secondary: "text-gray-700 bg-gray-100 hover:bg-gray-200",
|
18
|
+
critical: "text-white bg-rose-500 hover:bg-rose-400",
|
19
|
+
warning: "text-white bg-amber-500 hover:bg-amber-400",
|
20
|
+
success: "text-white bg-emerald-500 hover:bg-emerald-400",
|
21
|
+
info: "text-white bg-blue-500 hover:bg-blue-400",
|
22
|
+
dark: "text-white bg-gray-900 hover:bg-gray-800",
|
23
|
+
white: "text-gray-900 bg-white hover:bg-gray-200",
|
24
|
+
ghost: "text-gray-900 bg-white hover:bg-gray-200 hover:text-gray-800"
|
25
|
+
}
|
26
|
+
|
27
|
+
attr_reader :size
|
28
|
+
attr_reader :kind
|
29
|
+
attr_reader :attributes
|
30
|
+
|
31
|
+
def initialize(size: :md, kind: :primary, **attributes)
|
32
|
+
@size = size
|
33
|
+
@kind = kind
|
34
|
+
@attributes = attributes
|
35
|
+
@attributes[:class] = construct_classes(@attributes[:class])
|
36
|
+
end
|
37
|
+
|
38
|
+
def view_template(&)
|
39
|
+
element_tag(**attributes, &)
|
40
|
+
end
|
41
|
+
|
42
|
+
private
|
43
|
+
|
44
|
+
def element_tag(...)
|
45
|
+
attributes[:href] ? a(...) : button(...)
|
46
|
+
end
|
47
|
+
|
48
|
+
def construct_classes(classes)
|
49
|
+
TAILWIND_MERGER.merge([ BASE, SIZES[size], KINDS[kind], classes ].compact)
|
50
|
+
end
|
51
|
+
end
|
@@ -0,0 +1,20 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Link < Essence::Component
|
4
|
+
CLASS = "inline-flex items-center gap-1 font-medium text-gray-900 border-b-2 hover:border-gray-900 transition-colors"
|
5
|
+
KINDS = {
|
6
|
+
regular: "border-transparent",
|
7
|
+
underline: "border-gray-200"
|
8
|
+
}
|
9
|
+
|
10
|
+
attr_reader :attributes
|
11
|
+
|
12
|
+
def initialize(kind: :regular, **attributes)
|
13
|
+
@attributes = attributes
|
14
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ CLASS, @attributes[:class] ]) : CLASS
|
15
|
+
end
|
16
|
+
|
17
|
+
def view_template(&)
|
18
|
+
a(**attributes, &)
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1,29 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Row < Essence::Component
|
4
|
+
CLASS = "flex gap-4"
|
5
|
+
|
6
|
+
KINDS = {
|
7
|
+
default: "flex-col md:flex-row md:items-center md:justify-between",
|
8
|
+
center: "flex-col md:flex-row md:items-center md:justify-center",
|
9
|
+
start: "flex-col md:flex-row md:items-center md:justify-start",
|
10
|
+
end: "flex-col md:flex-row md:items-center md:justify-end",
|
11
|
+
}
|
12
|
+
|
13
|
+
attr_reader :kind
|
14
|
+
attr_reader :attributes
|
15
|
+
|
16
|
+
def initialize(kind: :default, **attributes)
|
17
|
+
@kind = kind
|
18
|
+
@attributes = attributes
|
19
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ CLASS, KINDS[kind], @attributes[:class] ]) : CLASS
|
20
|
+
end
|
21
|
+
|
22
|
+
def view_template(&)
|
23
|
+
div(**attributes, &)
|
24
|
+
end
|
25
|
+
|
26
|
+
def item(**attrs, &)
|
27
|
+
div(class: TAILWIND_MERGER.merge([ "flex items-center gap-2 flex-wrap", iattrs[:class] ]), **attrs, &)
|
28
|
+
end
|
29
|
+
end
|
@@ -0,0 +1,14 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Skeleton < Essence::Component
|
4
|
+
CLASSES = "animate-pulse bg-gray-200/55 rounded-xs"
|
5
|
+
|
6
|
+
def initialize(**attributes)
|
7
|
+
@attributes = attributes
|
8
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ CLASSES, @attributes[:class] ]) : CLASSES
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&)
|
12
|
+
div(**@attributes, &)
|
13
|
+
end
|
14
|
+
end
|
data/lib/essence/version.rb
CHANGED
data/lib/essence.rb
CHANGED
@@ -1,5 +1,11 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
1
|
+
require "tailwind_merge"
|
2
|
+
|
3
|
+
module Essence
|
4
|
+
# Autoloading
|
5
|
+
autoload :Component, "essence/component"
|
6
|
+
|
7
|
+
autoload :Button, "essence/components/button"
|
8
|
+
autoload :Link, "essence/components/link"
|
9
|
+
autoload :Skeleton, "essence/components/skeleton"
|
10
|
+
autoload :Row, "essence/components/row"
|
5
11
|
end
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: essence
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0
|
4
|
+
version: 0.1.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Elvinas Predkelis
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2024-
|
12
|
+
date: 2024-12-15 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: phlex
|
@@ -17,14 +17,28 @@ dependencies:
|
|
17
17
|
requirements:
|
18
18
|
- - ">="
|
19
19
|
- !ruby/object:Gem::Version
|
20
|
-
version: 2.0.0.
|
20
|
+
version: 2.0.0.rc1
|
21
21
|
type: :runtime
|
22
22
|
prerelease: false
|
23
23
|
version_requirements: !ruby/object:Gem::Requirement
|
24
24
|
requirements:
|
25
25
|
- - ">="
|
26
26
|
- !ruby/object:Gem::Version
|
27
|
-
version: 2.0.0.
|
27
|
+
version: 2.0.0.rc1
|
28
|
+
- !ruby/object:Gem::Dependency
|
29
|
+
name: tailwind_merge
|
30
|
+
requirement: !ruby/object:Gem::Requirement
|
31
|
+
requirements:
|
32
|
+
- - ">="
|
33
|
+
- !ruby/object:Gem::Version
|
34
|
+
version: 0.13.3
|
35
|
+
type: :runtime
|
36
|
+
prerelease: false
|
37
|
+
version_requirements: !ruby/object:Gem::Requirement
|
38
|
+
requirements:
|
39
|
+
- - ">="
|
40
|
+
- !ruby/object:Gem::Version
|
41
|
+
version: 0.13.3
|
28
42
|
description: Component library for Ruby applications using Phlex
|
29
43
|
email:
|
30
44
|
- info@primevise.com
|
@@ -33,6 +47,11 @@ extensions: []
|
|
33
47
|
extra_rdoc_files: []
|
34
48
|
files:
|
35
49
|
- lib/essence.rb
|
50
|
+
- lib/essence/component.rb
|
51
|
+
- lib/essence/components/button.rb
|
52
|
+
- lib/essence/components/link.rb
|
53
|
+
- lib/essence/components/row.rb
|
54
|
+
- lib/essence/components/skeleton.rb
|
36
55
|
- lib/essence/version.rb
|
37
56
|
homepage: https://rubygems.org/gems/essence
|
38
57
|
licenses:
|