@dcrackel/hematournamentui 1.0.22 → 1.0.23

package/src/stories/Organisms/TextBoxEditor/TextBoxEditor.vue

@@ -1,97 +1,97 @@
-<template>
-  <div class="border rounded-lg text-secondary text-sm p-4 w-full" :class="invalid ? 'border-alarm' : 'border-dropdownSelect'">
-    <div data-testid="editor-buttons" class="w-full flex flex-row pl-2">
-      <div class="w-1/3 border-r border-dropdownSelect flex flex-row justify-between pr-2">
-        <BaseButton iconName="fa-h1" label="" type="editor"
-                    :selected="editor && editor.isActive('heading', { level: 1 })"
-                    @click="editor.chain().toggleHeading({ level: 1 }).run()" />
-        <BaseButton iconName="fa-h2" label="" type="editor"
-                    :selected="editor && editor.isActive('heading', { level: 2 })"
-                    @click="editor.chain().toggleHeading({ level: 2 }).run()"/>
-        <BaseButton iconName="fa-h3" label="" type="editor"
-                    :selected="editor && editor.isActive('heading', { level: 3 })"
-                    @click="editor.chain().toggleHeading({ level: 3 }).run()"/>
-        <BaseButton iconName="fa-paragraph" label="" type="editor"
-                    :selected="editor && editor.isActive('paragraph')"
-                    @click="editor.chain().setParagraph().run()"/>
-      </div>
-      <div class="w-1/3 border-r border-dropdownSelect flex flex-row justify-around">
-        <BaseButton :selected="editor && editor.isActive('bold')" iconName="fa-bold" label="" type="editor"
-                    @click="editor && editor.chain().toggleBold().run()"/>
-        <BaseButton :selected="editor && editor.isActive('italic')" iconName="fa-italic" label="" type="editor"
-                    @click="editor && editor.chain().toggleItalic().run()"/>
-        <BaseButton :selected="editor && editor.isActive('strike')" iconName="fa-strikethrough" label="" type="editor"
-                    @click="editor && editor.chain().toggleStrike().run()"/>
-      </div>
-      <div class="w-1/3 flex flex-row justify-between pl-2">
-        <BaseButton :selected="editor && editor.isActive({ textAlign: 'left' })" iconName="fa-align-left" label="" type="editor"
-                    @click="editor.chain().setTextAlign('left').run()"/>
-        <BaseButton :selected="editor && editor.isActive({ textAlign: 'center' })" iconName="fa-align-center" label="" type="editor"
-                    @click="editor && editor.chain().setTextAlign('center').run()"/>
-        <BaseButton :selected="editor && editor.isActive({ textAlign: 'right' })" iconName="fa-align-right" label="" type="editor"
-                    @click="editor && editor.chain().setTextAlign('right').run()"/>
-        <BaseButton :selected="editor && editor.isActive({ textAlign: 'justify' })" iconName="fa-align-justify" label="" type="editor"
-                    @click="editor && editor.chain().setTextAlign('justify').run()"/>
-      </div>
-    </div>
-
-    <p class="my-4 my-2 p-4 rounded-xl h-40 bg-tertiary overflow-auto">
-      <editor-content :editor="editor" class="focus:shadow-none focus:outline-none"/>
-    </p>
-  </div>
-</template>
-
-<script>
-import { ref } from 'vue';
-import {EditorContent, useEditor} from '@tiptap/vue-3'
-import StarterKit from '@tiptap/starter-kit'
-import Highlight from '@tiptap/extension-highlight'
-import TextAlign from '@tiptap/extension-text-align'
-import BaseButton from "../../Molecules/Button/BaseButton.vue";
-
-export default {
-  components: {
-    EditorContent,
-    BaseButton
-  },
-  props: {
-    invalid: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-    }
-  },
-  setup(props, {emit}) {
-    const editorContent = ref("");
-
-    const editor = useEditor({
-      content: "",
-      extensions: [
-        StarterKit,
-        Highlight,
-        TextAlign.configure({
-          types: ['heading', 'paragraph'],
-        }),
-      ],
-      editorProps: {
-        attributes: {
-          class: 'focus:outline-none',
-        },
-      },
-      onUpdate({ editor }) {
-        editorContent.value = editor.getHTML();
-        emit('update:editorContent', editorContent.value);
-      }
-    })
-
-    return {editor, editorContent}
-  },
-  methods: {
-  }
-}
-</script>
-
-
+<template>
+  <div class="border rounded-lg text-secondary text-sm p-4 w-full" :class="invalid ? 'border-alarm' : 'border-dropdownSelect'">
+    <div data-testid="editor-buttons" class="w-full flex flex-row pl-2">
+      <div class="w-1/3 border-r border-dropdownSelect flex flex-row justify-between pr-2">
+        <BaseButton iconName="fa-h1" label="" type="editor"
+                    :selected="editor && editor.isActive('heading', { level: 1 })"
+                    @click="editor.chain().toggleHeading({ level: 1 }).run()" />
+        <BaseButton iconName="fa-h2" label="" type="editor"
+                    :selected="editor && editor.isActive('heading', { level: 2 })"
+                    @click="editor.chain().toggleHeading({ level: 2 }).run()"/>
+        <BaseButton iconName="fa-h3" label="" type="editor"
+                    :selected="editor && editor.isActive('heading', { level: 3 })"
+                    @click="editor.chain().toggleHeading({ level: 3 }).run()"/>
+        <BaseButton iconName="fa-paragraph" label="" type="editor"
+                    :selected="editor && editor.isActive('paragraph')"
+                    @click="editor.chain().setParagraph().run()"/>
+      </div>
+      <div class="w-1/3 border-r border-dropdownSelect flex flex-row justify-around">
+        <BaseButton :selected="editor && editor.isActive('bold')" iconName="fa-bold" label="" type="editor"
+                    @click="editor && editor.chain().toggleBold().run()"/>
+        <BaseButton :selected="editor && editor.isActive('italic')" iconName="fa-italic" label="" type="editor"
+                    @click="editor && editor.chain().toggleItalic().run()"/>
+        <BaseButton :selected="editor && editor.isActive('strike')" iconName="fa-strikethrough" label="" type="editor"
+                    @click="editor && editor.chain().toggleStrike().run()"/>
+      </div>
+      <div class="w-1/3 flex flex-row justify-between pl-2">
+        <BaseButton :selected="editor && editor.isActive({ textAlign: 'left' })" iconName="fa-align-left" label="" type="editor"
+                    @click="editor.chain().setTextAlign('left').run()"/>
+        <BaseButton :selected="editor && editor.isActive({ textAlign: 'center' })" iconName="fa-align-center" label="" type="editor"
+                    @click="editor && editor.chain().setTextAlign('center').run()"/>
+        <BaseButton :selected="editor && editor.isActive({ textAlign: 'right' })" iconName="fa-align-right" label="" type="editor"
+                    @click="editor && editor.chain().setTextAlign('right').run()"/>
+        <BaseButton :selected="editor && editor.isActive({ textAlign: 'justify' })" iconName="fa-align-justify" label="" type="editor"
+                    @click="editor && editor.chain().setTextAlign('justify').run()"/>
+      </div>
+    </div>
+
+    <p class="my-4 my-2 p-4 rounded-xl h-40 bg-tertiary overflow-auto">
+      <editor-content :editor="editor" class="focus:shadow-none focus:outline-none"/>
+    </p>
+  </div>
+</template>
+
+<script>
+import { ref } from 'vue';
+import {EditorContent, useEditor} from '@tiptap/vue-3'
+import StarterKit from '@tiptap/starter-kit'
+import Highlight from '@tiptap/extension-highlight'
+import TextAlign from '@tiptap/extension-text-align'
+import BaseButton from "../../Molecules/Button/BaseButton.vue";
+
+export default {
+  components: {
+    EditorContent,
+    BaseButton
+  },
+  props: {
+    invalid: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+    }
+  },
+  setup(props, {emit}) {
+    const editorContent = ref("");
+
+    const editor = useEditor({
+      content: "",
+      extensions: [
+        StarterKit,
+        Highlight,
+        TextAlign.configure({
+          types: ['heading', 'paragraph'],
+        }),
+      ],
+      editorProps: {
+        attributes: {
+          class: 'focus:outline-none',
+        },
+      },
+      onUpdate({ editor }) {
+        editorContent.value = editor.getHTML();
+        emit('update:editorContent', editorContent.value);
+      }
+    })
+
+    return {editor, editorContent}
+  },
+  methods: {
+  }
+}
+</script>
+
+

