@naptics/vue-collection 0.3.2 → 1.0.0-beta.1

package/components/NIconCircle.js

@@ -1,67 +0,0 @@
-import { createVNode as _createVNode } from "vue";
-import { createComponent } from '../utils/component';
-export const nIconCircleProps = {
-  /**
-   * The icon of the icon-circle.
-   */
-  icon: {
-    type: Function,
-    required: true
-  },
-  /**
-   * The color of the icon-circle.
-   */
-  color: {
-    type: String,
-    default: 'primary'
-  },
-  /**
-   * The size of the circle in "tailwind units" (4 px).
-   * Tailwind classes are used for the size, so any number can be passed.
-   * If the `iconSize` is not set, it will be adjusted automatically.
-   */
-  circleSize: Number,
-  /**
-   * The size of the icon in "tailwind units" (4 px).
-   * No tailwind classes are used for the size, so any number can be passed.
-   * If the `circleSize` is not set, it will be adjusted automatically.
-   */
-  iconSize: Number,
-  /**
-   * The shade of the icon.
-   */
-  iconShade: {
-    type: Number,
-    default: 600
-  },
-  /**
-   * The shade of the background.
-   */
-  bgShade: {
-    type: Number,
-    default: 100
-  }
-};
-const DEFAULT_CIRCLE_SIZE = 16;
-const SCALING_FACTOR = 0.55;
-/**
- * The `NIconCircle` is an icon with a colored circle around it.
- */
-const Component = createComponent('NIconCircle', nIconCircleProps, props => {
-  let circleSize = props.circleSize;
-  let iconSize = props.iconSize;
-  if (circleSize == null) {
-    if (iconSize == null) circleSize = DEFAULT_CIRCLE_SIZE;else circleSize = iconSize / SCALING_FACTOR;
-  }
-  if (iconSize == null) iconSize = circleSize * SCALING_FACTOR;
-  circleSize *= 4;
-  iconSize *= 4;
-  return () => _createVNode("div", {
-    "class": ['flex items-center justify-center rounded-full', `bg-${props.color}-${props.bgShade}`],
-    "style": `width: ${circleSize}px; height: ${circleSize}px`
-  }, [_createVNode("div", {
-    "class": `text-${props.color}-${props.iconShade}`,
-    "style": `width: ${iconSize}px; height: ${iconSize}px`
-  }, [_createVNode(props.icon, null, null)])]);
-});
-export { Component as NIconCircle, Component as default };

package/components/NInput.css

@@ -1,11 +0,0 @@
-/* Chrome, Safari, Edge, Opera */
-input::-webkit-outer-spin-button,
-input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-    margin: 0;
-}
-
-/* Firefox */
-input[type='number'] {
-    -moz-appearance: textfield;
-}

package/components/NInput.d.ts

@@ -1,94 +0,0 @@
-import { type PropType } from 'vue';
-import './NInput.css';
-export declare const nInputProps: {
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly tooltipDelay: {
-        readonly type: NumberConstructor;
-        readonly default: 0;
-    };
-    /**
-     * The name of the input. Is displayed as a label above the input.
-     */
-    readonly name: StringConstructor;
-    /**
-     * The placeholder of the input.
-     */
-    readonly placeholder: StringConstructor;
-    /**
-     * The html autocomplete attribute of the input.
-     */
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    /**
-     * The html type attribute of the input.
-     */
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    /**
-     * The maximum value of the input.
-     */
-    readonly max: StringConstructor;
-    /**
-     * The minimum value of the input.
-     */
-    readonly min: StringConstructor;
-    /**
-     * If set to `true` the input is displayed with a red border.
-     */
-    readonly error: BooleanConstructor;
-    /**
-     * If set to `true` the input is disabled and no interaction is possible.
-     */
-    readonly disabled: BooleanConstructor;
-    /**
-     * If set to `true` the input is displayed smaller.
-     */
-    readonly small: BooleanConstructor;
-    /**
-     * If set to `true` the input's label is hidden.
-     */
-    readonly hideLabel: BooleanConstructor;
-    /**
-     * Adds the classes directly to the input (e.g. for shadow).
-     */
-    readonly inputClass: StringConstructor;
-    /**
-     * This is called when the input reveices focus.
-     */
-    readonly onFocus: PropType<() => void>;
-    /**
-     * This is called when the input looses focus.
-     */
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-};
-export type NInputExposed = {
-    /**
-     * Request focus on the input.
-     */
-    focus(): void;
-};
-/**
- * The base class of inputs. A styled input with a lot of configuration possibilities but no validation.
- */
-declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
-export { Component as NInput, Component as default };

