essence 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +43 -1
- data/lib/essence/components/avatar.rb +35 -0
- data/lib/essence/components/badge.rb +41 -0
- data/lib/essence/components/button.rb +1 -3
- data/lib/essence/components/link.rb +2 -2
- data/lib/essence/components/row.rb +3 -4
- data/lib/essence/components/skeleton.rb +2 -2
- data/lib/essence/version.rb +1 -1
- data/lib/essence.rb +10 -5
- metadata +4 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: f9be2e0f4b7e7288c5cf845c54d67988f472a967ebdd04b6d01ac790c1d1c7a4
|
4
|
+
data.tar.gz: f1ebff9a5f1f108042f48f3241edc2cd5d8998d9605b20d6e52bed3b338219dc
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 067d0df4723dd420b5100d7c21c417f37e959e62e325154fcd3671a22b3b919d51720e6b6a911233a8791065d0a3a93a9b931c0111b5e4b90454aa6c8648b80c
|
7
|
+
data.tar.gz: 06d8732651332803411614ae867fd3e78ae226853992fd3d0367bc441054925d6647d4c2151d0c3e0af4b24990b8a24891c8042f816789cd454cda9f5197e03d
|
data/README.md
CHANGED
@@ -2,11 +2,53 @@
|
|
2
2
|
|
3
3
|
A simple, ergonomic and performant component library for Ruby applications.
|
4
4
|
|
5
|
+
<a href="https://rubygems.org/gems/essence">
|
6
|
+
<img alt="Essence GEM Version" src="https://img.shields.io/gem/v/essence?color=10b981&include_prereleases&logo=ruby&logoColor=f43f5e">
|
7
|
+
</a>
|
8
|
+
|
9
|
+
<a href="https://rubygems.org/gems/essence">
|
10
|
+
<img alt="Essence GEM Version" src="https://img.shields.io/gem/dt/essence?color=10b981&include_prereleases&logo=ruby&logoColor=f43f5e">
|
11
|
+
</a>
|
12
|
+
|
13
|
+
---
|
14
|
+
|
15
|
+
### Features
|
16
|
+
|
17
|
+
- Tailored components - Designed using flexibility in mind while streamlining the development process
|
18
|
+
- Gorgeous simplicity - Essence empowers minimalistic user interface with purposeful accents
|
19
|
+
- Geared for performance - Keep everything in one place. No spreadsheets or getting lost between tooling
|
20
|
+
- Ergonomic approach - Essence is designed to be easy to use and understand
|
21
|
+
|
5
22
|
---
|
6
23
|
|
7
24
|
## Installation
|
8
25
|
|
9
|
-
|
26
|
+
#### Add gem
|
27
|
+
|
28
|
+
Simply add the gem to your Gemfile by running the following command
|
29
|
+
|
30
|
+
```bash
|
31
|
+
bundle add essence
|
32
|
+
```
|
33
|
+
|
34
|
+
#### Install Essence
|
35
|
+
|
36
|
+
Run the installation command and we'll take care of the rest
|
37
|
+
|
38
|
+
```bash
|
39
|
+
bundle exec essence install
|
40
|
+
```
|
41
|
+
|
42
|
+
More information on about the installation can be found in the [documentation](https://essence.primevise.com/installation)
|
43
|
+
|
44
|
+
## Who uses Essence?
|
45
|
+
|
46
|
+
- [Mintis](https://mintis.app)
|
47
|
+
- [Hansa](https://hansahq.com)
|
48
|
+
- [Release Server](https://releaseserver.com)
|
49
|
+
- [College Life Work](https://work.collegelife.co)
|
50
|
+
|
51
|
+
Do you use Essence in your project? Let us know!
|
10
52
|
|
11
53
|
## Licence
|
12
54
|
|
@@ -0,0 +1,35 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Avatar < Essence::Essence
|
4
|
+
BASE = "border border-transparent rounded-full bg-gray-100 aspect-square inline-flex items-center justify-center font-medium text-gray-700 overflow-hidden"
|
5
|
+
|
6
|
+
SIZES = {
|
7
|
+
sm: "size-6 text-[0.5rem]",
|
8
|
+
md: "size-8 text-xs",
|
9
|
+
lg: "size-12 text-sm"
|
10
|
+
}
|
11
|
+
|
12
|
+
attr_reader :attributes
|
13
|
+
attr_reader :size
|
14
|
+
|
15
|
+
def initialize(size: :md, **attributes)
|
16
|
+
@size = size
|
17
|
+
@attributes = attributes
|
18
|
+
@attributes[:class] = construct_classes(@attributes[:class])
|
19
|
+
end
|
20
|
+
|
21
|
+
def view_template(&)
|
22
|
+
div(**attributes) do
|
23
|
+
img(src: attributes[:src], alt: attributes[:alt]) if attributes[:src]
|
24
|
+
yield if block_given?
|
25
|
+
end
|
26
|
+
end
|
27
|
+
|
28
|
+
def fallback(**attrs, &)
|
29
|
+
div(**attrs, &)
|
30
|
+
end
|
31
|
+
|
32
|
+
def construct_classes(classes)
|
33
|
+
TAILWIND_MERGER.merge([ BASE, SIZES[size], classes ].compact)
|
34
|
+
end
|
35
|
+
end
|
@@ -0,0 +1,41 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
class Essence::Badge < Essence::Essence
|
4
|
+
BASE = "inline-flex items-center justify-center w-fit rounded-full border border-transparent font-medium transition duration-150 hover:opacity-90"
|
5
|
+
SIZES = {
|
6
|
+
none: "",
|
7
|
+
sm: "text-[0.65rem] px-2 py-0.5 gap-1 min-w-8",
|
8
|
+
md: "text-xs px-2.5 py-1 gap-2 min-w-12",
|
9
|
+
lg: "text-sm px-4 py-1 gap-2 min-w-16"
|
10
|
+
}
|
11
|
+
KINDS = {
|
12
|
+
primary: "text-gray-900 border-gray-200",
|
13
|
+
success: "text-white bg-emerald-500",
|
14
|
+
critical: "text-white bg-rose-500",
|
15
|
+
warning: "text-white bg-amber-500",
|
16
|
+
info: "text-white bg-blue-500",
|
17
|
+
dark: "text-white bg-gray-900",
|
18
|
+
white: "text-gray-900 bg-white"
|
19
|
+
}
|
20
|
+
|
21
|
+
attr_reader :size
|
22
|
+
attr_reader :kind
|
23
|
+
attr_reader :attributes
|
24
|
+
|
25
|
+
def initialize(size: :md, kind: :primary, **attributes)
|
26
|
+
@size = size
|
27
|
+
@kind = kind
|
28
|
+
@attributes = attributes
|
29
|
+
@attributes[:class] = construct_classes(@attributes[:class])
|
30
|
+
end
|
31
|
+
|
32
|
+
def view_template(&)
|
33
|
+
div(**attributes, &)
|
34
|
+
end
|
35
|
+
|
36
|
+
private
|
37
|
+
|
38
|
+
def construct_classes(classes)
|
39
|
+
TAILWIND_MERGER.merge([ BASE, SIZES[size], KINDS[kind], classes ].compact)
|
40
|
+
end
|
41
|
+
end
|
@@ -1,8 +1,7 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
3
|
class Essence::Button < Essence::Essence
|
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
|
-
|
4
|
+
BASE = "inline-flex items-center justify-center w-fit rounded-xs border border-transparent font-medium transition duration-150 cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed hover:opacity-90"
|
6
5
|
SIZES = {
|
7
6
|
none: "",
|
8
7
|
xs: "text-[0.6rem] px-2 py-1.5 gap-1",
|
@@ -11,7 +10,6 @@ class Essence::Button < Essence::Essence
|
|
11
10
|
lg: "text-base px-6 py-2.5 gap-2.5",
|
12
11
|
xl: "text-base px-8 py-3 gap-3"
|
13
12
|
}
|
14
|
-
|
15
13
|
KINDS = {
|
16
14
|
primary: "text-white bg-indigo-500 hover:bg-indigo-500",
|
17
15
|
secondary: "text-gray-700 bg-gray-100 hover:bg-gray-200",
|
@@ -1,7 +1,7 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
3
|
class Essence::Link < Essence::Essence
|
4
|
-
|
4
|
+
BASE = "inline-flex w-fit items-center gap-1 font-medium text-gray-900 border-b-2 hover:border-gray-900 transition-colors"
|
5
5
|
KINDS = {
|
6
6
|
regular: "border-transparent",
|
7
7
|
underline: "border-gray-200"
|
@@ -11,7 +11,7 @@ class Essence::Link < Essence::Essence
|
|
11
11
|
|
12
12
|
def initialize(kind: :regular, **attributes)
|
13
13
|
@attributes = attributes
|
14
|
-
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([
|
14
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ BASE, @attributes[:class] ]) : BASE
|
15
15
|
end
|
16
16
|
|
17
17
|
def view_template(&)
|
@@ -1,8 +1,7 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
3
|
class Essence::Row < Essence::Essence
|
4
|
-
|
5
|
-
|
4
|
+
BASE = "flex gap-4"
|
6
5
|
KINDS = {
|
7
6
|
default: "flex-col md:flex-row md:items-center md:justify-between",
|
8
7
|
center: "flex-col md:flex-row md:items-center md:justify-center",
|
@@ -16,7 +15,7 @@ class Essence::Row < Essence::Essence
|
|
16
15
|
def initialize(kind: :default, **attributes)
|
17
16
|
@kind = kind
|
18
17
|
@attributes = attributes
|
19
|
-
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([
|
18
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ BASE, KINDS[kind], @attributes[:class] ]) : BASE
|
20
19
|
end
|
21
20
|
|
22
21
|
def view_template(&)
|
@@ -24,6 +23,6 @@ class Essence::Row < Essence::Essence
|
|
24
23
|
end
|
25
24
|
|
26
25
|
def item(**attrs, &)
|
27
|
-
div(class: TAILWIND_MERGER.merge([ "flex items-center gap-2 flex-wrap",
|
26
|
+
div(class: TAILWIND_MERGER.merge([ "flex items-center gap-2 flex-wrap", attrs[:class] ]), **attrs, &)
|
28
27
|
end
|
29
28
|
end
|
@@ -1,11 +1,11 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
3
|
class Essence::Skeleton < Essence::Essence
|
4
|
-
|
4
|
+
BASE = "animate-pulse bg-gray-200/55 rounded-xs"
|
5
5
|
|
6
6
|
def initialize(**attributes)
|
7
7
|
@attributes = attributes
|
8
|
-
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([
|
8
|
+
@attributes[:class] = @attributes[:class] ? TAILWIND_MERGER.merge([ BASE, @attributes[:class] ]) : BASE
|
9
9
|
end
|
10
10
|
|
11
11
|
def view_template(&)
|
data/lib/essence/version.rb
CHANGED
data/lib/essence.rb
CHANGED
@@ -4,12 +4,13 @@ require "tailwind_merge"
|
|
4
4
|
|
5
5
|
module Essence
|
6
6
|
# Autoloading
|
7
|
-
autoload :
|
8
|
-
|
7
|
+
autoload :Avatar, "essence/components/avatar"
|
8
|
+
autoload :Badge, "essence/components/badge"
|
9
9
|
autoload :Button, "essence/components/button"
|
10
|
+
# autoload :Essence, "essence/components/essence" # Base component
|
10
11
|
autoload :Link, "essence/components/link"
|
11
|
-
autoload :Skeleton, "essence/components/skeleton"
|
12
12
|
autoload :Row, "essence/components/row"
|
13
|
+
autoload :Skeleton, "essence/components/skeleton"
|
13
14
|
|
14
15
|
autoload :CLI, "essence/cli"
|
15
16
|
|
@@ -19,20 +20,24 @@ module Essence
|
|
19
20
|
def self.component_class_names
|
20
21
|
@component_class_names ||= {
|
21
22
|
essence: "Essence::Essence",
|
23
|
+
avatar: "Essence::Avatar",
|
24
|
+
badge: "Essence::Badge",
|
22
25
|
button: "Essence::Button",
|
23
26
|
link: "Essence::Link",
|
24
|
-
skeleton: "Essence::Skeleton",
|
25
27
|
row: "Essence::Row",
|
28
|
+
skeleton: "Essence::Skeleton",
|
26
29
|
}
|
27
30
|
end
|
28
31
|
|
29
32
|
def self.component_classes
|
30
33
|
@components_classes ||= {
|
31
34
|
essence: ::Essence::Essence,
|
35
|
+
avatar: ::Essence::Avatar,
|
36
|
+
badge: ::Essence::Badge,
|
32
37
|
button: ::Essence::Button,
|
33
38
|
link: ::Essence::Link,
|
34
|
-
skeleton: ::Essence::Skeleton,
|
35
39
|
row: ::Essence::Row,
|
40
|
+
skeleton: ::Essence::Skeleton,
|
36
41
|
}
|
37
42
|
end
|
38
43
|
|
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.2.
|
4
|
+
version: 0.2.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Elvinas Predkelis
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: exe
|
11
11
|
cert_chain: []
|
12
|
-
date: 2024-12-
|
12
|
+
date: 2024-12-22 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: dry-cli
|
@@ -74,6 +74,8 @@ files:
|
|
74
74
|
- lib/essence/cli/add.rb
|
75
75
|
- lib/essence/cli/install.rb
|
76
76
|
- lib/essence/cli/version.rb
|
77
|
+
- lib/essence/components/avatar.rb
|
78
|
+
- lib/essence/components/badge.rb
|
77
79
|
- lib/essence/components/button.rb
|
78
80
|
- lib/essence/components/essence.rb
|
79
81
|
- lib/essence/components/link.rb
|