package/src/stories/Organisms/TournamentCard/TournamentCard.stories.js

@@ -1,37 +1,37 @@
-import TournamentCard from './TournamentCard.vue';
-
-export default {
-    title: 'Organisms/TournamentCard',
-    component: TournamentCard,
-    tags: ['autodocs'],
-    argTypes: {
-        detail: {
-            control: {
-                type: 'object',
-                defaultValue: {
-                    artwork: '',
-                    tags: ['tag1', 'tag2'],
-                    name: 'Tournament Name',
-                    description: 'Tournament Description',
-                    date: '2023-09-20',
-                    closes: '2023-09-21',
-                    location: 'Tournament Location - City, State'
-                }
-            }
-        }
-    }
-};
-
-export const Default = {
-    args: {
-        detail: {
-            artwork: '',
-            tags: ['tag1', 'tag2'],
-            name: 'Tournament Name',
-            description: 'Tournament Description',
-            date: '2023-09-20',
-            closes: '2023-09-21',
-            location: 'Tournament Location - City, State'
-        }
-    }
-};
+import TournamentCard from './TournamentCard.vue';
+
+export default {
+    title: 'Organisms/TournamentCard',
+    component: TournamentCard,
+    tags: ['autodocs'],
+    argTypes: {
+        detail: {
+            control: {
+                type: 'object',
+                defaultValue: {
+                    artwork: '',
+                    tags: ['tag1', 'tag2'],
+                    name: 'Tournament Name',
+                    description: 'Tournament Description',
+                    date: '2023-09-20',
+                    closes: '2023-09-21',
+                    location: 'Tournament Location - City, State'
+                }
+            }
+        }
+    }
+};
+
+export const Default = {
+    args: {
+        detail: {
+            artwork: '',
+            tags: ['tag1', 'tag2'],
+            name: 'Tournament Name',
+            description: 'Tournament Description',
+            date: '2023-09-20',
+            closes: '2023-09-21',
+            location: 'Tournament Location - City, State'
+        }
+    }
+};

