@tak-ps/cloudtak 12.54.0 → 12.94.0

package/src/components/CloudTAK/util/CoordinateType.vue

@@ -1,134 +0,0 @@
-<template>
-    <div
-        class='btn-group'
-        role='group'
-    >
-        <input
-            id='point-default'
-            type='radio'
-            class='btn-check'
-            name='point-type'
-            autocomplete='off'
-            :checked='config.mode === "u-d-p"'
-            @click='config.mode = "u-d-p"'
-        >
-        <label
-            v-tooltip='"Custom Point"'
-            for='point-default'
-            type='button'
-            class='btn'
-        ><IconPoint
-            title='Point Icon'
-            :size='size'
-            stroke='1'
-        /></label>
-
-        <input
-            id='point-unknown'
-            type='radio'
-            class='btn-check'
-            name='point-type'
-            autocomplete='off'
-            :checked='config.mode === "a-u-G"'
-            @click='config.mode = "a-u-G"'
-        >
-        <label
-            v-tooltip='"Unknown Point"'
-            for='point-unknown'
-            type='button'
-            class='btn'
-        ><img
-            :width='size'
-            :height='size'
-            src='/pngs/a-u-G.png'
-        ></label>
-
-        <input
-            id='point-friendly'
-            type='radio'
-            class='btn-check'
-            name='point-type'
-            autocomplete='off'
-            :checked='config.mode === "a-f-G"'
-            @click='config.mode = "a-f-G"'
-        >
-        <label
-            v-tooltip='"Friendly Point"'
-            for='point-friendly'
-            type='button'
-            class='btn'
-        ><img
-            :width='size'
-            :height='size'
-            src='/pngs/a-f-G.png'
-        ></label>
-
-        <input
-            id='point-hostile'
-            type='radio'
-            class='btn-check'
-            name='point-type'
-            autocomplete='off'
-            :checked='config.mode === "a-h-G"'
-            @click='config.mode = "a-h-G"'
-        >
-        <label
-            v-tooltip='"Hostile Point"'
-            for='point-hostile'
-            type='button'
-            class='btn'
-        ><img
-            :width='size'
-            :height='size'
-            src='/pngs/a-h-G.png'
-        ></label>
-
-        <input
-            id='point-neutral'
-            type='radio'
-            class='btn-check'
-            name='point-type'
-            autocomplete='off'
-            :checked='config.mode === "a-n-G"'
-            @click='config.mode = "a-n-G"'
-        >
-        <label
-            v-tooltip='"Neutral Point"'
-            for='point-neutral'
-            type='button'
-            class='btn'
-        ><img
-            :width='size'
-            :height='size'
-            src='/pngs/a-n-G.png'
-        ></label>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, watch } from 'vue';
-import {
-    IconPoint
-} from '@tabler/icons-vue';
-
-const props = defineProps({
-    modelValue: {
-        type: String,
-        required: true,
-    },
-    size: {
-        type: Number,
-        default: 24
-    }
-});
-
-const config = ref({
-    mode: props.modelValue || 'u-d-p'
-})
-
-const emit = defineEmits([ 'update:modelValue' ])
-
-watch(config.value, () => {
-    emit('update:modelValue', config.value.mode);
-})
-</script>

package/src/components/CloudTAK/util/CopyButton.vue

