@aerogel/core 0.0.0-next.bde642c4a8096c5fc3d5e676c2115da23f4bf1d8 → 0.0.0-next.c2e6acc000e97a1020c2e232678563c53884dd0e

package/src/components/modals/AGModal.vue

@@ -1,39 +0,0 @@
-<template>
-    <AGHeadlessModal
-        ref="$modal"
-        v-slot="{ close }: IAGHeadlessModalDefaultSlotProps"
-        v-bind="props"
-        class="relative z-50"
-    >
-        <div class="fixed inset-0 flex items-center justify-center p-8">
-            <AGHeadlessModalPanel class="flex max-h-full max-w-full flex-col overflow-hidden bg-white p-4">
-                <AGHeadlessModalTitle v-if="title" class="mb-2 text-lg font-semibold">
-                    <AGMarkdown :text="title" inline />
-                </AGHeadlessModalTitle>
-                <div class="flex max-h-full flex-col overflow-auto" v-bind="$attrs">
-                    <slot :close="close" />
-                </div>
-            </AGHeadlessModalPanel>
-        </div>
-    </AGHeadlessModal>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-
-import { useModalExpose, useModalProps } from '@/components/headless/modals/AGHeadlessModal';
-import type { IAGHeadlessModal, IAGHeadlessModalDefaultSlotProps } from '@/components/headless/modals/AGHeadlessModal';
-
-import type { IAGModal } from './AGModal';
-
-import AGHeadlessModal from '../headless/modals/AGHeadlessModal.vue';
-import AGHeadlessModalPanel from '../headless/modals/AGHeadlessModalPanel.vue';
-import AGHeadlessModalTitle from '../headless/modals/AGHeadlessModalTitle.vue';
-import AGMarkdown from '../lib/AGMarkdown.vue';
-
-const props = defineProps(useModalProps());
-const $modal = ref<IAGHeadlessModal>();
-
-defineOptions({ inheritAttrs: false });
-defineExpose<IAGModal>(useModalExpose($modal));
-</script>

package/src/components/modals/AGModalContext.ts

@@ -1,8 +0,0 @@
-import type { Ref } from 'vue';
-
-import type { Modal } from '@/ui/UI.state';
-
-export interface IAGModalContext {
-    modal: Ref<Modal>;
-    childIndex: Ref<number>;
-}

package/src/components/modals/AGModalContext.vue

@@ -1,22 +0,0 @@
-<template>
-    <component :is="modal.component" v-bind="modal.properties" />
-</template>
-
-<script setup lang="ts">
-import { provide, toRef } from 'vue';
-
-import { requiredNumberProp, requiredObjectProp } from '@/utils/vue';
-import type { Modal } from '@/ui/UI.state';
-
-import type { IAGModalContext } from './AGModalContext';
-
-const props = defineProps({
-    modal: requiredObjectProp<Modal>(),
-    childIndex: requiredNumberProp(),
-});
-
-provide<IAGModalContext>('modal', {
-    modal: toRef(props, 'modal'),
-    childIndex: toRef(props, 'childIndex'),
-});
-</script>

package/src/components/modals/AGModalTitle.vue

@@ -1,9 +0,0 @@
-<template>
-    <AGHeadlessModalTitle class="mb-2 font-semibold">
-        <slot />
-    </AGHeadlessModalTitle>
-</template>
-
-<script setup lang="ts">
-import AGHeadlessModalTitle from '../headless/modals/AGHeadlessModalTitle.vue';
-</script>

package/src/components/modals/AGPromptModal.ts

@@ -1,36 +0,0 @@
-import { computed } from 'vue';
-import type { ExtractPropTypes } from 'vue';
-import type { ObjectWithoutEmpty, SubPartial } from '@noeldemartin/utils';
-
-import { Colors } from '@/components/constants';
-import { enumProp, requiredStringProp, stringProp } from '@/utils';
-import { translateWithDefault } from '@/lang';
-
-export const promptModalProps = {
-    title: stringProp(),
-    message: requiredStringProp(),
-    label: stringProp(),
-    defaultValue: stringProp(),
-    placeholder: stringProp(),
-    acceptText: stringProp(),
-    acceptColor: enumProp(Colors, Colors.Primary),
-    cancelText: stringProp(),
-    cancelColor: enumProp(Colors, Colors.Clear),
-};
-
-export type AGPromptModalProps = SubPartial<
-    ObjectWithoutEmpty<ExtractPropTypes<typeof promptModalProps>>,
-    'acceptColor' | 'cancelColor'
->;
-
-export function usePromptModalProps(): typeof promptModalProps {
-    return promptModalProps;
-}
-
-// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
-export function usePromptModal(props: ExtractPropTypes<typeof promptModalProps>) {
-    const renderedAcceptText = computed(() => props.acceptText ?? translateWithDefault('ui.accept', 'Ok'));
-    const renderedCancelText = computed(() => props.cancelText ?? translateWithDefault('ui.cancel', 'Cancel'));
-
-    return { renderedAcceptText, renderedCancelText };
-}

