Add Components Package (#15094)

* move components without dependencies to packages

* make every components use vue script setup

* move components and utils from shared to @directus/components

* fix imports

* move over some more components

* get rid of unnecessary isEmpty and notEmpty

* move pagination

* fix missing !

* move groupable components

* move text-overflow and useElementSize

* fix icons not being shown

* add first unit tests

* remove capitalizeFirst

* simple cleanup

* add css-var unit test

* move over most other components

* make every component use script setup

* add some more unit tests

* add more tests and burn v-switch to the ground. 🔥

* add checkbox tests

* start with next test

* add storybook

* add more pages to storybook

* add final stories

* fix stories actions

* improve action fix

* cleaning props and adding tests

* unit tests -.-

* add some documentation to components

* Add docs to each prop

* clean storybook paths

* add more unit tests

* apply v-select fix

* update lock file

* small tweaks

* move back to shared

* fix imports

* fix imports

* cleaning

* stories to typescript

* Fix version number

Co-authored-by: Rijk van Zanten <rijkvanzanten@me.com>
This commit is contained in:
Nitwel
2022-09-01 22:07:31 +02:00
committed by GitHub
parent 38fb314950
commit 5fe28db539
282 changed files with 17644 additions and 6081 deletions

View File

@@ -64,7 +64,7 @@
<script lang="ts">
import { useI18n } from 'vue-i18n';
import { defineComponent, computed, toRefs, PropType, ref } from 'vue';
import { useCustomSelectionMultiple } from '@/composables/use-custom-selection';
import { useCustomSelectionMultiple } from '@directus/shared/composables';
type Option = {
text: string;

View File

@@ -40,7 +40,7 @@
<script lang="ts">
import { useI18n } from 'vue-i18n';
import { defineComponent, computed, toRefs, PropType } from 'vue';
import { useCustomSelection } from '@/composables/use-custom-selection';
import { useCustomSelection } from '@directus/shared/composables';
type Option = {
text: string;

View File

@@ -69,12 +69,12 @@ import { DisplayItem, RelationQueryMultiple, useRelationMultiple } from '@/compo
import { useRelationM2M } from '@/composables/use-relation-m2m';
import { useWindowSize } from '@/composables/use-window-size';
import { useFieldsStore } from '@/stores/fields';
import { notEmpty } from '@/utils/is-empty';
import { unexpectedError } from '@/utils/unexpected-error';
import { toArray } from '@directus/shared/utils';
import { computed, ref, toRefs, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import LanguageSelect from './language-select.vue';
import { isNil } from 'lodash';
const props = withDefaults(
defineProps<{
@@ -227,7 +227,7 @@ function useLanguages() {
const edits = getItemWithLang(displayItems.value, langCode);
const filledFields = writableFields.filter((field) => notEmpty((edits ?? {})[field.field])).length;
const filledFields = writableFields.filter((field) => !isNil((edits ?? {})[field.field])).length;
return {
text: language[props.languageField ?? relationInfo.value.relatedPrimaryKeyField.field],