ariadne_view_components 0.0.18-x64-mingw32 → 0.0.21-x64-mingw32

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,4 +1,6 @@
1
1
  import { Controller } from '@hotwired/stimulus';
2
2
  export default class RichTextArea extends Controller {
3
+ static targets: string[];
4
+ readonly editorTargets: [HTMLDivElement];
3
5
  connect(): void;
4
6
  }
@@ -1,5 +1,5 @@
1
1
  <%= render Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes) do %>
2
- <%if tooltipped? %>
2
+ <% if tooltipped? %>
3
3
  <%= tooltip.to_s %>
4
4
  <% avatars.each_with_index do |avatar, i| %>
5
5
  <%= avatar %>
@@ -19,8 +19,8 @@ module Ariadne
19
19
  }.freeze
20
20
  VALID_SIZES = SIZE_CLASS_MAPPINGS.keys.freeze
21
21
 
22
- DEFAULT_CLASSES = "ariadne-inline-flex ariadne-items-center ariadne-border ariadne-shadow-sm focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2"
23
- DEFAULT_NUDE_CLASSES = "ariadne-inline-flex focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2"
22
+ DEFAULT_CLASSES = "ariadne-items-center ariadne-border ariadne-shadow-sm focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2"
23
+ DEFAULT_NUDE_CLASSES = "focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2"
24
24
 
25
25
  DEFAULT_SIZE = :md
26
26
 
@@ -4,7 +4,7 @@
4
4
  <% tab.text { @public_tab_text } %>
5
5
  <% tab.panel(attributes: {:"data-public" => true}) do %>
6
6
  <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
7
- <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">
7
+ <div class="ariadne-overflow-hidden ariadne-border ariadne-border-gray-300 ariadne-shadow-sm">
8
8
  <%= hidden_field_tag 'message_public', true %>
9
9
  <%= render(Ariadne::RichTextAreaComponent.new(name: :public_bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
10
10
  <% comment_box.submit { @submit } %>
@@ -19,7 +19,7 @@
19
19
  <% tab.text { @internal_tab_text } %>
20
20
  <% tab.panel do %>
21
21
  <%= ariadne_form_with(url: @url, method: @method, classes: @classes, attributes: @attributes) do |comment_box| %>
22
- <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">
22
+ <div class="ariadne-overflow-hidden ariadne-border ariadne-border-gray-300 ariadne-shadow-sm">
23
23
  <%= hidden_field_tag 'message_public', false %>
24
24
  <%= render(Ariadne::RichTextAreaComponent.new(name: :internal_bodytext, sr_label: "Select reply type", attributes: { required: true})) %>
25
25
  <% comment_box.submit { @submit } %>
@@ -19,6 +19,10 @@ module Ariadne
19
19
  BASE_WRAPPER_CLASSES = "ariadne-flex ariadne-flex-col ariadne-h-screen ariadne-justify-between"
20
20
  BASE_MAIN_CLASSES = "ariadne-flex-auto"
21
21
 
22
+ # this is defined here for the Tailwind parser to pick up; it can be useful
23
+ # in situations where hiddenness is defined by a kwarg, eg `selected: false`
24
+ BASE_HIDDEN_CLASS = "ariadne-hidden"
25
+
22
26
  INVALID_ARIA_LABEL_TAGS = [:div, :span, :p].freeze
23
27
 
24
28
  private def raise_on_invalid_options?
@@ -28,7 +28,7 @@ module Ariadne
28
28
  Ariadne::Content.new
29
29
  }
30
30
 
31
- DEFAULT_BODY_CLASSES = "ariadne-absolute ariadne-right-0 ariadne-z-10 ariadne-mt-2 ariadne-w-56 ariadne-origin-top-right ariadne-divide-y ariadne-divide-gray-100 ariadne-rounded-md ariadne-bg-white ariadne-shadow-lg ariadne-ring-1 ariadne-ring-black ariadne-ring-opacity-5 focus:ariadne-outline-none"
31
+ DEFAULT_BODY_CLASSES = "ariadne-absolute ariadne-mt-2 ariadne-w-56 ariadne-divide-y ariadne-divide-gray-100 ariadne-rounded-md ariadne-bg-white ariadne-shadow-lg ariadne-ring-1 ariadne-ring-black ariadne-ring-opacity-5 focus:ariadne-outline-none"
32
32
  # Use the Body slot as the main content to be shown when triggered by the Summary.
33
33
  #
34
34
  # @param tag [Symbol] The tag to use for the body/ <%= one_of(Ariadne::DetailsComponent::VALID_BODY_TAGS) %>
@@ -40,7 +40,7 @@ module Ariadne
40
40
  }
