essence 0.2.1 → 0.2.2

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: b698fdfbf94b34b4afa01e1c6f38a2e9ac2feca00f34166c0acead4c4e6c8e40
4
- data.tar.gz: b11e693d29dbc9bd6763725692570bffb8879cafb32967cc1c34a2fbc5c65881
3
+ metadata.gz: f9be2e0f4b7e7288c5cf845c54d67988f472a967ebdd04b6d01ac790c1d1c7a4
4
+ data.tar.gz: f1ebff9a5f1f108042f48f3241edc2cd5d8998d9605b20d6e52bed3b338219dc
5
5
  SHA512:
6
- metadata.gz: b95a0636aca009728061fc524f93bfeacf2728aa846e7e6ff7afa8918ba99ce1a47ba80ef8bc44863d982c0cb8cc1ef760f61f9c367b9cddd9beda463de5798c
7
- data.tar.gz: 371fb23359faf1f9e5835394c2fea1952813d7f43bf0f008704b641dca2d50faa2463c371869d1511a8625a22b9416ac8d2c3b59f09ceae36ca1c1e6fc865d29
6
+ metadata.gz: 067d0df4723dd420b5100d7c21c417f37e959e62e325154fcd3671a22b3b919d51720e6b6a911233a8791065d0a3a93a9b931c0111b5e4b90454aa6c8648b80c
7
+ data.tar.gz: 06d8732651332803411614ae867fd3e78ae226853992fd3d0367bc441054925d6647d4c2151d0c3e0af4b24990b8a24891c8042f816789cd454cda9f5197e03d
@@ -1,49 +1,35 @@
1
1
  # frozen_string_literal: true
2
2
 
3
- class Essence::Button < Essence::Essence
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"
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
+
5
6
  SIZES = {
6
- none: "",
7
- xs: "text-[0.6rem] px-2 py-1.5 gap-1",
8
- sm: "text-xs px-3 py-2 gap-1.5",
9
- md: "text-sm px-4 py-2 gap-2",
10
- lg: "text-base px-6 py-2.5 gap-2.5",
11
- xl: "text-base px-8 py-3 gap-3"
12
- }
13
- KINDS = {
14
- primary: "text-white bg-indigo-500 hover:bg-indigo-500",
15
- secondary: "text-gray-700 bg-gray-100 hover:bg-gray-200",
16
- critical: "text-white bg-rose-500 hover:bg-rose-400",
17
- warning: "text-white bg-amber-500 hover:bg-amber-400",
18
- success: "text-white bg-emerald-500 hover:bg-emerald-400",
19
- info: "text-white bg-blue-500 hover:bg-blue-400",
20
- dark: "text-white bg-gray-900 hover:bg-gray-800",
21
- white: "text-gray-900 bg-white hover:bg-gray-200",
22
- ghost: "text-gray-900 bg-white hover:bg-gray-200 hover:text-gray-800"
7
+ sm: "size-6 text-[0.5rem]",
8
+ md: "size-8 text-xs",
9
+ lg: "size-12 text-sm"
23
10
  }
24
11
 
25
- attr_reader :size
26
- attr_reader :kind
27
12
  attr_reader :attributes
13
+ attr_reader :size
28
14
 
29
- def initialize(size: :md, kind: :primary, **attributes)
15
+ def initialize(size: :md, **attributes)
30
16
  @size = size
31
- @kind = kind
32
17
  @attributes = attributes
33
18
  @attributes[:class] = construct_classes(@attributes[:class])
34
19
  end
35
20
 
36
21
  def view_template(&)
37
- element_tag(**attributes, &)
22
+ div(**attributes) do
23
+ img(src: attributes[:src], alt: attributes[:alt]) if attributes[:src]
24
+ yield if block_given?
25
+ end
38
26
  end
39
27
 
40
- private
41
-
42
- def element_tag(...)
43
- attributes[:href] ? a(...) : button(...)
28
+ def fallback(**attrs, &)
29
+ div(**attrs, &)
44
30
  end
45
31
 
46
32
  def construct_classes(classes)
47
- TAILWIND_MERGER.merge([ BASE, SIZES[size], KINDS[kind], classes ].compact)
33
+ TAILWIND_MERGER.merge([ BASE, SIZES[size], classes ].compact)
48
34
  end
49
35
  end
@@ -1,18 +1,30 @@
1
1
  # frozen_string_literal: true
2
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"
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
5
  SIZES = {
6
- sm: "size-6 text-xs",
7
- md: "size-8 text-sm",
8
- lg: "size-12 text-base"
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"
9
19
  }
10
20
 
11
- attr_reader :attributes
12
21
  attr_reader :size
