@directus/app 9.0.0-rc.96 → 9.0.0-rc.97

package/dist/assets/v-checkbox.80dffd6a.js

@@ -1,125 +0,0 @@
-var e=`# Checkbox
-
-Display a single checkbox on which you can model a boolean.
-
-\`\`\`html
-<v-checkbox v-model="checked" label="Receive newsletter" />
-\`\`\`
-
-## Colors
-
-The colors can be changed via the css variables \`--v-checkbox-color\`.
-
-\`\`\`html
-<v-checkbox class="example-1" />
-<v-checkbox class="example-2" />
-<v-checkbox class="example-3" />
-<v-checkbox class="example-4" />
-
-<style>
-	.example-1 {
-		--v-checkbox-color: #abcabc;
-	}
-
-	.example-2 {
-		--v-checkbox-color: rgba(125, 125, 198, 0.5);
-	}
-
-	.example-3 {
-		--v-checkbox-color: var(--red);
-	}
-
-	.example-4 {
-		--v-checkbox-color: var(--border-normal);
-	}
-</style>
-\`\`\`
-
-## Boolean vs arrays
-
-Just as with checkboxes, you can use \`v-model\` with both an array and a boolean:
-
-\`\`\`html
-<template>
-	<v-checkbox v-model="withBoolean" />
-
-	<v-checkbox v-model="withArray" value="red" />
-	<v-checkbox v-model="withArray" value="blue" />
-	<v-checkbox v-model="withArray" value="green" />
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				withBoolean: false,
-				withArray: ['red', 'green'],
-			};
-		},
-	};
-<\/script>
-\`\`\`
-
-Keep in mind to pass the \`value\` prop with a unique value when using arrays in \`v-model\`.
-
-## Indeterminate
-
-The indeterminate state can be set with the \`indeterminate\` prop. We recommend using the \`v-model\` directive with the
-indeterminate prop, so the checkbox can set change it too:
-
-\`\`\`html
-<v-checkbox v-model:indeterminate="indeterminate">
-	<script>
-		export default {
-			data() {
-				indeterminate: true;
-			},
-		};
-	<\/script>
-</v-checkbox>
-\`\`\`
-
-If you can't, you should listen to the \`update:indeterminate\` event and respond to that:
-
-\`\`\`html
-<v-checkbox indeterminate @update:indeterminate="setIndeterminate"></v-checkbox>
-\`\`\`
-
-## Reference
-
-#### Props
-
-| Prop                 | Description                                                              | Default                     | Type               |
-| -------------------- | ------------------------------------------------------------------------ | --------------------------- | ------------------ |
-| \`value\`              | Value for checkbox. Similar to value attr on checkbox type input in HTML | \`null\`                      | \`String\`           |
-| \`input-value\`        | Value that's used with \`v-model\`. Either boolean or array of values      | \`false\`                     | \`[Boolean, Array]\` |
-| \`label\`              | Label for the checkbox                                                   | \`null\`                      | \`String\`           |
-| \`disabled\`           | Disable the checkbox                                                     | \`false\`                     | \`Boolean\`          |
-| \`indeterminate\`      | Show the indeterminate state                                             | \`false\`                     | \`Boolean\`          |
-| \`icon-on\`            | What icon to use for the on state                                        | \`'check_box'\`               | \`String\`           |
-| \`icon-off\`           | What icon to use for the off state                                       | \`'check_box_outline_blank'\` | \`String\`           |
-| \`icon-indeterminate\` | What icon to use for the indeterminate state                             | \`'indeterminate_check_box'\` | \`String\`           |
-| \`block\`              | Show as styled block. Matches input size                                 | \`false\`                     | \`Boolean\`          |
-| \`custom-value\`       |                                                                          | \`false\`                     | \`Boolean\`          |
-
-#### Slots
-
-| Slot      | Description                        | Data |
-| --------- | ---------------------------------- | ---- |
-| \`prepend\` | Rendered right before the checkbox |      |
-| \`append\`  | Rendered right after the label     |      |
-| _default_ |                                    |      |
-
-#### Events
-
-| Event                  | Description                | Value                      |
-| ---------------------- | -------------------------- | -------------------------- |
-| \`change\`               | New state for the checkbox | Boolean or array of values |
-| \`update:indeterminate\` | New state for the checkbox | Boolean or array of values |
-
-#### CSS Variables
-
-| Variable             | Default          |
-| -------------------- | ---------------- |
-| \`--v-checkbox-color\` | \`var(--primary)\` |
-`;export{e as default};

package/dist/assets/v-chip.6fc8e6e6.js