package/components/NInput.js

@@ -1,110 +0,0 @@
-import { createVNode as _createVNode, vShow as _vShow, withDirectives as _withDirectives, mergeProps as _mergeProps } from "vue";
-import { createComponent } from '../utils/component';
-import { ref } from 'vue';
-import { ExclamationCircleIcon } from '@heroicons/vue/24/solid';
-import NTooltip, { mapTooltipProps, nToolTipPropsForImplementor } from './NTooltip';
-import './NInput.css';
-import { vModelProps } from '../utils/vModel';
-export const nInputProps = {
-  ...vModelProps(String),
-  /**
-   * The name of the input. Is displayed as a label above the input.
-   */
-  name: String,
-  /**
-   * The placeholder of the input.
-   */
-  placeholder: String,
-  /**
-   * The html autocomplete attribute of the input.
-   */
-  autocomplete: {
-    type: String,
-    default: 'off'
-  },
-  /**
-   * The html type attribute of the input.
-   */
-  type: {
-    type: String,
-    default: 'text'
-  },
-  /**
-   * The maximum value of the input.
-   */
-  max: String,
-  /**
-   * The minimum value of the input.
-   */
-  min: String,
-  /**
-   * If set to `true` the input is displayed with a red border.
-   */
-  error: Boolean,
-  /**
-   * If set to `true` the input is disabled and no interaction is possible.
-   */
-  disabled: Boolean,
-  /**
-   * If set to `true` the input is displayed smaller.
-   */
-  small: Boolean,
-  /**
-   * If set to `true` the input's label is hidden.
-   */
-  hideLabel: Boolean,
-  /**
-   * Adds the classes directly to the input (e.g. for shadow).
-   */
-  inputClass: String,
-  /**
-   * This is called when the input reveices focus.
-   */
-  onFocus: Function,
-  /**
-   * This is called when the input looses focus.
-   */
-  onBlur: Function,
-  ...nToolTipPropsForImplementor
-};
-/**
- * The base class of inputs. A styled input with a lot of configuration possibilities but no validation.
- */
-const Component = createComponent('NInput', nInputProps, (props, context) => {
-  const inputRef = ref();
-  const exposed = {
-    focus: () => inputRef.value?.focus()
-  };
-  context.expose(exposed);
-  return () => _createVNode("div", null, [props.name && !props.hideLabel && _createVNode("label", {
-    "for": props.name,
-    "class": ['block text-sm font-medium mb-1', props.disabled ? 'text-default-300' : 'text-default-700']
-  }, [props.name]), _createVNode(NTooltip, _mergeProps({
-    "block": true
-  }, mapTooltipProps(props)), {
-    default: () => [_createVNode("div", {
-      "class": "relative"
-    }, [_createVNode("input", {
-      "ref": inputRef,
-      "name": props.name,
-      "value": props.value,
-      "onInput": event => props.onUpdateValue?.(event.target.value),
-      "placeholder": props.placeholder,
-      "autocomplete": props.autocomplete,
-      "type": props.type,
-      "min": props.min,
-      "max": props.max,
-      "disabled": props.disabled,
-      "onFocus": () => props.onFocus?.(),
-      "onBlur": () => props.onBlur?.(),
-      "onInvalid": event => event.preventDefault(),
-      "class": ['block w-full rounded-md border focus:outline-none focus:ring-1 ', props.small ? 'text-xs py-0.5 px-2' : 'py-2 px-4', props.disabled ? 'text-default-500 placeholder-default-300 bg-default-50' : 'text-default-900 placeholder-default-400 ', props.error ? 'border-red-500 focus:border-red-500 focus:ring-red-500 pr-10' : 'border-default-300 focus:border-primary-500 focus:ring-primary-500', props.inputClass]
-    }, null), _withDirectives(_createVNode("div", {
-      "class": "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none"
-    }, [_createVNode(ExclamationCircleIcon, {
-      "class": "h-5 w-5 text-red-700",
-      "aria-hidden": "true"
-    }, null)]), [[_vShow, props.error && !props.small]])])]
-  })]);
-});
-export { Component as NInput, Component as default };

package/components/NInputPhone.d.ts

