ariadne_view_components 0.0.16 → 0.0.18

data/app/components/ariadne/comment_component.html.erb

@@ -1,40 +1,34 @@
 <%= render(Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes)) do %>
-  <div class="ariadne-bg-white" data-comment-component-target="commentComponent">
-    <div class="ariadne-hidden sm:ariadne-block">
-      <div class="ariadne-border-b ariadne-border-gray-200">
-        <%= render(Ariadne::TabContainerComponent.new(sr_label: @sr_label)) do |tab_container| %>
-          <%= tab_container.tab(id: public_tab.id, selected: public_tab.selected, classes: public_tab.classes, attributes: public_tab.attributes) do |tab| %>
-            <% tab.text { @public_tab_text } %>
-            <% tab.panel do %>
-              <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
-                <div class="ariadne-overflow-hidden ariadne-border-x ariadne-border-b ariadne-border-gray-300 ariadne-shadow-sm focus-within:ariadne-border-indigo-500 focus-within:ariadne-ring-1 focus-within:ariadne-ring-indigo-500">
-                  <%= hidden_field_tag 'message_public', true %>
-                  <%= render(Ariadne::RichTextAreaComponent.new(name: :bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
-                  <% comment_box.submit { @submit } %>
-                </div>
-                <div class="ariadne-mt-2 ariadne-flex ariadne-justify-end">
-                  <%= submit %>
-                </div>
-              <% end %>
-            <% end %>
-          <% end %>
-          <%= tab_container.tab(id: internal_tab.id, selected: internal_tab.selected, classes: internal_tab.classes, attributes: internal_tab.attributes) do |tab| %>
-            <% tab.text { @internal_tab_text } %>
-            <% tab.panel do %>
-              <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
-                <div class="ariadne-overflow-hidden ariadne-border-x ariadne-border-b ariadne-border-gray-300 ariadne-shadow-sm focus-within:ariadne-border-indigo-500 focus-within:ariadne-ring-1 focus-within:ariadne-ring-indigo-500">
-                  <%= hidden_field_tag 'message_public', false %>
-                  <%= render(Ariadne::RichTextAreaComponent.new(name: :bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
-                  <% comment_box.submit { @submit } %>
-                </div>
-                <div class="ariadne-mt-2 ariadne-flex ariadne-justify-end">
-                  <%= submit %>
-                </div>
-              <% end %>
-            <% end %>
-          <% end %>
+  <%= render(Ariadne::TabContainerComponent.new(sr_label: @sr_label)) do |tab_container| %>
+    <%= tab_container.tab(id: public_tab.id, selected: public_tab.selected, classes: public_tab.classes, attributes: public_tab.attributes) do |tab| %>
+      <% tab.text { @public_tab_text } %>
+      <% tab.panel(attributes: {:"data-public" => true}) do %>
+        <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
+          <div class="ariadne-overflow-hidden ariadne-border ariadne-border-gray-300 ariadne-shadow-sm focus-within:ariadne-border-indigo-500 focus-within:ariadne-ring-1 focus-within:ariadne-ring-indigo-500">
+            <%= hidden_field_tag 'message_public', true %>
+            <%= render(Ariadne::RichTextAreaComponent.new(name: :public_bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
+            <% comment_box.submit { @submit } %>
+          </div>
+          <div class="ariadne-mt-2 ariadne-flex ariadne-justify-end">
+            <%= public_submit %>
+          </div>
         <% end %>
-      </div>
-    </div>
-  </div>
+      <% end %>
+    <% end %>
+    <%= tab_container.tab(id: internal_tab.id, selected: internal_tab.selected, classes: internal_tab.classes, attributes: internal_tab.attributes) do |tab| %>
+      <% tab.text { @internal_tab_text } %>
+      <% tab.panel do %>
+        <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
+          <div class="ariadne-overflow-hidden ariadne-border ariadne-border-gray-300 ariadne-shadow-sm focus-within:ariadne-border-indigo-500 focus-within:ariadne-ring-1 focus-within:ariadne-ring-indigo-500">
+            <%= hidden_field_tag 'message_public', false %>
+            <%= render(Ariadne::RichTextAreaComponent.new(name: :internal_bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
+            <% comment_box.submit { @submit } %>
+          </div>
+          <div class="ariadne-mt-2 ariadne-flex ariadne-justify-end">
+            <%= internal_submit %>
+          </div>
+        <% end %>
+      <% end %>
+    <% end %>
+  <% end %>
 <% end %>

data/app/components/ariadne/comment_component.rb

@@ -15,7 +15,6 @@ module Ariadne
     DEFAULT_CLASSES = "ariadne-bg-white ariadne-border-gray-300 ariadne-border ariadne-shadow ariadne-py-5 ariadne-px-5 ariadne-rounded-md "
 
     renders_one :public_tab, lambda { |selected: false, text:, classes: "", attributes: {}|
-      attributes[:"data-comment-component-target"] ||= "tab"
       attributes[:"data-public"] = true
       @tab_idx += 1
       id = attributes.fetch(:id, "public-tab-#{@tab_idx}")
@@ -24,8 +23,12 @@ module Ariadne
       Ariadne::TabComponent.new(selected: selected, classes: classes, id: id, with_panel: true, attributes: attributes)
     }
 
+    renders_one :public_submit, lambda { |classes: "", attributes: {}|
+      Ariadne::ButtonComponent.new(type: Ariadne::BaseButton::TYPE_SUBMIT, scheme: Ariadne::ButtonComponent::DEFAULT_SCHEME, classes: classes, attributes: attributes)
+    }
+
     renders_one :internal_tab, lambda { |selected: false, text:, classes: "", attributes: {}|
-      attributes[:"data-comment-component-target"] ||= "tab"
+      attributes[:"data-public"] = false
       @tab_idx += 1
       id = attributes.fetch(:id, "internal-tab-#{@tab_idx}")
       @internal_tab_text = text
@@ -33,7 +36,7 @@ module Ariadne
       Ariadne::TabComponent.new(selected: selected, classes: classes, id: id, with_panel: true, attributes: attributes)
     }
 
-    renders_one :submit, lambda { |classes: "", attributes: {}|
+    renders_one :internal_submit, lambda { |classes: "", attributes: {}|
       Ariadne::ButtonComponent.new(type: Ariadne::BaseButton::TYPE_SUBMIT, scheme: Ariadne::ButtonComponent::DEFAULT_SCHEME, classes: classes, attributes: attributes)
     }
 
@@ -41,8 +44,9 @@ module Ariadne
     #
     #  <%= render(Ariadne::CommentComponent.new(url: "/messages", method: :post, sr_label: "Select delivery time")) do |comment| %>
     #    <% comment.public_tab(selected: true, text: "Reply to sender") %>
+    #    <% comment.public_submit { "Send" } %>
     #    <% comment.internal_tab(text: "Internal comment") %>
-    #    <% comment.submit { "Send" } %>
+    #    <% comment.internal_submit { "Send" } %>
     #  <% end %>
     #
     # @param url [String] The URL to take action against.
@@ -50,7 +54,7 @@ module Ariadne
     # @param sr_label [String] A label to introduce these tabs for screen readers.
     # @param classes [String] <%= link_to_classes_docs %>
     # @param attributes [Hash] <%= link_to_attributes_docs %>
-    def initialize(url:, method:, sr_label:, classes: "", attributes: {})
+    def initialize(url:, method: :post, sr_label:, classes: "", attributes: {})
       @tag = DEFAULT_TAG
       @classes = class_names(
         DEFAULT_CLASSES,
@@ -62,8 +66,6 @@ module Ariadne
 
       @tab_idx = -1
       @attributes = attributes
-      @attributes[:"data-controller"] = "comment-component"
-      attributes[:"data-comment-component-target"] = "commentComponent"
     end
   end
 end

data/app/components/ariadne/details_component.rb

@@ -58,7 +58,7 @@ module Ariadne
     # @param reset [Boolean] If set to true, it will remove the default caret and remove style from the summary element
     # @param classes [String] <%= link_to_classes_docs %>
     # @param attributes [Hash] <%= link_to_attributes_docs %>
-    def initialize(overlay: NO_OVERLAY, reset: false, classes: "", attributes: {})
+    def initialize(overlay: NO_OVERLAY, reset: true, classes: "", attributes: {})
       @tag = DEFAULT_TAG
       @reset = reset
 

data/app/components/ariadne/rich-text-area-component.ts

@@ -14,12 +14,12 @@ export default class RichTextArea extends Controller {
         editorProps: {
           attributes: {
             class:
-              'ariadne-m-5 focus:ariadne-outline-none ariadne-block ariadne-w-full ariadne-resize-none ariadne-p-0 ariadne-pb-2 ariadne-border-none focus:ariadne-ring-0 sm:ariadne-text-sm'
+              'focus:ariadne-outline-none ariadne-block ariadne-w-full ariadne-resize-none ariadne-p-0 ariadne-pb-2 ariadne-border-none focus:ariadne-ring-0 sm:ariadne-text-sm'
           }
         }
       })
 
-      const tiptapValueContainer = document.querySelector('input[data-tiptap-value-container=true]')
+      const tiptapValueContainer = editorElement.previousElementSibling
       if (tiptapValueContainer) {
         const parentForm = editorElement.closest('form')
 

data/app/components/ariadne/tab_container_component.erb

@@ -5,8 +5,6 @@
     <% end %>
   </div>
   <% tabs.each do |tab| %>
-    <div class="ariadne-pt-2">
-      <%= tab.panel %>
-    </div>
+    <%= tab.panel %>
   <% end %>
 <% end %>

data/app/lib/ariadne/action_view_extensions/form_helper.rb

@@ -6,7 +6,7 @@ module Ariadne
     module FormHelper
       include ClassNameHelper
 
-      DEFAULT_FORM_CLASSES = "ariadne-space-y-8 ariadne-divide-y ariadne-divide-gray-200 sm:ariadne-space-y-5"
+      DEFAULT_FORM_CLASSES = "ariadne-space-y-8 sm:ariadne-space-y-5"
       def ariadne_form_with(model: nil, scope: nil, url: nil, format: nil, classes: "", attributes: {}, **options, &block)
         options[:class] = class_names(DEFAULT_FORM_CLASSES, options[:class])
         options[:builder] ||= Ariadne::FormBuilder

data/lib/ariadne/view_components/version.rb

@@ -2,6 +2,6 @@
 
 module Ariadne
   module ViewComponents
-    VERSION = "0.0.16"
+    VERSION = "0.0.18"
   end
 end

data/static/arguments.yml

@@ -168,7 +168,7 @@
     description: The URL to take action against.
   - name: method
     type: String
-    default: N/A
+    default: "`:post`"
     description: The method to use when submitting the form.
   - name: sr_label
     type: String
@@ -240,7 +240,7 @@
       `:none`.
   - name: reset
     type: Boolean
-    default: "`false`"
+    default: "`true`"
     description: If set to true, it will remove the default caret and remove style
       from the summary element
   - name: classes

data/static/classes.yml

@@ -99,10 +99,6 @@
 - ".ariadne-shadow"
 - ".ariadne-py-5"
 - ".ariadne-px-5"
-- ".ariadne-hidden"
-- ".sm:ariadne-block"
-- ".ariadne-border-b"
-- ".ariadne-border-gray-200"
 - ".ariadne-text-gray-500"
 - ".hover:ariadne-text-gray-700"
 - ".hover:ariadne-border-gray-300"
@@ -112,22 +108,20 @@
 - ".ariadne-border-b-2"
 - ".ariadne-border-indigo-500"
 - ".ariadne-text-indigo-600"
-- ".ariadne-pt-2"
 - ".ariadne-space-y-8"
-- ".ariadne-divide-y"
-- ".ariadne-divide-gray-200"
 - ".sm:ariadne-space-y-5"
-- ".ariadne-border-x"
 - ".focus-within:ariadne-border-indigo-500"
 - ".focus-within:ariadne-ring-1"
 - ".focus-within:ariadne-ring-indigo-500"
 - ".tiptap-editor"
 - ".ariadne-mt-2"
 - ".ariadne-justify-end"
+- ".ariadne__details-reset"
 - ".ariadne-right-0"
 - ".ariadne-z-10"
 - ".ariadne-w-56"
 - ".ariadne-origin-top-right"
+- ".ariadne-divide-y"
 - ".ariadne-divide-gray-100"
 - ".ariadne-shadow-lg"
 - ".ariadne-ring-1"
@@ -175,8 +169,10 @@
 - ".md:ariadne-divide-y-0"
 - ".ariadne-py-0.5"
 - ".ariadne-text-black"
+- ".ariadne-hidden"
 - ".ariadne-pb-4"
 - ".ariadne-list-none"
+- ".ariadne-divide-gray-200"
 - ".ariadne-text-lg"
 - ".ariadne-pt-6"
 - ".ariadne-flow-root"

data/static/constants.json

@@ -102,7 +102,7 @@
     "DEFAULT_SCHEME": "default",
     "LINK_SCHEME": "link",
     "SCHEME_CLASS_MAPPINGS": {
-      "link": "ariadne-underline ariadne-decoration-double",
+      "link": "ariadne-cursor-pointer ariadne-font-semibold ariadne-underline ariadne-decoration-double",
       "none": "",
       "default": "ariadne-text-purple-800 ariadne-bg-purple-50 hover:ariadne-bg-purple-100 ariadne-border-purple-300 focus:ariadne-ring-offset-purple-50 focus:ariadne-ring-purple-600",
       "info": "ariadne-text-blue-800 ariadne-bg-blue-50 hover:ariadne-bg-blue-100 ariadne-border-blue-300 focus:ariadne-ring-offset-blue-50 focus:ariadne-ring-blue-600",
@@ -132,11 +132,12 @@
       "data-action": "click->clipboard-copy-component#copy mouseover->tooltip-component#show mouseout->tooltip-component#hide",
       "data-tooltip-component-target": "trigger"
     },
-    "DEFAULT_CLASSES": "ariadne-underline ariadne-decoration-double",
+    "DEFAULT_CLASSES": "ariadne-cursor-pointer ariadne-font-semibold ariadne-underline ariadne-decoration-double",
     "DEFAULT_TAG": "clipboard-copy"
   },
   "Ariadne::CommentComponent": {
-    "DEFAULT_CLASSES": "ariadne-bg-white ariadne-border-gray-300 ariadne-border ariadne-shadow ariadne-py-5 ariadne-px-5 ariadne-rounded-md ",
+    "DEFAULT_CLASSES": "ariadne-bg-internal-message ariadne-border-gray-300 ariadne-border ariadne-shadow ariadne-py-5 ariadne-px-5 ariadne-rounded-md ",
+    "DEFAULT_INTERNAL_CLASSES": "ariadne-bg-internal-message",
     "DEFAULT_TAG": "div",
     "TAG_OPTIONS": [
       "div"
@@ -283,7 +284,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-h-16 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-pt-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",
@@ -417,7 +418,7 @@
     ]
   },
   "Ariadne::LinkComponent": {
-    "DEFAULT_ACTIONABLE_CLASSES": "ariadne-underline ariadne-decoration-double",
+    "DEFAULT_ACTIONABLE_CLASSES": "ariadne-cursor-pointer ariadne-font-semibold ariadne-underline ariadne-decoration-double",
     "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": [

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ariadne_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.16
+  version: 0.0.18
 platform: ruby
 authors:
 - Garen J. Torikian
-autorequire:
+autorequire: 
 bindir: exe
 cert_chain: []
-date: 2022-10-04 00:00:00.000000000 Z
+date: 2022-10-07 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,7 +108,6 @@ 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
@@ -128,13 +127,7 @@ 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
@@ -146,16 +139,9 @@ 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
 - app/components/ariadne/component.rb
@@ -194,26 +180,13 @@ files:
 - 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
@@ -223,19 +196,11 @@ 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
@@ -286,7 +251,7 @@ licenses:
 - MIT
 metadata:
   allowed_push_host: https://rubygems.org
-post_install_message:
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
@@ -305,7 +270,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: []