package/src/components/modals/AGPromptModal.vue

@@ -1,34 +0,0 @@
-<template>
-    <AGModal v-slot="{ close }: IAGModalDefaultSlotProps" :cancellable="false" :title="title">
-        <AGMarkdown :text="message" />
-
-        <AGForm :form="form" @submit="close(form.draft)">
-            <AGInput name="draft" :placeholder="placeholder" :label="label" />
-
-            <div class="mt-2 flex flex-row-reverse gap-2">
-                <AGButton :color="acceptColor" submit>
-                    {{ renderedAcceptText }}
-                </AGButton>
-                <AGButton :color="cancelColor" @click="close()">
-                    {{ renderedCancelText }}
-                </AGButton>
-            </div>
-        </AGForm>
-    </AGModal>
-</template>
-
-<script setup lang="ts">
-import AGModal from './AGModal.vue';
-import { usePromptModal, usePromptModalProps } from './AGPromptModal';
-import type { IAGModalDefaultSlotProps } from './AGModal';
-
-import AGButton from '../forms/AGButton.vue';
-import AGForm from '../forms/AGForm.vue';
-import AGInput from '../forms/AGInput.vue';
-import AGMarkdown from '../lib/AGMarkdown.vue';
-import { requiredStringInput, useForm } from '../../forms';
-
-const props = defineProps(usePromptModalProps());
-const form = useForm({ draft: requiredStringInput(props.defaultValue ?? '') });
-const { renderedAcceptText, renderedCancelText } = usePromptModal(props);
-</script>

package/src/components/modals/index.ts

@@ -1,17 +0,0 @@
-export * from './AGAlertModal';
-export * from './AGConfirmModal';
-export * from './AGErrorReportModal';
-export * from './AGLoadingModal';
-export * from './AGModal';
-export * from './AGModalContext';
-export * from './AGPromptModal';
-
-export { default as AGAlertModal } from './AGAlertModal.vue';
-export { default as AGConfirmModal } from './AGConfirmModal.vue';
-export { default as AGErrorReportModalButtons } from './AGErrorReportModalButtons.vue';
-export { default as AGErrorReportModalTitle } from './AGErrorReportModalTitle.vue';
-export { default as AGLoadingModal } from './AGLoadingModal.vue';
-export { default as AGModal } from './AGModal.vue';
-export { default as AGModalContext } from './AGModalContext.vue';
-export { default as AGModalTitle } from './AGModalTitle.vue';
-export { default as AGPromptModal } from './AGPromptModal.vue';

package/src/directives/initial-focus.ts

@@ -1,11 +0,0 @@
-import { defineDirective } from '@/utils/vue';
-
-export default defineDirective({
-    mounted(element: HTMLElement, { value }) {
-        if (value === false) {
-            return;
-        }
-
-        element.focus();
-    },
-});

package/src/main.histoire.ts

@@ -1 +0,0 @@
-import './assets/histoire.css';

package/tailwind.config.js

@@ -1,4 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-    content: ['./src/**/*.{vue,ts}'],
-};

package/tsconfig.json

@@ -1,11 +0,0 @@
-{
-    "extends": "../../tsconfig.json",
-    "compilerOptions": {
-        "types": ["unplugin-icons/types/vue3", "@aerogel/vite/dist/virtual"],
-        "baseUrl": ".",
-        "paths": {
-            "@/*": ["./src/*"]
-        }
-    },
-    "include": ["src/**/*.ts", "src/**/*.vue"]
-}

package/vite.config.ts

@@ -1,17 +0,0 @@
-import Aerogel from '@aerogel/vite';
-import Icons from 'unplugin-icons/vite';
-import { defineConfig } from 'vitest/config';
-import { resolve } from 'path';
-
-export default defineConfig({
-    test: {
-        clearMocks: true,
-        setupFiles: ['./src/testing/setup.ts'],
-    },
-    plugins: [Aerogel(), Icons()],
-    resolve: {
-        alias: {
-            '@': resolve(__dirname, './src'),
-        },
-    },
-});