@@ -1 +0,0 @@
-var n="# Chip\n\nChips are small round components that can be used to display tags or similar data.\n\n```html\n<v-chip>I'm a chip!</v-chip>\n```\n\n## Sizes\n\nThe chip component supports the following sizes through the use of props:\n\n- x-small\n- small\n- (default)\n- large\n- x-large\n\n```html\n<v-chip x-small>I'm a chip!</v-chip>\n```\n\n## Colors\n\nYou can set the color, background color, hover color, and background hover color with the `--v-chip-color`,\n`--v-chip-background-color`, `--v-chip-color-hover`, and `--v-chip-background-color-hover` css variables respectively:\n\n```html\n<v-chip>I'm a chip!</v-chip>\n<style>\n	.v-chip {\n		--v-chip-color: var(--red);\n		--v-chip-background-color: var(--red-50);\n		--v-chip-color-hover: var(--white);\n		--v-chip-background-color-hover: var(--red);\n	}\n</style>\n```\n\n## Clicks / Closes\n\nThere are two events, one when clicking on the chip called `click` and one when clicking on the enabled close icon\ncalled `close`.\n\n```html\n<v-chip @click=\"sayHi\">Hello!</v-chip>\n<v-chip close @close=\"close\">I'm closeable!</v-chip>\n```\n\n## Reference\n\n#### Props\n\n| Prop         | Description                                          | Default   | Type      |\n| ------------ | ---------------------------------------------------- | --------- | --------- |\n| `active`     | Change visibility. Can be reacted to via `sync`      | `null`    | `Boolean` |\n| `close`      | Displays a close icon which triggers the close event | `false`   | `Boolean` |\n| `close-icon` | Which icon should be displayed instead of `close `   | `'close'` | `String`  |\n| `outlined`   | No background                                        | `false`   | `Boolean` |\n| `label`      | Label style                                          | `true`    | `Boolean` |\n| `disabled`   | Disabled state                                       | `false`   | `Boolean` |\n\n#### Slots\n\n| Slot      | Description | Data |\n| --------- | ----------- | ---- |\n| _default_ |             | --   |\n\n#### Events\n\n| Event           | Description                                                                                    | Value |\n| --------------- | ---------------------------------------------------------------------------------------------- | ----- |\n| `click`         | Triggers when clicked somewhere on the chip                                                    |       |\n| `close`         | Triggers when the `close` prop is enabled and gets clicked (Doesn't trigger the `click` event) |       |\n| `update:active` |                                                                                                |       |\n\n#### CSS Variables\n\n| Variable                          | Default                        |\n| --------------------------------- | ------------------------------ |\n| `--v-chip-color`                  | `var(--foreground-normal)`     |\n| `--v-chip-background-color`       | `var(--background-normal-alt)` |\n| `--v-chip-color-hover`            | `var(--white)`                 |\n| `--v-chip-background-color-hover` | `var(--primary-125)`           |\n| `--v-chip-close-color`            | `var(--danger)`                |\n| `--v-chip-close-color-disabled`   | `var(--primary)`               |\n| `--v-chip-close-color-hover`      | `var(--primary-125)`           |\n";export{n as default};

package/dist/assets/v-detail.d53fd93b.js

@@ -1 +0,0 @@
-var n="# Detail\n\nUse the detail component to hide not so important information or elements.\n\n```html\n<v-detail label=\"There is content hidden in me\">\n	<div>I'm hidden until you open the component</div>\n</v-detail>\n```\n\n## Reference\n\n#### Props\n\n| Prop         | Description             | Default                   | Type      |\n| ------------ | ----------------------- | ------------------------- | --------- |\n| `active`     | Used with `v-model`     | `undefined`               | `Boolean` |\n| `label`      | Label of detail         | `i18n.global.t('toggle')` | `String`  |\n| `start-open` | Have it open by default | `false`                   | `Boolean` |\n| `disabled`   | Disable any interaction | `false`                   | `Boolean` |\n\n#### Events\n\n| Event    | Description                 | Value     |\n| -------- | --------------------------- | --------- |\n| `toggle` | New active value of divider | `boolean` |\n\n#### Slots\n\n| Slot      | Description                   | Data                  |\n| --------- | ----------------------------- | --------------------- |\n| _default_ | Content of the detail section |                       |\n| `title`   | Content to render in divider  | `{ active: boolean }` |\n\n#### CSS Variables\n\nn/a\n";export{n as default};

package/dist/assets/v-dialog.37bfe2dc.js

@@ -1 +0,0 @@
-var e="# Dialog\n\nRenders an overlay with a flex slot rendering whatever content you pass.\n\n```html\n<v-dialog>\n	<v-sheet>\n		<h2>Are you sure you want to delete this item?</h2>\n		<v-button>No</v-button>\n		<v-button>Yes</v-button>\n	</v-sheet>\n</v-dialog>\n```\n\n## Reference\n\n#### Props\n\n| Prop         | Description                                         | Default     | Type      |\n| ------------ | --------------------------------------------------- | ----------- | --------- |\n| `persistent` | Disable closing by clicking on the side             | `false`     | `Boolean` |\n| `active`     | Can be used in combination with `v-model`           | `undefined` | `Boolean` |\n| `placement`  | Display it either in the `center` or to the `right` | `'center'`  | `String`  |\n\n#### Slots\n\n| Slot        | Description                                   | Data |\n| ----------- | --------------------------------------------- | ---- |\n| _default_   | Whatever should be rendered inside the dialog |      |\n| `activator` | Insert an activator for the dialog            |      |\n\n#### Events\n\n| Event    | Description             | Value     |\n| -------- | ----------------------- | --------- |\n| `toggle` | Change the active state | `boolean` |\n| `esc`    | Escape has been pressed | `boolean` |\n\n#### CSS Variables\n\n| Variable             | Default |\n| -------------------- | ------- |\n| `--v-dialog-z-index` | `100`   |\n";export{e as default};

package/dist/assets/v-divider.40e08068.js

