ariadne_view_components 0.0.14 → 0.0.15

data/app/components/ariadne/tooltip-component.js

@@ -0,0 +1,42 @@
+import { Controller } from '@hotwired/stimulus';
+import { createPopper } from '@popperjs/core';
+export default class TooltipComponent extends Controller {
+    // Create a new Popper instance
+    connect() {
+        this.popperInstance = createPopper(this.triggerTarget, this.tooltipTarget, {
+            placement: this.placementValue,
+            modifiers: [
+                {
+                    name: 'offset',
+                    options: {
+                        offset: this.offsetValue
+                    }
+                }
+            ]
+        });
+    }
+    // Destroy the Popper instance
+    disconnect() {
+        if (this.popperInstance) {
+            this.popperInstance.destroy();
+        }
+    }
+    show() {
+        this.tooltipTarget.setAttribute('data-tooltip-show', '');
+        this.tooltipTarget.classList.remove('ariadne-invisible');
+        // We need to tell Popper to update the tooltip position
+        // after we show the tooltip, otherwise it will be incorrect
+        this.popperInstance.update();
+        this.dispatch('shown', { detail: { trigger: this.triggerTarget, tooltip: this.tooltipTarget } });
+    }
+    hide() {
+        this.tooltipTarget.removeAttribute('data-tooltip-show');
+        this.tooltipTarget.classList.add('ariadne-invisible');
+        this.dispatch('ariadne-hidden', { detail: { trigger: this.triggerTarget, tooltip: this.tooltipTarget } });
+    }
+}
+TooltipComponent.targets = ['trigger', 'tooltip'];
+TooltipComponent.values = {
+    placement: { type: String, default: 'top' },
+    offset: { type: Array, default: [0, 8] }
+};

data/app/lib/ariadne/form_builder.rb

@@ -5,14 +5,14 @@ module Ariadne
   class FormBuilder < ActionView::Helpers::FormBuilder
     include ClassNameHelper
 
-    DEFAULT_SECTION_CLASSES = "ariadne-pt-8 ariadne-space-y-6 sm:ariadne-pt-10 sm:ariadne-space-y-5"
+    DEFAULT_SECTION_CLASSES = "ariadne-space-y-6 ariadne-px-4"
     def section(classes: "", attributes: {}, &block)
       actual_classes = class_names(DEFAULT_SECTION_CLASSES, classes)
       options = { class: actual_classes, **attributes }
       @template.content_tag(:div, **options, &block)
     end
 
-    DEFAULT_SECTION_HEADING_CLASSES = "ariadne-text-lg ariadne-leading-6 ariadne-font-medium ariadne-text-gray-900"
+    DEFAULT_SECTION_HEADING_CLASSES = "ariadne-text-lg ariadne-leading-6 ariadne-py-4 ariadne-font-medium ariadne-text-gray-900"
     def heading(tag: :h3, classes: "", attributes: {}, &block)
       actual_classes = class_names(DEFAULT_SECTION_HEADING_CLASSES, classes)
       options = { class: actual_classes, **attributes }

data/lib/ariadne/view_components/version.rb

@@ -2,6 +2,6 @@
 
 module Ariadne
   module ViewComponents
-    VERSION = "0.0.14"
+    VERSION = "0.0.15"
   end
 end

data/lib/tasks/docs.rake

@@ -70,7 +70,6 @@ namespace :docs do
       Ariadne::InlineFlexComponent,
       Ariadne::LinkComponent,
       Ariadne::ListComponent,
-      Ariadne::MainComponent,
       Ariadne::NarrowContainerComponent,
       Ariadne::PanelBarComponent,
       Ariadne::PillComponent,

data/static/arguments.yml

@@ -475,17 +475,6 @@
     type: Hash
     default: "`{}`"
     description: "[Classes and attributes](/classes-attributes)"
-- component: Main
-  source: https://github.com/yettoapp/ariadne/ruby/view_components/tree/main/app/components/ariadne/main_component.rb
-  parameters:
-  - name: classes
-    type: String
-    default: '`""`'
-    description: "[Classes and attributes](/classes-attributes)"
-  - name: attributes
-    type: Hash
-    default: "`{}`"
-    description: "[Classes and attributes](/classes-attributes)"
 - component: NarrowContainer
   source: https://github.com/yettoapp/ariadne/ruby/view_components/tree/main/app/components/ariadne/narrow_container_component.rb
   parameters:

