@fishawack/lab-velocity 1.11.1 → 2.0.0-beta.2

package/components/_typography.scss

@@ -1,153 +0,0 @@
-@import "@fishawack/lab-ui/_typography.scss";
-/* Primary font
--------------------------------------------------- */
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 400;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontRegular + '.woff2') format('woff2'),
-        resolve($primaryFontRegular + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 100;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontThin + '.woff2') format('woff2'),
-        resolve($primaryFontThin + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 200;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontExtraLight + '.woff2') format('woff2'),
-        resolve($primaryFontExtraLight + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 300;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontLight + '.woff2') format('woff2'),
-        resolve($primaryFontLight + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 500;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontMedium + '.woff2') format('woff2'),
-        resolve($primaryFontMedium + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 600;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontSemiBold + '.woff2') format('woff2'),
-        resolve($primaryFontSemiBold + '.woff') format('woff'),
-}
-
-@font-face {
-    font-family : $primaryFont;
-    font-weight : 700;
-    font-style  : normal;
-
-    src :
-        resolve($primaryFontBold + '.woff2') format('woff2'),
-        resolve($primaryFontBold + '.woff2') format('woff2'),
-}
-
-
-
-@font-face {
-    font-family : $secondaryFont;
-    font-weight : 500;
-    font-style  : normal;
-
-    src :
-        resolve($secondaryFontMedium + '.ttf') format('truetype')
-}
-
-
-h1,.h1 {
-    font-size: get-ratio(48px);
-    line-height: get-ratio(56px);
-    font-family: $primaryFont;
-}
-
-h2, .h2 {
-    font-size: get-ratio(36px);
-    line-height: get-ratio(48px);
-    font-family : $secondaryFont;
-}
-
-h3, .h3 {
-    font-size: get-ratio(32px);
-    line-height: get-ratio(42px);
-    font-family : $primaryFont;
-}
-
-h4, .h4 {
-    font-size: get-ratio(24px);
-    line-height: get-ratio(32px);
-    font-family : $primaryFont;
-}
-
-h5, .h5 {
-    font-size: get-ratio(20px);
-    line-height: get-ratio(24px);
-    font-weight: 700;
-    font-family : $primaryFont;
-}
-h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5 {
-
-    font-weight: 500;
-}
-
-// may be project specific
-
-.font-secondary {
-    font-family: $secondaryFont;
-}
-
-.font-primary {
-    font-family: $primaryFont;
-}
-
-.text-10 {
-    font-size: get-ratio(10px);
-    line-height: get-ratio(16px);
-}
-.text-12 {
-    font-size: get-ratio(12px);
-    line-height: get-ratio(18px);
-}
-.text-14 {
-    font-size: get-ratio(14px);
-    line-height: get-ratio(20px);
-}
-.font-16 {
-    font-size: get-ratio(16px);
-    line-height: get-ratio(24px);
-}
-
-.text-60 {
-    font-size: get-ratio(60px);
-    line-height: get-ratio(68px);
-    font-weight: 500;
-    font-family : $primaryFont;
-}

package/components/_upload.scss

@@ -1,15 +0,0 @@
-@import "element-plus/theme-chalk/el-upload";
-
-.vel-upload {
-    .el-upload__tip {
-        color: $color11;
-    }
-    &.form__group--error {
-        .el-upload__tip {
-            color: $colorAlert;
-        }
-    }
-    &__error {
-        color: $colorAlert;
-    }
-}

package/components/_wysiwyg.scss

@@ -1,6 +0,0 @@
-@import "quill/dist/quill.snow";
-@import "quill/dist/quill.core";
-
-.ql-container,.ql-toolbar {
-    background-color: $color0;
-}

package/components/_wysiwyg2.scss