@@ -1 +0,0 @@
-var e="# Divider\n\nDivides content. Made to be used in `v-list` or `v-tabs` components.\n\n```html\n<v-divider>New Section</v-divider>\n```\n\n## Reference\n\n#### Props\n\n| Prop           | Description                                           | Default | Type      |\n| -------------- | ----------------------------------------------------- | ------- | --------- |\n| `vertical`     | Render the divider vertically                         | `false` | `Boolean` |\n| `inline-title` | Render the title inline with the divider, or under it | `true`  | `Boolean` |\n| `large`        | Renders a larger divider                              | `false` | `Boolean` |\n\n#### Events\n\nn/a\n\n#### Slots\n\n| Slot      | Description                                                              | Data |\n| --------- | ------------------------------------------------------------------------ | ---- |\n| _default_ | Label on the divider. This isn't rendered in vertical mode.              |      |\n| `icon`    | Icon on the divider. Rendered in all modes, inline with title if present |      |\n\n#### CSS Variables\n\n| Variable                  | Default                        |\n| ------------------------- | ------------------------------ |\n| `--v-divider-color`       | `var(--border-normal)`         |\n| `--v-divider-label-color` | `var(--foreground-normal-alt)` |\n";export{e as default};

package/dist/assets/v-drawer.b2bcfa38.js

@@ -1 +0,0 @@
-var e="# Drawer\n\nA more robust dialog that is rendered at the side and provides more space than a usual dialog. Can be helpful for\nrelational or nested data.\n\n```html\n<v-drawer v-model=\"isOpen\">\n	<div>This text will show up in the drawer</div>\n</v-drawer>\n```\n\n## Reference\n\n#### Props\n\n| Prop            | Description                                            | Default                    | Type      |\n| --------------- | ------------------------------------------------------ | -------------------------- | --------- |\n| `title`\\*       | The title of the drawer                                |                            | `String`  |\n| `subtitle`      | The subtitle of the drawer                             | `null`                     | `String`  |\n| `active`        | Can be used with `v-model` to open or close the drawer | `undefined`                | `Boolean` |\n| `persistent`    | Disallow closing the drawer by clicking out of it      | `false`                    | `Boolean` |\n| `icon`          | An icon for the drawer                                 | `'box'`                    | `String`  |\n| `sidebar-label` | A label for the sidebar                                | `i18n.global.t('sidebar')` | `String`  |\n\n#### Events\n\n| Event    | Description                                                      | Value     |\n| -------- | ---------------------------------------------------------------- | --------- |\n| `cancel` | When escape is pressed or the drawer gets canceled in other ways |           |\n| `toggle` | When the drawer gets opened or closed                            | `boolean` |\n\n#### Slots\n\n| Slot              | Description                                            | Data |\n| ----------------- | ------------------------------------------------------ | ---- |\n| `activator`       | Elements placed inside here can activate the drawer    | `on` |\n| `sidebar`         | Display components to the side of the drawer like tabs |      |\n| `subtitle`        | Add a custom subtitle                                  |      |\n| `actions:prepend` | Prepend actions to the drawer                          |      |\n| `actions`         | Add actions to the top right corner                    |      |\n| `header:append`   | Append your elements to the header                     |      |\n| _default_         | Where the content of the drawer goes                   |      |\n\n#### CSS Variables\n\n| Variable               | Default |\n| ---------------------- | ------- |\n| `--v-drawer-max-width` | `856px` |\n";export{e as default};

package/dist/assets/v-error.ed7ba070.js

@@ -1,16 +0,0 @@
-var r=`# Error
-
-Display an api request error.
-
-\`\`\`html
-<v-error :error="error" />
-\`\`\`
-
-## Reference
-
-#### Props
-
-| Prop      | Description                             | Default | Type  |
-| --------- | --------------------------------------- | ------- | ----- |
-| \`error\`\\* | The error returned from the api request |         | \`any\` |
-`;export{r as default};

package/dist/assets/v-fancy-select.97b170eb.js

@@ -1,68 +0,0 @@
-var t=`# Fancy Select
-
-Mimics the functionality of a select, where only the current value is shown, but does it in a different visual
-representation.
-
-## Usage
-
-\`\`\`html
-<v-fancy-select
-	v-model="selection"
-	:items="[
-		{
-			value: 'code',
-			icon: 'code',
-			text: 'Raw Value',
-			description: 'This works for most non-relational fields',
-		},
-		{
-			value: 'palette',
-			icon: 'palette',
-			text: 'Formatted Value',
-			description: 'Templated formatting and conditional coloring to text values',
-		},
-		{
-			value: 'label',
-			icon: 'label',
-			text: 'Placard',
-			description: 'Shows the value within a colored badge',
-		},
-	]"
-/>
-\`\`\`
-
-## FancySelectItem
-
-| Prop          | Description                                | Type                   |
-| ------------- | ------------------------------------------ | ---------------------- |
-| \`icon\`        | Which icon to display                      | \`string\`               |
-| \`value\`       | Which value the item represents            | \`string or number\`     |
-| \`text\`        | The displayed text                         | \`undefined or string\`  |
-| \`description\` | Optional description to display            | \`undefined or string\`  |
-| \`divider\`     | If set to true, display an divider instead | \`undefined or boolean\` |
-| \`iconRight\`   | Display an optional icon to the right      | \`undefined or string\`  |
-
-## Reference
-
-#### Props
-
-| Prop       | Description                             | Default | Type                |
-| ---------- | --------------------------------------- | ------- | ------------------- |
-| \`items\`\\*  | The list of possible items to display   |         | \`FancySelectItem[]\` |
-| \`value\`    | used to model the selected items        | \`null\`  | \`[String, Number]\`  |
-| \`disabled\` | Disable selecting / deselecting a value | \`false\` | \`Boolean\`           |
-
-#### Events
-
-| Event   | Description                | Value     |
-| ------- | -------------------------- | --------- |
-| \`input\` | Syncs value with \`v-model\` | \`boolean\` |
-
-#### Slots
-
-n/a
-
-#### CSS Variables
-
-n/a
-`;export{t as default};