data/static/audited_at.json

@@ -28,7 +28,6 @@
   "Ariadne::LinkComponent": "",
   "Ariadne::ListComponent": "",
   "Ariadne::ListComponent::ListItem": "",
-  "Ariadne::MainComponent": "",
   "Ariadne::NarrowContainerComponent": "",
   "Ariadne::PanelBarComponent": "",
   "Ariadne::PanelBarComponent::PanelItem": "",

data/static/classes.yml

@@ -4,7 +4,6 @@
 - ".ariadne-ring-2"
 - ".ariadne-ring-white"
 - ".ariadne-cursor-pointer"
-- ".ariadne-font-semibold"
 - ".hover:ariadne-text-button-text-color"
 - ".focus:ariadne-outline-none"
 - ".focus:ariadne-ring-2"
@@ -46,8 +45,9 @@
 - ".sm:ariadne-text-4xl"
 - ".ariadne-mt-8"
 - ".ariadne-justify-center"
-- ".ariadne-flex-col"
-- ".ariadne-min-h-screen"
+- ".ariadne-scroll-smooth"
+- ".ariadne-bg-white"
+- ".ariadne-antialiased"
 - ".ariadne-text-purple-800"
 - ".ariadne-bg-purple-50"
 - ".hover:ariadne-bg-purple-100"
@@ -85,6 +85,7 @@
 - ".ariadne-absolute"
 - ".ariadne-bg-slate-900"
 - ".ariadne-text-white"
+- ".ariadne-font-semibold"
 - ".ariadne-max-w-xs"
 - ".ariadne-py-1"
 - ".ariadne-px-2"
@@ -94,7 +95,6 @@
 - ".ariadne-underline"
 - ".ariadne-decoration-double"
 - ".ariadne-text-green-600"
-- ".ariadne-bg-white"
 - ".ariadne-border-gray-300"
 - ".ariadne-shadow"
 - ".ariadne-py-5"
@@ -151,6 +151,7 @@
 - ".ariadne-mt-4"
 - ".ariadne-pt-5"
 - ".ariadne--mx-2"
+- ".ariadne-flex-col"
 - ".ariadne-mt-6"
 - ".ariadne-text-slate-500"
 - ".sm:ariadne-mt-0"
@@ -170,7 +171,6 @@
 - ".ariadne-divide-gray-300"
 - ".ariadne-relative"
 - ".hover:ariadne-bg-button-hover-color"
-- ".ariadne-flex-auto"
 - ".md:ariadne-flex"
 - ".md:ariadne-divide-y-0"
 - ".ariadne-py-0.5"

data/static/constants.json

