component.rb in solidus_admin-0.1.0

- old
+ new
@@ -1,98 +1,21 @@
 # frozen_string_literal: true
 
 class SolidusAdmin::UI::Toggletip::Component < SolidusAdmin::BaseComponent
-  # Icon size: 1rem
-  # Arrow size: 0.375rem
-  # Banner padding x: 0.75rem
   POSITIONS = {
-    up: {
-      arrow: %w[before:top-0 before:left-1/2 before:translate-y-[-50%] before:translate-x-[-50%]],
-      bubble: %w[translate-x-[calc(-50%+(1rem/2))] translate-y-[calc(0.375rem/2)]]
+    below: {
+      arrow: "before:top-0 before:left-1/2 before:translate-y-[-50%] before:translate-x-[-50%]",
+      bubble: "translate-x-[calc(-50%+(1rem/2))] translate-y-[calc(0.375rem/2)]"
     },
-    up_right: {
-      arrow: %w[before:top-0 before:right-0 before:translate-y-[-50%]],
-      bubble: %w[translate-x-[calc(-100%+0.75rem+(1rem/2)+(0.375rem/2))] translate-y-[calc(0.375rem/2)]]
+    above: {
+      arrow: "before:bottom-0 before:left-1/2 before:translate-y-[50%] before:translate-x-[-50%]",
+      bubble: "translate-x-[calc(-50%+(1rem/2))] translate-y-[calc(-100%-1rem-(0.375rem/2))]"
     },
-    right: {
-      arrow: %w[before:top-1/2 before:right-0 before:translate-y-[-50%] before:translate-x-[0.93rem]],
-      bubble: %w[translate-x-[calc(-100%+(-0.375rem/2))] translate-y-[calc(-50%-(1rem/2))]]
-    },
-    down_right: {
-      arrow: %w[before:bottom-0 before:right-0 before:translate-y-[50%]],
-      bubble: %w[translate-x-[calc(-100%+0.75rem+(1rem/2)+(0.376rem/2))] translate-y-[calc(-100%-1rem-(0.375rem/2))]]
-    },
-    down: {
-      arrow: %w[before:bottom-0 before:left-1/2 before:translate-y-[50%] before:translate-x-[-50%]],
-      bubble: %w[translate-x-[calc(-50%+(1rem/2))] translate-y-[calc(-100%-1rem-(0.375rem/2))]]
-    },
-    down_left: {
-      arrow: %w[before:bottom-0 before:left-0 before:translate-y-[50%]],
-      bubble: %w[translate-x-[calc(-1rem/2)] translate-y-[calc(-100%-0.75rem-0.375rem)]]
-    },
-    left: {
-      arrow: %w[before:top-1/2 before:left-0 before:translate-y-[-50%] before:translate-x-[-0.93rem]],
-      bubble: %w[translate-x-[calc(1rem+(0.375rem/2))] translate-y-[calc(-50%-(1rem/2))]]
-    },
-    up_left: {
-      arrow: %w[before:top-0 before:left-0 before:translate-y-[-50%]],
-      bubble: %w[translate-x-[calc(-0.75rem+0.375rem)] translate-y-[calc(0.375rem/2)]]
-    },
-    none: {
-      arrow: %w[before:hidden],
-      bubble: %w[translate-x-[calc(-50%+0.75rem)]]
-    }
   }.freeze
 
-  THEMES = {
-    light: {
-      icon: %w[fill-gray-500],
-      bubble: %w[text-gray-800 bg-gray-50]
-    },
-    dark: {
-      icon: %w[fill-gray-800],
-      bubble: %w[text-white bg-gray-800]
-    }
-  }.freeze
-
-  # @param text [String] The toggletip text
-  # @param position [Symbol] The position of the arrow in relation to the
-  #   toggletip. The latter will be positioned accordingly in relation to the
-  #   help icon. Defaults to `:up`. See `POSITIONS` for available options.
-  # @param theme [Symbol] The theme of the toggletip. Defaults to `:light`. See
-  #   `THEMES` for available options.
-  def initialize(text:, position: :down, theme: :light, **attributes)
+  def initialize(text:, position: :above, **attributes)
     @text = text
     @position = position
-    @theme = theme
     @attributes = attributes
-    @attributes[:class] = [
-      "relative inline-block",
-      @attributes[:class],
-    ].join(" ")
-  end
-
-  def icon_theme_classes
-    THEMES.fetch(@theme)[:icon].join(" ")
-  end
-
-  def bubble_theme_classes
-    THEMES.fetch(@theme)[:bubble].join(" ")
-  end
-
-  def bubble_position_classes
-    POSITIONS.fetch(@position)[:bubble].join(" ")
-  end
-
-  def bubble_arrow_pseudo_element
-    (
-      [
-        "before:content['']",
-        "before:absolute",
-        "before:w-[0.375rem]",
-        "before:h-[0.375rem]",
-        "before:rotate-45",
-        "before:bg-inherit",
-      ] + POSITIONS.fetch(@position)[:arrow]
-    ).join(" ")
+    @attributes[:class] = "relative inline-block #{@attributes[:class]}"
   end
 end