@@ -1,58 +0,0 @@
-export declare const nInputPhoneProps: {
-    readonly input: import("vue").PropType<(props: import("./NValInput").InputSlotProps) => JSX.Element>;
-    readonly disableValidation: BooleanConstructor;
-    readonly optional: BooleanConstructor;
-    readonly rules: {
-        readonly type: import("vue").PropType<import("../utils/validation").ValidationRule[] | import("../utils/validation").ValidationRule>;
-        readonly default: () => never[];
-    };
-    readonly form: import("vue").PropType<import("./ValidatedForm").ValidatedForm>;
-    readonly error: BooleanConstructor;
-    readonly errorMessage: StringConstructor;
-    readonly hideErrorMessage: BooleanConstructor;
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: import("vue").PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: import("vue").PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: import("vue").PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly tooltipDelay: {
-        readonly type: NumberConstructor;
-        readonly default: 0;
-    };
-    readonly name: StringConstructor;
-    readonly placeholder: StringConstructor;
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    readonly max: StringConstructor;
-    readonly min: StringConstructor;
-    readonly disabled: BooleanConstructor;
-    readonly small: BooleanConstructor;
-    readonly hideLabel: BooleanConstructor;
-    readonly inputClass: StringConstructor;
-    readonly onFocus: import("vue").PropType<() => void>;
-    readonly onBlur: import("vue").PropType<() => void>;
-    readonly value: import("vue").PropType<string>;
-    readonly onUpdateValue: import("vue").PropType<(newValue: string) => void>;
-};
-/**
- * The `NInputPhone` autoformats phone numbers and checks if they are valid.
- */
-declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
-export { Component as NInputPhone, Component as default };

package/components/NInputPhone.js

@@ -1,47 +0,0 @@
-import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
-import { createComponent } from '../utils/component';
-import { external } from '../utils/validation';
-import { computed, Suspense } from 'vue';
-import NValInput, { nValInputProps } from './NValInput';
-import { trsl } from '../i18n';
-export const nInputPhoneProps = nValInputProps;
-/**
- * The `NInputPhone` autoformats phone numbers and checks if they are valid.
- */
-const Component = createComponent('NInputPhoneSuspended', nInputPhoneProps, props => {
-  // Async components have to be wrapped in a suspense component.
-  return () => _createVNode(Suspense, null, {
-    default: () => [_createVNode(NPhoneInput, props, null)]
-  });
-});
-export { Component as NInputPhone, Component as default };
-const NPhoneInput = createComponent('NInputPhone', nInputPhoneProps, async props => {
-  // import dynamically for better codesplitting as the library is pretty large
-  const {
-    parsePhoneNumber
-  } = await import('awesome-phonenumber');
-  const DEFAULT_COUNTRY_CODE = 'CH';
-  const formattedToPlain = number => parsePhoneNumber(number, {
-    regionCode: DEFAULT_COUNTRY_CODE
-  }).number?.e164;
-  const plainToFormatted = number => parsePhoneNumber(number, {
-    regionCode: DEFAULT_COUNTRY_CODE
-  }).number?.international;
-  const onUpdateValue = newValue => {
-    const plain = formattedToPlain(newValue);
-    props.onUpdateValue?.(plain || newValue);
-  };
-  const value = computed(() => {
-    const formatted = plainToFormatted(props.value || '');
-    return formatted || props.value;
-  });
-  const isValid = computed(() => parsePhoneNumber(props.value || '').valid);
-  return () => _createVNode(NValInput, _mergeProps({
-    ...props,
-    onUpdateValue
-  }, {
-    "value": value.value,
-    "rules": external(isValid.value, trsl('vue-collection.validation.rules.phone')),
-    "type": "tel"
-  }), null);
-});

package/components/NInputSelect.d.ts