@@ -96,7 +96,7 @@
     ]
   },
   "Ariadne::BodyComponent": {
-    "DEFAULT_CLASSES": "ariadne-flex ariadne-flex-col ariadne-min-h-screen"
+    "DEFAULT_CLASSES": "ariadne-scroll-smooth ariadne-bg-white ariadne-antialiased"
   },
   "Ariadne::ButtonComponent": {
     "DEFAULT_SCHEME": "default",
@@ -283,7 +283,7 @@
     "DEFAULT_ITEM_CLASSES": "ariadne-flex ariadne-flex-col ariadne-text-center ariadne-rounded-lg ariadne-shadow text-black-700 ariadne-border-black"
   },
   "Ariadne::HeaderComponent": {
-    "DEFAULT_CLASSES": "ariadne-sticky ariadne-top-0 ariadne-z-50 ariadne-px-4 ariadne-py-5 ariadne-bg-white ariadne-shadow-sm shadow-slate-900/5 ariadne-transition ariadne-duration-500",
+    "DEFAULT_CLASSES": "ariadne-sticky ariadne-top-0 ariadne-z-50 ariadne-px-4 ariadne-h-16 ariadne-bg-white ariadne-shadow-sm shadow-slate-900/5 ariadne-transition ariadne-duration-500",
     "DEFAULT_IMAGE_LOGO_CLASSES": "ariadne-h-10 ariadne-w-auto",
     "DEFAULT_NAV_LINK_CLASSES": "ariadne-inline-block ariadne-rounded-lg ariadne-py-1 ariadne-px-2 ariadne-text-sm text-slate-700 hover:bg-slate-100 hover:text-slate-900",
     "DEFAULT_PROFILE_LINK_CLASSES": "group ariadne-inline-flex ariadne-items-center ariadne-justify-center ariadne-rounded-full ariadne-py-2 ariadne-px-4 ariadne-text-sm ariadne-font-semibold focus:ariadne-outline-none focus-visible:ariadne-outline-2 focus-visible:outline-offset-2",
@@ -418,7 +418,7 @@
   },
   "Ariadne::LinkComponent": {
     "DEFAULT_ACTIONABLE_CLASSES": "ariadne-underline ariadne-decoration-double",
-    "DEFAULT_CLASSES": "ariadne-cursor-pointer ariadne-font-semibold hover:ariadne-text-button-text-color focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2 focus:ariadne-ring-purple-500",
+    "DEFAULT_CLASSES": "ariadne-cursor-pointer hover:ariadne-text-button-text-color focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2 focus:ariadne-ring-purple-500",
     "DEFAULT_TAG": "a",
     "TAG_OPTIONS": [
       "a",
@@ -433,9 +433,6 @@
   "Ariadne::ListComponent::ListItem": {
     "DEFAULT_ITEM_CLASSES": "ariadne-relative ariadne-p-1.5 focus:ariadne-ring-2 focus:ariadne-ring-offset-2 focus:ariadne-ring-purple-500 hover:ariadne-bg-button-hover-color"
   },
-  "Ariadne::MainComponent": {
-    "DEFAULT_CLASSES": "ariadne-flex-auto"
-  },
   "Ariadne::NarrowContainerComponent": {
     "DEFAULT_CLASSES": "ariadne-max-w-7xl ariadne-mx-auto ariadne-py-12 ariadne-px-4 sm:ariadne-px-6 lg:ariadne-py-16 lg:ariadne-px-8",
     "DEFAULT_TAG": "div",

data/static/statuses.json

@@ -28,7 +28,6 @@
   "Ariadne::LinkComponent": "stable",
   "Ariadne::ListComponent": "stable",
   "Ariadne::ListComponent::ListItem": "stable",
-  "Ariadne::MainComponent": "stable",
   "Ariadne::NarrowContainerComponent": "stable",
   "Ariadne::PanelBarComponent": "stable",
   "Ariadne::PanelBarComponent::PanelItem": "stable",

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ariadne_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.14
+  version: 0.0.15
 platform: ruby
 authors:
 - Garen J. Torikian
-autorequire: 
+autorequire:
 bindir: exe
 cert_chain: []
-date: 2022-10-03 00:00:00.000000000 Z
+date: 2022-10-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: tailwind_merge
@@ -98,7 +98,7 @@ dependencies:
     - - "<"
       - !ruby/object:Gem::Version
         version: '3.0'
-description: 
+description:
 email:
 - gjtorikian@yettoapp.com
 executables:
@@ -108,6 +108,7 @@ extra_rdoc_files: []
 files:
 - LICENSE.txt
 - README.md
+- app/assets/builds/ariadne_view_components.css
 - app/assets/config/manifest.js
 - app/assets/javascripts/ariadne-form-with.d.ts
 - app/assets/javascripts/ariadne-form.d.ts
@@ -127,7 +128,13 @@ files:
 - app/assets/stylesheets/dropdown.css
 - app/assets/stylesheets/prosemirror.css
 - app/assets/stylesheets/tooltip-component.css
+- app/components/ariadne/ariadne-form-with.d.ts
+- app/components/ariadne/ariadne-form-with.js
+- app/components/ariadne/ariadne-form.d.ts
+- app/components/ariadne/ariadne-form.js
 - app/components/ariadne/ariadne-form.ts
+- app/components/ariadne/ariadne.d.ts
+- app/components/ariadne/ariadne.js
 - app/components/ariadne/ariadne.ts
 - app/components/ariadne/avatar_component.rb
 - app/components/ariadne/avatar_stack_component.html.erb
@@ -139,9 +146,15 @@ files:
 - app/components/ariadne/body_component.rb
 - app/components/ariadne/button_component.html.erb
 - app/components/ariadne/button_component.rb
+- app/components/ariadne/clipboard-copy-component.d.ts
+- app/components/ariadne/clipboard-copy-component.js
 - app/components/ariadne/clipboard-copy-component.ts
+- app/components/ariadne/clipboard_copy_component.d.ts
 - app/components/ariadne/clipboard_copy_component.html.erb
+- app/components/ariadne/clipboard_copy_component.js
 - app/components/ariadne/clipboard_copy_component.rb
+- app/components/ariadne/comment-component.d.ts
+- app/components/ariadne/comment-component.js
 - app/components/ariadne/comment-component.ts
 - app/components/ariadne/comment_component.html.erb
 - app/components/ariadne/comment_component.rb
@@ -175,20 +188,32 @@ files:
 - app/components/ariadne/link_component.rb
 - app/components/ariadne/list_component.html.erb
 - app/components/ariadne/list_component.rb
-- app/components/ariadne/main_component.rb
 - app/components/ariadne/narrow_container_component.html.erb
 - app/components/ariadne/narrow_container_component.rb
 - app/components/ariadne/panel_bar_component.html.erb
 - app/components/ariadne/panel_bar_component.rb
 - app/components/ariadne/pill_component.html.erb
 - app/components/ariadne/pill_component.rb
+- app/components/ariadne/rich-text-area-component.d.ts
+- app/components/ariadne/rich-text-area-component.js
 - app/components/ariadne/rich-text-area-component.ts
 - app/components/ariadne/rich_text_area_component.html.erb
 - app/components/ariadne/rich_text_area_component.rb
+- app/components/ariadne/slideover-component.d.ts
+- app/components/ariadne/slideover-component.js
 - app/components/ariadne/slideover-component.ts
+- app/components/ariadne/slideover_component.d.ts
 - app/components/ariadne/slideover_component.html.erb
+- app/components/ariadne/slideover_component.js
 - app/components/ariadne/slideover_component.rb
+- app/components/ariadne/tab-component.js
+- app/components/ariadne/tab-container-component copy.d.ts
+- app/components/ariadne/tab-container-component copy.js
+- app/components/ariadne/tab-container-component.d.ts
+- app/components/ariadne/tab-container-component.js
 - app/components/ariadne/tab-container-component.ts
+- app/components/ariadne/tab-nav-component.d.ts
+- app/components/ariadne/tab-nav-component.js
 - app/components/ariadne/tab-nav-component.ts
 - app/components/ariadne/tab_component.html.erb
 - app/components/ariadne/tab_component.rb
@@ -198,11 +223,19 @@ files:
 - app/components/ariadne/tab_nav_component.rb
 - app/components/ariadne/table_nav_component.html.erb
 - app/components/ariadne/table_nav_component.rb
+- app/components/ariadne/tabs-component.d.ts
+- app/components/ariadne/tabs-component.js
 - app/components/ariadne/text.rb
+- app/components/ariadne/time-ago-component.d.ts
+- app/components/ariadne/time-ago-component.js
 - app/components/ariadne/time-ago-component.ts
+- app/components/ariadne/time_ago_component.d.ts
+- app/components/ariadne/time_ago_component.js
 - app/components/ariadne/time_ago_component.rb
 - app/components/ariadne/timeline_component.html.erb
 - app/components/ariadne/timeline_component.rb
+- app/components/ariadne/tooltip-component.d.ts
+- app/components/ariadne/tooltip-component.js
 - app/components/ariadne/tooltip-component.ts
 - app/components/ariadne/tooltip_component.html.erb
 - app/components/ariadne/tooltip_component.rb
@@ -252,7 +285,7 @@ licenses:
 - MIT
 metadata:
   allowed_push_host: https://rubygems.org
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -271,7 +304,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubygems_version: 3.3.7
-signing_key: 
+signing_key:
 specification_version: 4
 summary: ViewComponents for the Ariadne Design System
 test_files: []

data/app/components/ariadne/main_component.rb

@@ -1,32 +0,0 @@
-# frozen_string_literal: true
-
-module Ariadne
-  # Add a general description of component here
-  # Add additional usage considerations or best practices that may aid the user to use the component correctly.
-  # @accessibility Add any accessibility considerations
-  class MainComponent < Ariadne::Component
-    DEFAULT_CLASSES = "ariadne-flex-auto"
-
-    # @example Default
-    #
-    #   <%= render(Ariadne::MainComponent.new) { "Example" } %>
-    #
-    # @param classes [String] <%= link_to_classes_docs %>
-    # @param attributes [Hash] <%= link_to_attributes_docs %>
-    def initialize(classes: "", attributes: {})
-      @tag = :main
-      @classes = class_names(
-        DEFAULT_CLASSES,
-        classes,
-      )
-
-      @attributes = attributes
-    end
-
-    def call
-      render(Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes)) do
-        render(Ariadne::ContainerComponent.new) { content }
-      end
-    end
-  end
-end