@@ -1,136 +0,0 @@
-@import "element-plus/theme-chalk/el-dropdown";
-@import "element-plus/theme-chalk/el-dropdown-item";
-@import "element-plus/theme-chalk/el-dialog";
-@import "./button.scss";
-
-.vel-wysiwyg__controls {
-    background-color: $color0;
-    display: flex;
-    flex-grow: 1;
-    border: solid $color5 2px;
-    border-bottom: none;
-    // margin-bottom: .5 * $spacing;
-    font-size: get-ratio(14px);
-    padding: 0 .5 * $spacing;
-    > * {
-        padding: .5 * $spacing;
-        padding-right: $spacing;
-        --el-font-size-base: get-ratio(14px);
-        &:not(:last-child) {
-            border-right: solid 1px $color5;
-        }
-    }
-
-    button {
-        // border: solid 1px $color1;
-        background-color: transparent;
-        cursor: pointer;
-        min-width: 28px;
-        padding: 3px 5px;
-        line-height: 1;
-        border: none;
-        &.is-active, &:hover {
-            background-color: $color5;
-        }
-        svg {
-            height: 90%;
-        }
-    }
-    .el-dropdown {
-        line-height: 1.15;
-    }
-
-    .ql-stroke {
-        fill: none;
-        stroke: #444;
-        stroke-linecap: round;
-        stroke-linejoin: round;
-        stroke-width: 2;
-    }
-    
-    .ql-stroke-miter {
-        fill: none;
-        stroke: #444;
-        stroke-miterlimit: 10;
-        stroke-width: 2;
-    }
-    
-    .ql-fill,
-    .ql-stroke.ql-fill {
-        fill: #444;
-    }
-    
-    .ql-empty {
-        fill: none;
-    }
-    
-    .ql-even {
-        fill-rule: evenodd;
-    }
-    
-    .ql-thin,
-    .ql-stroke.ql-thin {
-        stroke-width: 1;
-    }
-    
-    .ql-transparent {
-        opacity: 0.4;
-  }
-
-  ~ div {
-    // margin-top: $spacing;
-    border: solid $color5 2px;
-    background-color: $color0;
-    > div {
-        padding: 2 * $spacing;
-    }
-  }
-}
-.vel-wysiwyg__button {
-        // border: solid 1px $color1;
-        background-color: transparent;
-        // cursor: pointer;
-
-        &.is-active, &:hover {
-            background-color: $color5;
-        }
-}
-
-.vel-wysiwyg {
-    // border: solid $color1 1px;
-    // padding: $spacing * 1.5;
-
-    table,td,th {
-        border: solid .5px $color1;
-    }
-    th {
-        background-color: $color5;
-    }
-    hr {
-        height: 1px;
-        background-color: $color1;
-    }
-    a {
-        text-decoration: underline;
-    }
-}
-
-
-
-.lab-table, .lab-table-cell, .lab-table-header {
-    border: solid .5px $color1;
-}
-.lab-table-header {
-    background-color: $color5;
-}
-
-.lab-table {
-    a {
-        text-decoration: underline;
-    }
-}
-.lab-table-cell {
-    &:active, &:focus-within, &.selectedCell {
-        background-color: transparentize($color: $color5, $amount: .8);
-    }
-}

package/form/Wysiwyg2.vue