package/dist/assets/v-field-select.eb6fe4c7.js

@@ -1 +0,0 @@
-var e='# Field Select\n\nAllows for easy selection of field inside a collection. Also works with relations inside a collection.\n\n```html\n<v-field-select collection="articles" v-model="selection" />\n```\n\n## Reference\n\n#### Props\n\n| Prop           | Description                                                | Default      | Type       |\n| -------------- | ---------------------------------------------------------- | ------------ | ---------- |\n| `collection`\\* | From where the fields should be selected                   |              | `String`   |\n| `disabled`     | Disables this component                                    | `false`      | `Boolean`  |\n| `value`        | Can be used to model the selected field                    | `null`       | `string[]` |\n| `depth`        | If greater than `0`, it also considers relations of fields | `1`          | `Number`   |\n| `inject`       | Inject you own fields, collections or relations            | `() => ({})` | `Object`   |\n\n#### Events\n\n| Event   | Description           | Value      |\n| ------- | --------------------- | ---------- |\n| `input` | The changed selection | `string[]` |\n';export{e as default};

package/dist/assets/v-field-template.02843196.js

@@ -1 +0,0 @@
-var e='# Field Template\n\nSimilar to the v-field-select. Allows you to select fields or relational fields from a collection with the benefit of\nbeing able to add text in between.\n\nModels a template string like `My name is {name} and I\'m {age} years old`.\n\n```html\n<v-field-template collection="articles" />\n```\n\n## Reference\n\n#### Props\n\n| Prop           | Description                                                | Default | Type      |\n| -------------- | ---------------------------------------------------------- | ------- | --------- |\n| `collection`\\* | From where the fields should be selected                   |         | `String`  |\n| `disabled`     | Disables this component                                    | `false` | `Boolean` |\n| `value`        | Can be used to model the template string                   | `null`  | `String`  |\n| `depth`        | If greater than `0`, it also considers relations of fields | `2`     | `Number`  |\n\n#### Events\n\n| Event   | Description                 | Value    |\n| ------- | --------------------------- | -------- |\n| `input` | The changed template string | `String` |\n';export{e as default};

package/dist/assets/v-form.4c93aadc.js

@@ -1 +0,0 @@
-var e='# Form\n\nRenders a form using interfaces based on the passed collection name.\n\n```html\n<v-form\n	collection="articles"\n	v-model="{}"\n	:initial-values="{\n		title: \'Hello World\'\n	}"\n/>\n```\n\n## Reference\n\n#### Props\n\n| Prop                | Description                                                                                                             | Default     | Type                |\n| ------------------- | ----------------------------------------------------------------------------------------------------------------------- | ----------- | ------------------- |\n| `collection`        | The collection of which you want to render the fields                                                                   | `undefined` | `String`            |\n| `fields`            | Array of fields to render. This can be used instead of the collection prop                                              | `undefined` | `Field[]`           |\n| `initial-values`    | Object of the starting values of the fields                                                                             | `null`      | `FieldValues`       |\n| `model-value`       | The edits that were made after the form was rendered. Being used in `v-model`                                           | `null`      | `FieldValues`       |\n| `loading`           | Display the form in a loading state. Prevents the ctx menus from being used and renders skeleton loaders for the fields | `false`     | `Boolean`           |\n| `batch-mode`        | If enabled, allows to select multiple entries                                                                           | `false`     | `Boolean`           |\n| `primary-key`       | The primary key of the given collection                                                                                 | `null`      | `[String, Number]`  |\n| `disabled`          | Disables any interaction with the form                                                                                  | `false`     | `Boolean`           |\n| `validation-errors` | Add custom validation to any field                                                                                      | `() => []`  | `ValidationError[]` |\n\n**Note**: You have to pass either the collection or fields prop.\n\n#### Slots\n\nn/a\n\n#### Events\n\n| Event                | Description              | Value |\n| -------------------- | ------------------------ | ----- |\n| `update:model-value` | Edits have been updated. |       |\n';export{e as default};

package/dist/assets/v-hover.a43ba6ed.js