@@ -1,67 +0,0 @@
-<template>
-    <TablerIconButton
-        v-if='!copied'
-        title='Copy'
-        @click.stop.prevent='copy'
-    >
-        <IconCopy
-            :size='size'
-            stroke='stroke'
-        />
-    </TablerIconButton>
-    <TablerIconButton
-        v-else
-        title='Copied'
-        @click.stop.prevent='copy'
-    >
-        <IconCopyCheck
-            :size='size'
-            :stroke='String(stroke + 1)'
-        />
-    </TablerIconButton>
-</template>
-
-<script setup lang='ts'>
-import { ref, onUnmounted } from 'vue';
-import {
-    IconCopy,
-    IconCopyCheck
-} from '@tabler/icons-vue';
-
-import {
-    TablerIconButton
-} from '@tak-ps/vue-tabler'
-
-const props = defineProps({
-    text: {
-        type: [String, Number],
-        required: true
-    },
-    size: {
-        type: Number,
-        default: 32
-    },
-    stroke: {
-        type: Number,
-        default: 1
-    }
-})
-
-const copied = ref(false);
-const timeout = ref<ReturnType<typeof setTimeout> | undefined>();
-
-onUnmounted(() => {
-    if (timeout.value) {
-        clearTimeout(timeout.value);
-    }
-});
-
-async function copy() {
-    await navigator.clipboard.writeText(String(props.text))
-    copied.value = true;
-
-    timeout.value = setTimeout(() => {
-        copied.value = false;
-    }, 1000);
-}
-</script>

package/src/components/CloudTAK/util/CopyField.vue