41
41
 
42
42
  DEFAULT_ACTION_LINK_CLASSES = "ariadne-relative ariadne--mr-px ariadne-w-0 ariadne-flex-1 ariadne-inline-flex ariadne-items-center ariadne-justify-center ariadne-py-4 ariadne-text-sm ariadne-font-medium ariadne-border ariadne-border-transparent"
43
- DEFAULT_ACTION_LINK_COLORS = "hover:ariadne-text-gray-500"
43
+ DEFAULT_ACTION_LINK_COLORS = "ariadne-h-full hover:ariadne-text-gray-500"
44
44
  renders_many :actions, lambda { |href:, icon:, label:, size: Ariadne::HeroiconComponent::SIZE_DEFAULT, variant: HeroiconsHelper::Icon::VARIANT_SOLID, classes: "", attributes: {}, text_classes: ""|
45
45
  actual_classes = class_names(DEFAULT_ACTION_LINK_CLASSES, DEFAULT_ACTION_LINK_COLORS, classes)
46
46
  render(Ariadne::LinkComponent.new(href: href, classes: actual_classes, attributes: attributes)) do
@@ -11,13 +11,13 @@ module Ariadne
11
11
  include IconHelper
12
12
  include HeroiconsHelper
13
13
 
14
- SIZE_MICRO = :mu
14
+ SIZE_XSMALL = :xs
15
15
  SIZE_SMALL = :sm
16
16
  SIZE_DEFAULT = :md
17
17
  SIZE_LARGE = :lg
18
18
 
19
19
  SIZE_MAPPINGS = {
20
- SIZE_MICRO => 16,
20
+ SIZE_XSMALL => 16,
21
21
  SIZE_SMALL => 20,
22
22
  SIZE_DEFAULT => 24,
23
23
  SIZE_LARGE => 128,
@@ -26,7 +26,7 @@ module Ariadne
26
26
 
27
27
  DEFAULT_TEXT_OPEN_CLASSES = "ariadne-text-state-open"
28
28
  DEFAULT_TEXT_CLOSED_CLASSES = "ariadne-text-state-closed"
29
- DEFAULT_TEXT_CLASSES = "ariadne-pl-2 ariadne-text-sm ariadne-font-medium ariadne-text-gray-900"
29
+ DEFAULT_TEXT_CLASSES = "ariadne-pl-2 ariadne-text-sm ariadne-font-medium"
30
30
  renders_one :icon, lambda { |tag: :svg, icon:, variant:, size: Ariadne::HeroiconComponent::SIZE_DEFAULT, classes: "", attributes: {}, text_classes: "", text_attributes: {}|
31
31
  actual_text_classes = class_names(DEFAULT_TEXT_CLASSES, text_classes)
32
32
  Ariadne::HeroiconComponent.new(tag: tag, icon: icon, variant: variant, size: size, classes: classes, attributes: attributes, text_classes: actual_text_classes, text_attributes: text_attributes) { content }
@@ -36,7 +36,7 @@ module Ariadne
36
36
  Ariadne::BaseComponent.new(tag: :span, classes: classes, attributes: attributes) { content }
37
37
  }
38
38
 
39
- DEFAULT_LABEL_CLASSES = "ariadne-pl-2 ariadne-text-sm ariadne-font-medium ariadne-text-gray-900"
39
+ DEFAULT_LABEL_CLASSES = "ariadne-pl-2 ariadne-text-sm ariadne-font-medium"
40
40
  renders_one :text, lambda { |classes: "", attributes: {}|
41
41
  actual_classes = class_names(DEFAULT_LABEL_CLASSES, classes)
42
42
  Ariadne::BaseComponent.new(tag: :span, classes: actual_classes, attributes: attributes) { content }
@@ -5,7 +5,7 @@
5
5
  <span class="ariadne-px-6 ariadne-py-4 ariadne-flex ariadne-items-center ariadne-text-sm ariadne-font-medium">
6
6
  <%= panel.icon %>
7
7
  <span class="ariadne-ml-4 ariadne-text-sm ariadne-font-medium ariadne-text-gray-900"><%= panel.label %></span>
8
- <!-- Arrow separator for lg screens and up -->
8
+ <!-- TODO: fix this -->
9
9
  <% if idx + 1 < panels.size %>
10
10
  <div class="md:ariadne-block ariadne-hidden ariadne-absolute ariadne-top-0 ariadne-right-0 ariadne-h-full ariadne-w-5" aria-hidden="true">
11
11
  <svg class="ariadne-h-full ariadne-w-full ariadne-text-gray-300" viewBox="0 0 22 80" fill="none" preserveAspectRatio="none">
@@ -40,6 +40,7 @@ module Ariadne
40
40
  DEFAULT_ITEM_CLASSES = "ariadne-relative md:ariadne-flex-1 md:ariadne-flex"
41
41
  DEFAULT_WRAPPER_CLASSES = "group ariadne-flex ariadne-items-center ariadne-w-full"
42
42
 
43
+ # TODO: fix this
43
44
  renders_one :icon, lambda { |static_content = nil, &block|
44
45
  next static_content if static_content.present?
45
46
 
@@ -1,21 +1,34 @@
1
1
  import {Controller} from '@hotwired/stimulus'
2
2
 
3
3
  import {Editor} from '@tiptap/core'
4
- import {StarterKit} from '@tiptap/starter-kit'
4
+
5
+ import {Document} from '@tiptap/extension-document'
6
+ import {Paragraph} from '@tiptap/extension-paragraph'
7
+ import {Text} from '@tiptap/extension-text'
8
+
9
+ import DropCursor from '@tiptap/extension-dropcursor'
10
+ import GapCursor from '@tiptap/extension-gapcursor'
11
+ import {History} from '@tiptap/extension-history'
5
12
 
6
13
  export default class RichTextArea extends Controller {
14
+ static targets = ['editor']
15
+
16
+ declare readonly editorTargets: [HTMLDivElement]
17
+
7
18
  connect() {
8
- const editorElements = document.getElementsByClassName('tiptap-editor')
9
- for (const editorElement of editorElements) {
10
- new Editor({
11
- element: editorElement,
12
- extensions: [StarterKit],
19
+ for (const editorElement of this.editorTargets) {
20
+ const pmEditor = new Editor({
21
+ extensions: [DropCursor, GapCursor, History, Document, Paragraph, Text],
13
22
  content: '',
23
+ injectCSS: false,
24
+ element: editorElement,
14
25
  editorProps: {
15
26
  attributes: {
16
- class:
17
- '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'
27
+ class: 'ariadne-p-3'
18
28
  }
29
+ },
30
+ parseOptions: {
31
+ preserveWhitespace: true
19
32
  }
20
33
  })
21
34
 
@@ -24,7 +37,8 @@ export default class RichTextArea extends Controller {
24
37
  const parentForm = editorElement.closest('form')
25
38
 
26
39
  parentForm?.addEventListener('submit', () => {
27
- tiptapValueContainer.setAttribute('value', editorElement.textContent || '')
40
+ tiptapValueContainer.setAttribute('value', pmEditor.getText() || '')
41
+ pmEditor.commands.clearContent() // TODO: test this
28
42
  })
29
43
  }
30
44
  }
@@ -2,5 +2,5 @@
2
2
  <% if @has_form %>
3
3
  <input type="hidden" data-tiptap-value-container=true name="<%= @name %>" id="<%= @name %>">
4
4
  <% end %>
5
- <div class="tiptap-editor"></div>
5
+ <div class="tiptap-editor" data-rich-text-area-component-target="editor"></div>
6
6
  <% end %>
@@ -10,17 +10,8 @@ export default class SlideoverComponent extends Controller {
10
10
 
11
11
  toggle() {
12
12
  this.expandableTarget.classList.toggle('ariadne-hidden')
13
- this.expandWrapperTarget.classList.toggle('bg-filter-panel')
14
13
  for (const slidePanel of this.slidePanelTargets) {
15
14
  slidePanel.classList.toggle('ariadne-hidden')
16
15
  }
17
- this.buttonWrapperTarget.classList.toggle('bg-filter-panel')
18
- if (document.getElementById('btnClose')?.classList.contains('ariadne-hidden')) {
19
- const formID = this.buttonWrapperTarget.getAttribute('data-slideover-component-form-id')
20
- if (formID) {
21
- const form = <HTMLFormElement>document.getElementById(formID)
22
- form?.submit()
23
- }
24
- }
25
16
  }
26
17
  }
@@ -1,11 +1,9 @@
1
1
  <%= render Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes) do |slideover| %>
2
- <div data-slideover-component-target="expandWrapper" class="ariadne-flex ariadne-flex-col ariadne-z-10">
3
- <div data-slideover-component-target="expandable" class="ariadne-hidden ariadne-px-3 ariadne-pb-4">
4
- <%= content %>
5
- </div>
6
- <div data-slideover-component-target="buttonWrapper" data-slideover-component-form-id="<%= @form_id %>" class="ariadne-relative ariadne-flex ariadne-justify-center">
7
- <%= open_button %>
8
- <%= close_button %>
9
- </div>
2
+ <div data-slideover-component-target="expandable" class="ariadne-hidden ariadne-px-3">
3
+ <%= content %>
4
+ </div>
5
+ <div data-slideover-component-target="buttonWrapper" class="ariadne-relative ariadne-flex ariadne-justify-center">
6
+ <%= open_button %>
7
+ <%= close_button %>
10
8
  </div>
11
9
  <% end %>
@@ -12,43 +12,29 @@ module Ariadne
12
12
  DIRECTION_X_LEFT = :xl
13
13
  VALID_DIRECTIONS = [DIRECTION_Y_DOWN, DIRECTION_X_LEFT].freeze
14
14
 
15
- DEFAULT_CLASSES = ""
15
+ DEFAULT_CLASSES = "ariadne-flex ariadne-flex-col"
16
16
 
17
17
  DEFAULT_BUTTON_CLASSES = "ariadne-inline-flex ariadne-items-center ariadne-shadow-sm ariadne-px-4 ariadne-py-1.5 ariadne-pb-2 ariadne-text-sm ariadne-leading-5 ariadne-font-medium ariadne-rounded-full " + Ariadne::ButtonComponent::SCHEME_CLASS_MAPPINGS[:default]
18
- renders_one :open_button, lambda { |label:, classes: "", attributes: {}, text_classes: ""|
19
- actual_classes = class_names(DEFAULT_BUTTON_CLASSES, classes)
18
+ renders_one :open_button, lambda { |selected: false, classes: "", attributes: {}|
19
+ actual_classes = class_names(DEFAULT_BUTTON_CLASSES, classes, selected ? "" : BASE_HIDDEN_CLASS)
20
20
 
21
21
  attributes[:id] ||= "btnOpen"
22
22
  attributes[:"data-slideover-component-target"] ||= "slidePanel"
23
23
  attributes[:"data-action"] ||= "click->slideover-component#toggle"
24
24
  attributes[:type] ||= "submit"
25
25
 
26
- icon = case @direction
27
- when DIRECTION_Y_DOWN
28
- :"chevron-double-down"
29
- end
30
-
31
- render(Ariadne::BaseComponent.new(tag: :button, classes: actual_classes, attributes: attributes)) do
32
- render(Ariadne::HeroiconComponent.new(icon: icon, size: :sm, variant: HeroiconsHelper::Icon::VARIANT_SOLID, attributes: { "data-slideover-component-target" => "slide-panel" }, text_classes: text_classes)) { label }
33
- end
26
+ Ariadne::ButtonComponent.new(classes: actual_classes, attributes: attributes)
34
27
  }
35
28
 
36
- renders_one :close_button, lambda { |label:, classes: "", attributes: {}, text_classes: ""|
37
- actual_classes = class_names(DEFAULT_BUTTON_CLASSES, classes)
29
+ renders_one :close_button, lambda { |selected: false, classes: "", attributes: {}|
30
+ actual_classes = class_names(DEFAULT_BUTTON_CLASSES, classes, selected ? "" : BASE_HIDDEN_CLASS)
38
31
 
39
32
  attributes[:id] ||= "btnClose"
40
33
  attributes[:"data-slideover-component-target"] ||= "slidePanel"
41
34
  attributes[:"data-action"] ||= "click->slideover-component#toggle"
42
35
  attributes[:type] ||= "submit"
43
36
 
44
- icon = case @direction
45
- when DIRECTION_Y_DOWN
46
- :"chevron-double-up"
47
- end
48
-
49
- render(Ariadne::BaseComponent.new(tag: :button, classes: actual_classes, attributes: attributes)) do
50
- render(Ariadne::HeroiconComponent.new(icon: icon, size: :sm, variant: HeroiconsHelper::Icon::VARIANT_SOLID, attributes: { "data-slideover-component-target" => "slide-panel" }, text_classes: text_classes)) { label }
51
- end
37
+ Ariadne::ButtonComponent.new(classes: actual_classes, attributes: attributes)
52
38
  }
53
39
 
54
40
  # @example Default
@@ -57,12 +43,11 @@ module Ariadne
57
43
  #
58
44
  # @param tag [Symbol, String] The rendered tag name.
59
45
  # @param direction [Symbol] <%= one_of(Ariadne::SlideoverComponent::VALID_DIRECTIONS) %>
60
- # @param form_id [String] The ID of any `form` tag to submit when the button is clicked.
61
46
  # @param open_text [String] The text to use to open the slideover.
62
47
  # @param close_text [String] The text to use to close the slideover.
63
48
  # @param classes [String] <%= link_to_classes_docs %>
64
49
  # @param attributes [Hash] <%= link_to_attributes_docs %>
65
- def initialize(tag: DEFAULT_TAG, direction:, form_id: nil, open_text: "Open", close_text: "Close", classes: "", attributes: {})
50
+ def initialize(tag: DEFAULT_TAG, direction:, open_text: "Open", close_text: "Close", classes: "", attributes: {})
66
51
  @tag = check_incoming_tag(DEFAULT_TAG, tag)
67
52
  @classes = class_names(
68
53
  DEFAULT_CLASSES,
@@ -70,12 +55,12 @@ module Ariadne
70
55
  )
71
56
 
72
57
  @direction = fetch_or_raise(VALID_DIRECTIONS, direction)
73
- @form_id = form_id
74
58
 
75
59
  @open_text = open_text
76
60
  @close_text = close_text
77
61
  @attributes = attributes
78
62
  @attributes[:"data-controller"] = "slideover-component"
63
+ @attributes[:"data-slideover-component-target"] = "expandWrapper"
79
64
  end
80
65
  end
81
66
  end
@@ -21,7 +21,6 @@ module Ariadne
21
21
  attributes[:id] = @panel_id
22
22
  tag = :div
23
23
  attributes[:role] ||= :tabpanel
24
- attributes[:tabindex] = 0
25
24
  attributes[:hidden] = true unless @selected
26
25
 
27
26
  label_present = aria("label", attributes) || aria("labelledby", attributes)
@@ -1,5 +1,5 @@
1
1
  <%= render(Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes)) do |component| %>
2
- <div role="tablist">
2
+ <div role="tablist" class="ariadne-bg-neutral-50">
3
3
  <% tabs.each do |tab| %>
4
4
  <%= tab %>
5
5
  <% end %>
@@ -9,7 +9,7 @@ module Ariadne
9
9
 
10
10
  DEFAULT_CLASSES = ""
11
11
 
12
- DEFAULT_SELECTED_CLASSES = "ariadne-border-indigo-500 ariadne-text-indigo-600"
12
+ DEFAULT_SELECTED_CLASSES = "ariadne-bg-white ariadne-border-indigo-500 ariadne-text-indigo-600"
13
13
  DEFAULT_UNSELECTED_CLASSES = "ariadne-text-gray-500 hover:ariadne-text-gray-700 hover:ariadne-border-gray-300"
14
14
 
15
15
  # Tabs and panels to be rendered.
@@ -20,6 +20,7 @@ module Ariadne
20
20
  # @param attributes [Hash] <%= link_to_attributes_docs %>
21
21
  renders_many :tabs, lambda { |id: "", selected: false, classes: "", attributes: {}|
22
22
  actual_classes = class_names(selected ? DEFAULT_SELECTED_CLASSES : DEFAULT_UNSELECTED_CLASSES, classes)
23
+
23
24
  Ariadne::TabComponent.new(
24
25
  id: id,
25
26
  selected: selected,
@@ -2,6 +2,6 @@
2
2
 
3
3
  module Ariadne
4
4
  module ViewComponents
5
- VERSION = "0.0.18"
5
+ VERSION = "0.0.21"
6
6
  end
7
7
  end
data/static/arguments.yml CHANGED
@@ -386,7 +386,7 @@
386
386
  - name: size
387
387
  type: Symbol
388
388
  default: "`:md`"
389
- description: One of `:mu` (`16`), `:sm` (`20`), `:md` (`24`), or `:lg` (`128`).
389
+ description: One of `:xs` (`16`), `:sm` (`20`), `:md` (`24`), or `:lg` (`128`).
390
390
  - name: attributes
391
391
  type: Hash
392
392
  default: "`{}`"
@@ -554,10 +554,6 @@
554
554
  type: Symbol
555
555
  default: N/A
556
556
  description: One of `:xl` and `:yd`.
557
- - name: form_id
558
- type: String
559
- default: "`nil`"
560
- description: The ID of any `form` tag to submit when the button is clicked.
561
557
  - name: open_text
562
558
  type: String
563
559
  default: '`"Open"`'
data/static/classes.yml CHANGED
@@ -12,7 +12,6 @@
12
12
  - ".ariadne-flex"
13
13
  - ".ariadne--space-x-2"
14
14
  - ".ariadne-overflow-hidden"
15
- - ".ariadne-inline-flex"
16
15
  - ".ariadne-items-center"
17
16
  - ".ariadne-border"
18
17
  - ".ariadne-shadow-sm"
@@ -79,6 +78,7 @@
79
78
  - ".focus:ariadne-ring-offset-red-50"
80
79
  - ".focus:ariadne-ring-red-600"
81
80
  - ".ariadne-text-yellow-600"
81
+ - ".ariadne-inline-flex"
82
82
  - ".ariadne-p-1"
83
83
  - ".ariadne-border-transparent"
84
84
  - ".ariadne-invisible"
@@ -99,6 +99,7 @@
99
99
  - ".ariadne-shadow"
100
100
  - ".ariadne-py-5"
101
101
  - ".ariadne-px-5"
102
+ - ".ariadne-bg-neutral-50"
102
103
  - ".ariadne-text-gray-500"
103
104
  - ".hover:ariadne-text-gray-700"
104
105
  - ".hover:ariadne-border-gray-300"
@@ -110,17 +111,11 @@
110
111
  - ".ariadne-text-indigo-600"
111
112
  - ".ariadne-space-y-8"
112
113
  - ".sm:ariadne-space-y-5"
113
- - ".focus-within:ariadne-border-indigo-500"
114
- - ".focus-within:ariadne-ring-1"
115
- - ".focus-within:ariadne-ring-indigo-500"
116
114
  - ".tiptap-editor"
117
115
  - ".ariadne-mt-2"
118
116
  - ".ariadne-justify-end"
119
117
  - ".ariadne__details-reset"
120
- - ".ariadne-right-0"
121
- - ".ariadne-z-10"
122
118
  - ".ariadne-w-56"
123
- - ".ariadne-origin-top-right"
124
119
  - ".ariadne-divide-y"
125
120
  - ".ariadne-divide-gray-100"
126
121
  - ".ariadne-shadow-lg"
@@ -170,9 +165,9 @@
170
165
  - ".ariadne-py-0.5"
171
166
  - ".ariadne-text-black"
172
167
  - ".ariadne-hidden"
173
- - ".ariadne-pb-4"
174
168
  - ".ariadne-list-none"
175
169
  - ".ariadne-divide-gray-200"
170
+ - ".ariadne-pb-4"
176
171
  - ".ariadne-text-lg"
177
172
  - ".ariadne-pt-6"
178
173
  - ".ariadne-flow-root"
@@ -37,8 +37,8 @@
37
37
  ]
38
38
  },
39
39
  "Ariadne::BaseButton": {
40
- "DEFAULT_CLASSES": "ariadne-inline-flex ariadne-items-center ariadne-border ariadne-shadow-sm focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2",
41
- "DEFAULT_NUDE_CLASSES": "ariadne-inline-flex focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2",
40
+ "DEFAULT_CLASSES": "ariadne-items-center ariadne-border ariadne-shadow-sm focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2",
41
+ "DEFAULT_NUDE_CLASSES": "focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2",
42
42
  "DEFAULT_SIZE": "md",
43
43
  "DEFAULT_TAG": "button",
44
44
  "DEFAULT_TYPE": "button",
@@ -136,8 +136,7 @@
136
136
  "DEFAULT_TAG": "clipboard-copy"
137
137
  },
138
138
  "Ariadne::CommentComponent": {
139
- "DEFAULT_CLASSES": "ariadne-bg-internal-message ariadne-border-gray-300 ariadne-border ariadne-shadow ariadne-py-5 ariadne-px-5 ariadne-rounded-md ",
140
- "DEFAULT_INTERNAL_CLASSES": "ariadne-bg-internal-message",
139
+ "DEFAULT_CLASSES": "ariadne-bg-white ariadne-border-gray-300 ariadne-border ariadne-shadow ariadne-py-5 ariadne-px-5 ariadne-rounded-md ",
141
140
  "DEFAULT_TAG": "div",
142
141
  "TAG_OPTIONS": [
143
142
  "div"
@@ -152,7 +151,7 @@
152
151
  "DEFAULT_CLASSES": "ariadne-inline-flex ariadne-items-center ariadne-p-1 ariadne-border ariadne-border-transparent ariadne-rounded-full ariadne-shadow-sm focus:ariadne-outline-none focus:ariadne-ring-2 focus:ariadne-ring-offset-2"
153
152
  },
154
153
  "Ariadne::DetailsComponent": {
155
- "DEFAULT_BODY_CLASSES": "ariadne-absolute ariadne-right-0 ariadne-z-10 ariadne-mt-2 ariadne-w-56 ariadne-origin-top-right ariadne-divide-y ariadne-divide-gray-100 ariadne-rounded-md ariadne-bg-white ariadne-shadow-lg ariadne-ring-1 ariadne-ring-black ariadne-ring-opacity-5 focus:ariadne-outline-none",
154
+ "DEFAULT_BODY_CLASSES": "ariadne-absolute ariadne-mt-2 ariadne-w-56 ariadne-divide-y ariadne-divide-gray-100 ariadne-rounded-md ariadne-bg-white ariadne-shadow-lg ariadne-ring-1 ariadne-ring-black ariadne-ring-opacity-5 focus:ariadne-outline-none",
156
155
  "DEFAULT_BODY_TAG": "div",
157
156
  "DEFAULT_CLASSES": "",
158
157
  "DEFAULT_TAG": "details",
@@ -279,7 +278,7 @@
279
278
  },
280
279
  "Ariadne::GridComponent::GridItem": {
281
280
  "DEFAULT_ACTION_LINK_CLASSES": "ariadne-relative ariadne--mr-px ariadne-w-0 ariadne-flex-1 ariadne-inline-flex ariadne-items-center ariadne-justify-center ariadne-py-4 ariadne-text-sm ariadne-font-medium ariadne-border ariadne-border-transparent",
282
- "DEFAULT_ACTION_LINK_COLORS": "hover:ariadne-text-gray-500",
281
+ "DEFAULT_ACTION_LINK_COLORS": "ariadne-h-full hover:ariadne-text-gray-500",
283
282
  "DEFAULT_ENTRY_CLASSES": "ariadne-group ariadne-flex-1 ariadne-flex ariadne-flex-col ariadne-p-8 hover:ariadne-text-gray-500",
284
283
  "DEFAULT_ITEM_CLASSES": "ariadne-flex ariadne-flex-col ariadne-text-center ariadne-rounded-lg ariadne-shadow text-black-700 ariadne-border-black"
285
284
  },
@@ -386,28 +385,28 @@
386
385
  "SIZE_DEFAULT": "md",
387
386
  "SIZE_LARGE": "lg",
388
387
  "SIZE_MAPPINGS": {
389
- "mu": 16,
388
+ "xs": 16,
390
389
  "sm": 20,
391
390
  "md": 24,
392
391
  "lg": 128
393
392
  },
394
- "SIZE_MICRO": "mu",
395
393
  "SIZE_OPTIONS": [
396
- "mu",
394
+ "xs",
397
395
  "sm",
398
396
  "md",
399
397
  "lg"
400
398
  ],
401
- "SIZE_SMALL": "sm"
399
+ "SIZE_SMALL": "sm",
400
+ "SIZE_XSMALL": "xs"
402
401
  },
403
402
  "Ariadne::ImageComponent": {
404
403
  "DEFAULT_TAG": "img"
405
404
  },
406
405
  "Ariadne::InlineFlexComponent": {
407
406
  "DEFAULT_CLASSES": "ariadne-inline-flex ariadne-items-baseline",
408
- "DEFAULT_LABEL_CLASSES": "ariadne-pl-2 ariadne-text-sm ariadne-font-medium ariadne-text-gray-900",
407
+ "DEFAULT_LABEL_CLASSES": "ariadne-pl-2 ariadne-text-sm ariadne-font-medium",
409
408
  "DEFAULT_TAG": "span",
410
- "DEFAULT_TEXT_CLASSES": "ariadne-pl-2 ariadne-text-sm ariadne-font-medium ariadne-text-gray-900",
409
+ "DEFAULT_TEXT_CLASSES": "ariadne-pl-2 ariadne-text-sm ariadne-font-medium",
411
410
  "DEFAULT_TEXT_CLOSED_CLASSES": "ariadne-text-state-closed",
412
411
  "DEFAULT_TEXT_OPEN_CLASSES": "ariadne-text-state-open",
413
412
  "STATE_CLOSED_SVG": "<svg viewBox=\"0 0 24 24\" width=\"12\" height=\"12\" class=\"ariadne-stroke-state-closed ariadne-fill-state-closed \" stroke=\"currentColor\" stroke-width=\"2\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <circle cx=\"12\" cy=\"12\" r=\"10\"></circle>\n</svg>\n",
@@ -466,7 +465,7 @@
466
465
  },
467
466
  "Ariadne::SlideoverComponent": {
468
467
  "DEFAULT_BUTTON_CLASSES": "ariadne-inline-flex ariadne-items-center ariadne-shadow-sm ariadne-px-4 ariadne-py-1.5 ariadne-pb-2 ariadne-text-sm ariadne-leading-5 ariadne-font-medium ariadne-rounded-full 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",
469
- "DEFAULT_CLASSES": "",
468
+ "DEFAULT_CLASSES": "ariadne-flex ariadne-flex-col",
470
469
  "DEFAULT_TAG": "div",
471
470
  "DIRECTION_X_LEFT": "xl",
472
471
  "DIRECTION_Y_DOWN": "yd",
@@ -488,7 +487,7 @@
488
487
  },
489
488
  "Ariadne::TabContainerComponent": {
490
489
  "DEFAULT_CLASSES": "",
491
- "DEFAULT_SELECTED_CLASSES": "ariadne-border-indigo-500 ariadne-text-indigo-600",
490
+ "DEFAULT_SELECTED_CLASSES": "ariadne-bg-white ariadne-border-indigo-500 ariadne-text-indigo-600",
492
491
  "DEFAULT_TAG": "tab-container",
493
492
  "DEFAULT_UNSELECTED_CLASSES": "ariadne-text-gray-500 hover:ariadne-text-gray-700 hover:ariadne-border-gray-300"
494
493
  },
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: ariadne_view_components
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.18
4
+ version: 0.0.21
5
5
  platform: x64-mingw32
6
6
  authors:
7
7
  - Garen J. Torikian
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2022-10-07 00:00:00.000000000 Z
11
+ date: 2022-10-12 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: tailwind_merge
@@ -106,6 +106,7 @@ executables:
106
106
  extensions: []
107
107
  extra_rdoc_files: []
108
108
  files:
109
+ - CHANGELOG.md
109
110
  - LICENSE.txt
110
111
  - README.md
111
112
  - app/assets/config/manifest.js