@@ -1,51 +0,0 @@
-var e=`# Hover
-
-Adds hover functionality to any component you place inside. Can be used to display different states of a component
-depending if you are hovering over it.
-
-\`\`\`html
-<v-hover v-slot="{ hover }">
-	<v-button :color="hover ? red : blue" />
-</v-hover>
-\`\`\`
-
-## Delays
-
-You can control how long the hover state persists after the user leaves the element with the \`close-delay\` prop.
-Likewise, you can set how long it will take before the hover state is set with the \`open-delay\` prop:
-
-\`\`\`html
-<v-hover v-slot="{ hover }" :open-delay="250" :close-delay="400">
-	<v-button :class="hover ? red : blue" />
-</v-hover>
-<style>
-	.v-button.red {
-		--v-button-color: var(--red);
-	}
-	.v-button.blue {
-		--v-button-color: var(--blue);
-	}
-</style>
-\`\`\`
-
-## Reference
-
-#### Props
-
-| Prop          | Description                                  | Default | Type      |
-| ------------- | -------------------------------------------- | ------- | --------- |
-| \`close-delay\` | Delay (ms) before the hover state is removed | \`0\`     | \`Number\`  |
-| \`open-delay\`  | Delay (ms) before the hover state is applied | \`0\`     | \`Number\`  |
-| \`disabled\`    | Disables the hover state from happening      | \`false\` | \`Boolean\` |
-| \`tag\`         | What HTML tag to use for the wrapper         | \`'div'\` | \`String\`  |
-
-#### Events
-
-n/a
-
-#### Slots
-
-| Slot      | Description                                                 | Data |
-| --------- | ----------------------------------------------------------- | ---- |
-| _default_ | Place your components that should use the hover effect here |      |
-`;export{e as default};

package/dist/assets/v-icon.649b6c2d.js

@@ -1,71 +0,0 @@
-var n=`# Icon
-
-The icon component allows you to render any [Material Design Icons](https://material.io/icons). It also supports
-rendering of custom SVG based icons.
-
-## Sizes / Colors
-
-The icon component supports multiple sizes and colors. The color prop accepts any valid CSS color. Color changes are
-done via the css variable \`--v-icon-color\` like in the example below.
-
-\`\`\`html
-<v-icon name="add" />
-<style>
-	.v-icon {
-		--v-icon-color: var(--green-500);
-	}
-</style>
-\`\`\`
-
-## Custom Size
-
-If the default sizes don't give you the exact size you require, you can add the \`size\` prop with any custom pixel value.
-Note: we recommend using one of the pre-defined sizes to ensure a consistent look across the platform.
-
-## Outline
-
-You can render the outline variant of the Material Icon by setting the \`outline\` property.
-
-## Click events
-
-When you add a click event to the icon, the icon will automatically add a pointer cursor.
-
-## Left / Right
-
-Oftentimes, you'll use the icon next to some text, for example in a button. When doing this, you can use the \`left\` /
-\`right\` props to add some spacing to the icon:
-
-\`\`\`html
-<v-button>
-	<v-icon name="add" left />
-	Add new
-</v-button>
-\`\`\`
-
-## Reference
-
-#### Props
-
-| Prop       | Description                          | Default | Type      |
-| ---------- | ------------------------------------ | ------- | --------- |
-| \`name\`\\*   | Which icon to display                |         | \`String\`  |
-| \`filled\`   | Removes the outline style if enabled | \`false\` | \`Boolean\` |
-| \`sup\`      |                                      | \`false\` | \`Boolean\` |
-| \`left\`     | Displays the icon more to the left   | \`false\` | \`Boolean\` |
-| \`right\`    | Displays the icon more to the right  | \`false\` | \`Boolean\` |
-| \`disabled\` | Disables the icon                    | \`false\` | \`Boolean\` |
-
-#### CSS Variables
-
-| Variable               | Default        |
-| ---------------------- | -------------- |
-| \`--v-icon-color\`       | \`currentColor\` |
-| \`--v-icon-color-hover\` | \`currentColor\` |
-| \`--v-icon-size\`        | \`24px\`         |
-
-#### Events
-
-| Event   | Description                     | Value |
-| ------- | ------------------------------- | ----- |
-| \`click\` | Fires when clicking on the icon |       |
-`;export{n as default};

package/dist/assets/v-info.b4fbbf43.js

@@ -1 +0,0 @@
-var n="# Info\n\nRenders a stylized informational placard. It's similar in `v-notice` in it's use case.\n\n```html\n<v-info icon=\"person\" title=\"User Not Found\" type=\"warning\">We couldn't find the user you're looking for.</v-info>\n```\n\n## Reference\n\n#### Props\n\n| Prop      | Description                                   | Default  | Type                                           |\n| --------- | --------------------------------------------- | -------- | ---------------------------------------------- |\n| `title`\\* | The title to display in the info              |          | `String`                                       |\n| `icon`    | What icon to render above the title           | `'box'`  | `String`                                       |\n| `type`    | One of `info`, `success`, `warning`, `danger` | `'info'` | `'info' or 'success' or 'warning' or 'danger'` |\n| `center`  | Display the info centered                     | `false`  | `Boolean`                                      |\n\n#### Events\n\nn/a\n\n#### Slots\n\n| Slot      | Description                                                  | Data |\n| --------- | ------------------------------------------------------------ | ---- |\n| _default_ | Default content area. Is rendered within a styled `<p>` tag. |      |\n| `append`  | After the main body copy. Can be used to inject buttons etc. |      |\n\n#### CSS Variables\n\nn/a\n";export{n as default};

package/dist/assets/v-input.8ce47c5e.js

