@naptics/vue-collection 0.1.7 → 0.1.8

package/components/NInputSelect.d.ts

@@ -62,14 +62,22 @@ export declare const nInputSelectProps: {
     };
     readonly tooltipMaxWidth: {
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
+        readonly default: "max-w-xs"; /**
+         * @see {@link nValInputProps.optional}
+         */
     };
     readonly tooltipWrapperAddClass: StringConstructor;
     readonly tooltipContentAddClass: StringConstructor;
     readonly name: StringConstructor;
     readonly placeholder: StringConstructor;
     readonly autocomplete: {
-        readonly type: StringConstructor;
+        readonly type: StringConstructor; /**
+         * This is called with the newly selected id when the selection has changed.
+         * This happens, when an item from the suggestion list is selected or the
+         * input matches a selection option exactly.
+         * If no id is selected, the empty string is passed, in order to
+         * match the API of all other inputs who never pass `undefined`.
+         */
         readonly default: "off";
     };
     readonly type: {
@@ -156,14 +164,22 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly tooltipMaxWidth: {
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
+        readonly default: "max-w-xs"; /**
+         * @see {@link nValInputProps.optional}
+         */
     };
     readonly tooltipWrapperAddClass: StringConstructor;
     readonly tooltipContentAddClass: StringConstructor;
     readonly name: StringConstructor;
     readonly placeholder: StringConstructor;
     readonly autocomplete: {
-        readonly type: StringConstructor;
+        readonly type: StringConstructor; /**
+         * This is called with the newly selected id when the selection has changed.
+         * This happens, when an item from the suggestion list is selected or the
+         * input matches a selection option exactly.
+         * If no id is selected, the empty string is passed, in order to
+         * match the API of all other inputs who never pass `undefined`.
+         */
         readonly default: "off";
     };
     readonly type: {
@@ -241,14 +257,22 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly tooltipMaxWidth: {
         readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
+        readonly default: "max-w-xs"; /**
+         * @see {@link nValInputProps.optional}
+         */
     };
     readonly tooltipWrapperAddClass: StringConstructor;
     readonly tooltipContentAddClass: StringConstructor;
     readonly name: StringConstructor;
     readonly placeholder: StringConstructor;
     readonly autocomplete: {
-        readonly type: StringConstructor;
+        readonly type: StringConstructor; /**
+         * This is called with the newly selected id when the selection has changed.
+         * This happens, when an item from the suggestion list is selected or the
+         * input matches a selection option exactly.
+         * If no id is selected, the empty string is passed, in order to
+         * match the API of all other inputs who never pass `undefined`.
+         */
         readonly default: "off";
     };
     readonly type: {

package/components/NInputSelect.js

@@ -1,5 +1,5 @@
 import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { createComponent } from '../utils/component';
+import { createComponentWithSlots } from '../utils/component';
 import { Id } from '../utils/identifiable';
 import { option } from '../utils/validation';
 import { vModelForRef } from '../utils/vModel';
@@ -64,7 +64,7 @@ export const nInputSelectProps = {
  * The user is forced to use a value from the specified options of the input.
  * While they type, the list of options is shown to them and filtered based on their input.
  */
-export default createComponent('NInputSelect', nInputSelectProps, props => {
+export default createComponentWithSlots('NInputSelect', nInputSelectProps, ['listItem'], props => {
   const inputRef = ref();
   const inputValue = ref('');
   watch(() => props.value, newValue => {

package/components/NSearchbarList.d.ts

@@ -18,10 +18,10 @@ export declare const nSearchbarListProps: {
     readonly onUpdateValue: import("vue").PropType<(newValue: string) => void>;
     readonly items: {
         readonly type: import("vue").PropType<import("./NSuggestionList").SuggestionItem[]>;
-        readonly default: () => never[]; /**
-         * Adds the classes directly to the input (e.g. for shadow).
-         */
-    };
+        readonly default: () => never[];
+    }; /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
     readonly maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;
@@ -55,10 +55,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly onUpdateValue: import("vue").PropType<(newValue: string) => void>;
     readonly items: {
         readonly type: import("vue").PropType<import("./NSuggestionList").SuggestionItem[]>;
-        readonly default: () => never[]; /**
-         * Adds the classes directly to the input (e.g. for shadow).
-         */
-    };
+        readonly default: () => never[];
+    }; /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
     readonly maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;
@@ -88,10 +88,10 @@ declare const _default: import("vue").DefineComponent<{
     readonly onUpdateValue: import("vue").PropType<(newValue: string) => void>;
     readonly items: {
         readonly type: import("vue").PropType<import("./NSuggestionList").SuggestionItem[]>;
-        readonly default: () => never[]; /**
-         * Adds the classes directly to the input (e.g. for shadow).
-         */
-    };
+        readonly default: () => never[];
+    }; /**
+     * Adds the classes directly to the input (e.g. for shadow).
+     */
     readonly maxItems: {
         readonly type: NumberConstructor;
         readonly default: () => number;

package/components/NSearchbarList.js

@@ -1,5 +1,5 @@
 import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
-import { createComponent } from '../utils/component';
+import { createComponentWithSlots } from '../utils/component';
 import { ref } from 'vue';
 import { vModelProps } from '../utils/vModel';
 import NSearchbar, { nSearchbarProps } from './NSearchbar';
@@ -23,7 +23,7 @@ export const nSearchbarListProps = {
 /**
  * The `NSearchbarList` is a {@link NSearchbar} with a {@link NSuggestionList}.
  */
-export default createComponent('NSearchbarList', nSearchbarListProps, props => {
+export default createComponentWithSlots('NSearchbarList', nSearchbarListProps, ['listItem'], props => {
   const searchbarRef = ref();
   return () => _createVNode(NSuggestionList, _mergeProps(props, {
     "inputValue": props.value || '',

package/package.json

@@ -2,7 +2,7 @@
     "name": "@naptics/vue-collection",
     "author": "Timo Siegenthaler",
     "description": "Vue Collection is a collection of styled and fully functional Vue components which can easily be integrated into our projects.",
-    "version": "0.1.7",
+    "version": "0.1.8",
     "main": "./index.js",
     "repository": {
         "type": "git",