@@ -1,278 +0,0 @@
-<template>
-    <XInput v-bind="$props" class="vel-wysiwyg">
-        <template #label>
-            <slot name="label" />
-        </template>
-        <div class="control-group vel-wysiwyg__controls" v-if="editor">
-            <el-dropdown>
-                Heading
-                <template #dropdown>
-                    <el-dropdown-menu>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 1 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
-                            H1
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 2 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
-                            H2
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 3 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 3 }) }">
-                            H3
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 4 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 4 }) }">
-                            H4
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 5 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 5 }) }">
-                            H5
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeading({ level: 6 }).run()"  :class="{ 'is-active': editor.isActive('heading', { level: 6 }) }">
-                            H6
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().setParagraph().run()" :class="{ 'is-active': editor.isActive('paragraph') }">
-                            Paragraph
-                        </el-dropdown-item>
-                    </el-dropdown-menu>
-                </template>
-            </el-dropdown>
-            <el-dropdown>
-                Style
-                <template #dropdown>
-                    <el-dropdown-menu>
-                        <el-dropdown-item class="vel-wysiwyg__button" @click="editor.chain().focus().toggleBold().run()" :disabled="!editor.can().chain().focus().toggleBold().run()" :class="{ 'is-active': editor.isActive('bold') }">Bold</el-dropdown-item>
-                        <el-dropdown-item  class="vel-wysiwyg__button" @click="editor.chain().focus().toggleItalic().run()" :disabled="!editor.can().chain().focus().toggleItalic().run()" :class="{ 'is-active': editor.isActive('italic') }">Italic</el-dropdown-item>
-                        <el-dropdown-item class="vel-wysiwyg__button" @click="editor.chain().focus().toggleUnderline().run()" :disabled="!editor.can().chain().focus().toggleUnderline().run()" :class="{ 'is-active': editor.isActive('underline') }">Underline</el-dropdown-item>
-                    </el-dropdown-menu>
-                </template>
-            </el-dropdown>
-            <el-dropdown v-if="table">
-                Table
-                <template #dropdown>
-                    <el-dropdown-menu>
-                        <el-dropdown-item @click="editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run()">
-                                Insert table
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().addColumnBefore().run()">
-                            Add column before
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().addColumnAfter().run()">
-                            Add column after
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().deleteColumn().run()">
-                            Delete column
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().addRowBefore().run()">
-                            Add row before
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().addRowAfter().run()">
-                            Add row after
-                        </el-dropdown-item>
-                        <el-dropdown-item  @click="editor.chain().focus().deleteRow().run()">
-                            Delete row
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().deleteTable().run()">
-                            Delete table
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().mergeCells().run()">
-                            Merge cells
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().splitCell().run()">
-                            Split cell
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeaderColumn().run()">
-                            Toggle header column
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeaderRow().run()">
-                            Toggle header row
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().toggleHeaderCell().run()">
-                            Toggle header cell
-                        </el-dropdown-item>
-                        <el-dropdown-item  @click="editor.chain().focus().mergeOrSplit().run()">
-                            Merge or split
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().setCellAttribute('colspan', 2).run()">
-                            Set cell attribute
-                        </el-dropdown-item>
-                        <el-dropdown-item @click="editor.chain().focus().fixTables().run()">
-                            Fix tables
-                        </el-dropdown-item>
-                    </el-dropdown-menu>
-                </template>
-            </el-dropdown>
-                <button type="button" @click="editor.chain().focus().toggleBulletList().run()" :class="{ 'is-active': editor.isActive('bulletList') }">
-                    <svg viewBox="0 0 18 18"> <line class="ql-stroke" x1="6" x2="15" y1="4" y2="4"></line> <line class="ql-stroke" x1="6" x2="15" y1="9" y2="9"></line> <line class="ql-stroke" x1="6" x2="15" y1="14" y2="14"></line> <line class="ql-stroke" x1="3" x2="3" y1="4" y2="4"></line> <line class="ql-stroke" x1="3" x2="3" y1="9" y2="9"></line> <line class="ql-stroke" x1="3" x2="3" y1="14" y2="14"></line> </svg>
-                </button>
-                <button type="button" @click="editor.chain().focus().toggleOrderedList().run()" :class="{ 'is-active': editor.isActive('orderedList') }">
-                    <svg viewBox="0 0 18 18"> <line class="ql-stroke" x1="7" x2="15" y1="4" y2="4"></line> <line class="ql-stroke" x1="7" x2="15" y1="9" y2="9"></line> <line class="ql-stroke" x1="7" x2="15" y1="14" y2="14"></line> <line class="ql-stroke ql-thin" x1="2.5" x2="4.5" y1="5.5" y2="5.5"></line> <path class="ql-fill" d="M3.5,6A0.5,0.5,0,0,1,3,5.5V3.085l-0.276.138A0.5,0.5,0,0,1,2.053,3c-0.124-.247-0.023-0.324.224-0.447l1-.5A0.5,0.5,0,0,1,4,2.5v3A0.5,0.5,0,0,1,3.5,6Z"></path> <path class="ql-stroke ql-thin" d="M4.5,10.5h-2c0-.234,1.85-1.076,1.85-2.234A0.959,0.959,0,0,0,2.5,8.156"></path> <path class="ql-stroke ql-thin" d="M2.5,14.846a0.959,0.959,0,0,0,1.85-.109A0.7,0.7,0,0,0,3.75,14a0.688,0.688,0,0,0,.6-0.736,0.959,0.959,0,0,0-1.85-.109"></path> </svg>
-                </button>
-                <button type="button" @click="editor.chain().focus().toggleCodeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
-                Code block
-                </button>
-                <button type="button" @click="editor.chain().focus().toggleBlockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">
-                Blockquote
-                </button>
-                <button type="button" @click="editor.chain().focus().setHorizontalRule().run()">
-                Horizontal rule
-                </button>
-                <button type="button" @click="editor.chain().focus().toggleSuperscript().run()" :class="{ 'is-active': editor.isActive('superscript') }">
-                    <svg viewBox="0 0 18 18"> <path class="ql-fill" d="M15.5,7H13.861a4.015,4.015,0,0,0,1.914-2.975,1.8,1.8,0,0,0-1.6-1.751A1.922,1.922,0,0,0,12.021,3.7a0.5,0.5,0,1,0,.957.291,0.917,0.917,0,0,1,1.053-.725,0.81,0.81,0,0,1,.744.762c0,1.077-1.164,1.925-1.934,2.486A1.423,1.423,0,0,0,12,7.5a0.5,0.5,0,0,0,.5.5h3A0.5,0.5,0,0,0,15.5,7Z"></path> <path class="ql-fill" d="M9.651,5.241a1,1,0,0,0-1.41.108L6,7.964,3.759,5.349a1,1,0,1,0-1.519,1.3L4.683,9.5,2.241,12.35a1,1,0,1,0,1.519,1.3L6,11.036,8.241,13.65a1,1,0,0,0,1.519-1.3L7.317,9.5,9.759,6.651A1,1,0,0,0,9.651,5.241Z"></path> </svg>
-                </button>
-                <button type="button" @click="editor.chain().focus().toggleSubscript().run()" :class="{ 'is-active': editor.isActive('subscript') }">
-                    <svg viewBox="0 0 18 18"> <path class="ql-fill" d="M15.5,15H13.861a3.858,3.858,0,0,0,1.914-2.975,1.8,1.8,0,0,0-1.6-1.751A1.921,1.921,0,0,0,12.021,11.7a0.50013,0.50013,0,1,0,.957.291h0a0.914,0.914,0,0,1,1.053-.725,0.81,0.81,0,0,1,.744.762c0,1.076-1.16971,1.86982-1.93971,2.43082A1.45639,1.45639,0,0,0,12,15.5a0.5,0.5,0,0,0,.5.5h3A0.5,0.5,0,0,0,15.5,15Z"></path> <path class="ql-fill" d="M9.65,5.241a1,1,0,0,0-1.409.108L6,7.964,3.759,5.349A1,1,0,0,0,2.192,6.59178Q2.21541,6.6213,2.241,6.649L4.684,9.5,2.241,12.35A1,1,0,0,0,3.71,13.70722q0.02557-.02768.049-0.05722L6,11.036,8.241,13.65a1,1,0,1,0,1.567-1.24277Q9.78459,12.3777,9.759,12.35L7.316,9.5,9.759,6.651A1,1,0,0,0,9.65,5.241Z"></path> </svg>
-                </button>
-                <button type="button" @click="setLink" :class="{ 'is-active': editor.isActive('link') }">
-                    <svg viewBox="0 0 18 18"> <line class="ql-stroke" x1="7" x2="11" y1="7" y2="11"></line> <path class="ql-even ql-stroke" d="M8.9,4.577a3.476,3.476,0,0,1,.36,4.679A3.476,3.476,0,0,1,4.577,8.9C3.185,7.5,2.035,6.4,4.217,4.217S7.5,3.185,8.9,4.577Z"></path> <path class="ql-even ql-stroke" d="M13.423,9.1a3.476,3.476,0,0,0-4.679-.36,3.476,3.476,0,0,0,.36,4.679c1.392,1.392,2.5,2.542,4.679.36S14.815,10.5,13.423,9.1Z"></path> </svg>
-                </button>
-        </div>
-        <editor-content :editor="editor" />
-        <el-dialog
-            v-model="dialogVisible"
-            title="URL"
-            width="500"
-        >
-            <label>Enter URL</label>
-            <el-input v-model="newUrl" type="url" />
-            <template #footer>
-            <div class="dialog-footer">
-                <el-button @click="dialogVisible = false">Cancel</el-button>
-                <el-button type="primary" @click="updateURL">
-                Confirm
-                </el-button>
-            </div>
-            </template>
-        </el-dialog>
-    </XInput>
-</template>
-
-<script>
-import input from "./input.js";
-import XInput from "./input.vue";
-import sanitizeHtml from 'sanitize-html';
-import { ElDropdown, ElDropdownItem, ElDropdownMenu, ElDialog, ElButton, ElInput } from "element-plus";
-import { Editor, EditorContent } from '@tiptap/vue-3'
-import StarterKit from '@tiptap/starter-kit';
-import Underline from '@tiptap/extension-underline'
-import Table from '@tiptap/extension-table'
-import TableCell from '@tiptap/extension-table-cell'
-import TableHeader from '@tiptap/extension-table-header'
-import TableRow from '@tiptap/extension-table-row'
-import Superscript from '@tiptap/extension-superscript'
-import Subscript from '@tiptap/extension-subscript'
-import Link from '@tiptap/extension-link'
-
-export default {
-    mixins: [input],
-
-    components: {
-        XInput,
-        EditorContent,
-        ElDropdown,
-        ElDropdownItem,
-        ElDropdownMenu,
-        ElDialog,
-        ElButton,
-        ElInput
-    },
-
-    props: {
-        table: {
-            type: Boolean,
-            default: false,
-        },
-        baseClass: {
-            type: String,
-            default: "vel-wysiwyg",
-        },
-    },
-
-    data: () => ({
-        editor: null,
-        hold: null,
-        previousUrl: null,
-        newUrl: null,
-        dialogVisible:false,
-    }),
-
-    watch: {
-        modelValue: {
-            handler(val) {
-                if (this.hold !== val) {
-                    this.setValue();
-                }
-            },
-        },
-    },
-
-    methods: {
-        setValue() {
-            this.editor.commands.setContent(this.modelValue);
-        },
-        setLink() {
-            this.previousUrl = this.editor.getAttributes('link').href;
-            this.newUrl = this.previousUrl;
-            this.dialogVisible = true;
-
-        },
-        updateURL() {
-            // cancelled
-            this.dialogVisible = false;
-            let url = this.newUrl;
-            if (url === this.previousUrl) {
-                return
-            }
-
-            // empty
-            if (url === '') {
-                this.editor
-                .chain()
-                .focus()
-                .extendMarkRange('link')
-                .unsetLink()
-                .run()
-
-                return
-            }
-            // update link
-            this.editor
-                .chain()
-                .focus()
-                .extendMarkRange('link')
-                .setLink({ href: url })
-                .run()
-        }
-    },
-
-    mounted() {
-        let extensions = [
-            StarterKit,
-            Underline,
-            Superscript,
-            Subscript,
-            Link.configure({
-                openOnClick: false,
-                defaultProtocol: 'https',
-            })
-        ];
-        if(this.$props.table) {
-            extensions.push(
-            Table.configure({
-                resizable: true,
-            }),
-            TableRow,
-            TableHeader,
-            TableCell);
-        }
-
-        this.editor = new Editor({
-                extensions: extensions,
-            });
-        this.setValue();
-
-        this.editor.on('blur', ({ editor, event }) => {
-            const value = editor.isEmpty ? '' : event.srcElement.innerHTML;
-            if(this.hold !== value) {
-                this.hold = value;
-                this.$emit("update:modelValue", this.hold);
-            }
-        })
-    },
-};
-</script>