22
+ attr_reader :kind
23
+ attr_reader :attributes
13
24
 
14
- def initialize(size: :md, **attributes)
25
+ def initialize(size: :md, kind: :primary, **attributes)
15
26
  @size = size
27
+ @kind = kind
16
28
  @attributes = attributes
17
29
  @attributes[:class] = construct_classes(@attributes[:class])
18
30
  end
@@ -21,11 +33,9 @@ class Essence::Avatar < Essence::Essence
21
33
  div(**attributes, &)
22
34
  end
23
35
 
24
- def fallback(**attrs, &)
25
- span(**attrs, &)
26
- end
36
+ private
27
37
 
28
38
  def construct_classes(classes)
29
- TAILWIND_MERGER.merge([ BASE, SIZES[size], classes ].compact)
39
+ TAILWIND_MERGER.merge([ BASE, SIZES[size], KINDS[kind], classes ].compact)
30
40
  end
31
41
  end
@@ -1,21 +1,25 @@
1
1
  # frozen_string_literal: true
2
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"
3
+ class Essence::Button < Essence::Essence
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"
5
5
  SIZES = {
6
6
  none: "",
7
- sm: "text-[0.65rem] px-2 py-0.5 gap-1",
8
- md: "text-xs px-2.5 py-1 gap-2",
9
- lg: "text-sm px-4 py-1.5 gap-2"
7
+ xs: "text-[0.6rem] px-2 py-1.5 gap-1",
8
+ sm: "text-xs px-3 py-2 gap-1.5",
9
+ md: "text-sm px-4 py-2 gap-2",
10
+ lg: "text-base px-6 py-2.5 gap-2.5",
11
+ xl: "text-base px-8 py-3 gap-3"
10
12
  }
11
13
  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"
14
+ primary: "text-white bg-indigo-500 hover:bg-indigo-500",
15
+ secondary: "text-gray-700 bg-gray-100 hover:bg-gray-200",
16
+ critical: "text-white bg-rose-500 hover:bg-rose-400",
17
+ warning: "text-white bg-amber-500 hover:bg-amber-400",
18
+ success: "text-white bg-emerald-500 hover:bg-emerald-400",
19
+ info: "text-white bg-blue-500 hover:bg-blue-400",
20
+ dark: "text-white bg-gray-900 hover:bg-gray-800",
21
+ white: "text-gray-900 bg-white hover:bg-gray-200",
22
+ ghost: "text-gray-900 bg-white hover:bg-gray-200 hover:text-gray-800"
19
23
  }
20
24
 
21
25
  attr_reader :size
@@ -30,13 +34,16 @@ class Essence::Badge < Essence::Essence
30
34
  end
31
35
 
32
36
  def view_template(&)
33
- div(**attributes, &)
37
+ element_tag(**attributes, &)
34
38
  end
35
39
 
36
40
  private
37
41
 
42
+ def element_tag(...)
43
+ attributes[:href] ? a(...) : button(...)
44
+ end
45
+
38
46
  def construct_classes(classes)
39
47
  TAILWIND_MERGER.merge([ BASE, SIZES[size], KINDS[kind], classes ].compact)
40
48
  end
41
-
42
49
  end
@@ -1,3 +1,3 @@
1
1
  module Essence
2
- VERSION = "0.2.1"
2
+ VERSION = "0.2.2"
3
3
  end
data/lib/essence.rb CHANGED
@@ -4,12 +4,13 @@ require "tailwind_merge"
4
4
 
5
5
  module Essence
6
6
  # Autoloading
7
- autoload :Component, "essence/components/component"
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,12 +20,12 @@ module Essence
19
20
  def self.component_class_names
20
21
  @component_class_names ||= {
21
22
  essence: "Essence::Essence",
22
- avataro: "Essence::Avatar",
23
+ avatar: "Essence::Avatar",
23
24
  badge: "Essence::Badge",
24
25
  button: "Essence::Button",
25
26
  link: "Essence::Link",
26
- skeleton: "Essence::Skeleton",
27
27
  row: "Essence::Row",
28
+ skeleton: "Essence::Skeleton",
28
29
  }
29
30
  end
30
31
 
@@ -35,8 +36,8 @@ module Essence
35
36
  badge: ::Essence::Badge,
36
37
  button: ::Essence::Button,
37
38
  link: ::Essence::Link,
38
- skeleton: ::Essence::Skeleton,
39
39
  row: ::Essence::Row,
40
+ skeleton: ::Essence::Skeleton,
40
41
  }
41
42
  end
42
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.1
4
+ version: 0.2.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Elvinas Predkelis