@@ -1 +0,0 @@
-var e="# Input\n\nDisplays the usual input. Can be used to model strings and numbers.\n\n```html\n<v-input v-model=\"value\" />\n```\n\n## Attributes & Events\n\nThe HTML `<input>` element supports a huge amount of attributes and events. In order to support all of these, all props\nthat aren't specially handled (see list below) will be passed on to the `<input>` element directly. This allows you to\nchange anything you want on the input.\n\n## Prefixes / Suffixes\n\nYou can add any custom (text) prefix/suffix to the value in the input using the `prefix` and `suffix` slots.\n\n## Reference\n\n#### Props\n\n| Prop             | Description                                                    | Default  | Type               |\n| ---------------- | -------------------------------------------------------------- | -------- | ------------------ |\n| `value`          | Used with `v-model` to mirror the entered value                | `null`   | `[String, Number]` |\n| `autofocus`      | Autofocusses the input on render                               | `false`  | `Boolean`          |\n| `disabled`       | Set the disabled state for the input                           | `false`  | `Boolean`          |\n| `full-width`     | Render the input with 100% width                               | `true`   | `Boolean`          |\n| `prefix`         | Prefix the users value with a value                            | `null`   | `String`           |\n| `suffix`         | Show a value at the end of the input                           | `null`   | `String`           |\n| `slug`           | Force the value to be URL safe                                 | `false`  | `Boolean`          |\n| `slug-separator` | What character to use as separator in slugs                    | `'-'`    | `String`           |\n| `active`         | Force the focus state                                          | `false`  | `Boolean`          |\n| `trim`           | Trim the start and end whitespace                              | `false`  | `Boolean`          |\n| `nullable`       | When active, sets an empty entry to null                       | `true`   | `Boolean`          |\n| `type`           | Can be `text` or `number`                                      | `'text'` | `String`           |\n| `max`            | The maximum number that can be entered                         | `null`   | `Number`           |\n| `min`            | The minimum number that can be entered                         | `null`   | `Number`           |\n| `step`           | In which unit steps should be counted up or down               | `1`      | `Number`           |\n| `db-safe`        | Make the value save to be used with the DB                     | `false`  | `Boolean`          |\n| `hide-arrows`    | Hide the arrows that are used to increase or decrease a number | `false`  | `Boolean`          |\n\nNote: all other attached attributes are bound to the input HTMLElement in the component. This allows you to attach any\nof the standard HTML attributes like `min`, `length`, or `pattern`.\n\n#### Slots\n\n| Slot            | Description                                       | Data                                              |\n| --------------- | ------------------------------------------------- | ------------------------------------------------- |\n| `prepend-outer` | Before the input                                  | `{ disabled: boolean, value: string or number; }` |\n| `prepend`       | In the input, before the value, before the prefix | `{ disabled: boolean, value: string or number; }` |\n| `append`        | In the input, after the value, after the suffix   | `{ disabled: boolean, value: string or number; }` |\n| `append-outer`  | After the input                                   | `{ disabled: boolean, value: string or number; }` |\n| `input`         |                                                   |                                                   |\n\n#### CSS Variables\n\n| Variable                      | Default                     |\n| ----------------------------- | --------------------------- |\n| `--v-input-font-family`       | `var(--family-sans-serif)`  |\n| `--v-input-placeholder-color` | `var(--foreground-subdued)` |\n\n#### Events\n\n| Event     | Description                       | Value              |\n| --------- | --------------------------------- | ------------------ |\n| `click`   | Fires when the input gets clicked |                    |\n| `keydown` | When a key has been pressed       |                    |\n| `input`   | Updated the modeled value         | `String or Number` |\n";export{e as default};

package/dist/assets/v-item-group.3787e8a2.js