package/src/stories/Organisms/TournamentCard/TournamentCard.vue

@@ -1,35 +1,35 @@
-<template>
-  <div class="rounded-xl w-72 shadow">
-    <TournamentHeader :artwork="detail.artwork" :tags="detail.tags" />
-    <TournamentDetail :detail="detail" />
-  </div>
-</template>
-
-<script>
-import TournamentHeader from '../../Molecules/Cards/Header/TournamentCardHeader.vue';
-import TournamentDetail from '../../Molecules/Cards/Detail/TournamentCardDetail.vue';
-
-export default {
-  name: 'TournamentCard',
-  components: {
-    TournamentHeader,
-    TournamentDetail
-  },
-  props: {
-    detail: {
-      type: Object,
-      required: true,
-      default: () => ({
-        artwork: '',
-        tags: [],
-        name: '',
-        description: '',
-        date: '',
-        closes: '',
-        location: ''
-      })
-    }
-  },
-};
-
-</script>
+<template>
+  <div class="rounded-xl w-72 shadow">
+    <TournamentHeader :artwork="detail.artwork" :tags="detail.tags" />
+    <TournamentDetail :detail="detail" />
+  </div>
+</template>
+
+<script>
+import TournamentHeader from '../../Molecules/Cards/Header/TournamentCardHeader.vue';
+import TournamentDetail from '../../Molecules/Cards/Detail/TournamentCardDetail.vue';
+
+export default {
+  name: 'TournamentCard',
+  components: {
+    TournamentHeader,
+    TournamentDetail
+  },
+  props: {
+    detail: {
+      type: Object,
+      required: true,
+      default: () => ({
+        artwork: '',
+        tags: [],
+        name: '',
+        description: '',
+        date: '',
+        closes: '',
+        location: ''
+      })
+    }
+  },
+};
+
+</script>

package/src/stories/Templates/Forms/AddTournamentPageOne/AddTournamentPageOne.stories.js

@@ -1,25 +1,25 @@
-import AddTournamentPageOne from './AddTournamentPageOne.vue';
-
-export default {
-    title: 'Templates/Forms/AddTournamentForm/PageOne',
-    component: AddTournamentPageOne,
-    tags: ['autodocs'],
-    argTypes: {}
-};
-
-const Template = args => ({
-    components: { AddTournamentPageOne },
-    setup() {
-        return {
-            args: {
-            }
-        };
-    },
-    methods: {
-    }
-});
-
-export const Default = {
-    args: {
-    }
-};
+import AddTournamentPageOne from './AddTournamentPageOne.vue';
+
+export default {
+    title: 'Templates/Forms/AddTournamentForm/PageOne',
+    component: AddTournamentPageOne,
+    tags: ['autodocs'],
+    argTypes: {}
+};
+
+const Template = args => ({
+    components: { AddTournamentPageOne },
+    setup() {
+        return {
+            args: {
+            }
+        };
+    },
+    methods: {
+    }
+});
+
+export const Default = {
+    args: {
+    }
+};