@@ -1,103 +0,0 @@
-import { type Identifiable } from '../utils/identifiable';
-import { type PropType } from 'vue';
-import type { AnyObject } from '../utils/utils';
-export declare const nInputSelectProps: {
-    /**
-     * The id of the currently selected option of this input.
-     */
-    readonly value: 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 onUpdateValue: PropType<(newValue: string) => void>;
-    /**
-     * The options which are allowed and suggested for this input.
-     * The options are filtered based on the user input.
-     */
-    readonly options: {
-        readonly type: PropType<InputSelectOption[]>;
-        readonly default: () => never[];
-    };
-    /**
-     * @see {@link nValInputProps.optional}
-     */
-    readonly optional: BooleanConstructor;
-    /**
-     * @see {@link nValInputProps.form}
-     */
-    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
-    /**
-     * @see {@link nValInputProps.error}
-     */
-    readonly error: BooleanConstructor;
-    /**
-     * @see {@link nValInputProps.errorMessage}
-     */
-    readonly errorMessage: StringConstructor;
-    /**
-     * If set to `true` the list is hidden even if there are still matching items in the list.
-     */
-    readonly hideList: BooleanConstructor;
-    /**
-     * @see {@link nSuggestionListProps.maxItems}
-     */
-    readonly maxItems: {
-        readonly type: NumberConstructor;
-        readonly default: () => number;
-    };
-    /**
-     * @see {@link nSuggestionListProps.listItem}
-     */
-    readonly listItem: PropType<(props: import("./NSuggestionList").ItemSlotProps) => JSX.Element>;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly tooltipDelay: {
-        readonly type: NumberConstructor;
-        readonly default: 0;
-    };
-    readonly name: StringConstructor;
-    readonly placeholder: StringConstructor;
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    readonly max: StringConstructor;
-    readonly min: StringConstructor;
-    readonly disabled: BooleanConstructor;
-    readonly small: BooleanConstructor;
-    readonly hideLabel: BooleanConstructor;
-    readonly inputClass: StringConstructor;
-    readonly onFocus: PropType<() => void>;
-    readonly onBlur: PropType<() => void>;
-};
-export type InputSelectOption = Identifiable & {
-    label: string;
-} & AnyObject;
-/**
- * The `NInputSelect` is very similar to the {@link NSelect}, but instead of a select input it is a regular input.
- * 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.
- */
-declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
-export { Component as NInputSelect, Component as default };

package/components/NInputSelect.js

@@ -1,115 +0,0 @@
-import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
-import { createComponentWithSlots } from '../utils/component';
-import { Id } from '../utils/identifiable';
-import { option } from '../utils/validation';
-import { vModelForRef } from '../utils/vModel';
-import { watchRef } from '../utils/vue';
-import { computed, ref, watch } from 'vue';
-import { nInputProps } from './NInput';
-import NSuggestionList, { nSuggestionListProps } from './NSuggestionList';
-import NValInput, { nValInputProps } from './NValInput';
-export const nInputSelectProps = {
-  ...nInputProps,
-  /**
-   * The id of the currently selected option of this input.
-   */
-  value: String,
-  /**
-   * 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`.
-   */
-  onUpdateValue: Function,
-  /**
-   * The options which are allowed and suggested for this input.
-   * The options are filtered based on the user input.
-   */
-  options: {
-    type: Array,
-    default: () => []
-  },
-  /**
-   * @see {@link nValInputProps.optional}
-   */
-  optional: nValInputProps.optional,
-  /**
-   * @see {@link nValInputProps.form}
-   */
-  form: nValInputProps.form,
-  /**
-   * @see {@link nValInputProps.error}
-   */
-  error: nValInputProps.error,
-  /**
-   * @see {@link nValInputProps.errorMessage}
-   */
-  errorMessage: nValInputProps.errorMessage,
-  /**
-   * If set to `true` the list is hidden even if there are still matching items in the list.
-   */
-  hideList: nSuggestionListProps.hideList,
-  /**
-   * @see {@link nSuggestionListProps.maxItems}
-   */
-  maxItems: nSuggestionListProps.maxItems,
-  /**
-   * @see {@link nSuggestionListProps.listItem}
-   */
-  listItem: nSuggestionListProps.listItem
-};
-/**
- * The `NInputSelect` is very similar to the {@link NSelect}, but instead of a select input it is a regular input.
- * 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.
- */
-const Component = createComponentWithSlots('NInputSelect', nInputSelectProps, ['listItem'], props => {
-  const inputRef = ref();
-  const inputValue = ref('');
-  watch(() => props.value, newValue => {
-    if (newValue) {
-      const chosenOption = Id.find(props.options, newValue);
-      if (chosenOption) inputValue.value = chosenOption.label;
-    }
-  }, {
-    immediate: true
-  });
-  const filteredOptions = computed(() => props.options.filter(option => option.label.includes(inputValue.value || '')));
-  const matchedOption = computed(() => {
-    const matches = props.options.filter(option => option.label === inputValue.value);
-    return matches.length > 0 ? matches[0] : null;
-  });
-  watchRef(matchedOption, newOption => props.onUpdateValue?.(newOption?.id || ''));
-  return () => _createVNode(NSuggestionList, {
-    "items": filteredOptions.value,
-    "onSelect": props.onUpdateValue,
-    "inputValue": inputValue.value,
-    "hideList": props.hideList || matchedOption.value != null || filteredOptions.value.length == 0,
-    "maxItems": props.maxItems,
-    "listItem": props.listItem,
-    "input": ({
-      onFocus,
-      onBlur
-    }) => _createVNode(NValInput, _mergeProps({
-      "ref": inputRef
-    }, {
-      ...props,
-      ...vModelForRef(inputValue)
-    }, {
-      "rules": option(props.options.map(opt => opt.label)),
-      "onFocus": () => {
-        onFocus();
-        props.onFocus?.();
-      },
-      "onBlur": onBlur,
-      "disableBlurValidation": true
-    }), null),
-    "onRequestInputFocus": () => inputRef.value?.focus(),
-    "onRealBlur": () => {
-      props.onBlur?.();
-      inputRef?.value?.validate();
-    }
-  }, null);
-});
-export { Component as NInputSelect, Component as default };