@@ -1,156 +0,0 @@
-var t=`# Item Group
-
-Provides the ability to make groups of items out of any nested component. Can be reused to make more advanced selectable
-elements like a list of cards, or a button group.
-
-## Usage
-
-\`\`\`html
-<template>
-	<v-item-group v-model="selection">
-		<div class="whatever-nested-markup">
-			<v-item v-slot:default="{ active, toggle }" v-for="n in 5">
-				<p :class="{ active }">Item {{ n }}</p>
-				<v-button @click="toggle">Click me to {{ active ? 'activate' : 'deactivate' }}</v-button>
-			</v-item>
-		</div>
-	</v-item-group>
-</template>
-
-<script lang="ts">
-	import { defineComponent, ref } from 'vue';
-
-	export default defineComponent({
-		setup() {
-			const selection = ref([]);
-			return { selection };
-		},
-	});
-<\/script>
-\`\`\`
-
-The \`v-item-group\` component will keep the final state for the selection; every nested \`v-item\` component will be
-registered to the context of the first \`v-item-group\` parent up in the tree. This means that \`v-item\` can be in any
-nested component or sibling:
-
-\`\`\`html
-<v-item-group>
-	<v-item />
-	<div>
-		<v-item />
-	</div>
-	<div>
-		<v-button>
-			<v-item />
-		</v-button>
-	</div>
-</v-item-group>
-\`\`\`
-
-It also means you can theoretically nest item-groups inside of items:
-
-\`\`\`html
-<v-item-group>
-	<v-item />
-	<div>
-		<v-item>
-			<v-item-group>
-				<v-item />
-				<div>
-					<v-item />
-				</div>
-				<div>
-					<v-button>
-						<v-item />
-					</v-button>
-				</div>
-			</v-item-group>
-		</v-item>
-	</div>
-	<div>
-		<v-button>
-			<v-item />
-		</v-button>
-	</div>
-</v-item-group>
-\`\`\`
-
-(That being said, if you ever find yourself in this situation, think long and hard if what you're doing makes sense)
-
-### Active / Toggle
-
-Every \`v-item\` provides the \`active\` state and a \`toggle\` function to the default slot. Use this to render custom markup
-/ styling and to toggle the active state for this item:
-
-\`\`\`html
-<v-item v-slot:default="{ active, toggle }">
-	<p :class="{ active }">Am I active? {{ active }}</p>
-	<v-button @click="toggle">Toggle active state</v-button>
-</v-item>
-\`\`\`
-
-### Custom values
-
-By default, the \`v-item-group\` component will use the index of the child as model value (eg \`[2, 4]\`). The child
-\`v-item\` component accepts a \`value\` prop that lets you choose what is used as identifier for the v-item. This can be
-useful when you're working with a predefined list of items:
-
-\`\`\`html
-<template>
-	<v-item-group v-model="selection">
-		<v-item v-for="item in items" :value="item.id">{{ item.title }}</v-item>
-	</v-item-group>
-</template>
-
-<script lang="ts">
-	import { defineComponent, ref } from 'vue';
-
-	export default defineComponent({
-		setup() {
-			const selection = ref([]);
-			const items = [
-				{
-					id: 15,
-					title: 'Hello world',
-				},
-				{
-					id: 414,
-					title: 'This might be the hardest component i built',
-				},
-				{
-					id: 'jolly',
-					title: 'Goooooood times',
-				},
-			];
-			return { selection };
-		},
-	});
-<\/script>
-\`\`\`
-
-In this case, the selection state for all items selected would be \`[15, 414, 'jolly']\`
-
-## Reference
-
-#### Props
-
-| Prop        | Description                                           | Default        | Type                   |
-| ----------- | ----------------------------------------------------- | -------------- | ---------------------- |
-| \`value\`     | Used with \`v-model\` to model the selected items       | \`undefined\`    | \`(string or number)[]\` |
-| \`mandatory\` | If enabled, at least one item has to be selected      | \`false\`        | \`Boolean\`              |
-| \`max\`       | The maximum amount of items that can be selected      | \`-1\`           | \`Number\`               |
-| \`multiple\`  | If enabled, multiple elements can be selected         | \`false\`        | \`Boolean\`              |
-| \`scope\`     | Items that do not have the same scope will be ignored | \`'item-group'\` | \`String\`               |
-
-#### Events
-
-| Event   | Description                      | Value                |
-| ------- | -------------------------------- | -------------------- |
-| \`input\` | Used to update the modeled value | (String or Number)[] |
-
-#### Slots
-
-| Slot      | Description                                                 | Data |
-| --------- | ----------------------------------------------------------- | ---- |
-| _default_ | All items placed inside here will be part of the item group |      |
-`;export{t as default};

package/dist/assets/v-item.2b1e4605.js

@@ -1 +0,0 @@
-var e="# Item\n\nShould be used in combination with `v-item-group` to model the state of active / inactive items. For more information\nhave a look at the item group component.\n\n## Reference\n\n#### Props\n\n| Prop     | Description                                           | Default        | Type      |\n| -------- | ----------------------------------------------------- | -------------- | --------- |\n| `value`  | Which value to represent when active                  | `null`         | `String`  |\n| `scope`  | Only matches to a group when both scopes are the same | `'item-group'` | `String`  |\n| `active` | If the item is currently activated                    | `undefined`    | `Boolean` |\n| `watch`  | If the active state should update after initial set   | `true`         | `Boolean` |\n\n#### Slots\n\n| Slot      | Description                 | Data |\n| --------- | --------------------------- | ---- |\n| _default_ | Where the item content goes |      |\n";export{e as default};

package/dist/assets/v-list-group.e8ad3f23.js

@@ -1 +0,0 @@
-var t='# List Group\n\nUsed to display nested items inside a list.\n\n```html\n<v-list>\n	<v-list-item>Item 1</v-list-item>\n	<v-list-item>Item 2</v-list-item>\n	<v-list-item>Item 3</v-list-item>\n\n	<v-list-group>\n		<template #activator="{active}">\n			<v-list-item>Group 1</v-list-item>\n		</template>\n\n		<v-list-item>Item 1-1</v-list-item>\n		<v-list-item>Item 1-2</v-list-item>\n		<v-list-item>Item 1-2</v-list-item>\n	</v-list-group>\n</v-list>\n```\n\n## Reference\n\n#### Events\n\n| Event   | Description | Value |\n| ------- | ----------- | ----- |\n| `click` |             |       |\n\n#### Props\n\n| Prop       | Description | Default     | Type               |\n| ---------- | ----------- | ----------- | ------------------ |\n| `multiple` |             | `true`      | `Boolean`          |\n| `to`       |             | `null`      | `String`           |\n| `active`   |             | `false`     | `Boolean`          |\n| `exact`    |             | `false`     | `Boolean`          |\n| `disabled` |             | `false`     | `Boolean`          |\n| `scope`    |             | `undefined` | `String`           |\n| `value`    |             | `undefined` | `[String, Number]` |\n| `dense`    |             | `false`     | `Boolean`          |\n\n#### Slots\n\n| Slot        | Description | Data |\n| ----------- | ----------- | ---- |\n| `activator` |             |      |\n| _default_   |             |      |\n';export{t as default};