@@ -1,286 +0,0 @@
-<template>
-    <label
-        v-if='label'
-        class='mx-1'
-        v-text='props.label'
-    />
-
-    <div
-        v-if='editing'
-        class='position-relative rounded'
-    >
-        <TablerInput
-            v-model='text'
-            :rows='rows'
-            :autofocus='true'
-            label=''
-            :error='error'
-            @update:model-value='validUpdate(text)'
-            @blur='validUpdate(text, {
-                submit: false,
-                editing: true
-            })'
-            @submit='validUpdate(text, {
-                submit: rows > 1 ? false : true,
-                editing: rows > 1 ? true : false
-            })'
-        />
-
-        <TablerIconButton
-            v-if='!error'
-            title='Done Editing'
-            class='position-absolute'
-            style='right: 8px; top: 8px;'
-            @click.stop.prevent='validUpdate(text, {
-                submit: true,
-                editing: false
-            })'
-        >
-            <IconCheck
-                :size='24'
-                stroke='1'
-            />
-        </TablerIconButton>
-    </div>
-    <div
-        v-else
-        ref='infobox'
-        class='position-relative rounded text-truncate'
-        :style='rows === 1 ? `min-height: ${minheight}px;` : ``'
-        :class='{
-            "px-2 py-2 bg-accent": props.mode !== "pre",
-            "hover-button hover-border cursor-pointer": hover,
-        }'
-    >
-        <slot />
-
-        <template v-if='rows > 1 || mode === "pre"'>
-            <TablerMarkdown
-                v-if='mode === "text"'
-                style='min-height: 32px'
-                :markdown='markdown'
-            />
-            <pre
-                v-else
-                v-text='text'
-            />
-
-            <TablerDelete
-                v-if='props.deletable'
-                displaytype='icon'
-                style='top: 8px;'
-                :size='24'
-                :class='{
-                    "hover-button-hidden": hover,
-                }'
-                :style='{
-                    "right": props.edit ? "64px" : "32px",
-                }'
-                class='position-absolute bg-accent'
-                @delete='$emit("delete")'
-            />
-
-            <TablerIconButton
-                v-if='edit'
-                title='Edit Field'
-                class='position-absolute bg-accent'
-                :class='{
-                    "hover-button-hidden": hover,
-                }'
-                style='right: 36px; top: 8px;'
-                @click='editing = true'
-            >
-                <IconPencil
-                    :size='24'
-                    stroke='1'
-                />
-            </TablerIconButton>
-
-            <CopyButton
-                :text='text'
-                class='position-absolute bg-accent'
-                :size='24'
-                style='right: 8px; top: 8px;'
-            />
-        </template>
-        <template v-else>
-            <span v-text='text' />
-
-            <TablerDelete
-                v-if='props.deletable'
-                displaytype='icon'
-                style='top: 6px;'
-                :size='24'
-                :class='{
-                    "hover-button-hidden": hover,
-                }'
-                :style='{
-                    "right": props.edit ? "64px" : "32px",
-                }'
-                class='position-absolute bg-accent'
-                @delete='$emit("delete")'
-            />
-
-            <TablerIconButton
-                v-if='edit'
-                title='Edit'
-                class='position-absolute bg-accent'
-                :class='{
-                    "hover-button-hidden": hover,
-                }'
-                style='right: 32px; top: 6px;'
-                @click='editing = true'
-            >
-                <IconPencil
-                    :size='24'
-                    stroke='1'
-                />
-            </TablerIconButton>
-
-            <CopyButton
-                :text='text'
-                class='position-absolute'
-                :size='24'
-                style='right: 8px; top: 6px;'
-            />
-        </template>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, watch, computed, useTemplateRef } from 'vue';
-import CopyButton from './CopyButton.vue';
-import {
-    TablerInput,
-    TablerDelete,
-    TablerMarkdown,
-    TablerIconButton
-} from '@tak-ps/vue-tabler'
-import {
-    IconCheck,
-    IconPencil
-} from '@tabler/icons-vue';
-
-const emit = defineEmits([
-    'submit',
-    'delete',
-    'update:modelValue'
-]);
-
-const props = defineProps({
-    mode: {
-        type: String,
-        default: 'text' // text or pre
-    },
-    label: {
-        type: String,
-        default: ''
-    },
-    modelValue: {
-        type: [String, Number],
-        required: true
-    },
-    rows: {
-        type: Number,
-        default: 1
-    },
-    minheight: {
-        type: Number,
-        default: 32
-    },
-    validate: {
-        // (text: string | number) => false | string
-        type: Function,
-        default: undefined
-    },
-    hover: {
-        type: Boolean,
-        default: false
-    },
-    edit: {
-        type: Boolean,
-        default: false
-    },
-    deletable: {
-        type: Boolean,
-        default: false
-    },
-    size: {
-        type: Number,
-        default: 32
-    },
-    stroke: {
-        type: Number,
-        default: 1
-    }
-})
-
-const editing = ref(false);
-const text = ref(props.modelValue);
-const error = ref<string | undefined>()
-
-const infoboxRef = useTemplateRef<HTMLElement>('infobox');
-
-const markdown = computed(() => {
-    return String(props.modelValue || '')
-        .replace(/\n/g, '</br>')
-        .replace(/(http(s)?:\/\/[a-z-]+[:.].*?(?=[\s"]))/g, '[$1]($1)')
-        .trim()
-});
-
-watch(infoboxRef, () => {
-    if (infoboxRef.value) {
-        infoboxRef.value.addEventListener('click', (event: MouseEvent) => {
-            if (!props.edit) return;
-            if (event.target) {
-                const target = event.target as HTMLElement;
-                if (['A'].includes(target.tagName)) return;
-            }
-            editing.value = true;
-        });
-    }
-})
-
-watch(props, () => {
-    if (text.value !== props.modelValue && !editing.value) {
-        text.value = props.modelValue;
-    }
-})
-
-function validUpdate(
-    text: string | number,
-    opts = {
-        submit: false,
-        editing: true
-    }
-) {
-    if (typeof props.validate !== 'function') {
-        editing.value = opts.editing;
-
-        if (opts.submit) emit("submit", text);
-        emit("update:modelValue", text);
-    } else {
-        const res = props.validate(text);
-
-        if (res.length) {
-            error.value = res;
-        } else {
-            editing.value = opts.editing;
-            error.value = undefined;
-            if (opts.submit) emit("submit", text);
-            emit("update:modelValue", text);
-        }
-    }
-}
-
-</script>
-
-<style lang='scss'>
-.hover-border {
-    border: 2px solid rgba(0, 0, 0, 0);
-}
-
-.hover-border:hover {
-    border: 2px solid #83b7e8;
-}
-</style>