package/components/NInputSuggestion.d.ts

@@ -1,79 +0,0 @@
-import { type PropType } from 'vue';
-export declare const nInputSuggestionProps: {
-    /**
-     * If set to `true` the list is hidden even if there are still matching items in the list.
-     */
-    readonly hideList: BooleanConstructor;
-    /**
-     * @see {@link nSuggestionListProps.maxItems}
-     */
-    readonly maxItems: {
-        readonly type: NumberConstructor;
-        readonly default: () => number;
-    };
-    /**
-     * The suggestions which are shown to the user for this input.
-     * The suggestions are filtered based on the user input.
-     */
-    readonly suggestions: {
-        readonly type: PropType<string[]>;
-        readonly default: () => never[];
-    };
-    readonly input: PropType<(props: import("./NValInput").InputSlotProps) => JSX.Element>;
-    readonly disableValidation: BooleanConstructor;
-    readonly optional: BooleanConstructor;
-    readonly rules: {
-        readonly type: PropType<import("../utils/validation").ValidationRule[] | import("../utils/validation").ValidationRule>;
-        readonly default: () => never[];
-    };
-    readonly form: PropType<import("./ValidatedForm").ValidatedForm>;
-    readonly error: BooleanConstructor;
-    readonly errorMessage: StringConstructor;
-    readonly hideErrorMessage: BooleanConstructor;
-    readonly disableBlurValidation: BooleanConstructor;
-    readonly tooltipText: StringConstructor;
-    readonly tooltipContent: PropType<() => JSX.Element>;
-    readonly tooltipHide: BooleanConstructor;
-    readonly tooltipShow: BooleanConstructor;
-    readonly tooltipPlacement: {
-        readonly type: PropType<import("./NTooltip").TooltipPlacement>;
-        readonly default: "auto";
-    };
-    readonly tooltipMaxWidth: {
-        readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
-        readonly default: "max-w-xs";
-    };
-    readonly tooltipWrapperClass: StringConstructor;
-    readonly tooltipContentClass: StringConstructor;
-    readonly tooltipArrowClass: StringConstructor;
-    readonly tooltipDelay: {
-        readonly type: NumberConstructor;
-        readonly default: 0;
-    };
-    readonly name: StringConstructor;
-    readonly placeholder: StringConstructor;
-    readonly autocomplete: {
-        readonly type: StringConstructor;
-        readonly default: "off";
-    };
-    readonly type: {
-        readonly type: StringConstructor;
-        readonly default: "text";
-    };
-    readonly max: StringConstructor;
-    readonly min: StringConstructor;
-    readonly disabled: BooleanConstructor;
-    readonly small: BooleanConstructor;
-    readonly hideLabel: BooleanConstructor;
-    readonly inputClass: StringConstructor;
-    readonly onFocus: PropType<() => void>;
-    readonly onBlur: PropType<() => void>;
-    readonly value: PropType<string>;
-    readonly onUpdateValue: PropType<(newValue: string) => void>;
-};
-/**
- * `NInputSuggestion` is an input, which shows a list of possible suggestions to the user
- *  which is filtered while typing. Contrary to {@link NInputSelect} the user is not required to choose any of the suggestions.
- */
-declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
-export { Component as NInputSuggestion, Component as default };