package/dist/assets/v-list-item-content.467baa80.js

@@ -1,19 +0,0 @@
-var t=`# List Item Content
-
-Add properly formatted content to the \`v-list-item\`.
-
-## Reference
-
-#### CSS Variables
-
-| Variable                            | Default                    |
-| ----------------------------------- | -------------------------- |
-| \`--v-list-item-content-padding\`     | \`9px 0\`                    |
-| \`--v-list-item-content-font-family\` | \`var(--family-sans-serif)\` |
-
-#### Slots
-
-| Slot      | Description            | Data |
-| --------- | ---------------------- | ---- |
-| _default_ | Where the content goes |      |
-`;export{t as default};

package/dist/assets/v-list-item-hint.e1ef23b7.js

@@ -1,18 +0,0 @@
-var n=`# List Item Hint
-
-Adds a hint to the \`v-list-item\` component.
-
-## Reference
-
-#### Props
-
-| Prop     | Description | Default | Type      |
-| -------- | ----------- | ------- | --------- |
-| \`center\` |             | \`false\` | \`Boolean\` |
-
-#### Slots
-
-| Slot      | Description | Data |
-| --------- | ----------- | ---- |
-| _default_ |             |      |
-`;export{n as default};

package/dist/assets/v-list-item-icon.3818ad76.js

@@ -1,31 +0,0 @@
-var n=`# List Item Icon
-
-Adds an icon to a \`v-list-item\`.
-
-\`\`\`html
-<v-list-item>
-	<v-list-item-icon><v-icon name="person" /></v-list-item-icon>
-	This is a person
-</v-list-item>
-\`\`\`
-
-## Reference
-
-#### Props
-
-| Prop     | Description      | Default | Type      |
-| -------- | ---------------- | ------- | --------- |
-| \`center\` | Centers the icon | \`false\` | \`Boolean\` |
-
-#### CSS Variables
-
-| Variable                   | Default                     |
-| -------------------------- | --------------------------- |
-| \`--v-list-item-icon-color\` | \`var(--foreground-subdued)\` |
-
-#### Slots
-
-| Slot      | Description         | Data |
-| --------- | ------------------- | ---- |
-| _default_ | Where the icon goes |      |
-`;export{n as default};

package/dist/assets/v-list-item.1e14456c.js

@@ -1 +0,0 @@
-var e="# List Item\n\nUsed inside a `v-list` to display an item inside the given list.\n\n## Reference\n\n#### Props\n\n| Prop       | Description                                        | Default     | Type                 |\n| ---------- | -------------------------------------------------- | ----------- | -------------------- |\n| `value`    | What value to represent when active                | `undefined` | `[String, Number]`   |\n| `large`    | If the item should be displayed larger             | `false`     | `Boolean`            |\n| `dense`    | Makes the item smaller                             | `false`     | `Boolean`            |\n| `to`       | Where the item should link to                      | `null`      | `string or Location` |\n| `href`     | Same as `to` except that it takes an external link | `null`      | `String`             |\n| `disabled` | Disables the item                                  | `false`     | `Boolean`            |\n| `active`   | If the item should be active or not                | `false`     | `Boolean`            |\n| `dashed`   | Adds a dashed style                                | `false`     | `Boolean`            |\n| `exact`    |                                                    | `false`     | `Boolean`            |\n| `download` |                                                    | `null`      | `String`             |\n\n#\n\n### CSS Variables\n\n| Variable                                | Default                                                               |\n| --------------------------------------- | --------------------------------------------------------------------- |\n| `--v-list-item-min-height-large`        | `40px`                                                                |\n| `--v-list-item-min-height`              | `var(--v-list-item-min-height)`                                       |\n| `--v-list-item-padding-large`           | `0 8px`                                                               |\n| `--v-list-item-padding`                 | `0 8px 0 calc(8px + var(--v-list-item-indent, 0px))`                  |\n| `--v-list-item-margin-large`            | `4px 0`                                                               |\n| `--v-list-item-margin`                  | `2px 0`                                                               |\n| `--v-list-item-min-width`               | `none`                                                                |\n| `--v-list-item-max-width`               | `none`                                                                |\n| `--v-list-item-max-height`              | `auto`                                                                |\n| `--v-list-item-border-radius`           | `var(--border-radius)`                                                |\n| `--v-list-item-margin-bottom`           | `0`                                                                   |\n| `--v-list-item-color`                   | `var(--v-list-color, var(--foreground-normal))`                       |\n| `--v-list-item-color-hover`             | `var(--v-list-color-hover, var(--foreground-normal))`                 |\n| `--v-list-item-color-active`            | `var(--v-list-color-active, var(--foreground-normal))`                |\n| `--v-list-item-background-color-hover`  | `var(--v-list-background-color-hover, var(--background-normal-alt))`  |\n| `--v-list-item-background-color-active` | `var(--v-list-background-color-active, var(--background-normal-alt))` |\n\n#### Slots\n\n| Slot      | Description                 | Data |\n| --------- | --------------------------- | ---- |\n| _default_ | Where the item content goes |      |\n";export{e as default};