package/layout/Footer.vue

@@ -1,35 +0,0 @@
-<template>
-    <footer class="vel-footer">
-        <div>
-            <h5 class="color-0">
-                <slot/>
-            </h5>
-        </div>
-        <div class="vel-footer__bottom">
-            <div class="vel-footer__bottom__links">
-                <p class="color-0">&copy;2025 Avalere Health.</p>
-                <el-link underline class="color-0 ml" href="https://avalerehealth.com/privacy-policy/" target="_blank">Privacy Policy</el-link>
-                <el-link underline class="color-0 ml" href="https://avalerehealth.com/corporate-policies/" target="_blank">Corporate policies and compliance</el-link>
-            </div>
-            <div class="vel-footer__bottom__end">
-                <p class="color-0">Have a question?</p><el-link underline class="color-0 ml" :href="contact">Contact our Support Team</el-link>
-            </div>
-        </div>
-    </footer>
-</template>
-
-<script>
-import elLink from "../basic/link.vue";
-
-export default {
-    props: {
-        contact: {
-            required:true,
-            type:String
-        }
-    },
-    components: {
-        elLink
-    }
-}
-</script>

package/layout/Loader.vue

@@ -1,39 +0,0 @@
-<template>
-    <div class="vel-loader">
-        <slot>
-            <svg viewBox="0 0 84 84" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <defs>
-                    <pattern id="e11rz3cojb" width="100%" height="100%" patternUnits="objectBoundingBox">
-                        <use xlink:href="#w1y9w0pc6a"/>
-                    </pattern>
-                    <image id="w1y9w0pc6a" width="84" height="84" xlink:href="data:image/png;base64,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"/>
-                    <path id="3vizvfpwxc" d="M0 0h39.967v39.966H0z"/>
-                </defs>
-                <g fill="none" fill-rule="evenodd">
-                    <path class="circle" d="M42 0C18.804 0 0 18.804 0 42s18.804 42 42 42 42-18.804 42-42S65.196 0 42 0zm0 4c20.987 0 38 17.013 38 38S62.987 80 42 80 4 62.987 4 42 21.013 4 42 4z" fill="url(#e11rz3cojb)" fill-rule="nonzero"/>
-                    <g transform="translate(22 22)">
-                        <mask id="y3cby6hymd" fill="#fff">
-                            <use xlink:href="#3vizvfpwxc"/>
-                        </mask>
-                        <path d="m16.552 21.54 4.036-12.407h.312l4.204 12.946c2.503 1.604 4.81 3.465 6.752 5.604l-.38.486c-3.45-2.688-8.243-5.126-14.924-6.63m23.414 18.425L26.189 0h-10.89L8.295 20.29a82.37 82.37 0 0 0-6.892-.306L0 24.047c2.37.103 4.628.329 6.769.664L1.502 39.966h9.055l4.314-13.26c7.747 2.716 13.03 7.333 15.105 13.26h9.99v-.002" fill="#0D0D0D" mask="url(#y3cby6hymd)"/>
-                    </g>
-                </g>
-            </svg>
-                
-        </slot>
-
-    </div>
-</template>
-
-<script>
-export default {
-    props: {
-        reversed: {
-            type: Boolean,
-            default: false,
-        }
-    },
-    components: {
-    }
-};
-</script>